* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

.anchorBL {
    display: none !important;
}

b {
    font-weight: normal;
}

i {
    font-style: normal;
}

li {
    list-style: none;
}

:root {
    --greyColor: #A6ACB1;
    --blueColor: #00C0FF;
    --blurColorOpacity: rgba(0, 192, 255, .75);
    /* 单位*/
    --title1: 18px;
}

@font-face {
    font-family: DIN-Medium;
    src: url('../font/DIN-Medium.otf');
}

html,
body {
    width: 100%;
    height: 100%;
}

.wrapper {
    width: 100%;
    height: 100%;
    font-size: 14px;
}

.map {
    height: 100%;
}

.timebox {
    height: 70px;
    position: absolute;
    left: 24%;
    right: 20%;
    bottom: 20px;
    background: rgba(8, 25, 74, .7);
    border: 1px solid rgb(21, 98, 188);
    box-shadow: 0 0 5px rgb(21, 98, 188);
}

#timeDiv {
    width: 66%;
    height: 100%;
}

.legend {
    padding: 7px 15px 10px 15px;
    background: rgba(0, 18, 43, 0.8);
    border: 1px solid rgba(0, 98, 128, 0.8);
    position: absolute;
    z-index: 3;
    right: 21%;
    bottom: 248px;
    border-radius: 8px;
}

.legend p {
    line-height: 26px;
    color: #fff;
}

.legend p:not(:first-child) {
    margin-left: 5px;
}

.legend p span {
    width: 12px;
    height: 12px;
    display: inline-block;
    margin-right: 5px;
}

.legend .legtit {
    border-bottom: none !important;
    font-size: 18px;
    font-weight: 600;
    color: #fff;
}

.pageName {
    height: 35px;
    line-height: 35px;
    display: flex;
    align-items: center;
    padding-top: 5px;
    position: relative;
    z-index: 5;
    width: auto;
}

.pageName .dwicon {
    width: 12px;
    height: 16px;
    display: inline-block;
    background: url(../img/dw.png) no-repeat center center;
    background-size: 100% 100%;
    vertical-align: middle;
}

.map {
    position: absolute;
    left: 24.5%;
    right: 20.5%;
    bottom: 0;
    top: 0;
    height: 100%;
}


/* 您当前所在位置 */

.pn_tip {
    color: var(--greyColor);
    padding: 0 4px;
}


/* 页面名字 */

.pn_name {
    color: var(--blueColor);
    display: flex;
    align-items: center;
}


/* 模块标题 */

.echart {
    background: rgba(1, 27, 46, 0.9);
}

.echart .title p:nth-child(1) {
    color: rgb(255, 255, 255);
    height: 43px;
    line-height: 43px;
    letter-spacing: 2px;
    font-size: 18px;
    padding-left: 20px;
    position: relative;
    background: linear-gradient(to right, rgba(0, 46, 98, 0.4), rgba(2, 26, 45, 0.4));
}

.echart .title p:nth-child(1)::before {
    content: "";
    width: 12px;
    height: 12px;
    background: url("../img/trigle.png") center center / 100% 100% no-repeat;
    position: absolute;
    left: 2px;
    top: 15px;
}

.echart .title p:nth-child(2) {
    height: 6px;
    line-height: 6px;
    position: relative;
}

.echart .title p:nth-child(2) i {
    width: calc(100% - 40px);
    height: 1px;
    display: inline-block;
    background: rgba(0, 183, 255, 0.5);
    position: absolute;
    top: 5px;
}

.echart .title p:nth-child(2) .circle {
    display: inline-block;
    border-radius: 50%;
    margin-left: 35px;
    background: rgba(0, 192, 255, 0.9);
    width: 5px;
    height: 5px;
    position: absolute;
    top: 3px;
    right: 0px;
}

.echart .title p:nth-child(2) .circle::before,
.title p:nth-child(2) .circle::after {
    content: "";
    width: 3px;
    height: 3px;
    display: inline-block;
    background: rgba(0, 192, 255, 0.9);
    border-radius: 50%;
    position: absolute;
    top: 1px;
}

.echart .title p:nth-child(2) .circle::before {
    right: 26px;
}

.echart .title p:nth-child(2) .circle::after {
    right: 14px;
}


/*标题提示*/

.tip,
.tipRight {
    width: 16px;
    height: 16px;
    background: url(../img/info.png) no-repeat;
    background-size: 16px 16px;
    display: inline-block;
    cursor: pointer;
    font-size: 20px;
    /* position: relative; */
    z-index: 11;
    cursor: pointer;
    color: #16EDEE;
    position: absolute;
    top: 50%;
    margin-left: 1%;
    margin-top: -8px;
}

