.mt-11 {
  margin-top: 0.69rem;
}
.mt_00{
  margin-top: 4rem;
}
.mt-165 {
  margin-top: 10.31rem;
}
.mt-29 {
  margin-top: 1.81rem;
}
.mt-27 {
  margin-top: 1.69rem;
}
.ml-154 {
  margin-left: 9.63rem;
}
.ml-335 {
  margin-left: 10.94rem;
}
.ml-7 {
  margin-left: 0.44rem;
  margin-top: 0.5rem;
}
.mt-5 {
  margin-top: 0.31rem;
}
.mt-69 {
  margin-top: 4.31rem;
}
.section_9_1{
  padding-top: 2.5rem ;
  display: flex;
  justify-content: center;
}
.page {
  /* padding-bottom: 2.88rem; */
  background-color: #eeeeeb;
  width: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  height: 100%;
}

.section {
  padding-bottom: 14.13rem;
  background-image: url('../../assets/images/optimized/pages/Home/images/banner.webp');
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  /* min-height: 100vh; */
  position: relative;
}
.section_2 {
  padding: 1.25rem 8.75rem;
  background-color: #161613;
}
.image {
  /* width: 2.5rem; */
  height: 2.5rem;
}
.image_3 {
  margin-left: 0.38rem;
  width: 2.69rem;
  height: 1.75rem;
}
.section_3 {
  margin-left: 1.5rem;
  background-color: #ffffff66;
  width: 0.063rem;
  height: 1.5rem;
}
.font_2 {
  font-size: 1rem;
  font-family: Poppins;
  line-height: 0.58rem;
  font-weight: 700;
}
.text_2 {
  margin-left: 2.25rem;
  color: #ffcc32;
  line-height: 0.62rem;
}
.font_3 {
  font-size: 1rem;
  font-family: Poppins;
  line-height: 0.72rem;
  font-weight: 700;
  color: #ffffff;
}
.text_3 {
  margin-left: 2.13rem;
  line-height: 0.65rem;
}
.text_4 {
  margin-left: 2.25rem;
  line-height: 0.71rem;
}
.text_5 {
  margin-left: 2.25rem;
  line-height: 0.71rem;
}
.text_6 {
  margin-left: 2.19rem;
  line-height: 0.89rem;
}
.text_7 {
  margin-left: 2.25rem;
  line-height: 0.63rem;
}
.group {
  margin-right: 0.25rem;
}
.image_2 {
  border-radius: 1.25rem;
  width: 2.62rem;
  height: 2.62rem;
}
.font {
  font-size: 0.75rem;
  font-family: Poppins;
  line-height: 0.58rem;
  color: #040415;
}
.text {
  color: #ffffffcc;
  line-height: 0.58rem;
}
.font_4 {
  font-size: 1rem;
  font-family: Poppins;
  line-height: 1rem;
  font-weight: 700;
  color: #040415;
}
.text_8 {
  color: #ffffff;
  line-height: 1.03rem;
}
.text_88 {
  margin-left: 2.25rem;
}
.group_2 {
  padding: 0 2.75rem;
  max-width: 75rem;
  margin: 8.75rem 5rem 0;
}
.font_5 {
  font-size: 2.63rem;
  font-family: Poppins;
  line-height: 3.5rem;
  font-weight: 700;
  color: #eeeeeb;
}
.section_4 {
  margin-left: 20.5rem;
  margin-top: 0.13rem;
  background-color: #00000000;
  width: 0.063rem;
  height: 0.88rem;
}
.font_6 {
  font-size: 1rem;
  font-family: Poppins;
  line-height: 0.72rem;
  color: #eeeeeb;
}
.text_11 {
  margin-top: 0.38rem;
  line-height: 0.77rem;
}
.text-wrapper {
  margin-top: 1.88rem;
  padding: 1.38rem 0;
  background-color: #ffcc32;
  border-radius: 6.25rem;
  overflow: hidden;
  width: 10.81rem;
  cursor: pointer;
  transition: background-color 0.3s ease;
}

.text-wrapper:hover {
  background-color: #D6AB2A;
}

.font_7 {
  font-size: 1rem;
  font-family: Poppins;
  line-height: 0.72rem;
  font-weight: 700;
  color: #040415;
}
.group_3 {
  text-align: center;
}
.font_8 {
  font-size: 2rem;
  font-family: Poppins;
  letter-spacing: -0.08rem;
  line-height: 2.63rem;
  font-weight: 700;
}
.mt-18 {
  margin-top: 1.125rem;
  /* padding: 0 8.75rem; */
  display: flex;
  justify-content: space-between;
  width: 100%;
}

.group_4 {
  flex: 1 1 13.5rem;
  overflow: hidden;
  border-radius: 1.25rem;
  height: 18rem;
  margin: 0 1.25rem;
  max-width: 14.5rem;
  position: relative;
}

.overlay {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  opacity: 0;
  transition: opacity 0.3s ease;
  z-index: 1;
  border-radius: 1.25rem;
}

.group_4:hover .overlay {
  opacity: 1;
}

