/* html,
body {
  font-family: "PingFang SC", "Calibri", "Open Sans", "Gothic Arial", "Arial", "Microsoft YaHei", "San Francisco", "Hiragino Sans GB", "Helvetica Neue", Helvetica, sans-serif !important;
} */

.catkuang .swiper-slide {
  width: 19.063vw;


}




@media (max-width: 1024px) {
  .catkuang .swiper-slide {
    width: 100%;

  }
}

#animated-text {
  margin-bottom: 4.01vw !important;


}

#slideHover h2 {
  margin-top: 0.78vw;





}

.scrollbar-hide::-webkit-scrollbar{
  display: none;
}

.jianju {
  margin-top: 10.83vw;
  padding-top: 0vw !important;
  padding-bottom: 5.625vw !important;



}


#production {
  margin-top: 0vw !important;



}

.Techbankuai {
  gap: 1.56vw 1.04vw;


}


#ProductionbaseAni {
  /* margin-top: 8.07vw; */
  margin-top: 3.07vw;



}


#RD {
  margin-top: 13.02vw;
}


#RD .kuang2 {
  margin-top: 15.625vw;




}

#RdText {
  margin-bottom: 4.01vw;


}


#proAnimated-text {

  margin-bottom: 2.86vw;
}




#section4 {

  background: #F4F4F4;
  margin-top: 12.76vw;
  padding-top: 8.75vw;
  padding-bottom: 8.75vw;



}


#section5 {
  margin-top: 6.51vw;
}

#supplyChainAnim {
  margin-bottom: 4.01vw;


}

#section5 .kuang {
  padding-bottom: 15.1vw;



}

.rdkuang .swiper-slide {
  width: 24.479vw;
  height: 24.479vw;






}




/* 1024下 */
@media (max-width: 1024px) {
  #animated-text {
    margin-bottom: 60px !important;


  }

  #slideHover h2 {
    margin-top: 15px;





  }


  .jianju {
    margin-top: 60px;
    padding-top: 0px !important;
    padding-bottom: 60px !important;



  }


  #production {
    margin-top: 0px !important;



  }

  .Techbankuai {
    gap: 30px 20px;


  }


  #ProductionbaseAni {
    margin-top: 60px;




  }


  #RD {
    margin-top: 60px;
  }


  #RD .kuang2 {
    margin-top: 60px;




  }

  #RdText {
    margin-bottom: 60px;


  }


  #proAnimated-text {

    margin-bottom: 55px;
  }




  #section4 {

    background: #F4F4F4;
    margin-top: 60px;
    padding-top: 60px;
    padding-bottom: 60px;



  }


  #section5 {
    margin-top: 60px;
  }

  #supplyChainAnim {
    margin-bottom: 60px;


  }

  #section5 .kuang {
    padding-bottom: 60px;



  }


  .rdkuang .swiper-slide {

    height: auto;
    width: auto;







  }


}

ul li {
  list-style: none;
}

.product-swiper-slide {
  height: 27.083vw;
}

.product-swiper-slide .slide p {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.product-swiper-slide .slide h2 {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.scrolled {
  background-color: black !important;
  color: white;
}

#aboutHover::before {
  content: "";
  width: 100%;
  bottom: 0%;
  left: 0%;
  position: absolute;
  height: 1px;
  background-color: #673b92;
  transform: translateX(-100%);
  transition: all 0.5s ease;
}

#aboutHover:hover::before {
  transform: translateX(0%);
}

#manHover::before {
  content: "";
  width: 100%;
  bottom: 0%;
  left: 0%;
  position: absolute;
  height: 1px;
  background-color: #673b92;
  transform: translateX(-100%);
  transition: all 0.5s ease;
}

#manHover:hover::before {
  transform: translateX(0%);
}

#solHover::before {
  content: "";
  width: 100%;
  bottom: 0%;
  left: 0%;
  position: absolute;
  height: 1px;
  background-color: #673b92;
  transform: translateX(-100%);
  transition: all 0.5s ease;
}

#solHover:hover::before {
  transform: translateX(0%);
}

