.prolist-top{padding:80px 0;background:#F5F5F5;}
.prolist-top .tit{display:-webkit-flex;display:flex;-webkit-justify-content:space-between;justify-content:space-between;-webkit-align-items:flex-end;align-items:flex-end;}
.prolist-top .tit h3{font-size:48px;color:#000;line-height:1;font-weight:700;text-transform:uppercase;}
.prolist-top .tit .swiper-pagination{width:auto;position:static;}
.prolist-top .tit .swiper-pagination-bullet{width:19px;height:19px;margin:0 0 0 10px;border:1px solid #747474;background:transparent;border-radius:50%;opacity:1;}
.prolist-top .tit .swiper-pagination-bullet-active{background:var(--active-color);border-color:var(--active-color);}

.prolist-top .list{margin:70px 0 0;}
.prolist-top .swiper-slide{background:#fff;display:-webkit-flex;display:flex;-webkit-align-items:center;align-items:center;}
.prolist-top .swiper-slide .pic{width:47.8%;}
.prolist-top .swiper-slide .txt{-webkit-flex:1;flex:1;padding:0 80px;}
.prolist-top .swiper-slide .txt h5{font-size:30px;color:#000;font-weight:600;}
.prolist-top .swiper-slide .txt h5 a{color:#000;display:block;}
.prolist-top .swiper-slide .txt .t{font-size:18px;color:#717171;font-weight:300;margin:30px 0 0;}
.prolist-top .swiper-slide .txt .t h6{color:#000;font-weight:600;}
.prolist-top .swiper-slide .txt .t h6~h6{margin-top:30px;}
.prolist-top .swiper-slide .txt .more{margin:30px auto 0 0;width:200px;height:60px;line-height:60px;background:#248506;border-radius:35px;display:block;font-size:18px;color:#fff;font-weight:300;text-align:center;}

.prolist-top .list .swiper-pagination{width:100%;position:static;margin-top:20px;text-align:cente;}
.prolist-top .list .swiper-pagination-bullet{width:12px;height:12px;margin:0 3px;border:1px solid #747474;background:transparent;border-radius:50%;opacity:1;}
.prolist-top .list .swiper-pagination-bullet-active{background:var(--active-color);border-color:var(--active-color);}


.prolist-box{padding:70px 0;}
.prolist-box h2{font-size:48px;color:#000;line-height:1;font-weight:700;text-align:center;}

.prolist-nav{margin-top:45px;display:-webkit-flex;display:flex;-webkit-justify-content:center;justify-content:center;-webkit-flex-wrap:wrap;flex-wrap:wrap;}
.prolist-nav li{font-size:24px;color:#7c7c7c;font-weight:300;}
.prolist-nav li+li{margin-left:90px;}
.prolist-nav li a{color:#7c7c7c;}
.prolist-nav li.active a{color:var(--active-color);}

.prolist ul {
  margin: 0 0 0 -2%;
}
.prolist ul li {
  width: 31.333333333%;
  float: left;
  text-align: center;
  background: #fff;
  margin: 0 0 20px 2%;
  cursor: pointer;
  box-sizing: border-box
}
.prolist ul li .pic {
  display: block;
  width: 100%;
  overflow: hidden;
  box-sizing: border-box;
  border: 1px solid #c9c9c9;
  padding: 5px;
  display: -webkit-inline-flex;
  display: inline-flex;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-align-items: center;
  align-items: center
}
.prolist ul li .pic img {
  max-width: 90%;
  max-height: 90%;
  display: block;
  transition: all .3s ease 0s;
  -webkit-transition: all .3s ease 0s
}
.prolist ul li .t {
  background: #455164;
  text-align: center;
  padding: 20px 10px
}
.prolist ul li .t h6 {
  font-size: 16px;
  font-weight: 300;
  color: #fff;
  height: 60px;
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center;
  align-items: center;
  -webkit-justify-content: center;
  justify-content: center;
  text-align: center
}
.prolist ul li:hover .pic {
  border: 1px solid #dedede;
  box-shadow: 5px 5px 40px rgba(0,0,0,.2)
}
.prolist ul li:hover .pic img {
  transform: scale(1.06);
  -webkit-transform: scale(1.06);
}
.prolist ul li:hover .t {
  background: var(--bg-color);
}
.prolist li a:hover {
  color: white;
}

.videolist{margin-top: 20px}
.videolist ul{margin:0 0 0 -2%;}
.videolist ul li{float:left;width:31.333333%;margin:0 0 25px 2%;}
.videolist ul li .v{position:relative;width:100%;display:block;overflow:hidden;}
.videolist ul li .v img{width:100%;display:block;transition:all 0.3s ease 0s;-webkit-transition:all 0.3s ease 0s;}
.videolist ul li .v::after{content:'';position:absolute;left:0;top:0;width:100%;height:100%;background:rgba(0,0,0,0.2) url("https://shopcdnpro.xiaoman.cn/template/33_DMK_50/images/video.png") no-repeat center;display:block;}
.videolist ul li .t{padding:15px 10px;background:#F3F4F7;box-sizing:border-box;position:relative;min-height: 131px;}
.videolist ul li .t h5{
  font-size:17px;color:#333;text-align:center; display: -webkit-box;
  overflow: hidden;
  white-space: normal !important;
  text-overflow: ellipsis;
  word-wrap: break-word;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;}
.videolist ul li:hover .v::after{background-color:rgba(0,0,0,0.5);}
.videolist ul li:hover img{transform:scale(1.05);-webkit-transform: scale(1.05);}


@media screen and (max-width: 540px){
  .videolist ul li {
    width: 48%;
  }
  .videolist ul li .t {
    min-height: 81px;
  }
  .videolist ul li .t h5 {
    margin: 10px 0;
  }
  
  .prolist-box h2{
  font-size:24px;
  }
}

@media screen and (max-width: 335px){
  .videolist ul {
    margin: 0;
  }
  .videolist ul li {
    width: 100%;
    margin: 0 0 15px;
  }
}