@charset "utf-8";


/*--------------------------------------------------------------

reset & root set

--------------------------------------------------------------*/
*,*::before,*::after { box-sizing: border-box; }
ul,ol,li { margin: 0; padding: 0; list-style: none; }
body,h1,h2,h3,h4,h5,p,figure,blockquote,dl,dd { margin: 0; }
html { scroll-behavior: smooth; }
img { max-width: 100%; height: auto; display: block; }
input,button,textarea,select { font: inherit; }
header,footer,main,aside,picture { display: block; }
@media print {
body { width:1400px; -webkit-transform: scale(.8); transform: scale(.8); transform-origin: 0 0; }
}

/* iOS Safari */
body {-webkit-tap-highlight-color: transparent; background-color: var(--cl-wh);}
/*input,*/
textarea { -webkit-appearance: none;}
input[type="submit"],input[type="button"] { border-radius: 0; -webkit-box-sizing: content-box; -webkit-appearance: button; appearance: button; border: none; box-sizing: border-box; cursor: pointer;}
input[type="submit"]::-webkit-search-decoration, input[type="button"]::-webkit-search-decoration { display: none;}
input[type="submit"]:focus,input[type="button"]:focus { outline-offset: -2px;}
select { -webkit-appearance: none; -moz-appearance: none; appearance: none; border: none; outline: none; background: transparent;}
button, input[type="submit"] { -webkit-appearance: none; -moz-appearance: none; appearance: none; border: none; outline: none;}

/* color */
:root {
    --cl-key: #6266AD;
    --cl-bggr: #E9EADF;
    --cl-txt: #3D3D3D;
    --cl-bk: #000;
    --cl-wh: #fff;
}




/*--------------------------------------------------------------

base set

--------------------------------------------------------------*/
html { font-size:calc(100vw / 37.5); }
body { min-height: 100vh; text-rendering: optimizeSpeed; line-height: 1.6; -webkit-text-size-adjust: 100%; color: var(--cl-txt); font-size: 14px; font-family: YakuHanJPs, 'Noto Sans JP', sans-serif;; font-weight: normal; word-break: break-word; overflow-x: hidden; background-color: var(--cl-bggr); }
a { outline:none; text-decoration:none; color: var(--cl-txt); }
a:not([class]) { text-decoration-skip-ink: auto; }
@media print, screen and (min-width: 799px) {
html { font-size:62.5%; }
}
@media print, screen and (min-width: 1024px) {
body { font-size: 1.6rem; }
a { transition:0.5s; }
a:hover { text-decoration:none; opacity: 0.7; }
a::after { transition:0.5s; }
button:hover { opacity: 0.7; }
}




/*--------------------------------------------------------------

utility

--------------------------------------------------------------*/