.text-wrapper_3, .text-wrapper_4 {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
  z-index: 2;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}

.text-wrapper_3 {
  top: 40%;
  padding: 1rem 0;
  background-color: #ffcc32;
  border-radius: 18.75rem;
  width: 9.88rem;
  cursor: pointer;
  transition: all 0.3s ease;
}

.text-wrapper_4 {
  top: 60%;
  padding: 1rem 0;
  border-radius: 18.75rem;
  width: 9.88rem;
  height: 2.75rem;
  border: solid 0.063rem #ffffff;
  cursor: pointer;
  transition: all 0.3s ease;
}

.group_4:hover .text-wrapper_3,
.group_4:hover .text-wrapper_4 {
  opacity: 1;
  visibility: visible;
}

.text-wrapper_3:hover {
  background-color: #D6AB2A;
}

.text-wrapper_4:hover {
  /* background-color: #D6AB2A; */
  border: 1px solid #D6AB2A;
  color: #D6AB2A !important;
}
.text-wrapper_4:hover span {
  color: #D6AB2A !important;
}
.section_9, .section_10 {
  z-index: 2;
  position: relative;
}

.group_4:first-child {
  margin-left: 0;
}

.group_4:last-child {
  margin-right: 0;
}

.ml-20 {
  margin-left: 0;
}

.section_5 {
  margin-top: -1.88rem;
  padding: 2.38rem 0.5rem 16.88rem;
  border-radius: 1.25rem;
  background-image: url('../../assets/images/optimized/pages/Portfolio/images/film01.webp');
  background-size: 100% 100%;
  background-repeat: no-repeat;
  width: 14.5rem;
}
.image_5 {
  border-radius: 18.75rem;
  width: 1.63rem;
  height: 1.63rem;
}
.section_9 {
  padding: 0.31rem 0.63rem;
  background-color: #0000004d;
  border-radius: 18.75rem;
  height: 1.63rem;
}
.image_6 {
  width: 1rem;
  height: 1rem;
}
.font_9 {
  font-size: 0.75rem;
  font-family: Poppins;
  line-height: 0.72rem;
  color: #ffcc32;
}
.text_14 {
  line-height: 0.68rem;
}
.section_7 {
  margin-top: -1.25rem;
  padding: 1.75rem 0.5rem 16.88rem;
  border-radius: 1.25rem;
  background-image: url('../../assets/images/optimized/pages/Portfolio/images/film02.webp');
  background-size: 100% 100%;
  background-repeat: no-repeat;
  width: 14.5rem;
}
.text-wrapper_2 {
  padding: 0.5rem 0;
  background-color: #0000004d;
  border-radius: 18.75rem;
  width: 2.88rem;
  height: 1.63rem;
  cursor: pointer;
  transition: background-color 0.3s ease;
}

.text-wrapper_2:hover {
  background-color: #D6AB2A;
}

