@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Libre+Bodoni:wght@400&family=Noto+Serif+JP:wght@300;400&family=Roboto:wght@700&display=swap');
@import url(reset.css);

/* common */
/* -------------------------------------------------------- */
html,body {font-variant-ligatures:none;}
html {font-size:62.5%;}
body {font-size:14px; font-size:1.4rem; font-weight:300; font-family:'Noto Serif JP', serif; color:#000; text-align:center; -webkit-text-size-adjust:100%; text-size-adjust:100%; background:none;}

h1, h2, h3, h4, h5, h6, h7 {line-height:1.2;}
p, li, dt, dd, th, td, address, blockquote, div {line-height:1.6;}
input, select, option, textarea, button {font-size:14px; font-size:1.4rem; font-weight:300; font-family:'Noto Serif JP', serif; line-height:1.4; vertical-align:middle; color:inherit; outline:none;}
input[type='submit'],input[type='reset'],input[type='button'], button {color:inherit; cursor:pointer; -ms-appearance:none; -webkit-appearance:none; appearance:none;}
:placeholder-shown {color:#ccc;}
::-webkit-input-placeholder {color:#ccc;}
:-moz-placeholder {color:#ccc; opacity:1;}
::-moz-placeholder {color:#ccc; opacity:1;}
:-ms-input-placeholder {color:#ccc;}

strong {font-weight:bold;}
ol {list-style-type:decimal; margin-left:2.2em;}
img {max-width:100%; width:auto; height:auto; line-height:0; vertical-align:top; border:0; display:inline;}

a {color:#000; text-decoration:underline;}
a:hover {color:#000; text-decoration:none;}

.parallax {opacity:0; transform:translate3d(0,15px,0);}
.parallax.on {opacity:1; transform:translate3d(0,0,0); transition:opacity 1.0s 0.3s ease, transform 1.0s 0.3s ease;}


/* decision */
/* -------------------------------------------------------- */
#bpCheck {display:none;}

body .pc {display:block;}
br.pc, span.pc, img.pc {display:inline;}
body .sp, br.sp, span.sp, img.sp {display:none;}

a.off {pointer-events:none; cursor:default; opacity:0.3;}
a.tel {pointer-events:none; cursor:default;}
body.mobile a.tel {pointer-events:auto; cursor:pointer;}

.cfix::before,
.cfix::after {display:table; content:" ";}
.cfix::after {clear:both;}

@media screen and (max-width:767px){
	#bpCheck {display:block;}

	body .pc, br.pc, span.pc, img.pc {display:none;}
	body .sp {display:block;}
	br.sp, span.sp, img.sp {display:inline;}
}


/* container */
/* -------------------------------------------------------- */
#container {width:100%; overflow:hidden;}

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


/* header */
/* -------------------------------------------------------- */
#header {width:250px; height:100%; box-sizing:border-box; position:fixed; top:0; right:0; z-index:300;}
#header .logo {width:125px; margin:0 auto; padding:40px 0;}
#header .nav {text-align:left; padding:0 15px 0 40px;}
#header .nav li {font-size:1.3rem; line-height:1; padding:0.75em 0;}
#header .nav a {text-decoration:none; color:#000;}
#header .nav2 {display:none;}
#header .nav3 {display:none;}

#gNav {width:100%; height:calc(100% - 170px - 230px); position:absolute; top:120px; left:0; overflow:auto;}

#gNavBtn {width:45px; height:46px; position:fixed; top:0; right:0; z-index:310; cursor:pointer; display:none; transition-property:opacity;}
#gNavBtn > span {width:56%; height:2px; margin:-1px 0 0 0; display:block; position:absolute; top:50%; left:22%; transition-property:background-color;}
#gNavBtn > span::before,
#gNavBtn > span::after {content:''; width:100%; height:2px; background-color:rgba(0,0,0,1); display:block; position:absolute; left:0;}
#gNavBtn > span::before {top:-3px; transition-property:top;}
#gNavBtn > span::after {bottom:-3px; transition-property:bottom;}
#gNavBtn:hover {opacity:0.7;}
body.load #gNavBtn,
body.load #gNavBtn > span::before,
body.load #gNavBtn > span::after {transition-duration:0.3s; transition-delay:0s; transition-timing-function:ease;}

#gNavCheck {display:none;}
#gNavCheck:checked + #header #gNavBtn > span {background-color:rgba(0,0,0,0);}
#gNavCheck:checked + #header #gNavBtn > span::before {top:0; transform:rotate(30deg); transition-property:transform;}
#gNavCheck:checked + #header #gNavBtn > span::after {bottom:0; transform:rotate(-30deg); transition-property:transform;}

@media screen and (max-width:1194px){
    #header {width:100%; height:45px; background-color:rgba(255,255,255,0.9); box-sizing:border-box;}
    #header .logo {width:269px; margin:0 auto; padding:16px 0;}
    #header .nav {padding:45px 0 0 0;}
    #header .nav li {font-size:1.5rem; padding:1.3em 0;}
    #header .nav2 {text-align:left; margin:15px 0 0 0; display:block;}
    #header .nav2 a {width:155px; height:62px; font-size:1.1rem; letter-spacing:0.2em; text-decoration:none; color:#000; background:-webkit-linear-gradient(left, #45ff6a, #d5ff5c); background:linear-gradient(to right, #45ff6a, #d5ff5c); display:flex; justify-content:center; align-items:center;}

    #header .nav3 {text-align:left; margin:15px 0 0 0; display:block;}
    #header .nav3 a {width:155px; height:62px; font-size:1.1rem; letter-spacing:0.2em; text-decoration:none; color:#000; background:-webkit-linear-gradient(left, #FF8080, #FFACAC); background:linear-gradient(to right, #FF8080, #FFACAC); display:flex; justify-content:center; align-items:center;}

    #gNav {width:258px; height:100vh; padding:0 10px 0 16px; background-color:rgba(255,255,255,0.9); box-sizing:border-box; position:fixed; top:0; left:auto; right:-258px; transition:right 0.6s ease;}
    #header #gNavBtn {display:block;}
    #gNavCheck:checked + #header #gNav {right:0;}
}

@media screen and (max-width:767px){
	#header {width:100%; height:45px; background-color:rgba(255,255,255,0.9); box-sizing:border-box;}
	#header .logo {width:169px; margin:0 auto; padding:16px 0;}
	#header .nav {padding:45px 0 0 0;}
	#header .nav li {font-size:1.1rem; padding:1.0em 0;}
	#header .nav2 {text-align:left; margin:15px 0 0 0; display:block;}
    #header .nav2 a {width:155px; height:62px; font-size:1.1rem; letter-spacing:0.2em; text-decoration:none; color:#000; background:-webkit-linear-gradient(left, #45ff6a, #d5ff5c); background:linear-gradient(to right, #45ff6a, #d5ff5c); display:flex; justify-content:center; align-items:center;}
    
    #header .nav3 {text-align:left; margin:15px 0 0 0; display:block;}
    #header .nav3 a {width:155px; height:62px; font-size:1.1rem; letter-spacing:0.2em; text-decoration:none; color:#000; background:-webkit-linear-gradient(left, #FF8080, #FFACAC); background:linear-gradient(to right, #FF8080, #FFACAC); display:flex; justify-content:center; align-items:center;}

	#gNav {width:188px; height:100vh; padding:0 10px 0 16px; background-color:rgba(255,255,255,0.9); box-sizing:border-box; position:fixed; top:0; left:auto; right:-188px; transition:right 0.6s ease;}
	#header #gNavBtn {display:block;}
	#gNavCheck:checked + #header #gNav {right:0;}
}


/* footer */
/* -------------------------------------------------------- */
#footer .inr1 {margin:0 250px 0 0; padding:80px 0 750px 0; background:url(../img/common/f_bg.jpg) no-repeat right bottom; background-size:1350px auto;}
#footer .inr1 .txt1 {font-size:1.4rem; line-height:2.4;}
#footer .inr1 .txt1 dd {font-size:1.4rem; line-height:1.7; margin:30px 0 0 0;}
#footer .inr1 .txt1 dd.txt {margin-top:1.0em; letter-spacing:0.1em;}
#footer .inr1 .txt1 dd .tel {font-size:3.7rem; line-height:1; letter-spacing:0.16em; text-decoration:none; color:#000; padding:0 0 0 60px; display:inline-block; position:relative;}
#footer .inr1 .txt1 dd .tel::before {content:''; width:44px; height:44px; margin:-22px 0 0 0; background:url(../img/common/icon_fd.svg) no-repeat center center; background-size:100% auto; display:block; position:absolute; top:60%; left:0;}
#footer .inr1 .txt2 {margin:40px 0 0 0; display:flex; flex-wrap:wrap; justify-content:center; align-items:center;}
#footer .inr1 .txt2 li {font-size:1.3rem; font-weight:400; padding:0 20px; box-sizing:border-box;}
#footer .inr1 .txt2 a {text-decoration:none; color:#000; transition:opacity 0.3s ease;}
#footer .inr1 .txt2 a:hover {opacity:0.7;}
#footer .inr1 .txt2 a span {padding:0 0 0 30px; display:inline-block; position:relative;}
#footer .inr1 .txt2 a span::before {content:''; width:20px; height:20px; margin:-10px 0 0 0; background-repeat:no-repeat; background-position:center center; background-size:cover; display:block; position:absolute; top:50%; left:0;}
#footer .inr1 .txt2 a span.icon1::before {background-image:url(../img/common/icon_01.svg);}
#footer .inr1 .txt2 a span.icon2::before {background-image:url(../img/common/icon_02.svg);}
#footer .inr1 .txt3 {max-width:250px; margin:50px auto 0 auto;}
#footer .inr1 .txt3 a {transition:opacity 0.3s ease;}
#footer .inr1 .txt3 a:hover {opacity:0.7;}

#footer .inr2 {width:250px; position:fixed; bottom:0; right:0; z-index:301;}
#footer .inr2 .copy {font-size:1.1rem; font-weight:400; line-height:1; letter-spacing:0.1em; text-align:center; padding:1.5em 0;}
#footer .inr2 .pagetop {border-top:solid 1px #808080;}
#footer .inr2 .pagetop a {width:100%; height:60px; background:url(../img/common/arrow_01.png) no-repeat center center; background-size:20px auto; display:block; transition:opacity 0.3s ease;}
#footer .inr2 .pagetop a:hover {opacity:0.7;}
#footer .inr2 .request a {width:100%; height:80px; font-size:1.6rem; letter-spacing:0.2em; text-decoration:none; color:#000; background:-webkit-linear-gradient(left, #45ff6a, #d5ff5c); background:linear-gradient(to right, #45ff6a, #d5ff5c); display:flex; justify-content:center; align-items:center; transition:opacity 0.3s ease;}
#footer .inr2 .request a:hover {opacity:0.7;}
#footer .inr2 .reserve a {width:100%; height:80px; font-size:1.6rem; letter-spacing:0.2em; text-decoration:none; color:#000; background:-webkit-linear-gradient(left, #FF8080, #FFACAC); background:linear-gradient(to right, #FF8080, #FFACAC); display:flex; justify-content:center; align-items:center; transition:opacity 0.3s ease;}
#footer .inr2 .reserve a:hover {opacity:0.7;}


#footer .inr3 {display:none;}

@media screen and (max-width:1600px){
	#footer .inr1 {background-position:center bottom;}
}

@media screen and (max-width:1194px){
    #footer .inr1 {margin:0; padding:50px 0 133.0vw 0; background:url(../img/common/f_bg_sp.jpg) no-repeat center bottom; background-size:100% auto;}
    #footer .inr1 .txt1 {font-size:1.5rem; line-height:2.0;}
    #footer .inr1 .txt1 dd {font-size:1.5rem; line-height:1.7; margin:25px 0 0 0;}
    #footer .inr1 .txt1 dd.txt {margin-top:1.4em; letter-spacing:0.1em;}
    #footer .inr1 .txt1 dd .tel {font-size:3.0rem; padding:0 0 0 42px;}
    #footer .inr1 .txt1 dd .tel::before {width:32px; height:32px; margin:-16px 0 0 0; top:55%; left:0;}
    #footer .inr1 .txt2 li {font-size:1.5rem; padding:0 15px;}
    #footer .inr1 .txt3 {max-width:212px; margin:40px auto 0 auto;}

    #footer .inr2 {width:auto; padding:0 0 80px 0; position:static;}
    #footer .inr2 .copy {font-size:1.4rem; padding:0;}
    #footer .inr2 .pagetop {display:none;}
    #footer .inr2 .request {display:none;}
    #footer .inr2 .reserve {display:none;}

    #footer .inr3 {display:block;}
    #footer .inr3 .fix-nav {width:100%; border-top:solid 1px #4d4d4d; display:flex; position:fixed; bottom:-50px; left:0; z-index:290; transition:bottom 0.3s ease;}
    #footer .inr3 .fix-nav > li {width:25%; border-left:solid 1px #4d4d4d; box-sizing:border-box; position:relative;}
    #footer .inr3 .fix-nav > li:nth-of-type(1) {order:1; border-left:none;}
    #footer .inr3 .fix-nav > li:nth-of-type(2) {order:2; }
    #footer .inr3 .fix-nav > li:nth-of-type(3) {order:3;}
    #footer .inr3 .fix-nav > li:nth-of-type(4) {order:4;}
    #footer .inr3 .fix-nav > li:nth-of-type(5) {order:5;}
    #footer .inr3 .fix-nav > li:nth-of-type(1) a {letter-spacing:-0.1em; color:#000; background:-webkit-linear-gradient(left, #45ff6a, #d5ff5c); background:linear-gradient(to right, #45ff6a, #d5ff5c);}
    #footer .inr3 .fix-nav > li:nth-of-type(2) a {letter-spacing:-0.1em; color:#000; background:-webkit-linear-gradient(left, #FF8080, #FFACAC); background:linear-gradient(to right, #FF8080, #FFACAC);}
    #footer .inr3 .fix-nav a {width:100%; height:49px; font-size:1.4rem; line-height:1; text-align:center; text-decoration:none; color:#000; padding:32px 0 0 0; background-color:rgba(255,255,255,0.9); box-sizing:border-box; display:block;}
    #footer .inr3 .fix-nav a::before {content:''; width:20px; height:20px; margin:6px 0 0 -10px; background-repeat:no-repeat; background-position:center center; background-size:cover; display:block; position:absolute; top:0; left:50%;}
    #footer .inr3 .fix-nav a.icon3::before {background-image:url(../img/common/icon_03.svg);}
    #footer .inr3 .fix-nav a.icon4::before {background-image:url(../img/common/icon_04.svg);}
    #footer .inr3 .fix-nav a.icon5::before {background-image:url(../img/common/icon_05.svg);}
    #footer .inr3 .fix-nav a.icon6::before {background-image:url(../img/common/icon_06.svg);}
    #footer .inr3 .fix-nav a.pagetop::before {width:100%; height:100%; margin:0; background:url(../img/common/arrow_01.png) no-repeat center center; background-size:30px auto; left:0;}

    body.move #footer .inr3 .fix-nav {bottom:0;}
}

@media screen and (max-width:767px){
	#footer .inr1 {margin:0; padding:50px 0 133.0vw 0; background:url(../img/common/f_bg_sp.jpg) no-repeat center bottom; background-size:100% auto;}
	#footer .inr1 .txt1 {font-size:1.1rem; line-height:2.0;}
	#footer .inr1 .txt1 dd {font-size:1.1rem; line-height:1.7; margin:25px 0 0 0;}
	#footer .inr1 .txt1 dd.txt {margin-top:1.0em; letter-spacing:0.1em;}
	#footer .inr1 .txt1 dd .tel {font-size:2.6rem; padding:0 0 0 42px;}
	#footer .inr1 .txt1 dd .tel::before {width:32px; height:32px; margin:-16px 0 0 0; top:55%; left:0;}
	#footer .inr1 .txt2 li {font-size:1.1rem; padding:0 15px;}
	#footer .inr1 .txt3 {max-width:212px; margin:40px auto 0 auto;}

	#footer .inr2 {width:auto; padding:0 0 80px 0; position:static;}
	#footer .inr2 .copy {font-size:1.0rem; padding:0;}
	#footer .inr2 .pagetop {display:none;}
    #footer .inr2 .request {display:none;}
    #footer .inr2 .reserve {display:none;}
	
	#footer .inr3 {display:block;}
	#footer .inr3 .fix-nav {width:100%; border-top:solid 1px #4d4d4d; display:flex; position:fixed; bottom:-50px; left:0; z-index:290; transition:bottom 0.3s ease;}
    #footer .inr3 .fix-nav > li {width:25%; border-left:solid 1px #4d4d4d; box-sizing:border-box; position:relative;}
    #footer .inr3 .fix-nav > li:nth-of-type(1) {order:1; border-left:none;}
    #footer .inr3 .fix-nav > li:nth-of-type(2) {order:2;}
	#footer .inr3 .fix-nav > li:nth-of-type(3) {order:3;}
	#footer .inr3 .fix-nav > li:nth-of-type(4) {order:4;}
    #footer .inr3 .fix-nav > li:nth-of-type(5) {order:5;}
    #footer .inr3 .fix-nav > li:nth-of-type(1) a {letter-spacing:-0.1em; color:#000; background:-webkit-linear-gradient(left, #45ff6a, #d5ff5c); background:linear-gradient(to right, #45ff6a, #d5ff5c);}
    #footer .inr3 .fix-nav > li:nth-of-type(2) a {letter-spacing:-0.1em; color:#000; background:-webkit-linear-gradient(left, #FF8080, #FFACAC); background:linear-gradient(to right, #FF8080, #FFACAC);}
	#footer .inr3 .fix-nav a {width:100%; height:49px; font-size:1.0rem; line-height:1; text-align:center; text-decoration:none; color:#000; padding:32px 0 0 0; background-color:rgba(255,255,255,0.9); box-sizing:border-box; display:block;}
	#footer .inr3 .fix-nav a::before {content:''; width:20px; height:20px; margin:6px 0 0 -10px; background-repeat:no-repeat; background-position:center center; background-size:cover; display:block; position:absolute; top:0; left:50%;}
	#footer .inr3 .fix-nav a.icon3::before {background-image:url(../img/common/icon_03.svg);}
	#footer .inr3 .fix-nav a.icon4::before {background-image:url(../img/common/icon_04.svg);}
    #footer .inr3 .fix-nav a.icon5::before {background-image:url(../img/common/icon_05.svg);}
    #footer .inr3 .fix-nav a.icon6::before {background-image:url(../img/common/icon_06.svg);}
	#footer .inr3 .fix-nav a.pagetop::before {width:100%; height:100%; margin:0; background:url(../img/common/arrow_01.png) no-repeat center center; background-size:30px auto; left:0;}

	body.move #footer .inr3 .fix-nav {bottom:0;}
}

/* contents */
/* -------------------------------------------------------- */
#contents {margin:0 250px 0 0;}

.sec {max-width:1350px; margin:0 auto; box-sizing:border-box;}

.bukken-list {max-width:1100px; margin:0 auto;}

.page-ttl {width:100%; height:100vh; background-repeat:no-repeat; background-position:center center; background-size:cover; display:flex; justify-content:center; align-items:center; position:relative;}
.page-ttl::before {content:''; width:100%; height:100%; background:url(../img/common/mv_bg.svg) no-repeat center center; background-size:cover; display:block; position:absolute; top:0; left:0;}
.page-ttl .ttl {position:relative; z-index:5;}
.page-ttl.parallax .ttl {opacity:0; transform:translate3d(0,15px,0);}
.page-ttl.parallax.on .ttl {opacity:1; transform:translate3d(0,0,0); transition:opacity 1.0s 1.0s ease, transform 1.0s 1.0s ease;}

.btn-01 {max-width:400px; height:100px; font-size:1.6rem; letter-spacing:0.1em; text-align:center; text-decoration:none; color:#fff; background:-webkit-linear-gradient(left, #317ca3, #ff8e86); background:linear-gradient(to right, #317ca3, #ff8e86); border-radius:100px; display:flex; justify-content:center; align-items:center; position:relative; transition:opacity 0.3s ease;}
.btn-01:hover {text-decoration:none; color:#fff; opacity:0.7;}
.btn-01::before {content:''; width:30px; height:30px; margin:-15px 0 0 0; background:url(../img/common/arrow_02_w.svg) no-repeat center center; background-size:100% auto; display:block; position:absolute; top:50%; right:45px;}

.btn-02 {max-width:240px; height:60px; font-size:1.2rem; letter-spacing:0.2em; text-align:center; text-decoration:none; color:#000; background:-webkit-linear-gradient(left, #317ca3, #ff8e86); background:linear-gradient(to right, #317ca3, #ff8e86); border-radius:100px; display:flex; justify-content:center; align-items:center; position:relative; transition:opacity 0.3s ease;}
.btn-02:hover {text-decoration:none; color:#000; opacity:0.7;}
.btn-02::before {content:''; width:20px; height:20px; margin:-10px 0 0 0; background:url(../img/common/arrow_02.svg) no-repeat center center; background-size:100% auto; display:block; position:absolute; top:50%; right:20px;}

.ttl-01 {font-size:3.0rem; font-weight:700; font-family:'Roboto', sans-serif; letter-spacing:0.1em; color:#fff;}
.ttl-02 {font-size:2.4rem; font-weight:700; font-family:'Roboto', sans-serif; letter-spacing:0.1em; text-align:center;}

.footer-note {padding:50px 0;}
.footer-note .sec {max-width:870px; padding:0 15px;}
.footer-note .note {text-align:left;}
.footer-note .note > li {font-size:1.2rem; line-height:1.8; padding:0 0 0 1.2em; position:relative;}
.footer-note .note > li::before {content:'※'; position:absolute; top:0; left:0;}

@media screen and (max-width:1194px){
    #contents {margin:0; padding:45px 0 0 0;}

    .sec {padding:0 6.0vw;}

    .bukken-list .sec {padding:0;}

    .page-ttl::before {background-image:url(../img/common/mv_bg_sp.svg);}

    .btn-01 {max-width:200px; height:50px; font-size:1.1rem;}
    .btn-01::before {width:16px; height:16px; margin:-8px 0 0 0; right:20px;}

    .btn-02 {max-width:216px; height:54px; font-size:1.1rem;}
    .btn-02::before {width:16px; height:16px; margin:-8px 0 0 0;}

    .ttl-01 {font-size:2.0rem;}
    .ttl-02 {font-size:1.6rem;}

    .footer-note {padding:20px 0;}
    .footer-note .sec {max-width:100%; padding:0 6.0vw;}
    .footer-note .note > li {font-size:1.0rem;}
}

@media screen and (max-width:767px){
	#contents {margin:0; padding:45px 0 0 0;}
	
	.sec {padding:0 6.0vw;}
	
	.bukken-list .sec {padding:0;}

	.page-ttl::before {background-image:url(../img/common/mv_bg_sp.svg);}

	.btn-01 {max-width:200px; height:50px; font-size:1.1rem;}
	.btn-01::before {width:16px; height:16px; margin:-8px 0 0 0; right:20px;}

	.btn-02 {max-width:216px; height:54px; font-size:1.1rem;}
	.btn-02::before {width:16px; height:16px; margin:-8px 0 0 0;}

	.ttl-01 {font-size:2.0rem;}
	.ttl-02 {font-size:1.6rem;}

	.footer-note {padding:20px 0;}
	.footer-note .sec {max-width:100%; padding:0 6.0vw;}
	.footer-note .note > li {font-size:1.0rem;}
}