@charset "utf-8";
@import "base.css";
@import "ionicons.min.css";

/***********************************************************************************
title		: NIA 통합플랫폼 템플릿 스타일 가이드 - 공통 컴포넌트에 대한 스타일 정의
작성시작일  : 2016-07_20
************************************************************************************/

/*wrap*/
#temptype_wrap{padding:30px 35px 30px 30px; min-width:900px;}

/* SBUx.css 수정 - 2018.05.16 최종권 셀렉트박스 readonly 또는 disabled 했을때 흰색으로 보이기 때문에 주석처리 하였음 */
.sb-selectbox {/*padding:0 18px 0 5px;*/padding:0;border:1px solid #c2c6ce; /*background-color:#fff !important;*/}
p.sbux-pik-group{margin:0;}
p.sbux-pik-group + .sbux-pik-group{margin-left:10px;}
input.form-control{height:30px;}
.form-control {padding-left:4px !important}
.border-red{border: 1px solid #f10707;}
span.sbux-input-normal {margin:0;}
h1, h2, h3, h4, h5, h6{margin:0;}
.btn {font-size:12px;}
.btn-sm, .btn-group-sm>.btn {vertical-align:top;}
/*SBUxCustom 수정*/
textarea.sbux-txa {width:100%;}
.sbux-pik-icon-btn {padding:7px 10px !important;}
.slash{display:inline-block;vertical-align:middle;width:15px;height:30px;line-height:30px;text-align:center;}

/*sbgrid default.css 수정*/
.sbgrid_cell_st{border-color:#cbcbcb;}
.sbgrid_data_row_hover_st{background-color: #e0ecff !important;}
.sbgrid_focus_st{background-color: #e0ecff !important;}

/* 공통 */
.btn_padding{padding:0 10px !important;}
.fileLink{color:blue;text-decoration:underline !important;}

/*title*/
.title_area{margin-bottom:20px;position:relative;}
.title_area h3{font-size:20px;color:#222;padding-bottom:10px;border-bottom:1px solid #e5e5e5;font-weight:700;letter-spacing:-0.1em;}
.subTitle_area{/*padding-bottom:10px;*/position:relative;margin-top:20px;height:25px;}
.subTitle_area h4{font-size:14px;font-weight:700;color:#222;/* letter-spacing:-0.07em; */}
.subTitle_area h4:before {
    content:"\f3d1";
    font-family:ionicons;
    font-size: 14px;
    font-weight:700;
    color:#357acd;
    padding-left:1px;
    padding-right:7px;
}
.subTitle_area .dataInfo_lang{position:absolute;top:-37px;left:120px;z-index:10000;}
.subTitle_area .dataInfo_lang:after{display:block;content:"";clear:both;}
.subTitle_area .dataInfo_lang .tit{float:left;font-weight:bold;font-size:15px;color:#dd5a43}
.subTitle_area .dataInfo_lang .lang_inr{float:left;margin-left:5px;}
.subTitle_area .dataInfo_lang .lang_inr > span{display:inline-block;font-weight:bold;font-size:15px;}
.subTitle_area .dataInfo_lang .lang_inr > span.dash{width:30px;text-align:center;}

/*button*/
.btn_blue, 
.btn_blue:hover, 
.btn_blue:active{background-color:#357acd !important;border:0;} 
.btn_navy, 
.btn_navy:hover, 
.btn_navy:active{background-color:#495462 !important;border:0;}
.btn_black, 
.btn_black:hover, 
.btn_black:active{background-color:#212a31 !important;border:0;}
.btn_gray, 
.btn_gray:hover, 
.btn_gray:active{background-color:#565656 !important;border:0;}

.title_area .btn_area{position:absolute;top:-10px;right:0;text-align:right;}
.subTitle_area .btn_area{position:absolute;top:-10px;right:0;text-align:right;}
.subTitle_area .btn_area_listbox{position:absolute;top:-10px;right:0;text-align:right;z-index:1000;}
.btn_area_left{float:left;}
.td_btnArea{text-align:right;vertical-align:bottom !important;}
/* .btnRight_area{text-align:right;} */
.btnLeft_area{text-align:left;}
.btnCenter_area{text-align:center;}



/*paginate*/
.paginate_area{text-align:center;margin:10px 0;}
.paginate_area ul.paginate{display:inline-block;}
.paginate_area ul.paginate li {display:inline-block;float:left;margin-right:10px;}
.paginate_area ul.paginate li a{display:block;width:25px;height:25px;line-height:23px;background:#fff;border:1px solid #e0e0e0;font-size:12px;font-weight:700;color:#555;}
.paginate_area ul.paginate li a i{font-size:15px;}
.ion-android-arrow-dropleft:before {height:25px;line-height:23px;}
.ion-android-arrow-dropright:before {height:25px;line-height:23px;}
.paginate_area ul.paginate li a.curr{color:#fff;background:#357acd;border:1px solid #357acd;}



/*attached file*/
.MultiFile-holder{position:relative;}
.MultiFile-list{padding: 8px 0 8px 10px;overflow-y:auto;width:100%;height:80px;border:1px solid #c2c6ce;border-radius:3px;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;}
.MultiFile-wrap input{display: none;}
.btn_inline {display:inline-block;position:relative;overflow:visible;}
.btn-multiFile{margin-top:5px;}

/*divide*/
.divide_area{width:100%;position:relative;margin-bottom:5px}
.divide_area:after {display:block;clear:both;content:"";}
.divide_area .left_area{float:left;}
.divide_area .right_area{float:right;}
.divide_area .divide_control{position:absolute;left:48%;top:150px;width:4%;text-align:center;}
.divide_area .divide_control a{margin:0 auto;display:block;width:25px;height:25px;text-align:center;background:#357acd;border-radius:2px;margin-bottom:5px;}
.divide_area .divide_control a i{color:#fff;font-size:15px;}
.ion-ios-arrow-forward:before {height:30px;line-height:25px;}
.ion-ios-arrow-back:before {height:30px;line-height:25px;}


/*tabs*/
.tabs_area .nav-tabs{border-bottom:1px solid #495462;}
.tabs_area .nav-tabs>li{}
.tabs_area .nav-tabs>li>a{border:1px solid #cdcdcd;border-bottom:0;background-color:transparent;margin-right:5px;padding:10px 20px;font-size:14px;}
.tabs_area .nav-tabs>li.active>a{border:1px solid #495462;background-color:#357acd;line-height:18px;cursor:default;}
.tabs_area .nav-tabs>li.active>a>span.sbux-tab-txt{color:#fff;} 
.tabs_area .tab-content{border:0;padding:10px 0;overflow:visible;}

/*graph*/
.graph_area{width:100%;height:250px;line-height:250px;background:#fff;border:2px solid #cbcbcb;font-size:30px;text-align:center;}

/*comment*/
.comment_area{width:100%;margin-bottom:40px;border:2px solid #357acd;background:#f8f8f8;}
.comment_area ul{width:100%;margin:10px 0;position:relative;}
.comment_area ul li{padding:3px 0 3px 20px;}

/*listbox_area*/
.listbox_area{padding:10px;box-sizing:border-box;border:2px solid #357acd;background:#f8f8f8;margin-bottom:20px}
.listbox_area:after{display:block;content:"";clear:both;}
.listbox_area .list_box{float:left;width:19.2%;margin-left:1%;}
.listbox_area .list_box:first-child{margin-left:0;}
.listbox_area .list_box > .tit{text-align:center;padding-bottom:5px;font-weight:700;color:#333;}
.listbox_area .list_box .sbux-comp-root > select{width:100%;} 

/*datepicker*/
div.datepickerMode table.modeDay{margin:0;}
.sbux-pik-icon-btn, 
.sbux-inb-bk-btn{height:30px !important;}
.datepickerMode table tr th,
.datepickerMode table tr td{padding:0;border:0;background:transparent;}
.datepickerMode table tr th{color:white;text-align:center;}

div.datepickerMode table tr td.sbux-pik-pop-regularday span{color:#adaeb6;}
div.datepickerMode table tr td.sbux-pik-pop-saturday span{color: #146894;}
div.datepickerMode table tr td.sbux-pik-pop-sunday span{color: #af2921;}

div.datepickerMode table.modeMonth td span,div.datepickerMode table.modeYear td span{color: #adaeb6}


.datepickerMode table.modeMonth td .btn, 
.datepickerMode table.modeYear td .btn{padding:7px 0;}

/*required*/
.search_area .required:after{
  content:"*";
  position: absolute;
  left: 0;
  width: 10px;
  height: 10px;
  color:#ff0000;
  vertical-align:middle;
}

.tableDetail_area span.required{
  position: absolute;
  left: 10px;
  top:50%;
  margin-top:-8px;
}
.tableDetail_area span.required:after{
  content:"*";
  display:inline-block;
  width: 10px;
  height: 10px;
  color:#ff0000;
}
.tableDetail_area .required2:after{
  content:"*";
  width: 10px;
  height: 10px;
  color:#ff0000;
  vertical-align:middle;
}

/*modal popup*/
.modal_area .modal-header{background:#357acd;}
.modal_area .modal-title{color:#fff !important;}
.modal_area .btn-primary{background-color:#357acd;border:1px solid #357acd;}

/* modal title 높이 지정(sbux 공통) */
.modal-header{height:50px !important;}
.modal-title{color:#fff !important;position:absolute;top:50%;margin-top:-9px;}

/*공통ui, 검색영역, 그리드*/
#ui_wrap{padding:30px 35px 30px 30px; min-width:940px;}
.uiTitle_area{margin-bottom:50px;}
.uiTitle_area>h3{font-size:40px;margin-bottom:30px;}
.uiTitle_area div.ui_back{width:100%;padding:20px;background:#E0FFDB;box-shadow:0 3px 2px 0 #eee;}
.uiSubTitle_area{margin-bottom:50px;}
.uiSubTitle_area>h4{font-size:24px;margin-bottom:20px;padding-left:10px;}
.uiSubTitle_area h4 i{margin-right:5px;}
.uiSubTitle_area h5{font-size:16px;font-weight:700;margin-bottom:15px;padding-left:10px;}
.uiSubTitle_area h4 span, 
.uiSubTitle_area h5 span{margin-left:20px;font-size:13px;}
.uiSubTitle_area div.ui_back{width:100%;padding:20px;background:#FFFFD2;box-shadow:0 3px 2px 0 #eee;}
div.ui_back p{font-size:18px;margin:0;line-height:1.5em;}
.input_ex table tr th,
.input_ex table tr td{padding:5px 0;vertical-align:middle;}
.input_ex table tr th{text-align:left;}
.picker_area{border:0;background:transparent;padding:0;}

/*tree area*/
.tree_area{width:100%;background:#fff;border:2px solid #cbcbcb;font-size:30px;overflow-y:scroll;padding:5px 0;}
.tree_area .tree{margin: auto;padding: 0 0 0 10px;
}
.tree_area .tree .tree-plus.sbux-icon:first-child{background:#357acd;border-color:#357acd;}

/*selectbox 추가수정*/
.sb-selectbox {padding-left:4px !important;padding-right:20px;}

/* @media only screen and (max-width:1400px) {
span.sbux-inb-icon{display:none;} 
.has-feedback .form-control{padding-right: 0px !important;}
.tableDetail_area table tr td .input-group {width:35% !important;}
} */

.sbgrid_datagrid_Output {padding:5px;}

/*jjoong*/

/*btn*/
.btn-cblue{background:#5e738f;color:#fff;border:1px #4a5b72 solid;}
.btn-gray{background:#eaeaea;color:#525252;border:1px #acacac solid;}
.btn-gray2{background:#eaeaea;color:#525252;border:1px #acacac solid;}
.btn-gray2:hover{background:#fff;color:#888;border:1px #acacac solid;}
.btn-white{background:#fff;color:#555;border:1px #acacac solid;}
.btn-dgray{background:#4a4a4a;color:#fff;border:1px #2b2b2b solid;}
.btn-dgray:hover{background:#111;color:#fff;border:1px #2b2b2b solid;}
.btn-blue{background:#0a7bed;color:#fff;border:1px #044b93 solid;}
.btn-blue:hover{background:#0866c6;color:#fff;border:1px #044b93 solid;}
.btn-blue2{background:#fff;color:#0866c6;border:1px #0866c6 solid;}
.btn-blue2:hover{background:#0866c6;color:#fff;border:1px #0866c6 solid;}
.btn-green{background:#438b14;color:#fff;border:1px #3c7815 solid;}
.btn-green:hover{background:#377210;color:#fff;border:1px #377210 solid;}
.btn-red{background:#b42c29;color:#fff;border:1px #a02624 solid;}
.btn-cyan{background:#0093a8;color:#fff;border:1px #026979 solid;}
.btn-cyan:hover{background:#008195;color:#fff;border:1px #026979 solid;}
.btn-cyan2{background:#fff;color:#008195;border:1px #008195 solid;}
.btn-cyan2:hover{background:#008195;color:#fff;border:1px #026979 solid;}
.btn-yellow{background:#ffc107;color:#000;border:1px #d29d00 solid;}
.btn-yellow:hover{background:#e5b218;color:#000;border:1px #e5b218 solid;}

/*search*/
.search_area{position:relative;margin-bottom:20px;padding:15px 120px 15px 15px;box-sizing:border-box;border:2px solid #357acd;background:#f8f8f8;}
.search_area > table{width:100%;}
.search_area > table th{text-align:left;padding:3px 5px 3px 25px;width:120px;}
.search_area > table td.th{text-align:left;padding:3px 5px 3px 25px;width:120px;}
.search_area > table td{padding:3px 5px;text-align:left;}
.search_area > table td.inputGroup_width .input-group{width:30%;}
/* .search_area > table + button {margin-top:10px;} */
.search_area > button {position:absolute;right:20px;top:50%;margin-top:-17px;}

/*tableDetail*/
.tableDetail_area{/*margin:10px 0;*/background:#f4f4f4;/*overflow-x:auto;*/}
.tableDetail_area>table{width:100%;border-top:2px solid #444;}
.tableDetail_area > table > tbody > tr > th,
.tableDetail_area > table > tbody > tr > td{padding:10px 10px 9px;border:1px solid #cbcbcb;text-align:left;vertical-align:middle;}
.tableDetail_area > table > tbody > tr > th{font-weight:700;padding-left:20px;}
.tableDetail_area > table > thead > tr > th{text-align:center;border:1px solid #cbcbcb;padding:10px 0}
.tableDetail_area > table > tbody > tr > td{padding-left:10px;vertical-align:middle;background:#fff;}
.tableDetail_area > table > tbody > tr > td.group_tit{text-align:center;font-weight:bold;background:#5a93c3;color:#fff;;font-size:14px;}
.tableDetail_area > table > tbody > tr .textareaStyle{width:100%;min-height:80px;padding:10px;resize:none;border:1px solid #c2c6ce;border-radius:3px;}

.tableDetail_area table.tableDetail_inner{width:100%;border-top:2px solid #444;}
.tableDetail_area table.tableDetail_inner > tbody > tr > th,
.tableDetail_area table.tableDetail_inner > tbody > tr > td{padding:6px 0;border:1px solid #cbcbcb;text-align:left;vertical-align:middle;box-sizing:border-box;}
.tableDetail_area table.tableDetail_inner > tbody > tr > th{font-weight:700;padding-left:10px;padding-right:5px;}
.tableDetail_area table.tableDetail_inner > thead > tr > th{text-align:center;border:1px solid #cbcbcb;padding:10px 0}
.tableDetail_area table.tableDetail_inner > tbody > tr > td{padding-left:10px;vertical-align:middle;background:#fff;}

.tableDetail_area.type2 label.sbux-lbl-nor{white-space: inherit;}

.tableDetail_area.inner_table{margin:10px 0;background:#f2f4f7;overflow-x:auto;}
.tableDetail_area.inner_table>table{width:100%;border-top:0;}
.tableDetail_area.inner_table > table > tbody > tr > th,
.tableDetail_area.inner_table > table > tbody > tr > td{padding:3px 10px;border:1px solid #cbcbcb;text-align:left;vertical-align:middle;}
.tableDetail_area.inner_table > table > tbody > tr > th{font-weight:700;padding-left:20px;}
.tableDetail_area.inner_table > table > tbody > tr > td{padding-left:10px;vertical-align:middle;background:#fff;}

/*tableDetail + Input
.tableDetail_area > table > tbody > tr > td select{width:30%;}*/
.tableDetail_area > table > tbody > tr > td .input-group{width:30%;float:left;}
.tableDetail_area > table > tbody > tr > td sbux-button{padding:0;}
.input_area > table > tbody > tr > th{padding:2px 10px 1px 20px;box-sizing:border-box;}
.input_area > table > tbody > tr > th.center{text-align:center;padding:11px 0 11px 0;}
.input_area > table > tbody > tr > th.th_check{text-align:center;padding:0 10px;vertical-align:top;}
.input_area > table > tbody > tr > td.th{background:#f2f4f7;padding:11px 10px;}
.input_area > table > tbody > tr > td{padding:2px 10px 1px;}
.input_area > table > tbody > tr > td.center{text-align:center;}

/*table*/
table tr th{color:#333;font-weight:700;position:relative;}
table tr td{color:#4c4c4c;}
table tr td select{width:100%;height:30px;line-height:30px;}
table tr th select{width:100%;height:30px;line-height:30px;}
label {margin-bottom:0 !important;}

.sb-check-wrap .sb-chk-tit {padding:0 6px 3px 0 !important;display:inline-block;vertical-align:text-top}

.tableList_area {}
.tableList_area.type2{border:1px solid #bdbfc5;padding:5px;}
.sbgrid_PA {margin:5px 0 0 0}
.tab-content {padding:5px;}

/*sbux-tab*/
.sbux-tab-item.active>a>span.sbux-tab-txt{color:#fff;} 
.sb-check-wrap>input {position:absolute;left:-9999px;}

caption {display:none;}
.scroll_tab_inner li.active span {color:#fff !important;}
.search_area span.sbux-pik-group {margin:0 5px 0 2px}
.tableDetail_area span.sbux-pik-group {margin:0 5px 0 2px}
div.sbux-form-group {margin:0}

/* khs 추가 */
.detail_area{}
.detail_area .detail_title{border-top:2px solid #444;border-right:1px solid #cbcbcb;border-left:1px solid #cbcbcb;border-bottom:1px solid #cbcbcb;margin-top:10px;}
.detail_area .detail_title:first-child{margin-top:0;}
.detail_area .detail_title .tit{padding:13px 10px;font-weight:700;background:#f4f4f4}
.detail_area .detail_title .detail_inner{background:#fff;padding:5px;}


/*tableDetail2*/
.tableDetail_area2{margin:10px 0;background:#EAEFF3;overflow-x:auto;}
.tableDetail_area2>table{width:100%;border-top:2px solid #cbcbcb;}
.tableDetail_area2 > table > thead > tr > th {background:#EAEFF3;padding:6px 10px;text-align:center;border:1px solid #cbcbcb;}
.tableDetail_area2 > table > tbody > tr > th,
.tableDetail_area2 > table > tbody > tr > td{padding:6px 10px;border:1px solid #cbcbcb;text-align:left;vertical-align:middle;}
.tableDetail_area2 > table > tbody > tr > th{font-weight:700;padding-left:20px;}
.tableDetail_area2 > table > tbody > tr > td{padding-left:10px;vertical-align:middle;background:#fff;}

.modal-title sbux-mol-hd-txt,.modal-header .close .glyphicon  {color:#fff !important }
.sb-check-wrap.sb-radio-wrap .glyphicon {vertical-align:top !important;}

.modal-content {overflow:visible !important;}


.tabnbtnwrap {position:relative;}
.tabnbtnwrap>.btn_area{position:absolute;right:0px;top:0px;}

.fade.in {z-index:10000 !important;}
.modal-open .modal {z-index:10001 !important;}


/*tableList_area2*/
.tableList_area2{border:1px solid #b2bad2;}
.tableList_area2 > table{width:100%;table-layout:fixed;}
.tableList_area2 > table > thead tr th{background:#e1eaf2;padding:7px 0;color:#4c4c4c;font-weight:400;border-left:1px solid #cbcbcb;position:inherit;}
.tableList_area2 > table > thead tr th:first-child{border-left:none;}
.tableList_area2 > table > tbody tr td{padding:7px 2px;border-top:1px solid #cbcbcb;border-left:1px solid #cbcbcb;text-align:center;}
.tableList_area2 > table > tbody tr td:first-child{border-left:none;}
.tableList_area2 > table > tbody tr td.ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;text-align:left !important;}
.tableList_area2 > table > tbody tr td.subject > a{display:block;width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;text-align:left;}
.tableList_area2 > table > tbody tr td .btn_input{background:#1a709b;border:1px solid #13506f;border-radius:3px;color:#fff;padding:0 5px;font-size:11px;}
.tableList_area2 > table > tbody tr td.group_tit{text-align:center;font-weight:bold;background:#5a93c3;color:#fff;;font-size:14px;}
/* .tableList_area2 > table > tbody tr:hover td,
.tableList_area2 > table > tbody tr:focus td{background:#e0ecff;}*/
.poll-wrap.type2 dd table .item {border-left:1px solid #cbcbcb}

.multiselect-container>li>a>label {overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
.multiselect-container > li > a > label > .bulletStyle {margin:0 0 0 8px;}