﻿/*公用链接样式-开始*/
a {
    color: #448fb9;
    text-decoration: none;
}

    a:visited {
        text-decoration: none;
    }

    a:hover {
        text-decoration: none;
    }
/*公用链接样式-结束*/

/*样式-开始*/
html, body {
    width: 100%;
    height: 100%;
    color: #fff;
    font-size: 14px;
    min-width: 320px;
}

.bg01 {
    width: 100%;
    height: 50%;
    background: #448fb9;
}

.bg02 {
    width: 100%;
    height: 48%;
    background: #edebec;
}

.con {
    width: 500px;
    height: 430px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -250px;
    margin-top: -255px;
    /*font-size:16px;*/
}

    .con h1 {
        font-size: 2.1em;
        text-align: center;
        margin-bottom: 80px;
    }

.logo {
    width: 220px;
    max-width: 220px;
    height: auto;
    padding: 15px;
}

    .logo img {
        width: 100%;
    }

.login {
    width: 500px;
    height: 260px;
    /*box-shadow: 0px 0px 10px #aaa;*/
    margin: 0 auto;
    border-radius: 3px;
    overflow: hidden;
    position: relative;
}
/*login-top*/

.login-top {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: #FFFFFF;
    z-index: 1;
}

.login-bottom {
    width: 100%;
    height: 100%;
    font-size: 12px;
    position: absolute;
    top: 0;
    left: 0;
    background: url(../images/sk_bg.png) 0 0 no-repeat #fff;
    display: none;
}

.login-top .head {
    width: 100%;
    height: 50px;
    margin-top: 16px;
    text-align: center;
}

.head .h_left {
    width: 190px;
    height: 50px;
    background: url(../images/login_pic2.png) right 0 no-repeat;
    float: left;
}

.head .h_right {
    width: 190px;
    height: 50px;
    background: url(../images/login_pic3.png) 0 0 no-repeat;
    float: right;
}

.head .h_center {
    width: 50px;
    height: 50px;
    background: url(../images/login_pic1.png);
    display: inline-block;
    border-radius: 100%;
    background-size: 100% 100%;
}

.login-top p {
    width: 100%;
    height: 20px;
    margin-top: 20px;
    margin-bottom: 44px;
    text-align: center;
}

.login-top .password {
    margin-top: 0px;
    margin-bottom: 10px;
}

.login-top .login_ts {
    font-size: 12px;
    color: #666;
    line-height: 18px;
    margin: 0 0;
}

    .login-top .login_ts input {
        width: 18px;
        height: 18px;
        display: inline;
    }

    .login-top .login_ts span {
        background: url(../images/login_pic9.png) 0 0 no-repeat;
        padding-left: 25px;
        margin-left: 40px;
        display: none;
    }

.login-top p input:focus {
    border-bottom: 1px solid #01a4ef;
}

.login-top p input:hover {
    border-bottom: 1px solid #999;
}

.login-top p input {
    border: none;
    font-size: 14px;
    width: 346px;
    border-bottom: 1px solid #c7c7c7;
    vertical-align: top;
    margin-left: 15px;
    letter-spacing: 2px; /*词间距*/
    padding-left: 0px;
}

.btn {
    text-align: center;
    margin-top: 15px;
}

    .btn input {
        border: none;
        width: 68px;
        height: 28px;
        background: #45ade8;
        border-radius: 3px;
        font-size: 12px;
        color: #fff;
        cursor: pointer;
    }

        .btn input:hover {
            background: #1a90d3;
        }

    .btn .reset {
        margin-right: 30px;
        background: #4caf50;
    }

        .btn .reset:hover {
            background: #2f9133;
        }

/*login-bottom*/

.login-bottom p {
    width: 100%;
    height: 30px;
    background: #3aa6e4;
    line-height: 30px;
    font-size: 12px;
    padding-left: 10px;
}

