@font-face{
	font-family: AlibabaPuHuiTi;
	src: url('./font/AlibabaPuHuiTi-2-55-Regular.otf');
    font-weight: normal;
	font-display: swap;
}
@font-face{
	font-family: Prometo-Light;
	src: url('./font/Prometo-Light.otf');
    font-weight: normal;
	font-display: swap;
}
html{ -webkit-text-size-adjust:none;} 
html,body{width: 100%;height: 100%;overflow: hidden;position: fixed;top: 0;left: 0;background-color: #000f1f;}
body {font-family:AlibabaPuHuiTi, "PingFang SC","Microsoft YaHei", "微软雅黑", "STHeiti", "WenQuanYi Micro Hei", SimSun, sans-serif;}
*{margin:0; padding:0; border:0;box-sizing: border-box;background-position: center;background-size:cover;background-repeat: no-repeat;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;-o-user-select: none;user-select: none;outline:none;-webkit-tap-highlight-color: rgba(0,0,0,0);-webkit-tap-highlight-color: transparent;}
[v-cloak] {display: none;}
.nochinese{font-family: Prometo-Light;}
img{width: 100%;display: block;pointer-events: none;/* background-color: #f2f2f2; */}
audio{display: block;width: 1rem;height: 1rem;position: fixed;top: -2rem;left: 0;opacity: 0.01}
.re{position: relative;z-index: 1;}
.ab{position: absolute;z-index: 10;top: 0;left: 0;width: 100%;}
.wrapperbox{position: fixed;top: 0;left: 0;z-index: 10;width: 100%;height: 100%}
section{position: absolute;left: 0;top: 0;z-index: 10;width: 100%;height: 100%;overflow: hidden;display: none;}
section .pagewrap{position: relative;z-index: 10;width: 100%;height: 100%;overflow: hidden;}
.btn{pointer-events:auto}

.loadpage{display: block;z-index: 20;background-color: #000f1f;}
.loadpage .bg{position: absolute;z-index: 5;top: 0;left: 0;width: 100%;height: 100%;}
.loadpage .bg .bg1{position: absolute;left: 0;top: 0;width: 97.466vw;}
.loadpage .bg .bg2{position: absolute;right: 0;bottom: 0;width: 86.266vw;}
.loadpage .pagewrap{display: flex;align-items: center;justify-content: center;}
.loadpage .body{width: 100%;transition: transform 1s ease;}
.loadpage .img{width: 23.866vw;margin: 0 auto;}
.loadpage p{font-size: 4vw;line-height: 5.6vw;color: #fff;text-align: center;margin-top: 8vw;}
.loadpage.enter .body{transform: translate3d(0,-150%,0);}
.loadpage .btn{width: 20.8vw;position: absolute;bottom: 6.25%;left:0;right: 0;margin: 0 auto;z-index: 10;display: none;}
.loadpage .btn .ab{font-size: 3.2vw;line-height: 1.4;color: #fff;text-align: center;top: auto;bottom: 50%;transform: translateY(50%);}
.loadpage.enter .btn{display: block;}

.header{display: none;position: fixed;z-index: 100;top: 0;left: 0;width: 100%;}
.header .body{width: 100%;display: flex;align-items: center;justify-content: space-between;padding: 4.533vw 4vw;}
.header .logo{width: 10.8vw;}
.header .music{width: 8.4vw;}

.indexpage .bg{position: absolute;z-index: 5;top: 0;left: 0;width: 100%;height: 100%;}
.indexpage .top{position: absolute;left: 0;top: 0;width: 100vw;height: 64.75%;overflow: hidden;}
.indexpage .bot{position: absolute;left: 0;top: 64.75%;width: 100vw;bottom: 0;overflow: hidden;}
.indexpage .bg .bg1{position: absolute;z-index: 10;right: 0;top: 0;width: 64.266vw;}
.indexpage .bg .bg2{z-index: 1;background-image: url('../images/index-bg-top.jpg');background-size: 100% 100%;}
.indexpage .bg .bg3{z-index: 5;background-image: url('../images/index-bg-bot.jpg');background-size: 100% 100%;}
.indexpage .bg .bg4{position: absolute;z-index: 10;left:0;top: 64.75%;width: 300vw;margin-top: -19.733vw;}
.indexpage .top .img{width: 100%;position: absolute;z-index: 2;bottom: 0;left: 0;animation-timing-function:ease}
.indexpage .bot .img{width: 100%;position: absolute;z-index: 1;top: 0;left: 0;animation-timing-function:ease}
.indexpage .tit{width: 82.399vw;margin: 0 auto;margin-top: 34.933vw;}
.indexpage .desc{margin-top: 8vw;width: 100%;font-size: 3.733vw;line-height: 1.67;color: #bbdbf0;text-align: center;}
.indexpage .desc span{font-weight: bold;}
.indexpage .btn{width: 20.8vw;position: absolute;bottom: 6.25%;left:0;right: 0;margin: 0 auto;z-index: 10;}
.indexpage .btn .ab{font-size: 3.2vw;line-height: 1.4;color: #fff;text-align: center;top: auto;bottom: 50%;transform: translateY(50%);}

.quespage .bodybox{position: absolute;left: 0;top: 0;z-index: 1;width: 100%;height: 100%;overflow: hidden;}
.quespage .next{position: absolute;left: 0;bottom: 0;z-index: 10;width: 100%;height: 20vw;}
.quespage .next .bg{position: absolute;bottom: 0;}
.quespage .next .bg1{z-index: 1;left: 0;width: 76.133vw;animation: pulse 4s 0s linear infinite both;}
.quespage .next .bg2{z-index: 2;right: 0;width: 63.2vw;animation: upanddown 4s 0s linear infinite both;}
.quespage .next .bg3{z-index: 3;right: 0;width: 49.066vw;animation: leftandright 4s 0s linear infinite both;}
.quespage .next .btn{position: relative;z-index: 10;width: 30.266vw;margin: 0 auto;}
.quespage .next .btn.disabled{pointer-events: none;}
.quespage .next .btn.disabled .re{animation-play-state:paused;}
.quespage .next .btn .ab{font-size: 4.266vw;line-height: 1.4;color: #fff;text-align: center;top: auto;bottom: calc( 50% + env(safe-area-inset-bottom) / 3);bottom: calc( 50% + constant(safe-area-inset-bottom) / 3);transform: translateY(50%);}
.quespage .body{display: none;width: 100%;height: 100%;position: relative;z-index: 1;}
.quespage .body .bg{position: absolute;top: 0;left: 0;z-index: 1;width: 100%;height: 100%;}
.quespage .body .content{position: absolute;top: 0;left: 0;z-index: 10;width: 100%;padding: 0 8.533vw;}
.quespage .body .content .number{font-size: 4vw;line-height: 5.6vw;/* vertical-align: bottom; */}
.quespage .body .content .number span{font-size: 6vw;line-height: normal;}
.quespage .body .content h2{font-size: 8vw;margin-top: 1.333vw;}
.quespage .body .content p{font-size: 3.733vw;line-height: 6.4vw;margin-top: 2.133vw;}
.quespage .body .content .itembox{margin-top: 2vw;}
.quespage .body .content .item span{display: inline-block;width: 7.466vw;height: 7.466vw;line-height: 1.244;font-size: 6vw;background-image: url('../images/number-xiushi1.png');text-align: center;clip-path: polygon(100% 0, 0 0, 0 48%, 6% 56%, 12% 61%, 20% 65%, 29% 68%, 38% 71%, 49% 74%, 63% 77%, 92% 78%, 100% 71%);vertical-align: top;margin-right: 3.2vw;position: absolute;top: 0;left: 0;}
.quespage .body .content .item{padding: 1vw 0 1vw 10.666vw;font-size: 4vw;line-height: 5.466vw;margin-top: 2vw;position: relative;transition: opacity 0.25s ease;}
.quespage .body .content .item:first-child{margin-top: 0 !important;}
.quespage .body .content .checked .item{opacity: 0.5;}
.quespage .body .content .checked .item.checked{opacity: 1;}

.quespage .body1 .bg1{position: absolute;top: 0;left: 0;z-index: 1;width: 100%;height: 100%;background-image: url('../images/ques1-bg1.jpg');}
.quespage .body1 .bg2{position: absolute;top: 0;left: 0;z-index: 2;width: 100%;height: 100%;background-image: url('../images/ques1-bg2.png');}
.quespage .body1 .bg3{position: absolute;top: 10.133vw;right: 0;z-index: 3;width: 42.266vw;}
.quespage .body1 .content{color: #fff;top: 20%;}
.quespage .body1 .content .itembox{margin-top: 4.933vw;background-image: url('../images/ques1-img.png');background-size: auto 85%;background-position: 45% center;}
.quespage .body1 .content .item{margin-top: 4vw;}
.quespage .body1 .item:after{content: '';position: absolute;left: 34%;top: 0;bottom: 0;width: 8.799vw;height: 8.799vw;margin: auto 0;border-radius: 50%;}
.quespage .body1 .item:nth-child(1)::after{background-color: rgba(209,22,43,1);box-shadow: 0 0 2.666vw rgba(209,22,43,0.6);}
.quespage .body1 .item:nth-child(2)::after{left: 48%;background-color: rgba(132,90,155,1);box-shadow: 0 0 2.666vw rgba(132,90,155,0.6);}
.quespage .body1 .item:nth-child(3)::after{background-color: rgba(240,197,29,1);box-shadow: 0 0 2.666vw rgba(240,197,29,0.6);}
.quespage .body1 .item:nth-child(4)::after{left: 48%;background-color: rgba(74,166,77,1);box-shadow: 0 0 2.666vw rgba(74,166,77,0.6);}
.quespage .body1 .item:nth-child(5)::after{background-color: rgba(39,160,210,1);box-shadow: 0 0 2.666vw rgba(39,160,210,0.6);}


.quespage .body2 .bg1{position: absolute;top: 0;left: 0;z-index: 1;width: 100%;height: 100%;background-image: url('../images/ques2-bg1.jpg');}
.quespage .body2 .bg2{position: absolute;top: 0;left: 0;z-index: 2;width: 100%;height: 100%;}
.quespage .body2 .bg2 .img{width: 100%;height: 100%;background-image: url('../images/ques2-bg2.png');}
.quespage .body2 .yuan{transform-origin: 50% 40%;}
.quespage .body2 .content{color: #c15900;padding-top: 42.666vw;top: auto;bottom: 12.5%;}
.quespage .body2 .content .item span{background-image: url('../images/number-xiushi2.png');}


.quespage .body3 .bg1{position: absolute;top: 0;left: 0;z-index: 1;width: 100%;height: 100%;background-image: url('../images/ques3-bg1.jpg');}
.quespage .body3 .bg2{position: absolute;top: 0;left: 0;z-index: 2;width: 100%;height: 100%;}
.quespage .body3 .bg2 .img{width: 100%;height: 100%;background-image: url('../images/ques3-bg2.png');}
.quespage .body3 .bg3{position: absolute;top: 0;left: 0;z-index: 3;width: 100%;height: 100%;background-image: url('../images/ques3-bg3.png');}
.quespage .body3 .yuan{transform-origin: 50% 40%;}
.quespage .body3 .content{color: #f9e646;padding-top: 42.666vw;top: auto;bottom: 12.5%;}
.quespage .body3 .content .item span{background-image: url('../images/number-xiushi3.png');}

.quespage .body4 .bg1{position: absolute;top: 0;left: 0;z-index: 1;width: 100%;height: 100%;background-image: url('../images/ques4-bg1.jpg');}
.quespage .body4 .bg2{position: absolute;top: 0;left: 0;z-index: 2;width: 100%;height: 100%;background-image: url('../images/ques4-bg2.png');transform-origin: 50% 100%;}
.quespage .body4 .bg3{position: absolute;top: 0;left: 0;z-index: 3;width: 100%;height: 100%;}
.quespage .body4 .bg3 .img{width: 100%;height: 100%;background-image: url('../images/ques4-bg3.png');}
.quespage .body4 .content{color: #f4ebd7;top: 12.5%;}
.quespage .body4 .content .item span{background-image: url('../images/number-xiushi4.png');}

.quespage .body5 .bg1{position: absolute;top: 0;left: 0;z-index: 1;width: 100%;height: 100%;background-image: url('../images/ques5-bg1.jpg');}
.quespage .body5 .bg2{position: absolute;top: 0;left: 0;z-index: 2;width: 100%;height: 100%;background-image: url('../images/ques5-bg2.png');}
.quespage .body5 .bg3{position: absolute;top: 0;left: 0;z-index: 3;width: 100%;height: 100%;background-image: url('../images/ques5-bg3.png');}
.quespage .body5 .bg4{position: absolute;top: 7.5%;right: 7.466vw;z-index: 4;width: 41.199vw;height: 41.333vw;}
.quespage .body5 .bg4 .img{position: absolute;}
.quespage .body5 .bg5{position: absolute;bottom: 0;left: 0;z-index: 5;width: 100%;}
.quespage .body5 .content{color: #f4ebd7;top: 20%;}
.quespage .body5 .content .item span{background-image: url('../images/number-xiushi4.png');}


.quespage .body6 .bg1{position: absolute;top: 0;left: 0;z-index: 1;width: 100%;height: 100%;background-image: url('../images/ques6-bg1.jpg');background-position: center bottom;}
.quespage .body6 .bg2{position: absolute;top: 2%;left: 0;right: 0;z-index: 2;width: 57.599vw;height: 57.599vw;margin: 0 auto;}
.quespage .body6 .bg2 .re{width: 100%;height: 100%;background-image: url('../images/ques6-bg2.png');}
.quespage .body6 .bg2 .ab{height: 100%;background-image: url('../images/ques6-bg2-ab.png');}
.quespage .body6 .bg3{position: absolute;bottom: 17.333vw;left: 20.666vw;z-index: 3;width: 22.533vw;}
.quespage .body6 .bg4{position: absolute;bottom: 10vw;left: 20vw;z-index: 4;width: 17.733vw;}
.quespage .body6 .bg5{position: absolute;bottom: 10vw;right: 14.666vw;z-index: 5;width: 28.133vw;}
.quespage .body6 .bg6{position: absolute;bottom: 30.666vw;right: 2.666vw;z-index: 6;width: 28.799vw;}
.quespage .body6 .bg7{position: absolute;bottom: 0;left: 8.666vw;z-index: 7;width: 79.866vw;background-image: url('../images/ques6-bg7.png');}
.quespage .body6 .content{color: #3d0907;top: 25.625%;}
.quespage .body6 .content .item span{background-image: url('../images/number-xiushi6.png');}

.quespage .body1{display: block;}

.readingpage{z-index: 500;background-color: #000f1f;}
.readingpage .bg{position: absolute;z-index: 5;top: 0;left: 0;width: 100%;height: 100%;}
.readingpage .bg .bg1{position: absolute;left: 0;top: 0;width: 97.466vw;}
.readingpage .bg .bg2{position: absolute;right: 0;bottom: 0;width: 86.266vw;}
.readingpage .pagewrap{display: flex;align-items: center;justify-content: center;}
.readingpage .body{width: 100%;}
.readingpage .img{width: 23.866vw;margin: 0 auto;}
.readingpage p{font-size: 4.266vw;line-height: 8vw;color: #fff;text-align: center;margin-top: 8vw;}
.readingpage p::after {content:'';animation: dot 2s infinite linear both;}

.readypage .bg{position: absolute;z-index: 5;top: 0;left: 0;width: 100%;height: 100%;}
.readypage .bg .bg1{position: absolute;left: 0;top: 0;width: 100%;height: 100%;background-image: url('../images/poster-bg.jpg');}
.readypage .bg .bg2{position: absolute;left: 0;bottom: 0%;width: 100%;}
.readypage .text{margin-top: 13.75vh;width: 100%;text-align: center;color: #fff;}
.readypage .tip{font-size: 4.666vw;line-height: normal;}
.readypage h2{font-size: 24vw;line-height: 1.05;margin-top: 2.933vw;}
.readypage h3{font-size: 8.533vw;line-height: 1.05;margin-top: 2.133vw;}
.readypage .dotbox{display: flex;align-items: center;justify-content: center;margin-top: 3.2vw;}
.readypage .dot{width: 3.2vw;height: 3.2vw;border-radius: 1.6vw;border: 1px solid transparent;display: flex;align-items: center;justify-content: center;margin: 0 2px;}
.readypage .dot i{width: 1.6vw;height: 1.6vw;border-radius: 0.8vw;background-color: transparent;}
.readypage .dot:nth-child(1) i{background-color: #d0132b;}
.readypage .dot:nth-child(1).active{border-color: #d0132b;}
.readypage .dot:nth-child(2) i{background-color: #835b9b;}
.readypage .dot:nth-child(2).active{border-color: #835b9b;}
.readypage .dot:nth-child(3) i{background-color: #f0c41f;}
.readypage .dot:nth-child(3).active{border-color: #f0c41f;}
.readypage .dot:nth-child(4) i{background-color: #47a64c;}
.readypage .dot:nth-child(4).active{border-color: #47a64c;}
.readypage .dot:nth-child(5) i{background-color: #27a0d3;}
.readypage .dot:nth-child(5).active{border-color: #27a0d3;}
.readypage .instro{font-size: 5.333vw;line-height: normal;margin-top: 2.133vw;}
.readypage .btn{width: 20.8vw;position: absolute;bottom: 6.25%;left:0;right: 0;margin: 0 auto;z-index: 10;}
.readypage .btn .ab{font-size: 3.2vw;line-height: 1.4;color: #fff;text-align: center;top: auto;bottom: 50%;transform: translateY(50%);}
.readypage .btn.left{right: auto;left: 25%;}
.readypage .btn.right{left: auto;right: 25%;}

/* .posterpage{display: block;z-index: 50;} */
.posterpage{background-color: #000;z-index: 999;}
.posterpage .pagewrap{display: flex;align-items: center;justify-content: center;}
.posterpage .body{position: relative;z-index: 1;padding-bottom: 10.8vw;}
.posterpage .body img{position: relative;max-width: 95vw;max-height: calc(95vh - 10.8vw);width: auto;}
.posterpage .body .bot{position: absolute;bottom: 0;left: 0;z-index: 5;width: 100%;font-size: 3.733vw;line-height: 10.8vw;color: #fff;text-align: center;}
.posterpage .posterImg{position: absolute;top: 0;left: 0;width: 100%;height: 100%;opacity: 0;z-index: 20;pointer-events:auto;-webkit-user-select: all;-moz-user-select: all;-ms-user-select: all;-o-user-select: all;user-select: all;}


@media screen and (min-aspect-ratio: 375/770){
	.indexpage .top{height: 68%;}
	.indexpage .bot{top: 68%;}
	.indexpage .bg .bg4{top: 68%;}
}
@media screen and (min-aspect-ratio: 375/750){
	.indexpage .top{height: 68%;}
	.indexpage .bot{top: 68%;}
	.indexpage .bg .bg4{top: 65%;}
	.indexpage .tit{margin-top: 24vw;}
	.readypage .bg .bg2{bottom: -4vw;}
}
@media screen and (min-aspect-ratio: 375/690){
	.indexpage .tit{margin-top: 20vw;}
	.indexpage .top{height: 72%;}
	.indexpage .bot{top: 72%;}
	.indexpage .bg .bg4{top: 68%;}
	.indexpage .btn{bottom: 4%;}
	.quespage .body2 .content{bottom:24vw;}
	.quespage .body2 .bg2{top: -5%;}
	.quespage .body3 .content{bottom:24vw;}
	.readypage .bg .bg2{bottom: -4vw;}
	.readypage .btn{bottom: 4%;}
	.readypage h2{font-size: 20vw;}

}
@media screen and (min-aspect-ratio: 375/640){
	.indexpage .desc{margin-top: 5vw;}
	.readypage .text{margin-top: 15vw;}
	.readypage .bg .bg2{bottom: -6vw;}
}