*{ box-sizing: border-box; }

html { font-size: 62.5%; }



body{

	font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;

	font-feature-settings: "palt";

	-webkit-font-smoothing: antialiased;

	-moz-osx-font-smoothing: grayscale;

	color: #505050;	

	font-size: 1.5rem;

	font-style: normal;

	font-weight: 400;

	line-height: 1.8;

	letter-spacing: 0.1em;

	text-align: justify;

}



.mincho{ font-family: 'Noto Serif JP', serif; font-weight: 500; }

.garamond{ font-family: adobe-garamond-pro, serif; font-weight: 400; }



/**** 

adobe使用フォント

font-family: adobe-garamond-pro, serif;

font-weight: 400;



google使用フォント

font-family: 'Noto Serif JP', serif;

font-weight: 500;

***/



a{ transition: .5s; }

a:hover{ opacity: .7; }

br{ line-height: inherit; }

p{ line-height: 2; }

span, a, strong, small{ color: inherit; font-size: inherit; font-family: inherit; font-weight: inherit; letter-spacing: inherit; }



.wrap{ width: 800px; margin: 0 auto; position: relative; }

.wrap.midium{ width: 900px; }

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



.linkwrap{ width: 100%; height: 100%; display: block; position: absolute; top: 0; left: 0; z-index: 10; }

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



.sp{ display: none; }



