.slideInDownInit {
  -webkit-transform: translateY(32px);
  transform: translateY(32px);
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease;
  opacity: 0;
  transition-delay: 0.2s;
}

.slideInDown {
  opacity: 1 !important;
  -webkit-transform: translateY(0) !important;
  transform: translateY(0) !important;
}

.scaleInit {
  -webkit-transform: scale(0);
  transform: scale(0);
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease;
  opacity: 0;
}

/* 图片样式 */
.goods-section .backgroundPicture img {
  width: 100%;
  margin: 0;
  min-width: 30px;
  position: relative;
}

.progress {
  display: none !important;
}

.backgroundPicture {
  width: 100%;
  position: relative;
}

.section-1 {
  background-color: #020202;
}

.section-4 {
  background-color: #040b15;
}

.section-5 {
  background-color: #010101;
}

.section-6 {
  background-color: #080a09;
}

/* 商品区域 */
.goods-section {
  background-size: cover;
  line-height: normal;
  position: relative;
  letter-spacing: 0.05vw;
}

.goods-section .section-con {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
}
/* .section-con {
  position: absolute;
  z-index: 4;
  top: 0;
  width: 100%;
  height: 100%;
} */

.animated {
  animation-duration: 1.5s;
}
.goods-section .text-color-fff {
  color: #fff;
}

.goods-section .text-color-8e8e8e {
  color: #8e8e8e;
}

.goods-section .text-color-d4d4d4 {
  color: #d4d4d4;
}

.goods-section .text-nowarp {
  white-space: nowrap;
}

.goods-section .linear-gradient {
  background: linear-gradient(
    to right,
    #686868 0%,
    #d1d1d1 45%,
    #ededed 66%,
    #474747 100%
  );
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.goods-section .fff-to-065ca8 {
  background: linear-gradient(
    to bottom,
    #fff 40%,
    #b0cbe5 48%,
    #7ca7d8 52%,
    #065ca8 60%
  );
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.goods-section .text-bold {
  font-weight: bold;
}

.goods-section .padding8 {
  padding-top: clamp(6px, 1vw, 8px);
}

.goods-section .padding36 {
  padding-top: clamp(8px, 3vw, 36px);
}

.goods-section .margin12 {
  margin-top: clamp(6px, 1vw, 12px);
}

.goods-section .margin24 {
  margin-top: clamp(8px, 1.5vw, 24px);
}

.goods-section .margin36 {
  margin-top: clamp(12px, 2vw, 36px);
}

.goods-section .letterSpacing24 {
  letter-spacing: clamp(8px, 1.5vw, 24px);
}

.goods-section .letterSpacing12 {
  letter-spacing: clamp(8px, 1vw, 12px);
}

.goods-section .letterSpacing6 {
  letter-spacing: clamp(3px, 1vw, 6px);
}

.goods-section .section-con-bigtitle {
  font-size: clamp(24px, 4vw, 66px);
  font-weight: bold;
  line-height: 1.2;
}

.goods-section .section-con-title {
  font-size: clamp(24px, 3vw, 54px);
  font-weight: bold;
  line-height: 1.2;
}

.goods-section .section-con-content28 {
  font-size: clamp(16px, 1.5vw, 28px);
  line-height: 1.5;
}

.goods-section .section-con-content24 {
  font-size: clamp(12px, 1.3vw, 24px);
  line-height: 1.5;
}

.goods-section .section-con-content20 {
  font-size: clamp(12px, 1.1vw, 20px);
  line-height: 1.5;
}

.goods-section .section-con-content14 {
  font-size: clamp(10px, 1.1vw, 14px);
  line-height: 1.5;
}

.goods-section .section-con-width80 {
  width: 80%;
}

.goods-section .section-con-unit {
  font-size: clamp(12px, 1.1vw, 20px);
  line-height: 1.2;
}

.goods-section .section-con-linebox {
  display: flex;
  justify-content: center;
  align-items: center;
}

.goods-section .section-con-line {
  width: 30px;
  height: 5px;
  background-color: #e3ebf7;
  border-radius: 30px;
}

.goods-section .section-img {
  position: relative;
}

.goods-section .section-img img {
  width: 100% !important;
}

:lang(zh).section-1 .section-con {
  position: absolute;
  top: clamp(6%, 8vw, 18%);
}

:lang(zh).section-2 .section-con {
  position: absolute;
  top: clamp(6%, 5vw, 10%);
}

:lang(zh).section-3 .section-con {
  position: absolute;
  top: clamp(6%, 5vw, 10%);
}

:lang(zh).section-4 .section-con {
  margin: clamp(6%, 5vw, 10%) 0;
}

:lang(zh).section-5 .section-con {
  margin: clamp(6%, 5vw, 10%) 0;
}

:lang(zh).section-6 .section-con {
  margin: clamp(6%, 5vw, 10%) 0;
  padding-left: 6%;
  align-items: flex-start;
}

.section-4 .section-4-box {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  gap: clamp(6%, 5vw, 10%);
}

.section-4 .section-4-box .section-4-item {
  position: relative;
  padding: 6px 24px;
  border-radius: 50px;
}

.section-4 .section-4-box .section-4-item::before {
  content: "";
  position: absolute;
  inset: 0;
  padding: 1px;
  border-radius: inherit;
  background: linear-gradient(
    to bottom,
    #fff 40%,
    #b0cbe5 48%,
    #7ca7d8 52%,
    #065ca8 60%
  );
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: destination-out;
  mask-composite: exclude;
  pointer-events: none;
}

.section-6 .section-con .section-con-box {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2vw;
  width: 80%;
  justify-items: start;
}

.section-1,
.section-2,
.section-3,
.section-4,
.section-5 {
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.section-6 {
  display: flex;
  flex-direction: column;
}

.section-1 .section-con {
  position: absolute;
  top: clamp(4%, 3vw, 8%);
}

.section-2 .section-con {
  position: absolute;
  top: clamp(4%, 3vw, 8%);
}

.section-3 .section-con {
  position: absolute;
  top: clamp(4%, 3vw, 8%);
}

.section-4 .section-con {
  margin: clamp(4%, 3vw, 8%) 0;
}

.section-5 .section-con {
  margin: clamp(4%, 3vw, 8%) 0;
}

.section-6 .section-con {
  margin: clamp(4%, 3vw, 8%) 0;
  padding-left: 6%;
  align-items: flex-start;
}

@media (max-width: 991px) {
  .goods-section .section-con-width80 {
    width: 95%;
  }
}
