@media screen and (max-width:768px) {
  #milestone .web-banner {
    display: none;
  }
  #milestone {
    width: 100% !important;
    margin: unset !important;
  }
  .web-path{
     display: none !important;
  }
}

@media screen and (min-width:768px) {
  #milestone .mobile-path {
    display: none !important;
  }
}

#milestone {
  position: relative;
  width: 1200px;
  margin:0 auto;
}

#milestone .web-path{
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.web-path .title-box{
  font-size: 59px;
  font-family: 'YouSheBiaoTiHei';
  font-weight: 400;
  color: #F96742;
  text-align: center;
  margin-top:80px;
  margin-bottom:80px;
}

.web-path .title-box .sub-tit{
  font-size: 18px;
  font-family: 'Microsoft YaHei';
  font-weight: 400;
  color: #F96742;
}

.web-path .item-box{
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  margin-top:8px;
}
.web-path .item-box .icon{
  display:flex;
  flex-grow: 1;
  align-items: center;
  width:112px;
  height:100%;
  margin:0 80px;
}

.web-path .item-box .icon.left{
  justify-content: flex-end;
}
.web-path .item-box .icon.right{
  justify-content: flex-start;
}

.web-path .item-box .icon img{
  width:112px;
}


.web-path .item-box .line{
  display:flex;
  width:90px;
  align-items: center;
  height:100%;
}

.web-path .item-box .line img{
  width:75px;
}

.web-path .item-box .text{
  display: flex;
  flex-direction: column;
  justify-content: center;
  width:480px;
  height:100%;
}
.web-path .item-box .text.left{
  align-items: flex-start;
  text-align: left;
  margin-left:80px;
}
.web-path .item-box .text.right{
  align-items: flex-end;
  text-align: right;
  margin-right:80px;
}



.web-path .item-box .text .year{
  font-size: 44px;
  font-family: 'Bahnschrift';
  font-weight: 400;
  color: #F96742;
  line-height: 39px;
}

.web-path .item-box .text .event{
  font-size: 25px;
  font-family: 'Microsoft YaHei';
  font-weight: 300;
  margin-top:30px;
  color: #000000;
}

.web-path .item-box .line.left{
  justify-content: flex-start;
}

.web-path .item-box .line.right{
  justify-content: flex-end;
}


#milestone .mobile-path{
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding:0 .46rem;
  background:#fff;
}


.mobile-path .title-box{
  font-size: .59rem;
  font-family: 'YouSheBiaoTiHei';
  font-weight: 400;
  color: #F96742;
  text-align: center;
  margin-top:.8rem;
  margin-bottom:.8rem;
}

.mobile-path .title-box .sub-tit{
  font-size: .18rem;
  font-family: 'Microsoft YaHei';
  font-weight: 400;
  color: #F96742;
}

.mobile-path .item-box{
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  margin-top:.08rem;
}
.mobile-path .item-box .icon{
  display:flex;
  flex-grow: 1;
  align-items: center;
  justify-content: center; 
  width:1.12rem;
  height:100%;
  margin:0 .8rem;
}

.mobile-path .item-box .icon.left{
  justify-content: flex-end;
}
.mobile-path .item-box .icon.right{
  justify-content: flex-start;
}

.mobile-path .item-box .icon img{
  width:1.12rem;
}


.mobile-path .item-box .line{
  display:flex;
  width:.9rem;
  align-items: center;
  justify-content: center;
  height:100%;
}

.mobile-path .item-box .line img{
  width:.8rem;
}

.mobile-path .item-box .text{
  display: flex;
  flex-direction: column;
  justify-content: center;
  width:2.88rem;
  height:100%;
}
.mobile-path .item-box .text.left{
  align-items: flex-start;
  text-align: left;
  margin-left:.2rem;
}
.mobile-path .item-box .text.right{
  align-items: flex-end;
  text-align: right;
  margin-right:.2rem;
}

.mobile-path .item-box .text .year{
  font-size: .44rem;
  font-family: 'Bahnschrift';
  font-weight: 400;
  color: #F96742;
  line-height: .39rem;
}

.mobile-path .item-box .text .event{
  font-size: .25rem;
  font-family: 'Microsoft YaHei';
  font-weight: 300;
  margin-top:.3rem;
  color: #000000;
}