#mainBodyPc {
    min-width: 1720px;
    max-width: 1920px;
    height: 100%;
}

#mainBodyContent {
    height: 100%;
    position: relative;
}

/* 首页下载 */
#mainBodyPc .content-box .first,
#mainBodyPc .content-box .news,
#mainBodyPc .heroPreview,
#mainBodyPc .feature {
    width: 100%;
    height: 100vh;
}

#mainBodyPc .content-box .first {
    background: url(../img/home/homeBg.png);
    background-size: 100% 100%;
    position: relative;
}

#mainBodyPc .appropriateReminderHome {
    width: 5%;
    position: absolute;
    bottom: 4%;
    right: 5%;
}

#mainBodyPc .download {
    width: 500px;
    height: 140px;
    display: flex;
    padding: 0.5% 1%;
    box-sizing: border-box;
    background: url(../img/home/download/downloadBg.png);
    background-size: 100% 100%;
    position: absolute;
    top: 76%;
    left: calc(50% - 250px);
}

#mainBodyPc .scanTheCode {
    width: 31%;
    height: 100%;
    background: url(../img/home/download/scanTheCode.png);
    background-size: 100% 100%;
    position: relative;
}

#mainBodyPc .scanTheCodeImg {
    width: 78%;
    height: 89%;
    position: absolute;
    right: 0;
    top: 6%;
}

#mainBodyPc .downloadPhone {
    width: 37%;
    height: 100%;
    margin-left: 3%;
}

#mainBodyPc .downloadApple,
#mainBodyPc .downloadAndroid {
    width: 100%;
    height: 46%;
    margin: 2% 0;
}

#mainBodyPc .customerService {
    width: 26%;
    height: 95%;
    margin-top: 0.7%;
    margin-left: 3%;
}

/* 新闻资讯 */
#mainBodyPc .content-box .news {
    background: url('../img/home/newsBg.png');
    background-size: 100% 100%;
    position: relative;
}

#mainBodyPc .newsBox {
    width: 70%;
    height: 68%;
    margin-left: 17%;
    padding-top: 9%;
    display: flex;
    position: relative;
}

#mainBodyPc .newsSwiperLeftBox {
    width: 55%;
    height: 68%;
    background: url(../img/home/news/newsLeftBg.png);
    background-size: 100% 100%;
    position: absolute;
    left: 0;
    z-index: 1;
}

#mainBodyPc .news-swiper-container {
    width: 85%;
    height: 92%;
    margin-top: 6%;
    margin-left: 8%;
    overflow: hidden;
}

#mainBodyPc .news-swiper-container .swiper-wrapper {
    width: 85%;
    height: 85%;
}

#mainBodyPc .news-swiper-container .swiper-slide {
    position: relative;
}

#mainBodyPc .news-swiper-container .swiper-slide img {
    width: 100%;
    height: 100%;
    position: relative;
}

#mainBodyPc .news-swiper-container .swiper-pagination {
    bottom: -25px;
}

#mainBodyPc .news-swiper-container .swiper-pagination-bullet {
    width: 35px;
    height: 35px;
    margin: 0 2%;
    border-radius: 0;
    background: url(../img/home/news/notSelected.png);
    background-size: 100% 100%;
}

#mainBodyPc .news-swiper-container .swiper-pagination-bullet-active {
    background: url(../img/home/news/selected.png);
    background-size: 100% 100%;
}

#mainBodyPc .newsSwiperRightBox {
    width: 45%;
    height: 68%;
    background: url(../img/home/news/newsRightBg.png);
    background-size: 100% 100%;
    position: absolute;
    left: 52%;
}

#mainBodyPc .newsRightBox {
    width: 63%;
    height: 67%;
    margin-left: 7%;
    margin-top: 13%;
}

#mainBodyPc .newsRightTitle {
    width: 100%;
    display: flex;
    justify-content: space-between;
}

#mainBodyPc .newsTitle {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

#mainBodyPc .newsTitleText {
    font-size: 20px;
    font-weight: 700;
    color: #885744;
    padding-bottom: 1px;
    border-bottom: 3.5px solid #885744;
}

#mainBodyPc .newsTitleDiv {
    width: 15px;
    height: 8px;
}

#mainBodyPc .newsTitleImg {
    width: 15px;
    height: 8px;
    margin-top: 3px;
}

