/* 홈 안내 팝업 배치 — 목록 순서(divpop0 → 1 → 2 → 3)대로 왼쪽부터 나란히 둔다.
   창이 좁으면 폭을 줄이고, 4개인데 더 좁으면 두 줄로 둔다. 폰에서는 같은 순서로 위에서 아래로 쌓인다. */
@media all and (min-width: 769px) {
    body { --pop-n: 3; --pop-w: min(400px, calc((100vw - 60px) / var(--pop-n))); --pop-x: calc((100vw - var(--pop-w) * var(--pop-n) - 10px * (var(--pop-n) - 1)) / 2); }
    body:not(:has(#divpop2)) { --pop-n: 2; }
    body:not(:has(#divpop1)) { --pop-n: 1; }
    body:has(#divpop3) { --pop-n: 4; --pop-w: min(400px, calc((100vw - 70px) / 4)); }
    body .pop_div { width: var(--pop-w) !important; max-width: none !important; top: 150px !important; }
    body .pop_div form > div:first-child { width: 100% !important; }
    body .pop_div form > div:first-child img { width: 100% !important; height: auto !important; }
    body #divpop0 { left: var(--pop-x) !important; }
    body #divpop1 { left: calc(var(--pop-x) + (var(--pop-w) + 10px)) !important; }
    body #divpop2 { left: calc(var(--pop-x) + (var(--pop-w) + 10px) * 2) !important; }
    body #divpop3 { left: calc(var(--pop-x) + (var(--pop-w) + 10px) * 3) !important; }
}
@media all and (min-width: 769px) and (max-width: 1099px) {
    body:has(#divpop3) { --pop-n: 2; --pop-w: min(400px, calc((100vw - 50px) / 2)); }
    body:has(#divpop3) #divpop2 { left: var(--pop-x) !important; top: calc(150px + var(--pop-w) * 1.45 + 60px) !important; }
    body:has(#divpop3) #divpop3 { left: calc(var(--pop-x) + (var(--pop-w) + 10px)) !important; top: calc(150px + var(--pop-w) * 1.45 + 60px) !important; }
}
@media all and (max-width: 768px) {
    body #divpop0 { z-index: 10004 !important; }
    body #divpop1 { z-index: 10003 !important; }
    body #divpop2 { z-index: 10002 !important; }
    body #divpop3 { z-index: 10001 !important; }
}