@charset "utf-8";
/*reset @jhw*/
body,div,h1, h2, h3, h4, h5, h6, p,blockquote,iframe,form, fieldset, legend,input, select, textarea, button,ul, li,ol, dl,dt, dd,pre,th,td,hr {margin: 0;padding: 0;}
img{ vertical-align: top;}
iframe{display: block;
    background-color: transparent;
}
input,textarea,frame, iframe,img, fieldset,input,textarea,button {border: none;}
object,input { vertical-align: middle;}
table {border-spacing: 0;border-collapse: collapse;}
ul,li,dl,dt,dd,ol {list-style: none;}
i,em ,address, cite, dfn, em, var{font-style: normal}
hr{border:none;height:1px;line-height: 1px;font-size: 0px;}
html {overflow-x: hidden;overflow-y: auto;height: 100%;min-width:320px;}

.mt10{margin-top:10px;}
/*表单元素*/
  input,
  select,
  textarea,
  button {
      font-family: "Microsoft Yahei", tahoma, arial, Hiragino Sans GB, "\5b8b\4f53", sans-serif;
      font-size: 12px;
      resize: none;
      outline: none;
  }

body {
    font:12px/22px "Microsoft Yahei",\5fae\8f6f\96c5\9ed1, \5b8b\4f53 ,Arial, Sans-serif;
    color: #9aa7ce;
    background: #28293c;
    min-height: 100%;
    _background-image:url(about:blank);
    _background-attachment:fixed;
}
a { text-decoration: none;  outline: none;  color:#fff;
    -webkit-transition: color 0.2s, background-color 0.2s;
    -moz-transition: color 0.2s, background-color 0.2s;
    -ms-transition: color 0.2s, background-color 0.2s;
    -o-transition: color 0.2s, background-color 0.2s;
    transition: color 0.2s, background-color 0.2s;}
.clearfix:after{display:block;clear:both;content:"";visibility:hidden;font-size:0px;height:0px;}
.clearfix{zoom:1;}
.hide{display:none;}
.mr25{margin-right:25px;}
.mt5{margin-top:5px;}
.mt10{margin-top:10px;}
.mt15{margin-top:15px;}
.mt20{margin-top:20px;}
.ml5{margin-left:5px;}
.ml15{margin-left:15px;}
.fl{float:left;}
.fr{float:right;}

.nav{ position:fixed; z-index:9999; top:0; left:0; width:100%;}
/*menu*/
.menu{
    width:63px;
    height: 532px;
    position: fixed;
    right:50px;
    top:50%;
    margin-top:-266px;
    background:  url(../images/menu-bg.png) 0 0 no-repeat;
    z-index:9999;
}
.menu ul{
    padding:103px 0;
}
.menu ul li{
    width:63px;
    height: 90px;
    margin-bottom:30px;
}
.menu li a{
    display: block;
    width:63px;
    height: 90px;
    font-size: 0px;
    text-indent: -9999px;
    background:  url(../images/menu.png) 0 0 no-repeat;
}
.menu .tag-1.active a,.menu .tag-1 a:hover{
    background-position: -63px 0;
}

.menu .tag-2 a{
    background-position: 0 -90px;
}
.menu .tag-2.active a,.menu .tag-2 a:hover{
    background-position: -63px -90px;
}
.menu .tag-3 a{
    background-position: 0 -180px;
}
.menu .tag-3.active a,.menu .tag-3 a:hover{
    background-position: -63px -180px;
}



/*channel*/
.container{
    width:100%;
    padding-bottom:120px;
}
.channel{
    width:100%;
    height:960px;
    background-position: center top;
    background-repeat: no-repeat;
   /* position: fixed;
    overflow: hidden;
    top: 0px;
    left: 0;*/
}
.channel-1{
    background-color: #5A6482;

}
.channel-2{
    background-color: #1F1D39;
}
.channel-3{
    background-color: #1F2140;
}


