.waterfall {position: relative;margin-left: 30px;}

.waterfall {width: 100%;column-gap:0.33rem;column-count: 3;margin: 0 auto;overflow: visible;}
.waterfall .item {/* padding: 10px; */margin-bottom: 0.33rem;break-inside: avoid;box-shadow: 1px 1px 12px rgba(0,0,0,0.12);padding-bottom: 12px;}
.waterfall .item .pic{position: relative;}
.waterfall .item .pic::after{position: absolute;content: "";left: 0;bottom: 0;width: 100%;height: 80%;background:linear-gradient(to top, rgba(0,0,0,0.8),rgba(0,0,0,0));z-index: 1;}
.waterfall .item .pic img {width: 100%;}
@media (min-width: 0px) and (max-width: 800px) {.waterfall {column-count: 1;}}

.waterfall .text{padding:10px  20px 10px  20px;font-size:20px;}
.waterfall .text p{font-size: 12px;color: #8d8d8d;text-align: left;line-height: 32px;}
.waterfall .text span{display: block;line-height: 26px;color: #000000;font-size: 16px;}
.waterfall .pic{position: relative;}
.waterfall .pic h4{position: absolute;bottom:0;left:0.4rem;z-index: 2;display: inline-block;border-bottom: 4px solid #ee9640;padding-left: 0.4rem;font-size: 0.16rem;color: white;line-height: 0.32rem;padding-bottom: 0.16rem;}
.waterfall .pic h4::after{content: "";position: absolute;left: 0;background: url(../image/wb.png) no-repeat left center;background-size: auto;top: 0;width: 0.4rem;height: 0.3rem;}
.waterfall .pic h5{position: absolute;bottom:0;left:0.4rem;z-index: 2;display: inline-block;border-bottom: 4px solid #47d800;padding-left: 0.4rem;font-size: 0.16rem;color: white;line-height: 0.2rem;padding-bottom: 0.16rem;}
.waterfall .pic h5::after{content: "";position: absolute;left: 0;background: url(../image/wx.png) no-repeat left center;background-size: auto;top: 0;width: 0.4rem;height: 0.3rem;}

.waterfall .pic h2{position: absolute;bottom:0;left:0.4rem;z-index: 2;display: inline-block;border-bottom: 4px solid #ef01fe;padding-left: 0.4rem;font-size: 0.16rem;color: white;line-height: 0.32rem;padding-bottom: 0.16rem;}
.waterfall .pic h2::after{content: "";position: absolute;left: 0;background: url(../image/dy.png) no-repeat 0.07rem center;background-size: auto;top: 0;width: 0.4rem;height: 0.3rem;}

.waterfall .pic h3{position: absolute;
    bottom: 0;
    left: 4px;
    z-index: 2;
    display: inline-block;
    border-bottom: 4px solid #990000;
    padding-left: 4px;
    font-size: 18px;
    color: white;
    line-height: 22px;
    padding-bottom: 8px;}
.waterfall .pic h3::after{content: "";position: absolute;left: 0;background: url(../image/bl.png) no-repeat left center;background-size: auto;top: 0;width: 0.4rem;height: 0.3rem;}
@media screen and (max-width: 1024px) {
    .waterfall .pic h2::after,
    .waterfall .pic h3::after,
    .waterfall .pic h4::after,
    .waterfall .pic h5::after{background-size: contain;}
}
@media screen and (max-width: 800px) {
    .waterfall .text{padding:35px  50px 50px 50px;}
    .waterfall .text p{font-size: 0.24rem;line-height: 0.44rem;}
    .waterfall .text span{line-height: 0.4rem;color: #000000;font-size: 0.32rem;}
    .waterfall .pic h2{left:0.5rem;padding-left: 0.45rem;font-size: 0.32rem;line-height: 0.54rem;}
    .waterfall .pic h2::after{top: 0;width: 0.45rem;height: 0.4rem;}
    .waterfall .pic h3{left:10px;padding-left: 15px;font-size: 30px;line-height: 40px;}
    .waterfall .pic h3::after{top: 0;width: 0.45rem;height: 0.4rem;}
    .waterfall .pic h4{left:0.5rem;padding-left: 0.45rem;font-size: 0.32rem;line-height: 0.54rem;}
    .waterfall .pic h4::after{top: 0;width: 0.45rem;height: 0.4rem;}
    .waterfall .pic h5{left:0.5rem;padding-left: 0.45rem;font-size: 0.32rem;line-height: 0.54rem;}
    .waterfall .pic h5::after{top: 0;width: 0.45rem;height: 0.4rem;}
    .waterfall .text p{font-size: 0.24rem;line-height: 0.45rem;}
    .waterfall .text span{line-height: 40px;font-size: 28px;}
}