/* ==============================================
   呑りお LP — Black / White / Gold
   ============================================== */
:root{
  --bk:#080808;--bk2:#0d0d0d;--bk3:#141414;
  --wh:#fff;--wh2:#e4e4e4;--whm:rgba(255,255,255,.45);
  --gd:#C4A265;--gdl:#d6bb82;--gdd:#a08040;--gdg:rgba(196,162,101,.18);
  --se:'Shippori Mincho',serif;--sa:'Zen Kaku Gothic New','Noto Sans JP',sans-serif;--nu:'Oswald',sans-serif;
  --mx:960px;
}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--sa);color:var(--wh2);background:var(--bk);line-height:2.1;overflow-x:hidden;padding-bottom:52px;padding-top:56px;font-size:15px}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
ul,ol{list-style:none}
strong{color:var(--gd);font-weight:700}
.wrap{max-width:var(--mx);margin:0 auto;padding:0 24px}
.wrap--narrow{max-width:680px}

/* ── Buttons ── */
.btn{display:inline-flex;align-items:center;justify-content:center;padding:13px 36px;font-family:var(--sa);font-weight:700;font-size:.88rem;letter-spacing:.06em;border:1px solid transparent;cursor:pointer;transition:all .3s;white-space:nowrap}
.btn--gold{background:var(--gd);color:var(--bk);border-color:var(--gd)}
.btn--gold:hover{background:var(--gdl);box-shadow:0 6px 28px var(--gdg);transform:translateY(-2px)}
.btn--ghost{background:transparent;color:var(--wh2);border-color:rgba(255,255,255,.18)}
.btn--ghost:hover{border-color:var(--gd);color:var(--gd)}
.btn--lg{padding:15px 44px;font-size:.95rem}
.btn--full{width:100%}

/* ── Header ── */
.header{position:fixed;top:0;left:0;right:0;z-index:900;background:rgba(8,8,8,.85);backdrop-filter:blur(8px);border-bottom:1px solid rgba(196,162,101,.08);transition:transform .3s}
.header--hidden{transform:translateY(-100%)}
.header__inner{max-width:var(--mx);margin:0 auto;padding:0 20px;height:56px;display:flex;align-items:center;justify-content:space-between}
.header__logo img{height:38px;width:auto;opacity:.8;transition:opacity .2s}
.header__logo:hover img{opacity:1}
.header__nav{display:flex;gap:20px;align-items:center}
.header__nav a{font-size:.7rem;font-weight:700;color:var(--whm);letter-spacing:.06em;transition:color .2s}
.header__nav a:hover{color:var(--gd)}
.header__reserve{background:var(--gd);color:var(--bk) !important;padding:5px 16px;font-size:.65rem !important}
.header__reserve:hover{background:var(--gdl)}
.ft__corp{margin-bottom:2px}
.ft__corp a{color:var(--gd);transition:opacity .2s}
.ft__corp a:hover{opacity:.7}

/* ── Divider（和柄） ── */
.divider{border:none;height:16px;background:transparent;margin:0;position:relative;overflow:visible}
.divider::before{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) rotate(45deg);width:6px;height:6px;border:1px solid rgba(196,162,101,.2)}
.divider::after{content:'';position:absolute;top:50%;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent 20%,rgba(196,162,101,.08) 45%,transparent 50%,rgba(196,162,101,.08) 55%,transparent 80%)}

/* ==============
   FV
   ============== */
