/* CSS Document */
@charset "utf-8";
/*
*description:
*@author:LeeKangJie
*update:2016.08.18
*ver:1.0.0
*/
html{overflow-x:hidden;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,
form,fieldset,input,textarea,p,blockquote,th,td,section {
    padding: 0;
    margin: 0;
}
a{
	text-decoration:none;
	outline: none;
}
:focus{outline:none;}
table {border-spacing: 0;}
fieldset,img {border: 0;}
address,caption,cite,code,dfn,em,strong,th,var,i {
    font-weight: normal;
    font-style: normal;
}
strong{font-weight: bold;}
ul{
    list-style: none;
    margin:0;
    padding:0;
}
caption,th {text-align: left;}
h1,h2,h3,h4,h5,h6 {
    font-weight: normal;
    font-size: 100%;
    margin:0;
    padding:0;
}
input,button,textarea,select{outline:none; *font-size:100%; margin:0; border:0;}
body{
    font-family: "Microsoft YaHei";
    background: #282828;
}
#section3 .content li p img{
    -webkit-transition: all .5s ease-out;
       -moz-transition: all .5s ease-out;
        -ms-transition: all .5s ease-out; 
         -o-transition: all .5s ease-out;
            transition: all .5s ease-out;    
}
/*{
    overflow:hidden;
    white-space:nowrap;
    text-overflow:ellipsis;    
}*/
.header .tool a,#section1 .tool a{
    display: inline-block;
    *display: -moz-inline-stack;
    *zoom:1;
    *display: inline;     
}
.clearfix:after{display:table;content:" ";clear:both;}
.clearfix{*zoom:1;}
.fl{float: left;}
.fr{float: right;}
.pl{position: absolute;top:0;left: 0;}
.pr{position: absolute;top:0;right: 0;}
/*===========================
公用样式
===========================*/
.article,.header{
    width: 1000px;
    height: auto;
    margin: 0 auto;
    position: relative;
}
#footer{min-width:1000px;margin:0 auto 0 auto;clear:both; height:100px; padding-top:10px; color:#fff;position: relative;z-index: 2;width: 100%;line-height:24px; background:#333;}
#footer div{text-align:center;color:#fff; font-size:12px; margin-top:5px;}
#footer div a{ color:#fff; margin:0 10px; }
#footer a{ text-decoration:none; color:#fff;}
#footer a:hover{text-decoration: underline;}


#container{
    min-width: 1000px;
    min-height: 600px;
    position: relative;
    overflow: hidden;
    background: url(../images/bg_top.jpg) no-repeat center top;
}


.header{
    width: 1000px;
    height: 600px;
    margin: 0 auto;
    background: url(../images/bg_header.jpg) no-repeat center top;
}
.header p{position: absolute;}
.header .time{
    font-size: 18px;
    color: #b5436e;
    right: 175px;
    bottom: 150px;
}
.header .tool{
    width: 100%;
    height: 60px;
    font-size: 0;
    text-align: right;
    bottom: 55px;
}
.header .tool a{
    width: 170px;
    height: 100%;
    margin: 0 0 0 20px;
}
.header .tool a:first-child{margin:0px;background: url(../images/bg_btn02.jpg) no-repeat left top;}
.header .tool a:first-child+a{background: url(../images/bg_btn02.jpg) no-repeat -170px top;}
.header .tool a:first-child+a+a{background: url(../images/bg_btn02.jpg) no-repeat -340px top;}
.header .qr_code{
   position:absolute;
   top:85px;
   right:-180px;
}


#section1{
    height: 300px;
    position: relative;
    background: url(../images/bg_back01.jpg) no-repeat center top;
}
#section1 .tool{
    padding: 160px 0 0 0;
    font-size: 0;
    text-align: center;
}
#section1 .tool a{
    width: 300px;
    height: 70px;
    font-size: 26px;
    padding: 10px 0 0 0;
    margin: 0 0 0 50px;
    vertical-align: top;
}
#section1 .tool a:first-child{
    color: #3f2310;
    margin: 0;
    background: url(../images/bg_btn.jpg) no-repeat left top;
}
#section1 .tool a:first-child+a{
    color: #4f2f28;
    background: url(../images/bg_btn.jpg) no-repeat -300px top;
}
#section1 .tool a:first-child+a+a{
    color: #172c47;
    background: url(../images/bg_btn.jpg) no-repeat -600px top;
}
#section1 .tool a span{display: block;font-size: 14px;}


