.about-phylogeny-button {
   position: relative;
   /* background-color: pink; */
}

.add-hand {
   cursor: pointer;
}

.about-phylogeny-wire {
   width: 64.13rem;
   height: 2.75rem;
   /* border-bottom: 0.2rem solid var(--theme-bg-color9); */
   /* margin-top: 2.4rem; */
   background-image: url(../../img/aboutImg/about-arrows.png);
   background-size: 100% 100%;
   /* background-color: red; */
   position: absolute;
   top: -1rem;
   left: 0;


}

.about-phylogeny-wire-dot {
   position: absolute;
   top: -0.3rem;
   left: 0;
   display: flex;
   margin-left: 10.17rem;
   /* background-color: pink; */
}



.about-phylogeny-wire-dot li {
   width: 1rem;
   height: 1rem;
   border-radius: 50%;
   background-color: var(--yellow-color1);
   margin-right: 10.29rem;
   border: 0.1rem solid var(--theme-bg-color9);

}

.about-phylogeny-wire-dot li.active {
   width: 1rem;
   height: 1rem;
   border-radius: 50%;
   background-color: var(--theme-bg-color5);
}

.wire-dot-box.active {}

/* =========================== */


.about-time-button {
   display: flex;
   position: absolute;
   /* top: 1.42rem; */
   top: 1.8rem;
   left: 7.88rem;

}

.about-time-button ul {
   display: flex;
}

.about-time-button ul li {
   width: 6.72rem;
   height: 1.92rem;
   background: var(--theme-bg-color9);
   box-shadow: 0rem 0rem 0rem 0rem #4A7A01;
   border-radius: 0.41rem;
   display: flex;
   justify-content: center;
   align-items: center;
   font-size: 1.42rem;
   font-family: Akrobat;
   font-weight: 800;
   color: var(--white-color1);
   margin-right: 4.63rem;
}

.wrap-box {
   /* width: 100%; */
   /* background-color: green; */
   /* display: flex;
      justify-content: center; */
}

.top-box {
   width: 100%;
   /* display: flex;
      justify-content: center;
      position: relative; */
   position: sticky;
   left: 0;
   top: 0;
   background-color: var(--white-color);
   z-index: 999;
}

.min-header {
   width: 100%;
   height: 2.63rem;
   background-color: var(--black-color1);
}

.min-header .min-header-box {
   height: 100%;
   display: flex;
   margin-left: 12.5rem;
   justify-content: space-between;

}

.min-header .min-header-box .min-header-left {
   /* width: 50%; */
   width: 100%;
   display: flex;
   align-items: center;
   font-size: 0.83rem;
   font-family: Source Han Sans CN;
   font-weight: 500;
   color: var(--white-color);
}

.min-header .min-header-box .min-header-left .min-header-letter {
   /* width: 13.5rem; */
   margin-right: 6.5rem;
   height: 1.04rem;
   display: flex;
   align-items: center;

}

.min-header .min-header-box .min-header-left .min-header-letter img {
   width: 1.04rem;
   height: 1.04rem;
   margin-right: 0.46rem;

}

.min-header .min-header-box .min-header-left .min-header-time {
   display: flex;
   align-items: center;
}

.min-header .min-header-box .min-header-left .min-header-time img {
   width: 1.04rem;
   height: 1.04rem;
   margin-right: 0.42rem;
}

.min-header .min-header-box .min-header-right {
   /* width: 30%; */
   display: flex;
   align-items: center;
   justify-content: end;
   margin-right: 12.25rem;
}

.min-header .min-header-box .min-header-right .min-header-logo {
   width: 1.46rem;
   height: 1.46rem;
   margin-left: 0.54rem;

}

.min-header .min-header-box .min-header-right .min-header-logo img {
   width: 100%;
}

/* 头部 */
.wrap-box .wrap-header {
   width: 100%;
   height: 5rem;
   display: flex;
   align-items: center;
}

.leftLogo {
   width: 9.96rem;
   height: 2.17rem;
}

.leftLogo img {
   width: 100%;
}


.headerTab ul {
   /* 准确 */
   /* width: 41.79rem; */
   height: 2.54rem;
   margin-left: 2.33rem;
   /* 准确 */
   /* margin-right: 6.57rem; */
   margin-right: 5.5rem;
   display: flex;
   align-items: center;
}

.headerTab ul li {
   width: 6rem;
   height: 2.54rem;
   margin-right: 0.84rem;
   box-sizing: border-box;
   font-size: 1.04rem;
   font-family: Poppins;
   font-weight: 500;
   color: #252525;
   display: flex;
   align-items: center;
   justify-content: center;

}