.font_10 {
  font-size: 0.75rem;
  font-family: Poppins;
  line-height: 0.58rem;
  color: #ffcc32;
}
.text_15 {
  line-height: 0.53rem;
}
.section_6 {
  margin-top: -1.88rem;
  padding: 2.38rem 0.5rem 16.88rem;
  border-radius: 1.25rem;
  background-image: url('../../assets/images/optimized/pages/Portfolio/images/film03.webp');
  background-size: 100% 100%;
  background-repeat: no-repeat;
  width: 14.5rem;
}
.section_8 {
  margin-top: -1.25rem;
  padding: 1.75rem 0.5rem 16.88rem;
  border-radius: 1.25rem;
  background-image: url('../../assets/images/optimized/pages/Portfolio/images/film04.webp');
  background-size: 100% 100%;
  background-repeat: no-repeat;
  width: 14.5rem;
}
.image_4 {
  border-radius: 1.25rem;
  width: 14.5rem;
  height: 18rem;
}
.text_16 {
  line-height: 0.68rem;
}
.pos {
  position: absolute;
  left: 0.5rem;
  top: 0.5rem;
}
.equal-division {
  align-self: center;
  margin-top: 1rem;
}
.group_5 {
  padding: 0 8.75rem;
  width: 100%;
  display: flex;
  justify-content: center;
}
.group_6 {
  flex: 1 1 13.5rem;
  /* max-width: 13.5rem; */
  margin: 0 1.25rem;
}
.phone_second_section_content{
  display: flex;
  margin-top: 4rem;
}
.group_6:first-child {
  margin-left: 0;
}
.group_6:last-child {
  margin-right: 0;
}
.text_19 {
  line-height: 0.58rem;
}
.font_11 {
  font-size: 1rem;
  font-family: Poppins;
  line-height: 0.72rem;
  font-weight: 700;
  color: #191919;
}
.section_11 {
  margin-top: -1.88rem;
  padding: 2.38rem 0.5rem 16.25rem;
  border-radius: 1.25rem;
  background-image: url('../../assets/images/optimized/pages/Portfolio/images/film01.webp');
  background-size: 100% 100%;
  background-repeat: no-repeat;
}
.section_13 {
  margin-top: -1.25rem;
  padding: 1.75rem 0.5rem 16.88rem;
  border-radius: 1.25rem;
  background-image: url('../../assets/images/optimized/pages/Portfolio/images/film02.webp');
  background-size: 100% 100%;
  background-repeat: no-repeat;
}
.section_12 {
  margin-top: -1.88rem;
  padding: 2.38rem 0.5rem 16.25rem;
  border-radius: 1.25rem;
  background-image: url('../../assets/images/optimized/pages/Portfolio/images/film03.webp');
  background-size: 100% 100%;
  background-repeat: no-repeat;
}
.section_14 {
  margin-top: -1.25rem;
  padding: 1.75rem 0.5rem 16.88rem;
  border-radius: 1.25rem;
  background-image: url('../../assets/images/optimized/pages/Portfolio/images/film04.webp');
  background-size: 100% 100%;
  background-repeat: no-repeat;
}
.section_15 {
  margin-top: -1.25rem;
  padding: 1.75rem 0.5rem 16.88rem;
  border-radius: 1.25rem;
  background-image: url('../../assets/images/optimized/pages/Portfolio/images/film01.webp');
  background-size: 100% 100%;
  background-repeat: no-repeat;
}
.equal-division_2 {
  align-self: center;
  margin-top: 1.13rem;
}
.group_7 {
  /* width: 73.75rem; */
}
.group_8 {
  /* flex: 1 1 14.75rem; */
}
.equal-division-item {
  padding:0 1rem;
  width: 15.5rem;
  text-align: left;
}
.text_20 {
  margin-top: 1.75rem;
}
.group_9 {
  margin-top: 0.88rem;
}
.text_21 {
  margin-top: 1.75rem;
}
.text_22 {
  margin-top: 1.75rem;
}
.text_23 {
  margin-top: 1.75rem;
}
.text_24 {
  margin-top: 1.75rem;
}
.list-item {
  margin-top: 1.13rem;
}
.group_10 {
  /* padding: 0 8.75rem; */
  width: 73.75rem;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.image-wrapper {
  width: 3.5rem;
}
.image_7 {
  border-radius: 6.25rem;
  width: 2.5rem;
  height: 2.5rem;
}
.image_8 {
  width: 3.5rem;
  height: 0.5rem;
}
.group_11 {
  overflow: hidden;
  height: 45rem;
}
.section_16 {
  position: relative;
  background-size: cover;
  background-position: center;

  
  transition: background-image 0.5s ease-in-out;
}

.section_16[data-bg-index="0"] {
  background-image: url('../../assets/images/optimized/pages/Home/images/Union-Film01.jpg');
  background-size: cover;
  background-position: center;
}

.section_16[data-bg-index="1"] {
  background-image: url('../../assets/images/optimized/pages/Home/images/Union_Film02.png');
  background-size: cover;
  background-position: center;
}

.section_16[data-bg-index="2"] {
  background-image: url('../../assets/images/optimized/pages/Home/images/Union-Film03.jpg');
  background-size: cover;
  background-position: center;
}

.center-images {
  position: relative;
  display: flex;
  /* justify-content: center; */
  align-items: center;
  margin-top: 1rem;
  /* width: 100%; */
  /* height: 200px; */
  overflow: visible;
}

.image-wrapper_2 {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0 10px;
  opacity: 1;
  transform: none;
  transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.image-wrapper_2.active {
  opacity: 1;
  transform: none;
  z-index: 1;
}

.image-wrapper_2 img {
  /* max-width: 100%; */
  height: auto;
  display: block;
}

.indicator-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background-color: #D9D9D9;
  margin: 0 4px;
  cursor: pointer;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
  overflow: hidden;
}

.indicator-dot::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #FFB800;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.indicator-dot.active {
  background-color: #FFB800;
  width: 24px;
  border-radius: 8px;
}

.indicator-dot.active::before {
  transform: scaleX(1);
}

.indicator-dot:hover {
  transform: scale(1.2);
}

