/*@import url(https://fonts.googleapis.com/css?family=Raleway:400,700,500);*/
body {
 /* padding-top: 100px;*/
  background:rgba(201,230,237,1.0);
  font-family:Microsoft Yahei, Arial, sans-serif, PingFang SC;
  font-weight: 400;
  color: rgba(0,0,0,1.0);
  line-height: 26px;
}
textarea{ resize:none; }
img{ border:none; }
h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: 600;
  font-family:Microsoft Yahei, Arial, sans-serif, PingFang SC;
}
a {
  color: rgba(22,161,188,1.0);
  -webkit-transition: color 400ms, background-color 400ms;
  -moz-transition: color 400ms, background-color 400ms;
  -o-transition: color 400ms, background-color 400ms;
  transition: color 400ms, background-color 400ms;
}
a:hover,
a:focus {
  text-decoration: none;
  color: rgba(62,183,192,1.0);
}

/*kirinsun edit*/

/*主体*/
main{ width:100%; height:auto; padding: 0; margin: 0; background:rgba(201,230,237,1.0); overflow-y: scroll; }
main>section >.container { width:100%; height:auto; min-height:calc(100vh - 40px); display: flex; flex-flow: row nowrap; align-items: center; justify-content: center; padding: 0; margin: 0 auto; box-sizing: border-box; background:rgba(201,230,237,1.0); }
	
.login-main-box{ position: relative; display: block; clear: both; width:1024px/*1200pxcalc((100vh - 180px) * 1.8987)*/; height:540px/*632pxcalc(100vh - 180px)*/; padding:0; margin:0; text-align: center; box-sizing: border-box; background: url(../images/user/user_log@2x.png) no-repeat 50% 0; background-size: 100% auto; }

/*登录*/ 
.login-component-box{ position: absolute; right:10px; top:-50px; display:inline-block; width:530px/*580pxcalc(((100vh - 180px) * 1.8987) * 0.5266)*/; height:640px/*calc(100vh - 80px)*/; padding:30px; margin:0; text-align: center; box-sizing: border-box; }
.login-component{ display:inline-block; width:100%; height:100%; padding:70px; margin:0; text-align: center; background:rgba(255,255,255,1.0); box-shadow: 0 0 20px rgba(0,147,161,0.25); border: 0; border-radius: 0; box-sizing: border-box; }
.login-component .login-title{ display:inline-block; clear: both; width:100%; height: auto; padding: 0; margin: 0 auto; text-align: center; overflow: hidden; }
.login-component .login-title h4,
.login-component .login-title p{ display: block; clear: both; width:100%; height: auto; padding: 0; margin: 0 auto; text-align: left; font-size: 1.5em; font-weight: normal; color:rgba(0,0,0,1.0); letter-spacing: 0.1em; overflow: hidden; box-sizing: border-box; }
.login-component .login-title h4{ font-size: 3em; padding: 0.1em 0; }

.login-component .login-form{ display:inline-block; clear: both; width:100%; height:auto; padding:3em 0; margin: 0 auto; text-align: center; box-sizing: border-box; overflow: visible; }
.login-component .login-form ul{ display:block; clear: both; width:100%; height: auto; padding: 0; margin: 0 auto; text-align: center; list-style-type: none; }
.login-component .login-form ul li{ display:block; clear: both; width:100%; height: auto; padding: 0; margin:0 auto; text-align: center; list-style-type: none; }
.login-component .login-form ul li .input-wrap{ position: relative; display:block; clear: both; width:100%; height:auto; min-height:70px; padding: 0 0 24px 0; margin:0 auto; text-align: center; overflow:visible; }
.login-component .login-form ul li .input-wrap .inp{ position: relative; z-index: 1; display:inline-block; float: left; width:100%; height:48px; line-height: 48px; padding:0; margin:0; text-align:left; text-indent:50px; background: rgba(255,255,255,1.0); border:1px solid rgba(0,0,0,0.05); box-sizing: border-box; outline: none; overflow: hidden; }
.login-component .login-form ul li .input-wrap .inp:hover{ border:1px solid rgba(0,147,161,0.5); }
.login-component .login-form ul li .input-wrap.err .inp{ border:1px solid rgba(255,0,0,0.5); }

.login-component .login-form ul li .input-wrap .btn-vcode{ position: absolute; z-index: 1; top:0; right: 0; display:inline-block; width: 120px; height:48px; line-height: 48px; padding: 0; margin:0; text-align: center; font-size: 14px; color: rgba(0,147,161,0.8); border:1px solid rgba(0,147,161,0.5); background:rgba(0,147,161,0.05); border-radius:none; outline: none; box-sizing: border-box; text-decoration: none; cursor:pointer;  }
.login-component .login-form ul li .input-wrap .btn-vcode:disabled{ color: rgba(0,0,0,0.3); border:1px solid rgba(0,0,0,0.05); background:rgba(0,0,0,0.03); }
.login-component .login-form ul li .input-wrap .inp.inp-vcode{ width:calc(100% - 130px); }