.login-bottom span {
    cursor: pointer;
    float: right;
    color: #666;
    margin-right: 15px;
    margin-top: 205px;
    height: 13px;
    line-height: 13px;
    background: url(../images/login_icon.png) left -119px no-repeat;
    padding-left: 17px;
}

    .login-bottom span:hover {
        color: #2f9ddc;
        background: url(../images/login_icon.png) left -102px no-repeat;
    }

.login-bottom input {
    border: none;
}

.footer {
    width: 100%;
    text-align: center;
    font-size: 12px;
    line-height: 15px;
    margin-top: 25px;
    overflow: hidden;
}

    .footer .f_margin {
        background: url(../images/login_pic6.png) 0 -15px no-repeat;
        padding-left: 20px;
        color: #333;
        margin-left: 10px;
    }

    .footer .zc {
        background: url(../images/login_pic6.png) 0 0 no-repeat;
        padding-left: 20px;
        color: #333;
    }

    .footer .sk, .footer .yu, .footer .image, .footer .code {
        margin: 0 4px;
        padding-left: 25px;
        color: #333;
        display: none;
    }

    .footer a:hover {
        color: #2f9ddc;
    }

.upload {
    box-sizing: border-box;
    cursor: pointer;
    left: 70px;
    opacity: 0;
    position: relative;
    top: 0;
    width: 72px;
    z-index: 1;
}

.footer2 {
    width: 100%;
    text-align: center;
    font-size: 12px;
    line-height: 15px;
    margin-top: 25px;
    display: none;
    overflow: hidden;
}

    .footer2 .f_margin {
        padding-left: 20px;
    }

    .footer2 .zc {
        padding-left: 20px;
    }

    .footer2 .xt, .footer2 .sk, .footer2 .image, .footer2 .code {
        margin: 0 4px;
        padding-left: 17px;
        color: #333;
        display: none;
    }

    .footer2 a:hover {
        color: #2f9ddc;
    }

.inputHover:hover {
    border-bottom: 1px solid #01a4ef;
}

.logintype {
    float: left;
    width: 140px;
}

.loginTab {
    text-align: right;
}
/*域用户登录*/
.login-yuyonghu {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: #FFFFFF;
    z-index: 1;
    display: none;
}

    .login-yuyonghu .head {
        width: 100%;
        height: 50px;
        margin-top: 16px;
        text-align: center;
    }

/*扫码登录*/

.codeQR {
    width: 100%;
    height: 100%;
    background: #fff;
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    text-align: center;
}

.codeTitle {
    color: #333;
    margin-top: 15px;
}

.normal_block {
    display: block;
}

.succeed_block {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    display: none;
}

.succeed_block-title {
    padding: 20px;
    color: #333;
}

    .succeed_block-title label {
        width: 120px;
        margin: 0 auto;
        font-size: 20px;
        display: block;
        color: #333;
        text-align: center;
        padding-left: 15px;
    }

    .succeed_block-title span {
        margin-top: 10px;
        font-size: 14px;
        display: block;
        color: #666;
        text-align: center;
    }

.succeed_block-icon {
    width: 95px;
    height: 95px;
    background: url("../images/login_icon.png") 0 -136px no-repeat;
    margin: 0 auto;
    margin-top: 35px;
}

.fail_block_icon {
    width: 95px;
    height: 95px;
    background: url("../images/login_icon.png") 0 -231px no-repeat;
    margin: 0 auto;
    margin-top: 35px;
}

.codebox {
    display: inline-block;
    width: 120px;
    height: 125px;
    border: 1px solid #ccc;
    padding: 5px;
    position: relative;
}

.imgOnediv {
    position: absolute;
    width: 32px;
    height: 32px;
    background: #f5f5f5;
    display: none;
    border: 1px solid #ccc;
    border-radius: 2px;
    top: 50%;
    left: 50%;
    margin-left: -16px;
    margin-top: -16px;
}

.tishibox {
    height: 166px;
    background: url("../images/code.png") center 24px no-repeat;
    background-size: 100%;
    display: inline-block;
    position: relative;
}

