@charset "utf-8";

* html { height:1px; } /* IE6 */
/* html { filter:expression(document.execCommand("BackgroundImageCache", false, true)); } IE6 */
html:first-child select { padding-right:6px; height:20px; } /* Opera 9 & Below Fix */
html { overflow-y:hidden; }
html { overflow-x:hidden; }
option { padding-right:6px; } /* Firefox Fix */
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, textarea, p, blockquote, table, th, td, input, select, textarea, button { margin:0; padding:0; }
body{width:100%;height:100%}
img, fieldset, button { border:0 none; }
img { vertical-align:top; }
dl, ul, ol, menu, li { list-style:none; }
dl, dt, dd, ul, li, ol { vertical-align:top; }
blockquote, q { quotes:none; }
blockquote:before, blockquote:after, q:before, q:after { content:''; content:none; }
input, select, textarea, button { line-height:1.2; /* 입력폼에서 춤추지 않는 최소 줄간 1.2 */ vertical-align:middle; }
button { border:0 none; background-color:transparent; cursor:pointer; }
body, table, th, td, input, textarea, button { font:12px "돋움", Dotum, arial, Tahoma, sans-serif; color:#777; }
table { border-collapse:collapse; border-spacing:0; }
select { font-size:12px; color:#777; }
a { color:#777; text-decoration:none; }
a:active, a:hover, a:focus { text-decoration:none; }
a:hover { color:#777; }
address, caption, cite, code, dfn, em, var { font-style:normal; font-weight:normal; }
label { cursor:pointer; }
legend { overflow:hidden; visibility:hidden; font-size:0; line-height:0; } /* For Screen Reader */
caption { display:none; }
em, address { font-style:normal; }
hr { display:none !important; visibility:hidden; }


/*map 기능 버튼*/
.ol-zoom {
    visibility: hidden;
}
.ol-control.ol-layerswitcher {
    visibility: hidden;
}


#windowPop {
    position: inherit;
    width: 343px;
    height: 320px;
    right: 50px;
    top: 70px;
    background-color: #313131;
    margin: 0 auto;
    z-index: 9;
    box-shadow: 3px 3px 3px 3px #353535;
    visibility: hidden;
}
#windowPop >:nth-child(1) {
    position: inherit;
    left: 10px;
    top: 6px;
    font-size: 13px;
    color: rgb(117, 117, 117);
    font-family:굴림,Gulim;
    font-weight: bold;
}
#windowPop >:nth-child(2) {
    position: inherit;
    right: 5px;
    top: 5px;
    z-index:20;
}
#windowPop >:nth-child(3) {
    position: inherit;
    top: 25px;
    width: 305px;
    height: 79%;
    left : 11px;
    background-color: #000000;
    overflow: auto;
    padding: 10px;
}
#windowPop >:nth-child(4) {
    position: inherit;
    right: 77px;
    top: 305px;
}
#windowPop >:nth-child(5) {
    position: inherit;
    right: 10px;
    top: 304px;
    font-size: 13px;
    color: rgb(117, 117, 117);
    font-family:굴림,Gulim;
    font-weight: bold;
}

#windowPopListValue >:nth-child(1) {
    height: 20px;
    position: relative;
    color: white;
    font-size: 14px;
    font-family:굴림,Gulim;
}
#windowPopListValue >:nth-child(2) {
    height: 20px;
    position: relative;
    left: 26px;
    color: white;
    font-size: 14px;
    font-family:굴림,Gulim;
}
#windowPopListValue >:nth-child(3) {
    height: 20px;
    position: relative;
    left: 45px;
    color: red;
    font-size: 14px;
    font-weight: bold;
    font-family:굴림,Gulim;
}

#incdOrccOverlay {
    left: -142px;
    top: -152px;
    position: relative;
}

.mapLevel {
    position: relative;
    font-size: large;
    color: white;
    left: 400px;
    text-align: right;
    font-weight: bold;
    top: -32px;
    z-index: 10;
    width: 150px;
}

#busVehicleInfo {
    bottom: 35px;
    left: -177px;
}
#bitInfo {
    bottom: 22px;
    left: -246px;
}

.video-js {
    height: 169px;
}
.ctlrNm {
    text-align: center;
    padding: 7px;
    color: #777;
    background-color: #fff;
    border: 1px solid #bbb;
}
.overlay {
    position: absolute;
    bottom: 20px;
    left: -50px;
}

