.newslist{}
.newslist ul{margin:0 0 0 -2%;}
.newslist ul li{float:left;width:31.333333%;margin:0 0 20px 2%;cursor:pointer;position:relative;box-sizing:border-box;}
.newslist ul li .pic{display:block;overflow:hidden;width:100%;position:relative;}
.newslist ul li .pic img{width:100%;display:block;transition:all 0.3s ease 0s;}
.newslist ul li .pic::before{content:'';position:absolute;z-index:20;left:13px;top:13px;right:13px;bottom:13px;border:2px solid #F1F7F5;opacity:0;-webkit-transition: opacity 0.2s, -webkit-transform 0.35s;transition:opacity 0.2s, transform 0.35s;-webkit-transform:scale(0);transform:scale(0);}
.newslist ul li .pic::after{content:'';position:absolute;left:0;top:0;width:100%;height:100%;background:rgba(0,0,0,0.5) url("https://okki-shop.oss-cn-hangzhou.aliyuncs.com/114/upload/sort/0c30bc2e0e58d2de5034b5a019bd155c4531e1999e26378c0f97a1dfc693a511.png");background-repeat:no-repeat;background-position:center;display:block;opacity:0;-webkit-transition: opacity 0.2s, -webkit-transform 0.35s;transition:opacity 0.2s, transform 0.35s;-webkit-transform:scale(0);transform:scale(0);}

.newslist ul li .t{padding:20px;background:#F4F4F4;}
.newslist ul li .t h5{font-size:22px;overflow:hidden;color:#100f0f;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;margin:0;}
.newslist ul li .t h5 a{font-size:22px;font-weight:bold;}
.newslist ul li .t h5 a:hover{color:var(--active-color);}
.newslist ul li .t span{background:url("https://okki-shop.oss-cn-hangzhou.aliyuncs.com/114/upload/sort/b6cb799892439e24ccf29cefac0a04dc134b2dea96adfa13dd361ead8474954f.png") no-repeat left center;padding:0 0 0 20px;display:block;font-size:14px;color:#777;margin:10px 0 0;}
.newslist ul li .t p{font-size:18px;color:#6e6e6e;margin:10px 0 0;line-height:22px;height:66px;overflow:hidden;}
.newslist ul li .pic:hover img{transform: scale(1.05);-webkit-transform: scale(1.05);}

.newslist ul li:hover .pic::before{opacity:1;-webkit-transform:scale(1);transform:scale(1);}
.newslist ul li:hover .pic::after{opacity:1;-webkit-transform:scale(1);transform:scale(1);}

@media screen and (max-width: 1300px) {
  .newslist ul li .t h5 a {
    font-size: 20px;
  }
  .newslist ul li .t p {
    font-size: 16px;
  }
}

@media screen and (max-width: 768px) {
  .newslist ul li {
    width: 48%;
  }
  .newslist ul li .t h5 a {
    font-size: 18px;
  }
  .newslist ul li .t p {
    font-size: 14px;
  }
}

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