@charset "utf-8";

/*//////////// 基本サイズ16px  ////////////
10px 	63%					26px 	163%
11px 	69%					27px 	169%
12px 	75%					28px 	175%
13px 	82%					29px 	182%
14px 	88%					30px 	194%
15px 	94%					31px 	200%
16px 	100%				32px 	207%
17px 	107%				33px 	213%
18px 	113%				34px 	219%
19px 	119%				35px 	225%
20px 	125%				36px 	232%
21px 	132%				37px 	238%
22px 	138%				38px 	244%
23px 	144%				39px 	250%
24px 	150%				40px 	257%
25px 	157%
//////////////////////////////*/

/*###########################################################

 全ページ共通のレスポンシブ
 
#############################################################/*/

@media screen and (max-width: 1250px) {
	/*全ページ共通のテーブル構造　-------------------*/
	.container {width:98%;padding: 0 10px 0 10px !important;}
}




@media screen and (max-width: 1170px) {
	/* =============全ページ共通のスタイル================== */
	img{max-width: 100%;height: auto;width /***/:auto;　}
	
	/* ========= 全ページ共通の横メニュー ========== */
	.yokomenu-bg{width:98%;padding: 0 10px 0 10px !important;}

	/*///////////  全ページ共通のフッター  ///////////////*/
	#footer::before {background: url(../img/footer_circle.png) no-repeat left -50px top;}
	.footer-right{width:57%;}
	.footermenu ul#yoko-menu li {margin: 0 3% 0 0;}
}





@media screen and (max-width: 1100px) {
	/*index上部の切り替わる背景画像-----------------------*/
	.index-head-child-right {display: none;}
	.index-head-child-left {display: none;}
	
	/* ========= 全ページ共通の横メニュー ========== */
	ul#yoko-menu li {margin: 0 2% 0 0;}
	
	/*====== お知らせ ===========*/
	.index-news-box ul li {width: 47%;margin: 10px 1.3% 0 1.3%;}
	
	/*====== 診療案内 ===========*/
	ul.index-shinryou-ul li {margin: 0 0.1% 25px 0.1%;width: 24%;}
	ul.index-shinryou-ul li a {width: 100%;background-size: contain !important;}
	
	/*====== 診療時間/交通 ===========*/
	.yasumi-left {float: none;margin: 0 auto;}
	.yasumi-box .btn-yoyaku {float: none;margin: 20px auto 20px auto;}
	table.access-zip-table th {width: 13% !important;padding: 12px 5px 14px 5px;}
	table.access-zip-table td {width: 85% !important;}

	/*///////////   全ページ共通のフッター  ///////////////////	*/
	#footer {margin-top: 80px;padding-bottom: 20px;}
	#footer::before {background: url(../img/footer_circle.png) no-repeat left -20px top;background-size: 600px;top: -80px;height: 80px;}
	.footer-wrap {top: 10px;}
	.footer-wrap .rogo-box {margin: 0 auto;width: 250px;}
	.footer-wrap .rogo-box .rogo {margin-top: -16px;}
	#footer .rogo-box .rogomark img {width: 100px;}
	.footer-left {float: none;width: 100%;margin-bottom: 0;}
	.footer-right {float: none;width: 100%;margin: 30px 0 0 0;}
	.footer-left table.access-zip-table {margin: 10px 0 0 0;}
	#footer .copyright {margin: 25px 0 0 0;}
}