.wrap_index {
    position: absolute;
    width: 99.4%;
    min-width: 1590px;
    height: 99.1%;
    border-left: 5px solid #a9a9a9;
    border-right: 5px solid #a9a9a9;
    border-top: 5px solid #a9a9a9;
    border-bottom: 5px solid #a9a9a9;
    overflow: hidden;
}
.header {
    width: 100%;
    height: 50px;
    display: flex;
    align-items: center;
    background-color: #313131;
    border-bottom: 5px groove #a9a9a9;
}
/* .header{width:100%;height:65px;background-img:url('/images/application_wall/header.png');border-bottom:5px groove #a9a9a9} */
/* .logo {
    position: absolute;
    width: 1600px;
    left: 50%;
    height: 50px;
    margin: 0 0 0 -800px;
} */
.headerImg {
    height: 40px;
    margin-left: 20px;
}

.headerImg2 {
    position: absolute;
    left:220px;
    height: 50px;
}
.ballImg{
    width: 22px;
}
/* !ie */
.weather_con{
    height: 47px;
    position: absolute;
    left: 229px;
    width: 235px;
    color: white;
    font-size: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: "RixSGo EB";
    text-align: center;
    overflow: hidden;
}
.weather{
    width: 100%;
    height: 100%;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

#clockTime {
    position: absolute;
    left: 988px;
    width: 235px;
    align-items: center;
    display: flex;
    justify-content: center;
    color: white;
    font-size: 24px;
    font-family: "RixSGo EB";
}
/* ie */
/* .weather{position:absolute;top:19px;left:380px;color:white;font-size:20px;font-family:'RixSGo EB'} */
/* #clockTime{position:absolute;top:18px;left:96px;color:white;font-size:20px;font-family:'RixSGo EB'} */
.ml-20 {
    margin-left: 20px;
}
.title-text {
    height: 100%;
    width: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #eee;
    font-size: 14.5px;
    font-weight: bold;
}
.headerBtn {
    position: absolute;
    top: 5px;
    left: 1270px;
}
.itsBtn {
    cursor: pointer;
    width: 60px;
}
.bisBtn {
    cursor: pointer;
    width: 60px;
}
.mapBtn {
    cursor: pointer;
    padding-left: 5px;
    width: 60px;
}
.satalBtn {
    cursor: pointer;
    width: 60px;
}


.itsFclt {
    position: absolute;
    width: 475px;
    left: 1430px;
}
.bisFclt {
    position: relative;
    left: 1100px;
    width: 500px;
    display: none;
}
.itsFcltTitle {
    padding-top: 13px;
    padding-right: 10px;
    width: 70px;
}
.bisFclt {
    padding-right: 10px;
}
.itsAvi,
.itsVMS,
.itsCCTV,
.itsBIT,
.itsDSRC,
.itsSIG,
.itsCCAM {
    cursor: pointer;
    width: 60px;
    height: 50px;
}
.itsVDS {
    cursor: pointer;
    width: 64px;
}
.bisFcltTitle {
    padding-top: 10px;
}

.busListBar {
    position: absolute;
    top: 55px;
    left: -1px;
    z-index: 20;
    display: none;
}
.busListBarHide {
    position: absolute;
    top: 62px;
    left: 253px;
    cursor: pointer;
    z-index: 20;
    display: none;
}
.busListBarShow {
    position: absolute;
    top: 62px;
    left: 0px;
    cursor: pointer;
    z-index: 20;
    display: none;
}

.leftBitOff {
    position: absolute;
    top: 5px;
    left: 6px;
    cursor: pointer;
    height: 39px;
    width: 80px;
}
.leftBusOff {
    position: absolute;
    top: 5px;
    left: 89px;
    cursor: pointer;
    height: 39px;
    width: 80px;
}
.leftLineOff {
    position: absolute;
    top: 5px;
    left: 172px;
    cursor: pointer;
    height: 39px;
    width: 80px;
}

.busList {
    height: 607px;
    width: 259px;
}
#busList {
    position: absolute;
    top: 140px;
    left: 2px;
    width: 250px;
    height: 458px;
    overflow-y: auto;
}
#busList span {
    position: relative;
    left: 5px;
    width: 232px;
    padding-bottom: 50px;
    padding: 8px 0 4px 5px;
    float: left;
    font-size: 15px;
    font-family: "RixSGo EB";
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}
#busList span:hover {
    cursor: pointer;
    font-weight: 900;
}
#busSearch {
    position: absolute;
    top: 63px;
    left: 15px;
    width: 188px;
    height: 40px;
    border: #000000 4px solid;
    font-size: 18px;
    font-family: "RixSGo EB";
}
.busSearchBtn {
    position: absolute;
    top: 66px;
    left: 212px;
    cursor: pointer;
}

