﻿@charset "utf-8";/*--------------------CSS Document QQ420946262*/
/*-------------------------------登录验证中动画*/
.innerbox{display:none;position:absolute;margin:auto;left:0px;right:0px;top:16%;z-index:2;width:100%;height:100px;line-height:100px;text-align:center;}
.innerbox span{position:relative;display:inline-block;vertical-align:middle;width:70px;height:70px;background-color:rgba(0,0,0,0.70);border-radius:100%;}
.innerbox span em{position:absolute;margin:auto;left:0px;right:0px;top:0px;bottom:0px;width:60%;height:60%;border:2px solid;border-color:var(--color-white) transparent var(--color-white) transparent;box-sizing:border-box;border-radius:100%;animation:rotate .8s linear infinite;}
.innerbox span em:last-child{display:inline-block;margin:auto;left:0px;right:0px;top:0px;bottom:0px;width:30%;height:30%;-webkit-animation-duration:.5s;animation-duration:.5s;-webkit-animation-direction:reverse;animation-direction:reverse;}
@keyframes rotate{
    0%{-webkit-transform:rotate(0) scale(1);transform:rotate(0) scale(1)}
    50%{-webkit-transform:rotate(180deg) scale(.85);transform:rotate(180deg) scale(.85)}
    100%{-webkit-transform:rotate(360deg) scale(1);transform:rotate(360deg) scale(1)}
}
/*-------------------------------登录页面*/
.loginbox{position:relative;margin:0px auto;width:96%;max-width:450px;clear:both;z-index:1;}
.loginbox .maintop{margin:0px auto;padding-top:40px;width:100%;height:95px;background:url("loginhead_01.png") no-repeat center bottom;background-size:contain;z-index:0;clear:both;}
.loginbox .mainbox{margin:0px auto;position:relative;padding-top:65px;width:100%;background:rgba(255,255,255,0.90) url("loginhead_02.png") no-repeat center top;background-size:contain;border-radius:5px;clear:both;}
.loginbox .mainbox .toplogo{position:absolute;left:0px;right:0px;top:-10px;width:100%;text-align:center;z-index:1;}
.loginbox .mainbox .toplogo img{width:auto;max-width:210px;height:50px;border:0px;}
.loginbox .mainbox .loginhead{margin:20px auto;width:140px;height:140px;line-height:140px;background-color:var(--color-white);text-align:center;border-radius:50%;border:1px solid var(--color-light-blue3);overflow:hidden;clear:both;-webkit-user-select:none;user-select:none;display:flex;justify-content:center;align-items:center;}
.loginbox .mainbox .loginhead em{width:0%;height:0%;border-radius:50%;}
.loginbox .dlbox{margin:0px auto;width:100%;text-align:center;clear:both;}
.loginbox .dlbox dt{margin:25px auto 5px auto;width:100%;height:50px;line-height:50px;font-size:16px;text-align:center;color:var(--color-grey-blue4);}
.loginbox .dlbox dd{position:relative;float:left;margin:7px auto 34px auto;width:33.3%;height:60px;}
.loginbox .dlbox dd em.num{display:block;color:var(--color-grey-blue5);font-size:30px;height:30px;line-height:30px;overflow:hidden;clear:both;}
.loginbox .dlbox dd p.txt{color:var(--color-grey-blue5);opacity:0.85;width:100%;height:30px;line-height:30px;overflow:hidden;}
.loginbox .dlbox dd .line{position:absolute;top:15px;left:70%;z-index:1;width:60%;height:0px;line-height:0px;border-bottom:1px dashed var(--color-sky-blue1);content:"";}

