:root{
  --green:#1e2a23;
  --green-deep:#141d18;
  --cream:#f7efe2;
  --cream-dim:#e8ddcb;
  --red:#b81c22;
  --gold:#c9a961;
  --ink:#231a18;
  --ink-soft:#6b5e56;
  --hair:rgba(35,26,24,.13);
  --hair-l:rgba(247,239,226,.22);
  --mincho:"Shippori Mincho","Hiragino Mincho ProN","Yu Mincho",serif;
  --gothic:"Noto Sans JP","Hiragino Kaku Gothic ProN",sans-serif;
  --pad:clamp(20px,5vw,80px);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;background:var(--cream);color:var(--ink);
  font-family:var(--gothic);font-size:16px;font-weight:400;
  line-height:2;letter-spacing:.04em;
}
img{display:block;max-width:100%}
a{color:inherit}

/* ---------- グローバルメニュー ---------- */
.gnav{
  position:fixed;top:0;left:0;right:0;z-index:50;
  display:flex;align-items:center;justify-content:space-between;
  padding:0 var(--pad);height:66px;
  background:rgba(20,29,24,.0);
  transition:background .5s ease,box-shadow .5s ease;
}
.gnav.is-solid{background:rgba(20,29,24,.94);box-shadow:0 1px 0 var(--hair-l)}
.gnav__logo{
  font-family:var(--mincho);font-size:15px;letter-spacing:.2em;
  color:var(--cream);text-decoration:none;white-space:nowrap;
}
.gnav__list{display:flex;gap:clamp(16px,2.4vw,34px);list-style:none;margin:0;padding:0}
.gnav__list a{
  font-size:11.5px;letter-spacing:.16em;color:var(--cream);
  text-decoration:none;opacity:.82;position:relative;padding-bottom:4px;
}
.gnav__list a::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:1px;
  background:var(--cream);transform:scaleX(0);transform-origin:left;
  transition:transform .4s cubic-bezier(.2,.7,.3,1);
}
.gnav__list a:hover{opacity:1}
.gnav__list a:hover::after{transform:scaleX(1)}
.gnav__tel{
  font-family:var(--mincho);font-size:13px;letter-spacing:.08em;
  color:var(--cream);text-decoration:none;border:1px solid var(--gold);
  padding:7px 15px;border-radius:1px;transition:background .4s;
}
.gnav__tel:hover{background:rgba(201,169,97,.16)}
@media(max-width:860px){
  .gnav__list{display:none}
  .gnav{height:58px}
}

