html,
body {
  width: 100%;
  height: 100%;
  overflow: hidden;
}
#app {
  position: relative;
  width: 10rem;
  height: 100%;
  margin: 0 auto;
  background-color: #fff;
  background-image: url("../image/change/bg.png?v=20241014");
  background-size: 100% auto;
  background-repeat: no-repeat;
  background-position: center top;
  display: none;
  position: relative;
}
/* 当屏幕宽度大于 1000px 时，修改 html 和 body 的宽度 */
@media (min-width: 800px) {
  html,
  body {
    height: 100vh; /* 设置高度为可视区域的 199% */
    width: calc(
      100vh * 375 / 667
    ); /* 根据宽高比 375:667 计算宽度 兼容小屏 比例放大 */
    margin: 0 auto; /* 水平居中 */
    overflow: hidden;
  }
  #app {
    position: relative;
    width: 100%;
    height: 100%;
    margin: 0 auto;
    background-color: #fff;
    background-image: url("../image/change/bg.png?v=20241014");
    background-size: 100% auto;
    background-repeat: no-repeat;
    background-position: center top;
    display: none;
    position: relative;
  }
}
/*开始swiper样式*/
#swiper {
  width: 100%;
  height: 100%;
}
/* 分页器样式 */
.swiper-pagination {
    position: absolute;
    bottom:14%;
    z-index: 666;
    width: 5rem;
	height: 2px;
	left: 50%;
    transform: translateX(-50%);
    display: flex;
    justify-content: center;
    align-items: center;
}

.swiper-pagination-bullet {
    width: 40px; /* 线条的宽度 */
    height: 2px; /* 线条的高度 */
    background-color: #000; /* 未激活线条的颜色 */
    border-radius: 2px; /* 线条的圆角 */
    margin: 0 1px; /* 线条之间的间距 */
    cursor: pointer;
}

.swiper-pagination-bullet-active {
    background-color: #00A4F2; /* 激活线条的颜色 */
}
/* ... 分页器样式 ... */

.list-item {
  -webkit-transform-style: preserve-3d;
  -webkit-backface-visibility: hidden;
  background-repeat: no-repeat;
  background-position: center;
  overflow: hidden;
}
.list-item .tel-img {
  position: absolute;
  top: 3.5rem;
  left: 50%;
  width: 6.08rem;
  height: 12.426666666666666rem;
  transform: translate(-50%, 0);
  -webkit-transform: translate(-50%, 0);
  -moz-transform: translate(-50%, 0);
  -ms-transform: translate(-50%, 0);
  -o-transform: translate(-50%, 0);
}
#swiper .list-item .slide-move {
  position: absolute;
}
#swiper .list-item .slide-move-updownFlow {
  position: absolute;
  animation:upAndDown ease-in-out 3s infinite;
  -webkit-animation:upAndDown ease-in-out 3s infinite;
}
#swiper .list-item .slide-move .slide-maintitle{
  font-family: PingFangSC-Medium;
  font-size: 0.69rem;
  color: #000000;
  letter-spacing: 1px;
  text-align: center;
  line-height: 0.69rem;
  font-weight: 500;
}
#swiper .list-item .slide-move .slide-secondtitle{
  font-family: PingFangSC-Medium;
  font-size: 0.37rem;
  color: #000000;
  letter-spacing: 2px;
  text-align: center;
  line-height: 0.48rem;
  font-weight: 300;
}
#swiper .list-item .title {
  opacity: 0;
  -webkit-transition: top 0.5s linear;
  transition: top 0.5s linear;
  top: -1.09rem;
  left: 50%;
  width: 7.36rem;
  height: 0.58666667rem;
  margin-left: -3.68rem;
}
#swiper .list-item .title.move{
  opacity: 1;
  top: 1.09rem;
}
#swiper .list-item .title-no-animation {
  top: 1.09rem;
  left: 50%;
  width: 7.36rem;
  height: 0.58666667rem;
  margin-left: -3.68rem;
}
#swiper .list-item .desc {
  opacity: 0;
  -webkit-transition: left 0.5s linear 0.5s;
  transition: left 0.5s linear 0.5s;
  top: 2.24rem;
  left: 90%;
  width: 10rem;
  height: 0.37333333rem;
}
#swiper .list-item .desc.move{
  opacity: 1;
  left: 0%;
}
#swiper .list-item .desc-no-animation {
  top: 2.24rem;
  left: 0%;
  width: 10rem;
  height: 0.37333333rem;
  }