#esgHover::before {
  content: "";
  width: 100%;
  bottom: 0%;
  left: 0%;
  position: absolute;
  height: 1px;
  background-color: #673b92;
  transform: translateX(-100%);
  transition: all 0.5s ease;
}

#esgHover:hover::before {
  transform: translateX(0%);
}

#contactHover::before {
  content: "";
  width: 100%;
  bottom: 0%;
  left: 0%;
  position: absolute;
  height: 1px;
  background-color: #673b92;
  transform: translateX(-100%);
  transition: all 0.5s ease;
}

#contactHover:hover::before {
  transform: translateX(0%);
}

#backgroundImage::before {
  content: "";
  width: 100%;
  height: full;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  /* Background image */
  filter: brightness(0.8);
  /* Brightness effect */
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  z-index: 0;
  /* Behind the content */
}

/* .grid-container {
  margin-left: 170px;
} */
/* .line-bar::after {
  content: '';
  position: absolute;
  width: 100%;
  height: 0; 
  background-color: white;
  top: -1px; 
  left: 0;
  overflow: hidden; 
  transition: height 1.5s ease; 
  height: var(--line-bar-height, 0%);
} */




/* 点击后触发的动画类 */
.line-bar-animate::before {
  height: 100%;
}

.tab-item {
  cursor: pointer;
}

.tab.Mactive {
  color: #673B92;
}


.tab-content {
  display: none;
}

.tab-content.active {
  display: grid;
}



.rdCap {
  /* width: 470px !important;
  margin-right: 40px !important;
  height: 470px !important; */
}

#sidebar-nav a span {
  margin-right: 10px;
}

/* .swiper-supply {
  width: 100%;
  height: 100%;
  margin-left: auto;
  margin-right: auto;
}

.swiper-supply .swiper-slide {
  text-align: center;
  font-size: 18px;
  background: #fff;
  height: calc((100% - 30px) / 2) !important;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 334px !important;
} */

.section-with-progress img {
  width: 100% !important;
  object-fit: cover;
}


.mySwiper-rd .swiper-slide p {
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

@media (min-width: 1536px) and (max-width: 1750px) {
  .\32xl\:grid-cols-4 {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 1440px) {
  .xl\:grid-cols-4 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .md\:left-\[120px\] {
    left: 20px !important;
  }
}

@media screen and (max-width: 1200px) {
  .md\:left-\[120px\] {
    left: 20px !important;
  }
}

@media (max-width: 1025px) {
  .lg\:gap-20 {
    gap: 0 !important;
  }

  .pc-menu {
    display: none !important;
  }

  .m-menu {
    display: block !important;
  }

  /* #movingDiv {display: none;} */
  .md\:left-\[120px\] {
    left: 20px !important;
  }

  .lg\:pr-\[139px\] {
    padding-right: 20px !important;
  }

  .md\:pl-\[350px\] {
    padding-left: 280px !important;
  }

  .md\:h-\[15vw\] {
    height: 30vw !important;
  }

  .location-dot {
    display: none !important;
  }

  .md\:left-\[150px\] {
    left: -10px !important;
  }

  .md\:text-\[26px\] {
    font-size: 20px;
  }
}

@media (max-width: 1023px) {

  .sidebar {
    display: none;
  }
}

@media(min-width: 768px) and (max-width: 1023px) {
  #production .pdwrap {
    flex-wrap: wrap;
  }

  #production .zuo {
    flex: 0 1 auto !important;
  }

  #production .you {
    width: 100% !important;
  }

  #ProductionbaseAni {
    left: 20px !important;
    top: 30px !important;
  }
}




@media (max-width: 922px) {
  .md\:left-\[120px\] {
    left: 20px !important;
  }

  .md\:pl-\[350px\] {
    padding-left: 230px !important;
  }

  .md\:h-\[15vw\] {
    height: 40vw !important;
  }

  .location-dot {
    display: none !important;
  }

  .md\:left-\[150px\] {
    left: -10px !important;
  }
}

