﻿.catalogue1{padding-bottom:5%}
.catalogue1 .desc{text-align:center;color:#555}
.catalogue1 .list{display:flex;flex-wrap:wrap;justify-content:space-between;margin-top:20px}
.catalogue1 .item{width:49%;background-color:#f6f6f6;border-radius:4px;padding:15px 20px;display:flex;align-items:center;justify-content:space-between;margin-top:20px}
.catalogue1 .item .info{display:flex;align-items:center;margin-right:10px}
.catalogue1 .item .info .img{max-width:120px;margin-right:20px}
.catalogue1 .item .info .title{font-size:var(--fontsize20);font-weight:var(--fontbold6)}
.catalogue1 .item .more{width:120px;height:40px;background-color:var(--color);border-radius:20px;display:inline-flex;align-items:center;justify-content:center;color:#fff}
.water4{position:relative;padding:5% 0}
.water4::before{content:"";position:absolute;left:-180px;top:0;width:1920px;height:60%;background-image:url(/uploads/41402/page/p20250225164929bc022.png);background-repeat:no-repeat;background-size:cover}
.water4 .pro-line::before{background-color:#fff}
.water4 .pro-title{color:#fff}
.water4 .desc{text-align:center;color:#fff;opacity:.6;position:relative;z-index:2;margin-top:4px}
.water4 .list{display:flex;justify-content:space-between;flex-wrap:wrap;position:relative;z-index:2}
.water4 .list .item{color:#111;width:32%;background-color:#fff;border-radius:6px;box-shadow:0 10px 20px 0 rgba(7,0,2,.1);text-align:center;padding:30px 40px;margin-top:40px;transition:all .2s linear}
.water4 .list .item .icon em{color:var(--color);font-size:60px}
.water4 .list .item .title{text-align:center;font-size:var(--fontsize20);font-weight:var(--fontbold6);transition:all .2s linear;margin-bottom:6px}
.water4 .list .item:hover{transform:translateY(-10px)}
.water4 .list .item:hover .title{color:var(--color)}
@media screen and (max-width:1024px){.catalogue1{padding-bottom:30px}
.water4{padding:30px 0}
.water4::before{width:calc(100% + 30px);left:-15px}
}
@media screen and (max-width:768px){.catalogue1 .list{margin-top:0}
.catalogue1 .item{width:100%}
.water4 .list .item{margin-top:25px;width:100%}
.water4 .list .item .icon em{font-size:40px}
}
@media screen and (max-width:500px){.catalogue1 .item{padding:10px;flex-wrap:wrap}
.catalogue1 .item .info .title{flex:1;font-size:var(--fontsize16)}
.catalogue1 .item .info .img{width:100px}
.catalogue1 .item .btn{margin-top:10px;width:100%}
.catalogue1 .item .more{width:100px;height:36px}
}