.openAndTranspant {
  padding-top: 4.375vw;
}
.current-page {
  color: #231815 !important;
}

.openAndTranspant .crumbs {
  padding: 1.25vw 0 4.1667vw;
}
/* .total,
.toPage,
.number-input,
.toDetail,
.goDetail-icon,
.go-page-box {
  display: none !important;
} */
.top-nav {
  position: sticky;
  z-index: 1000;
  top: 4.3229vw; /* 确保在垂直滚动时生效 */
  height: 3.9583vw;
  background-color: #fff;
  border-top: 0.0521vw solid #2318151a;
  border-bottom: 0.0521vw solid #2318151a;
}
.openAndTranspant-title {
  color: #231815;
  /* Heading5-40 */
  font-family: Montserrat;
  font-size: 2.0833vw;
  font-style: normal;
  font-family: "Montserrat-SemiBold" !important;
  line-height: 150%;
  text-transform: capitalize;
}
.top-nav-box {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 !important;
  height: 3.9583vw;
}
.top-box-text {
  width: 100%;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 2.0833vw !important;
}
.top-box-title,
.bottom-box-title {
  max-width: 19.8958vw;
  color: #231815;
  /* Heading3-60 */
  font-family: "Montserrat-SemiBold" !important;
  font-size: 3.125vw;
  font-style: normal;
  line-height: 150%; /*  */
  text-transform: capitalize;
}
.bottom-box-title {
  max-width: 27.6563vw;
  /* padding-right: 49px; */
}
.top-box-desc,
.bottom-box-desc {
  font-size: 0.8333vw;
  color: #231815;
  font-style: normal;
  font-weight: 400;
  line-height: 150% ; 
}
.top-box-desc,
.bottom-box-desc {
  width: 59.8%;
  max-width: 43.75vw;
}
.bottom-box-desc {
  width: 59.8%;
  max-width: 44.7917vw;
}
.top-box-imgs {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 6.25vw !important;
}
.top-box-imgs .img {
  width: calc((100% - 12.5vw) / 4);
  margin-right: 4.1667vw;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.top-box-imgs .img {
  margin-bottom: 1.25vw;
}
.top-box-imgs .img img {
  width: 100%;
}
.top-box-imgs .img:last-child {
  margin-right: 0;
}
.bottom-box {
  background-color: #fafafa;
  padding: 4.1667vw 0;
}

.openbottom {
  margin-bottom: 6.25vw;
  position: relative;
}

.openbottom .openbottom-title {
  font-family: Montserrat, Montserrat;
  font-family: "Montserrat-SemiBold" !important;
  font-size: 3.125vw;
  color: #231815;
  line-height: 150%;

  text-align: center;
  font-style: normal;
  text-transform: none;
  margin: 0 0 2.0833vw;
}

.openbottom .openbottom-tab {
  display: flex;
  flex-direction: row;
  justify-content: center;
  margin-bottom: 0;
  background: #fff;
}

.openbottom .openbottom-tab .openbottom-item {
  cursor: pointer;
  font-family: Montserrat;
  font-weight: 400;
  font-size: 0.9375vw;
  color: #231815;
  line-height: 150%;
  text-align: left;
  font-style: normal;
  text-transform: none;
  padding: 0.8333vw 0;
  margin-right: 8.2813vw;
  position: relative; /* 为伪元素提供定位上下文 */
}
.openbottom .openbottom-tab .openbottom-item:last-child {
  margin-right: 0;
}
.openbottom .openbottom-tab .openbottom-item.active {
  color: #3a66fb;
  font-weight: 600;
}
.openbottom .openbottom-tab .openbottom-item::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0%; /* 初始宽度为0 */
  height: 0.0521vw;
  background: #3a66fb;
  transition: width 0.4s ease; /* 动画过渡效果 */
}
.openbottom .openbottom-tab .openbottom-item.active::after {
  width: 100%; /* 激活时宽度变为100% */
}

.openbottom .openbottom-tab .openbottom-item:hover {
  color: #3a66fb;
  font-weight: 600;
}
.openbottom .openbottom-desc {
  font-family: Montserrat, Montserrat;
  font-weight: 400;
  font-size: 0.8333vw;
  color: #231815;
  line-height: 150%;

  text-align: center;
  font-style: normal;
  text-transform: none;
  margin: 0 0 2.0833vw;
}

.openbottom .openbottom-content {
  width: calc((100% - 6.25vw) / 4);
  margin-right: 2.0833vw;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  /* justify-content: center; */
  background: #ffffff;
  padding: 1.25vw 1.25vw 3.3333vw 1.25vw;
}
.openbottom .openbottom-content:last-child {
  margin-right: 0;
}