#section2{
    height: 440px;
    padding: 170px 0 0 0;
    background: url(../images/bg_back02.jpg) no-repeat center top;
}
#section2 .playGame{
    width: 450px;
    height: 400px;
    position: relative;
    background: url(../images/black.png);
}
#section2 .playGame i{
    width: 160px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    color: #fff;
    font-size: 21px;
    background: url(../images/icon_01.png) no-repeat left top;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
}
.btn_start{ width:103px; height:103px; background:url(../images/sprites.png) no-repeat; background-position:-834px -193px; position:absolute; right:50px; bottom:40px; cursor:pointer;}
.btn_start.clicked{ background-position:-947px -193px;}
.diceAll{ width:205px; height:285px; position:absolute; top:75px; left:55px;}
.diceAll.shake{ -moz-animation:shaking 1s ease-in-out alternate; -ms-animation:shaking 1s ease-in-out alternate; -o-animation:shaking 1s ease-in-out alternate; -webkit-animation:shaking 1s ease-in-out alternate; animation:shaking 1s ease-in-out alternate;}
@-moz-keyframes shaking{
    0%{ -moz-transform:rotate(5deg);-moz-transform-origin:center 5px;}
    10%{ -moz-transform:rotate(-5deg);-moz-transform-origin:center 5px;}
    20%{ -moz-transform:rotate(5deg);-moz-transform-origin:center 5px;}
    30%{ -moz-transform:rotate(-5deg);-moz-transform-origin:center 5px;}
    40%{ -moz-transform:rotate(4deg);-moz-transform-origin:center 5px;}
    50%{ -moz-transform:rotate(-4deg);-moz-transform-origin:center 5px;}
    60%{ -moz-transform:rotate(3deg);-moz-transform-origin:center 5px;}
    70%{ -moz-transform:rotate(-3deg);-moz-transform-origin:center 5px;}
    80%{ -moz-transform:rotate(2deg);-moz-transform-origin:center 5px;}
    90%{ -moz-transform:rotate(-2deg);-moz-transform-origin:center 5px;}
    100%{ -moz-transform:rotate(0deg);-moz-transform-origin:center 5px;}
}
@-ms-keyframes shaking{
    0%{ -ms-transform:rotate(5deg);-ms-transform-origin:center 5px;}
    10%{ -ms-transform:rotate(-5deg);-ms-transform-origin:center 5px;}
    20%{ -ms-transform:rotate(5deg);-ms-transform-origin:center 5px;}
    30%{ -ms-transform:rotate(-5deg);-ms-transform-origin:center 5px;}
    40%{ -ms-transform:rotate(4deg);-ms-transform-origin:center 5px;}
    50%{ -ms-transform:rotate(-4deg);-ms-transform-origin:center 5px;}
    60%{ -ms-transform:rotate(3deg);-ms-transform-origin:center 5px;}
    70%{ -ms-transform:rotate(-3deg);-ms-transform-origin:center 5px;}
    80%{ -ms-transform:rotate(2deg);-ms-transform-origin:center 5px;}
    90%{ -ms-transform:rotate(-2deg);-ms-transform-origin:center 5px;}
    100%{ -ms-transform:rotate(0deg);-ms-transform-origin:center 5px;}
}
@-o-keyframes shaking{
    0%{ -o-transform:rotate(5deg);-o-transform-origin:center 5px;}
    10%{ -o-transform:rotate(-5deg);-o-transform-origin:center 5px;}
    20%{ -o-transform:rotate(5deg);-o-transform-origin:center 5px;}
    30%{ -o-transform:rotate(-5deg);-o-transform-origin:center 5px;}
    40%{ -o-transform:rotate(4deg);-o-transform-origin:center 5px;}
    50%{ -o-transform:rotate(-4deg);-o-transform-origin:center 5px;}
    60%{ -o-transform:rotate(3deg);-o-transform-origin:center 5px;}
    70%{ -o-transform:rotate(-3deg);-o-transform-origin:center 5px;}
    80%{ -o-transform:rotate(2deg);-o-transform-origin:center 5px;}
    90%{ -o-transform:rotate(-2deg);-o-transform-origin:center 5px;}
    100%{ -o-transform:rotate(0deg);-o-transform-origin:center 5px;}
}
@-webkit-keyframes shaking{
    0%{ -webkit-transform:rotate(5deg);-webkit-transform-origin:center 5px;}
    10%{ -webkit-transform:rotate(-5deg);-webkit-transform-origin:center 5px;}
    20%{ -webkit-transform:rotate(5deg);-webkit-transform-origin:center 5px;}
    30%{ -webkit-transform:rotate(-5deg);-webkit-transform-origin:center 5px;}
    40%{ -webkit-transform:rotate(4deg);-webkit-transform-origin:center 5px;}
    50%{ -webkit-transform:rotate(-4deg);-webkit-transform-origin:center 5px;}
    60%{ -webkit-transform:rotate(3deg);-webkit-transform-origin:center 5px;}
    70%{ -webkit-transform:rotate(-3deg);-webkit-transform-origin:center 5px;}
    80%{ -webkit-transform:rotate(2deg);-webkit-transform-origin:center 5px;}
    90%{ -webkit-transform:rotate(-2deg);-webkit-transform-origin:center 5px;}
    100%{ -webkit-transform:rotate(0deg);-webkit-transform-origin:center 5px;}
}
@keyframes shaking{
    0%{ transform:rotate(5deg);transform-origin:center 5px;}
    10%{ transform:rotate(-5deg);transform-origin:center 5px;}
    20%{ transform:rotate(5deg);transform-origin:center 5px;}
    30%{ transform:rotate(-5deg);transform-origin:center 5px;}
    40%{ transform:rotate(4deg);transform-origin:center 5px;}
    50%{ transform:rotate(-4deg);transform-origin:center 5px;}
    60%{ transform:rotate(3deg);transform-origin:center 5px;}
    70%{ transform:rotate(-3deg);transform-origin:center 5px;}
    80%{ transform:rotate(2deg);transform-origin:center 5px;}
    90%{ transform:rotate(-2deg);transform-origin:center 5px;}
    100%{ transform:rotate(0deg);transform-origin:center 5px;}
}
.cup_top{ width:173px; height:190px; background:url(../images/cup_top.png) no-repeat; position:absolute; top:0; left:50%; margin-left:-85px;}
.cup_bottom{ width:205px; height:125px; background:url(../images/cup_bottom.png) no-repeat; position:absolute; bottom:0; left:0;}
.dice{ width:46px; height:46px; position:absolute; bottom:46px; left:50%; margin-left:-23px;}
.dice.dice0{ background:url(../images/dice1.png) no-repeat;}
.dice.dice1{ background:url(../images/dice2.png) no-repeat;}
.dice.dice2{ background:url(../images/dice3.png) no-repeat;}
.dice.dice3{ background:url(../images/dice4.png) no-repeat;}
.dice.dice4{ background:url(../images/dice5.png) no-repeat;}
.dice.dice5{ background:url(../images/dice6.png) no-repeat;}