/* ---------- FV ---------- */
.hero{position:relative;height:100svh;min-height:560px;overflow:hidden;background:var(--green-deep)}
.hero__media{position:absolute;inset:0}
.hero__media img{width:100%;height:100%;object-fit:cover;transform:scale(1.06);animation:slowzoom 22s ease-out forwards}
@keyframes slowzoom{to{transform:scale(1)}}
.hero__veil{
  position:absolute;inset:0;
  background:linear-gradient(100deg,rgba(20,29,24,.82) 0%,rgba(20,29,24,.44) 46%,rgba(20,29,24,.66) 100%);
}
.hero__inner{
  position:relative;height:100%;padding:0 var(--pad) 92px;
  display:flex;align-items:center;justify-content:flex-end;
}
.hero__catch{
  writing-mode:vertical-rl;font-family:var(--mincho);font-weight:400;
  color:var(--cream);margin:0;
  font-size:clamp(26px,4.4vw,50px);letter-spacing:.22em;line-height:1.62;
  text-shadow:0 2px 30px rgba(0,0,0,.5);
  opacity:0;animation:riseUp 1.5s .3s cubic-bezier(.2,.7,.3,1) forwards;
}
@keyframes riseUp{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
.hero__mark{
  position:absolute;left:var(--pad);bottom:118px;color:var(--cream);
  opacity:0;animation:riseUp 1.5s .9s cubic-bezier(.2,.7,.3,1) forwards;
}
.hero__mark img{
  display:block;width:clamp(150px,15vw,190px);height:auto;
}
.hero__mark span{display:block;margin-top:12px;font-size:10px;letter-spacing:.36em;color:var(--gold);opacity:.9}
.hero__bar{
  position:absolute;left:0;right:0;bottom:0;background:var(--green-deep);color:var(--cream);
  box-shadow:0 -1px 0 var(--hair-l);
  display:flex;flex-wrap:wrap;align-items:center;justify-content:center;
  gap:clamp(14px,3.4vw,46px);padding:15px var(--pad);
}
.hero__bar b{font-family:var(--mincho);font-weight:400;font-size:15px;letter-spacing:.1em}
.hero__bar small{font-size:13px;letter-spacing:.1em;opacity:.86}
.hero__bar em{font-style:normal;font-size:12.5px;letter-spacing:.14em;opacity:.72}

/* ---------- セクション共通 ---------- */
.sec{padding:clamp(72px,10vw,140px) var(--pad)}
.sec--dark{background:var(--green);color:var(--cream)}
.sec--deep{background:var(--green-deep);color:var(--cream)}
.wrap{max-width:1080px;margin:0 auto}
.wrap--narrow{max-width:760px}
.eyebrow{
  font-size:10px;letter-spacing:.34em;color:var(--red);
  margin:0 0 14px;font-weight:500;
}
.sec--dark .eyebrow,.sec--deep .eyebrow,.rental .eyebrow{color:var(--gold)}
.h2{
  font-family:var(--mincho);font-weight:400;
  font-size:clamp(22px,3vw,33px);letter-spacing:.13em;line-height:1.7;
  margin:0 0 clamp(28px,4vw,48px);
}
.h2::after{
  content:"";display:block;width:36px;height:2px;
  background:var(--red);margin-top:18px;
}
.lead{font-size:16px;line-height:2.3;margin:0;max-width:38em}
.sec--dark .lead,.sec--deep .lead{color:rgba(247,239,226,.86)}
.note{font-size:14px;line-height:1.9;color:var(--ink-soft);margin:18px 0 0}
.sec--dark .note{color:rgba(247,239,226,.6)}

/* reveal */
.rv{opacity:0;transform:translateY(24px);transition:opacity 1s cubic-bezier(.2,.7,.3,1),transform 1s cubic-bezier(.2,.7,.3,1)}
.rv.is-in{opacity:1;transform:none}

/* ---------- はじめての方へ ---------- */
.intro{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,72px);align-items:center}
.intro__figs{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.intro__figs figure{margin:0;overflow:hidden}
.intro__figs img{width:100%;aspect-ratio:3/4;object-fit:cover;transition:transform 1.2s cubic-bezier(.2,.7,.3,1)}
.intro__figs figure:hover img{transform:scale(1.05)}
.intro__figs figure:nth-child(2){margin-top:38px}
@media(max-width:820px){.intro{grid-template-columns:1fr}.intro__figs{order:2}}

/* ---------- 料金 ---------- */
.price{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--hair);border:1px solid var(--hair)}
.price div{background:var(--cream);padding:clamp(24px,3.4vw,38px)}
.price dt{font-size:13px;letter-spacing:.14em;opacity:.74;margin:0}
.price dd{
  margin:12px 0 0;font-family:var(--mincho);font-weight:400;
  font-size:clamp(26px,3.6vw,38px);letter-spacing:.04em;line-height:1.2;
}
.price dd span{font-size:14px;margin-right:2px}
.price dd small{display:block;font-size:13px;letter-spacing:.08em;opacity:.66;margin-top:10px;font-family:var(--gothic);line-height:1.8}
@media(max-width:680px){.price{grid-template-columns:1fr}}

