﻿@charset "UTF-8";

/*清除默认样式*/
blockquote,body,button,dd,dl,fieldset,form,h1,h2,h3,h4,h5,h6,hr,input,menu,ol,p,pre,select,textarea,ul {
    margin:0
}
address,blockquote,button,caption,dir,fieldset,input,legend,menu,ol,td,textarea,th,ul {
    padding:0
}
fieldset,hr,iframe,img {
    border:none
}
html {
    overflow:auto;
    font-family:sans-serif;
    font-size:100%
}
a {
    text-decoration:none;
    background-color:transparent
}
menu,ol,ul {
    list-style:none
}
code,kbd,pre,samp,var {
    font-family:monospace;
    font-size:1em
}
pre {
    overflow:auto
}
button,input,optgroup,option,select,textarea {
    font-family:sans-serif;
    font-size:1em
}
button,input,select {
    overflow:visible;
    *zoom:1
}
textarea {
    overflow:auto;
    resize:none
}
table {
    border-collapse:collapse;
    border-spacing:0
}
article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary {
    display:block
}
audio,canvas,progress,video {
    display:inline-block;
    vertical-align:baseline
}
[hidden],template {
    display:none
}
html {
    -webkit-text-size-adjust:100%;
    -ms-text-size-adjust:100%;
    text-size-adjust:100%
}
html.borderbox *,html.borderbox:after,html.borderbox:before {
    box-sizing:border-box
}
input,textarea {
    -webkit-appearance:none;
    -moz-appearance:none;
    appearance:none;
    border-radius:0
}
audio:not([controls]) {
    display:none;
    height:0
}
svg:not(:root) {
    overflow:hidden
}
body,button,input,select,textarea {
    font-family:'Microsoft Yahei','Hiragino Sans GB',Tahoma,'\5b8b\4f53',Arial,sans-serif;
    font-size:14px;
    line-height:1.42857143
}
del,s {
    text-decoration:line-through
}
ins,u {
    text-decoration:underline
}
strong {
    font-weight:700
}
em {
    font-style:italic
}
small {
    font-size:85%
}
address {
    font-style:normal
}
cite {
    font-style:normal
}
code,kbd,pre,samp,var {
    font-family:Consolas,'Microsoft Yahei',Tahoma,'\5b8b\4f53',monospace;
    font-size:14px
}
hr {
    border-bottom:1px solid #cfcfcf
}
abbr[title] {
    cursor:help;
    border-bottom:1px dotted #cfcfcf
}
sub,sup {
    position:relative;
    font-size:75%;
    vertical-align:baseline;
    line-height:0
}
sup {
    top:-.5em
}
sub {
    bottom:-.25em
}

/*共用样式*/
.clearfix {
    *zoom:1
}
.clearfix:after,.clearfix:before {
    content:" ";
    display:table
}
.clearfix:after {
    clear:both
}
.pull-left,.pull-right {
    *display:inline;
    *zoom:1
}
.pull-left {
    float:left;
}
.pull-right {
    float:right;
}
.text-left {
    text-align:left
}
.text-center {
    text-align:center
}
.text-right {
    text-align:right
}
.text-justify {
    text-align:justify
}
.text-lowercase {
    text-transform:lowercase
}
.text-uppercase {
    text-transform:uppercase
}
.text-capitalize {
    text-transform:capitalize
}
.text-nowrap {
    white-space:nowrap
}
.text-break-word {
    white-space:pre-wrap;
    word-wrap:break-word
}
.text-break-letter {
    white-space:pre-wrap;
    word-break:break-all
}
.text-replace {
    overflow:hidden;
    text-indent:-999em
}