.fv{position:relative;min-height:100vh;min-height:100dvh;display:flex;align-items:center;justify-content:center;background:var(--bk);overflow:hidden}
.fv__bg{position:absolute;inset:0}
.fv__inner{position:relative;z-index:2;text-align:center;padding:40px 20px;animation:fadeUp .9s ease-out}
.fv__logo{margin:0 auto 28px;width:340px;height:auto;filter:brightness(1.1)}
.fv__h1{font-family:var(--se);font-weight:800;font-size:clamp(1.8rem,6vw,3rem);color:var(--wh);line-height:1.4;margin-bottom:10px}
.fv__sep{display:inline-block;width:1px;height:.7em;background:var(--gd);opacity:.35;margin:0 .4em;vertical-align:middle}
.fv__sub{font-size:.75rem;letter-spacing:.22em;color:var(--whm);margin-bottom:32px}
.fv__cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.fv__scroll{position:absolute;bottom:20px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:5px;z-index:2}
.fv__scroll span{font-family:var(--nu);font-size:.55rem;letter-spacing:.2em;color:rgba(255,255,255,.2)}
.fv__bar{width:1px;height:32px;background:rgba(255,255,255,.1);position:relative;overflow:hidden}
.fv__bar::after{content:'';position:absolute;top:-100%;width:100%;height:100%;background:var(--gd);animation:sc 2.4s infinite}
@keyframes sc{to{top:100%}}
@keyframes fadeUp{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:translateY(0)}}

/* ── Page Nav ── */
.pagenav{display:flex;justify-content:center;flex-wrap:wrap;gap:0;border-bottom:1px solid rgba(255,255,255,.04);background:var(--bk2)}
.pagenav a{padding:10px 16px;font-size:.68rem;font-weight:700;color:var(--whm);letter-spacing:.08em;transition:color .2s}
.pagenav a:hover{color:var(--gd)}

/* ==============
   Sections
   ============== */
.sec{padding:64px 0 72px;position:relative}
.sec--dark{background:var(--bk2)}
.sec--cta{text-align:center;padding:72px 0 80px}
.sec__en{display:block;text-align:center;font-family:var(--se);font-size:.7rem;letter-spacing:.15em;color:var(--gd);opacity:.35;margin-bottom:20px}
.sec__h2{font-family:var(--se);font-weight:700;font-size:clamp(1.3rem,3.5vw,1.85rem);text-align:center;color:var(--wh);line-height:1.8;margin-bottom:20px}
.sec__lead{text-align:center;color:rgba(255,255,255,.55);font-size:.88rem;max-width:500px;margin:0 auto 48px;line-height:2.2}
.sec__watermark{position:absolute;top:40px;right:40px;opacity:.03;pointer-events:none}

/* ── Concept ── */
.prose{max-width:560px;margin:0 auto}
.prose p{margin-bottom:1.6em;font-size:.9rem;line-height:2.4;color:rgba(255,255,255,.7)}
.prose h3{font-family:var(--se);font-size:1rem;color:var(--gd);margin:2.5em 0 .8em;padding-left:12px;border-left:2px solid var(--gd)}

/* ── Happy Hour ── */
.hh{max-width:440px;margin:0 auto;border:1px solid var(--gd);display:flex;overflow:hidden}
.hh__left{background:var(--gd);color:var(--bk);padding:20px 24px;display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:120px}
.hh__en{font-family:var(--nu);font-size:.6rem;letter-spacing:.15em;margin-bottom:4px}
.hh__time{font-family:var(--nu);font-weight:700;font-size:1.1rem}
.hh__right{padding:20px 24px}
.hh__deal{font-family:var(--se);font-size:1.05rem;font-weight:700;color:var(--wh);margin-bottom:4px}
.hh__note{font-size:.8rem;color:rgba(255,255,255,.5);line-height:1.9;margin-top:4px}

/* ── Steps ── */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(196,162,101,.08);margin-bottom:48px}
.step{background:var(--bk);padding:32px 20px;text-align:center}
.step__n{font-family:var(--nu);font-weight:700;font-size:1.6rem;color:var(--gd);opacity:.2;line-height:1;margin-bottom:16px;display:block}
.step h3{font-family:var(--se);font-weight:700;font-size:1rem;color:var(--wh);margin-bottom:10px}
.step p{font-size:.82rem;color:rgba(255,255,255,.55);line-height:2.2}

