.component-service{position:relative}
.component-service .cs-bg-figure{position:absolute;left:0;bottom:0}
.component-service .cs-bg-figure img{width:100%}
.component-service .cs-inner{width:100%;max-width:970px;position:relative;margin:0 auto;padding:47px 0 200px 0}
@media(max-width:1199px){.component-service .cs-inner{padding:47px 35px 200px 35px}
}
@media(max-width:767px){.component-service .cs-inner{padding:45px 20px 200px 20px}
}
.component-service .cs-title{font-size:32px;font-weight:700;line-height:1;letter-spacing:.5px;margin:0;padding:0;color:#333;text-align:center}
.component-service .cs-subtitle{font-size:18px;font-weight:400;letter-spacing:.5px;color:#666;margin-top:10px;text-align:center}
.component-service .cs-list{display:flex;flex-wrap:wrap;margin:24px 0 0;padding:0 20px;gap:24px}
@media(max-width:819px){.component-service .cs-list{flex-wrap:wrap}
}
@media(max-width:500px){.component-service .cs-list{gap:12px}
}
.component-service .cs-item{width:23%;background-color:#fff;box-shadow:0 0 16px rgba(0,0,0,.1);border-radius:20px;padding:24px;text-align:center;transform:translateY(0);transition:.25s}
@media(min-width:820px) and (max-width:1200px){.component-service .cs-item{width:calc((100% - 72px) / 4);padding:20px}
}
@media(max-width:819px){.component-service .cs-item{padding:48px;width:calc((100% - 24px)/ 2)}
}
@media(max-width:500px){.component-service .cs-item{padding:24px;width:100%}
}
.component-service .cs-item:hover{box-shadow:0 16px 24px rgba(0,0,0,.1);transform:translateY(-10px)}
.component-service .cs-item:hover .cs-item-title{color:#67b77e}
.component-service .cs-item-img{width:80px;min-width:80px}
.component-service .cs-item-title{font-size:20px;font-weight:500;color:#333;margin:12px 0}
.component-service .cs-item-description{font-size:16px;color:#666;margin:0}