.m5 {
    margin:5px
}
.m10 {
    margin:10px
}
.m15 {
    margin:15px
}
.m20 {
    margin:20px
}
.m25 {
    margin:25px
}
.m30 {
    margin:30px
}
.m35 {
    margin:35px
}
.m40 {
    margin:40px
}
.mt50 {
    margin-top:50px
}
.mt5 {
    margin-top:5px
}
.mt10 {
    margin-top:10px
}
.mt15 {
    margin-top:15px
}
.mt20 {
    margin-top:20px
}
.mt25 {
    margin-top:25px
}
.mt30 {
    margin-top:30px
}
.mt35 {
    margin-top:35px
}
.mt40 {
    margin-top:40px
}
.mb5 {
    margin-bottom:5px
}
.mb10 {
    margin-bottom:10px
}
.mb15 {
    margin-bottom:15px
}
.mb20 {
    margin-bottom:20px
}
.mb25 {
    margin-bottom:25px
}
.mb30 {
    margin-bottom:30px
}
.mb35 {
    margin-bottom:35px
}
.mb40 {
    margin-bottom:40px
}
.ml5 {
    margin-left:5px
}
.ml10 {
    margin-left:10px
}
.ml15 {
    margin-left:15px
}
.ml20 {
    margin-left:20px
}
.ml25 {
    margin-left:25px
}
.ml30 {
    margin-left:30px
}
.ml35 {
    margin-left:35px
}
.ml40 {
    margin-left:40px
}
.mr5 {
    margin-right:5px
}
.mr10 {
    margin-right:10px
}
.mr15 {
    margin-right:15px
}
.mr20 {
    margin-right:20px
}
.mr25 {
    margin-right:25px
}
.mr30 {
    margin-right:30px
}
.mr35 {
    margin-right:35px
}
.mr40 {
    margin-right:40px
}

.hide{display: none}
.show{display: block;}

/*主体开始*/

.wrapper{
    width:100%;
    height: 3830px;
    position: relative;
}
.footer{
    width:100%;
    text-align: center;
    padding:40px 0;
    color:#416b76;
    background-color: #012935;
}
.bgbox{
    position: absolute;
    width:100%;
    height: 100%;
    left:0;
    top:0;
}
.bgbox .bg{
    width:100%;
    height: 300px;
    background-position: center top;
    background-repeat: no-repeat;
}
.bgbox .bg-1{ background-image:  url(../images/bg-1.jpg)}
.bgbox .bg-2{ background-image:  url(../images/bg-2.jpg)}
.bgbox .bg-3{ background-image:  url(../images/bg-3.jpg)}
.bgbox .bg-4{ background-image:  url(../images/bg-4.jpg)}
.bgbox .bg-5{ background-image:  url(../images/bg-5.jpg)}
.bgbox .bg-6{ background-image:  url(../images/bg-6.jpg)}
.bgbox .bg-7{ background-image:  url(../images/bg-7.jpg)}
.bgbox .bg-8{ background-image:  url(../images/bg-8.jpg)}
.bgbox .bg-9{ background-image:  url(../images/bg-9.jpg)}
.bgbox .bg-10{ background-image:  url(../images/bg-10.jpg)}
.bgbox .bg-11{ background-image:  url(../images/bg-11.jpg)}
.bgbox .bg-12{ background-image:  url(../images/bg-12.jpg)}
.bgbox .bg-13{height:235px; background-image:  url(../images/bg-13.jpg)}


.container{
    width:1000px;
    margin:0 auto;
    padding-top:603px;
    /*overflow: hidden;*/
    position: relative;
    z-index:1;
}