/* Sim */
.sim{text-align:center}
.sim__t{font-family:var(--se);font-size:.95rem;color:var(--gd);margin-bottom:18px}
.sim__row{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-bottom:12px}
.sim__card{background:var(--bk3);border:1px solid rgba(255,255,255,.05);padding:18px 22px;min-width:190px;text-align:left}
.sim__card--gold{border-color:var(--gd);box-shadow:0 0 20px var(--gdg)}
.sim__lab{font-weight:700;font-size:.85rem;margin-bottom:8px;color:var(--wh2)}
.sim__card--gold .sim__lab{color:var(--gd)}
.sim__card ul{display:flex;flex-direction:column;gap:5px}
.sim__card li{display:flex;align-items:center;gap:8px;font-size:.82rem}
.cb{display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--gd);color:var(--gd);font-family:var(--nu);font-weight:700;font-size:.68rem;padding:1px 7px;min-width:30px}

/* ── Gacha ── */
.gacha{text-align:center}

/* フレーム（和風額縁） */
.gacha__frame{position:relative;width:380px;max-width:100%;margin:0 auto 28px;padding:8px;border:1px solid rgba(196,162,101,.2);background:var(--bk)}
.gacha__frame::before{content:'';position:absolute;inset:5px;border:1px solid rgba(196,162,101,.08);pointer-events:none}
/* 四隅の和風装飾（L字を大きく） */
.gacha__corner{position:absolute;width:28px;height:28px;z-index:2}
.gacha__corner::before,.gacha__corner::after{content:'';position:absolute;background:var(--gd)}
.gacha__corner::before{width:28px;height:1px}
.gacha__corner::after{width:1px;height:28px}
.gacha__corner--tl{top:-1px;left:-1px}.gacha__corner--tl::before{top:0;left:0}.gacha__corner--tl::after{top:0;left:0}
.gacha__corner--tr{top:-1px;right:-1px}.gacha__corner--tr::before{top:0;right:0}.gacha__corner--tr::after{top:0;right:0}
.gacha__corner--bl{bottom:-1px;left:-1px}.gacha__corner--bl::before{bottom:0;left:0}.gacha__corner--bl::after{bottom:0;left:0}
.gacha__corner--br{bottom:-1px;right:-1px}.gacha__corner--br::before{bottom:0;right:0}.gacha__corner--br::after{bottom:0;right:0}
/* 上部に屋号 */
.gacha__border-label{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:var(--bk2);padding:2px 20px;font-family:var(--se);font-size:.72rem;color:var(--gd);letter-spacing:.25em;white-space:nowrap;border:1px solid rgba(196,162,101,.15)}
/* 下部にも菱形装飾 */
.gacha__frame::after{content:'';position:absolute;bottom:-5px;left:50%;transform:translateX(-50%) rotate(45deg);width:8px;height:8px;border:1px solid rgba(196,162,101,.25);background:var(--bk2)}

/* ステージ */
.gacha__stage{min-height:360px;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;margin:8px;background:var(--bk)}
.gacha__idle{text-align:center;animation:fadeUp .6s ease-out}
.gacha__logo{margin:0 auto 16px;opacity:.6;transition:opacity .3s}
.gacha__idle:hover .gacha__logo{opacity:.9}
.gacha__en{font-family:var(--nu);font-size:.8rem;letter-spacing:.4em;color:var(--gd);opacity:.35;margin-bottom:8px}
.gacha__sub{font-size:.65rem;color:var(--whm);opacity:.5;letter-spacing:.1em}

/* ボタン */
.gacha__btn{display:inline-flex;align-items:center;justify-content:center;padding:14px 48px;font-family:var(--se);font-weight:700;font-size:1rem;background:transparent;border:1px solid var(--gd);color:var(--gd);cursor:pointer;transition:all .3s;letter-spacing:.12em}
.gacha__btn:hover{background:var(--gd);color:var(--bk);box-shadow:0 4px 20px var(--gdg)}
.gacha__btn:disabled{opacity:.25;cursor:not-allowed;box-shadow:none}

