.login{background: #eeeeee;padding:80px 0px;}
.login .ln{background:url(../img/login_back.png);background-size: cover;max-width: 1180px;margin: 0 auto;height: 420px;}
.login .ln .mInfo{height: 480px;background: #fff;width: 40%;position: relative;left: 10%;top: -30px;float: left;box-shadow: 0 3px 8px 1px #c9c9c9;}
.login .ln .mInfo #login{ text-align:center;}
.login .ln .mInfo #login center{font-size: 32px;padding: 40px 0;}
.login .ln .mInfo #login input{padding: 12px 8px;width: 70%;margin-bottom: 20px;border: 1px solid #cccacb;}
.login .ln .mInfo #login .code{width: 49%;}
.login .ln .mInfo #login img{border: 1px solid #ccc;position: relative; top: -10px; padding: 10px 20px;border-left: none;}
.login .ln .mInfo #login .but input{font-size:18px;width: 73%;}
.login .ln .mInfo #login .but a{color: #2283e7;font-size: 14px;}
.login .ln .lg_r{float: right;position: relative;text-align: center;width: 50%;top: 80px;}
.login .ln .lg_r div{font-size:32px;color:#fff;margin-bottom: 20px;}
.login .ln .lg_r a{color: #fff;border: 1px solid #fff;font-size: 22px;padding: 10px 25px;}

.advantage_box{margin-top: 40px;}
.advantage_box li{color: #fff;font-size: 12px;}
.advantage_box li img{display: inline-block;height: 20px;}
.advantage_box li .advantage_icon{color: yellow;font-size: 14px;}

@media screen and (max-width: 768px){
	.login .ln .lg_r div{font-size: 26px;}
	.login .ln .lg_r a{font-size: 18px;}
	.login .ln .mInfo #login img{top: -10px;padding: 13px 4px;}	
}
@media screen and (max-width: 767px){
	.login{padding:0;}
	#top,#topM,#bottom{display:none;}
	.login,.login .ln{ background:#fff;}
	.login .ln .hotu{padding:10px;}
	.login .ln .mInfo{width: 100%;left: 0;box-shadow: initial;top: 50px;}
	.login .ln .mInfo #login input{padding: 15px 8px;width: 75%;}
	.login .ln .lg_r{width: 100%;position: absolute;bottom: 0;top: initial;background: #333333;color: #fff; padding: 15px 0px;}
	.login .ln .lg_r div{font-size: 16px;margin: 0 10px 0 10px;float: left;width: 55%;text-align: right;}
	.login .ln .lg_r a{font-size: 16px;padding: 0;border: none;float:left;}
    .login .ln .mInfo #login .code{width: calc(75% - 65px);}
    .login .ln .mInfo #login .but input{width: 77%;}
}
@media screen and (max-width: 414px){
	.login{padding:0;}
	#top,#bottom,#menufix{display:none;}
	.login,.login .ln{ background:#fff;}
	.login .ln .hotu{padding:10px;}
	.login .ln .mInfo{width: 100%;left: 0;box-shadow: initial;top: 20px;}
	.login .ln .mInfo #login input{padding: 12px 8px;width: 75%;}
	.login .ln .lg_r{width: 100%;position: absolute;bottom: 0;top: initial;background: #333333;color: #fff; padding: 15px 0px;}
	.login .ln .lg_r div{font-size: 16px;margin: 0 5px;float: left;width: 50%;text-align: right;}
	.login .ln .lg_r a{font-size: 16px;padding: 0;border: none;float:left;text-decoration: underline;}
	.login .ln .mInfo #login center{font-size: 32px;padding: 20px 0;line-height: 1.2;}
    .login .ln .mInfo #login img{padding: 10px 4px;}
    .login .ln .mInfo #login .but input{width: 79%;}
}
@media screen and (max-width: 375px){
	.login .ln .lg_r div{
		width: 52%;
	}
}
@media screen and (max-width: 320px){
	.login .ln .mInfo{top:0;}
	.login .ln .lg_r{padding: 8px 0;}
	.login .ln .lg_r div{float: none;width: auto;text-align: center;}	
	.login .ln .lg_r div,.login .ln .lg_r a{font-size:14px;float: none;}
	.login .ln .mInfo #login .but input{padding: 10px 8px;}
}