@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;
}
*{margin:0px; padding:0px;}
html{margin:0px; padding:0px; }
body{background-color: #000; color: #FFF;font-family:"HarmonyOS"; }
li{list-style:none;}
i{font-style: normal;}
.appbox{height:100%; margin:0px auto;}
.appmian{height: 100%; width: 100%; max-width: 750px; margin: 0px auto;}
.logo{width: 100%;text-align:left; margin: 0px; padding: 0px;}
.logo img{ height: 26px; margin-left: 20px; margin-top: 20px;}
.banner{width: 100%; text-align: center; margin-top: 20px;}
.banner img{width: 45%; margin: 0px auto;}
.banner h3{font-family:"HarmonyOS"; font-weight:700; font-size:26px; width: 70%; margin-left: 15%; text-align: left; line-height: 35px;}
.banner p{ font-size: 16px; color:#788080;width: 70%; margin-left: 15%;text-align: left;font-weight:700; margin-top: 10px;}

.menubox{width:72%; margin-left: 14%; margin-top: 40px;}
.createwallet{ width:100%; height:60px; background-color:#ffffff; border:#ffffff solid 1px; margin:0px auto; border-radius:30px; text-align:center; margin-bottom: 16px;}
.createwallet h4{font-family:"HarmonyOS";font-size:16px;  line-height:20px; color: #17171a; font-weight: 400; margin-top: 10px;}
.createwallet p{font-family:"HarmonyOS"; font-size:12px; font-weight:400; color:#788080; margin-top: 0px;}
.importwallet{ width:100%; height:60px; background-color:#17171a; border:#ffffff solid 1px; margin:0px auto; border-radius:30px; text-align:center; margin-bottom: 16px;}
.importwallet h4{font-family:"HarmonyOS";font-size:16px; color:#FFF; line-height:20px;  font-weight: 400; margin-top: 10px;}
.importwallet p{font-family:"HarmonyOS"; font-size:12px; font-weight:400; color:#788080; margin-top: 0px; line-height: 13px;}
.toper{height:15px; width:100%; padding-left: 5%; margin-top: 20px; box-sizing: border-box;}
.toper a img{height: 15px;}

.mainbox{width:92%; margin:0px auto; }
.mainbox .titbox{font-family:"HarmonyOS"; font-weight:600; font-size:24px; margin-top: 20px; }
.mainbox .subtitbox{font-family:"HarmonyOS"; font-weight:400; font-size:12px; margin-top:8px; color: #788080;}
.mainbox .subtitbox span{display:inline-block;font-family:"HarmonyOS"; font-weight:400; font-size:0.24rem; height:0.3rem; line-height:0.3rem; background:url(../images/icon_transaction_list_check.png) left center no-repeat; background-size:auto 150%; padding-left:0.5rem;}
.mainbox .subtitbox span.err{background:url(../images/icon_transaction_list_close.png) left center no-repeat;background-size:auto 150%; margin-left:0.35rem}
.mainbox .inputbox{ margin-top: 30px;}
.mainbox .inputbox p{font-size: 12px; margin-bottom: 8px;}
.mainbox .inputbox input{box-sizing: border-box;border: 1px solid #fff;width: 100%;font-size: 14px;height: 52px;padding: 0 10px;color: #fff; background-color: transparent; border-radius: 5px;}
.mainbox .inputbox span{font-size: 12px; margin-top: 6px; color: #788080; font-weight: 400;}
.mainbox .nextbtn{    background-color: #fff;padding: 16px 10px;font-size: 14px;color: #17171a;display: flex;justify-content: center;border-radius: 30px;cursor: pointer;transition: all .2s; width: 100%; border: none; margin-top: 30px;}
.mainbox .nextbtn:disabled{opacity: 0.5;}

.bghome{width: 100%;}
.bghome img{width: 100%;border: none; margin: 0px; padding: 0px; display: flex;}
.bghome .bthome{position: fixed; bottom: 0px;}

.popup-box{
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100vh;
    display: flex;
    align-items: center;
    background-color: rgba(0, 0, 0, .5);
  }
.popup-box .popup{
    display: flex;
    background-color: #fff;
    border-radius: 8px;
    padding: 20px;
    margin: 0 30px;
    flex-direction: column;
    width: 100%;
  }
.popup-box .popup .p-tit{
    font-size: 18px;
    color: #17171a;
    text-align: center;
    font-weight: 700;
  }
  .popup-box .popup .p-p{
    font-size: 14px;
    color: #788080;
    margin: 10px 0;
  }
    .popup-box .popup .p-button{
background-color: #17171a;
    padding: 16px 10px;
    font-size: 16px;
    color: #fff;
    display: flex;
    justify-content: center;
    border-radius: 30px;
    cursor: pointer;
    transition: all .2s;
    }

.waitbox{position:fixed; width:100%; height:100%; z-index:999; left:0; top:0; background-color:rgba(102,102,102,0.5); display: none; }
.waitbox .wbox{width:100px; height:100px; background-color:#FFF; border-radius:5px; position:absolute; left:50%; top:50%; margin-left:-50px; margin-top:-50px; text-align: center;} 
.waitbox .wbox img{width: 50%; margin-top: 10px;}
.waitbox .wbox p{font-size: 14px; color: #666; margin-top:5px;}


.mainbox .wordbox{width:100%; background-color:#f8f8f8; border-radius:10px; margin-top:10px; height: 200px; overflow: hidden;}
.mainbox .wordbox li{ float:left; width:33.333%; box-sizing:border-box; position: relative; height: 50px; border-right: 1px solid #e9e9e9;border-bottom: 1px solid #e9e9e9;}
.mainbox .wordbox li span{ font-weight:400;color: #999; font-size: 12px;position: absolute; right: 10px; top: 5px;}
.mainbox .wordbox li p{ font-weight:500; font-size:14px;display:inline-block; color:#666;line-height:50px; padding-left: 15px; }
.disbtn{background-color:#e1e5e6; color:#666;}
.mainbox .txtbox{ background-color: #fff; margin-top: 20px; border-radius: 5px; box-sizing: border-box; padding: 10px 10px 30px 10px; min-height: 150px; position: relative;}
.mainbox .txtbox li{ padding: 6px 18px; border: #a6a6a6 solid 1px; font-size: 14px; font-weight: 500; color: #666;float: left; margin-right: 15px; margin-top: 5px; margin-bottom: 5px; border-radius: 5px;}
.mainbox .txtbox p{font-size: 14px; color: red; position: absolute;width: 100%; text-align: center; z-index: 999; bottom: 8px; opacity: 0;}
.zhucilist{ margin-top: 10px;}
.zhucilist li{font-size:14px;height:28px; line-height:28px; color:#666; border:#a6a6a6 solid 1px; border-radius:5px; margin-right:10px; margin-top: 10px; float: left; padding: 0px 18px;}
.zhucilist li.cur{color:#ccc; border: #e9e9e9 solid 1px;}

.wkbox{ width: 100%; margin: 0px auto;margin-top: 30px;background-color: #202024; border-radius: 5px; padding-bottom: 10px;}
.wkbox ul{text-align: center;}
.wkbox ul li{display:inline-block; width: 30%; position: relative; height: 35px; line-height: 35px; color: #9e9da6; font-size: 14px; text-align: left;margin: auto 1.6%;margin-top: 10px;}
.wkbox ul li span{font-size: 14px; position: absolute; left:10px; line-height: 35px; display: block;}
.wkbox ul li input{width: 100%; height: 100%; box-sizing: border-box; padding-left: 30px; outline: none; font-size: 13px; border: none; background-color: transparent; border-radius: 5px; color: #eeedf5;}
.wkbox ul li input:focus{background-color: rgba(255, 255, 255, 0.2);}