.btn-group{
    padding-left:223px;
    overflow: hidden;
    position: relative;

}
.btn-group .btn{
    float: left;
    width:178px;
    height: 63px;
    text-indent: -9999px;
    background-image:  url(../images/btn-group.png);
    background-repeat: no-repeat;
    margin-right:20px;
}
.btn-group .btn:hover{
    background-image: url(../images/btn-group-h.png);
}
.btn-group .btn-start{
    width:172px;
    height: 80px;
    margin-top:36px;
    background-position: 0 -36px;

}
.btn-group .btn-come{
    width:179px;
    height: 81px;
    margin-top:18px;
    background-position: -191px -18px;

}
.btn-group .btn-get{
    width:184px;
    height: 81px;
    background-position: -390px 0px;

}
/*titlebar*/
.titlebar{
    padding-left:120px;
    background:  url(../images/title.png) 0 0 no-repeat;
}
.titlebar-1{
    padding-left:100px;
}
.titlebar-2{
    background-position: 0 -110px;
}
.titlebar-3{
    background-position: 0 -220px;
}
.titlebar-4{
    background-position: 0 -340px;
}
.titlebar .title{
    font-size: 36px;
    height: 40px;
    line-height: 40px;
    font-weight: bold;
    color:#fff;
}
.titlebar .subtit{
    color:#0e5264;
    line-height: 16px;
}
.text-orange{
    color:#d78f13;
}
.text-white{
    color:#fff;
}
.titlebar-navy .title{
    color:#012832;
}
.titlebar-navy .subtit{
    color:#0b4959;
}
/*01*/
.channel-1{
    margin-top:330px;
}
.accordion{
    width:1000px;
    height: 480px;
    overflow: hidden;
    padding-bottom:6px;
    background-color: #011C25;
}
.accordion-box{width:1000px;}
.accordion ul{
    width:5000px;
    height: 480px;
    overflow: hidden;

}
.accordion ul li{
    float: left;
    width:198px;
    height: 480px;
    margin-right:2px;
    overflow: hidden;   

}
.accordion ul .show-box{width:800px;height:480px;}
.accordion .show-btn{
    width:198px;
    height: 480px;
    position: relative;
    margin-right:2px;
}
.accordion .show-btn:hover .layer,.accordion .show-btn:hover .info{
    display: none;
}
.accordion .show-btn .info{
    position: absolute;
    left:9px;
    right:9px;
    bottom:10px;

    padding-top:30px;
}
.accordion .item-1 .info{ background:  url(../images/part-1.png) 0 0 no-repeat;}
.accordion .item-2 .info{ background:  url(../images/part-2.png) 0 0 no-repeat;}
.accordion .item-3 .info{ background:  url(../images/part-3.png) 0 0 no-repeat;}
.accordion .item-4 .info{ background:  url(../images/part-4.png) 0 0 no-repeat;}
.accordion .item-5 .info{ background:  url(../images/part-5.png) 0 0 no-repeat;}
.accordion .item-2 .info,.accordion .item-4 .info{
    top:25px;
}
.accordion .info .name{
    font-size: 20px;
    font-weight: bold;
    color:#fff;
}
.accordion .info p{
    font-size: 16px;
    color:#66909a;
}
.accordion .layer{
    position: absolute;
    left:0;
    bottom:0;
    width:198px;
    height: 480px;
    background: #0A3640;
    opacity: 0.8;
    filter:alpha(opacity=80);
}

/*02*/
.channel-2{
    margin-top:220px;
}
.votebox{
    width:100%;
    position: relative;
}
.votebox .fc-l{
    width:39px;
    height: 67px;
    background:  url(../images/fc-l.png) 0 0 no-repeat;
    position: absolute;
    left:-10px;
    top:-10px;
}
.votebox .fc-r{
    width:43px;
    height: 47px;
    background:  url(../images/fc-r.png) 0 0 no-repeat;
    position: absolute;
    right:-10px;
    bottom:-10px;
}
.votebox .vs{
    width:108px;
    height: 108px;
    position: absolute;
    left:445px;
    top:30px;
    background:  url(../images/vs.png) 0 0 no-repeat;
    z-index:1;
}
.vote-item{
    width:500px;
}
.vote-img{
    width:500px;
    height: 363px;
    overflow: hidden;
    position: relative;
}
.vote-img img{
    width:500px;
    height: 363px;
}
.vote-img .txt{
    position: absolute;
    width:450px;
    height: 223px;
    padding:70px 25px;
    left:0px;
    top:100%;
    background-color: #01232C;
    opacity:0.9;
    filter:alpha(opacity=90);
    -webkit-transition: top 0.2s;
    transition: top 0.2s;
    z-index:2;

}
.vote-img .txt p{
    line-height: 30px;
    margin-top:40px;
}
.vote-img .txt .bt{
    font-size: 26px;
    text-align: center;
}
.vote-img .txt p{
    font-size: 16px;

}
.vs-1 .txt .bt{
    color:#78cbde;
    background:  url(../images/line-1.png) center center no-repeat;
}

