*{ margin: 0; padding: 0; background-repeat: no-repeat;background-size: cover; border: none;}

a{ cursor: default;}

body{-moz-user-select:none;
    -webkit-user-select:none;
    -ms-user-select:none;
    -khtml-user-select:none;
    user-select:none;
}

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

    html,body{ font-size: 6px;}

}

@media screen and (min-width:280px) and (min-height:320px){

    html,body{ font-size: 8px;}

}

@media screen and (min-width:320px) and (min-height:360px){

    html,body{ font-size: 10px;}

}

@media screen and (min-width:360px) and (min-height:400px){

    html,body{ font-size: 13px;}

}

@media screen and (min-width:400px) and (min-height:480px){

    html,body{ font-size: 15px;}

}

@media screen and (min-width:480px) and (min-height:560px){

    html,body{ font-size: 16px;}

}

@media screen and (min-width:560px) and (min-height:640px){

    html,body{ font-size: 17px;}

}

@media screen and (min-width:640px) and (min-height:720px){

    html,body{ font-size: 18px;}

}

#loading{ background:#000; width:100%;height:100%;position:absolute;top:0;left:0;display:-webkit-box;-webkit-box-align:center;-webkit-box-pack:center;z-index:9999}

#loading .icon{position:absolute;width:100px; height:100px;left:50%;top:30%; margin-left:-50px; margin-top:-50px;-webkit-animation:shun360 2s linear infinite;-moz-animation:shun360 2s linear infinite;-o-animation:shun360 2s linear infinite;animation:shun360 2s linear infinite}

@-webkit-keyframes shun360{100%{-webkit-transform:rotate(360deg)}}@-moz-keyframes shun360{100%{-moz-transform:rotate(360deg)}}@-o-keyframes shun360{100%{-o-transform:rotate(360deg)}}@keyframes shun360{100%{-webkit-transform:rotate(360deg)}}

#loading p{position:absolute;left:0;top:30%; width: 100%; margin-top: 70px; color:#e83637; text-align: center;}

html,body,#mainbox {background:#2B4457; width: 100%;height: 100%; overflow: hidden;font-family: "Microsoft YaHei",Arial; position: relative;-webkit-text-size-adjust:none}


.page {

    position: absolute;

    width: 100%;

    min-height: 100%;

    text-align: center;

    overflow: hidden;

    left: 500%;

    top: 500%;

    background:none;

}

.page_active{ left: 0 !important; top:0 !important; z-index: 15;}

.page_fade{-webkit-animation:page_fade 1s ease both;-moz-animation:page_fade 1s ease both;-o-animation:page_fade 1s ease both;animation:page_fade 1s ease both}

@-webkit-keyframes page_fade{from{opacity: 1}to{opacity: 0}}

@-moz-keyframes page_fade{from{opacity: 1}to{opacity: 0}}

@-o-keyframes page_fade{from{opacity: 1}to{opacity: 0}}

@keyframes page_fade{from{opacity: 1}to{opacity: 0}}

.page_show{-webkit-animation:page_show 1s ease both;-moz-animation:page_show 1s ease both;-o-animation:page_show 1s ease both;animation:page_show 1s ease both}

@-webkit-keyframes page_show{from{opacity: 0}to{opacity: 1}}

@-moz-keyframes page_show{from{opacity: 0}to{opacity: 1}}

@-o-keyframes page_show{from{opacity: 0}to{opacity: 1}}

@keyframes page_show{from{opacity: 0}to{opacity: 1}}

.moveFromDown{-webkit-animation:moveFromDown .6s ease both;-moz-animation:moveFromDown .6s ease both;-o-animation:moveFromDown .6s ease both;animation:moveFromDown .6s ease both}
.moveToDown{-webkit-animation:moveToDown .6s ease both;-moz-animation:moveToDown .6s ease both;-o-animation:moveToDown .6s ease both;animation:moveToDown .6s ease both}
@-webkit-keyframes moveFromDown{from{-webkit-transform:translateY(100%)}}
@-moz-keyframes moveFromDown{from{-moz-transform:translateY(100%)}}
@-o-keyframes moveFromDown{from{-o-transform:translateY(100%)}}
@keyframes moveFromDown{from{transform:translateY(100%)}}
@-webkit-keyframes moveToDown{to{-webkit-transform:translateY(100%)}}
@-moz-keyframes moveToDown{to{-moz-transform:translateY(100%)}}
@-o-keyframes moveToDown{to{-o-transform:translateY(100%)}}
@keyframes moveToDown{to{transform:translateY(100%)}}


