.home-application-sangni{padding:70px 0 20px;}
.home-application-sangni .tit {text-align:center;}
.home-application-sangni .tit h3{font-size:44px;color:#333;font-weight:700;line-height:1;}
.home-application-sangni .tit p {font-size:20px;color:#333;margin:6px 0 0;}

.home-application-sangni .box{display:flex;flex-wrap:wrap;margin:40px 0 0;}


.home-application-sangni .title{width:50%;padding-right:60px;align-self:center;}
.home-application-sangni .title h2{color:#212121;font-size:36px;font-weight:600;line-height:1;}
.home-application-sangni .title p{margin-top:30px;font-size:18px;color:#666;line-height:28px;}
.home-application-sangni .title .more {margin:40px 0 0;}
.home-application-sangni .title .more a {display:inline-block;padding:17px 60px;background:#0360a3;color:#fff;font-size:16px;font-weight:600;cursor:pointer;}
.home-application-sangni .title .more a:hover {background:#358e43;}


.home-application-sangni .item{position:relative;width:25%;height:100%;overflow:hidden;}
.home-application-sangni .item .pic{position:relative;display:block;width:100%;height:100%}
.home-application-sangni .item .pic img {width:100%}
.home-application-sangni .item .pic i {position:absolute;left:0;top:0;display:block;width:100%;height:100%;background:url(./pics/mb.png);background-size:auto 100%}
.home-application-sangni .item h3 {position:absolute;left:0;bottom:35px;width:100%;text-align:center;color:#1cd2fbe6;font-size:18px;font-weight:600;}
.home-application-sangni .item .txt{position:absolute;left:0;bottom:0;width:100%;height:100%;background:rgba(0,0,0,.75);text-align:center;padding:70px 36px;transform:translateY(100%);transition:all 0.5s ease 0s;}
.home-application-sangni .item .txt h4 {font-size:18px;color:#fff;font-weight:600;}
.home-application-sangni .item .txt p {margin-top:30px;font-size:15px;line-height:26px;color:#fff;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:6}


@media screen and (min-width:768px) {
.home-application-sangni .item:hover .txt{transform:translateY(0);}
.home-application-sangni .item:hover h3{display:none;}
}

@media screen and (max-width:1550px) {
.home-application-sangni .tit h3{font-size:42px;}
}

@media screen and (max-width:1550px) {
.home-application-sangni .tit h3{font-size:40px;}

.home-application-sangni .title{padding-right:50px;}
.home-application-sangni .title h2{font-size:32px}
.home-application-sangni .title .more{margin:35px 0 0;}
.home-application-sangni .title .more a{padding:16px 50px;}

.home-application-sangni .txt {padding:40px 20px}
.home-application-sangni .txt p {margin-top:15px;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:7}



}
@media screen and (max-width:1441px) {
.home-application-sangni .tit h3{font-size:38px;}
.home-application-sangni .tit p{font-size:19px;}

.home-application-sangni .title p{font-size:17px;margin-top:20px;line-height:26px;}
.home-application-sangni .title .more{margin:30px 0 0;}
.home-application-sangni .title .more a{padding:15px 45px;}

.home-application-sangni .txt p{-webkit-line-clamp:4}
.home-application-sangni .item h3{bottom:30px;}

}

@media screen and (max-width:1367px) {
.home-application-sangni{padding:65px 0 20px;}
.home-application-sangni .tit h3{font-size:36px;}
.home-application-sangni .tit p{font-size:18px;}

.home-application-sangni .title{padding-right:40px;}
.home-application-sangni .title .more{margin:25px 0 15px;}
.home-application-sangni .title .more a{padding:13px 40px;}

}


@media screen and (max-width:1280px) {
.home-application-sangni{padding:60px 0 10px;}
.home-application-sangni .tit h3{font-size:34px;}
.home-application-sangni .tit p{font-size:17px;}

.home-application-sangni .title h2 {font-size:28px}
.home-application-sangni .title p{font-size:16px;line-height:24px;}
.home-application-sangni .title .more{margin:20px 0 0;}

.home-application-sangni .item .txt p {margin-top:20px;-webkit-line-clamp:2}
.home-application-sangni .item h3{bottom:25px;}
}

@media screen and (max-width:1171px){
.home-application-sangni .tit h3{font-size:32px;}
.home-application-sangni .title{padding-right:30px;}
.home-application-sangni .title h2{font-size:26px;}
.home-application-sangni .title p{margin-top:15px;line-height:22px;}
.home-application-sangni .title .more{margin:15px 0 0;}
.home-application-sangni .title .more a{padding:11px 30px;font-size:15px;}

}

@media screen and (max-width:992px){
.home-application-sangni .tit h3{font-size:30px;}

.home-application-sangni .title{width:100%;padding-right:0;text-align:center;margin-bottom:25px;}
.home-application-sangni .title h2{font-size:25px;}

.home-application-sangni .item{width:33.3333333%;}


}



@media screen and (max-width:768px) {
.home-application-sangni{padding:30px 0 10px;}
.home-application-sangni .tit h3{font-size:28px;}
.home-application-sangni .tit p{font-size:16px;}

.home-application-sangni .title{margin-bottom:20px;}
.home-application-sangni .title h2{font-size:24px;}
.home-application-sangni .title p {font-size:16px;}
.home-application-sangni .title .more{margin:20px 0 0;}
.home-application-sangni .title .more a {font-size:14px}

.home-application-sangni .item{width:50%;}
.home-application-sangni .item h3{bottom:15px;font-size:17px;}

}

@media screen and (max-width:576px) {
.home-application-sangni .tit h3{font-size:26px;}

.home-application-sangni .item{width:100%;margin-top:20px}
.home-application-sangni .item .txt p {-webkit-line-clamp:9}

}

@media screen and (max-width:480px) {
.home-application-sangni .tit h3{font-size:24px;}

}	
                                 
                                 
                                 .home-application-sangni{
                                 background: linear-gradient(to bottom,rgba(52, 174, 223,.2), rgba(52, 174, 223,.2));
                                 
                                 }