html,body { height: 100%; font-family: "microsoft yahei"; }
.VBody { background-color: #666; margin: 0px; padding: 0px; height: 100%; overflow: hidden; width: 100%; height: 100%; user-select: none; }
.J-LoginBox { position: absolute; height: 400px; width: 800px; left: 50%; top: 50%; margin-top: -200px; margin-left: -400px; }
.J-LoginBox .UserLogin { border-radius: 10px; top: -30px; position: relative; width: 360px; margin-right: auto; margin-left: auto; padding: 40px 80px; background-color: rgba(255,255,255,1); display: block; border: 0px solid #5576BD; box-shadow: 0 0 20px rgba(85,118,189,0.3); overflow: hidden; }
.J-LoginBox .UserLogin .l_title { color: #5576BD; font-size: 34px; text-align: center; padding: 0px; margin-top: 0px; margin-right: 0px; margin-bottom: 0.5em; margin-left: 0px; font-weight: 500; }
.J-LoginBox .UserLogin .l_instructions { font-size: 14px; color: #333333; margin: 0px; padding: 0px; line-height: 1.5em; }
.J-LoginBox .UserLogin ul { border-radius: 5px; list-style-type: none; display: block; background-color: #FFFFFF; border: 1px solid #F8F8F8; color: #333333; font-size: 14px; line-height: 30px; position: relative; margin: 15px 0px; clear: both; padding: 25px; }
.J-LoginBox .UserLogin ul li { display: block; margin-bottom: 5px; position: relative; }
.J-LoginBox .UserLogin ul li.li2 { display: block; margin-bottom: 0; margin-top: 15px; }
.J-LoginBox .UserLogin ul li label { /* float: left; */ position: absolute; top: 0px; left: 20px; color: #333; font-size: 14px; line-height: 40px; }

.J-LoginBox .UserLogin ul li .int_text { display: block; border-radius: 2px; background-color: #F8F8F8; border: 1px solid #DDDDDD; height: 40px; padding-right: 0px; padding-left: 80px; width: 100%; box-sizing: border-box; font-size: 14px; color: #333333; outline: none;
    background-image: linear-gradient(to top, #FFFFFF 60%, #F8F8F8 90%);
}
.J-LoginBox .UserLogin ul li .int_text:focus { border: 1px solid #798AB9; box-shadow: 0px 0px 0px 3px rgba(85,118,189,.2); }

.J-LoginBox .UserLogin ul li .int_submit { cursor:pointer; border-radius: 2px; height: 50px; width: 100%; box-sizing: border-box; font-size: 18px; border: 1px solid #5576BD; background-color: #5576BD; color: #FFFFFF; }
.J-LoginBox .UserLogin ul li .int_submit:hover { box-shadow: 0px 0px 0px 3px rgba(85,118,189,.2); }

.J-LoginBox .UserLogin ul li #login_code { /*width: 5em;*/ margin-right: 10px; }
.J-LoginBox .UserLogin ul li .verification_code { padding-top: 5px; margin: 0px; padding-right: 0px; padding-bottom: 5px; padding-left: 0px; display: block; position: absolute; top: 2px; right: 10px; }
.J-LoginBox .UserLogin ul li .verification_code img { height: 26px; width: 80px; vertical-align: middle; display: block; border-radius: 3px; background-color: #EEEEEE; }

.J-LoginBox .UserLogin .login_note { color: #FFFF00; font-size: 12px; display: block; text-align: center; }

::-webkit-input-placeholder{ color: #DEDEDE; }    /* 使用webkit内核的浏览器 */
:-moz-placeholder{ color: #DEDEDE; }                  /* Firefox版本4-18 */
::-moz-placeholder{ color: #DEDEDE; }                  /* Firefox版本19+ */
:-ms-input-placeholder{ color: #DEDEDE; }

/*版权*/
.J-Copyright { position: absolute; right: 20px; bottom: 20px; text-align: center; font-size: 14px; color: #FFFFFF; font-family: Arial, Helvetica, sans-serif; font-weight: normal; }

/*二维码*/
.J-QR { position: absolute; right: 20px; bottom: 50px; font-size: 12px; line-height: 1.6em; color: #FFF; text-align: center; width: 130px; }
.J-QR img {height: 100px;width: 100px;text-align: center;display: block;margin-right: auto;margin-left: auto; margin-bottom:10px;}
.J-QR p {margin: 0px;padding: 0px;text-align: center;}


.VBody {
    /* background-image: linear-gradient(to top, #0c3483 0%, #EEEEEE 50%); */
    background-image: linear-gradient(-15deg, #0c3483 0%, #F9FAFC 50%);
}

.J-LoginBox .UserLogin::before { content: ""; display: block; width: 200%; height: 150%; border-radius: 50%; background-color: rgba(85,118,189,0.1); position: absolute; top: 90%; z-index: 0;  }
.J-LoginBox .UserLogin::after { content: ""; display: block; width: 200%; height: 150%; border-radius: 50%; background-color: rgba(85,118,189,0.1); position: absolute; top: 80%; left: -100%; z-index: 0;  }