@charset "utf-8";
:root{
	--base_bgColor_return: #3d407f;
	--base_color: #ffffff;
	--base_color_on: #ffffff;
	--base_color_reverse: #c2bf80;
	--base_bgColor: #3d407f;
	--base_bgColor_up: #676cd7;
	--base_bgColor_down: #495057;
	--base_bgColor_o01: rgba(61, 64, 127, 0.1);
	--base_bgColor_o03: rgb(196 197 216);
	--base_bgColor_reverse: #c2bf80;
	--base_bgColor_reverse_up: #ffffd9;
	--base_bgColor_reverse_down: #878559;
	--base_bgcolor_down: #2a2c58;
}

@font-face {
	font-family: 'Pretendard';
	src: url(../assets/fonts/default/PretendardGOV-Regular.woff) format('woff');
	font-weight: 400;
	font-style: normal;
}

@font-face {
	font-family: 'Pretendard';
	src: url(../assets/fonts/default/PretendardGOV-Medium.woff) format('woff');
	font-weight: 500;
	font-style: normal;
}

@font-face {
	font-family: 'Pretendard';
	src: url(../assets/fonts/default/PretendardGOV-SemiBold.woff) format('woff');
	font-weight: 600;
	font-style: normal;
}

@font-face {
	font-family: 'Pretendard';
	src: url(../assets/fonts/default/PretendardGOV-Bold.woff) format('woff');
	font-weight: 700;
	font-style: normal;
}

@font-face {
	font-family: 'NotoSansKR-Regular';
	src: url(../assets/fonts/default/NotoSansKR-Regular.ttf) format('truetype');
	font-weight: 400;
	font-style: normal;
}

* {
	font-family: 'Pretendard', 'NotoSansKR-Regular', sans-serif !important;
}

/* Main */

body { overflow:hidden; }
h1 {display:block; float:left; margin-top:10px; margin-left:15px; height:29px}
select { height: 19px; vertical-align:middle; }

#popupbody {background:none; overflow:hidden}
#wrap {}
#wrap:after { content:""; clear:both; display:block}
#header_area { height:71px; background:var(--base_bgColor); zoom:1}
#header_area:after { content:""; clear:both; display:block}