#mainBodyPc .newsRightName {
    width: 100%;
    height: 85%;
    margin-top: 3%;
    /* display: flex;
    flex-wrap: wrap; */
    overflow-y: auto;
    padding-right: 4%;
}

/* 自定义滚动条 */
#mainBodyPc .newsRightName::-webkit-scrollbar {
    width: 8px;
    /* 设置滚动条宽度 */
    background-color: #fff;
    border-radius: 10px;
}

#mainBodyPc .newsRightName::-webkit-scrollbar-thumb {
    background: #F2D7A6;
    /* 滚动条滑块的颜色 */
    border-radius: 10px;
}

#mainBodyPc .newsRightName::-webkit-scrollbar-track {
    border-radius: 10px;
}

#mainBodyPc .newsItem {
    width: 100%;
    height: 23px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #885744;
    font-weight: 700;
    font-size: 16px;
    margin: 2% 0;
    margin-bottom: 5%;
}

#mainBodyPc .newsItemTitle {
    width: 70%;
}

#mainBodyPc .newsItemTime {
    width: 25%;
    text-align: right;
}

/* 英雄预览 */
#mainBodyPc .heroPreview {
    background: url('../img/home/newsBg.png');
    background-size: 100% 100%;
    position: relative;
}

#mainBodyPc .heroPreviewBox {
    width: 75%;
    height: 77%;
    margin-left: 17%;
    padding-top: 5%;
    display: flex;
    align-items: center;
    position: relative;
}

#mainBodyPc .heroPreviewLeft {
    width: 45%;
    height: 100%;
    position: relative;
}

#mainBodyPc .heroPreviewItemImg {
    width: 25%;
}

#mainBodyPc .heroPreviewItemImgXz {
    width: 27%;
}

#mainBodyPc .heroPreviewItemImg1 {
    position: absolute;
    top: 0;
    left: 50.5%;
}

#mainBodyPc .heroPreviewItemImgXz1 {
    position: absolute;
    top: -1%;
    left: 49.5%;
}

#mainBodyPc .heroPreviewItemImg2 {
    position: absolute;
    top: 14%;
    left: 33.5%;
}

#mainBodyPc .heroPreviewItemImgXz2 {
    position: absolute;
    top: 13%;
    left: 32.5%;
}

#mainBodyPc .heroPreviewItemImg3 {
    position: absolute;
    top: 14%;
    left: 67.5%;
}

#mainBodyPc .heroPreviewItemImgXz3 {
    position: absolute;
    top: 13%;
    left: 66.5%;
}

#mainBodyPc .heroPreviewItemImg4 {
    position: absolute;
    top: 28%;
    left: 15.5%;
}

#mainBodyPc .heroPreviewItemImgXz4 {
    position: absolute;
    top: 27%;
    left: 14.5%;
}

#mainBodyPc .heroPreviewItemImg5 {
    position: absolute;
    top: 28%;
    left: 50.5%;
}

#mainBodyPc .heroPreviewItemImgXz5 {
    position: absolute;
    top: 27%;
    left: 49.5%;
}

#mainBodyPc .heroPreviewItemImg6 {
    position: absolute;
    top: 41%;
    left: 33.5%;
}

#mainBodyPc .heroPreviewItemImgXz6 {
    position: absolute;
    top: 40%;
    left: 32.5%;
}

#mainBodyPc .heroPreviewItemImg7 {
    position: absolute;
    top: 41%;
    left: 67.5%;
}

#mainBodyPc .heroPreviewItemImgXz7 {
    position: absolute;
    top: 40%;
    left: 66.5%;
}

#mainBodyPc .heroPreviewItemImg8 {
    position: absolute;
    top: 55%;
    left: 15.5%;
}

#mainBodyPc .heroPreviewItemImgXz8 {
    position: absolute;
    top: 54%;
    left: 14.5%;
}

#mainBodyPc .heroPreviewItemImg9 {
    position: absolute;
    top: 55%;
    left: 50.5%;
}

#mainBodyPc .heroPreviewItemImgXz9 {
    position: absolute;
    top: 54%;
    left: 49.5%;
}

#mainBodyPc .heroPreviewItemImg10 {
    position: absolute;
    top: 69%;
    left: 33.5%;
}

