* {
    margin: 0 auto;
    padding: 0;
}

body,
html {
    width: 100%;
    height: 100%;
    background-image: url(../../BG.png);
    background-size: 100% 100%;
    background-repeat: no-repeat;
}

#BoX {
    width: 100%;
    height: 100%;
    position: relative;
    text-align: center;
}

/* #Back {
    position: absolute;
} */
.Logo_img {
    margin-top: 4%;
    float: right;
}

.AAA {
    margin-top: 9%;
}

#ZT {
    margin-top: -12%;
}

#WenAn {
    width: 69%;
    text-align: left;
    color: #fff;
    font-size: 17px;
    margin-top: -2%;
    line-height: 27px;
    letter-spacing: 2px;
    font-family: "SimHei";
}

#Body_BoX {
    position: absolute;
    width: 100%;
    margin-top: 18%;

}


/* 问卷 */
#Box_Survey {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    background-image: url(../img/蒙板.png);
    background-size: 100% 100%;
    background-repeat: no-repeat;
}

#SurveyBox {
    width: 80%;
    height: 75%;
    margin-top: 20%;
    background-image: url(../img/7.4/1.png);
    background-size: 100% 100%;
    background-position: center;
    background-repeat: no-repeat;
    position: relative;

}

#TuiChu {
    position: absolute;
    right: 0%;
    top: 2%;
    z-index: 10000;
}

#SurveyBox_Top {
    width: 100%;
    height: 18%;
    /* background-color: #04bac4; */
    position: relative;
}

#SurveyBox_Top img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

#SurveyBox_input {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 82%;
    /* background-color: #04bac4; */
    overflow: auto;
}

#slide_2 {
    position: absolute;
    margin-top: 95%;
}

#slide_3 {
    position: relative;
    margin-top: 190%;
}


#SurveyBox_input span {
    position: absolute;
    width: 80%;
    height: 50px;
    background-color: #bfdadb;
    margin-top: 77%;
    transform: translate(-50%, -50%);
    left: 50%;
    z-index: 100000;
}


.img li a img {
    width: 100%;
}

#SurveyBox_input span i:first-child {
    width: 35%;
    height: 100%;
    float: left;
    display: flex;
    font-style: normal;
    line-height: 50px;
    padding-left: 6%;
    font-size: 4.0vw;
    position: relative;
    letter-spacing: 1px;
    font-weight: 600;
}

#SurveyBox_input span i:nth-child(2) {
    width: 58%;
    height: 100%;
    float: right;
    background: none;
    text-align: center;
}

#errtips {
    margin-left: 5%;
    position: absolute;
    left: 27%;
    top: 14.5%;
    font-size: 14px;
    color: rgb(219, 2, 2);
    font-weight: 600;
    letter-spacing: 3px;
    animation-name: errtips;
    animation-duration: 1s;
}

@keyframes errtips {
    20% {
        transform: translateX(7px);
    }

    40% {
        transform: translateX(-7px);
    }

    60% {
        transform: translateX(7px);
    }

    80% {
        transform: translateX(-7px);
    }

    100% {
        transform: translateX(0px);
    }
}

#SurveyBox_input span i input {
    width: 100%;
    height: 100%;
    font-size: 15px;
    border-left: 1px #3ef2fc solid;
    border-bottom: none;
    border-top: none;
    border-right: none;
    background: none;
    outline: none;
    text-align: center;
}

#SurveyBox_input .content {
    width: 100%;
    height: 100%;
    border-left: 1px #3ef2fc solid;
}

#SurveyBox_input .content .select {
    width: 100%;
    height: 100%;
    /* background: #FFFFFF; */
    margin: 0px auto;
    position: relative;
    cursor: pointer;
    font-style: normal;
}

#SurveyBox_input .content .select::after {
    content: "";
    display: block;
    width: 10px;
    height: 10px;
    background-image: url(../img/7.4/jian.png);
    background-size: 100%;
    /* border-left: 2px solid #000;
    border-bottom: 2px solid #000; */
    top: 50%;
    right: 12px;
    position: absolute;
    transform: translateY(-50%);
    transition: all .3s ease-in;
}

