html, body, h1, h2, h3, h4, h5, h6, div, dl, dt, dd, ul, ol, li, p, blockquote, pre, hr, figure, table, caption, th, td, form, fieldset, legend, input, button, textarea, menu {
    margin: 0;
    padding: 0
}
img {
    border: 0
}
li {
    list-style: none
}
a, button {
    cursor: pointer
}
html, body {
    height: 100%;
}
a, a:hover {
    color: #333
}
img {
    display: block
}
html, body {
    height: 100%;
}
.dn {
    display: none
}
.musicControl {
    width: .7rem;
    height: .7rem;
    position: fixed;
    top: .2rem;
    right: .2rem;
    z-index: 9999
}
.musicControl img {
    width: .47rem;
    height: .47rem;
    float: right
}
.musicControl img.musicPlay {
    animation: musicRoate 3s linear infinite;
    -webkit-animation: musicRoate 3s linear infinite;
    -moz-animation: musicRoate 3s linear infinite;
    -o-animation: musicRoate 3s linear infinite;
    -ms-animation: musicRoate 3s linear infinite
}
@keyframes musicRoate {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0)
    }
    50% {
        -webkit-transform: rotate(180deg);
        transform: rotate(180deg)
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}
@-webkit-keyframes musicRoate {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0)
    }
    50% {
        -webkit-transform: rotate(180deg);
        transform: rotate(180deg)
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}
@-ms-keyframes musicRoate {
    0% {
        -ms-transform: rotate(0);
        transform: rotate(0)
    }
    50% {
        -ms-transform: rotate(180deg);
        transform: rotate(180deg)
    }
    100% {
        -ms-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}
.bg22 {
    height: 100%;
    background: #6ac3e8;
}

.swiper-container {
    height: 100%;
}
.bg22 .page1Box {
    width: 100%;
    height: 100%;
    background: url("../images/bg02.jpg") repeat;
    background-size: 100% auto;
    position: relative;
}
.bg22 .page1Box img.bg {
    width: 100%
}
.bg22 .page1Box img.info_text {
    width: 6.33rem;
    height: auto;
    position: absolute;
    top: 2.05rem;
    left: .54rem;
}
.bg22 .page1Box .logo_text {
    color: #fff;
    font-size: .21rem;
    position: absolute;
    left: .43rem;
    bottom: .6rem;
    z-index: 3;
}

.bg22 .page1Box img.carBot {
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
}

.bg22 .page1Box img.logo {
    width: .81rem;
    height: .81rem;
    position: absolute;
    right: .48rem;
    top: .7rem;
}
.bg22 .page1Box img.p {
    width: 2.48rem;
    height: .98rem;
    position: absolute;
    bottom: .3rem;
    left: 50%;
    margin-left: -1.24rem;
    animation: upPage 3s linear infinite;
    -webkit-animation: upPage 3s linear infinite;
    -moz-animation: upPage 2s linear infinite;
    -o-animation: upPage 2s linear infinite;
    -ms-animation: upPage 2s linear infinite
}
@keyframes upPage {
    0% {
        transform: translateY(0rem);
        opacity: 0;
    }
    50% {
        transform: translateY(-1.5rem);
        opacity: 1;
    }
    100% {
        transform: translateY(0);
        opacity: 0;
    }
}
@-ms-keyframes upPage {
    0% {
        transform: translateY(0rem);
        opacity: 0;
    }
    50% {
        transform: translateY(-1.5rem);
        opacity: 1;
    }
    100% {
        transform: translateY(0);
        opacity: 0;
    }
}
@-webkit-keyframes upPage {
    0% {
        transform: translateY(0rem);
        opacity: 0;
    }
    50% {
        transform: translateY(-1.5rem);
        opacity: 1;
    }
    100% {
        transform: translateY(0);
        opacity: 0;
    }
}

.bg22 .page2Box, .an_bg {
    min-height: 100%;
    height: auto;
    overflow-y: auto;
    background: url("../images/page2_bg.jpg") 0 0 no-repeat;
    background-size: 100% 100%;
    position: relative;
    overflow: hidden;
}
.bg22 .page2Box {
    min-height: 100%;
    height: auto;
    overflow-y: auto;
}

.page2Box img.info_text, .scroll-wrap img.info_text, .an_bg img.info_text {
    width: 6.33rem;
    height: auto;
    margin-top: 1.79rem;
    margin-left: .54rem;
}
.scroll-wrap img.info_text {
    width: 5.5rem;
    margin-top: .7rem;
    margin-left: 1rem;
    margin-bottom: .49rem;
}

.page2Box img.logo, .scroll-wrap img.logo, .an_bg img.logo {
    width: .81rem;
    height: .81rem;
    float: right;
    margin-right: .48rem;
    margin-top: .7rem;
}
.scroll-wrap img.logo {
    width: .6rem;
    height: .6rem;
    margin-top: 0;
}
.bg22 .page2Box .demo {
    overflow: hidden;
    position: absolute;
    top: 7.2rem;
    left: .27rem;
    width: 6.96rem
}
.bg22 .page2Box .demo-inner {
    margin-right: -.3rem
}
.bg22 .page2Box .demo-item {
    float: left;
    width: 3.44rem;
    height: auto;
    margin-right: .13rem;
    margin-bottom: .16rem;
}
.bg22 .page2Box .demo .blockImg {
    width: 100%;
    height: 85%;
    display: block
}

.bg22 .page2Box .btn {
    width: 1.73rem;
    height: .42rem;
    background: url("../images/page2_btn.png") 0 0 no-repeat;
    background-size: 100% auto;
    display: block;
    margin: 0 auto;
    position: absolute;
    right: .25rem;
    top: 6.5rem;
}
.bg22 .rule {
    width: 6.7rem;
    height: 6.6rem;
    position: absolute;
    top: 4.2rem;
    left: 0;
    right: 0;
    margin: auto;
    z-index: 11
}

.bg22 .rule div {
    overflow-y: auto;
    height: 6.6rem;
    border-radius: .2rem;
    background-color: #fff;
    padding: .33rem 0 0;
    box-sizing: border-box;
}
.rule .ch {
    width: .75rem;
    height: .75rem;
    margin: .27rem auto 0;
    cursor: pointer;
}
.bg22 .rule div ul {
    width: 5.61rem;
    overflow: hidden;
    margin: 0 auto;
    padding-bottom: .19rem;
    line-height: .58rem;
    font-size: .21rem;
    border-bottom: dashed 1px #030000
}
.bg22 .rule div ul span {
    font-weight: bold
}
.bg22 .rule div ul.last {
    border-bottom: 0
}
.bg22 .rule div p.title {
    width: 5.61rem;
    margin: 0 auto;
    font-size: .33rem;
    line-height: .58rem;
}

.noscroll, .noscroll body {
    overflow: hidden;
    height: 100%
}
.noscroll body {
    position: relative
}
.scroll-wrap, .scroll {
    height: 100%;
}
.scroll-wrap .scroll {
    background: url("../images/page2_bg.jpg") 0 0 no-repeat;
    background-size: 100%;
    padding-top: .7rem;
    position: relative;
    overflow-y: auto;
    box-sizing: border-box;
}
.ping #wrap #right {
    width: 300px;
    height: 300px;
    padding-top: .1rem;
}
.ping #wrap #left {
    height: auto;
    margin: 0 auto;
    color: #FFF;
    font-size: .28rem;
    padding-top: .30rem
}
.ping #wrap #left ul {
    height: auto
}
.ping #wrap #left ul li {
    height: .67rem;
    line-height: .67rem;
    margin-bottom: 0
}
.ping #wrap #left ul li span.common {
    width: 1.84rem;
    height: .75rem;
    line-height: .67rem;
    font-size: .38rem;
    color: #fff;
    font-weight: bold;
    display: inline-block;
    background: url("../images/demo/start.png") 0 0 no-repeat;
    background-size: 100%;
    border: 0;

}
.ping #wrap #left ul li.time {
    text-align: center;
    color: #FFF
}
.ping #wrap #left ul li.time .no {
    color: #FFF !important
}
.success {
    width: 6.66rem;
    height: 4.13rem;
    position: fixed;
    bottom: 3.3rem;
    left: 0;
    right: 0;
    margin: auto;
    background: url("../images/demo/page3_1.png") 0 0 no-repeat;
    background-size: 100%;
    z-index: 11
}
.success a {
    width: 2.12rem;
    height: .52rem;
    margin-left: 2.25rem;
    margin-top: 2.86rem;
    border-radius: 2rem;
    display: block
}

