.container {
	max-width: 1600px;
	margin: 0 auto;
}
@media (max-width:1600px){
  .container {
    max-width: 1400px;
    margin: 0 auto;
  }
}
.g-5, .gy-5 {
	--bs-gutter-y: 1rem;
  --bs-gutter-x: 1rem
}
.h1, h1{
  font-size: .48rem;
  font-weight: bold;
}
.h5, h5{
  font-size: .25rem;
  line-height: 1.5;
}
.h4, h4{
  font-size: .32rem;
  line-height: 1.5;
}
  .h2, h2{
    font-size: .8rem;
    font-weight: bold;
  }
.h3, h3{
    font-size: .75rem;
    font-weight: bold;
  }
@media (max-width:767px){
  .h3, h3{font-size: .4rem;}
  .g-5, .gy-5{
    --bs-gutter-y: .2rem;
  --bs-gutter-x: .2rem
  }
}
.ptb100{
  padding-top: 1rem;
  padding-bottom: 1rem;
}
.pb100{
  padding-bottom: 1rem;
}
.language-dropdown {
  position: relative;
  display: inline-block;
}

.lang-btn {
  background: var(--main-color);
  padding: 6px 12px;
  font-size: 14px;
  cursor: pointer;
  border-radius: 100px;
  color: #fff;
  display: flex;
  align-items: center;
  border: none;
  gap: 10px;
}

.lang-btn i {
  margin: 0 4px;
}

.lang-menu {
  display: none;
  position: absolute;
  top: 110%;
  left: 0;
  background: #fff;
  border: 1px solid #ccc;
  min-width: 120px;
  list-style: none;
  padding: 0;
  margin: 4px 0 0 0;
  border-radius: 4px;
  z-index: 1000;
}

.lang-menu li {
  border-bottom: 1px solid #eee;
}

.lang-menu li:last-child {
  border-bottom: none;
}

.lang-menu a {
  display: block;
  padding: 8px 12px;
  color: #333;
  text-decoration: none;
}