@media screen and (max-width: 980px) {
	/*//////// 全ページ共通のheader　///////////////*/
	#header{background: url(../img/index_head.png) no-repeat center bottom;height: 625px;background-size: 1400px 600px;}
	
	/*切り替わる背景画像の上の文字画像*/
	ul.headerimgs-text{top:105px;width: 600px;}
	/*index上部の切り替わる背景画像-----------------------*/
	#headerimgs {top: 222px;}
			
	/*スマホ時のheader内*/
	.sp-header-inner{position: fixed;display:block;height:73px;background:url(../img/sp_menu_bg1.png) no-repeat center top;background-size:100% 73px;z-index: 50;width: 100%;}
	.sp-header-inner .rogo-box{width:200px;}
	.sp-header-inner .rogo-box .rogo {margin-top: -12px;}
	.sp-header-inner .rogo-box .rogomark img {width:80px;}


	/*-------------------------------------------------------------------------
	ページ上部右の出てくるナビmenuが出現して、入れ替わりに横メニューが消える
	--------------------------------------------------------------------------*/
	#header .container{display:none;}
	.yokomenu-bg{display:none;}
	#change{display:none !important;}
	
	#menubtn{position:fixed;z-index:700;top:7px;right:15px;background:url(../img/header_menu.png) no-repeat 0 0;width:54px;height:42px;display:block;cursor:pointer;}/*overflow:hidden;text-indent:-8989px;*/
	#menubtn.off{background-position:0 0;}
	#menubtn.on{background-position:0 -42px;}


	/*右側のメニューボタン*/
	.menu-trigger {position:absolute;right: 0;top: 11px;z-index:200;width:34px;height:20px;display: inline-block;transition: all .4s;box-sizing: border-box;left: 0;margin: 0 auto;}
	.menu-trigger span {position: absolute;left: 0;width: 100%;height:2px;background-color:#fff;display: inline-block;transition: all .4s;box-sizing: border-box;}
	
	/*
	.menu-trigger::after {position: absolute;left: 0;bottom: -25px;content: 'メニュー';display: block;width: 100%;color: #003540;font-size:79%;font-weight: 600;text-decoration: none;text-align: center;transition: all .4s;white-space: nowrap;letter-spacing: -0.2em;}
	.menu-trigger.active::after {content: '閉じる';color:#fff;bottom: -33px;font-weight: normal;}
	a.menu-trigger{text-decoration:none;}
	*/
	.menu-trigger span:nth-of-type(1) {}
	.menu-trigger span:nth-of-type(2) {top: 50%;left: 50%;-webkit-transform: translate3d(-50%, -50%, 0);transform: translate3d(-50%, -50%, 0);}
	.menu-trigger span:nth-of-type(3) {bottom: 0;}
	
	.menu-trigger.active span{height: 2px;}
	.menu-trigger.active span:nth-of-type(1) {z-index: 10;-webkit-transform: translateY(9px) rotate(-317deg) scale(1.15);transform: translateY(9px) rotate(-317deg) scale(1.15);}
	.menu-trigger.active span:nth-of-type(2) {display: none;}
	.menu-trigger.active span:nth-of-type(3) {-webkit-transform: translateY(-9px) rotate(317deg) scale(1.15);transform: translateY(-9px) rotate(317deg) scale(1.15);}


	/*------------------------------------
	ページ上部右の出てくるナビmenu
	------------------------------------*/
	#navi_sp {display: none;position: fixed;width:100%;z-index:49;overflow-y: scroll;height:100%;right: 0;top: 0;background:#fbe0d6 url(../img/sp_menu_bg2.png) repeat center top;padding:94px 0 0 0;}
	#navi_sp a,
	#navi_sp a:hover{text-decoration:none;}

	#navi_sp .btn-yoyaku {width: 250px;margin: 0 auto 17px auto;}
	#navi_sp .tel-toi{}	
	#navi_sp .tel-yoyaku{}


	ul#yoko-menu-sp {list-style-type: none;padding: 0;width:100%;text-align:center;max-width: 440px;margin: 22px auto 0 auto;}

	ul#yoko-menu-sp li.yokomenu1 a{background:#fff url(../img/yokomenu1.png) no-repeat;}
	ul#yoko-menu-sp li.yokomenu2 a{background:#fff url(../img/yokomenu2.png) no-repeat;}
	ul#yoko-menu-sp li.yokomenu3 a{background:#fff url(../img/yokomenu3.png) no-repeat;}
	ul#yoko-menu-sp li.yokomenu4 a{background:#fff url(../img/yokomenu4.png) no-repeat;}
	ul#yoko-menu-sp li.yokomenu5 a{background:#fff url(../img/yokomenu5.png) no-repeat;}
	ul#yoko-menu-sp li.yokomenu6 a{background:#fff url(../img/yokomenu6.png) no-repeat;}
	ul#yoko-menu-sp li.yokomenu7 a{background:#fff url(../img/yokomenu7.png) no-repeat;}
	
	ul#yoko-menu-sp li{position:relative;display:inline-block;margin:0 15px 25px 10px;padding: 0;top:0px;transition: 0.6s;}
	ul#yoko-menu-sp li a{position:relative;width:92px;height:92px;border-radius:50%;text-indent:-8989px;display:block;overflow:hidden;background-size: contain !important;}

	ul#yoko-menu-sp li:hover a{background-color:#fff9cc;}
	ul#yoko-menu-sp li:hover {top:-3px;}

	ul#yoko-menu-sp li:after{position: absolute;z-index:-1;content: "";top:0;width:92px;height:92px;border-radius:50%;box-shadow:0 5px 0 0 #ffb9aa, 3px 7px 0 3px #ffb9aa, -3px 7px 0 3px #ffb9aa;left: 0;}

	/*メニューの閉じる*/
	#navi_sp p#menuclose{padding:10px 0 30px 0;}
	#navi_sp p#menuclose a {font-size: 110%;color: #FFF;padding: 13px 10px 13px 0;line-height: 1.0;display: block;background: #827d7b url(../img/header_menu_close.png) no-repeat right 25px center;cursor: pointer;
													width: 250px;margin: 0 auto;text-align: center;border-radius: 42px;}
	#navi_sp p#menuclose a:hover{background-color:#666;opacity:1;}
}






