.layout{overflow:hidden;position:relative;width:100vw;height:100vh}.headbar{position:absolute;top:0;width:100%;display:flex;align-items:center;justify-content:space-between;height:auto;padding:20px 0 0 20px;z-index:20}.logo{width:161px;height:69px;position:absolute;top:20px;left:20px;z-index:20}.links{position:absolute;top:20px;right:0px;z-index:20}.toindex{width:128px;height:26px;background-image:url(../images/downbtn.png);background-repeat:no-repeat;background-position:-103px top;background-size:cover}.download{width:103px;height:26px;background-image:url(../images/downbtn.png);background-repeat:no-repeat;background-position:left top;background-size:cover}.beforUnlock{width:100vw;height:100vh;position:relative;background-image:url(../images/beforBg.jpg);background-repeat:no-repeat;background-position:center;background-size:cover}.beforUnlock .cnt .main{position:relative}.beforUnlock .cnt .main .circleWrap{width:10.56rem;height:9.56rem;position:relative}.beforUnlock .cnt .main .circleWrap .circle{background-repeat:no-repeat;background-position:center;background-size:cover;position:absolute;top:0;bottom:0;right:0;left:0;margin:auto}.beforUnlock .cnt .main .circleWrap .outer-circle{width:10.56rem;height:9.56rem;background-image:url(../images/lock_circle1.png);background-size:10.56rem}.beforUnlock .cnt .main .circleWrap .mid-circle{width:9.6rem;height:9.18rem;background-image:url(../images/lock_circle2.png);background-size:9.6rem}.beforUnlock .cnt .main .circleWrap .inner-circle{width:5.46rem;height:5.8rem;background-image:url(../images/lock_circle3.png);background-size:5.46rem}.beforUnlock .cnt .main .plantWrap{position:absolute;padding-top:0.6rem;top:0;left:50%;transform:translateX(-50%);z-index:9}.beforUnlock .cnt .main .plantWrap .plantrole{width:5.46rem;height:5.8rem;background-image:url(../images/plantrole.png);background-repeat:no-repeat;background-position:center;background-size:cover}.beforUnlock .cnt .main .plantWrap .planIndex{font-size:13px;color:#25e8ff;height:25px;line-height:18px;text-wrap:nowrap;position:absolute;bottom:2.3rem}.beforUnlock .cnt .main .plantWrap .planIndex p{white-space:nowrap}.beforUnlock .cnt .main .plantWrap .planIndex span:not(:first-child){margin-left:13px}.beforUnlock .cnt .main .plantWrap .planIndex span.blingbl{font-size:16px}.beforUnlock .cnt .main .plantWrap .planSg{width:6.51rem;height:1.67rem;margin-top:-0.8rem;background-image:url(../images/planSg.png);background-repeat:no-repeat;background-position:center;background-size:cover;opacity:0}.beforUnlock .cnt .main .plantWrap .planBtn{width:2.30rem;height:.56rem;margin-top:5px;background-image:url(../images/planBtn.png);background-repeat:no-repeat;background-position:center;background-size:cover;opacity:0}.beforUnlock .lockcoverWrap{position:absolute;width:100%;height:100%;left:0;top:0;z-index:10}.beforUnlock .lockcover1,.beforUnlock .lockcover2{position:absolute;height:100%;width:50%;background-repeat:no-repeat;background-position:center;background-size:cover}.beforUnlock .lockcover1{background-image:url(../images/lockcover1.png);left:0;top:0}.beforUnlock .lockcover2{background-image:url(../images/lockcover2.png);right:0;top:0}.beforUnlock .authorization-rule{position:absolute;width:11.29rem;height:6.46rem;z-index:10;background-image:url(../images/authorizationbg.png);background-repeat:no-repeat;background-position:center;background-size:cover;left:0;right:0;bottom:0;top:0;margin:auto;-webkit-animation:0.3s linear tcpopwrap;animation:0.3s linear tcpopwrap}.beforUnlock .authorization-rule .preclose{position:absolute;width:37px;height:104px;background-image:url(../images/preclose.png);background-repeat:no-repeat;background-position:center;background-size:cover;right:-37px;top:35px}.beforUnlock .authorization-rule .premessage{color:#dfedf0;margin-top:0.45rem;margin-left:1rem;width:9.5rem;height:5rem;overflow-x:hidden;padding-right:10px}.beforUnlock .authorization-rule .premessage h3{font-size:.3rem}.beforUnlock .authorization-rule .premessage p{font-size:.17rem;line-height:24px;margin-top:24px}.beforUnlock .authorization-rule .premessage p span{color:#11ecff}.beforUnlock .authorization-rule .premessage::-webkit-scrollbar{width:8px;background-color:transparent}.beforUnlock .authorization-rule .premessage::-webkit-scrollbar-thumb{background-color:#17e8fd;border-radius:4px}.beforUnlock .authorization-rule .premessage::-webkit-scrollbar-track{border-radius:10px;background-color:transparent}.beforUnlock .authorization-rule .premessage{scrollbar-color:#17e8fd #17e8fd;scrollbar-width:thin}.beforUnlock .authorization-rule .authorizationbtn{width:2.30rem;height:.56rem;background-image:url(../images/authorizationbtn.png);background-repeat:no-repeat;background-position:center;background-size:cover;margin:0rem auto 0}.afterunlock{width:100vw;height:100vh;position:relative;background-image:url(../images/afterBg.jpg);background-repeat:no-repeat;background-position:center;background-size:cover}.afterunlock .main .trunk{width:16.87rem;height:10rem;position:relative;background-image:url(../images/trunk.png);background-repeat:no-repeat;background-position:center;background-size:cover}.afterunlock .main .trunk .part{position:absolute}.afterunlock .main .trunk .progressbtn{background-image:url(../images/progressbtn.png);height:0.73rem;width:2.34rem;position:absolute;background-size:2.81rem}.afterunlock .main .trunk .progressbtn p{color:#302f51;font-size:.24rem;text-align:center;padding-left:1.3rem;line-height:0.9rem;font-weight:bold;letter-spacing:-2px}.afterunlock .main .trunk .compsym{position:absolute}.afterunlock .main .trunk .progressbtn:hover .optionitem{display:flex}.afterunlock .main .trunk .optionitem{position:absolute;left:0.2rem;top:0.7rem;display:none}.afterunlock .main .trunk .optionitem .line{width:23px;height:23px;background-image:url(../images/optionitem.png);background-repeat:no-repeat;background-position:0 0}.afterunlock .main .trunk .optionitem .charge{width:89px;height:36px;background-image:url(../images/optionitem.png);background-repeat:no-repeat;background-position:-26px 0;margin-left:3px}.afterunlock .main .trunk .optionitem .check{width:89px;height:36px;background-image:url(../images/optionitem.png);background-repeat:no-repeat;background-position:-123px 0;margin-left:8px;position:relative}.afterunlock .main .trunk .optionitem .check:hover .construct{display:block}.afterunlock .main .trunk .optionitem .check .constructclose{width:27px;height:79px;background-image:url(../images/constructclose.png);background-repeat:no-repeat;position:absolute;top:0;left:3.96rem}.afterunlock .main .trunk .optionitem .check .construct{width:3.96rem;height:2.59rem;background-size:3.96rem;background-repeat:no-repeat;position:absolute;display:none}.afterunlock .main .trunk .optionitem .check .construct1{background-image:url(../images/construct-weapon.jpg)}.afterunlock .main .trunk .optionitem .check .construct2{background-image:url(../images/construct-twing.jpg);top:0;right:0}.afterunlock .main .trunk .optionitem .check .construct3{background-image:url(../images/construct-dwing.jpg);top:-2.5rem;right:0}.afterunlock .main .trunk .optionitem .check .construct4{background-image:url(../images/construct-body.jpg);top:-2.5rem;right:0}.afterunlock .main .trunk .optionitem .check .construct5{background-image:url(../images/construct-handbard.jpg);top:-2.5rem;right:0}.afterunlock .main .trunk .optionitem .check .construct6{background-image:url(../images/construct-legbard.jpg);top:-2.5rem;right:0}.afterunlock .main .trunk .weapon{z-index:4;width:6.59rem;height:2.5rem}.afterunlock .main .trunk .weapon .weapon-wrap{width:6.59rem;height:2.5rem;background-image:url(../images/weapon.png);background-repeat:no-repeat;background-position:center;background-size:cover}.afterunlock .main .trunk .weapon .progressbtn{top:1.2rem;left:3.4rem;background-position:0 0}.afterunlock .main .trunk .weapon .compsym-weap{width:2.27rem;height:0.24rem;background-image:url(../images/compsym-weap.png);background-repeat:no-repeat;background-position:center;background-size:cover;top:1.62rem;left:1.77rem}.afterunlock .main .trunk .top-wing{right:0;top:0;z-index:2;width:10.04rem;height:5.15rem}.afterunlock .main .trunk .top-wing .top-wing-wrap{width:10.04rem;height:5.15rem;background-image:url(../images/topwing.png);background-repeat:no-repeat;background-position:center;background-size:cover}.afterunlock .main .trunk .top-wing .progressbtn{top:1.8rem;right:0;background-position:0 -3.87rem}.afterunlock .main .trunk .top-wing .compsym-twing{width:1.73rem;height:0.25rem;background-image:url(../images/compsym-twing.png);background-repeat:no-repeat;background-position:center;background-size:cover;top:2.84rem;right:0rem}.afterunlock .main .trunk .btm-wing{left:0.55rem;top:2.26rem;z-index:1;width:14.73rem;height:6.20rem}.afterunlock .main .trunk .btm-wing .btm-wing-wrap{width:14.73rem;height:6.20rem;background-image:url(../images/btmwing.png);background-repeat:no-repeat;background-position:center;background-size:cover}.afterunlock .main .trunk .btm-wing .progressbtn{top:2rem;left:2.5rem;background-position:0 -.77rem}.afterunlock .main .trunk .btm-wing .compsym-bwing{width:2.27rem;height:0.24rem;background-image:url(../images/compsym-bwing.png);background-repeat:no-repeat;background-position:center;background-size:cover;top:3.4rem;left:2.8rem}.afterunlock .main .trunk .main-body{left:0rem;top:0rem;z-index:0}.afterunlock .main .trunk .main-body .main-body-wrap{width:16.81rem;height:10rem;background-image:url(../images/mainbody.png);background-repeat:no-repeat;background-position:center;background-size:cover}.afterunlock .main .trunk .compsym-body{width:2.10rem;height:1.43rem;background-image:url(../images/compsym-body.png);background-repeat:no-repeat;background-position:center;background-size:cover;top:5.6rem;left:8.5rem}.afterunlock .main .trunk .main-body-progressbtn{background-image:url(../images/progressbtn.png);height:0.73rem;width:2.34rem;position:absolute;background-size:2.81rem;top:5rem;right:6.8rem;z-index:6;background-position:0 -2.32rem}.afterunlock .main .trunk .hand-bard{left:6.17rem;top:1.33rem;z-index:2;width:7.75rem;height:5.49rem}.afterunlock .main .trunk .hand-bard .hand-bard-wrap{width:7.75rem;height:5.49rem;background-image:url(../images/handbard.png);background-repeat:no-repeat;background-position:center;background-size:cover}.afterunlock .main .trunk .hand-bard .progressbtn{top:4.2rem;right:-1.2rem;background-position:0 -3.09rem}.afterunlock .main .trunk .hand-bard .compsym-hand{width:2.90rem;height:0.25rem;background-image:url(../images/compsym-hand.png);background-repeat:no-repeat;background-position:center;background-size:cover;top:4.4rem;left:6.8rem}.afterunlock .main .trunk .leg-bard{z-index:2;left:3.48rem;top:5.24rem;width:5.45rem;height:4.74rem}.afterunlock .main .trunk .leg-bard .leg-bard-wrap{width:5.45rem;height:4.74rem;background-image:url(../images/legbard.png);background-repeat:no-repeat;background-position:center;background-size:cover}.afterunlock .main .trunk .leg-bard .progressbtn{top:2.5rem;left:3.2rem;background-position:0 -1.55rem}.afterunlock .main .trunk .leg-bard .compsym-leg{width:3.22rem;height:0.25rem;background-image:url(../images/compsym-leg.png);background-repeat:no-repeat;background-position:center;background-size:cover;top:3.25rem;left:3.2rem}.afterunlock .userwrap{position:absolute;left:0.6rem;bottom:0.42rem;z-index:5}.afterunlock .userwrap .user{font-size:0.16rem;color:#e2dff3;font-weight:600;position:relative}.afterunlock .userwrap .user_login_succeed{color:#e2dff3}.afterunlock .userwrap .user_login_succeed a{color:#e2dff3}.afterunlock .userwrap .allprogress{width:2.16rem;height:1.26rem;margin-top:18px;text-align:center;background-image:url(../images/allprogressbg.png);background-repeat:no-repeat;background-position:center;background-size:2.17rem;overflow:hidden;padding:0 10px}.afterunlock .userwrap .allprogress p{font-size:15px;color:#2cfff8;letter-spacing:6px;word-break:keep-all;margin-top:0.36rem}.afterunlock .userwrap .allprogress .text-infinite{margin-top:0.36rem;overflow:hidden;width:1.88rem;position:relative;float:left}.afterunlock .userwrap .allprogress .text-infinite .marqueewrap{width:1000px}.afterunlock .userwrap .allprogress .text-infinite span{display:block;float:left;font-size:15px;color:#2cfff8;word-break:keep-all;white-space:nowrap}.afterunlock .userwrap .allprogress .text-infinite .marquee1_1,.afterunlock .userwrap .allprogress .text-infinite .marquee1_2{padding-right:20px}.afterunlock .userwrap .allprogress h3{font-size:0.32rem;color:#2cfff8}.afterunlock .userwrap .openpopbtn span{display:block;width:2.10rem;height:0.49rem;margin-top:12px;background-image:url(../images/openpopbtn.png);background-repeat:no-repeat;background-size:2.16rem}.afterunlock .userwrap .openpopbtn .getbtn{background-position:-0.05rem -0.03rem}.afterunlock .userwrap .openpopbtn .codebtn{background-position:-0.05rem -0.64rem}.afterunlock .sloganwrap{width:5.91rem;height:1.8rem;position:absolute;background-image:url(../images/slogan.png);background-repeat:no-repeat;background-size:5.91rem;bottom:0.5rem;right:0.12rem}.afterunlock .rulesBtn{width:31px;height:140px;background-image:url(../images/oprule.png);background-repeat:no-repeat;position:fixed;right:16px;bottom:50%;transform:translateY(-20%);-webkit-transform:translateY(-20%)}.section{position:relative}.section2{height:auto !important}.section2 .fp-tableCell{height:auto !important}.ttbar h3{font-size:0.24rem;color:#dfedf0;float:left}.ttbar p{font-size:0.16rem;color:#17e8fd;float:left;line-height:0.36rem;margin-left:0.36rem}.codingPop .pop-wrap{width:11.29rem;height:6.46rem;background-image:url(../images/rulsebg.png);background-repeat:no-repeat;background-position:center;background-size:11.29rem;padding-top:0.38rem;padding-left:1rem;padding-right:0.24rem;color:#17e8fd;-webkit-animation:0.3s linear tcpopwrap;animation:0.3s linear tcpopwrap}.codingPop .pop-wrap .close-pop{position:absolute;width:0.37rem;height:1.04rem;background-size:0.37rem;right:-0.37rem;top:0.28rem;background-image:url(../images/preclose.png);background-repeat:no-repeat;background-position:center}.codingPop .pop-wrap .codingwrap{margin:0.3rem auto 0}.codingPop .pop-wrap .codingwrap .item{width:7.08rem;height:0.58rem;background-image:url(../images/codingbg.png);background-repeat:no-repeat;background-position:center;background-size:7.08rem;margin-top:0.12rem;margin-left:1.28rem;padding-left:0.27rem}.codingPop .pop-wrap .codingwrap .item p{color:#dfedf0;font-size:0.18rem}.codingPop .pop-wrap .codingwrap .item .codingbtn{width:1.43rem;height:0.5rem;background-image:url(../images/codingbtn.png);background-repeat:no-repeat;background-position:center;background-size:1.43rem}.codingPop .pop-wrap .codingwrap .tips{margin-top:0.56rem;color:#17e8fd;font-size:0.12rem;text-align:left;margin-left:1.09rem}.rulesPop .pop-wrap{width:11.29rem;height:6.46rem;background-image:url(../images/rulsebg.png);background-repeat:no-repeat;background-position:center;background-size:11.29rem;padding-top:0.38rem;padding-left:1rem;padding-right:0.24rem;color:#17e8fd;-webkit-animation:0.3s linear tcpopwrap;animation:0.3s linear tcpopwrap}.rulesPop .pop-wrap .close-pop{position:absolute;width:0.37rem;height:1.04rem;background-size:0.37rem;right:-0.37rem;top:0.28rem;background-image:url(../images/preclose.png);background-repeat:no-repeat;background-position:center}.rulesPop .pop-wrap .ruleswrap{height:4.56rem;padding-right:0.45rem;overflow-x:hidden;margin-top:0.28rem}.rulesPop .pop-wrap .ruleswrap .item:not(:first-child) h3{margin-top:0.28rem}.rulesPop .pop-wrap .ruleswrap h3{color:#17e8fd;font-size:0.17rem}.rulesPop .pop-wrap .ruleswrap h3 i{display:inline-block;width:16px;height:17px;background-image:url(../images/doted.png);background-repeat:no-repeat;background-position:center;vertical-align:middle;margin-left:4px}.rulesPop .pop-wrap .ruleswrap h3 span{display:inline-block;vertical-align:middle;margin-left:9px}.rulesPop .pop-wrap .ruleswrap p{margin-top:0.08rem;color:#17e8fd;font-size:0.17rem;line-height:0.31rem;padding-left:27px}.awardPop .pop-wrap{width:11.29rem;height:6.46rem;background-image:url(../images/awardPopbg.png);background-repeat:no-repeat;background-position:center;background-size:11.29rem;padding-top:0.38rem;padding-left:1rem;padding-right:0.3rem;color:#feecc4;text-align:center;-webkit-animation:0.3s linear tcpopwrap;animation:0.3s linear tcpopwrap}.awardPop .pop-wrap .close-pop{position:absolute;width:0.37rem;height:1.04rem;background-size:0.37rem;right:-0.37rem;top:0.28rem;background-image:url(../images/preclose.png);background-repeat:no-repeat;background-position:center}.awardPop .pop-wrap .unlockaward{margin-top:0.3rem}.awardPop .pop-wrap .part-name{color:#dfedf0;font-size:0.17rem;text-align:center}.awardPop .pop-wrap .box{width:1.49rem;height:1.65rem;background-image:url(../images/giftbg.png);background-repeat:no-repeat;background-position:left top;background-size:1.49rem;position:relative;padding-top:0.07rem;margin-top:0.07rem}.awardPop .pop-wrap .box p{text-align:center;font-size:0.17rem;line-height:1em;color:#dfedf0}.awardPop .pop-wrap .box .giftbox{width:0.8rem;height:0.81rem;background-image:url(../images/giftbox.png);background-repeat:no-repeat;background-position:center;background-size:0.8rem;margin-top:0.12rem;position:relative}.awardPop .pop-wrap .box .giftbox .dtl{width:2.29rem;height:1.16rem;color:#dfedf0;font-size:0.16rem;padding-top:0.08rem;padding-left:0.22rem;background-image:url(../images/dtlhover.png);background-repeat:no-repeat;background-position:center;background-size:2.29rem;position:absolute;z-index:3;left:0.8rem;top:0.18rem;display:none}.awardPop .pop-wrap .box .giftbox .dtl p{text-align:left;line-height:0.31rem}.awardPop .pop-wrap .box .giftbox:hover .dtl{display:block}.awardPop .pop-wrap .box .giftaction{margin-top:0.12rem}.awardPop .pop-wrap .box .giftget{width:1.07rem;height:0.38rem;background-image:url(../images/giftget.png);background-repeat:no-repeat;background-position:center;background-size:1.07rem}.awardPop .pop-wrap .box .giftlock{width:1.07rem;height:0.38rem;background-image:url(../images/giftlock.png);background-repeat:no-repeat;background-position:center;background-size:1.07rem}.awardPop .pop-wrap .box .giftgot{width:1.47rem;height:0.85rem;background-image:url(../images/giftgot.png);background-repeat:no-repeat;background-position:center;background-size:1.47rem;position:absolute;bottom:0.22rem;z-index:2}.awardPop .pop-wrap .allunlock{margin-top:0.78rem}.awardPop .pop-wrap .allunlock .chitem{width:7.09rem;height:1.46rem;margin-top:0.3rem;margin-left:1.4rem;background-image:url(../images/allunlock.png);background-repeat:no-repeat;background-position:center;background-size:11.29rem}.awardPop .pop-wrap .allunlock .chitem .lt li{margin-left:0.3rem}.awardPop .pop-wrap .allunlock .chitem .lt li .show{width:0.52rem;height:0.52rem;background-color:#b0dcf9;border:1px solid #14ecff;margin:0 auto}.awardPop .pop-wrap .allunlock .chitem .lt li .show img{display:block;width:100%;height:100%;object-fit:cover}.awardPop .pop-wrap .allunlock .chitem .lt li p{color:#dfedf0;font-size:0.16rem;line-height:0.18rem;margin-top:0.07rem;word-break:keep-all;white-space:nowrap}.awardPop .pop-wrap .allunlock .chitem .rt{margin-left:0.4rem;width:2.6rem}.awardPop .pop-wrap .allunlock .chitem .rt p{color:#af92ff;text-align:left;line-height:0.21rem;font-size:0.14rem}.sucesstoast{width:2.29rem;height:1.16rem;font-size:0.18rem;line-height:1.16rem;text-align:center;background-image:url(../images/dtlhover.png);background-repeat:no-repeat;background-position:center;background-size:2.29rem;position:fixed;color:#13ecfd;top:50%;left:50%;transform:translate(-50%, -50%);-webkit-transform:translate(-50%, -50%);z-index:999;display:none}.geartoast{font-size:0.18rem;position:fixed;z-index:100;left:0;right:0;top:0;bottom:0;background:rgba(0,0,0,0.6);z-index:999;display:none}.geartoast .geartoastwrap{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);-webkit-transform:translate(-50%, -50%)}.geartoast .gearwrap{width:0.85rem;height:0.6rem;position:relative}.geartoast .gearwrap span{display:inline-block;position:absolute}.geartoast .gearwrap .gear1{width:0.6rem;height:0.6rem;background-image:url(../images/gear1.png);background-repeat:no-repeat;background-position:center;background-size:0.6rem;z-index:1}.geartoast .gearwrap .gear2{width:0.39rem;height:0.38rem;background-image:url(../images/gear2.png);background-repeat:no-repeat;background-position:center;background-size:0.39rem;right:0;top:0.1rem}.geartoast .percent{font-size:0.2rem;color:#dfedf0;text-align:center}.oscroll::-webkit-scrollbar{width:8px;background-color:transparent}.oscroll::-webkit-scrollbar-thumb{background-color:#17e8fd;border-radius:4px}.oscroll::-webkit-scrollbar-track{border-radius:10px;background-color:transparent}.oscroll{scrollbar-color:#17e8fd #17e8fd;scrollbar-width:thin}.vertical-dialog{background:#333;color:#fff;transition:unset;position:fixed;left:0;top:0;bottom:0;right:0;overflow:hidden;z-index:1000;display:none}.vertical-dialog .content{width:85%;text-align:center;font-size:40px;position:absolute;top:25%;left:50%;transform:translate(-50%, -50%);animation:fadeDown 0.4s ease-out}.vertical-dialog .content .hint_v_c{width:512px;height:512px;margin:0 auto;background:url(../images/dialog_v_c.png) center/contain no-repeat}.vertical-dialog .detail{position:fixed;top:0;bottom:0;left:0;right:0}@media screen and (orientation: portrait){.vertical-dialog{display:block !important;height:100vh;padding-top:15vh}}
