
/* Legacy plugins for 2026 layout
 * - Global: modal / dim / loading / drop-backdrop (outside #baseBody)
 * - Scoped: remaining rules under #baseBody (header / footer / sitemap excluded)
 */

/* ui modal dialog */
/* 1/3 : 팝업준비 */
.ui-modal-ready .ui-modal.ps-bottom,
.ui-modal-ready .ui-modal.ps-page{position:fixed;}
.ui-modal-ready .ui-modal.ps-bottom .ui-modal-header,
.ui-modal-ready .ui-modal.ps-page .ui-modal-header{position:relative;}
.ui-modal-ready .ui-modal.ps-page .ui-modal-cont{padding:0 0 30px;}
.ui-modal-ready .ui-modal.ps-page .ui-modal-cont.type-progress{ padding-top:98px; }
.ui-modal-ready .ui-modal.ps-page .ui-modal-cont .ui-modal-progress{ position:relative; }
.ui-modal-ready .ui-m.fixed-bottom{padding-bottom:0 !important}

/* 2/3 : 팝업모션 */
.ui-modal-ing .ui-modal.ps-page{top:0}
.ui-modal-ing .ui-modal.ps-bottom .ui-modal-header,
.ui-modal-ing .ui-modal.ps-page .ui-modal-header{position:relative;}
.ui-modal-ing .ui-modal.ps-page .ui-modal-cont{padding:0 0 30px;}
.ui-modal-ing .ui-modal.ps-page .ui-modal-cont.type-progress{ padding-top:98px; }
.ui-modal-ing .ui-modal.ps-page .ui-modal-cont .ui-modal-progress{ position:relative; }
.ui-modal-ing .ui-m.fixed-bottom{padding-bottom:0 !important}

/* 3/3 : 팝업 완료 */
.ui-modal-end #baseWrap{position:fixed; }
.ui-modal-end .ui-modal.ps-page{position:absolute;}
.ui-modal-end .ui-modal.ps-page .ui-modal-header{position:fixed;}
.ui-modal-end .ui-modal.ps-page .ui-modal-cont{padding:60px 0 30px;}
.ui-modal-end .ui-modal.ps-page .ui-modal-cont.fixed-bottom{padding-bottom:95px;}
.ui-modal-end .ui-modal.ps-page .ui-modal-cont.type-progress{ padding-top:98px; }
.ui-modal-end .ui-modal.ps-page .ui-modal-cont .ui-modal-progress{ position:fixed; z-index:10;}
.ui-modal-end .ui-m.fixed-bottom{padding-bottom:0 !important}
.ui-modal-end .ui-modal.ps-page .ui-modal-footer{position:fixed; bottom:0; width:100%;}
.ui-modal-end .ui-modal.page-insuinfo .btn-close{position:fixed}
.ui-modal-end .ui-modal.page-insuinfo.type-full .ui-modal-cont{padding-top:0}

.ui-modal-ready .ui-fixed-top .ui-floating-wrap,
.ui-modal-ing .ui-fixed-top .ui-floating-wrap{position:relative !important; top:0 !important}
.ui-modal-ing .page-insuinfo-tit .ui-fixed-top .ui-modal-tit{padding:20px 0}
.ui-modal-ing .page-insuinfo-tit{height:326px}

/* 1/3 : 팝업준비 */
.ui-modal-ready.ui-d .ui-modal.ps-bottom,
.ui-modal-ready.ui-d .ui-modal.ps-page{position:fixed;}
.ui-modal-ready.ui-d .ui-modal.ps-bottom .ui-modal-header,
.ui-modal-ready.ui-d .ui-modal.ps-page .ui-modal-header{position:relative;}
.ui-modal-ready.ui-d .ui-modal.ps-page .ui-modal-cont{padding:0 0 30px;}
.ui-modal-ready.ui-d .ui-m.fixed-bottom{padding-bottom:0 !important}
.ui-modal-ready.ui-d body{overflow-y:scroll !important}

/* 2/3 : 팝업모션 */
.ui-modal-ing.ui-d.is-scroll #baseWrap{position:fixed; width:calc(100% - 17px)}
.ui-modal-ing.ui-d.is-scroll .view-aside-tooltip .tooltip-side{margin-right:17px}
/* .ui-modal-ing.ui-d.is-scroll .base-header{padding-right:17px} */
.ui-modal-ing.ui-d.is-scroll .wrap-top{margin-right:17px}
.ui-modal-ing.ui-d .ui-modal.ps-page{top:0}
.ui-modal-ing.ui-d .ui-modal.ps-bottom .ui-modal-header,
.ui-modal-ing.ui-d .ui-modal.ps-page .ui-modal-header{position:relative;}
.ui-modal-ing.ui-d .ui-modal.ps-page .ui-modal-cont{padding:0 0 30px;}
.ui-modal-ing.ui-d .ui-m.fixed-bottom{padding-bottom:0 !important}