.headerTab ul li:nth-child(5) {
   width: 6rem;
   height: 2.54rem;
   margin-right: 0.84rem;
   box-sizing: border-box;
   font-size: 1.04rem;
   font-family: Poppins;
   font-weight: 500;
   background: var(--theme-bg-color1);
   border-radius: 0.5rem;
   color: var(--white-color);


}

.headerTab>ul li :hover a{
   width: 6rem;
   height: 2.54rem;
   text-align: center;
   background: var(--theme-bg-color5);
   border-radius: 0.5rem;
   color: var(--white-color);
   display: flex;
   align-items: center;
   justify-content: center;

}

.rightCountry {
   width: 2.92rem;
   height: 2.92rem;
   display: flex;
   justify-content: end;
}

.rightCountry img {
   width: 100%;
}

/* =================================内容===================================== */

.about-conten-wrap .about-conten-box1 {
   width: 100%;
   height: 45rem;
   position: relative;
}

.about-conten-wrap .about-conten-box1 img {
   width: 100%;
}







.about-conten-box1 .about-image1-text-box {
   position: absolute;
   left: 19.375rem;
   top: 9.5rem;
   width: 100%;
   font-family: Roboto, Roboto;
   font-weight: bold;
   font-size: 3.5rem;
   color: #FFFFFF;
   line-height: 5.25rem;
}




.about-conten-box2 {
   width: 100%;
   display: flex;
   justify-content: center;
   margin-top: 7.5rem;
   padding-bottom: 7.5rem;
   box-sizing: border-box;
   position: relative;
   overflow: hidden;
    background: url('../../img/aboutImg/about_mian_bg.png') no-repeat;
    background-size: 100% 100%;
   /* background-color: red; */
   /* background: linear-gradient(to left, #E6E6E6, #ffffff); */

}

.about-conten-box2 .about-describe-box {
   padding: 0 20rem 0;
}

.about-conten-box2 .about-describe-box1 {
   text-align: center;
   margin-bottom: 3.75rem;
   font-size: 2.5rem;
   font-family: PingFang SC-Heavy, PingFang SC;
   font-weight: 800;
   color: #17171A;
   line-height: 2.9375rem;
}

.about-conten-box2 .about-describe-box2 {
   font-size: 1.25rem;
   font-family: PingFang SC-Regular, PingFang SC;
   font-weight: 500;
   color: #323238;
   line-height: 2.25rem;
}

.about-conten-box2 .about-describe-box2>span {
   color: #0B0B0D;
}

.about-conten-box2 .about-describe-box3 {
   width: 49.42rem;
   height: 28.5rem;
   /* margin-bottom: 3.29rem; */
   margin-bottom: 2.42rem;
   /* background-color: red; */
}

.about-conten-box2 .about-describe-box3 img {
   width: 100%;
}

.about-conten-box2 .about-describe-box4 {
   margin-top: 1.25rem;
   font-size: 1.25rem;
   font-family: PingFang SC-Regular, PingFang SC;
   font-weight: 500;
   color: #323238;
   line-height: 2.25rem;
}

.about-conten-box2 .about-describe-box4>span {
   color: #17171A;
}

.about-conten-box2 .about-describe-box5 {
   width: 1.38rem;
   height: 9.08rem;
   background: var(--theme-bg-color1);
   position: absolute;
   top: 3.58rem;
   left: 0;
}

.about-conten-box2 .about-describe-box6 {
   width: 1.38rem;
   height: 12.38rem;
   background: var(--theme-bg-color1);
   position: absolute;
   bottom: 2.58rem;
   left: 0;
}

.about-conten-box3 {
   width: 100%;
   /* height: 23.83rem; */
   /* background-image: url(../../img/aboutImg/about-instrument-background.png); */
   /* background-size: 100% 100%; */
   /* margin-top: 2.33rem; */
}

.about-conten-box3 .about-instrument-box {
   /* width: 50.04rem; */
   /* margin-left: 14.75rem; */

   display: flex;
   align-items: center;
   justify-content: center;
   font-size: 0.75rem;
   font-family: Poppins;
   font-weight: 500;
   color: var(--white-color);
}

.about-conten-box3 .about-instrument-box .about-instrument-box1 {
   margin-right: 7.5rem;

}

.about-conten-box3 .about-instrument-box .about-instrument-box1:nth-last-child(1) {
   margin-right: 0;
}

.about-conten-box3 .about-instrument-box .about-instrument-box1 .about-instrument-img {
   width: 21.6875rem;
   height: 21.6875rem;
   /* margin-top: 1.88rem; */

}

.about-conten-box3 .about-instrument-box .about-instrument-box1 .about-instrument-img img {
   width: 100%;
}

