@charset "utf-8";

/* =========================== PAGE */
#popWrap{display:flex;justify-content:center;align-items:flex-start;overflow-y:auto;position:fixed;gap:24px;left:0;top:0;z-index:1001;width:100%;height:100%;padding:0 12px;background:rgba(0, 0, 0, .75);font-family:'Pretendard'}

/* 팝업 공통 */
.popcommon .popup-cont{overflow:hidden;position:relative;top:10vh;width:100%;max-width:450px;margin:auto}
.popcommon .popup-slider li .cont{position:absolute;left:0;top:0;z-index:-1}
.popcommon .popup-slider li a{display:block}
.popcommon .popup-slider li img{width:100%;display:block}
.popcommon .popup-pager{display:flex;justify-content:space-between;background:#fff}
.popcommon .popup-pager span{flex-grow:1;display:flex;justify-content:center;align-items:center;opacity:1;width:auto;height:60px;margin:0 !important;border-radius:0;font-size:16px;font-weight:600;background:none;font-family:'Pretendard';cursor:pointer}
.popcommon .popup-pager span+span{border-left:1px solid #e1e1e1}
.popcommon .popup-pager span.active{color:#fff;background:#5700f8}
.popcommon .popup-btns{overflow:hidden;display:flex}
.popcommon .popup-btns button{padding:12px 0;border:none;font-size:15px;font-weight:600;color:#fff;background:none;font-family:'Pretendard';cursor:pointer}
.popcommon .popup-btns .popup-close{position:relative;z-index:101;margin-left:auto;padding:16px 20px;border-top:1px solid #ddd;color:#222;background:#fff}

/* 반응형 */
@media(max-width:1024px){
.popcommon .popup-cont{max-width:400px}
.popcommon .popup-pager span{height:50px;font-size:15px}
.popcommon .popup-btns button{font-size:14px}
.popcommon .popup-btns .popup-close{padding:12px 20px}
}

@media(max-width:768px){
#popWrap{display:block;overflow-y:auto}
.popcommon .popup-cont{top:5vh;max-width:300px}
.popcommon .popup-cont img{width:100%}
.popcommon .popup-pager{position:absolute;bottom:15px;z-index:101;justify-content:center;border:none;background:none}
.popcommon .popup-pager span{opacity:.4;flex-grow:unset;width:6px;height:6px;border-radius:50%;font-size:0;background:#fff}
.popcommon .popup-pager span+span{margin-left:5px;border:none}
.popcommon .popup-pager span.active{opacity:1;background:#fff}
.popcommon .popup-btns button{position:relative;z-index:999;padding:10px 0;font-size:12px}
.popcommon .popup-btns .popup-close{padding:10px 15px;font-size:13px}
.popcommon .popup-pager span{margin:0 5px !important}
#popup1002{margin-top:30px}
}