body,
html,
.wrap {
    overflow: hidden;
    width: 100%;
    font-size: 12px;
    height: 100%;
    font-family: 'LouisBold', 'Microsoft YaHei', sans-serif;
    color: #000;
}

img {
    display: block;
    width: 100%;
}

input {
    -webkit-appearance: none;
}

.section {
    background: url(../images/bg.jpg) 50% 50% no-repeat;
    background-size: cover;
    position: absolute;
    width: 100%;
    height: 100%;
    overflow: hidden;
    background-color: #fff;
    z-index: 1;
    top: 0;
    left: 0;
    display: none;
}

#wrap .show {
    display: block;
}

.logo,
.music {
    position: absolute;
    width: 27.33%;
    top: 3%;
    left: 3%;
    z-index: 10;
}

.music {
    left: auto;
    right: 3%;
    width: 8%;
}

.music-off:after {
    content: "";
    width: 2px;
    height: 100%;
    background-color: #fdf4e5;
    position: absolute;
    top: 0;
    left: 50%;
    -webkit-transform: translateX(-50%) rotate(45deg);
}

.home .title {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 47.6%;
    -webkit-transform: translate(-50%, -89%);
    -webkit-transition: opacity 1s;
}

.home .balloon {
    position: absolute;
    -webkit-transition: all 1s;
    top: 50%;
    left: 50%;
    z-index: 5;
}

.home .balloon1 {
    width: 48.26%;
    -webkit-transform: translate(-117%, -123%) scale(0.453) rotate(-8deg);
}

.home .balloon2 {
    width: 44.8%;
    -webkit-transform: translate(16%, -133%) scale(0.529);
}

.home .balloon3 {
    width: 45.6%;
    -webkit-transform: translate(-126%, -15%) scale(0.523);
}

.home .balloon4 {
    width: 45.73%;
    -webkit-transform: translate(16%, -10%) scale(0.4635) rotate(33deg);
}

.home .balloon>img:nth-child(1) {
    /*-webkit-transform: translateY(-15%);*/
    /*-webkit-animation:ballAni 5s infinite linear;*/
}

.home .balloon1>img:nth-child(1) {
    -webkit-animation: ballAni 5s 0.5s infinite linear;
}

.home .balloon2>img:nth-child(1) {
    -webkit-animation: ballAni 5s  linear 1s infinite;
}

.home .balloon3>img:nth-child(1) {
    -webkit-animation: ballAni 5s 1.3s infinite linear;
}

.home .balloon4>img:nth-child(1) {
    -webkit-animation: ballAni 4s 0.2s infinite linear;
}

.home .balloon img:nth-child(2) {
    display: none;
}

.home .qq {
    position: absolute;
    z-index: 1;
        -webkit-transition: opacity 1s;

}

.home .qq1 {
    width: 45.6%;
    top: 13%;
    left: -4%;
    -webkit-animation: ballAni2 4s 0.2s infinite linear;
}

.home .qq2 {
    width: 49.2%;
    top: 6%;
    right: -4%;
    -webkit-animation: ballAni2 5s 0.2s infinite linear;
}

.home .qq3 {
    width: 44.53%;
    top: 45%;
    left: -3%;
    -webkit-animation: ballAni2 4s 0.5s infinite linear;
}
.home .qq4 {
    width: 44.26%;
    top: 52%;
    -webkit-animation: ballAni2 5s 1s infinite linear;
    right: -1%;
}

@-webkit-keyframes ballAni {
    0% {
        -webkit-transform: translateY(0%);
    }
    50% {
        -webkit-transform: translateY(-15%);
    }
    100% {
        -webkit-transform: translateY(0%);
    }
}

@-webkit-keyframes ballAni2 {
    0% {
        -webkit-transform: translateY(0%);
    }
    50% {
        -webkit-transform: translateY(-10%);
    }
    100% {
        -webkit-transform: translateY(0%);
    }
}

.home .bpos1 {
    -webkit-transform: translate(-50%, -88%) scale(1) rotate(0deg);
}

.home .bpos2 {
    -webkit-transform: translate(-50%, -88%) scale(1);
}

.home .bpos3 {
    -webkit-transform: translate(-50%, -88%) scale(1);
}

.home .bpos4 {
    -webkit-transform: translate(-50%, -88%) scale(1) rotate(0deg);
}

.home .boom {
    width: 100%;
    -webkit-transition: none;
    left: 0;
    -webkit-transform: translateY(-59%)
}

