@media screen and (min-width: 768px) {

    body {

        background-color: #ffeb0e

    }



    .main {

        margin: 0 auto;

        min-height: calc(100vh - 40px)

    }



    .game {

        background-color: #fff;

        border-radius: 10px;

        box-shadow: 0 2px 6px #645c00;

        overflow: hidden;

        position: relative

    }



    .game .h5-icon {

        background-color: #fd5811;

        border-radius: 0 0 0 20px;

        font-size: 16px;

        height: 30px;

        line-height: 30px;

        right: 0;

        top: 0;

        width: 40px;

        z-index: 11

    }



    .game .game-name, .game .h5-icon {

        color: #fff;

        position: absolute;

        text-align: center

    }



    .game .game-name {

        word-wrap: break-word;

        background-color: transparent;

        bottom: -50px;

        font-size: 20px;

        left: 50%;

        margin: 0 auto;

        transform: translateX(-50%);

        width: 100%

    }



    .game:before {

        background: rgba(0, 0, 0, .8);

        bottom: -50px;

        content: "";

        -webkit-filter: blur(10px);

        filter: blur(10px);

        height: 30px;

        left: 0;

        position: absolute;

        width: 100%;

        z-index: 3

    }



    .game:hover .game-name {

        bottom: 4px !important;

        transition: all .3s ease-out;

        z-index: 4

    }



    .game:hover:before {

        bottom: 0 !important;

        transition: all .3s ease-out

    }



    .game:hover .pic {

        transform: scale(1.1);

        transition: all .3s ease-in-out

    }



    .root {

        margin: 20px auto;

        width: 1300px

    }



    .root .title {

        color: #564f00;

        display: flex;

        font-size: 24px;

        font-weight: 700;

        text-align: left

    }



    .root .root-header {

        align-items: center;

        display: grid;

        gap: 20px;

        grid-template-columns:repeat(7, 168px);

        grid-template-rows:repeat(2, 168px);

        justify-items: center

    }



    .root .root-header .logo {

        position: relative

    }



    .root .root-header .logo .icon-logo {

        /* height: 200px; */

        /* width: 142px !important; */

    }



    .root .latestGames {

        margin-top: 36px

    }



    .root .latestGames .banner {

        display: flex;

        position: relative

    }



    .root .latestGames .banner .moreGames {

        cursor: pointer;

        display: flex;

        position: absolute;

        right: 0

    }



    .root .latestGames .banner .moreGames .text {

        color: #564f00;

        font-size: 16px;

        font-weight: 700;

        height: 31px;

        line-height: 31px;

        margin-right: 8px

    }



    .root .latestGames .banner .moreGames .icon-arrow {

        margin-top: 8px

    }



    .root .latestGames .text-content {

        padding: 16px 0

    }



    .root .latestGames .text-content .screenshots-warp {

        position: relative

    }



    .root .latestGames .text-content .screenshots-warp .screenshots-container {

        display: flex;

        overflow: hidden;

        transition: all .3s ease-in-out;

        width: auto

    }



    .root .latestGames .text-content .screenshots-warp .screenshots-container .pic-content {

        border-radius: 12px;

        height: auto;

        margin-bottom: 10px;

        margin-right: 16px;

        position: relative;

        text-align: center;

        text-decoration: none;

        width: auto

    }



    .root .latestGames .text-content .screenshots-warp .screenshots-container .pic-content .pic-screen {

        -webkit-border-top-left-radius: 12px;

        -webkit-border-top-right-radius: 12px;

        height: 240px;

        width: 313px;

        z-index: 4

    }



    .root .latestGames .text-content .screenshots-warp .screenshots-container .pic-content .pic-info {

        background-color: #fff;

        -webkit-border-bottom-left-radius: 12px;

        -webkit-border-bottom-right-radius: 12px;

        display: flex;

        flex-wrap: wrap;

        padding: 12px 10px

    }



    .root .latestGames .text-content .screenshots-warp .screenshots-container .pic-content .pic-info .game-name {

        -webkit-line-clamp: 1;

        line-clamp: 1;

        -webkit-box-orient: vertical;

        color: #564f00;

        display: -webkit-box;

        font-size: 20px;

        overflow: hidden;

        text-align: left;

        text-overflow: -o-ellipsis-lastline;

        text-overflow: ellipsis;

        width: 238px;

        word-break: break-word

    }



    .root .latestGames .text-content .screenshots-warp .screenshots-container .pic-content .pic-info .stars {

        display: flex;

        margin-right: 2px

    }



    .root .latestGames .text-content .screenshots-warp .screenshots-container .pic-content .pic-info .stars .icon-star {

        transform: scale(.6)

    }



    .root .latestGames .text-content .screenshots-warp .screenshots-container .pic-content .pic-info .stars .rating {

        color: #7e5e09;

        font-size: 16px;

        margin-left: 4px;

        margin-top: 3px

    }



    .root .latestGames .text-content .screenshots-warp .screenshots-container .pic-content .pic-info .game-description {

        -webkit-line-clamp: 2;

        line-clamp: 2;

        -webkit-box-orient: vertical;

        color: #a69800;

        display: -webkit-box;

        font-size: 16px;

        line-height: 24px;

        margin-top: 10px;

        overflow: hidden;

        text-align: left;

        text-overflow: -o-ellipsis-lastline;

        text-overflow: ellipsis;

        word-break: break-word

    }



    .root .latestGames .text-content .screenshots-warp .screenshots-container .pic-content:last-child {

        margin-right: 0

    }



    .root .latestGames .text-content .screenshots-warp .screenshots-container .pic-content:hover .pic-info {

        background-color: #fff69b

    }



    .root .ads1 {

        background-color: #ccc;

        width: 1300px



    }



    .root .ads1 .ads-title {

        color: #564f00;

        font-size: 16px;

        height: 18px;

        line-height: 18px;

        text-align: center

    }



    .root .ads1 .ads-container {

        height: auto;

        text-align: center;

    }



    .root .hotGames {

        margin-top: 36px

    }



    .root .hotGames .hotGamesContent {

        align-items: center;

        display: grid;

        gap: 20px;

        grid-template-columns:repeat(3, 420px);

        grid-template-rows:repeat(3, 105px);

        justify-items: center;

        margin-top: 14px

    }



    .root .hotGames .hotGamesContent .game-container {

        border-radius: 6px;

        box-shadow: 0 2px 6px #645c00;

        display: flex;

        height: 105px;

        overflow: hidden;

        text-decoration: none

    }



    .root .hotGames .hotGamesContent .game-container .pic {

        width: 105px

    }



    .root .hotGames .hotGamesContent .game-container .game-introduction {

        align-items: center;

        background-color: #fff;

        display: grid;

        grid-template-columns:auto;

        grid-template-rows:1fr 1fr 1fr;

        padding: 14px 12px;

        row-gap: 5px;

        width: 291px

    }



    .root .hotGames .hotGamesContent .game-container .game-introduction .row-1 {

        display: flex

    }



    .root .hotGames .hotGamesContent .game-container .game-introduction .row-1 .appName {

        -webkit-line-clamp: 1;

        line-clamp: 1;

        -webkit-box-orient: vertical;

        color: #757810;

        display: -webkit-box;

        font-size: 18px;

        font-weight: 700;

        overflow: hidden;

        text-align: left;

        text-overflow: -o-ellipsis-lastline;

        text-overflow: ellipsis;

        width: 156px;

        word-break: break-word

    }



    .root .hotGames .hotGamesContent .game-container .game-introduction .row-1 .stars {

        display: flex

    }



    .root .hotGames .hotGamesContent .game-container .game-introduction .row-1 .stars .icon-star {

        transform: scale(.8)

    }



    .root .hotGames .hotGamesContent .game-container .game-introduction .row-2 {

        align-items: center;

        display: flex

    }



    .root .hotGames .hotGamesContent .game-container .game-introduction .row-2 .load {

        display: flex;

        width: 244px

    }



    .root .hotGames .hotGamesContent .game-container .game-introduction .row-2 .load .icon-load {

        margin-right: 6px

    }



    .root .hotGames .hotGamesContent .game-container .game-introduction .row-2 .load .load-num {

        color: #a6a93e;

        font-size: 14px;

        font-weight: 700

    }



    .root .hotGames .hotGamesContent .game-container .game-introduction .row-2 .icon-ios {

        margin-left: -10px;

        margin-right: 6px

    }



    .root .hotGames .hotGamesContent .game-container .game-introduction .row-3 {

        align-items: center

    }



    .root .hotGames .hotGamesContent .game-container .game-introduction .row-3 .tags {

        display: flex

    }



    .root .hotGames .hotGamesContent .game-container .game-introduction .row-3 .tags .tag {

        -webkit-line-clamp: 2;

        line-clamp: 2;

        -webkit-box-orient: vertical;

        color: #a69800;

        display: -webkit-box;

        font-size: 14px;

        overflow: hidden;

        text-align: left;

        text-overflow: -o-ellipsis-lastline;

        text-overflow: ellipsis;

        word-break: break-word;

    }



    .root .hotGames .hotGamesContent .game-container .game-introduction .row-3 .tags .tag:nth-of-type(-n+4) {

       /* display: none*/

    }



    .root .hotGames .hotGamesContent .game-container:hover {

        border: 2px solid #7e5e09

    }



    .root .newGames {

        margin-top: 36px

    }



    .root .newGames .newGamesContent {

        display: grid;

        gap: 14px;

        grid-template-areas:"l1 l1 . . . . . . " "l1 l1 . . . . l2 l2 " ". . . . . . l2 l2 ";

        grid-template-columns:repeat(8, 150px);

        grid-template-rows:repeat(3, 150px);

        margin-top: 16px

    }



    .root .newGames .newGamesContent .lg1 {

        grid-area: l1

    }



    .root .newGames .newGamesContent .lg1 .h5-icon {

        border-radius: 0 0 0 26px;

        font-size: 20px;

        height: 40px;

        line-height: 40px;

        width: 50px

    }



    .root .newGames .newGamesContent .lg2 {

        grid-area: l2

    }



    .root .newGames .newGamesContent .lg2 .h5-icon {

        border-radius: 0 0 0 26px;

        font-size: 20px;

        height: 40px;

        line-height: 40px;

        width: 50px

    }



    .root .featuredGames {

        margin-top: 36px

    }



    .root .featuredGames .featuredGamesContent {

        display: grid;

        gap: 20px;

        grid-template-columns:repeat(7, 168px);

        grid-template-rows:repeat(2, 168px);

        margin-top: 16px

    }



    .icon-arrow {

        background-position: 0 0;

        height: 16px;

        width: 16px

    }



    .icon-star {

        height: 26px;

        width: 26px

    }



    .icon-star.full {

        background-position: -18px 0

    }



    .icon-star.half {

        background-position: -48px 0

    }



    .icon-star.null {

        background-position: -78px 0

    }



    .icon-load {

        background-position: -110px 0;

        height: 20px;

        width: 20px

    }



    .icon-ios {

        background-position: -136px 0;

        height: 24px;

        width: 24px

    }



    .icon-android {

        background-position: -166px 0;

        height: 24px;

        width: 24px

    }



    .bottom-navbar {

        background-color: #fff47e;

        font-size: 0;

        height: 50px;

        margin-top: 20px;

        overflow: hidden;

        position: relative;

        text-align: center

    }



    .bottom-navbar > a {

        color: #4b4d00;

        font-size: 16px;

        line-height: 50px;

        position: relative;

        text-decoration: none

    }



    .bottom-navbar > a:not(:last-child) {

        margin-right: 36px

    }



    .bottom-navbar > a:not(:last-child):before {

        background-color: #4b4d00;

        content: "";

        height: 20px;

        position: absolute;

        right: -19px;

        top: 50%;

        transform: translateY(-50%);

        width: 1px

    }



    .footer .about-us {

        padding: 0 70px;

        position: relative

    }



    .footer .about-us .about-warp {

        background-color: #fff47e;

        border-radius: 20px;

        padding: 36px 24px 28px;

        position: relative

    }



    .footer .about-us .about-warp .title {

        color: #4b4d00;

        font-size: 36px;

        margin: 0 auto;

        text-align: center

    }



    .footer .about-us .about-warp .para {

        margin-top: 31px

    }



    .footer .about-us .about-warp .para .para-title {

        color: #4b4d00;

        font-size: 20px;

        margin-bottom: 4px;

        margin-top: -10px

    }



    .footer .about-us .about-warp .para .para-text {

        color: #4b4d00;

        font-size: 14px;

        line-height: 1.5;

        margin-top: 21px

    }



    .footer .about-us .about-warp .para .para-text .contact {

        color: #3370ff;

        font-size: 14px;

        line-height: 1.5

    }



    .footer {

        padding-top: 24px

    }

}