.slide-img {
  width: 100%;
  height: 100%;
}
/*开始swiper-first*/
#swiper .slide-first .move-one {
	top: 5.3rem;
	left: 1.15rem;
	width: 7.78rem;
	height: auto;
  }

/*结束swiper-first样式*/
/*开始swiper-third样式*/
#swiper .slide-third .move-one {
	top: 8.5rem;
	left: 1.15rem;
	width: 7.78rem;
	height: auto;
}
/*结束swiper-third样式*/
/*开始swiper-second样式*/
#swiper .slide-second .move-one{
  top: 6.5rem;
  left: 1.15rem;
  width: 7.78rem;
  height: auto;
}
/* #swiper .slide-second .move-two{
  width: 5.6rem;
  height: 3.4rem;
  left: 1rem;
  top: 8.45rem;
} */
/*结束swiper-second样式*/
/*开始slide-forth样式*/
#swiper .slide-forth .move-one {
  top: 11rem;
  left: 1.15rem;
  width: 7.78rem;
  height: auto;
}
/*结束slide-forth样式*/
/*开始slide-fifth样式*/
#swiper .slide-fifth .move-one {
  top: 8.3rem;
  left: 1.15rem;
  width: 7.78rem;
  height: auto;
}
/*结束slide-fifth样式*/
/*开始slide-sixth*/
/* #swiper .slide-sixth .move-one {
	top: 9.2rem;
	left: 0.6rem;
	width: 8.84rem;
	height: 3.2rem;
  } */
  /*结束slide-sixth*/
/*开始swiper公共动画*/
@-webkit-keyframes upAndDown {
  0% {
    transform: translateY(0);
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
  }
  50% {
    transform: translateY(7px) ;
    -webkit-transform: translateY(7px) ;
    -moz-transform: translateY(7px) ;
    -ms-transform: translateY(7px) ;
    -o-transform: translateY(7px) ;
  }
  100% {
    transform: translateY(0);
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
  }
}
@-ms-keyframes upAndDown {
  0% {
    transform: translateY(0);
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
  }
  50% {
    transform: translateY(7px) ;
    -webkit-transform: translateY(7px) ;
    -moz-transform: translateY(7px) ;
    -ms-transform: translateY(7px) ;
    -o-transform: translateY(7px) ;
  }
  100% {
    transform: translateY(0);
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
  }
}
@-o-keyframes upAndDown {
  0% {
    transform: translateY(0);
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
  }
  50% {
    transform: translateY(7px) ;
    -webkit-transform: translateY(7px) ;
    -moz-transform: translateY(7px) ;
    -ms-transform: translateY(7px) ;
    -o-transform: translateY(7px) ;
  }
  100% {
    transform: translateY(0);
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
  }
}

@keyframes upAndDown {
  0% {
    transform: translateY(0);
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
  }
  50% {
    transform: translateY(7px) ;
    -webkit-transform: translateY(7px) ;
    -moz-transform: translateY(7px) ;
    -ms-transform: translateY(7px) ;
    -o-transform: translateY(7px) ;
  }
  100% {
    transform: translateY(0);
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
  }
}
@-webkit-keyframes moving1 {
  from {
    -webkit-transform: translateX(-10px);
  }
  to {
    -webkit-transform: translateX(10px);
  }
}
@keyframes moving1 {
  from {
    transform: translateX(-10px);
  }
  to {
    transform: translateX(10px);
  }
}
@-webkit-keyframes moving2 {
  from {
    -webkit-transform: translateX(10px);
  }
  to {
    -webkit-transform: translateX(-10px);
  }
}
@keyframes moving2 {
  from {
    transform: translateX(10px);
  }
  to {
    transform: translateX(-10px);
  }
}

/*结束swiper公共动画*/
/*结束swiper样式*/
/*开始下载按钮样式*/
.download{
  width:100%;
  position: absolute;
  bottom:3.5%;
  /* bottom: 0.8rem; */
  z-index: 666;
}

