@charset "utf-8";
.section-wrapper{height: auto; overflow: hidden;}
.mall-app>ul{margin-left: -10px;margin-right: -10px;}
.mall-app>ul:before,
.mall-app>ul:after{content: " ";display: table;box-sizing: inherit;}
.mall-app>ul>li{float: left;width: 25%;padding-left: 10px;padding-right: 10px;}
.mall-app-card{position: relative;height: 470px;overflow: hidden;background-color: grey;text-align: center;cursor: pointer;border-radius: 8px;}
.mall-app-card-bg{position: absolute;z-index: 0;top: 0;right: 0;bottom: 0;left: 0;background-size: cover;background-position: center;transition: 0.2s;}
.mall-app-card-top{position: relative;height: 50%;}
.mall-app-card-top i{display: block;position: absolute;top: 80px;right: 0;left: 0;width: 48px;height: 48px;margin: 0 auto;background-size: cover;background-position: center;transition: 0.2s;}
.mall-app-card-top h4{position: absolute;top: 175px;right: 0;left: 0;font-size: 20px;line-height: 28px;color: #fff;transition: 0.2s;}
.mall-app-card-top h4:before{content: "";position: absolute;top: 100%;right: 0;left: 0;width: 0;height: 4px;margin: 15px auto;background-color: #f66f6a;transition: 0.2s 0.2s;}
.mall-app-card-top p{position: absolute;top: 173px;right: 0;left: 0;padding-left: 40px;padding-right: 40px;margin: 10px auto 0;font-size: 14px;line-height: 24px;color: #fff;opacity: 0;transition: 0.2s;}
.mall-app-card-bottom{position: relative;height: 50%;padding-top: 20px;font-size: 14px;line-height: 24px;color: #fff;}
.mall-app-card-bottom li{margin-bottom: 10px;}
.mall-app-card-bottom li a{color: #fff;}
.mall-app-card-bottom li a:hover{color: rgb(246, 111, 106);}
.section-bottom{padding-top: 40px;}
.section-more-wrap{text-align: center;}
.section-more-wrap a{display: inline-block;font-size: 16px;line-height: 24px;color: #666a75;cursor: pointer;user-select: none;transition: 0.2s;}
.section-more-wrap a:hover{color: rgb(246, 111, 106);}
.section-more-wrap a:hover i{transform: translate3d(5px, 0px, 0px);}
.section-more-wrap a .cui-icon{margin-top: -2px;margin-left: 10px;transition: transform 0.2s;}
.cui-icon{font-family: 'cui-icon' !important;speak: none;font-style: normal;font-weight: normal;font-variant: normal;text-transform: none;line-height: 1;display: inline-block;vertical-align: middle;font-size: 16px;}
.mall-app-card:hover .mall-app-card-bg{-ms-transform: scale(1.05); transform: scale(1.05);} .mall-app-card:hover .mall-app-card-top i{opacity: 0;}
.mall-app-card:hover .mall-app-card-top h4{top: 85px;}
.mall-app-card:hover .mall-app-card-top h4:before{width: 68px;}
.mall-app-card:hover .mall-app-card-top p{margin-top: 0; opacity: 1;}