/*-------------------------------------------------------------------
    파일정의 : 레이아웃
    속성순서 : 레이아웃, 사이징, 박스모양, 글자모양, 문단모양, 기타모양
-------------------------------------------------------------------*/
/*-------------------------------------------------------------------
    @header
-------------------------------------------------------------------*/
#header{ position: relative; height: 200px; }
#header::before{ position: absolute; width: 100%; height: 400px; content: ""; background: url('../img/common/bg_header.png') no-repeat center; background-size: cover }
#header .inner{ position: relative; width: 1400px; margin: 0 auto; z-index: 1; height: 100%; }

.logo{ width: 242px; height: 200px; margin: 0 auto; background: url('../img/common/logo_w.png') no-repeat center; background-size: 100%; text-indent: -9999px; }

.util{ position: absolute; right: 0; bottom: 0; transform: translateY(-50%); }
.util .user{ display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; }
.util .user:after{ content:''; min-height:inherit; font-size:0; }
.util .user .profile{ display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; margin-right: 20px; }
.util .user .profile:after{ content:''; min-height:inherit; font-size:0; }
.util .user .profile p{ color: #ffffff; font-size: 12px; }
.util .user .btn{ font-size: 12px; }
.util .user .btn .ic-logout{ margin-bottom: -8px; }
 
/*-------------------------------------------------------------------
    @content
-------------------------------------------------------------------*/
#content{ position: relative; z-index: 1; padding-bottom: 60px; }

.lnb-wrap{ flex: none; width: 205px; margin-right: 40px; }
.lnb-wrap .lnb-header{ margin-bottom: 20px; }

.lnb-wrap .lnb-header .logo{ width: 132px; height: 36px; background: url('') no-repeat center; background-size: 100%; margin: 0 0 10px; background-repeat: no-repeat!important;position: relative;}
.lnb-wrap .lnb-header .logo > span{ position: absolute;bottom:-20px;color:#888;text-indent: initial;width:100%;left:0;border:1px solid #e5e5e5;text-align: center;}
.lnb-wrap .lnb-header .txt-field{ font-size: 14px; font-weight: 700; }
.lnb-wrap .lnb-content > ul > li{ border-bottom: 1px solid #D9E1E6; }
.lnb-wrap .lnb-content > ul > li > a{ display: block; width: 100%; padding: 14px 20px; line-height: 1.42; }
.lnb-wrap .lnb-content > ul > li:hover,
.lnb-wrap .lnb-content > ul > li.on{ background: #08B39A; }
.lnb-wrap .lnb-content > ul > li:hover > a,
.lnb-wrap .lnb-content > ul > li.on > a{ color: #ffffff; }
.lnb-wrap .lnb-content > ul > li > a > i{ margin-right: 10px; margin-bottom: -5px; }
.lnb-wrap .lnb-content ul li ul{ position: relative; padding: 11px 0; display: none; }
.lnb-wrap .lnb-content ul li.on ul{ display: block; }
.lnb-wrap .lnb-content ul li ul::before{ width: 152px; height: 1px; background: #0D806F; top: 0; left: 50%; transform: translateX(-50%); content: ""; display: block; position: absolute; }
.lnb-wrap .lnb-content ul li ul li a{ padding: 5px 50px; font-size: 14px; width: 100%; display: block; line-height: 1.42; color: #0D806F; }
.lnb-wrap .lnb-content ul li ul li.on a,
.lnb-wrap .lnb-content ul li ul li:hover a{ color: #ffffff; }

.page-content{ flex: 1 0; overflow: hidden; position: relative; }

.container{ width: 1400px; background: #ffffff; margin: 0 auto; display: -ms-flexbox; display: -webkit-flex; display: flex; padding: 30px 40px 40px; }

/*-------------------------------------------------------------------
    @popup
-------------------------------------------------------------------*/
.dim{ background: #000000; opacity: 0.5; position: fixed; z-index: 98; width: 100vw; height: 100vh; top: 0; left: 0; }
.popup{ border: 0; border-radius: 0; border-top: 4px solid #08B39A; z-index: 99; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); background: #ffffff; display: none; }
.popup.on{ display: block; }

.popup .pop-cont{ padding: 20px; }
.popup .pop-cont .tit.v2{ padding-top: 20px; }
.popup .pop-cont .img-wrap{ width: 100%; height: 180px; border-radius: 8px; background: #F0F3F5; }

.popup.alert{ padding: 0; margin: 0; }
.popup.alert .pop-cont{ display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; min-height: 150px; }
.popup.alert .pop-cont:after{ content:''; min-height:inherit; font-size:0; }
.popup.alert .pop-cont .txt{ text-align: center; flex: none; width: 100%; text-align: center; }

.popup .pop-footer{ padding: 20px; border-top: 1px solid #CED4DA; }
.popup .pop-footer .btn-wrap .btn{ padding: 0; min-width: 80px; }

.ui-tooltip{ opacity: 1 !important; box-shadow: none; padding: 0; border: 1px solid #343A40 !important; border-radius: 8px; background: #ffffff; width: 212px; }
.ui-tooltip .ui-tooltip-content{ position: relative; padding: 16px 0; text-align: center; }
.ui-tooltip .ui-tooltip-content::before,
.ui-tooltip .ui-tooltip-content::after{ content: ""; display: block; border-left: 6px solid transparent; border-right: 6px solid transparent; position: absolute; left: 50%; transform: translateX(-50%); top: 100%; }
.ui-tooltip .ui-tooltip-content::before{ border-top: 10px solid #343A40; }
.ui-tooltip .ui-tooltip-content::after{ border-top: 10px solid #ffffff; z-index: 1; margin-top: -2px; }
.ui-tooltip .ui-tooltip-content p{ color: #194064; font-size: 12px; margin-top: 8px; }