.header_gnb {float:right; margin-top:10px}
.user_info {float:left; margin-top:7px; font-size:0}
.user_info img{vertical-align:bottom; margin-bottom:1px}
.info {color:#555555; font-weight:bold; font-size:11px; display:inline-block; padding-right:5px; letter-spacing:-1px}
.info strong {color:#ff6700; font-weight:bold}
.user_info .info {color:var(--base_color); font-weight:bold; font-size:11px; display:inline-block; padding-right:5px; letter-spacing:-1px}
.user_info .info strong {color:var(--base_color_reverse); font-weight:bold}

.tgnb li input[type=button]{background-color:var(--base_bgColor_up);padding:1px 5px;border:1px solid var(--base_bgColor_o03);cursor:pointer;color:var(--base_color);border-radius:10px;}
.tgnb li input[type=button].imgBtn{background-repeat:no-repeat;background-position: 52px;background-size:12px; padding-right:20px}
.tgnb li input[type=color]{-webkit-appearance: none; -moz-appearance: none; appearance: none; background-color: transparent; border: 1px solid var(--base_color); border-radius:10px }
.tgnb li input[type=color]::-webkit-color-swatch { border-radius: 30px; border: none }
.tgnb li select{border-radius:10px; text-align-last: center;border:1px solid var(--base_bgColor_o03)}

.tgnb {float:left; margin-top:8px; font-size:11px; margin-right:10px; margin-left: 10px;}
/* .tgnb li {float:left; background:url(../images/contents/login_gnbbar.gif) no-repeat right 3px; padding:0 7px; *background:url(../images/contents/login_gnbbar.gif) no-repeat right 4px; font-weight:bold} */
.tgnb li {float:left;padding:0 7px; font-weight:bold}
.tgnb li:last-child{background:none}
.tgnb li.bgnone{background:none}
.link{float:left; margin-top:3px}
.link li{float:left}

/* Menu */
/* #gnb {clear:both; width:100%; height:29px; background:url(../images/common/main_gnbbar.gif) repeat-x;}
#gnb ol li.gnb1Depth    {float:left; background:url(/resources/images/common/main_gnbbar.gif) no-repeat right top}
#gnb ol li.gnb1Depth:last-child {background-image:none}
#gnb ol li.gnb1Depth a.gnb1DepthAnchor {display:inline-block; overflow:hidden; color:#FFF; font-weight:bold; text-align:center; padding:6px 0 6px 0; width:126px; font-family:Gulim}
#gnb ol li.gnb1Depth a.gnb1DepthAnchor.on {color:#FFF; background:url(../images/common/main_gnbbar_hover.gif) repeat-x}
#gnb ol li.gnb1Depth a.gnb1DepthAnchor.off {color:#FFF;}
#gnb ol li.gnb1Depth a.gnb1DepthAnchor:hover {color:#fff; background:url(../images/common/main_gnbbar_hover.gif) repeat-x} */

#gnb {clear:both; width:100%; height:29px; background:var(--base_bgColor)}
#gnb ol li.gnb1Depth    {float:left;border-top-left-radius:10px;border-top-right-radius:10px;}
#gnb ol li.gnb1Depth a.gnb1DepthAnchor {display:inline-block; overflow:hidden; color:var(--base_color); font-weight:bold; text-align:center; padding:6px 0 6px 0; width:126px; font-family:Gulim; background:var(--base_bgColor);border-top-left-radius:10px;border-top-right-radius:10px;}
#gnb ol li.gnb1Depth a.gnb1DepthAnchor.on {color:var(--base_color_on); background:var(--base_bgColor_up);border-top-left-radius:10px;border-top-right-radius:10px;}
#gnb ol li.gnb1Depth a.gnb1DepthAnchor.off {color:var(--base_color);border-top-left-radius:10px;border-top-right-radius:10px;}
#gnb ol li.gnb1Depth a.gnb1DepthAnchor:hover {color:var(--base_color); background:var(--base_bgColor_up);border-top-left-radius:10px;border-top-right-radius:10px;}

#container{clear:both; overflow:hidden}

#leftMenu {position:relative}
/* #leftMenu h2 {height:34px; background:url(../images/common/leftmenu_h2back.gif) repeat-x left top; padding:12px 0 0 15px; font-size:15px; font-family:tahoma; color:#252157; font-weight:bold} */
#leftMenu h2 {height:34px; background:var(--base_bgColor_down); padding:12px 0 0 15px; font-size:15px; font-family:tahoma; color:var(--base_color_on); font-weight:bold}

/* Vertical Navigation */
/* .vNav{ position:relative; margin-top:-1px}
.vNav ul{ margin:0; padding:0; font-size:0}
.vNav li{ position:relative; background:url(../images/common/leftmenu_h3back.gif) repeat-x left top; *zoom:1; width:100%}
.vNav li a { background:url(../images/common/ico_h3_close.gif) no-repeat 12px 10px; display:block; color:#222222; font-weight:bold; font-size:11px; padding:7px 0 0 25px; height:25px; position:relative; *zoom:1;}
.vNav li a span { font-family:tahoma}
.vNav li li {margin-left:0px}
.vNav li li a{background:#fff} */

/* .vNav li li a:hover{background:#f1f1f1} */
/* .vNav li li a span{background:url(../images/common/ico_h4.gif) no-repeat left 4px; font-weight:normal; color:#555; height:19px; padding:0 0 0 7px}
.vNav li li.active{}
.vNav li.active a{ color:#0f8983; border:0}
.vNav li.active .i{ background:url(../images/common/ico_h3_open.gif) no-repeat 12px 10px; }
.vNav li.active li a{ border-bottom:1px solid #f3f3f3; font-size:11px; height:19px; color:#676767}
.vNav li.active li.active a span{ background:url(../images/common/ico_h4_over.gif) no-repeat left 4px; font-size:11px; height:19px; color:#0f8983; font-weight:bold; padding:0 0 0 7px} */

.vNav{ position:relative; margin-top:-1px}
.vNav ul{ margin:0; padding:0; font-size:0}
.vNav li{ position:relative; background:var(--base_bgColor_up); width:100%}
.vNav li a { display:block; color:var(--base_color); font-weight:bold; font-size:11px; padding:7px 0 0 25px; height:25px; position:relative;}
.vNav li a:hover{background:var(--base_bgColor)}
.vNav li a span { font-family:tahoma}
.vNav li li {margin-left:0px}
.vNav li li a {background:#fff}
.vNav li li a:hover{background:#efefef}
.vNav li li a span{ font-weight:normal; color:#555; height:19px; padding:0 0 0 7px}
.vNav li.active {background:var(--base_bgColor)}
.vNav li.active a{ color:var(--base_color_reverse); border:0; }
.vNav li.active li a{ border-bottom:1px solid #f3f3f3; font-size:11px; height:19px; color:#676767}
.vNav li.active li.active a span{ font-size:11px; height:19px; color:var(--base_bgColor_down); font-weight:bold; padding:0 0 0 7px}


.use-sidebar #content {/* left: 1px */}
.use-sidebar #left {display: block}
.use-sidebar .separator {position:fixed; top:50%; left: 198px; width:14px; height:44px; z-index:999; background-image:url(../images/common/calbg.gif)}

/* #left {position: fixed; top: 1px; width:195px; left: 2px; bottom: 2px; background: #ebedef; border:1px solid #d5d5d5; display: none; overflow-y:auto; overflow-x:hidden} */
#left {position: fixed; top: 0px; width:100%; left: 0px; bottom: 0px; background:#ffffff; border:0px; display: none; overflow-y:auto; overflow-x:hidden}
/*.separator {position:fixed; top:50%; left: 0; width:14px;height:44px; z-index:999;  background-image:url(../images/common/calbg_r.gif)}*/
#content {position: fixed; top: 0px; left: 0px; right: 0px; bottom: 0px; overflow-y:auto; overflow-x:hidden; border:0px; padding:10px 15px; background:#fff; border-left: 1px solid #dee2e6; border-bottom: 1px solid #dee2e6; border-right: 1px solid #dee2e6;}
#popcontent {overflow-y:auto; overflow-x:hidden; padding:0 10px 10px 10px}

/* 컨텐츠 */
.titlearea{display:inline-block; width:100%; margin:6px 0 0 0}
.contitle {float:left}
.contitle h2 {font-size:14px; font-family:verdana, dotum; font-weight:bold; color:#282828; background:url(../images/common/ico_h2title.gif) no-repeat left 4px; padding:0 0 0 16px}

.subtitlearea {margin:0}
.subtitle h3 {color:#282828; font-size:12px; background:url(../images/common/ico_searchtitle.gif) no-repeat 4px 3px; padding:0 0 0 15px; line-height:16px; font-weight:bold; vertical-align:bottom}
.subtitle h3 span {color:#282828; text-decoration:none}

.clienttitle {display:inline-block}
.clienttitle h3 {color:#282828; font-size:12px; background:url(../images/common/ico_searchtitle.gif) no-repeat 4px 1px; padding:0 0 0 11px; line-height:16px; font-weight:bold; vertical-align:bottom; cursor:pointer}
.clienttitle h3 span {color:#282828; text-decoration:none}

.subtitle2 h4 {color:blue; font-size:11px; padding:0 0 5px 3px; line-height:16px; font-weight:bold; letter-spacing:-1px}
.subtitle2 h4 span {color:blue; text-decoration:none}

.fold {background:url(../images/button/btn_fold.gif) no-repeat right 0; padding-right:28px !important}
.expand {background:url(../images/button/btn_expand.gif) no-repeat right 0; padding-right:28px !important}

/* button */
.trbtn {text-align:right; margin-top:-15px; font-size:0}
.trbtn2 {text-align:right; margin-top:-24px; font-size:0}
a.rbtn {display:inline-block; vertical-align:top; background:url(../images/button/btn_img.gif) no-repeat left top; height:24px; padding-left:15px}
a.rbtn span {display:inline-block; background:url(../images/button/btn_img.gif) no-repeat right top; height:24px; line-height:22px; padding:2px 15px 0 0; _padding-top:2px; color:#f1f7ff; font-size:11px; font-weight:bold; letter-spacing:-1px}
a.ebtn {display:inline-block; vertical-align:top; background:url(../images/button/btn_img.gif) no-repeat left top; height:20px; padding-left:10px}
a.ebtn span {display:inline-block; background:url(../images/button/btn_img.gif) no-repeat right top; height:20px; line-height:18px; padding:0px 10px 0 0; _padding-top:2px; color:#f1f7ff; font-size:11px; font-weight:bold; letter-spacing:-1px}
a.rbtn:hover{background-position:left -28px}
a.rbtn:hover span{background-position:right -28px}


a.prbtn {display:inline-block; vertical-align:top; background:url(../images/button/btn_img2.gif) no-repeat left top; height:24px; padding-left:15px}
a.prbtn span {display:inline-block; background:url(../images/button/btn_img2.gif) no-repeat right top; height:24px; line-height:22px; padding:2px 15px 0 0; _padding-top:2px; color:#f1f7ff; font-size:11px; font-weight:bold; letter-spacing:-1px}
a.prbtn:hover{background-position:left -28px}
a.prbtn:hover span{background-position:right -28px}

a.frbtn {display:inline-block; vertical-align:top; background:url(../images/button/btn_img3.gif) no-repeat left top; height:24px; padding-left:15px}
a.frbtn span {display:inline-block; background:url(../images/button/btn_img3.gif) no-repeat right top; height:24px; line-height:22px; padding:0px 15px 0 0; _padding-top:2px; color:#f1f7ff; font-size:11px; font-weight:bold; letter-spacing:-1px}
a.frbtn:hover{background-position:left -28px}
a.frbtn:hover span{background-position:right -28px}

.inbtn{margin-left:2px;padding:3px 7px 3px 7px;background:#cbd3f7;color:#244695;border:1px solid #6882bd; font-weight:bold; font-size:9px;cursor:pointer}
.inbtn:hover{background:#efd2df; border:1px solid #c55478; color:#a90b3e}

a.btn_addrow {display:inline-block; vertical-align:top; background:url(../images/button/btn_rowaction.gif) no-repeat left top; height:19px; padding-left:20px}
a.btn_addrow span {display:inline-block; vertical-align:top; background:url(../images/button/btn_rowaction.gif) no-repeat right top; height:19px; padding:0 9px 0 0;color:#fff; font-size:11px; font-weight:bold; line-height:19px; }
a.btn_delrow {display:inline-block; vertical-align:top; background:url(../images/button/btn_rowaction.gif) no-repeat left -19px; height:19px; padding-left:20px; }
a.btn_delrow span {display:inline-block; vertical-align:top; background:url(../images/button/btn_rowaction.gif) no-repeat right -19px; height:19px; padding:0 9px 0 0;color:#fff; font-size:11px; font-weight:bold; line-height:19px; }
a.btn_td {display:inline-block; vertical-align:top; background:url(../images/button/btn_rowaction.gif) no-repeat left -38px; height:19px; padding-left:9px}
a.btn_td span {display:inline-block; vertical-align:top; background:url(../images/button/btn_rowaction.gif) no-repeat right -38px; height:19px; color:#fff; padding-right: 9px; font-size:11px; font-weight:bold; line-height:19px; }

.btn_intab {margin:2px; display:block; float:right; position:relative; top: -27px; margin-right:5px; margin-bottom:-10px;}

/* 20140922 */
/* .btn_file {position: relative; display:inline-block;  vertical-align:top; overflow:hidden; background:url(../images/button/btn_img_file.gif) no-repeat left top; height:19px;width: 66px; text-align:center;font-size:11px; color:#f1f7ff; font-weight:bold; padding-top:5px;} */

.btn_file {position: relative; display:inline-block;  vertical-align:top; overflow:hidden;width:66px; text-align:center;font-size:11px; color:#f1f7ff; font-weight:bold; padding-top:5px;border:1px solid var(--base_bgColor_down);background-color:var(--base_bgColor);color:var(--base_color);border-radius:50px;background-repeat:no-repeat;background-position:left 5px top 3px;margin-left:4px;cursor:pointer}
.btn_file input {position: absolute; filter:alpha(opacity=0);opacity:0; -moz-opacity:0; cursor: pointer; top:0; right: 0; width:63px; font-size:11px;font-weight:bold;letter-spacing:0.1px; border:0;cursor:pointer}
.btn_file.imgBtnf{background-repeat:no-repeat;background-position:left 10px top 6px;background-size:12px; padding-left:10px;}
.btn_file.upload{background-image:url('/resources/images/common/cu-icon-util-upload-b.png');}
.btn_file label{cursor:pointer}
/* .btn_file:hover{background:url(../images/button/btn_img_file.gif) no-repeat left -28px;} */



.trbtn input[type=button]{font-size:11px;font-weight:bold;letter-spacing:0.1px;padding:5px 15px 5px 15px;border:1px solid var(--base_bgColor_down);background-color:var(--base_bgColor);color:var(--base_color);height:24px;border-radius:50px;margin-left:4px;cursor:pointer;}
.trbtn input[type=button]:hover{background:var(--base_bgColor_down);border-width:2px;}
.trbtn input[type=button].imgBtn{background-repeat:no-repeat;background-position:right 10px top 5px;background-size:12px; padding-right:30px;}
.trbtn input[type=button].imgBtnf{background-repeat:no-repeat;background-position:left 10px top 5px;background-size:12px; padding-left:30px;}

input[type=button].ibtn{font-size:11px;font-weight:bold;letter-spacing:0.1px;padding:2px 10px 2px 10px;border:1px solid var(--base_bgColor);background-color:var(--base_bgColor_up);color:var(--base_color);height:20px;border-radius:10px;margin-left:2px;cursor:pointer;}
input[type=button].ibtn:hover{background-color:var(--base_bgColor);border-width:2px;}
input[type=button].revs{background-color:var(--base_bgColor_reverse_down);border:1px solid var(--base_bgColor_reverse);}
input[type=button].revs:hover{background-color:var(--base_bgColor_reverse);border-width:2px;}
input[type=button].ibtn.imgBtn{background-repeat:no-repeat;background-position:right 5px top 3px;background-size:12px; padding-right:25px;}
input[type=button].ibtn.imgBtnf{background-repeat:no-repeat;background-position:left 5px top 3px;background-size:12px; padding-left:25px;}

/* Image Button 추가 CSS ---
   Image는 16px * 16px 로 파일 저장시 검정색은 -b 하얀색은 -w로 추가 함. (toggle시 사용)
*/
input[type=button].del{background-image:url('/resources/images/common/cu-icon-util-del-b.png');}
input[type=button].add{background-image:url('/resources/images/common/cu-icon-util-add-b.png');}
input[type=button].save{background-image:url('/resources/images/common/cu-icon-util-save-b.png');}
input[type=button].logout{background-image:url('/resources/images/common/cu-icon-util-logout-b.png');}
input[type=button]._schBtn{background-image:url('/resources/images/common/cu-icon-util-search-b.png');}
input[type=button].excel{background-image:url('/resources/images/common/cu-icon-util-excel-b.png');}
input[type=button].if{background-image:url('/resources/images/common/cu-icon-util-if-b.png');}
input[type=button].down{background-image:url('/resources/images/common/cu-icon-util-down-b.png');}
input[type=button].upload{background-image:url('/resources/images/common/cu-icon-util-upload-b.png');}
input[type=button].close{background-image:url('/resources/images/common/cu-icon-util-close-b.png');}
input[type=button].chk{background-image:url('/resources/images/common/cu-icon-util-chk-b.png');}





/* tab menu */
/* .tab_menu {	clear: both; width:100%;background:url(../images/common/tab_bg.gif) repeat-x; height:31px; border-left: 1px solid #bfe0df; border-right: 1px solid #bfe0df;}
.tab_menu ul { list-style:none; }
.tab_menu li { display:block; float: left; }
.tab_menu li a { position: relative; display:block; }
.tab_active { display:inline-block; background:url(../images/button/tab_img.gif) no-repeat left top; height:31px; padding-left:30px; }
.tab_active span {display:inline-block; background:url(../images/button/tab_img.gif) no-repeat right top; height:20px; padding:11px 30px 0 0; color:#333333; font-size:11px; font-weight:bold;}
a.tab_anchor {display:inline-block; background:url(../images/button/tab_img.gif) no-repeat left -31px; height:31px; padding-left:30px}
a.tab_anchor span {display:inline-block; background:url(../images/button/tab_img.gif) no-repeat right -31px; height:20px; padding:11px 30px 0 0; color:#87a3a5; font-size:11px; font-weight:bold;}
a.tab_anchor:hover { color:#6b8082 }
a.tab_anchor:hover span { color:#6b8082 } */

.tab_menu {	clear: both; width:100%;background:var(--base_bgColor_o01); height:31px; border: 1px 1px 0px 1px solid var(--base_bgColor_o01);padding:5px 0 0px 0;border-top-left-radius:5px;border-top-right-radius:5px;}
.tab_menu ul { list-style:none; }
.tab_menu li { display:block; float: left; }
.tab_menu li a { position: relative; display:block; }
.tab_active { display:inline-block; background:#fff; height:31px;border-top-left-radius:5px;border-top-right-radius:5px;}
.tab_active span {display:inline-block; background:#fff; height:20px; padding:11px 30px 0 30px; color:#000; font-size:11px; font-weight:bold;border-top-left-radius:5px;border-top-right-radius:5px;}
a.tab_anchor {display:inline-block; background:var(--base_bgColor_o01); height:31px;border-top-left-radius:5px;border-top-right-radius:5px;}
a.tab_anchor span {display:inline-block; background:var(--base_bgColor_o01); height:20px; padding:11px 30px 0 30px; color:var(--base_bgColor); font-size:11px; font-weight:bold;border-top-left-radius:5px;border-top-right-radius:5px;}
a.tab_anchor:hover { color:var(--base_bgColor_up);border-top-left-radius:5px;border-top-right-radius:5px}
a.tab_anchor:hover span { color:var(--base_bgColor_up);border-top-left-radius:5px;border-top-right-radius:5px;}


/* search div */
.search {clear:both; width: 100%; display:inline-block; font-size:0.875rem}
.search table {width: 100%; border-collapse: collapse; border-spacing: 0; border:1px solid var(--base_bgColor_o01)}
.search th {background:var(--base_bgColor_o01); border-top:1px solid var(--base_bgColor_o03);border-bottom:1px solid var(--base_bgColor_o03); color:#3c4b49; text-align:left; padding:3px 8px; line-height:14px; font-family:"맑은 고딕", tahoma, "돋움", dotum}
.search th.right_panel {background:#d8dde9; border:1px solid #9fadc9; color:#3c4b49; text-align:left; padding:3px 8px; line-height:14px; font-family:"맑은 고딕", tahoma, "돋움", dotum}
.search th.c {text-align:center}
.search th.r {text-align:right}
.search th.l {text-align:left}
.search th.t {vertical-align:top}
.search th.b {vertical-align:bottom}
.serach th.m {vertical-align:middle}
.search th.pt10 {padding-top:10px}
.search td.br0 {border-right:none}
.search td.bl0 {border-left:none}
.search td.bt0 {border-top:none}
.search td.bb0 {border-bottom:none}
.search td.pl0 {padding-left:0}
.search td.pr0 {padding-right:0}
.search td {border-top:1px solid var(--base_bgColor_o03);border-bottom:1px solid var(--base_bgColor_o03); padding:3px 8px; line-height:16px; font-family:"맑은 고딕", tahoma, "돋움", dotum}
.search td span {display:block; margin:0 8px 0 0}
.search td span input {margin-right:-2px; font-size:11px}
.search td span select {margin-right:-2px; font-size:11px}
.search td select {margin-right:-2px; font-size:11px}
.search td input {margin-right:-2px; font-size:11px}
.search td span textarea {font-size:11px}
.search td table.intable {border:none}
.search td table.intable th {border:none; text-align:right; background:none; letter-spacing:-1px}
.search td table.intable td {border:none}
.search td img{vertical-align:bottom}
.search table table {border:1px solid #d6d6d6; margin:3px 0}
.search table table th {border:1px solid #d6d6d6; padding:2px 2px; background:#f2f2f2; font-weight:bold; text-align:right; color:#6f6f6f}
.search table table td {border:1px solid #d6d6d6; padding:2px 2px}
.search table table input{margin-right:-2px; font-size:11px; border:1px solid #c8c8c8; height:17px }
.search td.dr {text-align:right; border-right:0px}
.search td.dl { border-left:0px}
.search td[rowspan]{border-right:1px solid var(--base_bgColor_o03);}
.h19 {height: 19px;}

input.calendar{background:url(../images/button/btn_calender.gif) no-repeat right 2px; font-size:11px; cursor:pointer; text-align:center; padding-right:18px}
input.calendar:hover{background:url(../images/button/btn_calender.gif) no-repeat right 2px; font-size:11px; text-align:center; padding-right:18px}
input.numeric {text-align:right}
input.c {text-align:center}
input.p {text-align:right; width:50px; margin-right:3px}
input.cb {text-align:center; font-size:8pt; font-weight:bold; width:30px; }

span.att {background:url(../images/common/ico_att.gif) no-repeat left 2px; padding:0 0 0 10px; font-family:tahoma, "돋움", dotum; font-size:11px}

/* 그리드용 attation */
span.gatt {background:url(../images/common/ico_att.gif) no-repeat left 2px; padding:0 0 0 10px; font-family:tahoma, "돋움", dotum; font-size:11px}
span.ged {color:blue}



.view {clear:both; width: 100%; display:inline-block; font-size:11px}
.view table {width: 100%; border-collapse: collapse; border-spacing: 0; border:1px solid #cfdfdf}
.view th {background:#e6f1f1; border:1px solid #cfdfdf; color:#3c4b49; text-align:center; padding:3px 8px; line-height:14px}
.view td {border:1px solid #cfdfdf; padding:3px 8px; line-height:14px}
.input td img{vertical-align:bottom}

.btn_paging_first { background:url(../images/button/btn_paging_first.gif) no-repeat; width: 16px; height: 16px; margin: 0 1px;  border:none; cursor : pointer; }
.btn_paging_end { background:url(../images/button/btn_paging_end.gif) no-repeat; width: 16px; height: 16px; margin: 0 1px ; border:none; cursor : pointer;}
.btn_paging_prev { background:url(../images/button/btn_paging_prev.gif) no-repeat; width: 16px; height: 16px; margin: 0 1px; border:none; cursor : pointer;}
.btn_paging_next { background:url(../images/button/btn_paging_next.gif) no-repeat; width: 16px; height: 16px; margin: 0 1px; border:none; cursor : pointer;}

a.btn_pagingl {display:inline-block; background:url(../images/button/btn_pagingl.gif) no-repeat; width:19px; height:20px; vertical-align:middle}
a.btn_pagingr {display:inline-block; background:url(../images/button/btn_pagingr.gif) no-repeat; width:19px; height:20px; vertical-align:middle}
a.btn_pagingfl {display:inline-block; background:url(../images/button/btn_pagingfl.gif) no-repeat; width:19px; height:20px; vertical-align:middle}
a.btn_pagingfr {display:inline-block; background:url(../images/button/btn_pagingfr.gif) no-repeat; width:19px; height:20px; vertical-align:middle}

.paging .total {display:inline; padding:0 0 0 8px; background:url(../images/button/ico_pagingl.gif) no-repeat left 2px}
.paging .totalr {display:inline; background:url(../images/button/ico_pagingr.gif) no-repeat right 2px; padding:0 6px 0 0}

/* function popup */
.function_pop {background:#eee; border:1px solid #3f6087; padding:0 0 5px 0; width:200px; position:absolute; right:11px; top:44px; display:none;z-index:5}
.function_pop p {background:#294264; font-family:verdana, "돋움", dotum; font-size:11px; padding:4px 5px 4px 12px; color:white; font-weight:bold}
.function_pop p img {float:right; padding-top:2px; position:absolute; right:2px; top:5px}
.function_pop ul {padding:4px 5px}
.function_pop li {border-bottom:1px solid #dfdfdf; height:18px; padding-top:3px}
.function_pop li a {background:url(../images/common/ico_arrow.gif) no-repeat 7px 5px; padding:0 0 0 13px; color:#414142; font-size:11px; font-family:verdana, "돋움", dotum; letter-spacing:-1px; font-weight:bold; display:block}
.function_pop li a:hover{background:url(../images/common/ico_arrow_over.gif) no-repeat 7px 5px; padding:0 0 0 13px; color:#c10b0b; text-decoration:underline}

/* function popup */
.function_pop2 {background:#eee; border:1px solid #3f6087; padding:0 0 5px 0; width:200px; position:absolute; right:11px; top:271px; display:none}
.function_pop2 p {background:#294264; font-family:verdana, "돋움", dotum; font-size:11px; padding:4px 5px 4px 12px; color:white; font-weight:bold}
.function_pop2 p img {float:right; padding-top:2px; position:absolute; right:2px; top:5px}
.function_pop2 ul {padding:4px 5px}
.function_pop2 li {border-bottom:1px solid #dfdfdf; height:18px; padding-top:3px}
.function_pop2 li a {background:url(../images/common/ico_arrow.gif) no-repeat 7px 5px; padding:0 0 0 13px; color:#414142; font-size:11px; font-family:verdana, "돋움", dotum; letter-spacing:-1px; font-weight:bold; display:block}
.function_pop2 li a:hover{background:url(../images/common/ico_arrow_over.gif) no-repeat 7px 5px; padding:0 0 0 13px; color:#c10b0b; text-decoration:underline}

[id^=pageNavi] {padding-bottom:5px}
[id^=dataGrid] {margin-top:4px}


/* rignt panel */
.panel_show {width:25%; position:absolute; right:0; top:0;}
.panel_hide {width:0%;display:none; position:absolute; right:0; top:0;}
#right_panel {height: 100%; z-index:1; background-color:#f7f7f7; border:1px solid #b5b7ba; padding:7px; word-break:break-all}
#bottom_panel {
	height: 100%;
	z-index:1;
	background-color:#F0F6F6;
	border:1px solid #b5b7ba;
	padding:0px;
	word-break:break-all;
	position:relative;
	overflow:hidden;
	border-radius:4px;
	padding:1px;
	margin:1px 1px;

}

/* 추가_Daily Status */
.ml29{margin-left:28px}
.ml6{margin-left:6px}
.t_box {width:auto; height:auto; float: left;}
/* 부트스트랩 전환하면서 안쓰는 css 정리 */
/* #content h4 { width:1049px; border-bottom:1px solid #4f87b2; padding: 0 0 2px 6px; font:bold 14px Verdana; color:#da9000; margin-top:14px; background:url(../images/common/ico_ch2_ti.gif) no-repeat 0; } */
.t_box h3 {width:1260px; padding: 0 0 0 14px; font:bold 14px Verdana; color:#282828; margin-top:13px; background:url(../images/common/ico_ch3_ti.gif) no-repeat 0px 40%;}
#Tradebox{width:1023px; height:auto; border:solid 1px #4f87b2; padding: 15px; margin-top: 5px; float: left;border-radius:4px;padding:5px;}
/*list box_개별*/
#Tradebox .listbox{width:182px; background: url(../images/contents/r_titlebox.gif) no-repeat; float: left;}
.list_title{ width:158px; height:46px; padding:14px 12px 0 12px; line-height: 18px; }
.list_title p{font: bold 14px "돋움"; color:#1f1c49;}
.list_title p.ti{font: bold 12px "돋움"; color:#1f1c49;}
.imgbox{position:relative; width:30px; height:30px; background: #009999; left:120px; top:0px;}
.imgset{ position:absolute; width:20px; height:20px; background-color:#00CCCC; }
.menubox {width:158px; padding:5px 12px;}
.menubox ul{padding:0px; margin:0px; overflow:hidden;}
.menubox li{ font: 12px "돋움"; color:#0e75c0; line-height:20px; clear: both; }
.menubox li a{float:left; font: 12px "돋움"; color:#0e75c0; line-height:20px; background: url(../images/common/ico_m_tl.gif) no-repeat 0px 40%; padding-left:8px; width:120px;}
.menubox li a:hover{float:left;  font: 12px/20px "돋움"; color:#0e75c0; background: url(../images/common/ico_m_tl.gif) no-repeat 0px 40%; padding-left:8px; text-decoration: underline; width:120px;}
.menubox li.list_02 a{float:left; width:114px; font: 12px "돋움"; color:#0e75c0; line-height:20px; background: url(../images/common/ico_m_tl.gif) no-repeat 0px 40%; padding-left:8px; margin-left:6px;}
.menubox li.list_02 a:hover{width:114px; float:left; font: 12px/20px "돋움"; color:#0e75c0; background: url(../images/common/ico_m_tl.gif) no-repeat 0px 40%; padding-left:8px; text-decoration: underline; margin-left:6px;}
.menubox .list_01{float:left; font: bold 12px "돋움"; color:#1f1c49; line-height:20px; background: url(../images/common/ico_m_t.gif) no-repeat 0px 41%; padding-left:11px;}
.menubox .number{float:right; width: 30px; text-align: right;}
.not_m_line{white-space:nowrap; overflow:hidden;}
.inline_m {display:inline-block; text-align:center}
.combobox {
	border: solid 1px #7F9DB9;
	padding: 0px;
	margin: 0px;
}
.combotext
{
	border-style: none;
	border-width: 0px;
	padding: 1px;
	margin: 0px;
}
table.pageNavi{border-left: 1px solid var(--base_bgColor_o03);border-right: 1px solid var(--base_bgColor_o03);border-bottom: 1px solid var(--base_bgColor_o01);}

#i_left{border-top:1px solid var(--base_bgColor_o03)}

.ui-layout-west{
	inset:71px auto 0px 0px !important;
}
.ui-layout-pane{
	border:0px !important;
}

.dhx_tabbar_zone_top{
	top:2px;
}
.dhx_tabbar_zone_dhx_terrace .dhx_tab_element span{
	font-size:10px;
	padding-right:15px;
	white-space:normal;
}


/* -- Grid 관련 CSS -- */
div.gridbox{
	border:1px solid var(--base_bgColor_o01) !important;
}
div.gridbox .xhdr{
	background:var(--base_bgColor_o01) !important;
	border-top:1px solid var(--base_bgColor_o01) !important;
	border-bottom:1px solid var(--base_bgColor_o01) !important;
}

div.gridbox .xhdr table{
	border-top:0px !important;
	border-bottom:0px !important;
}

/* 기본 헤더 */
div.gridbox .xhdr td {
	border-left: 0 !important;
	border-right: 1px solid #d7dce3 !important;
	border-top: 0 !important;
	border-bottom: 0 !important;
}

/* 그룹 끝나는 긴 경계선 */
div.gridbox .xhdr td.x2-group-boundary {
	border-right: 1px solid #b8c1cc !important;
}

/* 상위 그룹 헤더만 톤 다운된 배경 */
div.gridbox .xhdr td.x2-group-header {
	background: #f2f6f8 !important;
	border-bottom: 1px solid #c7ced8 !important;
}

/* 그룹 헤더 텍스트 */
div.gridbox .xhdr td.x2-group-header .hdrcell {
	color: #5e6d7e !important;
	font-weight: 600;
}

/* 하위 헤더 텍스트는 너무 진하지 않게 */
div.gridbox .xhdr td .hdrcell {
	color: #4a4f57;
}

div.gridbox .xhdr td input,select{
	border:1px solid var(--base_bgColor_o03) !important;
	border-radius:5px;
	color:var(--base_bgColor_down) !important;
}

div.gridbox .xhdr td input:focus{
	outline:2px solid var(--base_bgColor_o03) !important;
}
div.gridbox .xhdr td select:focus{
	outline:2px solid var(--base_bgColor_o03) !important;
}
div.gridbox .xhdr td select option{
	background:var(--base_bgColor_o01) !important;
	outline:0px;
}

div.gridbox .objbox td{
	border-left:0px !important;
	border-right:1px solid var(--base_bgColor_o01) !important;
	border-top:0px !important;
	border-bottom:1px solid var(--base_bgColor_o01) !important;
}

div.gridbox .objbox td.cellselected{
	background-color:var(--base_bgColor_o01) !important;
}
div.gridbox .objbox table{
	border-bottom:1px solid var(--base_bgColor_o01) !important;
}
div.gridbox .typable {background:url(../images/img_typable.png) no-repeat right; padding-right:16px;}
div.gridbox .typable_red {background:url(../images/img_typable_red.png) no-repeat right; padding-right:16px;}
div.gridbox table.obj tr.rowselected {background-color:var(--base_bgColor_o01)}

/** Grid 옵션 버튼 **/
.grdFncDiv{
	position:absolute;
	display:grid;
	align-content:space-between;
	width:30px;
	height:26px;
}

.grdFncDiv div{
	width:8px;height:8px;
	font-size:8px;
	cursor:pointer;
	z-index:9999;
	font-weight:bold;
}

.grdFncDiv div:hover{
	border:2px solid var(--base_bgColor_o03) !important;
	color:blue;
}

.grdFncDiv div.sortCol{
	background: url(/resources/images/common/layout_8_8.png) no-repeat;
}

.grdFncDiv div.filterCol{
	border:1px solid #c0c0c0;
	line-height:8px;
}


/** Grid Menu **/
div.dhtmlxMenu_dhx_skyblue_SubLevelArea_Polygon{
	border:1px solid var(--base_bgColor_o03) !important;
	background-color:#fff;
	padding: 0 0 0 0  !important;
}
div.dhtmlxMenu_dhx_skyblue_SubLevelArea_Polygon table{
	background:var(--base_bgColor_o01) !important;
}

/* -- Sub Tab CSS -- */
.ui-tabs table .ui-tabs-nav{
	background:var(--base_bgColor_o03) !important;
	border-left:0px;
	border-right:0px;
	border-top:var(--base_bgColor_o03) !important;
	border-bottom:var(--base_bgColor_o03) !important;
}


/*-- Resizeable --*/
div[resizeable=true]{
	position: relative;
	/*resize: both; !*enable this to css resize*! */
	overflow: hidden;
	width:100vw;
	height:350px;
	min-height:150px;
	margin:0 0 0 0;
}

div.resizer-bottom {
	width: 100%;
	height: 5px;
	background: var(--base_bgColor_o01);
	position: absolute;
	left:0;
	right: 0;
	bottom: 0;
	cursor: n-resize;
}


/* bootstrap 오더라이딩 */
.form-floating .form-control.form-control-sm{
	padding-top: 1rem !important;
	padding-bottom: 0 !important;
	font-size: 1em !important;
}

input.form-control:disabled
, input.form-control[readonly]
, .input-group .input-group-text {
	border-color: #c8c8c8 !important;
}

.form-floating>.form-control:not(:placeholder-shown):read-only~label::after, .form-floating>:read-only~label::after {
	background-color: var(--bs-secondary-bg);
}

select.form-select-sm
, input.form-control-sm
, .input-group .input-group-text
, .btn-sm{
	height: 28px !important;
}

.form-select-sm
, .form-control-sm
, .input-group-text
, .btn-sm {
	vertical-align:middle;
	font-size:11px;
}

.btn.btn-rounded {
	border-radius: 20px !important;
}

/* bootstrap과 dhtmlx grid의 css 충돌해결 */
div.gridbox_dhx_terrace.gridbox {
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box;
}

/* bootstrap에 맞춰서 dhtmlx grid 크기 조정 */
div.gridbox_dhx_terrace.gridbox table.obj.row20px tr td{
	height:35px;
	font-size: 1em;
}
div.gridbox_dhx_terrace.gridbox div.xhdr table tr td {
	height:35px;
	font-size: 1em;
	white-space:nowrap;
	overflow:hidden;
}

div.gridbox_dhx_terrace.gridbox div.xhdr table tr td div.hdrcell {
	font-weight: 600;
}

div.gridbox_dhx_terrace.gridbox div.xhdr table tr td.filter input
, div.gridbox_dhx_terrace.gridbox div.xhdr table tr td.filter select {
	height:19px;
	font-size: 11px !important;
}

div.gridbox_dhx_terrace.gridbox table.obj.row20px tr td .dhx_combo_edit{
	font-size: 1em;
	white-space:nowrap;
	overflow:hidden;
}

.base-row {
	min-height: 45px;
	display: flex;           /* Flexbox 레이아웃 활성화 */
	flex-wrap: wrap;         /* Flexbox 요소를 줄 바꿈 가능하도록 설정 */
	align-items: center;     /* Flexbox 요소를 수직 중앙 정렬 */
}
.row .base-row {
	margin-top: 0;
}

.row-height2 {
	min-height: 90px;
}

.row-height3 {
	min-height: 135px;
}
.row-height4 {
	min-height: 180px;
}

.search-base-row {
	min-height: 40px;
	display: flex;           /* Flexbox 레이아웃 활성화 */
	flex-wrap: wrap;         /* Flexbox 요소를 줄 바꿈 가능하도록 설정 */
	align-items: center;     /* Flexbox 요소를 수직 중앙 정렬 */
}

.th-label {
	background-color: #f8f9fa; /* bg-light 스타일 */
}

@media (min-width: 992px) { /* 화면 크기가 lg 이상일 때 */
	.th-label {
		justify-content: flex-end; /* 내용 오른쪽 정렬 */
	}
}

.form-group label, .form-check label {
	margin-bottom: 0 !important;
}

div.form-check {
	padding: 0;
}
.form-check-inline {
	flex-direction: row !important;
}

.dropdown-item.function-item {
	height: 30px;
}

.base-row {
	padding-top: 2px;
	padding-bottom: 2px;
}

@media (max-width: 768px) {
	.modal-dialog {
		width: 95% !important;
	}
}


/* disabled인 요소와 readonly인 요소가 is-invalid 클래스를 가질 때 스타일 적용 */
input:disabled.is-invalid,
textarea:disabled.is-invalid,
select:disabled.is-invalid,
input[readonly].is-invalid,
textarea[readonly].is-invalid {
	border-color: var(--bs-form-invalid-border-color) !important; /* Bootstrap의 is-invalid 스타일 */
}


/* ==========================================================================
 * bootstrap-datepicker 공통 커스텀
 * - 검색조건 등 화면 내 datepicker + 그리드 셀 팝업(.bs-cal-compact) 공통 적용
 * - 그리드용은 크기만 축소, 스타일은 여기서 상속
 * ========================================================================== */

.datepicker.datepicker-dropdown {
	padding: 8px;
	border: 1px solid #c8cfd8;
	border-radius: 6px;
	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
}
.datepicker table tr td,
.datepicker table tr th {
	border-radius: 4px;
}

/* prev/next 화살표: « » → ‹ › (얇게) */
.datepicker .prev,
.datepicker .next {
	color: #495057;
	font-size: 0;              /* 원본 « » 텍스트 숨김 */
	vertical-align: middle;
}
.datepicker .prev::before,
.datepicker .next::before {
	display: inline-block;
	font-size: 18px;
	line-height: 1;
	vertical-align: middle;
}
.datepicker .prev::before { content: "\2039"; }  /* ‹ */
.datepicker .next::before { content: "\203A"; }  /* › */

/* 요일 헤더 - 일(빨강) / 토(파랑) */
.datepicker table tr th.dow:first-child        { color: #d9534f; }
.datepicker table tr th.dow:last-child         { color: #337ab7; }

/* 날짜 셀 - 일(빨강) / 토(파랑). old/new(이전·다음 달)에는 흐리게 우선 유지 */
.datepicker table tr td.day:first-child:not(.old):not(.new) { color: #d9534f; }
.datepicker table tr td.day:last-child:not(.old):not(.new)  { color: #337ab7; }

/* 일반 날짜 hover - range 톤과 어울리는 옅은 남보라 */
.datepicker table tr td.day:hover,
.datepicker table tr td.day.focused {
	background: rgba(61, 64, 127, 0.06) !important;
	background-image: none !important;
	cursor: pointer;
}

/* 오늘: 대비되는 앰버 톤으로 강조, 항상 radius 유지 */
.datepicker table tr td.today:not(.active),
.datepicker table tr td.today:not(.active).disabled,
.datepicker table tr td.today:not(.active).disabled:hover {
	background: rgba(245, 158, 11, 0.2) !important;
	background-image: none !important;
	border-color: transparent !important;
	color: #b45309 !important;
	font-weight: 700;
	border-radius: 4px !important;
}
.datepicker table tr td.today:not(.active):hover {
	background: rgba(245, 158, 11, 0.32) !important;
	color: #b45309 !important;
	font-weight: 700;
	border-radius: 4px !important;
}
/* 오늘이 범위 안에 있을 때: radius 제거하여 range 흐름과 연결 */
.datepicker table tr td.today.range:not(.active),
.datepicker table tr td.today.range:not(.active):hover {
	border-radius: 0 !important;
}

/* 범위(range) 중간 날짜: 프로젝트 옅은 남보라, 연결감 위해 각지게 */
.datepicker table tr td.range,
.datepicker table tr td.range:hover,
.datepicker table tr td.range.disabled,
.datepicker table tr td.range.disabled:hover {
	background: var(--base_bgColor_o01, rgba(61, 64, 127, 0.1)) !important;
	background-image: none !important;
	border-radius: 0 !important;
	color: inherit;
}
/* 이전·다음 달 range 셀은 원래 흐린 색 유지 */
.datepicker table tr td.range.old,
.datepicker table tr td.range.new {
	color: #adb5bd !important;
}

/* 활성(단일 선택일): 사방 radius */
.datepicker table tr td.active,
.datepicker table tr td.active:hover,
.datepicker table tr td.active.disabled,
.datepicker table tr td.active.disabled:hover {
	background: #4d51a3 !important;
	background-image: none !important;
	border-color: #4d51a3 !important;
	color: #fff !important;
	text-shadow: none !important;
	border-radius: 4px !important;
	font-weight: 600;
}
/* 범위 시작: 왼쪽만 radius (오른쪽은 다음 range 셀과 이어짐) */
.datepicker table tr td.range-start,
.datepicker table tr td.range-start:hover {
	background: #4d51a3 !important;
	background-image: none !important;
	border-color: #4d51a3 !important;
	color: #fff !important;
	text-shadow: none !important;
	border-radius: 4px 0 0 4px !important;
	font-weight: 600;
}
/* 범위 끝: 오른쪽만 radius */
.datepicker table tr td.range-end,
.datepicker table tr td.range-end:hover {
	background: #4d51a3 !important;
	background-image: none !important;
	border-color: #4d51a3 !important;
	color: #fff !important;
	text-shadow: none !important;
	border-radius: 0 4px 4px 0 !important;
	font-weight: 600;
}
/* 범위 시작 == 끝 (같은 날짜): 사방 radius */
.datepicker table tr td.range-start.range-end,
.datepicker table tr td.range-start.range-end:hover {
	border-radius: 4px !important;
}

/* 월/년/십년/세기 뷰의 active(선택) 및 focused: 활성일과 같은 배경 */
.datepicker .month.active,
.datepicker .month.active:hover,
.datepicker .month.focused,
.datepicker .year.active,
.datepicker .year.active:hover,
.datepicker .year.focused,
.datepicker .decade.active,
.datepicker .decade.active:hover,
.datepicker .decade.focused,
.datepicker .century.active,
.datepicker .century.active:hover,
.datepicker .century.focused {
	background: #4d51a3 !important;
	background-image: none !important;
	color: #fff !important;
	text-shadow: none !important;
	border-radius: 4px !important;
	font-weight: 600;
}

/* ==========================================================================
 * 그리드 셀 편집 팝업 전용 컴팩트 크기 (.bs-cal-compact)
 * - 위 공통 datepicker 스타일 상속, 크기·간격만 축소
 * ========================================================================== */
.datepicker.bs-cal-compact { font-size: 12px; min-width: 0; }
.datepicker.bs-cal-compact table.table-condensed { width: auto; margin: 0; }
/* days 뷰 셀만 컴팩트 (colspan=7이 있는 다른 뷰는 영향 X) */
.datepicker.bs-cal-compact .datepicker-days th,
.datepicker.bs-cal-compact .datepicker-days td {
	padding: 2px 5px;
	height: 24px;
	width: 26px;
	line-height: 20px;
}
.datepicker.bs-cal-compact .datepicker-switch { font-size: 12px; }
.datepicker.bs-cal-compact .dow { font-size: 11px; }
.datepicker.bs-cal-compact .prev::before,
.datepicker.bs-cal-compact .next::before { font-size: 15px; }
/* months / years / decades / centuries 뷰: 4열 배치 유지 */
.datepicker.bs-cal-compact .datepicker-months table,
.datepicker.bs-cal-compact .datepicker-years table,
.datepicker.bs-cal-compact .datepicker-decades table,
.datepicker.bs-cal-compact .datepicker-centuries table { width: 200px; }
.datepicker.bs-cal-compact .month,
.datepicker.bs-cal-compact .year,
.datepicker.bs-cal-compact .decade,
.datepicker.bs-cal-compact .century {
	display: inline-block;
	width: 23%;
	height: 32px;
	line-height: 32px;
	font-size: 12px;
	margin: 1%;
	box-sizing: border-box;
}