/*发展历程*/
.dev_index_l_wrap { width:130px; }
.dev_index_l_wrap ul {  width:24px; float:right; position:relative; margin-top:-2px; }
.dev_index_l_wrap li {  width:18px; height:89px; line-height:89px; text-align:center; background:url(../images/dev_br.jpg) no-repeat right center; background-size:auto 100%; margin-top:-1px; margin-right:5px;}
.dev_index_l_wrap li span { position:relative; padding-right:30px; color:#5e5e5e; font-family:Arial; float:right; right:-5px; margin-top:-1px; cursor:pointer; }
.dev_index_l_wrap li.active span{  font-size:72px; color:#e60012; font-weight:bold; background:url(../images/dev_cir.jpg) no-repeat right center;overflow: hidden;}

.dev_index_l_box {  overflow:hidden; width:214px; position:relative; margin-bottom:15px; height:717px;}

.dev_index_l_top { display:block; width:16px; height:10px; background:url(../images/dev_top.jpg) no-repeat; margin-bottom:15px; position:relative; float:right; right:-2px; }
.dev_index_l_bottom { display:block; width:16px; height:10px; background:url(../images/dev_bottom_act.jpg) no-repeat; margin-bottom:15px; position:relative; float:right; right:-2px; }

.dev_index { position:relative; overflow:hidden; }

.dev_index_l { width:130px; position:absolute; left:0; top:0;}

.dev_index_r {  width:calc(100% - 160px); float:left; padding-left:214px; margin-left:30px;}
.dev_index_r .dev_index_r_part > h4 { color:#d2d2d2; border-top:5px solid #d2d2d2; font-family:"Arial"; padding-top:20px; margin-bottom:10px;}
.dev_index_r ul {  position:relative; margin-bottom:50px;}
.dev_index_r li {  width:49.6%; margin-bottom:22px;}
.dev_index_r li .year_wrap {  width:95%; border:1px solid #dddddd;}
.dev_index_r li.odd .year_wrap {  float:right;}
.dev_index_r li .year_wrap img {  width:100%;}
.year_box {  padding:30px; position:relative; z-index:20; background:#fff;}
.year_box h4 { color:#2b2b2b; margin-bottom:5px; line-height:1.5em;}
.year_box p {  color:#616161; font-size:14px; line-height:1.7em;}


.dev_index_l {  position:fixed; z-index:220; opacity:0;}

#swiper-container2 {  display:none;}

.dev_index_r li .year_wrap .year_img{margin-bottom:20px;}
.dev_index_r li .year_wrap .year_img img{width:70%; display: block;margin: 0 auto;}

.main{
	margin-top: 50px;
}


.dev_index_r li{
	/* width: 100%; */
}
.dev_index_r{
	width: calc(100% - 126px);
}


@media only screen and (max-width: 1520px) {
    /*about_dev*/
    .dev_index_r {  width:calc(100% - 126px); margin-left:160px; padding-left:30px;}
    .year_box {  padding:20px;}
    .dev_index_l_wrap li.active span { font-size:38px; background-size:8px 8px; }
    .dev_index_l_wrap li span { right:-4px; }
    .dev_index_l_wrap li {  background-size:auto 100%;}
    .dev_index_l_wrap li { height:56px; line-height:56px; }
    .dev_index_l_box {  height:436px;}
    .dev_index_r ul { margin-bottom:50px; }
		.dev_index_l_box{
			width: 160px;
		}
}

@media only screen and (max-width: 1300px) {
    /*about_dev*/
    .year_box p {  font-size:12px;}
    .year_box {  padding:17px;}
    .dev_index_l_wrap li.active span { font-size:48px; }
    .dev_index_r { margin-left:106px; padding-left:160px; width:calc(100% - 66px);}
    .dev_index_r ul { margin-bottom:20px; }
}

@media only screen and (max-width: 1023px) {
    /*about_dev*/
    .year_box {  padding:12px;}
    .dev_index_l_wrap li.active span { font-size:38px; }
    .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; }
    .dev_index_r ul { margin:0; width:100%; }
    /* .dev_index_r li {  width:50%;} */
    .dev_index_r li .year_wrap {  margin:0 5px; width:auto;}
    .dev_index_r li.odd .year_wrap {  float:none;}

    #swiper-container2 {  width:100% !important; display:block;}
    #swiper-container2 .swiper-slide { text-align:center; line-height:30px; height:30px; }
    #swiper-container2 .swiper-slide.active-nav { color:#e60012; font-size:18px; }
    .dev_index_r li .year_wrap .year_img img{width:100%;}
    .dev_index_r li .year_wrap .year_img{margin-bottom:10px;}
}

@media only screen and (max-width: 768px) {
    /*about_dev*/
    .year_box {  padding:10px;}
    .dev_index_l_wrap li.active span { font-size:20px; }

    .dev_index_l_wrap li { height:50px; line-height:50px; }
    .dev_index_l_box {  height:388px;}
.dev_index_r li{
	width: 100%;
}
}

@media only screen and (max-width: 540px) {

/*.dev_index_r li{width:100%; position:static !important;}
*/
}






/*font-size*/

  /*font-size*/

.fnt_22 { font-size:22px;}
.fnt_120 { font-size: 100px;}


@media only screen and (max-width: 1520px) {

.fnt_22 {  font-size:18px}}
.fnt_120 { font-size: 100px;}

}


@media only screen and (max-width: 1300px) {

.fnt_22 { font-size:16px;}

.fnt_120 { font-size: 90px;}

}

@media only screen and (max-width: 1140px) {
.fnt_120 { font-size: 80px;}

}

@media only screen and (max-width: 1023px) {

.fnt_120 { font-size: 64px;}

}

@media only screen and (max-width: 767px) {
.fnt_22{ font-size:14px;}
.fnt_120 { font-size: 48px;}
}

@media only screen and (max-width: 767px) {
.fnt_120 { font-size: 36px;}
}





/* // Grid system
//
// Generate semantic grid columns with these mixins.

// Centered container element */
.container-fixed(@gutter: @grid-gutter-width) {
  margin-right: auto;
  margin-left: auto;
  padding-left:  floor((@gutter / 2));
  padding-right: ceil((@gutter / 2));
  &:extend(.clearfix all);
}

/* // Creates a wrapper for a series of columns */
.make-row(@gutter: @grid-gutter-width) {
  margin-left:  ceil((@gutter / -2));
  margin-right: floor((@gutter / -2));
  &:extend(.clearfix all);
}

/* // Generate the extra small columns */
.make-xs-column(@columns; @gutter: @grid-gutter-width) {
  position: relative;
  float: left;
  width: percentage((@columns / @grid-columns));
  min-height: 1px;
  padding-left:  (@gutter / 2);
  padding-right: (@gutter / 2);
}
.make-xs-column-offset(@columns) {
  margin-left: percentage((@columns / @grid-columns));
}
.make-xs-column-push(@columns) {
  left: percentage((@columns / @grid-columns));
}
.make-xs-column-pull(@columns) {
  right: percentage((@columns / @grid-columns));
}

/* // Generate the small columns */
.make-sm-column(@columns; @gutter: @grid-gutter-width) {
  position: relative;
  min-height: 1px;
  padding-left:  (@gutter / 2);
  padding-right: (@gutter / 2);

  @media (min-width: @screen-sm-min) {
    float: left;
    width: percentage((@columns / @grid-columns));
  }
}
.make-sm-column-offset(@columns) {
  @media (min-width: @screen-sm-min) {
    margin-left: percentage((@columns / @grid-columns));
  }
}
.make-sm-column-push(@columns) {
  @media (min-width: @screen-sm-min) {
    left: percentage((@columns / @grid-columns));
  }
}
.make-sm-column-pull(@columns) {
  @media (min-width: @screen-sm-min) {
    right: percentage((@columns / @grid-columns));
  }
}

/* // Generate the medium columns */
.make-md-column(@columns; @gutter: @grid-gutter-width) {
  position: relative;
  min-height: 1px;
  padding-left:  (@gutter / 2);
  padding-right: (@gutter / 2);

  @media (min-width: @screen-md-min) {
    float: left;
    width: percentage((@columns / @grid-columns));
  }
}
.make-md-column-offset(@columns) {
  @media (min-width: @screen-md-min) {
    margin-left: percentage((@columns / @grid-columns));
  }
}
.make-md-column-push(@columns) {
  @media (min-width: @screen-md-min) {
    left: percentage((@columns / @grid-columns));
  }
}
.make-md-column-pull(@columns) {
  @media (min-width: @screen-md-min) {
    right: percentage((@columns / @grid-columns));
  }
}

/*  Generate the large columns */
.make-lg-column(@columns; @gutter: @grid-gutter-width) {
  position: relative;
  min-height: 1px;
  padding-left:  (@gutter / 2);
  padding-right: (@gutter / 2);

  @media (min-width: @screen-lg-min) {
    float: left;
    width: percentage((@columns / @grid-columns));
  }
}
.make-lg-column-offset(@columns) {
  @media (min-width: @screen-lg-min) {
    margin-left: percentage((@columns / @grid-columns));
  }
}
.make-lg-column-push(@columns) {
  @media (min-width: @screen-lg-min) {
    left: percentage((@columns / @grid-columns));
  }
}
.make-lg-column-pull(@columns) {
  @media (min-width: @screen-lg-min) {
    right: percentage((@columns / @grid-columns));
  }
}