@keyframes openin {
	from {top:70%}
	to {top:50%}
}
@-webkit-keyframes openin{
	from {top:70%}
	to {top:50%}
}

@keyframes drawerin {
	from {bottom:-100%}
	to {bottom:0}
}
@-webkit-keyframes drawerin{
	from {bottom:-100%}
	to {bottom:0}
}
.hua-open{width:100vw;height:100vh;position:fixed;z-index:9999999;top:0;left:0;right:0;bottom:0}
.hua-open .bg{width:100%;height:100%;position:absolute;z-index:1;background:rgba(0,0,0,.7);top:0;left:0;right:0;bottom:0}
.hua-open .open{width:6rem;position:fixed;z-index:99999;top:50%;left:50%;border-radius:.2rem;background:#fff url(/static/wap/img/bg-white.png??) no-repeat 0 0;background-size:100% auto;-webkit-box-shadow:1px 1px 50px rgba(0, 0, 0, .3);-moz-box-shadow:1px 1px 50px rgba(0, 0, 0, .3);box-shadow:1px 1px 50px rgba(0, 0, 0, .3);-webkit-transform:translate(-50%, -50%);-moz-transform:translate(-50%, -50%);transform:translate(-50%, -50%);padding:.3rem .5rem .5rem;text-align:center;animation:openin .2s;-webkit-animation:openin .2s}
.hua-open .tit1{display:flex}
.hua-open .tit1 h2{font-size:.42rem;font-weight:700;line-height:1em;margin:0 auto;padding:.1rem;position:relative}
.hua-open .tit1 span{display:block;position:relative;z-index:9}
.hua-open .tit1 h2::after{content:'';display:block;position:absolute;left:0;bottom:.03rem;right:0;background:#fc5fa4;height:.14rem;overflow:hidden;border-radius:.2rem;opacity:.5;z-index:1}
.hua-open .desc{padding:.5rem 0}
.hua-open .btns{display:flex}
.hua-open .btns button{flex:1;-webkit-flex:1;-ms-flex:1}
.hua-open .drawer{width:7.5rem;max-height:80vh;box-sizing:border-box;position:fixed;z-index:99999;left:50%;bottom:0;border-radius:.4rem .4rem 0 0;background:#fff url(/static/wap/img/bg-white.png??) no-repeat 0 0;background-size:100% auto;-webkit-transform:translate(-50%, 0);-moz-transform:translate(-50%, 0);transform:translate(-50%, 0);transition:all .3s;display:flex;flex-direction:column;animation:drawerin .3s;-webkit-animation:drawerin .2s;overflow:hidden}
.hua-open .tit2{display:flex;line-height:1rem;text-align:center;font-size:.4rem}
.hua-open .tit2 h2{flex:1;min-width:1em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.4rem}
.hua-open .drawer-close,.hua-open .drawer-btn{min-width:1rem}
.hua-open .drawer-close{font-size:.6rem}
.hua-open .drawer-btn{color:#fc5fa4;background:#fc5fa422;border-radius:0 0 0 .35rem;padding:0 1.25em}
.hua-open .drawer-main{min-height:3rem;flex:1;overflow:auto}

.hua-open .loading{width:100px;height:100px;position:absolute;z-index:9;left:50%;top:50%;margin-left:-50px;margin-top:-50px}
.hua-open .loading i{display:block;width:16px;height:16px;border-radius:16px;overflow:hidden;background:#fff;position:absolute;animation:load 1.04s ease infinite}
@keyframes load{
0%{opacity:1}
100%{opacity:0.1}
}
.hua-open .loading i:nth-child(1){left:0;top:50%;margin-top:-8px;animation-delay:.13s}
.hua-open .loading i:nth-child(2){left:13px;top:13px;animation-delay:.26s}
.hua-open .loading i:nth-child(3){left:50%;top:0;margin-left:-8px;animation-delay:.39s}
.hua-open .loading i:nth-child(4){top:13px;right:13px;animation-delay:.52s}
.hua-open .loading i:nth-child(5){right:0;top:50%;margin-top:-8px;animation-delay:.65s}
.hua-open .loading i:nth-child(6){right:13px;bottom:13px;animation-delay:.78s}
.hua-open .loading i:nth-child(7){bottom:0;left:50%;margin-left:-8px;animation-delay:.91s}
.hua-open .loading i:nth-child(8){left:13px;bottom:13px;animation-delay:1.04s}

.hua-switch{display:flex;align-items:center;font-size:.25rem;color:rgba(0,0,0,.5)}
.hua-switch .hua-text{padding:0 .1rem}
.hua-switch .hua-main{width:.8rem;height:.3rem;border-radius:.5rem;overflow:hidden;padding:.05rem;border:1px solid #ccc;box-sizing:content-box!important;cursor:pointer;transition:all .2s;position:relative}
.hua-switch .hua-main::before{content:'';display:block;width:.3rem;height:.3rem;border-radius:.5rem;overflow:hidden;background:#ccc;transition:all .2s;position:absolute;left:.05rem;top:.05rem}
.hua-switch .switched{border-color:rgb(104,196,87)}
.hua-switch .switched::before{left:.55rem;background:rgb(104,196,87)}