.banner, .banner-cover {
    height: 100vh;
    background: url('../../Images/service/index/banner.jpg')no-repeat center;
    background-size: cover;
    position: relative
}
.banner-cover {
    filter: blur(10px);
    opacity: 0;
}
.server {
    width: 41%;
    height: 85%;
    position: absolute;
    left: 50%;
    top: 15%;
    overflow-y:scroll;
    -ms-overflow-style: none;
    overflow: -moz-scrollbars-none;
    display:flex;
    flex-wrap:wrap;
    padding-bottom:10vh;
}
.server .chTitle{font-size: 2.5rem;
    font-family: PingFang Heavy;}
.server .engTitle {
    margin-bottom: 2rem;
    margin-top: 0.5rem;
}
.server>div{padding:5rem 0 5rem 5rem;margin-bottom:.75rem;background-repeat:no-repeat;background-size:contain;background-color:#fff}
.knowMore>span{vertical-align:middle;display:inline-block;color:#e70310;font-weight:bold}
.knowMore:hover .arrow-line{width:20px}
.arrow-line {
    height: 2px;
    width: 0;
    background: #e70310;
    margin-right: -13px;
    margin-left: 10px;
    transition: width 0.3s ease-in-out;
    -webkit-transition: width 0.3s ease-in-out;
}
.arrow-right {
    width: 10px;
    height: 10px;
    border-bottom: 2px solid;
    border-right: 2px solid;
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
}
.server::-webkit-scrollbar{display:none}
.server .contact {
    background-image: url('../../Images/service/index/contact.png');
    background-position: top right;
    background-size:95%;
    width: 35%;
}
.server .outlets {
    background-image: url('../../Images/service/index/outlets.png');
    background-position: bottom right;
    width: calc(65% - .75rem);
    margin-right: .75rem;
}
.server .cooperation {
    background-image: url('../../Images/service/index/coo.png');
    background-position: bottom right;
    width: 35%;
}
.server .club {
    background-image: url('../../Images/service/index/club.png');
    background-position: bottom center;
    width: 100%;
}
.server .volunteer {
    background-image: url(../../Images/service/index/v.png);
    margin-left: .75rem;
    background-size: 60%;
    width: calc(65% - 0.75rem);
    background-position:bottom right;
}
.server>div:hover {background-color:#d91918;color:#fff}
.server>div:hover .knowMore>span{color:#fff}
.server > div:hover .arrow-line{background:#fff}
.server .contact:hover {
    background-image: url('../../Images/service/index/contact-h.png');
}
.server .outlets:hover {
    background-image: url('../../Images/service/index/outlets-h.png');
}
.server .cooperation:hover {
    background-image: url('../../Images/service/index/coo-h.png');
}
.server .club:hover {
    background-image: url('../../Images/service/index/club-h.png');
}
.server .volunteer:hover {
    background-image: url('../../Images/service/index/v-h.png');
}