html{ height: 100%;}
*,body{ margin:0; padding:0; font-family:"Microsoft YaHei"; }
::-webkit-input-placeholder { color:#a9a9a9; }
:-moz-placeholder { color:#a9a9a9; }
::-moz-placeholder { color:#a9a9a9; }
:-ms-input-placeholder { color:#a9a9a9; }
body{ background: url(../images/bg.jpg) center center no-repeat #4381eb; color:#333333; line-height:1.75; font-size:14px;}
img,a img,a:hover img{ border:0; }
input,button,textarea,select,optgroup,option{ font-family:"Microsoft YaHei";}
:focus{outline:0;}
a{color:#333333; text-decoration:none; }
a:hover{color:#2d63ed; text-decoration: underline; }
a,a:hover{ transition:all 300ms ease; }

.wrap { }

.login_main { position: fixed; left: 50%; top: 50%; width: 960px; height: 560px; background: #fff; box-shadow: 0 0 40px rgba(22,68,150,0.4); border-radius: 20px; margin-left: -480px; margin-top: -280px;}

.login_left{ float: left; width: 460px; padding-top: 100px;}
.login_left img { display: block; height: 360px; margin: 0 auto; }

.login_box { float: right; width: 360px; padding-top: 100px; padding-right: 125px;}
.login_box .tit{ height: 80px; line-height: 52px; font-size: 24px; letter-spacing: 5px; text-align: center; }
.login_box .item { margin-bottom:20px; border-bottom: 1px #dadffb solid; position:relative;}
.login_box .item .input{ display:block; width:100%; background:none; height:40px; line-height:40px; text-indent:38px; font-size: 16px; color: #333; border:none; }
.login_box .item i{ position: absolute; left: 0; top: 50%; width: 28px; height: 28px; margin-top: -14px; }
.login_box .item i.b1 { background: url(../images/b1.png) center center no-repeat;}
.login_box .item i.b2 { background: url(../images/b2.png) center center no-repeat;}
.login_box .item i.b3 { background: url(../images/b3.png) center center no-repeat;}
.login_box .item .code_img { display: block; position: absolute; right: 0; top: -4px; }
.login_box .item .code_img img { display: block; height: 40px;}
.btnbox { padding-top: 40px; }
.btnbox .btn{ display:block; width:100%; height:48px; line-height:48px; text-align:center; color:#fff; font-size:20px; cursor:pointer; border:none; background:#4f93fe; border-radius: 24px; font-weight: bold; letter-spacing: 2px; box-shadow: 0 0 30px rgba(41,55,184,0.3); }
.btnbox .btn:hover{ background: #4fbafe; color:#fff; }


@media only screen and (max-width: 1600px){
body { font-size: 12px; background-size: cover;}

.login_main { width: 720px; height: 420px; box-shadow: 0 0 30px rgba(22,68,150,0.4); border-radius: 15px; margin-left: -360px; margin-top: -210px;}

.login_left{ width: 345px; padding-top: 75px;}
.login_left img { height: 270px; }

.login_box { width: 270px; padding-top: 75px; padding-right: 92px;}
.login_box .tit{ height: 60px; line-height: 38px; font-size: 18px; letter-spacing: 4px; }
.login_box .item { margin-bottom:15px;}
.login_box .item .input{ height:30px; line-height:30px; text-indent:28px; font-size: 12px; }
.login_box .item i{ width: 22px; height: 22px; margin-top: -11px; }
.login_box .item i.b1 { background-size: 22px auto;}
.login_box .item i.b2 { background-size: 22px auto;}
.login_box .item i.b3 { background-size: 22px auto;}
.login_box .item .code_img { top: -3px; }
.login_box .item .code_img img { height: 30px;}
.btnbox { padding-top: 30px; }
.btnbox .btn{ height:36px; line-height:36px; font-size:15px; border-radius: 18px; box-shadow: 0 0 22px rgba(41,55,184,0.3); }
}