* {
    padding: 0;
    margin: 0;
    list-style: none;
}

@font-face {
    font-family: 'PingFang';
    src: url('../js/pingfang.ttf');
}

body,
html {
    width: 100%;
    height: 100%;
    /* font: 12px/1.5; */
    overflow: auto;
}

body::-webkit-scrollbar {
    display: none;
}

.centermain::-webkit-scrollbar {
    display: none;
}

.a::-webkit-scrollbar {
    display: none;
}

#app {
    width: 100%;
    /* background-size: contain; */
    /* background-repeat: no-repeat; */
}

.max {
    background-color: #3b6deb;
    padding-bottom: .3rem;
    width: 7.5rem;

    margin: 0 auto;

}

.banner img,
.banner {
    width: 7.5rem;
    height: 3.48rem;
}
.arrow {
    width: 100%;
    height: .6rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.arrow img {
    width: .4rem;
    height: .4rem;
}

.item1,
.item2 {
    width: 7.09rem;
    background-color: #fff;
    border-radius: .15rem;
    margin: .2rem auto;
    position: relative;
    padding-bottom: .2rem;
}

.item1 .topImg,
.item2 .topImg {
    background-image: url('../image/topimg.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: .15rem .05rem;
    width: 7.09rem;
    height: .98rem;
    margin: 0 auto;
    position: absolute;
    top: -.3rem;
    display: flex;
    justify-content: center;
    align-items: center;
}

.item1 .topImg span,
.item2 .topImg span {
    font-size: .32rem;
    font-family: 'PingFang';
    font-weight: bold;
    color: #FFFFFF;
    letter-spacing: .02rem;
    margin-top: -.1rem;
}

.item1 .list ul {
    width: 100%;
    margin: 0 auto;
    padding-top: .7rem;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}

.item1 .list ul li {
    width: 1.5rem;
    height: 1.23rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: .1rem;
    background-color: #EEEEEE;
    padding: .03rem;
}

.item1 .list ul li img {
    width: .5rem;
    height: .5rem;
    margin-bottom: .2rem;
}

.item1 .list ul li span {
    font-size: .24rem;
    font-family: 'PingFang';
    font-weight: 500;
    color: #333333;
}

.item2 {
    margin-top: .7rem;
    margin-bottom: .7rem;
}

.item2 ul {
    width: 100%;
    margin: 0 auto;
    padding-top: .7rem;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}

.item2 ul li {
    width: 90%;
    height: .7rem;
    display: flex;
    justify-content: center;
    align-items: center;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: #1C2956 .01rem solid;
}

.item2 ul li div:nth-child(1) {
    font-size: .24rem;
    font-family: 'PingFang';
    font-weight: 500;
    color: #333333;
}

.item2 ul li div:nth-child(2) {
    width: 1.27rem;
    height: .4rem;
    font-size: .24rem;
    color: #fff;
    font-family: "PingFang";
    background-color: #5182fe;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: .1rem;
}

.item2 ul li:nth-last-child(-n+1) {
    border: none;
}
.beikaolist{
    position: relative;
}
.beikaolist ul {
    width: 100%;
    margin: 0 auto;
    padding-top: .9rem;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}

.beikaolist ul li {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: .3rem .2rem;
    padding: .03rem;
}

.beikaolist ul li span {
    font-size: .24rem;
    font-family: 'PingFang';
    font-weight: 500;
    color: #333333;
    display: flex;
    width: 1.2rem;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: .2rem;
}

.beikaolist ul li div {
    width: 1.25em;
    height: 1.25rem;
    background: linear-gradient(0deg, #869BF4 0%, #4059CB 100%);
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.beikaolist ul li div img {
    width: .6rem;
    height: .6rem;
}

.beikaolist ul li:nth-child(4) {
    margin-bottom: -.05rem;
}
.title3{
    position: absolute;
    top: .7rem;
}

.item1 .tableBox {
    width: 100%;
    margin: 0 auto;
    padding-top: .7rem;
    
}

.item1 table {
    border: none;
    border-collapse: collapse;
    margin: .0rem auto;
    padding-top: 0rem;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}

.mrt30 {
    margin-top: .7rem;
}

.item1 table th {
    font-size: .24rem;
    font-family: 'PingFang';
    font-weight: 500;
    color: #FFFFFF;
    background-color: #3b6deb;
    padding: .1rem .12rem;
    text-align: center;
    border-right: 1px solid #fff;

}

.item1 table td {
    font-size: .24rem;
    font-family: 'PingFang';
    font-weight: 500;
    color: #333;
    padding: .1rem .1rem;
    text-align: center;
    max-width: 1.5rem;

}

.title {
    font-size: .26rem;
    font-family: 'PingFang';
    font-weight: 600;
    color: #333333;
    margin: .0rem 0 .2rem 0;
    width: 100%;
    text-align: center;
    letter-spacing: .04rem;
}

.videoBg {
    width: 6.64rem;
    height: 3.66rem;
    margin: 0 auto;
    background-image: url('../image/videoBgi.png');
    background-size: contain;
    display: flex;
    justify-content: center;
    align-items: center;
}

.videoBtnBgi {
    background-image: url('../image/videoBtnBgi.png');
    background-size: contain;
    width: .9rem;
    height: .9rem;
    display: flex;
    justify-content: center;
    align-items: center;
}

.videoBtn {
    background-image: url('../image/viedeBtn.png');
    background-size: contain;
    background-repeat: no-repeat;
    width: .3rem;
    height: .5rem;

}

.swiper {
    padding: 0rem;
    height: 2.6rem;
}

.swiper ul {
    width: 100%;
    overflow-x: scroll; /* 设置溢出滚动 */
    white-space: nowrap;
    overflow-y: hidden;
    /* 隐藏滚动条 */
    scrollbar-width: none; /* firefox */
    -ms-overflow-style: none; /* IE 10+ */
    display: flex;
    padding: 0;
   
}

.swiper ul::-webkit-scrollbar { width: 0 !important }

.swiper ul li {
    width: 2.03rem;
    height: 2.58rem;
    background-size: cover;
    background-repeat: no-repeat;
    border-radius: .1rem;
    position: relative;
    margin: 0 .15rem;
    flex-shrink: 0;
    overflow: hidden;
}
.swiper ul li img{
    Object-fit:cover;
    width: 2.03rem;
    height: 2.58rem;
}

.swiper .bottom {
    position: absolute;
    bottom: .0rem;
    font-size: .24rem;
    display: flex;
    flex-direction: column;
    background-color: rgba(0, 0, 0, 0.5);
    color: #fff;
    width: 2.03rem;
    height: .7rem;
    padding: .0rem .1rem;
    box-sizing: border-box;
}
.swiper .bottom span:nth-child(1){
    font-weight: 600;
}
.swiper .bottom span:nth-child(2){
    font-weight: 300;
    margin-top: .05rem;
}


.tableBox .list {
    width: 95%;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding-bottom: .3rem;
    margin-left: .3rem;
}
.tableBox .list .listItem{
    height: 1rem;
    width: 3.3rem;
    display: flex;
    align-items: center;
    margin: .2rem 0;
}
.tableBox .list .listItem .img {
    background-image: url('../image/sibianxing.png');   
    background-size: contain;
    width: .91rem;
    height: .85rem;
    display: flex;
    justify-content: center;
    align-items: center;
    /* vertical-align: middle; */
}
.tableBox .list .listItem .img span{
    font-size: .3rem;
    font-family: 'PingFang';
    font-weight: 800;
    color: #165292;
    text-align: center;
    margin-top: .2rem;
    margin-left: -.12rem;
}

.tableBox .list .listItem span {
    width: 2.2rem;
    height: .53rem;
    font-size: .24rem;
    font-family: 'PingFang';
    font-weight: 500;
    color: #333333;
    display: inline-block;
    margin-top: -.2rem;
    margin-left: .1rem;
}

.coachList{
    position: relative;
}
.coachList ul {
    width: 100%;
    margin: 0 auto;
    padding-top: 1.2rem;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;

}

.coachList ul li {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: .1rem .30rem;
    padding: .03rem;
}

.coachList ul li span {
    font-size: .24rem;
    font-family: 'PingFang';
    font-weight: 500;
    color: #333333;
    display: flex;
    width: 1.7rem;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: .2rem;
    text-align: center;
}

.coachList ul li div {
    width: 1.36em;
    height: 1.36rem;
    background: linear-gradient(0deg, #869BF4 0%, #4059CB 100%);
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    border: .1rem solid #b7c1ec;
}

.coachList ul li div img {
    width: .6rem;
    height: .6rem;
}
.coachList .title{
    position: absolute;
    top: .7rem;
    letter-spacing: .1rem;
}
.tabs{
    width: 100%;
    margin: 0 auto;
    padding-top: 1rem;
}
.tabNav{
    width:90%;
   margin: 0 auto;
    display: flex;

}
.tabNav span{
    display: inline-block;
    width: 1.98rem;
    height: .5rem;
    font-size: .24rem;
    font-family: 'PingFang';
    font-weight: 600;
    border: 1px solid #aaa;
    border-right: none;
    text-align: center;
    line-height: .5rem;
    user-select: none;
}
.tabNav span:nth-child(3){
    border: 1px solid #aaa;
    
}
.active{
    background-color: #2455d9;
    color: #fff;
    border: none !important;
    border: 1px solid #2455d9 !important;
}
.title2{
    margin-top: -.2rem;
    letter-spacing: .1rem;
}
.tabs .tabImg {
    width: 100%;
    display: flex;
    justify-content: center;
}
.tabs .tabImg img{
    width: 30%;
    height: 1.75rem;
    margin: .3rem .1rem
}