@charset "utf-8";
body{font-family: Microsoft Yahei;overflow-x:hidden;color: #666;font-size: 14px;height: 100vh; background:#f7f8fa;}
ul,ol,li{list-style: none;}
a {color:#333;}
input:-webkit-autofill , textarea:-webkit-autofill, select:-webkit-autofill {  
    -webkit-box-shadow: 0 0 0px 1000px transparent  inset !important;  
    background-color:transparent;  
    background-image: none;  
     transition: background-color 50000s ease-in-out 0s; 
}  
input {  
     background-color:transparent;  
}

.div-table{display:table;height:100%;width:100%;padding: 30px 0px;}
.div-cell{display:table-cell;vertical-align:middle;}

.form-title{width: 450px;max-width:90%;margin: 0 auto 30px;text-align: center;}
.form-title h4{font-size: 34px;color: #142C4C;}
.form-title h5{padding: 0 5px;margin-bottom: 20px;font-size: 14px;color: #999;position: relative;display: inline-block;}
.form-title h5:before{content:"";display: block;position: absolute;right: 100%;top: 50%;height: 1px;width: 60px;background: #ccc;}
.form-title h5:after{content:"";display: block;position: absolute;left: 100%;top: 50%;height: 1px;width: 60px;background: #ccc;}
.form-title p{color: #999;}
.form-title p i{margin-right: 3px;}
.form-title p i ~ i{margin-left: 20px;}
.form-title .fa-check-square{display: inline-block;background: #0064E4;padding: 3px;border-radius: 50%;}


.form-box{position: relative; width:450px;max-width:90%;margin:20px auto;border:1px solid #eee;box-shadow:1px 1px 35px rgba(0,0,0,.05);padding:40px 40px;background:#fff;}

.form-box .btn,.form-box .form-control{height:44px}
.form-box h2{color:#142C4C;margin-bottom:30px;margin-top:0}
@media screen and (max-width: 468px) {
.form-title h4 {font-size:20px;}
.form-title,
.form-box{width:90%;}
.form-box h2{font-size:16px;}
}

.form-box ul{padding:0;margin:0}
.form-box form>ul>li{margin-top:20px}
.form-box ul li p{margin-top:30px}
.form-box .btn,.form-box .form-control,.form-box .input-group-addon{border-radius:0;}
.form-box .input-group-addon{background:0 0}
.form-box .btn1{background:0 0;border:1px solid #ccc;}
.form-box .btn1:hover{background:0 0}
.form-box .btn2{background:#0064E4;color:#fff}
.form-box .btn2:hover{background:#0034E4}
.form-box ul li p{margin-bottom: 0;}
.form-box ul li p a{color:#0064E4}
.form-box .input-group-addon i{width:1em}
.form-box .btn3{background:0 0;border:1px solid #ccc;width:100%;text-align:left}
.form-box .btn3 .caret{float:right;margin-top:9px}
.form-box .btn3:hover{background:0 0}
.form-box .btn3-list{width:100%}
.form-box .btn4{background:#0064E4;color:#fff;width:100%}
.form-box .btn4:hover{background:#0034E4}
.form-box .othre-loak h5{margin: 0;padding: 0 5px;margin-bottom: 20px;font-size: 14px;color: #999;position: relative;display: inline-block;}
.form-box .othre-loak h5:before{content:"";display: block;position: absolute;right: 100%;top: 50%;height: 1px;width: 60px;background: #ccc;}
.form-box .othre-loak h5:after{content:"";display: block;position: absolute;left: 100%;top: 50%;height: 1px;width: 60px;background: #ccc;}
.form-box .othre-loak a{display: inline-block;height: 40px;width: 40px;border:1px solid #377DFF;color: #377DFF;line-height: 38px;text-align: center;border-radius: 50%;font-size: 16px;}
.form-box .othre-loak a:hover{background: #377DFF;color: #fff;}
.copyright {text-align:center; font-size:12px; color:#FFF; }
.copyright a {color:#FFF;}
#checkcode {height:100%;}



.ywz_zhuce_huixian{float:left;background:#d6d3d3;width:50px;height:4px;margin-top:5px;_margin-top:0px;margin-left:5px;_height:2px;font-size:0px;}
.ywz_zhuce_hongxianwenzi{float:left;width:32px;margin-left:5px;text-align:center;color:#b0adad;font-size:12px;}



.ywz_zhuce_hongxian{float:left;background:#ff3300;width:50px;height:4px;margin-top:5px;margin-left:5px;_margin-top:0px;_height:2px;font-size:0px;}
.ywz_zhuce_hongxian2{float:left;background: #099;width:50px;height:4px;margin-top:5px;margin-left:5px;_margin-top:0px;_height:2px;font-size:0px;}
.ywz_zhuce_hongxian3{float:left;background: #060;width:50px;height:4px;margin-top:5px;margin-left:5px;_margin-top:0px;_height:2px;font-size:0px;}

.ywz_zhuce_yongyu1{float:left;color: #C00;font-size:12px;padding-left:10px;margin-top:10px;_padding-left:0px;}/*���������*/
.ywz_zhuce_yongyu1 a{ color:#C00;text-decoration:none;}
.ywz_zhuce_yongyu1 a:hover{ color:#C00;}

.login-switch {position: absolute; width:50px; height:50px; right:10px; top:10px; font-size:30px; text-align:right;}
.login-switch span { color:#bbb;  }

.login-switch a:link,
.login-switch a:visited,
.login-switch a:hover,
.login-switch a:active
{color:#ccc;text-decoration:none;}

.line-div{
width: 66px;
height: 66px;
background:#fff;
position: absolute;
bottom:-26px;
left:-36px;
text-align: center;
margin-top: -10rem;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
filter: progid:DXImageTransform.Microsoft.BasicImage(Rotation=0.45);

}

.poptip { display:inline-block;height: 26px; line-height: 16px; padding: 5px 10px; left:-60px; top:0px; background: #E6F9FC; position: absolute; z-index: 9999; border: 1px solid #14C2DD }
    .poptip .poptip-content { color: #14C2DD; font-size: 12px; font-weight: 400 }
        .poptip .poptip-content .iconfont { color: #df9c1f; font-size: 14px; margin-right: 8px }
.poptip-arrow { position: absolute; z-index: 10; *zoom: 1; top: 8px; right: 0; }
    .poptip-arrow em, .poptip-arrow span { position: absolute; *zoom: 1; width: 0; height: 0; border-color: rgba(255,255,255,0); border-color: transparent \0; *border-color: transparent; _border-color: tomato; _filter: chroma(color=tomato); border-style: solid; overflow: hidden; top: 0; left: 0 }
    .poptip-arrow em { top: 0; left: 1px; border-left-color: #14C2DD; border-width: 6px 0 6px 6px }
    .poptip-arrow span { border-left-color: #E6F9FC; border-width: 6px 0 6px 6px }

    .switch-box {
        width: 40px;
        display: inline-block;
    }
    .switch-box .switch {
        /* 隐藏checkbox默认样式 */
        display: none;
    }
    .switch-box label {
        /* 通过label扩大点击热区 */
        position: relative;
        display: block;
        margin: 1px;
        height: 20px;
        cursor: pointer;
    }
    .switch-box label::before {
        /* before设置前滚动小圆球 */
        content: '';
        position: absolute;
        top: 50%;
        left: 50%;
        margin-top: -8px;
        margin-left: -8px;
        width: 16px;
        height: 16px;
        border-radius: 100%;
        background-color: #fff;
        box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.06);
        /* 通过transform、transition属性控制元素过渡进而形成css3动画 */
        -webkit-transform: translateX(-9px);
        -moz-transform: translateX(-9px);
        transform: translateX(-9px);
        -webkit-transition: all 0.3s ease;
        -moz-transition: all 0.3s ease;
        transition: all 0.3s ease;
    }
    .switch-box .switch:checked~label::before {
        /* 语义：被选中的类名为"switch"元素后面的label元素里的伪类元素，进行更改css样式 */
        /* 形成伪类结构选择器：":"冒号加布尔值"checked" */
        /* " Ele1 ~ Ele2 "波浪号在css的作用：连接的元素必须有相同的父元素，选择出现在Ele1后的Ele2（但不必跟在Ele1，也就是说可以并列）  */
        -webkit-transform: translateX(9px);
        -moz-transform: translateX(9px);
        transform: translateX(9px);
    }
    .switch-box label::after {
        /* after设置滚动前背景色 */
        content: "";
        display: block;
        border-radius: 10px;
        height: 20px;
        background-color: #dcdfe6;
        -webkit-transition: all 0.3s ease;
        -moz-transition: all 0.3s ease;
        transition: all 0.3s ease;
    }
    .switch-box .switch:checked~label::after {
        background-color: #409eff;
    }
    .push_button {
        position: relative;
        width:100%;
        height:40px;
        text-align:center;
        color:#FFF;
        text-decoration:none;
        line-height:43px;
        font-family:'Oswald', Helvetica;
    }
    

    .push_button:before {
        background:#f0f0f0;
        background-image:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#D0D0D0), to(#f0f0f0));
        
        -webkit-border-radius:5px;
        -moz-border-radius:5px;
        border-radius:5px;
        
        -webkit-box-shadow:0 1px 2px rgba(0, 0, 0, .5) inset, 0 1px 0 #FFF; 
        -moz-box-shadow:0 1px 2px rgba(0, 0, 0, .5) inset, 0 1px 0 #FFF; 
        box-shadow:0 1px 2px rgba(0, 0, 0, .5) inset, 0 1px 0 #FFF;
        
        position: absolute;
        content: "";
        left: -6px; right: -6px;
        top: -6px; bottom: -10px;
        z-index: -1;
    }
    .push_button[disabled]{
        cursor:not-allowed;
    }

    .push_button[disabled]{
        cursor:not-allowed;
    }
    
    .pbtn:active {
        -webkit-box-shadow:0 1px 0 rgba(255, 255, 255, .5) inset, 0 -1px 0 rgba(255, 255, 255, .1) inset;
        top:5px;
    }
    .pbtn:active:before{
        top: -11px;
        bottom: -5px;
        content: "";
    }
    
    .red {
        text-shadow:-1px -1px 0 #A84155;
        background: #D25068;
        border:1px solid #D25068;
        
        background-image:-webkit-linear-gradient(top, #F66C7B, #D25068);
        background-image:-moz-linear-gradient(top, #F66C7B, #D25068);
        background-image:-ms-linear-gradient(top, #F66C7B, #D25068);
        background-image:-o-linear-gradient(top, #F66C7B, #D25068);
        background-image:linear-gradient(to bottom, #F66C7B, #D25068);
        
        -webkit-border-radius:5px;
        -moz-border-radius:5px;
        border-radius:5px;
        
        -webkit-box-shadow:0 1px 0 rgba(255, 255, 255, .5) inset, 0 -1px 0 rgba(255, 255, 255, .1) inset, 0 4px 0 #AD4257, 0 4px 2px rgba(0, 0, 0, .5);
        -moz-box-shadow:0 1px 0 rgba(255, 255, 255, .5) inset, 0 -1px 0 rgba(255, 255, 255, .1) inset, 0 4px 0 #AD4257, 0 4px 2px rgba(0, 0, 0, .5);
        box-shadow:0 1px 0 rgba(255, 255, 255, .5) inset, 0 -1px 0 rgba(255, 255, 255, .1) inset, 0 4px 0 #AD4257, 0 4px 2px rgba(0, 0, 0, .5);
    }
    
    .red:hover {
        background: #F66C7B;
        background-image:-webkit-linear-gradient(top, #D25068, #F66C7B);
        background-image:-moz-linear-gradient(top, #D25068, #F66C7B);
        background-image:-ms-linear-gradient(top, #D25068, #F66C7B);
        background-image:-o-linear-gradient(top, #D25068, #F66C7B);
        background-image:linear-gradient(top, #D25068, #F66C7B);
    }
    
    .blue {
        text-shadow:-1px -1px 0 #2C7982;
        background: #3EACBA;
        border:1px solid #379AA4;
        background-image:-webkit-linear-gradient(top, #48C6D4, #3EACBA);
        background-image:-moz-linear-gradient(top, #48C6D4, #3EACBA);
        background-image:-ms-linear-gradient(top, #48C6D4, #3EACBA);
        background-image:-o-linear-gradient(top, #48C6D4, #3EACBA);
        background-image:linear-gradient(top, #48C6D4, #3EACBA);
        
        -webkit-border-radius:5px;
        -moz-border-radius:5px;
        border-radius:5px;
        
        -webkit-box-shadow:0 1px 0 rgba(255, 255, 255, .5) inset, 0 -1px 0 rgba(255, 255, 255, .1) inset, 0 4px 0 #338A94, 0 4px 2px rgba(0, 0, 0, .5);
        -moz-box-shadow:0 1px 0 rgba(255, 255, 255, .5) inset, 0 -1px 0 rgba(255, 255, 255, .1) inset, 0 4px 0 #338A94, 0 4px 2px rgba(0, 0, 0, .5);
        box-shadow:0 1px 0 rgba(255, 255, 255, .5) inset, 0 -1px 0 rgba(255, 255, 255, .1) inset, 0 4px 0 #338A94, 0 4px 2px rgba(0, 0, 0, .5);
    }
    
    .blue:hover {
        background: #48C6D4;
        background-image:-webkit-linear-gradient(top, #3EACBA, #48C6D4);
        background-image:-moz-linear-gradient(top, #3EACBA, #48C6D4);
        background-image:-ms-linear-gradient(top, #3EACBA, #48C6D4);
        background-image:-o-linear-gradient(top, #3EACBA, #48C6D4);
        background-image:linear-gradient(top, #3EACBA, #48C6D4);
    }

    .gray {
        background: gray;
        border:1px solid #CCC;
       
        -webkit-border-radius:5px;
        -moz-border-radius:5px;
        border-radius:5px;
    }