@charset "UTF-8";
/*************
공통 속성
modal.css
*************/


/* ---------------------------------------------------
mobile popup layout
--------------------------------------------------- */
/* html layout 고정 */
html.has-modal {overflow:hidden;height:100%;}

/* modal dim */
.m-dim {display:none;position:fixed;top:0;left:0;z-index:1000;width:100%;height:100%;background-color:rgba(0,0,0,0.5);}

/* popup layout */
.m-pop {display:none;position:fixed;bottom:-100%;left:0;z-index:1001;box-sizing:border-box;width:100%;height:100%;}
.m-pop .m-pop-close {overflow:hidden;position:absolute;top:6px;right:10px;z-index:2;}
.m-pop .m-pop-close a {display:block;position:relative;width:36px;height:36px;font-size:0;line-height:0;text-decoration:none;text-indent:-10000px;}
.m-pop .m-pop-close a:before {content:'';display:block;position:absolute;top:0;left:0;width:36px;height:36px;background:url(/images/common/popup_close.png) no-repeat 0 0;background-size:36px auto;}
.m-pop .stand-pop {overflow:hidden;position:relative;width:100%;height:100%;background:#fff;}
.m-pop .stand-pop .m-pop-tit {position:absolute;top:0;left:0;z-index:1;box-sizing:border-box;width:100%;padding:13px 16px;background:#fff;font-size:16px;font-weight:600;letter-spacing:-0.02em;line-height:22px;color:#121212;text-align:center;text-transform:uppercase;white-space:nowrap;word-wrap:normal;text-overflow:ellipsis;overflow:hidden;}
.m-pop .stand-pop .m-pop-cont {overflow-x:hidden;overflow-y:auto;position:absolute;top:48px;bottom:0;left:0;right:0;box-sizing:border-box;padding:28px 20px;font-size:14px;line-height:20px;color:#121212;font-weight:400;}
.m-pop .stand-pop .m-pop-cont strong {font-weight:600;}
.m-pop .stand-pop .pop-btn-area {display:flex;display:-webkit-flex;display:-webkit-box;position:absolute;left:0;bottom:0;box-sizing:border-box;width:100%;}
.m-pop .stand-pop .pop-btn-area .pop-btn {flex:1;-webkit-box-flex:1;-webkit-flex:1;display:block;position:relative;box-sizing:border-box;height:49px;border-top:1px solid #e2e2e2;border-left:1px solid #e2e2e2;background:#fff;font-size:13px;line-height:48px;color:#121212;text-align:center;text-decoration:none;}
.m-pop .stand-pop .pop-btn-area .pop-btn:first-child {border-left:none 0;}
.m-pop .stand-pop .pop-btn-area .pop-btn.red {color:#ff3c3c;}
.m-pop.isbtn .m-pop-cont {bottom:49px;}
.m-pop.unfill .stand-pop {border-radius:16px 16px 0 0;}

/* alert 팝업 (가운데 뜨는 팝업 - 컨텐츠 높이 300px/320 해상도 고려) */
.m-pop.alert .pop-layer {position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-sizing:border-box;width:258px;max-height:80%;background:#fff;border-radius:2px;}
.m-pop.alert .pop-layer .m-pop-cont {overflow-x:hidden;overflow-y:auto;box-sizing:border-box;width:100%;max-height:280px;padding:28px 20px 24px 28px;font-size:14px;line-height:20px;font-weight:400;text-align:center;}
.m-pop.alert .pop-layer .m-pop-cont strong {font-weight:600;}
.m-pop.alert .pop-layer .pop-btn-area {display:flex;display:-webkit-flex;display:-webkit-box;box-sizing:border-box;width:100%;border-top:1px solid #e2e2e2;}
.m-pop.alert .pop-layer .pop-btn-area .pop-btn {flex:1;-webkit-box-flex:1;-webkit-flex:1;display:block;position:relative;box-sizing:border-box;height:49px;border-left:1px solid #e2e2e2;background:#fff;font-size:13px;line-height:48px;color:#121212;text-align:center;text-decoration:none;}
.m-pop.alert .pop-layer .pop-btn-area .pop-btn:first-child {border-left:none 0;}
.m-pop.alert .pop-layer .pop-btn-area .pop-btn.red {color:#ff3c3c;}

/* 팝업 모달 영역 닫기 */
.m-pop .blank-btn {display:none;position:absolute;top:0;left:0;bottom:0;right:0;;background:url(/images/common/blank.gif) repeat 0 0;}
.m-pop.focus-pop .blank-btn {display:block;}
.m-pop.unfill .blank-btn {top:-10000px;}

/* 토스트팝업 */
.toast-pop {position:fixed;left:0;top:0;width:100%;height:100%;z-index:2000;background-color:rgba(0,0,0,0.5);opacity:0;transition:opacity 0.4s;}
.toast-pop.on {display:block;opacity:1;}
.toast-pop .toast-pop-obj {overflow:hidden;position:fixed;top:50%;left:50%;z-index:2000;width:100px;height:100px;margin:-50px 0 0 -50px;background:#fff;border:1px solid #efefef;border-radius:50%;box-shadow:0 0 2px rgba(0,0,0,0.5);font-size:0;line-height:0;text-indent:-100000px;}
/*
<script type="text/javascript">
	toastPop();
</script>
*/


/* ---------------------------------------------------
popup objects
--------------------------------------------------- */