/* トップFV（2026-10-30）。スコープは .spfv の中だけ */
.spfv{--blue:#6398BC;--blue-deep:#3F7396;--ylw:#EBDD9A;--ylw-deep:#D9B93F;--ink:#2F2C26;--gray:#8A887E;--rule:#ECEBE3;--white:#FFFFFF;--panel:#F3F2EC;
  --jp:"LINE Seed JP","Hiragino Kaku Gothic ProN",sans-serif;--en:"LINE Seed JP",sans-serif;--mono:"IBM Plex Mono",ui-monospace,monospace;
  color:var(--ink);font-family:var(--jp);line-height:1.8;max-width:1360px;margin-inline:auto;padding:clamp(16px,3vw,40px) clamp(16px,4vw,48px) clamp(32px,5vw,64px);
  display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:clamp(24px,3.5vw,52px);align-items:center}
.spfv *{box-sizing:border-box}
.spfv .eyebrow{font-family:var(--mono);font-weight:600;color:var(--blue-deep);font-size:.78rem;letter-spacing:.08em;margin:0 0 12px}
.spfv .catch{margin:0 0 20px;font-weight:900;font-size:clamp(2rem,3.6vw,3.1rem);line-height:1.32;text-wrap:balance}
.spfv .catch span{background:linear-gradient(transparent 62%,var(--ylw) 62%)}
.spfv .catch small{display:block;font-size:.56em;font-weight:700;margin-top:10px;line-height:1.5}
.spfv .lead{margin:0 0 26px;font-size:.98rem}
.spfv .cta{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:24px}
.spfv .cta .btn{display:inline-flex;width:auto;align-items:center;justify-content:center;min-height:52px;padding:10px 28px;border-radius:5px;border:2px solid var(--ylw);background:var(--ylw);color:var(--blue-deep);font-weight:700;font-size:1rem;text-decoration:none;cursor:pointer}
.spfv .cta .btn:hover{background:var(--blue);border-color:var(--blue);color:var(--ylw)}
.spfv .cta .btn.ol{background:var(--white);border-color:var(--blue);color:var(--blue-deep)}
.spfv .cta .btn:hover.ol{background:var(--blue);color:var(--white)}
.spfv .cta .btn:focus-visible,.spfv .ctrl button:focus-visible{outline:3px solid var(--blue-deep);outline-offset:2px}
.spfv .proof{display:flex;flex-wrap:wrap;gap:6px 20px;margin:0;padding:0;list-style:none;font-size:.8rem;font-weight:500}
.spfv .proof b{font-family:var(--en);color:var(--blue-deep);font-size:1rem;margin-right:4px}
@media (max-width:767px){.spfv{grid-template-columns:minmax(0,1fr)}}
.spfv .stagebox{min-width:0}
.spfv .stage{position:relative;container-type:inline-size;aspect-ratio:16/11;width:100%;background-color:var(--white);overflow:hidden;box-shadow:0 18px 50px -24px rgba(47,44,38,.35);
  background-image:linear-gradient(var(--rule) 1px,transparent 1px),linear-gradient(90deg,var(--rule) 1px,transparent 1px);background-size:44px 44px}