.about-conten-box3 .about-instrument-box .about-instrument-box1 .about-instrument-text {
   /* width: 13.08rem; */
   /* height: 2.13rem; */
   /* background: var(--theme-bg-color1); */
   border-radius: 0.41rem;
   display: flex;
   justify-content: center;
   align-items: center;
   margin: 0 auto;
   margin-top: 2.5rem;
   font-size: 1.5rem;
   font-family: PingFang SC-Bold, PingFang SC;
   font-weight: bold;
   color: #000000;
   line-height: 1.75rem;
}

.about-conten-box3 .about-instrument-box .about-instrument-box2 {
   margin-right: 0.79rem;
}

.about-conten-box4 {
   margin-bottom: 6.25rem;
   width: 100%;
   /* height: 48.75rem; */
   display: flex;
   justify-content: center;
   /* background: linear-gradient(to left, #ffffff, #F9FEF2); */

}

.about-conten-box4 .about-phylogeny-box {
   width: 100%;
   /* width: 64.13rem; */
   /* background-color: aqua; */


}

.about-conten-box4 .about-phylogeny-box .about-phylogeny-box1 {
   margin-top: 6.25rem;
   text-align: center;
   font-size: 3.5rem;
   font-family: PingFang SC-Heavy, PingFang SC;
   font-weight: bold;
   color: #262626;
   line-height: 4rem;
}

.about-conten-box4 .about-phylogeny-box .about-phylogeny-box2 {
   /* width: 56.5rem;
      height: 18.4rem;
      border-radius: 1.07rem;
      margin: 0 auto;
      display: flex;
      padding: 0.83rem 0.79rem;
      box-sizing: border-box;
      background: linear-gradient(to left, #C6E894, #EFF8E1); */
   padding-bottom: 4.08rem;
   /* background-color: yellow; */
   position: relative;


}

.about-conten-box5{
   width: 100%;
   height: 40.625rem;
   position: relative;
   font-size: 0;
   }
   .about-conten-box5 .bg_img{
      width: 100%;
      height: 100%;
   }
   .about-conten-box5 .about-box5-abs{
      width: 59.0625rem;
      height: 100%;
      padding: 6.6875rem 0 0 5.9375rem;
      box-sizing: border-box;
      position: absolute;
      right: 0;
      top: 0;
   }
   .about-box5-abs  .box-conten-title{
      font-family: Roboto, Roboto;
      font-weight: bold;
      font-size: 2.5rem;
      color: #FFFFFF;
      line-height: 2.25rem;
      margin-bottom: 4rem
   }
   .about-box5-abs  .box-conten-flex{
      display: flex;
      align-items: center;
      font-size: 0;
      margin-bottom: 2.5rem;
   }
   /* .about-box5-abs  .box-conten-flex:nth-of-type(3){
      margin-bottom: 4rem;
   } */
   .about-box5-abs  .box-conten-flex .icon{
      width: 3.5rem;
      height: 3.5rem;   
      margin-right: 1.5rem;
   }
   .about-box5-abs  .box-conten-text{
      font-family: Source Han Sans CN, Source Han Sans CN;
      font-weight: 500;
      font-size: 1.375rem;
      color: #FFFFFF;
      line-height: 1.875rem;
   }
   .about-box5-abs  .box-conten-text1{
      font-family: Source Han Sans CN, Source Han Sans CN;
      font-weight: 400;
      font-size: 1.125rem;
      color: #FFFFFF;
      line-height: 1.625rem;
      margin-top: .625rem;
   }
   
   .about-box5-abs  .box-conten-text1 span:nth-of-type(2){
      margin-left: 2rem;
   }


#hide-box {
   width: 56.5rem;
   height: 18.4rem;
   border-radius: 1.07rem;
   margin: 0 auto;
   display: flex;
   padding: 0.83rem 0.79rem;
   box-sizing: border-box;
   background: linear-gradient(to left, #C6E894, #EFF8E1);
}

