@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=Zen+Kaku+Gothic+New:wght@500;700&display=swap');

body {
	overflow-x: hidden;
	width: 100vw;
}
html {
	scroll-behavior: smooth;
}

.no-scroll {
	overflow:hidden;
}

/* ローダー
========================================== */

.loader {
	-webkit-box-align: center;
	align-items: center;
	background: linear-gradient(180deg,rgba(242, 205, 136, 1) 0%, rgba(201, 125, 96, 1) 100%);
	bottom: 0;
	display: -webkit-box;
	display: flex;
	-webkit-box-pack: center;
	justify-content: center;
	left: 0;
	position: fixed;
	right: 0;
	top: 0;
	z-index: 99999;
}

/*-----------------------------------------------------
ヘッダー
-------------------------------------------------------*/

header {
	border-bottom: 1px solid #ccc;
	padding-bottom: 1em;
	padding-top: .8em;
}
@media only screen and (max-width: 767px) {
	header {
		padding: 15px 0;
	}
}


/* 左右振り分け
========================================== */

header .header-flex {
	display: flex;
	justify-content: space-between;
}

/* ロゴ
========================================== */

header .header-logo {
	max-width: 520px;
	width: 100%;
}
header .header-logo p {
	font-size: 12px;
	letter-spacing: .08em;
	padding-bottom: .3em;
}
@media only screen and (max-width: 767px) {
	header .header-logo {
		width: calc( 100% - 74px );
	}
	header .header-logo p {
		display: none;
	}
}

/* 右側
========================================== */

header .header-right {
	display: flex;
	justify-content: flex-end;
	flex-wrap: wrap;
}
@media only screen and (max-width: 1600px) {
	header .header-right {
		margin-right: 80px;
	}
}

/* 右側-電話番号と診察時間
========================================== */

header .header-tel {
	margin-right: 30px;
}

header .header-tel .header-tel-number {
	line-height: 1;
}
header .header-tel .header-tel-number span {
	font-size: 14px;
}
header .header-tel .header-tel-number em {
	font-size: 31px;
	font-weight: bold;
}
header .header-tel dl {
	display: flex;
	align-items: center;
	gap: 1em;
	letter-spacing: .05em;
	margin-top: .5em;
}
header .header-tel dl dt {
	background: #F2F2F2;
	font-size: 12px;
	display: inline-block;
	text-align: center;
	padding: .5em;
	line-height: 1;
}
header .header-tel dl dd {
	font-size: 12px;
	line-height: 1;
}
@media only screen and (max-width: 767px) {
	header .header-tel {
		display: none;
	}
}


header nav {
	margin-top: 20px;
}
header nav ol {
	display: flex;
	gap: 1em;
	justify-content: flex-end;
}
header nav ol li {
}
header nav ol li a {
	font-weight: bold;
	padding: .5em;
}
header nav ol li a.current {
	color: #62B9B4;
	border-bottom: 2px solid #62B9B4;
}
header nav ol li:hover > a {
	background: #62B9B4;
	color: #fff;
}

header nav ol li ul.nav-inner {
	display: none;
	position: absolute;
	background: #fff;
	z-index: 888;
	width: max-content;
}
header nav ol li:has(.nav-inner) {
	position: relative;
}
header nav ol li:has(.nav-inner) > a {
	padding-right: 2em;
}
header nav ol li:has(.nav-inner)::after {
	content: "";
	width: 8px;
	height: 6px;
	background: #000;
	display: block;
	position: absolute;
	right: 12px;
	top: 50%;
	margin-top: -3px;
	clip-path: polygon(50% 100%, 0 0, 100% 0);
}
header nav ol li:has(.nav-inner):hover::after {
	background: #fff;
}
header nav ol li:has(.nav-inner):hover ul.nav-inner {
	display: block;
}
header nav ol li ul.nav-inner li {}
header nav ol li ul.nav-inner li + li {
	border-top: 1px solid #ccc;
}
header nav ol li ul.nav-inner li a {
	display: block;
	padding: .5em 1em;
}

