.drop-menu {
    position: relative;
    min-height: .24rem;
    line-height: .24rem;
}
.drop-menu > .select-column {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    font-size: 0.12rem;
    border-radius: .05rem .05rem 0 0;
    padding: 0 0.1rem;
    z-index: 99;
    white-space: nowrap;
}
.drop-menu > .select-column span{
    font-size: .14rem;
    line-height: .24rem;
}
.drop-menu > .select-column i {
    display: block;
    width: 0.08rem;
    height: 0.05rem;
    background: url("../images/btn_selectArrowBtm.png") no-repeat;
    background-size: 100%;
    margin-left: .1rem;
    transition: .5s;
}
.drop-menu.current .select-column {
    /*background: #fff;*/
    /*border: 1px solid #ccc;*/
    /*border-bottom: none;*/
    /*box-shadow: 0 -.04rem .06rem rgba(0, 0, 0, 0.15);*/
}
.drop-menu.current .select-column i {
    /*background-position: center bottom;*/
    transform: rotate(180deg);
}
.drop-menu.current ul {
    display: inline-block;
    vertical-align: middle;
    box-shadow: 0 0 .07rem rgba(0, 0, 0, 0.2);
}

.drop-menu > ul {
    display: none;
    width: 1.2rem;
    background: #fff;
    border: 1px solid #ccc;
    border-radius: .05rem 0 .05rem .05rem;
    position: absolute;
    top: 0.35rem;
    left: 50%;
    transform: translate(-50%, 0);
    z-index: 8;
    overflow: hidden;
}
.drop-menu > ul > li {
    line-height: 0.4rem;
    border-top: 1px solid #fff;
    border-bottom: 1px solid #fff;
    text-align: center;
    font-size: 0.12rem;
    color: #596477;
}
.drop-menu > ul > li * {
    font-size: 0.12rem;
    color: #262e3d;
}
.drop-menu > ul > li span em,
.drop-menu > ul > li:hover {
    background: #f2f2f2;
}
.drop-menu > ul > li:active {
    color: #4992FE;
    background: #fff;
    border-top: 1px solid #fff;
    border-bottom: 1px solid #fff;
}
.drop-menu > ul > li:hover *,
.drop-menu > ul > li:active span,
.drop-menu > ul > li:active a {
    color: #4992FE;
}