/*答题区域*/
.wrap {
    width: 100%;
    height: 100%;
    background: #50b7e2;
}

.wrap .first_wrap .enter_btn img {
    width: 3.2rem;
    height: .94rem;
    margin: 0 auto;
    position: relative;
    z-index: 5;
}

.wrap .topic_wrap {
    width: 100%;
    height: 100%;
}
/*第一题*/
.wrap .topic_wrap .an_bg .qur1 {
    width: 100%;
    height: 6.14rem;
    position: relative;
}
.wrap .topic_wrap .an_bg .qur1 .qur1_q {
    width: 6.78rem;
    margin: .5rem auto;
    position: relative;
    z-index: 2;
}

.wrap .topic_wrap .an_bg .qur1 .write, .qur1 .selBox {
    width: 6.6rem;
    height: 4rem;
    background-color: #fff;
    position: absolute;
    top: 1.55rem;
    left: 50%;
    margin-left: -3.3rem;
    border-radius: .15rem;
    z-index: 1;
    padding-top: 2.64rem;
    box-sizing: border-box;
}
.wrap .topic_wrap .an_bg .qur2 .write, .qur2 .selBox {
    padding-top: .55rem;
}
.qur1 .selBox {
    z-index: 3;
    background: transparent;
}
.qur1 .selBox>li, .qur1 .write .sel_bg {
    width: 48%;
    height: .62rem;
    background-color: #ffe148;
    border-radius: .15rem;
    float: left;
    opacity: 0;
    margin-left: 1%;
}
.qur2 .selBox>li, .qur2 .write .sel_bg {
    width: 6.39rem;
    height: .75rem;
    margin-left: .09rem;
    margin-bottom: .3rem;
}
.qur1 .selBox li {
    background: transparent;
    opacity: 0;
}