.lineBlock {
    width: 56px;
    height: 56px;
    position: absolute;
    opacity: 0.4;
    top: 96px;
    left: 35px;
    display: none;
}

.lineBlock_line {
    width: 56px;
    height: 2px;
    background: url("../images/line.png") 0 0 no-repeat;
    position: absolute;
    top: -2px;
    left: 0;
    animation: myanimation 1.5s linear 0s infinite;
    -o-animation: myanimation 1.5s linear 0s infinite;
    -webkit-animation: myanimation 1.5s linear 0s infinite;
    -moz-animation: myanimation 1.5s linear 0s infinite;
}

.tierBlock {
    width: 380px;
    height: 195px;
    position: absolute;
    top: 35px;
    left: 60px;
    display: none;
}

@keyframes myanimation {
    0% {
        top: -2px;
    }

    100% {
        top: 56px;
    }
}

@-webkit-keyframes myanimation {
    0% {
        top: -2px;
    }

    100% {
        top: 56px;
    }
}

@-moz-keyframes myanimation {
    0% {
        top: -2px;
    }

    100% {
        top: 56px;
    }
}

@-o-keyframes myanimation {
    0% {
        top: -2px;
    }

    100% {
        top: 56px;
    }
}

/*扫码动画*/

/*登录方式icon*/

.code {
    padding-left: 17px;
    background: url('../images/login_icon.png') left -34px no-repeat;
}

    .code:hover {
        background: url('../images/login_icon.png') left -51px no-repeat;
    }

.image {
    padding-left: 17px;
    background: url('../images/login_icon.png') left 0 no-repeat;
}

    .image:hover {
        background: url('../images/login_icon.png') left -17px no-repeat;
    }

.yu {
    padding-left: 17px;
    background: url('../images/login_icon.png') left -68px no-repeat;
}

    .yu:hover {
        background: url('../images/login_icon.png') left -85px no-repeat;
    }

.xt {
    padding-left: 23px;
    background: url('../images/login_icon.png') left -119px no-repeat;
    color: #333;
}

    .xt:hover {
        background: url('../images/login_icon.png') left -102px no-repeat;
    }

.face {
    padding-left: 23px;
    background: url('../images/face.png') left 0 no-repeat;
    color: #333;
    display: none;
}

    .face:hover {
        background: url('../images/face.png') left -17px no-repeat;
    }

.fancyInput {
    width: 346px;
    text-align: left;
    display: inline-block;
    letter-spacing: -1px;
    text-shadow: 0 2px 5px rgba(0, 0, 0, 0.6);
    white-space: nowrap;
    position: relative;
    /* only Caret which is  */
    /* lettes */
    /*.fancyInput > div span:last-of-type ~ br{ display:block; white-space:pre; }*/
    /*.fancyInput br:last-of-type + .caret{ position:static; display:inline-block; }*/
    /* text effects */
}



/*样式-结束*/

.head .h_center2 {
    width: 49px;
    height: 49px;
    background: url(../images/fangge.png);
    display: inline-block;
}

.kong {
    width: 100%;
    height: 35px;
}

.yuyonghu_down {
    width: 345px;
    margin: 0 auto;
}

.yuyonghu_downLeft {
    width: 90px;
    float: left;
}

.yuyonghu_downRight {
    width: 255px;
    height: 110px;
    float: left;
}

.input1 {
    width: 220px;
    height: 26px;
    padding-left: 10px;
    margin-bottom: 7px;
    border: 1px solid #c7c7c7;
}

.input2 {
    width: 194px;
    height: 26px;
    padding-left: 10px;
    float: left;
    border: 1px solid #c7c7c7;
    font-size: 14px;
}

.jiantou {
    width: 26px;
    height: 28px;
    line-height: 28px;
    background: #5e5e5e;
    float: left;
    display: block;
    cursor: pointer;
    color: #fff;
    text-align: center;
}

    .jiantou:hover {
        background: #019eeb;
    }

