@charset "utf-8";
@import url(base.css);



#main{
}

	#contenttitle{
		max-width:340px;
		width:90%;
		background-image:url(../clinic/images/ico_content.png);
	}
	
		#main header ul{
			width:510px;
			margin:0 auto;
			position:relative;
			left:10px;
		}

	@media screen and (max-width:1000px){
	
		#main header ul{
			left:-10px;
		}

	}

	@media screen and (max-width:640px){
	
		#main header ul{
			display:none;
		}

	}

		#main header li{
			list-style:none;
			float:left;
		}
		#main header li a:after{
			content:"|";
			color:#ccc;
			position:relative;
			left:20px;
			top:-1px;
		}
		#main header li:nth-of-type(1) a:before{
			content:"|";
			color:#ccc;
			position:relative;
			left:-28px;
			top:-1px;
		}

	@media screen and (max-width:1000px){
		
		#main header li:nth-of-type(1),
		#main header li:nth-of-type(2),
		#main header li:nth-of-type(3),
		#main header li:nth-of-type(4){
			position:relative;
			left:20px;
		}
		
		#main header li:nth-of-type(5) a:before{
			content:"|";
			color:#ccc;
			position:relative;
			left:-28px;
			top:-1px;
		}

	}
		
			#main header li a{
				display:block;
				padding:3px 20px;
				color:#036;
				font-family: "kozuka-mincho-pro";
				text-decoration:none;
				position:relative;
			}


/* stdsec */

	.stdsec{padding:100px 0 30px;}

@media screen and (max-width:640px){

	.stdsec{padding-bottom:0;}

}
		
	.stdsec{zoom:1;}
	.stdsec:after{
	  content: ""; 
	  display: block; 
	  clear: both;
	}

	.stdsec .inner{
		margin-bottom:-80px;
		position:relative;
		top:-80px;
	}



		.stdsec h3{
			margin:40px 0 35px;
			color:#036;
			font-family: "kozuka-mincho-pro";
			font-size:1.6em;
			font-weight:700;
			text-align:center;
			letter-spacing:0.1em;
		}

	@media screen and (max-width:640px){
	
		.stdsec h3{
			margin:30px 0 15px;
			font-size:1.3em;
		}
	
		#hours h3{
			margin:10px 0 15px;
		}
	
	}

	@media screen and (max-width:420px){
	
		#hours h3{
			margin:0 0 15px;
		}
	
	}

		.stdsec table{
			max-width:1020px;
			width:calc(90% + 20px);
			margin:0 auto;
			border-spacing:10px;
		}

			.stdsec th{
				padding:15px 10px;
				color:#036;
				text-align: center;
				line-height:1.2em;
				background-color:#f0f7ff;
				white-space: nowrap;
			}

			.stdsec td{
				
				padding:10px 15px;
				background-color:#f2f2f2;
			}

		@media screen and (max-width:640px){

			#hours.stdsec th,
			#doctor.stdsec th{
				display: block;
				width:100%;
				padding:10px 0;
				color:#036;
				vertical-align:middle;
			}
			#hours.stdsec th br,
			#doctor.stdsec th br{display:none;}

			#hours.stdsec td,
			#doctor.stdsec td{
				display: block;
				width: calc(100% - 30px);
				padding:10px 15px;
				background-color:#fff;
			}

		}

		.stdsec ul{
			max-width:1000px;
			width:90%;
			margin-left:20px;
		}

		.stdsec li{
			margin-bottom:8px;
			list-style:none;
			line-height:1.7em;			
		}

		.stdsec li:before{
			content:"●";
			color:#b3d6ff;
			margin-right:-15px;
			position:relative;
			left:-20px;
			
		}





