.modal_wrap {position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; background-color: #00000050; z-index: 600;}

/* LB.Modal 알림/확인 - HMM21 사용자 화면 스킨 */
.hmm-modal-layer {
    background: rgba(7, 17, 71, .54) !important;
    backdrop-filter: blur(4px);
}

.hmm-modal-panel {
    width: min(420px, calc(100vw - 40px)) !important;
    max-width: calc(100vw - 40px) !important;
    border-radius: 16px !important;
    border: 1px solid rgba(255, 255, 255, .72);
    box-shadow: 0 24px 70px rgba(7, 17, 71, .26), 0 8px 20px rgba(0, 0, 0, .08) !important;
    overflow: hidden !important;
}

.hmm-modal-content {
    max-width: none !important;
    padding: 34px 36px 30px !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .98), #fff 62%),
        linear-gradient(90deg, #1A34C7 0, #20265B 100%);
    position: relative;
}

.hmm-modal-content::before {
    content: "";
    display: block;
    width: 42px;
    height: 3px;
    border-radius: 999px;
    background: #1A34C7;
    margin-bottom: 18px;
}

.hmm-modal-content > div:first-child {
    margin-bottom: 26px !important;
    color: #20265B !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    line-height: 1.55 !important;
    letter-spacing: 0;
    word-break: keep-all;
}

.hmm-modal-content > div:last-child {
    justify-content: flex-end !important;
    gap: 10px !important;
}

.hmm-modal-content .modal-confirm-btn,
.hmm-modal-content .modal-cancel-btn {
    min-width: 104px;
    min-height: 46px;
    padding: 0 26px !important;
    border-radius: 999px !important;
    font-family: inherit;
    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 46px !important;
    transition: transform .18s ease, background-color .18s ease, border-color .18s ease, color .18s ease !important;
}

.hmm-modal-content .modal-confirm-btn {
    background: #20265B !important;
    color: #fff !important;
    border: 1px solid #20265B !important;
}

.hmm-modal-content .modal-confirm-btn:hover,
.hmm-modal-content .modal-confirm-btn:focus {
    background: #1A34C7 !important;
    border-color: #1A34C7 !important;
}

.hmm-modal-content .modal-cancel-btn {
    background: #f2f4f8 !important;
    color: #4b5565 !important;
    border: 1px solid #e3e6ee !important;
}

.hmm-modal-content .modal-cancel-btn:hover,
.hmm-modal-content .modal-cancel-btn:focus {
    background: #e8ebf2 !important;
}

.hmm-modal-content .modal-confirm-btn:active,
.hmm-modal-content .modal-cancel-btn:active {
    transform: translateY(1px) scale(.99);
}

/* 모달 - 알림 */
.md_box {position: absolute; top: 50%; left: 50%; background-color: #fff; padding: 40px; border-radius: 16px; transform: translate(-50%, -50%); min-width: 260px; width: 500px; max-width: 95vw;}
.md_box dl {display: flex; width: 100%; flex-direction: column; align-items: center; gap: 15px;}
.md_box dt {font-size: clamp(15px, 2vw, 18px); font-weight: 500; color: #7b7d8f;}
.md_box dd {font-size: clamp(16px, 2.4vw, 20px); line-height: 1.5;}
.md_box .md_close {margin: 30px auto 0; padding: 14px 30px; border-radius: 60px; background-color: #20265B; color: #fff; font-size: 15px; width: max-content; cursor: pointer; line-height: 1;}



/* 팝업배너 */
.popup_box {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 40vw; border-radius: 12px; overflow: hidden; box-shadow: 0 0 5px rgba(0, 0, 0, .3);}
.popSwiper {aspect-ratio: 3 / 2; overflow: hidden; width: 100%;}
.popSwiper .swiper-pagination {position: absolute !important; bottom: 5% !important; left: 50% !important; transform: translateX(-50%);}
.popSwiper .swiper-pagination-bullet {width: 12px; height: 12px;}
.popSwiper .swiper-pagination-bullet-active {background-color: #1A34C7;}
.popSwiper .swiper-slide {width: 100%; height: 100%; overflow: hidden;}
.popSwiper .swiper-slide img {width: 100%; height: 100%; display: block;}
.pop_btn {width: 100%; display: flex;}
.pop_btn button {text-align: center; padding: 15px; width: 50%; font-size: 15px; font-weight: 500; background-color: #c6c7d3; color: #444;}
.pop_btn button:last-child {background-color: #20265b; color: #fff;}



@media screen and (max-width: 1280px) {
    .popup_box {width: 70vh;}
}



@media screen and (max-width: 750px) {
    .hmm-modal-panel {
        width: calc(100vw - 32px) !important;
    }

    .hmm-modal-content {
        padding: 28px 24px 24px !important;
    }

    .hmm-modal-content > div:first-child {
        font-size: 16px !important;
        margin-bottom: 22px !important;
    }

    .hmm-modal-content .modal-confirm-btn,
    .hmm-modal-content .modal-cancel-btn {
        min-width: 96px;
        min-height: 42px;
        font-size: 14px !important;
        line-height: 42px !important;
    }

    /* 모달 - 알림 */
    .md_box {width: 95vw; padding: 30px; border-radius: 12px;}
    .md_box dl {gap: 10px;}
    .md_box .md_close {padding: 10px 24px; font-size: 14px; margin-top: 20px;}


    .popup_box {width: 95vw;}
    .pop_btn button {font-size: 14px; padding: 10px;}
}