@charset "UTF-8";
/* CSS Document */

/***************
 ログイン画面
******************/

/**header**/

header .wrap{
	display: flex;
	width:100%;
	justify-content: center;	
    padding:5.49vh 0 0 0; 
}
header .brand {
	width:72.1%;
}
@media (min-width: 576px) {
	header .brand {
		width:56.6%;
	}
}

/**main**/

#login {
    width:100%;  
	display: flex;
    flex-flow: column;
    justify-content: flex-start;
    align-items:center ;
	padding:0 28px;
}
#login form {
	width:100%;
	display: flex;
    flex-flow: column;
    justify-content: flex-start;
    align-items:center ;
}
#login h2 {
	display: none;
}
.login-input-area {
    width: 100%;
    margin:auto;
    padding:5.49vh 0 0 0;
}
.login-input-area .login-input-block {
    margin:0 auto 3em;
}
.login-input-area .login-input-block dl {
    margin-bottom:1em;
}
.login-input-area .login-button-area {
    width: 100%;
    margin:0 auto;
}
.login-input-area .login-button-area .btn {
    width:100%;
}

@media (min-width: 576px) {
	.login-input-area {
		width: 56%;
		margin:auto;
		padding:5.49vh 0 0 0;
	}


	
}

.form-control-lg {
	background: #e8f0fe;
}

@media (min-width: 1025px) {
	main {
		background: #f7f7f7;
	}

	#login h2 {
		display: block;
		margin: 60px auto;
	}

	.login-input-area {
		background-color: var(--white);
		border:#DDD 1px solid;
		box-shadow: 0 0 5px #ddd;
		width: 600px;
		padding:30px;
	}
	.login-input-area .login-input-block {
		width:300px;
		margin:0 auto 2em;
	}
	.login-input-area .login-input-block dl {
		margin-bottom:0.5em;
	}
	.login-input-area .login-input-block dt {
		font-size:0.9em;
		margin-bottom:0.5em;
	}
	.login-input-area .login-button-area {
		width:300px;
		margin:0 auto 1em;
	}

	
}