#SurveyBox_input .content .select p {
    width: 100%;
    height: 100%;
    line-height: 50px;
    font-size: 15px;
    font-family: "microsoft yahei";
    color: #000;
    padding: 0px 0px;
}

#SurveyBox_input .content .select ul {
    width: 100%;
    height: 180px;
    display: block;
    font-size: 15px;
    background: #a1e0e2;
    position: absolute;
    top: 49px;
    left: -1px;
    max-height: 0px;
    overflow: scroll;
    transition: max-height .3s ease-in;
    position: absolute;
    z-index: 10000;
}

#SurveyBox_input .content .select ul li {
    width: 100%;
    line-height: 46px;
    /* padding: 0px 15px; */
    list-style: none;
    color: #666666;
    z-index: 10000;
}

#SurveyBox_input .content .select ul li.Selected {
    background: #046d68;
    color: #FFFFFF;
}

#SurveyBox_input .content .select ul li:hover {
    /* background: #D0D0D0; */
}

@-webkit-keyframes slide-down {
    0% {
        transform: scale(1, 0);
    }

    25% {
        transform: scale(1, 1.2);
    }

    50% {
        transform: scale(1, 0.85);
    }

    75% {
        transform: scale(1, 1.05);
    }

    100% {
        transform: scale(1, 1);
    }
}

#SurveyBox_input .content .select.open ul {
    max-height: 180px;
    transform-origin: 50% 0;
    /* -webkit-animation: slide-down .5s ease-in; */
    transition: max-height .3s ease-in;
}

#SurveyBox_input .content .select.open::after {
    transform: rotate(180deg);
    transition: all .3s ease-in;
    position: absolute;
    top: 42%;

}

#ER {
    width: 30%;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    margin-top: 96%;
}

#ERTEXT {
    text-align: center;
    width: 100%;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    margin-top: 128%;
    color: #fff;
    font-weight: 600;
    letter-spacing: 2px;
}

#SurveyBox_input #ChouJiang {
    width: 40%;
    position: absolute;
    left: 50%;
    top: 200%;
    transform: translateX(-50%);
    border: none;
    margin-top: 143%;
}

#SurveyBox_input #Report {
    width: 40%;
    position: absolute;
    left: 50%;
    top: 225%;
    transform: translateX(-50%);
    border: none;
    padding-bottom: 5%;
    text-align: center;
    color: #fff;
}

/* 抽奖 */
#Box_CJ {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    background-image: url(../img/蒙板.png);
    background-size: 100% 100%;
    background-repeat: no-repeat;
}

#titer {
    position: absolute;
    top: 8%;
    left: 50%;
    transform: translateX(-50%);
}

#ZhuanPan {
    position: absolute;
    width: 350px;
    height: 350px;
    margin: 0 auto;
    margin-top: 48%;
    left: 50%;
    transform: translateX(-50%);
    overflow: hidden;
}

.table {
    width: 100%;
    height: 100%;
}

.table img {
    width: 100%;
    transform: rotate(-3deg);
}

.btn {
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -45px;
    margin-top: -65px;
    width: 85px;
    height: 110px;
    background-image: url(../img/指针.png);
    background-size: 100%;
    background-repeat: no-repeat;
}


/* 弹框 */
#Pop_up {
    position: absolute;
    width: 60%;
    height: 20%;
    left: 50%;
    top: 50%;
    z-index: 10000000;
    transform: translate(-50%, -50%);
    border: #0ea6d4 1px solid;
}

#Pop_up_titer {
    width: 100%;
    height: 25%;
    background-color: #2093b6;
}

#Pop_up_titer span:first-child {
    margin-top: 2.2%;
    margin-left: 5%;
    font-size: 22px;
    letter-spacing: 6px;
    float: left;
    color: #fff;
    font-weight: 600;
}

#Pop_up_titer span:nth-child(2) {
    float: right;
    margin-top: 2.8%;
}