.font_12 {
  font-size: 2rem;
  font-family: Poppins;
  line-height: 1.5rem;
  font-weight: 700;
  color: #eeeeeb;
}
.group_12 {
  margin-top: 1.38rem;
}
.font_13 {
  font-size: 1rem;
  font-family: Poppins;
  line-height: 1.19rem;
  font-weight: 700;
  color: #040415;
}
.text_26 {
  color: #ffcc32;
}
.group_13 {
  margin-top: 1.5rem;
}
.font_14 {
  font-size: 2rem;
  font-family: Poppins;
  line-height: 2.75rem;
  font-weight: 700;
  color: #eeeeeb;
}
.image_9 {
  margin-top: 0.5rem;
  border-radius: 6.25rem;
  width: 3.5rem;
  height: 3.5rem;
}
.group_14 {
  margin-top: 6.63rem;
  padding: 0 3.25rem;
  margin-bottom: 3.63rem;
}
.image_12 {
  margin-left: 1.88rem;
  width: 29.25rem;
  height: 15.13rem;
}
.image-wrapper_2 {
  /* margin-left: 1.25rem; */
  overflow: hidden;
  border-radius: 2.25rem;
  width: 19rem;
  height: 10rem;
}
.image_11 {
  /* margin-top: -0.56rem;
  width: 29.25rem;
  height: 15.13rem; */

  margin-top: -1.56rem;
    /* width: 29.25rem; */
    /* height: 15.13rem ; */
    width: 104% !important;
    height: 117% !important;
}
.image_10 {
  margin-top: -1.69rem;

  width: 104% !important;
  height: 117% !important;
  margin-left: -0.5rem;
}
.image_13 {
  margin-left: 0.88rem;
}
.group_15 {
  margin-right: 3rem;
}
.group_16 {
  margin-top: 1.5rem;
  height: 5.38rem;
}
.font_15 {
  font-size: 2rem;
  font-family: Poppins;
  line-height: 2.38rem;
  font-weight: 700;
  color: #ffcc32;
}
.text_9 {
  text-transform: uppercase;

}
.secound_title{
  white-space: nowrap;         /* 禁止文本换行 */
  overflow: hidden;            /* 隐藏超出容器的部分 */
  text-overflow: ellipsis;     /* 显示省略号 */
  width: 200px;                /* 设置容器的宽度 */
  display: block;  
  line-height: 1rem;
}
.text_29 {
  margin-top: 0.75rem;
  line-height: 0.75rem;
}
.text_28 {
  margin-left: 0.13rem;
}
.text_27 {
  margin-left: 0.13rem;
}
.text_25 {
  margin-left: 0.13rem;
  line-height: 1.44rem;
}
.text_18 {
  color: #ffffff;
  font-size: 1rem;
  font-family: Poppins;
  font-weight: 600;
  line-height: 0.63rem;
}
.text_17 {
  color: #040415;
  line-height: 0.63rem;
}
.text_13 {
  color: #ffcc32;
}
.text_12 {
  color: #040415;
}
.text_10 {
  margin-left: 0.25rem;
}
.text_31 {
  margin-left: 0.5rem;
}
.text_32 {
  color: #040415;
}
.text_30 {
  color: #040415;
  font-size: 1rem;
  font-family: Poppins;
  /* line-height: 1.25rem;   */
  width: 38.75rem;
}
.group_17 {
  margin-top: 0.25rem;
}
.text_33 {
  margin-top: 0.5rem;
  margin-left: 31.75rem;
  font-weight: 700;
  line-height: 0.54rem;
}
.image_14 {
  width: 1rem;
  height: 0.69rem;
}
.section_17 {
  margin-top: 1.63rem;
  padding: 2.88rem 0 2.5rem;
  background-color: #ffffffdf;
  border-radius: 1.25rem;
  height: 28.94rem;
  border-left: solid 0.063rem #8e8e93;
  border-right: solid 0.063rem #8e8e93;
  border-top: solid 0.063rem #8e8e93;
  border-bottom: solid 0.063rem #8e8e93;
}
.equal-division_3 {
  padding: 0 1.25rem;
}
.group_18 {
  flex: 1 1 23.33rem;
}
.equal-division-item_2 {
  padding: 0.5rem 1.13rem 0.5rem 1.5rem;
}
.image_15 {
  width: 3.75rem;
  height: 3.75rem;
}
.group_19 {
  margin-top: 3.88rem;
}
.font_16 {
  font-size: 1rem;
  font-family: Poppins;
  /* line-height: 1.94rem; */
  color: #040415;
}
.text_34 {
  margin-top: 1.88rem;
}
.section_18 {
  padding: 5rem 8.75rem 6.75rem;
  background-image: url('../../assets/images/optimized/pages/Home/images/Contact_Us_bac.webp');
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

.section_18 .font_12.text_9 {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

.section_18 .font_12.text_9.visible {
  opacity: 1;
  transform: translateY(0);
}

@keyframes slideUpFade {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.animate-title {
  animation: slideUpFade 0.8s ease-out forwards;
}

.group_20 {
  width: 30.51rem;
}
.group_21 {
  margin-right: 0.13rem;
  overflow: hidden;
  border-radius: 1.25rem;
  height: 20.25rem;
}
.text_40 {
  margin-top: 1.5rem;
  line-height: 1.19rem;
  text-transform: lowercase;
}
.image_16 {
  border-radius: 1.25rem;
  overflow: hidden;
  width: 30.38rem;
  height: 20.25rem;
}
.pos_5 {
  position: absolute;
  left: 0;
  right: 0.14rem;
  top: -3.2rem;
}
.group_22 {
  margin-right: 2.5rem;
}
.text-wrapper_5 {
  padding: 1.38rem 0 1.25rem;
  background-color: #ffffff;
  border-radius: 0.5rem;
  width: 33.63rem;
  border-left: solid 0.063rem #f5f5f5;
  border-right: solid 0.063rem #f5f5f5;
  border-top: solid 0.063rem #f5f5f5;
  border-bottom: solid 0.063rem #f5f5f5;
  cursor: pointer;
  transition: background-color 0.3s ease;
}

.text-wrapper_5:hover {
  background-color: #D6AB2A;
}

.font_17 {
  font-size: 1rem;
  font-family: Poppins;
  line-height: 0.72rem;
  color: #888888;
}
.text_35 {
  margin-left: 1.25rem;
}
.text_36 {
  line-height: 0.7rem;
}
.text_37 {
  line-height: 0.75rem;
}
.text-wrapper_6 {
  padding: 1.25rem 0;
  background-color: #ffffff;
  border-radius: 0.5rem;
  width: 33.63rem;
  border-left: solid 0.063rem #f5f5f5;
  border-right: solid 0.063rem #f5f5f5;
  border-top: solid 0.063rem #f5f5f5;
  border-bottom: solid 0.063rem #f5f5f5;
  cursor: pointer;
  transition: background-color 0.3s ease;
}

.text-wrapper_6:hover {
  background-color: #D6AB2A;
}
.text_38 {
  margin-left: 1.25rem;
  line-height: 0.78rem;
}
.text-wrapper_7 {
  padding: 1.63rem 0 4.5rem;
  background-color: #ffffff;
  border-radius: 0.5rem;
  width: 33.63rem;
  height: 7.25rem;
  border-left: solid 0.063rem #f5f5f5;
  border-right: solid 0.063rem #f5f5f5;
  border-top: solid 0.063rem #f5f5f5;
  border-bottom: solid 0.063rem #f5f5f5;
  cursor: pointer;
  transition: background-color 0.3s ease;
}

.text-wrapper_7:hover {
  background-color: #D6AB2A;
}
.text_39 {
  margin-left: 1.25rem;
  line-height: 0.97rem;
}
.text-wrapper_8 {
  padding: 1.38rem 0;
  background-color: #ffcc32;
  border-radius: 6.25rem;
  overflow: hidden;
  width: 10.56rem;
  cursor: pointer;
  transition: background-color 0.3s ease;
}

.text-wrapper_8:hover {
  background-color: #D6AB2A;
}
.section_19 {
  padding-bottom: 2.63rem;
  background-color: #eeeeeb;
}
.group_23 {
  padding: 2.88rem 0 1.88rem;
  border-bottom: solid 0.063rem #040415;
}
.text_41 {
  line-height: 0.71rem;
}
.text_42 {
  line-height: 0.75rem;
}
.text_43 {
  line-height: 0.81rem;
}
.text_44 {
  line-height: 1.01rem;
}
.text_45 {
  line-height: 0.72rem;
}
.text_46 {
  line-height: 0.77rem;
}
.why_box{
  width: 73.75rem;
  justify-content: center;
  margin: 0 auto;
  margin-top: 5rem;
}
/* 图片hover效果 */
.hover-effect {
  position: relative;
  overflow: hidden;
}

.hover-effect .default-image {
  display: block;
  transition: opacity 0.3s ease;
}

.hover-effect .hover-image {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  transition: opacity 0.3s ease;
}

.hover-effect:hover .default-image {
  opacity: 0;
}

.hover-effect:hover .hover-image {
  opacity: 1;
}

/* 中间logo样式 */
.custom-logo {
  display: flex;
  justify-content: center;
  align-items: center;
}

.logo-shape {
  width: 150px;  /* 根据需要调整尺寸 */
  height: 150px;
  background: linear-gradient(45deg, #FF6B6B, #4ECDC4);
  border-radius: 50%;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  box-shadow: 0 4px 15px rgba(0,0,0,0.1);
}

.logo-shape::after {
  content: '';
  position: absolute;
  width: 70%;
  height: 70%;
  background: white;
  border-radius: 50%;
}
.indicator-dot {
  width: 12px;  /* 调整圆点大小 */
  height: 12px;
  border-radius: 50%;
  background-color: #808080;  /* 默认灰色 */
  margin: 0 8px;  /* 调整间距 */
}

.indicator-dot.active {
  width: 24px;  /* 活跃状态为椭圆形 */
  height: 12px;
  border-radius: 6px;
  background-color: #FFB800;  /* 活跃状态为黄色 */
}

.full-width-section {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.content-wrapper {
  width: 100%; /* 左右各140px的边距 */
  /* margin: 0 140px; 左右固定140px的边距 */
}

.group_14 {
  display: flex;
  justify-content: center;
  width: 100%;
  gap: 2rem; /* 图片之间的间距 */
}

/* 如果需要调整图片大小，确保它们不会过大 */
.image_7, .image_12, .image_10, .image_11 {
  height: auto;
}

.center-images {
  display: flex;
  gap: 1rem;
  /* justify-content: center; */
  align-items: center;
}

.image-wrapper_2 {
  /* padding: 10px; */
  border: 2px solid transparent;
  border-radius: 20px;
  transition: border-color 0.3s ease;
  cursor: pointer;
}

.image-wrapper_2.selected {
  border-color: #ffcc32;
}

.arrow-btn {
  cursor: pointer;
  transition: transform 0.3s ease;
}

.arrow-btn:hover {
  transform: scale(1.1);
}

.input-wrapper {
  width: 100%;
}

.custom-input {
  width: 100%;
  padding: 1rem;
  border: 1px solid #f5f5f5;
  border-radius: 0.5rem;
  font-family: Poppins;
  font-size: 1rem;
  color: #333;
  background-color: #ffffff;
  transition: all 0.3s ease;
}

.custom-input::placeholder {
  color: #888888;
}

.custom-input:hover {
  border-color: #ffcc32;
}

.custom-input:focus {
  outline: none;
  border-color: #ffcc32;
  box-shadow: 0 0 0 2px rgba(255, 204, 50, 0.1);
}

.custom-textarea {
  min-height: 120px;
  resize: vertical;
}

/* 保持原有的间距样式 */
.mt-14 {
  margin-top: 0.875rem;
}

.mt-40 {
  margin-top: 2.5rem;
}

.footer-link {
  text-decoration: none;  /* 去除默认下划线 */
  color: inherit;
  cursor: pointer;
  transition: color 0.3s ease;
}

.footer-link:hover {
  color: #ffcc32;
  text-decoration: none;  /* 确保hover状态也没有下划线 */
}

/* 确保访问过的链接也没有下划线 */
.footer-link:visited {
  text-decoration: none;
}

/* 响应式设计 */
@media screen and (max-width: 1200px) {
  .section {
    padding-bottom: 20rem;
    background-size: cover;
    background-position: center;
  }

  .section_2 {
    padding: 1.19rem 2rem;
  }

  .group_4 {
    margin-right: 1rem;
  }

  .mt-80 {
    margin-top: 2rem;
  }

  .flex-row.mt-18 {
    flex-wrap: wrap;
    justify-content: center;
  }

  .group_4 {
    margin-bottom: 1rem;
    margin-left: 0.5rem;
  }

  .ml-20 {
    margin-left: 1rem;
  }
}

@media screen and (max-width: 768px) {
  .phone_second_section_content{
    display: block;
  }  
  .phone_second_section{
    margin-left: 1rem !important;
  }
  .ml-7{
    margin-top: 0;
  }
.mt_00{
  margin-top: 2rem;
  width: 18rem;
}
  .image-wrapper {
    /* width: 100%; */
    width: 1.75rem !important;
  }
  .group_21{
    height: 18.25rem;
  }
  .group_9 {
    margin-top: 0.5rem;
  }
  .section {
    /* padding-bottom: 15rem; */
    background-size: cover;
    background-position: center;
  }

  .btom_title{
    margin-top: 1rem;
    font-weight: bold;
    text-transform: uppercase;
  }
  .image_9{
    width: 2.5rem;
    height: 2.5rem;
  }
  .ml-335{
    margin-left: 0; 
    position: absolute;
    top: 4rem;
    right: 1rem;
  }
  .group_12{
    margin-top: 0.75rem;
    width: 23rem;
  }
  .group_13{
    margin-top: 0.85rem;
  }
  
  .font_14{
    font-size: 0.7rem;
    line-height: 1.35rem;
  }
  .font_13{
    font-size: 0.75rem;
  }
  .font_12{
    font-size: 1.25rem;
  }
  .group_14{
    margin-bottom: 0;
    margin-top: 0;
  }
  .image_11{
    width:12.75rem !important;
    height: 8.375rem !important;
  }
  .image-wrapper_2{
    width:10.75rem !important;
    height: 6.5rem !important;
    margin: 0;
    padding: 0;
  }
  .image_11{
    margin-top: 0;
  }
  .section_9_1{
    padding:0;
  }
  .show_mobile_2{
    display: block;
  }
  .section_7{
    width: 11.5rem !important;
    padding: 1.75rem 0.5rem 14.25rem;
  }
  .five_mobile{
    display: none;
  }
  /* .desktop-nav {
    display: none;
  }

  .group {
    display: none;
  } */

  .section_2 {
    padding: 0;
  }
/* 
  .section_2 .flex-row.items-center {
    width: 100%;
  } */

  .mobile-nav-container {
    display: block;
  }

  /* 隐藏上传的代码块 */
  /* .flex-col.mt-80.flex-col {
    display: none;
  } */

  .font_6 {
    font-size: 0.9rem;
    /* line-height: 1.5rem; */
    text-align: left;
  }
  .group_2 {
    margin-top: 2rem;
    text-align: center;
  }

  .group_3 {
    text-align: center;
  }

  .flex-row.equal-division_2 {
    flex-direction: column;
    gap: 1rem;
  }

  .group_8 {
    width: 100%;
    margin-bottom: 1rem;
    margin-top: 1rem;
  }

  .section_16 {
    padding: 2rem 1rem 1rem;
  }
  .group_16{
    height: 3rem;
  }
  .width_phone{
    width: 23rem;
  }
  .font_15{
    line-height: 1.25rem;
  }
  .section_16 .content-wrapper {
    padding: 2rem !important;
  }

  .group_14 {
    /* flex-direction: column; */
    align-items: center;
    padding: 0;
  }

  .center-images {
    /* flex-direction: column; */
    align-items: center;
  }

  .image-wrapper_2 {
    /* margin-bottom: 1rem; */
  }

  .why_box {
    /* padding: 2rem; */
    width: 24rem;
  }
  .font_15{
    font-size: 1.25rem;
  }
  .text_30{
    width: 23rem;
    margin-top: 1rem;
  }
  .text_33{
    /* margin: 0 auto; */
    margin: 0;
  }
  .group_15 {
    flex-direction: column;
    align-items: center;
    text-align: center;
    margin: 0;
  }

  .group_17 {
    /* margin-top: 1rem; */
    margin:1rem auto 0; 
  }
  .section_17{
    height: auto;
    padding:1.5rem 0.25rem;
    /* max-width: 23rem; */
    margin: 1.63rem  0.5rem;
  }
  .flex-row.equal-division_3 {
    flex-direction: column;
    gap: 2rem;
  }

  .group_18 {
    width: 100%;
    text-align: center;
  }

  .section_18 {
    padding: 2rem 1rem;
  }

  .text_20 {
    /* flex-direction: column; */
    margin-top: 1rem;
  }

  .group_20 {
    width: 100%;
    margin-top: 2rem;
  }

  .input-wrapper {
    width: 100%;
  }

  .group_23 {
    flex-wrap: wrap;
    justify-content: center;
    /* gap: 1rem; */
    padding: 2rem 0;
  }

  .footer-link {
    margin: 0.5rem;
  }
}

@media screen and (max-width: 480px) {
  .image_7 {
    width: 100%;
    height: auto;
  }
  .image_11 {
    width: 100%;
    height: auto;
  }

  .font_5 {
    font-size: 1.5rem;
  }

  .font_6 {
    font-size: 0.9rem;
  }
  .text-wrapper_8 {
    width: 100%;
    padding: 1rem 0;
  }

  .custom-input {
    font-size: 0.9rem;
  }

  .group_10 {
    /* width: 100%; */
    width: 17rem !important;
    justify-content: center;
  }

  .indicator-dot {
    width: 8px;
    height: 8px;
    margin: 0 4px;
  }

  .indicator-dot.active {
    width: 16px;
    height: 8px;
  }
}

/* 添加触摸设备优化 */
@media (hover: none) {
  .hover-effect:hover {
    transform: none;
  }

  .image-wrapper:hover .default-image {
    display: block;
  }

  .image-wrapper {
    width: 1.75rem;
    /* display: none; */
  }
}

/* 确保图片在移动端正确缩放 */
/* img { */
  /* max-width: 100%; */
  /* height: auto; */
/* } */

/* 优化移动端滚动 */
html {
  -webkit-overflow-scrolling: touch;
}

/* 防止移动端点击延迟 */
a, button, input, textarea {
  touch-action: manipulation;
}

/* 移动端导航样式 */
.mobile-menu-btn {
  flex-direction: column;
  justify-content: space-between;
  width: 30px;
  height: 21px;
  cursor: pointer;
  z-index: 1000;
  display: none;
  margin-top: 10px;
}

.mobile-menu-btn span {
  display: block;
  width: 100%;
  height: 3px;
  background-color: #fff;
  transition: all 0.3s ease;
}

.mobile-nav {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-color: #161613;
  z-index: 999;
  padding: 80px 20px;
  transform: translateX(100%);
  transition: transform 0.3s ease;
}

.mobile-nav.active {
  transform: translateX(0);
}

.mobile-nav-item {
  display: block;
  color: #fff;
  font-size: 1.2rem;
  padding: 15px 0;
  text-decoration: none;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  transition: color 0.3s ease;
}

.mobile-nav-item:hover {
  color: #ffcc32;
}
.section_5_1{
      padding: 2.91rem 2.5rem 2.38rem;
    background-color: #ffffff80;
    border-radius: 1.25rem;
    /* width: 33.38rem; */
    border: solid 0.063rem #8e8e93;
}
.grid {
    /* width: 29rem; */
    /* height: 8.25rem; */
    display: grid;
    grid-template-rows: repeat(3, minmax(0, 1fr));
    grid-template-columns: repeat(4, minmax(0, 1fr));
    row-gap: 1.34rem;
    column-gap: 1.34rem;
}
.grid-item {
    width: 4rem;
    height: 4rem;
}
.font_222{
  font-size: 2rem;
    font-family: Poppins;
    line-height: 2.63rem;
    font-weight: 700;
    color: #040415;
}
.font_333{
      font-size: 1rem;
    font-family: Poppins;
    line-height: 1.94rem;    
    color: #040415;
    word-wrap: break-word;
    overflow-wrap: break-word;
    width: 39.44rem;
}
.font_444{
      font-size: 1rem;
    font-family: Poppins;
    /* line-height: 1rem; */
    color: #040415;
}
.font_555{
      font-size: 1rem;
    font-family: Poppins;
    line-height: 0.72rem;
    font-weight: 700;
    color: #040415;
}
/* 响应式设计 */
@media screen and (max-width: 768px) {
  .group_6{
    margin-left: 0.75rem !important;
  }
  .font_222{
            font-size: 1.25rem;
        line-height: 1.5rem;
  }
  .section_5_1{
            width: auto;
        padding: 2rem 1rem;
        margin: 0 1rem;
  }
  /* .grid-item {
        width: 3rem;
        height: 3rem;
    } */
        .grid {
        /* width: 20rem; */
        /* height: 8rem; */
    }
    .font_333{
              width: 23rem;
        /* padding: 0 0.75rem 0 0; */
        word-wrap: break-word;
        overflow-wrap: break-word;
    }
  .group_19 {
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
  }
  .group_19 .font_13 {
    margin-top: 0 !important;
    margin-right: 0.5em;
    /* 可选：让最后一个不加右边距 */
  }
  .group_19 .font_13:last-child {
    margin-right: 0 !important;
  }

  .image_16{
    width: 100%;
    height: 17.25rem;
  }
  .text_40{
    margin-top: 0;
  }
  .mt-69{
    display: block;
    margin-top: 0;
  }
  .equal-division_3{
    padding: 0;
  }
  .group_19{
    margin-top: 0.88rem;
    margin:1.88rem auto 0;
  }
  .image_15{
    margin:0 auto;
  }
  .group_18{
    flex:0;
  }
  .group_7{
    display: none;
  }
  .show_mobile{
    display: none;
  }
  .group_2{
    padding: 0 2rem 1.5rem;
    width: 100%;  
    margin: 2rem 0 0;
  }
  .section{
    padding-bottom: 0;
  }
  .font_5{
    line-height: 2rem;
  }
  .section_4{
    display: none;
  }
  .desktop-nav {
    display: none;
  }
  .text-wrapper {
    padding: 1.1rem 0;
    margin-top: 0.88rem;
  }
  .mobile-menu-btn {
    display: flex;
  }
  .font_8{
    font-size: 1.25rem;
    line-height: 1.25rem;
  }
  .group_4 {
    margin: 0 0.25rem;
    max-width: 11.5rem;
    height: auto;
  }
  .section_8{
    width: auto;
    height: 13rem;
    padding: 1.75rem 0.5rem 14.25rem;
  }
  .section_6{
    width: auto;
    height: 16.2rem;
    padding: 2.38rem 0.5rem 14.25rem;
  }
  .group_8{
    flex: 0;
  }
.section_5{
  height: 16.2rem;
}
.section_7{
  height: 16.2rem;
}
  .overlay{
    height: 70%;
  }
  .text-wrapper_3{
    top: 20%;
  }
  .text-wrapper_4{
    top: 33%;
  }
  .section_5{
    width: 11.5rem;
    padding: 2.38rem 0.5rem 14.25rem;
  }
  .mt-18{
    padding:0;
  }
  .mobile-menu-btn.active span:nth-child(1) {
    transform: translateY(9px) rotate(45deg);
  }

  .mobile-menu-btn.active span:nth-child(2) {
    opacity: 0;
  }

  .mobile-menu-btn.active span:nth-child(3) {
    transform: translateY(-9px) rotate(-45deg);
  }

  .mobile-nav {
    display: block;
  }

  .section_2 {
    padding: 1rem;
  }

  .group {
    display: none;
  }
}

.animate-on-scroll {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

.animate-on-scroll.visible {
  opacity: 1;
  transform: translateY(0);
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* header-content 相关样式 */
.header-content {
  display: flex;
  justify-content: center;
  gap: 2rem;
  margin-top: 2rem;
}

.stats-section {
  display: flex;
  justify-content: flex-end;
  gap: 11.35rem;
  margin-top: 5rem;
}

.stat-item {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.79rem;
}

.input-wrapper {
  width: 33.63rem;
}

.custom-input {
  width: 100%;
  padding: 1rem;
  background-color: #ffffff;
  border-radius: 0.5rem;
  border: solid 0.063rem #f5f5f5;
  font-size: 1rem;
  font-family: Poppins;
  line-height: 0.72rem;
  color: #040415;
  transition: all 0.3s ease;
}

.custom-input::placeholder {
  color: #888888;
}

.custom-input:hover {
  border-color: #ffcc32;
}

.custom-input:focus {
  outline: none;
  border-color: #ffcc32;
  box-shadow: 0 0 0 2px rgba(255, 204, 50, 0.2);
}

.custom-textarea {
  height: 7.25rem;
  resize: none;
}

/* 移动端样式 */
@media screen and (max-width: 768px) {
  .header-content {
    display: flex;
    flex-direction: column-reverse; /* 反向排列子元素 */
  }
  
  .font_5 {
    font-size: 1.25rem;
    line-height: 1.5rem;
  }
  
  .text_14 {
    width: calc(100% - 2rem);
    padding: 0 0.75rem 0 0;
  }
  
  .input-wrapper {
    width: auto;
  }
}