.qur1 .selBox>li img {
    width: .51rem;
    height: .5rem;
    float: right;
    margin-top: .07rem;
    margin-right: .08rem;
}

.wrap .topic_wrap .an_bg .qur1 .qur1_img {
    width: 6.78rem;
    position: absolute;
    bottom: 0;
    left: 50%;
    margin-left: -3.39rem;
}


.error {
    width: 5.69rem;
    height: 7.51rem;
    position: fixed;
    top: 50%;
    left: 50%;
    margin-left: -2.845rem;
    margin-top: -3.755rem;
    background: url("../images/again.png") no-repeat;
    z-index: 11;
    background-size: 100% 100%
}
.error .erBtn {
    width: 4.57rem;
    height: 1.13rem;
    margin: 5.21rem auto;
    display: block;
    background: transparent;
    border: 0;
    opacity: 0
}
.sucessBox {
    width: 100%;
    min-height: 100%;
    height: auto;
    padding: 1.03rem 0 1rem;
    position: relative;
    box-sizing: border-box;
    background: url("../images/page_chou.jpg") no-repeat;
    background-size: 100% 100%;
}
.sucess {
    width: 6.2rem;
    height: 10.94rem;
    margin: 0 auto;
    background: url("../images/sucess.png") no-repeat;
    background-size: 100% 100%;
    /* */
}
.sucess form {
    width: 6.19rem;
    height: 5.9rem;
    position: absolute;
    top: 2.48rem;
    padding-top: 1.89rem;
}
.sucess form input[type='text'] {
    width: 4.99rem;
    height: .56rem;
    display: block;
    border: solid 1px #49320f;
    margin-left: .61rem;
    margin-bottom: .71rem;
    border: 0;
    font-size: .25rem;
}
.sucess form .localRadio {
    width: 5.24rem;
    height: .95rem;
    margin-left: .49rem;
    overflow: hidden;
    margin-top: 1.27rem;
}
.sucess form .localRadio div {
    width: 1.49rem;
    height: .27rem;
    float: left;
    position: relative;
    overflow: hidden;
    margin-bottom: .4rem;
}
.sucess form .localRadio div.local02 {
    width: 1.77rem;
    margin-left: .55rem;
}
.sucess form .localRadio div.local03 {
    width: 1.77rem;
}
.sucess form .localRadio div.local04 {
    margin-left: .28rem;
}
.sucess form .localRadio div.local05 {
    margin-left: .2rem;
}
.sucess form .radioBox {
    width: 2.76rem;
    height: .28rem;
    margin-left: .54rem;
    overflow: hidden;
    margin-top: 1.28rem;
}
.sucess form .radioBox div {
    width: .81rem;
    height: 100%;
    float: left;
    position: relative;
    overflow: hidden
}
.sucess form .radioBox div.noBox {
    float: right
}
.sucess form .radioSel {
    width: .28rem;
    height: .27rem;
    margin-right: .14rem;
}
.sucess form input[type='radio'] {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0
}
.sucess form #btn_sub {
    width: 3.96rem;
    height: .97rem;
    margin: 0 auto;
    display: block;
    border: 0;
    background: transparent;
    opacity: 0;
    margin-top: 1rem
}
.sucess form .Validform_checktip {
    width: 100%;
    text-align: center;
    font-size: .24rem;
    color: #fff;
}
.sucess form .Validform_wrong {
    width: 3rem;
    height: 1rem;
    line-height: 1rem;
    background: rgba(0, 0, 0, 0.5);
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    border-radius: 0.1rem
}

