@charset "utf-8";
/* フォント */
#patient{ font-family: 'M PLUS Rounded 1c', sans-serif; font-weight: 400;}

/* ヘッダー */
.top-img_container { min-width: 1200px;width: 100%; height: 768px; background: url("../../patient/img/top_img.jpg") no-repeat top center;}
.shiro_back { width: 100%; background-color: #fff; position: sticky; top: 0; z-index: 1; margin: 50px auto 45px auto; }
.top-menu_container { width: 1200px; height: 70px; padding: 0 20px; margin: 20px auto; display: flex; align-items: center;}
.logo {}
.label-kanja { font-family: 'Noto Sans JP', sans-serif; width: 145px; height: 30px; line-height: 30px; font-size: 14px; text-align: center; color: #fff; background: #20b5af; border-radius: 15px; margin: 0 0 0 15px;}
.main_menu { margin: 0 0 0 auto;}
.main_menu ul { display: flex; gap: 30px; text-align: center;}
.main_menu li a { position: relative; display: inline-block; margin-bottom: 1em; text-decoration: none; color: #000; transform:rotateZ(0.03deg); font-weight: 500; }
.main_menu li a:before { content: ''; position: absolute; left: 50%; bottom: 24px;/*線の上下位置*/ display: inline-block; width: 20px;/*線の長さ*/ height: 1px;/*線の太さ*/ -webkit-transform: translateX(-50%); transform: translateX(-50%);/*位置調整*/ background-color: #001A8C;/*線の色*/ transition: width 0.3s }
.main_menu li a:hover:before { width: 100%;}
.main_menu li span { display: inline-block; font-size: 12px; color: #20b5af; margin: 12px 0 0 0; font-family: 'Albert Sans', sans-serif; font-weight: 500; font-style: italic; }

/* Message */
.minasaama { /*display: none;*/ display: block; width: 100%; font-size: 15px; text-align: center; margin-top: 0px; color: #000; font-weight: 600; transform:rotateZ(0.03deg);}
.mess_area {}
.mess_box { display: flex; justify-content: space-between; flex-wrap: wrap; max-width: 1100px; width: 100%; margin: 0 auto; margin-top: -20px; overflow: hidden;}
.mess_txt { max-width: 595px; width: 100%; transform:rotateZ(0.03deg);}
/*.mess_txt li:nth-child(1) { width: 100%; text-align: right; font-weight: 500;}*/
.mess_txt li:nth-child(1) { text-align: left; font-weight: 400; margin-top: 50px;}
.mess_txt li:nth-child(2) { text-align: left; font-weight: 500; margin-top: 50px; color: #000; line-height: 1.75em;}

.mess_photo { max-width: 450px; height: 500px;}
.mess_photo img { width: 100%; height: auto; }

/* about us　口腔顎顔面外科とは */
.about_area { max-width: 1600px; min-width: 1200px; width: 100%; height: 370px; margin: 30px auto 0 auto; background: url("../img/aboutus_bg.png") no-repeat top center; overflow: hidden; border-bottom: solid 1px #eeeeee; transform:rotateZ(0.03deg);}
.about_box { max-width: 1000px; width: 100%; margin: 0 auto;}
.about_img_m_left { display: none;}
.about_contens {width: 470px; margin: 30px 0 0 auto;}
.about_contens li:nth-child(1) { width: 100%; height: 22px; background: url("../img/aboutus_title.png") no-repeat left center;}
.about_contens li:nth-child(2) { font-size: 28px; line-height: 1.4em; margin: 22px 0; color: #5e5e5e; font-weight: 500;}
.about_contens li:nth-child(3) { /*letter-spacing: 1px;*/ font-weight: 400; }
.about_contens li:nth-child(4) { font-weight: 500;}
.about_contens li:nth-child(4) a { display: block; width: 245px; height: 40px; border: solid 1px #001a8c; font-size: 14px; font-weight: bold; color: #001a8c; text-decoration: none; text-align: center; padding-top: 8px; background-image: url("../../img/arrow.png"); background-repeat: no-repeat; background-position: center right 6px; background-size: 33px 33px; background-color: #fff; margin-top: 35px;}
.about_contens li:nth-child(4) a:hover { background-color: #eee;}
/* 受診案内・施設案内 */
.about_area2 { max-width: 1600px; min-width: 1200px; width: 100%; height: 410px; margin: 80px auto 0 auto; background: url("../img/about_treatment_gb.png") no-repeat top center; overflow: hidden; border-bottom: solid 1px #eeeeee; transform:rotateZ(0.03deg);}
.about_contens2 {width: 470px; margin: 30px 0 0 0;}
.about_contens2 li:nth-child(1) { width: 100%; height: 22px; background: url("../img/about_treatment_title.png") no-repeat left center;}
.about_contens2 li:nth-child(2) { font-size: 28px; line-height: 1.4em; margin: 22px 0; font-weight: 500;}
.about_contens2 li:nth-child(3) { /*letter-spacing: 1px;*/ font-weight: 400;}
.about_contens2 li:nth-child(4) { font-weight: 500;}
.about_contens2 li:nth-child(4) a { display: block; width: 245px; height: 40px; border: solid 1px #001a8c; font-size: 14px; font-weight: bold; color: #001a8c; text-decoration: none; text-align: center; padding-top: 8px; background-image: url("../../img/arrow.png"); background-repeat: no-repeat; background-position: center right 6px; background-size: 33px 33px; background-color: #fff; margin-top: 35px; margin-left: auto;}
.about_contens2 li:nth-child(4) a:hover { background-color: #eee;}
/* アクセス・お問い合わせ */
.about_area3 { max-width: 1600px; min-width: 1200px; width: 100%; height: 400px; margin: 80px auto 0 auto; background: url("../img/access_bg.png") no-repeat top center; overflow: hidden; transform:rotateZ(0.03deg);}
.about_contens3 {width: 470px; margin: 30px 0 0 auto;}
.about_contens3 li:nth-child(1) { width: 100%; height: 22px; background: url("../img/access_title.png") no-repeat left center;}
.about_contens3 li:nth-child(2) { font-size: 28px; line-height: 1.4em; margin: 22px 0; font-weight: 500;}
.about_contens3 li:nth-child(3) { /*letter-spacing: 1px; */font-weight: 400;}
.about_contens3 li:nth-child(4) { font-weight: 500;}
.about_contens3 li:nth-child(4) a { display: block; width: 245px; height: 40px; border: solid 1px #001a8c; font-size: 14px; font-weight: bold; color: #001a8c; text-decoration: none; text-align: center; padding-top: 8px; background-image: url("../../img/arrow.png"); background-repeat: no-repeat; background-position: center right 6px; background-size: 33px 33px; background-color: #fff; margin-top: 35px;}
.about_contens3 li:nth-child(4) a:hover { background-color: #eee;}



/* ニュース */
.news_area { }
.news_title_area { width: 100%; height: 281px; background: url("../img/news_bg.png") no-repeat top center; display: inline-block; text-align: center; overflow: hidden; margin-top: 50px; padding: 70px 0 35px 0;}
.oshirase_space { padding-bottom: 10px; color: #000; font-weight: 600; transform:rotateZ(0.03deg);}
.news_box { display: flex; flex-wrap: wrap; max-width: 700px; width: 100%; margin: 50px auto 80px; transform:rotateZ(0.03deg); font-weight: 400;}
.news_box dt:nth-child(odd)  { width: 100px; font-size: 12px; border-bottom: solid 1px #a5a5a5; padding: 15px 0;}
.news_box dd:nth-child(even) { width: 600px; font-size: 14px; border-bottom: solid 1px #a5a5a5; padding: 15px 0; font-weight: bold; color: #001a8c;}
.news_box dd:nth-child(even) a { text-decoration: none; color: #001a8c;}
.news_box dd:nth-child(even) a:hover { text-decoration: underline;}





@media screen and (max-width: 520px) {
	/* ヘッダー */
	.top-img_container { min-width: 0; width: 100%; height: 350px; background: url("../img/top_img_m.jpg") no-repeat top left;}
	.shiro_back { margin: 0; }
	.top-menu_container {width: 100%; height: 50px; padding: 0; margin: 0; aspect-ratio: 32 / 5; }
	.logo { width: auto; height: 50px; padding: 0;}
	.logo img { width: auto; height: 50px; padding: 6px 8px 6px 8px; }
	.label-kanja { width: fit-content; height: fit-content; line-height: 20px; font-size: 9px; margin: 0; padding: 0 10px;}
	nav {display: none;}
	/* 順番 */
	.top-img_container { order: 2;}
	.top-menu_container { order: 1; }
	.main_contents { order: 3; }
	footer { order: 4; }
	
	/* Message */
	.minasaama { display: block; width: 100%; font-size: 16px; text-align: center; margin-top: 10px; }
	.mess_area { padding: 0 5%;}
	.mess_box { justify-content: center;}
	.mess_txt {  order: 2; }
	.mess_txt li:nth-child(1) { margin-top: 0; margin-bottom: 10px; font-size: 16px;}
	.mess_photo { order: 1; margin: 0 auto;}
	.mess_txt li:nth-child(2) { display: block; max-width: 700px; width: 100%; font-size: 16px; margin: 0 auto 0; line-height: 1.8em; }
	.mess_txt li:nth-child(3) { display: block; max-width: 700px; width: 100%; margin-top: 20px; font-size: 16px;}
	
	.mess_photo{ height: auto;}
	.mess_photo img { width: 100%; height: auto; padding: 5%; }

	/* about us　口腔顎顔面外科とは */
	.about_area { max-width: none; min-width: 0; width: 100%; height: auto; margin: 30px auto 0 auto; background: none;}
	.about_box { max-width: 1000px; width: 100%; margin: 0 auto;}
	.about_img_m_left { display: block; width: 100%; aspect-ratio: 2/1;}
	.about_img_m_left img {width: 100%; height: auto;}
	.about_contens { width: 100%; margin: 30px 0 30px auto; padding: 3%;}
	.about_contens li:nth-child(2) { font-size: 20px; letter-spacing: 0.05em;}
	.about_contens li:nth-child(3) { font-size: 16px;}
	.about_contens li:nth-child(4) a { margin: 35px auto 0;}
	/* 受診案内・施設案内 */
	.about_area2 { max-width: none; min-width: 0; width: 100%; height: auto; margin: 30px auto 0 auto; background: none;}
	.about_contens2 { width: 100%; margin: 30px 0 30px auto; padding: 3%;}
	.about_contens2 li:nth-child(2) { font-size: 20px; letter-spacing: 0.05em;}
	.about_contens2 li:nth-child(3) { font-size: 16px;}
	.about_contens2 li:nth-child(4) a { margin: 35px auto 0;}
	/* アクセス・お問い合わせ */
	.about_area3 { max-width: none; min-width: 0; width: 100%; height: auto; margin: 30px auto 0 auto; background: none;}
	.about_contens3 { width: 100%; margin: 30px 0 0 auto; padding: 3%;}
	.about_contens3 li:nth-child(2) { font-size: 20px; letter-spacing: 0.05em;}
	.about_contens3 li:nth-child(3) { font-size: 16px;}
	.about_contens3 li:nth-child(4) a { margin: 35px auto 0;}

	/* ニュース */
	.oshirase_space { font-size: 16px; text-align: center; margin-top: 10px;}
	.news_area {}
	.news_title_area { width: 100%; height: auto; background: url("../img/news_bg_m.png") no-repeat top center; background-size: cover; display: block; padding: 6% 10% 6%; aspect-ratio: auto;}
	.news_box { margin: 30px 0 50px; padding: 0 20px;}
	.news_box dt:nth-child(odd)  { width: 100%; font-size: 12px; padding: 15px 0 0 0; border-bottom: none;}
	.news_box dd:nth-child(even) { width: 100%; font-size: 15px;  padding:  5px 0 15px 0;}
	
}