.box1 {
  width: 100%;
  min-height: 6.59rem;
  background-image: url(../img/pro1.png);
  padding: 1rem 0;
}

.box1 .main {
  display: flex;
  justify-content: space-between;
}

.box1 .left {
  width: 7rem;
}

.box1 .tit {
  font-family: Source Han Sans SC, Source Han Sans SC;
  font-weight: bold;
  font-size: 0.36rem;
  color: #3EB6FF;
  margin-bottom: .3rem;
}

.box1 .txt {
  font-family: Source Han Sans SC, Source Han Sans SC;
  font-weight: 400;
  font-size: 0.18rem;
  color: #000000;
  color: #333;
  line-height: 0.35rem;
  margin-bottom: .2rem;
}

.box1 .imgBox {
  display: flex;
  flex-wrap: wrap;
  gap: .12rem;
}

.box1 .imgBox img {
  width: 1.65rem;
  height: .96rem;
  padding: .05rem .04rem;
  border-radius: 0.05rem 0.05rem 0.05rem 0.05rem;
  cursor: pointer;
}

.box1 .imgBox img.act{
  border: .01rem solid #3EB6FF;
}

.box1 .right {
  width: 8.2rem;
  border-radius: 0.2rem 0.2rem 0.2rem 0.2rem;
  overflow: hidden;
}

.box1 .right img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: none;
}

.box1 .right img:first-child{
    display: block;
}

.box2 {
  width: 100%;
  padding: 1rem 0;
}

.proTit {
  font-family: Source Han Sans SC, Source Han Sans SC;
  font-weight: bold;
  font-size: 0.36rem;
  color: #000000;
  text-align: center;
  line-height: 1;
}

.proTxt {
  font-family: Source Han Sans SC, Source Han Sans SC;
  font-weight: 400;
  font-size: 0.25rem;
  color: #000000;
  text-align: center;
  margin-top: .25rem;
}