#mainBodyPc .heroPreviewItemImgXz10 {
    position: absolute;
    top: 68%;
    left: 32.5%;
}

#mainBodyPc .heroPreviewItemImg11 {
    position: absolute;
    top: 69%;
    left: 67.5%;
}

#mainBodyPc .heroPreviewItemImgXz11 {
    position: absolute;
    top: 68%;
    left: 66.5%;
}

#mainBodyPc .heroPreviewItemImg12 {
    position: absolute;
    top: 83%;
    left: 50.5%;
}

#mainBodyPc .heroPreviewItemImgXz12 {
    position: absolute;
    top: 82%;
    left: 49.5%;
}

#mainBodyPc .heroPreviewRight {
    width: 55%;
    height: 90%;
    position: absolute;
    left: 40%;
    top: 10%;
    display: flex;
}

#mainBodyPc .heroPreviewRightItem {
    width: 100%;
    height: 100%;
}

#mainBodyPc .heroPreviewRightItemCharacter {
    width: 100%;
    height: 80%;
}

#mainBodyPc .heroPreviewRightItemCharacter>img {
    width: 100%;
    height: 100%;
}

#mainBodyPc .heroPreviewRightItemSkill {
    width: 80%;
    height: 20%;
    margin-left: 10%;
    display: flex;
    justify-content: space-between;
    padding: 0 5%;
}

#mainBodyPc .heroPreviewRightItemSkill>img {
    width: 23%;
    height: 90%;
}

#mainBodyPc .heroPreviewRightImg07>.heroPreviewRightItemCharacter {
    width: 115%;
}

#mainBodyPc .heroPreviewRightItemSkill02 {
    margin-left: 17%;
}

#mainBodyPc .heroPreviewRightItemSkill03 {
    margin-left: 11%;
}

#mainBodyPc .heroPreviewRightItemSkill04 {
    margin-left: 20%;
}

#mainBodyPc .heroPreviewRightItemSkill06,
#mainBodyPc .heroPreviewRightItemSkill08,
#mainBodyPc .heroPreviewRightItemSkill09 {
    margin-left: 16%;
}

#mainBodyPc .heroPreviewRightItemSkill05,
#mainBodyPc .heroPreviewRightItemSkill12 {
    margin-left: 15%;
}

#mainBodyPc .heroPreviewRightItemSkill07 {
    margin-left: 9%;
}

#mainBodyPc .heroPreviewRightItemSkill10 {
    margin-left: 21%;
}

#mainBodyPc .heroPreviewRightItemSkill11 {
    margin-left: 14%;
}

/* 技能介绍  */
#mainBodyPc .skillIntroduce {
    width: 20%;
    min-height: 10%;
    padding: 1%;
    padding-bottom: 2%;
    box-sizing: border-box;
    background: url('../img/home/skillIntroductionBg.png') no-repeat;
    background-size: 100% 100%;
    position: absolute;
    left: 40%;
    bottom: -12%;
}

#mainBodyPc .skillIntroduceName {
    font-size: 18px;
    font-weight: 700;
    color: #fff;
    text-align: center;
}

#mainBodyPc .skillIntroduceBai {
    width: 100%;
    height: 1px;
    margin: 2.5% 0;
    background-color: #fff;
}

#mainBodyPc .skillIntroduceDescribe {
    font-size: 14px;
    color: #fff;
}

/* 游戏特色 */
#mainBodyPc .feature {
    background: url('../img/home/newsBg.png');
    background-size: 100% 100%;
    position: relative;
}

#mainBodyPc .featureBox {
    width: 75%;
    height: 70%;
    margin-left: 17%;
    padding-top: 8%;
}

#mainBodyPc .featureSwiperBox {
    width: 80%;
    height: 90%;
    margin-left: 8.5%;
    background: url('../img/home/fature/featureBg.png');
    background-size: 100% 100%;
    position: relative;
    z-index: 1;
}

#mainBodyPc .feature-swiper-container {
    width: 90%;
    height: 103%;
    padding-top: 2%;
    margin-left: 5%;
    overflow: hidden;
}

#mainBodyPc .feature-swiper-container .swiper-wrapper {
    width: 85%;
    height: 85%;
}

