.public_w {
  max-width: 1520px;
  width: 85%;
  margin: 0 auto;
}
* {
  margin: 0;
  padding: 0;
}
/* 产品中心 */
.pro {
  width: 100%;
}
.pro .pro_cont {
  width: 100%;
  background: #F4F4F4;
  padding-top: calc(20px + 5rem);
  padding-bottom: calc(20px + 4rem);
}
.pro .pro_cont > .public_w {
  width: 85%;
  display: flex;
  justify-content: space-between;
  /* border: 1px solid #000; */
}
.pro .pro_cont > .public_w .product_left {
  width: 22.76%;
}
.pro .pro_cont > .public_w .product_left > p {
  width: 100%;
  height: calc(30px + 2rem);
  display: flex;
  align-items: center;
  background: #1D5D9F;
  border-radius: 4px 4px 0px 0px;
  padding-left: calc(10px + 0.8rem);
  font-family: OPPOSans-B;
  font-size: calc(10px + 0.7rem);
  color: #FFFFFF;
}
.pro .pro_cont > .public_w .product_left > ul {
  width: 100%;
  background: #fff;
  padding-left: calc(10px + 0.8rem);
  padding-right: calc(10px + 0.95rem);
  padding-top: calc(10px + 0.65rem);
}
.pro .pro_cont > .public_w .product_left > ul > .lis1 {
  width: 100%;
  margin-top: calc(10px + 0.8rem);
  padding-bottom: calc(10px + 1rem);
  border-bottom: 1px solid #E5E5E5;
}
.pro .pro_cont > .public_w .product_left > ul > .lis1 .a11 {
  width: 100%;
}
.pro .pro_cont > .public_w .product_left > ul > .lis1 .a11 .one {
  font-family: OPPOSans-B;
  font-size: calc(10px + 0.3rem);
  color: #1E2737;
  line-height: calc(10px + 0.9rem);
  display: flex;
  align-items: center;
  justify-content: space-between;
  /* margin-bottom: calc(10px + 1.1rem); */
  /* padding-right: 20.82%; */
}
.pro .pro_cont > .public_w .product_left > ul > .lis1 .a11 .one > span {
  width: 85%;
  font-family: OPPOSans-B;
  font-size: calc(10px + 0.3rem);
  color: #1E2737;
  line-height: calc(10px + 0.9rem);
  transition: all 0.3s;
}
.pro .pro_cont > .public_w .product_left > ul > .lis1 .a11:hover .one > span{
    color: #1D5D9F;
}
.pro .pro_cont > .public_w .product_left > ul > .lis1.hover .a11 .one > span{
    color: #1D5D9F;
}

