@charset "utf-8";

/* reset */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,textarea,p,blockquote,th,td,input,select,textarea,button {margin:0;padding:0}
fieldset,img {border:0 none}
dl,ul,ol,menu,li {list-style:none}
blockquote, q {quotes: none}
blockquote:before, blockquote:after,q:before, q:after {content:'';content:none}
input,select,textarea,button {vertical-align:middle}
button {border:0 none;background-color:transparent;cursor:pointer}
body{position:relative; font-size:62.5%; font-family:"맑은고딕", Malgun Gothic, '돋움', dotum, sans-serif;}
body,th,td,input,select,textarea,button {font-size:12px;line-height:1.5;color:#333} /* color값은 디자인가이드에 맞게사용 */
a {color:#333;text-decoration:none}
a:active, a:hover {text-decoration:none}
address,caption,cite,code,dfn,em,var {font-style:normal;font-weight:normal}
/* reset */

html{height:100%;} 
body{height:100%;}
iframe{border:0;}		
.topMenu{float:left; position:absolute; top:0; left:0; width:100%; height:80px; overflow-y:hidden; transition:height 0.3s;}
.leftMenu{float:left; width:180px; height:calc(100% - 80px); padding-top:80px;}
.rightCon{float:left; width:calc(100% - 180px); height:calc(100% - 80px); padding-top:80px;}
header, section, footer, .topmenu_wrap, .gnb_wrap{width:100%; box-sizing:border-box;}

.btn_img{cursor:pointer;}
.btn_auto{width:69px; height:32px; border:0; background:url(../img/btn_auto.png) no-repeat;}
.btn_add{width:69px; height:32px; border:0; background:url(../img/btn_add.png) no-repeat;}
.btn_addAll{width:69px; height:32px; border:0; background:url(../img/btn_addAll.png) no-repeat;}
.btn_remove{width:69px; height:32px; border:0; background:url(../img/btn_remove.png) no-repeat;}
.btn_removeAll{width:69px; height:32px; border:0; background:url(../img/btn_removeAll.png) no-repeat;}
.btn_pop_add{width:57px; height:22px; border:0; background:url(../img/btn_pop_add.png) no-repeat;}
.btn_download{width:104px; height:32px; border:0; background:url(../img/btn_download.png) no-repeat;}
.btn_allAdd{width:104px; height:32px; border:0; background:url(../img/btn_allAdd.png) no-repeat;}
.btn_allDelete{width:104px; height:32px; border:0; background:url(../img/btn_allDelete.png) no-repeat;}

header.sub{position:relative; padding-top:80px;}
.topmenu_box > ul > li{float:left;}
.gnb nav .depth1 > li{float:left;}

.gnb_wrap{position:absolute; top:0; box-sizing:border-box; width:100%; height:80px; font-size:0; line-height:0; z-index:100;}
.gnb_wrap h1{display:inline-block; width:230px; height:80px; box-sizing:border-box; padding-left:10px; /* padding-top:30px; */ vertical-align:top;}/*line-height:80px;*/
.gnb_wrap h1 img{vertical-align:middle;}
.topmenu_box{position:absolute; top:0; right:0;}
.topmenu_box > ul{display:inline-block;}
.topmenu_box > ul li{display: inline-block;}
.topmenu_box > ul li a {position:relative; display:block; width:120px; height: 80px; line-height: 20px; box-sizing: border-box; color: #666; font-size:14px; text-align:center; opacity:0.7; transition:all 0.3s;margin-top:20px;}
.topmenu_box > ul li:hover a{opacity:1;}
.topmenu_box > ul li a img{display:inline-block; margin-right:10px; vertical-align:middle;}
.topmenu_box > ul li:last-child > a:before{content:''; position:absolute; top:34px; left:0; display:inline-block; width:1px; height:13px; background:#ddd;}

.topmenu_box .service_type{display:inline-block; width:85px; height:80px; line-height:80px; box-sizing:border-box; border-left:1px solid #ddd; font-size:14px; color:#000; text-align:center; vertical-align:top;}
.topmenu_box .service_type .title{display:inline-block; width:100%; height:100%;}
.topmenu_box .service_type .title .icon{display:inline-block; width:10px; height:7px; line-height:0; transform-origin:center center; transition:transform 0.3s;}
.topmenu_box .service_type .list{display:none; width:100%; line-height:25px;}
.topmenu_box .service_type .list > li > a{display:inline-block; width:100%; height:25px; line-height:25px; background:white; border-top:1px solid #eee; text-align:center;}
.topmenu_box .service_type .list > li > a:hover{background:#ddd;}
/* .topmenu_box ul li span.red{color:rgba(255,96,78,1); animation: blink 2s linear infinite;}
@keyframes blink {
    0% { color:rgba(255,96,78,0);}
	50% { color:rgba(255,96,78,1); }
    100% { color:rgba(255,96,78,0); }
} */

.gnb_bg{position:absolute; top:80px; left:0; display:none; width:100%; height:282px; box-sizing:border-box; background:white; box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.2);}
.gnb{position:absolute; top:0px; left:230px; display:inline-block; height:80px; overflow-y:hidden;}
.gnb:hover{height:auto; overflow-y:visible;}
.gnb:hover + .gnb_bg{display:block;}
.gnb h1{float:left; display:block; width:auto; height:100%; line-height:80px;}
.gnb nav{display:inline-block;}

.gnb .depth1 > li{position:relative;}
.gnb .depth1 > li > a{position:relative; display:block; box-sizing:border-box; color:#000; font-size:14px; width:160px; height:80px; text-align:center; line-height:80px; letter-spacing:-0.5px; opacity:0.7; transition:all 0.3s;}
.gnb .depth1 > li > a:after{content:''; position:absolute; top:34px; right:0; display:inline-block; width:1px; height:13px; background:#ddd;}
.gnb .depth1 > li:first-child > a:before{content:''; position:absolute; top:34px; left:0; display:inline-block; width:1px; height:13px; background:#ddd;}
/*
.gnb .depth1 > li:hover .red_box{transform:scaleX(1);}
.gnb .depth1 > li:hover > a{opacity:1;}
.gnb .depth1 > li > .red_box{display:block; position:absolute; width:100%; height:2px; top:78px; box-sizing:border-box; background:#ed1c24; transform-origin:center center; transform:scaleX(0); transition:all 0.3s;}
*/
.gnb .depth2{position:absolute; left:0; top:80px; width:160px; height:310px; box-sizing:border-box; padding:20px 0; border-right:1px solid #eee; text-align:center; z-index:9;}
.gnb .depth2.first{border-left:1px solid #eee;}
.gnb .depth2 > li > a{display:block; color:#000; font-size:13px; line-height:30px;}
.gnb .depth2 > li > a:hover{color:#ff0000;}


.left_box{position:absolute; display:inline-block; width:230px; height:100%; box-sizing:border-box; border-top:1px solid #ddd;}
.right_box{display:inline-block; width:100%; min-height:100%; box-sizing:border-box; border-top:1px solid #ddd; border-left:1px solid #ddd; background:white;}


.left_box .title{font-size:20px; color:#333; font-weight:normal; height:50px; line-height:50px; padding-left:10px; box-sizing:border-box; background:#eee;}
.left_box .depth3{padding:15px 0 15px 16px;}
.left_box .depth3 > li > a{display:block; font-size:12px; color:#000; height:40px; line-height:40px; text-align:left;}    
.left_box .depth3 > li:hover > a, .left_box .depth3 > li.on > a{color:#ed1c24;}

.content_top{position:fixed; top:0; left:0; padding:0 30px; width:100%; height:50px; line-height:50px; background:#eee; border-top:1px solid #ddd; border-left:1px solid #ddd; z-index:100;}
.content_top .path{}
.content_top .path > li{display:inline-block;}
.content_top .path > li a{display:block; height:50px; line-height:50px; padding-left:10px; font-size:12px; color:#999;}
.content_top .path > li a:hover{color:#666;}
.content_top .path > li a:before{content:'>'; margin-right:10px;}
.content_top .path > li:first-child a:before{content:'';}

.content_middle{position:relative; padding:30px; margin-top:50px; box-sizing:border-box;}
.content_middle .search_wrap{position:absolute; right:30px; top:30px;}
.content_middle .search_wrap img{cursor:pointer; vertical-align:middle;}
.content_middle .title{position:relative; display:inline-block; height:32px; line-height:32px; margin-bottom:15px; font-size:16px; color:#000;}
.content_middle .title_adptdetail{position:relative; display:inline-block; height:32px; line-height:32px; margin-bottom:15px; font-size:16px; color:#be8200;}
.content_middle .title .tooltip{position:absolute; top:100%; left:0; display:none; min-width:500px; padding:10px; line-height:20px; font-size:12px; color:white; border-radius:3px; background:rgba(17,17,17,0.8); z-index:999;}
.content_middle .title:hover .tooltip{display:inline-block;}
.content_middle .title .tooltip:after{content:""; position:absolute; top:-10px; left:10%; border-width:5px; border-style:solid; border-color:transparent transparent rgba(17,17,17,0.8) transparent;}
.content_middle .title .ie7_class23.tooltip{background:#111;} /* ie9 미만 */

.popup_box{position:relative; padding:10px; box-sizing:border-box;}
.popup_box .search_wrap{position:absolute; right:10px; top:10px;}
.popup_box .search_wrap img{cursor:pointer;}
.popup_box .title{position:relative; display:inline-block; height:32px; line-height:32px; margin-bottom:15px; font-size:16px; color:#000;}

.popup_scrollbox{padding:10px; width: calc(100% - 20px);; border:0;}
.popup_scrollbox .search_wrap{position:absolute; right:40px; top:10px; border:1px}
.popup_scrollbox .search_wrap img{cursor:pointer;}
.popup_scrollbox .title{position:relative; display:inline-block; height:32px; line-height:32px; margin-bottom:15px; font-size:16px; color:#000;}


.dropdown{display:inline-block; vertical-align:middle;}
.dropdown select {
	appearance:none;
	-webkit-appearance: none;  /*Removes default chrome and safari style*/
	-moz-appearance: none; /* Removes Default Firefox style*/
	background: url(../img/dropdown_arrow.png) no-repeat 95% 13px;  /*Adds background-image*/
	text-indent: 0.01px; /* Removes default arrow from firefox*/
	text-overflow: "";  /*Removes default arrow from firefox*/
	box-sizing:border-box; width:100%; height:34px; border-radius:3px; padding-left:5px; padding-right:20px; font-size: 12px; color:black; border: 1px solid #ccc; transition:all 0.2s;
}
.dropdown select::-ms-expand { /* for IE 11 */
    display: none;
}
.dropdown select:focus{border:1px solid #666; outline:0;}

.table_cmt{margin-bottom:15px; font-size:12px;}
.table_row_title{margin-bottom:15px; font-size:16px;}
.table_row{width:100%; margin-bottom:15px; border:0; border-top:1px solid #a3a9b1; border-left:1px solid #a3a9b1; font-size:12px; color:#333;}
.table_row caption{display:none;}
.table_row td{height:30px; padding:0 15px; border-right:1px solid #a3a9b1; border-bottom:1px solid #a3a9b1;}
.table_row th{padding:0 10px; border-right:1px solid #ebebec; border-bottom:1px solid #a3a9b1; text-align:left; background:#f6f6f6;}
.table_row .select-style {width: 100%; overflow: hidden; background: #fff url(../img/icon_arrow_down.png) no-repeat right 50%; border:1px solid #ebebec;}
.table_row .select-style select {width: 100%; border: none; box-shadow: none; background-color: transparent; background-image: none; appearance: none;}
.table_row .select-style select:focus {outline: none;}
.table_row input[type="text"], .table_row input[type="number"], .table_row input[type="password"]{width:100%; border:1px solid #ebebec; padding:2px;}
.table_row textarea{width:100%; border:1px solid #ebebec; padding:2px;}
.table_row input[type="radio"] + label{margin:0 10px 0 5px;}
.table_row input[readonly]{background:#ebebec;}
.table_row td *{vertical-align:middle;}
.table_row th.center{height:30px; border-right:1px solid #a3a9b1; text-align:center;}

.table_inner{width:100%; border:0; font-size:12px; color:#333;}
.table_inner td{padding:0; border:0;}
.table_inner .select-style {width: 100%; overflow: hidden; background: #fff url(../img/icon_arrow_down.png) no-repeat right 50%; border:1px solid #ebebec;}
.table_inner .select-style select {width: 100%; border: none; box-shadow: none; background-color: transparent; background-image: none; appearance: none;}
.table_inner .select-style select:focus {outline: none;}
.table_inner input[type="text"], .table_row input[type="number"], .table_row input[type="password"]{width:100%; border:1px solid #ebebec; padding:2px;}
.table_inner textarea{width:100%; border:1px solid #ebebec; padding:2px;}
.table_inner input[type="radio"] + label{margin:0 10px 0 5px;}
.table_inner input[readonly]{background:#ebebec;}
.table_inner td *{vertical-align:middle;}

.diagram_wrap{border:1px solid #a3a9b1; padding:10px; margin-bottom:15px;}
.diagram_wrap .adapter_wrap{font-size:0;}
.diagram_wrap .title_wrap{margin-bottom:15px; font-size:0;}
.diagram_wrap .title_wrap .title_box{height:30px; line-height:30px; box-sizing:border-box; font-size:12px; text-align:center; border:1px dashed #a3a9b1; border-radius:3px; vertical-align:top;}
.table_diagram{width:100%; height:200px; margin-bottom:15px; border:1px dashed #a3a9b1; border-radius:3px; font-size:0px; line-height:200px;}
.diagram_wrap .table_diagram_wrap:last-child .table_diagram{margin-bottom:0;}
.table_diagram .side_col{display:inline-block; width:40px; box-sizing:border-box; background:white; color:white; font-size:12px; text-align:center; vertical-align:middle; line-height:30px;}
.table_diagram .center_col{display:inline-block; width:300px; box-sizing:border-box; padding:5px; border:1px dashed #a3a9b1; border-radius:3px; background:white; color:#111; font-size:12px; text-align:center; vertical-align:middle; line-height:30px;}
.table_diagram .contents_col{position:relative; display:inline-block; width:calc(46% - 150px); height:200px; box-sizing:border-box; background:white; color:#111; font-size:12px; vertical-align:middle; line-height:30px;}
.table_diagram .contents_col .top_wrap{position:absolute; top:0; left:20px; display:inline-block;}
.table_diagram .contents_col .middle_wrap{position:absolute; top:50%; left:0; margin-top:-29px; padding:0 20px; width:100%; height:58px; box-sizing:border-box; line-height:58px;}
.table_diagram .contents_col .bottom_wrap{position:absolute; bottom:5px; left:20px;}
.table_diagram .select-style {width: 100%; overflow: hidden; background: #fff url(../img/icon_arrow_down.png) no-repeat right 50%;}
.table_diagram .select-style select {width: 110%; border: none; box-shadow: none; background-color: transparent; background-image: none; appearance: none;}
.table_diagram .select-style select:focus {outline: none;}
.table_diagram input[type="text"], .table_diagram input[type="number"]{width:100%; border:1px solid #ebebec; padding:2px;}
.table_diagram input[readonly]{background:#ebebec;}
.table_diagram *{vertical-align:middle;}
.table_diagram .arrow_wrap{position:absolute; top:50%; left:0; margin-top:-29px; width:100%; font-size:0;}
.table_diagram .arrow_wrap .head_left{display:inline-block; width:40px; height:58px; background:url(../img/left_arrow_head.png) center center no-repeat;}
.table_diagram .arrow_wrap .body_left{display:inline-block; width:calc(100% - 310px); height:58px; background:url(../img/left_arrow_body.png) center center repeat-x;}
.table_diagram .arrow_wrap .tale_left{display:inline-block; width:270px; height:58px; background:url(../img/left_arrow_tale.png) center center no-repeat;}
.table_diagram .arrow_wrap .head_right{display:inline-block; width:40px; height:58px; background:url(../img/right_arrow_head.png) center center no-repeat;}
.table_diagram .arrow_wrap .body_right{display:inline-block; width:calc(100% - 310px); height:58px; background:url(../img/right_arrow_body.png) center center repeat-x;}
.table_diagram .arrow_wrap .tale_right{display:inline-block; width:270px; height:58px; background:url(../img/right_arrow_tale.png) center center no-repeat;}

.search_condition{width:100%; margin-bottom:15px; border:0; border-top:1px solid #a3a9b1; border-left:1px solid #a3a9b1; font-size:12px; color:#333;}
.search_condition td{height:30px; padding:0 15px; border-right:1px solid #a3a9b1; border-bottom:1px solid #a3a9b1;}
.search_condition th{padding:0 10px; border-right:1px solid #ebebec; border-bottom:1px solid #a3a9b1; text-align:center; background:#f6f6f6;}
.search_condition .select-style {width: 100%; overflow: hidden; background: #fff url(../img/icon_arrow_down.png) no-repeat right 50%; border:1px solid #ebebec;}
.search_condition .select-style select {width: 100%; border: none; box-shadow: none; background-color: transparent; background-image: none; appearance: none;}
.search_condition .select-style select:focus {outline: none;}
.search_condition input[type="text"]{width:100%; border:1px solid #ebebec; padding:2px;}
.search_condition input[readonly]{background:#ebebec;}
.search_condition input[type="radio"] + label{margin:0 10px 0 5px;}
.search_condition td *{vertical-align:middle;}

ul.tabs{height:32px; border-bottom:1px solid #a3a9b1; box-sizing:border-box;}
ul.tabs li {position: relative; float: left; height: 32px; line-height: 32px; box-sizing:border-box; padding:0 20px; border: 1px solid #a3a9b1; border-left: none; font-weight: bold; background: #fafafa; overflow: hidden; text-align: center; cursor: pointer;}
ul.tabs li:first-child{border-left:1px solid #a3a9b1;}	
ul.tabs li.active {background: #FFFFFF; border-bottom: 1px solid #FFFFFF; color:#ed1c24;}
.tab_container {border: 1px solid #a3a9b1; border-top: none; clear: both; float: left; width: 100%; background: #FFFFFF; margin-bottom:15px;}
.tab_content {display: block; padding:10px; font-size: 12px;}

.transform_title{height:60px; line-height:60px; font-size:16px; border-top:1px solid #a3a9b1;}
ul.transform{border-top:1px solid #a3a9b1; border-bottom:1px solid #a3a9b1; font-size:0;}
ul.transform li{display:inline-block; width:33.3%; box-sizing:border-box;  font-size:12px; vertical-align:top;}
ul.transform li .box_wrap{margin:20px 0; border-left:1px solid #eee;}
ul.transform li:nth-child(3n+1) .box_wrap{border-left:0;}
ul.transform li:nth-child(4), ul.transform li:nth-child(5), ul.transform li:nth-child(6){border-top:1px solid #eee;}
ul.transform li .box{position:relative; box-sizing:border-box; padding:0 20px;}
ul.transform li .tit{margin-bottom:15px; font-size:16px;}
ul.transform li .con{font-size:12px;}

.ui-widget{font-family:"맑은고딕", Malgun Gothic, '돋움', dotum, sans-serif; z-index:0;}
.ui-jqgrid .ui-pg-input, .ui-jqgrid .ui-jqgrid-toppager .ui-pg-input{height:20px; line-height:0px;} /* jqgrid pagination 인풋 높이 (익스에서 커서가 움직이는 거 방지하기 위함)*/

/*datepicker*/
.ui-datepicker-trigger{cursor:pointer;}
.hasDatepicker{cursor:pointer;}

#modal-overlay {
	position: fixed;
	top:0;
	 left:0;
	z-index: 100;
	background: black;
	display: block;
	opacity: .75;
	filter: alpha(opacity=75);
	width: 100%;
	height: 100%;		
}