/* 시설물현황 */
/*.aviCtlrStts{position:absolute;top:99px;left:870px;text-align:right;z-index:20}*/
/* .vdsCtlrStts {
    position: absolute;
    top: 99px;
    left: 882px;
    text-align: right;
    z-index: 20;
}
.vmsCtlrStts {
    position: absolute;
    top: 124px;
    left: 882px;
    text-align: right;
    z-index: 20;
}
.cctvCtlrStts {
    position: absolute;
    top: 151px;
    left: 882px;
    text-align: right;
    z-index: 20;
} */
/* .rseCtlrStts {
    position: absolute;
    top: 177px;
    left: 882px;
    text-align: right;
    z-index: 20;
} */
/* .dsrcCtlrStts {
    position: absolute;
    top: 177px;
    left: 882px;
    text-align: right;
    z-index: 20;
} */

/* 줌슬라이더 */
/* .ol-zoom {
    top: 0.5em;
    right: 0.5em;
}
.ol-control {
    position: absolute;
    background-color: rgba(255, 255, 255, 0.4);
    border-radius: 4px;
    padding: 2px;
}
.ol-zoom .ol-zoom-in {
    border-radius: 2px 2px 0 0;
}
.ol-control button,
.ol-attribution,
.ol-scale-line-inner {
    font-family: "Lucida Grande", Verdana, Geneva, Lucida, Arial, Helvetica, sans-serif;
}
.ol-control button {
    display: block;
    margin: 1px;
    padding: 0;
    color: white;
    font-size: 1.14em;
    font-weight: bold;
    text-decoration: none;
    text-align: center;
    height: 1.375em;
    width: 1.375em;
    line-height: 0.4em;
    background-color: rgba(0, 60, 136, 0.5);
    border: none;
    border-radius: 2px;
}
.ol-zoom .ol-zoom-out {
    margin-top: 204px;
}
.ol-zoom .ol-zoom-out {
    border-radius: 0 0 2px 2px;
}
.ol-control button,
.ol-attribution,
.ol-scale-line-inner {
    font-family: "Lucida Grande", Verdana, Geneva, Lucida, Arial, Helvetica, sans-serif;
}
.ol-control button {
    display: block;
    margin: 1px;
    padding: 0;
    color: white;
    font-size: 1.14em;
    font-weight: bold;
    text-decoration: none;
    text-align: center;
    height: 1.375em;
    width: 1.375em;
    line-height: 0.4em;
    background-color: rgba(0, 60, 136, 0.5);
    border: none;
    border-radius: 2px;
}
.ol-zoomslider {
    top: 2.4em;
    right: 0.5em;
    height: 200px;
    background-color: transparent;
    top: 2.3em;
}
.ol-zoomslider button {
    position: relative;
    height: 10px;
} */

/* 도로상태 팝업 */
#polylineOverlay {
    left: 40px;
    top: -20px;
    position: absolute;
    background-color: #fff;
    font-family: "RixSGo EB";
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -o-border-radius: 10px;
    border-radius: 10px;
    box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.3), -1px 1px 10px rgba(0, 0, 0, 0.1), 1px -1px 10px rgba(0, 0, 0, 0.1), -1px -1px 5px rgba(0, 0, 0, 0.1);
    display: block;
}
.traffic-pop-inner {
    padding: 10px;
    width: 245px;
}
.map-area-tit {
    padding-bottom: 7px;
    overflow: hidden;
    border-bottom: 1px solid #ccc;
    color: #555;
    font-size: 15px;
    font-weight: 600;
}
.map-area-tit.traffic-LTC0 {
    border-bottom: 1px solid #888888;
}
.map-area-tit.traffic-LTC1 {
    border-bottom: 1px solid #0ebe39;
}
.map-area-tit.traffic-LTC2 {
    border-bottom: 1px solid #fea100;
}
.map-area-tit.traffic-LTC3 {
    border-bottom: 1px solid #f90000;
}
.map-area-tit span {
    display: inline-block;
    float: right;
    width: 60px;
    height: 25px;
    line-height: 23px;
    text-align: center;
    color: #fff;
    font-weight: 400;
    font-size: 12.5px;
    *display: inline;
    *zoom: 1;
}
.road-to-from-txt {
    line-height: 26px;
    color: #555;
    font-size: 14.5px;
    padding: 5px 5px 10px 5px;
}
/* .road-traffic-stats{text-align:right;} */
.road-traffic-stats dt,
.road-traffic-stats dd {
    display: inline-block;
    font-size: 14.5px;
    *display: inline;
    *zoom: 1;
}
.road-traffic-stats dt {
    padding-left: 5px;
}
.road-traffic-stats dd strong {
    font-weight: 500;
}

.traffic_LTC0 {
    background-color: #888888 !important;
} /*소통원활*/
.traffic_LTC1 {
    background-color: #00981e !important;
} /*서행지체*/
.traffic_LTC2 {
    background-color: #fead0e !important;
} /*정체*/
.traffic_LTC3 {
    background-color: #ff0000 !important;
} /*정체*/