.pro .pro_cont > .public_w .product_left > ul > .lis1 .a11 .one em {
  /* float: right; */
  display: block;
  width: 20px;
  height: 20px;
  background: url('../image/pro_icon1.png') no-repeat;
  background-position-x: 50%;
  background-position-y: 50%;
  cursor: pointer;
  background-size: 45%;
}
.pro .pro_cont > .public_w .product_left > ul > .lis1 .emm .one > span {
  color: #1D5D9F;
}
.pro .pro_cont > .public_w .product_left > ul > .lis1 .uls2 {
  width: 100%;
  margin-top: calc(10px + 1.1rem);
  display: flex;
  flex-direction: column;
  /* border: 1px solid #000; */
  display: none;
}
.pro .pro_cont > .public_w .product_left > ul > .lis1 .uls2 .lis2 {
  width: 100%;
  margin-bottom: calc(10px + 0.95rem);
}
.pro .pro_cont > .public_w .product_left > ul > .lis1 .uls2 .lis2 > a {
  width: 100%;
  display: flex;
  align-items: center;
  font-family: OPPOSans-R;
  font-size: calc(4px + 0.5rem);
  color: #1E2737;
}
.pro .pro_cont > .public_w .product_left > ul > .lis1 .uls2 .lis2 > a > span {
  width: 6px;
  height: 6px;
  background: #D2D2D2;
  border-radius: 50%;
  margin-right: 0.65rem;
}
.pro .pro_cont > .public_w .product_left > ul > .lis1 .uls2 .lis2:nth-last-of-type(1) {
  margin-bottom: 0;
}
.pro .pro_cont > .public_w .product_left > ul > .lis1 .uls2 .lis2 > a:hover {
  color: #1D5D9F;
}
.pro .pro_cont > .public_w .product_left > ul > .lis1 .uls2 .lis2 > a:hover > span {
  background: #1D5D9F;
}
.pro .pro_cont > .public_w .product_left > ul > .lis1 .uls2 .lis2.hover > a {
  color: #1D5D9F;
}
.pro .pro_cont > .public_w .product_left > ul > .lis1 .uls2 .lis2.hover > a > span {
  background: #1D5D9F;
}
.pro .pro_cont > .public_w .product_left > ul > .lis1 .emm .one em {
  background: url('../image/pro_icon.png') no-repeat;
  background-position-x: 50%;
  background-position-y: 50%;
  background-size: 45%;
}
.pro .pro_cont > .public_w .product_left > ul > .lis1.hover > a .one {
  color: #1D5D9F;
}
.pro .pro_cont > .public_w .product_r {
  width: 74.73%;
  display: flex;
  flex-direction: column;
  /* border: 1px solid #f00; */
}
.pro .pro_cont > .public_w .product_r > p {
  font-family: OPPOSans-M;
  font-size: calc(10px + 0.7rem);
  color: #1E2737;
  margin-bottom: calc(10px + 0.75rem);
}
.pro .pro_cont > .public_w .product_r .pro_ul {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  gap: 1.936%;
  margin-bottom: 0.75rem;
}
.pro .pro_cont > .public_w .product_r .pro_ul .pro_li {
  width: 32.04%;
  margin-bottom: calc(15px + 1.5rem);
}
.pro .pro_cont > .public_w .product_r .pro_ul .pro_li > a {
  width: 100%;
}
.pro .pro_cont > .public_w .product_r .pro_ul .pro_li > a .pro_card {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.pro .pro_cont > .public_w .product_r .pro_ul .pro_li > a .pro_card .pro_pic {
  width: 100%;
  /*height: calc(60px + 15rem);*/
  background: #FFFFFF;
  border-radius: 4px;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  overflow: hidden;
}
.pro .pro_cont > .public_w .product_r .pro_ul .pro_li > a .pro_card .pro_pic > img {
    width: 100%;
  /*height: calc(80px + 10rem);*/
  transition: 0.5s;
}
.pro .pro_cont > .public_w .product_r .pro_ul .pro_li > a .pro_card .pro_pic > div:nth-of-type(1) {
  position: absolute;
  width: calc(40px + 5rem);
  height: calc(40px + 5rem);
  /* border: 1px solid #000; */
  z-index: 100;
  top: -20%;
  right: -20%;
  transition: background-color 1s ease;
  border-radius: 50%;
  overflow: hidden;
}
.pro .pro_cont > .public_w .product_r .pro_ul .pro_li > a .pro_card .pro_pic > div:nth-of-type(1) > p {
  display: block;
  position: absolute;
  width: 10px;
  height: 10px;
  background: #1D5D9F;
  top: 0;
  right: 0;
  /* transform: translate(-50%,-50%); */
  transition: all 0.8s;
  border-radius: 50%;
  margin-top: 0;
}
.pro .pro_cont > .public_w .product_r .pro_ul .pro_li > a .pro_card .pro_pic > div:nth-of-type(1) > img {
  position: absolute;
  bottom: calc(10px + 1.35rem);
  left: calc(10px + 0.75rem);
  z-index: 200;
  width: calc(10px + 1rem);
}
.pro .pro_cont > .public_w .product_r .pro_ul .pro_li > a .pro_card .pro_pic > div:nth-of-type(2) {
  width: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  align-items: center;
  justify-content: center;
}
.pro .pro_cont > .public_w .product_r .pro_ul .pro_li > a .pro_card .pro_pic > div:nth-of-type(2) > img {
  width: 74%;
}
.pro .pro_cont > .public_w .product_r .pro_ul .pro_li > a .pro_card .pro_pic:hover > img {
  transform: scale(1.05);
}
.pro .pro_cont > .public_w .product_r .pro_ul .pro_li > a .pro_card p {
  font-family: OPPOSans-R;
  font-weight: normal;
  font-size: calc(8px + 0.5rem);
  color: #1E2737;
  text-align: center;
  margin-top: calc(10px + 1rem);
}
.pro .pro_cont > .public_w .product_r .pro_ul .pro_li > a .pro_card:hover .pro_pic > div:nth-of-type(1) > p {
  width: calc(100px + 5rem);
  height: calc(100px + 5rem);
}
/* 产品详情 */
.pro_read {
  width: 100%;
}
.pro_read .pro_read_cont {
  width: 100%;
  background: #F4F4F4;
  padding-top: calc(20px + 5rem);
  padding-bottom: calc(20px + 4rem);
}
.pro_read .pro_read_cont .public_w {
  width: 85%;
  display: flex;
  flex-direction: column;
  /* border: 1px solid #000; */
  /* 热门推荐 */
}
.pro_read .pro_read_cont .public_w .pro_read_cont1 {
  width: 100%;
  display: flex;
  justify-content: space-between;
}
.pro_read .pro_read_cont .public_w .pro_read_cont1 > .l {
  width: 46.05%;
  background: #FFFFFF;
  /* border: 1px solid #000; */
}
.pro_read .pro_read_cont .public_w .pro_read_cont1 > .l .swiper2 {
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.pro_read .pro_read_cont .public_w .pro_read_cont1 > .l .swiper2 .swiper-slide {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  /*padding: calc(55px + 2.5rem) 0;*/
  position: relative;
}
.pro_read .pro_read_cont .public_w .pro_read_cont1 > .l .swiper2 .swiper-slide > img {
  /*width: calc(64px + 15rem);*/
  /*height: calc(87px + 20rem);*/
  /* transform: scale(1.8); */
  width: 100%;
}
.pro_read .pro_read_cont .public_w .pro_read_cont1 > .l .swiper2 .swiper-slide > div {
  position: absolute;
  width: 100%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  align-items: center;
  justify-content: center;
}
.pro_read .pro_read_cont .public_w .pro_read_cont1 > .l .swiper2 .swiper-slide > div > img {
  width: 74%;
}
.pro_read .pro_read_cont .public_w .pro_read_cont1 > .r {
  width: 46.71%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  /* border: 1px solid #000; */
}
.pro_read .pro_read_cont .public_w .pro_read_cont1 > .r > p {
  font-family: OPPOSans-M;
  font-size: calc(10px + 1.3rem);
  color: #333333;
  margin-bottom: calc(10px + 1.35rem);
}
.pro_read .pro_read_cont .public_w .pro_read_cont1 > .r > span {
  width: 100%;
  height: 1px;
  background: #D2D2D2;
  margin-bottom: calc(10px + 1.9rem);
}
.pro_read .pro_read_cont .public_w .pro_read_cont1 > .r > ul {
  width: 100%;
  display: flex;
  flex-direction: column;
}
.pro_read .pro_read_cont .public_w .pro_read_cont1 > .r > ul > li {
  width: 100%;
  display: flex;
  align-items: center;
  font-family: OPPOSans-R;
  font-size: calc(10px + 0.5rem);
  color: #30333B;
  opacity: 0.9;
  margin-bottom: calc(10px + 1.5rem);
}
.pro_read .pro_read_cont .public_w .pro_read_cont1 > .r > ul > li:nth-last-of-type(1) {
  margin-bottom: 0;
}
.pro_read .pro_read_cont .public_w .pro_read_cont1 > .r > .swiper {
  width: 100%;
  /*height: calc(58px + 5rem);*/
  margin-top: calc(17px + 2rem);
}
.pro_read .pro_read_cont .public_w .pro_read_cont1 > .r > .swiper .swiper-slide {
  height: 100%;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  /* padding: calc(5px + 1rem) 0; */
  /* border: 1px solid #000; */
}
.pro_read .pro_read_cont .public_w .pro_read_cont1 > .r > .swiper .swiper-slide>img{
    width: 100%;
}
.pro_read .pro_read_cont .public_w .pro_read_cont1 > .r > .swiper .swiper-slide::after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: #384654;
  opacity: 0;
  transition: all 0.3s;
}
.pro_read .pro_read_cont .public_w .pro_read_cont1 > .r > .swiper .swiper-slide.swiper-slide-thumb-active::after {
  opacity: 0.3;
}
.pro_read .pro_read_cont .public_w .pro_read_cont1 > .r > div:nth-of-type(2) {
  width: 100%;
  display: flex;
  align-items: center;
  margin-top: calc(15px + 2rem);
}
.pro_read .pro_read_cont .public_w .pro_read_cont1 > .r > div:nth-of-type(2) > a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: calc(100px + 5rem);
  height: calc(30px + 1.5rem);
  font-family: Microsoft YaHei;
  font-weight: 400;
  font-size: calc(10px + 0.5rem);
  border-radius: calc(30px + 1.5rem);
}
.pro_read .pro_read_cont .public_w .pro_read_cont1 > .r > div:nth-of-type(2) > a > img {
  margin-right: 0.6rem;
}
.pro_read .pro_read_cont .public_w .pro_read_cont1 > .r > div:nth-of-type(2) > a:nth-child(1) {
  color: #555555;
  border: 1px solid #B8B8B8;
  margin-right: calc(10px + 0.75rem);
}
.pro_read .pro_read_cont .public_w .pro_read_cont1 > .r > div:nth-of-type(2) > a:nth-child(1) > img {
  width: calc(10px + 0.5rem);
}
.pro_read .pro_read_cont .public_w .pro_read_cont1 > .r > div:nth-of-type(2) > a:nth-child(2) {
  color: #fff;
  background: #1D5D9F;
}
.pro_read .pro_read_cont .public_w .pro_read_cont1 > .r > div:nth-of-type(2) > a:nth-child(2) > img {
  width: calc(10px + 0.6rem);
}
.pro_read .pro_read_cont .public_w > span {
  width: 100%;
  height: 1px;
  background: #D2D2D2;
  margin-top: calc(21px + 3.5rem);
  margin-bottom: calc(26px + 3.5rem);
}
.pro_read .pro_read_cont .public_w .pro_read_cont2 {
  width: 100%;
  display: flex;
  flex-direction: column;
}
.pro_read .pro_read_cont .public_w .pro_read_cont2 .hot_top {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: calc(17px + 2rem);
}
.pro_read .pro_read_cont .public_w .pro_read_cont2 .hot_top > p {
  font-family: OPPOSans-M;
  font-size: calc(16px + 1.5rem);
  color: #1E2737;
}
.pro_read .pro_read_cont .public_w .pro_read_cont2 .hot_top > div {
  width: calc(50px + 3.25rem);
  height: calc(16px + 1.5rem);
  position: relative;
  /* border: 1px solid #000; */
}
.pro_read .pro_read_cont .public_w .pro_read_cont2 .hot_top > div > div {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 500;
  display: flex;
  align-items: center;
  justify-content: space-between;
  /* border: 1px solid #000; */
}
.pro_read .pro_read_cont .public_w .pro_read_cont2 .hot_top > div > div .swiper-button-prev::after,
.pro_read .pro_read_cont .public_w .pro_read_cont2 .hot_top > div > div .swiper-button-next::after {
  content: '';
  /* width: calc(16px + 1.5rem);
                            height: calc(16px + 1.5rem); */
  /* border-radius: 50%; */
  /* border: 1px solid #000; */
}
.pro_read .pro_read_cont .public_w .pro_read_cont2 .hot_top > div > div .swiper-button-prev,
.pro_read .pro_read_cont .public_w .pro_read_cont2 .hot_top > div > div .swiper-button-next {
  width: calc(16px + 1.5rem);
  height: calc(16px + 1.5rem);
  border-radius: 50%;
  border: 1px solid #1D5D9F;
  color: #1D5D9F;
}
.pro_read .pro_read_cont .public_w .pro_read_cont2 .hot_top > div > div .swiper-button-prev > i,
.pro_read .pro_read_cont .public_w .pro_read_cont2 .hot_top > div > div .swiper-button-next > i {
  font-size: calc(10px + 0.5rem);
}
.pro_read .pro_read_cont .public_w .pro_read_cont2 .hot_top > div > div .swiper-button-prev {
  left: 0;
}
.pro_read .pro_read_cont .public_w .pro_read_cont2 .hot_top > div > div .swiper-button-next {
  right: 0;
}
.pro_read .pro_read_cont .public_w .pro_read_cont2 .hot_top > div > div .swiper-button-next > i {
  transform: rotateX(180deg);
}
.pro_read .pro_read_cont .public_w .pro_read_cont2 .hot_top > div > div .swiper-button-disabled {
  border: 1px solid #B5B5B5;
  color: #B5B5B5;
}
.pro_read .pro_read_cont .public_w .pro_read_cont2 .swiper3 {
  width: 100%;
  overflow: hidden;
}
.pro_read .pro_read_cont .public_w .pro_read_cont2 .swiper3 .swiper-slide {
  width: 100%;
}
.pro_read .pro_read_cont .public_w .pro_read_cont2 .swiper3 .swiper-slide > a {
  width: 100%;
}
.pro_read .pro_read_cont .public_w .pro_read_cont2 .swiper3 .swiper-slide > a .pro_card {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.pro_read .pro_read_cont .public_w .pro_read_cont2 .swiper3 .swiper-slide > a .pro_card .pro_pic {
  width: 100%;
  height: calc(60px + 15rem);
  background: #FFFFFF;
  border-radius: 4px;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  overflow: hidden;
}
.pro_read .pro_read_cont .public_w .pro_read_cont2 .swiper3 .swiper-slide > a .pro_card .pro_pic > img {
  /*height: calc(80px + 10rem);*/
  width: 100%;
  transition: 0.5s;
}
.pro_read .pro_read_cont .public_w .pro_read_cont2 .swiper3 .swiper-slide > a .pro_card .pro_pic > div:nth-of-type(1) {
  position: absolute;
  width: calc(40px + 5rem);
  height: calc(40px + 5rem);
  /* border: 1px solid #000; */
  z-index: 100;
  top: -20%;
  right: -20%;
  transition: background-color 1s ease;
  border-radius: 50%;
  overflow: hidden;
}
.pro_read .pro_read_cont .public_w .pro_read_cont2 .swiper3 .swiper-slide > a .pro_card .pro_pic > div:nth-of-type(1) > p {
  display: block;
  position: absolute;
  width: 10px;
  height: 10px;
  background: #1D5D9F;
  top: 0;
  right: 0;
  /* transform: translate(-50%,-50%); */
  transition: all 0.8s;
  border-radius: 50%;
  margin-top: 0;
}
.pro_read .pro_read_cont .public_w .pro_read_cont2 .swiper3 .swiper-slide > a .pro_card .pro_pic > div:nth-of-type(1) > img {
  position: absolute;
  bottom: calc(10px + 1.35rem);
  left: calc(10px + 0.75rem);
  z-index: 200;
  width: calc(10px + 1rem);
}
.pro_read .pro_read_cont .public_w .pro_read_cont2 .swiper3 .swiper-slide > a .pro_card .pro_pic > div:nth-of-type(2) {
  position: absolute;
  width: 100%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  align-items: center;
  justify-content: center;
}
.pro_read .pro_read_cont .public_w .pro_read_cont2 .swiper3 .swiper-slide > a .pro_card .pro_pic > div:nth-of-type(2) > img {
  width: 74%;
}
.pro_read .pro_read_cont .public_w .pro_read_cont2 .swiper3 .swiper-slide > a .pro_card .pro_pic:hover > img {
  transform: scale(1.05);
}
.pro_read .pro_read_cont .public_w .pro_read_cont2 .swiper3 .swiper-slide > a .pro_card p {
  font-family: OPPOSans-R;
  font-weight: normal;
  font-size: calc(8px + 0.5rem);
  color: #1E2737;
  text-align: center;
  margin-top: calc(10px + 1rem);
}
.pro_read .pro_read_cont .public_w .pro_read_cont2 .swiper3 .swiper-slide > a .pro_card:hover .pro_pic > div:nth-of-type(1) > p {
  width: calc(100px + 5rem);
  height: calc(100px + 5rem);
}
@media screen and (max-width: 1100px) {
  /* 产品中心 */
  .pro .pro_cont > .public_w {
    flex-direction: column;
  }
  .pro .pro_cont > .public_w .product_left {
    width: 100%;
  }
  .pro .pro_cont > .public_w .product_left > ul {
    display: none;
  }
  .pro .pro_cont > .public_w .product_left > ul > .lis1 .uls2 .lis2 > a {
    margin-left: 10px;
    font-size: calc(10px + 0.5rem);
  }
  .pro .pro_cont > .public_w .product_r {
    width: 100%;
    margin-top: calc(10px + 2rem);
  }
  .pro .pro_cont > .public_w .product_r .pro_ul {
    gap: 4%;
  }
  .pro .pro_cont > .public_w .product_r .pro_ul .pro_li {
    width: 48%;
  }
  .pro .pro_cont > .public_w .product_r .pro_ul .pro_li > a .pro_card .pro_pic {
    height: 100%;
    padding: calc(10px + 5rem) 0;
  }
  /* 产品详情 */
  .pro_read .pro_read_cont .public_w {
    /* 热门推荐 */
  }
  .pro_read .pro_read_cont .public_w .pro_read_cont1 {
    flex-direction: column;
  }
  .pro_read .pro_read_cont .public_w .pro_read_cont1 > .l {
    width: 100%;
  }
  .pro_read .pro_read_cont .public_w .pro_read_cont1 > .r {
    width: 100%;
    margin-top: calc(10px + 2rem);
  }
  .pro_read .pro_read_cont .public_w .pro_read_cont1 > .r > .swiper {
    height: 100%;
  }
  .pro_read .pro_read_cont .public_w .pro_read_cont1 > .r > .swiper .swiper-slide {
    height: 100%;
    padding: calc(10px + 3rem) 0;
  }
  .pro_read .pro_read_cont .public_w .pro_read_cont2 .swiper3 .swiper-slide > a .pro_card .pro_pic {
    height: 100%;
    padding: calc(10px + 2.5rem) 0;
  }
}