.ips5.tb{--dark:#0b0f14;--dk2:#141a22;--paper:#f3efe6;--lex:'Lexend',sans-serif;background:#fff;padding-bottom:96px}
.ips5.tb .eb{font:500 12px/1 var(--lex);letter-spacing:.22em;color:var(--slate);margin:0 0 22px}
.ips5 .grain{position:absolute;inset:-50%;pointer-events:none;z-index:3;opacity:.07;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
@media (prefers-reduced-motion:no-preference){.ips5 .grain{animation:tb-grain 1s steps(4) infinite}}
@keyframes tb-grain{0%{transform:translate(0,0)}25%{transform:translate(-4%,3%)}50%{transform:translate(3%,-2%)}75%{transform:translate(-2%,-4%)}100%{transform:translate(0,0)}}

/* 시안 바깥 틀(overflow:hidden auto)이 스크롤 상자가 되어 position:sticky 가 전부 안 먹던 것 → 가로만 잘라내는 clip 으로 (세로 스크롤은 창) */
div:has(> .ips5){overflow-x:clip!important;overflow-y:visible!important}
.ips5 .toc,.ips5 .side{top:156px}   /* 이제 고정이 실제로 먹으므로 사이트 머리(약 137px) 아래에 */

/* ── ABOUT ── */
.ips5 .ab-open{position:relative;overflow:hidden;background:var(--dark);color:var(--paper);min-height:min(78vh,720px);display:grid;place-items:center;padding:96px 0 72px;isolation:isolate}
html.ips-fx .ips5 .ab-open[data-rv]{opacity:1;transform:none}
.ips5 .ab-open .vig{position:absolute;inset:0;z-index:2;pointer-events:none;background:radial-gradient(ellipse at 50% 46%,transparent 30%,rgba(0,0,0,.72) 100%)}
@media (prefers-reduced-motion:no-preference){.ips5 .ab-open .vig{animation:tb-breathe 3s ease-in-out infinite alternate}}
@keyframes tb-breathe{from{opacity:.75}to{opacity:1}}
.ips5 .ab-film{position:relative;z-index:1;width:min(560px,78%)}
.ips5 .ab-film img{width:100%;filter:drop-shadow(0 0 24px rgba(58,120,255,.35))}
html.ips-fx .ips5 .ab-open:not(.is-in) .ab-film{opacity:0}
@media (prefers-reduced-motion:no-preference){html.ips-fx .ips5 .ab-open.is-in .ab-film{animation:tb-flick 1.6s steps(1) both}}
@keyframes tb-flick{0%{opacity:0}12%{opacity:.8}16%{opacity:.1}24%{opacity:.9}30%{opacity:.3}38%,100%{opacity:1}}
.ips5 .ab-cap{position:relative;z-index:4;text-align:center;margin-top:44px}
.ips5 .ab-k{font:500 12px/1 var(--lex);letter-spacing:.3em;color:#7fb7c9;margin:0 0 16px}
.ips5 .ab-t{font:300 clamp(56px,9vw,120px)/1 var(--lex);letter-spacing:-.02em;margin:0;color:var(--paper)}
@media (prefers-reduced-motion:no-preference){html.ips-fx .ips5 .ab-open.is-in .ab-t{animation:tb-track 2.4s cubic-bezier(.165,.84,.44,1) .35s both}}
@keyframes tb-track{from{letter-spacing:.55em;opacity:0;filter:blur(8px)}to{letter-spacing:-.02em;opacity:1;filter:blur(0)}}
.ips5 .ab-intro{max-width:880px;text-align:center;padding:96px 0 40px}
.ips5 .ab-lead{font:300 clamp(20px,2.2vw,26px)/1.55 var(--lex);color:var(--ink2);text-wrap:balance}
.ips5 .ab-ask{margin-top:44px;display:flex;flex-wrap:wrap;justify-content:center;gap:6px 18px;font:400 clamp(18px,2vw,22px)/1.4 var(--lex);color:var(--slate)}
.ips5 .ab-ask b{flex-basis:100%;font-weight:500;color:var(--ink);font-size:clamp(24px,2.8vw,32px);margin-top:10px;position:relative;justify-self:center}
.ips5 .ab-ask b:after{content:"";display:block;height:3px;width:min(320px,70%);margin:12px auto 0;background:linear-gradient(90deg,var(--w1),var(--w2));transform-origin:left;transform:scaleX(var(--ub,1));transition:transform .9s var(--ease) 1.2s}
html.ips-fx .ips5 .ab-ask:not(.is-in) b:after{--ub:0}
html.ips-fx .ips5 .ab-ask:not(.is-in) span,html.ips-fx .ips5 .ab-ask:not(.is-in) b{opacity:0;transform:translateY(10px)}
html.ips-fx .ips5 .ab-ask span,html.ips-fx .ips5 .ab-ask b{transition:opacity .6s var(--ease),transform .6s var(--ease);transition-delay:calc(var(--i,3) * 220ms + 200ms)}
.ips5 .ab-ask b{--i:3}
/* 전광판 */
.ips5 .ab-board{background:var(--dark);color:var(--paper);padding:72px 0 64px;margin-top:56px}
html.ips-fx .ips5 .ab-board[data-rv]{transform:none}
.ips5 .ab-board .eb{color:#8a96a8}
.ips5 .ab-stats{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid rgba(243,239,230,.12)}
.ips5 .ab-stats .cell{padding:34px 8px 30px;border-bottom:1px solid rgba(243,239,230,.12)}
.ips5 .ab-stats .cell:not(:nth-child(3n)){border-right:1px solid rgba(243,239,230,.12);padding-right:24px}
.ips5 .ab-stats .cell:not(:nth-child(3n+1)){padding-left:28px}
.ips5 .ab-stats b{display:block;font:300 clamp(40px,5vw,64px)/1 var(--lex);letter-spacing:-.02em;color:#fff;font-variant-numeric:tabular-nums}
.ips5 .ab-stats .cell>span{display:block;margin-top:14px;font:400 14px/1.4 var(--lex);color:#9aa5b5;letter-spacing:.02em}
.ips5 .odo>span{display:inline-flex;align-items:flex-start}
.ips5 .od{display:inline-block;height:1em;overflow:hidden;line-height:1}
.ips5 .od>span{display:flex;flex-direction:column;transform:translateY(calc(var(--n) * -1em));transition:transform 1.1s cubic-bezier(.23,1,.32,1);transition-delay:calc(var(--i) * 70ms + 200ms)}
.ips5 .od i{font-style:normal;height:1em;line-height:1;display:block}
html.ips-fx .ips5 .ab-board:not(.is-in) .od>span{transform:translateY(0)}
.ips5 .owd{display:inline-block;transition:filter .9s var(--ease) .3s,letter-spacing 1.1s var(--ease) .3s,opacity .9s var(--ease) .3s}
html.ips-fx .ips5 .ab-board:not(.is-in) .owd{filter:blur(6px);letter-spacing:.18em;opacity:.2}
/* 그룹 구조: 선이 자라며 이어짐 */
.ips5 .ab-group{text-align:center;padding:104px 0 24px}
/* 3기둥: 왼쪽 사진 고정 · 오른쪽 단계 */
.ips5 .ab-pill{padding:120px 0 40px}
.ips5 .ab-h2{font:300 clamp(26px,3vw,38px)/1.35 var(--lex);letter-spacing:-.01em;max-width:860px;margin:0 0 56px;text-wrap:balance}
.ips5 .ab-steps{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,80px);align-items:start}
.ips5 .ab-frame{position:sticky;top:160px;aspect-ratio:4/3;border-radius:14px;overflow:hidden;background:#000}
.ips5 .ab-frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .5s cubic-bezier(.45,0,.55,1)}
.ips5 .ab-steps[data-steps="0"] .ab-frame img[data-k="0"],.ips5 .ab-steps[data-steps="1"] .ab-frame img[data-k="1"],.ips5 .ab-steps[data-steps="2"] .ab-frame img[data-k="2"]{opacity:1;transition-delay:.18s}
.ips5 .ab-list .pl{min-height:58vh;padding:8px 0 48px;opacity:.32;transition:opacity .45s var(--ease)}
.ips5 .ab-steps[data-steps="0"] .pl[data-step="0"],.ips5 .ab-steps[data-steps="1"] .pl[data-step="1"],.ips5 .ab-steps[data-steps="2"] .pl[data-step="2"]{opacity:1}
.ips5 .ab-list .m-img{display:none}
.ips5 .pl .no{font:500 13px/1 var(--lex);letter-spacing:.2em;color:var(--w2)}
.ips5 .pl h3{font:400 clamp(28px,3vw,40px)/1.15 var(--lex);margin:16px 0 18px;letter-spacing:-.01em}
.ips5 .pl p{font-size:18px;line-height:1.7;color:var(--ink2);max-width:46ch}
.ips5 .pl ul{list-style:none;padding:0;margin:26px 0 0;display:grid;gap:10px}
.ips5 .pl li{font-size:16px;color:var(--ink);padding-left:22px;position:relative}
.ips5 .pl li:before{content:"";position:absolute;left:0;top:.62em;width:10px;height:1px;background:var(--w2)}
/* 위치: 지도 + 티켓 */
.ips5 .ab-loc{padding:64px 0 0}
.ips5 .ab-locg{display:grid;grid-template-columns:1.4fr 1fr;gap:24px;align-items:stretch}
.ips5 .ab-map{border-radius:14px;overflow:hidden;background:var(--tone);min-height:320px}
.ips5 .ab-map iframe{display:block;width:100%;height:100%;min-height:320px;border:0}
.ips5 .ab-ticket{position:relative;border-radius:14px;background:var(--ink);color:#fff;padding:34px 30px;display:flex;flex-direction:column;gap:14px}
.ips5 .ab-ticket:before,.ips5 .ab-ticket:after{content:"";position:absolute;left:-12px;width:24px;height:24px;border-radius:50%;background:#fff;top:50%;margin-top:-12px}
.ips5 .ab-ticket:after{left:auto;right:-12px}
.ips5 .ab-ticket small{font:500 12px/1 var(--lex);letter-spacing:.2em;color:#8fb3c4}
.ips5 .ab-ticket b{font:400 20px/1.5 var(--lex);overflow-wrap:anywhere}
.ips5 .ab-ticket .tacts{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto;padding-top:14px;border-top:1px dashed rgba(255,255,255,.22)}
.ips5 .ab-ticket .tacts a,.ips5 .ab-ticket .tacts button{font:500 14px/1 'Pretendard Variable',Pretendard,sans-serif;color:#fff;background:rgba(255,255,255,.1);border:0;border-radius:6px;padding:11px 14px;min-height:40px;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;transition:background-color .2s ease,transform .16s ease}
.ips5 .ab-ticket .tacts a:hover,.ips5 .ab-ticket .tacts button:hover{background:rgba(255,255,255,.2)}
.ips5 .ab-ticket .tacts :active{transform:scale(.97)}
.ips5 .ab-ticket .cp.done{background:var(--w2)}

/* ── FILMS ── */
.ips5 .fl-hero{position:relative;background:var(--dark);color:var(--paper);overflow:hidden}
html.ips-fx .ips5 .fl-hero[data-rv]{opacity:1;transform:none}
.ips5 .fl-frame{position:relative;aspect-ratio:2.39/1;max-height:78vh;width:100%;overflow:hidden}
.ips5 .fl-frame .lb{position:absolute;left:0;right:0;height:50.5%;background:var(--dark);z-index:2;transition:transform 1s var(--ease-io) .25s}
.ips5 .fl-frame .lb.t{top:0;transform-origin:top}.ips5 .fl-frame .lb.b{bottom:0;transform-origin:bottom}
.ips5 .fl-hero.is-in .lb{transform:scaleY(0)}
html:not(.ips-fx) .ips5 .fl-frame .lb{display:none}
.ips5 .fl-frame:after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(0deg,rgba(11,15,20,.88) 0%,rgba(11,15,20,.2) 45%,transparent 70%)}
.ips5 .fl-body{padding-top:72px}
.ips5 .fl-bar{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:36px}
.ips5 .fl-bar .eb{margin-bottom:12px}
.ips5 .fl-bar .cnt{font:300 28px/1 var(--lex);margin:0}
.ips5 .fl-view{position:relative;display:inline-flex;padding:4px;border-radius:999px;background:var(--tone)}
.ips5 .fl-view button{position:relative;z-index:1;border:0;background:none;font:500 14px/1 var(--lex);color:var(--slate);padding:12px 18px;min-height:40px;border-radius:999px;cursor:pointer;transition:color .2s ease}
.ips5 .fl-view button[aria-pressed=true]{color:var(--ink)}
.ips5 .fl-view .tpill{position:absolute;top:4px;bottom:4px;left:4px;width:calc(50% - 4px);border-radius:999px;background:#fff;box-shadow:0 1px 3px rgba(10,37,64,.12);transition:transform .32s var(--ease)}
.ips5 .fl-view[data-on=list] .tpill{transform:translateX(100%)}
.ips5 .fl-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:40px 24px}
.ips5 .fl-card{margin:0}
.ips5 .fl-card.go{cursor:pointer}
.ips5 .fl-po{position:relative;aspect-ratio:2/3;border-radius:6px;overflow:hidden;background:var(--tone);box-shadow:0 18px 36px -22px rgba(10,37,64,.55);transition:transform .25s var(--ease),box-shadow .25s ease}
.ips5 .fl-po img{width:100%;height:100%;object-fit:cover}
.ips5 .fl-po:after{content:"";position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .25s ease;background:radial-gradient(circle at var(--gx,50%) var(--gy,30%),rgba(255,255,255,.28),transparent 55%)}
.ips5 .fl-po.tilting:after{opacity:1}
.ips5 .fl-card figcaption{margin-top:16px;display:grid;gap:6px}
.ips5 .fl-card figcaption b{font:500 15px/1.3 var(--lex);letter-spacing:.02em}
.ips5 .fl-card figcaption>span{font-size:13px;color:var(--slate)}
.ips5 .fl-card .fr2{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:6px 8px;font-size:13px;color:var(--slate)}
.ips5 .fl-card .fr2>span{white-space:nowrap}
.ips5 .tag{font:500 11px/1 var(--lex);font-style:normal;letter-spacing:.06em;text-transform:uppercase;padding:6px 8px;border-radius:4px;background:var(--tone);color:var(--ink2);white-space:nowrap}
.ips5 .go .tag{background:#fff2e8;color:var(--hot)}
.ips5 .fl-card.go:active .fl-po{transform:scale(.98)}
.ips5 .fl-list{display:none;position:relative;background:var(--dark);border-radius:14px;overflow:hidden;padding:12px 0;isolation:isolate}
.ips5 .fl-wrap[data-view=list] .fl-grid{display:none}.ips5 .fl-wrap[data-view=list] .fl-list{display:block}
.ips5 .fl-bgs img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;z-index:-1;transition:opacity .45s ease}
.ips5 .fl-list[data-hover="0"] .fl-bgs img[data-i="0"],.ips5 .fl-list[data-hover="1"] .fl-bgs img[data-i="1"],.ips5 .fl-list[data-hover="2"] .fl-bgs img[data-i="2"],.ips5 .fl-list[data-hover="3"] .fl-bgs img[data-i="3"],
.ips5 .fl-list[data-hover="4"] .fl-bgs img[data-i="4"],.ips5 .fl-list[data-hover="5"] .fl-bgs img[data-i="5"],.ips5 .fl-list[data-hover="6"] .fl-bgs img[data-i="6"]{opacity:.38}
.ips5 .fl-row{display:grid;grid-template-columns:80px 1.6fr 1fr auto;align-items:center;gap:20px;padding:22px 32px;border-bottom:1px solid rgba(243,239,230,.1);color:#c8ced8;transition:color .2s ease}
.ips5 .fl-row:last-child{border-bottom:0}
.ips5 .fl-row .y{font:400 14px/1 var(--lex);color:#7f8898}
.ips5 .fl-row b{font:300 clamp(22px,2.6vw,34px)/1.1 var(--lex);letter-spacing:-.01em;color:#fff}
.ips5 .fl-row .dr{font-size:14px}
.ips5 .fl-row .tag{background:rgba(255,255,255,.08);color:#e5e9ef}
.ips5 .fl-row.go{cursor:pointer}.ips5 .fl-row.go .tag{background:rgba(255,106,61,.18);color:#ffb38f}
.ips5 .fl-list:hover .fl-row{color:#7f8898}.ips5 .fl-list:hover .fl-row b{color:#9aa3b2}
.ips5 .fl-list .fl-row:hover{color:#fff}.ips5 .fl-list .fl-row:hover b{color:#fff}
.ips5 .fl-more{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px 24px;margin-top:64px;padding:26px 30px;border-radius:12px;background:var(--surf);font-size:16px;color:var(--ink2)}
.ips5 .fl-more .lnk{font-weight:600;color:var(--acc2);cursor:pointer}
.ips5 .fl-more .lnk .ar{display:inline-block;transition:transform .2s ease}.ips5 .fl-more .lnk:hover .ar{transform:translateX(4px)}

/* ── PICKS ── */
.ips5 .pk-head{padding:88px 0 40px}
.ips5 .pk-t{font:300 clamp(48px,7vw,96px)/1 var(--lex);letter-spacing:-.03em;margin:0}
.ips5 .pk-lead{margin-top:20px;font:300 clamp(18px,1.8vw,22px)/1.5 var(--lex);color:var(--ink2);max-width:640px}
.ips5 .pk-g{display:grid;grid-template-columns:1.35fr .8fr;gap:clamp(32px,5vw,72px);align-items:start}
.ips5 .pk-form{margin:0}
.ips5 .pk-kinds{border:0;padding:0;margin:0 0 18px}
.ips5 .pk-kinds legend{font:500 12px/1 var(--lex);letter-spacing:.2em;color:var(--slate);margin-bottom:14px;padding:0;text-transform:uppercase}
.ips5 .pseg{position:relative;display:grid;grid-template-columns:repeat(3,1fr);padding:4px;border-radius:12px;background:var(--tone)}
.ips5 .pseg .tpill{position:absolute;top:4px;bottom:4px;left:4px;width:calc((100% - 8px) / 3);border-radius:9px;background:var(--ink);transform:translateX(calc(var(--k,0) * 100%));transition:transform .38s cubic-bezier(.34,1.3,.64,1)}
.ips5 .kd{position:relative;z-index:1;display:block;cursor:pointer;border:0;background:none;padding:0;font:inherit}
.ips5 .kd span{display:flex;justify-content:center;align-items:center;min-height:48px;font:500 15px/1 var(--lex);color:var(--ink2);border-radius:9px;transition:color .2s ease}
.ips5 .pk-form[data-kind=distribution] .kd[data-v=distribution] span,.ips5 .pk-form[data-kind=ips] .kd[data-v=ips] span,.ips5 .pk-form[data-kind=other] .kd[data-v=other] span{color:#fff}
.ips5 .kd:focus-visible{outline:2px solid var(--acc);outline-offset:2px;border-radius:9px}
.ips5 .pk-tips{margin:18px 0 28px;min-height:84px}
.ips5 .pk-tips .tips{list-style:none;padding:0;margin:0;display:none;gap:8px}
.ips5 .pk-form[data-kind=distribution] .tips[data-for=distribution],.ips5 .pk-form[data-kind=ips] .tips[data-for=ips],.ips5 .pk-form[data-kind=other] .tips[data-for=other]{display:grid;animation:tb-tip .4s var(--ease) both}
@keyframes tb-tip{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.ips5 .tips li{font-size:15px;color:var(--ink2);padding-left:20px;position:relative}
.ips5 .tips li:before{content:"";position:absolute;left:0;top:.65em;width:8px;height:8px;border-radius:50%;border:1.5px solid var(--w2)}
.ips5 .pk-fields{display:grid;grid-template-columns:1fr 1fr;gap:6px 24px}
.ips5 .pf{position:relative;display:block;padding-top:18px}
.ips5 .pf-link,.ips5 .pf-msg{grid-column:1 / -1}
.ips5 .pf input,.ips5 .pf textarea{width:100%;border:0;border-bottom:1px solid var(--line2);background:transparent;font:400 17px/1.4 'Pretendard Variable',Pretendard,sans-serif;color:var(--ink);padding:12px 0 10px;outline:0;border-radius:0;transition:border-color .2s ease}
.ips5 .pf textarea{resize:vertical;min-height:120px}
.ips5 .pf>span{position:absolute;left:0;top:30px;font-size:16px;color:var(--slate);pointer-events:none;transform-origin:left top;transition:transform .2s var(--ease),color .2s ease}
.ips5 .pf input:focus~span,.ips5 .pf input:not(:placeholder-shown)~span,.ips5 .pf textarea:focus~span,.ips5 .pf textarea:not(:placeholder-shown)~span{transform:translateY(-24px) scale(.8);color:var(--acc2)}
.ips5 .pf input:focus,.ips5 .pf textarea:focus{border-bottom-color:var(--acc)}
.ips5 .pf .err{display:block;min-height:20px;font:normal 13px/1.5 'Pretendard Variable',Pretendard,sans-serif;color:var(--hot);padding-top:4px}
.ips5 .pf.bad input,.ips5 .pf.bad textarea{border-bottom-color:var(--hot)}
.ips5 .pf .cnt{display:block;text-align:right;margin-top:-20px;font-size:12px;color:var(--slate)}
.ips5 .pk-form[data-kind=distribution] .pf-link>span:after{content:" *"}
.ips5 .pk-agree{display:flex;gap:12px;align-items:flex-start;margin:14px 0 10px;font-size:14px;line-height:1.6;color:var(--ink2);cursor:pointer}
.ips5 .pk-agree input{width:20px;height:20px;margin:2px 0 0;flex:none;accent-color:var(--ink)}
.ips5 .pk-agree.bad{color:var(--hot)}
.ips5 .pk-no{font-size:13px;color:var(--slate);margin:0 0 26px;padding:12px 14px;border-radius:8px;background:var(--surf)}
.ips5 .hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.ips5 .pk-acts{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.ips5 .pk-send{position:relative;display:inline-flex;align-items:center;justify-content:center;width:180px;height:52px;border:0;border-radius:26px;background:var(--ink);color:#fff;font:500 14px/1 var(--lex);letter-spacing:.2em;text-transform:uppercase;cursor:pointer;transition:width .4s var(--ease),background-color .3s ease,transform .16s ease}
.ips5 .pk-send:hover{background:#13355a}.ips5 .pk-send:active{transform:scale(.97)}
.ips5 .pk-send .spin,.ips5 .pk-send .ok{position:absolute;opacity:0;transition:opacity .2s ease}
.ips5 .pk-send .spin{width:20px;height:20px;border-radius:50%;border:2px solid rgba(255,255,255,.3);border-top-color:#fff}
.ips5 .pk-send .ok{width:24px;height:24px;fill:none;stroke:#fff;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:24;stroke-dashoffset:24}
.ips5 .pk-send.sending,.ips5 .pk-send.sent{width:52px;pointer-events:none}
.ips5 .pk-send.sending .tx,.ips5 .pk-send.sent .tx{opacity:0}
.ips5 .pk-send.sending .spin{opacity:1;animation:tb-spin .8s linear infinite}
.ips5 .pk-send.sent{background:#1f8a5b}.ips5 .pk-send.sent .ok{opacity:1;stroke-dashoffset:0;transition:stroke-dashoffset .45s var(--ease) .1s,opacity .1s}
@keyframes tb-spin{to{transform:rotate(360deg)}}
.ips5 .pk-msg{margin:0;font-size:14px;color:var(--hot)}
.ips5 .pk-msg a{color:var(--acc2);font-weight:600}
.ips5 .pk-rcpt{display:none;margin-top:28px;padding:28px 28px 26px;border-radius:14px;background:var(--ink);color:#fff;animation:tb-tip .5s var(--ease) both}
.ips5 .pk-rcpt small{font:500 12px/1 var(--lex);letter-spacing:.22em;color:#9fd3b6}
.ips5 .pk-rcpt b{display:block;margin:12px 0 8px;font:400 20px/1.45 var(--lex)}
.ips5 .pk-rcpt p{margin:0;font-size:14px;color:#b9c3d0}
.ips5 .pk-rcpt .again{margin-top:18px;border:0;border-radius:8px;background:rgba(255,255,255,.12);color:#fff;font:500 14px/1 'Pretendard Variable',Pretendard,sans-serif;padding:12px 16px;cursor:pointer}
.ips5 .pk-form.is-done .pk-rcpt{display:block}
.ips5 .pk-form.is-done .pk-fields,.ips5 .pk-form.is-done .pk-agree,.ips5 .pk-form.is-done .pk-no,.ips5 .pk-form.is-done .pk-kinds,.ips5 .pk-form.is-done .pk-tips{opacity:.35;pointer-events:none}
.ips5 .pk-side{position:sticky;top:160px}
.ips5 .pk-ph{position:relative;aspect-ratio:4/5;border-radius:14px;overflow:hidden;background:var(--dark)}
.ips5 .pk-ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;clip-path:inset(0 0 100% 0);transition:clip-path 1s cubic-bezier(.77,0,.175,1)}
.ips5 .pk-form[data-kind=distribution]~.pk-side img[data-for=distribution],.ips5 .pk-form[data-kind=ips]~.pk-side img[data-for=ips],.ips5 .pk-form[data-kind=other]~.pk-side img[data-for=other]{clip-path:inset(0 0 0 0);z-index:1}

/* ── 휴대폰 ── */
@media (max-width:900px){
 .ips5 .ab-stats{grid-template-columns:1fr 1fr}
 .ips5 .ab-stats .cell{padding:26px 0 22px!important;border-right:0!important}
 .ips5 .ab-stats .cell:nth-child(odd){padding-right:16px!important;border-right:1px solid rgba(243,239,230,.12)!important}
 .ips5 .ab-stats .cell:nth-child(even){padding-left:18px!important}
 .ips5 .ab-steps{grid-template-columns:1fr}
 .ips5 .ab-frame{display:none}
 .ips5 .ab-list .pl{min-height:0;opacity:1;padding-bottom:56px}
 .ips5 .ab-list .m-img{display:block;width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:12px;margin-bottom:22px}
 .ips5 .ab-locg{grid-template-columns:1fr}
 .ips5 .fl-frame{aspect-ratio:4/5;max-height:none}
 .ips5 .fl-grid{grid-template-columns:1fr 1fr;gap:32px 14px}
 .ips5 .fl-row{grid-template-columns:1fr auto;gap:6px 12px;padding:18px 20px}
 .ips5 .fl-row .y{display:none}.ips5 .fl-row .dr{grid-column:1;grid-row:2}
 .ips5 .fl-row .tag{grid-column:2;grid-row:1 / span 2;align-self:center}
 .ips5 .fl-more{padding:22px 20px}
 .ips5 .pk-g{grid-template-columns:1fr}
 .ips5 .pk-side{display:none}
 .ips5 .pk-fields{grid-template-columns:1fr}
}
@media (min-width:901px) and (max-width:1100px){.ips5 .fl-grid{grid-template-columns:repeat(3,1fr)}}
@media (prefers-reduced-motion:reduce){
 .ips5 .grain,.ips5 .ab-open .vig{animation:none}
 .ips5 .od>span,.ips5 .ab-tree *,.ips5 .pk-ph img,.ips5 .pseg .tpill{transition:none!important}
}
/* ── v51 그룹 구조(회사소개서): mobidays(Ad-Tech) → 3사, Mobi Career Edu → MOBINTOUCH ── */
.ips5 .ab-tree{position:relative;max-width:1040px;margin:0 auto}
html.ips-fx .ips5 .ab-tree[data-rv]{transform:none}
.ips5 .ab-tree .top{display:inline-grid;justify-items:center;gap:8px;padding:18px 28px;border-radius:14px;background:#fff;border:1px solid var(--line);box-shadow:0 10px 24px -18px rgba(10,37,64,.4)}
.ips5 .ab-tree .top img{height:34px;width:auto}
.ips5 .ab-tree .top span,.ips5 .ab-tree .node span{font:400 14px/1.3 var(--lex);color:var(--slate)}
.ips5 .ab-tree .stem{display:block;width:1px;height:36px;margin:0 auto;background:var(--line2);transform-origin:top;transition:transform .5s var(--ease) .2s}
.ips5 .ab-tree .bar{display:block;height:1px;margin:0 12.5%;background:var(--line2);transition:transform .7s var(--ease) .6s}
.ips5 .ab-tree .kids{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.ips5 .ab-tree .col{display:flex;flex-direction:column;align-items:stretch}
.ips5 .ab-tree .node{position:relative;margin-top:32px;padding:22px 14px 18px;border-radius:12px;background:var(--surf);display:grid;justify-items:center;gap:10px;transition:opacity .6s var(--ease),transform .6s var(--ease);transition-delay:calc(var(--i) * 110ms + 1.1s)}
.ips5 .ab-tree .node img{height:28px;width:auto;max-width:86%}
.ips5 .ab-tree .node:before{content:"";position:absolute;left:50%;top:-32px;width:1px;height:32px;background:var(--line2);transform-origin:top;transition:transform .4s var(--ease);transition-delay:calc(var(--i) * 110ms + .95s)}
.ips5 .ab-tree .node.sub{margin-top:0}.ips5 .ab-tree .node.sub:before{display:none}
.ips5 .ab-tree .sub-stem{display:block;width:1px;height:28px;margin:0 auto;background:var(--line2);transform-origin:top;transition:transform .4s var(--ease) 1.55s}
html.ips-fx .ips5 .ab-tree:not(.is-in) .stem,html.ips-fx .ips5 .ab-tree:not(.is-in) .node:before,html.ips-fx .ips5 .ab-tree:not(.is-in) .sub-stem{transform:scaleY(0)}
html.ips-fx .ips5 .ab-tree:not(.is-in) .bar{transform:scaleX(0)}
html.ips-fx .ips5 .ab-tree:not(.is-in) .node{opacity:0;transform:translateY(10px)}
.ips5 .ab-stats .cell small{display:block;margin-top:6px;font:400 12px/1.4 var(--lex);color:#7f8898}
.ips5 .sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;margin:-1px}
/* ── v51 FILMS 첫 화면: 라인업 8편이 차례로 (6초) ── */
.ips5 .fl-frame .kb{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 38%;opacity:0;transform:scale(1);transition:opacity 1.1s ease,transform 0s linear 1.1s}
.ips5 .fl-frame .kb.on{opacity:1;transform:scale(1.07);transition:opacity 1.1s ease,transform 7.5s linear}
.ips5 .fl-cap{position:absolute;left:0;right:0;bottom:clamp(20px,4vw,48px);z-index:4;display:grid;grid-template-columns:1fr;align-items:end}
.ips5 .fl-cap .cap{grid-area:1 / 1;opacity:0;transform:translateY(14px);transition:opacity .5s var(--ease),transform .5s var(--ease);pointer-events:none}
.ips5 .fl-cap .cap.on{opacity:1;transform:none;transition:opacity .8s var(--ease) .35s,transform .8s var(--ease) .35s;pointer-events:auto}
.ips5 .fl-cap .st{font:500 13px/1 var(--lex);letter-spacing:.24em;color:var(--w1);margin:0 0 14px}
.ips5 .fl-cap h2{font:300 clamp(30px,5.4vw,80px)/1.02 var(--lex);letter-spacing:-.01em;margin:0;color:var(--paper);max-width:16ch}
.ips5 .fl-cap .fnote{margin-top:14px;font:400 15px/1.3 var(--lex);color:#b9c0cb}
.ips5 .fl-cap .fgo{display:inline-flex;align-items:center;gap:8px;margin-top:18px;padding:12px 18px;border-radius:999px;background:rgba(255,255,255,.14);color:#fff;font:500 14px/1 var(--lex);cursor:pointer;transition:background-color .2s ease}
.ips5 .fl-cap .fgo:hover{background:rgba(255,255,255,.24)}
.ips5 .fl-ctl{grid-area:2 / 1;display:flex;align-items:center;gap:14px;margin-top:28px}
.ips5 .fl-ctl .nav{width:40px;height:40px;border-radius:50%;border:1px solid rgba(255,255,255,.28);background:transparent;color:#fff;font:400 16px/1 var(--lex);cursor:pointer;transition:background-color .2s ease,transform .16s ease}
.ips5 .fl-ctl .nav:hover{background:rgba(255,255,255,.12)}.ips5 .fl-ctl .nav:active{transform:scale(.94)}
.ips5 .fl-ctl .fl-dots{display:flex;gap:6px;flex:1;max-width:420px}
.ips5 .fl-ctl .dot{flex:1;height:22px;border:0;background:none;padding:0;cursor:pointer;display:flex;align-items:center}
.ips5 .fl-ctl .dot i{display:block;width:100%;height:2px;background:rgba(255,255,255,.25);position:relative;overflow:hidden}
.ips5 .fl-ctl .dot i:after{content:"";position:absolute;inset:0;background:var(--w1);transform:scaleX(0);transform-origin:left}
.ips5 .fl-ctl .dot.done i:after{transform:scaleX(1)}
.ips5 .fl-ctl .dot.on i:after{animation:fl-prog 6s linear forwards}
.ips5 .fl-hero.paused .fl-ctl .dot.on i:after{animation-play-state:paused}
@keyframes fl-prog{to{transform:scaleX(1)}}
.ips5 .fl-ctl .num{font:400 13px/1 var(--lex);color:#9aa3b2;font-variant-numeric:tabular-nums;white-space:nowrap}
.ips5 .fl-ctl .num b{color:#fff;font-weight:500}
.ips5 .pk-ph img[data-for=other]{object-position:64% 50%}
.ips5 .fl-frame,.ips5 .fl-cap{touch-action:pan-y}
.ips5 .fl-ctl .nav{display:inline-flex;align-items:center;justify-content:center;padding:0;flex:none}
.ips5 .fl-ctl .nav svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;display:block}
@media (max-width:900px){
 .ips5 .ab-tree .kids{grid-template-columns:1fr;gap:0}
 .ips5 .ab-tree .stem,.ips5 .ab-tree .bar,.ips5 .ab-tree .node:before{display:none}
 .ips5 .ab-tree .node{margin-top:14px}
 .ips5 .fl-ctl .fl-dots{max-width:none}
 .ips5 .fl-ctl .nav{display:none}
 .ips5 .fl-frame .kb{object-position:30% 50%}
}
@media (prefers-reduced-motion:reduce){.ips5 .fl-frame .kb.on{transform:none}.ips5 .fl-ctl .dot.on i:after{animation:none;transform:scaleX(1)}}