/* 3/3 : 팝업 완료 */
.ui-modal-end.ui-d.is-scroll #baseWrap{position:fixed; width:calc(100% - 17px)}
.ui-modal-end.ui-d.is-scroll .view-aside-tooltip .tooltip-side{margin-right:17px}
/* .ui-modal-end.ui-d.is-scroll .base-header{padding-right:17px} */
.ui-modal-end.ui-d.is-scroll .wrap-top{margin-right:17px}
.ui-modal-end.ui-d .ui-modal.ps-page{position:absolute;}
.ui-modal-end.ui-d .ui-modal.ps-page .ui-modal-header{position:fixed;}
.ui-modal-end.ui-d .ui-modal.ps-page .ui-modal-cont{padding:70px 0 30px;}
.ui-modal-end.ui-d .ui-modal.ps-page .ui-modal-cont.fixed-bottom{padding-bottom:95px;}
.ui-modal-end.ui-d .ui-m.fixed-bottom{padding-bottom:0 !important}
.ui-modal-end.ui-d .ui-modal.ps-page .ui-modal-footer{position:fixed; bottom:0; width:100%;}



.dim,
.modal-backdrop{display:none; opacity:0; position:fixed; top:0; left:0; z-index:0; width:100%; height:200%; background-color:rgba(0,0,0,1);}
.modal-open{overflow:hidden; padding:0;}
.dim-dropdown .dim{display:block;opacity: 1;}
.dim-dropdown .base-body{z-index: auto;}
.ui-modal.type-large{ width:710px; }
.ui-modal.type-Xlarge{ width:1040px; }
.ui-modal.type-system,
.ui-modal.type-small{ width:344px; }
.ui-modal{display:none; opacity:0; position:fixed; z-index:1; height:auto; padding:0; }
.ui-modal.type-full{width:100%; height:100%; padding:0;}
.ui-modal.type-select .lb-radio,
.ui-modal.type-select .lb-check{margin:0; border-bottom:1px solid #ddd; padding:20px; width:100%;}
.ui-modal.ps-page{max-height:100%;}
.ui-modal.ps-bottom{padding:0; background:#fff; width:100%; }
.ui-modal.ps-bottom .ui-modal-cont.type-half{ max-height:400px !important;}
.ui-modal.ps-bottom .ui-modal-cont{max-height:300px; overflow-y:auto; z-index:2;}
.ui-modal.ps-bottom.type-select .ui-modal-cont{max-height:500px; overflow-y:auto; z-index:2;}
.ui-modal.ps-bottom .h2{font-size:22px;}
.ui-modal.ps-bottom .h2:first-child{margin-top:20px;}
.ui-modal.ps-page .ui-modal-cont{/*z-index:2;*/ overflow:hidden}
/* .ui-modal.ps-center {min-width:100%; }
.ui-modal.ps-center .wrap-inner { padding-left:25px; padding-right:25px; font-size:15px; } */

.ui-modal.show{display:block; left:50%;}
.ui-modal .btn-close{position:absolute; top:18px; right:18px; z-index:101;}
.ui-modal-wrap{width:100%; height:100%; position:relative; top:0; left:0; background-color:#fff; box-shadow:0 0 10px rgba(0,0,0,0.2);}
.ui-modal-header{width:100%; position:relative; border:0; top:0; left:0; z-index:1; height:50px; padding:25px 24px 0; max-height:100%; background:#fff}
.ui-modal-header .ui-modal-tit{font-size:18px; text-align:left;  width:100%; height:100%;  display:block; font-weight:500}
.ui-modal.type-large .ui-modal-cont .inner-wrap{ max-height:404px; }
.ui-modal.type-system .ui-modal-cont .inner-wrap,
.ui-modal.type-small .ui-modal-cont .inner-wrap{ max-height:104px; }
.ui-modal.type-system .ui-modal-cont{text-align:center;}
.ui-modal-cont{position:relative; top:0; left:0; height:auto; overflow:auto; width:100%; margin:0; padding:24px 24px 0; background-color:#fff;}
.ui-modal-footer{position:absolute; bottom:0; left:0; width:100%; z-index:3; text-align:center; margin:0; padding:24px 24px 50px; background:#fff;}
.ui-modal-footer .btn-txt{font-weight:400; font-size:14px; color:#ccc; border-bottom:0; margin-right:30px}
.ui-modal-footer .btn-wrap-fixed{position:relative;}
.ui-modal.ps-bottom .ui-modal-footer{position:relative}
.ui-modal.type-system .ui-modal-footer button{margin:0 4px}
.ui-modal-footer button{margin:0 5px }

.base-layer{transition:background-color 0.3s ease-in; top:0; left:0;}

.ui-modal.ps-page .ui-modal-header{padding:21px 70px 0; min-height:60px; z-index:3; background:#fff;}
.ui-modal.ps-page .ui-modal-header.row-2{ padding: 14px 70px; }
.ui-modal.ps-page .ui-modal-header .ui-modal-tit{text-align:center; font-size:15px;}
.ui-modal.ps-page .ui-modal-header .btn-txt{position:absolute; top:20px; color:#ccc; border-bottom:0;}
.ui-modal.ps-page .ui-modal-header .btn-txt.n1{left:32px;}
.ui-modal.ps-page .ui-modal-header .btn-txt.n2{right:18px;}
.ui-modal.ps-page .ui-modal-header .n2{right:20px}
.ui-modal.page-insuinfo .ui-modal-cont{background:#f1f1f1 !important;}

.page-insuinfo-tit .ui-fixed-top .ui-modal-tit{padding:20px 32px}

.page-insuinfo-tit,
.ui-modal.page-insuinfo .ui-modal-wrap .modal-header{background-color:#00358e; color:#fff; }
.ui-modal.page-insuinfo .ui-modal-wrap .modal-header{ z-index:3;width:100%; height:0;}
.ui-modal.page-insuinfo .ui-modal-wrap .modal-header .btn-txt{color:transparent; position:absolute; top:15px; right:32px}
.ui-modal.page-insuinfo .ui-modal-wrap .modal-header .btn-txt:before,
.ui-modal.page-insuinfo .ui-modal-wrap .modal-header .btn-txt:after{background:#fff;}

.page-insuinfo-tit{padding:67px 32px 26px; min-height:230px; width:100%;}
.page-insuinfo-tit .tit{font-size:25px; font-weight:700;}
.page-insuinfo-tit .state{display:inline-block; background-color:red; height:17px; font-size:12px; padding:2px 10px 0; text-align:center; line-height:1; border-radius:8px; vertical-align:middle; font-weight:400}
.page-insuinfo-tit .stocknum{font-size:15px; margin-top:18px}
.page-insuinfo-tit .btn-wrap{text-align:left; margin-top:50px}
.page-insuinfo-tit .btn-base{border-color:#779bd8; background-color:transparent; color:#fff; margin:0}
.page-insuinfo-tit .premium{color:#ff9d03; overflow:hidden; margin-top:25px;}
.page-insuinfo-tit .premium span{display:inline-block; font-size:16px;}
.page-insuinfo-tit .premium strong{display:block; float:right; font-size:30px; font-weight:700;}
.page-insuinfo-tit .premium strong em{vertical-align: middle;}
.page-insuinfo-tit .premium b{font-size: 16px; vertical-align: middle;}
.ui-modal.page-insuinfo .date{display:block; top:26px; font-weight:400; color:#84aae9; font-size:13px; position:absolute; left:32px;}
.ui-modal.page-insuinfo .btn-close:after,
.ui-modal.page-insuinfo .btn-close:before{background:#fff;}
#baseBody .ui-floating-wrap{transform: translateZ(0);}
#baseBody .ui-tab .ui-tab-btns{margin:0; padding: 0 32px;border-bottom: 1px solid #ccc;}


#baseBody .ui-tab.type-base .ui-tab-btns{-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;position: relative;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-lines: single; -ms-flex-wrap: nowrap; flex-wrap: nowrap; margin: 10px 0 0;}
#baseBody .ui-tab.type-base .ui-tab-btn{ -webkit-box-flex: 1; -ms-flex: 1; flex-grow: 1; }

#baseBody .w-n2 .ui-tab-btn{width:50%  !important;}
#baseBody .w-n3 .ui-tab-btn{width:33.33%  !important;}
#baseBody .w-n3 .ui-tab-btn:nth-child(2){width:33.34%  !important;}

.modal-system .ui-modal-cont{text-align:center; padding:20px; font-size:16px;}
.modal-system .btn-wrap{margin-top:20px;}
.modal-system .ui-modal-cont:before{content:""; display:inline-block; width:50px; height:50px; background:url(/netiveUI/common/img/common/ico_modal.png) no-repeat -25px -25px; margin-bottom:20px;}

.modal-system .system-type-a:before{background-position:-25px -25px;}
.modal-system .system-type-b:before{background-position:-125px -25px;}
.modal-system .system-type-c:before{background-position:-225px -25px;}