.input1:hover {
    border: 1px solid #999;
}

.input2:hover {
    border: 1px solid #999;
}

.input1:focus {
    border: 1px solid #01a4ef;
}

.input2:focus {
    border: 1px solid #01a4ef;
}

.wenzi {
    width: 110%;
    height: 25px;
    color: red;
    font-size: 12px;
    float: left;
    margin-top: 7px;
}

/* ------弹框----------- */
.tankuang {
    display: none;
    width: 760px;
    padding: 4px 20px 10px;
    background-color: #FFFFFF;
    border: 1px solid #05549d;
    color: #333333;
    line-height: 24px;
    text-align: left;
    -webkit-box-shadow: 5px 2px 6px #000;
    -moz-box-shadow: 3px 3px 6px #555;
    border-radius: 10px;
}

.tankuang_top {
    width: 94%;
    height: 70px;
    font-size: 25px;
    line-height: 70px;
    border-bottom: 1px solid #c7c7c7;
    color: #666;
    margin: 0 3%;
}

.tishi {
    width: 94%;
    height: 80px;
    line-height: 36px;
    margin: 10px 3% 0 3%;
}

    .tishi span {
        width: 24px;
        height: 20px;
        display: block;
        float: left;
        margin-top: 5px;
        margin-right: 2%;
    }

    .tishi p {
        float: left;
        color: #666;
    }

.tankuang_center {
    width: 400px;
    height: 80px;
    margin: 0 auto;
}

.tankuang_center1 {
    width: 37%;
    float: left;
    color: #666;
}

.tankuang_center2 {
    width: 47%;
    float: left;
    margin-top: 15px;
}

.tankuang_center3 {
    float: left;
    color: #666;
}

.tankuang_down {
    width: 330px;
    height: 200px;
    margin: 0 auto;
}

.yonghuming {
    width: 100%;
    height: 50px;
}

.yonghumingLeft {
    width: 30%;
    height: 50px;
    float: left;
}

    .yonghumingLeft span {
        width: 25px;
        height: 15px;
        float: left;
    }

    .yonghumingLeft p {
        float: left;
        color: #666;
    }

.yonghumingR {
    width: 70%;
    height: 50px;
    float: left;
    position: relative;
}

    .yonghumingR input {
        float: left;
        width: 94%;
        height: 30px;
        padding-left: 10px;
        border: 1px solid #c7c7c7;
    }

        .yonghumingR input:focus {
            border: 1px solid #01a4ef;
        }

        .yonghumingR input:hover {
            border: 1px solid #999;
        }

    .yonghumingR img {
        width: 13px;
        height: 11px;
        position: absolute;
        left: 195px;
        top: 11px;
    }

    .yonghumingR p {
        color: red;
        float: left;
        margin-top: -12px;
        font-size: 12px;
        line-height: 12px;
    }

.yonghuming2 {
    width: 100%;
}

.yonghumingRP, .wenziP, .inputicon {
    visibility: hidden;
    background: rgba(0, 0, 0, 0) url("../images/login_pic9.png") no-repeat scroll 0 0;
    text-indent: 18px;
}

.btn1 {
    text-align: center;
    margin-top: 15px;
}

    .btn1 input {
        border: none;
        width: 95px;
        height: 35px;
        background: #45ade8;
        border-radius: 3px;
        font-size: 12px;
        color: #fff;
        cursor: pointer;
    }

        .btn1 input:hover {
            background: #1a90d3;
        }

.bangding {
    display: none;
    width: 760px;
    min-height: 400px;
    padding: 4px 20px 10px;
    background-color: #FFFFFF;
    border: 1px solid #05549d;
    color: #333333;
    line-height: 24px;
    text-align: left;
    -webkit-box-shadow: 5px 2px 6px #000;
    -moz-box-shadow: 3px 3px 6px #555;
    border-radius: 10px;
}

