*{
    margin: 0;
    padding: 0;
}
html,
body {
    position: relative;
    height: 100%;
}

#main{
    background: #FFF;
    position: relative;
    height: 100%;
    z-index: 1;
}

/**************************************************************************
*   pc style                                                              *
***************************************************************************/


body {
    position: relative;
    height: 100%;
}

body {
    background: #0E141C;
    font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
    font-size: .14rem;
    color: #000;
    margin: 0;
    padding: 0;
}

.pc{
    position: relative;
    height: 100%;
    z-index: 1;
    background: #0E141C;
}

.swiper-container {
    width: 100%;
    height: 100%;
    margin-left: auto;
    margin-right: auto;
}

.swiper-slide {
    height: 100%;
    text-align: center;
    font-size: .18rem;
    background: #0E141C;

    /* Center slide text vertically */
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}

#swiper-containertwo .swiper-slide {
    font-size: .18rem;
    height: auto;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display:block;
    background: #4390EE;
    color: #fff;

  }
.swiper-pagination-bullet {
    width: .08rem;
    height: .08rem;
}
.swiper-container-vertical>.swiper-pagination-bullets{
    right: .10rem;
}
.swiper-container-vertical>.swiper-pagination-bullets .swiper-pagination-bullet {
    margin: .06rem 0;
}


/* 首页滚动的区域 start */
:root {
    --swiper-theme-color: #259AFF !important;
}
.swiperbox{
    position: relative;
    height: 100%;
    z-index: 1;
}

.slidebox{
    position: relative;
    z-index: 2;
}

.bgcolor{
    width: 100vw;
    height: 100vh;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;
}

.newDesc{
    width: 100%;
    padding: 0 1.2rem;
}
.newDesc .title{
    font-family: Noto Sans SC;
    font-style: normal;
    font-weight: 500;
    font-size: .54rem;
    line-height: .78rem;
    color: #FFFFFF;
    text-align: left;
}
.newDesc .subTitle{
    font-family: Noto Sans SC;
    font-style: normal;
    font-weight: normal;
    font-size: .20rem;
    line-height: .29rem;
    text-align: left;
    color: rgba(255, 255, 255, 0.6);
}

/* pc 第一屏动画 start */
.vector{
    margin-top: 0;
    transition: all 1.3s ease-in;
    animation: myVector 3s;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-47%, -56%);
}
.vector > img{
    width: 6.9839rem;
    height: 4.1828rem;
}

@keyframes myVector{
    0%   {margin-top: .50rem}
    100% {margin-top: 0rem;}
}

.adtext{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-47%, -46%);
    margin-top: 0;
    transition: all 1.3s ease-in;
    animation: myAdtext 3s;
}
.adtext > img{
    width: 7.90rem;
}

@keyframes myAdtext{
    0%   {margin-top: .50rem}
    100% {margin-top: 0;}
}


.nextpage{
    cursor: pointer;
    position: absolute;
    left: 50%;
    transform: translate(-50%, 50%);
    animation-name: beat;
    /*动画名称*/
    animation-duration: .5s;
    /*设置秒数*/
    animation-timing-function: linear;
    /*速度曲线*/
    animation-iteration-count: infinite;
    /*播放次数*/
    animation-direction: alternate;
    /*逆向播放*/
    animation-play-state: running;
    /*正在运行*/
    z-index: 6;
}

.nextpage > img {
    /* width: .32rem;
    height: .59rem; */
    width: .60rem;
    height: .60rem;
}

.nextpage > a{
    display: inline-block;
    width: .36rem;
    height: .18rem;
}

.nextpage > a > img {
    width: .36rem;
    height: .18rem;
}

@keyframes beat {
    0% {
        /* bottom: 15%; */
        bottom: 7%;
    }

    100% {
        /* bottom: 14%; */
        bottom: 6%;
    }
}

/* pc 第一屏动画 end */

/* 第 2 屏 关于创世界 start */
.aboutinfo {
    margin-bottom: .42rem;
}

.infohead {
    margin-bottom: .24rem;
}

.abouttitle>h3 {
    font-family: Noto Sans SC;
    font-style: normal;
    font-weight: bold;
    font-size: .28rem;
    line-height: .30rem;
    color: #FFFFFF;
    margin-bottom: .24rem;
}

.abouttitle>.infoicon {
    text-align: center;
}

.abouttitle>.infoicon > img, .medialine > img{
    width: .66rem;
    height: .08rem;
}

.twoslide{
    margin-top: .965rem;
}

.twoslide .infocontent{
    width: 6.6rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
}

