@charset "utf-8";
/*
 * CSS pageParts.css depoc.yoshi
 */


/*
 * index
 */
#index #mainv { background: none; padding-top: 0px; }
#index #mainv .incnt { width: 960px; background: none; height: auto; margin: 0px auto; }
@media screen and (max-width: 959px) {
	#index #mainv .incnt { width: 100%; height: auto; margin: 0; }
}
#index #sec_1 { }
#index #sec_1 dl { margin-top: -10px; height: 250px; overflow-y: scroll; }
#index #sec_1 dl dt { width: 120px; float: left; padding-top: 10px; }
#index #sec_1 dl dt:before { content:"●" ; padding-right: 5px; }
#index #sec_1 dl dd { padding: 10px 0 10px 120px; margin-bottom: 10px; border-bottom: 1px dotted #ccc; }
@media screen and (max-width: 959px) {
}
@media screen and (max-width: 640px) {
	#index #sec_1 dl { margin-top: 0px; max-height: 200px; overflow-y: scroll; height: auto; }
	#index #sec_1 dl dt { width: 100%; float: none; padding-bottom: 0; padding-top: 0; }
	#index #sec_1 dl dd { padding-left: 0; padding-top: 0; }
}
#index #sec_2 { }
#index #sec_2 ul { margin-left: -30px; }
#index #sec_2 ul li { float: left; margin-left: 30px; width: 280px; padding-bottom: 30px; }
#index #sec_2 ul li .sub { margin-top: 10px; }
#index #sec_2 ul li .txt { margin-top: 10px; }
#index #sec_2 ul li .sub img { height: 18px; }
@media screen and (max-width: 959px) {
	#index #sec_2 ul { margin-left: 0; width: 100%; }
	#index #sec_2 ul li { margin: 0 2%; width: 46%; padding-bottom: 20px; }
	#index #sec_2 ul li .txt { margin-top: 5px; }
}
@media screen and (max-width: 640px) {
	#index #sec_2 .incnt { width: 92%; margin: 0 4%; }
	#index #sec_2 ul { margin-left: 0px; }
	#index #sec_2 ul li { float: none; margin-left: 0px; width: 100%; padding-bottom: 20px; }
	#index #sec_2 ul li .txt { margin-top: 5px; }
}

#index #sec_3 { }
#index #sec_3 .txt1 { margin-bottom: 10px; }
#index #sec_3 table { margin-top: 5px; margin-bottom: 20px; }
#index #sec_3 table th, #index #sec_3 table td { border: 1px solid #ccc; text-align: center; padding: 10px 5px; min-width: 35px; }
#index #sec_3 table thead th { background: #195aa0; color: #fff; }
#index #sec_3 table tbody tr.bb th, #index #sec_3 table tbody tr.bb td { background: #f2f6fa; }
#index #sec_3 .txtRed { color: #d32a3b; font-size: 1.2em; }
#index #sec_3 .txtOrange { color: #f39934;  font-size: 1.2em;}
#index #sec_3 .txtBlue { color: #19b7e0;  font-size: 1.2em;}
#index #sec_3 .txtGreen { color: #78c28d; font-size: 1.2em; }
#index #sec_3 table .bl { border-left: none;}
#index #sec_3 table .br { border-right: none;}
@media screen and (max-width: 640px) {
	#index #sec_3 table th, #index #sec_3 table td { padding: 10px 0px; min-width: none;  }
	#index #sec_3 table tbody th { padding: 7px 5px; min-width: none; line-height: 1; }
	#index #sec_3 .txtRed { color: #d32a3b; font-size: 1em; }
	#index #sec_3 .txtOrange { color: #f39934;  font-size: 1em;}
	#index #sec_3 .txtBlue { color: #19b7e0;  font-size: 1em;}
	#index #sec_3 .txtGreen { color: #78c28d; font-size: 1em; }
}

@media screen and (min-width: 960px) {
	#index .inbox_h_banner { display: none; }
}
@media screen and (max-width: 640px) {
	#index .inbox_h_banner { display: none; }
}

@media screen and (min-width: 641px) {
	#index .inbox_h_banner_sp { display: none; }
}