.bangding_top {
    width: 94%;
    height: 70px;
    font-size: 25px;
    line-height: 70px;
    border-bottom: 1px solid #c7c7c7;
    color: #666;
    margin: 0 3%;
}

.kong2 {
    width: 100%;
    height: 50px;
}

.bangding_down {
    width: 400px;
    height: 140px;
    margin: 0 auto;
}

.bangding_downIn {
    width: 100%;
    height: 100px;
}

.bangding_downLeft {
    width: 26%;
    height: 100px;
    float: left;
}

    .bangding_downLeft img {
        width: 71px;
        height: 71px;
    }

.bangding_downR {
    width: 73%;
    height: 100px;
    float: left;
    margin-top: 12px;
}

    .bangding_downR h2 {
        font-size: 20px;
        color: #666;
    }

    .bangding_downR p {
        font-size: 12px;
        color: #999;
        height: 30px;
        line-height: 30px;
    }

.jinru {
    width: 150px;
    margin: 0 auto;
    text-align: center;
}

    .jinru p {
        font-size: 13px;
        color: #666;
    }

.btn2 {
    text-align: center;
    margin-top: 5px;
}

    .btn2 input {
        border: noneimage width: 95px;
        height: 35px;
        background: #45ade8;
        border-radius: 3px;
        font-size: 12px;
        color: #fff;
        cursor: pointer;
    }

        .btn2 input:hover {
            background: #1a90d3;
        }

.userfontsize {
    height: 22px;
}

.codebox table {
    margin: 3px auto 0;
}

#loadchange {
    animation: transformfirst 0.1s linear infinite;
    /* Firefox: */
    -moz-animation: transformfirst 0.1s linear infinite;
    /* Safari and Chrome: */
    -webkit-animation: transformfirst 0.1s linear infinite;
    /* Opera: */
    -o-animation: transformfirst 0.1s linear infinite;
}

