:root{
	--base-font: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
	--sub-font: fot-tsukuardgothic-std, sans-serif;
	--en-font: fot-tsukuardgothic-std, sans-serif;
	--base-color: #1d3661; 
	--sub-color01: #6c99dc; /* 水色っぽい青 */
	--bg-color01: #a99991; /* 薄い茶色 */
	--bg-color02: #ffad86; /* 薄いオレンジ */
	--bg-color03: #c4d6f1; /* 薄い水色 */
}

*{ box-sizing: border-box; }
html { font-size: 62.5%; }
body{
	font-family: var(--base-font);
	font-feature-settings: "palt";
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	color: var(--base-color);	
	font-size: 1.4rem;
	font-style: normal;
	font-weight: 400;
	line-height: 1.714;
	letter-spacing: 0.05em;
	text-align: justify;
}

h1,h2,h3,h4,h5,h6{ font-family: var(--sub-font); font-weight: 700; line-height: 1.5; letter-spacing: .05em; }
.sub-font{ font-family: var(--sub-font); font-weight: 700; }
.en-font{ font-family: var(--en-font); font-weight: 700; line-height: 1; }

/*** adobe使用フォント
font-family: fot-tsukuardgothic-std, sans-serif;
font-weight: 700;
***/

a{ transition: .5s; }
a:hover{ opacity: .7; }
br{ line-height: inherit; }
span, a, strong, small, address{ color: inherit; font-size: inherit; font-family: inherit; font-style: inherit; font-weight: inherit; letter-spacing: inherit; }

.wrap{ width: 90rem; margin: 0 auto; position: relative; }
.row{ display: flex; justify-content: space-between; }

.body-wrap{ overflow: hidden; position: relative; }

@media(min-width: 769px){
	.sp{ display: none !important; }
}

