.mask{position:fixed;top:0;left:50%;transform:translate(-50%);background:rgba(0,0,0,.85);width:100%;height:100%;z-index:1000;overflow:hidden;max-width:31.25rem}.mask .rulesBox{text-align:center;position:relative;max-width:31.25rem}.mask .rulesBox .rules{width:100%;height:100%}.mask .rulesBox .close{text-align:center;width:7.875rem;height:7.875rem;background-position:center;background-repeat:no-repeat;background-size:cover;margin:-6rem auto 0;z-index:10;position:relative}.mask .rulesBox .link{position:absolute;bottom:33.5%;right:16%;width:40%;height:4%}.home{width:100%;height:100%;max-width:31.25rem;overflow-y:hidden;margin:0 auto;display:flex;justify-content:flex-start;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;-o-user-select:none;user-select:none}.home .playBtn{position:absolute;right:1.6875rem;top:3.4375rem;width:2.625rem;height:2.3125rem;z-index:10000}.home .startBox{width:100vw;max-width:31.25rem;height:100%;align-items:center;display:flex;flex-direction:column;text-align:center;background-position:center;background-repeat:no-repeat;background-size:cover;z-index:100;position:relative;overflow-y:hidden}.home .startBox.fadeOut{opacity:0;transition:all 1s;z-index:-100}.home .startBox .logo{width:15.625rem;margin:1rem auto 0}.home .startBox .age{position:absolute;right:1.6875rem;top:7.125rem;width:2.1875rem}.home .startBox .start{position:absolute;bottom:7.375rem;left:0;width:100%}.home .startBox .tips{position:absolute;bottom:6.25rem;left:0;color:#ffefd1;width:100%}.home .startBox .starlinear{width:8rem;position:absolute;bottom:1.6875rem;left:50%;transform:translate(-50%)}.home .beginText{max-width:31.25rem;width:100vw;height:100%;display:flex;align-items:center;flex-direction:column;justify-content:center;background-position:0 0;background-position:center;background-repeat:no-repeat;background-size:cover;z-index:50;position:absolute;opacity:1}.home .beginText.fadeOut{opacity:0;transition:all 1s;z-index:-50}.home .beginText .textList{font-size:.875rem;width:80%;text-align:center;color:#ffefd1;font-weight:200;margin-bottom:0;opacity:0}.home .beginText .textList.fadein{margin-bottom:8.75rem;opacity:1;transition:all 2s}.home .beginText .textList .textItem{line-height:1.6}.home .beginText .textList .mt{margin-top:1.25rem}.home .beginText .step2{width:21.9375rem;height:4.3125rem;text-align:center;background-position:center;background-repeat:no-repeat;background-size:cover;line-height:4.0625rem;font-size:.75rem;color:#ffefd1;font-weight:400;position:absolute;bottom:20%;opacity:0}.home .beginText .step2.fadein{opacity:1;transition:all 4s}.home .startText{width:100%;height:100%;max-width:31.25rem;display:flex;align-items:center;flex-direction:column;justify-content:center;background-position:0 0;background-position:center;background-repeat:no-repeat;background-size:cover;z-index:50;opacity:1;position:absolute}.home .startText.fadeOut{opacity:0;transition:all 1s;z-index:-50}.home .startText .textList{font-size:.875rem;text-align:center;color:#ffefd1;font-weight:200;margin-bottom:0;opacity:0}.home .startText .textList.fadein{margin-bottom:8.75rem;opacity:1;transition:all 2s}.home .startText .textList .textItem{line-height:1.6}.home .startText .step2{width:21.9375rem;height:4.3125rem;text-align:center;background-position:center;background-repeat:no-repeat;background-size:cover;margin:11.25rem auto 0;line-height:4.0625rem;font-size:.75rem;color:#ffefd1;font-weight:400;position:absolute;bottom:20%;opacity:0}.home .startText .step2.fadein{opacity:1;transition:all 4s}.home .qa{width:100%;max-width:31.25rem;height:100%;align-items:center;display:flex;flex-direction:column;justify-content:center;background-position:center;background-repeat:no-repeat;background-size:cover;padding:0 3.3125rem;box-sizing:border-box;position:absolute;opacity:1;z-index:10}.home .qa.fadeOut{opacity:0;transition:all 1s;z-index:-1}.home .qa .req{font-size:.9375rem;text-align:center;color:#ffefd1;font-weight:200;margin-top:46%;padding:.3125rem 2.5rem;background-position:center;background-repeat:no-repeat;background-size:100% 100%;margin-bottom:.9375rem;opacity:1;transition:all 1.5s}.home .qa .req.active{opacity:0;transition:all 1.5s}.home .qa .reqBtn{width:13.0625rem;height:4.3125rem;text-align:center;background-position:center;background-repeat:no-repeat;background-size:cover;line-height:4.0625rem;font-size:.75rem;color:#ffefd1;margin-bottom:-.9375rem;position:relative}.home .qa .reqBtn:after{position:absolute;top:0;left:50%;transform:translate(-50%);width:0;height:4.3125rem;display:block;background:url(/assets/btn_hignlight-b9367ab4.png) center no-repeat;background-size:auto 100%;content:""}.home .qa .reqBtn.active{color:#494949;transition:all .6s}.home .qa .reqBtn.active p{z-index:2;position:relative}.home .qa .reqBtn.active:after{width:13.0625rem}.home .resultBox{width:100%;max-width:31.25rem;min-height:100vh;align-items:center;display:flex;flex-direction:column;justify-content:flex-end;background-position:center;background-repeat:no-repeat;background-size:cover;opacity:0;position:absolute;z-index:-1}.home .resultBox.active{max-height:250vw;opacity:1;z-index:1}.home .resultBox .figure{width:100%;height:100%}.home .resultBox .shareBtn{width:13.0625rem;height:4.375rem;background-position:center;background-repeat:no-repeat;background-size:cover;position:relative;z-index:1001;position:absolute;left:50%;bottom:13%;transform:translate(-50%)}.home .resultBox .saveTips{position:absolute;left:50%;transform:translate(-50%);bottom:12%;color:#ffeed1;font-size:.75rem}.home .resultBox .pic_bottom{position:absolute;bottom:0;left:0;width:100%;height:13.5%;background-position:center;background-repeat:no-repeat;background-size:100% 100%}.home .resultBox .pic_bottom .toDream{position:absolute;bottom:6.5vh;right:7%;width:41%;z-index:1001;height:2vh}.home .canvasImg{max-width:31.25rem;width:100%;align-items:center;display:flex;flex-direction:column;justify-content:flex-end;background-position:center;background-repeat:no-repeat;background-size:cover;position:absolute;top:0;left:0;opacity:0}.home .canvasImg.active{z-index:1000}body{background:#000;overflow-x:hidden;scrollbar-width:none}body::-webkit-scrollbar{width:0!important}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{padding:0;margin:0;font:inherit;font-size:100%;vertical-align:baseline;border:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{padding:0;margin:0}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:"";content:none}table{border-spacing:0;border-collapse:collapse}html,body,#root{width:100%;height:100%}