@media screen and (max-width:950px) {
	/*====== 診療時間/交通 ===========*/
	ul.index-access-ul li.index-time {float: none;width: 100%;}
	ul.index-access-ul li.index-map {float: none;width: 100%;margin-top: 30px;}
	ul.index-access-ul li.index-map iframe {height: 400px;}
}






@media screen and (max-width:900px) {
	/*全ページ共通のテーブル構造　-------------------*/
	.container{font-size: 103%;}
	
	/*========== ごあいさつ ===========*/
	h1{font-size: 170%;}
	h4 {font-size: 140%;}
	
	/*====== お知らせ ===========*/
	h2 {font-size: 180%;}
	
}




@media screen and (max-width:840px) {
	/*index上部の切り替わる背景画像-----------------------*/
	/*左右の矢印ボタン*/
	.sp-horizontal .sp-previous-arrow{left:10px;}
	.sp-horizontal .sp-next-arrow {right:10px;}
	.sp-horizontal .sp-previous-arrow:hover{left:10px;}
	.sp-horizontal .sp-next-arrow:hover{right:10px;}
	body.home .sp-buttons {display:none;}

	/*切り替わる背景画像の上の文字画像*/
	ul.headerimgs-text{width: 80%;}
}




@media screen and (max-width: 760px) {
	/*切り替わる背景画像の上の文字画像*/
	#header{height:580px; background-size:1400px 550px;}
	
	/*========== お知らせ ===========*/
	.section.bg-blue h2.blue span{display:none;}
}





@media screen and (max-width: 640px) {
	/*切り替わる背景画像の上の文字画像*/
	#header{height:510px;}
	ul.headerimgs-text {top: 100px;}
	#headerimgs {top: 200px;}
	.sp-slides-container .sp-mask {border-radius: 70px;}
	
	/*========== ごあいさつ ===========*/
	.index-aisatu-com{text-align:left;}
	.index-aisatu-com br{display:none;}
	
	/*全ページ共通のページ下部の上部へ戻る */
	#pagetop a {width: 55px;height: 70px;}
	
	/*====== お知らせ ===========*/
	h2::before {width: 60px;}
	h2::after {width: 60px;}
	
	/*///////////   全ページ共通のフッター  ///////////////////	*/
	.footermenu ul#yoko-menu li {margin: 0 1.2% 0 1.2%;}
	.footermenu ul#yoko-menu li a {width: 80px;height: 80px;}
	.footermenu ul#yoko-menu li::after {width: 80px;height: 80px;box-shadow: 0 6px 0 0 #43b4e4,3px 6px 0 3px #43b4e4,-3px 6px 0 3px #43b4e4;}
	.footer-hanashi {margin-top: 25px;}
	.footer-hanashi a .text {width: 250px;}
	.footer-hanashi a .mark img {width: 76px;}
	.footer-hanashi .btn-daiji a .text {background-size: 11px;}
	.footer-hanashi .btn-naisho a .text {background-size: 11px;}
	.footer-hanashi a .text img {width: 105px;}
	.footer-hanashi a .text {height: 62px;width: 180px;padding-left: 12px;}
	.footer-hanashi a .mark {top: -7px;left: -38px;}
	.btn-daiji {margin-right: 55px;}
}