/*抽中弹框*/
.sucBox {
    width: 100%;
    height: 9.05rem;
    position: fixed;
    top: 1.5rem;
    left: 0;
    background: url("../images/chou/success.png") no-repeat;
    z-index: 11;
    background-size: 100% 100%
}
.sucBox button {
    width: 2.23rem;
    height: .75rem;
    display: inline-block;
    margin-top: .75rem;
    background: transparent;
    border: 0;
    opacity: 0
}
.sucBox button.look {
    margin-left: 1.28rem;
}
.sucBox .playAgain {
    margin-left: .2rem;
}
.sucBox button.closesucBox {
    width: .75rem;
    height: .75rem;
    margin: .75rem auto;
    display: block;
}
/*我的奖品弹框*/
.myPrizeBox {
    width: 6.36rem;
    height: 7.3rem;
    position: fixed;
    top: 2.63rem;
    left: .57rem;
    background: url("../images/chou/my.png") no-repeat;
    z-index: 11;
    background-size: 100% 100%
}
.myPrizeBox ul {
    width: 5.68rem;
    height: 3.46rem;
    padding: .27rem .37rem;
    margin: 1.19rem auto .38rem;
    box-sizing: border-box;
    font-size: .28rem;
    color: #fff;
    line-height: .48rem;
    overflow-y: auto;
}
.myPrizeBox button {
    width: 2.03rem;
    height: .73rem;
    display: block;
    margin: 0 auto;
    background: transparent;
    border: 0;
    opacity: 0
}
.myPrizeBox button.closePrizeBtn2 {
    width: .75rem;
    height: .75rem;
    margin-top: .83rem;
}
.myPrizeBox .closePrizeBox {
    width: .75rem;
    height: .75rem;
    margin: .75rem auto;
    display: block;
}
.prize_text {
    width: 4.12rem;
    text-align: center;
    font-size: .35rem;
    line-height: .38rem;
    margin-left: 1.69rem;
    margin-top: 5rem;
    color: rgb(51, 51, 51);
}
.layerbg {
    width: 100%;
    height: 100%;
    background-color: #000;
    opacity: 0.6;
    position: fixed;
    z-index: 10;
    bottom: 0;
    left: 0
}
.layerbg2 {
    position: absolute;
}
/*抽奖*/
.keBody {
    background: #ff1442;
    min-height: 100%;
    height: auto;
    padding-bottom: .3rem;
    position: relative;
}
.userInfo {
    width: 6.82rem;
    padding-top: .83rem;
    overflow: hidden;
}
.userInfo li {
    width: 100%;
    text-align: center;
    font-size: .29rem;
    color: #fff;
}
.keBody #lottery {
    width: 6.82rem;
    height: 5.81rem;
    margin: .5rem auto 0;
    background: url("../images/chou/page7_1.png") no-repeat;
    background-size: 100% 100%
}
.keBody #lottery table {
    margin: 0 auto
}
.keBody #lottery table tbody {
    margin: .4rem auto;
    display: block
}
.keBody #lottery table tbody td {
    position: relative;
    width: 1.98rem;
    height: 1.63rem;
    text-align: center;
    font-index: -999;
    padding: .015rem
}
.keBody #lottery table tbody td img {
    display: block;
    width: 100%;
    height: 100%;
}
.keBody #lottery table tbody td a {
    width: 100%;
    height: 100%;
    display: block;
    text-decoration: none;
    background: url("../images/chou/lottery1.png") no-repeat;
    background-size: 100% 100%
}
.keBody #lottery table tbody td.active .mask {
    display: block
}
.keBody #lottery table tbody td .mask {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;

    display: none
}
.keBody #lottery .showInfoBox {
    overflow: hidden;
    width: 100%;
    margin-top: .45rem;
}
.keBody #lottery .showInfoBox div {
    width: 3.02rem;
    height: .84rem;
    line-height: .78rem;
    text-align: center;
    font-size: .27rem;
    color: rgb(187, 5, 17);
    border-radius: .11rem;
    float: left;
    background: url("../images/chou/btn.png") no-repeat;
    background-size: 100% 100%;
}
.keBody #lottery .showInfoBox div.rightBox {
    float: right
}
.small_text {
    color: #fff;
    font-size: .29rem;
    text-align: center;
    margin-top: .3rem;
}
.keBody .txtMarquee-top {
    width: 6.7rem;
    height: 3.59rem;
    background: #ff1442 url("../images/chou/page7_2.png") no-repeat;
    background-size: 100% 100%;
    overflow: hidden;
    margin: 2.16rem auto .39rem;
}
.keBody .txtMarquee-top .bd {
    height: 100%;
    padding: 0 .61rem;
    margin-top: .83rem;
}
.keBody .txtMarquee-top .bd li {
    font-size: .24rem;
    color: #fff;
    overflow: hidden
}
.keBody .txtMarquee-top .bd li span {
    width: 50%;
    display: inline-block;
}