@keyframes float {
  0% {
    opacity: 1;
  }
  20% {
    transform: translate(0.05rem, 0.1rem);
  }
  40% {
    transform: translate(0.1rem, -0.1rem);
  }
  60% {
    transform: translate(0, -0.1rem);
  }
  80% {
    transform: translate(-0.05rem, 0.1rem);
  }
  100% {
    transform: translate(0, 0);
  }
}

@keyframes scaleFloat {
  0% {
    opacity: 1;
    transform: scale(1);
  }
  20% {
    transform: translate(0.05rem, 0.05rem) scale(1.1);
  }
  40% {
    transform: translate(0.05rem, -0.05rem) scale(1.2);
  }
  60% {
    transform: translate(0, -0.05rem) scale(1.2);
  }
  80% {
    transform: translate(-0.05rem, 0.05rem) scale(1.1);
  }
  100% {
    transform: translate(0, 0) scale(1);
  }
}

.swiper-container {
  margin: 0px;
  padding: 0px;
  width: 100%;
  height: 100%;
}

.swiper-wrapper {
  height: 8rem;
}

.swiper-wrapper .swiper-slide {
  width: 100%;
  height: 100%;
  z-index: 99;
  overflow: hidden;
}

.quality {
  width: 100%;
  height: 100%;
}

.quality p:nth-of-type(1) {
  margin: 0;
}

.quality img {
  width: 100%;
  height: auto;
}

.quality p img:nth-child(1) {
  height: 8rem;
}

.quality video {
  width: 100%;
  height: auto;
  outline: none;
  display: block;
}

.quality div:nth-child(1) img:nth-child(2n) {
  height: 8rem;
}

.quality .pm-sub {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: .28rem;
  font-weight: 600;
  color: #333333;
}

.quality .pm-sub span {
  margin: 0 .2rem;
}

.quality .pm-sub img {
  height: .2rem;
  width: auto;
}

.quality .quality-con {
  background: #369e6d;
  box-sizing: border-box;
  padding-bottom: .4rem;
}

.quality .quality-con h4 {
  font-size: .48rem;
  font-weight: 700;
  text-align: center;
  color: #ffffff;
  padding: 1rem 0 .74rem 0;
  margin: 0;
}

.quality .quality-con .qc-top {
  display: flex;
}

.quality .quality-con .qc-top img {
  width: calc(100% / 3);
}

.quality .quality-con p {
  padding: .4rem 0;
  font-size: .22rem;
  text-align: center;
  color: #fff;
  line-height: 2;
  margin: 0;
  font-weight: 100;
}

.quality .quality-con .qc-line {
  width: 80%;
  height: 1px;
  opacity: 0.2;
  background: #ffffff;
  margin: 0 auto;
}

.quality .quality-con h3 {
  margin: .45rem 0 .34rem 0;
  opacity: 1;
  font-size: .36rem;
  text-align: center;
  color: #ffffff;
}

.quality .quality-con .qc-thumb {
  display: flex;
  justify-content: center;
  align-items: center;
}

.quality .quality-con .qc-thumb .qc-thumb-item {
  width: 4.5rem;
  margin: 0 .1rem;
}

.quality .quality-con .qc-thumb .qc-thumb-item p {
  padding: 0;
  margin-top: .1rem;
  color: white;
}

.quality .quality-main {
  width: 100%;
  background: url("/assets/img/quality_bg.jpg") no-repeat center center;
  background-size: 100% 100%;
  position: relative;
  height: 8.2rem;
}

.quality .quality-main .pm-tit {
  padding: .5rem 0 .3rem 0;
  opacity: 1;
  font-size: .4rem;
  font-weight: 700;
  color: #369e6d;
}

.quality .quality-main p {
  font-size: .18rem;
  color: #000;
  line-height: 2;
  margin: .2rem;
  font-weight: 100;
  margin-bottom: 0;
}

.quality .quality-main .pm-con {
  position: relative;
  width: 100%;
  height: 5.8rem;
}

.quality .quality-main .pm-con .pm-icon {
  position: absolute;
  left: 50%;
  bottom: 2rem;
  width: 1.8rem;
  height: auto;
  transform: translateX(-50%);
}

