.home-procate{margin:20px 0 70px}
.procate-list{display:flex;flex-wrap:wrap}
.procate-list .procate-item{z-index:99;width:22%;margin-right:4%;background:#FFFFFF;box-shadow:0 3px 18px 0 rgba(0,0,0,.16);transition:all .1s linear;overflow:hidden;border-radius:5px}
.procate-list .procate-item:hover{box-shadow:0 3px 18px 0 rgba(0,0,0,.24)}
.procate-list .procate-item:hover .procate-img img{transform:scale(1.02)}
.procate-list .procate-item:hover .procate-title a{color:var(--color)}
.procate-list .procate-item:nth-child(4){margin-right:0px}
.procate-list .procate-item .procate-img{max-height:360px;min-height:180px;position:relative;display:flex;align-items:center;justify-content:center}
.procate-list .procate-item .procate-img .tags{position:absolute;top:0px;left:0px;background:rgba(0,0,0,.24);color:#FFFFFF;padding:2px 8px;z-index:1;border-radius:5px 0 0 0;text-transform:lowercase;font-size:var(--fontsize14)}
.procate-list .procate-item .procate-img img{width:100%;height:100%;object-fit:cover}
.procate-list .procate-item .procate-title{height:80px;display:flex;align-items:center;padding:10px 20px}
.procate-list .procate-item .procate-title a{display:inline-block;width:100%;font-size:var(--fontsize18);font-weight:var(--fontbold5);color:var(--fontcolor);line-height:1.3;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
@media(max-width:1366px){.home-procate{margin-top:30px}}
@media(max-width:768px){.home-procate{margin:10px 0 40px}
.procate-list{justify-content:space-between}
.procate-list .procate-item{width:48%;margin-bottom:20px;margin-right:0px}}
@media(max-width:450px){.procate-list .procate-item .procate-title{height:66px;padding:4px 10px}
.procate-list .procate-item .procate-title a{font-size:var(--fontsize16)}
.procate-list .procate-item .procate-img{max-height:300px}}