@keyframes transformfirst {
    0% {
        transform: rotate(0deg);
    }

    50% {
        transform: rotate(180deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

@-moz-keyframes transformfirst /* Firefox */
{
    0% {
        -moz-transform: rotate(0deg);
    }

    50% {
        -moz-transform: rotate(180deg);
    }

    100% {
        -moz-transform: rotate(360deg);
    }
}

@-webkit-keyframes transformfirst /* Safari and Chrome */
{
    0% {
        -webkit-transform: rotate(0deg);
    }

    50% {
        -webkit-transform: rotate(180deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
    }
}

@-o-keyframes transformfirst /* Safari and Chrome */
{
    0% {
        -o-transform: rotate(0deg);
    }

    50% {
        -o-transform: rotate(180deg);
    }

    100% {
        -o-transform: rotate(360deg);
    }
}


/*--------------------------------------------响应式-开始---------------------------------------------------------------*/

@media screen and (max-width: 768px) {

    .logo {
        width: 160px;
        margin: 0 auto;
    }
}

@media screen and (max-width:760px) {
    .tankuang {
        width: 100%;
    }

    .bangding {
        width: 100%;
    }
}

@media screen and (max-width: 500px) {
    .con h1 {
        font-size: 2em;
    }

    .con {
        width: 96%;
        margin-left: -48%;
    }

    .login {
        width: 100%;
    }

    .login-top .head {
        width: 100%;
    }

    .head .h_left {
        width: 160px;
    }

    .head .h_right {
        width: 160px;
    }

    .login-top p input {
        width: 300px;
    }

    .fancyInput {
        width: calc(100% - 100px);
    }
}

@media screen and (max-width:445px) {
    .logintype {
        float: none;
        width: 100%;
        margin: 5px 0;
    }

    .loginTab {
        text-align: center;
        margin: 10px 0;
    }

    .footer {
        margin-top: 0;
    }
}

@media screen and (max-width:440px) {
}

@media screen and (max-width:415px) {
    .con {
        padding-top: 55px;
    }

        .con h1 {
            font-size: 1.7em;
            margin-bottom: 50px;
        }

    .login-top p input {
        width: 250px;
    }

    /*.fancyInput {
        width: 250px;
    }*/

    .login-top .head {
        height: 40px;
        margin-top: 16px;
    }

    .head .h_center {
        width: 40px;
        height: 40px;
        background: url(../images/login_pic1-1.png);
    }

    .head .h_left {
        width: 150px;
        height: 40px;
        background: url(../images/login_pic2.png) right center no-repeat;
    }

    .head .h_right {
        width: 150px;
        height: 40px;
        background: url(../images/login_pic3.png) 0 center no-repeat;
    }

    .login-yuyonghu .head {
        height: 40px;
        margin-top: 16px;
    }

    .head .h_center2 {
        width: 41px;
        height: 40px;
        background: url(../images/fangge2.png);
    }

    .tankuang_center {
        width: 90%;
    }

    .tankuang_center1 {
        width: 34%;
        float: left;
        color: #666;
    }

    .tankuang_center2 {
        width: 44%;
        float: left;
        margin-top: 15px;
    }
}

@media screen and (max-width:386px) {
    .con h1 {
        font-size: 1.2em;
        margin-top: 40px;
    }

    .head .h_left {
        width: 120px;
    }

    .head .h_right {
        width: 120px;
    }

    .login-top p input {
        width: 209px;
    }

    .fancyInput {
    }

    .logintype {
        width: 100%;
    }

    .login-top .login_ts span {
        margin-left: 10px;
    }

    .login-top p {
        margin-bottom: 30px;
    }

    .login-top .password {
        margin-bottom: 25px;
    }
}

@media screen and (max-width:380px) {
    .yuyonghu_down {
        margin: 0 30px;
    }

    .input1 {
        width: 190px;
        height: 26px;
        padding-left: 10px;
        margin-bottom: 7px;
    }

    .input2 {
        width: 165px;
        height: 26px;
        padding-left: 10px;
        float: left;
    }

    .wenzi {
        width: 80%;
        height: 45px;
        color: red;
        font-size: 12px;
        float: left;
        margin-top: 7px;
    }

    .tishi p {
        font-size: 14px;
    }

    .kong {
        height: 50px;
    }

    .yuyonghu_downRight {
        width: 235px;
    }

    .bangding_down {
        width: 92%;
    }
}

@media screen and (max-width:340px) {
    .yonghumingR input {
        width: 80%;
    }

    .yonghumingR img {
        width: 13px;
        height: 11px;
        position: absolute;
        left: 170px;
        top: 11px;
    }

    .bangding_downR h2 {
        font-size: 18px;
    }
}

@media screen and (max-width:320px) {
    .input1 {
        width: 135px;
        height: 26px;
        padding-left: 10px;
        margin-bottom: 7px;
    }

    .input2 {
        width: 110px;
        height: 26px;
        padding-left: 10px;
        float: left;
    }

    .wenzi {
        width: 68%;
        height: 45px;
        color: red;
        font-size: 12px;
        float: left;
        margin-top: 7px;
    }

    .tishi p {
        font-size: 13px;
    }

    .tankuang_center1 {
        width: 30%;
    }

    .yonghumingR img {
        left: 165px;
    }

    .tankuang_down {
        width: 90%;
    }

    .yonghumingR input {
        width: 92%;
    }

    .con h1 {
        margin: 70px 0 30px 0;
    }
}

@media screen and (max-width: 260px) {
    .con h1 {
        /*font-size: 17px;*/
        margin-bottom: 30px;
    }

    .con {
        padding-top: 125px;
    }

    .login {
        height: 180px;
    }

    .login-top .head {
        display: none;
    }

    .login-top .password {
        margin-bottom: 15px;
    }

    .btn {
        margin-top: 10px;
    }

    .footer {
        margin-top: 20px;
    }

        .footer .f_margin {
        }
}
/*--------------------------------------------响应式-结束------------------------------------------*/


