@char-set("utf-8");
  
  .popup-overlay {
            position: fixed; top: 0; left: 0; width: 100%; height: 100%;
            background: rgba(0, 0, 0, 0.75); z-index: 99991;
            display: none; align-items: center; justify-content: center;
        }
        
        .popup-container {
            width: 95%; max-width: 850px; position: relative;
            /* 배경을 투명하게 하여 배너 간 여백이 배경(검정)으로 보이게 설정 */
            background: transparent; 
        }

        .paging-info {
            position: absolute; top: -40px; left: 50%; transform: translateX(-50%);
            z-index: 110; background: #fff; color: #333; 
            padding: 4px 15px; border-radius: 20px; font-size: 14px; font-weight: bold;
            box-shadow: 0 4px 10px rgba(0,0,0,0.3);
        }

        /* [여백 설정의 핵심] */
        .popup-slick { margin: 0 -10px; } /* 부모 컨테이너의 padding 상쇄 */
        .popup-slick .item { 
            outline: none; 
            padding: 0 10px; /* 배너 좌우에 10px씩, 총 20px의 여백 생성 */
        }
        .popup-slick .item img { 
            width: 100%; display: block; border-radius: 12px; 
            box-shadow: 0 4px 15px rgba(0,0,0,0.2);
        }

        .popup-footer {
            display: flex; background: #3c4146; height: 50px; 
            border-radius: 10px; margin-top: 20px; overflow: hidden;
        }
        .popup-footer button {
            flex: 1; border: none; background: transparent; color: #fff;
            font-size: 14px; cursor: pointer; display: flex; align-items: center; justify-content: center;
        }
        .btn-today { border-right: 1px solid rgba(255,255,255,0.1) !important; }

        /* 화살표 위치 (여백을 고려하여 이미지 안쪽 배치) */
        .slick-prev, .slick-next {
            position: absolute; top: 50%; transform: translateY(-50%);
            z-index: 105; width: 40px; height: 40px; background: rgba(255,255,255,0.9) !important;
            border-radius: 50%; border: none; cursor: pointer; font-size: 0;
            display: flex !important; align-items: center; justify-content: center;
            box-shadow: 0 4px 10px rgba(0,0,0,0.3);
        }
        .slick-prev { left: 20px; } 
        .slick-next { right: 20px; }

        .slick-prev::before, .slick-next::before {
            content: ''; display: block; width: 10px; height: 10px;
            border-top: 3px solid #333; border-left: 3px solid #333;
        }
        .slick-prev::before { transform: rotate(-45deg); margin-left: 5px; }
        .slick-next::before { transform: rotate(135deg); margin-right: 5px; }

        @media (max-width: 768px) {
            .popup-container { max-width: 400px; }
            .popup-slick { margin: 0; }
            .popup-slick .item { padding: 0; } /* 모바일 1장일 때는 여백 제거 */
            .slick-prev { left: 10px; }
            .slick-next { right: 10px; }
        }