/* 結果エリア */
.gacha__result{margin:20px auto;padding:24px;max-width:320px;border:1px solid rgba(255,255,255,.06);text-align:center;animation:fadeUp .5s ease-out}
.gacha__result--gold{border-color:var(--gd);background:rgba(196,162,101,.08);box-shadow:0 0 60px rgba(196,162,101,.3),0 0 120px rgba(196,162,101,.15)}
.gacha__result p{font-size:.85rem;color:var(--wh2);line-height:1.8}
.gacha__result .gnum{font-family:var(--nu);font-size:2.4rem;font-weight:700;color:var(--gd);display:block;margin-bottom:8px}
.gacha__result .glabel{font-family:var(--se);font-size:1.1rem;color:var(--gd);margin-bottom:12px;display:block}
.gacha__result .hlabel{font-family:var(--se);font-size:1.1rem;color:var(--whm);margin-bottom:4px;display:block}
.gacha__result .hname{font-family:var(--se);font-size:.85rem;color:var(--gd);margin-bottom:4px}
.gacha__result .hchar{font-size:.72rem;color:var(--whm);opacity:.5}
.gacha__info{margin-top:14px;font-size:.68rem;color:var(--whm)}

/* アニメーション */
@keyframes gachaShake{
  0%,100%{transform:translate(0)}
  10%{transform:translate(-8px,-2px) rotate(-2deg)}
  20%{transform:translate(8px,2px) rotate(2deg)}
  30%{transform:translate(-6px,1px) rotate(-1.5deg)}
  40%{transform:translate(6px,-1px) rotate(1.5deg)}
  50%{transform:translate(-4px,2px) rotate(-1deg)}
  60%{transform:translate(4px,-2px) rotate(1deg)}
  70%{transform:translate(-3px,1px)}
  80%{transform:translate(3px,-1px)}
  90%{transform:translate(-1px,1px)}
}
@keyframes goldPulse{
  0%,100%{box-shadow:0 0 40px rgba(196,162,101,.2),inset 0 0 30px rgba(196,162,101,.05)}
  50%{box-shadow:0 0 120px rgba(196,162,101,.6),0 0 300px rgba(196,162,101,.3),inset 0 0 60px rgba(196,162,101,.1)}
}
@keyframes goldFlash{
  0%,100%{background:var(--bk)}
  15%{background:rgba(196,162,101,.06)}
  30%{background:var(--bk)}
  45%{background:rgba(196,162,101,.04)}
}
.gold-flash{animation:goldFlash .8s ease 2}
@keyframes resultPop{
  0%{opacity:0;transform:scale(.8)}
  60%{transform:scale(1.05)}
  100%{opacity:1;transform:scale(1)}
}
.gacha__stage--spin{animation:gachaShake .4s ease-in-out 4}
.gacha__stage--gold{border:1px solid var(--gd);animation:goldPulse 1.5s ease infinite}
.gacha__stage--result .gacha__idle{display:none}

/* 結果キャラ画像 */
.gacha__chara{animation:resultPop .5s ease-out;display:flex;align-items:center;justify-content:center;height:100%}
.gacha__chara img{display:block;margin:0 auto;border-radius:4px}

/* ── Menu (旧カードグリッド削除済み) ── */
.mgrid__note{text-align:center;font-size:.65rem;color:var(--whm)}

/* Menu images */
.menu-imgs{display:flex;flex-direction:column;gap:40px;margin-bottom:20px}
.menu-img-wrap h3{font-family:var(--se);font-size:.9rem;color:var(--gd);margin-bottom:10px;text-align:center;letter-spacing:.1em}
.menu-img-wrap img{width:100%;height:auto;border:1px solid rgba(255,255,255,.06)}

