@charset "UTF-8";

/* tokens */
:root{
  /* color */
  --navy:       #003876;
  --navy-deep:  #00264F;
  --ink:        #1D2329;
  --ink-sub:    #5A6169;
  --paper:      #FFFFFF;
  --base:       #F4F4F4;
  --base-rgb:   244, 244, 244;
  --ground:     var(--base);
  --line:       #D6D6D6;
  --on-navy:    #FFFFFF;
  --yellow:     #FFD84D;
  --yellow-hi:  #FFE58A;
  --gold:       var(--yellow);
  --gold-hi:    var(--yellow-hi);
  --gold-deep:  #A8874A;

  /* font */
  --font-sans: "Noto Sans JP", -apple-system, "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
  --font-head: "Zen Kaku Gothic New", var(--font-sans);
  --font-en:   "din-2014", "DIN Alternate", "Barlow", var(--font-sans);

  /* layout */
  --sp: 375px;
  --u: calc(min(100vw, 480px) / 375);
  --gutter: calc(var(--u) * 20);
  --header-h: 56px;
  --pane: min(56.8vw, calc(100vw - 510px));
  --stage-zoom: 1.2533;
  --z-stage: 1;
  --z-drawer: 200;
  --z-header: 300;

  --ease: cubic-bezier(.22,.61,.36,1);
  --ease-out: cubic-bezier(.16,1,.3,1);
}

/* reset */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body{
  margin:0;
  background:var(--base);
  color:var(--ink);
  font-family:var(--font-sans);
  font-size:14px; line-height:2; font-weight:400;
  -webkit-font-smoothing:antialiased;
  overflow-x:clip;
}
img{ max-width:100%; height:auto; vertical-align:bottom; }
a{ color:inherit; text-decoration:none; }
ul,ol,dl,dd{ margin:0; padding:0; }
li{ list-style:none; }
h1,h2,h3,p,figure{ margin:0; }
button{ font:inherit; color:inherit; background:none; border:0; padding:0; cursor:pointer; }
em,i,b{ font-style:normal; font-weight:inherit; }
:focus-visible{ outline:2px solid var(--navy); outline-offset:3px; }

/* layout */
.l-stage{
  position:relative; z-index:var(--z-stage);
  width:100%; margin-inline:auto;
  background:var(--base);
  overflow:hidden;
}

/* 共通パーツ */
.c-btn{
  --btn-fill:var(--navy-deep);
  position:relative; isolation:isolate; overflow:hidden;
  display:flex; align-items:center; justify-content:center;
  height:58px; border-radius:999px;
  background:var(--navy); color:var(--on-navy);
  font-size:15px; font-weight:700; letter-spacing:.1em; line-height:1;
}
.c-btn--gold{ --btn-fill:var(--gold-hi); background:var(--gold); color:var(--navy-deep); }
.c-btn::before{
  content:""; position:absolute; inset:0; z-index:-1;
  background:var(--btn-fill);
  scale:0 1; transform-origin:right center;
  transition:scale .55s cubic-bezier(.7,0,.2,1);
}
.c-btn > span:not(.c-btn__arrow){ position:relative; transition:translate .5s var(--ease); }

/* 矢印 */
.dli-arrow-right {
  display: inline-block;
  vertical-align: middle;
  color: #333;
  line-height: 1;
  position: relative;
  width: 1em;
  height: 0.1em;
  background: currentColor;
}

.dli-arrow-right::before {
  content: '';
  width: 0.65em;
  height: 0.65em;
  border: 0.1em solid currentColor;
  border-left: 0;
  border-bottom: 0;
  transform: rotate(45deg);
  transform-origin: top right;
  position: absolute;
  top: 50%;
  right: -0.05em;
  box-sizing: border-box;
}

.c-btn__arrow{
  position:absolute; right:26px; top:50%;
  display:flex; align-items:center; height:1em; margin-top:-.5em;
  font-size:16px; line-height:1;
}
.c-btn__arrow .dli-arrow-right{ color:inherit; }
.c-btn--tel{ gap:14px; }
.c-btn__telNum{ font-family:var(--font-en); font-size:1.3em; font-weight:700; letter-spacing:.04em; }

@media (hover:hover) and (pointer:fine){
  .c-btn:hover::before{ scale:1 1; transform-origin:left center; }
  .c-btn:hover > span:not(.c-btn__arrow){ translate:-4px 0; }
  .c-btn:hover .c-btn__arrow{ animation:arrow-loop .7s cubic-bezier(.7,0,.2,1); }
}
@keyframes arrow-loop{
  0%   { translate:0 0; opacity:1; }
  45%  { translate:1.1em 0; opacity:0; }
  46%  { translate:-1.1em 0; opacity:0; }
  100% { translate:0 0; opacity:1; }
}

