/* 媒体查询：根据屏幕宽度调整根字体大小 */
@media (max-width: 2559px) {
    html {
        font-size: 16px;
    }

    .wrap {
        min-width: 1830px;
    }
}

@media (max-width: 1920px) {
    html {
        font-size: 14px;
    }
}

@media (max-width: 1439px) {
    html {
        font-size: 12px;
    }
}

@media (max-width:1279px) {

    html {
        font-size: 15px;
        width: 100%;
    }

    .wrap {
        min-width: 100%;
        overflow-x: hidden;
    }

    .header_m {
        background-color: rgba(7, 7, 7, .6);
        height: calc(100 * var(--base) / var(--design-base));
        width: 100%;
        position: fixed;
        z-index: 9;
        padding: 0 calc(30 * var(--base) / var(--design-base));
    }

    .header_m .logo {
        order: 1;
    }

    .main_content {
        margin-top: calc(-155 * var(--base) / var(--design-base));
    }

    .mainCon1 {
        display: flex;
        padding: 0 calc(30 * var(--base) / var(--design-base));
        max-width: 1000px;
    }

    .download_content {
        max-width: 1000px;
        padding: 0 calc(30 * var(--base) / var(--design-base));
    }

    .wrap_banner {
        height: 115vw;
    }

    .wrap_banner .swiper-slide {
        height: 115vw;
        width: 100%;
    }

    .wrap_banner .swiper-slide img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center;
    }

    .wrap_banner:before {
        height: 35%;
    }

    .pagination-container {
        bottom: calc(230* var(--base) / var(--design-base));
    }

    .wrap_activity {
        height: calc(160 * var(--base) / var(--design-base));
        bottom: calc(220* var(--base) / var(--design-base));
    }

    .wrap_activity .swiper-slide {
        width: calc(100% / 1.4 - calc(18 * var(--base) / var(--design-base))) !important;
        /* height: calc(160 * var(--base) / var(--design-base)); */
    }

    .activity_box {
        min-width: unset;
        height: calc(160 * var(--base) / var(--design-base));
    }

    .activity_img {
        height: 100%;
        width: 40%;
        object-fit: cover;
    }

    .activity_text {
        padding: calc(15 * var(--base) / var(--design-base));
    }

    .wrap_activity .swiper-slide:hover .activity_box {
        transform: none;
        -webkit-transform: none;
    }

    .wrap_activity .swiper-slide:not(.swiper-slide-active) .slide-mask {
        opacity: 1;
    }

    .nav,
    .log_info {
        display: none;
    }

    .news_content {
        width: 100%;
        height: calc(430* var(--base) / var(--design-base));
    }

    .nav-item {
        font-size: calc(24 * var(--base) / var(--design-base));
    }

    .news_item {
        font-size: calc(22 * var(--base) / var(--design-base));
        height: calc(400 / 7* var(--base) / var(--design-base));
        line-height: calc(400 / 7* var(--base) / var(--design-base));
    }

    .news_item>div {
        width: 66%;
        font-size: calc(22 * var(--base) / var(--design-base));
        font-weight: 600;
    }



    .news_m {
        margin-top: calc(90 * var(--base) / var(--design-base));
    }

    .mainCon2_content {
        width: 100%;
        padding: 0 calc(30 * var(--base) / var(--design-base));
        max-width: 1000px;
    }

    .mainCon2_content .media {
        width: 100%;
    }

    .mainCon2 {
        padding: 40px 0;
    }

    .mobile-menu-btn {
        color: #fff;
        display: flex;
        align-items: center;
        padding-right: calc(30 * var(--base) / var(--design-base));
        font-size: 18px;

    }

    .mobile-menu-btn svg {
        cursor: pointer;
        width: calc(42 * var(--base) / var(--design-base));
        height: calc(32 * var(--base) / var(--design-base));
    }

    .main_content .title {
        font-size: calc(32* var(--base) / var(--design-base));
    }

    /* .news_m .news2 {
        width: 47vw;
    }

    .news_m .news2 .swiper3 {
        width: 47vw;
        height: 44vw;
    } */

    .news_m .news2 .swiper3 .swiper-slide img {
        width: 100%;
        height: 100%;
    }

    .news_m .login {
        /* width: 47vw; */
    }

    /* .login_box {
        width: 100%;
        height: 44vw;
        background-color: #ffffff;
        border-radius: 8px;
        padding: calc(16* var(--base) / var(--design-base));
        text-align: center;
    } */

    .login_box .icon-btn img {
        object-fit: contain;
    }

    .noLogin {
        margin-top: calc(30* var(--base) / var(--design-base));
    }

    .login_btn {
        width: 100%;
    }

    .mobile-menu-bottom .icon-btn img {
        height: calc(28* var(--base) / var(--design-base));
        width: auto;
    }

    .isLogin .userName {
        margin-bottom: calc(10* var(--base) / var(--design-base));
    }

    .isLogin .recharge p {
        color: #909090;
        font-size: calc(20* var(--base) / var(--design-base));
        border: 0;
        padding: 0;
        text-align: center;
        margin-bottom: calc(15* var(--base) / var(--design-base));
    }

    .isLogin .recharge button {
        border-radius: 4px;
        font-size: calc(22* var(--base) / var(--design-base));
        height: calc(45* var(--base) / var(--design-base));
        width: calc(80* var(--base) / var(--design-base));
    }

    .forgot {
        margin-bottom: calc(20* var(--base) / var(--design-base));
    }


    #page-main {
        width: 100%;
        height: auto;
        background: none;
    }

    #page-main .heroes {
        height: auto;
        width: 100%;
        padding: calc(50 * var(--base) / var(--design-base));
        position: relative;
        max-width: 1000px;
        margin-bottom: calc(260 * var(--base) / var(--design-base));
    }



    #page-main .heroes>.title,
    #page-main[data-hero="1"] .hero .content .stat {
        display: none
    }

    #page-main[data-hero="1"] {
        --c2d4b: url(../img/mob/43d50.png?04844);
        --0cf45: url(../img/mob/a79eb.png?b13ad);
        --5a071: url(../img/mob/aa438.png?482d1);
        --d9f31: url(../img/mob/4af3f.png?505f9);
        --cd964: url(../img/mob/00057.png?5e2ce);
        --32d86: url(../img/mob/1a5bf.png?44eae)
    }

    #page-main[data-hero="2"] {
        --c2d4b: url(../img/mob/8c586.png?2ad50);
        --0cf45: url(../img/mob/92889.png?e66a8);
        --5a071: url(../img/mob/3bb65.png?82c07);
        --d9f31: url(../img/mob/75323.png?5d972);
        --cd964: url(../img/mob/4e732.png?87deb);
        --32d86: url(../img/mob/4c919.png?6cc2d)
    }


    #page-main[data-hero="3"] {
        --c2d4b: url(../img/mob/9db62.png?b6be0);
        --0cf45: url(../img/mob/79f4a.png?a3f40);
        --5a071: url(../img/mob/dbc34.png?a5bc0);
        --d9f31: url(../img/mob/f9dd1.png?9709d);
        --cd964: url(../img/mob/01e81.png?c1a46);
        --32d86: url(../img/mob/76e87.png?8b627)
    }

    #page-main[data-hero="4"] {
        --c2d4b: url(../img/mob/4a343.png?df3e9);
        --0cf45: url(../img/mob/f1d43.png?35e52);
        --5a071: url(../img/mob/8c3ec.png?e5767);
        --d9f31: url(../img/mob/f2f3b.png?aed1e);
        --cd964: url(../img/mob/a4b15.png?8b3de);
        --32d86: url(../img/mob/4363d.png?8213d)
    }


    #page-main .heroes>.hero {
        position: relative;
        z-index: 2;
        width: 100%;
        height: auto;
    }


    #page-main .heroes>.hero .content {
        /* margin-top: 700px */
    }

    /* #page-main .heroes>.hero .content .name {
        display: flex;
        flex-direction: column;
        align-items: center;
        color: #2d2d2d;
        font-weight: normal;
        font-size: 130px;
        text-align: center;
    } */

    #page-main .heroes>.hero .content .name::before {
        display: block;
        order: 1;
        background: var(--c2d4b) no-repeat center;
        background-size: cover;
        width: calc(97 * var(--base) / var(--design-base));
        height: calc(106 * var(--base) / var(--design-base));
        content: "";
        position: static;
    }

    #page-main .heroes>.hero .content .name {
        padding-left: 0;
        justify-content: center;
        flex-direction: row-reverse;
        margin-top: 57%;
    }

    #page-main .heroes>.hero .content>.description {
        margin: 0 auto;
        color: #181818;
        font-size: calc(38 * var(--base) / var(--design-base));
        line-height: 1.5
    }

    #page-main .heroes>.hero .content>.description::before {
        content: attr(data-hero-description);
        font-size: calc(20 * var(--base) / var(--design-base));
        margin-top: calc(20* var(--base) / var(--design-base));
        color: #5a5a5a;
        height: auto;
    }

    #page-main .heroes>.hero .list {
        margin-top: calc(50 * var(--base) / var(--design-base));
        justify-content: center;
    }

    #page-main .heroes>.hero .list .hero {
        width: calc(235* var(--base) / var(--design-base));
        height: calc(128* var(--base) / var(--design-base));
    }

    #page-main .image {
        position: absolute;
        z-index: 1;
        inset: 0;
        overflow: hidden;
        pointer-events: none;
        max-width: 750px;
    }

    #page-main .image>* {
        position: absolute;
        inset: 0;
        background: no-repeat 50% calc(60* var(--base) / var(--design-base));
        background-size: 150%;
    }

    #page-main .image .image-1 {
        translate: 2400px -3000px;
        background-image: var(--0cf45)
    }

    #page-main .image .image-2 {
        background-image: var(--5a071)
    }

    #page-main .image .image-3 {
        background-image: var(--d9f31)
    }

    #page-main .image .image-4 {
        background-image: var(--cd964)
    }

    #page-main .image .image-5 {
        background-image: var(--32d86)
    }

    #page-main .image.animation-ready .image-1 {
        translate: 800px -1000px;
        opacity: 0;
        transition-property: translate, opacity
    }

    #page-main .image.animation-ready .image-2 {
        opacity: 0;
        transition-property: opacity
    }

    #page-main .image.animation-ready .image-3 {
        opacity: 0;
        transition-delay: .25s;
        transition-duration: .5s;
        transition-property: opacity
    }

    #page-main .image.animation-ready .image-4 {
        translate: -400px;
        opacity: 0;
        transition-delay: .125s;
        transition-duration: .5s;
        transition-property: translate, opacity;
        background-size: contain;
        background-position: top center;
    }

    #page-main .image.animation-ready .image-5 {
        translate: -320px 400px;
        opacity: 0;
        transition-delay: .25s;
        transition-property: translate, opacity
    }

    #page-main .image.animation-reset>* {
        transition-delay: 0s !important;
        transition-duration: 0s !important
    }

    #page-main .image.animation-start>* {
        translate: 0 !important;
        opacity: 1 !important
    }

    .video {
        top: calc(270 * var(--base) / var(--design-base));
        bottom: unset;
        right: calc(50 * var(--base) / var(--design-base));
    }

    .jobV {
        width: calc(216* var(--base) / var(--design-base));
        height: calc(121* var(--base) / var(--design-base));
    }

    .play {
        width: calc(41* var(--base) / var(--design-base));
        height: calc(41* var(--base) / var(--design-base));
    }

    .download_content .download_btn {
        width: 100%;
        margin: calc(45* var(--base) / var(--design-base)) auto calc(25* var(--base) / var(--design-base)) auto;
    }

    .download_content .requirement .specs {
        overflow: auto;
    }

    .download_content .requirement th,
    .download_content .requirement td {
        width: 265px;
    }

    .breadcrumb {
        font-size: calc(24* var(--base) / var(--design-base));
    }

    .news_details_date p {
        font-size: calc(24* var(--base) / var(--design-base));
    }

    .events_time {
        position: absolute;
        top: calc(25 * var(--base) / var(--design-base));
    }

    .search_header {
        display: flex;
        flex-direction: column;
        align-items: stretch
    }

    .search_header .search {
        display: flex;
        position: relative;
        order: 2;
        margin: 0 -1px;
        width: 100%
    }

    /* #news .search_header .search select {
        background: #fff url(../img/mob/c67cc.png?b5d4f) no-repeat calc(100% - 60px) center;
    } */
    .news_search {
        width: 100%;
    }

    .search_header .search option {
        background: #fff;
        color: #909090;
        text-transform: uppercase
    }

    #news .search_header .search [type=text] {
        display: block;
        flex-grow: 1;
        align-self: stretch;
        border: 0;
        border-bottom: 1px solid #e2e2e2;
        padding: 0 20px;
        color: #242424;
        font-size: 18px;
        border-radius: 0;
    }

    .search_header .search [type=text]::placeholder {
        color: #c4c4c4;
        text-transform: uppercase
    }

    .search_header .filter {
        order: inherit;
        width: 100%;
    }

    #news .search_header .filter select {
        background: #303030 url(../img/mob/65fde.png?451b5) no-repeat calc(100% - 10px) center;
        background-size: 26px 14px;
        display: block;
        appearance: none;
        padding: 0 100px 0 18px;
        width: 100%;
        height: 46px;
        color: #a7a7a7;
        font-size: 18px
    }

    .search_header .filter option {
        background: #303030;
        color: #a7a7a7
    }

    .search_header .filter [type=submit] {
        display: none
    }

    .newsList td {
        padding: calc(20 * var(--base) / var(--design-base));
        padding-right: 0;
        text-align: left;
        vertical-align: bottom
    }

    .newsList td:last-child {
        text-align: right;
        padding-right: calc(50 * var(--base) / var(--design-base));
        padding-left: 0;
        font-size: calc(20 * var(--base) / var(--design-base));
        flex: 1
    }

    .newsList td:first-child {
        text-align: left;
        padding-left: calc(50 * var(--base) / var(--design-base));
        width: 70%;
    }

    .newsList tr:last-child {
        border-bottom: none;
    }

    .pagination_m {
        font-size: calc(26 * var(--base) / var(--design-base));
        color: #999999;
        padding: calc(50 * var(--base) / var(--design-base));
    }

    .pagination_m .prev {
        background: url(../img/mob/pagination_prev.png) no-repeat;
        background-size: 100%;
        height: calc(63 * var(--base) / var(--design-base));
        width: calc(63 * var(--base) / var(--design-base));
        cursor: pointer;
    }

    .pagination_m .next {
        background: url(../img/mob/pagination_next.png) no-repeat;
        background-size: 100%;
        height: calc(63 * var(--base) / var(--design-base));
        width: calc(63 * var(--base) / var(--design-base));
        cursor: pointer;
    }

    .event-container {
        display: block;
        padding: 0;
    }

    .event-box {
        padding: calc(25 * var(--base) / var(--design-base));
        border-bottom: 1px solid #e2e2e2;
    }

    .event-box:last-child {
        border-bottom: none;
    }

    .event-item {
        width: 100%;
        box-shadow: none;
        align-items: center;
        height: calc(205 * var(--base) / var(--design-base));
    }

    .event-info {
        padding: 0 calc(30 * var(--base) / var(--design-base));
        width: calc(100% - calc(265 * var(--base) / var(--design-base)));
    }

    .event-info h3 {
        font-size: calc(28 * var(--base) / var(--design-base));
        font-weight: 600;
    }

    .event-info p {
        margin: 5px 0;
    }

    .event-item img {
        width: calc(265 * var(--base) / var(--design-base));
    }

    .videoPop .inVideoPop {
        width: 100%;
        height: 35%;
        top: 50%;
        transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
    }

    .videoPop .closeVideoBtn {
        width: 30px;
        height: 30px;
        right: 5px;
        top: -35px;
    }
}