.quality .quality-main .pm-con .pm-con-item {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
}

.quality .quality-main .pm-con .pm-con-item .pm-con-tit {
  font-size: .28rem;
  color: #000;
  margin: 0 .3rem;
}

.quality .quality-main .pm-con .pm-con-item .pm-con-img {
  width: 1rem;
  height: 1rem;
  display: flex;
  justify-content: center;
  align-items: center;
  background: url("/assets/img/pm_bg.png") no-repeat center center;
  background-size: 100% 100%;
  animation: float 15s ease infinite;
  cursor: pointer;
}

.quality .quality-main .pm-con .pm-con-item .pm-con-img:hover {
  animation-play-state: paused;
}

.quality .quality-main .pm-con .pm-con-item .pm-con-img:hover img {
  animation-play-state: running;
}

.quality .quality-main .pm-con .pm-con-item .pm-con-img img {
  width: .5rem;
  height: .5rem;
  animation: scaleFloat 8s ease infinite;
  animation-play-state: paused;
}

.quality .quality-main .pm-con .pm-con-item:nth-child(1) {
  right: 12rem;
  top: .3rem;
}

.quality .quality-main .pm-con .pm-con-item:nth-child(1) .pm-con-img {
  animation-delay: 1s;
}

.quality .quality-main .pm-con .pm-con-item:nth-child(2) {
  left: 12rem;
  top: .3rem;
}

.quality .quality-main .pm-con .pm-con-item:nth-child(2) .pm-con-img {
  animation-delay: 2s;
}

.quality .quality-main .pm-con .pm-con-item:nth-child(3) {
  right: 12.8rem;
  top: 2.1rem;
}

.quality .quality-main .pm-con .pm-con-item:nth-child(3) .pm-con-img {
  animation-delay: 3s;
}

.quality .quality-main .pm-con .pm-con-item:nth-child(4) {
  left: 12.8rem;
  top: 2.1rem;
}

.quality .quality-main .pm-con .pm-con-item:nth-child(4) .pm-con-img {
  animation-delay: 4s;
}

.quality .quality-main .pm-con .pm-con-item:nth-child(5) {
  right: 12rem;
  top: 3.8rem;
}

.quality .quality-main .pm-con .pm-con-item:nth-child(5) .pm-con-img {
  animation-delay: 5s;
}

.quality .quality-main .pm-con .pm-con-item:nth-child(6) {
  left: 12rem;
  top: 3.8rem;
}

.quality .quality-main .pm-con .pm-con-item:nth-child(6) .pm-con-img {
  animation-delay: 6s;
}

.quality .quality-j {
  width: 100%;
  background: #fffef1;
  padding-top: .4rem;
  height: 7.8rem;
}

.quality .quality-j p {
  font-size: .22rem;
  color: #000;
  line-height: 2;
  margin: .35rem 0;
  font-weight: 100;
}

.quality .quality-j .pj-thumb {
  display: flex;
  width: 100%;
}

.quality .quality-j .pj-thumb img {
  width: auto;
  width: 25%;
}

.quality .quality-kefu {
  margin-top: 1.3rem;
  width: 100%;
  height: 6rem;
  background: #fffef1 url("/assets/img/kefu_bg.png") no-repeat center center;
  background-size: 100% 100%;
  position: relative;
}

.quality .quality-kefu .qk-con {
  position: absolute;
  bottom: 1rem;
  left: 5.4rem;
  display: flex;
  align-items: center;
}

.quality .quality-kefu .qk-con .qk-item:nth-child(2) {
  margin: 0 1.4rem 0 .8rem;
}

.quality .quality-kefu .qk-con .qk-item .qk-tit {
  font-size: .3rem;
  color: #000;
  margin-bottom: .2rem;
  font-weight: 100;
}

.quality .quality-kefu .qk-con .qk-item .qk-desc {
  font-size: .22rem;
  color: #000;
  font-weight: 100;
}

.quality .quality-kefu .qk-con .qk-item .qk-num {
  font-weight: 700;
  color: #55b53d;
}
