article{
    width: 100%;
    height: auto;
}
#selctOrderDotLi{
    background-color: #4692a3;
}
@media only screen and (min-width: 1242px){
    .index-video-content{
        position: relative;
        width: 100%;
        min-width: 1242px;
        margin: 0;
        z-index: 9;
    }
    .index-video{
        position: relative;
        width: 100%;
    }
    .index-video > div{
        position: absolute;
        left: 0;
        right: 0;
        bottom: 60px;
        margin: auto;
        font-size: 16px;
        text-align: center;
        color: #ffffff;
        z-index: 11;
    }
    .video-content{
        display: block;
        width: 100%;
        height: 100%;
        z-index: -11;
    }
    .index-video-title{
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        padding-top: 20%;
        color: #ffffff;
        text-align: center;
        background: rgba(0,0,0,.56);
    }
    .index-video-title > h1{
        line-height: 100%;
        font-size: 4.7vw;
        letter-spacing: 0.4vw;
        color: #ffffff;
    }
    .index-video-title > p{
        line-height: 100%;
        margin: 1.6vw auto 0;
        font-size: 1.7vw;
        font-weight: normal;
        font-stretch: normal;
        letter-spacing: 0.1vw;
        color: #ffffff;
    }
    .index-video-title > div:nth-child(3){
        margin: 3.9vw auto 0;
        font-size: 1.3vw;
        font-weight: normal;
        font-stretch: normal;
        letter-spacing: 0.2vw;
        color: #ffffff;
        cursor: pointer;
    }
    .index-video-title > div:nth-child(3)>div{
        display: inline-block;
        margin-right: 12px;
        vertical-align: middle;
    }
    .m-bg-down{
        display: none;
    }
    .bg-down{
        margin: 10% auto 0;
    }
    .down-loca{
        margin: 10% auto 0;
    }
    .index-video-text{
        margin: 31px auto;
        font-size: 24px;
        letter-spacing: 3px;
        color: #ffffff;
        text-align: center;
    }
    section{
        width: 1242px;
        height: auto;
        margin: 0px auto 0;
    }
    .camera{
        width: 1242px;
        height: 960px;
        overflow: hidden;
        background: linear-gradient(-90deg,
        #1e1e28 0%,
        #131318 68%,
        #080808 100%);
    }
    .camera-bgimg{
        display: block;
        width: 100%;
        height: 100%;
        background: url("../imgs/index/lanparte.png") no-repeat 585px 81px/333px 328px,url("../imgs/index/ronin.png") no-repeat 323px 317px/307px 458px;
        /*background: url("../imgs/index/lanparte.png") no-repeat 585px 409px/333px 328px,url("../imgs/index/ronin.png") no-repeat 323px 785px/307px 458px;*/
        -webkit-transition: all 1s;
        -moz-transition: all 1s;
        -ms-transition: all 1s;
        -o-transition: all 1s;
        transition: all 1s;
    }
    .camera-anima{
        display: none;
        background: url("../imgs/index/lanparte.png") no-repeat 585px 409px/333px 328px,url("../imgs/index/ronin.png") no-repeat 323px 785px/307px 458px;
    }
    .cameratext-anima{
        padding-top: 960px;
    }
    .camera-div{
        padding-top: 708px;
        text-align: center;
        font-size: 22px;
        letter-spacing: 1px;
        color: #ffffff;
        z-index: 99;
        -webkit-transition: all .3s ease;
        -moz-transition: all .3s ease;
        -ms-transition: all .3s ease;
        -o-transition: all .3s ease;
        transition: all .3s ease;
    }
    .camera-p{
        margin-top: 25px;
        font-size: 14px;
        color: #ffffff;
        text-align: center;
        z-index: 99;
    }
    .camera-button{
        display: block;
        width: 134px;
        height: 36px;
        line-height: 32px;
        margin: 74px auto 0;
        -webkit-border-radius: 18px;
        -moz-border-radius: 18px;
        border-radius: 18px;
        font-size: 16px;
        color: #e8ebee;
        text-align: center;
        border: solid 2px #f8f8f9;
        cursor: pointer;
        background: rgba(0,0,0,0);
    }
    .advisory-div{
        width: 1242px;
        height: 520px;
        background: #ffffff;
    }
    .advisory-div > div {
        display: inline-block;
        width: 621px;
        height: 520px;
    }
    .advisory-left1{
        padding: 62px 0 0 43px;
        -webkit-transition: all .5s ease;
        -moz-transition: all .5s ease;
        -ms-transition: all .5s ease;
        -o-transition: all .5s ease;
        transition: all .5s ease;
    }
    .advisory-right{
        padding: 60px 0 0 44px;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        float: right;
        -webkit-transition: padding-top .5s ease;
        -moz-transition: padding-top .5s ease;
        -ms-transition: padding-top .5s ease;
        -o-transition: padding-top .5s ease;
        transition: padding-top .5s ease;
    }
    .wow{
        padding-top: 80px;
    }
    .wow *{
        display: none;
    }
    .advisory-right1{
        float: right;
    }
    .advisory-text1{
        font-size: 22px;
        font-weight: bold;
        color: #262d34;
    }
    .advisory-text2{
        margin-top: 24px;
        font-size: 14px;
        color: #262d34;
    }
    .advisory-info{
        margin-top: 44px;
    }
    .advisory-info-left{

    }
    .advisory-info > div{
        display: inline-block;
    }
    .advisory-info-left > div,.advisory-info-right > div{
        display: inline-block;
        vertical-align: top;
    }
    .advisory-text3{
        width: 200px;
        padding-left: 14px;
        font-size: 14px;
        letter-spacing: 1.4px;
        color: #262d34;
    }
    .advisory-info-right{
        margin-left: 30px;
    }
    .advisory-right-button{
        width: 100px;
        height: 36px;
        margin-top: 64px;
        background-color: #107086;
        -webkit-border-radius: 2px;
        -moz-border-radius: 2px;
        border-radius: 2px;
        font-size: 14px;
        color: #ffffff;
        cursor: pointer;
    }
    .left-button{
        float: right;
        margin-right: 44px;
    }
    .conten1{
        width: 1242px;
        height: 850px;
        padding: 169px 98px 0;
        margin-top: 10px;
        background: url("../imgs/index/platformbg.jpg") no-repeat left bottom;
        /*background: url("../imgs/index/platformbg.jpg") no-repeat left bottom;*/
    }
    .conten1-bgimg{
        /*width: 800px;*/
        /*padding-top: 84px;*/
        /*margin: 0 auto;*/
    }
    .conten1-bgimg > div {
        display: inline-block;
        width: 250px;
        color: #ffffff;
        vertical-align: top;
    }
    .conten1-bgimg-div{
        overflow: hidden;
        width: 250px;
        height: 250px;
        margin-bottom: 118px;
        -webkit-border-radius: 125px;
        -moz-border-radius: 125px;
        border-radius: 125px;
    }
    .conten1-bgimg-div > img{
        width: 100%;
        margin: 0 auto 118px;
    }
    .conten1-bgimg-div > img:hover{
        cursor: pointer;
        transform: scale(1.1);
        -ms-transform:scale(1.1);     /* IE 9 */
        -moz-transform:scale(1.1);     /* Firefox */
        -webkit-transform:scale(1.1); /* Safari 和 Chrome */
        -o-transform:scale(1.1);
        -webkit-transition: all 300ms;
        -moz-transition: all 300ms;
        -ms-transition: all 300ms;
        -o-transition: all 300ms;
        transition: all 300ms;
    }
    .conten1-img-margin{
        margin: 0 140px;
    }
    .conten1-bgimg p {
        margin-bottom: 20px;
        font-size: 18px;
        font-weight: bold;
        color: #e1e8e6;
    }
    .conten1-bgimg span{
        font-size: 14px;
        color: #cccccc;
    }
    .pc-video-copyright{
        display: flex;
        justify-content: space-between;
        width: 1242px;
        margin-top: 4px;
        overflow: hidden;
    }
    .pc-video-copyright > div{
        position: relative;
        width: 414px;
        height: 630px;
    }
    .pc-video-copyright > div > img{
        width: 100%;
    }
    .pc-video-copyright-text{
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        padding-top: 186px;
        font-size: 0;
        background: rgba(0,0,0,.5);
        -webkit-transition: all .3s;
        -moz-transition: all .3s;
        -ms-transition: all .3s;
        -o-transition: all .3s;
        transition: all .3s;
    }
    .pc-video-copyright-text > img{
        display: block;
        width: 70px;
        height: 70px;
        margin: 0 auto 48px;
    }
    .pc-video-copyright-text > hr{
        width: 44px;
        height: 4px;
        margin: 2px auto 40px;
        background-color: #ffffff;
        -webkit-transition: all .3s;
        -moz-transition: all .3s;
        -ms-transition: all .3s;
        -o-transition: all .3s;
        transition: all .3s;
    }
    .pc-video-copyright-text > h4{
        font-size: 20px;
        letter-spacing: 1px;
        text-align: center;
        color: #ffffff;
    }
    .pc-video-copyright-text > p{
        width: 302px;
        margin: 300px auto 0;
        font-size: 16px;
        letter-spacing: 1px;
        color: #f7f7f7;
        -webkit-transition: all .3s;
        -moz-transition: all .3s;
        -ms-transition: all .3s;
        -o-transition: all .3s;
        transition: all .3s;
    }
    .enter-video-pc{
        padding-top: 109px;
        background: rgba(16,112,134,.8);
    }
    .enter-video-pc > hr{
        display: none;
    }
    .enter-video-pc > p{
        margin-top: 44px;
    }
    .video-copyright{
        display: none;
        width: 1242px;
        margin-top: 4px;
        overflow: hidden;
    }
    .video-copyright > ul{
        position: relative;
        width: 100%;
    }
    .video-copyright > ul > li{
        position: relative;
        display: block;
        /*width: 100%;*/
        height: 900px;
        background-attachment: fixed;
        background-repeat: no-repeat;
        background-position: 100% 0;
        background-size: 50%;
    }
    .desc-box,.avatar-box{
        display: inline-block;
        width: 50%;
        height: 100%;
    }
    .desc-box{
        background-color: #1d1d26;
        padding-top: 158px;
    }
    .desc-box1{
        background-image: url("../imgs/index/dataofcopyright.jpg");
        z-index: 1;
    }
    .desc-box2{
        background-image: url("../imgs/index/musiccopyright.jpg");
        z-index: 2;
    }
    .desc-box3{
        background-image: url("../imgs/index/videocopyright.jpg");
        z-index: 3;
    }

    .video-copyright-left-title{
        text-indent: 455px;
        font-size: 24px;
        font-weight: bold;
        color: #f7f7f7;
    }
    .video-copyright-left-content{
        width: 417px;
        margin-top: 43px;
        margin-left: 143px;
        font-size: 18px;
        text-align: right;
        color: #ffffff;
    }
    .operation{
        width: 100%;
        height: 1080px;
        padding-top: 94px;
        padding-bottom: 34px;
        color: #1b1c25;
    }
    .operation-title{
        text-align: center;
        font-size: 24px;
        font-weight: bold;
    }
    .operation-text{
        margin-top: 34px;
        font-size: 18px;
        letter-spacing: 1px;
        text-align: center;
    }
    .operation-img{
        position: relative;
        width: 100%;
        height: 698px;
        overflow: hidden;
        margin-top: 67px;
        letter-spacing: -8px;
    }
    .operation-img > li{
        overflow: hidden;
        display: inline-block;
        /*width: 310px;*/
        /*height: 100%;*/
        letter-spacing: normal;
    }
    .operation-li{
        width: 25%;
        height: 100%;
    }
    .operation-li-select{
        width: 100%;
        height: 100%;
        -webkit-transition: width 500ms;
        -moz-transition: width 500ms;
        -ms-transition: width 500ms;
        -o-transition: width 500ms;
        transition: width 500ms;
    }
    .operation-li-unselect{
        width: 0;
        -webkit-transition: width 500ms;
        -moz-transition: width 500ms;
        -ms-transition: width 500ms;
        -o-transition: width 500ms;
        transition: width 500ms;
    }
    .operation-img > li > div {
        position: relative;
        width: 100%;
        height: 100%;
    }
    .operation-img > li > div > div{
        position: absolute;
        display: inline-block;
        width: 100%;
        height: 0;
        top: 0;
        bottom: 0;
        margin: auto;
        padding: 50% 0;
        text-align: center;
        font-size: 24px;
        white-space: nowrap;
        color: #ffffff;
        z-index: 1;
    }
    .operation-img > li > div > img{
        width: 100%;
        height: 100%;
    }
    .operation-video{
        display: none;
        position: absolute;
        width: 1242px;
        height: 698px;
        top: 0;
        left: 0;
        z-index: 11;
    }
    .operation-button{
        display: block;
        width: 130px;
        height: 48px;
        margin: 52px auto;
        background-color: #107086;
        border: none;
        -webkit-border-radius: 4px;
        -moz-border-radius: 4px;
        border-radius: 4px;
        font-size: 18px;
        color: #ffffff;
        letter-spacing: 1px;
        cursor: pointer;
    }
    .order{
        width: 100%;
        /*height: 776px;*/
        padding-top: 42px;
        background-color: #f3f3f3;
    }
    .order-title{
        margin: 0 auto;
        font-size: 26px;
        font-weight: bold;
        color: #1b1c25;
        text-align: center;
    }
    .order-text{
        margin: 18px auto 0;
        font-size: 16px;
        color: #1b1c25;
        text-align: center;
    }
    .order-down{
        display: block;
        width: 190px;
        height: 36px;
        line-height: 36px;
        margin: 30px auto 34px;
        background-color: #343640;
        -webkit-border-radius: 2px;
        -moz-border-radius: 2px;
        border-radius: 2px;
        font-size: 16px;
        text-align: center;
        color: #ffffff;
        cursor: pointer;
    }
    .order-dot{
        letter-spacing: normal;
        text-align: center;
    }
    .order-dot > li {
        display: inline-block;
        width: 6px;
        height: 6px;
        margin: 0 7px;
        background-color: rgba(52,54,64,0.2);
        -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
        border-radius: 3px;
    }
    .order-img{
        margin: 24px auto 0;
        width: 465px;
        height: 547px;
        padding: 100px 24.5px 0;
        background: url("../imgs/index/phone-shell.png") no-repeat 0 0;
    }
    .order-img-width{
        position: relative;
        width: 416px;
        height: 447px;
        overflow: hidden;
    }
    .order-img-div{
        position: absolute;
        width: 2912px;
        left: -416px;
    }
    .order-img-div > img{
        float: left;
        width: 416px;
        height: 447px;
        margin: 0;
        letter-spacing: normal;
    }
    #mHide{
        display: block;
    }
    #mShow{
        display: none;
    }
    .opertion-video, .down-loca, .advisory-info-left >div:nth-child(2), .advisory-info-right >div:nth-child(2){
        display: none;
    }

}

