/* /company/ 試作 v7：舞台（一画面に固定）と、章ごとの言葉の組み。ヘッダー・ABOUT US・見出しは確定版／試作_v6 と同じ組み。 */
html{scroll-behavior:auto}
body{position:relative}
.page .hd{opacity:1}

/* 送り：章の数だけの高さを持つ入れ物の中で、舞台は画面に貼りつく（TOP の .stage/.fv と同じ考え）。
   最後の章の分だけ lvh で取る＝iPhone のツールバーが縮んでも、最後の止まり先（5×svh）に届く */
.scroller{position:relative;height:calc(var(--n, 6) * 100vh);height:calc(var(--n, 6) * 100svh)}   /* 後ろに章（MEMBER・PROFILE）が続くので、最後の章の分を lvh で足す必要は無くなった（2026-10-08） */
.stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;background:var(--ground)}
@media (min-width:768px){.stage{min-height:600px}.scroller{height:calc(var(--n, 6) * max(100svh, 600px))}}

/* ページの名前（試作_v4 design.css と同じ） */
.co-label{font-size:inherit;font-weight:400;position:absolute;z-index:4;left:var(--side);top:calc(var(--header-h) + 2px);display:flex;align-items:baseline;gap:16px;pointer-events:none}
.co-label .pg{font-family:var(--disp);font-weight:500;font-size:15px;letter-spacing:.3em;color:var(--gold);white-space:nowrap}
.co-label .jp{font-size:12.5px;letter-spacing:.12em;white-space:nowrap}

#cv{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:1}
.rooms{position:absolute;inset:0;z-index:2;pointer-events:none}
.rooms .room{position:absolute;border-radius:var(--radius);overflow:hidden;background:var(--tile);clip-path:inset(50% round var(--radius));transition:clip-path 1.3s var(--ease),opacity .7s ease}
.rooms .room.on{clip-path:inset(0 round var(--radius))}
.rooms .room.off{opacity:0}
.rooms .room img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 38%;opacity:0;transition:opacity 1.2s ease}
.rooms .room img.show{opacity:1}

/* ——— 言葉 ——— */
.words{position:absolute;inset:0;z-index:4;pointer-events:none}
.ch{position:absolute;inset:0;display:none;color:var(--ink);text-align:left;letter-spacing:.06em;line-height:1.95;font-size:var(--mf)}
.ch.live,.ch.measure{display:block}
.ch.measure{visibility:hidden}
.ch .in,.ch.value .va{position:absolute;opacity:0;transform:translateY(.4em);transition:opacity 1.1s var(--ease),transform 1.2s var(--ease)}
.ch.measure .in,.ch.measure .va{position:static;opacity:1;transform:none;transition:none}
.ch.show .in,.ch.show .va{opacity:1;transform:none}
.ch.now .in,.ch.now .va{transition:none}
.ch .head{display:block;font-family:var(--disp);font-weight:500;font-size:26px;line-height:1.2;letter-spacing:.2em;color:var(--gold);margin-bottom:calc(var(--mf) * .9)}
.ch .ln{display:block;white-space:nowrap}
.ch .hang{text-indent:-.5em}
.ch .para{margin-top:.8em}   /* 文ごとの余韻（2026-10-07 本人：センテンス毎に余白を） */
.ch .key{background:var(--key-text);-webkit-background-clip:text;background-clip:text;color:transparent;font-style:normal;font-weight:400}
.ch .pc{display:contents}.ch .sp{display:none}
.ch.use-sp .pc{display:none}.ch.use-sp .sp{display:contents}

/* 章ごとの大きさ（PC・タブレット。2026-10-07 本人：メインの文字は 70〜80% に抑えて収まりを）：MISSION 26。役割・問い 19。結び 21。VISION 17。VALUE 20＋三つの軸（fix） */
.ch.mission{--mf:26px}
.ch.role,.ch.ask{--mf:19px}
.ch.close{--mf:21px}
.ch.vision{--mf:17px}
.ch.vision .head,.ch.value .head{margin-bottom:calc(var(--mf) * .8)}
.ch.vision .vi{display:block}
.ch.vision .vi + .vi{margin-top:.7em}
.ch .no{display:block;font-family:var(--disp);font-weight:500;font-size:.75em;line-height:1.2;letter-spacing:.2em;color:var(--gold);margin-bottom:.25em}
.ch.value{--mf:20px}
.ch.value .cols{display:contents}
.ch.value .va{padding:18px 0 20px}
.ch.value .flow{position:absolute;left:0;right:0;height:1px;overflow:hidden;pointer-events:none}
.ch.value .flow.t{top:0}.ch.value .flow.b{bottom:0}
.ch.value .flow::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(172,135,0,.3),rgba(201,162,74,.22) 60%,rgba(172,135,0,0))}
.ch.value .flow::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(172,135,0,.95) 0 50%,rgba(172,135,0,0) 50% 100%);background-size:200% 100%;background-position:100% 0;animation:flow 2.8s var(--ease-io) infinite;animation-delay:var(--fd,0s)}
.ch.value .v1 .flow.b,.ch.value .v2 .flow.t{--fd:.5s}.ch.value .v2 .flow.b,.ch.value .v3 .flow.t{--fd:1s}.ch.value .v3 .flow.b{--fd:1.5s}
@keyframes flow{0%{background-position:100% 0}60%,100%{background-position:-100% 0}}
.ch.value .va h3{font-weight:400;font-size:.95em;line-height:1.5;letter-spacing:.08em;white-space:nowrap;margin:0 0 .55em}
.ch.value .va p{font-size:.8em;line-height:2;letter-spacing:.05em}