.campaign{display:grid;grid-template-columns:1fr 1fr;gap:clamp(14px,2vw,22px);margin-top:clamp(18px,2.4vw,26px)}
.campaign article{border:1px solid var(--hair);padding:clamp(22px,3vw,32px)}
.campaign h3{
  font-family:var(--mincho);font-weight:400;font-size:18px;letter-spacing:.1em;
  margin:0 0 10px;
}
.campaign p{margin:0;font-size:14px;line-height:2;opacity:.82}
.campaign b{font-family:var(--mincho);font-size:22px;letter-spacing:.04em;font-weight:400}
@media(max-width:680px){.campaign{grid-template-columns:1fr}}

/* ---------- メニュー ---------- */
.menu{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(30px,5vw,70px);align-items:center}
.menu__img{overflow:hidden}
.menu__img img{width:100%;aspect-ratio:4/3;object-fit:cover}
.menu__list{list-style:none;margin:0;padding:0}
.menu__list li{display:flex;align-items:baseline;gap:10px;padding:13px 0;border-bottom:1px solid var(--hair)}
.menu__list li:first-child{border-top:1px solid var(--hair)}
.menu__list dfn{font-style:normal;font-size:14px;letter-spacing:.06em}
.menu__list i{flex:1;border-bottom:1px dotted var(--hair);transform:translateY(-4px)}
.menu__list b{font-family:var(--mincho);font-weight:400;font-size:17px;white-space:nowrap;letter-spacing:.02em}
@media(max-width:820px){.menu{grid-template-columns:1fr}}

/* ---------- ご利用シーン ---------- */
.uses{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,3vw,34px)}
.uses article{border-top:1px solid var(--hair-l);padding-top:22px}
.uses h3{font-family:var(--mincho);font-weight:400;font-size:19px;letter-spacing:.1em;margin:0 0 12px}
.uses p{margin:0;font-size:14px;line-height:2.1;opacity:.8}
@media(max-width:760px){.uses{grid-template-columns:1fr}}