#Pop_up_titer span:nth-child(2) img {
    width: 80%;
}

#Pop_up_Body {
    text-align: center;
    width: 100%;
    height: 75%;
    position: relative;
    background-color: rgba(243, 243, 243, 0.966);
}

#Pop_up_Body p {
    width: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 22px;
    letter-spacing: 3px;
    font-weight: 600;
}


/* 兑奖 */
#BoX_Prize {
    width: 100%;
    height: 100%;
    position: relative;
}

#Erweima_1 {
    width: 100%;
    position: absolute;
    left: 50%;
    top: 39%;
    transform: translate(-50%, -50%);
    text-align: center;
}

#Erweima_1_img2 {
    margin-top: 45%;
    text-align: center;
    width: 97%;
}

#ErWei {
    width: 100%;
    position: absolute;
    left: 50%;
    top: 75%;
    transform: translate(-50%, -50%);
    text-align: center;
}

#Erweima {
    width: 100px;
    height: 100px;
    /* border: 3px solid green; */
}

#ErWei p:nth-child(2) {
    font-size: 15px;
    margin-top: 2%;
    letter-spacing: 1.8px;
    font-weight: 600;
    font-family: 微软雅黑;
}

#ErWei p:nth-child(3) {
    font-size: 15px;
    margin-top: 1%;
    letter-spacing: 1.8px;
    font-weight: 600;
    font-family: 微软雅黑;
}

#Body_Button_Coles img {
    width: 5%;
    top: 10%;
    right: 3%;
    float: right;
    position: absolute;
    z-index: 10000;
}

#Bottom_12 {
    position: absolute;
    top: 87.5%;
    left: 50%;
    transform: translate(-50%, -50%);
}

/* 个性定制 */
#GeXing img {
    width: 22%;
    position: absolute;
    top: -16%;
    left: 38%;
    transform: translate(-50%, -50%);
}

/* VR望远镜 */
#VRWang img {
    width: 22%;
    position: absolute;
    top: -2%;
    left: 70.5%;
    transform: translate(-50%, -50%);
}

/* 露营区飞盘彩绘 */
#LuYing img {
    width: 22%;
    position: absolute;
    top: 2.3%;
    left: 45%;
    transform: translate(-50%, -50%);
}

/* 公路商店咖啡 */
#KaFei img {
    width: 22%;
    position: absolute;
    top: 13.5%;
    left: 65%;
    transform: translate(-50%, -50%);
}

/* 公路商店咖啡 */
#WaWa img {
    width: 25%;
    position: absolute;
    top: -16%;
    left: 72%;
    transform: translate(-50%, -50%);
}

#Body_Button_3 img {
    width: 49.8%;
    position: absolute;
    top: 122%;
    left: 50%;
    transform: translate(-50%, -50%);
}


#Body_Button_4 img {
    width: 49.8%;
    position: absolute;
    top: 122%;
    left: 50%;
    transform: translate(-50%, -50%);
}


/* 兑奖 */
#BoX_Prize {
    width: 100%;
    height: 100%;
    position: relative;
}

#Erweima_1 {
    width: 100%;
    position: absolute;
    left: 50%;
    top: 39%;
    transform: translate(-50%, -50%);
    text-align: center;
}

#Erweima_1_img2 {
    margin-top: 45%;
    text-align: center;
    width: 97%;
}

#ErWei {
    width: 100%;
    position: absolute;
    left: 50%;
    top: 75%;
    transform: translate(-50%, -50%);
    text-align: center;
}

#Erweima {
    width: 100px;
    height: 100px;
    /* border: 3px solid green; */
}

#ErWei p:nth-child(2) {
    font-size: 15px;
    margin-top: 2%;
    letter-spacing: 1.8px;
    font-weight: 600;
    font-family: 微软雅黑;
}

#ErWei p:nth-child(3) {
    font-size: 15px;
    margin-top: 1%;
    letter-spacing: 1.8px;
    font-weight: 600;
    font-family: 微软雅黑;
}