/*bg*/
.bgbox{
    position: absolute;
    left:0px;
    top:0px;
    width:100%;
    height: 100%;
}
.bgbox .bg{
    height: 348px;
    background-image: url(../images/bg-first-1.jpg);
    background-repeat: no-repeat;
    background-position: center top;
}
.bgbox-1 .bg-2{
    background-image: url(../images/bg-first-2.jpg);
}
.bgbox-1 .bg-3{
    background-image: url(../images/bg-first-3.jpg);
}
.bgbox-2 .bg-1{
    background-image: url(../images/bg-second-1.jpg);
}
.bgbox-2 .bg-2{
    background-image: url(../images/bg-second-2.jpg);
}
.bgbox-2 .bg-3{
    background-image: url(../images/bg-second-3.jpg);
}
.bgbox-3 .bg-1{
    background-image: url(../images/bg-three-1.jpg);
}
.bgbox-3 .bg-2{
    background-image: url(../images/bg-three-2.jpg);
}
.bgbox-3 .bg-3{
    background-image: url(../images/bg-three-3.jpg);
}

/*一屏*/
.btn-group{
    margin:525px 0 0 25px;
    height: 82px;

}
.btn{
    float: left;
    display: block;
    background:  url(../images/btns.png) 0 0 no-repeat;
}
.btn-get,.btn-star{
    width:276px;
    height: 82px;
    text-indent: -9999px;
}
.btn-get:hover{
    background-position: 0 -82px;
}
.btn-star{
    background-position: -279px 0;
}
.btn-star:hover{
    background-position: -280px -82px;
}
/*二屏*/
.titlebar{
    height: 80px;
    overflow: hidden;
}
.title{
    width:330px;
    height: 80px;
    background-position: 0 0;
    background-repeat: no-repeat;
}
.title02{
    background-image: url(../images/title02.png);
}
.title03{
    background-image: url(../images/title03.png);
}
.btn-share,.btn-msg{
    width:138px;
    height: 48px;
    line-height: 48px;
    font-size: 20px;
    text-align: center;
}
.btn-share{
    background-position : 0 -173px;
}
.btn-share:hover{
    background-position: 0 -221px;
}
.btn-msg{
    background-position: -140px -173px;
}
.btn-msg:hover{
    background-position: -140px -221px;
}

.flow{
    width:880px;
    height: 78px;
    padding:20px 0 20px 100px;
    background:  url(../images/flow.png) 0 0 no-repeat;
}
.flow li{
    float: left;
    width:124px;
    margin-left:85px;
}
.flow li .step{
    font-weight: bold;
    font-size: 18px;
}
.flow li .step .num{
    font-size: 22px;
}
.text-orange{
    color:#ff9b0d;
}
.play-game{
    width:988px;
    height: 463px;
    position: relative;
}
.play-game .hammer{
    position: absolute;
    width:133px;
    height: 159px;
    background:  url(../images/hammer.png) 0 0 no-repeat;
}
.btn-play{
    width:334px;
    height: 141px;
    text-indent: -9999px;
    position: absolute;
    left:344px;
    top:145px;
    z-index:2;
    cursor: pointer;
    background:  url(../images/star.png) 0 0 no-repeat;
}
.btn-play:hover{
    background-image: url(../images/star-h.png);
}
.play-game .shade{
    position: absolute;
    left:0px;
    top:0px;
    width:100%;
    height: 100%;
    background: #000;
    opacity: 0.6;
    filter:alpha(opacity=60);
    border-radius: 5px;
    z-index:1;

}
.burrow-list{
    padding:8px 110px 0;
    overflow: hidden;
}
.burrow-list li{
    width:174px;
    height: 140px;
    float: left;
    margin:6px 0 0 60px ;
    background:  url(../images/burrow.png) 0 0 no-repeat;
}
.burrow-list li.active{
    background-image: url(../images/burrow-h.png);
}
/*3*/
.video-cnt{
    font-size: 14px;
    line-height: 35px;
    background:  url(../images/video-bg.png) 0px bottom no-repeat;
}
.video-cnt dt{
    font-size: 30px;
    font-weight: bold;
    color:#e6ecff;
}
/**/
.copyright{
    width:100%;
    height: 60px;
    line-height: 60px;
    text-align: center;
    background-color: #000;
    position: fixed;
    bottom:0px;
    color:#7b849c;
    z-index: 999;
}
.wrapper{
    max-width:100%;
    height: 100%;
    overflow: hidden;
    position: relative;
}
.main{
    width:1000px;
    margin:0 auto;
    position: relative;
    z-index:1;
}
/*reg*/
.regbox{
    width:271px;
    height: 385px;
    position: fixed;
    left:0px;
    top:50%;
    margin-top:-192px;
    z-index:4;
}

