html{height:100%}
body,ul,ol,li,p,h1,h2,h3,h4,h5,h6,form,fieldset,table,td,img,div{margin:0;padding:0;border:0;}
body{color:#333; font-size:12px;font-family:"lightFont";background:#2e2569;/*background: url(../images/active/bgimg111.png) no-repeat 0 bottom,url(../images/active/bgimg11.png) no-repeat 0 top;background-size: contain;*/}
ul,ol{list-style-type:none;}
select,input,img,select{vertical-align:middle;}
input{ font-size:12px;}
a{ text-decoration:none; color:#000;}
a:hover{color:#c00; text-decoration:none;}
@font-face{
    font-family: lightFont;
    src: url('../font/HelveticaNeue-Light.otf');
}
@font-face{
    font-family: mediumFont;
    src: url('../font/HelveticaNeue-Medium.otf');
}
@font-face{
    font-family: boldFont;
    src: url('../font/HelveticaNeue-Bold.otf');
}
.clear{clear:both;}
.topcenter{display:-webkit-box;display:box;display:-webkit-flex;display:-webkit-box;display:flex;
    -webkit-box-align:center;-webkit-align-items:center;
    align-items:center;box-align:center;-webkit-flex-align:center ;}/*垂直居中*/
.boxflex{-prefix-box-flex:1;-webkit-box-flex:1;-webkit-flex:1;flex:1; }
.textc{text-align: center;}
.font16{font-size: 16px;}
.cfff{color:#fff;}

.zp_tit{padding:20px;}
.zp_tit_name{text-align: center;font-size: 16px;color:#fff;}
.zp_btn_box{width:50%;margin:15px auto;}
.zp_btn{display: block; width:100%;height: 38px;line-height: 38px;text-align: center;font-size: 14px;color:#fff;
background:-webkit-linear-gradient(left,#1C78FE,#7F4FD7,#E02FBD);
background:-o-linear-gradient(left,#1C78FE,#7F4FD7,#E02FBD);
background:linear-gradient(left,#1C78FE,#7F4FD7,#E02FBD);
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
-ms-border-radius: 20px;
-o-border-radius: 20px;
border-radius: 20px;}
.zp_d_box{width:100%;margin-top:-45px;position: relative;}
.zp_t{width:100%;position: relative;}
.zp_bottom_con{
position: absolute;top:45%;width:80%;left:10%;
}
.zp_progress_bar_box{height: 29px;-webkit-border-radius: 20px;margin-right: 5px;
-moz-border-radius: 20px;
-ms-border-radius: 20px;
-o-border-radius: 20px;
border-radius: 20px;overflow: hidden;position:relative;}
.zp_progress_bar{height:29px;overflow:hidden;
background:-webkit-linear-gradient(#ecf1aa,#00abd2);
background:-o-linear-gradient(#ecf1aa,#00abd2);
background:linear-gradient(#ecf1aa,#00abd2)}
.zp_progress{display:block;float:left;height:29px;background:-webkit-linear-gradient(#FEFFFF,#FACD81);
background:-o-linear-gradient(#FEFFFF,#FACD81);
background:linear-gradient(#FEFFFF,#FACD81)}
.zp_progress_2 {
    position: absolute;
    left:50%;
    top:7px;
    transform: translateX(-50%);
    -ms-transform:translateX(-50%);
    -moz-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    color: #464646;
    font-size: 14px;
    font-family: mediumFont;
}
.zp_bs_box{min-width: 70px;padding:5px; background: url(../images/draw/bs.png) no-repeat 0 0;background-size: 100% 100%;text-align: center;font-size: 18px;
    color: #fff;}
.zp_bs_icon{width:28px;vertical-align: middle;}
.zp_bs{font-size: 18px;color:#fff;}
.zp_pointer_btn{
    position: absolute;top:68%;width:80%;left:10%;
}
.zp_pointer_btn img{width: 110%;margin-left: -5%;}
.zp_rule_icon{width:10px;vertical-align: baseline;margin: 0 5px;}

/* 大转盘样式 */

.top img{width:100%;}
.content{bottom:0;}
.zp_rule{padding:10px 20px;}
.zp_rule .zp_rule_tit{margin-bottom:5px;color:#fff;font-size:14px;text-align: center;}
.zp_rule p{color:#fff;line-height:18px;}
.zp_banner{margin:20px auto 0;padding:0px 0 15px;}
.zp_banner .turnplate{display:block;width:100%;position:relative;z-index: 99}
.zp_banner .turnplate canvas.item{width:100%;}
.zp_banner .turnplate img.pointer{position:absolute;width:35%;left:33%;top:26%;}


.turntable-bg{
    margin: 20px auto 0;
    width: 95%;
    position: relative;
    z-index: 9;
    background: url(/images/draw/11.png) no-repeat;
    background-size: contain;
}
.turntable-bg .pointer {
    width: 26%;
    height: 30%;
    position: absolute;
    top: 34%;
    z-index: 8;
    left: 50%;
    transform: translateX(-50%);
    -ms-transform:translateX(-50%);
    -moz-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -o-transform: translateX(-50%);
}
.turntable-bg .pointer img{width:100%;}
.turntable-bg .rotate {
    width: 78%;
    height: 78%;
    left:11%;
    top:11%;
    position: absolute;
}
.turntable-bg .rotate img{width:100%;}