.aboutdesc:first-child {
    margin-bottom: .12rem;
}


.aboutdesc>p {
    font-family: Noto Sans SC;
    font-style: normal;
    font-weight: normal;
    font-size: .14rem;
    line-height: .20rem;
    text-align: center;
    color: rgba(255, 255, 255, 0.7);
    margin-top: 0;
    margin-bottom: 0;
}

.aboutcart {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}

.carditem {
    width: 2.20rem;
    background: #192C3F;
    box-shadow: 0 .12rem .32rem rgba(0, 0, 0, 0.03);
    backdrop-filter: blur(.16rem);
    border-radius: .06rem;
    margin: 0 .09rem .18rem .09rem;
    padding: .26rem 0 .34rem 0;
}

.cartimg {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    text-align: center;
    background: #192C3F;
    width: 1.00rem;
    height: 1.00rem;
    line-height: 1.00rem;
    margin: 0 auto .12rem auto;
}

.cartimg>img {
    width: .70rem;
    height: .70rem;
}

.caption>h3 {
    font-family: Noto Sans SC;
    font-style: normal;
    font-weight: bold;
    font-size: .18rem;
    line-height: .26rem;
    color: #FFFFFF;
    margin-bottom: .08rem;
}

.caption .ptext{
    font-family: Noto Sans SC;
    font-style: normal;
    font-weight: normal;
    font-size: .13rem;
    line-height: .18rem;
    text-align: center;
    color: rgba(28, 28, 28, 0.6);
    padding: 0 .24rem;
}
.caption .ptext.zhp {
    color: rgba(255, 255, 255, 0.7);
}

.caption .ptext.enp {
    background: #192C3F;
    height: .90rem;
    color: rgba(255, 255, 255, 0.7);

}

/* 第 2 屏 关于创世界 end */

/* 第 3 屏 投资方向 start */
.threeslide {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-top: .89rem;
}


.media {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
    background: #192C3F;
    box-shadow: 0 1.00rem .80rem rgba(0, 0, 0, 0.06), 0 .301471rem .241177rem rgba(0, 0, 0, 0.02), 0 .125216rem .100172rem rgba(0, 0, 0, 0.01), 0 .045288rem .0362304rem rgba(0, 0, 0, 0.00696822);
    border-radius: .06rem;
    overflow: hidden;
    height: 5.18rem;
    max-width: 12.00rem;
}

.media-left {
    width: 3.05rem;
    height: 5.18rem;
}

.media-left>img {
    width: 3.05rem;
    height: 5.18rem;
}

.media-body {
    padding: 0 1.02rem 0 1.02rem;
    width: 7.92rem;
    height: 5.18rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
}

.mediainfo {
    margin-bottom: .70rem;
}

.mediainfo .media-heading{
    margin-bottom: .24rem;
}

.media-heading {
    font-family: Noto Sans SC;
    font-style: normal;
    font-weight: bold;
    font-size: .28rem;
    line-height: .30rem;
    color: #FFF;
    text-align: left;
}

.medialine {
    text-align: left;
    margin-bottom: .24rem;
}

.mediadesc>p {
    font-family: Noto Sans SC;
    font-style: normal;
    font-weight: normal;
    font-size: .16rem;
    line-height: .23rem;
    color: rgba(255, 255, 255, 0.7);
    text-align: left;
    margin-top: 0;
    margin-bottom: 0;
}

.projectcontent {
    width: .6075rem;
    background: transparent;
}

.projectimg {
    text-align: center;
    margin-bottom: .17rem;
}

.projectimg>img {
    width: .36rem;
    height: .36rem;
}

.projectul {
    display: flex;
    flex-wrap: wrap;
    margin-left: -0.24rem;
}

.projectul .projectitem {
    margin: 0 .12rem .24rem .12rem;
}

.pcaption>h5 {
    font-family: Noto Sans SC;
    font-style: normal;
    font-weight: 500;
    font-size: .16rem;
    line-height: .23rem;
    text-align: center;
    color: #FFF;
    margin-top: 0;
    margin-bottom: 0;

}

.slidefooter {
    width: 100%;
}

.slidefooterAni {
    width: 100%;
    /* position: absolute; */
    /* bottom: 0; */
    transition: all .6s ease-in;
    z-index: 999;
}
/* 第 3 屏  投资方向 end */

/**************************************************************************
*   h5 style                                                              *
***************************************************************************/
#main .pc{ display: block; }
#main .h5{ display: none; }

/*适应pad端 宽度在640-780之间*/


