/* CSS Initializing */

 html, body {
        position: relative;
        height: 100%;
    }
    .swiper-container {
        width: 100%;
        height: 100%;
    }
    .swiper-slide {
        display: -webkit-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;
    }
.indextxt{margin-top:60%;padding:0 15% 0 15%;color:#593b26;font-size:0.9rem;}
.start-btn{width:100px;height:33px;display:inline-block;background:url(../images/start-btn.png) no-repeat;background-size:100%;margin-top:20%; }
.test{padding:12% 8% 0 9%;color:#804f1b;}
.test .title{font-size:1rem;padding:0 10%;text-align:center;line-height:19px;}
.test dl dt{color:#333;font-size:0.9rem;margin:0.4rem 0 0.2rem;}
.test dl dt span{width:18px;height:18px;background:#fa9219;border-radius:18px;color:#fff;display:inline-block;text-align:center;line-height:18px;font-size:0.9rem;margin-right:0.3rem;}
.test dl dd {padding-left:5%; }
.test dl dd label{display:inline-block;width:48%;}
.test dl dd label input{margin-right:0.3rem;}

.form-box{margin-top:12%;padding:0 12% 0 11%;color:#804f1b;font-size:0.9rem;}
.form-box .title{font-size:1.1rem;margin:0 0 0.3rem;}
.form-box .txt{line-height:18px;margin:0 0 0.3rem;}
.form-box select{background:#ebebeb;height:32px;border:none;width:48%;}
.inputmk{font-size:1rem;margin:0.4rem 0;}
.inputtip{background:#ebebeb;height:32px;line-height:32px;border:none;width:90%;padding:0 5%;margin-top:0.2rem;}
.notice{color:#888;line-height:20px;}
.star,.star1{width:12px;height:11px;display:inline-block;background:url(../images/star.png) no-repeat;background-size:100%; vertical-align:middle;margin-bottom:0.3rem;}
.star1{background:url(../images/star1.png) no-repeat;background-size:100%; }
.result-box{margin-top:12%;padding:0 12% 0 11%;color:#804f1b;font-size:0.9rem;}
.result-box .title{font-size:1.1rem;margin:0 0 0.8rem;}
.resulat-mk{border-bottom:1px solid #daccbd;color:#bb7f3f;padding:0.3rem 0;line-height:18px;}
.resulat-mk span{color:#804f1b;}
.rest-btn{width:100px;height:33px;display:inline-block;background:url(../images/rest-btn.png) no-repeat;background-size:100%;margin-top:8%;margin-right:5%;}
.sure-btn{width:100px;height:33px;display:inline-block;background:url(../images/sure-btn.png) no-repeat;background-size:100%;margin-top:8%;border: none;}
.store-btn{width:100px;height:33px;display:inline-block;background:url(../images/store-btn.png) no-repeat;background-size:100%;margin-top:0%;border:none;}

* {box-sizing: border-box;}
html,body {width: 100%;height: 100%;overflow: hidden;position: relative;}
#container {height: 100%;}
.tabs {height: 100%;width: 100%;background:url(../images/testbg.jpg) no-repeat center top;background-size:cover;}
@media (max-width:330px){
	.indextxt{margin-top:60%;font-size:0.8rem;}
	.test{padding:20% 7% 0 8%;color:#804f1b;}
	.test .title{font-size:0.8rem;}
    .test dl dt{color:#333;font-size:0.8rem;margin:0.1rem 0 0.1rem;}
	.mt20{margin-top:10px;}
	.inputmk{margin:0.2rem 0;font-size:0.8rem;}
	.form-box{margin-top:12%;padding:0 10% 30px 9%;color:#804f1b;font-size:0.8rem;}
	.form-box .txt{line-height:18px;margin:0 0 0.3rem;}
    .inputtip{background:#ebebeb;height:28px;line-height:28px;border:none;width:90%;padding:0 5%;margin-top:0.2rem;}
	.result-box{margin-top:18%;padding:0 10% 0 9%;color:#804f1b;font-size:0.8rem;}
    .result-box .title{font-size:1.1rem;margin:0 0 0.4rem;}
   .resulat-mk{border-bottom:1px solid #daccbd;color:#bb7f3f;padding:0.2rem 0;}
   .store-btn{margin-top:0%;}
}



.u-arrow-bottom {
	bottom: 16px;
	z-index: 150;
	margin-left: -7px
}
.u-arrow-bottom img {
	top: 50%;
	margin: -7px 0 0 -14px;
	background-position: 0 -82px;
	-webkit-animation: start 1.5s infinite ease-in-out;
	-moz-animation: start 1.5s infinite ease-in-out;
	animation: start 1.5s infinite ease-in-out
}
.u-arrow-right, .u-arrow-right img {
	position: absolute;
	top: 50%;
	width: 14px;
	height: 24px
}
@-webkit-keyframes start {
0%, 30% {
opacity:0;
-webkit-transform:translate(0, 10px)
}
60% {
opacity:1;
-webkit-transform:translate(0, 0)
}
100% {
opacity:0;
-webkit-transform:translate(0, -8px)
}
}
@-moz-keyframes start {
0%, 30% {
opacity:0;
-moz-transform:translate(0, 10px)
}
60% {
opacity:1;
-moz-transform:translate(0, 0)
}
100% {
opacity:0;
-moz-transform:translate(0, -8px)
}
}
@keyframes start {
0%, 30% {
opacity:0;
transform:translate(0, 10px)
}
60% {
opacity:1;
transform:translate(0, 0)
}
100% {
opacity:0;
transform:translate(0, -8px)
}
}
.u-arrow-right {
	z-index: 150;
	margin-top: -10px;
	right: 20px;
	transform: scaleX(-1);
	-webkit-transform: scaleX(-1)
}
.u-arrow-right img {
	left: 50%;
	margin: -7px 0 0 -14px;
	background-position: 0 -82px;
	-webkit-animation: rightflip 1.5s infinite ease-in-out;
	-moz-animation: rightflip 1.5s infinite ease-in-out;
	animation: rightflip 1.5s infinite ease-in-out
}
@-webkit-keyframes rightflip {
0%, 30% {
opacity:0;
-webkit-transform:translate(10, 0)
}
60% {
opacity:1;
-webkit-transform:translate(0, 0)
}
100% {
opacity:0;
-webkit-transform:translate(-8px, 0)
}
}
@-moz-keyframes rightflip {
0%, 30% {
opacity:0;
-moz-transform:translate(10, 0)
}
60% {
opacity:1;
-moz-transform:translate(0, 0)
}
100% {
opacity:0;
-moz-transform:translate(-8px, 0)
}
}
@keyframes rightflip {
0%, 30% {
opacity:0;
transform:translate(10, 0)
}
60% {
opacity:1;
transform:translate(0, 0)
}
100% {
opacity:0;
transform:translate(-8px, 0)
}
}
.pre-wrap {
	width: 24px;
	height: 14px;
	position: relative;
	-webkit-animation: start 1.5s infinite ease-in-out;
	-moz-animation: start 1.5s infinite ease-in-out;
	animation: start 1.5s infinite ease-in-out
}
.pre-box1, .pre-box2 {
	height: 15px;
	width: 11px;
	position: absolute;
	top: -5px;
	overflow: hidden
}
.pre-box2 {
	left: 10px
}
.pre1, .pre2 {
	width: 14px;
	height: 5px;
	position: absolute;
	box-shadow: 1px -1px 1px #646464;
	top: 5px;background:#fff;
}
.pre1 {
	transform: rotate(130deg);
	-webkit-transform: rotate(130deg);
	left: 1px
}
.pre2 {
	left: -4.5px;
	-webkit-transform: rotate(50deg);
	transform: rotate(50deg)
}
.u-arrow-bottom, .u-arrow-bottom img {
    position: absolute;
    width: 24px;
    height: 14px;
    left: 50%;
}