﻿.content{ width: 100%; height: 550px;box-sizing: border-box;}
.tab_bg{border-bottom: solid 1px #e4ecf5;height:50px;position: relative;background: url(../images/ulBg_v2019_03.png) 50%  bottom no-repeat;}
.tab_bg span{ display: block;}
.tab_bg span.tab_btn{font-size: 18px;color: #808080;text-align: center; cursor: pointer; width: 49.5%;float: left;height: 50px;line-height: 50px;background: url(../images/btnBg_v2019_03.png) no-repeat center bottom;}
/*.tab_bg span.tab_btn:last-child{ margin-left: -5px;}*/
.tab_bg span.tab_btn.active{border-top: 3px solid #2e6b97;background: none;height:48px;line-height:44px;width: 49.5%; color: #0367bb;  /*margin-bottom: -1px;*/border-bottom:0 ; background: #fff;}
.tab_bg>i{ position:absolute;top:50px;width: 97%;font-style: normal;display: block;height: 22px;line-height: 22px;color: #333;font-size: 12px;float: left;text-align: right;}
.tab_content{ padding: 10px; box-sizing: border-box;padding-top: 22px;border: solid 1px #e4ecf5; border-top: 0;}
.tab_con{ border: solid 1px #e4ecf5;background: url(../images/bg_v2019_03.png) left bottom repeat-x;}
.list_title{background: #e5eff8;border-bottom: solid 1px #dee9f1; overflow: hidden; color: #2e6b97; /*font-weight: bold;*/width: 90%;padding:0 5%;margin: 0 auto;}
.list_title li{ width: 20%; float: left; text-align: center;}

.list_title2 li{width: 20%; float: left; text-align: center;}
.list_title2 li:first-child,.list_title2 li:last-child{ width: 40%;}
.list_con{ width: 90% !important;  border-collapse: collapse; overflow: hidden;margin: 0 auto; }
.list_con td{ height: 36px;font-size: 14px;width: 20%; text-align: center;padding: 0;  /*white-space:nowrap;overflow:hidden;text-overflow:ellipsis;*/}
.list_title li:first-child,.list_con td:last-child{width: 40% !important;}
.list_title li:first-child{width: 38% !important;padding-left: 2%;text-align: left;}
.list_con td:first-child{text-align: left !important;width: 40%;}
.list_con td:last-child{width: 40%;}
.list_title li:last-child,.list_con td:last-child{ width: 40% !important;}
.list_con_height{ height: 165px; overflow: hidden;}
.list_con>tbody>tr{ border-bottom: solid 1px #dee9f1; cursor: pointer;}
.list_con>tbody>tr>td:first-child.list_con>tbody>tr>td:last-child{ width: 20%;}
.list_con2{width: 90%}
.list_con2 td{ width: 20%; text-align: center;padding: 0;  /*white-space:nowrap;overflow:hidden;text-overflow:ellipsis;*/}

.legend_title{
	margin-left: 10px;
} 
.list_con2>tbody>tr>td:first-child{ width: 40%;text-align: left !important;}
/*.list_con>tbody>tr>td:last-child{ width: 40% !important;}*/
/*.list_con>tbody>tr:nth-of-type(even) {
    background-color: #f9f9f9;
}*/
.pollution_01{color:#00E400}
.pollution_02{color:#FFFF00}
.pollution_03{color:#FF7E00}
.pollution_04{color:#FF0000}
.pollution_05{color:#99004C}
.pollution_06{color:#7E0023}
.legend_01{ background: #00E400;}
.legend_02{ background: #FFFF00;}
.legend_03{ background: #FF7E00;}
.legend_04{ background: #FF0000;}
.legend_05{ background: #99004C;}
.legend_06{ background: #7E0023;}

.legend li{ width: 16.6%; height: 10px; overflow: hidden; float: left; cursor: pointer; }
.scale{transform:scale(1,1.5);
-ms-transform:scale(1,1.5); 	/* IE 9 */
-moz-transform:scale(1,1.5); 	/* Firefox */
-webkit-transform:scale(1,1.5); /* Safari 和 Chrome */
-o-transform:scale(1,1.5); 	/* Opera */}
.legend{ position: relative;z-index: 9999;}
.legend_tip{position: absolute; top:-25px; z-index: 9999; font-size: 12px; width: 130px;}
.legend_tip span{ border: solid 1px #ddd;box-sizing: border-box; background: #fff; padding: 3px; display: none; position: relative;}
.legend_tip :after{display: block;
    content: "";
    position: absolute;
    left: 22px;
    top: 24px;
    border: 5px solid transparent;
    border-width: 5px 5px;
    border-top-color: #fff;
    border-bottom-color: transparent;}
.legend_title span{ float: left; margin-right: 7%;font-size: 12px;line-height: 21px;}
.legend_title span.legend_span{ width: 20px; height: 10px; margin-top: 5px; border-radius: 5px; margin-right: 3px;}
#colee_02,#demo{height: 378px !important;}

.tab_bg span.tab_btn.active{
	 background:#fff url(../images/ulBg_v2019_03.png) left bottom no-repeat;
}
.tab_bg span.tab_btn2.active{
	float: right;
	 background: url(../images/ulBg_v2019_03.png) right bottom no-repeat;
}

@media screen and (max-width:300px) {
	.tab_bg span.tab_btn {
	    font-size: 15px;
	    height: 40px;
	    line-height: 40px;
	    background: url(../images/btnBg_v2019_2_03.png) no-repeat center bottom;
	}
	.tab_bg span.tab_btn.active {
	    height: 37px;
	    line-height: 35px;
	}
	.tab_bg{height:40px;}
	.tab_bg>i {
	    top: 41px;
	    width: 97%;
	 }
    .legend_title span {
	    float: left;
	    margin-right: 3%;
	  }
    .tab_content{
    	padding: 0 8px 8px;
        padding-top: 22px;
    }
    .content {
      height: 458px;
    }
    .legend{
    	margin-bottom: 12px;
    	padding-bottom: 2px;
    }
    #colee_02,#demo{height: 299px !important;}
    .list_con td{ height: 32px;font-size: 12px;}
}