@media screen and (max-width: 767px) {

    body {

        background-color: #ffeb0e

    }



    .main {

        margin: 0 auto

    }



    .game {

        background-color: #fff;

        border-radius: .1rem;

        box-shadow: 0 .02rem .06rem #645c00;

        overflow: hidden;

        position: relative

    }



    .game .h5-icon {

        background-color: #fd5811;

        border-radius: 0 0 0 .3rem;

        color: #fff;

        font-size: .22rem;

        height: .5rem;

        line-height: .5rem;

        position: absolute;

        right: 0;

        text-align: center;

        top: 0;

        width: .6rem;

        z-index: 11

    }



    .game .game-name {

        display: none

    }



    .game:hover .pic {

        transform: scale(1.1);

        transition: all .3s ease-in-out

    }



    .root .title {

        color: #564f00;

        display: flex;

        font-size: .3rem;

        font-weight: 700;

        text-align: left

    }



    .root .root-header {

        align-items: center;

        display: grid;

        gap: .2rem;

        grid-template-columns:repeat(3, 1.84rem);

        grid-template-rows:repeat(2, 1.84rem);

        justify-items: center;

        margin: .32rem auto;

        width: 6rem

    }



    .root .root-header .logo {

        position: relative

    }



    .root .root-header .logo .icon-logo {

        /* width: 1.56rem */

    }



    .root .root-header .game:nth-child(-n+9) {

        /*display: none*/

    }



    .root .latestGames {

        margin: .26rem auto;

        width: 6rem

    }



    .root .latestGames .banner {

        display: flex;

        position: relative

    }



    .root .latestGames .banner .moreGames {

        display: none

    }



    .root .latestGames .text-content {

        padding: .2rem 0

    }



    .root .latestGames .text-content .screenshots-warp {

        position: relative

    }



    .root .latestGames .text-content .screenshots-warp .screenshots-container {

        display: flex;

        overflow: hidden;

        transition: all .3s ease-in-out;

        width: auto

    }



    .root .latestGames .text-content .screenshots-warp .screenshots-container .pic-content {

        border-radius: .12rem;

        height: auto;

        margin-right: .2rem;

        position: relative;

        text-align: center;

        text-decoration: none;

        width: 2.87rem

    }



    .root .latestGames .text-content .screenshots-warp .screenshots-container .pic-content .pic-screen {

        -webkit-border-top-left-radius: .12rem;

        -webkit-border-top-right-radius: .12rem;

        height: 1.6rem;

        width: 2.87rem;

        z-index: 4

    }



    .root .latestGames .text-content .screenshots-warp .screenshots-container .pic-content .pic-info {

        background-color: #fff;

        -webkit-border-bottom-left-radius: .12rem;

        -webkit-border-bottom-right-radius: .12rem;

        display: flex;

        flex-wrap: wrap;

        padding: .16rem .1rem;
        flex-direction: column;

    }



    .root .latestGames .text-content .screenshots-warp .screenshots-container .pic-content .pic-info .game-name {

        color: #564f00;

        font-size: .22rem;

        margin: 0 auto;

        overflow: hidden;

        text-overflow: ellipsis;

        white-space: nowrap;

        width: 1.5rem

    }



    .root .latestGames .text-content .screenshots-warp .screenshots-container .pic-content .pic-info .stars {

        display: flex;

        margin: .16rem auto

    }



    .root .latestGames .text-content .screenshots-warp .screenshots-container .pic-content .pic-info .stars .icon-star {

        margin-left: .06rem

    }



    .root .latestGames .text-content .screenshots-warp .screenshots-container .pic-content .pic-info .stars .rating {

        color: #7e5e09;

        font-size: .22rem;

        margin-left: .16rem

    }



    .root .latestGames .text-content .screenshots-warp .screenshots-container .pic-content .pic-info .game-description {

        -webkit-line-clamp: 2;

        line-clamp: 2;

        -webkit-box-orient: vertical;

        color: #a69800;

        display: -webkit-box;

        font-size: .16rem;

        line-height: .24rem;

        overflow: hidden;

        text-align: left;

        text-overflow: -o-ellipsis-lastline;

        text-overflow: ellipsis;

        word-break: break-word

    }



    .root .latestGames .text-content .screenshots-warp .screenshots-container .pic-content {

        display: none

    }



    .root .latestGames .text-content .screenshots-warp .screenshots-container .pic-content:nth-child(2n) {

        margin-right: 0

    }



    .root .latestGames .text-content .screenshots-warp .screenshots-container .pic-content:first-child, .root .latestGames .text-content .screenshots-warp .screenshots-container .pic-content:nth-child(2) {

        display: block

    }



    .root .ads1 {

        text-align: center;

        background-color: #ccc;

        padding: 15px;

        margin: 20px -26px;

        display: flex;

        flex-direction: column;

        align-items: center;

        width: 6.33rem

    }



    .root .ads1 .ads-title {

        color: #564f00;

        font-size: .16rem;

        height: .22rem;

        line-height: .22rem;

        text-align: center

    }



    .root .ads1 .ads-container {

        height: auto;

    }



    .root .hotGames {

        margin: .32rem auto;

        width: 6rem

    }



    .root .hotGames .hotGamesContent {

        align-items: center;

        display: grid;

        grid-template-columns:5.92rem;

        grid-template-rows:repeat(4, 1.36rem);

        justify-items: center;

        margin-top: .2rem;

        row-gap: .2rem

    }



    .root .hotGames .hotGamesContent .game-container {

        border-radius: .1rem;

        box-shadow: 0 .02rem .06rem #645c00;

        display: flex;

        overflow: hidden;

        text-decoration: none

    }



    .root .hotGames .hotGamesContent .game-container .pic {

        height: 1.36rem;

        width: 1.36rem

    }



    .root .hotGames .hotGamesContent .game-container .game-introduction {

        align-items: center;

        background-color: #fff;

        display: grid;

        grid-template-columns:auto;

        grid-template-rows:1fr 1fr 1fr;

        height: 1.12rem;

        padding: .12rem .24rem;

        row-gap: .05rem;

        width: 4.08rem

    }



    .root .hotGames .hotGamesContent .game-container .game-introduction .row-1 {

        align-items: center;

        display: flex

    }



    .root .hotGames .hotGamesContent .game-container .game-introduction .row-1 .appName {

        -webkit-line-clamp: 1;

        line-clamp: 1;

        -webkit-box-orient: vertical;

        color: #757810;

        display: -webkit-box;

        font-size: .26rem;

        font-weight: 700;

        overflow: hidden;

        text-align: left;

        text-overflow: -o-ellipsis-lastline;

        text-overflow: ellipsis;

        width: 2.56rem;

        word-break: break-word

    }



    .root .hotGames .hotGamesContent .game-container .game-introduction .row-1 .stars {

        display: flex;

        margin-left: auto

    }



    .root .hotGames .hotGamesContent .game-container .game-introduction .row-1 .stars .icon-star {

        margin-right: .06rem

    }



    .root .hotGames .hotGamesContent .game-container .game-introduction .row-2 {

        align-items: center;

        display: flex

    }



    .root .hotGames .hotGamesContent .game-container .game-introduction .row-2 .load {

        display: flex

    }



    .root .hotGames .hotGamesContent .game-container .game-introduction .row-2 .load .icon-load {

        margin-right: .06rem;

        margin-top: .01rem

    }



    .root .hotGames .hotGamesContent .game-container .game-introduction .row-2 .load .load-num {

        color: #a6a93e;

        font-size: .18rem;

        font-weight: 700

    }



    .root .hotGames .hotGamesContent .game-container .game-introduction .row-2 .icon-ios {

        margin-left: auto

    }



    .root .hotGames .hotGamesContent .game-container .game-introduction .row-2 .icon-android {

        margin-left: .05rem

    }



    .root .hotGames .hotGamesContent .game-container .game-introduction .row-3 {

        align-items: center

    }



    .root .hotGames .hotGamesContent .game-container .game-introduction .row-3 .tags {

        display: flex

    }



    .root .hotGames .hotGamesContent .game-container .game-introduction .row-3 .tags .tag {

        -webkit-line-clamp: 2;

        line-clamp: 2;

        -webkit-box-orient: vertical;

        color: #a69800;

        display: -webkit-box;

        font-size: .16rem;

        line-height: .24rem;

        overflow: hidden;

        text-align: left;

        text-overflow: -o-ellipsis-lastline;

        text-overflow: ellipsis;

        word-break: break-word;

        font-weight: 700;

        margin-right: .24rem

    }



    .root .hotGames .hotGamesContent .game-container:nth-child(-n+5) {

        /*display: none*/

    }



    .root .newGames {

        margin: .32rem auto;

        width: 6rem

    }



    .root .newGames .newGamesContent {

        display: grid;

        gap: .2rem;

        grid-template-areas:"l1 l1 ." "l1 l1 ." ". . ." ". l2 l2" ". l2 l2" ". . .";

        grid-template-columns:repeat(3, 1.84rem);

        grid-template-rows:repeat(6, 1.84rem);

        margin-top: .2rem

    }



    .root .newGames .newGamesContent .lg1 {

        grid-area: l1

    }



    .root .newGames .newGamesContent .lg1 .h5-icon {

        border-radius: 0 0 0 .36rem;

        font-size: .26rem;

        width: .72rem

    }



    .root .newGames .newGamesContent .lg2 {

        grid-area: l2

    }



    .root .newGames .newGamesContent .lg2 .h5-icon {

        border-radius: 0 0 0 .36rem;

        font-size: .26rem;

        width: .72rem

    }



    .root .featuredGames {

        margin: .32rem auto;

        width: 6rem

    }



    .root .featuredGames .featuredGamesContent {

        display: grid;

        gap: .2rem;

        grid-template-columns:repeat(3, 1.84rem);

        grid-template-rows:repeat(5, 1.84rem);

        margin-top: .2rem

    }



    .sprite {

        background-size: 1.95rem .3rem

    }



    .icon-arrow {

        background-position: 0 0;

        height: .16rem;

        width: .16rem

    }



    .icon-star {

        height: .26rem;

        width: .26rem

    }



    .icon-star.full {

        background-position: -.18rem 0

    }



    .icon-star.half {

        background-position: -.48rem 0

    }



    .icon-star.null {

        background-position: -.78rem 0

    }



    .icon-load {

        background-position: -1.1rem 0;

        height: .2rem;

        width: .2rem

    }



    .icon-ios {

        background-position: -1.36rem 0

    }



    .icon-android, .icon-ios {

        height: .24rem;

        width: .24rem

    }



    .icon-android {

        background-position: -1.66rem 0

    }



    .bottom-navbar {

        background-color: #fff47e;

        font-size: 0;

        height: .85rem;

        margin-top: .32rem;

        overflow: hidden;

        position: relative;

        text-align: center

    }



    .bottom-navbar > a {

        color: #4b4d00;

        font-size: .22rem;

        line-height: .85rem;

        position: relative;

        text-decoration: none

    }



    .bottom-navbar > a:not(:last-child) {

        margin-right: .36rem

    }



    .bottom-navbar > a:not(:last-child):before {

        background-color: #4b4d00;

        content: "";

        height: .2rem;

        position: absolute;

        right: -.19rem;

        top: 50%;

        transform: translateY(-50%);

        width: .01rem

    }



    .footer .about-us {

        margin: 0 auto;

        position: relative;

        width: 6rem

    }



    .footer .about-us .about-warp {

        background-color: #fff47e;

        border-radius: .2rem;

        padding: .5rem .25rem .05rem;

        position: relative

    }



    .footer .about-us .about-warp .title {

        color: #4b4d00;

        font-size: .52rem;

        margin: 0 auto;

        text-align: center

    }



    .footer .about-us .about-warp .para {

        margin-top: .6rem

    }



    .footer .about-us .about-warp .para .para-title {

        color: #4b4d00;

        font-size: .24rem;

        margin-bottom: .04rem;

        margin-top: -.1rem

    }



    .footer .about-us .about-warp .para .para-text {

        color: #4b4d00;

        font-size: .24rem;

        line-height: 1.5;

        margin-top: .21rem

    }



    .footer .about-us .about-warp .para .para-text .contact {

        color: #3370ff;

        font-size: .24rem;

        line-height: 1.5

    }



    .footer {

        padding-top: .38rem

    }

}