.openbottom .openbottom-content img {
  width: 100%;
}

.openbottom .openbottom-content .openbottom-img-title {
  font-family: "Montserrat-SemiBold" !important;
  font-size: 1.25vw;
  color: #231815;
  line-height: 150%;
  text-align: left;
  font-style: normal;
  text-transform: none;
  margin-bottom: 0.8333vw;
}

.openbottom .openbottom-content .openbottom-img-desc {
  font-weight: 400;
  max-width: 59.7396vw;
  font-size: 0.8333vw;
  color: #231815;
  line-height: 150%;
  text-align: left;
  font-style: normal;
  text-transform: none;
}
.tab-content {
  display: flex !important;

  padding-bottom: 2.0833vw;
}

.tab-content .content {
  width: 100%;
  display: flex !important;

  transition: opacity 0.3s ease, visibility 0.3s ease;
  margin-top: 1.25vw;
}
.tab-content .content:nth-child(4n) {
  margin-right: 0;
}
.tab-content .content.active {
  display: flex !important;

  visibility: visible;
  opacity: 1;
}
.loading-indicator-down {
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.8);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1000;
  top: 0;
  right: 0;
  padding-right: 0.7292vw;
  border-radius: 1.5625vw;
  pointer-events: none; /* 禁止点击事件 */
}
.loading-indicator-down .spinner {
  border: 0.2083vw solid rgba(0, 0, 0, 0.1);
  border-top: 0.2083vw solid #3a66fb;
  border-radius: 50%;
  width: 1.25vw;
  height: 1.25vw;
  animation: spin 1s linear infinite;
}
.openbottom .openbottom-tab {
  width: 100%;
}
.open {
  display: none;
}
.top-desc {
  width: 100%;
  margin-top: 1.25vw;
}
.openbottom {
  margin-bottom: 0;
}
@media screen and (max-width: 1440px) {
  .top-box-desc {
    width: 57.1%;
    max-width: 42.7778vw;
  }
  .top-desc {
    width: 100%;
    margin-top: 0.8333vw;
  }
  .top-box-imgs .img {
    width: calc((100% - 8.3333vw) / 4);
    margin-right: 2.7778vw;
  }
  .bottom-box-title {
    width: 49.2%;
    max-width: 36.875vw;
    /* padding-right: 49px; */
  }
  .bottom-box-desc {
    width: 46.3%;
    max-width: 34.7222vw;
  }
  .openbottom .openbottom-content {
    width: calc((100% - 5vw) / 4);
    margin-right: 1.6667vw;
    margin-bottom: 1.6667vw;
    padding-bottom: 1.6667vw;
  }
  .openbottom .openbottom-content .openbottom-img-title {
    font-size: 1.3889vw;
  }
  .top-box-text {
    margin-bottom: 5.2083vw;
  }
  .top-box-imgs .img img {
    height: 17.5vw;
    object-fit: cover;
  }
}
@media screen and (max-width: 768px) {
  .crumbs {
    padding: 2.1333vw 6.4vw 10.6667vw !important;
  }
  .openAndTranspant {
    padding-top: 12.8vw;
  }
  .top-nav {
    height: fit-content;
    top: 12.5333vw;
  }
  .top-nav-box {
    height: fit-content;
    padding: 2.1333vw 6.4vw !important;
  }
  .openAndTranspant-title {
    font-size: 4.2667vw;
  }
  .top-box-text {
    flex-direction: column;
    margin-bottom: 6.9333vw !important;
  }
  .top-box-title,
  .bottom-box-title {
    width: 100%;
    max-width: none;
    font-size: 8.5333vw;
    margin-right: 0;
    margin-bottom: 6.4vw;
  }
  .bottom-box-title {
    margin-top: 10.6667vw;
    margin-bottom: 6.4vw;
    margin-right: 0;
  }
  .top-box {
    background-color: #fff;
    overflow: hidden;
  }
  .top-box-desc,
  .bottom-box-desc {
    max-width: none;
    width: 100%;
    font-size: 3.7333vw;
  }
  .openbottom-item {
    flex-direction: column;
    padding: 0;
  }
  .text {
    padding: 0;
  }
  .openbottom .openbottom-tab .openbottom-item:hover {
    color: #231815;
  }
  .openbottom .openbottom-tab .openbottom-item.active {
    color: #3a66fb;
  }
  .item-title {
    margin-top: 0;
    margin-bottom: 4.2667vw;
  }
  .bottom-box {
    background-color: #fafafa;
    margin-bottom: 0;
    padding-bottom: 0;
    padding-top: 0;
  }
  .reverse .text {
    order: 0;
    padding: 0;
  }
  .item-desc {
    margin-bottom: 6.4vw;
  }
  .image img {
    height: 49.0667vw;
    object-fit: cover;
  }
  .openbottom-item {
    margin-bottom: 10.6667vw;
  }
  .top-box-imgs {
    margin-bottom: 20.2667vw;
  }
  .top-box-imgs {
    display: none;
  }
  .privacy {
    display: flex;
    position: relative;
  }
  .swipers-open {
    overflow: visible;
    width: 100%;
  }
  .swiper-backface-hidden .swiper-slide {
    width: 91.8%;
    max-width: 80vw;
  }
  .comp-content img {
    height: 82.6667vw;
    object-fit: cover;
  }
  .openbottom-content {
    width: 100%;
    padding: 0;
    margin-right: 0;
  }
  .swipers-privacy {
    padding-bottom: 27.7333vw;
  }

  .swiper-button-prev {
    right: 17.0667vw;
    left: auto;
  }
  .swiper-button-next:after,
  .swiper-button-prev:after {
    font-size: 3.2vw !important;
  }
  .swipers-privacy {
    padding-bottom: 27.7333vw;
  }
  .swiper-button-next,
  .swiper-button-prev {
    width: 10.6667vw !important;
    height: 10.6667vw !important;
    color: #231815 !important;
    top: auto !important;
    bottom: 21.3333vw;
    border-radius: 10.6667vw;
    background-color: #fafafa !important;
  }
  .swiper-button-prev {
    right: 17.0667vw !important;
    left: auto !important;
  }
  .swiper-button-next:after,
  .swiper-button-prev:after {
    font-size: 3.2vw;
  }

  .swiper-wrapper {
    padding-bottom: 38.4vw;
  }

  .openbottom .openbottom-tab .openbottom-item {
    margin-right: 6.6667vw;
    margin-bottom: 0;
    width: 50%;
    padding: 4.2667vw 0;
    position: unset;
    font-size: 3.7333vw;
  }
  .openbottom .openbottom-tab .openbottom-item:last-child {
    margin-right: 0;
    margin-bottom: 0;
  }
  .tab-content .content {
    flex-direction: column;
  }
  .openbottom .openbottom-content {
    width: 100%;
    margin-bottom: 5.3333vw;
    margin-right: 0;
    padding: 4.2667vw;
  }
  .openbottom .openbottom-tab .openbottom-item:hover {
    color: #3a66fb;
  }
  .openbottom .openbottom-tab .openbottom-item.active {
    background-color: #fff;
  }
  .openbottom .openbottom-tab {
    align-items: center;
    position: relative;
    padding: 0 6.4vw;
  }
  .openbottom .openbottom-tab .openbottom-item::after {
    left: 6.4vw;
    line-height: 1;
  }

  .openbottom .openbottom-tab .openbottom-item.active::after {
    width: calc(50% - 12.8vw);
  }
  .openbottom .openbottom-tab .openbottom-item:last-child.active:after {
    left: calc(50% + 3.2vw);
  }
  .openbottom .openbottom-tab .openbottom-item:not(.active)::after {
    /* width: 0 !important; */
    transition: none;
  }
  .openbottom .openbottom-content .openbottom-img-title {
    font-size: 4.2667vw;
    margin-bottom: 2.1333vw;
  }
  .openbottom .openbottom-content .openbottom-img-desc,
  .comp-img-desc {
    font-size: 3.7333vw;
    line-height: 150%;
  }
  .openbottom .openbottom-content .openbottom-img-desc {
    max-width: fit-content;
  }
  .openbottom .openbottom-tab {
    margin-bottom: 4.2667vw;
  }

  .el-pagination .el-pager,
  .el-pager,
  .pagination .el-pagination .default {
    margin-bottom: 0;
  }
  .page {
    padding: 10.6667vw 0 21.3333vw;
  }
  .tab-content {
    padding: 0 6.4vw;
  }
  .openbottom .openbottom-content:last-child {
    margin-bottom: 0;
  }

  .openbottom {
    padding-bottom: 0;
  }
  .open {
    /* overflow: hidden; */
    display: flex;
  }
  .top-desc {
    margin-bottom: 10.6667vw;
  }
  .comp-content img {
    width: 100%;
    margin-bottom: 2.1333vw;
  }
}
