:root{--brand:#DA350B;--line:#E5E8EB}
*{box-sizing:border-box}html,body{margin:0;background:#fff}
body{font-family:-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Pretendard","Noto Sans KR",sans-serif;-webkit-font-smoothing:antialiased}
input{position:absolute;width:0;height:0;opacity:0}
.win{border:1px solid #E2DFDA;border-radius:14px;overflow:hidden;background:#fff;box-shadow:0 8px 26px rgba(31,22,18,.09)}
.bar{display:flex;align-items:center;gap:10px;padding:8px 12px;background:#F7F8FA;border-bottom:1px solid var(--line)}
.tl{display:flex;gap:5px}.tl i{width:10px;height:10px;border-radius:50%;display:block}
.tl i:nth-child(1){background:#FF5F57}.tl i:nth-child(2){background:#FEBC2E}.tl i:nth-child(3){background:#28C840}
.barlabel{flex:1;text-align:center;font-size:12px;font-weight:700;color:#6B7684;background:#fff;border:1px solid var(--line);border-radius:7px;padding:4px 10px}
.stage{position:relative;width:100%;aspect-ratio:1440/900;overflow:hidden;background:#F7F8FA}
.stage img{position:absolute;display:block;width:100%;left:0;top:0}
.scene{display:none}
#u1:checked~.win .ps1,#u2:checked~.win .ps2,#u3:checked~.win .ps3,#u4:checked~.win .ps4,#u5:checked~.win .ps5,#u6:checked~.win .ps6{display:block}
.dot{position:absolute;width:20px;height:20px;border-radius:50%;background:var(--brand);transform:translate(-50%,-50%);box-shadow:0 0 0 5px rgba(218,53,11,.22);z-index:3}
.dot:after{content:"";position:absolute;inset:-8px;border-radius:50%;border:2px solid rgba(218,53,11,.5);animation:pl 1.9s ease-out infinite}
@keyframes pl{0%{transform:scale(.7);opacity:.9}100%{transform:scale(1.5);opacity:0}}
.ps1 .dot{left:49.33%;top:22.49%}.ps2 .dot{left:49.33%;top:41.18%}.ps3 .dot{left:49.33%;top:49.69%}.ps4 .dot{left:49.33%;top:58.20%}.ps5 .dot{left:49.33%;top:66.71%}.ps6 .dot{left:49.33%;top:80.20%}
.nav{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.94);border:1px solid var(--line);box-shadow:0 6px 18px rgba(0,0,0,.12);display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:18px;font-weight:800;color:#4E5968;z-index:4;user-select:none}
.nav:hover{background:#fff;color:var(--brand)}
.nav.prev{left:12px}.nav.next{right:12px}
.pager{position:absolute;left:50%;bottom:12px;transform:translateX(-50%);display:flex;gap:6px;background:rgba(20,18,16,.5);padding:7px 10px;border-radius:999px;z-index:5}
.pager label{width:8px;height:8px;border-radius:999px;background:rgba(255,255,255,.6);cursor:pointer;display:block}
#u1:checked~.win .pager .pg1,#u2:checked~.win .pager .pg2,#u3:checked~.win .pager .pg3,#u4:checked~.win .pager .pg4,#u5:checked~.win .pager .pg5,#u6:checked~.win .pager .pg6{background:#fff;width:20px}
@media(max-width:640px){.nav{width:34px;height:34px;font-size:15px}.nav.prev{left:6px}.nav.next{right:6px}.barlabel{font-size:10.5px}.dot{width:15px;height:15px}}

input{position:absolute!important;left:62%;top:82%;width:1px;height:1px;opacity:0;pointer-events:none;margin:0}html,body{overflow:hidden}

@media (max-width:560px){
 .bar{display:none}
 .win{border-radius:10px;box-shadow:0 4px 16px rgba(31,22,18,.10);overflow:hidden}
 .stage{aspect-ratio:auto!important;height:auto!important}
 .scene{position:relative}
 .stage img{position:relative!important;width:100%;height:105vw!important;min-height:260px;object-fit:cover;display:block}
 
 .dot{display:none}
 .call{position:relative!important;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;width:auto!important;max-width:none!important;border-radius:0!important;box-shadow:none!important;padding:12px 14px 13px!important;background:rgba(31,22,18,.92)}
 .call .step{display:block;font-size:10px;margin-bottom:3px;opacity:.8}
 .call h3{font-size:14.5px!important;margin:0 0 4px!important}
 .call p{display:block!important;font-size:12.5px;margin:0 0 9px}
 .call .cnt{display:inline}
 .arw{width:30px;height:30px;font-size:14px}
 .pager{top:8px;right:8px;bottom:auto;padding:5px 8px}
}