html{
    font-size: 625%
}
body,div,p,span{
    margin:0;
    padding:0;
}

.header2 {
    margin:0 auto;
    color: #FFFFFF;
    background:url('../images/banner_xhn.png') center 0 no-repeat;
    background-size: 19.2rem 8.4rem;
    height:8.4rem;
    padding: 0;
    max-width:1920px;
    width:100%;
}

/*@media only screen and (max-width:1920px) {*/
@media screen and (min-width:701px){
    .header2 .tip{
        position:absolute;
        top:4.4rem;
        left:3.6rem;
        font-family: 'AlibabaPuHuiTiR';
        color:#7D92C3;
        font-size:.19rem;
    }
    .header2 .buttons {
        padding: 5rem 8rem 0 3.6rem;
        display: flex;
        flex-wrap: wrap;
    }
    
    .header2 .buttons .btn_load{
        width: 2.4rem;
        color: #fff;
        background-image: linear-gradient(to right, #2ABAF8, #C331FE);
        border-radius: .072rem;
        margin: 0 .2rem .2rem 0;
        font-size: .28rem;
        height: .7rem;
        display: flex;
        align-items: center;
        padding-left: .42rem;
        white-space: nowrap;
        text-decoration:none;
    }
    
    .header2 .buttons .btn_load img {
        width: .46rem;
        height: .46rem;
        margin-right: .05rem;
    }


    
    .tableList .items {
        padding: 0 3.6rem;
    }
    .tableList .items .main {
        height: 6.06rem;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    .tableList .items .main .icon {
        width: 2.88rem;
        flex-shrink: 0;
    }
    .tableList .items .main .item {
        width: 5.5rem;
    }
    .tableList .items .main .item .title {
        margin-top:.6rem;
        font-size: .34rem;
        font-weight: bold;
        color:#ffffff;
    }
    .tableList .items .main .item .text {
        color: #ffffff;
        margin-top: .2rem;
        font-size: .2rem;
        text-align: left;
        line-height: .34rem;
    }
    .tableList .items .main .item .text ul{
        list-style-position: inherit;
    }

    .tableList .items .main2{
        flex-direction: row-reverse;
    }
      

    .tableList .bg1{
        background:url(../images/banner_xhn_bg1.png) center 0 no-repeat #50008F;
        background-size:19.2rem 6.09rem;
    }
    .tableList .bg2{
        background:url(../images/banner_xhn_bg2.png) center 0 no-repeat #50008F;
        background-size:19.2rem 6.09rem;
    }
    .tableList .bg3{
        background:url(../images/banner_xhn_bg3.png) center 0 no-repeat #50008F;
        background-size:19.2rem 6.09rem;
    }
    .tableList .bg4{
        background:url(../images/banner_xhn_bg4.png) center 0 no-repeat #50008F;
        background-size:19.2rem 6.09rem;
    }



    .load{
        height:7.3rem;
        background-image: linear-gradient(to top, #340078, #430077);
    }
    .load .load_title{
        color:#ffffff;
        text-align: center;
        font-size:.56rem;
        line-height:.77rem;
        padding-top:1.4rem;
        font-family: 'AlibabaPuHuiTiM';
    }
    .load .load_text{
        color:#FFFFFF;
        text-align:center;
        font-size:.18rem;
        margin-top:.1rem;
        line-height:.25rem;
    }
    .load .load_list{
        width:auto;
        max-width:13.05rem;
        height:2.16rem;
        margin:0 auto;
        margin-top:.99rem;
        display: flex;
    }
    .load .load_list .modli{
        visibility:'';
        display:'';
    }
    .load .load_list .li{
        flex:1;
        align-items:center;
    }
    .load .load_list .li .item{
        width:2.85rem;
        height:1.67rem;
        display:inline-block;
        border-radius:.06rem;
        margin:0 auto;
        background-image: linear-gradient(to right, #2ABAF8, #C331FE);
        padding-top:.49rem;
        cursor:pointer;
        text-decoration:none;
    }
    .load .load_list .li .item .icon_text{
        color:#ffffff;
        font-size:.18rem;
        text-align:center;
        margin-top:.14rem;
        height:.25rem;
        line-height:.25rem;
      }
    .load .load_list .li .item .iconimgpro{
        width:.5rem;
        height:.5rem;
        background-color:#ffffff;
        border-radius:.5rem;
        margin:0 auto;
        padding:.15rem;
    }
    .load .load_list .li .item .iconimgpro .iconimg_and{
        width:.5rem;
        height:.5rem;
        background:url(../images/load_android.png) 0 0 no-repeat;
        background-size:.5rem .5rem;
    }
    .load .load_list .li .item .iconimgpro .iconimg_ios{
        width:.5rem;
        height:.5rem;
        background:url(../images/load_ios.png) 0 0 no-repeat;
        background-size:.5rem .5rem;
      }
    .load .load_list .li .item .iconimgpro .iconimg_win{
        width:.5rem;
        height:.5rem;
        background:url(../images/load_windows.png) 0 0 no-repeat;
        background-size:.5rem .5rem;
      }
    .load .load_list .li .item .iconimgpro .iconimg_mac{
        width:.5rem;
        height:.5rem;
        background:url(../images/load_mac.png) 0 0 no-repeat;
        background-size:.5rem .5rem;
    }



    .footer {
        background-color: #2F006A;
        color:#ffffff;
        text-align: center;
        padding: .2rem;
        font-size: .14rem;
        line-height:.22rem;
    }
    .footer a, a:hover {
        color: rgba(255, 255, 255, .7);
      }
    .footer .curs{
        cursor:pointer;
    }

}



@media screen and (max-width: 700px) {
    .header2{
        background: url('../images/banner_home_xhn_h5.png') center 0 no-repeat #50008F;
        background-size:contain;
        height: 10rem;
    }
    .header2 .tip{
        position:absolute;
        top:5.6rem;
        left:.5rem;
        font-family: 'AlibabaPuHuiTiR';
        color:#7D92C3;
        font-size:.16rem;
    }
    .header2 .buttons {
        padding:6rem 0 0 0;
    }
    
    .header2 .buttons .btn_load{
        width: 2.8rem;
        color: #fff;
        background-image: linear-gradient(to right, #2ABAF8, #C331FE);
        border-radius: .072rem;
        margin: .16rem auto;
        font-size: .24rem;
        height: .6rem;
        display: flex;
        align-items: center;
        padding-left: .42rem;
        white-space: nowrap;
        text-decoration:none;
    }
    
    .header2 .buttons .btn_load img {
        width: .32rem;
        height: .32rem;
        margin-right: .05rem;
    }

     

    .tableList .bg1{
        background:url(../images/banner_xhn_h5_bg1.png) center center no-repeat #50008F;
        background-size:cover;
        height:2.2rem;
    }
    .tableList .bg2{
        background:url(../images/banner_xhn_h5_bg2.png) center center no-repeat #50008F;
        background-size:cover;
        height:2.2rem;
    }
    .tableList .bg3{
        background:url(../images/banner_xhn_h5_bg3.png) center center no-repeat #50008F;
        background-size:cover;
        height:2.2rem;
    }
    .tableList .bg4{
        background:url(../images/banner_xhn_h5_bg4.png) center center no-repeat #50008F;
        background-size:cover;
        height:2.2rem;
    }

    .tableList .items {
        padding: 0 .3rem;
    }
    .tableList .items .main {
        height: 2.2rem;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    .tableList .items .main .icon {
        width: 2.88rem;
    }
    .tableList .items .main .item {
        width: 100%;
        padding-top:.6rem;
    }
    .tableList .items .main .item .title {
        width:100%;
        font-size: .18rem;
        font-weight: bold;
        color:#ffffff;
    }
    .tableList .items .main .item .text {
        font-size: .14rem;
        margin-top: .13rem;
        color:#ffffff;
    }
    /*.tableList .items .main .item .text ul{
        list-style-position: inherit;
    }*/

    .tableList .items .main2{
        flex-direction: row-reverse;
    }



    .load{
        height:4.3rem;
        background-image: linear-gradient(to top, #340078, #430077);
    }
    .load .load_title{
        color:#ffffff;
        text-align: center;
        font-size:.24rem;
        line-height:.77rem;
        padding-top:.4rem;
        font-family: 'AlibabaPuHuiTiM';
    }
    .load .load_text{
        color:#FFFFFF;
        text-align:center;
        font-size:.18rem;
        margin-top:.1rem;
        line-height:.25rem;
    }
    .load .load_list{
        height:2rem;
        margin:0 auto;
        margin-top:.4rem;
        width:100%;
    }
    .load .load_list .li{
        display:inline-block;
        margin-left:5%;
        width:40%;
    }
    .load .load_list .li.modli{
        visibility:hidden;
        display:none;
     }
    .load .load_list .li .item{
        margin:0 auto;
        height:1.5rem;
        display:inline-block;
        width:100%;
        border-radius:.06rem;
        background-image: linear-gradient(to right, #2ABAF8, #C331FE);
        padding-top:.49rem;
        cursor:pointer;
        text-decoration:none;
    }
    .load .load_list .li .item .icon_text{
        color:#ffffff;
        font-size:.18rem;
        text-align:center;
        margin-top:.14rem;
        height:.25rem;
        line-height:.25rem;
      }
    .load .load_list .li .item .iconimgpro{
        width:.5rem;
        height:.5rem;
        background-color:#ffffff;
        border-radius:.5rem;
        margin:0 auto;
        padding:.15rem;
    }
    .load .load_list .li .item .iconimgpro .iconimg_and{
        width:.5rem;
        height:.5rem;
        background:url(../images/load_android.png) 0 0 no-repeat;
        background-size:.5rem .5rem;
    }
    .load .load_list .li .item .iconimgpro .iconimg_ios{
        width:.5rem;
        height:.5rem;
        background:url(../images/load_ios.png) 0 0 no-repeat;
        background-size:.5rem .5rem;
      }
    .load .load_list .li .item .iconimgpro .iconimg_win{
        width:.5rem;
        height:.5rem;
        background:url(../images/load_windows.png) 0 0 no-repeat;
        background-size:.5rem .5rem;
      }
    .load .load_list .li .item .iconimgpro .iconimg_mac{
        width:.5rem;
        height:.5rem;
        background:url(../images/load_mac.png) 0 0 no-repeat;
        background-size:.5rem .5rem;
    }



    .footer {
        background-color: #2F006A;
        color:#ffffff;
        text-align: center;
        padding: .2rem;
        font-size: .14rem;
        line-height:.22rem;
    }
    .footer a, a:hover {
        color: rgba(255, 255, 255, .7);
      }
    .footer .curs{
        cursor:pointer;
    }

}