/* utility */
.u-inner { max-width: 116rem; margin: 0 auto; padding: 0 20px; }
.u-inner._min { max-width: 104rem; }
.u-only-pc	{ display: none; }
.u-txt-maker { background: linear-gradient(transparent 50%, #FFE488 50%);}
.u-txt-indent { text-indent: -1em; margin-left: 1em; display: inline-block;}
.u-bg-gr { background-color: var(--cl-bggr);}

@media print, screen and (min-width: 799px) {
.u-inner { padding: 0 4rem; }
.u-only-sp	{ display: none ; }
.u-only-tab	{ display: block; }
}
@media print, screen and (min-width: 1024px) {
.u-only-pc	{ display: block; }
.u-only-tab	{ display: none; }
.u-only-pc.u-only-tab	{ display: block; }
}



.c-anchorgoal { display: block; position: relative; font-size: 0px; line-height: 0; margin: 0; padding: 0; z-index: -1; }
.c-anchorgoal a { display: block; position: absolute; height: 8rem; top: -8rem; }

@media screen and (min-width: 1024px) {
.c-anchorgoal { margin: 0; padding: 0; }
.c-anchorgoal a { height: 14rem; top: -14rem; }
}





/*--------------------------------------------------------------

header

--------------------------------------------------------------*/

/* header */
.header { position: fixed; top: 0; left: 0; width: 100%; height: 6rem; background-color: var(--cl-wh); z-index: 100;}
.header-logo { height: 6rem; display: flex; align-items: center; max-width: 16rem; margin-left: 2rem;}
.header-title { display: none; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); font-weight: bold;}

@media print, screen and (min-width: 800px) {
.header { height: 12rem; display: flex; justify-content: space-between;}
.header-logo { height: 12rem; max-width: 35.8rem; margin-left: 4rem;}
}
@media print, screen and (min-width: 1100px) {
.header-title { display: inline-block; font-size: 3.6rem; }
}



/* SPメニューの開閉時に背景スクロールを禁止する */
body.is-open { height: 100%; overflow: hidden; }

/* header-btn */
.header-btn { position: absolute; top: 0; right: 0; -webkit-appearance: none; -moz-appearance: none; appearance: none; border: none; background-color: transparent; cursor: pointer; width: 6rem; height: 6rem; outline: none; transition:0.5s; z-index: 130; cursor: pointer;}
.header-btn::before,
.header-btn::after { content: ""; position: absolute; left: 50%; width: 2rem; height: 2px; background-color: var(--cl-key); transform: translateX(-50%); transition:0.3s; border-radius: 1rem; }
.header-btn::before { top: 2.3rem; }
.header-btn::after  { bottom: 2.3rem; }
.header-btn-line { position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; width: 2rem; height:2px; background-color: var(--cl-key); transition: 0.3s; overflow: hidden; border-radius: 1rem; }
.header-btn.close { background-color: transparent;}
.header-btn.close::before,
.header-btn.close::after {  }
.header-btn.close::before { top: 50%; transform: translate(-50%,0) rotate(45deg); }
.header-btn.close::after  { top: 50%; transform: translate(-50%,0) rotate(-45deg);}
.header-btn.close .header-btn-line { display: none; }

@media print, screen and (min-width: 800px) {
.header-btn { top: 3rem; right: 2rem;}
.header-btn::before,
.header-btn::after { width: 4rem; height: 3px; }
.header-btn-line { width: 4rem; height: 3px; }
.header-btn::before { top: 1.8rem; }
.header-btn::after  { bottom: 1.8rem; }
}


/* headerNav */
.headerNav { opacity: 0; visibility: hidden; transform: scale(0,0,0); position: fixed; top: 6rem; right: 0; width: 100%; padding: 0 0 2rem; z-index: 120; transition: 0.5s; }
.headerNav.is-open { opacity: 1; visibility: visible; transform: scale(1,1,1); }
.spnav-header {  }
.headerNav-menu { width: 100%; margin: 0 0 0 auto; height: 100vh; overflow-y: scroll; background-color: rgba(98,102,173,0.9); }
.headerNav-menu-list { padding-top: 4rem;}
.headerNav-menu-item { position: relative; }
.headerNav-menu-link { display: block; padding: 1.5rem 3rem; color: #FFF; font-size: 1.8rem; }

@media print, screen and (min-width: 800px) {
.headerNav { top: 12rem; }
.headerNav-menu { width: 30%; margin: 0 -2rem 0 auto;  }

}

/* header-sns */
.header-sns-list { position: absolute; top: 0; right: 6rem; display: flex; align-items: center;}
.header-sns-item {  }
.header-sns-link { width: 3.5rem; height: 6rem; display: block; display: flex; align-items: center; justify-content: center;   }
.header-sns-link img { width: 2.5rem;}

@media print, screen and (min-width: 800px) {
.header-sns-list { right: 10rem; }
.header-sns-link { width: 5rem; height: 12rem; }
.header-sns-link img { width: 4rem;}
}


/*--------------------------------------------------------------

footer

--------------------------------------------------------------*/

.footer { padding: 30px 0 40px; text-align: center; background-color: #D0D0D0;}
.footer-sub { font-size: 12px; font-weight: bold; }
.footer-main { font-size: 16px; font-weight: bold;}

.footer-logo { max-width: 26rem; margin: 1rem auto 0;}






/*--------------------------------------------------------------

layout

--------------------------------------------------------------*/

.l-secWrap { padding: 60px 0; }
.l-secWrap + .l-secWrap { margin-top: -60px; }

@media print, screen and (min-width: 800px) {
.l-secWrap { padding: 115px 0; }
.l-secWrap + .l-secWrap { margin-top: -115px; }
}


.l-blockWrap {}
.l-blockWrap-col3._sp { display: flex; flex-wrap: wrap; margin: 0 -6px;}
.l-blockWrap-col3._sp .l-blockWrap-item { width: calc(50% - 12px); margin: 0 6px;}

@media print, screen and (min-width: 800px) {
.l-blockWrap {  display: flex; flex-wrap: wrap; margin: 0 -12px;}
.l-blockWrap-col2 {}
.l-blockWrap-col2 .l-blockWrap-item { width: calc(50% - 25px); margin: 0 12px;}
.l-blockWrap-col3,
.l-blockWrap-col3._sp { }
.l-blockWrap-col3 .l-blockWrap-item,
.l-blockWrap-col3._sp .l-blockWrap-item { width: calc(33.33% - 25px); margin: 0 12px;}

}






/*--------------------------------------------------------------

component

--------------------------------------------------------------*/

/* c-secTitle */
.c-secTitle { margin-bottom: 15px; font-size: 30px; font-weight: bold;}

@media print, screen and (min-width: 800px) {
.c-secTitle { margin-bottom: 30px; font-size: 48px; }
.c-leadTxt { font-size: 18px;}
}







/*--------------------------------------------------------------

content

--------------------------------------------------------------*/

/* kv */
.kv { margin-top: 6rem;}
.kv picture > * { margin: auto; }
@media print, screen and (min-width: 800px) {
.kv { margin-top: 12rem;}
}

/* event */
.event-wrap { display: flex; flex-wrap: wrap; margin: -30px -12px 0;}
.event-item { position: relative; width: 100%; margin: 30px 12px 0;}
.event-item._status-on::before { position: absolute; top: 0; right: 0; content: ""; width: 6rem; height: 6rem; background: url(../../assets/images/event_status_on.svg) no-repeat center / contain; z-index: 2; }
.event-item._status-off::before { position: absolute; top: 0; right: 0; content: ""; width: 6rem; height: 6rem; background: url(../../assets/images/event_status_off.svg) no-repeat center / contain; z-index: 2; }
.event-link { display: block;}
.event-pic { position: relative;}
.event-status { position: absolute; top: 0; right: 0; }
.event-more { cursor: pointer; position: absolute; bottom: 10px; right: 10px; display: inline-flex; align-items: center; justify-content: center; width: 100px; height: 30px; background-color: var(--cl-wh); border: var(--cl-key) 1px solid; border-radius: 40px; color: var(--cl-key); font-size: 12px;}
.event-moreTxt { opacity: 0; visibility: hidden; position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding: 10%; background-color: var(--cl-key); color: var(--cl-wh); transition: 0.3s; z-index: 2;}
.event-moreTxt a { color: var(--cl-wh); text-decoration: underline;}
.event-more-close { cursor: pointer; position: absolute; top: 1rem; right: 1rem;}
.event-moreTxt.is-open { opacity: 1; visibility: visible; }
.event-sub { margin-top: 15px; font-size: 13px; font-weight: bold;}
.event-title { font-size: 22px; font-weight: bold;}
.event-tag { display: flex; margin-top: 10px; }
.event-tag-item { height: 32px;}
.event-tag-link { height: 32px; display: flex; align-items: center; justify-content: center; padding: 6px 14px; background-color: var(--cl-key); color: var(--cl-wh); font-size: 14px;}
.event-tag-link._reserve { height: 32px; display: flex; align-items: center; justify-content: center; padding: 6px 14px; background-color: #DD793C; color: var(--cl-wh); font-size: 14px;}
.event-tag-link._reserve::after { content: ""; display: block; width: 1em; height: 1em; margin-left: 0.5em; background: url(../../assets/images/ico_blank.svg) no-repeat center center / contain;}

@media print, screen and (min-width: 720px) {
.event-item { width: calc(50% - 2.5rem); margin: 3rem 1.2rem 0;}
.event-title { font-size: 24px;}

}
@media print, screen and (min-width: 1024px) {
.event-item { width: calc(33.33% - 2.5rem); margin: 6rem 1.2rem 0;}
.event-title { font-size: 24px;}

}



/* about */
.about-item { margin-top: 30px;}
.about-title { margin-top: 15px; font-size: 24px; font-weight: bold;}
.about-txt { margin-top: 10px;}

@media print, screen and (min-width: 800px) {
.about-wrap { margin-top: 3rem;}
.about-title { font-size: 2.8rem; }
}




/* shop */
.shop-wrap { margin-top: -15px;}
.shop-item { margin-top: 12px !important;}
.shop-title { margin-top: 5px; }

@media print, screen and (min-width: 800px) {
.shop-wrap { margin-top: -3rem !important;}
.shop-item { margin-top: 6rem !important;}
.shop-title { margin-top: 1.5rem; }

}



/* bn */
.bn-item { margin-top: 30px;}

@media print, screen and (min-width: 800px) {
.bn-wrap { margin-top: 10rem !important;}
}



/* access */
.access-map { position: relative; height: 0; margin-top: 30px; padding-top: 42.4%; }
.access-map iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

@media print, screen and (min-width: 800px) {
.access-map { border: var(--cl-wh) 10px solid; padding-top: 48.8%; }
}




/* labo */
.labo-item { margin-top: 15px;}
.labo-about { }
.labo-about-box { margin-top: 30px;}
.labo-about-right { margin-bottom: 20px;}
.labo-about-sub { font-size: 18px;}
.labo-about-txt { margin-top: 10px; font-size: 16px; }

@media print, screen and (min-width: 800px) {
.labo-about { }
.labo-about-box { display: flex; flex-direction: row-reverse; margin-top: 6rem;}
.labo-about-right { width: 100%; max-width: 35.5rem;}
.labo-about-left { width: auto; flex: 1; margin-right: 5rem;}
.labo-about-sub { font-size: 2.8rem;}
.labo-about-txt { margin-top: 1rem; font-size: 1.8rem; line-height: 1.8; letter-spacing: -0.02rem; }
}
@media print, screen and (min-width: 1024px) {
.labo-about-sub { font-size: 3.4rem;}
.labo-about-txt { margin-top: 1rem; font-size: 2.4rem; line-height: 2.24; letter-spacing: -0.02rem; }
}