/* 送りの案内：確定版の .scroll をそのまま（舞台の中で右下）。名前が替わる時は沈んで浮かぶ */
.scroll{opacity:0;pointer-events:none}
.scroll.show{opacity:1;pointer-events:auto}
.scroll span{display:inline-block;transition:opacity .45s ease,transform .6s var(--ease)}
.scroll.swap span{opacity:0;transform:translateY(8px)}

/* 盤（左下） */
.lab{position:absolute;z-index:30;left:var(--side);bottom:18px;display:flex;gap:4px;align-items:center;background:rgba(255,255,255,.92);border:1px solid #EEE;border-radius:999px;padding:4px 6px 4px 14px;font-size:12px;box-shadow:0 2px 18px rgba(0,0,0,.06);max-width:calc(100% - 36px);overflow-x:auto}
.lab.fold button[data-ch],.lab.fold .re{display:none}
.lab.fold{padding:4px 14px;cursor:pointer}
.lab b{font-weight:500;font-family:var(--disp);letter-spacing:.2em;color:var(--gold);margin-right:6px;font-size:12px;cursor:pointer}
.lab button{font:inherit;font-size:12px;border:1px solid transparent;background:transparent;border-radius:999px;padding:4px 10px;cursor:pointer;color:var(--sub);white-space:nowrap}
.lab button.on{border-color:var(--gold);color:var(--gold)}
.lab .re{border-color:#DDD;color:var(--ink);font-family:var(--disp);letter-spacing:.1em}

/* 高さの低い PC：VISION・VALUE の言葉を少し小さく（部屋の高さを残す） */
@media (min-width:768px) and (max-height:760px){
  .ch.vision{--mf:16px}
  .ch.value{--mf:18px}
  .ch.value .va h3{font-size:.95em}
  .ch.value .va p{font-size:.8em;line-height:1.9}
  .ch.role,.ch.ask{--mf:18px}
  .ch.close{--mf:19px}
  .ch.mission{--mf:24px}
}
/* タブレット：VALUE の三列の本文を少し小さく */
@media (min-width:768px) and (max-width:1099px){
  .ch.value .va h3{font-size:.85em}
  .ch.value .va p{font-size:.725em;line-height:1.9}
}

@media (max-width:767px){
  .co-label{gap:12px}.co-label .jp{font-size:11.5px}
  .ch{letter-spacing:.04em}
  .ch .pc{display:none}.ch .sp{display:contents}
  .ch .head{font-size:22px;margin-bottom:calc(var(--mf) * .8)}
  .ch.mission{--mf:19px}
  .ch.role,.ch.ask{--mf:15.5px}
  .ch.close{--mf:16.5px}
  .ch .para{margin-top:.9em}
  .ch.vision{--mf:15.5px;line-height:1.9}
  .ch.vision .vi + .vi{margin-top:.8em}
  .ch .no{font-size:.84em}
  .ch.value{--mf:14px;line-height:1.75}
  .ch.value .head{margin-bottom:.5em}
  .ch.value .cols{display:block}
  .ch.value .va{position:relative;opacity:1;transform:none;transition:none;padding:12px 0 13px}
  .ch.value .va + .va{margin-top:0}
  .ch.value .va:not(:last-child) .flow.b{display:none}   /* 積む時：線が重ならないよう、次の上の線だけ */
  .ch.value .v1 .flow.t{--fd:0s}.ch.value .v2 .flow.t{--fd:.5s}.ch.value .v3 .flow.t{--fd:1s}.ch.value .v3 .flow.b{--fd:1.5s}
  .ch.value .va .no{display:inline-block;margin:0 .7em 0 0;vertical-align:.1em;font-size:.89em}
  .ch.value .va h3{display:inline;font-size:1.07em;letter-spacing:.06em;margin:0}
  .ch.value .va p{font-size:.93em;line-height:1.72;margin-top:.2em}
  .lab{bottom:14px}
}
@media (prefers-reduced-motion:reduce){
  .ch.value .flow::after{animation:none;background-position:0 0}
  .ch .in{opacity:1!important;transform:none!important}
  .rooms .room{opacity:1!important;transform:none!important;transition:none!important}
  .scroll{opacity:1!important}
}