@media screen and (max-width: 560px) {
	/*全ページ共通のテーブル構造　-------------------*/
	.container{font-size: 93%;}
	
	/*切り替わる背景画像の上の文字画像*/
	#header{height:470px;}
	ul.headerimgs-text {top:95px;}
	#headerimgs {top:185px;}
	
	/* ページの各セクション-------------------*/
	.section{padding:45px 0 45px 0;}

	/*========== ごあいさつ ===========*/
	body.home h1{font-size: 135%;letter-spacing: -0.1em;margin-bottom: 10px;}
	
	/*========== お知らせ ===========*/
	.section-icon {margin-bottom: 10px;}
	.section-icon img{height: 60px;}
	.index-news-box ul li a {font-size: 108%;}
	
	/*====== 診療案内 ===========*/
	ul.index-shinryou-ul li {margin: 0 0.1% 5px 0.1%; width: 34%;}
	
	/*///////////   全ページ共通のフッター  ///////////////////	*/
	table.access-zip-table th {vertical-align: top;}
	.footermenu ul#yoko-menu li {margin: 0 6px 0 6px;}
	.btn-daiji {margin: 0 10% 15px 15%;}
	.btn-naisho {margin: 0 10% 0 15%;}
}




@media screen and (max-width: 480px) {
	/*-----	ページ上部右の出てくるナビmenu ----------*/
	#navi_sp {padding:94px 8% 0 8%;}
	ul#yoko-menu-sp {margin-top: 12px;}
	ul#yoko-menu-sp li {margin: 0 6px 15px 6px;}
	ul#yoko-menu-sp li a {width: 86px;height: 86px;}
	ul#yoko-menu-sp li::after {width: 86px;height: 86px;box-shadow: 0 6px 0 0 #ffb9aa ,3px 6px 0 3px #ffb9aa ,-3px 6px 0 3px #ffb9aa;}
	#navi_sp p#menuclose {padding:12px 0 30px 0;}
	
	
	/*切り替わる背景画像の上の文字画像*/
	#header{height:420px;}
	ul.headerimgs-text {top:95px;width: 90%;}
	#headerimgs {top:180px;}
	.sp-slides-container .sp-mask {border-radius:50px;border: 8px solid #fff;}
	.sp-horizontal .sp-arrows {display: none;}
	
	/*====== 診療時間/交通 ===========*/
	h2 {font-size: 165%;}
	h2::before {width: 35px;margin: 0 10px 0 0;}
	h2::after {width: 35px;margin: 0 0 0 12px;}
	table.eigyou-table th {padding: 8px 7px 8px 7px;}
	table.eigyou-table td {padding: 8px 8px 8px 10px;font-size: 83%;}
	table.eigyou-table td br{display:block;}
	.yasumi-box .btn-yoyaku {width: 280px;}
	
	/*========== お知らせ ===========*/
	.index-news-box ul li {width: 100%;margin: 10px 0 0 0;}
	.index-news-box ul li a {padding: 20px 15px 10px 20px;}
		
	/*///////////   全ページ共通のフッター  ///////////////////	*/
	#footer::before {background-size: 450px;top: -60px; height: 60px;}
	
}





@media screen and (max-width: 390px) {
	/*-----	ページ上部右の出てくるナビmenu ----------*/
	#navi_sp {padding:94px 0 0 0;}
	
	/*スマホ時のheader内*/
	.sp-header-inner .rogo-box {width: 170px;}
	
	/*切り替わる背景画像の上の文字画像*/
	#header{height:370px;}
	#headerimgs {top:165px;}

	/*========== ごあいさつ ===========*/
	body.home h1{font-size:115%;}
	h4 {font-size:133%;margin-bottom: 15px;}
	.index-aisatu-com {line-height: 1.8;}
	
	/*====== 診療案内 ===========*/
	ul.index-shinryou-ul li {width:40%;}
	
	/*///////////   全ページ共通のフッター  ///////////////////	*/
	.footer-left .btn-yoyaku {width: 270px;}
	.footer-left table.access-zip-table th {display: none;}
	.footermenu {display: none;}
	.footer-hanashi {display: none;}
}




@media screen and (max-width: 350px) {
	/*切り替わる背景画像の上の文字画像*/
	#header{height:340px;}
	#headerimgs {top:155px;}
}






