/* h5style */
.pc-header {
  display: none;
}
.pc-page {
  width: 100vw;
}
/* 滚动时的样式 */
.h5-page-header.scrolled {
  background-color: #ffffff;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); /* 可选：添加阴影增强视觉效果 */
}
.h5-page-header.notshow {
  display: none;
}
.h5-page-header {
  padding-bottom: 2.03vw;
  padding-top: 2.03vw;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 99;
  padding-left: 4vw;
  padding-right: 4vw;
}
.menu-box {
  background: #ffffff;
  position: absolute;
  top: 10vw;
  display: flex;
  flex-direction: column;
  width: 100vw;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}
.link-a {
  padding: 1.4vw 4vw;
  color: #333333;
  text-decoration: none;
  background: #ffffff;
  font-size: 2.4vw;
  font-weight: 400;
}
.more-icon {
  width: 4.8vw;
  height: 3.8vw;
}
.box1 {
  width: 100vw;
  height: 50.8vw;
  background-image: url("./public/pc_pic/h5bg1.png");
  background-size: 100% 100%;
  background-repeat: no-repeat;
  padding-top: 6.76vw;
  padding-left: 15.83vw;
}
.pc-box1 {
  display: none;
}
.box2 {
  padding-top: 6vw;
}
.box5 {
  padding-top: 6vw;
}
.title1 {
  font-weight: 500;
  font-size: 4vw;
  color: #333333;
  text-align: center;
  font-style: normal;
  text-transform: none;
}
.title2 {
  font-weight: 500;
  font-size: 2.2vw;
  color: #6b7385;
  text-align: center;
  font-style: normal;
  text-transform: none;
}
.num1 {
  width: 8.13vw;
  height: 8.14vw;
}
.pic1 {
  width: 50.66vw;
  margin-left: 8.6vw;
  margin-top: 8.2vw;
}
.picb2 {
  width: 50.66vw;
  margin-right: 8.6vw;
  margin-top: 1.1vw;
}
.title5 {
  font-weight: 500;
  font-size: 2.5vw;
  color: #333333;
}
.title4 {
  font-weight: 400;
  font-size: 2.4vw;
  color: #464d66;
}
.icon1 {
  width: fit-content;
  height: 3.4vw;
  padding-left: 0.8vw;
  padding-right: 2vw;
  border-radius: 5px 5px 5px 5px;
  border: 1px solid #e0e1e7;
  font-weight: 400;
  font-size: 1.86vw;
  color: #646464;
  text-align: left;
  display: flex;
  justify-content: start;
  align-items: center;
}
.pl4 {
  font-weight: 400;
  font-size: 1.86vw;
  color: #646464;
}
.icon1-p {
  width: 1.88vw;
  height: 1.88vw;
  margin-right: 4px;
}
.p1 {
  padding-top: 5.86vw;
}
.h5-item-centenr {
  display: flex;
  align-items: center;
}
.h5-box2-top1 {
  margin-left: 4vw;
  margin-right: 4vw;
  display: flex;
  justify-content: space-between;
}
.tag-box {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: repeat(3, 1fr);
  grid-row-gap: 1.6vw;
  padding-top: 2.13vw;
}
.pc-sloel2 {
  display: none;
}
.h5-title4 {
  padding-top: 2vw;
  font-weight: 400;
  font-size: 2.2vw;
  color: #464d66;
}
.box3 {
  padding-top: 8.66vw;
}
.h5-pt12 {
  padding-top: 13.66vw;
}
.box4 {
  padding-top: 8.66vw;
}
/* 优化滚动容器样式 */
.tags3-father {
  width: 100vw;
  overflow-x: auto; /* 无滚动时隐藏滚动条 */
  -webkit-overflow-scrolling: touch; /* iOS顺滑滚动 */
  scrollbar-width: none; /* Firefox */
  -ms-overflow-style: none; /* IE 和 Edge */
}
.tags3-item-1 {
  margin-left: 4vw;
}
/* 滚动条样式优化（WebKit内核） */
.tags3-father::-webkit-scrollbar {
  height: 0px; /* 横向滚动条高度 */
  display: none;
}

.tags3-father::-webkit-scrollbar-track {
  background: transparent; /* 轨道透明 */
  display: none;
}

.tags3-father::-webkit-scrollbar-thumb {
  background-color: rgba(255, 255, 255); /* 滑块颜色 */
  border-radius: 2px; /* 滑块圆角 */
  display: none;
}
.logo-icon {
  width: 6.53vw;
  height: 6.53vw;
  margin-right: 1vw;
}

/* 优化滚动内容区 */
.tags3 {
  padding-top: 4.36vw;
  display: flex;
  align-items: center;
  gap: 4vw;
  overflow-x: auto;
  width: max-content; /* 宽度自适应内容 */
  padding-bottom: 4vw; /* 减少底部内边距 */
  scroll-snap-type: x mandatory; /* 滚动吸附效果 */
  animation: slide 16s linear infinite;
}