/*
 * guide
 */
#guide #sec_1 .txt1 { font-size: 1.2em; font-weight: bold; color: #004896; }
#guide #sec_2 { }
#guide #sec_2 ul { }
#guide #sec_2 ul li { padding-bottom: 40px;  }
#guide #sec_2 ul li .photo { width: 200px; float: right; padding: 0 0 20px 20px; }
#guide #sec_2 ul li .sub { margin-bottom: 10px; font-size: 1.2em; font-weight: bold; color: #004896; width: 100% }
#guide #sec_2 ul li .txt { margin-top: 10px; }
#guide #sec_2 ul li .sub img { height: 18px; }
#guide #sec_2 ul li .tel { width: 215px; padding: 10px 0; }
#guide #sec_3 ul li { padding-bottom: 40px;  }
#guide #sec_3 ul li .sub { margin-bottom: 5px; font-size: 1.2em; font-weight: bold; color: #004896; width: 100% }
#guide #sec_3 .inbox { background: #f2f6fa; padding: 20px; margin-top: 15px; }
#guide #sec_3 .inbox .title { font-size: 1.1em; font-weight: bold; color: #004896; }
#guide #sec_3 .inbox ul li { text-indent: -1em; padding-left: 1em; padding-bottom: 0; }
#guide #sec_3 .inbox ul li:before { content:"・"; }
@media screen and (max-width: 959px) {
	#guide #sec_2 ul li .photo { width: 250px; max-width: 40%; }
}
@media screen and (max-width: 640px) {
	#guide #sec_2 ul li .photo { width: 50%; max-width: none; }
	#guide #sec_2 ul li .tel { width: 43%; }
	#guide #sec_3 .inbox { padding: 10px 5%; }
}
@media screen and (max-width: 420px) {
	#guide #sec_2 ul li .photo { width: 100%; float: none; padding: 0 0 10px 0px; }
}
@media screen and (max-width: 360px) {
	#guide #sec_2 ul li .tel { width: 80%; }
}






/*
 * greeting
 */
#greeting #sec_1 .photo { float: right; padding-left: 20px; padding-bottom: 20px; width: 180px; }
#greeting #sec_2 .inbox { background: #f2f6fa; padding: 20px 20px 0; margin-top: 15px; }
#greeting #sec_2 .inbox dt { font-size: 1.2em; font-weight: bold; color: #004896; border-bottom: 1px dotted #004896; padding-bottom: 5px; margin-bottom: 10px; }
#greeting #sec_2 .inbox dt:before { content: url(../img/greeting/icon_1.png); width: 20px; padding-right: 10px; }
#greeting #sec_3 dl { border-top: 1px dotted #ccc; }
#greeting #sec_3 dt { width: 110px; background: #f2f6fa; float: left; padding: 15px 20px; }
#greeting #sec_3 dd { padding: 15px 0px; padding-left: 170px; border-bottom: 1px dotted #ccc; }
#greeting #sec_2 .inbox dd { padding-bottom: 20px; }
#greeting #sec_4 ul li { text-indent: -1em; padding-left: 1em; }
#greeting #sec_4 ul li:before { content: "●"; margin-right: 5px; color: #004896; }
@media screen and (max-width: 959px) {
	#greeting #sec_1 .photo { width: 30%; padding-left: 30px; }
}

@media screen and (max-width: 640px) {
	#greeting #sec_1 .photo { float: none; width: 60%; margin: 0 20%; padding-left: 0; }
	#greeting #sec_3 dt { width: 100%; background: none; float: none; padding: 15px 0px 0; margin-bottom: 0; }
	#greeting #sec_3 dd { padding: 0px 0px 15px; padding-left: 0px; border-bottom: 1px dotted #ccc; }
}





/*
 * clinic
 */
