/* base.css — A・B 共通の骨組み（色・書体・版面の型は style_a.css／style_b.css） */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:16px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--page);color:var(--ink);font-family:var(--f-body);font-size:17px;line-height:1.75;letter-spacing:.02em;font-feature-settings:"palt" 0;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%;height:auto}
figure,blockquote{margin:0}
h1,h2,h3,p,ul,ol,dl,dd{margin:0}
ul,ol{padding:0;list-style:none}
a{color:inherit}
.p{display:inline-block}            /* 句の途中で折らせない */
.lp{max-width:480px;margin:0 auto;background:var(--ground);position:relative;overflow:hidden}
.sec{position:relative;padding:var(--pad-t,56px) 20px var(--pad-b,64px)}

/* 確認中の札（P17の札部分）＝共通の形 */
.tbc{display:inline-block;font-family:var(--f-body);font-size:16px;line-height:1;font-weight:700;letter-spacing:.06em;padding:3px 7px 3px;border-radius:2px;margin-right:8px;vertical-align:2px;color:var(--tbc-fg);background:var(--tbc-bg);border:1px solid var(--tbc-line);white-space:nowrap}
.note-tbc{display:flex;gap:2px;align-items:flex-start;margin-top:20px;padding:12px 14px;font-size:16px;line-height:1.65;color:var(--ink-2);background:var(--note-bg);border-left:var(--note-bar)}
.note-tbc .tbc{margin-top:3px;flex:none}

/* ボタン */
.cta{margin-top:36px}
.cta-label{font-size:16px;font-weight:700;line-height:1.5;margin-bottom:10px}
.btn{display:flex;align-items:center;justify-content:center;min-height:56px;text-decoration:none;font-weight:700;font-size:18px;letter-spacing:.08em;position:relative;-webkit-tap-highlight-color:transparent;transition:transform .08s, box-shadow .08s}
.btn:active{transform:translateY(1px)}

/* 開閉（P13）の骨組み */
details>summary{list-style:none;cursor:pointer}
details>summary::-webkit-details-marker{display:none}

/* 固定ボタン（P09）＝①のボタンが画面外に出てから出す */
.dock{position:fixed;left:0;right:0;bottom:0;z-index:20;padding:8px 16px calc(8px + env(safe-area-inset-bottom));transform:translateY(110%);transition:transform .25s ease-out;max-width:480px;margin:0 auto}
.dock.on{transform:none}
.dock .btn{min-height:48px;font-size:17px}

/* 写真をふわっと（P動き）＝JSが .rv-on を付けた時だけ。JSが無ければ最初から表示 */
.js .rv{opacity:0;transform:translateY(12px);transition:opacity .4s ease-out,transform .4s ease-out}
.js .rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.js .rv{opacity:1;transform:none;transition:none}}

/* 初校で足した部品（A・B共通の骨組み。色と細部は style_a.css／style_b.css） */
.host-line{display:flex;align-items:center;gap:8px}
.hl-logo{height:18px;width:auto}
.fn-w{letter-spacing:-.02em}
.map{display:flex;align-items:center;min-height:44px;margin-top:4px;font-weight:700;text-decoration:underline;text-underline-offset:3px;color:var(--link)}
.g-pic{display:block;object-fit:cover}
.g-sub{display:block}
.g-off-note{display:block;font-family:var(--f-body);font-size:16px;font-weight:700;line-height:1.5;white-space:normal;margin-top:6px}
.video .v-el{display:block;width:100%;height:auto;aspect-ratio:16/9;background:#000;object-fit:cover}
.quote figcaption{align-items:center;gap:14px}
.q-face{width:72px;height:72px;border-radius:50%;object-fit:cover;flex:none}
.q-who{display:flex;flex-direction:column;min-width:0}
.host-h{display:flex;align-items:center;gap:12px}
.host-logo{height:34px;width:auto}
.host-co{margin-top:6px;font-size:16px}
.ph-slot{margin-top:24px;aspect-ratio:3/2;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:4px 0;text-align:center;font-size:16px;line-height:1.6;padding:12px}
.foot-name{display:flex;align-items:center;flex-wrap:wrap;gap:6px 10px}
.foot-logo{height:26px;width:auto}
.foot-co{font-size:16px;font-weight:400}

/* 面の外の注記 */
.outside-note{max-width:480px;margin:28px auto 120px;padding:16px 18px;font-family:system-ui,sans-serif;font-size:14px;line-height:1.6;color:#333;background:#fff;border:1px dashed #888}
.outside-note .on-head{font-weight:700;margin-bottom:6px}
.outside-note ul{list-style:disc;padding-left:1.2em}
body.shot .outside-note{display:none}