body {

    font-size: 0;

    margin: 0 auto

}



.sprite {

    background-image: url(data:image/png;base64,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);

    background-repeat: no-repeat

}



.pic, .sprite {

    display: block

}



.pic {

    height: 100%;

    width: 100%

}



.name {

    font-size: 0;

    overflow: hidden

}

/* 优化新增样式 */
.game{width: 100%; height: 100%;}
.root .root-header .logo,.root .root-header .logo .icon-logo{width:100% !important;height:100% !important;}

@media screen and (min-width: 1200px) {
  .root,
  .root .ads1{
    max-width: 1300px !important;
  }
  .root .hotGames .hotGamesContent,
  .root .root-header,
  .root .newGames .newGamesContent,
  .root .featuredGames .featuredGamesContent{
    grid-template-rows: none !important;
  }
  .root .hotGames .hotGamesContent{margin-bottom: 50px;}
  .root .latestGames,.root .hotGames{ margin-top: 25px;}
  .footer .about-us{
    max-width: 1300px;
    margin: 0 auto;
  }
  .root .latestGames .text-content .screenshots-warp .screenshots-container .pic-content .pic-info{height: calc(100% - 270px);}
}

@media screen and (max-width: 768px) {
  .root .root-header,
  .root .newGames .newGamesContent,
  .root .featuredGames .featuredGamesContent{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    grid-template-rows: none;
    margin:0.2rem auto;
    gap:0;
  }
  .root .hotGames .hotGamesContent{
    display: block;
    margin:0.2rem auto;
    gap:0;
    row-gap:0;
  }
  .root-header-box{
    margin: 0.2rem auto; width: 6rem;
  }
  .root .hotGames .hotGamesContent .game-container{
    margin-top:0.2rem !important;
  }
  .root .hotGames .hotGamesContent .game-container .game-introduction{width: 4.64rem;}
  .root .root-header .logo,
  .game{
    width: 30% !important;
    height: 1.8rem !important;
    margin: 0.1rem;
  }
  .root .ads1{
    margin:0;
    padding:0;
    width:100vw;
    box-sizing: border-box;
  }
}