@charset "utf-8";

input[type="tel"], input[type="date"], input[type="time"] { font-family: 'NotoSansKR'; font-size:12px; }
textarea { font-family: 'NotoSansKR'; font-size:12px; }
.span { display:inline-block; }

/*페이지depth표시*/
.contents .depth-li{margin-right:0 20px;}
.contents .depth-li li{padding:0 20px 0 12px;float:left;color:#afafaf;background: url('../images/common/list2.png')no-repeat center right;font-size:16px;}
.contents .depth-li li.la{padding-right:10px;color:#2d2d2d;background: none;}

/*서브페이지 틀*/
.sub-contents { margin:5px 5px; padding:5px 5px;background: #fff;border-radius: 10px;box-shadow: 0 0 4px #d8d8d8; min-height:800px; height:auto;}
.sub-contents-bottom{padding:40px 18px;}
/*서브페이지 타이틀*/
.sub-top {margin:0 20px;}
.sub-top .sub-title{margin-left:10px; font-size:20px; color:#2d2d2d;}

/*서브목록 검색*/
.list-sch{margin-top:0px;margin-bottom:5px;padding:5px 20px;background: #f7f7f7;border-radius: 8px; height:45px;}
.list-sch input[type="text"],.list-sch select{border:1px solid #d5d5d5;}
.list-sch input[type="number"],.list-sch select{border:1px solid #d5d5d5;}
.list-sch .sch-filter{display: inline-block;}
.list-sch .sch-filter.first label{margin-left: 0;}
.list-sch .sch-filter>label{margin-right:5px;margin-left:30px;padding-left:12px;font-size: 14px;position: relative;vertical-align: middle;font-weight: 500;}
.list-sch .sch-filter.nextline{margin-top:10px;}
.list-sch .sch-filter:first-child>label{margin-left: 0;}
.list-sch .sch-filter>label:before{display: block;content:"";width:4px;height:4px;background: #111;border-radius: 50%;position: absolute;left:0;top:12px;}
.list-sch .sch-filter select{min-width:130px;height:30px;padding:0 34px 0 14px; box-sizing: border-box; vertical-align: middle;font-size: 14px;}
.list-sch .sch-filter .sch-txt{font-size:18px;width:387px;}
.list-sch .sch-filter .mgL-4{margin-left:-4px;}
.list-sch .sch-filter .checks{display: inline-block;vertical-align:middle;}
.list-sch .sch-filter .checks input[type="checkbox"] + label{display: initial;}
.list-sch .sch-filter .checks.etrans input[type="checkbox"] + label{padding-left: 26px;}
.list-sch .sch-filter .checks input[type="checkbox"] + label:after{background:#fff;}
.list-sch .sch-filter .checks.etrans input[type="checkbox"]:checked + label:after{background: url('../images/common/checked.png')no-repeat;}
.list-sch .sch-bt{width:83px;height:35px;border-radius: 20px; background: url('../images/common/sch-bt.png')no-repeat center #2268f8;text-indent: -9999px;overflow: hidden;transition:background .2s;}
.list-sch .sch-bt:active{background: url(../images/common/sch-bt.png)no-repeat center #164c91;}
_:-ms-lang(x), .list-sch .sch-filter .datepicker{width:160px;}
_:-ms-lang(x), .list-sch .sch-filter .checks{margin-top:-33px;}
.list-sch .sch-filter .datepicker{width:160px;}

/*서브목록 검색*/
.list-title{margin-top:0px;margin-bottom:5px;padding:5px 20px;height:25px;font-size:20px}

/*서브 목록 + 데이터테이블 스타일*/
.list-wrap {margin-top:5px;}
.list-wrap .tbl{border-top:1px solid #cfcfcf;}
.list-wrap .tbl-wrap .tbl .cnt{display: inline-block;min-width:24px;height:24px;text-align: center;font-size:14px;line-height: 23px; border:1px solid #444;border-radius: 24px;}
.list-wrap .tbl-wrap .paginate_button{margin-left:4px !important;padding:0 !important;width:50px;height:34px;font-size:17px;color:#777;border-radius: 4px !important; overflow: hidden;text-align: center;line-height: 1.6em;}
.list-wrap .tbl-wrap .paginate_button.first{text-indent: -9999px;background: url('../images/common/pg-bt1.png')no-repeat center !important;}
.list-wrap .tbl-wrap .paginate_button.first:hover{background: url('../images/common/pg-bt1-hover.png')no-repeat center #307ac0 !important;}
.list-wrap .tbl-wrap .paginate_button.previous{text-indent: -9999px;background: url('../images/common/pg-bt2.png')no-repeat center !important;}
.list-wrap .tbl-wrap .paginate_button.previous:hover{background: url('../images/common/pg-bt2-hover.png')no-repeat center #307ac0 !important;}
.list-wrap .tbl-wrap .paginate_button.next{text-indent: -9999px;background: url('../images/common/pg-bt3.png')no-repeat center !important;}
.list-wrap .tbl-wrap .paginate_button.next:hover{background: url('../images/common/pg-bt3-hover.png')no-repeat center #307ac0 !important;}
.list-wrap .tbl-wrap .paginate_button.last{text-indent: -9999px;background: url('../images/common/pg-bt4.png')no-repeat center !important;}
.list-wrap .tbl-wrap .paginate_button.last:hover{background: url('../images/common/pg-bt4-hover.png')no-repeat center #307ac0 !important;}
.list-wrap .tbl thead th{padding:5px 0;font-size:14px;font-weight: 500;background: #f7f7f7;border:1px solid #cfcfcf;color:#191919;}
.list-wrap .tbl thead .sorting_desc{background-image: url('../images/common/sort_desc.png');background-repeat: no-repeat;background-position: 90% center;}
.list-wrap .tbl thead .sorting_asc{background-image: url('../images/common/sort_asc.png');background-repeat: no-repeat;background-position: 90% center;}
.list-wrap .tbl tbody td{padding:2px 0;font-size:14px;color:#333;border:1px solid #cfcfcf;text-align: center; padding:0px 4px; }
.color-white{color:#FFFFFF;}
/*.list-wrap .tbl tbody tr:nth-child(2n) td{background: #fbfbfb;} 보고서레벨*/
.list-wrap .tbl tbody td a:hover{text-decoration:underline; font-weight: 700;}
.list-wrap .tbl-wrap .bottom{margin-top: 15px;}
.list-wrap .tbl .checks.etrans{margin:0;width:16px;height:16px;}
.list-wrap .tbl .checks.etrans input[type="checkbox"] + label{position: absolute;}

/*통계 테이블*/
.list-wrap .tbl.stats-tbl tr:first-child th,
.list-wrap .tbl.stats-tbl tr td{border-bottom: 1px solid #ddd;border-right: 1px solid #ddd;}
.list-wrap .tbl.stats-tbl tr:first-child th:nth-child(1),
.list-wrap .tbl.stats-tbl tr:first-child th:nth-child(2){border-bottom:1px solid #111;}
.list-wrap .tbl.stats-tbl tr:last-child th{border-right: 1px solid #ddd;}
.list-wrap .tbl.stats-tbl tr th:last-child,
.list-wrap .tbl.stats-tbl tr td:last-child{border-right: 0;}
.list-wrap .tbl.stats-tbl tr:nth-child(2n) td,
.list-wrap .tbl.stats-tbl tr td:nth-child(1),
.list-wrap .tbl.stats-tbl tr td:nth-child(2){border-bottom:1px solid #111;}
.list-wrap .tbl.stats-tbl tr:nth-child(2n) td{background: none;}

/*서브 조회*/
.view-wrap { }
.tbl-view{margin-top:5px;border-top: 1px solid #eaeaea;border-left: 1px solid #eaeaea;border-right:1px solid #eaeaea;}
.tbl-view th,.tbl-view td{padding-left:5px;font-size:12px;text-align: left;border-bottom:1px solid #eaeaea;vertical-align: middle;}
.tbl-view th {font-weight: 500; background:#d4d4d4; }
.tbl-view th .subject { background:#e1e1ff; }
.tbl-view th:nth-child(3){border-left: 1px solid #eaeaea;}
.tbl-view th:nth-child(5){border-left: 1px solid #eaeaea;}
.tbl-view th:nth-child(7){border-left: 1px solid #eaeaea;}
.tbl-view td .checks{margin-top:0px;margin-left:20px;display: inline-block;}
.tbl-view td .checks:first-child{margin-left: 0;}
.tbl-view td .checks input[type="checkbox"] + label:after{background: #fff;}
.tbl-view td .checks.etrans input[type="checkbox"]:checked + label:after{background: url('../images/common/checked.png')no-repeat;}
.tbl-view tr td.subject { background:#95caff; }
.checks{margin-top:0px;margin-left:20px;display: inline-block;}
.checks:first-child{margin-left: 0;}
.checks input[type="checkbox"] + label:after{background: #fff;}
.checks.etrans input[type="checkbox"]:checked + label:after{background: url('../images/common/checked.png')no-repeat;}

/*서브페이지 버튼구역*/
.btn-area input{margin: 0 4px;}

/*서브 등록,수정*/
.write-wrap{margin-top:15px;}
.write-wrap .w-form-line{margin-top:8px;background: #f7f7f7;border-radius: 8px;}
.write-wrap .w-form-line:after,.write-wrap .w-form-line:before{line-height:0;display:table;content:''}
.write-wrap .w-form-line:after{clear:both}
.write-wrap .w-form-line:first-child{margin-top:0;}
.write-wrap .w-form-line.form-box2>div{width:50%;float:left;}
.write-wrap .w-form-line.form-box3>div{width:33.33%;float:left;}
.write-wrap .w-form-line.form-box4>div{width:25%;float:left;}
.write-wrap .w-form-line .w-form-box{padding:10px 15px;box-sizing:border-box;}
.write-wrap .w-form-line .w-form-box>label{display: block; margin-bottom:12px;font-size:14px;font-weight: 500;}
.write-wrap .w-form-line .w-form-box .w-input input,
.write-wrap .w-form-line .w-form-box .w-input select,
.write-wrap .w-form-line .w-form-box .w-input textarea{color:#444;font-size:14px;}
.write-wrap .w-form-line .w-form-box .w-input select{padding:0 18px;height:30px;color:#444;}
.write-wrap .w-form-line .w-form-box .w-input .checks{margin-top:10px;margin-left:20px;display: inline-block;}
.write-wrap .w-form-line .w-form-box .w-input .checks:first-child{margin-left: 0;}
.write-wrap .w-form-line .w-form-box .w-input .checks input[type="checkbox"] + label:after{background: #fff;}
.write-wrap .w-form-line .w-form-box .w-input .checks.etrans input[type="checkbox"]:checked + label:after{background: url('../images/common/checked.png')no-repeat;}
.write-wrap .w-form-line .w-form-box .w-input textarea{padding:10px;border:1px solid #d5d5d5;box-sizing:border-box;overflow: auto;font-size:14px;}
_:-ms-lang(x), .write-wrap .w-form-line.form-box2 input[name=from],
_:-ms-lang(x), .write-wrap .w-form-line.form-box2 input[name=to]{width:40%;}

/*write-wrap2 관리*/
.write-wrap2{margin-top:15px;border-top: 1px solid #eaeaea;border-bottom:1px solid #eaeaea;border-right:1px solid #eaeaea;border-left:1px solid #eaeaea;}
.write-wrap2:after,.write-wrap2:before{line-height:0;display:table;content:''}
.write-wrap2:after{clear:both}
.write-wrap2>div{float:left;min-height:655px;max-height:850px;box-sizing:border-box;}
.write-wrap2 .w-form-left{width:30%;overflow: auto;}
.write-wrap2 .w-form-left::-webkit-scrollbar{width: 10px;background-color: #f5f5f5;}
.write-wrap2 .w-form-left::-webkit-scrollbar-thumb{border-radius: 10px;-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);background-color: #555;}
.write-wrap2 .w-form-right{padding-bottom:15px;width:70%;border-left:1px solid #eaeaea;}
.write-wrap2 .w-form-right th,
.write-wrap2 .w-form-right td{padding:10px;font-size:14px;text-align: left;border-bottom:1px solid #eaeaea;vertical-align: middle;}
.write-wrap2 .w-form-right th{background: #f7f7f7;font-weight: 500;}
.write-wrap2 .w-form-right .checks{display: inline-block;}
.write-wrap2 table{border-top: 1px solid #eaeaea;}

/*write-wrap3*/
.write-wrap3{margin-top:15px;border-top: 1px solid #eaeaea;border-bottom:1px solid #eaeaea;border-right:1px solid #eaeaea;border-left:1px solid #eaeaea;}
.write-wrap3:after,.write-wrap3:before{line-height:0;display:table;content:''}
.write-wrap3:after{clear:both}
.write-wrap3>div{float:left;min-height:500px;max-height:700px;overflow: auto; box-sizing:border-box;}
.write-wrap3>div::-webkit-scrollbar{width: 10px;background-color: #f5f5f5;}
.write-wrap3>div::-webkit-scrollbar-thumb{border-radius: 10px;-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);background-color: #555;}
.write-wrap3 .w-form-left{width:15%;}
.write-wrap3 .w-form-center{width:50%;border-left:1px solid #eaeaea;}
.write-wrap3 .w-form-right{width:35%; border-left:1px solid #eaeaea;}
.write-wrap3 table{border-top: 1px solid #eaeaea;}

/*write-wrap4*/
.write-wrap4{display:block; overflow:hidden; }
.write-wrap4 span.update { display:block; margin:5px 0; }
.write-wrap4:after,.write-wrap3:before{ line-height:0; display:table; content:''}
.write-wrap4:after{clear:both}
.write-wrap4 div.tab-content.tree-wrp::-webkit-scrollbar-thumb{border-radius: 10px;-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);background-color: #555;}
.write-wrap4 table{border-top: 1px solid #eaeaea;}

/*카드 레이아웃 조회*/
.preview-wrap .frame{margin:0 auto;padding:82px 47px 85px 45px;width:465px;height:757px;box-sizing:border-box;background: url('../images/sub/phone-frame.png')no-repeat;}
.preview-wrap .frame .preview{width:100%;height:100%;border:1px solid #ccc;overflow-x:hidden;overflow-y:auto;}
.preview-wrap .frame .preview::-webkit-scrollbar{width: 10px;background-color: #f5f5f5;}
.preview-wrap .frame .preview::-webkit-scrollbar-thumb{border-radius: 10px;-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);background-color: #555;}

/*조회 내용 text-view*/
.text-view{max-height:300px;overflow-y:auto;}

/*tab 디자인*/
.tab-style1 li{float:left;}
.tab-style1 li a{display: block;padding:8px 10px;font-size:18px;color:#2268f8;border:2px solid #2268f8;transition:all .3s;}
.tab-style1 li:first-child a{border-radius: 4px 0 0 4px;}
.tab-style1 li:last-child a{border-radius: 0 4px 4px 0;}
.tab-style1 li a.on{background: none;background:#2268f8;color:#fff;}
.tab-content { display:none; }

/* 트리 */
.tree-wrp { overflow-y:auto; display:block; min-height:620px; height:100% }
.tree-wrp > div { height:16px; padding:0; margin:0; }
.tree-wrp > div .home { color:#2268f8; font-size:16px; font-weight:bold; }
.tree-wrp a.nodeSel { color:#2268f8; font-weight:bold; }
.clip div span { color:red; }
.tree-wrp #icodeTree1 { padding-right:5px; }
.clip div .checked { color:black; }
.orderList { border:1px solid #c0c0c0 !important; width:100%; height:200px; background-image:none; padding:0px; vertical-align:middle; }


/*레이어팝업*/
.layerPop-wrap.layerW400{width:400px;margin-left: -200px;}
.layerPop-wrap.layerW500{width:500px;margin-left: -250px;}
.layerPop-wrap.layerW600{width:600px;margin-left: -300px;}
.layerPop-wrap .layer-con{padding:10px 30px 10px 30px;overflow-y:auto;}

.ellipsis {
	overflow:hidden;
	white-space:nowrap;
	word-break:break-all;
	text-overflow: ellipsis;
	-o-text-overflow:ellipsis;
	-ms-text-overflow:ellipsis;
	-moz-binding: url(ellipsis.xml#ellipsis);
}
.datepicker.min { width:210px; }

/* 메인 대시보드 */
.dashboard-board .notice .status.st1{background: #ff5b5b;}	/*전체*/
.dashboard-board .notice .status.st2{background: #307ac0}	/*관리자*/
.dashboard-board .notice .status.st3{background: #4f5255;}	/*사이트*/
.dashboard-board .notice .status.st4{background: #2268f8;}	/*사용자*/

/*경비구역선택 , 출입문선택 버튼*/
.btn-area1{padding-left:25px;background: url('../images/sub/btn-area1.png')no-repeat 10px center #307ac0 !important;}
.btn-area1:active{background: url('../images/sub/btn-area1.png')no-repeat 17px center #2a6eaf !important;}
.btn-area2{padding-left:35px;background: url('../images/sub/btn-area2.png')no-repeat 10px center #307ac0 !important;}
.btn-area2:active{background: url('../images/sub/btn-area2.png')no-repeat 17px center #2a6eaf !important;}
.btn-push11{padding-left:44px;background-image: url('../images/sub/btn-push.png') !important;background-repeat: no-repeat !important;background-position: 12px 9px !important;}
.btn-push11:active{background-image: url('../images/sub/btn-push.png')!important;background-repeat: no-repeat !important;background-position: 1px 9px !important;}

.view_Y { display:inline-block; width:70px; }
.view_N { display:inline-block; width:70px; text-decoration:line-through; color:red; }

/* 메인 차트 */
.chart-area { width:730px; height:200px; }
.mainChart { width:100%px; height:300px; margin-top:15px; border:1px solid #dfdfdf; }

/* loading */
.loading article { margin-top:200px; }
.loading.layer-con { height:150px; border:1px solid red; }
.loading div { text-align:center }
.loading div p { margin-top:30px; }

/*진행률 : progress-wrp*/
.progress-wrp{display: inline-block; width:400px;height:30px;line-height:30px;text-align: center; border:1px solid #ccc;background: #ff5a5a;color:#fff;font-size:13px;}
.progress-wrp .use-bar{display: inline-block; float:left; position:relative; height:100%;background: #2268f8;text-align: center;}
.progress-wrp .use-bar span{position: absolute;}
.progress-percentage{display: inline-block;padding-top:5px; vertical-align:top; font-weight: 500;}
.progress-wrp .other-txt{float:right;position: absolute;color:#000;}

/* JSTREE */
/*#jstree { min-height:600px; height:770px; }*/
#jstree { min-height:600px; height:600px; }
#wrap input[readonly].disabled { border:0; background-color:#ffffff; padding:10px 0; }
.help { width:100%; border:0px solid red;}

.select {padding:0 18px;height:20px;color:#444;}
#sortable > ul { list-style-type: none; margin: 0; padding: 0; margin-bottom: 10px; }
#sortable > li { margin: 5px; padding: 5px; width: 200px; cursor:pointer; }
#sortable > li .sel{ background-color:#fefefe }
#note { width:800px; height:100px; }

.menu:after{display:block; content:''; clear:both;position:relative;}
.menu > li{position:relative; float:left; margin-right:5px; z-index:1000; }
.menu > li > a{display:block; padding:0 15px; background:#333333; height:44px; line-height:44px; color:#fff;}
.menu > li:hover .depth_1 { display:block; }
.menu .depth_1{display:none; position:absolute; left:0; right:0; text-align:center; font-size:14px;}
.menu .depth_1 a{display:block; padding:5px; background:#333333; color:#fff; font-size:14px;}
.menu .depth_1 a:hover{display:block; padding:5px; background:#fff; color:#333333; font-size:14px;}

.amount { text-align:right; }
#changeLayer { position: fixed; top: 5%; margin: auto; width:400px; height:600px; }
.center_select { font-size:12px; }