@font-face {
  font-family: 'MaterialIcons';
  src:  url('../fonts/MaterialIcons-Regular.otf');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}
@font-face {
  font-family: 'HarmonyOS';
  src:  url('../fonts/HarmonyOS_Sans_SC_Bold.ttf');
  font-weight: 600;
  font-style: normal;
  font-display: block;
}
@font-face {
  font-family: 'HarmonyOS';
  src:  url('../fonts/HarmonyOS_Sans_SC_Medium.ttf');
  font-weight: 500;
  font-style: normal;
  font-display: block;
}
@font-face {
  font-family: 'HarmonyOS';
  src:  url('../fonts/HarmonyOS_Sans_SC_Regular.ttf');
  font-weight: 400;
  font-style: normal;
  font-display: block;
}
@font-face {
  font-family: 'Roboto-Thin';
  src:  url('../fonts/Roboto-Thin.ttf');
  font-weight: 400;
  font-display: block;
}
*{margin:0px; padding:0px;font-family:"HarmonyOS";}
html{margin:0px; padding:0px; letter-spacing: 0.01rem;}
li{list-style:none;}
div{font-size: 0;}
.index{ background: url(../images/assets_png_onboarding_mainstory_gradient.png) top center no-repeat; background-size: 100% 100%; height: 100%; background-color: #000000; }
.logo{max-width: 750px; width: 100%;  text-align: left; font-family:"HarmonyOS"; font-size: 0.35rem; color: #ffffff; margin: 0px auto; line-height: 0.5rem; }
.logo img{height: 0.5rem; float: left; margin-right: 0.2rem; margin-left: 10%;}
.banner{max-width: 750px; width: 100%; margin: 0px auto; margin-top: 0.3rem;}
.banner h3{font-size: 0.58rem; font-weight: 600; width: 80%; margin-left: 10%;color: #FFF; line-height: 0.63rem;}
.banner p{width: 80%; margin-left: 10%; font-size: 0.3rem;color: rgba(255, 255, 255, 0.6); margin-top: 0.2rem;}
.banner img{width: 70%; margin-left: 15%; margin-top: 0.8rem;}
.createwallet{ background: url(../images/assets_png_ledger_backgroundpurple.png) top center no-repeat; background-size: 100% 100%; height: 100%; background-color: #1f2136; }
.tit{max-width: 750px; width: 100%;  text-align: center; font-family:"Roboto-Thin"; font-size: 0.5rem; color: #ffffff; margin: 0px auto; }


@keyframes floating {
  0% {
    transform: translateY(0); /* 初始位置 */
  }
  50% {
    transform: translateY(-10px); /* 向上移动4像素 */
  }
  100% {
    transform: translateY(0); /* 回到初始位置 */
  }
}
.btnbox{max-width: 750px; width: 100%; margin: 0px auto; text-align: center; font-size:0.3rem; margin-top: 1rem; }
.btnbox .ibtn{width: 80%; display: inline-block; height: 1rem; line-height: 1rem;  background: url(../images/tb2.png) 0.5rem center no-repeat; background-size:auto 35%;  background-color: #2d2c31; border: none; border-radius: 0.2rem; color: #a0c9fd; font-size: 0.26rem; margin-top: 0.3rem; text-align: left; text-indent: 1.15rem;opacity: 0.9;}
.btnbox .cur{background: url(../images/tb1.png) 0.5rem center no-repeat; background-size:auto 35%;background-color: #6a66fe; color: #ffffff;}
.btnbox .lk{background: url(../images/tb3.png) 0.5rem center no-repeat; background-size:auto 35%;background-color: #2d2c31; }
.tkbox{text-align: center; font-size: 0.25rem; color:rgba(255, 255, 255, 0.7); ; margin-top: 0.5rem;}
.tkbox p{color: rgba(255, 255, 255, 0.9); margin-left: 0.2rem;}


.toper{position: fixed; width: 100%; height: 1rem; left: 0; top: 0;}
.toper .tp{max-width: 750px; width: 100%; height: 1rem; line-height: 1rem; margin: 0px auto; position: relative; text-align: center; font-size: 0.3rem; color: #FFF;}
.toper .tp a{display:block; position:absolute; height:0.36rem; width:0.36rem; background:url(../images/0o.png) center center no-repeat; background-size:auto 90%; left:0.28rem; top:0.3rem;}
.toper .tp span{display:block; position:absolute; height:0.4rem; width:0.4rem; background:url(../images/history.png) center center no-repeat; background-size:auto 90%; right:0.28rem; top:0.3rem;}
.mainbox{width:90%; margin:0px auto; margin-top:0.45rem;max-width: 750px;}
.mainbox .titbox{font-weight:600; font-size:0.42rem; line-height:0.5rem; color: #ffffff; text-align: center;}
.mainbox .pwdbox{width: 100%; margin-top: 1rem;}
.mainbox .pwdbox ul{ text-align: center;}
.mainbox .pwdbox ul li{display:inline-block; width:0.7rem; height:0.7rem; background-color:#424149; box-sizing:border-box; border-radius:0.15rem; font-size: 0; margin: 0px 0.05rem;}
.mainbox .pwdbox ul li span{display: block; width: 0.2rem; height: 0.2rem; border-radius: 50%; background-color:#424149; float: left; margin-left: 0.22rem; margin-top: 0.23rem;font-size: 0;}
.mainbox .pwdbox ul li.cur span{background-color:#584cea;}
.jianpanbox{ width:94%; height:4rem; position:fixed; left:3%; bottom:1rem; z-index:1}
.jianpanbox ul{}
.jianpanbox ul li{ width:32%; margin-right: 2%; display:block; float:left; text-align:center; font-weight:500; font-size:0.42rem; height:0.9rem; line-height:0.9rem; color: #FFF; background-color: #28272d; margin-top: 0.1rem;}
.jianpanbox ul li:nth-child(3n){float: right; margin-right: 0px;}
.jianpanbox ul li.del{background:url(../images/delicon.png) center center no-repeat; background-size:auto 45%;}
.mainbox .bktit{text-align: center; font-size: 0.28rem; color: rgba(255, 255, 255, 0.8);}

.bkbox{ width: 100%; margin: 0px auto;text-align: center;  background-color: #2a2b2d; border-radius: 0.2rem; margin-top: 0.8rem;}
.bkbox h3{font-size: 0.36rem; color:rgba(255, 255, 255, 1); margin-top: 0.4rem;}
.bkbox p{font-size: 0.26rem; font-weight: normal; color:rgba(255, 255, 255, 0.6); margin-top: 0.1rem;}
.bkbox ul{width:100%; padding-bottom: 0.3rem;}
.bkbox ul li{width: 29%; float:left;height: 0.7rem; line-height: 0.7rem; color: #000000; font-size: 0.24rem; text-align: left; background-color: #FFF; margin-left: 3.2%; position: relative; margin-top: 0.3rem;font-weight: bold; text-indent: 0.5rem;border-radius: 0.1rem;}
.bkbox ul li span{position: absolute; color:rgba(0, 0, 0, 0.7); font-size: 0.22rem; left: -0.35rem;top: 0; z-index: 999;  }

.bxx1{width: 100%; margin-top: 0.5rem;color: rgba(255, 255, 255, 0.9);}
.bxx1 h3{font-size: 0.26rem; background: url(../images/mexc_common_selected.png) left center no-repeat; background-size: auto 60%;  padding-left: 0.4rem; font-weight: normal;}
.bxx1 p{font-size: 0.26rem; line-height: 0.3rem; margin-top: 0.08rem; }

.bxx2{width: 100%; margin-top: 0.5rem;color: rgba(255, 255, 255, 0.9);}
.bxx2 h3{font-size: 0.26rem; background: url(../images/token_datial_fail.png) left center no-repeat; background-size: auto 80%;  padding-left: 0.4rem; font-weight: normal;}
.bxx2 p{font-size: 0.26rem; line-height: 0.3rem; margin-top: 0.08rem; }
.bxx2 p::before{content:"•";margin-right: 0.1rem;}
.bxx2 h4{font-size: 0.26rem;padding-left: 0.2rem; font-weight: normal; color: #7665f5; margin-top: 0.5rem;}

.vrbox{ width: 100%; margin: 0px auto;text-align: center;  background-color: #2a2b2d; border-radius: 0.2rem; margin-top: 0.8rem;}
.vrbox ul{width:100%; padding-bottom: 0.3rem;}
.vrbox ul li{width: 29%; float:left;height: 0.7rem; line-height: 0.7rem; color: #000000; font-size: 0.24rem; text-align: left;  margin-left: 3.2%; position: relative; 
  margin-top: 0.3rem;font-weight: bold; text-indent: 0.5rem;border-radius: 0.1rem; box-sizing: border-box; border:rgba(255, 255, 255, 0.3) solid 1px ; }
.vrbox ul li.cur{background-color: #FFF;}
.vrbox ul li span{position: absolute; color:rgba(255, 255, 255, 0.7); font-size: 0.22rem; left: -0.35rem;top: 0; z-index: 999;  }
.vrbox ul li i{font-style: normal;}
.vrbox ul li.cur span{ color:rgba(0, 0, 0, 0.7);  }
.vrbox ul li em{position: absolute;z-index: 9999; right: -1px; top:-0.14rem; display: none;}
.vrbox ul li em img{width: 0.3rem;}
.vrbox ul li.cur em{display: block;}
.clrbox{width: 100%; margin-top: 0.3rem; height: 0.5rem;}
.clrbox .clrbtn{width: 0.8rem; height: 0.5rem; float:right; line-height: 0.5rem; border:#7665f5 solid 1px ; background-color: transparent; font-size: 0.24rem; text-align: center; color:#7665f5 ; border-radius: 0.1rem;display: none;}
.wkbox{ width: 100%; margin: 0px auto;margin-top: 0.4rem;}
.wkbox ul{}
.wkbox ul li{float:left;height: 0.6rem; line-height: 0.6rem; color: #000000; font-size: 0.24rem; text-align: left; background-color: #FFF; margin-top: 0.2rem;margin-right: 0.2rem; font-weight: bold; border-radius: 0.1rem; padding: 0px 0.2rem;}



.updatabox{position: fixed; z-index: 99999; background-color: rgba(255, 255, 255, 0.2); width: 100%; height: 100%; left: 0; top: 0; display: none;} 
.updatabox .upbox{background-color: #2e2f4d; box-sizing: border-box; width: 5rem; height: 5.3rem; padding: 0.5rem; text-align: center; position: absolute; left: 50%;; top: 50%; margin-left: -2.5rem;  margin-top: -2.6rem; border-radius: 0.3rem;}
.updatabox .upbox img{width: 1.2rem;}
.updatabox .upbox p{color: #FFF; font-size: 0.28rem; margin-top: 0.4rem;}
.updatabox .upbox a{display: block; width: 2.2rem; height: 0.7rem; line-height: 0.7rem;  text-align: center; background-color: #7818fe; border: none; border-radius: 0.5rem; color: #FFF; font-size: 0.26rem; margin: 0px auto; margin-top: 0.3rem; text-decoration: none;}



.imtit{font-size: 0.4rem; color: #FFF;}
.imbox{width: 100%; margin-top: 0.5rem; height: 4rem;}
.imbox p{font-size: 0.25rem; color: rgba(255, 255, 255, 0.8);}
.imbox ul li{float: left; height: 0.7rem; line-height: 0.7rem; background-color: #2c2b31; color: rgba(255, 255, 255, 0.8); box-sizing: border-box; padding:0px 0.2rem; border-radius: 0.1rem;font-size: 0.26rem; position: relative; }
.imbox ul li span{font-size: 0.26rem; left: 0.2rem; top: 0;position: absolute; z-index: 999; }
.imbox ul li p{background-color: transparent; width: 100%; height: 0.7rem; line-height: 0.7rem; border: none; outline: none;background-color: transparent; padding-left: 0.4rem;}
.imbox ul li input{height: 0.7rem; line-height: 0.7rem; outline: none; margin-left: 0.2rem; font-size: 0.26rem; border: none; width: 1rem; }
.imbox  .txtword{width:100%; box-sizing:border-box; font-size: 0.28rem; color: rgba(255, 255, 255, 0.9); height:2.5rem; border:rgba(255, 255, 255, 0.6) solid 1px; border-radius:0.2rem;outline:none; padding:0.2rem; margin-top:0.4rem; line-height:0.34rem; background-color:transparent;}
.ftbox{width: 100%; text-align: center; position: fixed; bottom: 0.8rem;}
.ftbox .ibtn{width: 90%; background-color: #584cea;height: 0.9rem; line-height: 0.9rem; border: none; border-radius: 0.2rem; color: #FFF; font-size: 0.26rem; }
.ftbox .ibtn:disabled{background-color: rgba(255, 255, 255, 0.5);}











.toper .cbox{height: 1rem; line-height: 1rem;color:rgba(255, 255, 255, 0.5); font-size: 0.26rem; font-weight:normal; position: relative; width: 88%; margin: 0px auto; text-align: center;}
.toper .cbox a{position: absolute; left: 0; top:0.05rem}
.toper .cbox a img{width: 0.4rem;}
.lsbox{max-width: 750px; width: 100%;font-size: 0; text-align: center;margin: 0px auto; }
.lsbox .lbox{width: 88%; margin: 0px auto; background-color: #313553; padding: 0.2rem 0px; border-radius: 0.2rem; margin-top: 0.2rem;}
.lsbox .lbox img{width: 1.8rem;}
.lsbox .lbox h4{ color: #FFF; font-size: 0.35rem; font-weight: normal; line-height: 0.5rem; margin-top: 0.2rem;}
.lsbox .lbox p{ color:rgba(255, 255, 255, 0.5); font-size: 0.28rem; font-weight: normal; line-height: 0.5rem;margin-top: 0.1rem;}


.hftit{max-width: 750px; width: 100%;margin: 0px auto; text-align: center;}
.hftit h4{font-size: 0.28rem; font-weight: normal; color:rgba(255, 255, 255, 0.7);}
.hftit p{font-size: 0.28rem; font-weight: normal; color:rgba(255, 255, 255, 0.7); margin-top: 0.5rem; letter-spacing: 0rem;}
.wdbox{max-width: 750px; width: 100%;margin: 0px auto; text-align: center; margin-top: 0.5rem; position: relative; overflow: hidden; height: 5rem;}
.wdbox ul{width: 88%; margin: 0px auto; position: absolute; left: 6%; z-index: 999; top: 0;transition: all 0.5s ease-in-out;}
.wdbox ul li{position: relative; width: 100%; font-size: 0; margin-top: 0.2rem;}
.wdbox ul li span{font-size: 0.28rem; color: rgba(255, 255, 255, 0.5); position: absolute; display: block; line-height: 0.9rem; top: 0px; left: 0.5rem;}
.wdbox ul li input:focus{background-color: rgba(189, 189, 189, 0.3); color: rgba(255, 255, 255, 0.8);}
.wdbox ul li input{width: 100%; height: 0.9rem; line-height: 0.9rem; outline: none; background-color: rgba(189, 189, 189, 0.1); border: none; box-sizing: border-box; padding-left: 1.2rem;border-radius: 0.2rem; color: rgba(255, 159, 159, 0.4);}

.footbtn{width: 100%; position: fixed; height: 1rem; bottom: 1rem; text-align: center; margin: 0px auto;}
.footbtn input{border: none; width: 2rem; font-size: 0.3rem; color:#8e2bf0; background-color: transparent;}
.footbtn input:disabled{color:#6c34a3}

.loading{position: fixed; z-index: 9999; left: 0;; top: 0; width: 100%; height: 100%; background-color: rgba(255, 255, 255, 0.2); display: none;}
.loading img{width: 0.8rem; height: 0.8rem; position: absolute; left: 50%; top: 50%; margin-left: -0.4rem; margin-top: -0.4rem;animation: rotate 2s linear infinite;}
@keyframes rotate {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

.navbox{width: 100%; height: 0.8rem;  text-align: center; margin: 0px auto; margin-top: 0.2rem;}
.navbox a{text-decoration: none; margin: 0px 0.3rem;}
.navbox img{width: 0.8rem;}
.startbox{width: 100%;  text-align: center; margin: 0px auto; margin-top: 0.2rem;font-size: 0;}
.startbox img{width: 2rem;margin-top: 0.5rem;}
.startbox h4{font-size: 0.32rem; font-weight: normal; color:rgba(255, 255, 255, 0.9); margin-top: 0.4rem;}
.startbox p{font-size: 0.28rem; font-weight: normal; color:rgba(255, 255, 255, 0.7); margin-top: 0.0rem; }
.startbox input{height: 1rem; width: 41%; line-height: 1rem; border:none; background-color: #161827; font-size: 0.26rem; font-weight: normal; color: #FFF; border-radius: 0.5rem; margin-top: 0.5rem;}

.walletlist{width: 100%; height: 0.8rem;  text-align: center; margin: 0px auto; margin-top: 0.6rem;}
.walletlist ul{ width: 88%; margin: 0px auto; font-size: 0; padding-bottom: 1rem;}
.walletlist ul li{background-color: #282a3f; box-sizing: border-box; height: 1.3rem; padding: 0.2rem 0.15rem; line-height: 1.3rem; border-radius: 0.3rem; margin-top: 0.1rem; }
.walletlist ul li img{ height:0.9rem; float: left;}
.walletlist ul li h4{font-size: 0.24rem; font-weight: normal; color:rgba(255, 255, 255, 0.8); float: left; line-height: 0.9rem; margin-left: 0.1rem;}
.walletlist ul li p{font-size: 0.26rem; font-weight: normal; color:rgba(255, 255, 255, 0.8); float: right; line-height: 0.9rem; margin-right: 0.2rem; text-align: right;} 


.createbox {max-width: 750px; width: 100%; margin: 0px auto; margin-top: 1.5rem; text-align: center;}
.createbox img{width: 4rem;}
.createbox h3{font-size: 0.4rem; color:rgba(255, 255, 255, 1); margin-top: 0.4rem;}
.createbox h4{font-size: 0.28rem; font-weight: normal; color:rgba(255, 255, 255, 1); margin-top: 0.4rem;}
.createbox p{font-size: 0.26rem; font-weight: normal; color:rgba(255, 255, 255, 0.6); margin-top: 0.1rem;}
.createbox  input{border: none; width: 3rem; font-size: 0.3rem; color:#8e2bf0; background-color: transparent; position: fixed; bottom: 1.5rem; left: 50%; margin-left: -1.5rem;}


.bkbox .xx{font-size: 0.36rem; color:rgba(255, 255, 255, 0.2); margin-top: 0.5rem;}
.bkbox .tsxx{ width: 88%; height: 1rem; background-color: #46179b; margin: 0px auto; margin-top: 1rem; border-radius: 0.2rem;}
.bkbox .tsxx img{float: left; height: 0.6rem; margin-top: 0.2rem; margin-left: 0.2rem; margin-right: 0.2rem;}
.bkbox .tsxx p{font-size: 0.24rem; line-height: 0.3rem; text-align: left; margin-right: 0.2rem; padding-top: 0.2rem;}

.bkbox  input{border: none; width: 90%; font-size: 0.3rem; color:#ffffff; background-color: #8e2bf0; position: fixed; bottom: 1rem; left: 5%; height: 0.8rem; border-radius: 0.2rem;}