@charset "Shift_JIS";

html,body{
	height: 100%;
}
body{
	margin: 0;
	padding: 0;
	positiion: relative;
	-webkit-text-size-adjust:100%;
	   -moz-text-size-adjust:100%;
		-ms-text-size-adjust:100%;
		 -o-text-size-adjust:100%;
			text-size-adjust:100%;
}
img{
	vertical-align:bottom;
	width:auto\9;
	max-width:100%;
	height:auto;
	-ms-interpolation-mode:bicubic;
}

/* ログイン ----------------------------------------------------------------------- */
/* レイアウト関連 */
#container-login{
	display:grid;
	place-items:center;
	width:100%;
	height:100%;
}
#login_form{
	text-align:center;
	margin-bottom:50px;
}
.logoarea{
	text-align:center;
}
.login_adm_tlt{
	color:#2D9B8D;
	font-size:13px;
}
.loginbox{
	width:300px;
	text-align:center;
	margin:36px auto 0;
a}

/* input関連 */
.loginbox input[type="text"],
.loginbox input[type="password"]{
	border: 1px solid #aaa;
	font-size:16px;
}
.loginbox input[type="text"].id,
.loginbox input[type="password"].password{
	border: none;
	border-radius: 0;
	border-bottom: 2px solid #DDD;
}

/* checkbox関連 */
	input[type="checkbox"]::before {
		background-color: #fff;
		border-radius: 2px;
		border: 1px solid #aaa;
		width: 20px;
		height: 20px;
		transform: translateY(-50%);
		top: 50%;
		left: 5px;
	}
	input[type="checkbox"]::after {
		border-bottom: 2px solid #2D9B8D;
		border-left: 2px solid #2D9B8D;
		opacity: 0;
		height: 6px;
		width: 11px;
		transform: rotate(-45deg);
		top: -5px;
		left: 10px;
	}

/* パーツ関連 */
.login_address,
.login_pass,
.login_onetime{
	position:relative;
}
.login_address + .login_pass{
	margin-top:16px;
}
	.login_address span,
	.login_pass span{
		position:absolute;
		top:8px;
		left:5px;
		width:20px;
		height:21px;
	}
	.login_address input[type="text"].id,
	.login_pass input[type="password"].password,
	.login_onetime input[type="password"].onetime{
		width:100%;
		padding:6px 6px 6px 32px;
		box-sizing: border-box;
	}
		.login_address:before{
			position: absolute;
			content:url("../images/icon_login_user.png");
			top:8px;
			left:8px;
		}
		.login_pass:before{
			position: absolute;
			content:url("../images/icon_login_pass.png");
			top:8px;
			left:8px;
		}
		.login_onetime:before{
			position: absolute;
			content:url("../images/icon_onepass.png");
			top:8px;
			left:8px;
		}
.login_check{
	cursor: pointer;
	margin-top:16px;
}
	.login_check label{
		cursor: pointer;
	}
.login_button{
	margin-top:24px;
}
	.login_button input[type="button"].loginbtn{
		width:100%;
		height:50px;
		font-size:16px;
	}

/* 再設定リンク */
.login_forget{
	margin-top:18px;
}
.login_forget a{
	position:relative;
	display:inline-block;
	color:#2D9B8D;
	padding-left:18px;
}
	.login_forget a:before{
		position:absolute;
		content:url("../images/icon_login_reminder.png");
		top:3px;
		left:0;
	}
	.login_forget a:hover{
		text-decoration:underline;
	}

/* ワンタイムパスワードリンク */
.login_onemail{
	margin-top:18px;
}
.login_onemail a{
	position:relative;
	display:inline-block;
	color:#378ACA;
	padding-left:22px;
}
	.login_onemail a:before{
		position:absolute;
		content:url("../images/icon_onemail.png");
		top:3px;
		left:0;
	}
	.login_onemail a:hover{
		text-decoration:underline;
	}

/* 再設定 ----------------------------------------------------------------------- */
#login_form h2{
	font-size:20px;
	text-align:left;
	border-bottom: 3px solid #378ACA;
	margin-top:42px;
}
#login_form p.txt{
	text-align:left;
	margin-top:24px;
}
/* reminderbox codebox */
.reminderbox,
.codebox{
	width:400px;
}
.reminderbox dl + dl,
.codebox dl + dl{
	margin-top:16px;
}
	.reminderbox dl dt,
	.codebox dl dt{
		width:100%;
		text-align:left;
	}
	.reminderbox dl dd,
	.codebox dl dd{
		width:100%;
		text-align:left;
	}
	.reminderbox dl dd input,
	.codebox dl dd input{
		width:100%;
		box-sizing: border-box;
	}
.reminderbox dl.reminder_mail_confirm + ul.inputbuttonarea{
	margin-top:32px;
}
.reminder_mail + .inputbuttonarea,
.code + .inputbuttonarea{
	margin-top:24px;
}

/* reminder_confirm */
.reminder_confirm dl dt{
	background:#388CCB;
	color:#FFF;
	padding:3px 8px;

}
.reminder_confirm dl dd{
	padding:3px 8px;

}

/* page_back */
p.page_back   a{
	position:relative;
	display:inline-block;
	color:#378ACA;
	margin-top:32px;
	padding-left:26px;
}
	p.page_back a:before{
		position:absolute;
		content:"";
		top:45%;
		left:0px;
		transform: translate(50%, -50%) rotate(45deg);
		width:8px;
		height:8px;
		border-left: 2px solid #378ACA;
		border-bottom: 2px solid #378ACA;
	}
	p.page_back a:hover{
		text-decoration:underline;
	}

/* error ----------------------------------------------------------------------- */
.errorbox{
	width:100%;
}
.errorbox > div{
	width:100%;
}
	.login_address input[type="text"].error,
	.login_pass input[type="password"].error,
	.login_onetime input[type="password"].error{
		background:#FCE3E3;
	}
	.reminderbox dl dd input.error{
		background:#FCE3E3;
	}

/* mainte ----------------------------------------------------------------------- */
.maintebox{
	width:100%;
	margin:10px 0;
}
.maintebox > div{
	display:inline-block;
	width:100%;
	background:#F8D64D;
	color:#000;
	border-radius: 3px;
	border: 2px solid #000;
	padding:5px 10px;
	box-sizing: border-box;
}
	.maintebox > div > p{
		position:relative;
		text-align:left;
		margin-left:33px;
	}
	.maintebox > div > p:before{
		content: url(../images/icon_mainte.png);
		position:absolute;
		top:50%;
		margin-top:-16px;
		margin-left:-38px;
	}