.home .boom img:nth-child(2) {
    display: block;
}

.home .boom img:nth-child(1) {
    display: none;
}

.home .price-box {
    display: none;
}

.home .pop,
.home .price {
    position: absolute;
    left: 0;
    width: 100%;
    top: 4%;
    z-index: 5;
}

.home .price {
    display: block;
    position: absolute;
    left: 17.1%;
    width: 71.8%;
    top: 50%;
    -webkit-transform: translateY(-133%);
    z-index: 6;
}

.home .opc05 {
    opacity: 0.3;
    pointer-events: none;
}

.home .opc0 {
    opacity: 0;
    pointer-events: none;
}

.home .btn-box {
    position: absolute;
    width: 37.33%;
    left: 31%;
    bottom: 6%;
    -webkit-transition: opacity 1s;
    z-index: 6;
}

.home .btn-box .btn2 {
    width: 78.57%;
    margin: 7% auto 0;
}
.home .qrcode{
    position: absolute;
    left: 50%;
    top: 50%;
     -webkit-transform: translate(-50%,-50%);
     text-align: center;
     font-size: 14px;
    width: 60%;

}
.home .qrcode img:nth-child(2){
    position: absolute;
    left: 15.3%;
    top: 16%;
    width:65%;
}
.home .qrcode p{
    margin-top: 7%;
}
.carbox .slider-box .item {
    position: relative;
}

.carbox .slider-box .item img {
    margin: 10% auto 0;
}

.carbox .slider-box .item .copy {
    position: absolute;
    width: 65.73%;
    top: -46%;
    left: 17%;
    -webkit-transform-origin: 12% 88%;
    -webkit-transform: scale(0);
    -webkit-transition: all 0.2s;
}

.carbox .slider-box .showcopy .copy {
    -webkit-transform: scale(1);
}

.carbox .slider-box .item .copy img {
    width: 100%;
    margin: 0;
}

.carbox .button-next,
.button-prev {
    width: 12%;
    top: 0;
    margin: 0;
    overflow: hidden;
    position: absolute;
    left: 10px;
    z-index: 10;
}

.carbox .button-next a,
.button-prev a {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    text-indent: -9999px;
}

.carbox .button-next {
    -webkit-transform: rotate(180deg);
    right: 10px;
    left: auto;
}

.carbox .slider-box {
    overflow: visible;
    margin-top: 10%;
    position: relative;
}

.carbox .btn3 {
    position: absolute;
    bottom: 13.2%;
    width: 48%;
    left: 26%;
}

.carbox .button-disabled {
    opacity: 0.5;
    -webkit-filter: grayscale(50%);
}

.game .game-tip {
    position: absolute;
    width: 86.2%;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    display: none;
}

.game .game-tip .btn-box {
    width: 55.64%;
    margin: 20% auto 0;
}

.game .game-tip .btn-box .start-game {
    margin-bottom: 7%;
}

.rule {
    background: rgba(0, 0, 0, 0.8);
    z-index: 15;
}

.rule .rule-con {
    width: 99%;
    left: 0.5%;
    top: 50%;
    -webkit-transform: translateY(-50%);
    position: absolute;
}

.rule .start-game {
    position: absolute;
    left: 22%;
    bottom: 17%;
    width: 57%;
    height: 8%;
}

.game .game-box,
.game .game-box .balloons-stage {
    background: none;
}

.game .game-box .downcount {
    position: absolute;
    background: url(../images/icon-4.png) 17px 49% no-repeat #f27300;
    background-size: auto 71%;
    height: 35px;
    line-height: 35px;
    padding: 0 23px 0 48px;
    font-size: 26px;
    color: #fff;
    left: 50%;
    -webkit-transform: translateX(-50%);
    top: 8%;
    border-radius: 14px;
    z-index: 10;
    pointer-events: none;
}

.game .game-box .balloons-stage {
    z-index: 9;
}

.balloons-stage .b {
    position: absolute;
    top: 100%;
    -webkit-animation: movetop 4s linear;
    width: 23.86%;
    -webkit-transition: opacity 0.2s 0.2s;
}

.balloons-stage .hideb {
    opacity: 0;
}

.balloons-stage .b>img:nth-child(2) {
    width: 177%;
    position: absolute;
    left: 50%;
    top: -16%;
    -webkit-transform: translateX(-50%);
    display: none;
}

.balloons-stage .stopAni {
    -webkit-animation-play-state: paused;
}