@media (max-width:1000px) {
    html {
        font-size: 11.7px;
    }

    .zoom {
        /* zoom: .9; */
    }

    .mainCon1 {
        max-width: 750px;
    }

    .download_content {
        max-width: 750px;
        padding: 0 calc(30 * var(--base) / var(--design-base));
    }

    .mainCon2_content {
        max-width: 750px;
    }

    #page-main .heroes>.hero .content .name {
        margin-top: 62%;
    }

    .listPage .pagingUl a {
        font-size: calc(24 * var(--base) / var(--design-base));
    }

    .listPage .first::after {
        content: '<<';
        font-size: calc(22 * var(--base) / var(--design-base));
    }

    .listPage .last::after {
        content: '>>';
        font-size: calc(22 * var(--base) / var(--design-base));
    }

    .listPage .prev::after {
        content: '<';
        font-size: calc(22 * var(--base) / var(--design-base));
    }

    .listPage .next::after {
        content: '>';
        font-size: calc(22 * var(--base) / var(--design-base));
    }

}

@media (max-width:750px) {
    #page-main .heroes>.hero .content .name {
        margin-top: calc(790 * var(--base) / var(--design-base));
    }

    .news_item>div {
        width: 95%;
    }

    .mainCon1 {
        max-width: 100%;
    }

    .download_content {
        max-width: 100%;
        padding: 0 calc(30 * var(--base) / var(--design-base));
    }


    .mainCon2_content {
        max-width: 100%;
    }

    #page-main .heroes {
        max-width: 100%;
    }

    .media_item {
        width: calc(465 * var(--base) / var(--design-base));
    }

    .media_item_img {
        width: calc(465 * var(--base) / var(--design-base));
        height: calc(300 * var(--base) / var(--design-base));
    }

    .media_item img {
        width: 100%;
    }

    .news_item>span {
        display: none;
    }

}