.moveFromUp{-webkit-animation:moveFromUp .6s ease both;-moz-animation:moveFromUp .6s ease both;-o-animation:moveFromUp .6s ease both;animation:moveFromUp .6s ease both}
.moveToUp{-webkit-animation:moveToUp .6s ease both;-moz-animation:moveToUp .6s ease both;-o-animation:moveToUp .6s ease both;animation:moveToUp .6s ease both}
@-webkit-keyframes moveFromUp{from{-webkit-transform:translateY(-100%)}}
@-moz-keyframes moveFromUp{from{-moz-transform:translateY(-100%)}}
@-o-keyframes moveFromUp{from{-o-transform:translateY(-100%)}}
@keyframes moveFromUp{from{transform:translateY(-100%)}}
@-webkit-keyframes moveToUp{to{-webkit-transform:translateY(-100%)}}
@-moz-keyframes moveToUp{to{-moz-transform:translateY(-100%)}}
@-o-keyframes moveToUp{to{-o-transform:translateY(-100%)}}
@keyframes moveToUp{to{transform:translateY(-100%)}}

body{max-width: 640px;margin: 0 auto;}
.header{ position:relative; width:100%;}
.header img{ display:block; max-width:100%; margin:0 auto;}
.mian{position: absolute;top: 0;bottom: 0;left: 0;right: 0;}
.header img.img2{width: 55%;margin-left: 15px;bottom: 0;position: absolute;}
.header img.img3{max-width:23%;position: absolute;top:20%;left: 35%;}
.btn{ padding:15px;overflow: hidden;}
.btns1, .btns2{ display:block;width:45%; text-align:center; color:#fff; border-radius:3px; font-size:16px; line-height:40px;}
.btns3, .btns4{width: 90px;display:block;text-align:center; color:#fff; border-radius:3px; font-size:16px; line-height:40px;}
.btns1{ background:#0C4CA2; float:left;}
.btns2{ background:#FE5252; float:right;}
.btns3{ background:#FE5252; float:left; visibility: hidden;}
.btns4{ background:#0C4CA2; float:right;}
.b{ font-weight:bold; color:#fff;}
.hieghts{display: block;height: 10px;width: 100%;padding: 0;margin: 0 auto;}
.now {height:57%;margin:0 15px;background:rgba(0,0,0,0.3);color: #fff;overflow-y: scroll;margin-top:20px;}
.new{line-height: 25px; text-align: left;color:#E8503F;width:80%; margin:0 auto;}
.nowUl{ width:95%; height:100%;margin:15px auto;}
.nowUl, .nowUl li{ list-style:none;}
.circl{height:12px; width:12px; display:block; border-radius:100%; background:#FE5252; float:left;}
.cont{border:0; border-left:1px solid #E8503F; padding-left:8px; margin-left:6px; color:#fff; font-size:12px; line-height:18px;padding-bottom: 10px; padding-top:4px;text-align: left;}
.conts{line-height: 12px;font-size:12px;text-align:left;padding-left:15px;color:#FE5252;}
.copyright{position:absolute;bottom:8px;left:0;right:0;line-height:28px;font-size:12px;color:#fff;}

.mians{ position:relative;position:absolute;bottom:5px;left:15px;right: 15px;}
.page3 .mian{bottom:0;}
.img5{ width:30%;position: absolute;right: 15px;bottom: 0;}
.img6{width:57%;position: absolute;bottom: 0;left:0;}
.img7{position: absolute;bottom:0;right:0;width:30%;}
.img8{ position:absolute;bottom:0;left:0;right:0; display:block; max-width:100%;z-index: -1;}
.nows{height:60%;margin:0 15px;color: #333;overflow-y: scroll;margin-top:10px;}
.nows img{ display:block; max-width:100%;}
.circls{display: block;width:12px;border: 1px solid #fff;border-radius: 100%;text-align: center;line-height:12px;font-size:12px; float:left;margin-top:2px;}
.contP{margin-left:18px;}
.ship{height:55%;margin:0 15px;margin-top:20px;/*display: box; display: -webkit-box; display: -moz-box; -webkit-box-pack:center; -moz-box-pack:center; -webkit-box-align:center; -moz-box-align:center;*/ }
.ship{ width:100%; margin:0 auto;}
.ship{width:100%;position: relative;height:212px;margin-top:20px;}
.ship .cover{position: absolute;top: 0;}
.ship .play{position: absolute; background: url(../images/play.png) no-repeat;background-size: 100% 100%;width: 60px;height: 60px;left: 55%;top:40%;margin-left: -50px;}
.ship .video{
    /* margin-bottom: 400px; */
}
.jianyi{ text-align:center; line-height:20px;color:#fff;margin-bottom:20px;}
.ship .video{display:none;width: 100%;}
.cover img{ display:block; width:100%;}
video{width:100%;}