@charset "utf-8";

:root {
  --main-color: #1D69FB;
  --main-tit-color: #0A1A47;
  --main-sub-color: #808798;
  --main-font-size: 16px;
  --main-box-shadow: 0 2px 6px rgba(0, 0, 0, .08);
  --main-hover-box-shadow: 0 4px 15px rgba(0, 0, 0, .2);
}

body {
  overflow-x: hidden;
  overflow-y: auto;
  font-size: var(--main-font-size);
  color: var(--main-tit-color);
}
.indexBody{
  background: url('https://www-1300910993.cos.ap-shanghai.myqcloud.com/qsmweb_2026/images/bannerBg@2x.jpg') no-repeat center top;
  background-size: 100% 90vh;
}
.icon {
  width: 1em;
  height: 1em;
  vertical-align: -0.15em;
  fill: currentColor;
  overflow: hidden;
}

.zt {
  color: var(--main-color);
  font-weight: bold;
}

/* 首页 */
.greyBG {
  background: #F5F6FF;
}

a {
  color: var(--main-tit-color);
  transition: all .4s;
}

a:hover {
  color: var(--main-color) !important;
}

.colorHC {
  color: var(--main-color);
}

.G_index {
  width: 100%;
  max-width: 1400px;
  margin: 0 auto;
  box-sizing: border-box;
}

.swiper-button-next,
.swiper-button-prev {
  outline: none;
}
.topAD{
  /* position: sticky; */
  /* top: 0; */
  /* z-index: 2; */
  width: 100%;
  height: 60px;
  background-size: 1920px 60px!important;
  cursor: pointer;
}
.topclose{
  position: absolute;
  top: 2px;
  right: 2px;
  font-size: 10px;
  background: rgba(0, 0, 0, .3);
  border-radius: 50%;
  color: rgba(255, 255, 255, .6);
  width: 20px;
  height: 20px;
  text-align: center;
  line-height: 20px;
  transition: all .3s;
}
.topclose:hover{
  background: rgba(0, 0, 0, .5);
  color: rgba(255, 255, 255, .8);
}
.header {
  position: sticky;
  top: 0;
  left: 0;
  right: 0;
  z-index: 90;
  width: 100%;
  background: transparent;
  transition: all .4s;
  padding: 0 4vw;
  box-sizing: border-box;
  border: 1px solid transparent;
  margin: auto;
}

.nav {
  margin: 0 16px;
  max-width: 700px;
  width: 100%;
  transition: all .4s;
}

.nav>ul>li a {
  display: block;
  padding-top: 0;
  line-height: 72px;
  font-size: 16px;
  transition: all .3s;
}

.logo {
  margin-top: 0;
  margin-right: 0px;
}

.logo h1 {
  text-indent: -999em;
}

.logo h1 a {
  display: block;
  width: 133px;
}

.nav>ul>li {
  margin-left: 0;
}

.nav>ul>.navlist:hover>a {
  color: var(--main-color);
}
.nav>ul>.navlist>a{
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.nav>ul>.navlist>a::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 3px;
  background: var(--main-color);
  transform: scale(0, 1);
  transition: all .4s;
}

.nav>ul>.navlist>a:hover::after {
  transform: scale(1, 1);
}

.nav>ul>li .iconfont {
  color: var(--main-sub-color);
  margin-left: 4px;
  margin-top: 4px;
  font-size: 12px;
  transition: all .3s;
}

.nav>ul>li:hover .iconfont {
  color: var(--main-color);
}

.nav .navActive>a {
  color: var(--main-color) !important;
}

.nav .navActive>a .iconfont {
  color: var(--main-color) !important;
}

.header-scrolled {
  box-shadow: var(--main-box-shadow);
  padding: 0 32px;
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.75);
  backdrop-filter: blur(8px);
  border: 1px solid #FFFFFF;
  top: 12px;
  width: 1400px;
  margin: auto;
}

.header-scrolled .nav {
  max-width: 600px;
}

.subnav {
  position: absolute;
  top: 80px;
  left: 0;
  right: 0;
  /* transform: translateX(-50%); */
  background: #fff;
  width: 1200px;
  border-radius: 30px;
  opacity: 0;
  box-shadow: 0 5px 10px rgba(0, 0, 0, .15);
  transform-origin: 0 0 0;
  transform: rotate3d(1, 0, 0, -90deg);
  transition: all .4s;
  z-index: 10;
  margin: auto;
  padding: 36px;
  box-sizing: border-box;
}

.subclass {
  color: var(--main-sub-color);
  margin-bottom: 12px;
}

.subnav>ul {
  align-items: flex-start;
}

.subnav>ul>li {
  position: relative;
  width: 32%;
}

.subnav>ul>li a {
  width: 100%;
  color: var(--main-tit-color);
  display: block;
  font-size: 16px;
  line-height: 1.2;
  height: auto;
  padding: 16px 12px;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  box-sizing: border-box;
  border-radius: 10px;
}

.subtit {
  font-weight: 500;
}

.subnav>ul>li a img {
  width: 24px;
  height: 24px;
  margin-right: 8px;
  margin-top: 3px;
}

.subtext {
  font-size: 14px;
  color: var(--main-sub-color);
  margin-top: 6px;
}
.has-topad{
  top: 60px;
}
.has-topad.header-scrolled{
  top: 12px;
}
.has-topad .subnav{
  /* top: 140px; */
}

.solutionNav>ul>li {
  width: 100%;
  margin-bottom: 20px;
}

.solutionNav .flex {
  flex-wrap: wrap;
  justify-content: flex-start;
}

.solutionNav>ul>li a {
  align-items: center;
  width: 20%;
  padding: 12px;
}

.solutionNav>ul>li a img,
.aboutNav>li a img {
  margin-top: 0;
}

.subnav>ul>li a:hover {
  background-color: #f5f6ff;
}
.aboutNavlist{
  position: relative;
}
.aboutNav {
  width: 180px;
  position: absolute;
  border-radius: 20px;
  padding: 16px;
}

.aboutNav>ul>li {
  width: 100%;
}

.aboutNav>ul>li a {
  align-items: center;
  padding: 12px;
}

.aboutNav .subtit,
.solutionNav .subtit {
  font-weight: normal;
}

.nav>ul>li:hover .subnav {
  transform: rotate3d(1, 0, 0, 0deg);
  opacity: 1;
}

.loginBtn {
  background: var(--main-color);
  color: #fff;
  padding: 10px 20px;
  border-radius: 10px;
  margin-left: 16px;
  transition: all .4s;
}

.loginBtn:hover {
  background: #0a4ecf;
  color: #fff !important;
}

.btn {
  background: var(--main-color);
  color: #fff;
  padding: 16px 50px;
  border-radius: 12px;
  transition: all .4s;
  display: block;
  width: 180px;
  box-sizing: border-box;
  text-align: center;
}

.btn:hover {
  background: #0a4ecf;
  color: #fff !important;
}

.bannerBtn {
  padding: 20px 50px;
  margin-top: 40px;
  border-radius: 14px;
}

.topSection {
  /* width: 200%; */
}

.bannerBox {
  width: 100%;
  height: 720px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  box-sizing: border-box;
}
.bannerBox>.flex{
  align-items: flex-start;
}
.bannerBox .text {
  width: 50%;
  line-height: 1.2 !important;
  padding-top: 20px;
}

.bannerBox .text h1 {
  font-size: 52px;
  font-weight: 500;
}

.bannerBox .text p {
  font-size: 20px;
  margin-top: 20px;
  color: var(--main-sub-color);
}

.bannerBox .img {
  width: 50%;
  position: relative;
  height: 440px;
  /* background: url('https://www-1300910993.cos.ap-shanghai.myqcloud.com/qsmweb_2026/images/bannerJXC@2x.png') no-repeat 0 0 / cover; */
}

.bannerBox .img img {
  object-fit: cover;
  position: absolute;
}

.bannerImgA01 {
  width: 278px;
  left: 33px;
  top: 44px;
}

.bannerImgA02 {
  width: 196px;
  right: 0;
  top: 0;
}

.bannerImgA03 {
  width: 512px;
  top: 85px;
  left: 125px;
  z-index: 3;
}

.bannerImgA04 {
  width: 325px;
  bottom: 0px;
  left: 0px;
  backdrop-filter: blur(10px);
  z-index: 4;
  filter: drop-shadow(2px 0 10px rgba(0, 78, 194, .1));
}

.bannerImgA05 {
  width: 158px;
  right: 8px;
  bottom: 0;
  z-index: 5;
}

.bannerImgA06 {
  width: 120px;
  top: 20px;
  left: 358px;
  z-index: 6;
  animation: floatUpDown 3s ease-in-out infinite;
}

.bannerImgA0A {
  width: 25px;
  top: 208px;
  left: 60px;
  animation: rotateUniform 2s linear infinite;
}

.bannerImgA0B {
  width: 200px;
  top: 120px;
  left: 0px;
}

.bannerImgB01 {
  width: 680px;
  left: 0;
  bottom: 0;
}

.bannerImgB02 {
  width: 25px;
  left: 448px;
  top: 90px;
  animation: rotateUniform 2s linear infinite;
}

.bannerImgB03 {
  width: 163px;
  left: 395px;
  top: 50px;
}

.bannerImgB04 {
  width: 460px;
  left: 32px;
  top: 123px;
}

.bannerImgB05 {
  width: 136px;
  left: 513px;
  top: 165px;
}

.bannerImgB06 {
  width: 72px;
  left: 0px;
  top: 328px;
  animation: floatUpDown 3s ease-in-out infinite;
}

.bannerImgB07 {
  width: 300px;
  left: 100px;
  top: 14px;
}

.bannerImgB08 {
  width: 120px;
  top: 0;
  right: 0;
  z-index: 8;
  animation: floatUpDown2 3s ease-in-out infinite;
}