.spfv .stage::before{content:"";position:absolute;z-index:3;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,var(--blue),var(--ylw-deep),var(--blue-deep))}
.spfv .stage canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.spfv .hud{position:absolute;z-index:3;left:3cqw;right:3cqw;top:2.2cqw;display:flex;justify-content:space-between;gap:2cqw;font-family:var(--mono);font-weight:600;font-size:max(8px,1.25cqw);letter-spacing:.07em;color:var(--ink)}
.spfv .hud .l span{color:var(--gray);margin-left:1.6cqw;font-variant-numeric:tabular-nums}
.spfv .foot{position:absolute;z-index:3;right:3cqw;bottom:1.8cqw;font-size:max(8px,1.05cqw);color:var(--gray)}
.spfv .scene{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .35s ease}
.spfv .scene.on{opacity:1;visibility:visible}
.spfv .anim .scene.on .pop{animation:spfv-pop .6s cubic-bezier(.2,.8,.2,1) both;animation-delay:var(--d,0s)}
.spfv .anim .scene.on .ch{display:inline-block;animation:spfv-ch .5s cubic-bezier(.2,.8,.2,1) both;animation-delay:var(--d,0s)}
@keyframes spfv-pop{from{opacity:0;transform:translateY(2.4cqw)}to{opacity:1;transform:none}}
@keyframes spfv-ch{from{opacity:0;transform:translateY(.45em);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}
.spfv .grad{color:var(--blue-deep)}
.spfv .h{font-weight:900;line-height:1.3;letter-spacing:-.01em;margin:0}
.spfv .cam{position:absolute;left:3cqw;right:3cqw;top:7cqw;bottom:4cqw;display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(4,1fr);gap:1.1cqw;transform-origin:50% 50%}
.spfv .anim .scene.on .cam{animation:spfv-pull 1.5s cubic-bezier(.65,0,.2,1) 2.5s both}
@keyframes spfv-pull{from{transform:scale(1.96)}to{transform:scale(1)}}
.spfv .anim .scene .cam{transform:scale(1.96)}
.spfv .k{display:flex;flex-direction:column;position:relative;background:var(--white);border-top:.32cqw solid var(--blue);padding:1cqw 1.1cqw;box-shadow:0 .5cqw 1.6cqw rgba(47,44,38,.1);min-width:0;overflow:hidden}
.spfv .k.y{border-top-color:var(--ylw-deep);background:#FFFCEB}
.spfv .k b{display:block;font-family:var(--mono);font-weight:600;font-size:.95cqw;letter-spacing:.06em;color:var(--blue-deep)}
.spfv .k.y b{color:#927A1B}
.spfv .k p{margin:.25cqw 0 0;font-weight:900;font-size:1.65cqw;line-height:1.35}
.spfv .k small{display:block;font-size:1.02cqw;font-weight:500;line-height:1.5;color:#6E6C63;margin-top:.35cqw}
.spfv .k u{margin-top:auto;align-self:flex-start;text-decoration:none;font-family:var(--jp);font-weight:700;font-size:1.05cqw;line-height:1.4;color:var(--white);background:var(--blue-deep);padding:.22cqw .8cqw;border-radius:99px}
.spfv .k u::before{content:"●";margin-right:.45em;font-size:.65em;vertical-align:.12em;color:var(--ylw)}
.spfv .anim .scene.on .k.far{animation:spfv-far .5s ease both;animation-delay:calc(2.7s + var(--d,0s))}
@keyframes spfv-far{from{opacity:0}to{opacity:1}}
.spfv .over{position:absolute;left:50%;top:50%;translate:-50% -50%;white-space:nowrap;background:var(--ink);color:var(--white);font-weight:700;font-size:max(12px,2.6cqw);padding:1.3cqw 3.2cqw;border-radius:99px;box-shadow:0 1.4cqw 4cqw rgba(47,44,38,.35)}
.spfv .anim .scene.on .over{animation:spfv-pop .5s ease both 3.8s}
.spfv .split{position:absolute;inset:0;display:grid;grid-template-columns:40% 60%}
.spfv .split>div{position:relative;padding:12cqw 4cqw 4cqw;min-width:0}
.spfv .lf{background:var(--panel);color:var(--gray)}
.spfv .rt{background:var(--white);border-left:.25cqw solid var(--blue)}
.spfv .lab{font-family:var(--mono);font-weight:600;font-size:max(8px,1.25cqw);letter-spacing:.08em;margin:0 0 1.6cqw}
.spfv .lab::before{content:"●";margin-right:.6em;font-size:.8em}
.spfv .lf .h{font-size:max(22px,5.6cqw);color:#B2B0A5}
.spfv .rt .h{font-size:max(24px,6.6cqw)}
.spfv .ln{font-weight:700;font-size:max(11px,1.95cqw);line-height:1.6;margin:1.8cqw 0 0;color:var(--ink)}
.spfv .lf .ln{color:var(--gray)}
.spfv .tasks{margin:2.6cqw 0 0;padding:0;list-style:none;font-family:var(--mono);font-size:max(8px,1.2cqw);line-height:2;color:#A5A398}
.spfv .tl{position:absolute;left:4cqw;right:4cqw;bottom:6cqw;height:7cqw}
.spfv .tl::before{content:"";position:absolute;left:0;right:0;top:.75cqw;height:1px;background:var(--gray)}
.spfv .anim .scene.on .tl::before{animation:spfv-grow 1.6s ease both .9s;transform-origin:left}
@keyframes spfv-grow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.spfv .tl ul{position:relative;display:flex;justify-content:space-between;margin:0;padding:0;list-style:none}
.spfv .tl li{font-size:max(9px,1.45cqw);font-weight:700;text-align:center;line-height:1.3}
.spfv .tl li::before{content:"";display:block;width:1.6cqw;height:1.6cqw;border-radius:50%;margin:0 auto 1cqw;background:var(--c,var(--blue))}
.spfv .ttl{position:absolute;left:4cqw;right:4cqw;top:8cqw;font-size:max(18px,4.5cqw);white-space:nowrap}
.spfv .nums{position:absolute;left:4cqw;right:4cqw;top:19cqw;bottom:6cqw;display:grid;grid-template-columns:repeat(4,1fr);gap:1.4cqw}
.spfv .nu{background:var(--white);border-top:.45cqw solid var(--c,var(--blue));padding:2cqw 1.8cqw;box-shadow:0 .8cqw 2.4cqw rgba(47,44,38,.1);display:flex;flex-direction:column;min-width:0}
.spfv .nu i{font:800 max(24px,6cqw)/1 var(--en);font-style:normal;color:var(--c,var(--blue))}
.spfv .nu small{font-family:var(--mono);font-size:max(7px,1.05cqw);letter-spacing:.06em;color:var(--gray);margin-top:1cqw;line-height:1.3}
.spfv .nu b{font-size:max(15px,3.2cqw);font-weight:900;line-height:1.3;margin-top:1.6cqw}
.spfv .nu span{font-size:max(9px,1.5cqw);line-height:1.6;margin-top:1cqw;font-weight:500}
.spfv .end{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2.6cqw;padding:5cqw;text-align:center}
.spfv .end .h{font-size:max(30px,9.4cqw)}
.spfv .end img{width:17cqw;height:auto}
.spfv .end .sub{margin:0;font-weight:700;font-size:max(11px,2.1cqw);line-height:1.6}
.spfv .pill{background:var(--ink);color:var(--white);font-weight:700;font-size:max(11px,2cqw);padding:1.2cqw 3cqw;border-radius:99px;line-height:1.5}
.spfv .pill::before{content:"●";color:var(--ylw);margin-right:.7em;font-size:.7em;vertical-align:.1em}
.spfv .ctrl{display:flex;align-items:center;gap:10px;margin-top:10px}
.spfv .ctrl button{border:0;background:transparent;cursor:pointer;font:inherit}
.spfv .dots{display:flex;gap:6px}
.spfv .dots button{width:34px;height:24px;display:flex;align-items:center;padding:0}
.spfv .dots button i{display:block;width:100%;height:3px;background:#CFCDBE}
.spfv .dots button[aria-current="true"] i{background:var(--blue-deep)}
.spfv .pp{white-space:nowrap;font-family:var(--mono);font-size:.74rem;font-weight:600;color:var(--blue-deep);padding:4px 8px;min-height:24px}
.spfv .cap{margin:0 0 0 auto;font-family:var(--mono);font-size:.7rem;color:var(--gray);white-space:nowrap}
@media (max-width:440px){
.spfv .cap{display:none}
}
@media (max-width:767px){
.spfv .fv{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:560px){
.spfv .stage{aspect-ratio:1/1}
.spfv .nums{grid-template-columns:repeat(2,1fr);top:17cqw;bottom:5cqw}
.spfv .nu i{font-size:max(18px,6cqw)}
.spfv .nu span{display:none}
.spfv .nu small{display:none}
.spfv .nu b{margin-top:1cqw}
.spfv .split>div{padding:14cqw 3cqw 3cqw}
.spfv .tasks{display:none}
}
@container (max-width:560px){
.spfv .hud>div:last-child{display:none}
.spfv .hud{font-size:9px}
.spfv .scene .cam,.spfv .anim .scene .cam,.spfv .anim .scene.on .cam{animation:none;transform:none}
.spfv .cam{left:12px;right:12px;top:32px;bottom:26px;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:8px}
.spfv .k.far{display:none}
.spfv .k{padding:12px 11px;border-top-width:3px}
.spfv .k b{font-size:10px}
.spfv .k p{font-size:14px;line-height:1.4;margin-top:3px}
.spfv .k small{font-size:11.5px;line-height:1.55;margin-top:5px}
.spfv .k u{font-size:11px;padding:2px 9px}
.spfv .over{font-size:13px;padding:8px 16px}
.spfv .lab{font-size:9px}
.spfv .ln{font-size:12px}
.spfv .tl li{font-size:11px}
.spfv .tl{bottom:24px;height:40px}
.spfv .tl li::before{width:9px;height:9px;margin-bottom:5px}
.spfv .tl::before{top:4px}
.spfv .foot{font-size:9px;bottom:6px}
.spfv .nu b{font-size:18px}
.spfv .nu span{display:block;font-size:12px;line-height:1.6;margin-top:6px}
.spfv .nu{padding:12px}
.spfv .ttl{font-size:4.5cqw}
.spfv .end .sub{font-size:12.5px}
.spfv .pill{font-size:12px;padding:7px 14px}
.spfv .end img{width:92px}
}
@media (prefers-reduced-motion:reduce){
.spfv .scene{transition:none}
.spfv .anim .scene.on *,.spfv .anim .scene *{animation:none!important}
.spfv .anim .scene .cam{transform:none}
}
.spfv .s3{position:absolute;left:4cqw;right:4cqw;top:6.6cqw;bottom:3.6cqw;display:flex;flex-direction:column;gap:1.5cqw}
.spfv .s3 .ttl{position:static;white-space:nowrap}
.spfv .s3 .nums{position:static;flex:none;align-items:stretch}
.spfv .s3 .nu{padding:1.5cqw 1.6cqw}
.spfv .s3 .nu i{font-size:max(22px,4cqw)}
.spfv .s3 .nu small{margin-top:.5cqw}
.spfv .s3 .nu b{font-size:max(15px,2.5cqw);margin-top:.5cqw}
.spfv .s3 .nu span{margin-top:.3cqw}
.spfv .chart{position:relative;flex:1;min-height:0}
.spfv .chart svg{position:absolute;inset:0;width:100%;height:100%;display:block;overflow:visible}
.spfv .anim .scene.on .chart svg{animation:spfv-chartclip 1.8s cubic-bezier(.5,0,.2,1) 1.7s both}
@keyframes spfv-chartclip{from{clip-path:inset(-10% 100% -10% 0)}to{clip-path:inset(-10% -2% -10% 0)}}
.spfv .chart .pt{position:absolute;width:1.5cqw;height:1.5cqw;min-width:9px;min-height:9px;border-radius:50%;background:var(--c);border:.3cqw solid var(--white);box-shadow:0 .2cqw .8cqw rgba(47,44,38,.3);translate:-50% -50%}
.spfv .chart .cl{position:absolute;left:0;top:0;font-family:var(--mono);font-weight:600;font-size:max(9px,1.2cqw);letter-spacing:.06em;color:var(--blue-deep);line-height:1.4}
.spfv .chart .up{position:absolute;right:19%;top:-.3cqw;font-weight:900;font-size:max(11px,2.2cqw);line-height:1.4;color:var(--ink)}
.spfv .chart .up::after{content:" ↗";color:var(--ylw-deep)}
@container (max-width:560px){
  .spfv .s3{left:12px;right:12px;top:30px;bottom:22px;gap:5px}
  .spfv .s3 .ttl{font-size:4.5cqw}
  .spfv .s3 .nums{gap:5px}
  .spfv .s3 .nu{padding:6px 8px;display:grid;grid-template-columns:auto 1fr;column-gap:6px;align-items:baseline}
  .spfv .s3 .nu i{font-size:15px}
  .spfv .s3 .nu b{font-size:14px;margin:0}
  .spfv .s3 .nu span{grid-column:1/-1;font-size:11px;line-height:1.45;margin-top:1px}
  .spfv .chart .cl{font-size:9px}.spfv .chart .up{font-size:11px}
}
@media (max-width:767px){.spfv .cta{display:grid;grid-template-columns:1fr 1fr;gap:10px}.spfv .cta .btn{width:100%;padding:10px 8px;font-size:.95rem}}