/* ── Slider ── */
.slider{position:relative;overflow:hidden;border:1px solid rgba(255,255,255,.03);margin-bottom:36px}
.slider__track{display:flex;transition:transform .4s cubic-bezier(.25,.1,.25,1);touch-action:pan-y;cursor:grab}
.slider__track:active{cursor:grabbing}
.slider__s{flex:0 0 100%;aspect-ratio:16/9;background:var(--bk3);display:flex;align-items:center;justify-content:center;overflow:hidden}
.slider__s img{width:100%;height:100%;object-fit:cover}
.slider__s span{color:rgba(255,255,255,.1);font-family:var(--se);font-size:.85rem}
.slider__ui{display:flex;align-items:center;justify-content:center;gap:10px;padding:10px 0}
.slider__a{background:transparent;border:1px solid rgba(196,162,101,.2);color:var(--gd);width:28px;height:28px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .2s}
.slider__a:hover{background:rgba(196,162,101,.08)}
.slider__dots{display:flex;gap:5px}
.slider__dot{width:6px;height:6px;border:1px solid var(--gd);background:transparent;cursor:pointer;padding:0;transition:background .2s}
.slider__dot--active{background:var(--gd)}

/* Scenes */
.scenes{display:flex;justify-content:center;gap:28px;flex-wrap:wrap}
.scenes span{font-size:.72rem;font-weight:700;color:var(--gd);letter-spacing:.1em;padding:4px 12px;border:1px solid rgba(196,162,101,.2)}

/* ── Access ── */
.acc{display:grid;grid-template-columns:1.2fr .8fr;gap:24px;align-items:start}
.acc__map{overflow:hidden;border:1px solid rgba(255,255,255,.05)}
.acc__map iframe{display:block}
.acc__info{display:flex;flex-direction:column;gap:0}
.acc__info dl{display:grid;grid-template-columns:auto 1fr;gap:4px 16px;margin-bottom:20px}
.acc__info dt{font-size:.62rem;font-weight:700;color:var(--gd);letter-spacing:.15em;text-transform:uppercase;padding-top:4px}
.acc__info dd{font-size:.85rem;line-height:1.9;padding-bottom:14px;border-bottom:1px solid rgba(255,255,255,.04)}
.acc__dir{counter-reset:d}
.acc__dir li{counter-increment:d;padding-left:22px;font-size:.85rem;margin-bottom:4px;position:relative}
.acc__dir li::before{content:counter(d);position:absolute;left:0;top:3px;width:15px;height:15px;border:1px solid var(--gd);color:var(--gd);font-size:.55rem;font-weight:700;display:flex;align-items:center;justify-content:center;font-family:var(--nu)}
.acc__tel{font-family:var(--nu);font-size:1.15rem;font-weight:700;color:var(--gd);letter-spacing:.06em}

/* ── FAQ ── */
.faqs{display:flex;flex-direction:column;gap:8px}
.fq{border:1px solid rgba(255,255,255,.05);background:var(--bk3);overflow:hidden}
.fq[open]{border-color:rgba(196,162,101,.2)}
.fq summary{padding:16px 20px;font-weight:500;font-size:.88rem;color:var(--wh2);cursor:pointer;display:flex;align-items:center;gap:12px;list-style:none}
.fq summary::-webkit-details-marker{display:none}
.fq summary b{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border:1px solid var(--gd);color:var(--gd);font-family:var(--nu);font-size:.65rem;flex-shrink:0}
.fq summary::after{content:'';margin-left:auto;width:6px;height:6px;border-right:1px solid var(--gd);border-bottom:1px solid var(--gd);transform:rotate(45deg);transition:transform .3s;flex-shrink:0}
.fq[open] summary::after{transform:rotate(-135deg)}
.fq__a{padding:4px 18px 18px 48px;color:rgba(255,255,255,.6);font-size:.85rem;line-height:2.2}