.about-conten-box4 .about-phylogeny-box .about-phylogeny-box2 .hide {
   width: 56.5rem;
   height: 18.4rem;
   border-radius: 1.07rem;
   margin: 0 auto;
   display: flex;
   padding: 0.83rem 0.79rem;
   box-sizing: border-box;
   background: linear-gradient(to left, #C6E894, #EFF8E1);

}

.about-conten-box4 .about-phylogeny-box .about-phylogeny-box2 .phylogeny-box2-left {
   width: 28.88rem;
   height: 16.75rem;
   background-color: var(--white-color);
   border-radius: 1rem 0 0 1rem;
   box-shadow: 0.05rem 0 0.3rem 0.01rem gray;

}

.about-conten-box4 .about-phylogeny-box .about-phylogeny-box2 .phylogeny-box2-left .phylogeny-box2-left-logo {
   width: 11.33rem;
   height: 5.29rem;
   margin-top: 3.04rem;
   margin-left: 3.92rem;
   margin-bottom: 2.08rem;
   display: flex;
   align-items: center;

}

.about-conten-box4 .about-phylogeny-box .about-phylogeny-box2 .phylogeny-box2-left .phylogeny-box2-left-logo img {
   width: 100%;
   /* height: 100%; */

}

.about-conten-box4 .about-phylogeny-box .about-phylogeny-box3 {
   /* width: 26.08rem;
      height: 16.75rem; */

}

.about-conten-box4 .about-phylogeny-box .about-phylogeny-box2 .phylogeny-box2-left .phylogeny-box2-left-name {
   font-size: 1.38rem;
   font-family: Poppins;
   font-weight: 400;
   color: var(--black-color1);
   /* margin-top: 2.08rem; */
   margin-left: 3.96rem;
   line-height: 1.88rem;
}

.about-conten-box4 .about-phylogeny-box .about-phylogeny-box2 .phylogeny-box2-right {
   width: 26.08rem;
   height: 16.75rem;
   border-radius: 0 1rem 1rem 0;
   background-color: var(--white-color);
   box-shadow: 0.05rem 0 0.3rem 0.01rem gray;
}

.about-conten-box4 .about-phylogeny-box .about-phylogeny-box2 .phylogeny-box2-right img {
   width: 100%;
}

/* 发展史 */
.tab-container {
   width: 100%;
   overflow: hidden;
}

.tabs {
   /* list-style: none;
      margin: 0;
      padding: 0;
      display: flex;
      justify-content: center; */
   display: flex;
}

.tabs li {
   width: 5.72rem;
   height: 1.92rem;
   background: var(--theme-bg-color9);
   box-shadow: 0rem 0rem 0rem 0rem #4A7A01;
   border-radius: 0.41rem;
   display: flex;
   justify-content: center;
   align-items: center;
   font-size: 1.42rem;
   font-family: Akrobat;
   font-weight: 800;
   color: var(--white-color1);
   margin-right: 4.63rem;

}

.tabs li:hover {
   background-color: var(--theme-bg-color5);
   cursor: pointer;

}

.tabs li.active {
   background-color: var(--theme-bg-color5);
}

.tab-content {
   display: flex;
   position: relative;
}

.tab-item {
   flex: 1;
   /* padding: 20px; */


   box-sizing: border-box;
   display: none;


}





/* .about-conten-box4 .about-phylogeny-box .about-phylogeny-box2 .phylogeny-box2-wire {
   width: 0.29rem;
   height: 4.08rem;
   background-color: red;
   position: absolute;
   top: -4rem;
   left: 0;
   z-index: 999999;

} */





.tab-item.active {
   display: block;
}

/* ====================================================== */

/* /里程碑切换部分 */
.carousel-container {
   position: relative;
   overflow: hidden;
   padding-top: 3.5rem;
   width: 100%;
   /* height: 57.6875rem; */
   /* background-color: skyblue; */
}

.carousel-container ul {
   display: flex;
   /* justify-content: center; */
   width: 80rem;
   margin: 0 auto;
}

.carousel-container ul li {
   display: flex;
   /* align-items: center; */
   /* justify-content: center; */
   flex-direction: column;
   /* position: absolute; */
   opacity: 0.3;
   background: #fff;
   transition: all 1.25s 0s ease-out;
}

.carousel-container ul li.active {
   opacity: 1;
   pointer-events: visible;
}

.carousel-container ul li .bottomText {
   opacity: 0;
   transition: all 1.25s 0s ease-out;
}

.carousel-container ul li.active .bottomText {
   opacity: 1;
}

.carousel-container ul li .topMainBox {
   display: flex;
   align-items: center;
}

.carousel-container ul li .topMainBox .leftBtn,
.carousel-container ul li .topMainBox .rightBtn {
   position: relative;
   overflow: hidden;
   width: 10.625rem;
   cursor: pointer;
   transform: translate(50%, 0%) scale(1.2);
   opacity: 0;
}

.carousel-container ul li.active .topMainBox .leftBtn,
.carousel-container ul li.active .topMainBox .rightBtn {
   opacity: 1;
   transform: translate(0, 0%) scale(1.2);
   pointer-events: visible;
   transition: 1.25s cubic-bezier(0.23, 1, 0.32, 1) 0.5s;
}

.carousel-container ul li.active .topMainBox div.rightBtn {
   transform: translate(0, 100%) scale(1.2);
   transition: 1.25s cubic-bezier(0.23, 1, 0.32, 1) 0.75s;
}


.carousel-container ul li .topMainBox .leftBtn .solidBOx {
   overflow: hidden;
   position: absolute;
   top: -10.625rem;
   right: -6.875rem;
   width: 12.5rem;
   height: 12.5rem;
   /* background-color: #C6E894; */
}

.carousel-container ul li .topMainBox .leftBtn .solidBOx::after {
   content: '';
   position: absolute;
   top: -1.3125rem;
   right: 5.625rem;
   width: 11.625rem;
   height: 13.4375rem;
   border: 1px dashed #000000;
   border-radius: 50%;
}

.carousel-container ul li .topMainBox .leftBtn .circleBox,
.carousel-container ul li .topMainBox .rightBtn .circleBox {
   width: 8.5rem;
   height: 5.1875rem;
   display: flex;
   justify-content: space-around;
   flex-direction: column;
   align-items: center;
}

.carousel-container ul li .topMainBox .rightBtn .circleBox {
   padding-left: 2.125rem;
}

.carousel-container ul li .topMainBox .leftBtn .circleBox p,
.carousel-container ul li .topMainBox .rightBtn .circleBox p {
   font-size: 1.25rem;
   font-family: PingFang SC-Medium, PingFang SC;
   font-weight: 500;
   color: #323238;
   line-height: 1.4375rem;
}

.carousel-container ul li .topMainBox .leftBtn .circleBox span,
.carousel-container ul li .topMainBox .rightBtn .circleBox span {
   position: relative;
   width: 2.5rem;
   height: 2.5rem;
   display: block;
   border: 1px solid #90D12E;
   border-radius: 50%;
   opacity: 1;
   background: #fff;
}

.carousel-container ul li .topMainBox .leftBtn .circleBox span::after,
.carousel-container ul li .topMainBox .rightBtn .circleBox span::after {
   content: '';
   position: absolute;
   left: 50%;
   top: 50%;
   transform: translate(-50%, -50%);
   width: .375rem;
   height: .375rem;
   border-radius: 50%;
   background-color: #90D12E;
}

.carousel-container ul li .topMainBox .rightBtn {
   display: flex;
   /* justify-content: end; */
   overflow: unset;
}

.carousel-container ul li .topMainBox .rightBtn .solidBOx {
   overflow: hidden;
   position: absolute;
   top: -2.375rem;
   right: 4.6875rem;
   width: 5.2rem;
   height: 4.5rem;
}

.carousel-container ul li .topMainBox .rightBtn .solidBOx::after {
   content: '';
   position: absolute;
   top: .5rem;
   right: -1.625rem;
   width: 13.625rem;
   height: 13.4375rem;
   border: 1px dashed #000000;
   border-radius: 50%;
}

.carousel-container ul li .topMainBox .imgBox {
   overflow: hidden;
   margin: 0 4.875rem;
   width: 45rem;
   height: 30rem;
   border-radius: 0.75rem;
   background-color: #fafafc;
}

.carousel-container ul li .topMainBox .imgBox img {
   width: 100%;
   height: 100%;
}

.carousel-container ul li .bottomText {
   margin-top: 2.5rem;
   text-align: center;
}

.carousel-container ul li .bottomText .timeBox {
   font-size: 1.625rem;
   font-family: PingFang SC-Bold, PingFang SC;
   font-weight: bold;
   color: #323238;
   line-height: 1.875rem;
}

.carousel-container ul li .bottomText .tipText {
   margin-top: 1rem;
   font-size: 1.25rem;
   font-family: PingFang SC-Regular, PingFang SC;
   font-weight: 400;
   color: #323238;
   line-height: 1.4375rem;
}

.rotateFadeOutClassName {
   animation: rotateFadeOut 1s;
   animation-fill-mode: forwards;
   transform-origin: left bottom;
}

.rotateFadeInClassName {
   animation: rotateFadeIn 1s;
   animation-fill-mode: forwards;
   transform-origin: right bottom;
}

.BMap_cpyCtrl {
   display: none;
}
.anchorBL {
   display: none;
}
.amap-logo img{
   display: none;
}
.amap-copyright {
   opacity:0;
}


/* 淡出动画 */
@keyframes rotateFadeOut {
   0% {
      transform: rotate(0deg);
   }

   100% {
      transform: rotate(180deg);
   }
}

/* 淡入动画 */
@keyframes rotateFadeIn {
   0% {
      transform: rotate(0deg);
   }

   100% {
      transform: rotate(180deg);
   }
}