.tip span,
.tipRight span {
    z-index: 11;
    width: 255px;
    padding: 0 8px 8px;
    display: none;
    line-height: 26px;
    background: rgba(1, 28, 37, 0.9);
    border: 1px solid rgba(0, 192, 255);
    border-radius: 10px;
    position: absolute;
    top: -5px;
    font-size: 16px !important;
    -webkit-box-shadow: 3px 3px 7px 8px rgb(0, 192, 255, 0.17) inset;
    -moz-box-shadow: 3px 3px 7px 8px rgb(0, 192, 255, 0.17) inset;
    -o-box-shadow: 3px 3px 7px 8px rgb(0, 192, 255, 0.17) inset;
    -ms-box-shadow: 3px 3px 7px 8px rgb(0, 192, 255, 0.17) inset;
    color: #fff !important;
    text-align: left;
}

.tip span {
    left: 25px !important;
}

.tipRight span {
    right: 25px !important;
}

.tip span em,
.tipRight span em {
    width: 100%;
    display: inline-block;
    margin-top: 8px;
    font-style: normal;
}

.tip span b,
.tipRight span b {
    font-weight: 800;
    margin-right: 15px;
    padding-left: 30px;
    color: #fff;
    font-size: 16px;
}

.tip span:before {
    content: "";
    position: absolute;
    left: -10px;
    top: 8px;
    border-right: 10px solid rgba(0, 192, 255);
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
}

.tip:hover span,
.tipRight:hover span {
    display: block;
    -webkit-animation: fadeIn 0.3s ease-in-out;
    -mozt-animation: fadeIn 0.3s ease-in-out;
    -o-animation: fadeIn 0.3s ease-in-out;
    -ms-animation: fadeIn 0.3s ease-in-out;
    animation: fadeIn 0.3s ease-in-out;
}

.tipRight span:before {
    content: "";
    position: absolute;
    right: -10px;
    top: 8px;
    border-left: 10px solid rgba(0, 192, 255);
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
}

.tabs2 {
    position: absolute;
    right: 10px;
    top: 13px;
    color: var(--blueColor);
    height: 42px;
    line-height: 40px;
    /* background: rgba(1, 29, 60, 0.9); */
    overflow: hidden;
}

.tabs2 span {
    width: 180px;
    display: inline-block;
    float: left;
    text-align: center;
    background: rgba(1, 29, 60, 0.9);
    border: 1px solid #014D6D;
    position: relative;
    cursor: pointer;
}

.tabs2 span:nth-child(1) {
    border-radius: 20px 0px 0px 20px;
    border-right: none;
}

.tabs2 span:nth-child(2) {
    border-radius: 0px 20px 20px 0px;
    border-left: none;
}

.tabs2 span.active {
    color: #fff;
    background: rgba(1, 51, 88, 1);
    border-color: #009FD5;
}

.tabs2 span:nth-child(1).active {
    border-right: 1px solid #009FD5;
}

.tabs2 span:nth-child(2).active {
    border-left: 1px solid #009FD5;
}

.tabs2 span.active::before {
    content: "";
    position: absolute;
    left: 15px;
    top: 10px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: url(../img/zs.png) no-repeat center center;
}


/* 查询内容 */

.selbox {
    width: 24%;
    height: 70px;
    line-height: 70px;
    font-size: 16px;
    position: relative;
    z-index: 6;
}

.selbox label {
    color: var(--greyColor);
    margin-right: 10px;
}

.selbox input {
    width: 160px;
    height: 36px;
    line-height: 36px;
    display: inline-block;
    padding-left: 8px;
    background: none;
    border: 1px solid #003962;
    border-radius: 4px;
    color: #fff;
    margin-right: 10px;
    cursor: pointer;
}

#sel {
    width: 75px;
    /* width: 15%; */
    background: #0e4263;
    color: #fff;
    height: 36px;
    line-height: 36px;
    border: none;
    /* margin-left: 20px; */
    border-radius: 3px;
    vertical-align: middle;
    cursor: pointer;
    outline: none;
}


/* 自定义select */

.selectbox {
    width: 160px;
    height: 36px;
    display: inline-block;
    position: relative;
    margin-right: 10px;
}

.selbox select {
    display: none;
}

.custom-select {
    position: relative;
}

@keyframes layui-upbit {
    from {
        transform: translate3d(0, 30px, 0);
        opacity: .3
    }
    to {
        transform: translate3d(0, 0, 0);
        opacity: 1
    }
}

.downarrow {
    width: 14px;
    height: 7px;
    position: absolute;
    right: 10px;
    top: 50%;
    background: url(../img/common/arrowdown.png) no-repeat center right;
    background-size: 100% 100%;
    cursor: pointer;
}

.downarrow.show {
    transform: rotate(180deg);
}