.download-hint{
  margin-top: 20px;
  margin-bottom: 12px;
  /* margin-bottom: 0.10666666rem; */
  font-size: 12px;
  color: #000000;
  text-align: center;
} 

a:link {color: #267AFF; text-decoration:none;} 
a:active{color: #267AFF; } 
a:visited {color:#267AFF;text-decoration:none;} 
a:hover {color: #267AFF; text-decoration:none;} 
.download-hint > a{
  color: #267AFF;
  text-decoration:none;
}

/*结束swiper公共动画*/
/*结束swiper样式*/
/*开始下载按钮样式*/
.download-btn,
.download-wx-btn {
  margin: 0 auto;
  width:64%;;
  height:auto;
  /* background: url('../image/download@2x.png') no-repeat center center;
  background-size: cover; */
  z-index: 666;
  font-family: PingFangSC-Medium;
  font-size: 16px;
  color: #FFFFFF;
  letter-spacing: 0;
  line-height:12vw;
  font-weight: 500;
  text-align: center;
  /* background:#267AFF; */
  border-radius: 6vw;
}
.download-btn .slide-img{
  width: 100%;
  height:auto;
}
.download-wx-btn .download-app {
  width: 100%;
  height: 57px;
  background: url('../image/change/buttonWx.png') no-repeat center center;
  background-size: cover;
}

/* 开发者信息 */
.author{
  /* margin: -0.21333333rem 0 0.21333333rem; */
  font-family: PingFangSC-Regular;
  font-size: 11px;
  color: #8A8A8F;
  text-align: center;
  line-height: 18px;
  z-index: 666;
}
/*结束下载按钮样式*/
/*开始箭头样式*/
.arrow-down {
  position: absolute;
  bottom: 0.34666667rem;
  left: 50%;
  width: 0.36rem;
  height: 0.49333333rem;
  margin-left: -0.18666667rem;
  background-image: url('../image/arrow@2x.png');
  background-repeat: no-repeat;
  background-position: center;
  background-size: 0.36rem 0.49333333rem;
  -webkit-transform: translateY(0);
  transform: translateY(0);
  -webkit-animation: moveArrow 1.3s linear infinite alternate;
  animation: moveArrow 1.3s linear infinite alternate;
  z-index: 666;
}
@-webkit-keyframes moveArrow {
  from {
    -webkit-transform: translateY(0px);
  }
  to {
    -webkit-transform: translateY(10px);
  }
}
@keyframes moveArrow {
  from {
    transform: translateY(0px);
  }
  to {
    transform: translateY(10px);
  }
}
/*结束箭头样式*/

/* 打开浏览器指引 */
#app .mask{
  display: none;
  width: 100%;
  height: 100%;
  background-color: #000000;
  opacity: 0.6;
  position: fixed;
  left: 0px;
  top: 0px;
  z-index: 1000;
}

#app .mask .openBrowser{
  position: absolute;
  top: 30px;
  right: 40px;
  z-index: 10001;
  width: 215px;
  height: 300px;
  background-image: url(../image/openBrowser.png);
  background-position: right right;
  background-repeat: no-repeat;
  background-size: contain;
}

/* 打开小程序按钮样式 */
.xcx-btn-box{
  position: absolute;
  bottom: 3.8rem;
  z-index: 666;
  width:100%;
  height:44px;
}
/* .launch-btn{
  margin:0 auto;
  width:280px;
  height:44px;
} */
.center-content{
  margin:0 auto;
  background: #FFFFFF;
  border: 1px solid #3276FF;
  border-radius: 22px;
  width:280px;
  height:44px;
  font-family: PingFangSC-Semibold;
  font-size: 16px;
  color: #3276FF;
  letter-spacing: 0;
  line-height: 44px;
  font-weight: 600;
  text-align: center;
  margin-bottom: 12px;
}

.appIcon-img{
  width:102px;
  height:102px;
  margin-bottom: 23px;
}

.appIcon-title{
  width:102px;
  height:30px;
  margin-bottom: 27px;
}
.appIcon-desc{
  width:240px;
  height:16px;
  margin-bottom: 107px;
}