.content {
  width: 14rem;
  margin: 0 auto;
}

.aboutNav {
  display: flex;
  justify-content: space-between;
  margin-top: .42rem;
  padding-bottom: .26rem;
  border-bottom: 0.01rem solid #DDDDDD;
}

.aboutNavL {
  display: flex;
}

.aboutNavitem {
  min-width: 1.3rem;
  min-height: .38rem;
  padding: 0 .33rem;
  box-sizing: border-box;
  margin-right: .2rem;
  border-radius: 0.02rem 0.02rem 0.02rem 0.02rem;
  border: 0.01rem solid #DDDDDD;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: Microsoft YaHei, Microsoft YaHei;
  font-weight: 400;
  font-size: 0.16rem;
  color: #333333;
}

.aboutNavitem.active {
  background: #0F4892;
  color: #FFFFFF;
}

.aboutNavR {
  display: flex;
  align-items: center;
}

.aboutNavR img {
  max-width: .11rem;
  height: auto;
  margin-right: .1rem;
}

.aboutNavR a {
  font-family: Microsoft YaHei, Microsoft YaHei;
  font-weight: 400;
  font-size: 0.14rem;
  color: #999999;
  display: flex;
  align-items: center;
}

.aboutNavR a:last-child {
  color: #0F4892;
}

.aboutNavR a::after {
  content: '';
  width: .05rem;
  height: .1rem;
  margin: 0 .1rem;
  background: url(../img/about/arrow.png);
  background-size: 100% auto;
  background-repeat: no-repeat;
}

.aboutNavR a:last-child::after {
  display: none;
}

.aboutTab {
  /* width: 8.3rem; */
  width: fit-content;
  padding: .07rem .1rem;
  height: 0.6rem;
  margin: .42rem auto .88rem;
  display: flex;
  align-items: center;
  border-radius: 0.05rem 0.05rem 0.05rem 0.05rem;
  border: 0.01rem solid #DDDDDD;
}

.aboutTabitem {
  min-width: 1.24rem;
  height: .46rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: Microsoft YaHei, Microsoft YaHei;
  font-weight: 400;
  font-size: 0.16rem;
  color: #202020;
  margin: 0 .1rem;
}