/* 診療科目 */


	#dep.stdsec{padding:100px 0 0;}

	#dep.stdsec .inner{
		margin-bottom:-100px;
		position:relative;
		top:-80px;
	}

		#dep .ulwrapper{
			max-width:1000px;
			width:90%;
			margin:0 auto 100px;
			padding:30px 0 40px;
			border-top:1px solid #ccc;
		}

	@media screen and (max-width:830px){

		#dep .ulwrapper{
			margin-bottom:-80px;
			padding:30px 0 0;
		}

	}

	@media screen and (max-width:480px){

		#dep .ulwrapper{
			padding:20px 0 ;
		}

	}
	
	
			#dep ul{
				width:95%;
				margin-left:5%;
			}
	
				#dep li{
					margin-right:40px;
					float:left;
				}
				#dep li:nth-last-type-of(1){margin-right:0;}

		@media screen and (max-width:480px){
	
			#dep ul{
				width:90%;
				margin-left:10%;
			}

				#dep li{
					margin-right:0;
					float:none;
				}

		}





/* 医師紹介 */


			#doctor th{
				width:100px;
			}

		@media screen and (max-width:640px){

			#doctor th{
				width:70px;
			}

		}

		@media screen and (max-width:420px){

			#doctor th{
				width:40px;
			}

		}

			#doctor li{
				margin-right:40px;
				float:left;
			}
			#doctor li:nth-last-type-of(1){margin-right:0;}

		@media screen and (max-width:480px){

			#doctor li{
				margin-right:0;
				float:none;
			}

		}


/* 担当医表 */

	#ctable{
		padding-bottom:70px;
	}

@media screen and (max-width:640px){

	#ctable{
		padding-bottom:50px;
	}

}

@media screen and (max-width:500px){

	#ctable{
		font-size:0.9em;
	}

}

		#ctable th{
			width:calc(100% / 7);
			padding:15px 0;
			line-height:1.2em;
		}
	
		#ctable tr:nth-of-type(1) th{
			color:#fff;
			background-color:#6698cc;
		}
	
		#ctable tr:nth-of-type(1) th:nth-of-type(1){
			background-color:transparent;
		}

	@media screen and (max-width:640px){

		#ctable table{
			max-width:1010px;
			width:calc(90% + 10px);
			border-spacing:5px;
		}
	
		#ctable tr:nth-last-of-type(1) th{
			padding:7px 0 8px;
		}
	
	}

	@media screen and (max-width:420px){

		#ctable table{
			max-width:1004px;
			width:calc(90% + 4px);
			border-spacing:2px;
		}
	
	}

		#ctable td{	
			width:auto;
			padding:0;
			line-height:1.2em;
			text-align:center;
		}

	@media screen and (max-width:640px){

		#ctable tr:nth-last-of-type(1) th{	
			padding: 20px 0;
		}

	}



		#ctable td span{
			font-size:0.7em;
		}	

	@media screen and (max-width:840px){

		#ctable td span{
			display:block;
			margin-top:1px;
		}	
		#ctable td span + br{display: none;}

	}

	@media screen and (max-width:540px){

		#ctable td span{
			font-size:0.6em;
		}	

	}

	@media screen and (max-width:480px){

		#ctable td span{
			font-size:0.8em;
			line-height:1.2em;
		}	

	}

	@media screen and (max-width:370px){

		#ctable td span{
			font-size:0.7em;
		}	

	}

		#ctable td p{
			margin:0 0 3px;
			background-color: #f8f8f8;
		}
			


	
/* 初めて */

	#firsttime{
		padding:120px 5% 0 7%;
		background-color:#fff1f0;
	}

@media screen and (max-width:1000px){

	#firsttime{
		padding:50px 5% 0;
		background-color:#fff1f0;
	}

}

	#firsttime .inner{
		max-width:1000px;
		width:90%;
		margin:0 auto -120px;
		position:relative;
		top:-100px;
	}

