.Min{position: relative;}

ul.history_year{width: 880px;border-bottom: 1px solid #00c4d4;text-align: center;position: absolute !important;left: 90px;top: 20px;z-index: 9;}
ul.history_year li{height: 30px;line-height: 30px;float: left;font-size: 16px;color: #828282;cursor: pointer;padding: 0 5px;border: 1px solid #ccc;border-bottom: none;margin-right: 10px;}
ul.history_year li.active{background: #00c4d4;color: #fff;}

ul.history_list{width: 100%;position: relative;padding: 80px 0;}
ul.history_list li{line-height: 28px;margin-bottom: 15px;position: relative;}
ul.history_list li.history_li ul li h2.tit{margin: 0 0 10px 132px;font-size:18px;color: #2175b7;padding-left: 25px;height: 38px;line-height: 30px;}
ul.history_list li.history_li ul li h2::before {content: '';position: absolute;top: 7px;right: -13px;height: 0;width: 0;border: 7px solid transparent;border-left: 7px solid #00c4d4;} 

ul.history_list::before{content: '';position: absolute;top: 0;height: 100%;width: 4px;background: #e7f3fb;left: 72px;margin-left: -2px;}
ul.history_list li h2.Title{text-align: right;padding: 5px;font-size: 16px;color: #fff;background: #00c4d4;position: relative;}
ul.history_list li h2.Title::after{content: '';position: absolute;border-radius: 50%;width: 12px;height: 12px;background: #00c4d4;left: 136px;top: 8px;margin-left: -71px;}
.con_box{width: 880px;padding:10px;background:#f4f4f4;position: relative;border-radius: 0.25em;}

ul.history_list li h2.tit{font-size: 18px;padding-left: 98px;margin-bottom: 20px;line-height: 28px;color: #aa0000;}
ul.history_list li h2.tit:after{content: '';position: absolute;border-radius: 50%;width: 15px;height: 15px;background: #aa0000;left: 135px;top: 6px;margin-left: -71px;}

.img{ width:100%; }
.img_list li{ float: left;position: relative;width: 25%; }
.img_list li img{ display: block;width: 100%; }
.img_list li .WenAn{ position: absolute;top: 0px;left: 0px; background:url(img/op_bg.png) repeat;width: 100%;height: 100%;}
.img_list li .WenAn p{color: #fff;font-size: 14px;line-height: 28px;}
.img_list li .WenAn1 p{padding:50px 10px 0;}
.img_list li .WenAn2 p{padding:60px 10px 0;}
.img_list li .WenAn3 p{padding:80px 10px 0;}
.img_list li .WenAn4 p{padding:40px 10px 0;}


@media only screen and (max-width: 1310px){
 .img{ width: 100%; }
 .article_right .pd20 img{display: block;width: 100%;}
 ul.history_year,.con_box{width: 86%;box-sizing: border-box;}
 ul.history_list li h2.tit{ font-size: 16px; }
 ul.history_list{ padding: 140px 0 }
 ul.history_year li{ border:1px solid #ccc; margin-top: 10px; }
}


@media only screen and (max-width: 640px){
 ul.history_year,.con_box{width: 84%;}
}
@media only screen and (max-width: 600px){
ul.history_list{ padding: 180px 0 } 
}
@media only screen and (max-width:560px){
 ul.history_year,.con_box{width: 82%;}
}
@media only screen and (max-width:500px){
 ul.history_year,.con_box{width: 80%;}
}
@media only screen and (max-width:475px){
 .img{ display: none; }
 ul.history_list{ padding: 40px 0px 0px; }
 ul.history_year{ position: initial !important; width: 100%; }
 ul.history_year li{ width: 31.3%; margin:10px 1% 0px; }

 .img_list li{width: 100%;margin-bottom: 10px;}
 .img_list li .WenAn {position: inherit;display: block !important;background: #f1f1f1;}
 .img_list li .WenAn p {padding: 10px !important;color: #333;}
}
@media only screen and (max-width:435px){
 .con_box{width: 74%;}
}
@media only screen and (max-width:360px){
 ul.history_year li{ width: 48%; }
 .con_box{width: 70%;}
}