/*适应pad端 宽度在390-640之间*/
@media screen and (min-width: 320px) and (max-width: 900px) {
    #main .pc{ display: none; }
    #main .h5{ display: block; overflow-x: hidden;}

    .vector {
        margin-top: 0;
        transition: all 1.3s ease-in;
        animation: myVector 3s;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -40%);
    }

    .adtext {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -30%);
        margin-top: 0;
        transition: all 1.3s ease-in;
        animation: myAdtext 3s;
    }

    /* h5 第 1 屏  */

    .newDesc{
        width: 100%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        padding-bottom: 1.5rem;
    }
    .newDesc .title{
        font-family: Noto Sans SC;
        font-style: normal;
        font-weight: 500;
        font-size: .34rem;
        line-height: inherit;
        color: #FFFFFF;
        text-align: left;
        width: 3.06rem;
    }
    .newDesc .subTitle{
        font-family: Noto Sans SC;
        font-style: normal;
        font-weight: normal;
        font-size: .14rem;
        line-height: inherit;
        text-align: left;
        color: rgba(255, 255, 255, 0.6);
        width: 3.06rem;
    }

    .h5oneslide {
        height: 100vh;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }

    .h5oneslide .vector>img {
        width: 3.6933rem;
        height: 2.212rem;
    }

    .h5oneslide .adtext>img {
        width: 4.10rem;
    }

    /* h5 第 2 屏 */
    .h5twoslide {
        padding: 1.00rem .24rem 0 .24rem;
    }

    .h5twoslide .infohead {
        margin-bottom: .24rem;
    }

    .h5twoslide .abouttitle>h3 {
        text-align: center;
        font-family: Noto Sans SC;
        font-style: normal;
        font-weight: bold;
        font-size: .32rem;
        line-height: .34rem;
        color: #FFFFFF;
    }

    .h5twoslide .aboutdesc>p {
        font-family: Noto Sans SC;
        font-style: normal;
        font-weight: normal;
        font-size: .16rem;
        line-height: .23rem;
        color: rgba(255, 255, 255, 0.7);
        text-align: left;
    }

    .h5twoslide .carditem {
        background: #192C3F;
        width: 100%;
        margin: 0 0 .18rem 0;
        padding: .50rem 0 .44rem 0;
    }

    .h5twoslide .cartimg {
        margin-bottom: .23rem;
        text-align: center;
    }

    .h5twoslide .caption {
        margin-bottom: .23rem;
    }

    .h5twoslide .caption>h3 {
        text-align: center;
        font-family: Noto Sans SC;
        font-style: normal;
        font-weight: bold;
        font-size: .22rem;
        line-height: .32rem;
        color: #FFF;
        margin-bottom: .08rem;
    }

    .h5twoslide .caption>p {
        font-family: Noto Sans SC;
        font-style: normal;
        font-weight: normal;
        font-size: .15rem;
        line-height: .22rem;
        color: rgba(28, 28, 28, 0.6);
        text-align: center;
    }

    /*  h5 第 3 屏 */
    .h5threeslide{
        padding: 0 .24rem;
        margin-bottom: 1.00rem;
    }
    .h5threeslide .investmentinfo{
        padding: 0 0;
    }
    .h5threeslide .media{
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        height: initial;
    }
    .h5threeslide .media-left{
        height: 1.60rem;
        width: 100%;
        margin-bottom: .48rem;
        
        
    }
    .h5threeslide .media-left > img{
        height: 1.60rem;
        width: 100%;
    }

    .h5threeslide .media-body{
        padding-left: 0;
        padding-top: 0;
        width: 100%;
        width: 100%;
        height: inherit;
    }
    .h5threeslide .mediainfo{
        margin-bottom: .50rem;
    }
    .h5threeslide .mediainfo > h3{
        font-size: .34rem;
        line-height: 34px;
        margin-bottom: .24rem;
        text-align: center;
    }
    .h5threeslide .medialine{
        text-align: center;
        margin-bottom: .24rem;
    }
    .h5threeslide .mediadesc{
        padding: 0 .16rem;
    }

    .h5threeslide .mediaproject{
        margin-left: 0;
        padding-bottom: .20rem;
        
    }

    .h5threeslide .projectul{
        margin-left: 0;
        justify-content: center;
    }

    .h5threeslide .projectitem {
         margin: 0 .06rem .27rem .06rem;
    }  

    .projectcontent {
        width: 1.00rem;
        background: #192C3F;
    }

    .media-body {
        padding: 0;
        width: 100%;
        height: initial;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }  
}