.case_modal {position: fixed;width: 100%; height: 100vh; top: 0; z-index: 999999;}
.case_modal .modal_bg {position: absolute; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.4); top: 0; left: 0; z-index: 99999;}
.case_modal .case_img {position: fixed; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 999999; width: 50%;}
.case_modal .case_img i {position: absolute; top: 5px; right: 5px; font-size: 35px; cursor: pointer;}

/* 모달-개인정보처리방침 */
.modal_wrap {width: 100vw; height: 100vh; position: fixed; top: 0; left: 0; background-color: rgba(0, 0, 0, .5); z-index: 99999;}
.modal_box {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background-color: white; padding: 2rem; border-radius: 10px;}

.modal_con {display: flex; flex-direction: column; align-items: center; gap: 30px;}
.modal_con h1 {font-size: 1.8rem; color: black; font-family: 'Pretendard'; font-weight: 600; text-align: center;}
.terms_con {width: 35vw; background-color: #f1f3f4; padding: 1.2rem; height: 45vh;}
.terms_con p {color: #333; font-size: 1.1rem; line-height: 1.4; overflow-y: auto; height: 100%;}
.btn_terms {cursor: pointer; display: flex;}
.btn_terms span {display: inline-block; padding: 10px 50px; border-radius: 40px; background-color: #7B45FD; color: #fff; font-size: 1.2rem; font-weight: 300;}
.btn_terms span.cancel_btn {background-color: white; border: 1px solid #ddd; color: #333; margin-left: 15px;}

@media screen and (max-width: 940px) {
    .modal_con h1 {font-size: 1.6rem;}
}

@media screen and (max-width: 750px) {
    .terms_con {width: 65vw;}
}

@media screen and (max-width: 600px) {
    .modal_con h1 {font-size: 1.2em;}
    .terms_con p {font-size: .9rem;}
    .btn_terms span {font-size: .9rem;}
    .modal_box {padding: 2rem;}

}

@media screen and (max-width: 450px) {
    .modal_con {gap: 20px; padding: 1rem;}
}

@media screen and (max-width: 320px) {
    .modal_con h1 {font-size: 1em;}
    .modal_box {padding: .5rem;}
    .terms_con {width: 85vw;}
}