.custom-select dl {
    display: none;
    /* display: block; */
    animation-name: layui-upbit;
    animation-duration: .3s;
    animation-fill-mode: both;
    position: absolute;
    left: 0;
    right: 0;
    top: 60px;
    padding: 5px 0;
    z-index: 5;
    min-width: 100%;
    border: 1px solid #055b82;
    max-height: 300px;
    overflow-y: auto;
    background: #02192C;
    border-radius: 2px;
    box-sizing: border-box;
}

.custom-select dl dd {
    padding: 0 10px;
    line-height: 28px;
    font-size: 14px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: pointer;
    color: var(--greyColor);
}

.custom-select dl dd.selected {
    background: rgba(0, 192, 255, .15);
    color: #fff;
}

.custom-select dl dd:hover {
    background: rgba(0, 192, 255, .15);
}

.select_dl::-webkit-scrollbar {
    width: 4px;
    height: 1px;
}

.select_dl::-webkit-scrollbar-thumb {
    border-radius: 4px;
    box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
    background: #0A5895;
}

.select_dl::-webkit-scrollbar-track {
    box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
    border-radius: 10px;
    background: #7C8B95;
}


/* 地图 */

.tips_content_ss {
    height: 70px;
    line-height: 70px;
    color: RGBA(0, 255, 255, 1);
    font-family: DIN-Medium;
    padding-left: 30px;
}

.ssSum_ss {
    float: left;
    position: absolute;
    top: 10px;
    left: 40%;
    z-index: 3;
    font-size: 30px;
    font-family: Microsoft YaHei;
    font-weight: bold;
    color: #00FFFF;
}

.ssSum_ss>div {
    height: 68px;
    float: left;
    line-height: 68px;
}

.tips_content2 {
    height: 80px;
    text-align: center;
    color: #fff;
    margin-top: 35px;
}

.iconfont {
    font-family: "iconfont" !important;
    font-size: 24px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    display: inline-block;
}

.iconfont:before {
    width: 50px;
    display: inline-block;
}

.iconfont {
    color: #00FFFF;
    text-align: center;
    width: 50px;
    height: 80px;
    font-size: 46px;
    line-height: 80px;
    /* background: linear-gradient(to bottom, #182F58, #2759A5,#182F58); */
    background: url(../img/ssrk.png) center center;
    margin-left: 5px;
}

.dotbox {
    height: 80px;
    width: 15px;
    position: relative;
    display: inline-block;
    vertical-align: top;
}

.dotbox span {
    position: absolute;
    background: #18EBC8;
    width: 5px;
    height: 5px;
    bottom: 12px;
    left: 5px;
    display: inline-block;
}

.danwei {
    height: 80px;
    width: 52px;
    position: relative;
    display: inline-block;
    vertical-align: bottom;
    margin-left: 4px;
}

.danwei i {
    position: absolute;
    bottom: -10px;
    left: 4px;
    font-style: normal;
    font-size: 16px;
}