.reg-show{
    width:231px;
    height: 295px;
    padding:70px 20px 20px;
    color:#363636;
    background:  url(../images/reg-bg.png) 0 0 no-repeat;
}
.input{
    width:110px;
    height: 28px;
    padding:0 5px;
    line-height: 28px \9;
    vertical-align: middle;
    float: left;
}
.input-sm{
    width:48px;
}
.reg-cnt{
    width:271px;
    height: 385px;
    position: relative;
}
.reg-show li{
    width:100%;
    float: left;
    height: 28px;
    overflow: hidden;
    margin-bottom:10px;
}
.reg-show li .label{
    width:72px;
    line-height: 28px;
    float: left;
    padding-right:5px;
    text-align: right;
}
.btn-reg{
    display: block;
    width:195px;
    height: 48px;
    text-indent: -9999px;
    background:  url(../images/btn-reg.jpg) 0 0 no-repeat;
}
.reg-show{
    position: absolute;
    display: none;
    left:0;
    top:0;

}
.reg-show .reg-close{
    position: absolute;
    right:4px;
    top:4px;
    width:12px;
    height: 12px;
    background:  url(../images/close.png) 0 0 no-repeat;

}
.reg-trun{
    display: block;
    width:54px;
    height: 131px;
    position: absolute;
    left:0px;
    top:120px;
    background:  url(../images/switch.png) 0 0 no-repeat;
}
.media-b .reg-show{
    display: block;
    left:50px;
}
.media-b .reg-trun,.media-b .close{
    display: none;
}


@media screen and (min-width:1660px){
    .reg-trun,.close{
        display: none;
    }
    .reg-show{
        display: block;
        left:50px;
    }
}

/*dialog*/
.layer-cnt .tipmsg{color:#f00}
.center{
    text-align: center;}
.layer-box{
    width:435px;
    padding:60px 130px;
    background-color: #D7D7E6;
    border: 2px solid #62289A;
    position: relative;
    z-index:10;

    
}
.layer-cnt .tit{
    font-size: 24px;
    font-weight: bold;
    color:#47226a;
}
.layer-cnt .input{
   width:410px;
    height: 64px;
    line-height: 64px\9;
    float: none;
    padding:0 10px;
    border: 1px solid #82828F;
    font-size: 14px;
    box-shadow: 0px 0px 2px 1px rgba(0,0,0,.3) inset;
}
.btn-submit{
    width:152px;
    height: 52px;
    font-size: 18px;
    color:#fff;
    display: block;
    margin:20px auto 0;
    cursor: pointer;
    background:  url(../images/button.jpg) 0 0 no-repeat;
}
.layer-cnt .p{
    font-size: 18px;
    color:#47226a;
}
.btn-submit:hover{
    background-position: 0 -52px;
}
.close{
    display: block;
    position: absolute;
    right:0;
    top:0;
    width:37px;
    height: 36px;
    background:  url(../images/dialog-close.png) 0 0 no-repeat;
}