.bannerImgC01 {
  width: 680px;
  left: 0;
  bottom: 0;
}

.bannerImgC02 {
  width: 388px;
  left: 69px;
  bottom: 0;
}

.bannerImgC03,
.bannerImgC04,
.bannerImgC05,
.bannerImgC06 {
  width: 166px;
  backdrop-filter: blur(10px);
  filter: drop-shadow(2px 0 10px rgba(0, 78, 194, .1));
}

.bannerImgC03 {
  left: 18px;
  top: 130px;

}

.bannerImgC04 {
  left: 18px;
  top: 220px;
}

.bannerImgC05 {
  left: 370px;
  top: 265px;
}

.bannerImgC06 {
  left: 370px;
  top: 350px;
}

.bannerImgC07 {
  width: 120px;
  top: 0px;
  right: 80px;
  animation: floatUpDown 3s ease-in-out infinite;
}

.bannerImgC08 {
  width: 220px;
  bottom: 0;
  right: 42px;
}

.bannerImgD01 {
  width: 602px;
  left: 40px;
  bottom: 0;
}

.bannerImgD02 {
  width: 520px;
  top: 40px;
  left: 56px;
}

.bannerImgD03 {
  width: 180px;
  left: 8px;
  top: 334px;
  animation: floatUpDown 2s ease-in-out infinite;
}

.bannerImgD04 {
  width: 192px;
  left: 430px;
  top: 122px;
}

.bannerImgD05 {
  width: 64px;
  top: 5px;
  right: 80px;
  animation: floatUpDown 3s ease-in-out infinite;
}

.bannerImgD02,
.bannerImgD03,
.bannerImgD04,
.bannerImgD05 {
  backdrop-filter: blur(10px);
  filter: drop-shadow(2px 0 10px rgba(0, 78, 194, .1));
}

/* 1. 定义上下浮动动画（使用 @keyframes 关键字） */
@keyframes floatUpDown {
  0% {
    /* 动画起始位置：默认位置（transform: translateY(0)） */
    transform: translateY(0);
  }

  50% {
    /* 动画中间位置：向下移动50px（正值向下，负值向上） */
    transform: translateY(16px);
  }

  100% {
    /* 动画结束位置：回到初始位置，形成循环 */
    transform: translateY(0);
  }
}

@keyframes floatUpDown2 {
  0% {
    /* 动画起始位置：默认位置（transform: translateY(0)） */
    transform: translateY(0);
  }

  50% {
    /* 动画中间位置：向下移动50px（正值向下，负值向上） */
    transform: translateY(-12px);
  }

  100% {
    /* 动画结束位置：回到初始位置，形成循环 */
    transform: translateY(0);
  }
}

/* 2. 定义匀速转圈动画（使用 @keyframes 关键字） */
@keyframes rotateUniform {
  0% {
    /* 动画起始角度：0度 */
    transform: rotate(0deg);
  }

  100% {
    /* 动画结束角度：360度（完整一圈），正值顺时针，负值逆时针 */
    transform: rotate(360deg);
  }
}

/* 动画元素默认状态（隐藏 + 初始位置 + 硬件加速） */
.animated-item {
  opacity: 0;
  transform: translateY(30px);
  transition: all 0.5s cubic-bezier(0.25, 0.1, 0.25, 1);
  /* margin: 15px 0; */
  will-change: opacity, transform;
}

/* 针对图片调整动画（可选，实现差异化动画效果） */
.animated-item.img-item {
  transform: translateX(30px);
  /* 图片从右侧滑入，与文字形成区分 */
}

/* 激活动画的类名（最终显示状态） */
.animated-item.active {
  opacity: 1;
  transform: translateY(0);
}

.mySwiperPC .swiper-slide {
  opacity: 0;
  transition: opacity 0.5s ease;
}

.mySwiperPC .swiper-pagination-bullet {
  position: relative;
  width: auto;
  height: auto;
  background: transparent;
  padding: 6px 12px;
  font-size: 14px;
  color: var(--main-tit-color);
  margin: 0 !important;
  border-radius: 4px;
  opacity: 0.65;
  overflow: hidden;
}

.mySwiperPC .swiper-pagination {
  position: absolute;
  left: 0;
  bottom: 124px;
  text-align: left;
}

.mySwiperPC .swiper-pagination-bullet-active {
  background: #fff;
  color: var(--main-tit-color);
  opacity: 1;
}

/* 底部边框进度条 - 每个长方形下方的边框（实际为内部绝对定位元素） */
.pagination-bullet-progress {
  position: absolute;
  left: 0;
  bottom: 0;
  /* 贴紧长方形底部，模拟边框效果 */
  width: 0%;
  /* 初始进度 0 */
  height: 2px;
  /* 进度条（边框）高度 */
  background-color: var(--main-color);
  /* 进度条颜色（与箭头、标题一致） */
  transition: width linear;
  /* 线性过渡，进度均匀推进 */
  border-radius: 1px;
  /* 与长方形圆角匹配 */
  z-index: 10;
}


.titleBox {
  text-align: center;
  margin-bottom: 60px;
}

.titleBox h2 {
  font-size: 42px;
  font-weight: 500;
  position: relative;
  line-height: 1.1;
}

.titleBox p {
  font-size: 16px;
  color: var(--main-sub-color);
  margin-top: 10px;
}

.productPage {
  margin: 0 0 150px;
}

.productL,
.productR {
  width: 49%;
  border-radius: 50px;
  background-color: #fff;
  box-sizing: border-box;
  transition: all .3s;
  margin-top: 12px;
}

.productL {
  padding: 40px 32px;
  box-shadow: 0px 0px 20px 0px rgba(0, 87, 255, 0.1);
  position: relative;
  border: 1px solid var(--main-color);
}

.productL::after {
  content: '热门';
  position: absolute;
  top: -26px;
  left: -0px;
  width: calc(100% + 0px);
  height: 100%;
  background-color: var(--main-color);
  z-index: -1;
  border-radius: 50px;
  text-align: center;
  color: #fff;
  font-size: 15px;
  line-height: 26px;
}

.proImg {
  width: 86%;
  margin: 20px auto 0;
}

.proImg img {
  width: 100%;
  filter: drop-shadow(0px 0px 20px rgba(0, 87, 255, 0.1));
}

.proTit {
  font-size: 32px;
  font-weight: 500;
}

.proSub {
  font-size: 16px;
  color: var(--main-sub-color);
  margin-top: 12px;
}

.porItem {
  flex-wrap: wrap;
  margin-top: 16px;
}

.porItem li {
  width: 49%;
  margin-bottom: 2%;
  border-radius: 10px;
  border: 1px solid #E8EBF3;
  box-sizing: border-box;
  transition: all .3s;
}