@media screen and (max-width:1000px){

	#firsttime .inner{
		position:relative;
		top:-50px;
	}

}


		
		#firsttime h3{
			color:#600;
		}

		#firsttime img{
			max-width:240px;
			width:20%;
			float:left;
		}

	@media screen and (max-width:640px){

		#firsttime img{
			display:block;
			max-width:160px;
			width:40%;
			margin:0 auto 20px;
			float:none;
		}

	}

		#firsttime .innerright{
			width:77%;
			float:right;			
		}

	@media screen and (max-width:640px){

		#firsttime .innerright{
			width:100%;
			float:none;			
		}

	}
	
			#firsttime ul{
				margin-left:35px;
			}

			#firsttime h4{
				margin:30px 0 15px;
				padding:5px 15px;
				color:#c33;
				font-size:1.2em;
				font-weight:700;
				background-color:#fff;
				line-height:1.5em;
			}

	@media screen and (max-width:480px){

			#firsttime h4{
				margin:20px 0 15px;
				padding:5px 10px;
				font-size:1.0em;
			}

	}


	#contact{
		border-top:none;
	}




/* バス運行表 */

	#bus{
		padding-bottom:70px;
		border-bottom:1px solid #ccc;
	}

@media screen and (max-width:770px){

	#bus{
		font-size:0.9em;
	}

}

@media screen and (max-width:640px){

	#bus{
		padding-bottom:50px;
	}

}

@media screen and (max-width:500px){

	#bus{
		font-size:0.9em;
	}

}

@media screen and (max-width:640px){

	#bus.stdsec .inner{
		margin-bottom:0;
		top:0;
	}

}

		#bus table{
			border-spacing:0;
			border-collapse:collapse;
		}

	@media screen and (max-width:640px){

		#bus table{
			max-width:1010px;
			width:calc(90% + 10px);
		}
	
	}

	@media screen and (max-width:420px){

		#bus table{
			max-width:1004px;
			width:calc(90% + 4px);
		}
	
	}

		#bus th,#bus td{border:1px solid #ccc;}


		#bus tr:nth-of-type(1) th{
			padding:15px 0;
			line-height:1.2em;
		}

		#bus tr:nth-of-type(2) th{
			width:8%;
		}

	@media screen and (max-width:640px){

		#bus tr:nth-of-type(1) th{
			width:calc((100% - 50px) / 5) !important;
		}

		#bus tr th:nth-of-type(1){width:50px;}
	
	}

	@media screen and (max-width:420px){

		#bus tr:nth-of-type(1) th{
			width:calc((100% - 25px) / 5) !important;
		}

		#bus tr th:nth-of-type(1){width:25px;}
	
	}

		
		#bus tr:nth-of-type(1) th:nth-of-type(1){
			background-color:transparent;
		}
		
		#bus tr:nth-of-type(2) th:nth-of-type(1),
		#bus tr:nth-of-type(3) th:nth-of-type(1){
			padding:10px 0;
			vertical-align:middle;
		}

		#bus td{	
			padding:0 !important;
			line-height:1.2em;
			text-align:center;
		}

		#bus tr:nth-of-type(2) td{	
			width:11%;
		}
/*		#bus tr:nth-of-type(2) td:nth-of-type(1){width:9%;}
		#bus tr:nth-of-type(2) td:nth-of-type(2){width:9%;}
		#bus tr:nth-of-type(2) td:nth-of-type(3){width:9%;}
		#bus tr:nth-of-type(2) td:nth-of-type(4){width:9%;}
		#bus tr:nth-of-type(2) td:nth-of-type(5){width:9%;}
		#bus tr:nth-of-type(2) td:nth-of-type(6){width:9%;}*/
		#bus tr:nth-of-type(2) td:nth-of-type(7){width:15%;}
/*		#bus tr:nth-of-type(2) td:nth-of-type(8){width:9%;}*/


	@media screen and (max-width:800px){
		#bus td:nth-of-type(1),
		#bus td:nth-of-type(2),
		#bus td:nth-of-type(3),
		#bus td:nth-of-type(4),
		#bus td:nth-of-type(5),
		#bus td:nth-of-type(6),
		#bus td:nth-of-type(7),
		#bus td:nth-of-type(8){width:auto;}
	}
		
		#bus tr:nth-of-type(2) th,
		#bus tr:nth-of-type(2) td{
			background-color:transparent;
		}