.balloons-stage .stopAni>img:nth-child(1) {
    opacity: 0;
}

.balloons-stage .stopAni>img:nth-child(2) {
    display: block;
}

.balloons-stage .b .prize {
    position: absolute;
    left: 50%;
    -webkit-transform: translateX(-50%);
}

.balloons-stage .b .prize1 {
    top: 15%;
    width: 92.73%;
}

.balloons-stage .b .prize2 {
    top: 17%;
    width: 172%;
}

.balloons-stage .b .prize3 {
    top: 17%;
    width: 170%;
}

.balloons-stage .b .prize4 {
    top: 18%;
    width: 113.9%;
}

.flower {
    background: url(../images/game/flower.png);
    background-size: cover;
    z-index: 15;
    pointer-events: none;
    -webkit-transform: scale(0);
}

.showflower {
    -webkit-transition: all 1s;
    -webkit-transform: scale(1.1);
}

@-webkit-keyframes movetop {
    0% {
        top: 100%;
    }
    100% {
        top: -30%;
    }
}

.result {
    background: rgba(0, 0, 0, 0.8);
    z-index: 11;
}

.result .result-box {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 99%;
    -webkit-transform: translate(-50%, -50%);
    display: none;
}

.result .result-con {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

.result .win .prize {
    width: 60.75%;
    margin: 9% auto 0;
}

.result .win .card {
    width: 58.4%;
    margin: 0 auto;
}

.result .win .stitle {
    width: 47.91%;
    margin: 3% auto 0;
}

.submit-form {
    width: 74.29%;
    margin: 2% auto 0;
}

.submit-form input {
    display: block;
    width: 100%;
    border: 1px solid #f27300;
    height: 35px;
    margin-bottom: 3%;
    border-radius: 0;
    background: transparent;
    padding: 0 13%;
    font-size: 14px;
    background: url(../images/icon-1.png) 3% 50% no-repeat;
    background-size: auto 70%;
}
.submit-form .verify-code-box{
    overflow: hidden;
        height: 35px;
        margin-bottom: 3%;

}
.submit-form .verify-code-box input{
    float: left;
    width: 51%;
    margin-bottom: 0;
}
.submit-form .verify-code-box .verify-code-btn{
    float: right;
    width: 45%;
    border-radius: 15px;
    height: 100%;
    text-align: center;
    line-height: 35px;
    color: #fff;
    background:#f27300;
    position: relative;
}
.submit-form .verify-code-box .verify-code-btn:after{
    content: "";
    position: absolute;
    left: 50%;
    -webkit-transform: translateX(-50%);
    height: 26px;
    border:1px dotted #fef0e4;
    width: 92%;
    top: 3px;
    border-radius: 50px;
}

.submit-form .mobile {
    background-image: url(../images/icon-2.png);
}

.submit-form .address {
    background-image: url(../images/icon-3.png);
}

.submit-form .submit-btn {
    display: block;
    width: 54%;
    margin: 2% auto 0;
    padding: 0;
    border: none;
    background: transparent;
}

.result .fail .btn5,
.result .fail .btn6 {
    position: absolute;
    width: 59%;
    height: 7%;
    bottom: 20%;
    left: 23%;
}

.result .fail .btn6 {
    bottom: 10%;
}

.map {
    background-image: url(../images/map.jpg);
    background-position: 50% 50%;
}

.map .title {
    width: 95.2%;
    margin: 15% auto 0;
}

.map .date {
    width: 90%;
    position: absolute;
    left: 5%;
    bottom: 16.5%;
}

.map .btn-box {
    width: 92%;
    position: absolute;
    left: 4%;
    bottom: 6.5%;
}

.map .btn-box .btn {
    position: absolute;
    z-index: 2;
    width: 48%;
    left: 0;
    height: 100%;
}

.map .btn-box .btn8 {
    left: 52%;
}

.share {
    background: url(../images/share.png) 67% 5% no-repeat rgba(0, 0, 0, 0.8);
    background-size: 79.46%;
    z-index: 14;
}

.prompt {
    z-index: 1000;
    background: rgba(0, 0, 0, 0.8);
}

.prompt .prompt-con {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 99%;
    -webkit-transform: translate(-50%, -50%);
}

.prompt .prompt-con img {
    display: none;
}

.fadeIn {
    -webkit-animation: fadeIn 0.5s;
}

.fadeOut {
    -webkit-animation: fadeOut 0.5s;
}

@-webkit-keyframes fadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@-webkit-keyframes fadeOut {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}