.btn{ width: 30rem; height: 6rem; border-radius: 3rem; background: var(--bg-color01); display: flex; justify-content: center; align-items: center; font-family: var(--sub-font); font-size: 1.8rem; font-weight: 700; color: #fff; position: relative; }
.btn:after{ content: ''; width: 2rem; height: 2rem; background: url(../images/common/arrow01.svg) no-repeat center/contain; position: absolute; top: 50%; right: 1rem; transform: translateY(-50%); }
.btn:hover{ background: var(--bg-color02); opacity: 1; }

header{ width: 100%; height: 9rem; background: rgba(255, 255, 255, .9); display: flex; align-items: center; padding-left: 1rem; position: fixed; top: 0; left: 0; z-index: 9971; }
header > .logo{ display: block; }
header .head-nav{ display: flex; margin-left: 2rem; }
header .head-nav li + li{ margin-left: 1.5rem; }
header .head-nav li a{ width: 20rem; height: 4rem; border-radius: 2rem; background: var(--bg-color01); color: #fff; font-size: 1.8rem; display: flex; justify-content: center; align-items: center; }
header .head-nav li a:hover{ opacity: 1; background: var(--bg-color02); }
header .head-nav li a span{ padding-left: 2rem; }
header .head-nav li:nth-of-type(1) a span{ background: url(../images/common/icon-tel01.svg) no-repeat center left/1.15rem; }
header .head-nav li:nth-of-type(2) a span{ background: url(../images/common/icon-resv01.svg) no-repeat center left/1.35rem; }

nav{ width: 100vw; height: 100vh; background: #fff; position: fixed; top: 0; left: 0; z-index: 9970; display: flex; align-items: center; justify-content: center; transition: .5s; opacity: 0; visibility: hidden; }
nav.active{ opacity: 1; visibility: visible; }
nav .inner{ width: 82rem; display: flex; justify-content: space-between; padding-left: 27.5rem; background: url(../images/common/webp/nav-bg01.webp) no-repeat center left/20rem; }
nav .inner .gnav li{ font-size: 1.8rem; }
nav .inner .gnav li + li{ margin-top: .8rem; }
nav .inner .gnav li a{ font-size: 1.6rem; letter-spacing: 0.1em; margin: 0 1.5rem; padding: 0.1rem 0.5rem; border-radius: 2rem; }
nav .inner .gnav li a:hover{ opacity: 1; background: #ffdecf; }

nav .inner .info dl{ margin-bottom: 2rem; }
nav .inner .info dl dt{ font-size: 1.7rem; margin-bottom: 1.5rem; }
nav .inner .info dl dt small{ display: block; font-size: 1.3rem; }
nav .inner .info dl dd{ font-size: 1.3rem; line-height: 1.692; }

.hour-table{ width: 33.5rem; table-layout: fixed; font-size: 1.5rem; }
.hour-table th{ width: 13rem; vertical-align: middle; padding-left: 1.3rem; }
.hour-table td{ text-align: center; vertical-align: middle; }
.hour-table thead{ background: var(--sub-color01); color: #fff; }
.hour-table thead th{ height: 4rem; border-radius: 1rem 0 0 0; }
.hour-table thead tr > *:last-child{ border-radius: 0 1rem 0 0; width: 3.4rem; padding-right: .7rem; }
.hour-table tbody th{ height: 6rem; }
.hour-table tbody td{ color: var(--sub-color01); }
.hour-table tbody td.base-color{ color: var(--base-color); }
.hour-table + p{ font-size: 1.5rem; margin-top: .8rem; }

.info-box{ position: relative; z-index: 0; }
.info-box .item01{ position: absolute; bottom: 0; left: -1rem; }
.info-box .left{ width: 32.5rem; }
.info-box .left h2{ font-size: 1.7rem; margin-bottom: 1.5rem; }
.info-box .left h2 small{ display: block; font-size: 1.3rem; margin-bottom: .3rem; }
.info-box .left p.address{ font-size: 1.3rem; line-height: 1.692; margin-bottom: 2rem; }
.info-box .left .tel{ display: table; line-height: 1; font-size: 2.8rem; margin-bottom: 1.5rem; }
.info-box .left .tel small{ font-size: 1.6rem; }
.info-box .left p.treatment-time{ font-size: 1.3rem; line-height: 1.692; margin-bottom: 1.5rem; }
.info-box .left p.treatment-item{ font-size: 1rem; line-height: 1.8; }
.info-box .right{ width: 52.5rem; }
.info-box .right .map01{ position: relative; background: #fff; border-radius: 1rem; margin-bottom: 2.4rem; }
.info-box .right .map01 img{ width: 100%; }
.info-box .right .map01 .btn{ width: 13rem; height: 4rem; position: absolute; bottom: 1.5rem; right: 1.5rem; font-size: 1.4rem; letter-spacing: 0; justify-content: flex-start; padding-left: 1.3rem; }
.info-box .right .access-list dt{ font-size: 1.5rem; color: var(--sub-color01); position: relative; z-index: 0; margin-bottom: .6rem; }
.info-box .right .access-list dt:before{ content: ''; width: 100%; height: 1px; background: url(../images/common/border01.png) repeat-x left center/auto 1px; position: absolute; top: 50%; left: 0; z-index: -1; }
.info-box .right .access-list dt span{ padding: 0 .8em 0 2.4rem; background: #f4f2f1; position: relative; z-index: 1; }
.info-box .right .access-list dt span:before{ content: ''; width: 2rem; height: 2rem; background: no-repeat center/contain; position: absolute; left: 0; top: 50%; transform: translateY(-50%); }
.info-box .right .access-list dt:nth-of-type(1) span:before{ background-image: url(../images/common/icon-train01.svg); }
.info-box .right .access-list dt:nth-of-type(2) span:before{ background-image: url(../images/common/icon-car01.svg); }
.info-box .right .access-list dd{ padding-left: 1em; position: relative; line-height: 1.692; font-size: 1.3rem; }
.info-box .right .access-list dd:before{ content: '・'; position: absolute; left: 0; }
.info-box .right .access-list dd + dt{ margin-top: 1.5rem; }
.info-box .right .access-list dd strong{ font-weight: 700; }

.treat-list01{ display: flex; justify-content: space-between; flex-wrap: wrap; margin-bottom: 7.5rem; }
.treat-list01 a{ display: block; background: var(--bg-color03); width: 42.5rem; padding: 2.5rem 4rem 1.5rem; border-radius: 2rem; position: relative; }
.treat-list01 a:before{ content: ''; width: 16rem; height: 10rem; background: no-repeat center/cover; border-radius: 1rem; position: absolute; left: 4rem; top: -3rem; }
.treat-list01 a:nth-of-type(1):before{ background-image: url(../images/common/webp/treat-pic01.webp); }
.treat-list01 a:nth-of-type(2):before{ background-image: url(../images/common/webp/treat-pic02.webp); }
.treat-list01 a dl dt{ font-size: 2rem; width: 16rem; margin: 0 0 3.5rem auto; }
.treat-list01 a dl dt span{ position: relative; z-index: 0; }
.treat-list01 a dl dt span:before{ content: ''; width: 17rem; height: 2.4rem; background: url(../images/common/arrow02.svg) no-repeat center/contain; position: absolute; bottom: -.2rem; left: -1rem; z-index: -1; }
.treat-list01 a dl dd{ font-size: 1.3rem; }
.treat-list01 a:hover{ opacity: 1; background: #ffdecf; }

.treat-list02{ display: flex; flex-wrap: wrap; font-family: var(--sub-font); font-weight: 700; }
.treat-list02 li{ width: 14rem; margin-right: calc((100% - 14rem * 6) / 5); text-align: center; }
.treat-list02 li:nth-of-type(6n){ margin-right: 0; }
.treat-list02 li:nth-of-type(n+7){ margin-top: 4rem; }
.treat-list02 li a{ display: block; width: 100%; font-size: 1.6rem; line-height: 1.2; position: relative; z-index: 0; white-space: nowrap; }
.treat-list02 li a:before{ content: ''; width: 9rem; height: 9rem; border-radius: 100%; background: #e2ebf8; position: absolute; top: 0; left: 50%; transform: translateX(-50%); z-index: -1; transition: .5s; }
.treat-list02 li a img{ display: block; margin: 0 auto 1.3rem; }
.treat-list02 li a small{ display: block; font-size: 1.2rem; }
.treat-list02 li a:hover{ opacity: 1; }
.treat-list02 li a:hover:before{ background: #ffdecf; }

footer{ background: #f4f2f1; padding-top: 7rem; }
footer > .logo{ display: table; margin: 0 auto 6rem; }
footer .info-box{ margin-bottom: 6.5rem; }
footer .bg-navy{ background-color: var(--base-color); background-image: url(../images/common/webp/footer-bg01.webp), url(../images/common/webp/footer-bg02.webp); background-repeat: no-repeat, no-repeat; background-position: left -8rem top 4rem, right -8rem top 4rem; background-size: 32rem, 32rem; color: #fff; padding: 7.5rem 0 1.5rem; position: relative; z-index: 0; }
footer .sitemap{ display: flex; justify-content: center; margin-bottom: 5.4rem; }
footer .sitemap > ul > li + li{ margin-top: 1rem; }
footer .sitemap > ul + ul{ margin-left: 4rem; }
footer .sitemap > ul > li .child{ margin-top: 1rem; }
footer .sitemap > ul > li .child > ul + ul{ margin-left: 2.5rem; }
footer .sitemap > ul > li .child li{ padding-left: 1em; position: relative; }
footer .sitemap > ul > li .child li:before{ content: '−'; position: absolute; left: 0; }
footer .sitemap > ul > li .child li + li{ margin-top: 1rem; }
footer .sitemap > ul > li a{ position: relative; }
footer .sitemap > ul > li a:before{ content: ''; width: 0; height: 1px; background: #fff; position: absolute; bottom: -.5em; left: 50%; transform: translateX(-50%); transition: .5s; }
footer .sitemap > ul > li a:hover{ opacity: 1; }
footer .sitemap > ul > li a:hover:before{ width: 100%; }
footer .copy{ display: block; text-align: center; font-size: 1.2rem; }

.menu-btn{ position: fixed; top: 3.3rem; right: 2rem; z-index: 9980; display: flex; align-items: center; cursor: pointer; }
.menu-btn > span{ font-size: 1.2rem; line-height: 1; display: block; margin-right: 1rem; }
.menu-btn .inner{ width: 1.7rem; height: 2.2rem; position: relative; }
.menu-btn .inner span{ width: 100%; height: 2px; border-radius: 2px; background: var(--base-color); position: absolute; left: 0; transition: .5s; }
.menu-btn .inner span:nth-of-type(1){ top: 0; }
.menu-btn .inner span:nth-of-type(2){ top: 50%; transform: translateY(-50%); }
.menu-btn .inner span:nth-of-type(3){ bottom: 0; }
.menu-btn.active .inner span:nth-of-type(1){ transform: translateY(10px) rotate(45deg); }
.menu-btn.active .inner span:nth-of-type(2){ opacity: 0; }
.menu-btn.active .inner span:nth-of-type(3){ transform: translateY(-10px) rotate(-45deg); }


@media(max-width: 768px){
	html{ font-size: 2.66vw; }
	body{ font-size: 1.4rem; -webkit-text-size-adjust: 100%; }

	.pc{ display: none !important; }

	.wrap{ width: 100%; padding-left: 2rem; padding-right: 2rem; }
	.row{ flex-wrap: wrap; }

	header{ position: static; height: 6rem; }
	header > .logo{ width: 5rem; margin-right: 1rem; }
	header > .logo img{ width: 100%; }
	header .site-ttl{ font-size: 1.6rem; line-height: 1.4; }
	header .site-ttl small{ display: block; font-size: 1.2rem; }

	nav{ display: block; padding: 13.5rem 2rem 5rem; overflow: scroll; }
	nav .inner{ width: 100%; display: block; padding: 0; background: none; }
	nav .inner .logo{ display: flex; align-items: center; height: 6rem; position: absolute; top: 0; left: 1rem; }
	nav .inner .logo > a{ display: block; width: 5rem; margin-right: 1rem; }
	nav .inner .logo > a img{ width: 100%; }
	nav .inner .site-ttl{ font-size: 1.6rem; line-height: 1.4; }
	nav .inner .site-ttl small{ display: block; font-size: 1.2rem; }
	nav .inner .gnav{ display: flex; flex-wrap: wrap; position: relative; margin-bottom: 15px; }
	nav .inner .gnav:before{ content: ''; width: calc(50% - .5rem); height: 2px; background: var(--base-color); border-radius: 2px; position: absolute; bottom: 0; left: 0; }
	nav .inner .gnav:after{ content: ''; width: calc(50% - .5rem); height: 2px; background: var(--base-color); border-radius: 2px; position: absolute; bottom: 0; right: 0; }
	nav .inner .gnav li{ width: 50%; height: 5rem; display: flex; justify-content: center; align-items: center; position: relative; }
	nav .inner .gnav li:before{ content: ''; width: calc(100% - .5rem); height: 2px; background: var(--base-color); border-radius: 1px; position: absolute; top: 0; left: 0; }
	nav .inner .gnav li:nth-of-type(even):before{ left: auto; right: 0; }
	nav .inner .gnav li:nth-of-type(even):after{ content: ''; width: 2px; height: calc(100% - 1rem); background: var(--base-color); border-radius: 1px; position: absolute; left: -1px; top: 50%; transform: translateY(-50%); }
	nav .inner .gnav li + li{ margin-top: 0; }

	.info-box .left{ width: 100%; margin-bottom: 2rem; }
	.info-box .right{ width: 100%; }

	.treat-list01{ margin-bottom: 5rem; }
	.treat-list01 a{ width: 100%; padding: 2.5rem 4rem 2rem; }
	.treat-list01 a:before{ width: 10rem; height: 10rem; }
	.treat-list01 a:nth-of-type(1):before{ background-image: url(../images/common/webp/treat-pic01-sp.webp); }
	.treat-list01 a:nth-of-type(2):before{ background-image: url(../images/common/webp/treat-pic02-sp.webp); }
	.treat-list01 a + a{ margin-top: 5.5rem; }
	.treat-list01 a dl dt{ width: 13.5rem; margin-bottom: 3rem; }
	.treat-list01 a dl dt span:before{ width: 14rem; height: 2.4rem; bottom: -.4rem; }

	.treat-list02 li{ width: 10rem; margin-right: calc((100% - 10rem * 3) / 2); }
	.treat-list02 li:nth-of-type(3n){ margin-right: 0; }
	.treat-list02 li:nth-of-type(n+4){ margin-top: 3rem; }
	.treat-list02 li a img{ width: 100%; }

	footer{ padding-top: 5rem; }
	footer > .logo{ display: block; width: 30rem; margin-bottom: 3.5rem; }
	footer > .logo img{ width: 100%; }
	footer .info-box{ margin-bottom: 4rem; }
	footer .bg-navy{ background: url(../images/common/webp/footer-bg02-sp.webp) var(--base-color) no-repeat right top 2.8rem/22rem; padding: 6.5rem 0 8rem; }
	footer .sitemap{ flex-wrap: wrap; justify-content: flex-start; padding-left: 3.2rem; margin-bottom: 5rem; }
	footer .sitemap > ul + ul{ margin: 3.5rem 0 0 0; }
	footer .sitemap > ul > li .child > ul + ul{ margin-left: 1.2rem; }

	.menu-btn{ width: 6rem; height: 6rem; align-items: flex-start; flex-wrap: wrap; background: var(--base-color); color: #fff; top: 0; right: 0; padding-top: 1rem; }
	.menu-btn > span{ order: 2; width: 100%; text-align: center; margin-right: 0; }
	.menu-btn .inner{ margin: 0 auto; }
	.menu-btn .inner span{ background: #fff; }
	.menu-btn.active .inner span:nth-of-type(1){ top: 50%; transform: translateY(-50%) rotate(45deg); }
	.menu-btn.active .inner span:nth-of-type(3){ bottom: 50%; transform: translateY(50%) rotate(-45deg); }

	.float-btn{ width: 100%; display: flex; position: fixed; bottom: 0; left: 0; z-index: 9969; background: var(--base-color); border-top: solid 2px; color: #fff; }
	.float-btn li{ height: 6rem; width: calc((100% - 5.5rem) / 2); font-size: 1.8rem; }
	.float-btn li + li{ border-left: solid 2px; }
	.float-btn li:last-of-type{ width: 5.5rem; border-left: solid 1px; }	
	.float-btn li a{ width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; }
	.float-btn li:nth-of-type(1) a span{ padding-left: 1.8rem; letter-spacing: 0; background: url(../images/common/icon-tel01.svg) no-repeat center left/1.15rem; }
	.float-btn li:nth-of-type(2) a span{ padding-left: 2.2rem; background: url(../images/common/icon-resv01.svg) no-repeat left center/1.35rem; }
	.float-btn li:last-of-type a img{ width: 2.5rem; }
}

/*20221110*/
.mb40 {
    margin-bottom: 40px;
}

/*//20221110*/
.recruit img{width: 33.5rem;
padding-top: 20px;}

.recruit2 img{width: 33.5rem;
padding-top: 20px;
padding-bottom: 90px;}

.menu-btn2 {
    position: fixed;
    top: 24px;
    right: 11rem;
    z-index: 9980;
    display: flex;
    align-items: center;
    cursor: pointer;
}
