@charset "utf-8";
/*================================================ Layout ================================================*/
html {font-size:10px}
body {width:100%;min-height:100%; font-family:"맑은 고딕","malgun gothic",helvetica,"Apple SD Gothic Neo",sans-serif;font-size:1.4rem;font-weight:400;line-height:1.5;letter-spacing:-.05em;color:#222;word-break:break-all;word-wrap:break-word; min-width: 1280px;}

body{background-color:#f1f1f8;}
/* .wrapper{position:relative; height:100vh;min-height:100vh;} */
.wrapper{position:relative; height:100vh;min-height:840px;}
.wrapper header{background-color:#373f52;}
.wrapper header::after{content:'';display:block;clear:both}
.wrapper header >div{float:left; margin-left:20px;}
header >div.info{width:184px;margin-left:0;}
header .info h1 a{display:block; width:100%;height:100px; background:url('../images/logoRed.PNG') no-repeat 0 0;background-size:100%; text-indent:-9999px}
header .info >div{position:relative; padding:16px 15px}
header .info >div strong{font-size:14px;font-weight:700;color:#fff;}
header .info >div strong em{display:inline-block; margin-top:-4px;padding:0 6px; border-radius:7px; background-color:#ddd; font-size:10px;font-weight:400;vertical-align:middle;}
header .info >div strong .su{background-color:#437bfe;}
header .info >div p{font-size:12px;color:#fff;}
header .info >div .btn-logout{position:absolute;top:calc(50% - 9px);right:15px; width:18px;height:18px; background:url('../images/icon_logout.svg') no-repeat 0 0;background-size:100%; text-indent:-9999px}
header >div.weather{min-width:200px;padding:9px 0;}
header .weather strong{display:block; font-size:14px;line-height:24px;font-weight:700;color:#fff;}
header .weather .img{width:24px; vertical-align:top;}
header .weather p{padding-left:20px; background:url('../images/icon_map.svg') no-repeat 0 0;background-size:18px; font-size:12px;color:#bfc4cb}
header >div.time{min-width:300px;padding:9px 0;}
header .time strong{display:block; font-size:14px;line-height:24px;font-weight:700;color:#fff;}
header .time p{padding-left:20px; background:url('../images/icon_time.svg') no-repeat 0 0;background-size:18px; font-size:12px;color:#bfc4cb}
header >div.expand{float:right; padding:16px 20px;margin:0;}
header .expand .fm-select{display:inline-block; width:150px;margin-left:20px;}
header .expand .fm-select:first-child{margin-left:0;}
header .expand .fm-select select{height:28px; border-color:#6c7e97; line-height:28px;color:#fff;}
header .expand .fm-select::after{content:'';display:block;position:absolute;top:calc(50% - 9px);right:10px; width:18px;height:18px; background:url('../../static/images/select_arrow02.svg') no-repeat 0 0;background-size:100%;}
header .expand .div-nms {display: inline-block; width: 150px;}
header .expand .div-nms span {padding: 10px 7px; cursor: pointer;}
header .expand .div-nms a{color: #fff !important; font-weight: bold;}

.wrapper .container{position:relative; height:calc(100% - 131px);padding-left:184px; display: table;}
.wrapper .container.winPopup{position:relative; height:calc(100% - 131px);padding-left:5px; display: table; padding-top: 50px;}
.wrapper .container nav{position:absolute;top:0;bottom:0;left:0;overflow-y:auto; width:184px;padding:10px 10px 35px 5px; background-color:#fff;}
.wrapper .container nav::-webkit-scrollbar{width:8px;}
.wrapper .container nav::-webkit-scrollbar-thumb{height:30%; border-radius:10px;background-color:#bfc4cb;}
.wrapper .container nav::-webkit-scrollbar-track{background-color:#f1f1f8;}
/* lnb */
nav >ul {}
nav >ul > li {}
nav >ul > li > a {display:block;position:relative; padding:13px 10px 5px; font-size:14px;font-weight:700;color:#373f52; height: 45px;}
nav >ul > li > a::after{content:'';display:block;position:absolute;top:calc(50% - 10px);right:10px; width:18px;height:18px; background:url('../../static/images/bul_arrow02.svg') no-repeat 0 0;background-size:100%;transition:all .5s; transform: rotate(180deg);}
nav >ul > li.on > a::after{transform: rotate(0deg);}
nav >ul > li a:hover{border-radius:5px;color:#437bfe;}
nav >ul > li ul {display:none;}
nav >ul > li > ul > li > a {display:block; padding:13px 10px 5px;  font-size:12px;color:#434a5b;height: 45px;}
nav >ul > li > ul > li.on a {border-radius:5px;background-color:#f1f1f8;}
nav >ul .active a{border-radius:5px;background-color:#f1f1f8;}
nav >ul li.noDepth a::after{display:none;}

.wrapper .container .contant-wrap{position:relative;top:-71px;height:calc(100% + 71px); padding:0 20px 0 10px; background-color:#f1f1f8;}
.wrapper .container .contant-wrap .breadcrumb{padding:10px 10px 15px;}
.wrapper .container .contant-wrap .breadcrumb span{display:inline-block; font-size:12px;line-height:18px;color:#7f8998;vertical-align:top;}
.wrapper .container .contant-wrap .breadcrumb span +span::before{content:'';display:inline-block; width:18px;height:18px; background:url('../../static/images/bul_arrow03.png') no-repeat 0 0;background-size:100%;vertical-align:top;}
.wrapper .container .contant-wrap .breadcrumb span:last-child{color:#434a5b;}
.wrapper .container .contant-wrap .contants{height:calc(100% - 131px); display: table-row;}
.wrapper .container .contant-wrap .contants::-webkit-scrollbar{width:8px;}
.wrapper .container .contant-wrap .contants::-webkit-scrollbar-thumb{height:30%; border-radius:10px;background-color:#bfc4cb;}
.wrapper .container .contant-wrap .contants::-webkit-scrollbar-track{background-color:#f1f1f8;}
.wrapper .container .contant-wrap .contants >div{padding:20px 20px 40px; background-color:#fff;box-shadow:0 2px 16px 0 rgba(0, 0, 0, 0.1);}
.wrapper .container .contant-wrap .contants .cont-fill{height:100%; border-radius:8px; overflow-y:auto}
.wrapper .container .contant-wrap .contants .cont-inner{border-radius:8px;}
.wrapper .container .contant-wrap .contants .cont-inner +.cont-inner{margin-top:15px;}
.wrapper .container .contant-wrap .contants .cont-half{display:flex;justify-content:space-between;}
.wrapper .container .contant-wrap .contants .cont-half >div{width:calc(50% - 5px);}

/*================================================ Commom ================================================*/
.h2tit h2{font-size:2.4rem;font-weight:700;color:#373f52;}
.h2tit p{margin-top:5px; font-size:1.4rem;color:#7f8998;}
.h3tit{padding:10px 0; border-bottom:1px solid #373f52;}
.h3tit:first-child{padding-top:0;}
.h3tit.between{display:flex;justify-content:space-between;align-items:center;}
.h3tit h3{display:inline-block; margin-right:20px; font-size:1.6rem;line-height:3.6rem;font-weight:700;color:#434a5b;}
.h3tit p{font-size:14px;color:#373f52;}
.h3tit .btn-wrap{margin:0;}
.h3tit .btns{width:100px;}
.h3tit .btns:last-child{margin-right:0;}
.h4tit{padding:10px; border-top:1px solid #d9dce0;border-bottom:1px solid #d9dce0;}
.h4tit h4{display:inline-block; margin-right:10px; font-size:1.4rem;line-height:3rem;font-weight:700;color:#434a5b;}
.h5tit{padding:10px 5px;}
.h5tit h5{display:inline-block; margin-right:10px; font-size:1.2rem;line-height:1.5rem;font-weight:700;color:#434a5b;}
.wrapper section +section{margin-top:30px;}
.flexbetween {display:flex;justify-content:space-between;align-items:center;}

.requisite{position:relative; padding-left:10px;}
.requisite::before{content:'';display:block;position:absolute;top:calc(50% - 2px);left:0;  width:4px;height:4px; background-color:#ff3e3e;}
.control{padding:10px 0;}
.control:first-child{padding-top:0;}
.control::after{content:'';display:block;clear:both;}
.control .desc{margin-left:10px; font-size:12px; display: inline-block;}
.control .btn-wrap{margin:0;}
.control .btns{padding:7px 15px 8px;margin:0 5px; font-size:1.2rem;}
.control .btns:last-child{margin-right:0;}
.control .btns.excel::before{content:'';display:inline-block; width:12px;height:12px;margin-right:5px; background:url('../../static/images/icon_excel.png') no-repeat 0 0;background-size:100%; vertical-align:middle;}
.control .datepicker .fm-focus{display:inline-block; margin-left:10px;}
.control .datepicker .fm-label{margin:0;}
.btn-download{display:inline-block; padding-left:20px;margin-top:10px; background:url('../../static/images/btn_download.png') no-repeat 0 0;background-size:18px; font-size:12px;font-weight:500;color:#437bfe;text-decoration:underline;}
/* main */
.main.wrapper .contant-wrap{top:0; height:100%;padding-bottom:15px;}
.main.wrapper .contant-wrap .contants{position:relative;top:-61px; height:calc(100vh - 100vh); display:flex;flex-wrap:wrap;}
.main.wrapper .contants section{position:relative;width:calc(100% - 5px);height:205px; margin:10px 0 0;padding:10px 20px; border-radius:8px;background-color:#fff; box-shadow:0 2px 16px rgba(55, 63, 82, 0.1);}
/* .main.wrapper .contants section{position:relative;width:calc(50% - 5px);height:205px; margin:10px 0 0;padding:10px 20px; border-radius:8px;background-color:#fff; box-shadow:0 2px 16px rgba(55, 63, 82, 0.1);} */
.main.wrapper .contants section:nth-child(-n + 2){margin-top:10;}
.main.wrapper .contants section:nth-child(3n + 2){margin-left:0px;}
.main.wrapper .contants section.full{width:100%; height: 300px;}
.main.wrapper section .tit.between{display:flex;justify-content:space-between;align-items:center;}
.main.wrapper section .tit h3{display:inline-block; margin-right:10px; font-size:1.6rem;font-weight:700;color:#434a5b; margin-bottom: 5px;}
.main.wrapper section .tit .btn_more{padding-right:16px; background:url('../../static/images/bul_arrow03.png') no-repeat 38px center;background-size:18px; font-size:12px;color:#8b909a;}
.main.wrapper .board .total{margin-top:6px;}
.main.wrapper .board .total p{display:inline-block;margin-right:10px; color:#434a5b;}
.main.wrapper .board .total p strong{font-size:24px;font-weight:700;}
.main.wrapper .board .total span{ font-size:12px;color:#7f8998;}
.main.wrapper .board .total span +span::before{content:'';display:inline-block; width:1px;height:11px;margin:0 5px -1px; background-color:#7f8998; vertical-align:baseline;}
.main.wrapper .board ul{display:flex;justify-content:space-between; width:100%;margin-top:12px;}
.main.wrapper .board li{flex: 1; margin-right: 10px; height:107px;padding-top:33px; border-radius:8px; font-size:24px;font-weight:700;color:#fff;text-align:center}
.main.wrapper .board li p{font-size:14px;}
.main.wrapper .board .charging{background:#0dbda8 url('../../static/images/icon_board_charging.svg') no-repeat center 16px;background-size:18px;}
.main.wrapper .board .wait{background:#437bfe url('../../static/images/icon_board_wait.svg') no-repeat center 16px;background-size:18px;}
.main.wrapper .board .book{background:#9949ff url('../../static/images/icon_board_book.svg') no-repeat center 16px;background-size:18px;}
.main.wrapper .board .check{background:#ff7a00 url('../../static/images/icon_board_check.svg') no-repeat center 16px;background-size:18px;}
.main.wrapper .board .error{background:#7f8998 url('../../static/images/icon_board_error.svg') no-repeat center 16px;background-size:18px;}
.main.wrapper .operation .chart-wrap{position:relative; margin-top:10px;padding-top:51px;}
.main.wrapper .operation .chart-wrap .work{position:absolute;top:0;left:20px; width:136px;padding-left:62px; background:url('../../static/images/icon_operation.png') no-repeat 0 center;background-size:52px;}
.main.wrapper .operation .chart-wrap .work p{color:#434a5b;}
.main.wrapper .operation .chart-wrap .work strong{font-size:24px;font-weight:800;color:#434a5b;}
.main.wrapper .operation .chart-wrap .work strong span{margin-left:3px; font-size:16px;font-weight:400;}
.main.wrapper .operation .chart-wrap .not{left:auto;right:20px; background:url('../../static/images/icon_operation02.png') no-repeat 0 center;background-size:52px;}
.main.wrapper .operation .chart-wrap .chart{width:200px;height:100px;margin:0 auto;}
.main.wrapper .sales .tit span{font-size:12px;color:#7f8998;}
.main.wrapper .sales-wrap{display:flex;justify-content:space-between;}
.main.wrapper .sales-wrap .info{margin-top:13px; min-width: 200px;}
.main.wrapper .sales-wrap .info dl{margin:12px 0 ; color:#434a5b;}
.main.wrapper .sales-wrap .info dl:first-child{margin-top:0;}
.main.wrapper .sales-wrap .info dt{line-height:1.3; padding: 7px 5px;}
.main.wrapper .sales-wrap .info dd{padding: 7px 5px;}
.main.wrapper .sales-wrap .info dd strong{margin-right:3px; font-size:16px;font-weight:700;}
.main.wrapper .sales-wrap .info dd span{margin-left:6px; font-size:11px;color:#437bfe;}
.main.wrapper .sales-wrap .chart-wrap{width:780px;margin-top:-28px; text-align:right; height: 150}
/* 20221006 화면 사이즈 별 대시보드 아이템 너비 수정 시작 */
@media (max-width: 1280px){
	.wrapper{min-height:840px;}
	.main.wrapper .contants section{height:205px; }
	.main.wrapper .board li{width:85px;}
	.main.wrapper .sales-wrap .chart-wrap{width:780px !important;}

}
@media (min-width: 1680px){
	.wrapper{min-height:935px;}
	.main.wrapper .contants section{height:250px; }
	.main.wrapper .board li{width:110px;}
	.main.wrapper .sales-wrap .chart-wrap{width:1180px !important;}
}
/* 20221006 화면 사이즈 별 대시보드 아이템 너비 수정 끝 */
.main.wrapper .sales-wrap .chart-control{display:inline-block;position:relative; padding:2px 5px; border-radius:5px;background-color:#f1f1f8;}
.main.wrapper .sales-wrap .chart-control::before{content:'';display:block;position:absolute;top:2px; width:78px;height:22px; border:1px solid #d9dce0;border-radius:5px;background-color:#fff;transition:all .3s}
.main.wrapper .sales-wrap .chart-control button{position:relative; width:80px;height:24px; color:#434a5b;opacity:.5;}
.main.wrapper .sales-wrap .chart-control button.active{opacity:1;}
.main.wrapper .sales-wrap .chart-control.btn0::before{left:5px;}
.main.wrapper .sales-wrap .chart-control.btn1::before{left:89px;}
.main.wrapper .sales-wrap .chart-control.btn2::before{left:173px;}
.main.wrapper .sales-wrap .legend{margin-top:4px;}
.main.wrapper .sales-wrap .legend li{display:inline-block;margin-left:13px; font-size:10px;color:#7f8998;}
.main.wrapper .sales-wrap .legend li::before{content:'';display:inline-block;width:10px;height:10px;margin-right:3px; vertical-align:middle;}
.main.wrapper .sales-wrap .legend li:nth-child(1)::before{background-color:#0dbda8;}
.main.wrapper .sales-wrap .legend li:nth-child(2)::before{height:2px; background-color:#437bfe;}
.main.wrapper .sales-wrap .chart{position:relative; height:200px;padding:10px 50px;}
.main.wrapper .sales-wrap .chart .bar-wrap{display:flex;flex-direction:row;justify-content:space-between; height:100%; text-align:center}
.main.wrapper .sales-wrap .chart .bar-wrap .bar{position:relative; width:100%;}
.main.wrapper .sales-wrap .chart .bar-wrap .bar .tick{position:absolute;bottom:-17px;left:0;right:0; padding:2px 0 0; font-size:10px;color:#373f52;}
.main.wrapper .sales-wrap .chart .bar-wrap .bar .tick::after{content:'';display:block;position:absolute;top:0;right:0; width:1px;height:6px;background-color:#d9d9d9;}
.main.wrapper .sales-wrap .chart .bar-wrap .bar:first-child .tick::before{content:'';display:block;position:absolute;top:0;left:0; width:1px;height:6px;background-color:#d9d9d9;}
.main.wrapper .sales-wrap .chart .bar-wrap .bar span{display:block;position:absolute;bottom:0;left:calc(50% - 7px); width:14px; border-radius:2px 2px 0 0;background-color:#0dbda8; cursor:pointer;}
.main.wrapper .sales-wrap .chart .bar-wrap .bar.active span{background-color:#0a9988;}
.main.wrapper .sales-wrap .chart .bar-wrap .bar::after{content:'';display:block; position:absolute;top:0;left:0;right:0;bottom:0;z-index:1;}
.main.wrapper .sales-wrap .chart svg{position:absolute;top:0;left:0;}
.main.wrapper .sales-wrap .chart .sec{display:block;}
.main.wrapper .sales-wrap .chart .bg{fill:none;}
.main.wrapper .sales-wrap .chart .line{fill:none;stroke:#437bfe;stroke-width:2px}
.main.wrapper .sales-wrap .chart .dot{fill:#fff;stroke:#437bfe;stroke-width:2px}
.main.wrapper .sales-wrap .chart .dot.active{fill:#437bfe}
.main.wrapper .sales-wrap .chart .axis{position:absolute;top:10px;bottom:5px;left:0;right:0;}
.main.wrapper .sales-wrap .chart .axis ul{display:flex;flex-direction:column-reverse;justify-content:space-between; height:100%}
.main.wrapper .sales-wrap .chart .axis li{display:flex;justify-content:space-between; position:relative; line-height:0;}
.main.wrapper .sales-wrap .chart .axis li::before{content:'';display:block;position:absolute;left:50px;right:50px;top:0; height:1px; background-color:#d9d9d9;}
.main.wrapper .sales-wrap .chart .axis li span{display:block; width:40px;margin-top:-5px; font-size:10px;line-height:1;color:#373f52;letter-spacing:0}
.main.wrapper .sales-wrap .chart .axis li span +span{text-align:left;}
.main.wrapper .sales-wrap .chart .tootip{display:none; position:absolute; width:120px; padding:3px 7px 5px 5px; border-radius:4px;background-color:#0a9988; font-size:11px;line-height:1.2;color:#c1e5e1;text-align:left; transform:translate(-50%,0);transition:all .5s}
.main.wrapper .notice-list{margin-top:10px;}
.main.wrapper .notice-list li{margin-top:13px;}
.main.wrapper .notice-list li:first-child{margin-top:0;}
.main.wrapper .notice-list li a{display:flex;justify-content:space-between;}
.main.wrapper .notice-list li p{position:relative; max-width:410px;padding-right:40px; font-size:12px;color:#727784; white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.main.wrapper .notice-list li .date{font-size:12px;color:#9498a2;}
.main.wrapper .notice-list li.notice p{font-weight:700;}
.main.wrapper .notice-list li.new p::after{content:'NEW';display:block;position:absolute;top:2px;right:0; width:32px;padding:2px 0 3px; border-radius:7px;background-color:#ff3e3e; font-size:10px;line-height:1;color:#fff;text-align:center;}
.main.wrapper .error-wrap{top:0;left:0; transform:translate(0,0);}
.main.wrapper .error-wrap .error-board{display:inline-block;}
.main.wrapper .error-wrap .error-board p{display:inline-block;margin-right:5px; font-size:12px;color:#727784;vertical-align:top;}
.main.wrapper .error-wrap .error-board p em{display:inline-block;padding:2px 6px 3px; border-radius:2px;background-color:#d9dce0; font-size:9px;line-height:1;color:#818b9a;}
.main.wrapper .error-wrap .error-board p:first-child em{background-color:#c1deff;color:#5a8dfe;}
.main.wrapper .error-wrap table{margin-top:6px; font-size:12px;color:#727784;text-align:center}
.main.wrapper .error-wrap table th{padding:4px 0; font-weight:700;}
.main.wrapper .error-wrap table td{padding:4px 0 3px;}
.main.wrapper .error-wrap table td:last-child{font-weight:700;color:#ff7a00;}
.main.wrapper .error-wrap table td.process01{color:#ff7a00;}
.main.wrapper .error-wrap table td.process02{color:#437bfe;}
.main.wrapper .error-wrap table td.process03{color:#0dbda8;}
/* 충전소모니터링 */

.wrapper .container .contant-wrap .contants.fullmap{display:flex !important;flex-direction:row; height:100%; margin:0 -20px 0 -10px;}
.wrapper .container .contant-wrap .fullmap .monitoring-wrap{display:flex;flex-direction:column; width:348px;height:100%;padding:0; border-left:1px solid #d9dce0;border-right:1px solid #d9dce0;background-color:#f1f1f8;box-shadow:10px 5px 15px 0 rgb(0,0,0,.05)}
.wrapper .container .contant-wrap .fullmap .map-wrap{position:relative; width:calc(100% - 275px);height:100%;padding:0;}
.monitoring-wrap .tui-pagination .tui-is-selected, .tui-pagination strong { width : 65px; }
.monitoring-wrap .search{padding:15px 10px 0; border-bottom:1px solid #d9dce0;background-color:#fff;}
.monitoring-wrap .search .fm-control{padding-left:30px; border-color:#0dbda8;border-radius:4px;background:url('../../static/images/icon_search.svg') no-repeat 9px center;background-size:18px; font-size:14px;line-height:26px;}
.monitoring-wrap .search .tag{padding:10px 0;}
.monitoring-wrap .search .tag::after{content:'';display:block;clear:both;}
.monitoring-wrap .search .tag span{float:left;padding:1px 10px 3px;margin:5px 5px 5px 0; border:1px solid #d9dce0;border-radius:12px; font-size:12px;color:#434a5b;cursor: pointer;}
.monitoring-wrap .search .tag span em{margin-left:2px; font-weight:700;}
.monitoring-wrap .search .tag .check em{color:#ff7a00}
.monitoring-wrap .search .tag .error em{color:#7f8998}
.monitoring-wrap .search .tag .planed em{color:#9949ff}
.monitoring-wrap .search .tag .wait em{color:#437bfe}
.monitoring-wrap .search .tag .charging em{color:#0dbda8}
.monitoring-wrap .list{display:flex;flex-direction:column; height:calc(100% - 204px);margin-top:5px; background-color:#fff;}
.monitoring-wrap .list >h3{padding:7px 10px; border-top:1px solid #d9dce0;border-bottom:1px solid #d9dce0; font-weight:700;color:#434a5b;}
.monitoring-wrap .list >div{height:100%;margin:0; overflow-y:scroll;}
.monitoring-wrap .list li a{display:block; padding:7px 10px 10px;}
.monitoring-wrap .list li a strong{color:#434a5b;}
.monitoring-wrap .list li a p{font-size:12px;color:#7f8998;}
.monitoring-wrap .list li a >div{display:flex;flex-direction:row; margin-top:4px;}
.monitoring-wrap .list li a >div p{margin-left:10px;padding-right:18px; color:#434a5b;}
.monitoring-wrap .list li a >div p:first-child{margin-left:0;}
.monitoring-wrap .list li a >div p em{display:inline-block;padding:2px 6px 3px; border-radius:2px;background-color:#ebdbff; font-size:9px;line-height:1;color:#9949ff;}
.monitoring-wrap .list li a >div p.speed em{background-color:#c1deff;color:#437bfe;}
.monitoring-wrap .list li a >div p.check{background:url('../../static/images/icon_map_check.svg') no-repeat right center;background-size:12px;}
.monitoring-wrap .list li a >div p.error{background:url('../../static/images/icon_map_error.svg') no-repeat right center;background-size:12px;}
.monitoring-wrap .list li a >div p.inoperative{background:url('../images/icon_incoperative.png') no-repeat right center;background-size:12px;}
.monitoring-wrap .list li a >div p.book{background:url('../../static/images/icon_map_book.svg') no-repeat right center;background-size:12px;}
.monitoring-wrap .list li a >div p.wait{background:url('../../static/images/icon_map_wait.svg') no-repeat right center;background-size:12px;}
.monitoring-wrap .list li a >div p.charging{background:url('../../static/images/icon_map_charging.svg') no-repeat right center;background-size:12px;}
.monitoring-wrap .listpaging{display:flex;flex-direction:column; height:40px;margin-top:0px; background-color:#fff;}
.map-wrap .mapmarker{position:absolute; width:28px;height:28px; border:2px solid #434a5b;border-radius:100%; background:#fff url('../../static/images/ic_logo_imkev.svg') no-repeat center;background-size:18px auto;box-shadow:0 2px 5px 0 rgba(0, 0, 0, .15); transform:translate(-50%, -100%);}
.map-wrap .mapmarker::after{content:'';display:block;position:absolute;top:100%;left:calc(50% - 4px); width:0;height:0; border-top: 6px solid #434a5b;border-left: 4px solid transparent;border-right: 4px solid transparent;}
.map-wrap .mapmarker.check{border-color:#ff7a00}
.map-wrap .mapmarker.check::after{border-top-color:#ff7a00}
.map-wrap .mapmarker.error{border-color:#7f8998}
.map-wrap .mapmarker.error::after{border-top-color:#7f8998}
.map-wrap .mapmarker.book{border-color:#9949ff}
.map-wrap .mapmarker.book::after{border-top-color:#9949ff}
.map-wrap .mapmarker.wait{border-color:#437bfe}
.map-wrap .mapmarker.wait::after{border-top-color:#437bfe}
.map-wrap .mapmarker.charging{border-color:#0dbda8}
.map-wrap .mapmarker.charging::after{border-top-color:#0dbda8}
.map-wrap .mapmarker.active{width:32px;height:32px; background-size:22px auto;}
.map-wrap .maplevel{position:absolute; width:86px;height:40px; border:2px solid #434a5b;border-radius:20px;background-color:#fff; line-height:1.2; color:#434a5b;text-align:center; transform:translate(-50%, -100%);}
.map-wrap .maplevel i{font-size:12px;}
.map-wrap .maplevel strong{display:block; font-size:14px;}
.map-wrap .maplevel.level1{color:#0dbda8;border-color:#0dbda8;}
.map-wrap .maplevel.level2{color:#00a09b;border-color:#00a09b;}
.map-wrap .maplevel.level3{color:#0088a6;border-color:#0088a6;}
.map-wrap .maplevel.level4{color:#005e7b;border-color:#005e7b;}
/* 충전소 상세팝업 */
.layerCharging{display:none;}
.layerCharging .pop-layer{top:60px !important;left:514px !important;width:450px;height:calc(100% - 60px); border:0;border-right:1px solid #d9dce0;background-color:#f1f1f8;}
.layerCharging .pop-layer .header{padding:10px 40px 11px 20px !important; border-bottom:1px solid #d9dce0;background-color:#fff;}
.layerCharging .pop-layer section{margin-top:10px;padding:0 10px 14px; background-color:#fff;}
.layerCharging .pop-layer section.info{display:flex;flex-direction:column; height:calc(100% - 258px)}
.layerCharging .pop-layer .h4tit{margin:0 -10px;}
.layerCharging .pop-layer table th{padding:8px 0 8px 5px; border-bottom:1px solid #d9dce0; font-size:12px;color:#7f8998;text-align:left}
.layerCharging .pop-layer table td{border-bottom:1px solid #d9dce0; font-size:11px;color:#434a5b;}
.layerCharging .pop-layer table.type2 th{border:0;}
.layerCharging .pop-layer table.type2 td{padding:5px 0; border:0;}
.layerCharging .pop-layer .scroll-box{height:100%; margin:0 -10px;padding:0 10px 40px;}
.layerCharging .pop-layer .ui-button .ui-icon{width:18px;height:18px; background:#fff url('../../static/images/select_arrow.svg') no-repeat 0 0;background-size:100%; transition:all .2s}
.layerCharging .pop-layer .ui-selectmenu-button-open .ui-icon{transform:rotate(180deg);}
.layerCharging .pop-layer .selectmenu{display:inline-block; vertical-align:top;}
.ui-selectmenu-button.ui-button{width:300px;padding:5px 10px; border:1px solid #d9dce0;}
.ui-icon.check{background:url('../../static/images/icon_map_check.svg') no-repeat right center;background-size:12px;}
.ui-icon.error{background:url('../../static/images/icon_map_error.svg') no-repeat right center;background-size:12px;}
.ui-icon.book{background:url('../../static/images/icon_map_book.svg') no-repeat right center;background-size:12px;}
.ui-icon.wait{background:url('../../static/images/icon_map_wait.svg') no-repeat right center;background-size:12px;}
.ui-icon.charging{background:url('../../static/images/icon_map_charging.svg') no-repeat right center;background-size:12px;}
/* 충전소 설명 팝업 */
.layerChargerInfo{display:none; position:absolute;margin-top: -250px; margin-left: -120px;}
.layerChargerInfo .pop-layer{width:300px; border:0;border-radius:8px;box-shadow:0 2px 16px 0 rgba(0, 0, 0, .1);}
.layerChargerInfo .pop-layer .header{padding: 10px 20px 0;}
.layerChargerInfo .pop-layer .contents{padding:20px;}
.layerChargerInfo .address{padding-left:34px; background:url('../../static/images/icon_map02.svg') no-repeat 5px center;background-size:24px; font-size:12px;color:#373f52; white-space: break-spaces;}
.layerChargerInfo .tit{display:block;margin-top:8px; font-size:12px;font-weight:700;color:#7f8998;}
.layerChargerInfo .chargers{height:70px;margin-top:5px;}
.layerChargerInfo .chargers >p{margin-top:7px; font-size:12px;color:#434a5b;}
.layerChargerInfo .chargers >p em{display:inline-block; width:48px;padding:2px 0 3px; border-radius:2px;background-color:#c1deff; font-size:9px;line-height:1;font-weight:700;color:#437bfe;text-align:center}
.layerChargerInfo .chargers >p.error em{background-color:#d9dce0; color:#7f8998;}
.layerChargerInfo .chargers >p.stop em{background-color:#ebdbff; color:#9949ff;}
.layerChargerInfo .chargers >p:first-child{margin-top:0;}
/* 로그인 */
.member-wrap{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%); padding:40px 60px; border-radius:8px;background-color:#fff;box-shadow:0 2px 16px 0 rgba(0, 0, 0, 0.1);}
.login{width:420px;}
.login .fm-group{margin-top:35px;}
.login .fm-group +.fm-group{margin-top:15px;}
.login .fm-group .fm-focus{display:block;}
.login .fm-group .fm-control{width:100%;padding:1rem;}
.login .btn-wrap .btns{width:100%;margin:0;}
/* 20221005 변경 시작 */
/* 로그인 박스 사이즈 고정위한 css 변경 */
/* .login .mem-join{margin-top:15px;} */
.login .btn-join {height:20px; margin-top:15px;}
/* 20221005 변경 끝 */

.login .mem-join a{font-size:12px;font-weight:500;color:#437bfe;text-decoration:underline;}
.login .foot{margin-top:40px; font-size:12px;color:#7f8998;text-align:center}
/* 로그인 심사 중 */
.standby{text-align:center}
.standby strong{display:block; padding-top:50px; background:url('../../static/images/icon_exclamation.svg') no-repeat center 0;background-size:32px; font-size:20px;font-weight:700;color:#434a5b;}
.standby p{margin-top:10px; font-size:14px;color:#7f8998;}
.standby .btn-wrap{width:240px; margin:40px auto 20px;}
/* 회원가입 */
.join{position:relative;top:auto;left:auto;transform:translate(0, 0); width:960px;margin:40px auto;}
.join .h2tit +section{margin-top:50px;}
.join .tableX th, .join .tableX td{border-bottom:0;}
.join .tableX th{padding:20px 0; background-color:transparent;}
.join .tableX td{padding:10px;}
.join .tableX tr:first-child th{padding-top:30px;}
.join .tableX tr:first-child td{padding-top:20px;}
.join .tableX th label{font-size:14px;}
.join .tableX .fm-group .fm-control{padding:1rem;}
.join .tableX .fm-select select{height:40px;}
.join .tableX td .btns{width:auto;padding:11px 27px 12px; border:0;border-radius:4px;background-color:#434a5b; font-size:13px;font-weight:700;color:#fff;}
.join .tableX td .btns:hover{width:auto;padding:11px 27px 12px; border:0;border-radius:4px;background-color:#272c39; font-size:13px;font-weight:700;color:#fff;}
.join .btn-wrap{margin-top:30px;}
.imgView::after{content:'';display:block;clear:both;}
.imgView p{float:left;overflow:hidden; width:100px;height:100px;margin-right:10px; border:1px solid #d9dce0;border-radius:4px;background:#f8f9fb url('../../static/images/img_addimg.png') no-repeat center;background-size:24px;}
.imgView p >img{width:100%;}
.imgView +.noti{margin:0;}
/* Bar 차트 */
.barchart{margin-top:-42px;}
.barchart .chart-control{display:inline-block;position:relative;top:0;left:calc(50% - 100px); width:200px;padding:0 26px;}
.barchart .chart-control >input{width:100%;height:32px; border:1px solid #d9dce0; text-align:center}
.barchart .chart-control >button{position:absolute;top:calc(50% - 12px); width:24px;height:24px; background:url('../../static/images/btn_controls.png') no-repeat 0 0;background-size:48px 24px;}
.barchart .chart-control .prev{left:0; background-position:0 0;}
.barchart .chart-control .next{right:0; background-position:right 0;}
.barchart .chart{position:relative; height:300px;padding:0 0 50px 50px;margin-top:30px;}
.barchart .chart .tit{position:absolute;bottom:0; font-size:10px;line-height:1.2;color:#373f52;}
.barchart .chart .bar-wrap{text-align:center}
.barchart .chart .bar-wrap .tit{left:50px;right:0;}
.barchart .chart .bar-wrap .bar-group{display:flex;flex-direction:row;justify-content:space-between; height:250px;}
.barchart .chart .bar-group .bar{position:relative; width:100%;}
.barchart .chart .bar-group .bar .tick{position:absolute;bottom:-25px;left:0;right:0; padding:5px 0; font-size:10px;color:#373f52;}
.barchart .chart .bar-group .bar .tick::after{content:'';display:block;position:absolute;top:0;right:0; width:1px;height:8px;background-color:#d9d9d9;}
.barchart .chart .bar-group .bar:first-child .tick::before{content:'';display:block;position:absolute;top:0;left:0; width:1px;height:8px;background-color:#d9d9d9;}
.barchart .chart .bar-group .bar span{display:block;position:absolute;bottom:0;left:calc(50% - 7px); width:14px; border-radius:2px 2px 0 0;background-color:#0dbda8; cursor:pointer;}
.barchart .chart .bar-group .bar.active span{background-color:#0a9988;}
.barchart .chart .axis{text-align:right;}
.barchart .chart .axis .tit{left:0;}
.barchart .chart .axis ul{display:flex;flex-direction:column-reverse;justify-content:space-between; position:absolute;top:0;bottom:45px;left:0;right:0;}
.barchart .chart .axis li{position:relative; line-height:0;}
.barchart .chart .axis li::before{content:'';display:block;position:absolute;left:50px;right:0;top:0; height:1px; background-color:#d9d9d9;}
.barchart .chart .axis li span{display:block; width:40px;margin-top:-5px; font-size:10px;line-height:1;color:#373f52;letter-spacing:0}
.barchart .chart .tootip{display:none; position:absolute; padding:3px 7px 5px 5px; border-radius:4px;background-color:#0a9988; font-size:10px;line-height:1.3;color:#c1e5e1; transform:translate(-50%,0);transition:all .5s}
/* BarPeriod 차트 */
.barperiodchart{}
.barperiodchart .legend{margin-top:7px; text-align:right}
.barperiodchart .legend li{display:inline-block;margin-left:10px; font-size:10px;color:#7f8998;}
.barperiodchart .legend li::before{content:'';display:inline-block;width:10px;height:10px;margin-right:3px; vertical-align:middle;}
.barperiodchart .legend li:nth-child(1)::before{background-color:#0dbda8;}
.barperiodchart .legend li:nth-child(2)::before{background-color:#b7ebe5;}
.barperiodchart .chart{margin-top:7px; position:relative; height:100px}
.barperiodchart .chart .bar-wrap{display:flex;flex-direction:column;justify-content:space-evenly; height:100%;}
.barperiodchart .chart .bar-wrap .bar{position:relative; height:20px;padding:0 10px 0 50px;}
.barperiodchart .chart .bar-wrap .tick{position:absolute;top:0;left:0;width:50px; font-size:12px;line-height:20px;font-weight:400;color:#434a5b;}
.barperiodchart .chart .bar-wrap .bar span{float:left; width:0;height:100%; animation:scale .5s ease-in-out 1 alternate}
@-webkit-keyframes scale{0%{transform: scaleX(.1);opacity:.5;} 100%{transform: scaleX(1);opacity:1;}}
.barperiodchart .chart .bar-wrap .bar span:nth-of-type(1){background-color:#0dbda8; border-radius:3px 0 0 3px;}
.barperiodchart .chart .bar-wrap .bar span:nth-of-type(2){background-color:#b7ebe5; border-radius:0 3px 3px 0;}
.barperiodchart .chart .bar-wrap .bar.active span:nth-of-type(1){background-color:#077b6d; border-radius:3px 0 0 3px;}
.barperiodchart .chart .bar-wrap .bar.active span:nth-of-type(2){background-color:#0a9988; border-radius:0 3px 3px 0;}
.barperiodchart .chart .axis ul{display:flex;justify-content:space-between; position:absolute;top:0;bottom:0;left:30px;right:-10px;}
.barperiodchart .chart .axis li{position:relative;height:100%; line-height:0;text-align:center}
.barperiodchart .chart .axis li::after{content:'';display:block;width:1px; position:absolute;left:50%;top:0;bottom:0; background-color:#d9d9d9;}
.barperiodchart .chart .axis li span{display:block;position:relative;top:calc(100% + 4px);width:40px; font-size:10px;line-height:1;color:#7f8998;letter-spacing:0}
.barperiodchart .chart .tootip{display:none; position:absolute;top:50%; padding:3px 7px 5px 5px; border-radius:4px;background-color:#0a9988; font-size:10px;line-height:1.3;color:#c1e5e1; transform:translate(0,-50%);transition:all .5s}
/* 약관 개정 */
.terms-view{height:150px;padding:10px;margin:0; text-align:left}
/* error */
.error-wrap{text-align:center; position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);}
.error-wrap .error >div img{height:80px}
.error-wrap .error >strong{display:inline-block; margin-top:40px; font-size:26px;line-height:1.3;color:#212529;font-weight:700;}
.error-wrap .error >p{margin-top:13px; font-size:14px;color:#868e96;word-break:keep-all;}
.error-wrap .btn-bottom{margin-top:60px;}
.error-wrap .btn-bottom a{display:inline-block; width:334px;height:56px; font-size:16px;line-height:56px;color:#fff;font-weight:700; border-radius:8px;background-color:#0dbda8;}
/* popup common */
.wrap-layer-popup.size-s .pop-layer{width:300px;}
.wrap-layer-popup.size-m .pop-layer{width:500px;}
.wrap-layer-popup.size-l .pop-layer{width:720px;}
.wrap-layer-popup.size-xl .pop-layer{width:900px;}
.wrap-layer-popup.size-xxl .pop-layer{width:1380px;}
.wrap-layer-popup .pop-layer .header{padding:10px 20px 0;}
.wrap-layer-popup .pop-layer .contents{padding:20px;}
.wrap-layer-popup .pop-layer .contents .center-position{background: url('../../static/images/map_position.png') no-repeat 0 0;width: 32px;height: 32px; position: absolute; margin: auto; top: 0;right: 0;bottom: 0;left: 0; z-index: 10;}

.pop-layer .h3tit{border-bottom:0;}
.pop-layer .tableX{border-top:1px solid #373f52;}
.pop-layer .noti{margin-top:10px;padding-left:14px;text-indent:-14px; font-size:12px;color:#7f8998;}
.pop-layer .noti:first-child{margin-top:0;}
.pop-layer .btns{margin:0 3px;}
.pop-layer .alert{display:flex;justify-content:center;align-items:center; height:80px; font-size:13px;}
.pop-layer .control{padding:10px 0; border-top:1px solid #373f52;}
.pop-layer .scroll-box.tableY table{margin-left:-1px;}
.pop-layer .scroll-box.tableY table tbody th{border-left:1px solid #d9dce0;border-top:1px solid #d9dce0;background-color:#f8f9fb; font-size:12px;color:#7f8998;}
/* 비밀번호 수정 팝업 */
.layerPwChange .contents{padding:0 20px;}
.layerPwChange .fm-group{display:flex;align-items:center; margin-top:10px;}
.layerPwChange .fm-group .fm-label{width:150px; font-size:12px;font-weight:700;color:#434a5b;}
.layerPwChange .fm-group .fm-focus{flex:1 1 0}
/* 일괄 등록 결과 팝업 */
.layerUploadResult .scroll-box{height:100px;padding:10px; border:1px solid #d3d3d3}
/* 일괄 단가 수정 팝업 */
.layerPrice .control{padding-top:0; border-top:0;}
.layerPrice .control .btn-wrap{margin:-48px 30px 0 0;}

.tableY tbody {cursor:pointer;}
