/*@font-face {*/
/*    font-family: initap;*/
/*    src: url(../../../font/CustomTitle.ttf)*/
/*}*/
.banner {
    background: #111111;
    height: auto;
    position: relative;
    overflow: hidden;
}
video{
    width: 100%;
}
.hero-svg {
    left: -33%;
    top: 66%;
    transform: translate(-4%, -13%);
    width: 176%;
    pointer-events: none;
    z-index: 1 !important;
    position: absolute;
}

.home-top {
    width: 1400px;
    margin: 1% auto;
    min-height: 100vh;
}

@media (min-width: 1024px) {
    .banner:after {
        position: absolute;
        left: 0;
        right: 0;
        bottom: -24px;
        content: "";
        z-index: 1;
        height: 50px;
        width: 100%;
        border-radius: 50%;
        background: #fff;
    }
}

.top-describe {
    margin-left: 0;
}

.top-describe p {
    width: 526px;
    font-size: 50px;
    font-weight: 500;
    color: #FFFFFF;
}

.top-font {
    margin-left: 0;
}

.top-font p {
    width: 455px;
    height: 49px;
    font-size: 16px;
    font-weight: 300;
    color: #B6BDCA;
    line-height: 30px;
}

.top-button {
    width: 300px;
    height: 54px;
    border: 1px solid;
    border-image: linear-gradient(90deg, #17A7D1, #14FECA) 3 3;
    margin-left: 0;
    margin-top: 10%;
    cursor: pointer;
}

.top-button p {
    font-size: 28px;
    font-weight: 400;
    color: #FFFFFF;
    line-height: 54px;
    text-align: center;
    background-image: -webkit-linear-gradient(left, #17A7D1, #14FECA);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.top-overseas{
    width: auto;
    font-size: 20px;
    font-weight: 500;
    color: #FFFFFF;

}
.top-tip{
    width: auto;
    font-size: 2.5rem!important;
    font-weight: 500;
    color: #FFFFFF;
    padding-top: 10px;
}
.top-download {
    width: 500px;
    margin-left: 0;
    margin-top: 6%;
}

.top-download .terminal {
    border-radius: 6px;
    display: inline-block;
    margin-top: 5%;
    margin-right: 3%;
    background: #242324;
}

.top-download-a {
    display: inline-block;
    z-index: 1;
    font-size: 14px;
    font-weight: 400;
    color: #FFFFFF;
    line-height: 56px;
    height: 56px;
    width: 140px;
    padding-left: 20%;
    /*padding-left: 22%;*/
    text-align: center;
    text-decoration: none !important;
    font-size: 1.8rem;
}

.top-download-a:hover {
    color: #0BD09E;
}

.top-download-a:focus {
    color: #FFFFFF;
}

.ios {
    position: relative;
}

.android {
    position: relative;
}

.ios a {
    background: url("../../../img/ioswhite.svg") 16px 10px no-repeat;
    background-size: 26px 32px;
}

.android a {
    background: url("../../../img/androidwhite.svg") 16px 10px no-repeat;
    background-size: 26px 32px;
}

.windows a {
    background: url("../../../img/windowswhite.svg") 16px 13px no-repeat;
    background-size: 26px 32px;
    padding-left: 26%;
}

.mac a {
    background: url("../../../img/Macwhite.svg") 16px 12px no-repeat;
    background-size: 26px 32px;
}

.mac_pro a {
    background: url("../../../img/Macwhite.svg") 16px 12px no-repeat;
    background-size: 26px 32px;
}
.tv a {
    background: url("../../../img/tvwhite.svg") 16px 10px no-repeat;
    background-size: 26px 32px;
}

.chrome a {
    background: url("../../../img/Chromewhite.svg") 16px 11px no-repeat;
    background-size: 22px 32px;
}
.android a:hover {
    background: url("../../../img/androidgreen.svg") 16px 10px no-repeat;
    text-decoration: none;
    border-radius: 6px;
    background-size: 26px 32px;
}
@media (min-width: 1024px) {
    .ios a:hover {
        background: url("../../../img/iosgreen.svg") 16px 10px no-repeat;
        text-decoration: none;
        border-radius: 6px;
        background-size: 26px 32px;
    }
    .windows a:hover {
        background: url("../../../img/windowsgreen.svg") 16px 13px no-repeat;
        text-decoration: none;
        border-radius: 6px;
        background-size: 26px 32px;
    }
    .mac a:hover {
        background: url("../../../img/Macgreen.svg") 16px 12px no-repeat;
        text-decoration: none;
        border-radius: 6px;
        background-size: 26px 32px;
    }
    .mac_pro a:hover {
        background: url("../../../img/Macgreen.svg") 16px 12px no-repeat;
        text-decoration: none;
        border-radius: 6px;
        background-size: 26px 32px;
    }

    .tv a:hover {
        background: url("../../../img/tvgreen.svg") 16px 10px no-repeat;
        text-decoration: none;
        border-radius: 6px;
        background-size: 26px 32px;
    }

    .chrome a:hover {
        background: url("../../../img/Chromegreen.svg") 16px 11px no-repeat;
        text-decoration: none;
        border-radius: 6px;
        background-size: 22px 32px;
    }
}

.top-earth {
    display: inline-block;
    width: 620px;
    height: 600px;
    float: right;
    margin-top: 20px;
    z-index: 20;
    margin-right: 9%;
    position: relative;
}
.top-earth-bg{
    width: 130%;
    margin-top: 10%;
}
.banner-left {
    margin-left: 8%;
    display: inline-block;
    margin-top: 8%;
}

.ios-hover:hover .hover-img {
    display: block !important;
}

.android-hover:hover .hover-img {
    display: block !important;
}

.index-box .why-recommend {
    height: 650px;
    padding-top: 10px;
}

.index-box .why-recommend .whyson {
    height: 300px;
    position: relative;
    background-color: #ffffff;
    box-shadow: 0px 5px 14px 0px rgba(101, 101, 101, 0.16);
    border-radius: 10px;
    padding: 0 20px;
}

.index-box .why-recommend .whyson .evaluation {
    position: absolute;
    bottom: 10px;
    left: calc(50% - 44px);
}

.index-box .why-recommend .whyson .whyson-info {
    padding-top: 40px;
}

.index-box .why-recommend .whyson .whyson-info p:nth-child(1) {
    text-align: center;
    font-size: 18px;
}

.index-box .why-recommend .whyson .whyson-info p:nth-child(2) img {
    width: 15px;
    height: 15px;
}

.index-box .why-recommend .whyson .whyson-info p:nth-child(3) {
    line-height: 20px;
    padding: 0 5px;
    text-align: center;
}

.index-box .why-title {
    font-size: 48px !important;
    font-weight: 500;
    height: 100px;
    line-height: 100px;
    text-align: center;
    color: #4D4D4D;
}

.index-box .swiper-container {
    width: 1200px;
    height: 400px;
    padding: 0 10px 60px 10px;
}

.index-box .swiper-container .why-pag .swiper-pagination-bullet {
    background: none;
    border: 1px solid #ffffff;
}

.index-box .swiper-container .why-pag .swiper-pagination-bullet-active {
    background-color: #ffffff !important;
}

.index-box .why-recommend .swiper-wrapper .swiper-slide {
    padding-top: 40px;
}

.index-box .why-recommend .swiper-wrapper .swiper-slide .avatar {
    height: 80px;
    width: 80px;
    border: 4px solid #ffffff;
    border-radius: 50%;
    margin: 0 auto;
    position: absolute;
    top: -40px;
    left: calc(50% - 40px);
}

.introduction {
    padding-top: 160px;
    width: 1200px;
    margin: 0 auto;
}

.introduction .introduction-one {
    height: 426px;
    margin-bottom: 20px;
    margin-top: 90px;
}

.introduction .introduction-one .introduction-title {
    height: 29px;
    line-height: 29px;
    font-weight: 500;
    font-size: 32px;
    margin-bottom: 18px;
}

.introduction .introduction-one .introduction-info {
    font-size: 16px;
    font-weight: 300;
    color: #808080;
    line-height: 29px;
}

.introduction .introduction-one .margintop30 {
    margin-top: 30px;
}

.introduction .introduction-one .appiconall {
    margin-top: 58px;
}

.introduction .introduction-one .appiconall img {
    height: 58px;
    width: 58px;
    float: left;
    margin-right: 5px;
}

.introduction .introduction-one .Speed-up-now {
    width: 196px;
    height: 59px;
    border: 1px solid #00CD99;
    border-radius: 6px;
    font-size: 20px;
    font-weight: 500;
    color: #00CD99;
    line-height: 32px;
    margin-top: 15px;
}

.download-box {
    padding: 120px 0px;
    width: 1200px;
    margin: 0 auto;
}

.download-box .download-title {
    text-align: center;
    color: #333333;
    font-size: 48px;
    margin-bottom: 44px;
}

.download-box .download-six {
    margin-top: 56px;
}

.download-box .download-six > div {
    text-align: center;
    float: left;
    width: 350px;
    height: 238px;
    border: 1px solid #7FF8D9;
    padding: 28px 0;
}

.download-box .download-six > div img {
    width: 51px;
    height: 64px;
    margin: 0 auto;
}

.download-box .download-six > div p {
    font-size: 30px;
    font-weight: 500;
    margin-bottom: 26px;
    margin-top: 15px;
}

.download-box .download-six > div .ljxz {
    width: 134px;
    height: 42px;
    line-height: 42px;
    border: 1px solid #999999;
    border-radius: 7px;
    margin: 0 auto;
    color: #999999;
    font-size: 18px;
}

.download-box .download-six > div .img-android {
    width: 57px;
    height: 66px;
}

.download-box .download-six > div .img-windows {
    width: 55px;
    height: 62px;
}

.download-box .download-six > div .img-mac {
    width: 62px;
    height: 55px;
}

.download-box .download-six > div .img-tv {
    width: 64px;
    height: 64px;
}

.download-box .download-six > div .img-llq {
    width: 64px;
    height: 64px;
}

.download-box .download-six div:nth-child(2) {
    margin: 0 65px;
}

.introduction .introduction-one .appiconall {
    margin-top: 28px;
    height: 58px;
    overflow: hidden;
    width: 100%;
    display: inline-block;
    position: relative;
}

.introduction .introduction-one .appiconall ol {
    position: absolute;
}

.introduction .introduction-one .appiconall ol li {
    width: 58px;
    height: 58px;
    float: left;
}

.game {
    background:#050C27 ;
    background-size: cover;
    height: 480px;
    width: 100%;
    margin-bottom: 30px;
    position: relative;
    z-index: 10;
}
@media (min-width: 1360px) {
    .wave {
        position: absolute;
        left: 0;
        bottom: 3%;
        width: 200%;
        height: 200px;
        background-repeat: repeat no-repeat;
        background-position: 0 bottom;
        transform-origin: center bottom;
        background-image: url("../../../img/waves.webp");
        z-index: -1;
    }
    @keyframes move_wave {
        0% {
            transform: translateX(0) translateZ(0) scaleY(1)
        }
        50% {
            transform: translateX(-25%) translateZ(0) scaleY(0.55)
        }
        100% {
            transform: translateX(-50%) translateZ(0) scaleY(1)
        }
    }
    .game .waveBottom {
        animation: move_wave 25s linear infinite;
    }
}
.game-content {
    width: 1320px;
    margin: 0 auto;
    height: 480px;
    display: flex;
}

.game-left {
    width: 580px;
    margin-top: 6%;
    margin-left: 5%;
}

.game-left-p1 {
    font-size: 52px;
    font-weight: 400;
    color: #00C9FF;
    background-image: -webkit-linear-gradient(left, #17A7D1 0%, #14FECA 53%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-family: "优设标题黑";
}

.game-left-p2 {
    width: 522px;
    height: 115px;
    font-size: 16px;
    font-weight: 300;
    color: #CAD7F2;
    line-height: 32px;
    display: block;
    margin-top: 5%;
}

.game-right {
    margin-right: 5%;
    margin-top: 2%;
    width: 620px;
    display: flex;
}

.game-right img {
  width: calc(100%/3);
    height: 410px;
    transition: all .5s;
}
.game-right img:hover{
    transform: translateY(-10px);
}
.game-button {
    margin-top: 10%;
}

.game-float {
    clear: both;
}

.game-button a {
    width: 338px;
    height: 55px;
    background: url("../../../img/gamebutton.png");
    background-size: 100% 100%;
    font-size: 22px;
    font-weight: 400;
    color: #FFFFFF;
    line-height: 55px;
    text-align: center;
    display: block;
}

.initap-advantage {
    width: 100%;
    height: 924px;
    background: url("../../../img/advantage.webp") no-repeat center;
    background-size: cover;
    margin-top: 24%;
}

.initap-advantage-content {
    width: 1400px;
    height: 100%;
    margin: 0 auto;
    position: relative;
}

.initap-advantage-top {
    width: 1330px;
    height: 480px;
    left: 2%;
    position: absolute;
    top: -40%;
}

.initap-advantage-top .describe-top-p {
    width: 345px;
    font-size: 48px;
    font-weight: 500;
    color: #4D4D4D;
    margin: 0 auto;
}

.initap-advantage-top-describe {
    width: 100%;
    height: 374px;
    margin-top: 62px;
    display: flex;
    background: #FFFFFF;
    box-shadow: 0px 7px 27px 0px rgba(0, 0, 0, 0.16);
}

.initap-advantage-top-describe div {
    display: inline-block;
    flex: 1;
    height: 100%;
    width: calc(100% / 4);
}

.initap-advantage-top-describe div img {
    margin: 50px auto 0;
    width: 79px;
    height: 79px;
}

.describe-first {
    width: 60px;
    height: 26px;
    font-size: 26px;
    font-weight: bold;
    color: #4D4D4D;
    line-height: 39px;
    margin: 50px auto 0;
}

.describe-second {
    width: 240px;
    height: auto;
    font-size: 16px;
    font-weight: 300;
    color: #666666;
    line-height: 30px;
    margin: 20px auto 0;
    text-align: center;
}

.initap-advantage-bottom {
    width: 1200px;
    height: 650px;
    margin: 0 auto;
    transform: translate(0, 42%);
}

.initap-advantage-bottom-top-p1 {
    width: 340px;
    height: 50px;
    font-size: 48px;
    font-weight: 500;
    color: #FFFEFE;
    margin: 0 auto;
}

.initap-advantage-bottom-top-p2 {
    width: 645px;
    height: 19px;
    font-size: 20px;
    font-weight: 300;
    color: #87CAC3;
    margin: 20px auto 0;
}

.initap-advantage-bottom-describe {
    display: flex;
    width: 100%;
    height: 450px;
    margin-top: 88px;
}

.initap-advantage-bottom-describe div {
    height: 100%;
    width: calc(90% / 3);
    margin-right: 3%;
}

.initap-advantage-bottom-describe1 {
    background: url("../../../img/workbg.webp");
}

.initap-advantage-bottom-describe2 {
    background: url("../../../img/financialbg.webp");
}

.initap-advantage-bottom-describe3 {
    background: url("../../../img/studybg.webp");
}

.initap-advantage-bottom-describe > div p:nth-child(1) {
    width: 53px;
    height: 26px;
    font-size: 26px;
    font-weight: bold;
    color: #FFFFFF;
    margin: 180px auto 0;
}

.initap-advantage-bottom-describe div p:nth-child(2) {
    width: 264px;
    height: auto;
    font-size: 16px;
    font-weight: 300;
    color: #FFFFFF;
    line-height: 30px;
    margin: 50px auto 0;
    text-align: center;
}

.index-box .why-recommend .whyson .evaluation ul li {
    list-style: none;
}

.index-box .why-recommend .whyson .evaluation ul {
    width: 130px;
    height: 30px;
}

.index-box .why-recommend .whyson .evaluation li {
    height: 20px;
    width: 20px;
    float: left;
    margin-left: 2px;
}

.yellow {
    background-image: url("../../../img/scoreyellow.jpg");
    background-repeat: no-repeat;
}

.black {
    background-image: url("../../../img/scorewhite.jpg");
    background-repeat: no-repeat;
}

.home-content-comments-content {
    display: flex;
    width: 1200px;
    margin: 0 auto;
}

.home-content-comments-content div {
    width: 30%;
    margin-right: 3%;
    height: 290px;
    margin-top: 50px;
    position: relative;
    background-color: #ffffff;
    box-shadow: 0px 5px 14px 0px rgb(101 101 101 / 16%);
    border-radius: 10px;
}

.home-content-comments-content-img {
    height: 80px;
    width: 80px;
    border: 4px solid #ffffff;
    border-radius: 50%;
    margin: 0 auto;
    position: absolute;
    top: -40px;
    left: calc(50% - 40px);
}

.home-content-comments-content div p:nth-child(2) {
    width: 150px;
    height: 17px;
    font-size: 17px;
    font-weight: 400;
    color: #111111;
    text-align: center;
    margin: 50px auto 0;
}

.home-content-comments-content div img:nth-child(3) {
    margin-top: 25px;
}

.home-content-comments-content div p:nth-child(4) {
    width: 313px;
    height: 110px;
    font-weight: 300;
    line-height: 28px;
    margin: 5px auto 0;
    overflow: hidden;
    font-size: 18px;
    color: #666666;
}

.home-content-comments-content-evaluation {
    width: 150px;
    height: 20px;
    margin: 20px auto 0;
}

.index-box .why-recommend .whyson .evaluation li {
    height: 20px;
    width: 20px;
    float: left;
    margin-left: 2px;
}

.home-content-comments-content div ul li {
    height: 20px;
    width: 20px;
    float: left;
    margin-left: 2px;
}

.plat_url, .plat_url:hover {
    text-decoration: none;
    color: #333333;
    font-size: 14px;
}

.index_a {
    display: block;
    margin: 0 auto;
    width: 196px;
    text-align: center;
}

.index_a, .index_a:hover {
    text-decoration: none;
    font-size: 20px;
    line-height: 59px;
    font-weight: 500;
    color: #00CD99;
}

@media screen and (min-width: 800px) and (max-width: 1023px) {
    .banner .banner-bac {
        width: 100% !important;
    }

    .banner .six {
        width: 80% !important;
        max-width: 800px !important;
        font-size: 14px;
    }
    .top-overseas{
        padding-top: 20px;
    }
}

.banner {
    padding-bottom: 0 !important;
}

.banner .banner-bac {
    width: 90%;
    max-width: 1200px !important;
    height: 100% !important;
}

.banner .six {
    max-width: 800px !important;
    display: block !important;
    margin: 0 auto;
    position: absolute !important;
    left: 0;
    right: 0;
    bottom: -45px;
}

.introduction {
    padding-top: 20px !important;
    width: 100%;
    margin: 0 auto;
}

.banner .six .six-right > div {
    display: block;
}

.banner .six .six-right > div > div {
    margin-right: 5px;
    width: 100px;
    height: 40px;
    line-height: 40px;
    float: left;
}

.banner .six .six-right > div > div {
    margin-right: 5px;
    width: 120px !important;
    height: 40px;
    line-height: 40px;
}

.banner .six .six-right > div > div {
    margin-right: 10px !important;
    width: 120px !important;
    height: 40px !important;
    line-height: 40px !important;
}

@media screen and (min-width: 1024px) {
    .mobile-view {
        display: none;
    }

    .initap-advantage-bottom-describe1:hover {
        background: url("../../../img/workgreen.webp");
    }

    .initap-advantage-bottom-describe2:hover {
        background: url("../../../img/financialgreen.webp");
    }

    .initap-advantage-bottom-describe3:hover {
        background: url("../../../img/studygreen.webp");
    }

    .initap-advantage-top-describe div:hover {
        background: #1A1E25;
        box-shadow: 0px 7px 13px 0px rgba(0, 0, 0, 0.66);
    }

    .initap-advantage-top-describe div:hover * {
        color: #FFFFFF;
    }
}

@media screen and (max-width: 1024px) {
    .banner-bac > .six {
        display: none !important;
    }

    .devices {
        width: 100%;
        margin: 0 auto;
    }

    .mobile-view {
        margin-bottom: 20px;
    }

    .device {
        width: 30%;
        margin-right: 1.5%;
        margin-left: 1.5%;
        margin-top: 10px;
        float: left;
        height: 40px;
        border: 2px solid #00BB8C;
        border-radius: 5px;
        background: url(/img/icon-mac-default.png) no-repeat left;
        background-position-x: 10%;
        line-height: 40px;
        text-align: right;
        padding-right: 2%;
        position: relative;
    }

    .device > .qrcode > img {
        display: none;
    }
}

@media screen and (min-width: 850px) {
    .banner {
        padding-bottom: 0 !important;
    }
}

@media screen and (max-width: 850px) {
    .banner-bac {
        width: 100% !important;
    }

    .banners {
        padding-bottom: 45.5%;
    }

    .banner {
        padding-bottom: 0 !important;
    }
}

@media screen and (min-width: 800px) and (max-width: 1023px) {
    .banner {
        height: 450px !important;
    }
}

@media (max-width: 1299px) {
    .top-earth {
        display: none;
    }
    .game {
        height: auto;
    }

    .game-content {
        width: 100%;
    }

    .game-left {
        margin: 0 auto;
        display: block;
        padding-top: 2%;
        width: 50%;
    }

    .game-button {
        width: 360px;
        margin: 10% auto 0;
    }

    .game-left-p1 {
        width: 440px;
        margin: 0 auto;
    }

    .top-describe {
        margin-top: 0;
        padding-top: 8%;
    }

    .home-top {
        margin: 0 auto;
        width: 1000px;
    }

    .top-font p {
        width: 400px;
    }
}


/*.top-earth-circle {*/
/*    position: absolute;*/
/*    top: -15%;*/
/*    animation: top-earth-circle 3s linear infinite;*/
/*    height: 820px;*/
/*    left: 4%;*/
/*}*/

/*@keyframes top-earth-circle {*/
/*    0% {*/
/*        -webkit-transform: rotate(0deg);*/
/*    }*/
/*    25% {*/
/*        -webkit-transform: rotate(90deg);*/
/*    }*/
/*    50% {*/
/*        -webkit-transform: rotate(180deg);*/
/*    }*/
/*    75% {*/
/*        -webkit-transform: rotate(270deg);*/
/*    }*/
/*    100% {*/
/*        -webkit-transform: rotate(360deg);*/
/*    }*/
/*}*/

.why-title-p {
    width: 659px;
    height: 52px;
    margin: 0 auto 45px;
}

.why-title-p p {
    font-size: 20px;
    font-weight: 300;
    color: #808080;
    line-height: 30px;
    text-align: center;
}

@media screen and (min-width: 1024px) and (max-width: 1299px) {
    .banner-left {
        position: relative;
    }

    .top-describe {
        margin-left: 8%;
    }

    .top-describe p {
        font-size: 40px;
    }

    .top-button {
        margin-left: 8%;
    }

    .top-download {
        position: absolute;
        left: 90%;
        top: 0;
    }

    .introduction .introduction-one .introduction-title {
        height: 50px;
        line-height: 35px;
    }

    .banner {
        height: 650px !important;
    }

    .top-numbers {
        margin: 2% auto 0 !important;
    }

    .initap-advantage {
        margin-top: 38%;
    }

    .initap-advantage-top {
        width: 100%;
        left: 0;
    }

    .initap-advantage-content {
        width: 100%;
    }

    .initap-advantage-bottom {
        width: 100%;
    }

    .audio, canvas, progress, video {
        width: 100%;
    }

    .describeimg2 img {
        width: 100%;
    }

    .describeimg3 img {
        width: 100%;
    }
}

@media screen and (min-width: 910px) and (max-width: 1023px) {
    .banner-left {
        margin: 0 auto !important;
        width: 480px;
    }

    .banner-left {
        position: relative;
    }

    .top-describe {
        margin-left: 8%;
    }

    .top-describe p {
        font-size: 40px;
    }

    .top-button {
        margin-left: 8%;
    }

    .top-download {
        position: absolute;
        left: 90%;
        top: 0;
    }

    .banner {
        height: 530px !important;
    }

    .top-numbers {
        margin: 2% auto 0 !important;
    }

    .initap-advantage {
        margin-top: 38%;
    }

    .initap-advantage-top {
        width: 100%;
        left: 0;
    }

    .initap-advantage-content {
        width: 100%;
    }

    .initap-advantage-bottom {
        width: 100%;
    }
    .game{
        height: auto;
    }
    .game-content {
        display: block;
        height: auto;
    }
}

@media screen and (min-width: 600px) and (max-width: 910px) {
    .home-top {
        width: 600px !important;
        height: 550px;
    }

    .top-describe {
        margin: 0 auto;
        width: 380px;
        padding-top: 2% !important;
    }

    .top-describe p {
        font-size: 40px;
    }

    .top-button {
        margin: 25px auto 0;
        width: 300px;
    }

    .top-download {
        margin: 0 auto;
        width: 480px;
    }

    .banner-left {
        margin: 0 auto;
        width: 500px;
        display: block;
    }

    .top-font p {
        width: 474px !important;
    }

    .banner {
        height: 530px !important;
    }

    .top-numbers {
        margin: 2% auto 0 !important;
    }

    .initap-advantage {
        margin-top: 48%;
    }

    .initap-advantage-top {
        width: 100%;
        left: 0;
    }

    .initap-advantage-content {
        width: 100%;
    }

    .initap-advantage-bottom {
        width: 100%;
    }

    .initap-advantage-bottom-describe > div p:nth-child(1) {
        width: 60px;
        margin-top: 50px;
    }

    .initap-advantage-bottom-describe div p:nth-child(2) {
        width: 200px;
    }

    .describe-second {
        width: 180px;
    }

    .initap-advantage-bottom-describe {
        height: 350px;
    }

    .initap-advantage-top {
        top: -33%;
    }

    .initap-advantage {
        height: 860px;
    }
.game{
    height: auto;
}
    .game-content {
        display: block;
        height: auto;
    }

    .game-left-p2 {
        width: 100%;
    }

    .game-button {
        margin: 25% auto 0 !important;
    }
    .top-overseas{
        padding-top: 20px;
    }
}

@media screen and (min-width: 1299px) and (max-width: 1730px) {
    .banner-left{
        margin-top: 5%;
        width: 45%;
    }
    .top-describe p{
        font-size: 32px;
    }
    .game{
        height: 420px;
    }
    .game-left {
        margin-left: 1%;
    }

    .game-right {
        margin-right: 0;
        width: 40%;
        margin-top: 5%;
    }

    .game-content {
        width: 80%;
    }
    .game-left-p1{
        font-size: 32px;
    }
    .game-left-p2{
        font-size: 12px;
    }
    .game-right img{
        height: 330px;
    }
    .game-button a{
        width: 280px;
        font-size: 16px;
    }
    .top-font p {
        width: 400px;
        font-size: 12px;
    }
    .home-top{
        width: 80%;
    }
    .top-earth{
        width: 40%;
        height: auto;
        margin-right: 2%;
    }
    .top-earth-bg{
        width: 120%;
    }
    /*.top-earth-circle{*/
    /*    height: 600px ;*/
    /*    top: -22% ;*/
    /*    left: -7% ;*/
    /*}*/
    .top-button{
        width: 240px;
        height: 40px;
        margin-top: 5%;
    }
    .top-button p{
        line-height: 40px;
        font-size: 16px;
    }
    .top-overseas{
        padding-top: 30px;
        font-size: 12px;
    }
    .top-download{
        width: 400px;
    }
    .top-download-a{
        width: 115px;
        font-size: 12px;
    }
    .top-numbers-p1 span{
        font-size: 20px !important;
    }
    .top-numbers-p2{
        font-size: 12px !important;
    }
    .top-line{
        margin-top: 2% !important;
    }
    .introduction{
        width: 80%!important;
    }
    .introduction-one{
        width: 100% !important;
    }
    .introduction .introduction-one .introduction-title{
        font-size: 26px;
    }
    .introduction .introduction-one .introduction-info{
        font-size: 12px;
    }
    #home_video{
        width: 100%;
    }
    .introduction .introduction-one .appiconall img{
        width: 45px;
        height: 45px;
    }
    .describeimg2>img{
        width: 90%;
        height: auto;
    }
    .describeimg3>img{
        width: 90%;
        height: auto;
    }
    .initap-advantage{
        margin-top: 32%;
    }
    .initap-advantage-top{
        width: 80%;
        left: 10%;
        height: 390px;
    }
    .initap-advantage-top .describe-top-p{
        font-size: 32px;
        text-align: center;
        width: 100%;
    }
    .initap-advantage-top-describe{
        height: 280px;
    }
    .initap-advantage-top-describe div img{
        margin: 20px auto 0;
    }
    .describe-first{
        font-size: 16px;
        width: 100%;
        text-align: center;
        margin: 30px auto 0;
    }
    .describe-second{
        font-size: 12px;
    }
    .initap-advantage-top-describe div img{
        width: 60px;
        height: 60px;
    }
    .initap-advantage-bottom{
        transform: translate(0, 19%);
    }
    .initap-advantage-bottom-top-p1{
        font-size: 32px;
        width: 100%;
        text-align: center;
    }
    .initap-advantage-bottom-top-p2{
        font-size: 16px;
        width: 100%;
        text-align: center;
    }
    .initap-advantage-bottom-describe{
        width: 80%;
        margin: 88px auto 0;
        height: 380px;
    }
    .initap-advantage-bottom-describe1:hover{
        background-position-x: -28px;
    }
    .initap-advantage-bottom-describe2:hover{
        background-position-x: -28px;
    }
    .initap-advantage-bottom-describe3:hover{
        background-position-x: -28px;
    }
    .initap-advantage-bottom-describe > div p:nth-child(1){
        font-size: 20px;
        width: 100%;
        text-align: center;
    }
    .initap-advantage-bottom-describe div p:nth-child(2){
        font-size: 12px;
    }
    .index-box .why-title{
        font-size: 32px !important;
    }
    .why-title-p p{
        font-size: 16px;
    }
    .home-content-comments-content{
        width: 75%;
    }
    .home-content-comments-content-img{
        width: 60px;
        height: 60px;
    }
}



@media (max-width: 1000px) {
    .describe {
        display: none;
    }

    .col-md-6 {
        float: none;
        margin: 5% auto;
    }

    .index-box .why-title {
        font-size: 30px !important;
    }
}

@media (max-width: 580px) {
    .home-content-comments-content div:nth-child(2) {
        display: none;
    }

    .home-content-comments-content div:nth-child(3) {
        display: none;
    }

    .home-content-comments-content {
        display: block;
        width: 100%;
    }

    .home-content-comments-content div {
        width: 90%;
        margin: 0 auto;
    }

    .hero-svg {
        top: 77%;
    }
    .top-overseas{
        padding-top: 20px;
        font-size: 16px;
        text-align: center;
    }
    .home-top {
        /*width: 300px !important;*/
        width: 100%;
        /*height: 660px;*/
        /*min-height: 580px;*/
        min-height: 85vh;
        background: url("../../../img/topbannerh5.png") no-repeat;
        background-size: cover;
        background-position-x: 40%;
    }
    .banner-left {
        margin: 0 auto;
        width: 90%;
        display: block;
    }

    .top-describe {
        margin: 0 auto;
        width: 100%;
        padding-top: 1%;
        background: rgba(17, 17, 17,0.35);
        position: relative;
        z-index: 1;
    }

    .top-describe p {
        width: 100%;
        font-size: 3rem;
        font-weight: bold;
        color: #FFFFFF;
        text-align: left;
        z-index: 10;
        position: relative;
    }
    .top-tip{
        padding-top: 2px;
        margin: 0;
    }
    .top-font{
        background: rgba(17, 17, 17,0.35);
        position: relative;
        z-index: 1;
    }
    .top-font p {
        width: 100%;
        font-size: 16px;
        line-height: 24px;
        padding-top: 1.5rem;
        position: relative;
        z-index: 10;
        color: #D6DDE9;
        height: auto;
    }

    .top-button {
        width: 100%;
        height: 40px;
        border: 1px solid;
        border-image: linear-gradient(90deg, #17A7D1, #14FECA) 3 3;
        margin: 15% auto 0;
        display: none !important;
    }

    .top-button p {
        font-size: 16px;
        font-weight: 400;
        color: #FFFFFF;
        line-height: 40px;
        text-align: center;
        background: linear-gradient(0deg, #17A7D1 0%, #14FECA 80.6884765625%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
    }

    .top-download {
        width: 100%;
        margin: 0 auto;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
    }

    .top-download .terminal {
        border-radius: 6px;
        width: 30%;
        background: rgba(17, 16, 17,0.5);
        display: flex;
    }

    .tv a{
        background: url(../../../img/tvwhite.svg) 10px 6px no-repeat;
        background-size: 23px 32px;
    }
    .chrome a {
        background: url(../../../img/Chromewhite.svg) 9px 6px no-repeat;
        background-size: 18px 32px;
    }
    .android a {
        background: url(../../../img/androidwhite.svg) 5px 6px no-repeat;
        background-size: 23px 32px;
    }
    .windows a {
        background: url(../../../img/windowswhite.svg) 6px 6px no-repeat;
        background-size: 21px 32px;
        padding-left: 26%;
    }
    .ios a {
        background: url(../../../img/ioswhite.svg) 11px 6px no-repeat;
        background-size: 22px 31px;
    }
    .mac_pro a {
        background: url(../../../img/Macwhite.svg) 6px 7px no-repeat;
        background-size: 23px 32px;
    }
    .index-box .why-title {
        margin-bottom: 0;
        height: 87px;
        font-size: 32px !important;
        width: 100%;
        text-align: center;
    }

    .top-download-a {
        display: inline-block;
        z-index: 1;
        font-size: 14px;
        font-weight: 400;
        color: #FFFFFF;
        line-height: 46px;
        height: 46px;
        text-align: center;
    }


    .introduction .introduction-one .introduction-title{
        font-size: 2.3rem;
    }
    .introduction .introduction-one .Speed-up-now {
        width: 100%;
        height: 48px;
        border: 1px solid #00cd99;
        border-radius: 4px;
        font-size: 20px;
        font-weight: 500;
        color: #00CD99;
        line-height: 48px;
        margin: 15px auto 0;
    }

    .introduction2 .introduction-title {
        line-height: 35px !important;
    }

    .introduction3 .introduction-title {
        line-height: 35px !important;
    }

    .introduction-title {
        width: 100%;
        text-align: center;
    }

    .introduction .introduction-one .introduction-info {
        line-height: 24px;
    }

    .why-title-p p {
        font-size: 16px !important;
        font-weight: 300 !important;
        color: #808080;
        line-height: 22px !important;
        text-align: left;
    }

    .index_a {
        text-decoration: none;
        font-size: 18px;
        line-height: 48px;
        font-weight: 500;
        color: #00CD99;
    }

    .why-title-p {
        width: 90% !important;
        margin-bottom: 70px !important;
    }

    .describeimgfont1 {
        width: 100% !important;
    }

    .describeimgfont2 {
        width: 100% !important;
    }

    .describeimgfont3 {
        width: 100% !important;
        padding-top: 10px !important;
    }

    .introduction1 {
        margin-top: 10px !important;
    }

    .introduction2 {
        margin-top: 10px !important;
    }

    .introduction3 {
        margin-top: 10px !important;
    }

    .introduction-info {
        padding-top: 15px;
    }
    .header-nav{
        width: 90%;
    }
    .header-box .logo-box{
        margin: 0;
    }
    .header-box .logo-box img{
        width: auto;
    }
    .top-line {
        width: 100% !important;
        margin: 55% auto 0 !important;
    }

    .top-numbers {
        width: 100% !important;
        /*height: 170px !important;*/
        margin:1rem auto !important;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
    }

    .top-numbers span {
        margin-right: 0 !important;
        /*width: 120px !important;*/
        margin-left: 0;
        text-align: center;
        width: 25%!important;
        height: initial;
    }

    .top-numbers-p1 span {
        font-size: 16px !important;
    }

    .top-numbers-p2 {
        font-size: 12px !important;
        text-align: center;
    }

    .initap-advantage {
        margin-top: 38%;
    }

    .initap-advantage-top {
        width: 100%;
        left: 0;
    }

    .initap-advantage-content {
        width: 100%;
    }

    .initap-advantage-bottom {
        width: 100%;
    }

    .initap-advantage-bottom-describe > div p:nth-child(1) {
        width: 60px;
        margin-top: 50px;
    }

    .initap-advantage-bottom-describe div p:nth-child(2) {
        width: 200px;
    }

    .describe-second {
        width: 180px;
    }

    .initap-advantage-bottom-describe {
        height: 350px;
    }

    .initap-advantage-top {
        top: -33%;
    }

    .initap-advantage {
        height: 1620px;
    }

    .initap-advantage-top-describe {
        display: inline-block;
        height: 600px;
    }

    .initap-advantage-top-describe div {
        width: 50%;
        height: 300px;
        float: left;
        border: 1px solid #E1E2E3;
    }

    .initap-advantage-top {
        top: -7%;
    }

    .initap-advantage-top-describe div img {
        margin-top: 20px;
    }

    .describe-first {
        margin-top: 20px;
        font-size: 20px;
        width: 50px;
    }

    .describe-second {
        line-height: 26px;
        font-size: 14px;
        width: 95%;
        text-align: center;
    }

    .initap-advantage-top .describe-top-p {
        font-size: 32px;
        width: 240px;
    }

    .initap-advantage-bottom {
        transform: translate(0, 84%);
        width: 100%;
    }

    .initap-advantage-bottom-describe {
        display: block;
    }

    .initap-advantage-bottom-describe div {
        width: 90%;
        margin: 0 auto;
        height: 255px;
    }

    .initap-advantage-bottom-describe div p:nth-child(1) {
        padding-top: 10px;
    }

    .initap-advantage-bottom-describe div p:nth-child(2) {
        width: 80%;
    }

    .initap-advantage-bottom-top-p1 {
        font-size: 32px;
        width: 100%;
        text-align: center;
        padding-top: 50px;
    }

    .initap-advantage-bottom-top-p2 {
        width: 100%;
        text-align: center;
        font-size: 16px;
        padding-top: 35px;
    }

    .game {
        height: auto;
    }

    .game-content {
        width: 100%;
        height: auto;
    }

    .game-left {
        width: 95%;
        margin: 5% auto 0;
    }

    .game-left-p1 {
        width: 100%;
        text-align: center;
        font-size: 36px;
        font-weight: 400;
        color: #00C9FF;
        background: linear-gradient(left, #17A7D1 0%, #14FECA 80.6884765625%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
    }

    .game-left-p2 {
        width: 100%;
        height: auto;
        font-size: 14px;
        font-weight: 300;
        color: #CAD7F2;
        line-height: 23px;
        display: block;
        margin-top: 5%;
        text-align: center;
    }

    .game-button {
        margin: 20px auto !important;
        width: 95% !important;
    }

    .game-button img {
        width: 100%;
        margin: 0 auto;
    }

    .game-button a {
        width: 100%;
        font-size: 18px;
    }

    .game-content {
        display: block;
    }

    .game-right {
        margin: 20px auto 0;
        width: 100%;
    }

    .game-right img {
        width: calc(85%/3);
        height: 210px;
        margin-left: 3%;
    }
}

@media (min-width: 1731px) {
    .introduction2 {
        margin-top: 120px;
        margin-bottom: 0 !important;
    }

    .describeimg1 {
        width: 55%;
    }

    .describeimg1 img {
        width: 120%;
    }

    .describeimgfont1 {
        width: 40%;
        margin-right: 5%;
    }

    .describeimg2 {
        width: 55%;
        height: 500px;
        padding: 0;
    }

    .describeimgfont2 {
        width: 45%;
        margin-top: 60px;
    }

    .describeimgfont2:nth-child(2) {
        margin-top: 36px;
    }

    .describeimgfont2:nth-child(3) {
        margin-top: 36px;
    }

    .describeimgfont2 div {
        margin-top: 40px;
    }

    .describeimgfont3 {
        width: 45%;
        padding-top: 100px;
    }

    .describeimg3 {
        margin-left: 93px;
        margin-top: 50px;
        width: 47%;
        padding: 0;
    }

    .describeimgfont2 .Speed-up-now {
        margin-top: 30px !important;
    }
    .describeimgfont2 .introduction-info{
        margin-top: 50px;
    }
    .describeimgfont2 .Speed-up-now {
        margin-top: 60px !important;
    }
    .describeimgfont3 .introduction-title {
        margin-bottom: 20px;
    }

    .describeimgfont3 .introduction-info {
        margin-top: 50px;
    }

    .describeimgfont3 .Speed-up-now {
        margin-top: 60px !important;
    }
}

.top-earth-bg {
    z-index: 20 !important;
}

.top-numbers {
    height: 80px;
    width: 800px;
    margin-top: 3%;
    margin-left: 8%;
}

.top-numbers span {
    display: inline-block;
    margin-right: 5%;
    width: 140px;
}

.top-numbers-p1 span {
    font-size: 32px;
    font-weight: 400;
    color: #FFFFFF;
    text-align: center;
    display: inline;
}

.top-numbers-p2 {
    font-size: 16px;
    font-weight: 300;
    color: #A4A9C3;
}

.top-line {
    margin-top: 7%;
    width: 1200px;
    height: 1px;
    background: #393D55;
    margin-left: 8%;
}

.more-evaluation {
    width: 175px;
    margin: 40px auto 0;
    display: block;
    color: #111111;
}

.more-evaluation:hover {
    text-decoration: none;
    color: #111111;
}

.more-evaluation:focus {
    text-decoration: none;
    color: #111111;
}

.introduction-one {
    width: 1250px;
    display: flex;
}