.aboutTabitem.active {
  background: linear-gradient(92deg, #699FE4 0%, #435CDB 52%, #2F7DE2 100%);
  border-radius: 0.02rem 0.02rem 0.02rem 0.02rem;
  color: #FFFEFE;
}

/* 公司简介 */
.aboutDetail {
  display: flex;
  align-items: flex-start;
  padding-bottom: 1.85rem;
  display: flex;
  opacity: 0;
}

.aboutDetail.active {
    display: flex;
    opacity: 1 !important;
    z-index: 99;
}

.aboutDetailL {
  width: 100%;
}

.aboutDetail.acitve {
    opacity: 1 !important;
}
.aboutDetail .aboutDetailL {
    opacity: 0;
    transform: translateX(-100%);
    /*transition: 1.5s;*/
}
.aboutDetail .aboutDetailR {
    opacity: 0;
    transform: translateX(100%);
    /*transition: 1.5s;*/
}
.aboutDetail.active .aboutDetailL {
    opacity: 1;
    /*transform: translateX(0%);*/
    animation: lmove 1.5s forwards;
}
.aboutDetail.active .aboutDetailR {
    opacity: 1;
    /*transform: translateX(0%);*/
    animation: rmove 1.5s forwards;
}
.aboutDetail .aboutTitle {
    opacity: 0;
    transform: translateY(100%);
    /*transition: 1.5s;*/
}
.aboutDetail.active .aboutTitle {
    opacity: 1;
    /*transform: translateY(0%);*/
    animation: tmove 1s linear forwards;
}
.aboutDetail .swiper-container {
    opacity: 0;
    transform: translateY(100%);
    /*transition: 1.5s;*/
}
.aboutDetail.active .swiper-container {
    opacity: 1;
    /*transform: translateY(0%);*/
    animation: tmove 1.5s forwards;
}


@keyframes lmove {
  0%{
      opacity: 0;
      transform: translateX(-100%);
  }
  100%{
      opacity: 1;
      transform: translateX(0%);
  }
}

@keyframes rmove {
  0%{
      opacity: 0;
      transform: translateX(100%);
  }
  100%{
      opacity: 1;
      transform: translateX(0%);
  }
}

@keyframes tmove {
  0%{
      opacity: 0;
      transform: translateY(100%);
  }
  100%{
      opacity: 1;
      transform: translateX(0%);
  }
}

.aboutTitle {
  font-family: Microsoft YaHei, Microsoft YaHei;
  font-weight: bold;
  font-size: 0.36rem;
  color: #0F4892;
  display: flex;
  align-items: center;
  margin-bottom: .47rem;
}

.aboutTitle::before {
  content: '';
  width: 0.09rem;
  height: 0.35rem;
  background: #0F4892;
  margin-right: .18rem;
}

.aboutText {
  font-family: Microsoft YaHei, Microsoft YaHei;
  font-weight: 400;
  /*font-size: 0.2rem;*/
  font-size: .3rem;
  color: #0F4892;
  /*line-height: 0.23rem;*/
  margin-bottom: .52rem;
}

.aboutDetailR {
  width: 4.19rem;
  height: 6.64rem;
  flex-shrink: 0;
  margin-left: .4rem;
  margin-top: .21rem
}

.aboutDetailR img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.aboutItem {
  margin-bottom: .45rem;
}

.aboutItem:last-child{
    margin-bottom: 0;
}

.aboutItemTit {
  display: flex;
  align-items: center;
  font-family: Microsoft YaHei, Microsoft YaHei;
  font-weight: bold;
  font-size: 0.2rem;
  color: #0F4892;
}

.aboutItemTit img {
  width: .35rem;
  height: .35rem;
  margin-right: .16rem;
}

.aboutItemTxt {
  font-family: Microsoft YaHei, Microsoft YaHei;
  font-weight: 400;
  font-size: 0.16rem;
  color: #636F7D;
  line-height: 0.39rem;
}

.numBox {
  display: flex;
  align-items: center;
  margin-top: .75rem;
}

.numItem {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-right: .8rem;
}

.numTop {
  display: flex;
  align-items: center;
}

.num {
  font-family: Microsoft YaHei, Microsoft YaHei;
  font-size: 0.48rem;
  font-weight: bold;
  background: -webkit-linear-gradient(105deg, #427ECD, #70F4EE, #2385E2, #2ACEC4, #344EB0, #87FFFF, #6BB2FF, #1053AB);
  /* Chrome, Safari */
  background: linear-gradient(105deg, #427ECD, #70F4EE, #2385E2, #2ACEC4, #344EB0, #87FFFF, #6BB2FF, #1053AB);
  /* 标准语法 */
  -webkit-background-clip: text;
  /* Chrome, Safari */
  background-clip: text;
  -webkit-text-fill-color: transparent;
  /* Chrome, Safari */
  color: black;
  /* 其他浏览器 */
}

.numTxt {
  font-family: Inter, Inter;
  font-weight: 400;
  font-size: 0.18rem;
  color: #0F4892;
  margin-left: .06rem;
}

.numB {
  margin-top: .1rem;
  font-family: Microsoft YaHei, Microsoft YaHei;
  font-weight: 400;
  font-size: 0.16rem;
  color: #5A687A;
}

.swiper-container {
  width: 83%;
  height: 2.64rem;
  overflow: visible !important;
  transform: translateX(-.95rem) !important;
  margin-bottom: .97rem !important;
}

.swiper-container .swiper-slide {
  /* transform: scale(1); */
  transition: all .3s;
}

.swiper-container .swiper-slide-active {
  transform: scale(1.9) !important;
  /* margin: 0 1.2rem!important; */
  margin-right: 1.43rem !important;
  margin-left: .96rem !important;
}

.swiper-container .swiper-slide img {
  display: block;
  margin-bottom: .15rem;
}

.swiper-container .swiper-slide p {
  transform: scale(.5);
  font-family: Inter, Inter;
  font-weight: 400;
  font-size: 0.18rem;
  color: #333333;
  width: 100%;
  text-align: center;
  display: none;
}

.swiper-container .swiper-slide-active p {
  display: block;
}

.aboutCulture {
  display: block;
  margin-bottom: .71rem;
}

.his {
  background-image: url(../img/about/historyBack.png);
  background-position: bottom center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  position: relative;
  overflow: hidden;
}

.history {
  margin-bottom: .85rem;
}

.historyTit {
  font-family: Microsoft YaHei, Microsoft YaHei;
  font-weight: bold;
  font-size: 0.36rem;
  color: #0F4892;
  text-align: center;
  margin-top: .35rem;
  margin-bottom: .87rem;
}

.historyItem {
  width: 100%;
  height: 2.87rem;
  display: flex;
  flex-direction: row-reverse;
}

.historyItem:nth-child(2n-1) {
  flex-direction: row;
}

.historyItemBox {
  width: fit-content;
  display: flex;
  align-items: center;
  padding-left: .2rem;
  border-left: .02rem dashed #B2C1D4;
  border-radius: 3rem 0 0 3rem;
  position: relative;
}

.historyItemBox::after {
  content: '';
  width: 94%;
  height: 83.2%;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  display: block;
  z-index: -1;
  border: .5rem solid #F2F2F2;
  border-radius: 3rem 0 0 3rem;
  clip: rect(0 1.6rem 4rem 0);
}

.historyItem:nth-child(2n-1) .historyItemBox {
  flex-direction: row-reverse;
  padding: 0rem;
  padding-right: .2rem;
  border-left: 0rem dashed #B2C1D4;
  border-right: .02rem dashed #B2C1D4;
  border-radius: 0 3rem 3rem 0;
}

.historyItem:nth-child(2n-1) .historyItemBox::after {
  border: .5rem solid #F2F2F2;
  border-radius: 0 3rem 3rem 0;
  clip: rect(0 10rem 4rem 7.1rem);
}

.car {
  max-width: .24rem;
  margin: 0 auto;
  margin-right: .65rem;
  opacity: 0;
  transition: all .3s;
  transform: translateX(-130%);
}

.historyItemBox:hover .car {
  opacity: 1;
}

.historyItem:nth-child(2n-1) .car {
  margin: 0;
  margin-left: .65rem;
  transform: translateX(130%);
}

.year {
  width: 1.05rem;
  height: 1.05rem;
  background: linear-gradient(147deg, #2657BE 0%, #0085DE 100%);
  border-radius: 50%;
  font-family: Inter, Inter;
  font-weight: bold;
  font-size: 0.3rem;
  color: #FFFFFF;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: .4;
  margin-right: .37rem;
  transition: all .3s;
}

.historyItemBox:hover .year {
  opacity: 1;
}

.historyItem:nth-child(2n-1) .year {
  margin: 0;
  margin-left: .37rem;
}

.historyText {
  font-family: Microsoft YaHei, Microsoft YaHei;
  font-weight: 400;
  font-size: 0.16rem;
  color: #636F7D;
  line-height: 0.3rem;
  margin-right: .2rem;
  transition: all .3s;
  width: 3.57rem;
}

.historyText p,
.historyText span{
    font-size: 0.16rem!important;
}

.historyItemBox:hover .historyText {
  color: #0F4892;
}

.historyItem:nth-child(2n-1) .historyText {
  margin: 0;
  margin-left: .2rem;
  text-align: right;
}


.historyImg {
  width: 2.17rem;
  height: 1.45rem;
}


.h_list {
    display: flex;
    flex-wrap: wrap;
    margin-left: -0.15rem;
    margin-right: -0.15rem;
}

.h_list .h_item {
    padding: 0 0.15rem;
    margin-bottom: 0.3rem;
    max-width: 5.73rem;
    box-sizing: border-box;
}

.h_list .h_title {
    font-size: 0.16rem;
    color: #000000;
    text-align: center;
    margin-top: 0.18rem;
}

.h_list .scale-box {
    /*height: 3.75rem;*/
    /*max-width: 5.43rem;*/
    /*max-height: 4.43rem;*/
}

.h_list .scale-box img{
    object-fit: contain!important;
}

.strength {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  padding-top: .29rem;
}

.strengthItem {
  width: 6.66rem;
  height: 3.33rem;
  margin-right: .68rem;
  position: relative;
  margin-bottom: 2.01rem;
}

.strengthItem:nth-child(2n) {
  margin-right: 0;
}

.strengthText {
  width: 6rem;
  height: 2.13rem;
  background: #FFFFFF;
  position: absolute;
  top: 2.55rem;
  left: 50%;
  transform: translateX(-50%);
  box-shadow: 0rem 0rem 0.5rem 0rem rgba(0, 0, 0, 0.05);
  border-radius: 0.04rem 0.04rem 0.04rem 0.04rem;
  transition: all .3s;
}

.strengthTextC {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  padding: .34rem .81rem 0 .72rem;
  box-sizing: border-box;
}

.strengthNum {
  font-family: Microsoft YaHei, Microsoft YaHei;
  font-weight: bold;
  font-size: 1.5rem;
  color: rgba(144, 144, 144, 0.1);
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: .29rem;
}

.strengthTit {
  font-family: Microsoft YaHei, Microsoft YaHei;
  font-weight: bold;
  font-size: 0.3rem;
  color: #202020;
  margin-bottom: .1rem;
}

.strengthTxt {
  font-family: Microsoft YaHei, Microsoft YaHei;
  font-weight: 400;
  font-size: 0.16rem;
  color: #555555;
  line-height: 0.32rem;
}

.strengthItem:hover .strengthText{
  background: linear-gradient( 92deg, #699FE4 0%, #435CDB 52%, #2F7DE2 100%);
}

.strengthItem:hover .strengthTit,
.strengthItem:hover .strengthTxt{
  color: #FFFFFF;
}
.strengthItem:hover .strengthNum{
    color: rgba(255,255,255,0.3);
}


@media (max-width: 1024px) {
    .content{
        padding:0 20px !important;
        width: 100%;
        box-sizing: border-box;
    }
    
    .banner {
        height: auto;
        margin-top: 51px;
    }
    
    .banner img{
        animation:none;
        display: block;
    }
    
    .content .aboutNav{
        flex-wrap:wrap;
        padding-bottom: 10px;
    }
    
    .aboutNav{
        width: 100% !important;
        box-sizing: border-box;
        justify-content: center;
    }
    
    .aboutNavL{
        flex-wrap: wrap;
    }
    
    .aboutNavitem{
        width: 75px;
        height: 25px;
        padding:0;
        font-size: 14px;
        margin-bottom: 5px;
    }
    
    .aboutNavR{
        display: none;
    }
    
    .content .aboutTab .aboutTabitem{
        font-size: 12px;

    }
    
    .aboutDetail{
        flex-wrap: wrap;
    }
    
    .aboutDetail .aboutDetailL .aboutTitle{
        font-size: 20px;
    }
    
    .aboutDetail .aboutDetailL .aboutText{
        font-size: 17px;
    }
    
    .aboutItem .aboutItemTit img{
        width: 20px;
        height: 20px;
    }
    
    .aboutItemTit p{
        font-size: 14px;
    }
    
    .aboutItemTxt{
        font-size: 14px;
    }
    
    .aboutDetail .aboutDetailL .numBox{
        justify-content: center;
    }
    
    .strengthTit{
        font-size: 14px;
    }
    
    .strengthTxt{
        font-size: 12px;
    }
    
    .numBox {
        justify-content: space-between !important;
    }
    
    .numBox .numItem{
        margin: 0;
    }
    
    .numBox .numTop .num{
        font-size: 27px;
    }
    
    .numBox .numTop .numTxt{
        font-size:12px;
    }
    
    .numB{
        font-size: 12px;
    }
    
    .aboutDetail .aboutDetailR{
        width: 100%;
        display: flex;
        justify-content: center;
        margin:20px 0 0 0;
    }
    
    .historyText p, .historyText span{
        font-size: 12px !important;
    }
    
    .historyItem {
        height: auto;
        margin-bottom: 40px;
    }
    
    .year{
        /*margin-right: 10px;*/
        width: 0.85rem;
        height: 0.85rem;
            /*font-size: 0.28rem;*/
    }
    .historyText{
        width: 3.8rem;
        /*flex: 1;*/
    }
    
    .historyItem:nth-child(2n-1) .year{
        margin-left:10px;
    }
    
    /*公司实力*/
    .strengthItem{
        margin: 0;
        margin-bottom:100px;
    }
    /*领导简介*/
    
    .people{
        padding:0 21px;
    }
    .peopleBox {
        box-sizing: border-box;
        width: 100% !important;
    }
    
    .peopleBoxItem{
        justify-content: space-between;
    }
    
    .peopleBox .peopleBoxItem .peopleItem{
        width: 48%;
        margin-right: 0;
    }

    .peopleImg{
        height: auto !important;
        margin-bottom: 0 !important;
    }
    
    .peopleText{
        display: flex;
        flex-direction: column;
        align-items: flex-start !important;
    }
    
    .peopleText .peopleName{
        font-size: 16px;
    }
    
    .peopleText .peopleJob{
        width: 108px;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        font-size: 14px;
    }
    .aboutDetail .h_list{
        justify-content: flex-start;
    }
    
    .h_list .h_item{
        max-width: none !important;
        flex: 0 0 50%;
    }
    
    .h_list .h_title{
        font-size: 14px;
    }
    
    .h_list .scale-box{
        height: 200px;
    }
    
    .historyItemBox{
        /*width: 100%;*/
        border: none !important;
        box-sizing: border-box;
    }
    .historyImg{
            width: 1.97rem;
    }
    .historyItemBox img{
        /*display: none;*/
    }
    
    .historyItem:nth-child(2n-1) .historyItemBox{
        border: none;
        box-sizing: border-box;
    }
    
    .historyItemBox::after{
        content:none !important;
    }
    
}