@charset "utf-8";
/**2021-08-10*/
* { padding:0; margin:0; list-style:none;}
html,body { width:100%; height:100%; overflow:hidden;}
body { min-width:1200px; line-height:25px; font-size:12px; color:#333; background:url(../../../images/lognbg.jpg) no-repeat center / cover;}

.logins { width:400px; padding:35px 100px 25px 100px; margin:auto; border-radius:4px; box-shadow:0 5px 30px rgba(0,0,0,0.1); overflow:hidden; background:#fff; position:absolute; top:25%; right:0; left:0; z-index:999;}
.logins h2 { line-height:50px; font-weight:bold; font-size:36px; color:transparent; text-align:center; background-image:linear-gradient(to right,#0f89dd,#00c9f1); -webkit-background-clip:text;}
.logins p { line-height:30px; font-size:14px; color:#999; letter-spacing:2px; text-transform:Uppercase; text-align:center; position:relative;}
.logins p::before,.logins p::after { display:block; content:""; width:25%; height:1px; margin:auto; background:#ddd; position:absolute; top:0; bottom:0; z-index:2;}
.logins p::before { left:0;}
.logins p::after { right:0;}
.logins li { width:100%; height:45px; line-height:45px; margin:0 auto 20px auto; border:1px solid #ddd; border-radius:22.5px; overflow:hidden; background:#fff;}
.logins li i { float:left; width:50px; font-size:22px; color:#999; text-align:center;}
.logins li input { float:right; width:calc(100% - 50px); height:45px; line-height:45px; font-size:14px; color:#333; border:none; background:none;}
.logins .yzm {}
.logins .yzm input { float:left; width:40%;}
.logins .yzm img { float:right; height:45px; border-left:1px solid #ddd;}
.logins .btns { display:block; width:100%; height:50px; line-height:50px; font-size:18px; color:#fff; letter-spacing:2px; border:none; border-radius:25px; cursor:pointer; overflow:hidden; background-image:linear-gradient(to right,#0f89dd,#00c9f1);}
.logins .logfoot { width:100%; line-height:30px; color:#999; text-align:center; margin-top:15px;}
canvas { display:block; margin:0 auto; filter:alpha(opacity=15); opacity:0.15; position:absolute; top:0;}

.chang_btn { display:none; width:70px; height:70px; font-size:0; background-color:#fff; background-position:0 0; background-repeat:no-repeat; background-size:100%; position:absolute; top:10px; right:10px; z-index:999;}
.chang_btn::after { display:block; content:""; width:0; height:0; border-style:solid; border-width:70px 0 0 70px; border-color:transparent transparent transparent #fff; position:absolute; left:0; top:0; z-index:2;}
.btnpc { background-image:url(../../../images/pc.png);}
.btnewm { background-image:url(../../../images/wct.png);}
.on { display:block;}
.pass_box { display:none;}
#captcha_div { display:none;}
.pass_box { margin-top:35px;}
.qr_box { margin-top:15px;}
.qr_box #wx_reg { width:300px; height:300px; margin:0 auto; padding:10px; border:1px solid #ddd; position:relative;}
.qr_box #wx_reg .result { top:10%; bottom:0;}
.qr_box span { display:block; width:100%; line-height:30px; font-size:14px; color:#999; text-align:center; margin-top:5px;}