@font-face{font-family:Pretendard;src:url('assets/PretendardVariable.woff2') format('woff2');font-weight:100 900;font-display:swap}
@font-face{font-family:'Noto Sans KR';src:url('assets/NotoSansKR-portfolio.woff2') format('woff2');font-weight:100 900;font-display:swap}
*{box-sizing:border-box}html{scroll-behavior:smooth;background:#fff}body{margin:0;font-family:Pretendard,sans-serif;color:#1a1a1a;overflow-x:hidden}#portfolio-shell{position:relative;width:100%;max-width:1920px;height:calc(35581px * var(--scale));margin:auto;overflow:hidden}#artboard{position:absolute;width:1920px;height:35581px;background:#fff;transform:scale(var(--scale));transform-origin:top left;overflow:hidden}.layer{position:absolute;transform-origin:0 0}.copy{white-space:pre-wrap;overflow:visible;word-break:normal;overflow-wrap:normal;font-kerning:normal}.visual{display:block}.vector svg{display:block;width:100%;height:100%;overflow:visible}.section-anchor{position:absolute;left:0;width:1px;height:1px}.film{background:#111}.poster{position:absolute;inset:0;width:100%;height:100%;object-fit:fill}.portfolio-video{object-fit:fill;opacity:0;transition:opacity .16s ease}.portfolio-video.ready{opacity:1}.film-control{position:absolute;right:24px;bottom:24px;z-index:3;border:1px solid #ffffff60;border-radius:50%;background:#0008;color:white;width:48px;height:48px;cursor:pointer;font:22px Pretendard,sans-serif;opacity:0;transition:opacity .15s}.film:hover .film-control,.film:focus-within .film-control{opacity:1}.film-start{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);background:#fff;color:#1a1a1a;border:0;border-radius:99px;padding:18px 30px;font:600 24px Pretendard,sans-serif;cursor:pointer;box-shadow:0 4px 30px #0003}.film-start[hidden]{display:none}.progress{position:fixed;inset:0 auto auto 0;width:0;height:3px;background:#e1521d;z-index:1000;pointer-events:none}.portfolio-nav{position:fixed;z-index:900;bottom:22px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:5px;white-space:nowrap;padding:7px;border:1px solid #e7e5e2;border-radius:50px;background:#fffffff0;box-shadow:0 4px 24px #00000012;backdrop-filter:blur(14px)}.portfolio-nav a,.portfolio-nav button{border:0;background:none;text-decoration:none;color:#666;padding:9px 13px;border-radius:24px;font:500 13px Pretendard,sans-serif;cursor:pointer}.portfolio-nav a:first-child{font-weight:800;color:#e1521d;letter-spacing:-.5px}.portfolio-nav a:hover,.portfolio-nav a.active,.portfolio-nav button:hover{color:#e1521d;background:#e1521d0d}.portfolio-nav button{font-size:11px;color:#777;border-left:1px solid #eee;border-radius:0 25px 25px 0}.nav-divider{width:1px;height:14px;background:#e7e5e2;margin-right:3px}.skip{position:fixed;z-index:2000;top:-80px;left:20px;padding:14px 20px;background:#fff;color:#e1521d;border:2px solid #e1521d}.skip:focus{top:15px}:focus-visible{outline:3px solid #e1521d;outline-offset:4px}@media(max-width:600px){.portfolio-nav{bottom:12px;gap:0;padding:5px;max-width:calc(100vw - 16px)}.portfolio-nav a{font-size:11px;padding:9px 9px}.portfolio-nav button{font-size:10px;padding:9px 7px}.nav-divider{margin:0}.film-control{opacity:1}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.portfolio-video{transition:none}}
