body {
    background-color: rgb(248, 248, 248);
}
* {
    margin: 0;
    padding: 0;
}
.showDiv {
    display: flex!important;
}


.banner {
    height: 5.6rem;
    background-image: url(../images/foreignerZone/banner-bg.png);
    background-size: 100% 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.banner .ban-title {
    font-family: YouSheBiaoTiHei;
    font-size: .8rem;
    color: #FFFFFF;
    text-shadow: 0 .075rem .025rem rgba(0,3,15,0.62);
    font-weight: 400;
}
.banner .list {
    list-style: none;
    display: flex;
    justify-content: space-between;
    width: 16.25rem;
    margin-top: .55rem;
}
.banner .list > li {
    box-sizing: border-box;
    width: 5.225rem;
    height: 2.25rem;
    opacity: 0.87;
    background-image: linear-gradient(-90deg, #7181FD 0%, rgba(18,27,197,0.86) 86%);
    border-radius: .1rem;
    padding: .3rem .375rem;
}
.banner .list > li .title {
    font-family: PingFangSC-Semibold;
    font-size: .3rem;
    color: #FFFFFF;
    line-height: .3rem;
    font-weight: 600;
}
.banner .list > li .desc {
    margin-top: .15rem;
    font-family: PingFangSC-Semibold;
    font-size: .2rem;
    color: #FFFFFF;
    line-height: .3rem;
    font-weight: 600;
}

.card {
    width: 16.25rem;
    background: #FFFFFF;
    border-radius: .05rem;
    margin: .375rem auto;
}
.card-header {
    height: .75rem;
    line-height: .75rem;
    padding: 0 .625rem;
    font-family: PingFangSC-Semibold;
    font-size: .3rem;
    color: #000000;
    font-weight: 600;
    border-bottom: 1px solid rgba(219,219,219,1);
}
.card-content {
    padding: .375rem .625rem;
}

/* news */
.news-top {
    padding-bottom: .375rem;
    border-bottom: 1px solid rgba(219,219,219,1);
    display: flex;
}
.news-top > img {
    width: 4rem;
    height: 2.525rem;
}
.news-top .info-box {
    margin-left: .4rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    cursor: pointer;
}
.news-top .info-box .title {
    font-family: PingFangSC-Semibold;
    font-size: .275rem;
    color: #000000;
    font-weight: 600;
    margin-bottom: .25rem;
}
.news-top .info-box .desc {
    opacity: 0.65;
    font-family: PingFangSC-Medium;
    font-size: .2rem;
    color: #000000;
    line-height: .3625rem;
    font-weight: 500;
    height: 1.45rem;
    /* 超出4行显示省略 */
    word-break: break-all;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    overflow: hidden;
}
.news-bottom {
    padding: .375rem 0 .125rem;
}
.news-bottom .list {
    list-style: none;
    margin: 0;
}
.news-bottom .list > li {
    display: flex;
    align-items: center;
    height: 0.8rem;
    padding-right: 0.3rem;
    font-family: PingFangSC-Medium;
    font-size: .2rem;
    color: #666;
    font-weight: 500;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    cursor: pointer;
    border-bottom: 1px solid #eee; 
}
.news-bottom .list > li::before {
    content: '';
    display: inline-block;
    width: .075rem;
    height: .075rem;
    border-radius: .0325rem;
    background: #426FB4;
    margin-right: .2rem;
    flex-shrink: 0;
}
.news-bottom .list > li .info {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.news-bottom .list > li .title {
    font-size: .25rem;
    color: #000000;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    width: 13rem;
}

/* exchange */
.exchange .list {
    display: flex;
    list-style: none;
}
.exchange .list > li {
    margin-right: 0.27rem;
    width: 4.825rem;
    height: 4.2rem;
    border: 1px solid rgba(220,220,220,1);
    border-radius: 0.025rem;
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
    cursor: pointer;
}
.exchange .list > li:last-child {
    margin-right: 0;
}
.exchange .list > li > img {
    width: 100%;
    height: 2.5rem;
    flex-shrink: 0;
}
.exchange .list > li .title {
    flex: 1;
    padding: .25rem;
    font-family: PingFangSC-Medium;
    opacity: 0.8;
    font-size: .2rem;
    color: #000000;
    line-height: .325rem;
    font-weight: 500;
}

/* services */
.services .tab-header > ul {
    list-style: none;
    display: flex;
    background: #FFFFFF;
    border: 1px solid rgba(233,233,233,1);
    border-radius: 2px;
}
.services .tab-header > ul > li {
    flex: 1;
    font-family: PingFangSC-Medium;
    height: .675rem;
    line-height: .675rem;
    font-size: .2rem;
    color: #999999;
    font-weight: 500;
    display: flex;
    flex-direction: column;
    align-items: center;
    cursor: pointer;
    border-right: 1px solid rgba(233,233,233,1);
}
.services .tab-header > ul > li:last-child {
    border: none;
}
.services .tab-header > ul > li.active {
    font-family: PingFangSC-Semibold;
    font-size: .225rem;
    color: #FFFFFF;
    font-weight: 600;
    background: #426FB4;
}
.services .tab-content {
    margin-top: .5rem;
}
.services .tab-content .list {
    list-style: none;
    display: none;
    flex-wrap: wrap;
}
.services .tab-content .list > li {
    width: 4.875rem;
    height: 1.25rem;
    box-sizing: border-box;
    background: #FFFFFF;
    border: 1px solid rgba(235,235,235,1);
    border-radius: .05rem;
    margin-bottom: .2rem;
    margin-right: .12rem;
    padding: 0 .15rem;
    display: flex;
    align-items: center;
    cursor: pointer;
}
.services .tab-content .list > li .title {
    flex: 1;
    box-sizing: border-box;
    padding: .15rem .2rem;
    height: 100%;
    font-family: PingFangSC-Medium;
    font-size: .225rem;
    color: #333333;
    font-weight: 500;
}
.services .tab-content .list > li > img {
    width: .85rem;
    height: .85rem;
}