/* 滚动项样式优化 */
.tags3-item {
  width: 56.86vw;
  background: #ffffff;
  box-shadow: 0px 5px 44px 5px rgba(0, 0, 0, 0.11);
  border-radius: 0px 0px 14px 14px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  scroll-snap-align: start; /* 滚动吸附起点 */
  flex-shrink: 0; /* 防止被压缩 */
  transition: transform 0.3s ease, box-shadow 0.3s ease; /* 过渡动画 */
}

/* 滚动项hover效果 */
.tags3-item:hover {
  transform: translateY(-2px); /* 轻微上浮 */
  box-shadow: 0px 8px 50px 0px rgba(0, 0, 0, 0.15); /* 增强阴影 */
}

.tags3-title {
  font-weight: 500;
  font-size: 3.2vw;
  color: #333333;
  text-align: center;
  padding-top: 3.3vw;
  padding-bottom: 1.5vw;
}
.tags3-slo {
  font-weight: 400;
  font-size: 2.4vw;
  color: #6b7385;
  text-align: center;
  font-style: normal;
  text-transform: none;
  padding-bottom: 3.3vw;
}
.picss {
  width: 46.66vw;
  height: 47.6vw;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 1;
}
.pxaa {
  position: relative;
  padding-left: 5.86vw;
}
.title6 {
  font-weight: 500;
  font-size: 2.66vw;
  color: #000000;
  text-align: left;
  padding-bottom: 1.46vw;
}
.title7 {
  font-weight: 400;
  font-size: 2.4vw;
  color: #6b7385;
  text-align: left;
}
.p12 {
  padding-bottom: 8vw;
}
.p15 {
  padding-bottom: 3vw;
  z-index: 3;
}
.box-6 {
  margin-top: 9.15vw;
  height: 38.49vw;
  width: 100vw;
  background-image: url("./public/pc_pic/bg3.png");
  background-size: 100% 100%;
  background-repeat: no-repeat;
}
.dowm-title {
  font-weight: bold;
  font-size: 4vw;
  color: #ffffff;
  text-align: center;
  padding-top: 4.45vw;
  padding-bottom: 1.45vw;
}
.dowm-solgn {
  font-weight: 400;
  font-size: 2.2vw;
  color: #fffbfb;
  text-align: center;
}
.adr-btn {
  text-align: center;
  line-height: 8vw;
  width: 30.92vw;
  height: 8vw;
  border-radius: 4.2vw;
  border: 1px solid rgba(255, 255, 255, 0.8);
  font-weight: 600;
  font-size: 2.4vw;
  color: #ffffff;
  cursor: pointer;
}
.adr-btn:hover {
  text-align: center;
  line-height: 8vw;
  width: 30.92vw;
  height: 8vw;
  background: #ffffff;
  border-radius: 4.2vw;
  font-weight: 600;
  font-size: 2.4vw;
  color: #333333;
  cursor: pointer;
}
.btn-group {
  display: flex;
  justify-content: center;
  gap: 1.88vw;
  padding-top: 5.69vw;
}
.box7 {
  width: 100vw;
  height: 59.26vw;
  background: #141d26;
  position: relative;
}
.box-71 {
  padding: 3.2vw 0 0 3.2vw;
}
.introduction {
  width: 218px;
  font-weight: 400;
  font-size: 2.4vw;
  color: #ffffff;
  line-height: 3.8vw;
  text-align: left;
  font-style: normal;
  text-transform: none;
  padding-right: 20vw;
}
.icon33 {
  width: 6.14vw;
  height: 6.14vw;
  margin-right: 1.46vw;
}
.name2 {
  font-weight: 400;
  font-size: 2.92vw;
  color: #fff9f9;
}
.mb-12 {
  margin-bottom: 1.2vw;
}
.box-72 {
  display: none;
}
.line-title {
  font-weight: 400;
  font-size: 3.73vw;
  color: #ffffff;
}
.addr-val {
  font-weight: 400;
  font-size: 2.4vw;
  color: rgba(255, 255, 255, 0.85);
}
.addr-title {
  font-weight: 400;
  font-size: 2.66vw;
  color: #ffffff;
}
.p17 {
  padding-right: 4.66vw;
}
.m16 {
  margin-top: 4vw;
}
.m17 {
  margin-top: 1.6vw;
}
.coy-box-pc {
  display: none;
}
.coy-box-h5 {
  position: absolute;
  bottom: 0;
  width: 100vw;
  height: 16.66vw;
  background: #3a3a3b;
  border-radius: 0px 0px 0px 0px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-weight: 400;
  font-size: 2.63vw;
  color: #ffffff;
}
.icon2-h5 {
  width: 4vw;
  height: 4vw;
  margin-left: 1vw;
  margin-right: 1vw;
}
.blue-text {
  font-weight: 400;
  font-size: 2.63vw;
  color: #2756ff;
}
.pt-20 {
  padding-top: 1vw;
}

/* 定义动画 */
@keyframes slide {
  0% {
    transform: translateX(0);
  }

  100% {
    transform: translateX(calc(-60.86vw * 3));
  }
}