.hero{height:260vh;position:relative}.stage{height:100svh;position:sticky;top:0;overflow:hidden}.photo{background:var(--img) 30% center / cover;transform-origin:30%;will-change:transform;position:absolute;inset:0}.stage .cap{z-index:1;left:var(--g);position:absolute;top:50%}.panel{background:var(--paper);will-change:transform;width:50%;position:absolute;top:0;bottom:0;right:0}.panel .copy{padding:0 var(--g);animation:1s .35s both fade;position:absolute;top:clamp(88px,13vh,140px);left:0;right:0}.panel h1{font-size:clamp(26px,2.9vw,44px);font-weight:900;line-height:1.3}.panel .sub{margin-top:22px;font-size:14px;font-weight:700;line-height:1.6}.panel .sub span{color:var(--muted);font-weight:500;display:block}.word{white-space:nowrap;padding:0 0 .02em 12px;font-size:9.1vw;position:absolute;bottom:0;left:0;right:0;overflow:hidden}.word span{padding-bottom:.06em;animation:1.1s cubic-bezier(.2,.75,.15,1) both up;display:block}.word span+span{animation-delay:.12s}@keyframes up{0%{transform:translateY(105%)}}@keyframes fade{0%{opacity:0;transform:translateY(14px)}}.hero .disc{margin:calc(var(--d) / -2) 0 0 calc(var(--d) / -2);z-index:5;animation:pop 1.1s .5s var(--ease) both;position:absolute;top:50%;left:50%}@keyframes pop{0%{opacity:0;transform:scale(.4)rotate(-90deg)}}.float{z-index:40;--d:150px;opacity:0;visibility:hidden;transition:opacity .4s var(--ease), transform .4s var(--ease), visibility .4s;position:fixed;bottom:28px;right:28px;transform:translateY(24px)scale(.85)}.float.on{opacity:1;visibility:visible;transform:none}.label-row{padding:var(--g);border-top:1px solid var(--ink);grid-template-columns:repeat(4,1fr);display:grid}.stats{grid-template-columns:repeat(3,1fr);display:grid}.st{padding:40px var(--g) 72px}.st+.st{border-left:1px solid var(--ink)}.st .num{font-size:clamp(96px,13vw,200px)}.st .num small{font-family:var(--f-jp);letter-spacing:0;margin-left:.08em;font-size:.3em;font-weight:900}.st h2{margin-top:40px;font-size:clamp(20px,1.8vw,26px);font-weight:900;line-height:1.5}.st p{color:#444;max-width:24em;margin-top:14px;font-size:15px;font-weight:500;line-height:1.9}.card{color:#fff;height:100svh;position:sticky;top:0;overflow:hidden}.card .bg{background:var(--img) center / cover;transform:scale(var(--s,1.15));will-change:transform;position:absolute;inset:0}.card .bg:after{content:"";background:linear-gradient(#0000 40%,#0000008c);position:absolute;inset:0}.card:after{content:"";opacity:var(--dim,0);pointer-events:none;background:#000;position:absolute;inset:0}.card .meta{padding:0 var(--g);gap:var(--g);grid-template-columns:repeat(4,1fr);display:grid;position:absolute;top:50%;left:0;right:0}.card h2{grid-column:2/4;font-size:clamp(34px,4.6vw,72px);font-weight:900;line-height:1.2}.card p{grid-column:2/4;max-width:30em;font-size:15px;font-weight:700;line-height:1.8}.card .spec{left:var(--g);bottom:var(--g);opacity:.8;position:absolute}.price{padding:0 0 64px}.price-head{gap:var(--g);padding:72px var(--g) 40px;grid-template-columns:repeat(4,1fr);align-items:end;display:grid}.price-head h2{grid-column:1/3;font-size:clamp(40px,5.6vw,88px);font-weight:900;line-height:1.05}.price-head p{grid-column:3/5;font-size:16px;font-weight:700;line-height:1.8}.price-head p em{color:var(--label);font-style:normal}.talk{border-top:1px solid var(--ink);height:260vh;position:relative}.talk .pin{background:var(--paper);place-items:center;height:100svh;display:grid;position:sticky;top:0;overflow:hidden}.talk .pic{background:var(--img) center / cover;width:14vw;height:10vw;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.talk .pic:after{content:"";opacity:var(--dk,0);background:#000;position:absolute;inset:0}.talk .say{text-align:center;flex-direction:column;align-items:center;gap:4vw;display:flex;position:relative}.talk .kick,.talk .sub{background:var(--paper);padding:2px 8px;transition:color .3s,text-shadow .3s,background-color .3s}.talk .on{color:#fff;text-shadow:0 1px 14px #0006;background:0 0}.talk .kick{font-size:clamp(18px,2.4vw,36px);font-weight:900}.talk .line{color:#fff;mix-blend-mode:difference;align-items:center;display:flex}.talk .w{letter-spacing:-.02em;white-space:nowrap;will-change:transform;font-size:13vw;font-weight:900;line-height:1}.talk .gap{width:16vw}.talk .sub{letter-spacing:.04em;font-size:clamp(14px,1.4vw,20px);font-weight:700}.talk .cap{left:var(--g);bottom:var(--g);color:var(--ink);position:absolute}@media (width>=761px) and (height<=880px){.stage{--d:min(clamp(180px, 19vw, 270px), 30vh)}.panel .copy{padding-left:calc(var(--d) / 2 + 32px)}}.teacher .row{gap:var(--g);padding:8px var(--g) 72px;grid-template-columns:repeat(4,1fr);align-items:end;display:grid}.teacher .face{aspect-ratio:4/5;object-fit:cover;object-position:50% 15%;width:100%;height:auto}.teacher h2{font-size:clamp(56px,7vw,112px)}.teacher ul{font-size:15px;font-weight:700;line-height:1.9;list-style:none}.teacher li span{color:var(--label);display:block}.teacher li+li{margin-top:6px}.teacher .btn{justify-self:start}@media (width<=760px){.float{display:none}.teacher .row{grid-template-columns:120px 1fr;gap:12px 16px;padding-bottom:48px}.teacher .face{grid-row:1/3}.teacher h2{align-self:end;font-size:44px}.teacher ul{align-self:start;font-size:13px;line-height:1.7}.teacher .btn{grid-column:1/-1}.hero{height:200vh}.photo{background-position:40% 30%}.stage{--split:min(50%, calc(100% - 36vw - 250px))}.stage .cap{top:auto;bottom:calc(100% - var(--split) + 12px)}.panel{width:100%;top:var(--split)}.hero .disc{top:var(--split)}.panel .copy{top:calc(var(--d) / 2 + 18px)}.panel h1{font-size:27px}.panel .sub{margin-top:12px;font-size:13px}.word{font-size:20.6vw}.stats{grid-template-columns:1fr}.st{padding:28px var(--g) 40px}.st+.st{border-left:0;border-top:1px solid var(--rule)}.st .num{font-size:28vw}.st h2{margin-top:22px;font-size:20px}.st p{margin-top:8px;font-size:14px}.card .meta{top:auto;bottom:calc(118px + env(safe-area-inset-bottom));grid-template-columns:1fr;gap:12px}.card .spec{bottom:calc(88px + env(safe-area-inset-bottom))}.card h2,.card p{grid-column:1}.card h2{font-size:34px}.card p{font-size:14px}.price-head{padding:56px var(--g) 28px;grid-template-columns:1fr;gap:14px}.price-head h2,.price-head p{grid-column:1}.price-head p{font-size:14px}.talk{height:220vh}.talk .say{gap:14px}.talk .w{font-size:17vw}.talk .pic{width:16vw;height:12vw}}@media (prefers-reduced-motion:reduce){.hero,.talk{height:auto}}
