*{
    margin: 0;
    padding: 0;
    font-family: "SimSun", "Arial";
}

/*首页*/
.front-wrapper{
    width: 6.4rem;
    height: 12.5rem;
    background: url("/custom/img/act/act190919/front-bg.jpg") no-repeat;
    background-size: 100% 100%;
    position: relative;
    /*display: none;*/
}

.front-btn{
    cursor: pointer;
    width: 3.61rem;
    height: 1.08rem;
    background: url("/custom/img/act/act190919/front-btn.png") no-repeat;
    background-size: 100% 100%;
    position:absolute;
    left: 1.4rem;
    top: 8rem;
}

/*注意事项*/
.attention-wrapper{
    width: 6.4rem;
    height: 11.98rem;
    background: url("/custom/img/act/act190919/attention.jpg") no-repeat;
    background-size: 100% 100%;
    position: relative;
    display: none;
}

#attention-name{
    width: 2rem;
    height: 0.4rem;
    position: absolute;
    left: 2.8rem;
    top: 8.4rem;
    background: transparent;
    border: none;
    outline: none;
    font-size: 0.3rem;
    font-weight: 700;
    color: #999;
    text-align: center;
}

.attention-btn{
    cursor: pointer;
    width: 3.61rem;
    height: 1.08rem;
    background: url("/custom/img/act/act190919/front-btn.png") no-repeat;
    background-size: 100% 100%;
    position:absolute;
    left: 1.4rem;
    top: 9.3rem;
}

/*选项*/
.first-choice{
    position: absolute;
    top: 6.9rem;
    width: 2rem;
    height: 0.6rem;
    left: 1.1rem;
    cursor: pointer;
}
.second-choice{
    position: absolute;
    top: 6.9rem;
    width: 2rem;
    height: 0.6rem;
    left: 3.3rem;
    cursor: pointer;
}
.third-choice{
    position: absolute;
    top: 7.8rem;
    width: 2rem;
    height: 0.6rem;
    left: 1.1rem;
    cursor: pointer;
}
.fourth-choice{
    position: absolute;
    top: 7.8rem;
    width: 2rem;
    height: 0.6rem;
    left: 3.3rem;
    cursor: pointer;
}

/*第一题*/
.first{
    width: 6.4rem;
    height: 11.98rem;
    background: url("/custom/img/act/act190919/first.jpg") no-repeat;
    background-size: 100% 100%;
    position: relative;
    display: none;
}

/*第二题*/
.second{
    width: 6.4rem;
    height: 11.98rem;
    background: url("/custom/img/act/act190919/second.jpg") no-repeat;
    background-size: 100% 100%;
    position: relative;
    display: none;
}
.music{
    width: 4.3rem;
    height: 2.5rem;
    position: absolute;
    left: 1rem;
    top: 2.1rem;
}

/*第三题*/
.third{
    width: 6.4rem;
    height: 11.98rem;
    background: url("/custom/img/act/act190919/third.jpg") no-repeat;
    background-size: 100% 100%;
    position: relative;
    display: none;
}

/*第四题*/
.four{
    width: 6.4rem;
    height: 11.98rem;
    background: url("/custom/img/act/act190919/four.jpg") no-repeat;
    background-size: 100% 100%;
    position: relative;
    display: none;
}

/*第五题*/
.five{
    width: 6.4rem;
    height: 11.98rem;
    background: url("/custom/img/act/act190919/five.jpg") no-repeat;
    background-size: 100% 100%;
    position: relative;
    display: none;
}

/*第六题*/
.six{
    width: 6.4rem;
    height: 11.98rem;
    background: url("/custom/img/act/act190919/six.jpg") no-repeat;
    background-size: 100% 100%;
    position: relative;
    display: none;
}

/*第七题*/
.seven{
    width: 6.4rem;
    height: 11.98rem;
    background: url("/custom/img/act/act190919/seven.jpg") no-repeat;
    background-size: 100% 100%;
    position: relative;
    display: none;
}

/*第八题*/
.eight{
    width: 6.4rem;
    height: 11.98rem;
    background: url("/custom/img/act/act190919/eight.jpg") no-repeat;
    background-size: 100% 100%;
    position: relative;
    display: none;
}

/*第九题*/
.nine{
    width: 6.4rem;
    height: 11.98rem;
    background: url("/custom/img/act/act190919/nine.jpg") no-repeat;
    background-size: 100% 100%;
    position: relative;
    display: none;
}

/*第十题*/
.ten{
    width: 6.4rem;
    height: 11.98rem;
    background: url("/custom/img/act/act190919/ten.jpg") no-repeat;
    background-size: 100% 100%;
    position: relative;
    display: none;
}
.music2{
    width: 4.3rem;
    height: 2.5rem;
    position: absolute;
    left: 1rem;
    top: 2rem;
}

/*结果显示*/
.result{
    width: 6.4rem;
    height: 12.5rem;
    position: relative;
    display: none;
    background: url(/custom/img/act/act190919/result-bg.jpg) no-repeat;
    background-size: 100% 100%;
}
.result-img{
    display: block;
    width: 5.4rem;
    height: 9rem;
    position: absolute;
    left: 0.5rem;
    top: 0.64rem;
}
.download{
    position: absolute;
    background: url(/custom/img/act/act190919/download.png) no-repeat;
    background-size: 100% 100%;
    top: 9rem;
    left: 0.5rem;
    width: 3rem;
    height: 1.5rem;
    cursor: pointer;
    z-index: 1000;
}
.save{
    position: absolute;
    background: url(/custom/img/act/act190919/save.png) no-repeat;
    background-size: 100% 100%;
    top: 9rem;
    left:2.9rem;
    width: 3rem;
    height: 1.5rem;
    cursor: pointer;
    z-index: 1000;
}
.restart{
    position: absolute;
    right: 0;
    cursor: pointer;
    background: url("/custom/img/act/act190919/restart.png") no-repeat;
    background-size: 100% 100%;
    width: 2.18rem;
    height: 0.67rem;
}

/*动画效果*/
.animation-wrapper{
    position: absolute;
    left: 2.8rem;
    top: 8.6rem;
    display: none;
}
.animation{
    background: url("/custom/img/act/act190919/animation.png") no-repeat;
    background-size: 12rem 1rem;
    width: 1.1rem;
    height: 1rem;
    animation: move steps(1,end) 2s infinite;
}

@keyframes move {
    0%{
        background-position: -0.05rem 0.05rem;
    }
    10%{
        background-position: -1.2rem -0.05rem;
    }
    20%{
        background-position: -2.4rem -0.05rem;
    }
    30%{
        background-position: -3.6rem -0.05rem;
    }
    40%{
        background-position: -4.8rem -0.05rem;
    }
    50%{
        background-position: -6rem -0.05rem;
    }
    60%{
        background-position: -7.2rem -0.05rem;
    }
    70%{
        background-position: -8.4rem -0.05rem;
    }
    80%{
        background-position: -9.6rem -0.05rem;
    }
    90%{
        background-position: -10.8rem -0.05rem;
    }
    100%{
        background-position: -0.05rem 0.05rem;
    }
}

.progress{
    width: 4.5rem;
    height: 0.05rem;
    position: absolute;
    left: 1rem;
    top: 9.5rem;
    background: #fff;
    display: none;
}
.progress-inner{
    width: 2.25rem;
    height: 0.05rem;
    position: absolute;
    left: 0;
    top: 0;
    background: #edd456;
}