/*************/
/* ui layout */
/*************/
@font-face {
	font-family: 'Pretendard';
	font-weight: 900;
	font-display: swap;
	src: local('Pretendard Black'), url('../font/woff2/Pretendard-Black.woff2') format('woff2'), url('../font/woff/Pretendard-Black.woff') format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 800;
	font-display: swap;
	src: local('Pretendard ExtraBold'), url('../font/woff2/Pretendard-ExtraBold.woff2') format('woff2'), url('../font/woff/Pretendard-ExtraBold.woff') format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 700;
	font-display: swap;
	src: local('Pretendard Bold'), url('../font/woff2/Pretendard-Bold.woff2') format('woff2'), url('../font/woff/Pretendard-Bold.woff') format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 600;
	font-display: swap;
	src: local('Pretendard SemiBold'), url('../font/woff2/Pretendard-SemiBold.woff2') format('woff2'), url('../font/woff/Pretendard-SemiBold.woff') format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 500;
	font-display: swap;
	src: local('Pretendard Medium'), url('../font/woff2/Pretendard-Medium.woff2') format('woff2'), url('../font/woff/Pretendard-Medium.woff') format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 400;
	font-display: swap;
	src: local('Pretendard Regular'), url('../font/woff2/Pretendard-Regular.woff2') format('woff2'), url('../font/woff/Pretendard-Regular.woff') format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 300;
	font-display: swap;
	src: local('Pretendard Light'), url('../font/woff2/Pretendard-Light.woff2') format('woff2'), url('../font/woff/Pretendard-Light.woff') format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 200;
	font-display: swap;
	src: local('Pretendard ExtraLight'), url('../font/woff2/Pretendard-ExtraLight.woff2') format('woff2'), url('../font/woff/Pretendard-ExtraLight.woff') format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 100;
	font-display: swap;
	src: local('Pretendard Thin'), url('../font/woff2/Pretendard-Thin.woff2') format('woff2'), url('../font/woff/Pretendard-Thin.woff') format('woff');
}

.ub-page {overflow-y:hidden !important;}
/* .ub-page {overflow:hidden !important;} */