@media(width <=640px) {
    #page-main .heroes>.hero .content .name {
        margin-top: 84%;
    }

    html {
        font-size: 10px;
    }

    .mainBody {
        min-width: 340px;
    }

    .zoom {
        /* zoom: .9; */
    }

    .news_item>div {
        width: 75%;
    }


    .isLogin .recharge p {
        margin-bottom: calc(8* var(--base) / var(--design-base));
    }

    .forgot {
        margin-bottom: calc(10* var(--base) / var(--design-base));
        margin-top: calc(10* var(--base) / var(--design-base));
    }

    .noLogin {
        margin-top: calc(15* var(--base) / var(--design-base));
    }



    .news_m .news2 .swiper3 .swiper-slide img {
        width: 100%;
        height: 100%;
    }

    .news_m .news2 {
        width: 47vw;
    }

    .news_m .news2 .swiper3 {
        width: 47vw;
        height: 44vw;
    }

    .news_m .login {
        width: 47vw;
    }

    .login_box {
        width: 100%;
        height: 44vw;
        background-color: #ffffff;
        border-radius: 8px;
        padding: calc(16* var(--base) / var(--design-base));
        text-align: center;
    }

    .mobile-menu-pop {
        width: 55%;
    }
}

@media(width <=510px) {
    #page-main .heroes>.hero .content .name {
        margin-top: 75%;
    }

    .media_item {
        width: calc(279 * var(--base) / var(--design-base));
    }

    .media_item_img {
        width: calc(279 * var(--base) / var(--design-base));
        height: calc(180 * var(--base) / var(--design-base));
    }

    .mobile-menu-pop {
        min-width: 200px;
    }
}