.solutions-1 .list1{display:flex;flex-wrap:wrap;justify-content:space-between}
.solutions-1 .list1 li{width:24%;background:#f6f6f6;border-radius:3px}
.solutions-1 .list1 li .img{width:100%;aspect-ratio:4/3;overflow:hidden}
.solutions-1 .list1 li .img img{width:100%;height:100%;object-fit:cover}
.solutions-1 .list1 li .title{color:var(--fontbold7);padding:10px 15px}
.solutions-1 .list1 li .title a{color:var(--fontbold7);display:flex;align-items:flex-start;justify-content:space-between;text-decoration:none;transition:all .1s linear}
.solutions-1 .list1 li .title a:hover{color:var(--color)}
.solutions-2 .list2{display:flex;flex-wrap:wrap;justify-content:space-between}
.solutions-2 .list2 li{width:32%;height:240px;display:flex;justify-content:space-between;background:#26282e;color:#fff;position:relative}
.solutions-2 .list2 li .img{width:35%;height:100%;overflow:hidden}
.solutions-2 .list2 li .img img{width:100%;height:100%}
.solutions-2 .list2 li .info{flex:1;position:relative;display:flex;flex-direction:column;justify-content:center;padding:20px;padding-left:50px}
.solutions-2 .list2 li .info::before{content:"";position:absolute;top:0;left:0;width:0;height:0;border-style:solid;border-width:180px 40px 0 0;border-color:#515358 transparent transparent transparent;transition:all .1s linear}
.solutions-2 .list2 li .info::after{content:"";position:absolute;bottom:0;left:0;width:0;height:0;border-style:solid;border-width:60px 0 0 20px;border-color:transparent transparent transparent #515358;transition:all .1s linear}
.solutions-2 .list2 li .info .title{font-size:var(--fontsize18);margin-bottom:25px}
.solutions-2 .list2 li .info .more{display:flex;align-items:center;justify-content:space-between;font-size:14px;font-weight:var(--fontbold3);color:#fff;text-decoration:none}
.solutions-2 .list2 li .info .more:hover{color:var(--color)}
.solutions-2 .list2 li .info .more em{width:25px;height:25px;background:var(--bgcolor);border-radius:50%;color:#fff;display:inline-flex;align-items:center;justify-content:center}
.solutions-2 .list2 li:hover .info::before{border-width:180px 0 0 0}
.solutions-2 .list2 li:hover .info::after{border-width:60px 0 0 0}
@media (max-width:768px){.solutions-1 .list1 li{width:49%;margin-bottom:1em}
.solutions-2 .list2 li{width:100%;margin-bottom:1em}
}