.md_wrap {position: fixed; width: 100vw; height: 100vh; top: 0; left: 0; background: #00000050; z-index: 1000;}
.md_container {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.md_btn {gap: 8px; width: 100%; display: flex; justify-content: center;}
.md_btn button {font-size: 14px; padding: 8px 15px; width: auto;}
.md_box {padding: 25px; border-radius: 10px; background-color: #fff;}
.md_title {font-size: clamp(15px, 1.8vw, 20px); text-align: center; width: 100%; padding-bottom: 15px;}



/* 모달 - 약관 보기 */
.md_terms {width: 100%; border-radius: 10px; overflow-y: auto; background-color: #f3f3f3; font-size: 15px; padding: 20px; height: 20vh; max-height: 400px; margin-bottom: 15px;}



/* 모달 - 메인 팝업 */
.md_box.popup {width: 70vw; max-width: 500px; border-radius: 15px; overflow: hidden; background-color: transparent; padding: 0;}
.popSwiper {width: 100%; aspect-ratio: 1;}
.popSwiper .swiper-slide {width: 100%;}
.popSwiper .swiper-slide img {width: 100%; height: 100%; object-fit: cover;}
.md_box.popup .md_btn {background-color: #fff; gap: 0;}
.md_box.popup .md_btn span {width: 50%; padding: 10px; font-size: 14px; text-align: center; cursor: pointer; color: #444;}
.md_box.popup .md_btn span:last-child {border-left: 1px solid #ddd;}


/* 모달 - 기본 알림창 */
.md_wrap.alert {background: transparent;}
.md_box.alert {box-shadow: 0 0 15px #00000010; width: 18vw;}
.md_box.alert dl {width: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; padding: 10px 0 25px;}
.md_box.alert dt {font-size: clamp(14px, 1vw, 16px); color: #85909d; text-align: center;}
.md_box.alert dd {font-size: clamp(15px, 1.1vw, 17px); text-align: center;}


/* 모달 - 견적문의 목적지 선택 */
.md_wrap.desti .md_box {width: 40vw;}
.md_box.desti .md_title {text-align: left; font-size: clamp(15px, 1.8vw, 18px); font-weight: 600;}
.md_box.desti .md_title_sub {font-size: 13px; color: #2377dd; padding-bottom: 10px; display: block;}
.md_destination {width: 100%; border: 1px solid #e5e5e5; border-radius: 5px; margin-bottom: 20px; overflow: hidden;}
.desti_list {width: 100%; display: flex; height: 30vh; max-height: 300px; min-height: 200px;}
.desti_list .desti_depth1 {width: 30%; display: flex; flex-direction: column; background-color: #fafafa; border-right: 1px solid #e5e5e5; height: 100%; overflow-y: auto;}
.desti_list .desti_depth1 li {width: 100%; padding: 10px 12px; font-size: 15px; color: #777; border-bottom: 1px solid #e5e5e5; cursor: pointer;}
.desti_list .desti_depth1 li:hover {color: #555;}
.desti_list .desti_depth1 li.on {background-color: #fff; color: #333; font-weight: 600;}

.desti_list .desti_depth2 {width: 70%; display: flex; flex-wrap: wrap; gap: 10px; row-gap: 8px; padding: 15px; align-items: flex-start; align-content: flex-start;}
.desti_list .desti_depth2 li {font-size: 14px; line-height: 1; padding: 10px 12px; border-radius: 5px; color: #888; cursor: pointer; border: 1px solid #e5e5e5;}
.desti_list .desti_depth2 li.on {background-color: #333; color: #fff; border-color: #333;}

.md_destination .desti_area {padding: 15px; border-top: 1px solid #e5e5e5;}