.porItem li:last-of-type {
  width: 100%;
  background: linear-gradient(90deg, #218CFA 26%, #E536DB 61%, #FF7530 100%), rgba(255, 255, 255, 0.95);
  border: none;
}

.porItem li:last-of-type a {
  background: linear-gradient(0deg, rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0.95)), linear-gradient(90deg, #03F9E1 0%, #0B6AFE 24%, #FF5293 70%, #FFD647 100%);
  border: 1px solid transparent;
  margin: 1px;
  border-radius: 9px;
  width: calc(100% - 2px);
}

.porItem li:hover {
  box-shadow: 0px 0px 20px 0px rgba(0, 87, 255, 0.1);
  border-color: var(--main-color);
}

.porItem li:hover .arrow {
  color: var(--main-color);
}

.porItem .l {
  justify-content: flex-start;
}

.porItem a {
  padding: 14px 18px;
  box-sizing: border-box;
}

.porItem a img {
  width: 42px;
  height: 42px;
}

.porItem .text {
  margin-left: 10px;
}

.porItem .text h3 {
  font-size: 18px;
  color: var(--main-tit-color);
}

.porItem .text p {
  font-size: 14px;
  color: var(--main-sub-color);
}

.porItem .arrow {
  display: block;
  transform: rotate(90deg);
  width: 16px;
  color: #d0d3da;
  transition: all .3s;
}

.productR .l {
  width: 50%;
}

.productR a {
  width: 100%;
  margin-bottom: 3.5%;
  border-radius: 50px;
  box-shadow: 0px 0px 20px 0px rgba(0, 87, 255, 0.1);
  box-sizing: border-box;
  transition: all .3s;
  padding: 32px;
}

.productR a:last-child {
  margin-bottom: 0;
}

.productR .proImg {
  width: 40%;
  margin: 18px 10px;
}

.productR .proTit {
  color: var(--main-tit-color);
}

.productR a:hover,
.productL:hover {
  box-shadow: 0px 4px 20px 0px rgba(0, 87, 255, 0.20);
}

.solution {
  align-items: flex-start;
}

.solutionL {
  width: 250px;
  height: 628px;
  border-radius: 30px;
  background: url("https://www-1300910993.cos.ap-shanghai.myqcloud.com/qsmweb_2026/images/solutionBgLeft@2x.jpg") no-repeat center;
  background-size: cover;
  padding-top: 32px;
  box-sizing: border-box;

}

.solutionL li {
  justify-content: flex-start;
  padding: 24px 24px;
  box-sizing: border-box;
  font-size: 18px;
  position: relative;
  cursor: default;
}

.solutionL li img {
  width: 24px;
  height: 24px;
  margin-right: 10px;
}

.solutionL li.active {
  background: rgba(255, 255, 255, .65) url("https://www-1300910993.cos.ap-shanghai.myqcloud.com/qsmweb_2026/images/carddecorate@3x.png") no-repeat bottom right;
  background-position-x: 172px;
  background-size: 64px auto;
  transition: none;
}

.solutionL li.active::after {
  content: '';
  position: absolute;
  top: 25%;
  left: 0;
  bottom: 0;
  width: 3px;
  height: 50%;
  background: var(--main-color);
  border-radius: 0 3px 3px 0;

}

.solutionR {
  width: calc(100% - 270px);
}
.solutionSwiper{
  overflow: hidden;
  border-radius: 30px 100px 30px 30px;
}
.solutionMain {
  background: url("https://www-1300910993.cos.ap-shanghai.myqcloud.com/qsmweb_2026/images/solutionBgMain@2x.jpg") no-repeat center;
  background-size: cover;
  height: 490px;
  border-radius: 30px 100px 30px 30px;
  box-sizing: border-box;
  padding: 90px 60px;
}

.solutionKefu {
  height: 120px;
  background: url("https://www-1300910993.cos.ap-shanghai.myqcloud.com/qsmweb_2026/images/solutionBgKefu@2x.jpg") no-repeat center;
  background-size: cover;
  border-radius: 30px;
  margin-top: 18px;
  padding: 12px 60px;
  box-sizing: border-box;
  position: relative;
  overflow: hidden;
}
.solutionKefu>canvas{
  transform: scale(1.02);
}
.solutionMainL {
  width: 50%;
}

.solutionMainR {
  width: 45%;
}

.solutionMainL h3 {
  font-size: 36px;
}

.solutionMainL p {
  margin: 36px 0 30px;
  color: var(--main-sub-color);
}

.solutionMainR img {
  width: 100%;
  max-width: 470px;
}

.btnbox {
  justify-content: flex-start;
}

.btnbox .downbtn {
  background: transparent;
  box-shadow: inset 0 0 0 1px var(--main-color);
  color: var(--main-color) !important;
  box-sizing: border-box;
  margin-left: 12px;
}

.btnbox .downbtn:hover {
  background: #fff;
  box-shadow: inset 0 0 0 1px #fff;
}
.KefuL,.KefuR{
  position: relative;
  z-index: 1;
}
.KefuL {
  justify-content: flex-start;
  width: auto;
}

.KefuL img {
  height: 100%;
  max-height: 100px;
  margin-right: 16px;
}

.kefutext h4 {
  font-size: 24px;
  font-weight: 500;
}

.kefutext p {
  color: var(--main-sub-color);
}

.case {
  position: relative;
  padding-top: 180px;
  padding-bottom: 20px;
  overflow: hidden;
}

.case li {
  width: 15%;
  background: #fff;
  border-radius: 50px;
  box-shadow: 0px 4px 20px 0px rgba(0, 87, 255, 0.1);
  padding: 24px 20px 0;
  position: relative;
  box-sizing: border-box;
}

.caseHead img {
  width: 56px;
  height: 56px;
  border-radius: 10px;
}

.casetop {
  text-align: center;
  font-size: 14px;
  color: var(--main-sub-color);
}

.casetop h4 {
  font-size: 20px;
  font-weight: 500;
  color: var(--main-tit-color);
}

.casesub>span {
  margin-left: 10px;
}

.casetop .star {
  margin: 16px 0 24px;
  justify-content: center;
}

.casetop .star img {
  margin-right: 4px;
}

.speech {
  margin-bottom: 16px;
  color: #4E5461;
  height: 200px;
  overflow: hidden auto;
}

.speech::-webkit-scrollbar {
  width: 4px;
}

.speech::-webkit-scrollbar-thumb {
  background: #DBDEE5;
  border-radius: 10px;
}

.hangye {
  text-align: center;
  padding: 12px 0;
  border-top: 1px solid #DBDEE5;
}

.douhao {
  position: absolute;
  top: 20px;
  right: 20px;
  width: 56px;
}

.douhao img {
  width: 100%;
}

.caseBg {
  position: absolute;
  top: 60px;
  left: 0;
  width: 52%;
  height: 66%;
  background: #427FF4;
  border-radius: 0 100px 50px 0;
}

.sanjiao,
.yuanxing {
  position: absolute;
  top: -100px;
  left: 20%;
}

.yuanxing {
  top: 40px;
  left: 65%;
}

.casebtn {
  position: absolute;
  top: 60px;
  left: 0;
  right: 0;
  background-color: #ccc;
  z-index: 1;
}
.solutionPage .casebtn{
  top: 440px;
  right: 60px;
}

.casePage .swiper-button-next,
.casePage .swiper-button-prev,
.solutionPage .swiper-button-next,
.solutionPage .swiper-button-prev,
.aboutZhuanli .swiper-button-next,
.aboutZhuanli .swiper-button-prev {
  top: -0;
  right: 0%;
  left: auto;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: #EBF3FF;
  color: var(--main-tit-color);
  transition: all .3s ease-in-out;
}

.casePage .swiper-button-next:after,
.casePage .swiper-button-prev:after,
.solutionPage .swiper-button-next:after,
.solutionPage .swiper-button-prev:after,
.aboutZhuanli .swiper-button-next:after,
.aboutZhuanli .swiper-button-prev:after {
  font-size: 16px;
  font-weight: bold;
}

.casePage .swiper-button-prev,
.solutionPage .swiper-button-prev {
  right: 60px;
}

.casePage .swiper-button-next:hover,
.casePage .swiper-button-prev:hover,
.solutionPage .swiper-button-next:hover,
.solutionPage .swiper-button-prev:hover,
.aboutZhuanli .swiper-button-next:hover,
.aboutZhuanli .swiper-button-prev:hover {
  background: var(--main-color);
  color: #fff;
}


.service {
  text-align: center;
}

.service a {
  width: 24%;
  border-radius: 50px;
  padding: 24px 0;
  box-sizing: border-box;
  transition: all .3s;
}

.service img {
  width: 80px;
  height: 80px;
}

.service h4 {
  font-size: 24px;
  color: var(--main-tit-color);
  font-weight: 500;
  margin: 12px 0 6px;
}

.service p {
  color: var(--main-sub-color);
}

.service a:hover {
  background: #F5F6FF;
}

.honorPage {
  background: #f5f6ff;
  padding: 120px 0;
  width: calc(100% - 80px);
  border-radius: 80px;
  margin: 0 auto;
  overflow: hidden;
  text-align: center;
  margin-top: 150px;
}

.honor {
  margin-bottom: 80px;
}

.honor li {
  width: 24%;
}

.honor li h4 span{
  font-size: 36px;
  font-weight: 600;
}

.honor li h4 {
  font-size: 14px;
  font-weight: 400;
}

.honor li p {
  color: var(--main-sub-color);
}

.honorWrapper{
  position: relative;
  overflow: hidden;
  height: 110px;
}
.honorWrapper ul {
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  /* 初始动画时长，后续会被JS动态覆盖 */
  animation: marquee linear infinite;
}

/* 鼠标悬停暂停动画 */
.honorWrapper:hover ul {
  animation-play-state: paused;
}

.honorWrapper li {
  position: relative;
  border-radius: 30px;
  padding: 12px;
  box-sizing: border-box;
  height: 110px;
  justify-content: center;
  transition: all .3s ease-in-out;
  flex: 0 0 auto;
  width: 272px;
  margin-right: 10px;
  /* background: #fff; */
}

.honorWrapper li img {
  display: block;
  height: 80px;
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  margin: 0 auto;
  transform: translateY(-50%);
}

.honorText {
  width: 72%;
  line-height: 1.2;
}

.honorText h4 {
  font-size: 18px;
  font-weight: 400;
}

.honorText p {
  color: var(--main-sub-color);
  margin-top: 4px;
}

/* 核心动画：位移实现滚动 */
@keyframes marquee {
  0% {
      transform: translateX(0);
  }
  100% {
      /* 位移距离 = 负的原始内容总宽度（克隆后总宽度的一半） */
      transform: translateX(-50%);
  }
}
/* 响应式适配 */
@media (max-width: 768px) {
  .marquee-item {
      flex: 0 0 200px; /* 小屏幕缩小轮播项宽度 */
  }
}

.partnerImg{
  width: 16%;
  background: #fff;
  border-radius: 30px;
  box-sizing: border-box;
  padding: 20px 24px;
  transition: all .3s ease-in-out;
  margin-bottom: 150px;
}
.partnerImg img{
  width: 100%;
}

.partnerImg:hover{
  background: #F5F6FF;
}

.kefuPage{
  background: url("https://www-1300910993.cos.ap-shanghai.myqcloud.com/qsmweb_2026/images/kefuBg@2x.jpg") no-repeat center / cover;
  border-radius: 80px 80px 0px 0px;
  overflow: hidden;
}
.kefuPage canvas{
  object-fit: cover;
  height: 100%!important;
}
.kefu{
  position: relative;
  z-index: 1;
}
.kefuL{
  width: 80%;
  padding-bottom: 80px;
}

.kefuL .kefutit{
  font-size: 36px;
  font-weight: 500;
  margin-bottom: 36px;
}

.kefuR{
  width: 360px;
  margin: 36px 0 80px;
}
.kefuR img{
  width: 100%;
}

.footer{
  background: url("https://www-1300910993.cos.ap-shanghai.myqcloud.com/qsmweb_2026/images/footBg@2x.jpg") no-repeat center / cover;
  border-radius: 80px 80px 0px 0px;
  padding-top: 80px;
  /* transform: translateY(-80px); */
  margin-top: -80px;
  position: relative;
}
.footerTop,.ftNav{
  align-items: flex-start;
}
.ftLogo{
  width: 20%;
}
.ftTel{
  margin-top: 50px;
}
.ftTel p{
  color: var(--main-sub-color);
  font-size: 14px;
}
.ftTel .ftNumber{
  font-size: 24px;
  font-weight: 500;
  color: var(--main-tit-color);
}
.ftLogo .QRewm{
  width: 130px;
  overflow: hidden;
  text-align: center;
  margin-top: 16px;
}
.QRewmText{
  color: var(--main-sub-color);
  text-align: center;
}
.ftLogo .QRewmImg{
  width: 100%;
  border-radius: 10px;
}

.ftNav{
  width: 70%;
}

.ftNav dt{
  font-weight: 500;
  font-size: 18px;
  margin-bottom: 24px;
}
.ftNav dd{
  line-height: 2;
}

.link{
  font-size: 14px;
  color: var(--main-sub-color);
  margin: 65px 0 30px;
  text-align: center;
}
.link a{
  color: var(--main-sub-color);
  margin-right: 6px;
}
.company{
  font-size: 14px;
  color: var(--main-sub-color);
  padding: 30px;
  text-align: center;
  border-top: 1px solid #d0d2d7;
}
.company h1{
  display: inline;
  font-size: 14px;
}
.company a{
  color: var(--main-sub-color);
}

.rightKF{
  position: fixed;
  right: 10px;
  bottom: 2%;
  text-align: center;
  font-size: 12px;
  background: rgba(255, 255, 255, 0.65);
  box-shadow: 0px 0px 15px 0px rgba(29, 81, 251, 0.1);
  padding: 10px 8px;
  border-radius: 60px;
  z-index: 10;
  backdrop-filter: blur(8px);
}
.KFitem{
  display: block;
  margin: 12px 0;
  cursor: pointer;
  transition: all .3s;
  position: relative;
}
.KFitem .iconfont{
  font-size: 24px;
}
.KFitem:hover{
  color: var(--main-color);
}
#gotop{
  overflow: hidden;
  height: 0;
}
.KFhover{
  position: absolute;
  top: 0;
  right: 62px;
  white-space: nowrap;
  background: #fff;
  border-radius: 20px;
  box-shadow: 0px 0px 15px 0px rgba(29, 81, 251, 0.1);
  transition: all .3s;
  text-align: left;
  width: 0;
  overflow: hidden;
  background: url("https://www-1300910993.cos.ap-shanghai.myqcloud.com/qsmweb_2026/images/bannerBg@2x.jpg") no-repeat top left / cover;
}
.KFhover>.flex{
  box-sizing: border-box;
  padding: 20px;
}
.KFhover img{
  width: 100%;
}
.KFhover .ewm{
  width: 100px;
}
.KFhover p{
  font-size: 18px;
  font-weight: 500;
  margin-bottom: 8px;
  color: var(--main-tit-color);
}
.KFhover span{
  font-size: 14px;
  color: var(--main-sub-color);
}