/* [error] */
.ub-page.error .ub-layout.errorHead {width:220px;margin:56px auto 0;padding:9px 0 33px 75px;background:url(../images/common/bg_errorHead.png) no-repeat 0 0;}
.ub-page.error .ub-layout.errorHead .comment1 {font-size:14px;color:#666666;font-weight:bold;}
.ub-page.error .ub-layout.errorHead .comment1 em {color:#d45428;}
.ub-page.error .ub-layout.errorHead .comment2 {padding-top:5px;color:#666666;}
.ub-page.error .ub-layout.errorCon {margin:0 20px 10px;padding:20px 18px;background-color:#f5f5f5;color:#6e6e6e;}
.ub-page.error .ub-layout.errorCon .errorCon-float {padding-bottom:7px;}
*+ html .ub-page.error .ub-layout.erf.ub-frame.top h1 arorCon .errorCon-float {display:inline-block;}
.ub-page.error .ub-layout.errorCon .errorCon-float:after {content:".";display:block;height:0;clear:both;visibility:hidden;}
.ub-page.error .ub-layout.errorCon strong {float:left;display:inline-block;padding-left:8px;background:url(../images/common/ico_gray2.gif) no-repeat 0 5px;color:#6e6e6e;}
.ub-page.error .ub-layout.errorCon pre {float:left;margin:0;padding:0 0 0 7px;line-height:18px;font-size:12px;}

#errorMessage{display:none;}

/* Liquid Layout (row, column) */
.row {clear:both;}
.column {float:left;}
.right-column {float:right;}
.auto-column { margin:0 auto;}

.column > .row {clear:none;}
.right-column > .row {clear:none;}
.auto-column > .row {clear:none;}

/* [moara-frame] ********************************************************************************* */

.moara-frame.top {position:relative;width:100%;height:56px;background:#343a40;z-index:9999;}
.moara-frame.top h1 {position:absolute;top:8px;left:23px;margin:0;padding:0;font-size:1.8em}
.moara-frame.top h1 a {display:inline-block;width:125px;height:18px;background:url(../images/common/logo.png) no-repeat;}
.moara-frame.top .pure-menu-horizontal li {display:inline-block;width:100%;height:56px;}
.moara-frame.top .pure-menu #menu.pure-menu-children{width:100%;background: #343a40;/*margin-left:0px;margin-top:0px;*/}
.moara-frame.top .pure-menu .pure-menu-children{width:100%;background: #343a40;/*margin-left:250px;margin-top:-56px;*/}
.moara-frame.top .pure-menu .pure-menu-children a {font:bold 16px Pretendard,Gulim;color: #868e96;cursor:pointer;height:56px;line-height:24px;padding-top:16px;padding-bottom:16px;}
    
.moara-frame.top .gnb-util {position:absolute;top:0;right:0;z-index:2;}
.moara-frame.top .gnb-util li {position:relative;float:left;display:inline-block;z-index:1;font:normal 12px Pretendard,'����',Gulim,helvetica,arial,sans-serif;}
.moara-frame.top .gnb-util .user {height:55px;color:#fff;padding:15px 15px 12px 25px;background:url(../images/common/ico-user.png) no-repeat 0 15px;}
.moara-frame.top .gnb-util .user em {color:#fff;font-weight:bold;}
.moara-frame.top .gnb-util .date {color:#fff;padding:16px 15px 12px 0;}
.moara-frame.top .gnb-util a {position:relative;float:left;padding:13px 17px;text-decoration:none !important;border-left:1px #32363d solid;}
.moara-frame.top .gnb-util a.setting {background:url(../images/common/ico-setting.png) no-repeat 17px 13px;height:55px;width:49px;}
.moara-frame.top .gnb-util a.logout {background:url(../images/common/ico-logout.png) no-repeat 15px 15px;height:55px;width:49px;}
.moara-frame.top .gnb-util a.pwchange{background: url(../images/login/ico-pw.png) no-repeat 16px 16px; background-size:17px; height: 55px; width: 49px;}
.moara-frame.top .gnb-util a:hover {background-color:#353840;}

.moara-frame.moara-body {position:relative;padding:16px;min-width:1195px;overflow:auto;float:left;width:100%}
/* [ub-frame] ********************************************************************************* */

/* frame top */
/* 우리카드 해상도 스크롤 */
/* .ub-frame.top {position:fixed;width:100%;height:47px;background:#25282d;z-index:9999;} */
.ub-frame.top {position:relative;width:100%;height:47px;background:#25282d;z-index:9999;}
.ub-frame.top h1 {position:absolute;top:16px; left:67px;margin:0;padding:0;font-size:1.8em}
.ub-frame.top h1 a {display:inline-block;width:246px;height:30px;background:url(/page/moara/images/login/logo-mata-studio.png) no-repeat 0 0; }
.ub-frame.top .btn_back {display:inline-block; width:49px; height:58px; border-right:1px solid #5375c0;}
.ub-frame.top .btn_back a {display:inline-block; width:100%; height:58px; text-indent:-9999px; border-right:1px solid #2f63c5; background:#2f63c5 url('../images/common/gnb/ico_return.png') no-repeat 50% 50%;}

.ub-frame.top .pure-menu {background:none;position:absolute;top:0; right:244px;line-height:normal;white-space:nowrap;*zoom:1;}
/*.ub-frame.top .pure-menu.pure-menu-open {width:auto;min-width:100px;}*/
.ub-frame.top .pure-menu.pure-menu-open {width:auto;min-width:200px;}
.ub-frame.top .pure-menu a {border:0;}
.ub-frame.top .pure-menu-horizontal li {float:left;}
.ub-frame.top .pure-menu .pure-menu-children li a {color: #000;}
.ub-frame.top .pure-menu .pure-menu-children li:hover {background:#2f63c5; }
.ub-frame.top .pure-menu .pure-menu-children li a:hover {background:none; color: #fff;}
/*.ub-frame.top .pure-menu .pure-menu-children a {height:59px; padding:22px 41px;padding:22px 30px; font:bold 15px 'Pretendard',Gulim,helvetica,arial,sans-serif;color:#FFF;line-height:1;text-decoration:none !important;cursor:pointer;}*/
.ub-frame.top .pure-menu .pure-menu-children a {height:59px; padding:22px 30px; font:bold 15px 'Pretendard',Gulim,helvetica,arial,sans-serif;color:#FFF;line-height:1;text-decoration:none !important;cursor:pointer;}
.ub-frame.top .pure-menu .pure-menu-children a:hover {/* padding:22px 41px; */padding:22px 30px;}
.ub-frame.top .pure-menu .pure-menu-can-have-children > .pure-menu-label:after {content:none;}
.ub-frame.top .pure-menu .pure-menu-can-have-children ul {min-width:160px; border:1px solid #c1c1c1;-moz-box-shadow:1px 1px 2px 1px rgba(0,0,0,0.1);-webkit-box-shadow:1px 1px 2px 1px rgba(0,0,0,0.1);box-shadow:1px 1px 2px 1px rgba(0, 0, 0, 0.1);}
.ub-frame.top .pure-menu .pure-menu-can-have-children li {position:relative; width:100%;min-width:115px; padding:0;border-bottom:1px solid #e9e9e9;}
.ub-frame.top .pure-menu .pure-menu-can-have-children li:last-child {border-bottom:none;}
.ub-frame.top .pure-menu .pure-menu-can-have-children li:hover {border-right:0;border-left:0;margin:0;}
.ub-frame.top .pure-menu .pure-menu-can-have-children li:hover ul li a {color:#444;}
.ub-frame.top .pure-menu .pure-menu-can-have-children li.pure-menu-can-have-children a::after,
.ub-frame.top .pure-menu .pure-menu-can-have-children li.pure-menu-can-have-children:hover a::after {position:absolute; top:13px; right:9px; margin: 0; display:inline-block; content:' '; width:8px; height:8px;  background:url(../images/common/gnb/ico_plus_submenu.png) no-repeat 0 0;}
.ub-frame.top .pure-menu .pure-menu-can-have-children li a {height:auto;color:#444;font:bold 14px 'Pretendard',Gulim,helvetica,arial,sans-serif;border:0;padding:8px 30px 8px 15px;}
.ub-frame.top .pure-menu .pure-menu-can-have-children li a:hover {border:0;padding:8px 30px 8px 15px; background:none;}
.ub-frame.top .pure-menu .pure-menu-can-have-children li ul li:hover {background:#eee;}
.ub-frame.top .pure-menu .pure-menu-can-have-children li.pure-menu-can-have-children:hover ul li a::after {content:none;}

/* menu arrow */
/* .ub-frame.top div.pure-menu > ul.pure-menu-children > li.pure-menu-can-have-children:hover:before {content:'';display: block;width: 14px;height: 1px;position: absolute;left: 50%;bottom: -1px;margin-left: -10px;background:white;z-index:999;} */
.ub-frame.top div.pure-menu > ul.pure-menu-children > li.pure-menu-can-have-children:hover:before,
.ub-frame.top div.pure-menu > ul.pure-menu-children > li.pure-menu-can-have-children:hover:after  {content:none !important;}
/* .ub-frame.top div.pure-menu > ul.pure-menu-children > li.pure-menu-can-have-children:hover:after {content:'';display: block;width: 0;height: 0;position: absolute;left: 50%;bottom: 0;border-left: 7px solid transparent;border-right: 7px solid transparent;border-bottom: 7px solid white;margin-left: -10px;z-index:999;} */

.ub-frame.top .gnb-util {position:absolute;top:0;right:0; bottom:0; max-width:250px; padding-left:15px; padding-right:5px;   height: 59px; z-index:2; background:#585c65; border-bottom:1px solid #464a51;}
/*.ub-frame.top .gnb-util {position:absolute;top:0;right:0; bottom:0; max-width:245px; padding-left:15px; padding-right:5px;   height: 59px; z-index:2; background:#585c65; border-bottom:1px solid #464a51;}*/
.ub-frame.top .gnb-util li {position:relative;float:left;display:inline-block;z-index:1;font:normal 12px Pretendard,'����',Gulim,helvetica,arial,sans-serif;}
.ub-frame.top .gnb-util .user {height:59px;color:#fff; font-size:14px; padding:20px 15px 0 33px;background:url(../images/common/gnb/ico_user.png) no-repeat 3px 50%;}
.ub-frame.top .gnb-util .user em {text-overflow: ellipsis;overflow: hidden;white-space: nowrap;vertical-align: bottom;display: inline-block;width:55px;color:#72cbff;font-weight:bold; text-align: right;}
.ub-frame.top .gnb-util .date {color:#fff;padding:16px 15px 12px 0;}
.ub-frame.top .gnb-util a {position:relative;float:left;width:16px; height:59px; padding:13px 17px;text-decoration:none !important; background-repeat:no-repeat; background-position:50% 50%;}
.ub-frame.top .gnb-util a.portalOption {background-image:url(../images/common/gnb/ico_setting.png);}
.ub-frame.top .gnb-util a.portalLogout {background-image:url(../images/common/gnb/ico_logout.png);}
.ub-frame.top .gnb-util a.portalPwchange {background-image:url(../images/common/gnb/ico_pw.png);}
/* .ub-frame.top .gnb-util a:hover {background-color:#353840;} */

/* [body] */
.floatBox {position:relative;zoom:1;width:100%;float:left;}
.floatBox.totalContentsWrap {width:100%;}
.floatBox:after {content:".";display:block;height:0;clear:both;visibility:hidden;font-size:0;line-height:0}
.floatBox .leftBox {float:left;position:relative;}
.floatBox .rightBox {float:right;position:relative;}

.wrapOverflow {overflow-x:auto;}

/* frame body */
/* 우리카드 해상도 스크롤 */
/* .ub-frame.contents{padding-top:59px; background:#f1f1f1;} */
.ub-frame.contents{
	background:#fff;
}
.ub-frame.moara-body {position:relative;padding:22px 20px 0;min-width:1195px;float:left;width:100%}
.ub-frame.moara-body .layout-wrapper {width:100%;min-width:1145px;float:left}
.ub-frame.moara-body .nav-bar {float:left;width:100%;height:57px;border-top:1px solid #dedede;border-bottom:1px solid #c4c4c4;background:#f0f0f0;background: -webkit-linear-gradient(#f0f0f0, #f5f5f5);background: -o-linear-gradient(#f0f0f0, #f5f5f5);background: -moz-linear-gradient(#f0f0f0, #f5f5f5);background: linear-gradient(#f0f0f0, #f5f5f5);}
.ub-frame.moara-body h2 {position:relative;width:100%;height:30px;line-height:1.2em; background-repeat:no-repeat; background-position:0 3px;}
.ub-frame.moara-body h2 span.tit {font:bold 15px Pretendard,'����',Gulim,helvetica,arial,sans-serif;color:#333;margin-left:12px;}
.ub-frame.moara-body .tab-tb h3 {font-size:13px;display:inline-block;margin:15px auto 10px;line-height:1.2em}
h2.ub-control.title::before, 
h3.ub-control.title::before {content:none !important;}
.ub-frame.moara-body .tab-tb h4 {font:bold 12px Pretendard,'����',Gulim,helvetica,arial,sans-serif;color:#25282d;margin-bottom:5px;display:inline-block;}
.ub-frame.moara-body #body-contents-wrap{float:left;width:100%}
.ub-frame.moara-body #container-wrap {position:relative;width:100%;min-width:1145px;padding:0;float:left}
.ub-frame.moara-body #snb {position:relative;width:300px;height:100%; margin-right:17px;border-radius:7px;}
.ub-frame.moara-body #snb form, .ub-frame.moara-body #snb .ui-accordion{width:100%;height:100%;}
.ub-frame.moara-body #snb .ui-accordion { border:1px solid #c3c4c7;   background:#fff;overflow: hidden;}
.ui-accordion .ui-accordion-content {border-bottom:1px solid #c3c4c7;}
.ub-frame.moara-body #snb.noSplit{margin-right:10px}
.ub-frame.moara-body #contents .side{width:280px;margin-right:12px}
.ub-frame.moara-body #contents .ub-layout.rightBox{float:none;overflow-x:hidden;}
.ub-frame.moara-body #arrow-wrapper {width:15px;margin:0;}
.ub-frame.moara-body #aside {width:200px;padding:0px;}
.ub-frame.moara-body #inner_contents{ 
	height:100%; 
	min-height:810px;  
	margin-bottom:20px; 
	background-color:#fff;
	border-radius:7px;
	float:none;
	/* border: 1px solid #c3c4c7; */
	overflow:hidden;
}
/*.ub-frame.moara-body #inner_contents{ height:100%; min-height:765px;  margin-bottom:20px; background-color:#fff;border-radius:7px;float:none;border: 1px solid #c3c4c7;overflow:hidden;}*/
.ub-frame.moara-body .no-data {background:#fff url(../images/common/bg_no-data.png) no-repeat 50% 50% !important;}
.ub-page.popup{background:#e9eef2;}

/* 공통 그리드/텝 스타일 */
/* .ub-layout.list .ui-widget-content {border:0 !important;} */
/* .ui-jqgrid .ui-jqgrid-bdiv {border-left:1px solid #c3c4c7;border-right:1px solid #c3c4c7;border-bottom:1px solid #c3c4c7;} */
/* .ui-jqgrid .ui-jqgrid-htable th {height:29px !important;} */
/* .ui-jqgrid .ui-jqgrid-htable th div {color:#fff; font-weight:bold !important;} */
/* .ui-jqgrid .ui-jqgrid-htable .ui-jqgrid-labels th div {margin:0 2px;} */
/* .ui-jqgrid .s-ico > .ui-icon.ui-sort-ltr {margin-left:3px;} */
.tab,
#container-wrap .tab li a,
.intab li a {background:#f6f6f6 !important;}
#container-wrap .tab li.on a,
.intab li.on a {border-bottom: 0 !important; background:#fff !important;}
#innerTab {overflow:hidden;}


/* frame footer */
.ub-frame.moara-footer {float:left;width:100%;min-width:1195px;margin:15px 0;text-align:center;color:#FFF;font-family:'Open Sans',sans-serif;font-weight:400;font-size:11px;}

/* [ub-page] ********************************************************************************* */

/* body.ub-page.default {position:relative;padding:10px;margin-top:15px; margin-bottom:15px; min-width:1195px;overflow:auto !important;float:left;width:100%;} */
body.ub-page.default {position:relative;padding:10px;margin-top:15px; margin-bottom:15px; min-width:1195px;float:left;width:100%;}
body.ub-page.default.list .ub-frame.body, 
body.ub-page.default.register .ub-frame.body,
body.ub-page.default.detail .ub-frame.body {min-height:630px; max-height:850px;}

body.ub-page.tab {border-bottom:0;background:#fff;}
.ub-page.tab .ub-frame.body {margin-top:0}
.ub-page.default .ub-frame.body {position:relative;  border:1px solid #c3c4c7;  float:left;width:100%;background:#fff;min-width:1145px;border-radius:7px;padding:20px; overflow-x:hidden; overflow-y:auto;}
/*.ub-page.default .ub-frame.body {position:relative;  border:1px solid #c3c4c7;  float:left;width:100%;background:#fff;min-width:1145px;border-radius:7px;padding:20px; overflow-x:hidden; overflow-y:hidden;}*/
.ub-frame.body h1.ub-control.title {background:none;font:bold 15px Pretendard,'����',Gulim,helvetica,arial,sans-serif;color:#333;margin:0 0 15px;padding:0;height:30px;border-bottom:1px solid #ddd;}
.ub-frame.body h2.ub-control.title {border-bottom:none;color:#3a3a3a;padding:7px 0;font:bold 13px Pretendard,'����',Gulim,helvetica,arial,sans-serif;display:inline-block;}
.ub-frame.body .details{margin-bottom:10px}

.moara-frame.moara-body .breadcrumb{display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; padding: .75rem 1rem; list-style: none; background-color: #377CA8;border-radius: .25rem;}
.moara-frame.moara-body .breadcrumb .breadcrumb-item a{font: 16px Pretendard,Gulim;color: white;text-decoration: none;background-color: transparent;-webkit-text-decoration-skip: objects;}

.moara-frame.moara-body .card{
	position: relative;
    display: -ms-flexbox;
    display: inline-flex;
    -ms-flex-direction: column;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border: 1px solid rgba(0,0,0,.125);
    border-radius: .25rem;
	margin-top: 1rem;
}
.moara-frame.moara-body .card-header:first-child {
    border-radius: calc(.25rem - 1px) calc(.25rem - 1px) 0 0;
}
.moara-frame.moara-body .card-header{
	padding: .75rem 1.25rem;
    margin-bottom: 0;
    background-color: rgba(0,0,0,.03);
    border-bottom: 1px solid rgba(0,0,0,.125);
}
.moara-frame.moara-body .card-header .headTitle{/*font-weight: bold;*/font-size: 12px;}
.moara-frame.moara-body .card-body{
    flex: 1 1 auto;
    padding: 1.25rem;
}    
.moara-frame.moara-body .card-footer {
    padding: .75rem 1.25rem;
    background-color: rgba(0,0,0,.03);
    border-top: 1px solid rgba(0,0,0,.125);
}