.side-charts{
    padding: .2rem 0 0;
}
.side-charts h4, .side-charts h4 span{
    font-size: .14rem;
}
.side-charts ul{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.side-charts li{
    width: calc(33.33% - .24rem);
    padding: .08rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: .1rem;
    background: rgba(255,255,255,0.11);
    box-shadow: 0 .02rem .06rem 0 rgba(0,0,0,0.15);
    border-radius: .04rem;
    border: .01rem solid rgba(255,255,255,0.2);
}
.side-charts li.zw{
    opacity: 0;
}
.side-charts li em, .side-charts li span{
    font-size: .12rem;
}
.side-charts li em{
    display: flex;
    align-items: center;
}
.side-charts li em:before{
    display: block;
    content: "";
    width: .08rem;
    height: .08rem;
    border-radius: 50%;
    margin-right: .05rem;
}

.marker-level, .side-city .badge-level{
    width: 0.26rem;
    line-height: 0.16rem;
    text-align: center;
    font-size: 0.1rem;
    color: #fff;
    border-radius: .02rem;
    cursor: pointer;
}
.side-charts .badge-level.level1:before,
.marker-level.level1, .badge-level.level1{
    background-color: #74c01f;
    /*box-shadow: 0 .15rem .15rem 0 rgba(116, 192, 31, 0.25);*/
}
.side-charts .badge-level.level2:before,
.marker-level.level2, .badge-level.level2{
    background-color: #d4cf18;
    /*box-shadow: 0 .15rem .15rem 0 rgba(212, 207, 24, 0.25);*/
}
.side-charts .badge-level.level3:before,
.marker-level.level3, .badge-level.level3{
    background-color: #fa8718;
    /*box-shadow: 0 .15rem .15rem 0 rgba(250, 135, 24, 0.25);*/
}
.side-charts .badge-level.level4:before,
.marker-level.level4, .badge-level.level4{
    background-color: #d12b2b;
    /*box-shadow: 0 .15rem .15rem 0 rgba(209, 43, 43, 0.25);*/
}
.side-charts .badge-level.level5:before,
.marker-level.level5, .badge-level.level5{
    background-color: #9d2124;
    /*box-shadow: 0 .15rem .15rem 0 rgba(157, 33, 36, 0.25);*/
}
.side-charts .badge-level.level6:before,
.marker-level.level6, .badge-level.level6{
    background-color: #691888;
    /*box-shadow: 0 .15rem .15rem 0 rgba(105, 24, 136, 0.25);*/
}
.side-charts .badge-level.level7:before,
.marker-level.level7, .badge-level.level7{
    background-color: #141618;
    /*box-shadow: 0 .15rem .15rem 0 rgba(20, 22, 24, 0.25);*/
}
.side-charts .badge-level{
    background-color: transparent;
}


/* 弹窗-实况 */
.common-popup {
    background: #fff;
    border-radius: .06rem;
    text-align: center;
    /*min-width: 2rem;*/
    position: relative;
}
.common-popup .popup-title{
    font-size: .2rem;
    line-height: .26rem;
    font-weight: bold;
    padding-bottom: .1rem;
    text-align: left;
}
.common-popup .popup-title strong{
    font-size: 14px;
    line-height: .26rem;
}
.common-popup .popup-content span{
    display: block;
    line-height: .42rem;
    font-size: .22rem;
    color: #fff;
    border-radius: .06rem;
}
.common-popup .popup-content span strong{
    line-height: inherit;
    font-size: inherit;
    font-weight: bold;
    color: inherit;
}
.common-popup .popup-content h5 {
    font-size: .14rem;
    line-height: .28rem;
}
.common-popup .see-detail-btn {
    display: block;
    font-size: .14rem;
    line-height: .34rem;
    color: #3b3b3b;
    border-top: 1px solid #f5f6fa;
    margin: 0 -.22rem -.22rem;
}


.air-popup {
    /*min-width: 3.2rem;*/
}
.air-popup .popup-content {
    padding-bottom: .22rem;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    text-align: left;
}
.air-popup .air-data {
    padding-right: .12rem;
    margin-right: .12rem;
    border-right: 1px solid #dedede;
}
.air-popup .popup-title {
    color: #333;
    font-size: .15rem;
    line-height: .22rem;
    padding: .03rem 0 .08rem;
    /*width: 1.7rem;*/
}
.air-popup p {
    font-size: .12rem;
    line-height: .12rem;
    color: #b4b4b4;
}

.air-popup .marker-level {
    display: block;
    width: 0.82rem;
    height: .28rem;
    border-radius: .04rem;
}
.air-popup .marker-level em{
    font-size: 0.14rem;
    line-height: 0.28rem;
    color: inherit;
}

.air-popup .aqi {
    text-align: center;
    margin-top: .13rem;
}
.air-popup .levels1{
    color: #74c01f;
}
.air-popup .levels2{
    color: #d4cf18;
}
.air-popup .levels3{
    color: #fa8718;
}
.air-popup .levels4{
    color: #d12b2b;
}
.air-popup .levels5{
    color: #9d2124;
}
.air-popup .levels6{
    color: #691888;
}
.air-popup .levels7{
    color: rgb(20,22,24);
}
.air-popup .aqi strong{
    font-weight: bold;
    font-size: inherit;
    color: inherit;
}

/* 弹窗-动态 */
.css_address, .css_c_name, .css_address, .css_spacename {
    font-size: .18rem;
    line-height: .26rem;
    font-weight: bold;
    color: #333333;
    margin-bottom: .08rem;
    text-align: center;
}
.css_val, .css_c_val, .css_des, .second-level, .css_typename {
    font-size: .14rem;
    line-height: .2rem;
    color: #596477;
}
.css_val {
    font-size: .16rem;
    font-weight: bold;
    text-align: center;
}
.css_val *{
    color: #596477;
}
.css_des, .second-level, .css_typename{
    margin-bottom: .03rem;
}



/* 弹窗-长期-站点 */
.marker-level-long{
    font-weight: bold;
    border: 1px solid rgba(0, 0, 0, .1);
    text-shadow: 0 0 1px #9dacc5;
}
.link {
    padding-top: .1rem;
    border-top: 1px solid #f5f6fa;
    text-align: center;
    margin: .1rem -.22rem -.1rem;
}
.link a {
    display: block;
    color: #3b3b3b;
    font-size: .14rem;
    line-height: .16rem;
}

/* 弹窗-长期-动态 */
.air-box .css_address{
    text-align: left;
}
.air-box .css_des .css_val{
    font-size: .14rem;
    font-weight: normal;
}
.level-bgBox{
    width: 3rem;
}
.level-bgBox .bg-linearGradient{
    width: 100%;
    height: .18rem;
}
.level-bgBox .list{
    display: flex;
    justify-content: space-between;
}
.level-bgBox .list li{
    font-size: .12rem;
    line-height: .22rem;
    color: #78797a;
    font-weight: bold;
}

#YearLevelBox .bg-linearGradient{
    background: linear-gradient(90deg, #0c0dff 0%, #3352ff 10%, #3a9aff 20%,  #2ad8ff 30%,  #6afcd2 40%,  #b2ff95 50%,  #e4ff4c 60%,  #ffea02 70%,  #ffa500 80%,  #ff6a00 90%,  #ff0700 100%);
}
#MonthLevelBox .bg-linearGradient{
    background: linear-gradient(90deg, #005ce6 0%, #2e98f0 10%, #5ccbfa 20%,  #96e3e3 30%,  #d3f2ae 40%,  #ffff75 50%,  #ffe747 60%,  #ffc219 70%,  #fa8500 80%,  #f04000 90%,  #e60000 100%);
}

.box-DataSources{
    position: absolute;
    bottom: .98rem;
    right: .8rem;
    transition: 0.2s;
    border-radius: .05rem;
    background: #fafcff;
    padding: .04rem .14rem;
    cursor: pointer;
}
.box-DataSources h6{
    font-size: .14rem;
    line-height: .34rem;
    color: #484848;
}
.box-DataSources .content{
    max-width: 4rem;
    display: none;
    padding: .1rem 0;
}
.box-DataSources p{
    font-size: .12rem;
    line-height: .16rem;
    margin-top: .1rem;
}
.box-DataSources p:first-of-type{
    margin-top: 0;
}

/* 预警 */
.yujing-img img, .css_tab img{
    max-width: .5rem!important;
    max-height: .5rem!important;
}
.css_tab{
    text-align: center;
}
.css_info {
    font-size: .14rem;
    line-height: .24rem;
    color: #596477;
}


/* 污染物排放 */
.pollution-popup{
    min-width: 2.4rem;
}
.pollution-popup h5{
    line-height: .2rem;
    margin-top: .08rem;
}
.pollution-popup .btn strong{
    display: flex;
    justify-content: center;
    align-items: baseline;
}
.pollution-popup .btn b{
    font-size: .12rem;
    color: #fff;
}

/* 火点地图 */
.box-tab{
    display: flex;
    margin-top: .2rem;
    margin-bottom: .15rem;
}
.box-tab button{
    font-size: .14rem;
    line-height: .40rem;
    color: #596477;
    width: 50%;
    text-align: center;
    background: #E6E8EA;
    cursor: pointer;
}
.box-tab button:first-of-type{
    border-radius: .04rem 0 0 .04rem;
}
.box-tab button:last-of-type{
    border-radius: 0 .04rem .04rem 0;
}
.box-tab button.active{
    font-weight: bold;
    background: #3E6EFF;
    color: #fff;
}

.side-sourceTitle{
    margin-top: .1rem;
    border-top: 1px solid #E6E8EA;
    padding-top: .1rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    cursor: pointer;
}
.side-sourceTitle .btn-arrow{
    display: inline-block;
    width: .08rem;
    height: .08rem;
    border-top: 1px solid #8d96a6;
    border-right: 1px solid #8d96a6;
    transform: rotate(135deg);
    transition: 1s;
    margin-top: -.08px;
}
.side-sourceTitle .open{
    transform: rotate(-45deg);
}
.side-sourceTitle p, .side-sourceBox p{
    color: #8d96a6;
    font-size: .12rem;
    line-height: .24rem;
}

.map-tableBox{
    margin-top: .1rem;
}
.map-tableBox .table-list{
    width: 100%;
    border-bottom: 1px solid #E6E8EA;
    border-left: 1px solid #E6E8EA;
}
.map-tableBox .table-list th,
.map-tableBox .table-list td{
    border-top: 1px solid #E6E8EA;
    border-right: 1px solid #E6E8EA;
    font-size: .12rem;
    line-height: .16rem;
    padding: .04rem;
    color: #8E97A6;
    text-align: center;
}
.map-tableBox .table-list th{
    font-weight: bold;
    background: #E6E8EA;
    padding: .06rem 0;
}
.map-tableBox .table-list tr td:first-of-type{
    width: 25%;
}

/* 图例 */
.map-legendBox .icon {
    height: .34rem;
    display: flex;
    align-items: flex-end;
    justify-content: center;
}

/* 弹窗 */
.popup-header {
    font-size: .2rem;
    color: #333333;
    font-weight: 600;
    margin-bottom: .1rem;
    text-align: center;
}
.popup-label, .popup-value {
    font-size: .14rem;
    line-height: .24rem;
    color: #666;
}
.popup-value {
    color: #262e3d;
    font-weight: 500;
}
.popup-value .btn, .btnspan{
    display: inline-block;
    color: #fff;
    background: #247cd2;
    font-size: .1rem;
    line-height: .16rem;
    padding: 0 .05rem;
    margin-left: .05rem;
    border-radius: .02rem;
}
.popup-value .btn{
    cursor: pointer;
}