
: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 30px rgba(31,22,18,.10)}
.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;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.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}
#d1:checked~.win .sc1,#d2:checked~.win .sc2,#d3:checked~.win .sc3,#d4:checked~.win .sc4{display:block}
.dot{position:absolute;width:22px;height:22px;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:-9px;border-radius:50%;border:2px solid rgba(218,53,11,.55);animation:pulse 1.9s ease-out infinite}
@keyframes pulse{0%{transform:scale(.7);opacity:.9}100%{transform:scale(1.55);opacity:0}}
.call{position:absolute;z-index:4;width:min(300px,42%);background:var(--brand);color:#fff;border-radius:14px;padding:13px 14px 11px;box-shadow:0 12px 32px rgba(122,30,8,.32)}
.call .step{font-size:11px;font-weight:800;opacity:.85;letter-spacing:.05em}
.call h3{margin:4px 0 5px;font-size:15.5px;font-weight:800;letter-spacing:-.02em;word-break:keep-all;line-height:1.35}
.call p{margin:0 0 10px;font-size:13px;line-height:1.5;opacity:.95;word-break:keep-all}
.call .row{display:flex;align-items:center;justify-content:space-between;gap:8px}
.call .cnt{font-size:11.5px;font-weight:700;opacity:.85}
.btns{display:flex;gap:6px}
.arw{width:32px;height:32px;border-radius:9px;background:rgba(255,255,255,.2);display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:15px;font-weight:800;color:#fff;user-select:none}
.arw.solid{background:#fff;color:var(--brand)}
.arw:hover{opacity:.88}
.pager{position:absolute;right:12px;bottom:10px;display:flex;gap:6px;z-index:5;background:rgba(20,18,16,.55);padding:7px 10px;border-radius:999px;backdrop-filter:blur(4px)}
.pager label{width:8px;height:8px;border-radius:999px;background:rgba(255,255,255,.55);cursor:pointer;display:block}
#d1:checked~.win .pager .pg1,#d2:checked~.win .pager .pg2,#d3:checked~.win .pager .pg3,#d4:checked~.win .pager .pg4{background:#fff;width:20px}

@media(max-width:640px){.call{width:min(230px,52%);padding:10px 11px 9px;border-radius:12px}.call h3{font-size:13px}.call p{font-size:11.5px;margin-bottom:8px}.arw{width:28px;height:28px;font-size:13px}.call .cnt{display:none}.barlabel{font-size:10.5px}.dot{width:16px;height:16px}}

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

.sc1 .call{right:3.5%;bottom:7%}.sc1 .dot{left:48.90%;top:33.90%}
.arw,.dots,.step{display:none}
.call{max-width:340px}
input{position:absolute!important;left:62%;top:82%;width:1px;height:1px;opacity:0;pointer-events:none}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}
 .sc1 img{object-position:49% 34%}
 .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}
}