/* No.1バッジ */
.c-badge{ position:relative; width:100%; }
.c-badge__laurel{ display:block; width:100%; height:auto; }
.c-badge__text{
  position:absolute; inset:0 23% 3%;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  color:var(--navy); text-align:center; line-height:1.2;
}
.c-badge__cat{ font-size:calc(var(--u) * 6.6); font-weight:700; letter-spacing:.02em; white-space:nowrap; color:var(--ink); }
.c-badge__years{
  margin-top:.35em;
  font-family:var(--font-head); font-size:calc(var(--u) * 10.5); font-weight:900; letter-spacing:.06em; line-height:1;
}
.c-badge__no{
  font-family:var(--font-en); font-size:calc(var(--u) * 24); font-weight:700; letter-spacing:-.01em; line-height:1;
}
.c-badge__note{
  margin-top:calc(var(--u) * 1);
  font-size:calc(var(--u) * 6.5); letter-spacing:.02em; line-height:1.3; color:var(--ink-sub);
  text-align:center; white-space:nowrap;
}

/* ヘッダー / ドロワー */
.p-header{
  position:fixed; top:0; left:0; z-index:var(--z-header);
  width:100%;
  background:transparent;
  transition:translate .35s cubic-bezier(.4,0,.2,1);
}
.p-header.is-hidden{ translate:0 -100%; }
.p-header__inner{
  display:flex; align-items:center; justify-content:space-between;
  height:var(--header-h); padding-inline:20px;
}
.p-header__logo{ position:relative; display:block; }
.p-header__logo img{ display:block; width:118px; height:auto; transition:opacity .3s ease; }
.p-header__logoImg--white{ position:absolute; left:0; top:0; opacity:0; }
.p-header.is-drawer-open .p-header__logoImg{ opacity:0; }
.p-header.is-drawer-open .p-header__logoImg--white{ opacity:1; }
.p-header__burger{ position:relative; width:32px; height:22px; flex:none; }
.p-header__burger span{
  position:absolute; right:0; height:1.5px; background:var(--navy);
  transition:width .3s ease, top .3s ease, rotate .3s ease, background-color .3s ease;
}
.p-header__burger span:nth-child(1){ top:6px; width:32px; }
.p-header__burger span:nth-child(2){ top:15px; width:20px; }
.p-header__burger.is-open span:nth-child(1){ top:11px; width:28px; rotate:20deg; }
.p-header__burger.is-open span:nth-child(2){ top:11px; width:28px; rotate:-20deg; }
.p-header__burger.is-open span{ background:#fff; }

.p-drawer{
  position:fixed; inset:0; z-index:var(--z-drawer);
  background:var(--navy); color:var(--on-navy);
  padding-top:var(--header-h); overflow-y:auto;
  opacity:0; visibility:hidden;
  transition:opacity .35s ease, visibility .35s ease;
}
.p-drawer.is-open{ opacity:1; visibility:visible; }
.p-drawer__inner{ padding:40px 20px 48px; }
.p-drawer__list li{ border-bottom:1px solid rgba(255,255,255,.16); }
.p-drawer__list a{
  display:flex; align-items:baseline; gap:18px;
  padding:20px 0;
  font-size:16px; font-weight:500; letter-spacing:.08em; line-height:1.4;
}
.p-drawer__list span{ font-family:var(--font-en); font-size:12px; font-weight:700; color:var(--yellow); letter-spacing:.1em; }
.p-drawer__cta{ margin-top:40px; }

/* KV */
.p-kv{ position:relative; padding-top:var(--header-h); background:var(--base); }

/* タイトル */
.p-kv__head{
  position:relative; z-index:2;
  padding:calc(var(--u) * 12) var(--gutter) 0;
}
.p-kv__title-wrap{ position:relative; }
.p-kv__title{ font-weight:400; line-height:1; color:var(--ink); }
.p-kv__title-sub{ display:flex; align-items:center; gap:calc(var(--u) * 8); }
.p-kv__cozy{ width:calc(var(--u) * 70); height:auto; }
.p-kv__owner{
  font-family:var(--font-head); font-size:calc(var(--u) * 15); font-weight:700; letter-spacing:.16em;
  white-space:nowrap;
}
.p-kv__title-main{
  display:block; margin-top:calc(var(--u) * 10); margin-left:-.04em;
  font-family:var(--font-head); font-size:calc(var(--u) * 42); font-weight:700; letter-spacing:.04em;
  white-space:nowrap;
}

.p-kv__badge{
  position:absolute; right:calc(var(--u) * -2); top:calc(var(--u) * -6);
  width:calc(var(--u) * 96);
}
.p-kv__badgeImg{ display:block; width:100%; height:auto; }

/* 日程 */
.p-kv__info{
  display:flex; align-items:center; justify-content:space-between; gap:calc(var(--u) * 10);
  margin-top:calc(var(--u) * 14);
}
.p-kv__dates{ display:flex; align-items:center; line-height:1; white-space:nowrap; color:var(--navy); }
.p-kv__day{ display:flex; align-items:flex-end; }
.p-kv__day b{ font-family:var(--font-en); font-size:calc(var(--u) * 33); font-weight:700; letter-spacing:0; line-height:.78; }
.p-kv__day i{
  margin-left:calc(var(--u) * 3);
  font-family:var(--font-en); font-size:calc(var(--u) * 8.5); font-weight:700; letter-spacing:.14em; line-height:1;
  writing-mode:vertical-rl;
}
.p-kv__dash{
  flex:none; width:calc(var(--u) * 20); height:1px; margin-inline:calc(var(--u) * 8);
  background:currentColor;
}

/* 外観写真 */
.p-kv__visual{
  position:relative; z-index:1; overflow:hidden;
  margin-top:calc(var(--u) * -6);
  height:clamp(calc(var(--u) * 260), calc(100svh - var(--header-h) - var(--u) * 290), calc(var(--u) * 380));
}
.p-kv__photo{
  display:block; width:100%; height:100%;
  object-fit:cover; object-position:50% 74%;
  transform-origin:50% 60%;
  backface-visibility:hidden;
}
.p-kv__visual::before,
.p-kv__visual::after{
  content:""; position:absolute; z-index:1; left:0; right:0; pointer-events:none;
}
.p-kv__visual::before{
  top:0; height:18%;
  background:linear-gradient(180deg,
    rgb(var(--base-rgb)) 0%,
    rgba(var(--base-rgb), .8) 30%,
    rgba(var(--base-rgb), .3) 70%,
    rgba(var(--base-rgb), 0) 100%);
}
.p-kv__visual::after{
  bottom:0; height:24%;
  background:linear-gradient(180deg,
    rgba(var(--base-rgb), 0) 0%,
    rgba(var(--base-rgb), .5) 45%,
    rgba(var(--base-rgb), .9) 75%,
    rgb(var(--base-rgb)) 94%);
}

/* 特典 + CTA */
.p-offer{
  position:relative; z-index:2;
  margin-top:calc(var(--u) * -30);
  padding:0 var(--gutter) calc(var(--u) * 18);
  text-align:center; color:var(--ink);
}
.p-offer__target{
  display:inline-block;
  padding:calc(var(--u) * 4) calc(var(--u) * 12);
  border:1px solid var(--navy); background:var(--paper); color:var(--navy);
  font-size:calc(var(--u) * 11); font-weight:700; letter-spacing:.12em; line-height:1.4;
}
.p-offer__cond{
  margin-top:calc(var(--u) * 8);
  font-size:calc(var(--u) * 13.5); font-weight:700; letter-spacing:.06em; line-height:1.4;
}
.p-offer__amp{ font-family:var(--font-en); font-weight:700; white-space:pre; }
.p-offer__amount{
  display:flex; align-items:baseline; justify-content:center;
  margin-top:calc(var(--u) * 2);
  line-height:1; white-space:nowrap;
}
.p-offer__what{ margin-right:calc(var(--u) * 6); font-size:calc(var(--u) * 12.5); font-weight:700; letter-spacing:.06em; }
.p-offer__max{
  align-self:center; margin-right:calc(var(--u) * 5);
  padding:calc(var(--u) * 4) calc(var(--u) * 3);
  background:var(--navy); color:var(--on-navy);
  font-size:calc(var(--u) * 10.5); font-weight:700; letter-spacing:.12em; line-height:1;
  writing-mode:vertical-rl;
  translate:0 calc(var(--u) * 3);
}
.p-offer__num{
  padding-inline:.04em;
  font-family:var(--font-en); font-weight:700;
  font-size:calc(var(--u) * 50); letter-spacing:0;
  color:var(--navy);
  background:linear-gradient(transparent 58%, var(--yellow) 58%, var(--yellow) 86%, transparent 86%);
}
.p-offer__unit{
  margin-left:calc(var(--u) * 3);
  font-size:calc(var(--u) * 13.5); font-weight:700; letter-spacing:.06em;
}
.p-offer__cta{
  height:calc(var(--u) * 54);
  margin-top:calc(var(--u) * 14);
  font-size:calc(var(--u) * 15);
}
.p-offer__cta .c-btn__arrow{ right:calc(var(--u) * 26); font-size:calc(var(--u) * 16); color:var(--yellow); }

/* くの字の矢印 */
.dli-chevron-down {
  display: inline-block;
  vertical-align: middle;
  color: #333;
  line-height: 1;
  width: 1em;
  height: 1em;
  border: 0.1em solid currentColor;
  border-left: 0;
  border-bottom: 0;
  box-sizing: border-box;
  transform: translateY(-25%) rotate(135deg);
}

/* セクション共通 */
.p-sec{
  position:relative;
  padding:calc(var(--u) * 48) var(--gutter);
  background:var(--paper);
}
.p-event.p-sec{ padding-top:calc(var(--u) * 32); }
.p-house.p-sec,
.p-about.p-sec,
.p-reserve.p-sec{ background:var(--base); }
.p-reserve.p-sec.is-alt{ background:var(--paper); }
.p-sec__lead{
  margin-top:calc(var(--u) * 24);
  font-size:calc(var(--u) * 14); line-height:2; letter-spacing:.04em;
}
.c-heading{ text-align:left; }
.p-page .c-heading{ text-align:center; }
.c-heading__en{
  display:inline-flex; align-items:center; gap:calc(var(--u) * 10);
  font-family:var(--font-en); font-size:calc(var(--u) * 11); font-weight:700; letter-spacing:.28em; line-height:1;
  color:var(--navy);
}
.c-heading__en::before{ content:""; width:calc(var(--u) * 16); height:1px; background:currentColor; }
.p-page .c-heading__en::after{ content:""; width:calc(var(--u) * 16); height:1px; background:currentColor; }
.c-heading__ja{
  margin-top:calc(var(--u) * 12);
  font-family:var(--font-head); font-size:calc(var(--u) * 25); font-weight:700; letter-spacing:.08em; line-height:1.4;
}
.c-dummy-img{
  display:grid; place-items:center;
  background:repeating-linear-gradient(135deg, #E4E4E4 0 10px, #DDDDDD 10px 20px);
  color:var(--ink-sub);
  font-size:calc(var(--u) * 12); font-weight:700; letter-spacing:.1em;
}
.c-dummy-tag{
  display:inline-block; margin-left:.6em; padding:0 .5em;
  border:1px solid #BDBDBD;
  font-size:.75em; font-weight:700; line-height:1.6; color:#8A8A8A; vertical-align:.1em;
}
.c-btn--ghost{ --btn-fill:rgba(0,56,118,.06); background:transparent; color:var(--navy); border:1px solid var(--navy); }

/* イベント概要 */
.p-event__table{ margin-top:calc(var(--u) * 28); border-top:1px solid var(--line); }
.p-event__row{
  display:grid; grid-template-columns:calc(var(--u) * 72) 1fr; gap:calc(var(--u) * 12);
  padding:calc(var(--u) * 14) 0;
  border-bottom:1px solid var(--line);
  font-size:calc(var(--u) * 14); line-height:1.7;
}
.p-event__row dt{ font-weight:700; color:var(--navy); }
.p-event__note{ display:block; margin-top:calc(var(--u) * 4); font-size:calc(var(--u) * 12); line-height:1.7; color:var(--ink-sub); }

/* お家の紹介 */
.p-house__list{ display:grid; gap:calc(var(--u) * 48); margin-top:calc(var(--u) * 36); }
.p-house__img{ display:block; width:100%; height:auto; aspect-ratio:3 / 2; object-fit:cover; }
.p-house__num{
  margin-top:calc(var(--u) * 18);
  font-family:var(--font-en); font-size:calc(var(--u) * 12); font-weight:700; letter-spacing:.2em; line-height:1;
  color:var(--navy);
}
.p-house__ttl{ margin-top:calc(var(--u) * 8); font-family:var(--font-head); font-size:calc(var(--u) * 19); font-weight:700; letter-spacing:.04em; line-height:1.5; }
.p-house__txt{ margin-top:calc(var(--u) * 10); font-size:calc(var(--u) * 14); line-height:2; letter-spacing:.04em; }

/* 担当者コメント */
.p-staff__card{
  display:grid; grid-template-columns:calc(var(--u) * 104) 1fr; align-items:start; gap:calc(var(--u) * 16);
  margin-top:calc(var(--u) * 36);
}
.p-staff__img{ display:block; width:100%; height:auto; aspect-ratio:3 / 4; object-fit:cover; }
.p-staff__body{ min-width:0; }
.p-staff__role{ font-size:calc(var(--u) * 11); font-weight:700; letter-spacing:.1em; color:var(--navy); line-height:1.4; }
.p-staff__name{ margin-top:calc(var(--u) * 4); font-family:var(--font-head); font-size:calc(var(--u) * 18); font-weight:700; letter-spacing:.12em; line-height:1.4; }
.p-staff__txt{ margin-top:calc(var(--u) * 12); font-size:calc(var(--u) * 13); line-height:1.9; }

/* 石山工務店について */
.p-about__badge{ width:calc(var(--u) * 160); margin:calc(var(--u) * 24) auto 0; }
.p-about__badge img{ display:block; width:100%; height:auto; }
.p-about__body{ margin-top:calc(var(--u) * 24); }
.p-about__body > p{ font-size:calc(var(--u) * 14); line-height:2.1; letter-spacing:.04em; }
.p-about__body > p + p{ margin-top:calc(var(--u) * 16); }

/* 来場特典 */
.p-gift__card{ margin-top:calc(var(--u) * 36); }
.p-gift__coupon{ display:block; width:100%; height:auto; }
.p-gift__cond{ margin-top:calc(var(--u) * 18); border-top:1px solid var(--line); }
.p-gift__cond div{
  display:grid; grid-template-columns:calc(var(--u) * 56) 1fr; gap:calc(var(--u) * 10);
  padding:calc(var(--u) * 12) 0; border-bottom:1px solid var(--line);
  font-size:calc(var(--u) * 13.5); line-height:1.7;
}
.p-gift__cond dt{ font-weight:700; color:var(--navy); }
.p-gift__notes{ margin-top:calc(var(--u) * 14); }
.p-gift__notes li{ font-size:calc(var(--u) * 11.5); line-height:1.8; color:var(--ink-sub); }


/* 拡大アイコン */
.dli-zoom-in {
  display: inline-block;
  vertical-align: middle;
  color: #333;
  line-height: 1;
  width: 0.7em;
  height: 0.7em;
  border: 0.1em solid currentColor;
  border-radius: 50%;
  box-sizing: content-box;
  position: relative;
}

.dli-zoom-in::before {
  content: '';
  position: absolute;
  top: calc(85.35534% + 0.07071em);
  left: calc(85.35534% + 0.07071em);
  width: 0.336em;
  height: 0.1em;
  background: currentColor;
  border-radius: 0 0.1em 0.1em 0;
  transform: translateY(-50%) rotate(45deg);
  transform-origin: left center;
}

.dli-zoom-in > span {
  width: 58%;
  height: 0.1em;
  background: currentColor;
  border-radius: 0.1em;
  position: relative;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
}

.dli-zoom-in > span::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: inherit;
  border-radius: inherit;
  transform: rotate(90deg);
}

.dli-plus {
  display: inline-block;
  vertical-align: middle;
  color: #333;
  line-height: 1;
  width: 1em;
  height: 0.1em;
  background: currentColor;
  border-radius: 0.1em;
  position: relative;
}

.dli-plus::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: inherit;
  border-radius: inherit;
  transform: rotate(90deg);
}