.btn{ width: 25rem; height: 4rem; display: flex; justify-content: center; align-items: center; font-size: 1.4rem; font-family: 'Noto Serif JP', serif; font-weight: 500; color: #fff; background: #9c8d64; position: relative; }

.btn:after{ content: ''; width: .66rem; height: .8rem; background: url(../png/arrow01.png) no-repeat center/contain; position: absolute; top: 50%; right: 1rem; transform: translateY(-50%); }

.btn.short{ width: 20rem; }

.btn:hover{ background: #5c80a5; opacity: 1; }



.arrow{ font-size: 1.4rem; font-family: 'Noto Serif JP', serif; font-weight: 500; color: #9c8d64; letter-spacing: .08em; display: table; padding-right: 2.7rem; position: relative; }

.arrow:before{ content: ''; width: 2rem; height: 2rem; background: url(../png/arrow03.png) no-repeat center/contain; position: absolute; top: 50%; right: 0; transform: translateY(-50%); transition: .5s; }

.arrow:after{ content: ''; width: 2rem; height: 2rem; background: url(../png/arrow04.png) no-repeat center/contain; position: absolute; top: 50%; right: 0; transform: translateY(-50%); transition: .5s; opacity: 0; }

.arrow:hover{ opacity: 1; color: #5c80a5; }

.arrow:hover:before{ opacity: 0; }

.arrow:hover:after{ opacity: 1; }



header{ width: 100%; height: 7.4rem; display: flex; justify-content: space-between; align-items: center; padding: 0 10rem 0 3rem; }

header .logo{ display: block; line-height: 0; }

header .head-info{ display: flex; color: #fff; }

header .head-info li + li{ margin-left: 2rem; }

header .head-info li:nth-of-type(1) a{ width: 18rem; height: 4rem; display: flex; justify-content: center; align-items: center; background: #5c80a5; }

header .head-info li:nth-of-type(2) a{ width: 14rem; height: 4rem; display: flex; justify-content: center; align-items: center; background: #9c8d64; font-size: 1.3rem; }

header .head-info li:nth-of-type(1) a span{ padding: 0 1.5rem 0 1.6rem; background-image: url(../png/icon-tel01.png), url(../png/arrow01.png); background-size: .93rem, .66rem; background-position: left center, right center; background-repeat: no-repeat, no-repeat; }

header .head-info li:nth-of-type(2) a span{ padding: 0 1.6rem 0 2.1rem; background-image: url(../png/icon-resv01.png), url(../png/arrow01.png); background-size: 1.54rem, .66rem; background-position: left center, right center; background-repeat: no-repeat, no-repeat; }



header.clone{ position: fixed; top: -7.4rem; left: 0; z-index: 9978; background: rgba(255, 255, 255, .85); transition: .5s; }

header.clone.active{ top: 0; }



nav{ width: 33rem; height: calc(100% - 7.4rem); background: rgba(255, 255, 255, .85); position: fixed; bottom: 0; right: -33rem; z-index: 9978; padding: 1.6rem 0 8rem; transition: .5s; overflow-y: scroll; }

nav.active{ right: 0; }

nav > small{ display: block; font-size: 1.3rem; text-align: center; margin-bottom: 5rem; }

nav .gnav{ width: 22rem; margin: 0 auto 7rem; }

nav .gnav li{ font-size: 1.6rem; text-align: center; background: url(../png/border01.png) repeat-x left bottom/auto 2px; line-height: 3; padding-bottom: 2px; }

nav .gnav li:last-of-type{ background: none; }

nav a.tel{ display: table; margin: 0 auto; font-size: 2.6rem; color: #5c80a5; padding-left: 2.2rem; background: url(../png/icon-tel02.png) no-repeat left center/1.3rem; margin-bottom: 1.6rem; }

nav a.tel + p{ display: table; margin: 0 auto; font-size: 1.3rem; line-height: 1.6; }



.hour-table{ width: 37rem; table-layout: fixed; font-size: 1.4rem; }

.hour-table th{ font-weight: 400; vertical-align: middle; letter-spacing: .05em; text-align: right; }

.hour-table td{ text-align: center; vertical-align: middle; }

.hour-table thead th{ width: 11.6rem; height: 3rem; text-align: center; background: #5c80a5; color: #fff; }

.hour-table thead td{ background: #5c80a5; color: #fff; }

.hour-table tbody tr:first-of-type > *{ padding-top: 1rem; }

.hour-table tbody th{ padding-right: 1.5em; }

.hour-table tbody td{ color: #5c80a5; }

.hour-table td:last-of-type{ width: 5rem; padding-right: 1.7rem; }

.hour-table + p{ font-size: 1.3rem; text-align: right; margin-top: .3rem; }

.hour-table ~ a.tel{ display: block; font-size: 2.6rem; text-align: center; color: #5c80a5; background-image: url(../png/border01.png), url(../png/border01.png); background-repeat: repeat-x, repeat-x; background-position: top left, bottom left; background-size: auto 2px, auto 2px; padding: .6rem 0; margin-top: 2.4rem; }

.hour-table ~ a.tel span{ padding-left: 2.4rem; background: url(../png/icon-tel02.png) no-repeat top 55% left/1.32rem; }



.row div.access .head{ font-size: 2rem; color: #5c80a5; background: url(../png/border01.png) repeat-x bottom left/auto 2px; padding-bottom: .8rem; margin-bottom: 1.8rem; }

.row div.access ul li{ font-size: 1.4rem; padding-left: 2.4rem; line-height: 1.6; background-repeat: no-repeat; background-size: 1.48rem; background-position: left top .3rem; }

.row div.access ul li:nth-of-type(1){ background-image: url(../png/icon-access01.png); }

.row div.access ul li:nth-of-type(2){ background-image: url(../png/icon-access02.png); }

.row div.access ul li + li{ margin-top: .8rem; }

.row div.access ul + .btn{ margin-top: 2.5rem; }



.treat-list01{ display: flex; flex-wrap: wrap; margin-bottom: 4rem; margin-top: 10rem; }

.treat-list01 li{ width: 25rem; margin-right: 2.5rem; background: #fff; box-shadow: 4px 8px 10px 0px rgba(0,0,0,0.05); }

.treat-list01 li:nth-of-type(3n){ margin-right: 0; }

.treat-list01 li:nth-of-type(n+4){ margin-top: 2.5rem; }

.treat-list01 li a{ display: block; padding-bottom: 2rem; }

.treat-list01 li picture{ display: block; position: relative; }

.treat-list01 li picture:before{ content: ''; width: 100%; height: 100%; background: #5c80a5; mix-blend-mode: multiply; opacity: .9; position: absolute; top: 0; left: 0; transition: .5s; opacity: 0; }

.treat-list01 li:hover picture:before{ opacity: 1; }

.treat-list01 li img{ display: block; width: 100%; margin-bottom: 1.5rem; }

.treat-list01 li .head{ font-family: 'Noto Serif JP', serif; font-weight: 500; font-size: 1.8rem; color: #1a1a1a; line-height: 1.6; text-align: center; margin-bottom: .7rem; }

.treat-list01 li .head span{ padding-right: 1.2rem; background: url(../png/arrow05.png) no-repeat right top 55%/.66rem; }

.treat-list01 li p:not([class]){ padding: 0 3rem; line-height: 1.8; }



.treat-list02{ display: flex; flex-wrap: wrap; }

.treat-list02 li{ width: 13.7rem; margin-right: 2.8rem; font-size: 1.4rem; text-align: center; letter-spacing: .05em; }

.treat-list02 li:nth-of-type(5n){ margin-right: 0; }

.treat-list02 li:nth-of-type(n+6){ margin-top: 3rem; }

.treat-list02 li a{ display: block; }

.treat-list02 li .icon{ width: 11rem; height: 11rem; line-height: 0; border-radius: 11rem; background: rgba(92, 128, 165, .15); margin-bottom: .8rem; margin-left:auto; margin-right:auto; transition: .5s; }

.treat-list02 li a:hover{ opacity: 1; }

.treat-list02 li a:hover .icon{ background: #5c80a5; }



footer .logo{ display: block; margin: 0 auto 7.5rem; }

footer .foot-info{ margin-bottom: 10rem; }

footer .bg-blue{ background: url(../webp/footer-bg01.webp) no-repeat center/cover; color: #fff; padding: 8.5rem 0 1.2rem; }

footer .sitemap{ justify-content: flex-start; margin-bottom: 9rem; }

footer .sitemap > ul + ul{ margin-left: 10rem; }

footer .sitemap > ul > li{ font-size: 1.4rem; }

footer .sitemap > ul > li + li{ margin-top: 1rem; }

footer .sitemap > ul > li .row{ margin-top: 1rem; }

footer .sitemap > ul > li .row .child + .child{ margin-left: 2rem; }

footer .sitemap > ul > li .row .child li{ font-size: 1.1rem; }

footer .sitemap > ul > li .row .child li:before{ content: '-'; margin-right: .2rem; }

footer .copy{ display: block; font-size: 1.2rem; text-align: center; }



.menu-btn{ position: fixed; top: 2.2rem; right: 3rem; z-index: 9981; cursor: pointer; }

.menu-btn .inner{ width: 4rem; height: 1.5rem; position: relative; }

.menu-btn .inner span{ height: 1px; background: #1a1a1a; position: absolute; left: 0; transition: .5s; }

.menu-btn .inner span:nth-of-type(1){ width: 100%; top: 0; }

.menu-btn .inner span:nth-of-type(2){ width: 2.6rem; top: 50%; transform: translateY(-50%); }

.menu-btn .inner span:nth-of-type(3){ width: 1.3rem; bottom: 0; }

.menu-btn.active .inner span:nth-of-type(2){ left: calc(100% - 2.6rem); }

.menu-btn.active .inner span:nth-of-type(3){ left: calc(100% - 1.6rem); }

.menu-btn > span{ display: block; line-height: 1.4; font-size: 1.4rem; color: #1a1a1a; text-align: center; letter-spacing: .04em; transition: .5s; position: relative; }

.menu-btn > span span{ transition: opacity .5s; }

.menu-btn > span .close{ position: absolute; left: 0; top: 0; opacity: 0; }

.menu-btn.active > span .close{ opacity: 1; }

.menu-btn.active > span .menu{ opacity: 0; }

nav .gnav li.sns_logo {margin-top: 1rem;}

nav .gnav li.sns_logo a img {width: 15%;}

.access .sns_logo {position: relative;margin-top: 2.5rem;}

.access .sns_logo a.i_sns {position: absolute;top: 0;right: 135px;width: 10%;}

.access .sns_logo a.f_sns {position: absolute;top: 0;right: 85px;width: 10%;}



@media(max-width: 768px){

	html{ font-size: 2.66vw; }

	body{ font-size: 1.5rem; }

	p{ line-height: 2; }



	.pc{ display: none !important; }

	.sp{ display: initial; }



	.wrap{ width: 100%; padding-left: 1.75rem; padding-right: 1.75rem; }

	.wrap.midium{ width: 100%; }

	.row{ flex-wrap: wrap; }



	header{ position: absolute; top: 0; left: 0; padding: 1.5rem 1.7rem 0; height: auto; }

	header .logo{ width: 15.3rem; }

	header .logo img{ width: 100%; }



	nav{ width: 100vw; height: 100vh; right: -100vw; padding: 0 0 9rem; }

	nav .logo{ margin: 1.5rem 0 0 1.7rem; width: 15.3rem; display: block; margin-bottom: 3.5rem; }

	nav .logo img{ width: 100%; }

	nav .gnav{ width: 34rem; margin-bottom: 2.6rem; }

	nav .gnav li{ background-size: auto .2rem; padding-bottom: .2rem; }

	nav a.tel + p{ text-align: center; }



	.row div.access .head{ font-size: 1.8rem; }

	.hour-table{ width: 100%; }



	.treat-list01{ margin-bottom: 3rem; margin-top: 7rem; }

	.treat-list01 li{ width: 100%; margin-right: 0; }

	.treat-list01 li:nth-of-type(n+2){ margin-top: 2.5rem; }

	.treat-list01 li img{ height: 13rem; object-fit: cover; object-position: center; }

	.treat-list01 li p:not([class]){ padding: 0 2.75rem; }



	.treat-list02 li{ width: 10.5rem; margin-right: calc((100% - 10.5rem * 3) / 2); }

	.treat-list02 li:nth-of-type(3n){ margin-right: 0; }

	.treat-list02 li:nth-of-type(n+4){ margin-top: 1.25rem; }

	.treat-list02 li .icon{ width: 100%; height: 10.5rem; }

	.treat-list02 li .icon img{ width: 100%; }



	footer .logo{ width: 11.5rem; margin-bottom: .5rem; }

	footer .logo-note{ display: block; font-size: 1.2rem; text-align: center; margin-bottom: 2.15rem; }

	footer .foot-info{ margin-bottom: 5rem; }

	footer .foot-info .left{ display: flex; flex-wrap: wrap; margin-bottom: 1.4rem; }

	footer .foot-info .left .hour-table{ order: 2; }

	footer .foot-info .left .hour-table + p{ order: 3; width: 100%; }

	footer .foot-info .left a.tel{ order: 1; width: 100%; margin: 0 0 2.5rem; }



	footer .bg-blue{ padding: 3.2rem 0 10.5rem; }

	footer .sitemap{ justify-content: space-between; margin-bottom: 0; }

	footer .sitemap > ul{ width: 16rem; }

	footer .sitemap > ul + ul{ margin-left: 0; }

	footer .sitemap > ul > li{ letter-spacing: .03em; border-bottom: solid 1px rgba(255, 255, 255, .2); padding-bottom: .5rem; }

	footer .sitemap > ul > li + li{ margin-top: .5rem; }

	footer .sitemap > ul.sp-wide{ width: 100%; margin-top: .7rem; }

	footer .sitemap > ul.sp-wide > li{ border-bottom: none; }

	footer .sitemap > ul > li .row{ justify-content: flex-start; margin-top: .5rem; }

	footer .copy{ position: fixed; bottom: 0; left: 0; z-index: 9979; width: 100%; height: 2rem; display: flex; justify-content: center; align-items: center; background: #fff; color: #505050; font-size: 1rem; }



	.float-btn{ width: 100%; display: flex; position: fixed; bottom: 2rem; left: 0; z-index: 9979; }

	.float-btn li a{ width: 50vw; height: 5.25rem; display: flex; justify-content: center; align-items: center; color: #fff; text-align: center; }

	.float-btn li:nth-of-type(1) a{ background: #5c80a5; }

	.float-btn li:nth-of-type(2) a{ background: #9c8d64; }

	.float-btn li a dl dt{ font-size: 1.2rem; opacity: .6; line-height: 1.4; }

	.float-btn li:nth-of-type(1) a dl dd{ font-size: 1.6rem; line-height: 1.3; padding-left: 1.5rem; background: url(../png/icon-tel01.png) no-repeat left bottom .3rem/.76rem; }

	.float-btn li:nth-of-type(2) a dl dd{ line-height: 1.4; padding-left: 1.85rem; background: url(../png/icon-resv01.png) no-repeat left bottom .4rem/1.2rem; }



	.menu-btn{ width: 7.5rem; height: 7.5rem; top: 0; right: 0; }

	.menu-btn.color{ background: rgba(255, 255, 255, .85); }

	.menu-btn.color.active{ background: transparent; }

	.menu-btn .inner{ margin: 2.5rem auto 0; }

	.menu-btn > span span{ display: block; width: 100%; text-align: center; }

	

	nav .gnav li.sns_logo a img {width: 12%;}

	.access .sns_logo a.i_sns {right: 80px;width: 12%;}

	.access .sns_logo a.f_sns {right: 25px;width: 12%;}
	
	.treat-list02 li:nth-of-type(6n){ margin-right:0;}
	.treat-list02 li:nth-of-type(5n){ margin-right:calc((100% - 10.5rem * 3) / 2);}

}





.jidv_banner-wrap {

    max-width: 800px;

    margin: -60px auto 60px;

    text-align: left;

}



.jidv_banner-wrap img {

    width: 50%;

}



@media screen and (max-width: 768px) {

    .jidv_banner-wrap {

        width: 100%;

        padding-left: 1.75rem;

        padding-right: 1.75rem;

        margin: 20px auto 0;

    }



    .jidv_banner-wrap img {

        width: 100%;

    }

}