@charset "UTF-8";

/******************************************************************************
 * ログインページ
 *******************************************************************************/
:root{
	--main-bg-color:			#00533f;
	--main-bg-stripe:			#005c42;
}

/*********************************************************************
 * BODY
 *********************************************************************/
body {
	width:				100%;
	min-height:			100vh;
	display:			-webkit-box;
    display:			-ms-flexbox;
    display:			-webkit-flex;
    display:			flex;
	flex-direction:		column;
	background:			#f3f3f3;
	font-size:			12px;
	font-family:		"Hiragino Kaku Gothic ProN","メイリオ", sans-serif;
	line-height:		1.6;
	color:				#333;
}
@media all and (-ms-high-contrast:none) {
	body {
		font-family:	"メイリオ",Meiryo,"游ゴシック",YuGothic,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","ＭＳ Ｐゴシック","MS PGothic",sans-serif;
	}
}
@media only screen and (max-width: 800px) {
	body{
		min-width:		0px;
	}
}
input::-ms-clear {
    visibility:			hidden
}

/*********************************************************************
 * 本文
 *********************************************************************/
body {
	width:						100%;
	min-height:					100vh;
 	-webkit-box-align:			center;
    -ms-flex-align:				center;
    -webkit-align-items:		center;
    align-items:				center;
    -webkit-box-pack:			center;
    -ms-flex-pack:				center;
    -webkit-justify-content:	center;
    justify-content:			center;
	background:					url( '../../images/bg.png' ) 50% 50% no-repeat;
	background-size:			cover;
	font-size:					12px;
	font-family:				"Hiragino Kaku Gothic ProN","メイリオ", sans-serif;
	line-height:				1.6;
	color:						var( --main-font-color );
}
@media all and (-ms-high-contrast:none) {
	body {
		font-family:			"メイリオ",Meiryo,"游ゴシック",YuGothic,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","ＭＳ Ｐゴシック","MS PGothic",sans-serif;
	}
}
@media only screen and (max-width: 800px) {
	body{
		min-width:				0px;
	}
}

/*********************************************************************
 * ログインフォーム
 *********************************************************************/
.inner-login {
	width:						600px;
	background:					rgba( 255, 255, 255, 0.6 );
	border-radius:				10px;
	padding:					50px;
	margin:						auto;
}
.inner-login img {
	width:						300px;
	height:						69px;
}

.login input[type="text"],
.login input[type="password"] {
	width:						100%;
	border:						solid 1px #fff;
	border-radius:				3px;
	background:					rgba( 255, 255, 255, 0.5 );
	padding:					15px;
}

/*********************************************************************
 * ログインボタン
 *********************************************************************/
.btn-login {
	position:					relative;
	display:					inline-block;
    background:					#5f6527;
    border:						solid 3px #5f6527;
	border-radius:				10px;
}

.btn-login::before {
	position:					absolute;
	top:						50%;
	left:						15px;
	transform:					translateY( -50% );
	content:					'';
	display:					block;
	width:						16px;
	height:						20px;
	background:					url( '../../images/icon-login-close.png' );
	background-size:			contain;
	transition:					.6s;
}
.btn-login:hover::before {
	position:					absolute;
	top:						50%;
	left:						15px;
	transform:					translateY(-50%);
	content:					'';
	display:					block;
	width:						16px;
	height:						20px;
	background:					url( '../../images/icon-login-open.png' );
	background-size:			contain;
}
.btn-login input[type="submit"] {
	color:						#ffffff;
	font-weight:				bold;
	padding:					10px 50px;
	cursor:						pointer;
}
