.dev_index_l_wrap { width:118px; }
.dev_index_l_wrap ul {  width:24px; float:right; position:relative; margin-top:-2px; } 
.dev_index_l_wrap li {  width:16px; height:89px; line-height:89px; text-align:center; background:url(../images/dev_br.png) no-repeat right center; background-size:auto 100%; margin-top:-1px; margin-right:5px;}
.dev_index_l_wrap li span { position:relative; padding-right:35px; color:#5E5E5E; font-family:Arial; float:right; right:-4px; margin-top:-1px; cursor:pointer; }
.dev_index_l_wrap li.active span{ padding-right: 50px; font-size:36px; color:#f7a804; }
.dev_index_l_box {  overflow:hidden; width:100%; position:relative; margin-bottom:15px; height:348px;}
.dev_index_l_top { display:block; width:100%; height:10px; background:url(../images/dev_top.png) no-repeat center center; margin-bottom:15px; position:relative; }
.dev_index_l_bottom { display:block; width:100%; height:10px; background:url(../images/dev_bottom.png) no-repeat center center; margin-bottom:15px; position:relative;}
.dev_index_l_top.disabled{ cursor: default; background:url(../images/dev_top_dis.png) no-repeat center;}
.dev_index_l_bottom.disabled{cursor: default; background:url(../images/dev_bottom_dis.png) no-repeat center;}
.dev_index { position:relative; overflow:hidden; }
.dev_index_l { width:120px; position:absolute; left:0; top:0;}
.dev_index_r { width:61%;float: right;margin-right: 15%;}



/***********************************/


.his_pys{text-align:center;margin-bottom: 20px;}
.his_pys img{max-width: 100%;width: 360px;}
.his_list li{width: 100%;position: relative;overflow: hidden;padding-bottom: 50px;}
.his_list li dl{float: right;}
.his_list li:nth-child(2n) dl{float: left;text-align:right;}
.his_list li dt{line-height: 36px;margin-bottom: 20px;}
.his_list li dd img{width: 100%;}
.his_list li dl,.his_year h4{width: 43.3%;}
.his_year{position: relative;text-align: right;width: 100%;font-size: 100px;color: #9c9c9c;height: 100px;line-height: 100px;margin-bottom: 10px;overflow: hidden;}
.year_cicle{position: absolute; top:50%;left: 50%;margin-left: -12px;margin-top: -12px; z-index:5; width: 24px;height: 24px;background: #9c9c9c;border-radius: 50%;box-sizing:border-box;}
.year_cicle span{width: 18px;height: 18px;background: #fff;border-radius: 50%;    z-index: 2;}
.dev_index_r_part{position: relative;padding-bottom: 40px}
.his_line{width: 6px;height: 100%;background: #e5e5e4;left: 50%;margin-left: -3px;position: absolute;top:0;left: 50%;}

.month_cicle{position: absolute;left: 50%;top:12px;margin-left: -6px; width: 10px;height: 10px;background: #f8b323;border-radius: 50%;border:1px solid #f8b323;}

.dev_index_r_part:nth-child(2n) li dl{float: left;text-align:right;}
.dev_index_r_part:nth-child(2n) li:nth-child(2n) dl{float: right;text-align: left;}
.dev_index_r_part:nth-child(2n) .his_year h4{float: right;text-align: left;}

.dev_index_r_part.active .year_cicle{background: #e8390d;}
.dev_index_r_part.active .year_cicle:after{
    visibility: visible;opacity: 1;
    transform:translate(-50%,-50%) scale(1,1); -webkit-transform:translate(-50%,-50%) scale(1,1);-moz-:scale(1,1);-o-transform:translate(-50%,-50%) scale(1,1);-ms-transform:translate(-50%,-50%) scale(1,1);
    top:50%;left: 50%;
}
.year_cicle:after{content: "";width: 78px;height: 78px; background: rgba(232,57,13,0.2);border-radius: 50%;
transform:scale(0.7,0.7) translate(-50%,-50%); -webkit-transform:scale(0.7,0.7) translate(-50%,-50%);-ms-transform:scale(0.7,0.7) translate(-50%,-50%);-moz-transform:scale(0.7,0.7) translate(-50%,-50%);-o-transform:scale(0.7,0.7) translate(-50%,-50%); position:absolute; left:0%; top:0%;
visibility: hidden;opacity: 0;

}
.dev_index_r_part.active .his_line,.dev_index_r_part.before .his_line{background: #e8390d;}
.dev_index_r_part.active .month_cicle,.dev_index_r_part.before .month_cicle{background: #fff;}

.year_cicle:after,.dev_index_r_part.active .year_cicle{transition:all 0.3s;-webkit-transition:all 0.3s;-moz-transition:all 0.3s;-o-transition:all 0.3s;-ms-transition:all 0.3s;}


/*左侧重置*/
.his_btn {display: none;}
.his_lebox{overflow: hidden;}
.dev_index_l_box{height: auto;}

.dev_index_l_wrap li{height: 40px;line-height: 40px;}
.dev_index_l_wrap li span{color: #9c9c9c;}
.dev_index_l_wrap li.active{height: 114px;line-height: 114px;background: url(../images/his_banyuan.png) no-repeat;}


.dev_index_l_wrap ul{float:none;width: 100%}
.dev_index_l_wrap ul{top:0 !important;}
.dev_index_l_wrap li{width: 100%;background: none;}
.dev_index_l_wrap li span{float: none;}
.dev_index_l_wrap li span,.dev_index_l_wrap li.active span{padding: 0;}
/*左侧重置*/
.phone_tabslider_box{position: relative;padding: 0 30px;}
.phone_but{display: none;}
.phone_dev .phone_but div{width:20px;height: 20px; line-height: 20px;text-align: center;font-size: 16px;font-weight: bold; color: #fff; background: red;top:50%;margin-top: -10px;cursor: pointer;}

.phone_dev .phone_but .swiper-button-prev{left: 0;}
.phone_dev .phone_but .swiper-button-next{right: 0;left: auto;}

.phone_tabslider_box.current{padding: 0;}
/***********************************/

.phone_tabslider {  display:none;}
@media only screen and (max-width: 1440px){
.his_year{font-size: 80px;height: 80px;line-height: 80px;}
.his_pys img{width: 300px;}
}
@media only screen and (max-width: 1366px){
.dev_index_r{margin-right: 10%;width: 69%;}
.his_year{font-size: 66px;height: 66px;line-height: 66px;}
.dev_index_r_part.active .year_cicle:after{width: 60px;height: 60px;}

}
@media only screen and (max-width: 1280px){
.dev_index_r{width: 72%;}
}

@media only screen and (max-width: 1024px) {
    /*about_dev*/
    .year_box { padding:10px;}
    .dev_index_l { width:20%; display:none; }
    .dev_index_l_wrap,.dev_index_l_box { width:100%;}
    .dev_index_r { margin-left:0; padding-left:26%; width:74%;}
    .dev_index_r ul { margin-bottom:10px; }

    .phone_dev.dev_index_l { position:relative; top:0; width:100%;  }
    .phone_dev.dev_index_l .dev_index_l_top {  width: 10px; height: 16px; background: url(../images/dev_left_act.jpg) no-repeat; margin-bottom: 0; position: absolute; float: none; right: auto; left:10px;  top:50%; margin-top:-8px; }
    .phone_dev.dev_index_l .dev_index_l_bottom {  width: 10px; height: 16px; background: url(../images/dev_right_act.jpg) no-repeat; margin-bottom: 0; position: absolute; float: none; right: 10px; top:50%; margin-top:-8px; }
    .phone_dev.dev_index_l .dev_index_l_wrap {  height:60px; position:relative;}
    .phone_dev.dev_index_l .dev_index_l_box { height:60px; margin-bottom:0; width:90%; padding:0 10px; box-sizing:border-box;}
    .phone_dev.dev_index_l .dev_index_l_wrap ul { float:none; width:100%; margin-top:0;}
    .phone_dev.dev_index_l .dev_index_l_wrap li { line-height:60px; height:60px; width:100px; background:none; float:left; }
    .phone_dev.dev_index_l .dev_index_l_wrap li span { padding:0; background:none; right:auto; top:0; float:none;}
    .phone_dev.dev_fixed { position:fixed; top:60px; z-index:200; background:#fff; border-bottom:2px solid #005bac; }
    .dev_index_r { padding-left:0; width:100%; float:none; padding-left:0; margin: 0;}
    .dev_index_r ul { margin:0; width:100%; }
    

    .phone_tabslider {  width:100% !important; display:block;    margin-bottom: 20px;}
    .phone_tabslider .swiper-slide { text-align:center; line-height:30px; height:30px;cursor: pointer; }
    .phone_tabslider .swiper-slide.active-nav { color:#d00000; font-size:18px; }

/*gai*/
.his_pys img{width: 200px;}
.his_year{font-size: 44px;height: 44px;line-height: 44px;}
.year_cicle{width: 18px;height: 18px;margin-left: -9px;margin-top: -9px;background: #d00000;}
.year_cicle span{width: 12px;height: 12px;}
.his_list li dl, .his_year h4{width: 47%;}
.his_list li dt{line-height: 24px;margin-bottom: 10px;}
.month_cicle{top:6px;}
.his_line{width: 4px;margin-left: -2px;}
.year_cicle:after{display: none;}


}

@media only screen and (max-width: 767px) {
/*about_dev*/
.dev_index_r li {  width:100%;}
.dev_index_r .dev_index_r_part > h4{padding-bottom: 10px;}
.his_year{font-size: 24px;height: 24px;line-height: 24px;}
.year_cicle{width: 12px;height: 12px;background: #e8390d;left: 0;margin: 0;margin-top: -6px;}
.year_cicle span{width: 8px;height: 8px;}
.his_pys img{width: 120px;}
.his_list li dl, .his_year h4{float: none;width: 100%;}
.his_year{text-align: left;padding-left: 20px;}
.his_line{display: none;}
.his_list li dt{padding-left: 20px;}
.month_cicle{left: 0;margin-left: 0;width: 6px;height: 6px;margin-top:3px}
.dev_index_r_part:nth-child(2n) li dl,.his_list li:nth-child(2n) dl{float: none;text-align: left;}
.his_list li{padding-bottom: 20px;}
}