header button.btn-nav-sp {
	background: #F68A86 url(../img/common/ic_spnav.svg) no-repeat center;
	width: 54px;
	height: 54px;
	border-radius: 5px;
	position: fixed;
	right: 10px;
	top: 10px;
	z-index: 999999;
}
header button.btn-nav-sp.active {
	background: #8E543E url(../img/common/ic_close_wh.svg) no-repeat center;
	background-size: 40px;
}
@media only screen and (max-width: 767px) {
	header button.btn-nav-sp {
		right: 20px;
	}
}

/* スマホナビ
========================================== */

.slide-nav {
	display: none;;
	position: fixed;
	height: calc(100vh - 80px);
	z-index: 9999;
	top: 0;
	left: 0;
}

.slide-nav-cover {
	background: hsla(0, 0%, 0%, 0.2);
	width: 100%;
	display: block;
	height: 100dvh;
	width: 60%;
	position: fixed;
}
@media only screen and (max-width: 767px) {
	.slide-nav-cover {
		display: none;
	}
}

.slide-nav.active {
	display: block;
}
.slide-nav .slide-nav-header {
	background: #fff;
	padding: 15px 25px;
	position: fixed;
	top: 0;
	right: 0;
	width: 40%;
}
@media only screen and (max-width: 767px) {
	.slide-nav .slide-nav-header {
		width: 100%;
	}
}

.slide-nav .slide-nav-header .slide-nav-btn-close {
	position: fixed;
	right: 15px;
	width: 55px;
	height: 55px;
	top: 15px;
	border-radius: 4px;
}
.slide-nav .slide-nav-main {
	width: 40%;
	padding: 25px;
	background: #C97D60;
	height: calc(100vh - 51px);
	position: fixed;
	top: 71px;
	overflow-x: scroll;
	right: 0;
}
@media only screen and (max-width: 767px) {
	.slide-nav .slide-nav-main {
		width: 100%;
		height: calc(100vh - 159px);
	}
}

.slide-nav .slide-nav-item {
	background: #fff;
	border-radius: 4px;
}
.slide-nav .slide-nav-item+.slide-nav-item {
	margin-top: 16px;
}
.slide-nav .slide-nav-title {
	color: #C97D60;
	font-weight: bold;
	font-size: 18px;
	padding: 15px 20px;
}
.slide-nav .slide-nav-title.js-toggle-btn {
	background: url(../img/common/ic_plus_cir_green.svg) no-repeat right 20px center;
}
.slide-nav .slide-nav-title.js-toggle-btn.is-open {
	background: url(../img/common/ic_min_cir_gl.svg) no-repeat right 20px center;
}
.slide-nav .slide-nav-title:has(a) {
	padding: 0;
}
.slide-nav .slide-nav-title a {
	display: block;
	padding: 15px 20px;
	font-size: 20px;
	color: #C97D60;
	background: url(../img/common/ic_arr_orange.svg) no-repeat right 20px center;
	background-size: 22px;
}

.slide-nav .slide-nav-body {
	padding: 0 26px;
}

.slide-nav .slide-nav-body.js-toggle-body {
	display: none;
}

.slide-nav .slide-nav-body ol {}

.slide-nav .slide-nav-body ol li {
	border-top: 1px solid #ccc;
}
.slide-nav .slide-nav-body ol li a.current {
	background: url(../img/common/ic_arr_orange.svg) no-repeat right 20px center #d6f5f3;
}
.slide-nav .slide-nav-body ol li a {
	display: block;
	font-size: 16px;
	padding: 16px;
	background: url(../img/common/ic_arr_orange.svg) no-repeat right 20px center;
}
.slide-nav .slide-nav-body-bnr {
	margin-top: 30px;
}
@media only screen and (max-width: 767px) {
	.slide-nav .slide-nav-body-bnr {
		margin-top: 20px;
	}
}


ol.slide-nav-link-btm {}
ol.slide-nav-link-btm li {
	border-bottom: #fff 1px solid;
}
ol.slide-nav-link-btm li * {
	color: #fff;
}
ol.slide-nav-link-btm li a {
	display: block;
	padding: 16px;
	background: url(../img/common/ic_arr_r_wh.svg) no-repeat right 20px center;
	font-size: 16px;
}

