@charset "utf-8";

html,body {min-height:700px; background-color: #fff; }

	
.login{position:absolute; top:0; bottom:0; left:0; right:0; width:100%; height:100%; min-height:700px; z-index:200;text-align: center;z-index:900;}
.login #content.login_area{width:520px; height:100%!important; display:table; position:relative; z-index:1; margin:0 auto}
.login .login_position{display:table-cell; vertical-align:middle; text-align: center; padding-bottom: 40px}

.login .sub_tit {font-size:16px; color:#666; line-height: 1.2em;}
.login .tit {margin-top:30px; margin-bottom: 20px;}

.login .login_input {width:100%; text-align: left;margin-top:30px;}
.login .login_input .label { font-size:20px; color:#333; opacity: 0.5 }
.login .login_input input {text-align: left;width:calc(100% - 0px);color:#333; /*padding:10px 0 15px;*/ height:50px; border:0; border:1px solid #eee;font-size:18px; padding:0 20px }
.login .login_input input::placeholder {color:#999; }
.login .login_input input:focus { opacity:1}
.login .login_input input + input {margin-top: 10px;}
/*.login .login_input input[type="password"] {padding:0px 0 5px}*/

.login .btn_login { margin-top:30px}
.login .btn_login a {display:block;  text-align: center; font-size:18px; background:#f74540;color:#fff; padding:0; height:50px; line-height: 50px; font-weight: 700; letter-spacing: 0}
.login .btn_login a:hover {box-shadow:0 1px 8px rgba(0,0,0,0.1);}
.login .link {margin-top:20px; text-align: left; overflow: hidden}

.login .copyright { color:#999; font-size: 12px; margin-top:20px; letter-spacing: 0;}

@media screen and (max-width:900px) {
	
	.login #content.login_area {width:90%}
	html, body, #viewport {height: 100vh;}
}

@media screen and (max-width:640px) {
	

	
}