.loginbox .ulbox{position:relative;margin:0px auto;z-index:1;width:80%;clear:both;-webkit-user-select:none;user-select:none;}
.loginbox .ulbox li{position:relative;width:100%;margin-bottom:10px;text-align:left;clear:both;}
.loginbox .ulbox li .input{padding-left:50px;height:44px;line-height:44px;font-size:16px;border:1px solid var(--color-light-blue4);box-sizing:border-box;width:100%;color:var(--color-grey-blue4);box-shadow:inset 0px 1px 3px 0px #E5E7EF;-webkit-transition:border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s;}
.loginbox .ulbox li .input:focus{border-color:var(--color-sky-blue1);outline:0;box-shadow:inset 0px 1px 3px 0px #E5E7EF,0 0 8px #E5E7EF;}
.loginbox .ulbox li i.iconfont{position:absolute;margin:auto;top:0px;bottom:0px;width:50px;height:40px;line-height:40px;text-align:center;font-size:20px;color:var(--color-grey-blue2);}
.loginbox .ulbox li i.ifront{left:0px;}
.loginbox .ulbox li i.seepass{right:5px;cursor:pointer;}
.loginbox .ulbox li i.seepass.on{color:var(--color-deger-red4);}
.loginbox .ulbox li .codeimg{position:absolute;margin:auto;right:10px;top:0px;bottom:0px;width:60px;height:30px;cursor:pointer;}
.loginbox .ulbox li .mailcodes{outline:0;position:absolute;margin:auto;padding:0px 10px;right:5px;top:0px;bottom:0px;height:30px;line-height:32px;font-size:15px;color:var(--color-grey-blue4);background-color:var(--color-light-blue0);text-align:center;border-radius:5px;cursor:pointer;-webkit-transition:all .2s;transition:all .2s;}
.loginbox .ulbox li .mailcodes em.iconfont{display:inline-block;vertical-align:middle;margin:0px 2px 3px 0px;font-size:16px;width:20px;height:20px;line-height:20px;overflow:hidden;animation:isrotate 0.4s linear infinite;}
.loginbox .ulbox li .mailcodes:hover{background-color:var(--color-light-blue1);}
.loginbox .ulbox li .mailcodes:active{background-color:var(--color-light-blue1);}
.loginbox .ulbox .login_tip{margin:0px 1%;width:98%;height:30px;line-height:30px;text-align:left;color:var(--color-grey-blue5);clear:both;}
.loginbox .ulbox .login_tip .link{float:right;color:var(--color-grey-blue5);cursor:pointer;}
.loginbox .ulbox .login_tip .link:hover{color:var(--color-sky-blue5);}
.loginbox .ulbox .radiocheck label{height:30px;line-height:30px;}
.loginbox .ulbox .loginbtn{height:40px;line-height:40px;font-size:16px;}

.loginbox .footer{margin:0px auto;width:98%;padding-bottom:10px;line-height:20px;color:var(--color-grey-blue5);text-align:center;font-size:12px;}
.loginbox .footer .loginReport{margin:0px auto;width:90%;height:40px;line-height:40px;font-size:15px;color:var(--color-deger-red4);text-align:center;clear:both;}
.loginbox .footer .loginReport span{font-size:14px;color:var(--color-grey-blue5);}
.loginbox .footer .icp{color:var(--color-grey-blue5);}
.loginbox .footer .icp:hover{color:var(--color-sky-blue5);}
.loginbox .footer .loginType{display:inline-block;margin-top:5px;color:var(--color-grey-blue5);text-decoration:none;}
.loginbox .footer .loginType i.iconfont{font-size:30px;}
@keyframes isrotate{100%{transform:rotate(-360deg);}}

/*===============================以下为框架自适应CSS*/
@media screen and (min-width:320px) and (max-width:767px) {/*>=320px and <=767px的设备:大小手机移动端或mini平板*/
.innerbox{top:12%;}
.loginbox{width:96%;max-width:400px;}
.loginbox .maintop{padding-top:0px;width:96%;height:95px;}
.loginbox .mainbox{padding-top:60px;width:96%;}
.loginbox .mainbox .toplogo img{width:auto;max-width:158px;height:45px;}
.loginbox .mainbox .loginhead{margin:10px auto 5px auto;width:100px;height:100px;line-height:100px;}
.loginbox .dlbox dt{margin:10px auto 5px auto;height:30px;line-height:30px;font-size:16px;}
.loginbox .dlbox dd{margin:2px auto 10px auto;}
.loginbox .dlbox dd em.num{font-size:24px;}
.loginbox .dlbox dd p.txt{font-size:12px;}
.loginbox .ulbox{width:86%;}
.loginbox .ulbox li{margin-bottom:7px;}
.loginbox .ulbox .login_tip{font-size:12px;}
.loginbox .footer{font-size:12px;}
.loginbox .footer .loginReport span{font-size:12px;}
.SeverBox{display:none;}
}
@media screen and (min-width:320px) and (max-width:380px) {/*<=320px and >=340px的设备:小屏手机专设*/
.innerbox{top:10.5%;}
.loginbox{width:96%;max-width:360px;}
.loginbox .maintop{padding-top:0px;width:98%;height:95px;}
.loginbox .mainbox{padding-top:50px;width:98%;}
.loginbox .mainbox .toplogo img{width:auto;max-width:150px;height:40px;}
.loginbox .mainbox .loginhead{margin:10px auto 5px auto;width:100px;height:100px;line-height:100px;}
.loginbox .dlbox dt{margin:15px auto 5px auto;height:30px;line-height:30px;font-size:16px;}
.loginbox .dlbox dd{margin:2px auto 5px auto;}
}
@media screen and (max-width:319px){/*<=319px的设备:iphone4以下，算了还是不要看了*/
html{width:100%;height:100%;background:#242933 url("Seenone.png") no-repeat center center;}
body{display:none;}
}