﻿html,body{
    height: 100%;
}
html,body,nav,ul,li,h2,h3,figure,h1,p,section,dl,dd,dt{padding:0px;margin:0px;}
html {font-family: "Microsoft Yahei","Helvetica Neue",Helvetica,STHeiTi,Arial,sans-serif;-ms-text-size-adjust: 100%;-webkit-text-size-adjust: 100%;font-size: 16px;}
body{min-width:320px;}
img {border: 0;display: block;}
a{text-decoration: none;}
ul{list-style: none;}
.left{float: left;}
.right{float: right;}
.block{display: block;}
input{outline: none;}
.clear {clear: both;margin: 0px;padding: 0px;display: block;}
.hide{display: none;}
.noindent{text-indent: 0!important;}

.login{position: fixed;left: 0;right: 0;top: 0;bottom: 0;background: url(../png/1.jpg) no-repeat;background-size: cover;}
.login .logo{position: absolute;left: 2rem;top: 2rem;width: 6rem;}
.login .logo img{width: 100%;}
.login .footer{position: absolute;right: 4rem;bottom: 2rem;color: #fff;font-size: 1.5rem;}
@media (min-width: 769px) {
    .login .box {
        position: absolute;
        left: 50%;
        top: 10%;
        width: 30rem;
        margin-left: -15rem;
        background: #fff;
        border-radius: 10px;
        overflow: hidden;
    }
}
.login .box .ins{margin: 0 1rem 1rem;}
.login .box .ins p.title{font-size: 1.25rem;text-align: center;border-bottom: 1px solid #eeeeef;margin-bottom: 1rem;line-height: 3rem;color: #00d2b3;}
.login .box .ins .input-group2{background: #eeeeef;padding: 0.5rem;border-radius: 6px;margin-bottom: 1rem;position: relative;display: block;}
.login .box .ins .input-group2 img{width: 1.5rem;margin: 0.25rem 0;}
.login .box .ins .input-group2 .psd{cursor: pointer;}
.login .box .ins .input-group2 input{width: 21rem;margin: 0 1rem;border: 0;height: 2rem;outline: none;background: none;}
.login .box .ins .code{margin-bottom: 1rem;}
.login .box .ins .code>input{float: left;width: 13.5rem;border: 1px solid #c8c9ca;border-radius: 6px;height: 3rem;padding: 0 1rem;}
.login .box .ins .code .incode{border-radius: 6px;overflow: hidden;float: right;border: 1px solid #c8c9ca;height: 3rem;}
.login .box .ins .code .incode .left{width: 10.5rem;height: 3rem;border-right: 1px solid #c8c9ca;}
.login .box .ins .code .incode .left img{max-width: 100%;max-height: 100%;}
.login .box .ins .code .incode .right{width: 3rem;}
.login .box .ins .code .incode .right img{width: 1.75rem;margin: 10px auto 0;cursor: pointer;}
.login .box .ins .pas{margin-bottom: 1rem;}
.login .box .ins .pas .left input{border: 1px solid #c8c9ca;border-radius: 6px;width: 1.5rem;height: 1.5rem;color: #717071;vertical-align: middle;}
.login .box .ins .pas .right a{color: #00d2b3;}
.login .box .ins .submit{cursor: pointer;display: block;height: 3rem;line-height: 3rem;color: #fff;text-align: center;background: url(../png/9.png) repeat-x;background-size: auto 100%;border-radius: 6px;}


@media (max-width: 768px) {
    .login .logo {
        display: none;
    }

    .login .footer {
        display: none;
    }

    .login .box {
        margin: 1rem;
        background: #fff;
        border-radius: 10px;
        display: inline-block;
    }

    .login .box .ins .input-group2 input {
        width: calc(100% - 5rem);
    }

    .login .box .ins .code > input {
        width: 100%;
        margin-bottom: 1rem;
    }
}