/* 돌발정보 */
#incdOrccToggle {
    position: absolute;
    width: 275px;
    background-color: #fff;
    font-family: "RixSGo EB";
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -o-border-radius: 10px;
    border-radius: 10px;
    box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.3), -1px 1px 10px rgba(0, 0, 0, 0.1), 1px -1px 10px rgba(0, 0, 0, 0.1), -1px -1px 5px rgba(0, 0, 0, 0.1);
}

.incdOrccInner {
    padding: 10px;
    width: 100%;
}
.inci-area-tit {
    padding-bottom: 7px;
    overflow: hidden;
    border-bottom: 1px solid #ccc;
    color: #555;
    font-size: 15px;
    font-weight: 600;
}
.inci_type_01 {
    color: #ff0000;
}
.inci_type_02 {
    color: #ff0000;
}
.inci_type_03 {
    color: #fead0e;
}
.inci_type_04 {
    color: #00981e;
}

.incdOrccType_01 {
    background-color: #ff0000 !important;
}
.incdOrccType_02 {
    background-color: #ff0000 !important;
}
.incdOrccType_03 {
    background-color: #fead0e !important;
}
.incdOrccType_04 {
    background-color: #00981e !important;
}

.inci-area-tit {
    width: 235px;
    padding-bottom: 7px;
    overflow: hidden;
    border-bottom: 1px solid #ccc;
    font-size: 15px;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.inci-area-tit img {
    position: absolute;
    left: 245px;
    cursor: pointer;
}
.inciOrcc-stats {
    padding-top: 7px;
}
.inciOrcc-stats dt,
.inciOrcc-stats dd {
    display: inline-block;
    font-size: 14.5px;
    *display: inline;
    *zoom: 1;
}
.inciOrcc-stats dd {
    width: 200px;
    padding-left: 3px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.inciOrcc-stats dt {
    padding-left: 5px;
}
.inciOrcc-stats dd strong {
    font-weight: 500;
}

/* VMS팝업 */
.map_popup_vms {
    clear: both;
    top: 50%;
    left: 0;
    right: 0;
    width: 200px;
    height: auto;
    margin: 0 auto;
    z-index: 9;
    box-shadow: 5px 5px 5px #353535;
}
.map_popup_vms dl {
    padding: 3px 5px 5px 5px;
}
.map_popup_vms dl dt {
    font-weight: 600;
    margin: 0 0 0 0;
}
.map_popup_vms dl dt p {
    display: inline-block;
    color: #400040;
    text-align: left;
}
.map_popup_vms dl dd {
    width: 100%;
    padding: 5px 0 0 0;
    color: #777;
    font-weight: 600;
    line-height: 20px;
}

/* cctv팝업 */
.map_popup_cctv {
    width: 100%;
    height: auto;
    left: 0px;
    top: 0px;
    background-image: url(/images/application_wall/cctvback.png);
    clear: both;
    margin: 0 auto;
    z-index: 9;
    box-shadow: 3px 3px 3px #353535;
}
.map_popup_cctv dl {
    padding: 3px 5px 5px 5px;
}
.map_popup_cctv dl dt {
    font-weight: 600;
    margin: 0 0 0 0;
}
.map_popup_cctv dl dt p {
    display: inline-block;
    color: #400040;
}
.map_popup_cctv dl dd {
    width: 100%;
    padding: 5px 0 0 0;
    color: #777;
    font-weight: 600;
    line-height: 20px;
}

/* 지도영역 */
.map_container {
    position: relative !important;
    overflow: hidden !important;
    width: 100% !important;
    height: 100% !important;
    z-index: 5;
}

/* 하단메뉴 */
.bottomHide {
    position: absolute;
    bottom: 275px;
    right: 3px;
    cursor: pointer;
    z-index: 20;
}
.bottomShow {
    position: absolute;
    bottom: 0px;
    right: 30px;
    cursor: pointer;
    display: none;
    z-index: 20;
}
/* .bottom_Frm{position:absolute;bottom:0px;width:100%;height:236px;background-color:#44444d;z-index:10} */
.bottom_Frm {
    position: absolute;
    bottom: 0px;
    width: calc(100% - 10px);
    height: 263px;
    padding: 5px;
    background-color: #5e5e66;
    z-index: 10;
}
.bottom-title{
    background-color: #282626;
    width: 100%;
    height: 30px;
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    font-weight: bold;
    font-family: '맑은 고딕';
    letter-spacing: 0px;
}
.section-50{
    width: calc(50% - 10px);
}
.section,
.section-50,
.section-35,
.section-65{
    background-color: #161616;
    height: 100%;
    padding-left: 5px;
    padding-right: 5px;
}
.section{
    width: calc(100% - 10px);
}
.section-35{
    width: 35%;
}
.section-65{
    width: 65%;
}
.ml-5 {
    margin-left: 5px;
}
.mr-5{
    margin-right: 5px;
}
.bottom-content{
    display: flex;
    width: calc(100% - 10px);
    height: calc(100% - 40px);
    padding: 5px;
}
.bottom-content-title{
    margin-top: 7px;
    margin-left: 2px;
    width: calc(100% - 4px);
    height: 27px;
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #000000;
    font-size: 20px;
    font-weight: bold;
    letter-spacing: -2px;
    font-family: "맑은 고딕";
    background-color: rgb(128, 126, 126);
}
.bottom-content-title > div{
    width: calc(100% / 5 - 5px);
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.bottom-content-title > div:nth-child(1) {
    width: calc(100% / 5 + 20px);
}
.fclt-box{
    width: 100%;
    height: calc(100% - 34px);
    display: flex;
    flex-direction: column;
    align-items: stretch;
}

.content{
    width: 100%;
    height: calc((100% - 35px) / 4);
    color: #eee;
    display: flex;
    align-items: center;
    font-size: 17px;
    font-weight: bold;
}
.vmsCtlrStts,
.vdsCtlrStts,
.cctvCtlrStts,
.dsrcCtlrStts,
.sigCtlrStts,
.ccamCtlrStts{
    width: calc(100% - 4px);
    height: calc(100%/6);
    margin-left: 2px;
    display: flex;
    align-items: center;
    justify-content: space-around;
    color: white;
    font-size: 16px;
    font-weight: bold;
    font-family: "맑은 고딕";
}
.vmsCtlrStts > div,
.vdsCtlrStts > div,
.cctvCtlrStts> div,
.dsrcCtlrStts > div,
.sigCtlrStts > div,
.ccamCtlrStts > div{
    width: calc(100% / 5 - 5px);
    display: flex;
    align-items: center;
    flex-direction: row;
    justify-content: center;
}
.vmsCtlrStts  > div:nth-child(1),
.vdsCtlrStts  > div:nth-child(1),
.cctvCtlrStts > div:nth-child(1),
.dsrcCtlrStts > div:nth-child(1),
.sigCtlrStts  > div:nth-child(1),
.ccamCtlrStts > div:nth-child(1) {
    width: calc(100% / 5 + 20px);
}

.bottom-first{
    width: calc(22% - 14px);
    height: calc(100% - 4px);
    box-shadow: 2px 2px 2px 2px #2d2c2c;
}
.bottom-othr{
    width: calc(25% - 15px);
    height: calc(100% - 4px);
    box-shadow: 2px 2px 2px 2px #2d2c2c;
}
.statistics-box{
    width: 100%;
    height: 100%;
}
.statistics-info{
    background-color: #282626;
    width: calc(100% - 20px);
    height: calc(100% - 20px);
    box-shadow: 2px 2px 2px 2px #3e3c3c;
    display: flex;
    color: #eee;
    padding: 10px;
}
.statistics-title{
    width: 100px;
    height: 100%;
    background-color: #4b4a4a;
}
.statistics-content{
    width: calc(100% - 100px);
    height: 100%;
}
.statistics-content > div{
    width: 100%;
    background-color: #545151;
    display: flex;
    align-items: center;
    font-size: 18px;
    font-weight: bold;
    font-family: "맑은 고딕";
}
.statistics-content > div:nth-child(1),
.statistics-content > div:nth-child(2) {
    height: calc(100% / 3 - 1px);
    border-bottom: 1px solid #8e8c8c;
}
.statistics-content > div:nth-child(3) {
    height: calc(100% / 3);
}
.per, .cnt {
    width: calc(100% / 2 - 30px);
    height: 100%;
    display: flex;
    align-items: center;
    margin-right: 5px;
    justify-content: right;
}
.statistics-title > div{
    width: 100%;
    height: calc(100% / 3);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    font-weight: bold;
    font-family: "맑은 고딕";
}
.green{
    color : #24b841;
    letter-spacing: 2px
}
.yellow{
    color : #fead0e;
}
.red > span:nth-child(1),
.yellow > span:nth-child(1) {
    margin-right: 30px;
}
.red{
    color : #d8240d;
}
.ml-15{
    margin-right: 15px;
}
.ml-5{
    margin-left: 5px;
}
.bottom_container{
    width: 100%;
    height: calc(100% - 5px);
    background-color: #585858;
    z-index: 20;
    padding-top: 5px;
    display: flex;
}
.bottom_toggle {
    position: absolute;
    bottom: 0px;
    width: 100%;
    height: 256px;
}
.bottom_back_toggle {
    position: absolute;
    left: 50.3%;
    bottom: 0px;
    width: 1600px;
    height: 236px;
    margin: 0 0 0 -800px;
}
.bottom_its,
.bottom_bis {
    position: absolute;
    left: 50.2%;
    bottom: 0px;
    width: 1600px;
    height: 100%;
    margin: 0 0 0 -800px;
    font-size: 15px;
    font-family: "RixSGo EB";
    color: white;
}
.bottom_con {
    width: 1909px;
    height: 100%;
    position: relative;
    left: -158px;
}
.busInfoBar {
    position: relative;
    left: -160px;
    width: 1915px;
    height: 295px;
    display: none;
}

.dbSession {
    position: absolute;
    top: 95px;
    left: -72px;
    width: 100px;
    text-align: right;
    line-height: 26px;
    color: #0099ff;
    font-size: 15px;
    font-weight: 600;
    z-index: 1;
}
.mb {
    margin-bottom: 13.5px !important;
}

.systemStts {
    position: relative;
    top: -20px;
    left: -82px;
    z-index: 1;
}
.systemStts .AMOCT01_server {
    position: absolute;
    top: 161px;
    left: 163px;
    width: 20px;
}
.systemStts .AUTP01_server {
    position: absolute;
    top: 120px;
    left: 163px;
    width: 20px;
}
.systemStts .AAVI01_server {
    position: absolute;
    top: 147px;
    left: 380px;
    width: 20px;
    display: none;
}
.systemStts .ACTV01_server {
    position: absolute;
    top: 121px;
    left: 380px;
    width: 20px;
}
.systemStts .AVMS01_server {
    position: absolute;
    top: 185px;
    left: 380px;
    width: 20px;
}
.systemStts .AVDS01_server {
    position: absolute;
    top: 217px;
    left: 380px;
    width: 20px;
}
.systemStts .AWEB01_server {
    position: absolute;
    top: 249px;
    left: 380px;
    width: 20px;
}
.systemStts .AEXT01_server {
    position: absolute;
    top: 153px;
    left: 380px;
    width: 20px;
}

.bisStts {
    position: absolute;
    top: -20px;
    z-index: 1;
}


.bisStts .A110201_server {
    position: absolute;
    top: 201px;
    left: 81px;
    width: 20px;
}
/* .bisStts .A10901_server {
    position: absolute;
    top: 173px;
    left: 81px;
    width: 20px;
} */


.bisStts .A160101_server {
    position: absolute;
    top: 240px;
    left: 81px;
    width: 20px;
}
/* .bisStts .A11001_server {
    position: absolute;
    top: 199px;
    left: 81px;
    width: 20px;
} */

.bisStts .A11101_server {
    position: absolute;
    top: 225px;
    left: 81px;
    width: 20px;
}
.bisStts .A11201_server {
    position: absolute;
    top: 251px;
    left: 81px;
    width: 20px;
}
.bisStts .A90101_server {
    position: absolute;
    top: 120px;
    left: 468px;
    width: 20px;
}
.bisStts .A90102_server {
    position: absolute;
    top: 145px;
    left: 468px;
    width: 20px;
}
.bisStts .A90103_server {
    position: absolute;
    top: 171px;
    left: 468px;
    width: 20px;
}
.bisStts .A90104_server {
    position: absolute;
    top: 197px;
    left: 468px;
    width: 20px;
}
.bisStts .A90105_server {
    position: absolute;
    top: 223px;
    left: 468px;
    width: 20px;
}
.bisStts .A80101_server {
    position: absolute;
    top: 249px;
    left: 468px;
    width: 20px;
}
.bisStts .A90201_server {
    position: absolute;
    top: 120px;
    left: 632px;
    width: 20px;
}
.bisStts .A90202_server {
    position: absolute;
    top: 145px;
    left: 632px;
    width: 20px;
}
.bisStts .A90203_server {
    position: absolute;
    top: 171px;
    left: 632px;
    width: 20px;
}
.bisStts .A90204_server {
    position: absolute;
    top: 197px;
    left: 632px;
    width: 20px;
}
.bisStts .A90205_server {
    position: absolute;
    top: 223px;
    left: 632px;
    width: 20px;
}


.bisStts .A80201_server {
    position: absolute;
    top: 249px;
    left: 632px;
    width: 20px;
}
/* .bisStts .A80102_server {
    position: absolute;
    top: 251px;
    left: 632px;
    width: 20px;
} */


/* .bisStts .A110101_server{position:absolute;top:152px;left:0px;width:20px} */

/* .busStts{position:absolute;top:61px;left:566px}
.busStts .bus2{padding-top:10px}
.busStts .bus3{padding-top:10px}
.busStts .bus4{padding-top:10px}
.busStts .bus5{padding-top:10px}

.bitStts{position:absolute;top:61px;left:682px}
.bitStts .bit2{padding-top:10px}
.bitStts .bit3{padding-top:10px}
.bitStts .bit4{padding-top:10px}
.bitStts .bit5{padding-top:10px} */

.positionStts {
    position: absolute;
    top: 210px;
    left: 566px;
}
.positionStts .position2 {
    padding-left: 91px;
}
.ballImg{
    margin-top: 5px;
}
/* 지정체정보 */
.traffic-con {
    background-color: black;
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
.traffic-con .traffic-list {
    width: calc(100% - 26px);
    height: calc(100% - 26px);
    padding-left: 10px;
    position: relative;
}
.traffic-con .traffic-list li {
    position: relative;
    width: 100%;
    height: 39px;
    padding: 8px 0 17px 0;
}
.traffic-con .traffic-list li span,
.traffic-con .traffic-list li strong {
    display: inline-block;
    color: #555;
    font-size: 14px;
}
.traffic-con .traffic-list li .traffic-info {
    margin-bottom: 10px;
    font-size: 16px;
    color: white;
}
.traffic-condition1 {
    color: #0ebe38 !important;
    font-weight: 600 !important;
}
.traffic-condition2 {
    color: #ffc500 !important;
    font-weight: 600 !important;
}
.traffic-condition3 {
    color: #ee0000 !important;
    font-weight: 600 !important;
}
.traffic-location {
    width: 350px;
    font-size: 15px;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
    word-wrap: normal;
}

/* .busStationInfo{position:absolute;width:1341px;height:265px;overflow-y:auto;top:5px;left:405px;font-family:'RixSGo EB';z-index:20} */
.busStationInfo {
    position: absolute;
    width: 99%;
    height: 265px;
    overflow-y: auto;
    top: 5px;
    left: 300px;
    font-family: "RixSGo EB";
    z-index: 20;
}
.busStationInfoLeft {
    position: absolute;
    top: 64px;
}

.loading {
    position: absolute;
    left: 45%;
    top: 40%;
    display: none;
    z-index: 20;
}

.bor-radi {
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -o-border-radius: 5px;
    border-radius: 5px;
}

#bitRouteInfo {
    position: absolute;
    top: 96px;
    left: 30px;
    width: 420px;
    height: 200px;
    text-align: center;
    z-index: 10;
    color: white;
    font-size: 15px;
    font-weight: 600;
    font-family: \'RixSGo EB\';
}
.bus0_0 {
    position: absolute;
    top: 0px;
    left: 150px;
}
.bus0_1 {
    position: absolute;
    top: 0px;
    left: 187px;
}
.bus0_2 {
    position: absolute;
    top: 0px;
    left: 223px;
}
.bus0_3 {
    position: absolute;
    top: 0px;
    left: 259px;
}
.bus0_4 {
    position: absolute;
    top: 0px;
    left: 295px;
}
.bus0_5 {
    position: absolute;
    top: 0px;
    left: 330px;
}
.bus0_6 {
    position: absolute;
    top: 0px;
    left: 366px;
}
.bus0_7 {
    position: absolute;
    top: 0px;
    left: 400px;
}

.bus1_0 {
    position: absolute;
    top: 41px;
    left: 150px;
}
.bus1_1 {
    position: absolute;
    top: 41px;
    left: 187px;
}
.bus1_2 {
    position: absolute;
    top: 41px;
    left: 223px;
}
.bus1_3 {
    position: absolute;
    top: 41px;
    left: 259px;
}
.bus1_4 {
    position: absolute;
    top: 41px;
    left: 295px;
}
.bus1_5 {
    position: absolute;
    top: 41px;
    left: 330px;
}
.bus1_6 {
    position: absolute;
    top: 41px;
    left: 366px;
}
.bus1_7 {
    position: absolute;
    top: 41px;
    left: 400px;
}

.bus2_0 {
    position: absolute;
    top: 82px;
    left: 150px;
}
.bus2_1 {
    position: absolute;
    top: 82px;
    left: 187px;
}
.bus2_2 {
    position: absolute;
    top: 82px;
    left: 223px;
}
.bus2_3 {
    position: absolute;
    top: 82px;
    left: 259px;
}
.bus2_4 {
    position: absolute;
    top: 82px;
    left: 295px;
}
.bus2_5 {
    position: absolute;
    top: 82px;
    left: 330px;
}
.bus2_6 {
    position: absolute;
    top: 82px;
    left: 366px;
}
.bus2_7 {
    position: absolute;
    top: 82px;
    left: 400px;
}

.bus3_0 {
    position: absolute;
    top: 122px;
    left: 150px;
}
.bus3_1 {
    position: absolute;
    top: 122px;
    left: 187px;
}
.bus3_2 {
    position: absolute;
    top: 122px;
    left: 223px;
}
.bus3_3 {
    position: absolute;
    top: 122px;
    left: 259px;
}
.bus3_4 {
    position: absolute;
    top: 122px;
    left: 295px;
}
.bus3_5 {
    position: absolute;
    top: 122px;
    left: 330px;
}
.bus3_6 {
    position: absolute;
    top: 122px;
    left: 366px;
}
.bus3_7 {
    position: absolute;
    top: 122px;
    left: 400px;
}

.bus4_0 {
    position: absolute;
    top: 162px;
    left: 150px;
}
.bus4_1 {
    position: absolute;
    top: 162px;
    left: 187px;
}
.bus4_2 {
    position: absolute;
    top: 162px;
    left: 223px;
}
.bus4_3 {
    position: absolute;
    top: 162px;
    left: 259px;
}
.bus4_4 {
    position: absolute;
    top: 162px;
    left: 295px;
}
.bus4_5 {
    position: absolute;
    top: 162px;
    left: 330px;
}
.bus4_6 {
    position: absolute;
    top: 162px;
    left: 366px;
}
.bus4_7 {
    position: absolute;
    top: 162px;
    left: 400px;
}

/* Chrome, Safari용 스크롤 바 */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
    border: 3px solid #acabab;
}
::-webkit-scrollbar-button:start:decrement,
::-webkit-scrollbar-button:end:increment {
    display: block;
    height: 10px;
    background-color: #acabab;
}
::-webkit-scrollbar-track {
    background: #acabab;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 4px rgba(0, 0, 0, 0.2);
}
::-webkit-scrollbar-thumb {
    height: 50px;
    width: 50px;
    background: rgba(0, 0, 0, 0.2);
    -webkit-border-radius: 8px;
    border-radius: 8px;
    -webkit-box-shadow: inset 0 0 4px rgba(0, 0, 0, 0.1);
}

body {
    scrollbar-arrow-color: #9d9992;
    scrollbar-3dlight-color: #d4d0c8;
    scrollbar-darkshadow-color: #d4d0c8;
    scrollbar-face-color: #686868;
    scrollbar-hightlight-color: #adadad;
    scrollbar-shadow-color: #adadad;
    scrollbar-track-color: #adadad;
}
.atmp-status{
    display: flex;
    flex-direction: row;
    align-items: center;
    height: 50px;
    overflow: hidden;
    width: 340px;
    position: absolute;
    left: 570px;
    color: white;
    font-family: "RixSGo EB";
}

.atmp-empty{
    display: none;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    height: 50px;
    overflow: hidden;
    width: 354px;
    position: absolute;
    left: 548px;
    color: white;
    font-size: 24px;
    font-family: "RixSGo EB";
}
.atmp-status > div:nth-child(2) {
    display: flex;
    flex-direction: column;
}
.atmp-status > div:nth-child(2) > div:nth-child(1),
.atmp-status > div:nth-child(2) > div:nth-child(2) {
    display: flex;
    align-items: center;

}
.server-stts{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: calc(100% / 4);
}
.system{
    display: flex;
}
.w-8{
    word-spacing: 8px;
}
.w-1{
    word-spacing: 1px;
}
.w-12{
    word-spacing: 12px;
}
.error-label {
    width: 110px;
    justify-content: right;
    display: flex;
}
.fr{
    display: flex;
}
.video-box{
    width: 300px;
    height: 240px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
}
.system > div {
    width: calc(100% / 2);
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.server-stts > div:nth-child(2) {
    width: 120px;
    height: 100%;
    align-items: center;
    display: flex;
    color: white;
    font-size: 20px;
    font-weight: bold;
    padding-left: 20px;
    font-family: "맑은 고딕";
}
.atmp_sttn_nm {
    width: 100px;
    height: 100%;
    display: flex; 
    justify-content: right;
    align-items: center;
    font-size: 24px;
    margin-right: 5px;
}
.pm25_title,
.pm10_title {
    width: 80px;
    display: flex;
    justify-content: right;
    font-weight: bold;
}
.pm10_val,
.pm25_val {
    width: 70px;
    display: flex;
    justify-content: right;
    font-weight: bold;
}
.pm25_grad,
.pm10_grad {
    margin-left: 5px;
    font-weight: bold;
}

.atmp-img {
    width: 360px;
    height: 49px;
}

.weather-empty {
    display: none;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}

.weather-img {
    margin-left: 10px;
}
.traffic-container{
    width: calc(100% - 20px);
    height: calc(100% - 20px);
    background-color: black;
    padding: 10px;
}