.KFitem:hover .KFhover{
  width: 300px;
}
.KFitem:hover .KFtel{
  width: 200px;
}
.KFtel .ewmtext p{
  font-size: 16px;
  color: var(--main-sub-color);
  margin-bottom: 0;
}
.KFtel .ewmtext span{
  font-size: 20px;
  color: var(--main-tit-color);
  font-weight: 500;
}

.menu,.nav .btnbox{
  display: none;
}




/* 内页样式-下载页 */
.xzTopBanner{
  width: 100%;
  height: 450px;
  background: url('https://www-1300910993.cos.ap-shanghai.myqcloud.com/qsmweb_2026/images/xzBannerBJ@2x.jpg') no-repeat center / cover;
  margin-top: -77px;
  text-align: center;
}
.xzTopBanner .xzTop{
  padding-top: 130px;
}
.xzTop h2{
  font-size: 36px;
  color: var(--main-tit-color);
  margin-bottom: 10px;
  font-weight: 500;
  line-height: 1.2;
}
.xzTop p{
  color: var(--main-sub-color);
}
.xzTabBox{
  background: #fff;
  border-radius: 50px 50px 0 0;
  margin-top: -80px;
}
.xzTags{
  display: flex;
  justify-content: center;
  align-items: center;
}
.xzTags li{
  padding: 20px 50px;
  border-radius: 30px 30px 0 0;
  font-size: 20px;
  margin: -70px 20px 0;
  position: relative;
  cursor: default;
  transition: 0s;
  text-align: center;
}
.newsTabBox .xzTags li{
  padding: 0;
}
.newsTabBox .xzTags li a{
  padding: 20px 50px;
  display: block;
}
.xzTags li.active{
  background: #fff;
  font-weight: 500;
}
.xzTags li.active::before,.xzTags li.active::after{
  content: '';
  display: block;
  position: absolute;
  bottom: 0;
  left: -15px;
  width: 15px;
  height: 15px;
  background: url('https://www-1300910993.cos.ap-shanghai.myqcloud.com/qsmweb_2026/images/xzjiaoL.svg') no-repeat center / cover;
  border-radius: 30px 30px 0 0;
}
.xzTags li.active::after{
  background: url('https://www-1300910993.cos.ap-shanghai.myqcloud.com/qsmweb_2026/images/xzjiaoR.svg') no-repeat center / cover;
  left: auto;
  right: -15px;
}
.xzList{
  justify-content: center;
  gap: 20px;
  margin: 72px 0 100px;

}
.xzMain{
  display: none;
  opacity: 0;
}
.xzMain.active{
  display: block;
  opacity: 1;
}
.xzList .xzItem{
  border: 1px solid #E7F0FF;
  border-radius: 30px;
  text-align: center;
  flex: 1;
  max-width: 180px;
  width: 180px;
  height: 180px;
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0s;
  box-shadow: 0px 9.16px 73.28px 0px rgba(220, 233, 249, 0.5);
}
.xzList .ewmBtn{
  position: absolute;
  top: 0;
  right: 0;
  width: 60px;
  transform-origin: top right;
}
.xzList .xzIcon{
  width: 64px;
  height: 64px;
  margin-bottom: 10px;
}
.xzItem p{
  font-size: 16px;
}
.xzHover{
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: linear-gradient(135deg, #679BFF 0%, #1D69FB 44%);
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  opacity: 0;
  transition: all 0.3s;
  overflow: hidden;
}
.xzHover img{
  width: 60%;
  border-radius: 10px;
  margin-bottom: 10px;
  transform: scale(0.5);
}
.xzHover .xzDown{
  width: 64px;
  height: 64px;
}
.xzHover p{
  font-size: 16px;
  transform: scale(0.5);
}

.xzItem:hover .xzHover{
  opacity: 1;
}
.xzItem:hover .xzHover img,
.xzItem:hover .xzHover p{
  transform: scale(1);
}
.xzItem:hover .xzIcon,
.xzItem:hover p,
.xzItem:hover .ewmBtn{
  transform: scale(0);
}
.upgradeLog h4{
  font-size: 36px;
  font-weight: 500;
}
.logCon{
  border-radius: 30px;
  border: 1px solid #dde7f9;
  padding: 36px;
  box-sizing: border-box;
  margin: 24px 0 80px;
}
.logtop{
  font-size: 28px;
  font-weight: 500;
  margin-bottom: 16px;
}
.logmain{
  font-size: 16px;
  margin-bottom: 24px;
}
.logmain>p{
  margin-bottom:8px;
}
.logCon>a{
  color: var(--main-color);
}
.xzList_M a{
  display: none;
  justify-content: center;
  align-items: center;
  width: 80%;
  background: linear-gradient(180deg, #1D69FB 0%, #61A1FF 100%);
  text-align: center;
  border-radius: 16px;
  margin: 24px auto 50px;
  color: #fff;
  padding: 8px 0;
  font-size: 20px;
  box-shadow: 0 12px 16px rgba(0,108,248,.34);
}
.xzList_M a .iconfont{
  font-size: 42px;
  margin-right: 6px;
}

/* 内页样式-购买 */
.gmTopBanner{
  background: url('https://www-1300910993.cos.ap-shanghai.myqcloud.com/qsmweb_2026/images/gmBannerBJ@2x.jpg') no-repeat center / cover;
  height: 480px;
}
.gmList .gmItem{
  max-width: 320px;
  min-height: 700px;
  height: auto;
  display: block;
  text-align: left;
  padding: 40px 24px;
  box-sizing: border-box;
  cursor: default;
  box-shadow: 0px 10px 80px 0px rgba(220, 233, 249, 0.5);
  background: linear-gradient(180deg, #EAF1FF 0%, #FFFFFF 22%);
}
.gmList .gmItem.kx{
  background: linear-gradient(180deg, #EAFFF8 0%, #FFFFFF 22%);
}
.gmList .gmItem.fz{
  background: linear-gradient(180deg, #F0EAFF 0%, #FFFFFF 22%);
}
.gmList .gmItem.wjjc{
  background: linear-gradient(180deg, #FFF3EA 0%, #FFFFFF 22%);
}
.gmList .gmItem.erp{
  background: linear-gradient(180deg, #E9E9FF 0%, #FFFFFF 22%);
}
.gmItem h3{
  font-size: 24px;
  font-weight: 500;
}
.gmItem .sub{
  font-size: 14px;
  color: var(--main-sub-color);
}
.gmItem .price{
  font-size: 42px;
  font-weight: 500;
}
.gmItem .price span{
  font-size: 16px;
  font-weight: 400;
}
.gmItem .buyBtn{
  margin: 32px 0 40px;
}
.gmItem .line{
  width: 100%;
  height: 1px;
  background: #DBE5F7;
  margin-bottom: 40px;
}
.gmItem dt{
  font-weight: 500;
}
.gmItem dd{
  margin-top: 8px;
}
.gmItem dd span{
  font-size: 12px;
  margin-right: 8px;
}
.version{
  border: 1px solid #DBE5F7;
  border-radius: 30px;
  margin: 40px auto 80px;

}
#tab3 .version{
  width: 60%;
}
.version ul li{
  width: 20%;
  display: flex;
  justify-content: center;
  flex-direction: column;
  box-sizing: border-box;
  border-right: 1px solid #DBE5F7;
  flex: 1;

}
.version ul li:first-child{
  padding-left: 16px;
  text-align: left;
}
.version ul li:last-child{
  border-right: none;
}
.version .verTop{
  position: sticky;
  top: 70px;
  z-index: 1;
  border-bottom: 2px solid #F3F4F9;
}
.version .verTop li{
  width: 20%;
  height: 140px;
  background: #fff;
}
.version .verTop li:first-child{
  border-radius: 30px 0 0 0;
}
.version .verTop li:last-child{
  border-radius: 0 30px 0 0;
}

.version .verTop li p{
  font-size: 20px;
  font-weight: 500;
}
.version .buyBtn{
  margin: 0 auto;
  width: 100px;
  padding: 0;
  line-height: 32px;
  font-size: 14px;
  border-radius: 50px;
  margin-top: 8px;
}
.tabTit{
  width: 100%;
  background: #F3F4F9;
  justify-content: flex-start;
  padding: 16px;
  font-size: 18px;
  border-bottom: 1px solid #fff;
  box-sizing: border-box;
}
.tabTit img{
  width: 20px;
  height: 20px;
  margin-right: 8px;
}
.tabTit span{
  margin: 3px 0 0 8px;
  color: var(--main-sub-color);
}
.tabTit.active span{
  transform: rotate(180deg);
}
.version .verMain li{
  height: 48px;
  text-align: center;
}
.version .verMain li>.iconfont{
  font-size: 16px;
  font-weight: bold;
  color: var(--main-color);
}
.version .verMain li>.icon-times{
  color: rgba(10, 26, 71, 0.25);
}


.version .verMain:hover{
  background: #e9efff;
}
.verMainList{
  overflow: hidden;
}
.version .mainBox:last-child{
  overflow: hidden;
  border-radius: 0% 0% 30px 30px;

}

.buyBox{
  width: 100%;
  background: #F4F5FF;
  margin-top: -76px;
  padding-top: 56px;
  padding-bottom: 180px;
}
.buyTit{
  font-size: 36px;
  font-weight: 500;
  margin: 80px 0 20px;
}
.buyL,
.buyR{
  background: #fff;
  border-radius: 30px;
  height: 800px;
  padding: 28px;
  box-sizing: border-box;
}
.buyL{
  width: 70%;
}
.buyR{
  width: 26%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  /* align-items: flex-start; */
}
.buyTit2{
  font-size: 24px;
  font-weight: 500;
}
.buyLine{
  width: 100%;
  height: 1px;
  background: #DBDEE5;
  margin: 24px 0;
}
.buySubtit{
  font-size: 20px;
  margin-bottom: 12px;
}
/* 自定义下拉菜单的代码 */
.select-mock {
  width: 100%;
  position: relative;
  font-size: 16px;
  margin: 12px 0;
}
.select-mock__trigger {
  height: 56px;
  line-height: 56px;
  padding: 0 16px;
  border: 1px solid #DBDEE5;
  border-radius: 15px;
  background-color: #fff;
  cursor: pointer;
  box-sizing: border-box;
}
.select-mock__icon {
  font-size: 14px;
  color: var(--main-sub-color);
}
.select-mock__icon.active {
  transform: rotate(180deg);
}
.select-mock__options {
  position: absolute;
  top: 60px;
  left: 0;
  right: 0;
  border: 1px solid transparent;
  border-radius: 15px;
  background-color: #fff;
  padding: 0;
  margin: 0;
  max-height: 360px;
  overflow-y: auto;
  height: 0;
  z-index: 100;
  transition: all 0.2s ease-in-out;
  box-shadow: 0px 16px 50px 0px rgba(220, 233, 249, 0.65);
}
.select-mock__options.show {
  height: 360px;
  border: 1px solid #DBDEE5;
}
.select-mock__option {
  padding: 0 16px;
  height: 44px;
  line-height: 44px;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
}
.select-mock__option:hover {
  background-color: #E6E8EB;
}
.select-mock__option.active {
  font-weight: bold;
  color: var(--main-color);
}
.select-mock__options::-webkit-scrollbar {
  width: 6px;
}
.select-mock__options::-webkit-scrollbar-thumb {
  background-color: #E6E8EB;
  border-radius: 3px;
}
.buyNote{
  font-size: 14px;
  color: var(--main-sub-color);
  margin-bottom: 24px;
}
.buyPrice{
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 16px;
}
.buyPrice li{
  width: 31.5%;
  border: 1.5px solid #EAECF0;
  border-radius: 15px;
  box-sizing: border-box;
  background: #E8EBF3;
  position: relative;
  overflow: hidden;
  cursor: default;
}
.buyPriceTop{
  background: #fff;
  border-radius: 15px;
  padding: 16px 16px 12px 16px;
}
.buyPriceNum span{
  font-weight: bold;
  font-size: 36px;
}
.buyPriceNote{
  font-size: 14px;
}
.buyPriceNote .orig{
  color: var(--main-sub-color);
  text-decoration: line-through;
}

.buyPriceNote .save{
  color: var(--main-color);
  background: rgba(29, 105, 251, 0.1);
  border-radius: 20px;
  padding: 2px 6px;
  display: none;
}
.buyYear{
  font-size: 18px;
}
.buyFree{
  position: absolute;
  top: 12px;
  right: 12px;
  height: 20px;
  display: none;
}
.buyPrice li.active .buyPriceNote .save{
  display: inline-block;
}
.buyPrice li.active .buyFree{
  display: block;
}
.buyPrice li.active{
  border: 1.5px solid var(--main-color);
}
.buyPrice li.active .buyPriceTop{
  background: linear-gradient(180deg, #E9F0FF 0%, #FFFFFF 49%);
}
.buyPriceText{
  text-align: center;
  font-size: 14px;
  color: var(--main-sub-color);
  padding: 6px 0;
}
.buyPrice li.buykefu{
  background: linear-gradient(180deg, #E9F0FF 0%, #FFFFFF 49%);
  text-align: center;
  padding: 11px;
}
.buykefuImg{
  width: 48px;
  height: 48px;
  background: #fff;
  border-radius: 50%;
}
.buybtn{
  color: var(--main-color);
  background: rgba(29, 105, 251, 0.1);
  width: 60%;
  padding: 6px 0;
  font-size: 16px;
  margin: auto;
  border-radius: 50px;
}
.buykefu .buyPriceText{
  color: var(--main-tit-color);
  font-size: 15px;
}
.buyPrice li:hover{
  border-color: var(--main-color);
}
.buyNote2{
  padding: 10px 20px;
  background: rgba(29, 105, 251, 0.1);
  border-radius: 15px;
  margin-top: 24px;
}
.buyNote2 .iconfont{
  color: var(--main-color);
  margin-right: 4px;
}
.buyOrderText{
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}
.line-through{
  text-decoration: line-through;
}
.buyOrderText .coupon{
  color: var(--main-color);
}
.buyOrderText .iconfont{
  color: var(--main-sub-color);
}
.buyOrderBott{
  width: 100%;
  margin: 0 auto;
  text-align: center;
  position: sticky;
  bottom: 0;
  left: 0;
  background: #fff;
}
.buyOrderPrice{
  /* align-items: flex-end; */
}
.buyOrderBott .buyPriceNum{
  text-align: right;
  margin-bottom: 10px;
}
.buyOrderBott .btn{
  width: 100%;
  padding: 16px 0;
}

/* 内页样式-联系 */
.lianxi{
  margin: 60px auto 100px;
}
.lianxiContainer{
  background: #F5F6FF;
  height: auto;
}
.lianxi .item{
  background: #fff;
  border-radius: 30px;
  box-shadow: 0px 9px 73px 0px rgba(220, 233, 249, 0.5);
  width: 31.5%;
  box-sizing: border-box;
  padding: 50px 30px;
}
.lianxi .item img{
  width: 67%;
}
.lianxi .itemText{
  font-size: 30px;
  font-weight: 500;
  line-height: 1.2;
  margin: 6px 0 40px;
}
.lianxi .item:last-child .itemText{
  font-size: 24px;
}
.lianxi .item:last-child img{
  width: 100%;
}

/* 内页样式-关于 */
.aboutTopBanner{
  background: url('https://www-1300910993.cos.ap-shanghai.myqcloud.com/qsmweb_2026/images/aboutBannerBg@2x.jpg') no-repeat center / cover;
  border-radius: 0 0 0 0;
  overflow: hidden;
  height: 550px;
}
.aboutTopBanner .xzTop img{
  width: 400px;
  margin-bottom: 16px;
}
.aboutIntroduction{
  padding: 100px 0 150px;
  position: relative;
}
.aboutIntroduction::before{
  content: '';
  position: absolute;
  width: 360px;
  height: 360px;
  background: #F4F5FF;
  top: 60px;
  left: -250px;
  border-radius: 50%;
}
.aboutTitBox{
  width: 100%;
  font-size: 40px;
  font-weight: 500;
  margin-bottom: 56px;
}
.aboutConBox{
  width: 100%;
}
.aboutConBox>p{
  margin-bottom: 12px;
  line-height: 1.8;
}
.aboutIntroduction .aboutTitBox{
  width: 40%;
}
.aboutIntroduction .aboutConBox{
  width: 55%;
  font-size: 18px;
}
.aboutTitBox .nr{
  font-size: 16px;
  color: var(--main-sub-color);
  margin-top: 16px;
}
.aboutTitBox .tit{
  position: relative;
}
.aboutTitBox .tit::after{
  content: '';
  position: absolute;
  width: 100%;
  height: 15px;
  background: rgba(29, 105, 251, .2);
  bottom: 4px;
  left: 0;
}
.aboutDec1{
  position: absolute;
  right: 60px;
  bottom: 0;
  width: 500px;
}
.aboutProduct{
  padding: 50px 0 100px;
}
.aboutProductBox{
  width: 100%;
  text-align: center;
  /* gap: 8%; */
}
.aboutProductBox li{
  position: relative;
  width: 200px;
  height: 200px;
  padding: 20px 10px;
  border-radius: 30px;
  background: linear-gradient(0deg, #FFFFFF, #FFFFFF), linear-gradient(180deg, #EAF1FF 0%, #FFFFFF 22%);
  box-sizing: border-box;
  border: 1px solid #E7F0FF;
  box-shadow: 0px 9.16px 73.28px 0px rgba(220, 233, 249, 0.5);
  overflow: hidden;
  flex-wrap: wrap;
  justify-content: center;
}
.aboutProductBox .mc{
  position: absolute;
  top: -200px;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, #679BFF 0%, #1D69FB 44%);
  color: #fff;
  padding: 20px 12px;
  box-sizing: border-box;
  transition: all .3s;
  font-size: 14px;
}
.aboutProductBox li:hover .mc{
  top: 0;
}
.aboutProductBox .productTit{
  font-size: 18px;
  margin-top: 12px;
}
.aboutProductBox .productImg{
  width: 72px;
  height: 72px;
}

.aboutTeams{
  width: 100%;
  background: #F4F5FF;
  border-radius: 0px 200px 0px 200px;
  padding: 100px 0;
}
.rongyu{
  padding: 150px 0;
}
.rongyu .aboutConBox{
  width: 45%;
}
.rongyu .aboutDec2{
  position: absolute;
  bottom: 19%;
  right: 40%;
  width: 250px;
  z-index: -1;
}
.aboutZhuanli{
  padding: 0 0 0px;
}
.Swiper-Zhuanli{
  overflow: hidden;
}
.Swiper-Zhuanli ul{
  padding: 0 0 50px;
  box-sizing: border-box;
}
.Swiper-Zhuanli li{
  background: linear-gradient(180deg, #EAF1FF 0%, #FFFFFF 22%);
  box-sizing: border-box;
  border: 1px solid #E7F0FF;
  box-shadow: 0px 4px 30px 0px rgba(220, 233, 249, 0.4);
  padding: 24px;
  border-radius: 30px;
  height: 190px;
  overflow: auto;
}
.aboutZhuanli .swiper-button-prev{
  left: 10px;
  top: 30px;
}
.aboutZhuanli .swiper-button-next{
  top: 30px;
  right: 10px;
}
.aboutPartner{
  background: url('https://www-1300910993.cos.ap-shanghai.myqcloud.com/qsmweb_2026/images/aboutBottomBg@2x.png') no-repeat center top / cover;
  padding: 150px 0 100px;
}

.newsTopBanner{
  background: url('https://www-1300910993.cos.ap-shanghai.myqcloud.com/qsmweb_2026/images/newsBannerBJ@2x.jpg') no-repeat center / cover;
}
.taps1{
  background: #1D69FB;
}
.taps2{
  background: #2BC275;
}
.taps3{
  background: #FF9800;
}
.newsIcon{
  width: 100%;
  max-height: 255px;
  min-height: 200px;
}
/* 图片容器默认隐藏，防止裂图 */
.newsList .item .newsIcon {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease;
}
/* 图片加载完成后显示 */
.newsList .item .newsIcon.loaded {
  opacity: 1;
  visibility: visible;
}
.newsList{
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 20px;
  padding: 80px 0 100px;
}
.newsList .item{
  width: 32%;
  border: 1px solid #E7F0FF;
  box-sizing: border-box;
  box-shadow: 0px 10px 50px 0px rgba(220, 233, 249, 0.5);
  border-radius: 30px;
  overflow: hidden;
}
.newsSub{
  flex-wrap: wrap;
  padding: 24px 16px;
  box-sizing: border-box;
  height: 165px;
}
.newsSub>h4{
  width: 100%;
  margin-bottom: 24px;
  font-size: 20px;
}
.newsTaps{
  border-radius: 5px;
  font-size: 14px;
  color: #fff;
  padding: 4px 8px;
}
.newsList .item:hover{
  box-shadow: 0px 10px 50px 0px rgba(177, 203, 235, 0.5);
  transform: translateY(-10px);
}

.jiaruTopBanner{
  background: url('https://www-1300910993.cos.ap-shanghai.myqcloud.com/qsmweb_2026/images/jiaruBannerBJ@2x.jpg') no-repeat center / cover;
}
.jiaruTopBanner .btn,
.jiaruGW .btn{
  width: 196px;
  margin: 32px auto 0;
  font-size: 16px;
}
.jiaruCEO{
  padding: 100px 0 100px;
}
.jiaruCEO .aboutTitBox{
  width: 60%;
}
.jiaruCEO .aboutConBox{
  width: 25%;
  position: relative;
}
.jiaruCEO .aboutConBox img{
  border-radius: 30px;
}
.jiaruCEO .aboutConBox::after{
  content: '';
  position: absolute;
  bottom: -20px;
  left: 20px;
  width: 100%;
  height: 80%;
  background: var(--main-color);
  z-index: -1;
  border-radius: 30px;
}
.jiaruNr{
  color: var(--main-tit-color);
  font-size: 16px;
  margin-top: 24px;
  line-height: 1.8;
}
.jiaruNr p{
  margin-bottom: 10px;
}
.jiaruNr .r{
  text-align: right;
  font-weight: 500;
  margin-top: 16px;
}
.jiaruGW{
  padding: 50px 0 100px;
}
.jiaruGW .aboutConBox{
  width: 40%;
}
.jiaruGW .aboutTitBox{
  width: auto;
}
.jiaruGW .btn{
  margin: 56px 0 0;
}

.jiaruList{
  padding: 20px 0 150px;
}
.aboutListBox{
  gap: 32px;
}
.aboutListBox li{
  border-radius: 30px;
  overflow: hidden;
  flex: 1;
  border: 1px solid #E7F0FF;
  box-shadow: 0px 10px 50px 0px rgba(220, 233, 249, 0.5);
}
.aboutListBox .text{
  padding: 16px 16px;
  box-sizing: border-box;
  height: 136px;
  overflow: auto;
}
.aboutListBox .text .tit{
  font-size: 18px;
  font-weight: 500;
}
.aboutListBox .text .sub{
  color: var(--main-sub-color);
  font-size: 14px;
  margin-top: 10px;
}

.newsConTopBanner{
  background: url('https://www-1300910993.cos.ap-shanghai.myqcloud.com/qsmweb_2026/images/newsConBannerBJ@2x.jpg') no-repeat center top / contain;
  min-height: 750px;
  height: auto;
}
.newsContainer{
  text-align: left;
  padding: 150px 0 100px;
  gap: 40px;
  align-items: flex-start;
}
.breadcrumb{
  color: var(--main-sub-color);
}
.breadcrumb a{
  color: var(--main-sub-color);
}
.breadcrumb .iconfont{
  font-size: 12px;
  color: #c5c6d0;
}
.newsConL{
  flex: 1;
}
.newsConL>h1{
  font-size: 42px;
  font-weight: 500;
  margin: 20px 0 10px;
  line-height: 1.2;
}
.newsConL .fabu{
  font-size: 14px;
  color: var(--main-sub-color);
}
.newsText{
  font-size: 18px;
  margin: 56px 0;
}
.newsText>p{
  margin-bottom: 12px;
  line-height: 1.8;
}
.newsText img{
  width: auto;
  max-width: 100%;
  border-radius: 10px;
  margin: 12px 0;
}
.newsConL_bottom{
  border: 0px solid #d7e0f0;
  border-top-width: 1px;
  border-bottom-width: 1px;
  padding: 24px 0;
}
.post_nav{
  width: 75%;
  overflow: hidden;
}
.post_nav a{
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  line-height: 2;
}
.newsConL_bottom .share a{
  font-size: 32px;
  color: var(--main-sub-color);
  margin-left: 12px;
}
.newsConR{
  width: 220px;
  position: sticky;
  top: 100px;
}
.newsCard{
  width: 100%;
  background: url('https://www-1300910993.cos.ap-shanghai.myqcloud.com/qsmweb_2026/images/newsCardBJ@2x.jpg') no-repeat center / cover;
  overflow: hidden;
  border-radius: 20px;
  box-sizing: border-box;
  border: 1px solid #fff;
  padding: 24px 12px 32px;
}
.newsCardTit{
  font-size: 20px;
  font-weight: 500;
  margin-bottom: 24px;
}
.newsForm{
  width: 100%;
}
.newsForm input{
  width: 100%;
  padding: 12px;
  box-sizing: border-box;
  border-radius: 10px;
  background: #fff;
  margin-bottom: 12px;
}
.newsForm button{
  border: none;
  padding: 12px;
  width: 100%;
  margin-bottom: 42px;
}
.newsCard .tel{
  font-size: 26px;
  font-weight: 600;
}
.newsCard .wxewm{
  width: 100%;
  padding: 10px;
  background-color: #fff;
  border-radius: 10px;
  margin-top: 24px;
}
.newstj{
  margin-top: 36px;
}
.newstjTit{
  font-size: 20px;
  font-weight: 500;
  display: flex;
  align-items: center;
  margin-bottom: 12px;
}
.newstjTit img{
  width: 20px;
  height: 20px;
  margin-right: 8px;
}
.tjlist li a{
  width: 100%;
  overflow: hidden;
  gap: 10px;
  justify-content: flex-start;
}
.tjlist li a p{
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.tjlist li{
  margin-bottom: 12px;
}
.tjlist li .iconfont{
  color: #C3C8D4;
}








@media screen and (max-width: 1920px){
  .G_index{
    max-width: 1200px;
  }
  .header-scrolled{
    width: 1200px;
  }
  .bannerBox .img{
    transform: scale(0.85);
  }
  .proImg{
    width: 80%;
  }
}

@media screen and (max-width: 1400px){
  .G_index{
    max-width: 1050px;
  }
  .header-scrolled,.subnav{
    width: 1050px;
  }
  .bannerBox{
    height: 650px;
  }
  .bannerBox .img{
    transform: scale(0.75);
  }
  .proImg{
    width: 80%;
  }
  .nav{
    max-width: 660px;
  }
  .header-scrolled .nav{
    max-width: 560px;
  }
  .bannerBox .text h1{
    font-size: 42px;
  }
  .bannerBox .text p{
    font-size: 16px;
  }
  .titleBox h2{
    font-size: 36px;
  }
  .titleBox p{
    font-size: 15px;
  }
  .proTit{
    font-size: 28px;
  }
  .proSub{
    font-size: 15px;
  }
  .porItem .text p{
    font-size: 12px;
  }
  .porItem .text h3{
    font-size: 16px;
  }
  .porItem a img{
    width: 36px;
    height: 36px;
  }
  .solutionL{
    width: 200px;
    height: 580px;
  }
  .solutionR{
    width: calc(100% - 220px);
  }
  .solutionL li.active{
    background-position-x: 140px;
    background-size: 52px auto;
  }
  .solutionMainL h3{
    font-size: 30px;
  }
  .solutionMainL p{
    font-size: 15px;
  }
  .solutionMain{
    height: 442px;
    padding: 60px 30px;
  }
  .productPage{
    margin-bottom: 100px;
  }
  .mt150{
    margin-top: 100px;
  }
  .speech{
    font-size: 14px;
    height: 150px;
  }
  .caseHead img{
    width: 48px;
    height: 48px;
  }
  .casetop h4{
    font-size: 18px;
  }
  .casetop .star{
    margin: 12px 0 16px;
  }
  .service h4{
    font-size: 22px;
  }
  .partnerImg{
    padding: 10px 12px;
  }
  .kefuL .kefutit{
    font-size: 32px;
    margin-bottom: 20px;
  }
  .kefuR{
    width: 320px;
    margin: 20px 0 80px;
  }
  .ftNav dd{
    font-size: 14px;
  }
  .link{
    margin: 20px 0 20px;
  }
  .company{
    padding: 20px;
  }
  .newsConL>h1{
    font-size: 36px;
  }
}

@media screen and (max-width: 1000px) {
  .rightKF,.topAD{
    display: none!important;
  }
  .G_index{
    max-width: 100%;
    padding: 0 16px;
  }
  .header-scrolled{
    width: 100%;
    border-radius: 0;
    top: 0;
  }
  .header-scrolled .nav{
    max-width: 100%;
  }
 .login{
    display: none;
  }
  .header{
    padding: 8px 16px;
  }
  .logo h1 a{
    background-size: 100%!important;
    width: 110px;
  }

  .menu{
    display: block;
  }
  .menu .iconfont{
    display: block;
    color: var(--main-tit-color);
    font-size: 24px;
  }
  .M_active .iconfont{
    color: var(--main-sub-color);
  }
  .nav{
    max-width: 100%;
    position: absolute;
    top: 64px;
    left: 0;
    background: #fff;
    margin: 0;
    height: calc(100vh - 64px);
    border-top: 1px solid #DBDEE5;
    overflow-y: auto;
    height: 0;
    opacity: 0;
  }
  .nav ul{
    flex-wrap: wrap;
  }
  .nav>ul>li{
    width: 100%;
  }
  .nav>ul>li a{
    line-height: 58px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: auto;
    padding: 0 16px;
  }
  .subnav{
    position: relative;
    top: auto;
    left: auto;
    border-top: 1px solid #DBDEE5;
    border-bottom: 1px solid #DBDEE5;
    padding: 12px 16px;
    border-radius: 0;
    box-shadow: none;
    opacity: 1;
    overflow: hidden;
    display: none;
    transform: none;
    transition: none;
  }

  .subnav>ul>li{
    width: 100%;
  }
  .subnav>ul>li a{
    line-height: 1.2;
    padding: 12px 0;
    justify-content: flex-start;
    align-items: flex-start;
    margin-bottom: 0px;
  }
  .subclass{
    font-size: 14px;
    margin: 16px 0 10px;
  }
  .subtit{
    font-size: 15px;
    font-weight: normal;
  }
  .subtext{
    font-size: 13px;
    font-weight: 300;
  }
  .solutionNav>ul>li a{
    width: 100%;
  }
  .nav>ul>.navlist>a::after{
    display: none;
  }
  .subnav>ul>li a:hover{
    background: none;
  }
  .M_active{
    background: #fff;
  }
  .M_active .nav{
    height: calc(100vh - 64px);
    opacity: 1;
  }

  .navlist.active .iconfont{
    transform: rotate(180deg);
  }
  .nav>ul>li:hover .subnav{
    transform: none;
  }
  .solutionNav>ul>li a,.aboutNav>ul>li a{
    align-items: center;
  }
  .subnav>ul>li a img{
    margin-top: 0;
  }
  .nav .btnbox{
    display: flex;
    justify-content: center;
    position: absolute;
    bottom: 54px;
    left: 0;
  }
  .nav .btn{
    width: 45%;
    padding: 16px 0;
  }

  .topSection{
    padding-top: 0%;
    box-sizing: border-box;
  }
  .bannerBox>.flex{
    flex-wrap: wrap;
  }
  .bannerBox .text,
  .bannerBox .img{
    width: 100%;
    text-align: center;
    transform: none;
    /* border: #03F9E1 1px solid; */

  }
  .bannerBox .img{
    height: 260px;
    margin-top: 60px;
    margin-bottom: 32px;

  }
  .bannerBox .text h1{
    font-size: 32px;
  }
  .bannerBtn{
    margin: 20px auto 0;
    padding: 16px 40px!important;
    width: 50%;
  }
  .bannerImgA03{
    width: 80%;
    top: 18%;
    left: 10%;
  }
  .bannerImgA01{
    width: 40%;
    top: 10%;
    left: 3%;
  }
  .bannerImgA02{
    width: 40%;
    top: 0%;
    right: 0%;
  }
  .bannerImgA0B{
    width: 40%;
    top: 21%;
    left: -3%;
  }
  .bannerImgA04{
    width: 50%;
    bottom: 0%;
    left: 0%;
  }
  .bannerImgA0A{
    width: 5%;
    top: 47%;
    left: 5%;
  }
  .bannerImgA06{
    width: 20%;
    top: 1%;
    left: 42%;
  }
  .bannerImgA05{
    width: 30%;
    right: 0%;
    bottom: 0%;
  }
  .bannerImgB01{
    width: 100%;
    left: 0;
    bottom: 0;
  }
  .bannerImgB02{
    width: 5%;
    top: 30%;
    left: 73%;
  }
  .bannerImgB03{
    width: 40%;
    left: 54%;
    top: 14%;
  }
  .bannerImgB04{
    width: 68%;
    top: 30%;
    left: 4%;
  }
  .bannerImgB05{
    width: 20%;
    left: 75%;
    top: 40%;
  }
  .bannerImgB06{
    width: 12%;
    left: 0;
    top: 70%;
  }
  .bannerImgB07{
    width: 60%;
    left: 10%;
    top: 5%;
  }

  .bannerImgB08{
    width: 20%;
  }
  .bannerImgC01{
    width: 100%;
  }
  .bannerImgC02{
    width: 60%;
    left: 12%;
    bottom: 0;
  }
  .bannerImgC03{
    width: 28%;
    left: 2%;
    top: 30%;
  }
  .bannerImgC04{
    width: 28%;
    left: 2%;
    top: 52%;
  }
  .bannerImgC05{
    width: 28%;
    left: 58%;
    top: 60%;
  }
  .bannerImgC06{
    width: 28%;
    left: 58%;
    top: 80%;
  }
  .bannerImgC07{
    width: 20%;
    right: 5%;
  }
  .bannerImgC08{
    width: 36%;
    right: 0;
  }
  .bannerImgD01{
    width: 95%;
    left: 2%;
  }
  .bannerImgD02{
    width: 80%;
    left: 5%;
    top: 12%;
  }
  .bannerImgD03{
    width: 30%;
    top: 70%;
    left: 0;
  }
  .bannerImgD04{
    width: 30%;
    left: 64%;
    top: 34%;
  }
  .bannerImgD05{
    width: 10%;
    top: 2%;
    right: 10%;
  }

  .mySwiperPC .swiper-pagination{
    left: 0;
    bottom: 0;
    text-align: center;
  }
  .titleBox{
    margin-bottom: 50px;
  }
  .titleBox h2{
    font-size: 24px;
  }
  .titleBox p{
    font-size: 14px;
    padding: 0 16px;
    box-sizing: border-box;
  }
  .productPage{
    margin: 60px auto;
  }
  .bannerBox{
    height: 620px;
  }
  .productL, .productR{
    width: 100%;
    border-radius: 30px;
  }
  .productL::after{
    border-radius: 30px;
  }
  .product{
    flex-wrap: wrap;
  }
  .productL{
    padding: 24px 16px;
  }
  .proTit{
    font-size: 20px;
    white-space: nowrap;

  }
  .proSub{
    font-size: 12px;
    margin-top: 6px;
  }
  .porItem .arrow{
    display: none;
  }
  .porItem a{
    padding: 10px;
  }
  .porItem .text h3{
    font-size: 15px;
  }
  .porItem .text p{
    line-height: 1.2;
  }
  .productR a{
    border-radius: 30px;
    padding: 16px 12px;
  }
  .solution{
    display: block;
    padding: 0;
  }
  .solutionL,.solutionR{
    width: 100%;
    height: auto;
  }
  .solutionL{
    padding: 6px;
    display: flex;
    margin-bottom: 0;
    padding: 0;
    background-image: url("https://www-1300910993.cos.ap-shanghai.myqcloud.com/qsmweb_2026/images/solutionBgMain@2x.jpg");
    overflow: auto;
    border-radius: 30px 30px 0 0;
  }
  .solutionL li{
    width: 48%;
    flex: 1 1 auto;
    font-size: 16px;
    padding: 16px 12px;
    border-radius: 10px 10px 0 0;
    white-space: nowrap;

  }
  .solutionL li.active::after{
    width: 100%;
    height: 2px;
    bottom: 0;
    top: auto;
  }
  .solutionL li.active{
    background-position: top right;
    background-size: contain;
  }
  .solutionMain{
    height: 570px;
    padding: 26px 16px;
    border-radius: 0 0 30px 30px;
    flex-wrap: wrap;
  }

  .solutionMainL h3{
    font-size: 20px;
  }
  .solutionMainL, .solutionMainR{
    width: 100%;
  }
  .solutionMainL p{
    font-size: 14px;
    margin-top: 10px;
  }
  .btn{
    padding: 12px 0;
  }
  .solutionKefu .btn{
    padding: 10px 16px;
    width: auto;
  }
  .solutionSwiper{
    border-radius: 0;
  }
  .solutionMainR{
    margin-top: 36px;
  }
  .solutionPage .casebtn{
    top: 36px;
    right: 20px;
  }
  .solutionKefu{
    padding: 12px;
    height: 90px;
    border-radius: 20px;
  }
  .KefuL img{
    max-height: 72px;
  }
  .kefutext h4{
    font-size: 20px;
  }
  .kefutext p{
    font-size: 14px;
  }
  .mt150{
    margin-top: 60px;
  }
  .service{
    flex-wrap: wrap;
  }
  .service a{
    width: 48%;
    padding: 12px 0;
  }
  .service img{
    width: 60px;
    height: 60px;
  }
  .service h4{
    font-size: 18px;
  }
  .service p{
    font-size: 14px;
  }
  .honorPage{
    margin-top: 20px;
    width: calc(100%);
    border-radius: 30px;
    padding: 60px 0;
  }
  .honor{
    flex-wrap: wrap;
    margin-bottom: 30px;
  }
  .honor li{
    width: 48%;
    margin-bottom: 12px;
  }
  .honor li p{
    font-size: 14px;
  }
  .honorText h4{
    font-size: 15px;
  }
  .honorText p{
    font-size: 13px;
  }
  .honorWrapper li img{
    height: 60px;
  }
  .honorWrapper li{
    width: 200px;
    height: 80px;
  }
  .partner{
    flex-wrap: wrap;
    justify-content: space-between;
    margin-bottom: 50px;
  }
  .partnerImg{
    width: 33%;
    padding: 0;
    margin-bottom: 32px;
  }
  .kefuPage{
    border-radius: 30px 30px 0 0;
    text-align: center;
  }
  .kefuL{
    width: 100%;
    padding: 16px 16px 100px;
    box-sizing: border-box;
  }
  .kefuL .kefutit{
    font-size: 20px;
  }
  .kefuR .btn{
    display: none;
  }
  .footer{
    border-radius: 30px 30px 0 0;
    padding-top: 40px;
  }
  .ftNav{
    display: none;
  }
  .ftLogo{
    width: 100%;
    text-align: center;
  }
  .ftTel{
    margin-top: 30px;
  }
  .ftLogo .QRewm{
    margin: 16px auto 0;

  }
  .casebtn{
    right: 12px;
    left: auto;
  }

  /* 内页手机 */
  .xzTop h2{
    font-size: 28px;
  }
  .xzTop p{
    font-size: 14px;
  }
  .xzTabBox{
    margin-top: -150px;
  }
  .gmListBox{
    overflow-x: auto;
    margin: 0 -16px;
    padding: 0 12px;
  }
  .xzList{
    display: none;
  }
  .gmList{
    display: flex;
    width: 230%;
    gap: 16px;
    margin: 32px 0 60px;
  }
  #tab3 .gmList{
    width: 115%;
  }
  .xzTags{
    overflow-x: auto;
    background: #F2FAFD;
    scroll-snap-type: x mandatory;
    justify-content: flex-start;
  }
  .gmTags{
    background: linear-gradient(to right, #F1FAFF 0%, #F5F4FC 100%)
  }
  .xzTags::-webkit-scrollbar{
    display: none;
  }
  .xzTags li{
    font-size: 16px;
    padding: 12px 12px;
    scroll-snap-type: x mandatory;
    white-space: nowrap;
    margin: 0;
    border-radius: 20px 20px 0 0;
    flex: 1;
  }
  #a_HarmonyOSNext{
    padding: 24px 0;
  }
  .upgradeLog h4{
    font-size: 26px;
  }
  .logCon{
    padding: 20px 16px;
  }
  .logtop{
    font-size: 22px;
  }
  .gmList .gmItem{
    padding: 20px 12px;
    max-width: none;
    min-height: 550px;
  }
  .gmList .gmItem dl{
    font-size: 14px;
  }
  .gmItem .buyBtn{
    margin: 20px 0 16px;
    width: 120px;
  }
  .gmItem .line{
    margin-bottom: 16px;
  }
  .gmItem h3{
    font-size: 20px;
  }
  .gmItem .price{
    font-size: 36px;
  }

  .version{
    overflow-x: auto;

  }
  .version .verTop{
    width: 100%;
    top: 0;
  }
  .mainBox{
    width: 100%;
  }
  #tab3 .version .verTop,
  #tab3 .mainBox {
    width: 100%;
  }
  .version .verMain li{
    height: auto;
    padding: 12px 0;
  }
  .version ul li,
  .version .verMain li>.iconfont{
    font-size: 14px;
  }
  .version ul li:first-child{
    padding-left: 12px;
  }
  .version .verTop li{
    height: 80px;
    font-size: 12px;
  }
  .version .verTop li p{
    font-size: 16px;
  }
  .version .buyBtn{
    display: none;
  }
  .tabTit{
    font-size: 14px;
    padding: 10px;
  }
  .tabTit img{
    width: 14px;
    height: 14px;
  }
  .tabTit span{
    font-size: 12px;
  }
  #tab3 .version{
    width: 100%;
  }

  .buyTit{
    font-size: 24px;
    margin: 24px 0 12px;
  }
  .buyTit2{
    font-size: 20px;
  }
  .buyContainer{
    flex-wrap: wrap;
  }
  .buyL, .buyR{
    width: 100%;
    padding: 16px;
    height: auto;
    margin-bottom: 16px;
  }
  .buyLine{
    margin: 14px 0;
  }
  .buySubtit{
    font-size: 16px;
  }
  .select-mock__trigger{
    height: 50px;
    line-height: 50px;
  }
  .buyPriceTop{
    height: 68%;
  }
  .buyPrice{
    gap: 12px;
  }
  .buyPrice li{
    width: 47.5%;
    height: 190px;
  }
  .buyFree{
    height: 16px;
  }
  .buyNote{
    font-size: 12px;
  }
  .buyPrice li.buykefu{
    width: 100%;
  }
  .buyNote2{
    font-size: 12px;
    padding: 6px 10px;
    margin-top: 16px;
  }

  .lianxi{
    flex-wrap: wrap;
  }
  .lianxi .item{
    width: 100%;
    margin-bottom: 20px;
    padding: 32px 16px;
  }
  .lianxi .itemText{
    font-size: 24px;
  }

  .aboutTopBanner{
    border-radius: 0 0 0 30px;
    background-position: top left;
    height: 450px;
  }
  .aboutTopBanner .xzTop img{
    width: 75%;
  }
  .aboutIntroduction>.flex{
    flex-wrap: wrap;
  }
  .aboutIntroduction .aboutTitBox,
  .aboutIntroduction .aboutConBox{
    width: 100%;
    font-size: 16px;
  }
  .aboutIntroduction .aboutTitBox{
    font-size: 30px;
    margin-bottom: 32px;
  }
  .aboutIntroduction{
    padding: 80px 0 80px;
  }
  .aboutDec1{
    width: 50%;
    top: 20px;
    right: 20px;
    bottom: auto;
  }
  .aboutTitBox{
    font-size: 30px;
  }
  .aboutProduct{
    padding: 0 0 80px;
  }
  .aboutProductBox{
    flex-wrap: wrap;
    gap: 12px;
  }
  .aboutProductBox li{
    width: 48%;
    height: 160px;
  }
  .aboutProductBox .productImg{
    width: 56px;
    height: 56px;
  }
  .aboutProductBox .productTit{
    font-size: 16px;
  }
  .aboutTeams{
    padding: 60px 0;
    border-radius: 0 80px 0 80px;
  }
  .Swiper-Zhuanli .casebtn{
    right: auto;
  }
  .aboutPartner{
    padding: 100px 0 50px;
  }
  .aboutPartner .aboutConBox img{
    width: 100%;
  }
  .jiaruTopBanner{
    height: 360px;
  }
  .jiaruCEO{
    padding: 80px 0 80px;
  }
  .jiaruCEO>.flex,
  .jiaruGW>.flex{
    flex-wrap: wrap;
  }
  .jiaruGW>.flex{
    flex-direction: column-reverse;
  }
  .jiaruCEO .aboutTitBox,
  .jiaruCEO .aboutConBox,
  .jiaruGW .aboutTitBox,
  .jiaruGW .aboutConBox{
    width: 100%;
  }
  .jiaruGW{
    padding-bottom: 50px;
  }
  .jiaruCEO .aboutConBox,
  .jiaruGW .aboutConBox{
    width: 90%;
  }
  .jiaruList{
    padding-bottom: 50px;
  }
  .aboutListBox{
    flex-wrap: wrap;
  }
  .aboutListBox li{
    width: 100%;
    flex: auto;
  }
  .newsList{
    flex-wrap: wrap;
    padding: 40px 0 80px;
  }
  .newsList .item{
    width: 100%;
  }

  .newsConR{
    display: none;
  }
  .newsContainer{
    padding: 100px 16px 0;
  }
  .newsConL{
    width: 100%;
  }
  .breadcrumb{
    font-size: 14px;
  }
  .newsConL>h1{
    font-size: 24px;
  }
  .newsText{
    font-size: 16px;
  }
  .newsConL_bottom{
    flex-wrap: wrap;
  }
  .post_nav{
    width: 100%;
  }
}



















.fade-in{
  animation: fadeIn 1s ease forwards;
}

@keyframes fadeIn {
  0%{
    opacity: 0;
  }
  100%{
    opacity: 1;
  }
}