#section2 .article{
    width: 975px;
    padding: 0 0 0 25px;
}
#section2 .alert{
    width: 490px;
    color: #fff;
}
#section2 .alert h3{
    font-size: 20px;
    font-weight: bolder;
}
#section2 .alert li{
    line-height: 25px;
    margin: 15px 0 0 0;
}


#section3{
    height: 870px;
    padding: 120px 0 0 0;
    background: url(../images/bg_back03.jpg) no-repeat center top;
}
#section3 .content li{
    width: 230px;
    height: 200px;
    float: left;
    text-align: center;
    margin: 30px 0 0 25px;
    position: relative;
}
#section3 .content li p{
    height: 165px;
    position: relative;
    background: #e7d1c3;
}
#section3 .content li p img{
    max-width: 100%;
    opacity: 0;
    filter: alpha(opacity=0);
}
#section3 .content li p span:first-child+span{
    width: 100%;
    position: absolute;
    left: 0;
    bottom: 10px;
    color: #534136;
    display: block;
}
#section3 .content li a{
    width: 100%;
    height: 25px;
    line-height: 25px;
    color: #fff;
    display: block;
    position: absolute;
    left: 0;
    bottom: 0;
    background: #b09a8c;
}
#section3 .content li:first-child,#section3 .content li:first-child+li+li+li+li{margin-left: 0;}
#section3 .content li:first-child+li+li+li+li+li+li{width: 485px;}
#section3 .content li:first-child+li+li+li+li+li+li h3{
    color: #fff;
    font-size: 21px;
    height: 50px;
    line-height: 50px;
    background: #b09a8c;
}
#section3 .lottery_wrap{ width:475px; height:140px; padding:5px; background:#e7d1c3; border-top:none; overflow:hidden;}
#section3 .lottery_wrap dl{ width:100%;}
#section3 .lottery_wrap dl dd{ width:100%; text-align:center; color:#685950; font:14px/36px "Microsoft Yahei";}
#section3 .alert{
    height: 110px;
    color: #685950;
    padding: 25px;
    margin: 30px 0 0 0;
    background: #e7d1c3;
}
#section3 .alert h3{
    font-size: 21px;
    font-weight: bolder;
}
#section3 .alert li{margin: 6px 0 0 0;}