@charset "UTF-8";

/**
 * ログイン
 *-------------------------------------- */

#login {
	background-color: #f8fdfe;
}

.inner {
	width: min(1200px, 89.3%);
	margin-left: auto;
	margin-right: auto;
	margin-top: 65px;
}

.inputWrap {
	display: flex;
	justify-content: space-evenly;
}

.logo {
	margin-bottom: 60px;
}

h1 {
	font-size: 45px;
	color: #115E72;
	margin-bottom: 60px;
}

img.image {
	max-width: 40vw;
}

.inputContainer {
	position: relative;
	width: 500px;
	padding: 35px 40px 0;
	border-radius: 10px;
}

.inputInner {
	/* padding: 0 35px; */
	/* margin: 35px 0; */
}

label {
	display: flex;
	flex-wrap: wrap;
	align-content: stretch;
	justify-content: space-around;
	flex-direction: column;
}

.input {
	margin: 0 auto 20px;
}

.icon {
	position: absolute;
	margin: 10px 10px 10px 14px;
	width: 28px;
	/* アイコンの幅 */
	height: 28px;
	/* アイコンの高さ */
	background-size: contain;
	background-repeat: no-repeat;
}

.mailTxt {
	background-image: url("/img/login/mailIcon.svg");
}

.passTxt {
	background-image: url("/img/login/passIcon.svg");
}

/*input.withIcon {*/
/*	background-size:25px 25px;*/
/*	background-repeat: no-repeat;  繰り返さず一度のみ表示 */
/*	background-position: 10px center;*/
/*}*/

input[type="email"],
input[type="password"] {
	width: 100%;
	padding: 10px 10px 10px 50px;
	/*アイコン分左をあける*/
	margin-bottom: 10px;
	border: 2px solid #115E72;
	border-radius: 4px;
	height: 50px;
	background-color: #fff;
}

.errorMsg {
	background-color: #efd7d7;
	padding: 8px;
	color: #fe3232;
	border-radius: 2px;
	margin-bottom: 15px;
}

.submitBtnArea {
	margin-top: 60px;
	text-align: center;
}

button[type="submit"] {
	width: 60%;
	padding: 12px;
	background-color: #41B1C0;
	color: #ffffff;
	border: none;
	border-radius: 4px;
	cursor: pointer;
	font-size: 22px;
	letter-spacing: 0.1em;
	font-weight: 500;
}

button[type="submit"]:hover {
	background-color: #115E72;
	transition: 0.5s;
}


/* error */
.flash {
	padding: 5px 10px;
	margin: 0;
}