@font-face {
    font-family: "iconfont";
    src: url('iconfont.eot?t=1594716229008');
    /* IE9 */
    src: url('iconfont.eot?t=1594716229008#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('data:application/x-font-woff2;charset=utf-8;base64,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') format('woff2'), url('iconfont.woff?t=1594716229008') format('woff'), url('iconfont.ttf?t=1594716229008') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+ */
    url('iconfont.svg?t=1594716229008#iconfont') format('svg');
    /* iOS 4.1- */
}

.icon-shuzi3:before {
    content: "\e611";
}

.icon-shuzi5:before {
    content: "\e61a";
}

.icon-shuzi9:before {
    content: "\e617";
}

.icon-shuzi8:before {
    content: "\e616";
}

.icon-shuzi1:before {
    content: "\e60f";
    margin-right: -4px;
}

.icon-shuzi2:before {
    content: "\e610";
}

.icon-shuzi4:before {
    content: "\e612";
}

.icon-shuzi6:before {
    content: "\e614";
}

.icon-shuzi7:before {
    content: "\e615";
}

.icon-shuzi0:before {
    content: "\e619";
}

.icon-dingwei2:before {
    content: "\e73c";
}

.icon-bingtu:before {
    content: "\e62a";
}

.icon-baogaoguanli-:before {
    content: "\e613";
}

.icon-baogaoguanli:before {
    content: "\e649";
}

.icon-dingwei:before {
    content: "\e6b0";
}

.icon-yduibianxie:before {
    content: "\e673";
}

@media (width: 1366px) {
    .tabs2 span.active::before {
        content: "";
        position: absolute;
        left: 15px;
        top: 10px;
        width: 14px;
        height: 14px;
        border-radius: 50%;
        background: url(../img/zs.png) no-repeat center center;
    }
    .tabs2 span {
        width: 146px;
    }
    .tabs2 {
        position: absolute;
        right: 10px;
        top: 13px;
        color: var(--blueColor);
        height: 36px;
        line-height: 34px;
    }
    /* 地图 */
    .tips_content_ss {
        height: 70px;
        line-height: 70px;
        color: RGBA(0, 255, 255, 1);
        font-family: DIN-Medium;
        padding-left: 10px;
    }
    .ssSum_ss {
        float: left;
        position: absolute;
        top: 10px;
        left: 35%;
        z-index: 3;
        font-size: 25px;
        font-family: Microsoft YaHei;
        font-weight: bold;
        color: #00FFFF;
    }
    .ssSum_ss>div {
        height: 65px;
        float: left;
        line-height: 65px;
    }
    .tips_content2 {
        height: 80px;
        text-align: center;
        color: #fff;
        margin-top: 35px;
    }
    .iconfont {
        font-family: "iconfont" !important;
        font-size: 20px;
        font-style: normal;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        display: inline-block;
    }
    .iconfont:before {
        width: 50px;
        display: inline-block;
    }
    .iconfont {
        color: #00FFFF;
        text-align: center;
        font-size: 33px;
        line-height: 80px;
        /* background: linear-gradient(to bottom, #182F58, #2759A5,#182F58); */
        background: url(../img/ssrk.png) center center;
        margin-left: 5px;
    }
    .dotbox {
        height: 80px;
        width: 10px;
        position: relative;
        display: inline-block;
        vertical-align: top;
    }
    .dotbox span {
        position: absolute;
        background: #18EBC8;
        width: 5px;
        height: 5px;
        bottom: 7px;
        left: 2px;
        display: inline-block;
    }
    .danwei {
        height: 80px;
        width: 52px;
        position: relative;
        display: inline-block;
        vertical-align: bottom;
        margin-left: 4px;
    }
    .danwei i {
        position: absolute;
        bottom: -10px;
        left: 4px;
        font-style: normal;
        font-size: 16px;
    }
    /*标题提示*/
    .tip,
    .tipRight {
        width: 12px;
        height: 12px;
        background: url(../img/info.png) no-repeat;
        background-size: 12px 12px;
        display: inline-block;
        cursor: pointer;
        font-size: 12px;
        /* position: relative; */
        z-index: 11;
        cursor: pointer;
        color: #16EDEE;
        position: absolute;
        top: 50%;
        margin-left: 1%;
        margin-top: -6px;
    }
    .tip span,
    .tipRight span {
        z-index: 11;
        width: 215px;
        padding: 0 8px 8px;
        display: none;
        line-height: 26px;
        background: rgba(1, 28, 37, 0.9);
        border: 1px solid rgba(0, 192, 255);
        border-radius: 10px;
        position: absolute;
        top: -5px;
        font-size: 14px !important;
        -webkit-box-shadow: 3px 3px 7px 8px rgb(0, 192, 255, 0.17) inset;
        -moz-box-shadow: 3px 3px 7px 8px rgb(0, 192, 255, 0.17) inset;
        -o-box-shadow: 3px 3px 7px 8px rgb(0, 192, 255, 0.17) inset;
        -ms-box-shadow: 3px 3px 7px 8px rgb(0, 192, 255, 0.17) inset;
        color: #fff !important;
        text-align: left;
    }
    .tip span {
        left: 25px !important;
    }
    .tipRight span {
        right: 25px !important;
    }
    .tip span em,
    .tipRight span em {
        width: 100%;
        display: inline-block;
        margin-top: 8px;
        font-style: normal;
    }
    .tip span b,
    .tipRight span b {
        font-weight: 800;
        margin-right: 15px;
        padding-left: 30px;
        color: #fff;
        font-size: 14px;
    }
    .tip span:before {
        content: "";
        position: absolute;
        left: -10px;
        top: 8px;
        border-right: 10px solid rgba(0, 192, 255);
        border-top: 5px solid transparent;
        border-bottom: 5px solid transparent;
    }
    .tip:hover span,
    .tipRight:hover span {
        display: block;
        -webkit-animation: fadeIn 0.3s ease-in-out;
        -mozt-animation: fadeIn 0.3s ease-in-out;
        -o-animation: fadeIn 0.3s ease-in-out;
        -ms-animation: fadeIn 0.3s ease-in-out;
        animation: fadeIn 0.3s ease-in-out;
    }
    .tipRight span:before {
        content: "";
        position: absolute;
        right: -10px;
        top: 8px;
        border-left: 10px solid rgba(0, 192, 255);
        border-top: 5px solid transparent;
        border-bottom: 5px solid transparent;
    }
    /* input */
    .selbox input {
        width: 155px;
        height: 30px;
        line-height: 30px;
        display: inline-block;
        padding-left: 8px;
        background: none;
        border: 1px solid #003962;
        border-radius: 4px;
        color: #fff;
        margin-right: 10px;
        cursor: pointer;
    }
    .legend {
        right: 23%;
        padding: 4px 10px 7px 10px;
    }
    .legend .legtit {
        font-size: 16px;
    }
}