main#top #work{--work-gutter:max(5vw,24px);padding-inline:var(--work-gutter)!important}
main#top #work .work-banner{position:relative;isolation:isolate;display:flex;align-items:center;width:calc(100% + 2 * var(--work-gutter));min-height:clamp(440px,43vw,640px);margin-inline:calc(-1 * var(--work-gutter));overflow:hidden;background:#1c2627;color:#fff;scroll-margin-top:72px}
main#top #work .work-banner-rail{position:absolute;inset:0;z-index:0;display:flex;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain;touch-action:pan-x pan-y;cursor:grab;user-select:none}
.work-banner-rail::-webkit-scrollbar{display:none}
main#top #work .work-banner-rail.is-work-dragging{cursor:grabbing;scroll-snap-type:none}
.work-banner-rail:focus-visible{outline:2px solid #fff;outline-offset:-6px}
main#top #work .work-banner-slide{position:relative;flex:0 0 100%;height:100%;scroll-snap-align:start;scroll-snap-stop:always}
main#top #work .work-banner-slide img{display:block;width:100%;height:100%;object-fit:cover;object-position:center;pointer-events:none}
main#top #work .work-banner-shade{position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,#0009,#0003 65%,#0004),linear-gradient(0deg,#0008,transparent 32%)}
main#top #work .work-banner-copy{position:relative;z-index:2;width:100%;padding:64px var(--work-gutter) 105px;pointer-events:none}
main#top #work .work-banner-copy>div{min-width:0;align-self:center}
main#top #work .work-banner-copy h2{font-size:clamp(45px,5.6vw,86px)!important;line-height:1.12!important;color:#fff!important;margin-top:20px!important}
main#top #work .work-banner-copy p{color:#fff!important;max-width:34rem;font-size:clamp(14px,1.05vw,16px)!important;line-height:1.85!important}
main#top #work .work-banner-copy a{pointer-events:auto;color:#fff!important;border-color:#fff9;font-size:13px;min-height:44px}
main#top #work .work-banner-footer{position:absolute;z-index:3;bottom:20px;left:var(--work-gutter);right:var(--work-gutter);display:flex;gap:20px;align-items:center;pointer-events:none}
.work-banner-caption{flex:1;font:11px/1.5 Inter,'Noto Sans KR',sans-serif;letter-spacing:.045em}
.work-banner-hint{font-size:10px;opacity:.85}
.work-banner-controls{display:flex;gap:8px;pointer-events:auto}
.work-banner-controls button{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border:1px solid #fff8;border-radius:50%;color:#fff;background:#0003;font:18px/1 Inter,sans-serif;cursor:pointer}
.work-banner-controls button:hover{background:#fff;color:#111}
.work-banner-controls button:focus-visible{outline:2px solid #fff;outline-offset:3px}
@media(max-width:767px){main#top #work{--work-gutter:6vw}main#top #work .work-banner{min-height:580px}main#top #work .work-banner-copy{display:block!important;padding-block:58px 135px}main#top #work .work-banner-copy>div+div{margin-top:28px}main#top #work .work-banner-copy h2{font-size:clamp(40px,11vw,64px)!important}main#top #work .work-banner-copy p{font-size:14px!important;line-height:1.8!important}main#top #work .work-banner-footer{flex-wrap:wrap;gap:10px 16px;bottom:18px}.work-banner-caption{flex-basis:calc(100% - 160px);font-size:9px}.work-banner-hint{order:3;flex-basis:100%;font-size:9px}}