#clinic #sec_1 { }
#clinic #sec_1 .inbox, #clinic #sec_2 .inbox {  padding-bottom: 40px; }
#clinic #sec_1 .inbox .title, #clinic #sec_2 .inbox .title { font-size: 1.2em; font-weight: bold; color: #004896; padding-bottom: 0px; }
#clinic #sec_1 .inbox .txt1 { font-size: 13px; }
#clinic #sec_1 .inbox ul, #clinic #sec_2 .inbox ul { margin-left: -30px; }
#clinic #sec_1 .inbox ul li, #clinic #sec_2 .inbox ul li { float: left; margin-left: 30px; width: 280px; }
#clinic #sec_1 .inbox ul li img, #clinic #sec_2 .inbox ul li img { padding-top: 10px; }
#clinic #sec_2 .inbox .photo { width: 280px; float: right; padding-left: 20px; padding-bottom: 0px; }
#clinic #sec_2 .inbox { padding-bottom: 30px; margin-bottom: 30px; border-bottom: 1px dotted #ccc; }
#clinic #sec_3 .inbox { background: #f2f6fa; padding: 20px; margin-top: 15px; }
#clinic #sec_3 .inbox .title { font-size: 1.1em; font-weight: bold; color: #004896; }
@media screen and (max-width: 959px) {
	#clinic #sec_1 .inbox ul, #clinic #sec_2 .inbox ul { margin-left: -2%; }
	#clinic #sec_1 .inbox ul li, #clinic #sec_2 .inbox ul li { float: left; margin-left: 2%; width: 48%; }
	#clinic #sec_2 .inbox ul .photo { width: 100%; float: right; padding-left: 20px; padding-bottom: 10px; }
}
@media screen and (max-width: 640px) {
	#clinic #sec_1 .inbox, #clinic #sec_2 .inbox {  padding-bottom: 30px; }
	#clinic #sec_1 .inbox ul, #clinic #sec_2 .inbox ul { margin-left: 0%; }
	#clinic #sec_1 .inbox ul li, #clinic #sec_2 .inbox ul li { float: none; margin-left: 0%; width: 100%; }
	#clinic #sec_2 .inbox .photo { width: 100%; float: none; padding-left: 0px; padding-top: 10px; }
	#clinic #sec_1 .inbox ul li.eq0 { margin-bottom: 30px; }
}





/*
 * access
 */
#access #sec_1 table { margin-bottom: 10px; }
#access #sec_1 table th, #access table td { border: 1px solid #aaa; text-align: center; padding: 10px 8px; font-size: 13px; }
#access #sec_1 table tbody th, #access table tbody td { padding: 20px 8px; }
#access #sec_1 table .txtBig { font-size: 16px; }
#access #sec_1 table thead th { background: #e5edf4; }
#access #sec_1 table .bl { border-left: none; }
#access #sec_1 table .br { border-right: none; }
#access #sec_1 table tbody th { line-height: 1em; width: 110px; }
#access #sec_1 table tbody td:last-of-type { width: 100px; padding: 20px 0; }
#access #sec_2 .stitle { font-size: 1.2em; font-weight: bold; color: #004896; margin-bottom: 0px; }
#access #sec_2 .stitle:before { content: url(../img/greeting/icon_1.png); width: 20px; padding-right: 10px; }
#access #sec_2 .txt1 { padding-bottom: 20px; }
#access #map2 { height: 350px; background: #ccc; margin-bottom: 10px; width: 100%; }
#access #map2 img { max-width: none; }
#access #sec_2 .photo { width: 290px; float: right; padding-left: 20px; padding-bottom: 30px; }
@media screen and (max-width: 959px) {
	#access table tbody th { width: 20%; }
	#access table tbody td:last-of-type { width: 20%; }
	#access #aside { display: none; }
}
@media screen and (max-width: 640px) {
	#access #sec_1 table th, #access #sec_1 table td { padding: 10px 5px; font-size: 11px; width: auto; }
	#access #sec_1 table tbody th { width: auto; padding: 10px 3px; }
	#access #sec_1 table tbody td:last-of-type { width: auto; padding: 10px 3px; }
	#access #sec_1 table .txtBig { font-size: 11px; }
	#access #sec_2 .photo { width: 100%; float: none; padding-left: 0px; padding-bottom: 30px; padding-top: 10px; }
}
@media screen and (max-width: 480px) {
	#access table th, #access table td { padding: 10px 3px; font-size: 11px; }
}
