@font-face {
  font-family: 'Montserrat Bold Italic';
  src: url('../../fonts/MONTSERRAT-BOLDITALIC.OTF');
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Montserrat ExtraBold';
  src: url('../../fonts/MONTSERRAT-EXTRABOLD.TTF');
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Montserrat Regular';
  src: url('../../fonts/MONTSERRAT-REGULAR.OTF');
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Montserrat Medium';
  src: url('../../fonts/Montserrat-Medium-7.otf');
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Montserrat ExtraBold Italic';
  src: url('../../fonts/MONTSERRAT-EXTRABOLDITALIC.OTF');
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Montserrat Bold';
  src: url('../../fonts/MONTSERRAT-BOLD.TTF');
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Montserrat Black';
  src: url('../../fonts/MONTSERRAT-BLACKITALIC.OTF');
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Montserrat Medium Italic';
  src: url('../../fonts/MONTSERRAT-MEDIUMITALIC.OTF');
  font-style: normal;
  font-display: swap;
}
.main-con .tit-con h3 {
  font-family: "Montserrat ExtraBold";
  font-size: 0.8rem;
  line-height: 0.9rem;
  margin-bottom: 0.225rem;
}
.main-con .tit-con p {
  font-family: "Montserrat Medium";
  font-size: 0.36rem;
  line-height: 0.4018rem;
}
.banner {
  height: 10.8rem;
  background-image: url("../../image/products/cp-pro-cp600/banner.jpg");
}
.hot {
  height: 10.8rem;
  position: relative;
}
.hot .hot-item {
  color: #49019c;
  font-family: "Montserrat ExtraBold";
  position: absolute;
}
.hot .hot-item:nth-child(1) {
  left: 1.77rem;
  top: 6.25rem;
}
.hot .hot-item:nth-child(1) h3 {
  font-size: 1.7273rem;
  line-height: 0.8;
}
.hot .hot-item:nth-child(1) p {
  font-size: 0.7523rem;
  line-height: 0.7373rem;
}
.hot .hot-item:nth-child(2) {
  left: 9.1rem;
  top: 5.4rem;
}
.hot .hot-item:nth-child(2) p {
  font-size: 0.48rem;
  line-height: 0.765rem;
}
.hot .hot-item:nth-child(3) {
  width: 3.43rem;
  height: 1.31rem;
  top: 7.43rem;
  left: 8.2rem;
}
.hot .hot-item:nth-child(4) {
  top: 3.1rem;
  left: 14.47rem;
}
.hot .hot-item:nth-child(4) p {
  font-size: 0.48rem;
}
.hot .hot-item:nth-child(5) {
  top: 4.28rem;
  left: 14.51rem;
  text-align: center;
}
.hot .hot-item:nth-child(5) h3 {
  font-size: 1.4714rem;
  line-height: 0.8;
  letter-spacing: -0.1rem;
}
.hot .hot-item:nth-child(5) p {
  font-size: 0.4648rem;
  font-family: "Montserrat Medium";
}
.hot .hot-item:nth-child(6) {
  top: 7.86rem;
  left: 14.43rem;
  text-align: center;
}
.hot .hot-item:nth-child(6) p {
  font-size: 0.6183rem;
  line-height: 0.6925rem;
}
.part1 {
  height: 10.8rem;
  padding-top: 2.2rem;
  padding-left: 2.44rem;
}
.part1 .tit-con {
  color: #49019c;
}
.part1 .tit-con h3 {
  font-size: 1.6898rem;
  line-height: 1.5546rem;
  margin-bottom: 2.78rem;
}
.part1 .tit-con p {
  font-size: 0.36rem;
  line-height: 0.4018rem;
}
.part2 {
  height: 10.8rem;
  padding-top: 9.6rem;
}
.part2 .tit-con {
  text-align: center;
  color: #49019c;
}
.part3 {
  height: 10.8rem;
  padding-top: 1.6rem;
  padding-left: 1.63rem;
}
.part3 .tit-con {
  color: #49019c;
}
.part3 .tit-con h3 {
  font-size: 1.6898rem;
  line-height: 1.5546rem;
  margin-bottom: 2.2rem;
}
.part4 {
  height: 21.29rem;
  padding-top: 1.7rem;
}
.part4 .tit-con {
  text-align: center;
  color: #49019c;
}
.part4 .pro {
  display: block;
  width: 16.54rem;
  margin: 1.4rem auto 0;
}
.part5 {
  height: 10.8rem;
  padding-top: 1.05rem;
}
.part5 .tit-con {
  text-align: center;
  color: #49019c;
}
.part5 .pro {
  display: block;
  width: 16rem;
  margin: 0.7rem auto 0;
}
.part6 {
  height: 10.8rem;
  padding-top: 1.38rem;
  padding-left: 1.63rem;
}
.part6 .tit-con {
  color: #49019c;
}
.part6 .spec-con {
  display: flex;
  flex-wrap: wrap;
  column-gap: 0.5rem;
  row-gap: 0.6rem;
}
.part6 .spec-item {
  width: 5rem;
  height: 2.85rem;
  border-radius: 0.33rem;
  background-image: linear-gradient(to bottom, rgba(186, 186, 255, 0.78), rgba(224, 250, 247, 0.78));
  padding: 0.48rem 0 0.35rem 0.38rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  color: #49019c;
}
.part6 .spec-item h5 {
  font-family: "Montserrat Medium Italic";
  font-size: 0.36rem;
  line-height: 0.4rem;
}
.part6 .spec-item p {
  font-family: "Montserrat SemiBold";
  font-size: 0.36rem;
  line-height: 0.4rem;
}
.part7 {
  height: 10.8rem;
  padding-top: 0.68rem;
}
.part7 .tit-con {
  text-align: center;
  color: #49019c;
}
@media (max-width: 750px) {
  .main-con .tit-con p {
    font-size: 0.254rem;
    line-height: 0.4018rem;
  }
  .banner {
    height: 13.34rem;
    background-image: url(../../image/products/cp-pro-cp600/banner-m.jpg);
  }
  .hot {
    height: 13.34rem;
  }
  .hot .hot-item:nth-child(1) {
    left: 1.1rem;
    top: 4.25rem;
  }
  .hot .hot-item:nth-child(1) h3 {
    font-size: 0.949rem;
    line-height: 0.7628rem;
  }
  .hot .hot-item:nth-child(1) p {
    font-size: 0.4133rem;
    line-height: 0.4051rem;
  }
  .hot .hot-item:nth-child(2) {
    left: 1.4rem;
    top: 8.6rem;
  }
  .hot .hot-item:nth-child(2) p {
    font-size: 0.2637rem;
    line-height: 0.4203rem;
  }
  .hot .hot-item:nth-child(3) {
    left: 4.58rem;
    top: 6.8rem;
    width: 1.9rem;
    height: 0.72rem;
  }
  .hot .hot-item:nth-child(4) {
    left: 3.56rem;
    top: 11.1rem;
  }
  .hot .hot-item:nth-child(4) p {
    font-size: 0.48rem;
    line-height: 0.6491rem;
  }
  .hot .hot-item:nth-child(5) {
    left: 1.06rem;
    top: 9.45rem;
  }
  .hot .hot-item:nth-child(5) h3 {
    font-size: 0.915rem;
    line-height: 0.7248rem;
  }
  .hot .hot-item:nth-child(5) p {
    font-size: 0.2914rem;
    line-height: 0.3263rem;
  }
  .hot .hot-item:nth-child(6) {
    left: 0.95rem;
    top: 11.06rem;
  }
  .hot .hot-item:nth-child(6) p {
    font-size: 0.3884rem;
    line-height: 0.435rem;
  }
  .part1 {
    height: 13.34rem;
    padding-left: 0;
    padding-top: 3.4rem;
  }
  .part1 .tit-con {
    text-align: center;
  }
  .part1 .tit-con h3 {
    font-size: 0.6096rem;
    line-height: 0.6009rem;
    margin-bottom: 0.2rem;
  }
  .part1 .tit-con p {
    font-size: 0.254rem;
    line-height: 0.2619rem;
  }
  .part2 {
    height: 13.34rem;
    padding-top: 11.3rem;
  }
  .part3 {
    height: 13.34rem;
    padding-top: 1.65rem;
    padding-left: 0.73rem;
  }
  .part3 .tit-con h3 {
    font-size: 0.6096rem;
    line-height: 1;
    margin-bottom: 0.1rem;
  }
  .part4 {
    height: 13.34rem;
    padding-top: 0.65rem;
  }
  .part4 .tit-con h3 {
    font-size: 0.6096rem;
    line-height: 0.7455rem;
  }
  .part4 .pro {
    width: 6.44rem;
    margin: 0.25rem auto 0;
  }
  .part5 {
    height: 13.34rem;
    padding-top: 0.55rem;
  }
  .part5 .tit-con h3 {
    font-size: 0.6096rem;
    line-height: 0.7227rem;
  }
  .part5 .pro {
    width: 4.74rem;
    margin: 0.5rem auto 0;
  }
  .part6 {
    height: 12.28rem;
    padding-top: 1.2rem;
    padding-left: 0.78rem;
  }
  .part6 .tit-con h3 {
    font-size: 0.4572rem;
    line-height: 0.9018rem;
    margin-bottom: 0.62rem;
  }
  .part6 .spec-con {
    width: 6.05rem;
    row-gap: 0.58rem;
  }
  .part6 .spec-item {
    width: 2.7rem;
    height: 2.68rem;
    padding-left: 0.21rem;
  }
  .part6 .spec-item h5 {
    font-size: 0.2071rem;
    line-height: 0.2311rem;
  }
  .part6 .spec-item p {
    font-size: 0.2071rem;
    line-height: 0.2311rem;
  }
  .part7 {
    height: 14.4rem;
    padding-top: 3.1rem;
  }
  .part7 .tit-con h3 {
    font-size: 0.6096rem;
    line-height: 0.4844rem;
  }
}