.dli-minus {
  display: inline-block;
  vertical-align: middle;
  color: #333;
  line-height: 1;
  width: 1em;
  height: 0.1em;
  background: currentColor;
  border-radius: 0.1em;
}

.dli-close {
  display: inline-block;
  vertical-align: middle;
  color: #333;
  line-height: 1;
  width: 1em;
  height: 0.1em;
  background: currentColor;
  border-radius: 0.1em;
  position: relative;
  transform: rotate(45deg);
}

.dli-close::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: inherit;
  border-radius: inherit;
  transform: rotate(90deg);
}

/* 間取り */
.p-plan{ margin-top:calc(var(--u) * 56); }
.p-plan__ttl{ font-family:var(--font-head); font-size:calc(var(--u) * 19); font-weight:700; letter-spacing:.04em; line-height:1.5; }
.p-plan__fig{ margin-top:calc(var(--u) * 16); background:var(--paper); }
.p-plan__zoom{ position:relative; display:block; width:100%; padding:0; border:0; background:none; cursor:zoom-in; }
.p-plan__zoom img{ display:block; width:100%; height:auto; }
.p-plan__hint{
  position:absolute; right:8px; bottom:8px;
  display:flex; align-items:center; gap:7px;
  padding:6px 10px;
  background:rgba(0, 38, 79, .86); color:var(--on-navy);
  font-size:11px; font-weight:500; letter-spacing:.06em; line-height:1;
}
.p-plan__hint .dli-zoom-in{ color:var(--on-navy); font-size:12px; }