#mainBodyPc .feature-swiper-container .swiper-slide img {
    width: 100%;
    height: 100%;
}

#mainBodyPc .feature-swiper-pagination {
    bottom: -5%;
    display: flex;
    justify-content: center;
}

#mainBodyPc .feature-swiper-container .swiper-pagination-bullet {
    width: 35px;
    height: 35px;
    margin: 0 2%;
    border-radius: 0;
    background: url('../img/home/news/notSelected.png');
    background-size: 100% 100%;
}

#mainBodyPc .feature-swiper-container .swiper-pagination-bullet-active {
    background: url('../img/home/news/selected.png');
    background-size: 100% 100%;
}

#mainBodyPc .swiper-button-prev2,
#mainBodyPc .swiper-button-next2 {
    width: 8%;
    top: 41%;
    z-index: 99;
}

#mainBodyPc .swiper-button-prev2 {
    left: -11%;
}

#mainBodyPc .swiper-button-next2 {
    right: -11%;
}

/* 隐私政策 */
#mainBodyPc .privacyPolicy {
    width: 100%;
    background: #060403;
    color: #fff;
    padding: 2% 0;
    position: relative;
}

#mainBodyPc .privacyPolicyLogo {
    width: 8%;
    bottom: 17%;
    left: 26%;
}

#mainBodyPc .privacyPolicyTitleOne,
#mainBodyPc .privacyPolicyTitleFour,
#mainBodyPc .privacyPolicyTitleFive,
#mainBodyPc .privacyPolicyTitleSix {
    width: 100%;
    font-size: 20px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
}

#mainBodyPc .privacyPolicyTitleTwo {
    padding-top: 10px;
}

#mainBodyPc .privacyPolicyTitleTwo,
#mainBodyPc .privacyPolicyTitleThree {
    width: 100%;
    font-size: 15px;
    font-weight: 700;
    text-align: center;
}

#mainBodyPc .privacyPolicyTitleFour,
#mainBodyPc .privacyPolicyTitleFive,
#mainBodyPc .privacyPolicyTitleSix {
    padding-top: 10px;
}

#mainBodyPc .appropriateReminderImg {
    width: 4%;
    bottom: 20%;
    right: 30%;
}

/* 展开 */
#mainBodyPc .expandName {
    width: 10%;
    height: 20%;
    position: fixed;
    bottom: 15%;
    left: -0.2%;
}

#mainBodyPc .expandBgImg {
    width: 100px;
    height: 190px;
}

/* 收起 */
#mainBodyPc .retractName {
    width: 13%;
    height: 20%;
    position: fixed;
    bottom: 15%;
    left: -0.4%;
}

/* 收起动画：从左到右滑动 */
#mainBodyPc .retractNameLeft {
    transition: transform 0.5s ease-in-out;
    transform: translateX(0);
}

#mainBodyPc .retractNameLeft.slide-out {
    transform: translateX(-100%);
}

#mainBodyPc .retract {
    width: 100%;
    height: 100%;
    background: url("../img/home/retractBg.png") no-repeat;
    background-size: 100% 100%;
    display: flex;
    position: relative;
}

#mainBodyPc .retractImg {
    width: 30%;
    height: 70%;
    position: absolute;
    top: 0;
    right: -8%;
}

#mainBodyPc .retractLeftImg {
    width: 36%;
    height: 50%;
    margin-left: 8%;
    margin-top: 11%;
}

#mainBodyPc .retractRight {
    width: 20%;
    height: 50%;
    margin-left: 6%;
    margin-top: 11%;
}

#mainBodyPc .retractWx,
#mainBodyPc .retractXhs {
    width: 90%;
    height: 44%;
    margin: 3px 0;
}

#mainBodyPc .wxQrcode,
#mainBodyPc .xhsQrcode {
    width: 11vw;
    min-width: 210px;
    min-height: 268px;
    height: 14vw;
    padding: 4% 1.2% 2% 1.2%;
    box-sizing: border-box;
    position: absolute;
    top: 8.2%;
    background: url(../img/home/wxCode.png) no-repeat;
    background-size: 100% 100%;
    z-index: 101;
}

#mainBodyPc .wxQrcode {
    right: 11.8%;
}

#mainBodyPc .xhsQrcode {
    right: 7.8%;
}