@media only screen and (max-width: 1242px) {
    section{
        /*overflow: hidden;*/
        width: 100vw;
        height: auto;
        margin: 0 auto 0.8vw;
        border: none;
    }
    .index-video{
        width: 100vw;
        overflow: hidden;
    }
    .index-video-content{
        position: relative;
        width: 100vw;
        margin: 0;
    }
    .video-content{
        display: block;
        width: 300vw;
        margin-left: -100vw;
        z-index: -11;
    }
    .index-video-title{
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        padding-top: 49.5vw;
        color: #ffffff;
        text-align: center;
    }
    .index-video-title > h1{
        font-size: 10.3vw;
        letter-spacing: 0.4vw;
    }
    .index-video-title > p{
        margin: 4.5vw auto 0;
        font-size: 3.8vw;
    }
    .m-bg-down{
        width: 20vw;
        height: 20vw;
        margin: 17.8vw auto 0;
        background: url("../imgs/mobile/common/plya_white.png") no-repeat;
        -webkit-background-size: 20vw;
        background-size: 20vw;
        cursor: pointer;
        z-index: 66;
    }
    .index-video-text{
        margin: 2.5vw auto;
        font-size: 1.9vw;
        letter-spacing: 0.24vw;
        color: #ffffff;
        text-align: center;
    }
    .bg-down,.index-video > div{
        display: none;
    }
    .down-loca{
        width: 7vw; height: 7vw;
        margin: 42.2vw auto 0;
        cursor: pointer;
        /*background: url("../imgs/common/css_m_sprites.png") -663px -193px;*/
    }
    .down-loca > img{
        width: 100%;
    }
    .camera{
        width: 100vw;
        height: 120vw;
        background: linear-gradient(-90deg,
        #1e1e28 0%,
        #131318 68%,
        #080808 100%);
    }
    .camera-bgimg{
        width: 100%;
        height: 100%;
        background: url("../imgs/mobile/index/lanparte.png") no-repeat 44.3vw 10.3vw/38.88vw 39vw,url("../imgs/mobile/index/RORIN.png") no-repeat 16.7vw 40.7vw/34.5vw 51.5vw;
    }
    .camera-div{
        padding-top: 80.5vw;
        margin: 0 auto;
        text-align: center;
        font-size: 3.8vw;
        letter-spacing: 0.16vw;
        color: #ffffff;
    }
    .camera-p{
        width: 70vw;
        margin: 4.9vw auto 7.9vw;
        font-size: 2.9vw;
        line-height: 4vw;
        color: #ffffff;
        text-align: center;
        letter-spacing: 0.16vw;
        z-index: 99;
    }
    .camera-button{
        display: block;
        width: 29.7vw;
        height: 8vw;
        margin: 0 auto;
        line-height: 8vw;
        -webkit-border-radius: 4vw;
        -moz-border-radius: 4vw;
        border-radius: 4vw;
        font-size: 2.9vw;
        color: #e8ebee;
        text-align: center;
        border: solid 0.16vw #f8f8f9;
        cursor: pointer;
        background: rgba(0,0,0,0);
    }
    .advisory-left > img,.advisory-right1 > img {
        width: 100vw;
    }
    .advisory-div{
        width: 100vw;
    }
    .advisory-div > div {
        width: 100vw;
        height: auto;
    }
    .advisory-right,.advisory-left1{
        padding: 5vw 5vw 10vw;
    }
    .advisory-text1{
        font-size: 3.8vw;
        font-size: 3.8vmin;
        font-weight: bold;
        color: #262d34;
        letter-spacing: 0.16vw;
    }
    .advisory-text2{
        padding-top: 2vw;
        padding-top: 2vw;
        font-size: 2.8vw;
        color: #262d34;
        letter-spacing: 0.16vw;
    }
    .advisory-info{
        margin-top: 7.9vw;
    }
    .advisory-info-left{

    }
    .advisory-info > div{
        display: inline-block;
        width: 45vw;
    }
    .advisory-info-left >div:nth-last-child(n+2),.advisory-info-right >div:nth-last-child(n+2){
        margin: 0 auto;
    }
    .bg-customerservice{
        display: none;
    }
    .advisory-info-left >div:nth-child(2),.advisory-info-right >div:nth-child(2){
        width: 12.8vw;
        height: 12.8vw;
    }
    .advisory-info-left >div:nth-child(2) > img,.advisory-info-right >div:nth-child(2) > img{
        width: 100%;
    }
    .advisory-text3{
        padding: 4.5vw 0 0 0.96vw;
        color: #262d34;
        text-align: center;
    }
    /*.advisory-text3 > div:nth-child(1){*/
        /*font-size: 2.9vw;*/
        /*font-weight: bold;*/
    /*}*/
    .advisory-text3 > div{
        width: 100%;
        /*margin-top: 1.9vw;*/
        font-size: 2.7vw;
        letter-spacing:1px;
        text-align: left;
    }
    .advisory-info-right{
        float: right;
    }
    .advisory-right-button{
        display: none;
    }
    .bg-platformteaching{
        display: none;
    }
    .bg-Tutorial{
        display: none;
    }
    .bg-Creativemethod{
        display: none;
    }
    .bg-mediareserve{
        display: none;
    }
    .bg-assets{
        display: none;
    }
    .bg-website{
        display: none;
    }
    .bg-data{
        display: none;
    }
    .conten1{
        width: 100vw;
        /*height: 140vw;*/
        margin-top: 0.8vw;
        background-color: rgb(08,08,08);
    }
    .conten1-bgimg{
        width: 100vw;
        height: auto;
        padding-top: 4.8vw;
        margin: 0 auto;
        background: url("../imgs/mobile/index/platformbg.png") no-repeat 0 bottom / 100% auto;;
    }
    .conten1-bgimg > div {
        display: block;
        width: 80vw;
        padding-bottom: 6.4vw;
        margin: 0 auto;
        color: #ffffff;
        vertical-align: top;
    }
    .conten1-bgimg-div > img{
        display: block;
        width: 42.8vw;
        height: 42.8vw;
        margin: 0 auto;
    }
    .conten1-img-margin{
        margin: 0 7.5vw;
    }
    .conten1-bgimg p {
        margin-top: 3.8vw;
        font-size: 2.9vw;
        font-size: 2.9vmin;
        color: #e1e8e6;
        text-align: center;
        font-weight: bold;
    }
    .conten1-bgimg span{
        display: block;
        margin-top: 3.1vw;
        font-size: 2.9vw;
        font-size: 2.9vmin;
        color: #cccccc;
        text-align: center;
    }
    section:nth-child(4),section:nth-child(7){
        margin-bottom: 0;
    }
    .pc-video-copyright{
        display: none;
    }
    .video-copyright{
        width: 100vw;
        /*height: 125vw;*/
        overflow: hidden;
        letter-spacing: normal;
    }
    .video-copyright > ul{
        position: relative;
        width: 100%;
    }
    .video-copyright > ul > li{
        position: relative;
        display: block;
        width: 100vw;
        height: 179.2vw;
        padding-top: 125.7vw;
        background-position: 0 0;
        background-repeat: no-repeat;
        background-size: cover;
    }
    .desc-box{
        width: 100vw;
        height: 53.5vw;
        padding-top: 16.7vw;
    }
    .desc-box1{
        background-image: url("../imgs/mobile/index/dataofcopyright.jpg");
    }
    .desc-box2{
        background-image: url("../imgs/mobile/index/musiccopyright.jpg");
    }
    .desc-box3{
        background-image: url("../imgs/mobile/index/videocopyright.jpg");
    }
    .video-copyright-left-title{
        font-size: 5.5vw;
        font-size: 5.5vmin;
        font-weight: bold;
        text-align: center;
        letter-spacing: 0vw;
        color: #ffffff;
    }
    .video-copyright-left-content{
        width: 85.8vw;
        margin: 9.3vw auto 0;
        font-size: 3.9vw;
        font-weight: normal;
        font-stretch: normal;
        line-height: 6vw;
        letter-spacing: 0.2vw;
        color: #ffffff;
    }
    #mHide{
        display: none;
    }
    #mShow{
        display: block;
    }
    .video-copyright-right > img{
        width: 100%;
    }
    .operation{
        width: 100%;
        height: auto;
        padding: 7.5vw 3.8vw 2.9vw;
        color: #1b1c25;
    }
    .operation-title{
        text-align: center;
        font-size: 3.8vw;
        font-weight: bold;
    }
    .operation-text{
        width: 92.4vw;
        margin: 2.7vw auto 4.1vw;
        font-size: 2.7vw;
        letter-spacing: 0.16vw;
        text-align: center;
    }
    .operation-img{
        display: none;
    }
    .operation-button{
        display: block;
        width: 26.5vw;
        height: 9.6vw;
        margin: 6vw auto;
        background-color: #ffffff;
        border: solid 0.24vw #343640;
        -webkit-border-radius: 0.8vw;
        -moz-border-radius: 0.8vw;
        border-radius: 0.8vw;
        font-size: 3.8vw;
        color: #343640;
        letter-spacing: 0.16vw;
    }
    .opertion-video{
        width: 92.4vw;
    }
    .opertion-video-m{
        position: relative;
        width: 92.4vw;
        height: 51vw;
        padding-top: 19.1vw;
        background-repeat: no-repeat;
        -webkit-background-size: 92.4vw 51vw;
        background-size: 92.4vw 51vw;
    }
    .opertion-video-m > img{
        display: block;
        width: 100%;
        letter-spacing: normal;
    }
    #opertionVideoPlay{
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(0,0,0,0.2);
        z-index: 9999;
    }
    #opertionVideoPlay > div{
        position: relative;
        width: 100%;
        height: 100%;
    }
    #opertionVideoPlay > div > video{
        display: block;
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        width: 90vw;
        margin: auto;
    }
    .play-position{
        width: 12.8vw;
        height: 12.8vw;
        margin:  0 auto;
        background: url("../imgs/mobile/common/plya_white.png") no-repeat;
        background-size: 12.8vw 12.8vw;
        cursor: pointer;
    }
    .order{
        width: 100%;
        height: auto;
        padding: 7.4% 10.5% 0;
        background-color: #f3f3f3;
    }
    .order-title{
        margin: 0 auto;
        font-size: 5.4vw;
        font-weight: bold;
        color: #1b1c25;
        text-align: center;
    }
    .order-text{
        margin: 4.4vw auto 0;
        font-size: 2.9vw;
        color: #1b1c25;
        letter-spacing: 0.16vw;
        text-align: center;
    }
    .order-down{
        display: block;
        width: 51vw;
        height: 9.6vw;
        line-height: 9.6vw;
        margin: 4.4vw auto 4.7vw;
        background-color: #343640;
        -webkit-border-radius: 0.4vw;
        -moz-border-radius: 0.4vw;
        border-radius: 0.4vw;
        font-size: 3.8vw;
        text-align: center;
        color: #ffffff;
    }
    .order-dot{
        letter-spacing: normal;
        text-align: center;
        margin: 4.8vw auto 4.3vw;
    }
    .order-dot > li {
        display: inline-block;
        width: 1.4vw;
        height: 1.4vw;
        margin: 0 1vw;
        background-color: rgba(52,54,64,0.2);
        -webkit-border-radius: 0.7vw;
        -moz-border-radius: 0.7vw;
        border-radius: 0.7vw;
    }
    .order-img{
        width: 69.3vw;
        height: 84.5vw;
        margin: 1.9vw auto 0;
        padding: 14.6vw 3.35vw 0;
        background: url("../imgs/index/phone-shell.png") no-repeat 0 0/69.3vw 84.5vw;
    }
    .order-img-width{
        position: relative;
        width: 62.6vw;
        height: 69.9vw;
        overflow: hidden;
    }
    .order-img-div{
        display: none;
    }
    .order-img-div-m{
        position: absolute;
        width: 439vw;
        left: -62.6vw;
    }
    .order-img-div-m > img{
        float: left;
        width: 62.6vw;
        height: 69.9vw;
        margin: 0;
        letter-spacing: normal;
    }
}