@charset "utf-8";

/*//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/

header #login {
	width: 100%; padding: 20px;
}

header #login .log-in {
	padding: 3px; border: none; border-radius: 5px; background: rgba(255,255,255,0.3);
}

header #login .log-in dl {
	padding: 10px; border: none; border-radius: 5px; background: rgba(255,255,255,0.5); 
}

header #login .log-in dt {
	width: 100%; border: none; border-radius: 7px; background: #000; color: #FFF;
}

header #login .log-in dd.usr,
header #login .log-in dd.pwd {
	width: 100%; margin-top: 10px;
}

header #login .log-in dd.but {
	width: 100%;
}

header #login .log-in dd.but button {
	width: 100%;
}

header #login .log-in input,
header #login .log-in button {
	height: 24px;
}

#login .log-in div.error {
	border: none; background: #000; color: #cc0000;
}

/*~~*/

header #login .log-out {
	padding: 3px; border: none; border-radius: 20px; background: rgba(255,255,255,0.3);
}

header #login .log-out dl {
	padding: 5px 10px 5px 5px; border: none; border-radius: 20px; background: rgba(255,255,255,0.5);
}

header #login .log-out dt {
	width: 65%; margin-right: 5px; border-radius: 20px; background: #000; color: #FFF;
}

header #login .log-out dd {
	width: 35%;
}

/*//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/

@media screen and (min-width: 769px) {
/************************************************************************************************************************/

header #login {
	padding: 0; display: block;
}

header #login .login-body {
	width: 70%; min-width: 1000px; margin: 20px auto 0; padding: 0; text-align: left;
}

header #login .login-body .fmload {
	width: 50%;
}

header #login .log-in {
	width: 100%; border-radius: 20px; display: block;
}

header #login .log-in dl {
	padding: 5px 10px; border-radius: 20px;
}

header #login .log-in dt {
	flex: 1; display: flex; justify-content: center; align-items: center;
}

header #login .log-in dd.usr,
header #login .log-in dd.pwd {
	width: 30%; margin-top: 0px; margin-right: 5px;
}

header #login .log-in dd.but {
	width: 15%; padding: 0; margin: 0;
}

header #login .log-in dd.but button {
	width: 100%;
}

#login .log-in div.error {
	border-radius: 20px;
}

header #login .log-out dt {
	padding: 0 25px;
}

header #login .log-out dd {
	width: 100px;
}

/************************************************************************************************************************/
}

/*//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/