.p-zoom{
  position:fixed; inset:0;
  width:100%; max-width:none; height:100%; max-height:none;
  margin:0; padding:68px 0 0; border:0;
  background:var(--navy-deep); color:var(--on-navy);
}
.p-zoom::backdrop{ background:rgba(0,0,0,.6); }
.p-zoom[open]{ display:flex; flex-direction:column; justify-content:center; }
.p-zoom__scroller{
  flex:0 1 auto;
  max-height:calc(100% - 150px);
  overflow:auto; -webkit-overflow-scrolling:touch; overscroll-behavior:contain;
  touch-action:pan-x pan-y;
  background:var(--paper);
}
.p-zoom__scroller img{ display:block; width:calc(var(--z, 1) * 100%); max-width:none; height:auto; }
.p-zoom__ctrl{
  display:flex; align-items:center; justify-content:center; gap:14px;
  margin-top:16px;
}
.p-zoom__step{
  display:grid; place-items:center;
  width:44px; height:44px;
  border:1px solid rgba(255,255,255,.6); border-radius:50%;
  background:none; color:inherit;
  font-size:16px; line-height:0; cursor:pointer;
}
.p-zoom__step .dli-plus,
.p-zoom__step .dli-minus{ color:var(--paper); }
.p-zoom__step:disabled{ opacity:.3; cursor:default; }
.p-zoom__rate{ min-width:4em; text-align:center; font-family:var(--font-en); font-size:15px; letter-spacing:.05em; }
.p-zoom__hint{ margin-top:14px; text-align:center; font-size:12px; letter-spacing:.05em; color:rgba(255,255,255,.7); }
.p-zoom__x{
  position:absolute; top:12px; right:12px; z-index:2;
  display:grid; place-items:center;
  width:48px; height:48px;
  border:0; background:var(--paper); border-radius:50%;
  box-shadow:0 2px 10px rgba(0,0,0,.35);
  font-size:20px; line-height:0; cursor:pointer;
}
.p-zoom__x .dli-close{ color:var(--ink); }
.p-zoom__close{
  align-self:center;
  width:min(300px, calc(100% - 2 * var(--gutter))); height:50px; margin-top:16px;
  border:1px solid var(--paper); background:none;
  color:var(--paper); font-size:15px; font-weight:700; letter-spacing:.1em; cursor:pointer;
  transition:background-color .3s ease;
}
.p-zoom__close:hover{ background:rgba(255,255,255,.08); }
@media (min-width:1024px){
  .p-zoom__scroller{ align-self:center; width:min(1400px, calc(100% - 80px)); }
}
/* 予約フォーム */
.u-hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.p-form{ margin-top:calc(var(--u) * 28); }
.p-form__items{ display:grid; gap:calc(var(--u) * 24); }
.p-form__item{ margin:0; padding:0; border:0; min-width:0; }
.p-form__label{
  display:flex; align-items:center; gap:calc(var(--u) * 8);
  margin-bottom:calc(var(--u) * 10); padding:0;
  font-size:calc(var(--u) * 14); font-weight:700; letter-spacing:.06em; line-height:1.4;
}
.p-form__req,
.p-form__any{
  flex:none; padding:calc(var(--u) * 3) calc(var(--u) * 6);
  font-size:calc(var(--u) * 10); font-weight:700; letter-spacing:.08em; line-height:1;
}
.p-form__req{ border:1px solid var(--navy); background:var(--navy); color:#fff; }
.p-form__any{ border:1px solid #A8A8A8; color:var(--ink-sub); }
.p-form__input,
.p-form__select{
  width:100%; height:calc(var(--u) * 52);
  padding:0 calc(var(--u) * 14);
  border:1px solid #CFCFCF;
  background:var(--paper); color:var(--ink);
  font:inherit; font-size:max(16px, calc(var(--u) * 15)); letter-spacing:.02em;
  border-radius:0;
  appearance:none; -webkit-appearance:none;
  transition:border-color .2s;
}
.p-form__input::placeholder{ color:#A9AEB3; }
.p-form__input:focus,
.p-form__select:focus{ outline:2px solid var(--navy); outline-offset:-1px; border-color:var(--navy); }
.p-form__selectWrap{ position:relative; }
.p-form__select{ padding-right:calc(var(--u) * 40); cursor:pointer; }
.p-form__selectIcon{
  position:absolute; right:calc(var(--u) * 16); top:50%;
  display:flex; align-items:center; height:1em; margin-top:-.5em;
  font-size:calc(var(--u) * 9); line-height:1; pointer-events:none;
}
.p-form__selectIcon .dli-chevron-down{ color:var(--navy); }

.p-form__choices{ display:grid; grid-template-columns:repeat(auto-fit, minmax(calc(var(--u) * 96), 1fr)); gap:calc(var(--u) * 8); }
.p-form__choice{ position:relative; cursor:pointer; }
.p-form__choice input{ position:absolute; opacity:0; inset:0; margin:0; cursor:pointer; }
.p-form__choice span{
  display:flex; align-items:center; justify-content:center;
  height:calc(var(--u) * 48); padding:0 calc(var(--u) * 8);
  border:1px solid #CFCFCF;
  background:var(--paper);
  font-size:calc(var(--u) * 14); font-weight:700; letter-spacing:.04em; line-height:1.3; text-align:center;
  transition:background-color .2s, border-color .2s, color .2s;
}
.p-form__choice input:checked + span{ background:var(--navy); border-color:var(--navy); color:#fff; }
.p-form__choice input:focus-visible + span{ outline:2px solid var(--navy); outline-offset:2px; }
.p-form__choice.is-closed{ cursor:not-allowed; }
.p-form__choice.is-closed input{ cursor:not-allowed; }
.p-form__choice.is-closed span{ flex-direction:column; gap:2px; border-color:#E0E0E0; background:#EDEDED; color:#9A9A9A; }
.p-form__choice.is-closed small{ font-size:calc(var(--u) * 10); font-weight:700; letter-spacing:.08em; line-height:1; }
.p-form__closedNote{ margin-top:calc(var(--u) * 10); font-size:calc(var(--u) * 12.5); line-height:1.8; }
.p-form__tel{ display:inline-block; margin-left:.4em; font-family:var(--font-en); font-size:1.15em; font-weight:700; letter-spacing:.04em; color:var(--navy); text-decoration:underline; text-underline-offset:3px; }

.p-form__checks{ display:grid; grid-template-columns:repeat(3, 1fr); gap:calc(var(--u) * 14) calc(var(--u) * 12); padding-top:calc(var(--u) * 4); }
.p-form__check{
  position:relative; display:flex; align-items:center; gap:calc(var(--u) * 10);
  font-size:calc(var(--u) * 14); font-weight:500; line-height:1.4; cursor:pointer;
}
.p-form__check input{ position:absolute; opacity:0; inset:0; margin:0; cursor:pointer; }
.p-form__checkMark{
  position:relative; flex:none;
  width:calc(var(--u) * 18); height:calc(var(--u) * 18);
  border:1px solid #A8A8A8; background:#fff;
  transition:background-color .2s, border-color .2s;
}
.p-form__checkMark::after{
  content:""; position:absolute; left:32%; top:12%;
  width:32%; height:58%;
  border:solid #fff; border-width:0 2px 2px 0;
  rotate:45deg; opacity:0;
}
.p-form__check input:checked ~ .p-form__checkMark{ background:var(--navy); border-color:var(--navy); }
.p-form__check input:checked ~ .p-form__checkMark::after{ opacity:1; }
.p-form__check input:focus-visible ~ .p-form__checkMark{ outline:2px solid var(--navy); outline-offset:2px; }
.p-form__labelNote{ font-size:calc(var(--u) * 11.5); font-weight:400; letter-spacing:.04em; color:var(--ink-sub); }

.p-form__agree{ margin-top:calc(var(--u) * 32); text-align:center; }
.p-form__policy{ font-size:calc(var(--u) * 12.5); line-height:1.8; }
.p-form__policy a{ color:var(--navy); text-decoration:underline; text-underline-offset:3px; }
.p-form__check--agree{ display:inline-flex; margin-top:calc(var(--u) * 12); font-weight:700; }

.p-form__submit{ width:100%; height:calc(var(--u) * 58); margin-top:calc(var(--u) * 32); font-size:calc(var(--u) * 16); }
.p-form__submit .c-btn__arrow{ right:calc(var(--u) * 26); font-size:calc(var(--u) * 16); color:var(--yellow); }

.p-form__value{
  padding:calc(var(--u) * 12) calc(var(--u) * 14);
  background:var(--base);
  font-size:calc(var(--u) * 15); line-height:1.6; word-break:break-all;
}
.p-form__err{
  padding:calc(var(--u) * 16) calc(var(--u) * 18);
  background:#FBEDEB; color:#B3261E;
  font-size:calc(var(--u) * 13.5); line-height:1.8;
}
.p-form__err li::before{ content:"・"; }

.p-reserve__closed{
  margin-top:calc(var(--u) * 28);
  padding:calc(var(--u) * 28) calc(var(--u) * 20);
  background:var(--paper);
  text-align:center;
}
.p-reserve__closedTxt{ font-size:calc(var(--u) * 15); font-weight:700; line-height:1.8; letter-spacing:.04em; }
.p-reserve__tel{ height:calc(var(--u) * 56); margin-top:calc(var(--u) * 20); font-size:calc(var(--u) * 15); }

/* 確認・完了 */
.grecaptcha-badge{ visibility:hidden; }
.p-form__recaptcha{ margin-top:calc(var(--u) * 20); font-size:calc(var(--u) * 11); line-height:1.8; color:var(--ink-sub); text-align:center; }
.p-form__recaptcha a{ text-decoration:underline; }
.p-page.p-sec{ min-height:calc(100svh - 120px); padding-top:calc(var(--header-h) + var(--u) * 48); background:var(--base); }
.p-page .p-sec__lead{ text-align:center; }
.p-page .p-form__value{ background:var(--paper); }
.p-page__actions{ display:grid; gap:calc(var(--u) * 12); margin-top:calc(var(--u) * 32); }
.p-page__actions .p-form__submit{ margin-top:0; }
.p-page__actions .c-btn{ height:calc(var(--u) * 56); font-size:calc(var(--u) * 15); }
.p-page__box{
  margin-top:calc(var(--u) * 32);
  padding:calc(var(--u) * 22) calc(var(--u) * 20);
  background:var(--paper);
}
.p-page__boxTtl{ font-weight:700; font-size:calc(var(--u) * 15); letter-spacing:.06em; text-align:center; }
.p-page__box .p-event__table{ margin-top:calc(var(--u) * 14); }
.p-page__note{ margin-top:calc(var(--u) * 12); font-size:calc(var(--u) * 11.5); color:var(--ink-sub); line-height:1.7; }

/* フッター */
.p-footer{
  padding:calc(var(--u) * 40) var(--gutter) calc(var(--u) * 28);
  border-top:1px solid var(--line);
  background:var(--base);
  text-align:center;
}
.p-footer__logo{ display:inline-block; }
.p-footer__logo img{ width:calc(var(--u) * 128); height:auto; }
.p-footer__links{ display:flex; justify-content:center; gap:calc(var(--u) * 20); margin-top:calc(var(--u) * 20); }
.p-footer__links a{ font-size:calc(var(--u) * 12); letter-spacing:.06em; text-decoration:underline; text-underline-offset:4px; text-decoration-color:var(--line); }
.p-footer__copy{ margin-top:calc(var(--u) * 20); font-size:calc(var(--u) * 10.5); color:var(--ink-sub); letter-spacing:.06em; }

/* KV 入場アニメーション */
.js:not(.is-split) .p-kv__head{ visibility:hidden; }

@media (prefers-reduced-motion:no-preference){
  .js .c-char{
    display:inline-block;
    opacity:0; translate:0 .32em; filter:blur(10px);
  }
  .js.is-loaded .c-char{
    opacity:1; translate:0 0; filter:blur(0);
    transition:
      opacity .9s var(--ease) var(--d, 0s),
      translate 1.2s var(--ease-out) var(--d, 0s),
      filter 1s var(--ease) var(--d, 0s);
  }

  .js .p-kv__photo{ scale:1.12; opacity:0; filter:brightness(1.08) saturate(.7); will-change:scale, filter, opacity; }
  .js.is-loaded .p-kv__photo{
    scale:1; opacity:1; filter:brightness(1) saturate(1);
    transition:scale 3.4s var(--ease-out), opacity 1.4s var(--ease) .2s, filter 2.2s var(--ease);
  }

  .js [data-blur]{ opacity:0; translate:0 .3em; filter:blur(8px); }
  .js.is-loaded [data-blur]{
    opacity:1; translate:0 0; filter:blur(0);
    transition:opacity .9s var(--ease) var(--d, 0s), translate 1.2s var(--ease-out) var(--d, 0s), filter 1s var(--ease) var(--d, 0s);
  }
  .js .p-kv__dash{ scale:0 1; transform-origin:left center; }
  .js.is-loaded .p-kv__dash{ scale:1 1; transition:scale .8s cubic-bezier(.65,0,.25,1) 1.35s; }

  .js .c-badge__laurel{ opacity:0; scale:.86; }
  .js.is-loaded .c-badge__laurel{ opacity:1; scale:1; transition:opacity 1.2s var(--ease) 1.1s, scale 1.6s var(--ease-out) 1.1s; }

  .js [data-kv]{ opacity:0; translate:0 16px; }
  .js.is-loaded [data-kv]{
    opacity:1; translate:0 0;
    transition:opacity 1s var(--ease) 1.8s, translate 1.2s var(--ease-out) 1.8s;
  }
}

/* セクション表示 */
@media (prefers-reduced-motion:no-preference){
  .js .p-sec .c-heading__ja:not(.is-in) .c-char{ opacity:0; translate:0 .32em; filter:blur(10px); transition:none; }
  .js .p-sec .c-heading__ja.is-in .c-char{
    opacity:1; translate:0 0; filter:blur(0);
    transition:
      opacity .9s var(--ease) var(--d, 0s),
      translate 1.2s var(--ease-out) var(--d, 0s),
      filter 1s var(--ease) var(--d, 0s);
  }
  .js [data-rv]{ opacity:0; translate:0 24px; filter:blur(8px); }
  .js [data-rv].is-in{
    opacity:1; translate:0 0; filter:blur(0);
    transition:opacity 1s var(--ease) var(--d, 0s), translate 1.3s var(--ease-out) var(--d, 0s), filter 1.1s var(--ease) var(--d, 0s);
  }
}

/* レスポンシブ */
/* タブレット */
@media (min-width:481px) and (max-width:1023px){
  .l-stage{ max-width:480px; }
  .p-header__inner,
  .p-drawer__inner{ max-width:480px; margin-inline:auto; }
}

/* PC：スプリットレイアウト */
.p-sidenav{ display:none; }

@media (min-width:1024px){
  body{ background:var(--ground); padding-left:var(--pane); }

  .l-stage{
    width:var(--sp);
    zoom:var(--stage-zoom);
    margin-inline:0;
    outline:1px solid rgba(0,0,0,.06);
  }
  .p-header,
  .p-drawer{ display:none !important; }
  :root{ --u:1px; }
  .p-kv{ padding-top:0; }
  .p-kv__head{ padding-top:28px; }
  .p-kv__visual{ height:clamp(250px, calc(100svh / var(--stage-zoom) - 308px), 420px); }

  .p-sidenav{
    display:block;
    position:fixed; top:0; left:0; bottom:0;
    width:var(--pane);
    background:var(--ground);
    z-index:var(--z-header);
  }
  .p-sidenav__inner{
    display:flex; flex-direction:column;
    height:100%;
    padding:44px 0 48px 8.78vw;
  }
  .p-sidenav__logo{ width:fit-content; margin-left:-5.27vw; }
  .p-sidenav__logo img{ width:clamp(150px,12vw,200px); }

  .p-sidenav__event{ margin-top:clamp(28px,min(8vw,8vh),128px); }
  .p-sidenav__ttl{ font-family:var(--font-head); font-weight:700; line-height:1; color:var(--ink); }
  .p-sidenav__sub{
    display:flex; align-items:center; gap:clamp(8px,.7vw,12px);
    font-size:clamp(14px,1.17vw,20px); letter-spacing:.16em; white-space:nowrap;
  }
  .p-sidenav__sub img{ width:clamp(68px,5.6vw,96px); height:auto; }
  .p-sidenav__main{
    display:block; margin-top:clamp(12px,1vw,18px); margin-left:-.04em;
    font-size:clamp(44px,min(4.4vw,8.4vh),74px); letter-spacing:.04em; white-space:nowrap;
  }

  .p-sidenav__info{
    display:flex; align-items:center; gap:clamp(20px,2vw,36px);
    margin-top:clamp(18px,1.6vw,28px);
  }
  .p-sidenav__dates{ display:flex; align-items:center; line-height:1; white-space:nowrap; color:var(--navy); }
  .p-sidenav__day{ display:flex; align-items:flex-end; }
  .p-sidenav__day b{ font-family:var(--font-en); font-size:clamp(32px,2.9vw,50px); font-weight:700; line-height:.78; }
  .p-sidenav__day i{
    margin-left:clamp(3px,.25vw,5px);
    font-family:var(--font-en); font-size:clamp(9px,.7vw,12px); font-weight:700; letter-spacing:.14em; line-height:1;
    writing-mode:vertical-rl;
  }
  .p-sidenav__dash{ flex:none; width:clamp(20px,1.8vw,32px); height:1px; margin-inline:clamp(8px,.7vw,12px); background:currentColor; }

  .p-sidenav__nav{ margin-top:clamp(24px,min(4vw,5vh),64px); }
  .p-sidenav__list{ width:clamp(320px,30vw,520px); border-top:1px solid var(--line); }
  .p-sidenav__list li{ border-bottom:1px solid var(--line); }
  .p-sidenav__list a{
    display:flex; align-items:baseline; gap:24px;
    padding:clamp(12px,min(1.4vw,2.1vh),24px) 0;
    font-size:clamp(15px,1.17vw,20px); font-weight:500;
    letter-spacing:.08em; line-height:1.4;
    transition:translate .3s var(--ease);
  }
  .p-sidenav__list a span{
    font-family:var(--font-en); font-size:.72em; letter-spacing:.1em; color:var(--ink-sub);
    transition:color .3s ease;
  }
  .p-sidenav__list a:hover{ translate:6px 0; }
  .p-sidenav__list a:hover span{ color:var(--gold-deep); }

  .p-sidenav__cta{
    width:clamp(320px,30vw,520px);
    height:clamp(56px,4.4vw,72px);
    margin-top:clamp(20px,min(2.9vw,3.6vh),48px);
  }
}

@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation-duration:.001ms !important; transition-duration:.001ms !important; }
}