@font-face{font-family:Gonta;src:url('assets/fonts/fz-gontakana.otf') format('opentype');font-display:swap}
:root{--navy:#101b43;--red:#ed1745;--cream:#f6f0e5;--yellow:#ffe451;--green:#06a94b;--paper:#fffcf5;--body:'Zen Kaku Gothic New','Hiragino Sans',sans-serif;--punch:Gonta,'Dela Gothic One',sans-serif;--enter:cubic-bezier(.16,1,.3,1)}
*{box-sizing:border-box}html{scroll-padding-top:24px;-webkit-text-size-adjust:100%;scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--navy);font:500 17px/1.9 var(--body);line-break:strict;overflow-wrap:anywhere}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}img,video{display:block;max-width:100%;height:auto}a{color:inherit}h1,h2,h3,p,figure{margin:0}h1,h2,h3{font-weight:900}p+p{margin-top:1.3em}.in{width:min(1120px,calc(100% - 64px));margin:auto}.reading{max-width:740px}.section{padding:112px 0}.section-head{margin-bottom:40px}.section-head h2{font-size:clamp(28px,3.6vw,44px);line-height:1.45;letter-spacing:-.035em;word-break:auto-phrase}.section-head p{max-width:650px;margin-top:22px}.section-kicker,.eyebrow{font-size:12px;font-weight:900;letter-spacing:.12em}.section-kicker{display:block;color:var(--red);margin-bottom:18px}.en{font-family:Anton,Impact,sans-serif;font-weight:400;letter-spacing:.015em;line-height:1}.site-header{padding:18px 0;background:var(--navy);color:white}.site-header .in{display:flex;justify-content:space-between;align-items:center;gap:16px}.brand{font-family:Anton,Impact,sans-serif;font-size:32px;text-decoration:none;line-height:1}.header-note{font-size:11px;letter-spacing:.08em}.hero{position:relative;isolation:isolate;overflow:hidden;background-image:linear-gradient(#101b4307 1px,transparent 1px),linear-gradient(90deg,#101b4307 1px,transparent 1px);background-size:20px 20px}.hero:before{content:'';position:absolute;z-index:-1;background:var(--red);width:900px;height:140px;right:-450px;top:40%;transform:rotate(-40deg)}.hero-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.9fr);gap:58px;align-items:center;padding:68px 0 78px}.hero .eyebrow{margin-bottom:26px;letter-spacing:.02em}.fv-title{font-size:clamp(31px,3.5vw,48px);line-height:1.45;letter-spacing:-.055em;position:relative}.fv-title .drop,.fv-title .slam{display:block;transform-origin:50% 100%}.fv-title .slam{color:var(--red)}.project-name{font-size:clamp(20px,2.2vw,27px);font-weight:900;line-height:1.45;margin-top:24px}.project-name .en{display:block;font-size:80px;letter-spacing:-.03em;margin-top:12px}.hero .lead{font-size:16px;max-width:34em;margin-top:22px}.hero-visual{position:relative;transform:rotate(2deg);background:var(--navy);box-shadow:12px 12px 0 var(--navy);max-width:450px;margin:0 auto}.hero-visual img{width:100%;aspect-ratio:900/1180;object-fit:cover;object-position:top}.availability{display:flex;align-items:center;gap:10px;font-size:12px;font-weight:900;line-height:1.6;margin:28px 0 12px}.availability strong{background:var(--navy);color:white;padding:4px 10px;white-space:nowrap}.cta{display:flex;align-items:center;justify-content:center;gap:12px;min-height:66px;width:100%;padding:15px 20px;background:var(--green);color:white;border:0;border-radius:8px;text-decoration:none;text-align:center;font-size:clamp(14px,1.5vw,17px);font-weight:900;line-height:1.65;box-shadow:0 5px 0 #067337;transition:transform .16s var(--enter),box-shadow .16s var(--enter)}.cta:hover{transform:translateY(-2px);box-shadow:0 7px 0 #067337}.cta:active{transform:translateY(3px);box-shadow:0 2px 0 #067337}.cta:after{content:'↗';font-size:23px;line-height:1;flex:0 0 auto}.cta-note{font-size:12px;line-height:1.8;margin-top:14px}.ticker{overflow:hidden;background:var(--red);color:white;white-space:nowrap;padding:14px 0;transform:rotate(-1.5deg);width:100%;position:relative;z-index:1}.ticker-track{display:flex;width:max-content;animation:tick 36s linear infinite}.ticker span{font:36px/1 Anton,Impact,sans-serif;padding-right:32px}.ticker b{color:var(--yellow);margin:0 22px;font-weight:400}@keyframes tick{to{transform:translateX(-50%)}}
.dark{background:var(--navy);color:white}.dark .section-kicker{color:var(--yellow)}.pv-section{padding-top:100px}.pv-layout{display:grid;grid-template-columns:.8fr 1.2fr;align-items:center;gap:64px}.pv-section h2{font-size:clamp(30px,3.3vw,42px)}.pv-section .section-head{margin:0}.pv-list{margin-top:22px}.watch{display:block;border:0;padding:0;text-align:inherit;width:100%;position:relative;overflow:hidden;background:#060c1f;color:white}.watch img{width:100%;height:100%;object-fit:cover;transition:transform .48s var(--enter),opacity .24s}.watch:hover img{transform:scale(1.025);opacity:.8}.watch:after{content:'';position:absolute;inset:45% 0 0;background:linear-gradient(transparent,#000b);pointer-events:none}.watch-label{position:absolute;z-index:1;left:20px;right:20px;bottom:22px;display:flex;align-items:center;gap:14px;font-weight:900;font-size:14px;line-height:1.6}.play{display:grid;place-items:center;width:54px;height:54px;border-radius:50%;background:var(--yellow);color:var(--navy);flex:0 0 auto}.play svg{width:18px;height:18px;fill:currentColor}.pv-watch{aspect-ratio:16/9}.pv-caption{font-size:12px;margin-top:12px;color:#c5cad8}.problem .section-head{max-width:900px}.problem h2{max-width:20em}.problem-body{display:grid;grid-template-columns:1fr 1fr;gap:64px}.problem-questions{position:relative;padding:32px 0 32px 28px;font-weight:900;font-size:clamp(21px,2.3vw,29px);line-height:1.9}.problem-questions:before{content:'';position:absolute;left:0;top:28px;bottom:28px;width:7px;background:var(--red);transform:skewY(-12deg)}.problem-body .conclusion{font-weight:900;color:var(--red)}.works{position:relative}.works .section-head{text-align:center;display:grid;justify-items:center}.works .section-head h2{font-size:clamp(34px,4vw,52px);color:var(--yellow)}.reels{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:64px;max-width:850px;margin:auto}.reel h3{font-size:23px;margin-bottom:20px;display:flex;align-items:center;gap:12px}.reel h3:before{content:'★';color:var(--yellow);font-size:22px}.reel .watch{aspect-ratio:9/16;max-width:340px;margin:auto;background:#050b19}.reel-copy{font-size:15px;margin-top:22px}.reel .watch-label{left:16px;right:16px;bottom:20px;font-size:13px}.reel .play{width:46px;height:46px}.process .section-head{max-width:900px}.process-rows{margin-top:48px;display:grid;gap:0}.process-row{display:grid;grid-template-columns:72px 270px 1fr;gap:26px;align-items:start;padding:32px 0;border-top:1px solid #101b4326}.process-row:last-child{border-bottom:1px solid #101b4326}.process-num{font-size:58px;color:var(--red);line-height:1}.process-row h3{font-size:23px;line-height:1.6}.process-row p{font-size:16px}.together{background:var(--red);color:white;overflow:hidden}.together-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}.together .section-head{margin-bottom:28px}.together .section-kicker{color:var(--yellow)}.together figure{transform:rotate(-3deg);box-shadow:12px 12px 0 var(--navy)}.together img{width:100%;aspect-ratio:4/3;object-fit:cover}.together .line{font-weight:900}.last{padding:110px 0 130px}.last .in{max-width:740px;text-align:center}.last h2{font-size:clamp(35px,5vw,58px);line-height:1.4;margin-bottom:32px}.last .availability{justify-content:center;margin-top:32px}.last .cta{max-width:500px;margin:auto}.last .cta-note{max-width:500px;margin:18px auto 0}.site-footer{background:var(--navy);color:#b8bfd4;padding:28px 0;text-align:center;font-size:11px}.sticky{position:fixed;bottom:0;left:0;right:0;z-index:10;padding:12px max(20px,env(safe-area-inset-right)) calc(14px + env(safe-area-inset-bottom));pointer-events:none;background:linear-gradient(transparent,#f6f0e5ef);transition:opacity .18s}.sticky .cta{max-width:500px;margin:auto;pointer-events:auto;min-height:58px;font-size:14px}.sticky.off{opacity:0;visibility:hidden}.media-dialog{border:0;padding:0;background:#080d19;color:white;width:min(1000px,calc(100% - 24px));max-height:calc(100dvh - 32px);overflow:visible}.media-dialog::backdrop{background:#030817e8}.modal-head{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:10px 10px 10px 18px;font-size:13px}.modal-head h2{font-size:14px}.close-button{background:var(--paper);color:var(--navy);border:0;min-width:64px;min-height:44px;padding:8px 12px;font-size:13px;font-weight:900}.modal-content{display:flex;justify-content:center;align-items:center}.modal-content video{width:100%;max-height:calc(100dvh - 115px);background:#000}.media-dialog.portrait{max-width:430px}.modal-content iframe{border:0;width:100%;height:min(76dvh,730px);aspect-ratio:9/16}.video-error{padding:24px;font-size:15px}.video-error a{display:inline-block;margin-top:12px;min-height:44px}.sr-only{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}:focus-visible{outline:3px solid var(--red);outline-offset:5px}.dark :focus-visible{outline-color:var(--yellow)}
/* STAR r2の冒頭落下・着地、見出し出現、追従CTAを継承。非対応時は本文を隠さない。 */
.mo .drop{transform:translateY(-100vh)}.mo .slam{opacity:0}.mo .fv-btn{opacity:0;translate:0 12px;transition:opacity .48s var(--enter),translate .48s var(--enter)}.mo .fv-btn.is-in{opacity:1;translate:0 0}.mo .sec-head{opacity:0;translate:0 22px;transition:opacity .48s var(--enter),translate .48s var(--enter)}.mo .sec-head.is-in{opacity:1;translate:0 0}
@media(max-width:899px){.in{width:min(680px,calc(100% - 40px))}.section{padding:76px 0}.hero-grid{grid-template-columns:1fr;gap:38px;padding:38px 0 56px}.hero-copy{max-width:590px}.hero-visual{max-width:410px;width:100%;box-shadow:8px 8px 0 var(--navy)}.hero .eyebrow{font-size:11px;margin-bottom:20px}.fv-title{font-size:clamp(27px,5.7vw,42px)}.project-name{font-size:22px;margin-top:20px}.project-name .en{font-size:62px;display:none}.hero .lead{font-size:15px;margin-top:18px}.availability{margin-top:22px}.cta{font-size:14px;min-height:66px;padding-inline:12px;gap:8px}.header-note{font-size:10px}.pv-layout{grid-template-columns:1fr;gap:32px}.pv-section .section-head{max-width:650px}.problem-body{grid-template-columns:1fr;gap:20px}.problem-questions{margin-top:20px}.reels{gap:30px}.reel h3{font-size:20px}.reel-copy{font-size:14px}.process-row{grid-template-columns:45px 1fr;gap:16px}.process-row p{grid-column:2;font-size:15px;margin-top:-8px}.process-num{font-size:43px;grid-row:span 2}.process-row h3{font-size:21px}.together-grid{grid-template-columns:1fr;gap:36px}.together figure{max-width:580px}.last{padding:80px 0 110px}.ticker span{font-size:26px}.watch-label{font-size:13px;left:14px;right:14px;bottom:16px}.play{width:46px;height:46px}.section-head h2{font-size:30px}.reel .watch-label{font-size:12px;gap:8px}}
@media(max-width:560px){.reels{grid-template-columns:1fr;max-width:340px;gap:48px}.reel .watch{max-width:300px}.reel h3{justify-content:center}.hero-visual{max-width:310px}.section-head{margin-bottom:28px}.pv-list{font-size:16px}.section-head h2{font-size:28px}.last h2{font-size:35px}.hero-grid{gap:38px}.hero:before{top:65%;right:-650px}.project-name{font-size:20px}.problem-questions{font-size:23px}.process-row{padding:26px 0}.reel-copy{text-align:left}.last .availability,.hero .availability{gap:7px;font-size:11px}.hero .cta:after,.last .cta:after{font-size:20px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.ticker-track{animation:none}.mo .drop{transform:none!important}.mo .slam,.mo .fv-btn,.mo .sec-head{opacity:1!important;translate:none!important;transition:none!important}.watch img,.cta{transition:none}}@media print{.sticky,.ticker,.media-dialog{display:none}.mo .drop{transform:none!important}.mo .slam,.mo .fv-btn,.mo .sec-head{opacity:1!important;translate:none!important}}

.works-intro{margin:0 auto 40px;text-align:center}.works-intro + .reels{margin-top:40px}

.brand{display:inline-flex;align-items:center;min-width:90px;min-height:44px}.hero .slam{line-height:1.3;margin-top:8px}.works-intro{margin:0 auto 40px;text-align:center}

/* 本人指定：自動再生なし、タップした場所で再生。 */
.media-slot{position:relative;width:100%;overflow:hidden;background:#060c1f;aspect-ratio:16/9}
.media-slot .watch{height:100%;max-width:none;margin:0;aspect-ratio:auto}
.reel .media-slot{aspect-ratio:9/16;max-width:340px;margin:auto}
.inline-player,.inline-player video,.inline-player iframe{position:absolute;inset:0;width:100%;height:100%;border:0;background:#000}
.inline-player video{object-fit:contain}
[hidden]{display:none!important}
.sound-hint{display:block;margin-top:3px;font-size:11px;font-weight:700;color:var(--yellow)}
@media(max-width:560px){.reel .media-slot{max-width:300px}}

main{overflow-x:clip}

/* 元の4px・角丸なしを保ち、CPJ濃紺背景にクリーム色の輪郭を付ける。 */
.media-slot{border:4px solid var(--cream);border-radius:0}