/* ---------- スタッフ ---------- */
.staff{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,2.2vw,26px)}
.staff article{text-align:center}
.staff__ph{
  aspect-ratio:3/4;background:var(--cream-dim);overflow:hidden;position:relative;
  display:flex;align-items:center;justify-content:center;
}
.staff__ph span{font-size:10.5px;letter-spacing:.2em;color:#a6957f}
.staff h3{font-family:var(--mincho);font-weight:400;font-size:15px;letter-spacing:.1em;margin:16px 0 6px}
.staff p{margin:0;font-size:14px;letter-spacing:.06em;color:var(--ink-soft);line-height:1.9}
@media(max-width:760px){.staff{grid-template-columns:repeat(2,1fr)}}

/* ---------- 貸切（フル幅） ---------- */
.rental{position:relative;min-height:78vh;display:flex;align-items:center;overflow:hidden}
.rental img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.rental__veil{position:absolute;inset:0;background:linear-gradient(90deg,rgba(20,29,24,.9) 4%,rgba(20,29,24,.34) 78%)}
.rental__body{position:relative;padding:clamp(56px,8vw,110px) var(--pad);max-width:620px;color:var(--cream)}
.btn{
  display:inline-block;margin-top:30px;padding:15px 34px;
  border:1px solid var(--gold);color:var(--cream);text-decoration:none;
  font-size:12px;letter-spacing:.18em;transition:background .45s,border-color .45s;
}
.btn:hover{background:rgba(201,169,97,.16);border-color:var(--gold)}
.btn--dark{border-color:var(--ink);color:var(--ink)}
.btn--dark:hover{background:var(--ink);color:var(--cream)}

/* ---------- メディア ---------- */
.media{display:flex;flex-wrap:wrap;gap:10px}
.media li{
  list-style:none;border:1px solid var(--hair);padding:11px 20px;
  font-size:14px;letter-spacing:.1em;
}

/* ---------- FAQ ---------- */
.faq{border-top:1px solid var(--hair)}
.faq details{border-bottom:1px solid var(--hair)}
.faq summary{
  cursor:pointer;list-style:none;padding:22px 40px 22px 0;position:relative;
  font-size:14.5px;letter-spacing:.06em;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:"";position:absolute;right:6px;top:50%;width:11px;height:1px;
  background:var(--red);transition:transform .4s;
}
.faq summary::before{
  content:"";position:absolute;right:11px;top:50%;width:1px;height:11px;
  background:var(--red);margin-top:-5px;transition:transform .4s,opacity .4s;
}
.faq details[open] summary::before{transform:scaleY(0);opacity:0}
.faq p{margin:0;padding:0 0 24px;font-size:14.5px;line-height:2.2;color:var(--ink-soft);max-width:44em}

/* ---------- アクセス ---------- */
.access{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,64px);align-items:center}
.access__map{aspect-ratio:4/3;background:var(--cream-dim);display:flex;align-items:center;justify-content:center}
.access__map span{font-size:10.5px;letter-spacing:.2em;color:#a6957f}
.access dl{margin:0}
.access dt{font-size:10.5px;letter-spacing:.24em;color:var(--red);margin-top:22px}
.access dd{margin:6px 0 0;font-size:15px;line-height:2}
@media(max-width:820px){.access{grid-template-columns:1fr}}

/* ---------- フッター ---------- */
.foot{background:var(--green-deep);color:var(--cream);padding:clamp(56px,7vw,88px) var(--pad) 40px}
.foot__top{display:flex;flex-wrap:wrap;justify-content:space-between;gap:34px;align-items:flex-start}
.foot__name{font-family:var(--mincho);font-size:19px;letter-spacing:.16em;margin:0}
.foot__name img{display:block;width:190px;height:auto}
.foot__name span{display:block;font-family:var(--gothic);font-size:10px;letter-spacing:.34em;color:var(--gold);opacity:.9;margin-top:12px}
.foot__nav{display:flex;flex-wrap:wrap;gap:12px 26px;list-style:none;margin:0;padding:0}
.foot__nav a{font-size:12px;letter-spacing:.12em;opacity:.8;text-decoration:none}
.foot__nav a:hover{opacity:1}
.foot__sns{display:flex;gap:12px;margin:26px 0 0;list-style:none;padding:0}
.foot__sns a{
  border:1px solid var(--gold);padding:9px 18px;font-size:11px;
  letter-spacing:.14em;text-decoration:none;opacity:.85;transition:background .4s;
}
.foot__sns a:hover{background:rgba(201,169,97,.16);opacity:1}
.foot__co{margin:44px 0 0;padding-top:26px;border-top:1px solid var(--hair-l);font-size:11.5px;line-height:2.1;opacity:.62}
.foot__cp{margin:22px 0 0;font-size:9.5px;letter-spacing:.28em;opacity:.4}

a:focus-visible,summary:focus-visible{outline:2px solid var(--red);outline-offset:3px}
@media(prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
  .rv{opacity:1;transform:none}
  html{scroll-behavior:auto}
}

/* =====================================================
   以下、下層ページ用の追加スタイル
   （kw-コンポーネント＝納品カスタムCSSと同一の見た目検証用）
   ===================================================== */
:root{
  --kw-green:var(--green);--kw-green-deep:var(--green-deep);
  --kw-cream:var(--cream);--kw-cream-dim:var(--cream-dim);
  --kw-red:var(--red);--kw-gold:var(--gold);
  --kw-ink:var(--ink);--kw-ink-soft:var(--ink-soft);
  --kw-hair:var(--hair);--kw-hair-l:var(--hair-l);
  --kw-mincho:var(--mincho);--kw-gothic:var(--gothic);
}

/* 下層ページヘッダー */
.phero{
  background:var(--green-deep);color:var(--cream);
  padding:clamp(120px,16vw,180px) var(--pad) clamp(48px,6vw,72px);
}
.phero .eyebrow{color:var(--gold)}
.phero__title{
  font-family:var(--mincho);font-weight:400;margin:0;
  font-size:clamp(26px,3.6vw,40px);letter-spacing:.16em;line-height:1.6;
}

/* kw- コンポーネント（納品01_カスタムCSSと同一） */
.kw-eyebrow{font-family:var(--kw-gothic);font-size:10px;letter-spacing:.34em;font-weight:500;color:var(--kw-red);margin:0 0 14px}
.kw-dark .kw-eyebrow{color:var(--kw-gold)}
.kw-h2{font-family:var(--kw-mincho);font-weight:400;font-size:clamp(22px,3vw,33px);letter-spacing:.13em;line-height:1.7;margin:0 0 clamp(28px,4vw,48px)}
.kw-h2::after{content:"";display:block;width:36px;height:2px;background:var(--kw-red);margin-top:18px}
.kw-dark .kw-h2::after{background:var(--kw-red)}
.kw-lead{font-size:16px;line-height:2.3;margin:0;max-width:38em}
.kw-note{font-size:14px;line-height:1.9;color:var(--kw-ink-soft);margin:18px 0 0}
.kw-dark .kw-note{color:rgba(247,239,226,.6)}
.kw-dark{background:var(--kw-green);color:var(--kw-cream);padding:clamp(40px,6vw,80px) clamp(20px,4vw,56px)}
.kw-dark--deep{background:var(--kw-green-deep)}
.kw-btn{display:inline-block;margin-top:26px;padding:15px 34px;border:1px solid var(--kw-gold);color:inherit;text-decoration:none;font-size:12px;letter-spacing:.18em;transition:background .45s}
.kw-btn:hover{background:rgba(201,169,97,.16)}
.kw-btn--ink{border-color:var(--kw-ink);color:var(--kw-ink)}
.kw-btn--ink:hover{background:var(--kw-ink);color:var(--kw-cream)}
.kw-plans{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1px;background:var(--kw-hair-l);border:1px solid var(--kw-hair-l);margin:0;padding:0;list-style:none}
.kw-plans li{background:var(--kw-green);padding:clamp(24px,3.4vw,38px);margin:0}
.kw-plans .kw-plan-name{font-size:12px;letter-spacing:.14em;opacity:.74;display:block}
.kw-plans .kw-plan-price{font-family:var(--kw-mincho);font-weight:400;font-size:clamp(24px,3vw,34px);letter-spacing:.04em;line-height:1.2;display:block;margin-top:12px}
.kw-plans .kw-plan-price span{font-size:14px;margin-right:2px}
.kw-plans .kw-plan-price small{font-size:13px;font-family:var(--kw-gothic)}
.kw-plans .kw-plan-cond{display:block;font-size:11.5px;letter-spacing:.08em;opacity:.66;margin-top:10px;line-height:1.8}
.kw-menu{list-style:none;margin:0;padding:0}
.kw-menu li{display:flex;align-items:baseline;gap:10px;padding:13px 0;border-bottom:1px solid var(--kw-hair)}
.kw-menu li:first-child{border-top:1px solid var(--kw-hair)}
.kw-media{display:flex;flex-wrap:wrap;gap:10px;list-style:none;margin:0;padding:0}
.kw-media li{border:1px solid var(--kw-hair);padding:11px 20px;font-size:14px;letter-spacing:.1em}
.kw-info dt{font-size:10.5px;letter-spacing:.24em;color:var(--kw-red);margin-top:22px}
.kw-info dd{margin:6px 0 0;font-size:15px;line-height:2}
.kw-dark .kw-info dt{color:var(--kw-gold)}

/* 記事系レイアウト（下層ページ本文） */
.page-body{max-width:820px;margin:0 auto;padding:clamp(56px,8vw,96px) var(--pad)}
.page-body h3.kw-h2{font-size:20px;margin-top:48px}
.page-body ul:not([class]){padding-left:1.4em;line-height:2.2;font-size:14.5px}
.page-body figure{margin:26px 0}
.page-body figure img{width:100%;height:auto;display:block}
.page-body figcaption{font-size:14px;letter-spacing:.06em;color:var(--ink-soft);margin-top:10px;line-height:1.9}

/* 道順ステップ */
.route figure{margin:0 0 40px}
.route figure img{max-width:560px}
.route figcaption{font-size:15px;color:var(--ink)}

/* フォーム（見た目のみ） */
.form{max-width:640px}
.form label{display:block;font-size:14px;letter-spacing:.1em;margin:26px 0 8px}
.form label:first-child{margin-top:0}
.form .req{color:var(--red);font-size:10px;letter-spacing:.2em;margin-left:8px}
.form input,.form select,.form textarea{
  width:100%;box-sizing:border-box;padding:13px 14px;
  border:1px solid var(--hair);background:#fff;border-radius:1px;
  font-family:var(--gothic);font-size:14px;color:var(--ink);
}
.form textarea{min-height:170px;resize:vertical}
.form input:focus,.form select:focus,.form textarea:focus{outline:2px solid var(--red);outline-offset:1px}
.form button{
  margin-top:30px;padding:15px 44px;border:1px solid var(--ink);
  background:transparent;color:var(--ink);font-size:12px;letter-spacing:.18em;
  font-family:var(--gothic);cursor:pointer;transition:background .45s,color .45s;
}
.form button:hover{background:var(--ink);color:var(--cream)}
.kw-plans li:last-child:nth-child(odd){grid-column:1/-1}

/* ---------- スマホ固定バー（電話・地図） ---------- */
.mobilebar{position:fixed;left:0;right:0;bottom:0;z-index:60;display:none;background:rgba(20,29,24,.96);box-shadow:0 -1px 0 var(--hair-l);padding-bottom:env(safe-area-inset-bottom)}
.mobilebar a{display:flex;align-items:center;justify-content:center;min-height:56px;color:var(--cream);text-decoration:none;font-size:14px;letter-spacing:.14em}
.mobilebar a+a{border-left:1px solid var(--hair-l)}
@media(max-width:700px){
  .mobilebar{display:grid;grid-template-columns:1fr 1fr}
  body{padding-bottom:calc(56px + env(safe-area-inset-bottom))}
  .gnav__tel{display:none}
  .hero__bar{bottom:calc(56px + env(safe-area-inset-bottom))}
}
/* ---------- スマホ用メニュー（3本線） ---------- */
.gnav__burger{display:none;width:44px;height:44px;background:none;border:0;cursor:pointer;padding:10px}
.gnav__burger span{display:block;height:1px;background:var(--cream);margin:6px 0;transition:transform .3s,opacity .3s}
.gnav.is-open .gnav__burger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.gnav.is-open .gnav__burger span:nth-child(2){opacity:0}
.gnav.is-open .gnav__burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
@media(max-width:860px){
  .gnav__burger{display:block}
  .gnav{background:rgba(20,29,24,.94)}
  .gnav.is-open .gnav__list{
    display:flex;flex-direction:column;gap:18px;
    position:absolute;top:100%;left:0;right:0;
    background:rgba(20,29,24,.97);padding:22px var(--pad) 30px;
  }
  .gnav.is-open .gnav__list a{font-size:14px}
}
/* ---------- スタッフ写真（撮影後差し替え用） ---------- */
.staff__ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

/* ---------- フォーム同意・送信メッセージ ---------- */
.form .agree{display:flex;gap:10px;align-items:flex-start;font-size:14px;letter-spacing:.04em;margin:26px 0 0}
.form .agree input{width:18px;height:18px;margin-top:4px;flex:none}
.form__msg{display:none;margin-top:22px;padding:14px 18px;font-size:14px;line-height:1.9;border:1px solid}
.form__msg.is-show{display:block}
.form__msg--ok{border-color:#3c6e47;color:#2c5636;background:rgba(60,110,71,.08)}
.form__msg--ng{border-color:var(--red);color:var(--red);background:rgba(184,28,34,.06)}