/* ── CTA ── */
.cta__logo{margin:0 auto 20px;opacity:.8}
.cta__btns{display:flex;flex-direction:column;gap:12px;max-width:340px;margin:0 auto 32px}
.cta__btns .btn{width:100%}
.cta__ig{display:inline-flex;align-items:center;gap:8px;color:var(--whm);font-size:.75rem;margin-bottom:28px;transition:color .2s}
.cta__ig:hover{color:var(--gd)}
.cta__hrs h3{font-family:var(--se);font-size:.85rem;letter-spacing:.1em;color:var(--gd);margin-bottom:16px}
.cta__hrs table{margin:0 auto;border-collapse:collapse}
.cta__hrs td{padding:8px 18px;font-size:.88rem;color:var(--wh2);border-bottom:1px solid rgba(255,255,255,.06)}
.cta__hrs td:first-child{font-weight:700;text-align:right;color:var(--gd);font-size:.85rem;padding-right:24px}
.cta__rest{margin-top:14px;font-size:.82rem;color:var(--gd);font-weight:700;letter-spacing:.15em}

/* ── SEO（控えめに） ── */
.seo{padding:32px 0;border-top:1px solid rgba(255,255,255,.02)}
.seo h2{font-size:.8rem;font-weight:500;color:rgba(255,255,255,.3);margin-bottom:12px}
.seo h3{font-size:.75rem;color:rgba(196,162,101,.3);margin:1.2em 0 .4em}
.seo p{font-size:.72rem;color:rgba(255,255,255,.25);line-height:2.2;margin-bottom:.8em}

/* ── Footer ── */
.ft{background:var(--bk);border-top:1px solid rgba(255,255,255,.03);padding:36px 0 88px;text-align:center;font-size:.7rem;line-height:2.2;color:var(--whm)}
.ft__logo{margin:0 auto 12px;opacity:.5}
.ft__name{font-family:var(--se);font-weight:700;color:var(--gd);font-size:.82rem;letter-spacing:.06em;margin-bottom:4px}
.ft__ig{display:inline-flex;color:var(--whm);transition:color .2s;margin:6px 0}
.ft__ig:hover{color:var(--gd)}
.ft__copy{opacity:.4;margin-top:4px}
.ft a{transition:color .2s}
.ft a:hover{color:var(--gd)}

/* ── Fixed Bar ── */
.fxbar{position:fixed;bottom:0;left:0;right:0;z-index:1000;display:flex;background:rgba(8,8,8,.96);backdrop-filter:blur(8px);border-top:1px solid rgba(196,162,101,.12)}
.fxbar__b{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:9px 4px;color:var(--wh2);font-size:.58rem;font-weight:700;transition:color .2s;border-right:1px solid rgba(255,255,255,.03)}
.fxbar__b:last-child{border-right:none}
.fxbar__b:hover{color:var(--gd)}
.fxbar__b--gd{background:var(--gd);color:var(--bk)}
.fxbar__b--gd:hover{background:var(--gdl);color:var(--bk)}

/* ── Animation ── */
.fi{opacity:0;transform:translateY(16px);transition:opacity .6s,transform .6s}
.fi.vis{opacity:1;transform:translateY(0)}

/* ── Responsive ── */
@media(max-width:768px){
  .sec{padding:52px 0}
  .steps{grid-template-columns:1fr}
  /* メニュー画像はレスポンシブ対応済み(width:100%) */
  .acc{grid-template-columns:1fr;gap:18px}
  .acc__map iframe{height:240px}
  .hh{flex-direction:column}
  .hh__left{min-width:auto;padding:14px}
  .pagenav{display:none}
  .sec__watermark{display:none}
}
@media(max-width:480px){
  body{font-size:14px}
  .fv__logo{width:260px}
  .fv__h1{font-size:1.5rem}
  .fv__cta{flex-direction:column;gap:8px}
  .fv__cta .btn{width:100%}
  .sec__h2{font-size:1.1rem}
  .btn{padding:11px 22px;font-size:.82rem}
  .mc__name{font-size:.7rem;padding:6px 8px}
  .sim__row{flex-direction:column;align-items:stretch}
  .sim__card{min-width:auto}
  .fq summary{padding:12px 12px;font-size:.8rem}
  .gacha__stage{min-height:280px}
}
@media(min-width:769px){
  .fxbar{display:none}
  body{padding-bottom:0}
  .ft{padding-bottom:36px}
}