﻿@charset "utf-8";

.fblue{color:#0070c0}
.forange{color:#ff6600}
.fred{color:#ed3314}
.fgreen{color:#09a65a}
.fyellow{color:#fff856}

.f16{font-size:16px;}

/*Form style*/

/*checkbox*/
.chkbx {position: relative; padding-left: 25px; cursor: pointer; -webkit-user-select: none;  -moz-user-select: none;  -ms-user-select: none;  user-select: none;}
.chkbx input { position: absolute; opacity: 0; cursor: pointer; height: 0; width: 0;}
.chkbx .checkmark { position: absolute; top: 0; left: 0; height: 16px; width: 16px; background-color: #fff;border-radius:3px;border:1px solid #c9d4dd}
.chkbx:hover input ~ .checkmark { border:1px solid #3163ee}
.chkbx input:checked ~ .checkmark { background-color: #4d7cfe;border:1px solid #3163ee} 
.chkbx .checkmark:after {  content: "";  position: absolute;  display: none;}
.chkbx input:checked ~ .checkmark:after {  display: block;}
.chkbx .checkmark:after { left: 4px;  top: 0px;  width: 5px;  height: 10px;  border: solid white;  border-width: 0 2px 2px 0;  -webkit-transform: rotate(45deg);  -ms-transform: rotate(45deg);  transform: rotate(45deg);}
.chkr{padding-left: 0px;padding-right:25px}
.chkr .checkmark{left:initial;right:0}


/*radio*/
.radiobx {position: relative; padding-left: 25px; cursor: pointer; -webkit-user-select: none;  -moz-user-select: none;  -ms-user-select: none;  user-select: none;line-height:18px!important}
.radiobx input { position: absolute; opacity: 0; cursor: pointer; height: 0; width: 0;}
.radiobx .checkradio { position: absolute; top: 2px; left: 2px; height: 16px; width: 16px; background-color: #fff; border-radius: 50%;border:1px solid #c9d4dd}
.radiobx:hover input ~ .checkradio { border:1px solid #3163ee}
.radiobx input:checked ~ .checkradio { background-color: #4d7cfe;border:1px solid #3163ee}
.radiobx .checkradio:after { content: ""; position: absolute; display: none;}
.radiobx input:checked ~ .checkradio:after { display: block;}
.radiobx .checkradio:after { top: 4px;left: 4px; width: 8px; height: 8px; border-radius: 50%; background: white;}

select {color:#666;padding-right:30px;padding-left:8px; line-height:32px;border-radius:3px; height:32px; border:1px solid #bec9cf;-webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none;background:#fff url(../images/bg_selectArrow.png) right center no-repeat}
select::-ms-expand{ display: none;}
input[type=text],
input[type=tel],
input[type=date],
input[type=password],
input[type=email]{color:#666; line-height:28px; height:28px; border:1px solid #bec9cf;background:#fff;border-radius:3px;text-indent:5px;}
input[type=file]{color:#666; line-height:28px; height:28px;padding-left:5px;}
.date{background:#fff url(../images/ic_calendar.png) right center no-repeat!important;line-height:28px; height:28px;}
textarea{border:1px solid #c9d4dd;border-radius:3px;padding-left:5px;}

input[type=checkbox]{border : 1px solid #c8d0da; }
input[type=number] {color:#666; line-height:28px; height:20px; border:1px solid #bec9cf;background:#fff;border-radius:3px; position: relative; padding: 5px;padding-right: 25px;width:50px}
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {opacity: 1;}
input[type=number]::-webkit-outer-spin-button, 
input[type=number]::-webkit-inner-spin-button {width: 30px;position: absolute;top: 0;right: 0;height: 100%;}


/* layout */
#wrap {height:100%;min-height:835px;width:100%;min-width:1200px;}
#header {top:0;left:320px;right:0;height:60px; position:absolute; z-index:99; overflow:hidden;min-width:1200px;box-shadow: rgba(0, 0, 0, 0.25) 0 0 3px 0 ;background-color:#fff}
#container {width:100%; min-height:100%; position:relative;min-width:1600px;overflow:hidden;background:#ebf0f3;z-index:2}
#left{top:0;left:0px;bottom:0;width:320px;position:absolute; z-index:99; overflow:hidden;background-color:#1c2b36}
#content {top:90px;bottom:70px; left:30px; right:30px; position:absolute;}

/* header */

.topbtn {float:right}
.topbtn li{float:left;}
.topbtn li a {display:block; background:url(../images/btn_top.png) no-repeat;width:60px;height:60px;cursor:pointer}
.topbtn li a.btn1{background-position:0px 0px;}
.topbtn li a.btn1:hover, .topbtn li.on a.btn1{background-position:0px -60px ;}
.topbtn li a.btn2{background-position:-60px 0px;}
.topbtn li a.btn2:hover, .topbtn li.on a.btn2{background-position:-60px -60px;}
.topbtn li span{display:none}

#gnb{height:60px;display:inline-block}
#gnb:after {content:""; clear:both; display:block;}
#gnb li {float:left; position:relative;}
#gnb li > a {display:block;font-size:1rem;color:#3b4761;line-height:50px;padding:0 30px 0 60px;margin:5px 10px;border-radius:50px}
#gnb li > a:hover,
#gnb li.on > a{color:#fff;text-decoration:none;background-color:#009982}
#gnb li > a.menu1{background-image:url(../images/ic_gnb1.png); background-repeat:no-repeat;background-position:30px -5px;}
#gnb li > a.menu1:hover, #gnb li.on > a.menu1, #gnb li.on > a.menu1:hover{background-position:30px -65px;}
#gnb li > a.menu2{background-image:url(../images/ic_gnb2.png); background-repeat:no-repeat;background-position:30px -5px;}
#gnb li > a.menu2:hover, #gnb li.on > a.menu2, #gnb li.on > a.menu2:hover{background-position:30px -65px;}
#gnb li > a.menu3{background-image:url(../images/ic_gnb3.png); background-repeat:no-repeat;background-position:30px -5px;}
#gnb li > a.menu3:hover,#gnb li.on > a.menu3, #gnb li.on > a.menu3:hover{background-position:30px -65px;}



/*left*/

#left #userbx{text-align:center;border-bottom:1px solid #243a49;padding:20px 0}
#left .user img{vertical-align:top}
#left .user {line-height:20px;font-size:1rem;color:#fff;margin-top:10px}

#left #lnb{border-bottom:1px solid #243a49;}
#left #lnb > li{background-color:transparent;background-image:url(../images/bg_lnb.png);background-position:right center;background-repeat:no-repeat}
#left #lnb > li:hover,
#left #lnb > li.on{background-color:#17242d;background-image:url(../images/bg_lnb_on.png);background-position:right center;background-repeat:no-repeat}
#left #lnb > li > a.lnb1{background:url(../images/ic_lnb1.png) no-repeat;}
#left #lnb > li > a.lnb2{background:url(../images/ic_lnb2.png) no-repeat;}
#left #lnb > li > a.lnb3{background:url(../images/ic_lnb3.png) no-repeat;}
#left #lnb > li > a.lnb4{background:url(../images/ic_lnb4.png) no-repeat;}
#left #lnb > li > a.lnb5{background:url(../images/ic_lnb5.png) no-repeat;}
#left #lnb > li > a {display:block; font-size:1rem; color:#c0daec; padding-left:48px;line-height:38px;text-decoration:none;background-position:20px 0px!important;font-size:0.875rem}
#left #lnb > li > a:hover,
#left #lnb > li.on > a {color:#fff;background-position:20px -38px!important;}
#left #lnb > li > ul.depth2{background:#e9f3fb;padding:5px 0;display:none}
#left #lnb > li > ul.depth2 > li > a {display:block; font-size:0.875rem; color:#788597; padding-left:48px;background:url(../images/bul_2depth.gif) 35px center no-repeat;line-height:40px;}
#left #lnb > li.on > ul.depth2 > li > a {color:#788597;background:url(../images/bul_2depth.gif) 35px center no-repeat;}
#left #lnb > li.on > ul.depth2 > li.on > a{background:url(../images/bul_2depth_on.gif) 35px center no-repeat;color:#006ecd}

#left .myinfo{position:relative;padding-top:45px;}
#left .myinfo h2{position:absolute;top:10px;left:calc((100% - 70px)/2); background:url(../images/bg_myinfotit.png) 0 0 no-repeat;color:#7792a5;font-size:0.875rem;font-weight:normal;height:70px;width:70px;text-align:center}
#left .mywork{border-radius:10px;background-color:#4e606d;margin:0 20px 0;padding-top:25px}
#left .mywork li{border-bottom:1px dotted #839099;padding:5px 0;}
#left .mywork li:last-child{border-bottom:none}
#left .mywork li h4{font-size:0.875rem;font-weight:normal;color:#d8efff;margin:10px 20px 0 95px;line-height:20px;}
#left .mywork li .numbx{font-size:0.875rem;color:#d8efff;margin:0 20px 0 95px;line-height:40px}
#left .mywork li .numbx a{font-size:1.875rem;font-weight:normal;color:#fff}
#left .mywork li .numbx a:hover{text-decoration:underline}
#left .mywork li:nth-child(1){background:url(../images/ic_mywork1.png) 20px center no-repeat;}
#left .mywork li:nth-child(2){background:url(../images/ic_mywork2.png) 20px center no-repeat;}
#left .mywork li:nth-child(3){background:url(../images/ic_mywork3.png) 20px center no-repeat;}

#left .b_myinfo{position:relative;padding-top:45px;}
#left .b_myinfo h2{position:absolute;top:10px;left:calc((100% - 70px)/2); background:url(../images/bg_myinfotit.png) 0 0 no-repeat;color:#7792a5;font-size:0.875rem;font-weight:normal;height:70px;width:70px;text-align:center}
#left .b_mywork{border-radius:10px;background-color:#4e606d;margin:0 20px 0;padding-top:25px;padding-bottom:10px}
#left .b_sch{margin:17px 10px 10px}
#left .b_mywork .numbx{font-size:0.875rem;color:#d8efff;margin:0 10px 0 10px;line-height:20px}
#left .b_mywork .numbx span{color:#fff}
#left .b_mywork .b_myworklst{height:259px;margin:0 10px 0px;border:1px solid #c9d4dd;background-color:#fff}
#left .b_mywork ul{}
#left .b_mywork ul li{border-bottom:1px dotted #919da8;padding:3px 0}
#left .b_mywork ul li:last-child{border-bottom:none}
#left .b_mywork ul li:hover{background:#e1f7f6}
#left .b_mywork ul li a{ text-overflow:ellipsis; white-space:nowrap; overflow:hidden;display:block;margin:0 5px;line-height:24px}
#left .b_mywork ul li a img{margin-right:5px;width:24px}
/*content*/
.posibx{width:100%;height:100%;position:relative}
.posibx .card{ position:absolute; bottom:30px;top:0;right:30px;left:30px; z-index:9999998; box-shadow:0px 0px 3px 0px rgba(0,0,0,0.1); transform: scale(1); transition:all .4s; background-color:#fff;opacity:0;z-index:1}
.posibx .card.active{transform: scale(1); top:30px;bottom:0;left:30px;right:30px; box-shadow:0px 0px 7px 2px rgba(0,0,0,0.2); z-index:9999999; transition:all .4s;opacity:1;z-index:10}

.contbx > h2{color:#fff;background-color:#009982;height:49px;line-height:49px;font-size:1.125rem;font-weight:normal;text-indent:20px;border-bottom:1px solid #0f8a7a}
.schbx{padding:10px 0 9px;border-bottom:1px solid #ebebeb;margin-bottom:10px}
.schbx ul{margin:0 20px}
.schbx ul:after {content:""; clear:both; display:block; }
.schbx li{float:left;margin-right:20px}
.schbx li label{display:inline-block;line-height:18px;margin: 0px 10px 0px;background:url(../images/ic_stit.gif) 0 center no-repeat;text-indent:18px;}
.con_scroll{padding:0px;margin:0 0px;overflow:auto;height:calc(100% - 50px)}
.txt_help{position:absolute;left:18px;top:0px;z-index:999;background:url(../images/img_tail1.png) 0 center no-repeat;display:none}
.txt_help span{box-shadow:1px 0 2px rgba(0,1,0,0.2);border-radius:3px;background:#fff;padding:5px 10px;font-size:12px;color:#666;line-height:1.5;display:inline-block;float:left;text-indent:0;margin-left:14px}
.fchelp:hover .txt_help{display:block}

.tab{border-bottom:1px solid #e2e8f0}
.tab:after{content:""; clear:both; display:block;}
.tab > li{float:left;margin:0 7px;border-bottom:2px solid #fff;min-width:80px}
.tab > li:first-child{margin-left:14px}
.tab > li:last-child{margin-right:10px}
.tab > li.on{border-bottom:2px solid #009982}
.tab > li a{color:#000;display:block;line-height:42px;text-align:center}
.tab > li a:hover, .category > ul > li.on a{color:#009982;text-decoration:none}


/*button*/
button > span{display:none}
.btn_green{border-radius:3px;background-color:#33b17d;color:#fff;vertical-align:middle;padding:6px 15px 6px 15px; }
.btn_green:hover{background-color:#299e6d}
.btn_darkgreen{border-radius:3px;background-color:#1b885b;color:#fff;vertical-align:middle;padding:6px 15px 6px 15px;}
.btn_darkgreen:hover{background-color:#116744}
.btn_gray{border-radius:3px;background-color:#b8c0d3;color:#fff;vertical-align:middle;padding:6px 15px 6px 15px;}
.btn_gray:hover{background-color:#919da8}

.btn_bline{border-radius:3px;background-color:#fff;color:#333;border:1px solid #32a9f8;padding:6px 10px 6px ;}
.btn_bline:hover{border:1px solid #066fc8;}
.btn_sch{border-radius:0;background-color:#535a67;color:#fff;vertical-align:middle;padding:6px 20px 6px 20px; }
.btn_sch:hover{background-color:#333c4b}

.btn_s_green{border:1px solid #009165;font-size:0.75rem;background:#00bc84;height:16px;border-radius:2px;color:#fff!important;line-height:11px;padding:0 3px;margin-left:10px;text-decoration:none}
.btn_s_green:hover{background:#009165;border:1px solid #026f4e;text-decoration:none}
.btn_s_gray{border:1px solid #919da8;font-size:0.75rem;background:#b8c0d3;height:16px;border-radius:2px;color:#fff!important;line-height:11px;padding:0 3px;margin-left:10px;text-decoration:none}
.btn_s_gray:hover{background:#919da8;border:1px solid #7b848c;text-decoration:none}

.btn_close{background-image: url(../read/images/btn_close.png);background-position: 0 0; background-repeat: no-repeat;width:24px;height:24px;background-color:#fff;padding:0!important;min-height:20px;float:right}
.btn_close:hover{background-position: 0 -24px;}
.btn_close > span{display:none}

.btn_line{border-radius:3px;background-color:#fff;color:#333;border:1px solid #99a5bc;padding:6px 10px 6px ;}
.btn_line:hover{border:1px solid #009982;color:#009982}
.btn_gline{border-radius:3px;background-color:#fff;color:#333;border:1px solid #009982;padding:6px 10px 6px ;}
.btn_gline:hover{border:1px solid #00806c;color:#00806c}

.btn_detail{border-radius:3px;background-color:#fff;background-image: url(../images/ic_detail.png); background-position: 5px 0; background-repeat: no-repeat;color:#333;border:1px solid #99a5bc;padding-left:25px;line-height:24px;padding-right:5px}
.btn_detail:hover{border:1px solid #009982;color:#009982; background-position: 5px -24px;}

.btn_detail.on{background-image: url(../images/ic_detail_on.png)!important;}

.btn_ic{background-color:#fff;border:1px solid #99a5bc;background-repeat: no-repeat;background-position:0px 0px;border-radius:3px;width:26px;height:26px}
.btn_ic:hover{background-position:0px -24px;border:1px solid #009982;color:#2670af}

.btn_result{background-image:url(../images/ic_result.png);}
.btn_register{background-image:url(../images/ic_register.png);}
.btn_location1{background-image:url(../images/ic_location1.png);}
.btn_location2{background-image:url(../images/ic_location.png);}
.btn_download{background-image:url(../images/ic_download.png);}
.btn_time{background-image:url(../images/ic_time.png);}
.btn_add{background-image:url(../images/ic_add.png);}
.btn_del{background-image:url(../images/ic_del.png);}


.btn_map{background-image:url(../images/ic_location.png);background-repeat: no-repeat;background-position:0px 0px;height:26px;border-radius:3px;background-color:#fff;color:#333;border:1px solid #99a5bc;line-height:24px;padding:0 10px 0 24px;}
.btn_map:hover{border:1px solid #007261;color:#007261;background-position:0px -24px;}
.ic_del{background-image:url(../read/images/btn_close.png);background-repeat: no-repeat;background-position:0px 0px;width:24px;height:24px;display:block;}
.ic_del:hover{background-position:0px -24px;}
.ic_del > span{display:none}

/*table*/
.tablebx{margin:0 30px}
/*.tablebx .scroll-y{position:absolute;top:50px;bottom:50px;left:0;right:0}*/
.tbtopbx{margin-bottom:5px;color:#666;line-height:22px;position:relative}
.tbtopbx:after {content:""; clear:both; display:block; }
.tbtopbx span{color:#ff5a00}
.tb_bt{position:relative;margin-bottom:10px}
.btnbx{margin:10px 30px;text-align:right}
.tb_bt .btnbx{position:absolute;right:0;top:-5px;z-index:9999999;margin:10px 0px;}

.h400{height:407px;}
.h200{height:224px;}
.h140{height:144px;}

table td input[type=text] {width:95%;}
table td select{width:100%;}
table td a{text-decoration:underline}
table td a:hover{color:#2e76d6;text-decoration:underline}
table td a.filename {display:inline-block; width:180px; letter-spacing:-1px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; }
span.calendar {display:inline-block; color:#4d4d4d; padding:0 3px; font-size:11px; line-height:22px; height:22px; border:1px solid #cccccc;background:#fff;vertical-align:bottom}
span.calendar input[type=text]{width:117px; border:0; padding:0;height:18px; }
span.calendar .btn_calendar img {vertical-align:middle;margin-top:2px}

.tblist {width:100%;}
.tblist th {padding:5px 3px; color:#fff;border-right:1px solid #99a5bc;background-color:#b0b9ce;border-top:1px solid #99a5bc;border-bottom:1px solid #99a5bc;font-weight:300;text-align:center} 
.tblist td {padding:4px 3px; color:#555; text-align:center;border-right:1px solid #dee3e9;border-bottom:1px solid #dee3e9}
.tblist td b{font-weight:normal;margin-right:10px}
.tblist th:last-child, .tblist td:last-child{border-right:none;}
.tblist button{height:26px;padding:0 10px}

.tbview{width:100%;border-top:1px solid #e0e1e3;}
.tbview tbody th {padding:7px 10px; color:#212121;font-weight:500;border-right:1px solid #e0e1e3; border-bottom:1px solid #e0e1e3; background-color:#f4f5f9;}
.tbview tbody td {padding:8px 10px; color:#555; border-right:1px solid #e0e1e3; border-bottom:1px solid #e0e1e3;min-height:20px;}
.tbview tbody th:last-child, .tbview tbody td:last-child{border-right:none}

.formtb th,
.formtb td {padding:3px 5px!important}
.formtb td select{width:calc(100% - 4px)}
.formtb td > input[type=text]{width:calc(100% - 10px)}
.formtb td textarea{width:calc(100% - 10px);line-height:1.05;margin-top:3px}
.formtb td > .ip_schbx{width:calc(100% - 10px);overflow:hidden;display:inline-block;vertical-align:middle;}
.formtb td > .ip_schbx input{width:calc(100% - 66px);float:left}
.formtb td > .ip_schbx .ic_del{margin-top:3px;float:left;margin-right:5px}

.maplist {width:100%;font-size:0.875rem;}
.maplist thead th{padding:0 5px; color:#333;background-color:#f2f6fb;border:1px solid #dee3e9;font-weight:400;height:28px;line-height:1.1;} 
.maplist tbody th{padding:0 5px; color:#777777!important;text-align:center;border:1px solid #dee3e9; height:28px;line-height:1.1;font-weight:normal}
.maplist tbody td {padding:2px 5px; color:#333; text-align:center;border:1px solid #dee3e9; height:28px;line-height:1.1}

/* paging */
.paging *{vertical-align:top}
.paging {text-align:center}
.paging a.direction {display:inline-block;font-size:12px;border:1px solid #d3d8dd;border-radius:3px;width:20px;height:20px;line-height:20px;text-align:center;overflow:hidden;margin-right:3px;background:#fff}
.paging a.direction:hover{border:1px solid #3d75cb;}
.paging span a {text-align:center;background:#fff; color:#575757; font-size:12px;border:1px solid #d3d8dd;border-radius:3px;display:inline-block;width:20px;height:20px;line-height:20px;text-align:center;margin-right:3px;}
.paging strong{border:1px solid #3e4551;background-color:#767f91; border-radius:3px;display:inline-block;width:20px;height:20px;line-height:20px;text-align:center;color:#fff;font-weight:normal; font-size:12px;margin-right:3px;}
.paging span a:hover {color:#009982; font-size:12px;border:1px solid #009982;}


.b_myinfo .paging *{vertical-align:top}
.b_myinfo .paging {text-align:center}
.b_myinfo .paging a.direction {display:inline-block;font-size:12px;border:none;border-radius:3px;width:20px;height:20px;line-height:20px;text-align:center;overflow:hidden;margin-right:3px;background:transparent}
.b_myinfo .paging a.direction:hover{border:none;}
.b_myinfo .paging span a {text-align:center;background:transparent; color:#99b1c1; font-size:12px;border:none;border-radius:3px;display:inline-block;width:15px;height:20px;line-height:20px;text-align:center;margin-right:3px;}
.b_myinfo .paging strong{border:none;background-color:transparent; border-radius:3px;display:inline-block;width:15px;height:20px;line-height:20px;text-align:center;color:#fff;font-weight:normal; font-size:12px;margin-right:3px;}
.b_myinfo .paging span a:hover {color:#fff; font-size:12px;border:none;}


/* popup*/
.popup{border:1px solid #3e3f45; background:#fff;position:absolute}
.popup h2 {background:#8CB5F8;color:#fff;position:relative;text-indent:15px;line-height:40px;font-size:1rem;font-weight:400;min-height:40px}
.popup h2 .btnpClose{position:absolute;top:8px;right:7px;bottom:0;width:24px;text-align:center;text-indent:0;line-height:1}
.popup .p_cont {padding:15px;}
.popup .p_cont:after{content:""; clear:both; display:block;}
.p_btn {padding: 0 0 15px; text-align:center}

.txtbx{background-color:#f4f5f9;border-radius:5px;background-image:url(../read/images/ic_txt.png);background-position:10px center;background-repeat:no-repeat;padding:10px 10px 10px 50px;}
.stit{color:#000;background:url(../images/ic_stit.png) 0 center no-repeat;text-indent:23px;font-weight:400;line-height:18px;margin:0px 0 10px 0px}
.txtbx2{background-color:#f4f5f9;border-radius:5px;padding:10px 10px 10px 50px;text-align:center;border:1px solid #d0d7df}
.txtbx2 h2{font-weight:normal}
.txtbx2 .big{font-size:1.125rem;line-height:35px;}

.detailbx{border:1px solid #d0d7df;border-radius:5px;margin:10px 0}
.detailbx:after{content:""; clear:both; display:block;}
.detailbx h2{border-bottom:1px solid #d0d7df;padding:0 10px;font-weight:normal;font-size:0.875rem;line-height:40px}
.detailbx h2 a{font-size:1rem;color:#111;text-decoration:underline}
.detailbx h2 a:hover{color:#2e76d6;text-decoration:underline}
.detailbx ul{margin:10px 20px}
.detailbx ul:after{content:""; clear:both; display:block;}
.detailbx li{width:50%;float:left;color:#111;position:relative;text-indent:5px}
.detailbx li label{display:inline-block;width:60px;color:#666}
.detailbx li label:before{ position: absolute;top:50%; left: 0; width: 3px; height: 3px; background-color: #009982; border-radius: 0px;-webkit-box-flex: 0; -ms-flex: 0 0 auto;  flex: 0 0 auto; content: '';}
.detailbx .progressbar{border-radius:5px;background-color:#919da8;line-height:28px;height:28px;margin:0 20px;border:2px solid #919da8;overflow:hidden;position:relative}
.detailbx .progressbar span{display:inline-block;color:#fff;text-overflow:ellipsis; white-space:nowrap; overflow:hidden;text-indent:5px}
.detailbx .progressbar .bc1{background:#00e396}
.detailbx .progressbar .bc2{background:#008ffb}
.detailbx .progressbar .bc3{background:#775dd0}
.detailbx .progressbar b{font-weight:normal;position:absolute;right:5px;top:0;font-size:1.125rem;color:#fcff5f}
.chartbx{border-top:1px dotted #919da8;margin:10px 20px;height:250px;display:none}

.stepbx{border:1px solid #d0d7df;margin:10px 0}
.stepbx:after{content:""; clear:both; display:block;}
.stepbx h2{border-bottom:1px solid #d0d7df;padding:0 10px;font-weight:normal;line-height:40px;color:#000;background:#f4f5f9}
.stepbx h2 span{font-size:0.875rem;background:#fff;border-radius:50px;color:#777;float:right;line-height:28px;border:1px solid #e0e1e3; display:inline-block;margin-top:5px;text-indent:0;padding:0 10px}
.stepcont{margin:10px}
/*map*/
.mapbx > h2{color:#fff;background-color:#575e6b;height:49px;line-height:49px;font-size:1.125rem;font-weight:normal;text-indent:20px;border-bottom:1px solid #494f5b}

#map{position:absolute; top:50px;left:0;right:0;bottom:0;background:#f5f5f5}
.zoombar{position:absolute; right:15px; top:90px; z-index:97;box-shadow: rgba(0, 0, 0, 0.1) 0 0 3px 0 ;}
.zoombx{position:relative;height:153px;width:44px;background:url(../read/images/bg_zoom.png) 0 0 no-repeat;}
.zbar{position:absolute; left:12px; top:9px;}

.tool{border-radius:4px;background:#fff;position:absolute; right:15px; top:170px; z-index:97;box-shadow: rgba(0, 0, 0, 0.1) 0 0 3px 0 ;overflow:hidden}
.tool:after{content:""; clear:both; display:block;}
.tool li {border-bottom:1px solid #d0d7df}
.tool li:last-child{border-bottom:none}
.tool li:hover, .tool li.on{background:#009982}
.tool li > a > span{display:none}
.tool li > a {display:block;background:url(../read/images/tool.png); width:44px;height:44px}
.tool li > a.tool1 {background-position:0px 0px;}
.tool li > a.tool1:hover,
.tool li.on > a.tool1 { background-position:44px 0px ;}
.tool li > a.tool2 { background-position:0px -44px ;}
.tool li > a.tool2:hover,
.tool li.on > a.tool2 {background-position:44px -44px;}
.tool li > a.tool3 { background-position: 0px -88px;}
.tool li > a.tool3:hover,
.tool li.on > a.tool3 {background-position:44px -88px;}

.selmap{border-radius:4px;background:#fff;position:absolute; right:15px; top:384px; z-index:97;box-shadow: rgba(0, 0, 0, 0.1) 0 0 3px 0 ;overflow:hidden;border:none;}
.selmap:after{content:""; clear:both; display:block;}
.selmap li {border-bottom:1px solid #d0d7df}
.selmap li:last-child{border-bottom:none}
.selmap li:hover, .selmap li.on{background:#009982;color:#fff}
.selmap li > a {color:#555555;display:block; width:44px;height:44px;text-align:center;line-height:44px;padding:0;}
.selmap li:hover a, .selmap li.on > a{color:#fff}

.btn_legend{background:#fff url(../read/images/btn_legend.png) 0 0 no-repeat;border-radius:4px; width:44px;height:44px;position:absolute; right:15px; bottom:15px; z-index:97;box-shadow: rgba(0, 0, 0, 0.1) 0 0 3px 0 ;}
.btn_legend:hover, .btn_legend.on{background:#009982 url(../read/images/btn_legend.png) 0 -44px no-repeat;}
.btn_legend span{display:none}
.p_legend{background:#fff;border-radius:4px;position:absolute; right:15px; bottom:15px; z-index:97;box-shadow: rgba(0, 0, 0, 0.1) 0 0 3px 0 ;width:180px}
.p_legend h2{font-size:1rem;font-weight:400;color:#333;border-bottom:1px solid #d0d7df;padding:0 10px 0 15px;line-height:38px;}
.p_legend h2 a{margin-top:7px}
.legendlst{font-size:0.813rem;margin:10px 10px 10px 20px}
.legendlst li img{margin-right:5px}
.legendlst li {margin-bottom:4px;}

.btn_location{background:#fff url(../images/btn_location.png) 0 0 no-repeat;border-radius:4px; width:44px;height:44px;position:absolute; left:15px; bottom:15px; z-index:97;box-shadow: rgba(0, 0, 0, 0.1) 0 0 3px 0 ;}
.btn_location:hover, .btn_location.on{background:#009982 url(../images/btn_location.png) 0 -44px no-repeat;}
.btn_location span{display:none}
.p_location{background:#fff;border-radius:4px;position:absolute; left:15px; bottom:15px; z-index:97;box-shadow: rgba(0, 0, 0, 0.1) 0 0 3px 0 ;width:360px}
.p_location h2{font-size:1rem;font-weight:400;color:#333;border-bottom:1px solid #d0d7df;padding:0 10px 0 15px;line-height:38px;}
.p_location h2 a{margin-top:7px}
.loca_add {width:24px;height:24px;border:1px solid #919da8;border-radius:3px;display:inline-block;background-color:#fff;background-image:url(../images/ic_map.png);background-position:0 -24px ;background-repeat:no-repeat}
.loca_add:hover,
.loca_add.on{border:1px solid #3055cd;}
.loca_del {width:24px;height:24px;border:1px solid #919da8;border-radius:3px;display:inline-block;background-color:#fff;background-image:url(../images/ic_map.png);background-position:0 0 ;background-repeat:no-repeat}
.loca_del:hover,
.loca_del.on{border:1px solid #e43d35;}
.loca_add span, .loca_del span{display:none}
.locabx{position:relative;max-height:225px;overflow-y:auto;font-size:0.813rem;margin: 0 10px 10px 10px;}

.btn_mapsch{background:#fff url(../read/images/btn_mapsch.png) 0 0 no-repeat;border-radius:4px; width:44px;height:44px;position:absolute; left:15px; top:15px; z-index:97;box-shadow: rgba(0, 0, 0, 0.1) 0 0 3px 0 ;}
.btn_mapsch:hover, .btn_mapsch.on{background:#009982 url(../read/images/btn_legend.png) 0 -44px no-repeat;}
.btn_mapsch span{display:none}
.p_mapsch{background:#fff;border-radius:4px;position:absolute; left:15px; top:15px; z-index:97;box-shadow: rgba(0, 0, 0, 0.1) 0 0 3px 0 ;width:360px}
.p_mapsch h2{font-size:1rem;font-weight:400;color:#333;border-bottom:1px solid #d0d7df;padding:0 10px 0 15px;line-height:38px;}
.p_mapsch h2 a{margin-top:7px}
.mapschbx{margin:10px 0;border-bottom:1px dotted #bec9cf;padding-bottom:10px}
.mapschbx .ip_schbx{margin:0 10px}
.ip_schbx{border:1px solid #c8d0da;display:inline-block;border-radius:3px;height:30px;line-height:1;background-color:#fff;}
.ip_schbx:after{content:""; clear:both; display:block;}
.ip_schbx input{height:26px!important;border:none;}
.ip_schbx button{background-color:#fff;border:none;border-radius:0px;border-left:1px solid #c9d4dd;width:32px;background-image:url(../images/ic_schbtn.png);background-repeat: no-repeat;background-position:0 0;min-height:30px;}
.ip_schbx button:hover{background-position:0 -28px}

.infotxt{padding:5px;font-size:0.75rem;margin:0 10px;line-height:14px;background-image:url(../read/images/bul_infotxt.gif);background-position:5px center;background-repeat:no-repeat;text-indent:20px;background-color:#f3f6f9;border-radius:3px;border:1px solid #c9d4dd}
.resultTxt{margin:0px 10px 0 10px;height:26px;color:#333;line-height:26px;font-size:0.813rem;text-indent:5px}
.resultTxt strong{color:#fe4801;font-weight:normal;margin-left:10px}
.resultbx{position:relative;height:400px;overflow-y:auto;font-size:0.813rem;border-top:1px solid #919da8;border-bottom:1px solid #919da8;margin: 0 10px 10px 10px;}
.resultbx > ul{margin:0 0px;}
.resultbx > ul > li{border-bottom:1px dotted #ccc;padding:7px;position:relative;color:#333;}
.resultbx > ul > li > img{float:left;margin-right:5px;}
.resultbx > ul > li > div{width:calc(100% - 30px);float:left}
.resultbx > ul > li h4{font-weight:500;color:#000}
.resultbx > ul > li p span{border:1px solid #c9d4dd;border-radius:3px;font-size:0.75rem;text-align:center;width:35px;display:inline-block;line-height:16px;margin-right:5px;color:#828c96;background-color:#fff}
.resultbx > ul > li p {color:#555;line-height:16px;}
.resultbx > ul > li p + p{margin-top:5px;}
.resultbx > ul > li:after{content:""; clear:both; display:block; }
.resultbx > ul > li:hover,
.resultbx > ul > li.active{background:#e1f7f6}
.resultbx > ul > li > span{display:block;color:#767676;padding-top:5px;}
.resultbx > ul > li:last-child{border-bottom:none}

.graybx{font-size:0.813rem;background-color:#f3f6f9;border-radius:3px;border:1px solid #c9d4dd}
.mwbx p input{height:20px;line-height:18px}
.mwbx p button{height:24px;padding:0 5px;}

/*infowindow*/
.infowindow{position:absolute; z-index:99998;min-width:300px;max-width:300px;}
.infoContent{border:1px solid #767676;padding:0px;background:#fff;border-radius:4px;overflow:hidden}
.infowindow .info_title { position:relative; display:block;background:#eef3f9;line-height:40px;text-indent:15px;border-bottom:1px solid #e1e9f3}
.infowindow .info_title strong { font-size:16px; font-weight:400; color:#193d7e; }
.infowindow .info_title .info_close { position:absolute; right:8px; top:0px;}
.infowindow .info_cnt { display:block; padding:10px 15px; background:#fff; }
.infoTail{background:url(../images/infoTail.png) 0 0 no-repeat;width:29px;height:26px;position:absolute;left:45%;bottom:0;}

.infolst:after{content:""; clear:both; display:block;}
.infolst > li{color:#222;margin-bottom:5px;position:relative;line-height:1.3}
.infolst > li:after{content:""; clear:both; display:block; }
.infolst > li:last-child{margin-bottom:0}
.infolst > li > label{text-indent:8px;display:block;color:#777;font-weight:400;float:left;width:90px}
.infolst > li > label:before { position: absolute;top:7px; left: 0; width: 3px; height: 3px; background-color: #009982; border-radius: 0px;-webkit-box-flex: 0; -ms-flex: 0 0 auto;  flex: 0 0 auto; content: '';}
.infolst > li > span{display:block;float:left;width:calc(100% - 100px);margin-left:5px;}


/*stats*/
.statsbx{ position:absolute; bottom:0px;top:0;right:0;left:0px; z-index:9999998; box-shadow:0px 0px 3px 0px rgba(0,0,0,0.1); transform: scale(1); transition:all .4s; background-color:#fff;}
.statsbx2{ position:absolute; bottom:0px;top:60px;right:0;left:0px; z-index:99; box-shadow:0px 0px 3px 0px rgba(0,0,0,0.1); transform: scale(1); transition:all .4s; }

.statstit{padding:0 30px;font-weight:normal;font-size:0.875rem;line-height:40px}
.statstit b{font-size:1rem;color:#111;font-weight:400}
.statstit span{color:#000}
.btn_excel{border-radius:3px;background-color:#fff;background-image: url(../images/ic_excel.png); background-position: 5px 0; background-repeat: no-repeat;color:#333;border:1px solid #99a5bc;padding-left:25px;line-height:24px;padding-right:5px}
.btn_excel:hover{border:1px solid #009982;color:#009982; background-position: 5px -24px;}

.btn_back {float:right;background :url(../images/btn_back.png) 0 0 no-repeat;display:block;width:28px;height:28px;margin:10px 10px 0 0}
.btn_back span{display:none}

.stats_panel{margin:25px;min-height:calc(100% - 100px);}
.stats_panel li{border:1px solid #d0d7df;border-radius:5px;width:calc((100% / 3) - 12px);float:left;margin:5px;}
.stats_panel li h4{background:#e1f6ee;padding:0 10px;color:#111;font-weight:400;font-size:1rem;line-height:40px;border-bottom:1px solid #d0d7df}
.stats_panel li a{float:right;display:block;width:24px;height:24px;background-color:#fff;border:1px solid #9094a4;border-radius:30px;margin-top:7px;background-image :url(../images/btn_more.png);background-position: 0 0;background-repeat:no-repeat}
.stats_panel li a:hover{background-position:0 -24px;border:1px solid #009982}
.stats_panel li a span{display:none}
.stats_panel li > div{height:calc(100% - 40px)}

.bgmapbx{background:url(../images/bg_map.png) center center no-repeat; background-size:auto 100%;}

.dashboardbx .chartbx{display:block;height:320px}
.dashboardbx .fl{display:flex;align-items:center;min-height:100%}
.dashboardbx .bgmapbx{position:relative;margin:40px auto 0}
.dashboardbx .bgmapbx div{width:200px;height:200px;position:absolute;}

.playbx{position:absolute; left:20px; top:20px; z-index:98;border-radius:3px;border:1px solid #c9d4dd;height:36px;line-height:36px;padding:0px;overflow:hidden;background:#fff}
.playbx > span{line-height:36px;float:left;padding-left:10px}
.playbx .ic_play{padding:0!important;width:36px;height:36px;background-image: url(../images/ic_play.png);background-position:0 0;border:none; border-left:1px solid #c9d4dd ;float:left;}
.playbx .ic_play:hover, .playbx .ic_play.active{background-position:-36px 0 ;}
.playbx .ic_play span{display:none;}
.playbx .ic_pause{padding:0!important;width:36px;height:36px;background-image: url(../images/ic_pause.png);background-position:0 0;border:none; border-left:1px solid #c9d4dd ;float:left;}
.playbx .ic_pause:hover, .playbx .ic_pause.active{background-position:-36px 0 ;}
.playbx .ic_pause span{display:none}
.playbx .play_slider{position:relative;padding:0 10px;margin-top:11px;float:left}
.playbx .range-handle { border-radius: 3px; width: 8px;top:-1px}
.playbx .range-bar {height: 13px;border-radius:2px ;}
.playbx .range-quantity { border-radius: 2px;background-color:#009982}

.stats_lst{border-radius:5px;margin:30px 0 0;width:100%}
.stats_lst:after{content:""; clear:both; display:block;}
.stats_lst h2{padding:20px 0px 0px;font-weight:normal;font-size:1.5rem;line-height:30px;}
.stats_lst > li{position:relative;border-radius:10px;margin-bottom:20px}
.stats_lst > li:last-child{margin-bottom:0}
.stats_lst > li:after{content:""; clear:both; display:block;}   
.stats_lst > li ul{padding:0px 10px;float:left;width:calc(100% - 200px);margin:10px;border-radius:5px}
.stats_lst > li ul:after{content:""; clear:both; display:block;}
.stats_lst > li ul> li {position:relative;text-indent:10px;font-size:1.5rem;color:#000;line-height:1.7}
.stats_lst > li ul> li label{display:inline-block;margin-right:4px;color:#333}
.stats_lst > li ul> li label:before{ position: absolute;top:50%; left: 10px; width: 3px; height: 3px;border-radius: 0px;-webkit-box-flex: 0; -ms-flex: 0 0 auto;  flex: 0 0 auto; content: '';background-color: #000;}
.stats_lst .pbx{width:120px;height:120px;margin:10px 20px 10px;font-size:1.25rem;text-align:center;float:left;}
.stats_lst .pbx b{font-weight:400;font-size:3rem;line-height:1.5}
.stats_lst > li ul.bg1{background-color:#fc7474}
.stats_lst > li ul.bg2{background-color:#f88d2f}
.stats_lst > li ul.bg3{background-color:#cb96cc}
.stats_lst > li ul.bg4{background-color:#58d7ba}
.stats_lst > li ul.bg5{background-color:#4fadc9}

.dark{background-color:#2f3b52;}
.dark .stats_lst h2{color:#eee;}
.dark .stats_lst .pbx b{color:#fff854}
.dark .stats_lst .pbx {color:#eee}
.dark .stats_lst > li{background:#20293c;border:1px solid #20293c}
.dark .bgmapbx{background:url(../images/bg_map_dark.png) center center no-repeat;}

.white{background-color:#fff}
.white .stats_lst > li{background:#fff;border:1px solid #d0d7df}
.white .stats_lst h2{color:#333;}
.white .stats_lst .pbx b{color:#00806c}
.white .stats_lst .pbx {color:#777777}


.chart1{top:40px;left:240px}
.chart2{top:70px;right:210px}
.chart3{top:250px;left:270px}
.chart4{top:470px;left:210px}
.chart5{top:370px;right:210px}

.dashboardbx .detailbx h2{font-size:1rem;line-height:50px}
.dashboardbx .detailbx h2 a{font-size:1.25rem}
.dashboardbx .detailbx li{font-size:1rem;}
.dashboardbx  .detailbx li label{width:70px}

.dark .detailbx{border:1px solid #5c6b8a;background:#20293c}
.dark .detailbx:after{content:""; clear:both; display:block;}
.dark .detailbx h2{border-bottom:1px solid #5c6b8a;color:#ddd}
.dark .detailbx h2 a{color:#fff;}
.dark .detailbx h2 a:hover{color:#65cdff;}
.dark .detailbx li{color:#fff;}
.dark .detailbx li label{color:#ddd}
.dark .detailbx li label:before{ background-color: #18e2c3;}