.login-component .login-form ul li .input-wrap.ico-user::after{ position: absolute; top: 0; left: 0; content: ""; z-index: 2; display: block; width:48px; height: 48px; padding: 0; margin: 0; background: url(../images/user/ico-user_name@2x.png) no-repeat 50% 50%; background-size: auto 50%; }
.login-component .login-form ul li .input-wrap.ico-psw::after{ position: absolute; top: 0; left: 0; content: ""; z-index: 2; display: block; width:48px; height: 48px; padding: 0; margin: 0; background: url(../images/user/ico-password@2x.png) no-repeat 50% 50%; background-size: auto 50%; }
.login-component .login-form ul li .input-wrap.ico-phone::after{ position: absolute; top: 0; left: 0; content: ""; z-index: 2; display: block; width:48px; height: 48px; padding: 0; margin: 0; background: url(../images/user/ico-phone@2x.png) no-repeat 50% 50%; background-size: auto 50%; }
.login-component .login-form ul li .input-wrap.ico-vcode::after{ position: absolute; top: 0; left: 0; content: ""; z-index: 2; display: block; width:48px; height: 48px; padding: 0; margin: 0; background: url(../images/user/ico-vcode@2x.png) no-repeat 50% 50%; background-size: auto 50%; }


.login-component .login-form ul li .submit-wrap{ position: relative; display:block; clear: both; width:100%; height:auto; min-height:104px; padding: 10px 0 24px 0;  text-align: center; }
.login-component .login-form ul li .submit-wrap .btn-sub{ display:inline-block; clear: both; width:100%; height:48px; line-height: 48px; padding: 0; margin:0 auto; text-align: center; font-size: 16px; color: rgba(255,255,255,1.0); background:rgba(22,161,188,1.0); border: none; box-shadow: 0 0 20px rgba(36,228,192,0); text-decoration: none; cursor:pointer; }
.login-component .login-form ul li .submit-wrap .btn-sub:hover{ background:rgba(22,161,188,0.8); box-shadow: 0 5px 5px rgba(36,228,192,0.2); }

.login-component .login-form ul li .submit-wrap label{ display:inline-block; float: left; width:auto; height:40px; line-height: 40px; padding: 0; margin:0; text-align: left; font-size: 1em; color: rgba(0,0,0,0.5); cursor: pointer; }
.login-component .login-form ul li .submit-wrap input.che{ position: relative; display:inline-block; float: left; width:14px; height:14px; padding: 0; margin:13px 0; text-align: center; border: none; background: url(../images/user/ico-chebox@2x.png) no-repeat 50% 50%; background-size: 100% 100%; outline: none; border-radius:none; }
.login-component .login-form ul li .submit-wrap label span{ display:inline-block; float: left; width:auto; height:40px; line-height: 40px; padding: 0; margin:0 4px; text-align: left; font-size: 0.9em; color: rgba(0,0,0,0.5); }
.login-component .login-form ul li .submit-wrap input.che[type="checkbox"]:checked::after{ position: absolute; z-index: 1; display:block; content: ""; left: 0; top: 0; width:14px; height:14px; padding: 0; margin:0; border: none; background: url(../images/user/ico-chebox@2x.png) no-repeat 0 0; background-size: 100% 100%; }
.login-component .login-form ul li .submit-wrap a.forgetpsw{ display:inline-block; float: right; width:auto; height:40px; line-height: 40px; padding: 0; margin:0; text-align: right; font-size: 0.9em; color: rgba(22,161,188,1.0); text-decoration: none; }
.login-component .login-form ul li .submit-wrap label a.rule{ display:inline-block; float: left; width:auto; height:40px; line-height: 40px; padding: 0; margin:0; text-align: left; font-size: 0.9em; color: rgba(22,161,188,1.0); text-decoration: none; }

.login-component .login-form ul li .input-info{ position: absolute; z-index: 1; bottom: 0; left: 0; display:none; width: 100%; height:20px; line-height: 20px; padding: 0 20px; margin:0; text-align: left; text-indent:0; box-sizing: border-box; font-size: 12px; color:rgba(255,0,0,0.8); }	

.login-component .login-form ul li .tip-wrap{ display:block; clear: both; width:100%; height:auto; padding: 0; margin:10px auto; text-align: center; }
.login-component .login-form ul li .tip-wrap span{ display:block; float: left; width:auto; height:40px; line-height: 40px; padding: 0; margin:0; text-align: left; font-size: 0.9em; color: rgba(0,0,0,0.5); }
.login-component .login-form ul li .tip-wrap span a{ font-size: 0.9em; color: rgba(22,161,188,1.0); text-decoration: none; }


#footer .copyright{ display:block; clear:both; width:100%; height:auto; padding:10px 15px; margin:0 auto; text-align:center; overflow:hidden; background:rgba(255,255,255,0); color: rgba(0,0,0,0.4); font-size:0.8em; font-weight: normal; line-height: 20px; box-sizing: border-box; }

/*********************************************************移动端*********************************************************/
@media screen and (max-width: 1000px){	

/*主体*/
main{ width:100%; height:auto; padding: 0; margin: 0; background:rgba(32,162,178,1.0); overflow-y: scroll; }
main>section >.container { position: relative; min-height:calc(100vh - 60px); align-items:flex-start; align-content: flex-start; background:rgba(32,162,178,1.0); }
	
.login-main-box{/* position: absolute; bottom: 1em; left: 0;*/ width:100%; height:auto; padding:0; margin:0; text-align: center; box-sizing: border-box; background: url(../images/user/user_log@2x.png) no-repeat 0 0; background-size: 210% auto; }

/*登录*/ 
.login-component-box{ position:relative; right:auto; top:auto; display:inline-block; width:100%; height: 100%; padding:calc(100vw * 0.2) 15px 15px 15px; margin:0; }
.login-component{ padding:20px; background:rgba(255,255,255,0.9); box-shadow: 0 0 10px rgba(0,147,161,0.25); border-radius: 10px; }
.login-component .login-title h4{ font-size: 1.5em; }
.login-component .login-title p{ font-size: 1em; }

.login-component .login-form{ padding:0.5em 0; }
.login-component .login-form ul li .tip-wrap{ margin:0 auto; }
	
}


