/* こもれび食堂｜やさしい・親しみ（natural）見本 */
:root{
  --c-base:#f7f5f0; --c-card:#fff; --c-ink:#3d3530; --c-sub:#6f665f; --c-line:#e4ded4;
  --c-accent:#2f9e78; --c-accent-ink:#237a5c; --c-soft:#e4f2ea; --c-deep:#1f5e4a; --c-spot:#f5c342;
  --f-head:"Zen Kaku Gothic New",system-ui,sans-serif; --f-en:"Sora",system-ui,sans-serif;
  --r-card:24px; --r-big:48px;
  --ease:cubic-bezier(.4,0,.2,1); --ease-out:cubic-bezier(.23,1,.32,1);
  --sec:144px; --wrap:1200px;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--c-base);color:var(--c-ink);font-family:var(--f-head);font-weight:500;font-size:16px;line-height:1.85;letter-spacing:.05em;overflow-x:clip}
img{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3,p,li,dd,dt,td,th{word-break:auto-phrase;text-wrap:pretty}
h1,h2,h3{font-weight:700;line-height:1.5;margin:0}
p{margin:0}
.wrap{width:min(100% - 48px,var(--wrap));margin-inline:auto}
.sec{padding-block:var(--sec)}
.en{font-family:var(--f-en);font-weight:500;letter-spacing:.04em}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
:focus-visible{outline:3px solid var(--c-spot);outline-offset:3px;border-radius:6px}

/* 見本の帯 */
.demo-bar{background:var(--c-ink);color:#fff;font-size:12px;text-align:center;padding:6px 16px;letter-spacing:.06em;line-height:1.6}

/* ヘッダー natural-N-01 */
.hd{position:sticky;top:0;z-index:50;background:rgba(247,245,240,.92);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-bottom:1px solid transparent;transition:border-color .3s var(--ease)}
.hd.is-scrolled{border-bottom-color:var(--c-line)}
.hd__in{display:flex;align-items:center;gap:24px;height:76px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;font-weight:700;font-size:20px;letter-spacing:.08em;white-space:nowrap}
.logo svg{width:34px;height:34px;flex:none}
.logo small{display:block;font-family:var(--f-en);font-size:10px;font-weight:500;letter-spacing:.06em;color:var(--c-sub);line-height:1}
.gnav{margin-left:auto;display:flex;gap:28px;font-size:15px}
.gnav a{text-decoration:none;position:relative;padding:6px 0}
.gnav a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;border-radius:2px;background:var(--c-accent);transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease)}
.gnav a:hover::after,.gnav a[aria-current=page]::after{transform:scaleX(1)}
.btn-soft{display:inline-flex;align-items:center;gap:8px;height:44px;padding:0 22px;border-radius:999px;background:var(--c-accent-ink);color:#fff;text-decoration:none;font-weight:700;font-size:14px;white-space:nowrap;transition:background .3s var(--ease),transform .3s var(--ease)}
.btn-soft:hover{background:var(--c-deep);transform:translateY(-2px)}
.btn-soft svg{width:16px;height:16px}
.menu-btn{display:none;width:44px;height:44px;border-radius:12px;border:0;background:var(--c-spot);cursor:pointer;place-items:center;padding:0}
.menu-btn span{display:block;width:18px;height:2px;background:var(--c-ink);border-radius:2px;position:relative;transition:background .2s}
.menu-btn span::before,.menu-btn span::after{content:"";position:absolute;left:0;width:18px;height:2px;background:var(--c-ink);border-radius:2px;transition:transform .3s var(--ease)}
.menu-btn span::before{top:-6px}.menu-btn span::after{top:6px}
.menu-open .menu-btn span{background:transparent}
.menu-open .menu-btn span::before{transform:translateY(6px) rotate(45deg)}
.menu-open .menu-btn span::after{transform:translateY(-6px) rotate(-45deg)}
.drawer{display:none}

/* ヒーロー natural-H-02 */
.hero{position:relative;padding:40px 0 120px;overflow-x:clip}
.hero__grid{display:grid;grid-template-columns:minmax(0,45fr) minmax(0,55fr);gap:40px;align-items:center}
.hero__copy{position:relative;z-index:2}
.hero__en{font-family:var(--f-en);font-size:14px;color:var(--c-accent-ink);letter-spacing:.06em;margin-bottom:20px;display:flex;align-items:center;gap:10px}
.hero__en::before{content:"";width:28px;height:2px;border-radius:2px;background:var(--c-accent)}
.hero h1{font-size:clamp(30px,4.2vw,50px);line-height:1.5;letter-spacing:.06em}
.hero h1 .ln{display:block}
.hero__lead{margin-top:24px;color:var(--c-sub);max-width:23em}
.hero__actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:36px}
.hero__main{position:relative;border-radius:var(--r-big);overflow:hidden;aspect-ratio:5/6;background:linear-gradient(135deg,var(--c-soft),#f1e7cf)}
.hero__main img{width:100%;height:100%;object-fit:cover;transform:scale(1.06);transition:transform 2.4s var(--ease-out)}
.hero__main .wave{position:absolute;left:0;right:0;bottom:-2px;width:100%;height:58px;color:var(--c-base)}
.hero__photo{position:relative}
.bit{position:absolute;width:clamp(110px,13vw,176px);aspect-ratio:1;border-radius:16px;overflow:hidden;border:6px solid #fff;background:var(--c-soft)}
.bit img{width:100%;height:100%;object-fit:cover}
.bit--a{left:-56px;bottom:40px;transform:rotate(-4deg)}
.bit--b{right:-20px;top:-24px;transform:rotate(4deg);width:clamp(96px,10vw,140px)}
.today{position:absolute;right:24px;bottom:36px;z-index:3;background:#fff;border-radius:20px;padding:14px 20px 14px 16px;display:flex;align-items:center;gap:12px;font-size:13px;line-height:1.5;max-width:260px}
.today__dot{flex:none;width:44px;height:44px;border-radius:50%;background:var(--c-spot);display:grid;place-items:center}
.today__dot svg{width:22px;height:22px}
.today b{display:block;font-size:15px}
.doodle{position:absolute;pointer-events:none;color:var(--c-spot)}
.doodle--spark{width:54px;height:54px;left:-8px;top:-44px;animation:wobble 1s steps(2) infinite}
.doodle--swirl{width:120px;height:40px;left:0;bottom:-54px;color:var(--c-accent)}
@keyframes wobble{0%{transform:rotate(-1deg)}100%{transform:rotate(1deg)}}

/* マスクで開く natural-A-x01 */
.js .mask-open{clip-path:inset(0 0 100% 0 round var(--r-big))}
.mask-open.is-in{clip-path:inset(0 0 0 0 round var(--r-big));transition:clip-path 1.1s var(--ease-out)}
.mask-open.is-in img{transform:scale(1)}
.js .hero .ln{opacity:0;transform:translateY(16px)}
.hero.is-ready .ln{opacity:1;transform:none;transition:opacity .9s var(--ease-out),transform .9s var(--ease-out)}
.hero.is-ready .ln:nth-child(2){transition-delay:.18s}
.js .hero .pop{opacity:0;transform:translateY(16px) rotate(var(--rot,0deg))}
.hero.is-ready .pop{opacity:1;transform:rotate(var(--rot,0deg));transition:opacity .8s var(--ease-out) .7s,transform .8s var(--ease-out) .7s}
.bit--a{--rot:-4deg}.bit--b{--rot:4deg}

/* 表示アニメ */
.js .rv{opacity:0;transform:translateY(16px)}
.rv.is-in{opacity:1;transform:none;transition:opacity .9s var(--ease-out),transform .9s var(--ease-out)}

/* 見出し natural-T-01 */
.ttl{margin-bottom:56px}
.ttl h2{font-size:clamp(24px,2.8vw,32px);letter-spacing:.06em}
.ttl .en{display:block;margin-top:6px;font-size:13px;color:var(--c-accent-ink);letter-spacing:.08em}
.ttl--center{text-align:center}

/* お店のこと natural-S-02 */
.intro__row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:72px;align-items:center}
.blob{border-radius:60% 40% 55% 45%/50% 60% 40% 50%;overflow:hidden;aspect-ratio:5/4;background:var(--c-soft)}
.blob img{width:100%;height:100%;object-fit:cover}
.intro__text p+p{margin-top:1.2em}
.intro__text .ttl{margin-bottom:32px}
.more{display:inline-flex;align-items:center;gap:12px;margin-top:32px;text-decoration:none;font-weight:700;font-size:15px}
.more i{width:40px;height:40px;border-radius:50%;background:var(--c-accent-ink);color:#fff;display:grid;place-items:center;transition:transform .5s linear(0,1.14 30%,.96 55%,1.01 75%,1)}
.more i svg{width:14px;height:14px}
.more:hover i{transform:translateX(6px)}

/* おすすめ natural-S-01 */
.pick{background:var(--c-card);border-radius:var(--r-big) var(--r-big) 0 0}
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;list-style:none;margin:0;padding:0}
.card{display:block;text-decoration:none;background:var(--c-base);border-radius:var(--r-card);padding:12px 12px 28px;height:100%}
.card__ph{position:relative;border-radius:18px;overflow:hidden;aspect-ratio:4/3;background:linear-gradient(135deg,var(--c-soft),#f1e7cf)}
.card__ph img{width:100%;height:100%;object-fit:cover;transition:transform 1s linear(0,1.06 35%,1.03 60%,1.04 80%,1.04)}
.card__ic{position:absolute;left:16px;bottom:-24px}
.card__ic,.card__icon{width:56px;height:56px;border-radius:50%;background:#fff;display:grid;place-items:center;color:var(--c-accent-ink);transition:transform 1s linear(0,1.25 30%,.9 55%,1.05 75%,1)}
.card__ph{overflow:visible}
.card__ph>img{border-radius:18px}
.card__ic svg{width:26px;height:26px}
.card__body{padding:40px 12px 0}
.card h3{font-size:20px;display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.card h3 .price{font-family:var(--f-en);font-size:16px;color:var(--c-accent-ink);white-space:nowrap}
.card p{margin-top:10px;font-size:14px;color:var(--c-sub)}
.card:hover .card__ph img{transform:scale(1.04)}
.card:hover .card__ic{transform:translateY(-4px)}
.pick__foot{text-align:center;margin-top:56px}
.btn-line{display:inline-flex;align-items:center;gap:12px;height:52px;padding:0 28px;border-radius:999px;border:2px solid var(--c-ink);text-decoration:none;font-weight:700;font-size:15px;transition:background .3s var(--ease),color .3s var(--ease)}
.btn-line:hover{background:var(--c-ink);color:#fff}
.btn-line svg{width:14px;height:14px}

/* 流れる英字 natural-D-03 */
.flow{position:relative;background:var(--c-card);padding:16px 0 72px;overflow:hidden}
.flow__track{display:flex;width:max-content;animation:flow 30s linear infinite}
.flow__item{font-family:var(--f-en);font-weight:700;font-size:clamp(48px,8vw,112px);letter-spacing:-.02em;color:var(--c-soft);white-space:nowrap;padding-right:.6em;line-height:1.1}
.flow__item b{color:var(--c-accent);font-weight:700}
.flow.is-paused .flow__track,.flow.is-off .flow__track{animation-play-state:paused}
.flow__btn{position:absolute;right:24px;bottom:20px;height:36px;padding:0 14px;border-radius:999px;border:1px solid var(--c-line);background:#fff;font:inherit;font-size:12px;cursor:pointer;color:var(--c-sub)}
@keyframes flow{to{transform:translateX(-50%)}}

/* 営業案内 natural-D-02 */
.info{position:relative}
.info__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.box{background:var(--c-card);border-radius:var(--r-card);padding:36px 32px}
.box__icon{width:56px;height:56px;border-radius:50%;background:var(--c-soft);color:var(--c-accent-ink);display:grid;place-items:center;margin-bottom:20px}
.box__icon svg{width:26px;height:26px}
.box h3{font-size:18px;margin-bottom:12px}
.box dl{margin:0;display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 16px;font-size:15px}
.box dt{color:var(--c-sub)}
.box dd{margin:0}
.box p{font-size:15px}
.box small{display:block;margin-top:10px;font-size:13px;color:var(--c-sub);line-height:1.7}

/* Instagram帯 */
.ig{padding-bottom:var(--sec)}
.ig__band{display:flex;align-items:center;gap:32px;flex-wrap:wrap;background:var(--c-soft);border-radius:var(--r-big);padding:40px 48px}
.ig__glyph{width:64px;height:64px;border-radius:20px;background:#fff;display:grid;place-items:center;color:var(--c-deep);flex:none}
.ig__glyph svg{width:30px;height:30px}
.ig__txt{flex:1 1 280px;min-width:0}
.ig__txt b{display:block;font-size:18px}
.ig__txt span{font-family:var(--f-en);font-size:14px;color:var(--c-accent-ink)}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;padding:0;list-style:none}
.chips li{background:#fff;border-radius:999px;padding:4px 14px;font-size:13px}

/* CTA natural-C-01 */
.cta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.cta__card{position:relative;display:block;text-decoration:none;color:#fff;background:var(--c-accent-ink);border-radius:32px;padding:44px 44px 48px;min-height:220px;overflow:hidden;transition:transform .5s var(--ease)}
.cta__card:nth-child(2){background:var(--c-deep)}
.cta__card:hover{transform:translateY(-4px)}
.cta__card .en{font-size:13px;opacity:.85}
.cta__card h3{font-size:24px;margin-top:6px}
.cta__card p{margin-top:10px;font-size:15px;opacity:.92}
.cta__card .tel{font-family:var(--f-en);font-weight:600;font-size:28px;letter-spacing:.02em;margin-top:12px;display:block}
.cta__arrow{position:absolute;right:28px;bottom:28px;width:52px;height:52px;border-radius:50%;background:#fff;color:var(--c-deep);display:grid;place-items:center;transition:transform .5s linear(0,1.14 30%,.96 55%,1.01 75%,1)}
.cta__arrow svg{width:18px;height:18px}
.cta__card:hover .cta__arrow{transform:translateX(4px)}
.cta__deco{position:absolute;right:-24px;top:-24px;width:140px;height:140px;color:rgba(255,255,255,.12)}

/* フッター natural-F-01 */
.ft{position:relative;background:var(--c-deep);color:#fff;padding:120px 0 40px;margin-top:40px}
.ft .wave{position:absolute;left:0;top:-1px;width:100%;height:48px;color:var(--c-base);transform:scaleY(-1)}
.ft--white{margin-top:0}.ft--white .wave{color:#fff}
.ft__name{font-size:clamp(28px,4vw,44px);font-weight:700;letter-spacing:.1em}
.ft__en{font-family:var(--f-en);font-size:14px;opacity:.8}
.ft__grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:48px;margin-top:40px}
.ft dl{margin:0;display:grid;grid-template-columns:auto minmax(0,1fr);gap:6px 20px;font-size:14px}
.ft dt{opacity:.75}
.ft dd{margin:0}
.ft__nav{display:flex;flex-wrap:wrap;gap:12px 28px;align-content:flex-start;font-size:15px}
.ft__nav a{text-decoration:none}
.ft__nav a:hover{text-decoration:underline}
.ft__copy{margin-top:64px;padding-top:24px;border-top:1px solid rgba(255,255,255,.2);font-size:12px;opacity:.75;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}

/* 右下の固定タブ natural-N-02 */
.fixed-tab{position:fixed;right:20px;bottom:20px;z-index:40;display:flex;align-items:center;gap:8px;height:52px;padding:0 22px;border-radius:999px;background:var(--c-spot);color:var(--c-ink);text-decoration:none;font-weight:700;font-size:14px;opacity:0;transform:translateY(20px);pointer-events:none;transition:opacity .4s var(--ease),transform .4s var(--ease)}
.fixed-tab.is-show{opacity:1;transform:none;pointer-events:auto}
.fixed-tab svg{width:18px;height:18px}

/* 下層ページ */
.phead{padding:56px 0 72px;position:relative}
.phead h1{font-size:clamp(30px,4vw,44px);letter-spacing:.08em}
.phead .en{display:block;font-size:14px;color:var(--c-accent-ink);margin-top:6px}
.phead p{margin-top:20px;color:var(--c-sub);max-width:34em}
.crumb{font-size:12px;color:var(--c-sub);margin-bottom:28px}
.crumb a{text-decoration:none}
.crumb a:hover{text-decoration:underline}
.phead .doodle--spark{left:auto;right:8%;top:40px}
.panel{background:var(--c-card);border-radius:var(--r-big)}
.panel+.panel{margin-top:32px}

/* メニュー */
.teishoku{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px;list-style:none;margin:0;padding:0}
.tcard{background:var(--c-base);border-radius:var(--r-card);overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr)}
.tcard__ph{background:linear-gradient(135deg,var(--c-soft),#f1e7cf);min-height:220px}
.tcard__ph img{width:100%;height:100%;object-fit:cover}
.tcard__b{padding:28px 28px 32px}
.tcard h3{font-size:20px}
.tcard .price{display:block;font-family:var(--f-en);font-weight:600;font-size:22px;color:var(--c-accent-ink);margin-top:4px}
.tcard .price small{font-family:var(--f-head);font-size:12px;font-weight:500;color:var(--c-sub);margin-left:4px}
.tcard p{margin-top:10px;font-size:14px;color:var(--c-sub)}
.badge{display:inline-block;background:var(--c-spot);border-radius:999px;font-size:12px;font-weight:700;padding:2px 12px;margin-bottom:8px}
.mlist{list-style:none;margin:0;padding:0}
.mlist li{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:18px 4px;border-bottom:1px dashed var(--c-line)}
.mlist li:first-child{border-top:1px dashed var(--c-line)}
.mlist .nm{min-width:0}
.mlist .nm small{display:block;font-size:13px;color:var(--c-sub)}
.mlist .pr{font-family:var(--f-en);font-weight:600;white-space:nowrap;color:var(--c-accent-ink)}
.mcols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:56px}
.mcols h3{font-size:20px;margin-bottom:20px;display:flex;align-items:center;gap:10px}
.mcols h3 svg{width:28px;height:28px;color:var(--c-accent)}
.note{margin-top:40px;background:var(--c-soft);border-radius:var(--r-card);padding:24px 28px;font-size:14px}
.note ul{margin:0;padding-left:1.2em}

/* お店のこと（下層） */
.story{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:72px;align-items:center}
.story p+p{margin-top:1.2em}
.alt{display:grid;gap:96px}
.alt__row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:72px;align-items:center}
.alt__row:nth-child(even) .alt__ph{order:2}
.alt__num{font-family:var(--f-en);font-size:14px;color:var(--c-accent-ink)}
.alt h3{font-size:24px;margin:4px 0 16px}
.blob--b{border-radius:45% 55% 40% 60%/55% 45% 60% 40%}
.blob--c{border-radius:55% 45% 60% 40%/40% 60% 45% 55%}
.seats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:48px}
.seat{background:var(--c-base);border-radius:var(--r-card);padding:28px;text-align:center}
.seat b{display:block;font-family:var(--f-en);font-size:40px;font-weight:600;color:var(--c-accent-ink);line-height:1.2}
.seat span{font-size:14px;color:var(--c-sub)}

/* アクセス */
.acc{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:48px;align-items:start}
.map{border-radius:var(--r-card);overflow:hidden;background:#eef0e6;aspect-ratio:4/3}
.map svg{width:100%;height:100%;display:block}
.map-note{font-size:12px;color:var(--c-sub);margin-top:8px}
.dtable{margin:0}
.dtable div{display:grid;grid-template-columns:7em minmax(0,1fr);gap:16px;padding:16px 4px;border-bottom:1px solid var(--c-line)}
.dtable div:first-child{border-top:1px solid var(--c-line)}
.dtable dt{color:var(--c-sub);font-size:14px}
.dtable dd{margin:0;min-width:0;overflow-wrap:anywhere}
.form{display:grid;gap:20px}
.form label{display:block;font-weight:700;font-size:15px;margin-bottom:8px}
.form label em{font-style:normal;font-size:11px;background:var(--c-spot);border-radius:999px;padding:1px 8px;margin-left:8px;vertical-align:2px}
.form input,.form select,.form textarea{width:100%;font:inherit;font-size:16px;color:inherit;background:var(--c-base);border:2px solid transparent;border-radius:16px;padding:14px 18px;transition:border-color .3s var(--ease),background .3s var(--ease)}
.form textarea{min-height:160px;resize:vertical}
.form input:focus,.form select:focus,.form textarea:focus{outline:none;border-color:var(--c-accent);background:#fff}
.form button{justify-self:start;height:56px;padding:0 40px;border:0;border-radius:999px;background:var(--c-accent-ink);color:#fff;font:inherit;font-weight:700;font-size:16px;cursor:pointer;transition:background .3s var(--ease)}
.form button:hover{background:var(--c-deep)}
.form__msg{display:none;background:var(--c-soft);border-radius:16px;padding:16px 20px;font-size:14px}
.form__msg.is-show{display:block}
.form__row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}

/* FAQ natural-I-01 */
.faq{display:grid;gap:16px;max-width:880px;margin-inline:auto}
.qa{background:var(--c-card);border-radius:var(--r-card)}
.qa summary{list-style:none;cursor:pointer;display:flex;gap:16px;align-items:center;padding:22px 64px 22px 24px;position:relative;font-weight:700}
.qa summary::-webkit-details-marker{display:none}
.qa summary::before{content:"Q";flex:none;width:36px;height:36px;border-radius:50%;background:var(--c-accent-ink);color:#fff;font-family:var(--f-en);font-weight:600;display:grid;place-items:center}
.qa summary::after{content:"";position:absolute;right:28px;top:50%;width:12px;height:12px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateY(-70%) rotate(45deg);transition:transform .3s var(--ease)}
.qa[open] summary::after{transform:translateY(-30%) rotate(-135deg)}
.qa__a{padding:0 24px 24px 76px;color:var(--c-sub);font-size:15px}

/* 画像の代替 */
.photo-empty{background:linear-gradient(135deg,var(--c-soft),#f1e7cf)!important}

/* ---------- レスポンシブ ---------- */
@media (max-width:1023px){
  :root{--sec:104px}
  .gnav{display:none}
  .menu-btn{display:grid}
  .hd .btn-soft{margin-left:auto}
  .drawer{display:block;position:fixed;inset:76px 0 auto 0;z-index:49;background:var(--c-base);padding:24px 24px 40px;border-bottom:1px solid var(--c-line);transform:translateY(-12px);opacity:0;visibility:hidden;transition:opacity .3s var(--ease),transform .3s var(--ease),visibility .3s}
  .menu-open .drawer{opacity:1;visibility:visible;transform:none}
  .drawer a{display:block;padding:14px 4px;border-bottom:1px dashed var(--c-line);text-decoration:none;font-weight:700;font-size:17px}
  .cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cards li:last-child{grid-column:1/-1}
  .cards li:last-child .card{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 16px;align-items:center}
  .cards li:last-child .card__body{padding-top:0}
  .info__grid{grid-template-columns:minmax(0,1fr)}
  .teishoku{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:767px){
  :root{--sec:72px}
  body{font-size:14px}
  .wrap{width:min(100% - 40px,var(--wrap))}
  .hd__in{height:64px;gap:10px}
  .drawer{inset:64px 0 auto 0}
  .logo{font-size:17px}
  .logo svg{width:28px;height:28px}
  .hd .btn-soft{height:40px;padding:0 14px;font-size:13px}
  .hero{padding:16px 0 88px}
  .hero__grid{grid-template-columns:minmax(0,1fr);gap:32px}
  .hero__photo{order:-1}
  .hero__main{aspect-ratio:4/3.4;border-radius:32px}
  .bit--a{display:none}
  .bit--b{right:-8px;top:-16px;width:92px}
  .hero__main .wave{height:28px}
  .today{right:12px;bottom:-26px;max-width:none}
  .hero .doodle--spark{display:none}
  .doodle--swirl{display:none}
  .ttl{margin-bottom:36px}
  .intro__row,.story,.alt__row,.acc,.mcols,.form__row{grid-template-columns:minmax(0,1fr);gap:36px}
  .alt{gap:64px}
  .alt__row:nth-child(even) .alt__ph{order:0}
  .cards{grid-template-columns:minmax(0,1fr);gap:20px}
  .cards li:last-child .card{display:block}
  .cards li:last-child .card__body{padding-top:40px}
  .pick{border-radius:32px 32px 0 0}
  .flow{padding:8px 0 64px}
  .ig__band{padding:28px 24px;gap:20px;border-radius:32px}
  .cta{grid-template-columns:minmax(0,1fr)}
  .cta__card{padding:32px 28px 40px;min-height:0}
  .cta__card .tel{font-size:24px}
  .box{padding:28px 24px}
  .ft{padding-top:88px}
  .ft__grid{grid-template-columns:minmax(0,1fr);gap:32px}
  .tcard{grid-template-columns:minmax(0,1fr)}
  .tcard__ph{aspect-ratio:16/10;min-height:0}
  .seats{grid-template-columns:minmax(0,1fr);gap:12px}
  .seat{display:flex;align-items:baseline;justify-content:center;gap:12px;padding:18px}
  .seat b{font-size:30px}
  .panel{border-radius:32px}
  .dtable div{grid-template-columns:minmax(0,1fr);gap:2px}
  .qa__a{padding:0 20px 20px 20px}
  .qa summary{padding:18px 52px 18px 18px}
  .fixed-tab{right:12px;bottom:12px;height:48px;padding:0 18px}
  .phead{padding:32px 0 48px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .js .rv,.js .hero .ln,.js .hero .pop{opacity:1!important;transform:none!important}
  .js .mask-open{clip-path:none!important}
  .hero__main img{transform:none}
}