.vs-1 .txt p{
    color:#7bcee4;
}
.vs-2 .txt{
    background-color: #684300;
}
.vs-2 .txt .bt{
    color:#fdbe37;
    background:  url(../images/line-2.png) center center no-repeat;
}

.vs-2 .txt p{
    color:#fdbe37;
}
.vote-img:hover .txt{
    top:0px;
}
.vote-item .vote-btn{
    display: block;
    width:504px;
    height: 74px;
    line-height: 70px;
    text-align: center;
    background:  url(../images/btn-vote.png) 0 0 no-repeat;
}
.vote-item .vote-btn .bold{
    font-size: 26px;
    font-weight: bold;
    color:#fff;
}
.vs-1 .vote-btn{
    font-size: 14px;
    color:#33abc4;
}
.vs-1 .vote-btn:hover{
    background-position: 0 -74px;
}
.vs-2 .vote-btn{
    background-position: -504px 0;
    color:#f2bc3a;
}
.vs-2 .vote-btn:hover{
    background-position: -504px -74px;
}

/*03*/
.channel-3{
    margin-top:175px;
}

.lottery ul{
    position: relative;
    margin:50px 0 0 35px;
    height: 520px;
    overflow: hidden;
}
.lottery li{
    width:225px;
    height: 195px;
    position: absolute;
}
.lottery li p{
    height: 38px;
    line-height: 38px;
    text-align: center;
    position: absolute;
    left:0px;
    right:0;
    bottom:0px;
    font-size: 16px;
    color:#a4c9d3;
}
.lottery li .mark{
    position: absolute;
    left:0;
    top:0;
    width:225px;
    height: 195px;
    background:  url(../images/mark.png) 0 0 no-repeat;
    z-index:2;
    display: none;
}
.lottery li .mark.active{
    display: block;
}
.lottery .li-1{
    top:106px;
    left:35px;
    background:  url(../images/zb.png) 0 0 no-repeat;
}
.lottery .li-2{
   left:210px;
    top:0;
    background:  url(../images/gold.png) 0 0 no-repeat;
}
.lottery .li-3{
    left:385px;
    top:105px;
    background:  url(../images/zb.png) 0 0 no-repeat;
}

.lottery .li-4{
    left:560px;
    top:0px;
    background:  url(../images/lb.png) 0 0 no-repeat;
}
.lottery .li-5{
    left:740px;
    top:105px;
    background:  url(../images/gold.png) 0 0 no-repeat;
}
.lottery .li-6{
    left:560px;
    top:210px;
    background:  url(../images/none.png) 0 0 no-repeat;
}
.lottery .li-7{
    left:385px;
    top:320px;
    background:  url(../images/gold.png) 0 0 no-repeat;
}
.lottery .li-8{
    left:210px;
    top:210px;
    background:  url(../images/lb.png) 0 0 no-repeat;
}
.btn-rotate{
    display: block;
    margin:15px auto;
    background:  url(../images/btn-cj.png) 0 0 no-repeat;
    width:238px;
    height: 70px;
    text-indent: -9999px;
}
.btn-rotate.disable{
    background:  url(../images/btn-cj-d.jpg) 0 0 no-repeat;
}
.btn-rotate.disable:hover{
    background:  url(../images/btn-cj-d.jpg) 0 0 no-repeat;
}
.btn-rotate:hover{
    background-position: 0 -70px;
}
.rule{
    width:100%;
    overflow: hidden;
}
.rule dt{
    width:134px;
    padding-left:23px;
    font-size: 20px;
    line-height: 33px;
    color:#6295a2;
    background:  url(../images/rule-tit.png) 0 0 no-repeat;
    margin-bottom:10px;

}