.box2 .bottom1 {
  margin-top: .67rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.box2 .bottom2 {
  margin-top: 1.22rem;
  display: flex;
  justify-content: space-between;
  gap: 1.6rem;
}

.swiper1 {
  width: 8.2rem;
  height: 4.5rem;
  margin: 0;
}

.page1 {
  display: flex;
  justify-content: center;
  bottom: .23rem;
}

.page1 span {
  width: 0.3rem;
  height: 0.05rem;
  background: #FFFFFF;
  border-radius: .05rem;
  transition: all .3s;
}

.page1 span.swiper-pagination-bullet-active {
  width: .67rem;
}

.box2 .right1 {
  width: 7rem;
}

.box2 .right1 .tit {
  font-family: Source Han Sans SC, Source Han Sans SC;
  font-weight: bold;
  font-size: 0.25rem;
  color: #3EB6FF;
  margin-bottom: .46rem;
}

.box2 .bottom2 .tit {
  font-family: Source Han Sans SC, Source Han Sans SC;
  font-weight: bold;
  font-size: 0.25rem;
  color: #3EB6FF;
  margin-bottom: .3rem;
}

.box2 .right1 .txt {
  font-family: Source Han Sans SC, Source Han Sans SC;
  font-weight: 400;
  font-size: 0.18rem;
  color: #000000;
  color: #333;
  line-height: 0.35rem;
}

.box2 .bottom2 .txt {
  font-family: Source Han Sans SC, Source Han Sans SC;
  font-weight: 400;
  font-size: 0.18rem;
  color: #000000;
  line-height: 0.35rem;
  min-height: 1.23rem;
  margin-bottom: .42rem;
}

.box2 .bottom2 img {
  width: 7.2rem;
  height: 4.5rem;
  object-fit: contain;
}

.box3 {
  width: 100%;
  padding: 1rem 0;
  background: linear-gradient(148deg, #F8FCFF 0%, #FFFFFF 100%);
}

.box3 .list {
  display: flex;
  flex-wrap: wrap;
  column-gap: .6rem;
  row-gap: .56rem;
  margin-top: 1rem;
}

.box3 .list .item {
  width: 7.7rem;
  height: 1.8rem;
  background: #FFFFFF;
  box-shadow: 0rem 0rem 0.3rem 0.01rem rgba(0, 0, 0, 0.05);
  padding: .6rem;
  display: flex;
  align-items: center;
  gap: .3rem;
  transition: all .3s;
}

.box3 .list .item:hover {
  background: linear-gradient(134deg, #FFFFFF 0%, #E6F6FF 100%);
}

.box3 .list .itemNum {
  width: 0.73rem;
  height: 0.73rem;
  background: linear-gradient(to top, #FFFFFF 0%, #E5E8E9 100%);
  border: 0.01rem solid #FFFFFF;
  font-family: MiSans, MiSans;
  font-weight: bold;
  font-size: 0.34rem;
  color: #C9C9C9;
  line-height: 0.3rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  box-shadow: 0rem 0rem 0.3rem 0.01rem rgba(0, 0, 0, 0.05);
  transition: all .3s;
}

.box3 .list .item:hover .itemNum {
  background: linear-gradient(188deg, #67C6FF 0%, #CEECFF 100%);
  color: #fff;
}

.box3 .list .item .tit {
  font-family: Source Han Sans SC, Source Han Sans SC;
  font-weight: bold;
  font-size: 0.25rem;
  color: #000000;
  margin-bottom: .1rem;
}

.box3 .list .item .txt{
  font-family: Source Han Sans SC, Source Han Sans SC;
  font-weight: 400;
  font-size: 0.18rem;
  color: #626262;
}

.box3 .list2 .item {
  width: 100%;
}

.box4 {
  width: 100%;
  min-height: 9.1rem;
  background-image: url(../img/pro6.png);
  padding: 1.18rem 0;
}

.swiper2 {
  margin-top: .72rem;
  height: 5.25rem;
}

.swiper2 .swiper-slide {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: 1.84rem;
  transform: translateX(1rem);
}

.swiper2 .swiper-slide-active {
  padding-top: .87rem;
}

.swiper2 .swiper-slide-active,
.swiper2 .swiper-slide-prev,
.swiper2 .swiper-slide-next {
  transform: translateX(0rem);
}

.swiper2 .swiper-slide-next+.swiper-slide {
  transform: translateX(-1rem);
}

.swiper2 .swiper-slide img {
  width: .6rem;
  height: .6rem;
  margin-bottom: .27rem;
}

.swiper2 .swiper-slide-active img {
  width: .9rem;
  height: .9rem;
}

.swiper2 .tit {
  font-family: Source Han Sans SC, Source Han Sans SC;
  font-weight: bold;
  font-size: 0.2rem;
  color: #000000;
  text-align: center;
}

.swiper2 .swiper-slide-active .tit {
  font-size: .3rem;
}

.swiper2 .txt {
  font-family: Source Han Sans SC, Source Han Sans SC;
  font-weight: 400;
  font-size: 0.2rem;
  color: #555555;
  margin-top: .29rem;
  text-align: center;
  opacity: 0;
  padding: 0 .6rem;
}

.swiper2 .swiper-slide-active .txt{
    padding: 0;
}

.swiper2 .swiper-slide-active .txt {
  opacity: 1;
}

.prev2,
.next2 {
  width: 0.43rem;
  height: 0.43rem;
  background: linear-gradient(to top, #FFFFFF 0%, #E5E8E9 100%);
  border: 0.01rem solid #FFFFFF;
  border-radius: 50%;
  bottom: .59rem;
  top: auto;
  margin: 0;
  transition: all .3s;
}

.prev2:hover,
.next2:hover {
  background: linear-gradient(172deg, #67C6FF 0%, #CEECFF 100%);
}

.prev2::after,
.next2::after {
  display: none;
}

.prev2 img,
.next2 img {
  width: .16rem;
  height: .13rem;
  object-fit: contain;
  transition: all .3s;
}

.prev2:hover img,
.next2:hover img {
  filter: brightness(0) invert(1);
}

.prev2 {
  left: 7.51rem;
}

.next2 {
  right: 7.51rem;
}

.next2 img {
  transform: rotate(180deg);
}

.box4-2 {
  min-height: 9.8rem;
  background-image: url(../img/pro8.png);
  padding-bottom: 1rem;
}

.swiper3 {
  margin-top: .72rem;
  height: 5.25rem;
  padding-bottom: 1.3rem;
  box-sizing: content-box;
}

.swiper3 .swiper-slide {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: 1.84rem;
}

.swiper3 .swiper-slide-active {
  padding-top: .87rem;
  padding: .87rem .99rem 0;
}

.swiper3 .swiper-slide img {
  width: .6rem;
  height: .6rem;
  margin-bottom: .27rem;
}

.swiper3 .swiper-slide-active img {
  width: .9rem;
  height: .9rem;
}

.swiper3 .tit {
  font-family: Source Han Sans SC, Source Han Sans SC;
  font-weight: bold;
  font-size: 0.2rem;
  color: #000000;
  text-align: center;
}

.swiper3 .swiper-slide-active .tit {
  font-size: .3rem;
}

.swiper3 .txt {
  font-family: Source Han Sans SC, Source Han Sans SC;
  font-weight: 400;
  font-size: 0.2rem;
  color: #555555;
  margin-top: .29rem;
  text-align: center;
  opacity: 0;
}

.swiper3 .swiper-slide-active .txt {
  opacity: 1;
}

.swiper3 .text {
  width: 16rem;
  height: 2.9rem;
  background: #FFFFFF;
  box-shadow: 0rem 0rem 0.5rem 0.01rem rgba(168, 202, 255, 0.5);
  border-radius: 0.2rem 0.2rem 0.2rem 0.2rem;
  position: absolute;
  left: 50%;
  top: 3.63rem;
  transform: translateX(-50%);
  display: none;
  font-family: Source Han Sans SC, Source Han Sans SC;
  font-weight: 400;
  font-size: 0.18rem;
  color: #555555;
  line-height: 0.35rem;
}

.swiper3 .swiper-slide-active .text {
  display: block;
  padding: .76rem .5rem .56rem;
}

.prev3,
.next3 {
  width: 0.43rem;
  height: 0.43rem;
  background: linear-gradient(to top, #FFFFFF 0%, #E5E8E9 100%);
  border: 0.01rem solid #FFFFFF;
  border-radius: 50%;
  bottom: 2.62rem;
  top: auto;
  margin: 0;
  transition: all .3s;
}

.prev3:hover,
.next3:hover {
  background: linear-gradient(172deg, #67C6FF 0%, #CEECFF 100%);
}

.prev3::after,
.next3::after {
  display: none;
}

.prev3 img,
.next3 img {
  width: .16rem;
  height: .13rem;
  object-fit: contain;
  transition: all .3s;
}

.prev3:hover img,
.next3:hover img {
  filter: brightness(0) invert(1);
}

.prev3 {
  left: 7.51rem;
}

.next3 {
  right: 7.51rem;
}

.next3 img {
  transform: rotate(180deg);
}

.swiper4 .swiper-slide {
  transform: translateX(0rem);
}

.swiper4 .swiper-slide-active {
  padding: .87rem .6rem;
}

.swiper4 .swiper-slide-next+.swiper-slide {
  transform: translateX(0rem);
}

.box5 {
  width: 100%;
  padding: 1rem 0;
  margin-bottom: 1rem;
}

.box5 .list {
  display: flex;
  flex-wrap: wrap;
  gap: .25rem;
  margin-top: .75rem;
}

.box5 .list .item {
  width: 3rem;
}

.box5 .list .item img {
  width: 100%;
  height: 1.71rem;
  object-fit: cover;
  margin-bottom: .25rem;
}

.box5 .list .item .tit {
  font-family: Source Han Sans SC, Source Han Sans SC;
  font-weight: 400;
  font-size: 0.2rem;
  color: #000000;
  text-align: center;
}

.box5 .list .item:hover .tit {
  color: #3EB6FF;
}

.box6 {
  width: 100%;
  background: #F8F8F8;
  padding: 1rem 0 2rem;
}

.box6 .main {
  position: relative;
}

.swiper5 {
  margin-top: 1rem;
  height: 4.6rem;
  padding: .05rem 0;
}

.swiper5 .swiper-slide {
  background: #fff;
  transition: all .3s;
}

.swiper5 .swiper-slide:hover {
  box-shadow: 0rem 0rem 0.3rem 0.01rem rgba(0, 0, 0, 0.16);
}

.swiper5 .swiper-slide img {
  height: 2.6rem;
  object-fit: cover;
  margin-bottom: .3rem;
}

.swiper5 .swiper-slide .tit {
  font-family: Microsoft YaHei, Microsoft YaHei;
  font-weight: 400;
  font-size: 0.2rem;
  color: #000000;
  margin-bottom: .16rem;
  padding: 0 .25rem;
}

.swiper5 .swiper-slide:hover .tit {
  color: #3EB6FF;
}

.swiper5 .swiper-slide .txt {
  font-family: Microsoft YaHei, Microsoft YaHei;
  font-weight: 400;
  font-size: 0.16rem;
  color: #555555;
  line-height: 0.25rem;
  padding: 0 .25rem;
}

.prev5,
.next5 {
  width: 0.43rem;
  height: 0.43rem;
  background: linear-gradient(to top, #FFFFFF 0%, #E5E8E9 100%);
  border: 0.01rem solid #FFFFFF;
  border-radius: 50%;
  bottom: 2.08rem;
  top: auto;
  margin: 0;
  transition: all .3s;
}

.prev5:hover,
.next5:hover {
  background: linear-gradient(172deg, #67C6FF 0%, #CEECFF 100%);
}

.prev5::after,
.next5::after {
  display: none;
}

.prev5 img,
.next5 img {
  width: .16rem;
  height: .13rem;
  object-fit: contain;
  transition: all .3s;
}

.prev5:hover img,
.next5:hover img {
  filter: brightness(0) invert(1);
}

.prev5 {
  left: -.75rem;
}

.next5 {
  right: -.75rem
}

.next5 img {
  transform: rotate(180deg);
}