﻿#projects::after{display:none;}
.home-cate{padding-top:4%;}
.home-cate .homecate-list{list-style:none;margin-top:3%;display:flex;}
.home-cate .homecate-list li{width:32%;margin-right:2%;margin-bottom:2em}
.home-cate .homecate-list li:nth-child(3n){margin-right:0}
.home-cate .homecate-list li .img{position:relative;display:flex;justify-content:center;align-items:center;width:100%;background:#eee;border:1px solid #eee;aspect-ratio:25/16}
.home-cate .homecate-list li .img img{width:100%;height:100%;object-fit:cover;transition:all .1s linear}
.home-cate .homecate-list li .img::after{content:"";transition:all .1s linear;position:absolute;left:0;top:0;width:100%;height:100%;background:rgba(0,0,0,.4);opacity:0}
.home-cate .homecate-list li .title{margin-top:10px;display:flex;justify-content:center;padding:4px 0}
.home-cate .homecate-list li .title a{color:var(--fontcolor);font-size:var(--fontsize18);text-transform:capitalize;transition:color .1s linear;padding-bottom:4px;border-bottom:1px solid transparent;text-align:center}
.home-cate .homecate-list li .title em{opacity:0;display:inline-block;width:0;transition:all .1s linear}
.home-cate .homecate-list li:hover .img img{transform:scale(1.02)}
.home-cate .homecate-list li:hover .img::after{opacity:1}
.home-cate .homecate-list li:hover .title a{color:var(--color);border-color:#000}
.home-cate .homecate-list li:hover .title em{margin-left:15px;opacity:1;width:20px}
@media(max-width:768px){.home-cate .homecate-list li{width: 100%;margin-right: 0;}}
.indexcatecontent{position:relative;padding:0 70px}
.indexcate-btn>div{width:40px;height:40px;outline:0;z-index:9999;color:transparent;border:1px solid #EFEFEF;display:flex;align-items:center;justify-content:center;cursor:pointer;background:#FFFFFF;transition:all .3s ease;position:absolute;top:50%;margin-top:-20px;}
.indexcate-btn>div em{color:#828282;}
.indexcate-btn>div.indexcate-prev{left:0;}
.indexcate-btn>div.indexcate-next{right:0;}
.indexcate-btn>div:hover{transition:all .3s ease;background:var(--color);border:2px solid var(--color)}
.indexcate-btn>div:hover em{color:#fff}
.home-cate .homecate-list li{margin-bottom:0}
@media (max-width:768px){.indexcatecontent{padding:0}
.indexcate-btn{display:flex;justify-content:center;margin-top:15px;margin-bottom:15px}
.indexcate-btn>div{position:static;margin:0 4%;width:54px;height:34px;}}