.rule dd{

    height: 20px;
    line-height: 20px;
    float: left;
    color:#416b76;
    margin-bottom:5px;
}
.rule dd .num{
    width:20px;
    height: 20px;
    line-height: 20px;
    text-align: center;
    display: inline-block;
    border-radius: 50%;
    background-color: #033440;
    color:#6295a2;
}
.rule .dd-s{
    width:370px;
}

/*04*/
.channel-4{
    margin-top:150px;
}

.textarea{
    width:737px;
    padding:20px;
    height: 68px;
    background-color: #003542;
    font-size: 14px;
    color:#3d717f;
    line-height: 22px;
}
.btn-share{
    width:216px;
    height: 108px;
    text-indent: -9999px;
    background:  url(../images/btn-share.png) 0 0 no-repeat;
}
.btn-share:hover{
    background-position: 0 -108px;
}


/*弹窗*/
.tip_dialog{
   width:574px;
    height: 439px;
    border: 10px solid #014552;
    background-color: #C5D4D8;
    position: relative;
}
.tip_dialog .dialog-tit{
    padding:40px 0 30px 0;
    text-align: center;
    font-size: 46px;
    font-weight: bold;
    color:#ad6e03;
}
.dialog-cnt{
    padding:15px 60px;
    background-color: #B8C9CE;
}
.dialog-cnt .jhlink{
    float: right;
    width:109px;
    height: 35px;
    line-height: 35px;
    text-align: center;
    background-color: #AD6E03;
    color:#fff;
    font-size: 18px;
    
}
.dialog-cnt .form{
    padding-bottom:20px;
    margin-bottom:20px;
    border-bottom: 1px solid #A4B1B5;
}
.form .label{
    font-size: 18px;
    line-height: 35px;
    font-weight: bold;
    color:#002a34;
}
.form .input{
    width:170px;
    height: 35px;
    line-height: 35px \9;
    padding:0 10px;
    color:#000;
    font-size: 18px;
    outline:none;
    background-color: #8A9FA5;
    border: none;
}
.form .btn-copy{
    width:109px;
    height: 35px;
    line-height: 35px;
    text-align: center;
    background-color: #014552;
    color:#fff;
    font-size: 16px;
}
.close{
    width:39px;
    height: 39px;
    position: absolute;
    right:-49px;
    top:-10px;
    background: url(../images/close.jpg) 0 0 no-repeat;
}

/*mouse*/
.mouse {
    width: 64px;
    height: 70px;
    background: url(../images/mouse.png) 0 0 no-repeat;
    position: fixed;
    bottom: 60px;
    left: 50%;
    z-index: 9999;
    margin-left: -32px;
    _position: absolute;
    _bottom: auto;
    _top: expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop,160)||0)-(parseInt(this.currentStyle.marginBottom,60)||0)));
}
@-webkit-keyframes fadeout{
    0%{-webkit-transform:translateY(-25px);opacity:0}
    60%{ -webkit-transform:translateY(0px); opacity:1}
    100%{ -webkit-transform:translateY(20px); opacity:0}
}
@-moz-keyframes fadeout{
    0%{-moz-transform:translateY(-25px);opacity:0}
    60%{ -moz-transform:translateY(0px); opacity:1}
    100%{ -moz-transform:translateY(20px); opacity:0}
}
@-ms-keyframes fadeout{
    0%{-ms-transform:translateY(-25px);opacity:0}
    60%{ -ms-transform:translateY(0px); opacity:1}
    100%{ -ms-transform:translateY(20px); opacity:0}
}
@-o-keyframes fadeout{
    0%{-o-transform:translateY(-25px);opacity:0}
    60%{ -o-transform:translateY(0px); opacity:1}
    100%{ -o-transform:translateY(20px); opacity:0}
}
@keyframes fadeout{
    0%{transform:translateY(-25px);opacity:0}
    60%{transform:translateY(0px); opacity:1}
    100%{transform:translateY(20px); opacity:0}
}

.fadeout{
    -webkit-animation:fadeout 2s infinite;
    -moz-animation:fadeout 2s infinite;
    -ms-animation:fadeout 2s infinite;
    -o-animation:fadeout 2s infinite;
    animation:fadeout 2s infinite;
}










