@charset "utf-8";

body:after {
    content: '';
    width: 100%;
    height: 30rem; /* 如果希望高度自适应，可以使用 auto 或 100vh */
    position: absolute;
    top: 0;
    left: 0;
    background: url(../images/body-bg.jpg) repeat-x center top;
    background-size: cover; /* 或者用 'contain' 根据需要 */
    z-index: -1;
}


.content{ width: 7.5rem; margin: 0 auto;}

.logo{ height: .55rem; padding: .1rem 0 .4rem; text-align: center;}
.logo img{ width: 3.5rem;}

.banner{ width: 7rem;}


.notice{ height: .5rem; line-height: .5rem; padding: .1rem .24rem; font-size: .33rem; display: flex; justify-content: flex-start;}
.notice h3{ min-width: 1rem; padding-left: .5rem; font-size: .28rem; font-weight: bolder; color: #137ada; background: url(../images/icon-notice.png) no-repeat left center; background-size: .4rem .3rem;}
.notice a{ color: #3d3d3d;}
.notice .swiper{ height: .5rem; margin: 0; overflow: hidden;}
.notice .swiper-slide{ height: .5rem; overflow: hidden; color: red; }

.quick-btn{ padding: 0 .24rem; text-align: center; display: flex; justify-content: space-between; flex-wrap: nowrap;}
.quick-btn a{ display: block; width: 3.4rem;}
.quick-btn img{ width: 3.4rem;}


.quick-btnn{ padding: 0 .24rem; text-align: center; display: flex; justify-content: space-between; flex-wrap: nowrap;}
.quick-btnn a{ display: block; width: 3.4rem;}
.quick-btnn img{ width: 3.4rem;}



.new-people h3{ font-size: 0; height: .5rem; margin: .1rem 0 .1rem; background: url(../images/tit-new-people.png) no-repeat center top; background-size: 7.5rem auto;}
/* .new-people span{ display: inline-block; width: .9rem; height: .24rem; text-align: center; line-height: .24rem; position: absolute; top: .08rem; left: -.24rem; color: #fff; font-size: .14rem; background: url(../images/img-new-people-tit.png) no-repeat center top; background-size: .9rem auto; transform: rotate(-45deg);}
.new-people h4{ padding: .6rem 0 0 .1rem; color: #ab2ce9; font-size: .24rem; font-weight: bold;}
.new-people p{ padding: .1rem 0 0 .1rem; color: #535353; font-size: 12px;} */
.new-people img{ width: 2.3rem;}
.new-people ul{ padding: 0 .24rem; display: flex; justify-content: space-between; flex-wrap: wrap;}
.new-people li{ width: 2.3rem; height: 1.3rem; margin: .1rem 0; position: relative; background: #fff; border-radius: .2rem;}

.hot-game h3{ font-size: 0; height: .5rem; margin: .2rem 0 .001rem; background: url(../images/tit-hot-game.png) no-repeat center top; background-size: 7.5rem auto;}
.hot-game img{ width: 100%;}
.hot-game ul{ padding: 0 .24rem; display: flex; justify-content: space-between; flex-wrap: wrap;}
.hot-game li{ width: 33.333333%; height: 1.6rem}

.foot{ padding: .6rem .24rem 0; display: flex; justify-content: center;}
.foot a:last-child{ margin-left: -.36rem; margin-top: -.8rem;}
.foot a:first-child img{ height: 1.5rem;}
.foot a:last-child{ width: 4.1rem;}





  
.difu-daili {
    padding: 0 .14rem;
    margin: 111.1rem;
    text-align: center;
    display: flex;
    justify-content: space-between;
    flex-wrap: nowrap;
}

.difu-daili a {
    display: block;
    width: 3.4rem;
    margin: .1rem;
}

.difu-daili img {
    width: 1.1rem;
    margin: .1rem;
}





























.wrap {
    width: 100%;
    margin: 0 auto;
    max-width: 960px;
    position: relative;
}

.bg {
    width: 100%;
    display: block;
}

.header {
    position: absolute;
    top: 1%;
    left: 0;
    width: 100%;
    text-align: center;
}

.header img {
    width: 90%;
    display: block;
    margin: 0 auto;
    cursor: pointer;
}

.header .game {
    display: flex;
    list-style: none;
    margin-top: 20px;
    font-size: 48px;
}

.header .game li {
    flex: 1;
    text-align: center;
    line-height: 2;
    color: #fff;
}

.section{
    position: relative;
    margin-top: -11.6%;
}

.section .section-bg {
    width: 100%;
}

.section .btns {
    position: absolute;
    top: 52%;
    left: 50%;
    transform: translateX(-50%);
    width: 90%;
    display: flex;
    justify-content: space-between;
}

.section .btns img {
    width: 45%;
    display: block;
    cursor: pointer;
}

.activity img {
    width: 90%;
    border-radius: 5%;
}

.header>span{
    color: white;
    font-size: 7.5vw;
    margin-top: 1%;
    text-align: center;
    width: 100%;
}

.flex-down{
    position: absolute;
    top: 7%;
    display: flex;
    flex-direction: column;
    width: 95%;
    left: 50%;
    transform: translate(-50%);
}