.lang-menu a:hover {
  background: #f0f0f0;
}
.top-title{
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.indexcate .top-title{justify-content: center;}
.top-title h3{
  font-size: .64rem;
  font-weight: bold;
  line-height: 1.4;
}
.top-title .cx-more2 i{
  transform: rotate(-45deg);
  color: #000;
  font-size: 1rem;
  transition: all .5s;
}
@media (max-width:767px){
  .top-title .cx-more2 i{font-size: .6rem;}
}
.top-title .cx-more2:hover i{
  transform: rotate(0);
}
.top-title .cx-more3{
  width: .9rem;
  height: .9rem;
  background: var(--main-color);
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 2rem;
}
.top-title .cx-more3 i{
  transform: rotate(-45deg);
  color: #fff;
  font-size: .5rem;
  transition: all .5s;
}
.top-title .cx-more3:hover i{
  transform: rotate(0);
}
.cx-more{padding: .18rem .6rem; border-radius: 1rem; background: var(--main-color); color: #fff; white-space: nowrap;}
.cx-more:hover{color: #fff; background: var(--hover-color);}
.cx-more i{
  transform: rotate(-45deg);
}
.header-right{display: flex; align-items: center; gap: .3rem; justify-content: center;}
.search {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: 10px 20px;
  color: #000;
  position: relative;
}
.header-sticky .search{
  color: #fff;
}
.search-box {
  display: none; /* 鍒濆闅愯棌 */
  position: absolute;
  top: 100%;
  right: 20px;
  border-radius: 4px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.2);
  overflow: hidden;
}
.search-box form {
  display: flex;
  align-items: center;
}
.search-box input {
  border: none;
  padding: 8px 10px;
  width: 180px;
  outline: none;
  font-size: 14px;
  background: #fff;
}
.search-box button {
  border: none;
  background: #084b7f;
  color: #fff;
  padding: 8px 12px;
  cursor: pointer;
  font-size: 14px;
}
.search-box button:hover {
  background: #bd3e2d;
}
.search-btn {
  font-size: 18px;
  cursor: pointer;
}
.bannerimg img{width: 100%;}
.bannertxt{
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}
.bannertxt .container{
  height: 100%;
}
.item2 .bannertxt .container{
  align-items: end;
  text-align: right;
}
.bannertxt h4{color: #fff; font-size: .40rem;}
.bannertxt h3{color: #fff; width: 60%; max-width: 800px; font-size: .56rem; text-shadow: -2px -2px 0 #3dc4ca, 2px 2px 0 #3dc4ca;}
.bannertxt .btns{margin-top: .3rem;}
.bannertxt .btns a{background: #3dc4ca;  color: #fff; border-radius: 2rem;transition: all .5s; line-height: .5rem; padding: 0 .4rem;display: inline-block;}
.bannertxt .btns a:last-child{margin-left: 5px; width: .5rem; height: .5rem; padding: 0; text-align: center;}
.bannertxt .btns a:last-child i{transform: rotate(-45deg); transition: all .5s;}
.bannertxt .btns a:last-child:hover i{transform: rotate(0);}
.bannertxt .btns a:hover{background: var(--main-color);}
.indexcate{
  overflow: hidden;
  background: linear-gradient(to bottom, rgba(0,73,190,.1) 0%, rgba(0,73,190,.05) 100%);
}
.indexcate .cateswiper{
  overflow: initial;
  margin-left: 0;
}
.indexcate .catebox{
  display: flex;
  align-items: center;
  max-width: 1200px;
  margin: 0 auto;
}
.indexcate .catebox .info{
  display: flex;
  flex-direction: column;
  gap: .3rem;
  width: 40%;
  max-width: 450px;
}
.indexcate .catebox .info .title{
  font-size: .4rem;
  color: var(--main-color);
  font-weight: bold;
}
.indexcate .catebox .info .desc{
  font-size: .24rem;
  color: #666;
}
.indexcate .catebox .info .more{
  margin-top: .5rem;
}
.indexcate .catebox .info .more a{
  padding: .2rem .5rem;
  background: var(--main-color);
  border-radius: 1rem;
  text-align: center;
  color: #fff;
}
.indexcate .catebox .img{
  max-width: 812px;
  width: 60%;
}
.indexcate .catebox .img img{
  max-width: 100%;
}
.swipernavwrap{
  position: absolute; right: 40px;
  top: 50%;
  z-index: 3;
}
.swipernav{
  position: relative;
  width: 80px;
}
.swipernav .swiper-button-next:after, .swipernav .swiper-button-prev:after{
  font-size: .3rem;
  color: #fff;
}
@media (min-width:768px){
  .swipernav .swiper-button-next, .swiper-rtl .swiper-button-prev{
    top: 1rem;
    left: 0;
    right: 0;
    background: var(--main-color);
    border-radius: .8rem;
    width: .8rem;
    height: .8rem;
  }
  .swipernav .swiper-button-prev, .swipernav .swiper-rtl .swiper-button-next{
    top: 0;
    left: 0;
    right: 0;
    background: var(--main-color);
    border-radius: .8rem;
    width: .8rem;
    height: .8rem;
  }
}
.indexcate .swiper-slide-next .catebox .info .title{
  color: rgba(0, 73, 190,.5);
}
.indexcate .swiper-slide-next .catebox .info .more a{
  background: rgba(0, 73, 190,.5);
}
.indexcate .swiper-slide-next .catebox .info .desc{
  opacity: .5;
}
.catetxt {
  position: absolute;
  bottom: 0;
  right: 0;
  z-index: 0;
  text-align: right;
  width: 100%;
    font-size: 7.6vw;
    font-weight: bold;
    -webkit-background-clip: text;
    background-clip: text;
    text-transform: uppercase;
    font-style: italic;
    color: transparent;
    -webkit-text-stroke: 1px rgba(0, 73, 190, .1);
    text-stroke: 1px rgba(0, 73, 190, .1);
}
.indexproduct{
  overflow: hidden;
}
.indexpro{
  margin-top: 1rem;
}
.indexpro.swiper{
  overflow: initial;
}
.indexpro .swiper-wrapper{
  align-items: stretch;
}
.indexpro .swiper-slide{
  height: 100%;
}
.probox{
  box-shadow: 0 4px 24px #2764af1a;
  display: flex;
  flex-direction: column;
  height: 100%;
  padding: 10px 10px 40px;
}
.probox .img{
  padding: 30px;
  text-align: center;
  aspect-ratio: 1 / 1;
  width: 100%;
  border-bottom: 1px solid rgba(153, 153, 153, .5);
}
.probox .img a{
  display: block;
  width: 100%;
  height: 100%;
}
.probox .img img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.probox .title{
  font-size: .24rem;
  font-weight: bold;
  color: #333;
  text-align: center;
  padding: .2rem 0;
}
.probox .more{
  text-align: center;
}
.probox .more a{
  font-size: .16rem;
  color: #333;
}
.probox:hover .more a{
  color: var(--main-color);
}
.project-inner-section .probox{margin-bottom: .3rem;}
.indexvideo .autoparts{
  background: url(../img/autobg.jpg) center no-repeat;
  background-size: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 1rem 0;
  gap: .3rem;
  background-attachment: fixed;
}
.indexvideo .autoparts .logo{width: 60%; max-width: 900px;}
.indexvideo .autoparts .logo img{width: 100%;}
.indexvideo .autoparts h2{
  color: #fff;
  font-size: .7rem;
}
.indexvideo .autoparts .desc{
  color: #fff;
  width: 90%;
  max-width: 1400px;
  margin: 0 auto;
  text-align: center;
}
.indexvideo .autoparts .cx-btn2{margin-top: .5rem;}
.indexvideo .autoparts .cx-more{
  font-size: .18rem;
}
.indexvideo .videobox{background: url(../img/videobg.jpg) top center no-repeat; background-size: 100%; padding: 1.5rem 0;}
.indexvideo .videoimg{
  width: 80%;
  margin: 0 auto;
  position: relative;
}
.indexvideo .videoimg img{
  border-radius: .4rem;
  width: 100%;
}
.playbtn{
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.playbtn .play-btn {
  color: var(--ztc-text-text-1);
  font-family: var(--ztc-family-font1);
  font-size: var(--ztc-font-size-font-s18);
  font-style: normal;
  font-weight: var(--ztc-weight-bold);
  line-height: 18px;
  padding-left: 24px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: .1rem;
}
@media (max-width: 767px) {
  .playbtn .play-btn {
    padding-left: 0;
    margin-top: 20px;
  }
  .aboutvideo .playbtn .play-btn{margin-top: 0;}
}
.playbtn .play-btn .video {
  height: 56px;
  width: 56px;
  text-align: center;
  line-height: 56px;
  border-radius: 50%;
  display: inline-block;
  transition: all 0.4s;
  color: var(--ztc-text-text-2);
  background: var(--ztc-bg-bg-1);
  font-size: var(--ztc-font-size-font-s20);
  margin: 0 10px 0 0;
  position: relative;
  z-index: 1;
}
.playbtn .play-btn .video::after {
  position: absolute;
  content: "";
  height: 100%;
  width: 100%;
  left: 28px;
  top: 28px;
  background: var(--ztc-bg-bg-1);
  transition: all 0.4s;
  border-radius: 50%;
  z-index: -1;
  animation: pulse-border 1500ms ease-out infinite;
  opacity: 40%;
}
@media (max-width:767px){
  .playbtn .play-btn .video{
    width: 44px;
    height: 44px;
    line-height: 44px;
  }
  .playbtn .play-btn .video::after{
    left: 22px;
    top: 22px;
  }
}
.indexhonor{
  position: relative;
}
.indexhonor .img img{width: 100%; display: block;}
.indexhonor .honortit{
  position: absolute;
  width: 100%;
  height: 100%;
  top: 1rem;
  left: 0;
}
.indexhonor .honortit h3{
  margin-bottom: .5rem;
}
.indexhonor .honortit .cx-more2{
  display: block;
}
.indexhonor .honortit .cx-more2 i{
  transform: rotate(-45deg);
  color: #000;
  font-size: 1rem;
}
@media(max-width:767px){
  .indexhonor .honortit{top: .3rem;}
  .indexhonor .honortit .cx-more2 i{font-size: .6rem;}
}
.indexservice ul{
  display: flex;
  justify-content: space-between;
}
.indexservice ul li{
  width: 25%;
  position: relative;
}
.indexservice ul li .img{
  position: relative;
  overflow: hidden;
  height: 100%;
}
.indexservice ul li:hover .img::after{
  position: absolute;
  width: 100%;
  height: 100%;
  display: block;
  content: "";
  top: 0;
  left: 0;
  background: linear-gradient(to top, rgba(0,73,190,.8) 0%, rgba(255,255,255,0) 50%, rgba(255,255,255,0) 100%);
}
.indexservice ul li .img img{
  width: 100%;
  display: block;
}
.indexservice ul li:hover .img img{transform: scale(1.05);}
.indexservice ul li .info{
  position: absolute;
  top: 0;
  height: 100%;
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: end;
  padding-bottom: .8rem;
  gap: .3rem;
  align-items: center;
  transition: all .3s;
}
.indexservice ul li:hover .info{
padding-bottom: 1rem;
}
.indexservice ul li .info .tit{
  font-weight: bold;
  color: #fff;
  font-size: .2rem;
}
@media(max-width:767px){
  .indexservice ul{flex-wrap: wrap;}
  .indexservice ul li{width: 50%;}
  .indexservice ul li .info .icon img{max-width: 60px;}
}
.indexnetwork{
  background: linear-gradient(to bottom, rgba(0,73,190,1) 0%, rgba(255,255,255,0) 80%, rgba(255,255,255,0) 100%);
  background-size: cover;
  overflow: hidden;
}
.indexnetwork .top-title h3{color: #fff;}
.indexnetwork .top-title .cx-more2 i{color: #fff;}
.indexnetwork .top-title.milestones-title h3{color: #000;}
.indexnetwork .top-title.milestones-title .cx-more2 i{color: #000;}
.indexnetwork .databox{
  border-top: 1px solid rgba(153, 153, 153, .5);
  padding-top: .5rem;
  padding-bottom: 1rem;
  margin-top: .5rem;
  display: flex;
  justify-content: space-between;
}
.indexnetwork .databox .left{
  width: 68%;
}
.indexnetwork .databox h5{
  font-size: .2rem;
  color: #fff;
  max-width: 8rem;
}
.indexnetwork .earth_wrap {
  position: absolute;
  top: max(calc(266px * var(--base-ratio)), calc(calc(266 / var(--base-size)) * var(--base-percent)));
  left: 0;
  width: 100%;
  height: 100%;
}
.indexnetwork .earth_wrap .earth_box {
  width: 100%;
  mix-blend-mode: screen;
}
.sticky {
  position: -webkit-sticky;
  position: sticky;
  top: max(calc(calc(calc(1 / var(--base-size)) * var(--base-percent)) * -1));
  left: 0;
  width: 100%;
  height: calc(100vh + max(calc(2px * var(--base-ratio)), calc(calc(2 / var(--base-size)) * var(--base-percent))));
  overflow: hidden;
}
.indexnetwork .databox .earth{padding-top: .3rem; width: 8rem; max-width: 80%;}
.indexnetwork .databox .right{
  width: 32%;
}
.counter-boxarea .counter-box{
  display: flex;
  align-items: center;
  border-bottom: 1px solid rgba(153, 153, 153, .5);
  padding: .5rem 0;
}
.counter-boxarea .counter-box h2{
  color: var(--main-color);
  width: 2.2rem;
  font-size: .6rem;
}
.counter-boxarea .counter-box h2 span{
  font-size: .8rem;
}
.counter-boxarea .counter-box p{
  width: calc(100% - 2.2rem);
}
.indexnetwork .counter-boxarea .counter-box{border-bottom: 1px solid rgba(255, 255, 255, 1);}
.indexnetwork .counter-boxarea .counter-box p{color: #fff;}
.indexnetwork .counter-boxarea .counter-box h2{color: #fff;}
@media(max-width:992px){
  .counter-boxarea .counter-box{padding: .3rem 0;}
  .indexnetwork .databox{flex-wrap: wrap;}
  .indexnetwork .databox .left{width: 100%;}
  .indexnetwork .databox .right{width: 100%;}
}
.milestones{
  border-top: 1px solid rgba(153, 153, 153, .5);
  padding-top: .8rem;
  margin-top: .5rem;
  display: flex;
}
.milestones .leftinfo{
  width: 20%;
  padding: 0 .5rem;
}
.milestones .hisswiper{
  width: 80%;
  padding: 0px 0 20px;
}
.milestones .hisswiper .swiper-slide{
  overflow: hidden;
  box-shadow: 0 4px 24px #2764af1a;
  border-radius: .2rem;
}
.milestones .hisswiper .swiper-slide::after{
    content: "";
    width: 100%;
    height: 100%;
    background: rgba(0, 73, 190, .6);
    position: absolute;
    top: 0;
    left: 0;
    transition: all .36s;
    opacity: 0;
}
.milestones .hisswiper .swiper-slide:hover::after{
  opacity: 1;
}
.milestones .hisswiper .hisbox{
  padding: .4rem;
  background: #fff;
  
  position: relative;
  overflow: hidden;
  
}
.milestones .hisswiper .hisbox h4{
  font-size: .2rem;
  font-weight: bold;
  color: var(--main-color);
  margin-bottom: .3rem;
  position: relative;
  z-index: 1;
}
.milestones .hisswiper .hisbox p{
  border-bottom: 1px solid rgba(153, 153, 153, .5);
  margin-bottom: .2rem;
  padding-bottom: .2rem;
  position: relative;
  font-size: .24rem;
  height: 3rem;
  z-index: 1;
}
.milestones .hisswiper .cover{
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  border-radius: .2rem;
  overflow: hidden;
  z-index: 1;
  transition: all .5s ease;
  transform: translateX(110%);
}
@media(min-width:1200px){
  .milestones .hisswiper .swiper-slide:hover .cover{
    transform: translateX(0);
  }
}
.milestones .hisswiper .cover::after{
  content:"";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: linear-gradient(to top, rgba(0,73,190,.1) 0%, rgba(0,73,190,.7) 100%);
}
.milestones .hisswiper .cover img{
  object-fit: cover;
  width: 100%;
  height: 100%;
  transition: all .5s;
}
.milestones .hisswiper .hisbox .img{
  text-align: right;
}
.milestones .hisswiper .hisbox .img img{
  max-width: 150px;
  max-height: 100px;
}
.milestones .hisswiper .swiper-slide:hover h4{
  color: #fff;
}
.milestones .hisswiper .swiper-slide:hover p{
  color: #fff;
}
.milestones .hisswiper .swiper-slide:hover .img{
  opacity: 0;
}
.milestones .hisswiper .swiper-slide:hover .cover{
  display: block;
  transition: all .5s;
}
.abouthistory{
  background: url(../img/milestonesbg.jpg) center no-repeat;
  background-size: cover;
}
.abouthistory .milestones .hisswiper{
  width: 100%;
  overflow: initial;
}
.abouthistory .milestones{
  border-top: none;
  margin-top: 0;
}
.newsswiper .swiper-slide{
  position: relative;
  overflow: hidden;
  border-radius: 12px;
}
.vl-blog-1-area .newsswiper .vl-blog-1-title{padding-right: 30px; display: flex;}
.vl-blog-1-area .vl-blog-1-item .vl-blog-1-content{position: relative;z-index: 2; transition: all .4s;}
.vl-blog-1-area .vl-blog-1-item .vl-blog-1-icon{
  position: absolute;
  right: .2rem;
  top: .3rem;
}
.newsswiper .img-box{
  aspect-ratio: 5 / 3;   /* 宽高比 4:3 */
  width: 100%;           /* 根据父容器宽度自适应 */
  overflow: hidden;      /* 超出裁剪 */
  position: relative;
  border-radius: 12px;
}
.newsswiper .img-box img {
  width: 100%;
  height: 100%;
  object-fit: cover;     /* 填充容器，保证覆盖 */
  display: block;
}
.newsswiper .cover{
  opacity: 0.6;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  transform: translateX(110%);
  transition: all .5s ease;
  z-index: 1;
}
.newsswiper .cover::after{
  background: linear-gradient(to bottom, rgba(0,73,190,.74) 0%, rgba(0,73,190,0) 100%);
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  display: block;
  top: 0;
  left: 0;
}
.newsswiper .cover img {
  width: 100%;
  height: 100%;
  object-fit: cover;     /* 填充容器，保证覆盖 */
  display: block;
}
.newsswiper .swiper-slide:hover .cover{
  opacity: 1;
  transform: translateX(0);
}
.vl-blog-1-area .vl-blog-1-item::after{
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: rgba(0,73,190,1);
  display: none;
}
.vl-blog-1-area .swiper-slide:hover .vl-blog-1-item::after{
  display: block;
}
.vl-blog-1-area .swiper-slide:hover .vl-blog-1-item .vl-blog-1-content{
  padding: 28px 24px 40px 24px;
}
.vl-blog-1-area .swiper-slide:hover .vl-blog-1-item .vl-blog-1-content .vl-blog-1-title a,.vl-blog-1-area .swiper-slide:hover .vl-blog-1-item .vl-blog-1-content p,.vl-blog-1-area .swiper-slide:hover .vl-blog-1-item .vl-blog-1-content .readmore{
  color: #fff;
}
.vl-blog-1-area .swiper-slide:hover .vl-blog-1-item .vl-blog-1-content .readmore i{
  transform: rotate(0);
}
.aboutinner{
  position: relative;
}
.aboutinner .bigword{
  font-size: 3rem;
  font-weight: bold;
  color: #fff;
  background: linear-gradient(to bottom, rgba(0,73,190,.17) 0%, rgba(255,255,255,0) 80%, rgba(255,255,255,0) 100%); /* 从红到蓝 垂直渐变 */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text; /* 非webkit浏览器支持 */
  line-height: 1;
  position: absolute;
  top: .2rem;
  right: 0;
}
.aboutinner .desc{
  font-size: .32rem;
  margin-top: .2rem;
  width: 60%;
}
.aboutinner .content{
  margin-top: 1rem;
  padding-left: 2rem;
  line-height: 2;
}
@media(max-width:992px){
  .aboutinner .bigword{font-size: 1.5rem;}
  .aboutinner .desc{width: 100%;}
  .aboutinner .content{padding-left: 0; margin-top: .5rem;}
}
.aboutinner .aboutvideo{
  padding-top: 1rem;
  position: relative;
}
.aboutculture{
  background: url(../img/cultrurebg.jpg) center no-repeat;
  background-size: cover;
  padding-bottom: 0;
}
.aboutinner .aboutvideo .playbtn{left: .5rem; top: .75rem;display: initial; right: auto; width: auto;}
.aboutinner .aboutvideo .playbtn .play-btn .video{background: var(--main-color); color: #fff;}
.aboutinner .aboutvideo .playbtn .play-btn .video::after{background: var(--main-color);}
.aboutculture .top-title h3{
  color: #fff;
}
.aboutculture .culturebox{
  padding-top: 3rem;
}
.aboutculture .culturebox ul li {
  position: relative;
  color: #fff;
  font-size: .26rem;
  cursor: pointer;
  line-height: 3;
}

.aboutculture .culturebox ul li::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  height: 1px;
  width: 100%;
  background: #fff;

  /* 初始状态缩小为0 */
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 0.3s ease;
}

.aboutculture .culturebox ul li.active::after {
  transform: scaleX(1); /* 展开到100% */
}
.aboutculture .cultureswiperbox{
  width: 50%;
  height: 4.2rem;
  background: var(--main-color);
  display: flex;
}
.aboutculture .cultureswiperbox .cultureswipernav{
  width: 1rem;
  position: relative;
}
.aboutculture .cultureswiperbox .cultureswipernav .swiper-button-next{
  transform: rotate(90deg);
  left: 0;
  right: 0;
  margin: auto;
  bottom: 0;
}
.aboutculture .cultureswiperbox .cultureswipernav .swiper-button-prev{
  transform: rotate(90deg);
  left: 0;
  right: 0;
  margin: auto;
  top: 10%;
}
.aboutculture .cultureswiper{
  width: calc(100% - 1rem);
  max-height: 4.2rem;
}
.aboutculture .cultureswiper .swiper-slide{
  padding: .4rem;
  border-left: 1px solid rgba(153, 153, 153, .4);
}
.aboutculture .cultureswiper .swiper-slide h4{color: #fff; padding: .2rem 0;}
.aboutculture .cultureswiper .swiper-slide .desc{color: #fff; line-height: 1.6; font-size: 16px;}
@media(max-width:992px){
  .aboutculture .culturebox{
    padding-top: .5rem;
    flex-wrap: wrap;
  }
  .aboutculture .cultureswiperbox{width: 100%; height: 6.2rem; margin-top: .2rem;}
  .aboutculture .cultureswiper{max-height: 6.2rem;}
  .aboutculture .cultureswiper .swiper-slide .icon img{width: 30px;}
  .aboutculture .cultureswiper .swiper-slide .desc{font-size: 14px;}
  .culturenav{width: 100%; display: flex; flex-wrap: wrap;}
  .aboutculture .culturebox ul li{width: 48%; text-align: center;}
}
.aboutteam .tabs{
  display: flex;
  gap: .2rem;
}
.aboutteam .tabs .tab{
  padding: .1rem .3rem;
  border-radius: .4rem;
  border: 1px solid #000;
  cursor: pointer;
}
.aboutteam .tabs .tab.active{
  background: var(--main-color);
  color: #fff;
  border-color: var(--main-color);
}
@media (max-width:767px){
  .aboutteam .tabs{margin-top: .2rem; gap: .1rem;}
  .aboutteam .top-title{flex-wrap: wrap;}
  .aboutteam .tabs .tab{white-space: nowrap;}
}
.teamswiper{
  margin-top: .8rem;
}
.teamswiper .swiper{
  display: none;
}
.teamswiper .swiper.active{
  display: block;
}
.teamswiper .swiper-slide {
      text-align: center;

      /* Center slide text vertically */
      display: -webkit-box;
      display: -ms-flexbox;
      display: -webkit-flex;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      -webkit-justify-content: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      -webkit-align-items: center;
      align-items: center;
	  transition: 300ms;
	  transform: scale(0.8);
    }
.teamswiper .swiper-slide .img{
  width: 100%;
}
.teamswiper .swiper-slide .img img{
  width: 100%;
}
.teamswiper .swiper-slide-active,.swiper-slide-duplicate-active{
      transform: scale(1);
	}
.abouthonor{
  background: url(../img/honorbg.jpg) center no-repeat;
  background-size: cover;
  position: relative;
}
.honorswiper1.swiper{
  margin-top: .8rem;
  padding-bottom: .8rem;
}
.prodetailtop{
  background: url(../img/productdetailbg.jpg) center no-repeat;
  background-size: cover;
  padding-top: 82px;
  padding-bottom: 1rem;
}
.prodetailtop .protopbg{background: #fff;padding: .4rem 0;}
.prodetailtop .btn-area1 a {
  color: #333;
  font-family: var(--ztc-family-font1);
  font-size: var(--ztc-font-size-font-s20);
  font-style: normal;
  font-weight: var(--ztc-weight-regular);
  line-height: 20px;
  display: inline-block;
  transition: all 0.4s;
}
.prodetailtop .btn-area1 a i {
  margin: 0 6px;
}
.prodetailtop .btn-area1 a span {
  font-weight: var(--ztc-weight-semibold);
  display: inline-block;
}
@media(max-width:767px){
  .prodetailtop .btn-area1{margin-top: .1rem;}
  .prodetailtop .btn-area1 a{font-size: 14px;}
}
.prodetailtop .proswiper .img{
  max-width: 800px;
  margin: 0 auto;
}
.prodetailtop .thumbnaillist{
  margin-top: .2rem;
}
.prodetailtop .thumbnaillist .swiper-wrapper{justify-content: center;}
.prodetailtop .thumbnaillist .swiper-slide{
  width: .8rem!important;
  border: 1px solid #ccc;
  padding: 5px;
  cursor: pointer;
}
.prodetailtop .thumbnaillist .swiper-slide.swiper-slide-thumb-active{
  border-color: var(--main-color);
}
.prodetailtop .proinfo{margin-top: 1rem;}
.prodetailtop .proinfo .datalist{background: rgba(255, 255, 255, .5); border-radius: 10px; padding: .3rem 0; margin-top: .5rem;}
.prodetailtop .proinfo .datalist > div{position: relative;}
.prodetailtop .proinfo .datalist > div::after{content: ""; background: url(../img/line.png) center no-repeat; width: 1px; height: 79px; position: absolute; right: 0; top: 0; bottom: 0; margin: auto;}
.prodetailtop .proinfo .datalist > div:last-child::after{display: none;}
.prodetailtop .proinfo .datalist > div span{display: block;}
.prodetailtop .proinfo .datalist > div span:first-child{display: block; margin-bottom: .1rem;}
.prodetailtop .proinfo .datalist > div span:last-child{font-size: 14px; color: #333;}

.prodetailtop .probtns{
  padding-top: .5rem;
}
.prodetailtop .probtns a{padding: .15rem .5rem; border: 1px solid #666; border-radius: 5rem; color: #333; transition: all .3s;}
.prodetailtop .probtns a:first-child,.prodetailtop .probtns a:hover{
  background: var(--main-color); color: #fff; border-color: var(--main-color);
}
.prodetailtop .probtns a i{margin-right: 10px;}
@media(max-width:767px){
  .prodetailtop .proinfo .datalist > div{margin-bottom: 15px;}
  .prodetailtop .proinfo .datalist > div:nth-child(2)::after{display: none;}
  .prodetailtop .proinfo .datalist > div::after{height: 40px;}
  .prodetailtop .probtns{
    flex-wrap: wrap;
  }
}
.parameters-content{
  margin-top: .5rem;
}
.parameters-content table{
  border: none;
  margin-bottom: 0;
}
.parameters-content table td{border: none; color: #666; padding: .2rem .3rem;}
.parameters-content table tr:first-child{border-top: 1px solid #D9E8FF;}
.parameters-content table tr:nth-child(odd){background: #F5F8FC;}
.parameters-content table tr:nth-child(even){border-bottom: 1px solid #D9E8FF;}
.parameters-content table tr td:nth-child(odd){
  color: #000;
  font-size: .2rem;
}
.product-detail{
  background: linear-gradient(to bottom, rgba(0,73,190,.11) 0%, rgba(0,73,190,0) 20%,rgba(0,73,190,0) 100%);
}
.detail-content{margin-top: .5rem; line-height: 1.8;}
.detail-content h3{font-size: .36rem; margin-bottom: .2rem;}
.detail-content table{border: none; line-height: 1.8; margin-bottom: 0;}
.detail-content td{padding: .2rem; border: none;vertical-align: middle;}
@media(max-width:767px){
  .detail-content tr{
    display: flex;
    flex-wrap: wrap;
  }
  .detail-content tr:nth-child(2n){
    flex-direction: column-reverse;
  }
}
.application{
  overflow: hidden;
}
.application .swiper{
  overflow: initial;
}
.application .swiper .img img{width: 100%;}
.proinquiry{background: url(../img/inquirybg.jpg) top center no-repeat; background-size: 100%;}
.proinquiry .top-title{margin-bottom: 1rem;}
.proinquiry .top-title h3{color: #fff;}
.proinquiry .inquirybox{border-radius: 28px; overflow: hidden; display: flex; box-shadow: 0 4px 24px #2764af1a;}
.proinquiry .inquirybox .left{min-width: 640px;width: 45%;}
.proinquiry .inquirybox .left img{width: 100%;}
.proinquiry .inquirybox .right{background: #fff; padding:.5rem .4rem; width: 55%;}
.proinquiry .inquirybox .right h4{font-weight: bold;}
@media(max-width:1600px){
  .proinquiry .inquirybox .left{min-width: initial;}
}
@media(max-width:992px){
  .proinquiry .inquirybox .left{display: none;}
  .proinquiry .inquirybox .right{width: 100%;}
}
.proinquiry .inquirybox .right .input-area {
  margin-top: 24px;
}
.proinquiry .inquirybox .right .input-area input {
  color: var(--ztc-text-text-2);
  font-family: var(--ztc-family-font1);
  font-size: var(--ztc-font-size-font-s18);
  font-style: normal;
  font-weight: var(--ztc-weight-medium);
  line-height: 18px;
  border-radius: 8px;
  border: 1px solid rgba(0, 127, 95, 0.1);
  background: var(--ztc-bg-bg-4);
  padding: 18px 16px;
  width: 100%;
}
.proinquiry .inquirybox .right .input-area input::-moz-placeholder {
  color: var(--ztc-text-text-3);
  font-family: var(--ztc-family-font1);
  font-size: var(--ztc-font-size-font-s18);
  font-style: normal;
  font-weight: var(--ztc-weight-regular);
  line-height: 18px;
}
.proinquiry .inquirybox .right .input-area input::placeholder {
  color: var(--ztc-text-text-3);
  font-family: var(--ztc-family-font1);
  font-size: var(--ztc-font-size-font-s18);
  font-style: normal;
  font-weight: var(--ztc-weight-regular);
  line-height: 18px;
}
.proinquiry .inquirybox .right .input-area input:focus{border-color: #f00;}
.proinquiry .inquirybox .right .input-area .nice-select {
  color: var(--ztc-text-text-3);
  font-family: var(--ztc-family-font1);
  font-size: var(--ztc-font-size-font-s18);
  font-style: normal;
  font-weight: var(--ztc-weight-regular);
  line-height: 18px;
  border-radius: 8px;
  border: 1px solid rgba(0, 127, 95, 0.1);
  background: var(--ztc-bg-bg-4);
  padding: 18px 16px;
  width: 100%;
  height: auto;
  box-shadow: none;
}
.proinquiry .inquirybox .right .input-area .nice-select::after {
  height: 7px;
  width: 7px;
  right: 16px;
}
.proinquiry .inquirybox .right .input-area .nice-select ul {
  width: 100%;
}
.proinquiry .inquirybox .right .input-area textarea {
  color: var(--ztc-text-text-2);
  font-family: var(--ztc-family-font1);
  font-size: var(--ztc-font-size-font-s18);
  font-style: normal;
  font-weight: var(--ztc-weight-medium);
  line-height: 18px;
  border-radius: 8px;
  border: 1px solid rgba(0, 127, 95, 0.1);
  background: var(--ztc-bg-bg-4);
  padding: 18px 16px;
  width: 100%;
  height: 200px;
}
.proinquiry .inquirybox .right .input-area textarea::-moz-placeholder {
  color: var(--ztc-text-text-3);
  font-family: var(--ztc-family-font1);
  font-size: var(--ztc-font-size-font-s18);
  font-style: normal;
  font-weight: var(--ztc-weight-regular);
  line-height: 18px;
}
.proinquiry .inquirybox .right .input-area textarea::placeholder {
  color: var(--ztc-text-text-3);
  font-family: var(--ztc-family-font1);
  font-size: var(--ztc-font-size-font-s18);
  font-style: normal;
  font-weight: var(--ztc-weight-regular);
  line-height: 18px;
}
.proinquiry .inquirybox .right .input-area button {
  border: none;
  outline: none;
  background: var(--main-color);
  color: #fff;
}
.contactpage.contactbox{display: flex; background: #f5faff; align-items: center;}
.contactbox .left{width: 50%; padding-left: calc((100% - 1400px) / 2); padding-right: 50px;}
.contactbox .right{width: 50%; padding-right: calc((100% - 1400px) / 2); padding-left: 50px; 
  padding-top: 50px;
  padding-bottom: 50px;
  background: #fff;
  border-top-left-radius: 12px;
  border-bottom-left-radius: 12px;
}
.contactbox .contactlist{
  font-size: 20px;
}
.contactbox .left h1{
  font-size: 32px;
  color: var(--main-color);
}
@media (max-width:991px){
  .contactbox{flex-wrap: wrap;}
  .contactbox .left{width: 100%; padding: 15px;}
  .contactbox .right{width: 100%; padding: 15px;}
}
.contactbox .contactlist li{
  display: flex;
  border-bottom: 1px solid #ccc;
  padding-bottom: 30px;
  margin-bottom: 30px;
}
.contactbox .contactlist .icon{
  color: var(--main-color);
  margin-right: 20px;
  font-size: 20px;
}
.contactbox .contactlist .icon .fa-whatsapp{font-size: 24px;}
.contactbox .contactlist span{
  color: #888;
  font-weight: bold;
}
.contactbox .contactlist .info a{color: #333;}
.contactbox .right .topinfo h2{color: var(--main-color);}
.contactbox .right .topinfo p{color: #999;}

.footcontact {position: relative;}
.footcontact .img img{width: 100%;}
.footcontact .cover{display: block; position: absolute; width: 100%; height: 100%; top: 0; left: 0;background: linear-gradient(to top, rgba(0,73,190,1) 0%, rgba(0,73,190,.08) 100%);}
.footcontact .contactbox{
  position: absolute;
  z-index: 2;
  width: 100%;
  bottom: 0;
}
.footcontact .contactbox .cx-form{
  background: url(../img/cx-form-bg.png) center right no-repeat #fff;
  border-radius: 30px;
  padding: .5rem .8rem;
  position: relative;
}
.footcontact .contactbox .cx-form h3{
  color: var(--main-color);
  font-size: .9rem;
  font-weight: 600;
}
.footcontact .contactbox .cx-form ul{
  margin-top: .5rem;
  display: flex;
  gap: 1rem;
}
.footcontact .contactbox .cx-form ul li{
  font-size: .22rem; padding-left: .5rem;
}
.footcontact .contactbox .cx-form ul li.wechat{
  background: url(../img/tel.svg) center left no-repeat;
}
.footcontact .contactbox .cx-form ul li.email{
  background: url(../img/email.svg) center left no-repeat;
}
.footcontact .contactbox .cx-form p{
  font-size: .22rem;
  margin-top: .5rem;
}
.cx-btn{
  width: 2rem;
  height: 2rem;
  border-radius: 2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: radial-gradient(circle at center, rgba(255,255,255,.2) 0%, rgba(39,110,169,.2) 100%);;
}
.cx-btn i{
  font-size: .5rem;
  transform: rotate(-45deg);
}
.footcontact .contactbox .cx-form .cx-btn{
  position: absolute; right: 1rem; top: 0; bottom: 0; margin: auto;
}
.footsearch{
  text-align: center;
  margin-top: .5rem;
}
.footsearch h3{
  font-size: .4rem;
  color: #fff;
}
.footsearch form{
  max-width: 970px; border-radius: 1rem; background: rgba(255, 255, 255, .3);
  margin: .5rem auto 0;
  display: flex;
  justify-content: space-between;
}
.footsearch form input{
  line-height: .8rem;
  color: #fff;
  padding-left: .3rem;
  width: calc(100% - 1rem);
}
.footsearch form input::placeholder{color: #f7f7f7;}
.footsearch form button{
  width: .8rem;
  height: .8rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: none;
  color: #fff;
  border: none;
   font-size: .3rem;
}
.footerbox {
  border-top: 1px solid rgba(255, 255, 255, .4);
  margin-top: .5rem;
  padding: .5rem 0 0;
}
.footerbox .footnav{
  display: flex;
  justify-content: space-between;
  padding-bottom: .5rem;
}
.footerbox .footer-logo1{
  width: 26%;
}
.footerbox .footer-logo1 p{
  padding-right: 20px;
}
.footerbox .footr{
  width: 74%;
  display: flex;
}
.footerbox .footr .footnavitem{width: 20%;}

@media (max-width:992px){
  .footcontact .contactbox .cx-form h3{
    font-size: .5rem;
  }
  .cx-btn{
    width: 1rem;
    height: 1rem;
  }
  .footsearch form{
    width: 90%;
    margin-top: .3rem;
  }
  .footcontact .contactbox{
    width: 96%;
    left: 0;
    right: 0;
    margin: auto;
  }
  .footerbox .footnav{flex-wrap: wrap; width: 96%;}
  .footerbox .footer-logo1{width: 100%;}
  .footerbox .footr{width: 100%;}
  .vl-footer2-section-area .vl-copyright-area{width: 96%;
  margin: 0 auto;}
  .footsearch h3{font-size: .3rem;}
  .footsearch form button{height: .6rem; width: .6rem;}
  .footsearch form input{line-height: .6rem;}
}
@media (max-width:767px){
  .top-title img{max-width: 150px;}
  .top-title h3{
    font-size: .48rem;
  }
  .indexcate .catebox{
    flex-direction: column-reverse;
    flex-wrap: wrap;
  }
  .indexcate .catebox .info{
    width: 100%;
  }
  .indexcate .catebox .img{
    width: 100%;
  }
  .homepage2-body .vl-transparent-header{
    padding: 8px 0;
  }
  .homepage2-body .vl-transparent-header .vl-logo img{
    width: auto;
  }
  .header-right{
    justify-content: end;
  }
  .indexvideo .autoparts{background-size: cover;}
  .milestones{flex-wrap: wrap;}
  .milestones .leftinfo{width: 100%; margin-bottom: 20px;}
  .milestones .hisswiper{width: 100%;}
  .footerbox .footr{flex-wrap: wrap;}
  .footerbox .footr .footnavitem{width: 50%;}
  .vl-footer2-section-area .footer-logo1 img{max-width: 120px;}
  .footcontact .contactbox{position: relative; margin-top: .3rem;}
  .footcontact .contactbox .cx-form h3{font-size: .3rem;}
  .footcontact .contactbox .cx-form{padding: .2rem;}
  .cx-btn{width: .5rem; height: .5rem;}
  .cx-btn i{font-size: .3rem;}
  .footcontact .contactbox .cx-form ul{flex-wrap: wrap;gap: .2rem;}
  .footcontact .contactbox .cx-form ul li{font-size: .18rem;}
  .footcontact .contactbox .cx-form p{font-size: .16rem;}
  .indexvideo .autoparts h2{font-size: .4rem;}
  .indexvideo .videobox{padding-bottom: .6rem;}
}
.kefu{
  position: fixed;
  right: 30px;
  bottom: 96px;
  z-index: 9;
}
.kefu ul{
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.kefu li a{
  display: flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  border-radius: 56px;
  background: #0087ff;
  font-size: 26px;
  color: #fff;
}
.kefu li:hover a{
  background-color: #06b4e1;
}
.kefu li.whatsapp a{
  background: #25d366;
}
.kefu li.whatsapp:hover a{
  background-color: #06b4e1;
}
.kefu li.weixin a{
  background: #2aae67;
}
.kefu li.weixin:hover a{
  background-color: #06b4e1;
}
.kefu li.weixin{
  position: relative;
}
.kefu li.weixin .qrcode{
  display: none;
  position: absolute;
  right: 60px;
  top: 0;
  z-index: 8;
  width: 120px;
  height: 120px;
}
.kefu li.weixin:hover .qrcode{
  display: block;
}
.kefu li.weixin .qrcode img{
  display: block;
  width: 100%;
}
@media(max-width:767px){
  .kefu{
    right: 10px;
    bottom: 76px;
  }
  .kefu li a{
    width: 34px;
    height: 34px;
    font-size: 15px;
  }
}
.tags h3{font-size: .24rem; margin-bottom: 15px;}
.tags ul{overflow: hidden; display: flex; flex-wrap: wrap;}
.tags ul li{margin-right: 20px; margin-bottom: 20px;}
.tags ul li a{padding: 0 15px; border-radius: 5px; border: 1px solid #666;line-height: 40px; display: block; transition: all .3s; color: #333; font-size: 15px;}
.tags ul li a:hover{
  background: var(--main-color); color: #fff; border-color: var(--main-color);
}
.single-page{padding: .8rem 0;}
.single-page h1{margin-bottom: .2rem;}
.single-page h3{
  font-size: .24rem;
  margin-bottom: .1rem;
}
.single-page p{margin-bottom: .05rem;}
.hbanner11 .justify-content-center{justify-content: end!important;}
.hbanner11 .justify-content-center .btns{padding-bottom: 2rem;}