#mainBodyPc .wxQrcodeImg,
#mainBodyPc .xhsQrcodeImg {
    width: 100%;
    height: 100%;
    background-color: #fff;
}

/* 头部导航栏 */
#mainBodyPc .navTop {
    width: 100%;
    min-width: 1720px;
    max-width: 1920px;
    height: 10%;
    position: fixed;
    top: 0;
    left: 0;
    background: url('../img/home/navTop.png');
    background-size: 100% 100%;
}

#mainBodyPc .navTopBox {
    width: 100%;
    height: 100%;
    padding: 0 5%;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
}

#mainBodyPc .navLogoImg {
    width: 9%;
}

#mainBodyPc .navTopName {
    width: 70%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
}

#mainBodyPc .navTopText {
    width: 70%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

#mainBodyPc .navTopTextPointer {
    display: flex;
    align-items: center;
    font-family: Source Han Sans SC;
    font-weight: 800;
    font-size: 26px;
    color: #FFDFA7;
    line-height: 31px;
}

#mainBodyPc .navTopTextPointer>div {
    height: 8.5vh;
    line-height: 8.2vh;
}

#mainBodyPc .navTopTextPointerHomeActive {
    background: url('../img/home/navTitleBg.png') no-repeat;
    background-size: 100% 100%;
}

#mainBodyPc .navTopTextPointerImg {
    width: 17%;
    margin-right: 5%;
}

#mainBodyPc .navTopTextPointerImg2,
#mainBodyPc .navTopTextPointerImg3,
#mainBodyPc .navTopTextPointerImg4,
#mainBodyPc .navTopTextPointerImg5 {
    display: none;
}

#mainBodyPc .navTopThirdParty {
    width: 25%;
    display: flex;
    align-items: center;
    justify-content: space-around;
}

#mainBodyPc .navTopThirdPartyImg {
    width: 16%;
}

/* 导航栏 */
#mainBodyPc .nav {
    width: 15%;
    height: 40%;
    position: fixed;
    top: 20%;
    left: 0;
    background: url('../img/home/menuBg.png');
    background-size: 100% 100%;
}

#mainBodyPc .navBox {
    width: 70%;
    height: 43%;
    margin-top: 37%;
    margin-left: 14%;
}

#mainBodyPc .navName {
    width: 100%;
    margin: 2% 0;
    display: flex;
    justify-content: center;
    align-items: center;
}

#mainBodyPc .pointerImg {
    width: 11%;
    margin-right: 3%;
}

#mainBodyPc .navText {
    font-size: 23px;
    font-weight: 700;
    color: #C38763;
}

.navTextActivation {
    margin-right: 14%;
    color: #885744 !important;
}

#mainBodyPc .templateLogo {
    width: 13%;
    position: absolute;
    top: 6%;
    left: 8%;
}

@media screen and (min-width: 1000px) and (max-width: 1400px) {
    #mainBodyPc .retractLeftImg {
        width: 40%;
        margin-top: 15%;
    }

    #mainBodyPc .retractRight {
        margin-top: 15%;
    }
}

@media screen and (min-width: 1200px) and (max-width: 1400px) {

    /* 导航栏字体 */
    #mainBodyPc .navBox {
        margin-top: 48%;
    }

    #mainBodyPc .navText {
        font-size: 18px;
        font-weight: 700;
        color: #C38763;
    }
}

@media screen and (min-width: 1000px) and (max-width: 1199px) {

    /* 导航栏字体 */
    #mainBodyPc .navBox {
        margin-top: 58%;
    }

    #mainBodyPc .navText {
        font-size: 18px;
        font-weight: 700;
        color: #C38763;
    }
}


@media screen and (max-width: 999px) {
    #mainBodyPc .retractLeftImg {
        margin-top: 17%;
    }

    #mainBodyPc .retractRight {
        margin-top: 17%;
    }

    /* 导航栏字体 */
    #mainBodyPc .navBox {
        margin-top: 64%;
    }

    #mainBodyPc .navText {
        font-size: 16px;
        font-weight: 700;
        color: #C38763;
    }

    /* 资讯标题 */
    #mainBodyPc .newsTitleText {
        font-size: 14px;
    }
}

#mainBodyPc #nav,
#mainBodyPc #retractName,
#mainBodyPc #expandName {
    display: none;
}