.app-list h3{font-size:36px;color:#212121;font-weight:700;line-height:1;position:relative;z-index:20;}
.app-list h3::after{display:block;content:'';width:80px;height:2px;background:#0271B7;margin:15px auto 0 0;}

.app-list .t{margin:30px 0 0;line-height:34px;font-size:17px;color:#666;}
.app-list ul{margin:37px -20px 0;display:flex;flex-wrap:wrap;}
.app-list ul li{width:33.3333%;padding:15px 20px;}
.app-list ul li >a{position:relative;overflow:hidden;display:block;}
.app-list ul li img{display:block;width:100%;}
.app-list ul li .txt{position:absolute;left:0;top:0;right:0;bottom:0;width:100%;z-index:105;padding:0 34px 29px;transition:opacity 0.2s, transform 0.35s;display:flex;justify-content:flex-end;-webkit-flex-direction:column;flex-direction:column;}
.app-list ul li .txt::after{content:"";background:var(--bg-color);opacity: 0.85;height:0;position:absolute;left:0;right:0;bottom:0;transition:all 0.3s ease 0s;}
.app-list ul li .txt > *{position:relative;z-index:10;}
.app-list ul li .txt h6{font-size:20px;font-weight:700;color:#fff;line-height:1;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;}
.app-list ul li .txt p{font-size:15px;color:#fff;line-height:24px;height:0;overflow:hidden;transition:all 0.5s ease 0s;margin:15px 0 0;}
.app-list ul li .txt .more{display:inline-block;font-size:14px;font-weight:500;color:#fff;margin:25px 0 0;}
.app-list ul li .txt .more i{color:#fff;font-size:12px;border-radius:50%;width:26px;height:26px;border:1px solid #fff;line-height:24px;display:inline-block;text-align:center;margin-right:20px;}

@media screen and (min-width:992px){
.app-list ul li:hover .txt::after{height:100%;}
.app-list ul li:hover .txt p{height:48px;}
.app-list ul li:hover .more i{background:#FAFBFB;color:#4FA8B4;border-color:#FAFBFB;}
}


@media screen and (max-width:1441px) {
.app-list h3{font-size:34px;}
.app-list .t{line-height:32px;}
.app-list ul li .txt{padding:0 30px 25px;}
}

@media screen and (max-width:1367px) {
.app-list h3{font-size:32px;}
.app-list .t{line-height:30px;}
.app-list ul li .txt{padding:0 25px 20px;}
}

@media screen and (max-width:1281px){
.app-list h3{font-size:30px;}
.app-list .t{line-height:28px;}
.app-list ul li .txt{padding:0 20px 15px;}
}

@media screen and (max-width:1171px){
.app-list ul{margin:25px -15px 0;}
.app-list ul li{width:50%;padding:15px;}
.app-list .t{line-height:27px;}
}

@media screen and (max-width:992px){
.app-list ul li .txt{padding:0 20px 18px;}
.app-list ul li .txt .more{display:none;}
.app-list .t{line-height:26px;}
}

@media screen and (max-width:768px) {
.app-list h3{font-size:28px;text-align:center;}
.app-list h3::after{margin:15px auto 0;}
.app-list .t{margin:20px 0 0;line-height:24px;font-size:16px;}
.app-list ul{margin:20px -10px 0;}
.app-list ul li{padding:10px;}
.app-list ul li .txt{padding:15px 0 0;position:static;text-align:center;}
.app-list ul li .txt h6{font-size:17px;color:#333;}
.app-list ul li .txt p{display:none;}

}

@media screen and (max-width:576px) {
.app-list h3{font-size:26px;}
}


@media screen and (max-width:480px) {
.app-list h3{font-size:24px;}
.app-list ul{margin:14px 0 0;}
.app-list ul li{padding:6px 0;width:100%;}
.app-list ul li .txt h6{font-size:16px;}
}


@media screen and (max-width:420px) {
.app-list h3{font-size:22px;}
}