/*-----------------------------------------------------
フッター
-------------------------------------------------------*/

footer {
	background: #E5E5E5;
	padding-top: 40px;
}
@media only screen and (max-width: 767px) {
	footer {
		padding-bottom: 90px;
	}
}

/* フッターリンク-上部の3連リンク
========================================== */

footer .footer-headline {}
footer .footer-headline ol {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 20px;
}
footer .footer-headline ol li {
	max-width: 470px;
	width: 100%;
}
footer .footer-headline ol li a {}
footer .footer-headline ol li a dl {
	background: #fff;
	padding: 40px;
	border-radius: 12px;
	height: 100%;
	position: relative;
	box-shadow: 0px 0px 18px -14px #000000;
}
footer .footer-headline ol li a dl.ic-features { background: url(../img/common/ic_line_features.svg) no-repeat right 30px top 30px #fff; }
footer .footer-headline ol li a dl.ic-case { background: url(../img/common/ic_line_case.svg) no-repeat right 30px top 20px #fff; }
footer .footer-headline ol li a dl.ic-price { background: url(../img/common/ic_line_price.svg) no-repeat right 30px top 30px #fff; }

footer .footer-headline ol li a dl::after {
	content: "";
	width: 45px;
	height: 45px;
	background: url(../img/common/ic_arr_cir_green.svg)no-repeat;
	display: block;
	position: absolute;
	bottom: 20px;
	right: 20px;
	transition: 0.2s all;
}
@media only screen and (max-width: 767px) {
	footer .footer-headline ol li a dl::after {
		width: 30px;
		height: 30px;
		background-size: 30px;
		right: 25px;
	}
}

footer .footer-headline ol li a:hover dl::after {
	right: 10px;
}
footer .footer-headline ol li a dl dt {
	font-size: 20px;
	font-weight: bold;
	color: #C97D60;
}
footer .footer-headline ol li a dl dd {
	margin-top: 27px;
	font-size: 16px;
}
@media only screen and (max-width: 767px) {
	footer .footer-headline ol li a dl {
		padding:20px 30px 20px;
	}
	footer .footer-headline ol li a dl.ic-features ,
	footer .footer-headline ol li a dl.ic-case {
		background-size: 40px;
	}
	footer .footer-headline ol li a dl.ic-price {
		background-size: 30px;
	}

	footer .footer-headline ol li a dl dt {
		font-size: 18px;
	}
	footer .footer-headline ol li a dl dd {
		margin-top: 6px;
		font-size: 14px;
	}
}

/* フッターリンク-白背景部分
========================================== */

footer .footer-link {
	background: #FFFFFF;
	border-radius: 12px;
	padding: 40px;
	margin-top: 50px;
	display: flex;
}
@media only screen and (max-width: 767px) {
	footer .footer-link {
		padding: 20px;
		flex-wrap: wrap;
		margin-top: 20px;
	}
}

/* フッター左右
========================================== */

footer .footer-link .footer-link-left {
	display: flex;
	width: 100%;
	gap: 10px;
	border-right: #C7C7C7 1px solid;
	padding-right: 20px;
}
footer .footer-link .footer-link-right {
	padding-left: 35px;
	max-width: 380px;
}
@media only screen and (max-width: 767px) {
	footer .footer-link .footer-link-left {
		flex-wrap: wrap;
		border-right: none;
		padding-right: 0;
	}
	footer .footer-link .footer-link-right {
		padding-left: 0;
		margin-top: 20px;
	}
}


/* 箇条書き部分
========================================== */

footer .footer-sitemap-item {
	max-width: 320px;
	width: 100%;
}
@media only screen and (max-width: 767px) {
	footer .footer-sitemap-item {
		max-width: 100%;
	}
}

footer .footer-sitemap-title {
	font-size: 14px;
	color: #C97D60;
	font-weight: bold;
	padding:0 0 12px;
}
footer ol.footer-sitemap {
	max-width: 340px;
	width: 100%;
	border-top: #B7B7B7 1px solid;
}
footer ol.footer-sitemap li {
	border-bottom: #B7B7B7 1px solid;
}
footer ol.footer-sitemap li a {
	display: block;
	padding: 16px 50px 16px 18px;
	background: url(../img/common/ic_arr_orange.svg) no-repeat center right 21px;
}
footer ol.footer-sitemap li a.current {
	background: url(../img/common/ic_arr_orange.svg) no-repeat center right 14px #f5f1e5;	
}
footer ol.footer-sitemap li a:hover {
	background: url(../img/common/ic_arr_orange.svg) no-repeat center right 14px #d6f5f3;
}
@media only screen and (max-width: 767px) {
	footer ol.footer-sitemap {
		max-width: 100%;
	}
}

/* SNSリンク
========================================== */

footer ol.footer-sitemap-sns {
	display: flex;
	gap: 22px;
}
footer ol.footer-sitemap-sns li {
	width: 50px;
}
@media only screen and (max-width: 767px) {
	footer ol.footer-sitemap-sns {
		flex-wrap: wrap;
	}
}


/* フッターリンク-下部のグレー部分
========================================== */

footer .footer-link-btm {
	background: #F9F8F3;
	margin: 30px calc(50% - 50vw) 0;
	padding: 17px calc(50vw - 50%) 17px;
}
footer .footer-link-btm ol {
	display: flex;
	flex-wrap: wrap;
	gap: 57px;
	line-height: 1;
}
footer .footer-link-btm ol li {}
footer .footer-link-btm ol li a {
}
footer .footer-link-btm ol li a:hover {
	text-decoration: underline;
}
@media only screen and (max-width: 767px) {
	footer .footer-link-btm ol {
		gap: 0;
	}
	footer .footer-link-btm ol li {
		width: 100%;
	}
	footer .footer-link-btm ol li + li {
		border-top: 1px solid #ccc;
	}
	footer .footer-link-btm ol li a {
		display: block;
		width: 100%;
		padding: 1em;
	}
}

/* フッターコピーライト
========================================== */

footer .copy {
	background: #C97D60;
	text-align: center;
	line-height: 1;
	margin: 0 calc(50% - 50vw);
	padding: 14px calc(50vw - 50%) 17px;
}
footer .copy small {
	color: #fff;
	font-size: 12px;
}

/* フッター
========================================== */

.footer-spbtm-nav {
	background: #62B9B4;
	position: fixed;
	width: fit-content;
	padding: 10px;
	display: flex;
	justify-content: space-between;
	right: 0;
	gap: 10px;
	border-radius: 24px 0 0 0 ;
	z-index: 9999;
	transition: all 1s;
	bottom: -300px;
}
.footer-spbtm-nav.inView {
	bottom: 0;
}
.footer-spbtm-btn-cv {
	display: block;
	color: #fff;
	text-align: center;
	background: linear-gradient(180deg,rgba(255, 110, 55, 1) 0%, rgba(255, 120, 43, 1) 88%, rgba(255, 154, 1, 1) 100%);
	border-radius: 30px;
	padding: 1em;
	width: 270px;
	box-sizing: border-box;
	font-weight: bold;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	border-bottom: 7px solid #D43A00;
}
.footer-spbtm-btn-cv::after {
	content: "";
	width: 16px;
	height: 10px;
	display: block;
	background: url(../img/common/ic_arr_r_wh.svg) no-repeat;
	background-size: cover;
	position: absolute;
	right: 1em;
	top: 50%;
	margin-top: -6px;
}
.footer-spbtm-btn-info {
	display: block;
	background: url(../img/common/ic_arr_orange.svg) no-repeat center right 1em #fff;
	font-size: 14px;
	padding: 10px;
	width: 120px;
	box-sizing: border-box;
	border-radius: 8px;
	display: flex;
	align-items: center;
	line-height: 1.2;
}
@media only screen and (max-width: 767px) {
	.footer-spbtm-nav {
		width: 100%;
		border-radius: 0;
	}
}


/* 営業日お知らせボタンの内容
========================================== */

.reserveInfo {}
.reserveInfo .popup {
	background:#fff;
	box-shadow:0px 6px 10px -8px #000000;
	overflow:scroll;
	box-sizing:border-box;
	padding:10px 10px 50px 10px;
	z-index:150;
	width: 640px;
}
.reserveInfo .popup .close {
	width:48px;
	height:48px;
	display:block;
	background:url(../img/common/ic_yoyaku_close.png);
	background-repeat:no-repeat;
	position:absolute;
	border-radius:48px;
	bottom:-24px;
	left: 50%;
	margin-left:-24px;
	box-shadow:0px 6px 10px -8px #000000;
}
.reserveInfo .popup .tit {
	text-align:center;
	font-weight:bold;
	font-size:22px;
	padding-bottom:18px;
	margin-top:10px;
}
.reserveInfo .popup dl {
	border-top:1px solid #CCC;
	padding-bottom:20px;
}
.reserveInfo .popup dl:last-of-type {
	border-bottom:1px solid #CCC;
}
.reserveInfo .popup dl dt {
	font-weight:bold;
	font-size:16px;
	text-align:center;
	padding-top:20px;
}
.reserveInfo .popup dl dd {
	padding-top:13px;
	text-align: center;
}

.reserveInfo .popup dl:nth-of-type(1) dd em {
	text-align:center;
	font-size:13px;
	letter-spacing:normal;
	display:block;
}
.c-btn-popup {
	max-width:320px;
	display:block;
	background:#000;
	border-radius:5px;
	text-align:center;
	color:#fff;
	padding:15px;
	margin:0 auto;
	position:relative;
}
.c-btn-popup:after {
	position:absolute;
	content:'';
	width:8px;
	height:8px;
	border-right:2px solid #fff;
	border-bottom:2px solid #fff;
	transform: rotate(-45deg);
	right:25px;
	top:50%;
	margin-top:-4px;
}
/* 電話予約 */
.c-btn-popup__tel {
	color:#F80000;
	font-size:22px;
	font-weight:bold;
	background:url(../img/common/ic_head_dial.png) no-repeat 0 50%;
	background-size:36px auto;
	padding-left:48px;
	font-family:'Quicksand',sans-serif;
	display:inline-block;
	text-align:center;
}
/* 無料カウンセリング */
.c-btn-popup__red {
	background:#F90000;
	border-bottom:#CA0000 5px solid;
}
/* 再診予約 */
.c-btn-popup__blue {
	background:#0092F9;
	border-bottom:#0067CA 5px solid;
}

.c-btn-popup-line {
	background: url(../img/common/ic_sns_line.png) no-repeat center left 10px #fff;
	background-size: 16px;
	color: #00C300;
	border: #00C300 2px solid;
	padding: 0.8em 1em 0.8em 3em;
	font-size: 12px;
	font-weight: bold;
}
.bg-lgy {
	background: #DEFECC;
}
.ic-ques {
	background: url(../img/common/ic_cir_ques.svg)no-repeat;
	background-size: 20px;
	padding-left: 2em;
}
@media only screen and (max-width:767px) {
	.reserveInfo .popup {
		max-height:85vh;
		width: 360px;
	}
	.reserveInfo .popup .tit {
		font-size:18px;
		padding-bottom:9px;
		margin-top:5px;
	}
	.reserveInfo .popup dl {
		padding-bottom:15px;
	}
	.reserveInfo .popup dl:last-of-type {
		border-bottom:1px solid #CCC;
	}
	.reserveInfo .popup dl dt {
		padding-top:20px;
	}
	.reserveInfo .popup dl dd {
		padding-top:8px;
	}
	.reserveInfo .popup dl dd a.btn {
		max-width:320px;
		width:95%;
		padding:10px;
	}
	.reserveInfo .popup dl dd a.btn:after {
		right:15px;
	}
}
@media only screen and (max-width:320px) {
	.reserveInfo .popup dl dt {
		padding-top:10px;
	}
	.reserveInfo .popup dl {
		padding-bottom:13px;
	}
	.reserveInfo .popup dl dt {
		padding-top:10px;
	}
	.reserveInfo .popup dl:nth-of-type(1) dd em {
		font-size:12px;
		line-height:1.2;
	}
}