.service-page{clear:both; padding-top:0px; }

.itemThumb{width:100%; float:left; position:relative; padding:0px;}
.itemThumb .wrap-img{width:100%; float:left; position:relative; margin-bottom:20px;}
.itemThumb .wrap-img a.nav-img{width:100%; float:left; position:relative;}
.itemThumb .wrap-img a.nav-img:before{content:''; padding-top:70%; display:block;}
.itemThumb .wrap-img a.nav-img .inner{position:absolute; top:0; left:0; z-index:1; width:100%; height:100%; overflow:hidden; border-radius:12px;}
.itemThumb .wrap-img a.nav-img .inner img{width:inherit; height:inherit; object-fit:cover}
.itemThumb .wrap-info{width:100%; float:left; position:relative;}
.itemThumb .wrap-info .wrap-attr{position:relative; left:0;  margin-top:0px; margin-bottom:15px; z-index:2; background:#fff; display:flex; font-size:14px;  padding-right:20px; border-radius: 0 10px 0 0; }
.itemThumb .wrap-info .wrap-attr .ele{font-size:13px; color:rgba(0,0,0,.7); position:relative;}
.itemThumb .wrap-info .wrap-attr .ele b{font-weight:normal}
.itemThumb .wrap-info .wrap-attr .ele:first-of-type{padding-right:15px; margin-right:15px;}
.itemThumb .wrap-info .wrap-attr .ele:first-of-type span{display:none;}
.itemThumb .wrap-info .wrap-attr .ele:first-of-type:after{content:''; width:1px; height:15px; background:#000; position:absolute; top:3px; right:0; opacity:.5 }
.itemThumb .wrap-info .wrap-attr .ele:last-of-type b{font-weight:600; color:#000; padding-right:5px;}
.itemThumb .wrap-info a.name{width:100%; float:left; position:relative; color:#000; transition:.3s;}
.itemThumb .wrap-info a.name:hover{color:var(--color2)}
.itemThumb .wrap-info a.name h3{margin:0; padding:0; font-size:18px; font-weight:600; line-height:25px; }
.itemThumb .wrap-info .detail{width:100%; float:left; color:rgba(0,0,0,.75); font-size:16px; line-height:25px; padding-top:10px; -webkit-line-clamp: 3; -webkit-box-orient: vertical; white-space: normal; overflow: hidden; text-overflow: ellipsis;display: -webkit-box;}

@media (max-width:767px){
    .service-page{padding-bottom:0;}
} 

ul.listInfo{width:calc(100% + 30px); margin:0px 0 0 -15px; padding:0; list-style:none; float:left; position:relative; z-index:5;}
ul.listInfo li{float:left; margin-top:30px; padding: 0 15px; position:relative;float:left; }

@media (max-width: 767px){
    ul.listInfo{margin-top:0px;}
}

@media (min-width: 768px) and (max-width: 991px){
     ul.listInfo li{width:50%;}
}

@media (min-width: 992px) and (max-width: 1199px){
     ul.listInfo li{width:33.3333333333333%;}
}
@media (min-width: 1200px) and (max-width: 1439px) {
    ul.listInfo li{width:33.3333333333333%;}
}
@media (min-width: 1440px){
    ul.listInfo li{width:25%;}
}

.view-moreList{width:100%; float:left; position:relative; text-align:center; margin-top:30px;}
.view-moreList:before{content:''; width:100%; height:1px; background:#000; position:absolute; top:50%; left:0px; z-index:1; opacity:.1}
.view-moreList a{position:relative; background:var(--color2); width:initial; line-height:42px; padding: 0 20px; border-radius:25px; color:#fff; font-size:15px; font-weight:normal; transition:.3s; display:inline-block; margin: 0 auto; z-index:2; box-shadow: 0 0 0 5px #fff; text-decoration:none;}
.view-moreList a span{font-weight:600; padding: 0 5px;}
.view-moreList a:hover{color:#fff; background:var(--color2)}