@charset "utf-8";
html {
    height: 100%;
}
div {
    box-sizing: border-box;
}
body, div, ul, ol, li, table, th, td, h1, h2, h3, h4, h5, h6, h7, dt, dd, p, font, form, input, select, textarea {
    font-family: "Microsoft YaHei";
    font-size: 14px;
    color: #252631;
    line-height: 180%;
    border: 0px;
    margin: 0px;
    padding: 0px;
}
a:link {
    color: #252631;
    text-decoration: none;
}
a:visited {
    color: #252631;
    text-decoration: none;
}
a:hover, a:focus {
    color: #252631;
    text-decoration: none;
}
a:hover {
    transition: all 0.25s ease-out;
    -webkit-transition: all 0.25s ease-out;
    -moz-transition: all 0.25s ease-out;
    -ms-transition: all 0.25s ease-out;
    -o-transition: all 0.25s ease-out;
}
a:active {
    color: #252631;
    text-decoration: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);

}
img{display:block;}
ul, ol {
    list-style-type: none;
}
h1, h2, h3, h4, h5, h6, h7 {
    font-weight: 400;
}
input, select {
    margin: 0px;
    padding: 0px;
    vertical-align: middle;
}
a:focus, input:focus, textarea:focus {
    outline: none;
}

#system-message-container {
    text-align: center;
}

.clearfix {
    *zoom: 1;
}

.clearfix:before, .clearfix:after {
    display: table;
    content: "";
    line-height: 0;
}

.clearfix:after {
    clear: both;
}


.alert {
    padding: 8px 35px 8px 14px;
    margin-bottom: 18px;
    text-shadow: 0 1px 0 rgba(255,255,255,0.5);
    background-color: #fcf8e3;
    border: 1px solid #fbeed5;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
}

.alert,
.alert h4 {
    color: #c09853;
}

.alert h4 {
    margin: 0;
}

.alert .close {
    position: relative;
    top: -2px;
    right: -21px;
    line-height: 18px;
}

.alert-success {
    background-color: #dff0d8;
    border-color: #d6e9c6;
    color: #468847;
}

.alert-success h4 {
    color: #468847;
}

.alert-danger,
.alert-error {
    background-color: #f2dede;
    border-color: #eed3d7;
    color: #b94a48;
}

.alert-danger h4,
.alert-error h4 {
    color: #b94a48;
}

.alert-info {
    background-color: #d9edf7;
    border-color: #bce8f1;
    color: #3a87ad;
}

.alert-info h4 {
    color: #3a87ad;
}

.alert-block {
    padding-top: 14px;
    padding-bottom: 14px;
}

.alert-block > p,
.alert-block > ul {
    margin-bottom: 0;
}

.alert-block p + p {
    margin-top: 5px;
}


.close {
    float: right;
    font-size: 20px;
    font-weight: bold;
    line-height: 18px;
    color: #000;
    text-shadow: 0 1px 0 #ffffff;
    opacity: 0.2;
    filter: alpha(opacity=20);
}

.close:hover,
.close:focus {
    color: #000;
    text-decoration: none;
    cursor: pointer;
    opacity: 0.4;
    filter: alpha(opacity=40);
}

body{
    background: url(../../../images/tmpl_spoc/bg.jpg) no-repeat right;
    background-size:cover;
}
.title{font-size:24px; font-weight:bold; color:#1f4471;}
.logbox{display:flex; align-items:center;}
.logCon{width:350px; padding-bottom:200px;}
.logCon h1{font-size:24px; font-weight:bold; padding-bottom:30px; text-align:center; color:#347cef;}
.logCon p{margin-top:30px; position:relative; height:45px; border:#adadad solid 1px; border-radius:25px; padding:0 20px 0 68px;background-color: #fff;}
.logCon p span{position:absolute; left:30px; top:10px; font-size:20px; color:#757575;}
.logCon p input{width:100%; height:45px; line-height:45px;}
.logCon h4{margin-top:30px;}
.logCon h4 button{width:100%; height:45px; border-radius:25px; background:linear-gradient(to right, #527ff9, #3f35db); color:#fff; border:0; font-size:16px;cursor:pointer;}
.captcha-wrap,
.captcha-wrap .handler_bg{
    border-radius:25px; 
}
.captcha-wrap .handler_ok_bg{
    border-radius: 0 25px 25px 0; 
}
.captcha-wrap .captcha_text{
    color: #fff;
}
.captcha-wrap .captcha_bg{
    /*background: linear-gradient(to right, #527ff9, #3f35db);*/
    padding:0;
    margin:0;
    border:none;
    border-radius:25px 0 0 25px; 
}

.btn_login {
    border-radius: 5px;
    box-shadow: 0 0 5px #ccc;
    width: 100%;
    color: #fff;
    height: 45px;
    font-size: 16px;
    background: #098ddf;
}
.btn_login:disabled{
   background: #e8e8e8;
   color: #5f5f5f;
   opacity: 1
}
.login-pw-hidden {
    width: 0;
    height: 0;
    border: none;
    margin: 0;
    padding: 1px;
    position: fixed;/*absolute;*/
    right: 0px;
    top: -500px;
    outline: none
}

.checkbox {
    vertical-align: middle;
}



h2 .a-login {
    padding: 0px 5px;
    display: inline-block;
    text-decoration: none;
    font-weight: normal;
    color: #000;
    white-space: nowrap;
}

h2 .a-login:hover, h2 .a-login:focus {
    text-decoration: none;
    color: #1d50a2;
    -webkit-border-radius: 5px;
    background: -webkit-gradient(linear, 0 0, 0 100%, color-stop(0, #255eb9),color-stop(1, #2059b4) );
}

/* 新增样式0831 */
.daren{position: absolute;top: 30px;}    
.daren a{ background:#d69b17; border-radius:30px; padding:4px; width:170px; text-align:right; position:relative;color: #fff;display: block;}
.daren a em{position:absolute; left:5px; top:8px;}
.daren a:hover{ background:#f9ca61;}

@media(min-width:751px) {
    .title{position:absolute; right:40%; top:0; padding-top:50px;}
    .logbox{position:absolute; right:15%; top:0; bottom:0;}
}

@media(max-width:750px) {
    .title{font-size:20px; text-align:center; padding-top:80px; padding-bottom:60px;}
    .logCon{width:70%; padding-bottom:0; margin:0 auto;}
    .logCon h1{font-size:18px; padding-bottom:10px;}
    .logCon p{background:#fff; margin-top:20px;}
    .logCon h4{margin-top:20px;}
}	
