
/* 팝업 전체 배경 */
    /* 팝업 전체 배경 (Dimmed) */
    .popup-layer-zone {
        position: fixed;
        top: 0; left: 0;
        width: 100%; height: 100%;
        background: rgba(0, 0, 0, 0.7);
        z-index: 10000;
        display: none; /* JS에서 flex로 변경 */
        justify-content: center;
        align-items: center;
    }

    /* 팝업 개별 아이템 - 핵심은 absolute로 한 자리에 겹치는 것 */
    .popup-item {
        position: absolute;
        background: #fff;
        border-radius: 20px;
        box-shadow: 0 15px 40px rgba(0,0,0,0.5);

        width: 700px;
        max-width: 90vw;
        max-height: 85vh;

        display: none; /* 초기 숨김 */
        flex-direction: column;
        overflow: hidden;
    }

    /* 뒤에 있는 팝업은 클릭이 안 되도록 막는 클래스 */
    .popup-item.is-behind {
        pointer-events: none;
        filter: brightness(0.8); /* 뒤에 있다는 느낌을 주기 위해 살짝 어둡게 */
    }

    /* 스크롤 영역 */
    .popup-body {
        flex: 1;
        overflow-y: auto;
    }
    .popup-body img { width: 100%; display: block; }

    /* 하단 고정 영역 - flex-shrink: 0으로 사라짐 방지 */
    .popup-footer {
        flex-shrink: 0;
        background: #fff;
        border-top: 1px solid #eee;
        padding: 15px 20px;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .close-btn {
        background: #000; color: #fff; border: none;
        padding: 8px 18px; border-radius: 20px; font-weight: bold; cursor: pointer;
    }
    .close-btn:hover { background: #333; }

    /* 애니메이션 (아래에서 위로 슝) */
    @keyframes slideUp {
        from { transform: translateY(50px) scale(0.95); opacity: 0; }
        to { transform: translateY(0) scale(1); opacity: 1; }
    }

    /* [모바일 대응] */
    @media (max-width: 768px) {
        .popup-zone {
            flex-direction: column; /* 세로로 쌓기 */
            justify-content: center;
            overflow-y: auto;       /* 팝업이 많으면 전체 배경 스크롤 */
            pointer-events: auto;   /* 모바일은 스크롤해야 하므로 이벤트 활성화 */
        }

        .popup-content {
            width: 100%;    /* 모바일 꽉 차게 */
            max-height: 70vh; /* 모바일은 높이를 좀 더 작게 잡아서 여러 개 보이게 유도 */
        }
    }