@charset "utf-8";
/* reset CSS */
*{word-wrap:break-word}
html,body,h1,h2,h3,h4,h5,h6,hr,p,iframe,dl,dt,dd,ul,ol,li,pre,form,button,input,textarea,th,td,fieldset{margin:0;padding:0}
ul,ol,dl{list-style-type:none}
html,body{*position:static}
html{font-family: sans-serif;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}
address,caption,cite,code,dfn,em,th,var{font-style:normal;font-weight:400}
input,button,textarea,select,optgroup,option{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit}
input,button{overflow: visible;vertical-align:middle;outline:none}
body,th,td,button,input,select,textarea{font-family:"Microsoft Yahei","Hiragino Sans GB","Helvetica Neue",Helvetica,tahoma,arial,Verdana,sans-serif,"WenQuanYi Micro Hei","\5B8B\4F53";font-size:12px;color: #333;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing:grayscale}
body{line-height:1.6}
h1,h2,h3,h4,h5,h6{font-size:100%}
a,area{outline:none;blr:expression(this.onFocus=this.blur())}
a{text-decoration:none;cursor: pointer; color:#666;}
a:hover{text-decoration:none;outline:none; color:#ff8686;}
a.ie6:hover{zoom:1}
a:focus{outline:none}
a:hover,a:active{outline:none}:focus{outline:none}
sub,sup{vertical-align:baseline}
button,input[type="button"], input[type="submit"] {line-height:normal !important;}
/* img css */
img{border:0;vertical-align:middle}
a img,img{-ms-interpolation-mode:bicubic}
/* clear css */
.clear{ clear:both;}
.cl:after,.clearfix:after{content:".";display:block;height:0;clear:both;visibility:hidden}.cl,.clearfix{zoom:1}
.clear10{clear:both;font-size:1px;width:100%;height:10px;visibility:hidden;margin-top:0px!important;*margin-top:-1px;line-height:0;}
.clear20{clear:both;font-size:1px;width:100%;height:20px;visibility:hidden;margin-top:0px!important;*margin-top:-1px;line-height:0;}
.top{width: 1200px;margin: 32px auto;}
.login_wrap{width:450px;height: 375px;margin:auto;position:fixed; top: 30%; left: 0; right: 0;}
.login_wrap .bg{position:absolute;left:0;top:0;width:100%;height:100%;background:white;border-radius: 8px;opacity: 0.8;filter:alpha(opacity=80);z-index: 0;}
.login{
    background: #f3f3f3 url("../images/login-bg2.png")  no-repeat fixed left;
}
#app{
    position: absolute;
    width: 100%;
    height: 100%;
    background: url("../images/login-bg.png")  no-repeat fixed right;
    /*background: #60be9f; background: linear-gradient(225deg,#60be9f,#5987ca);*/
}
.company-titile{
    width:auto;
    height: 60px;
    line-height: 60px;
    padding-left: 3%;
    /*background: url("../images/logotop.png") no-repeat 2%;*/
    background-size: revert;
    /*color: white;*/
    font-size: 24px;
}
.company-titile img{
    margin-right: 10px;
}
.logo{
    height: 60px;
}
.user-login-title {
    position: absolute;
    left: 0;
    right: 0;
    font-size: 24px;
    top: -65px;
    width: 100%;
    height: 100px;
    line-height: 60px;
    text-align: center;
    border-radius: 0.5rem;
    box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.45);
    background-color: #fff;
    margin: auto;
    animation-name: totop;
    animation-duration: 2s;
    animation-iteration-count: 1;
    letter-spacing:5px
}

@keyframes totop {
    0%   {left:0px; top:100px;}
    100% {left:0px; top:-70px;}
}

.user-login-logo {
    text-align: center;
    padding-left:20px;
    /*background: url("../images/logotop.png") no-repeat 8%;*/
    background-size: revert;
}

#user-login-box {
    position: relative;
    bottom: 0;
    width: auto;
    margin: auto;
    border-radius: 0.5rem;
    background-color: #fff;
    padding: 2.25rem 1.75rem 1.25rem 1.75rem;
    box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.45);
}
.user-login-btn {
    width: 100%;
    font-size: 20px;
    font-weight: bolder;
}
.copyright{
    text-align: center;
    color: #00000075;
}
.verify{
    float: right; height: 40px; border: 1px solid #dcdfe6; border-radius: 5px; cursor: pointer;
}