@media screen and (max-width: 767px) {

  .md\:pl-\[350px\] {
    padding-left: 0 !important;
  }

  #manufacture .bg-\[url\(\'\.\/images\/productsCat\/productBg\.png\'\)\] {
    padding: 40px 20px !important;
  }

  #production h1 {
    padding: 50px 20px 0 !important;
  }
}

@media (max-width: 640px) {
  .sm\:mt-20 {
    margin-top: 30px !important;
  }
}

@media screen and (max-width: 540px) {
  .rdCap {
    width: 100%;
    margin-right: 0;
    height: 300px;
  }

  #manufacture .bg-\[url\(\'\.\/images\/productsCat\/productBg\.png\'\)\] {
    padding: 40px 20px !important;
  }

  #manufacture .slider img {
    height: 30vw !important;
  }

  .manufCard {
    padding: 30px 0;
  }

  .xs\:py-5 {
    padding-top: 20rem !important;
  }

  .manufCard {
    height: 32vh !important;
  }

  .location-dot {
    display: none !important;
  }

  #production h1 {
    padding: 50px 20px 0 !important;

  }

  /* #tab1 {
    display: flex !important;
  } */

  .md\:pl-\[350px\] {
    padding-left: 0 !important;
  }

  .xl\:grid-cols-4 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
}

#slideHover:hover {
  background-color: #673b92;
  color: white;
}

#slideHover:hover #circle g path {
  fill: white;
  color: black;
}

/* Scrollbar size */
#supplyscroll::-webkit-scrollbar {
  width: 4px;
  /* Horizontal scrollbar use 'height' */
}

/* Scrollbar thumb (the draggable part) */
#supplyscroll::-webkit-scrollbar-thumb {
  background-color: white;
  border-radius: 10px;
}

/* Scrollbar track (the area the thumb slides within) */
#supplyscroll::-webkit-scrollbar-track {
  background: #888;
}

/* Optional: Scrollbar on hover */
#supplyscroll::-webkit-scrollbar-thumb:hover {
  background-color: #adacac;
}

/* #contact:hover span {
  background-color: white;
} */
#contact:hover span path {
  fill: #673b92;
}

/* 大屏幕vw样式 */
@media (min-width: 1024px) {

  /* Banner section vw styles */
  .bannerwen {
    padding: 2.344vw 1.458vw !important;
  }

  .bannerwen h1 {
    font-size: 5vw !important;
    margin-bottom: 2.917vw !important;
  }

  .bannerwen h2 {
    font-size: 5vw !important;
    margin-bottom: 0.833vw !important;
  }

  .bannerwen div {
    font-size: 0.833vw !important;
  }

  /* Header and title styles */
  .lg\:text-\[1\.667vw\] {
    font-size: 1.667vw !important;
  }

  .lg\:text-\[1\.25vw\] {
    font-size: 1.25vw !important;
  }

  .lg\:text-\[1\.042vw\] {
    font-size: 1.042vw !important;
  }

  .lg\:text-\[0\.833vw\] {
    font-size: 0.833vw !important;
  }

  .lg\:text-\[2\.604vw\] {
    font-size: 2.604vw !important;
  }

  .lg\:text-\[5vw\] {
    font-size: 5vw !important;
  }

  /* Margin and padding vw styles */
  .lg\:mb-\[4\.01vw\] {
    margin-bottom: 4.01vw !important;
  }

  .lg\:mb-\[2\.917vw\] {
    margin-bottom: 2.917vw !important;
  }

  .lg\:mb-\[1\.25vw\] {
    margin-bottom: 1.25vw !important;
  }

  .lg\:mb-\[0\.833vw\] {
    margin-bottom: 0.833vw !important;
  }

  /* Supply chain line height */
  #supplyChainAnim {
    line-height: 2.604vw !important;
  }

  /* Additional padding and spacing vw styles */
  .lg\:pb-\[10\.833vw\] {
    padding-bottom: 10.833vw !important;
  }

  .lg\:pl-\[19\.792vw\] {
    padding-left: 19.792vw !important;
  }

  .lg\:pt-\[12\.292vw\] {
    padding-top: 12.292vw !important;
  }
}