@charset "UTF-8";

/******************************************************************************
 * ログインページ
 *******************************************************************************/
:root{
	--main-bg-color:			#1e50a2;
	--main-bg-stripe:			#192f60;
}

html {
	height:						100%;
}

input::-ms-clear {
    visibility:					hidden
}

/*********************************************************************
 * 本文
 *********************************************************************/
body {
	width:						100%;
	height:						100%;
	min-height:					100vh;
	display:					-webkit-box;
    display:					-ms-flexbox;
    display:					-webkit-flex;
    display:					flex;
	flex-direction:				column;
	background:					var( --main-bg-color );
 	background-image:			repeating-linear-gradient( -45deg, var( --main-bg-stripe ), var( --main-bg-stripe ) 40px, transparent 0, transparent 80px ),
 								repeating-linear-gradient( 45deg, var( --main-bg-stripe ), var( --main-bg-stripe ) 40px, transparent 0, transparent 80px );
	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;
	}
}

.contents {
	position:					relative;
	display:					-webkit-box;
    display:					-ms-flexbox;
    display:					-webkit-flex;
    display:					flex; 
    -webkit-box-pack:			justify;
    -ms-flex-pack:				justify;
    -webkit-justify-content:	space-between;
    justify-content:			space-between;
	flex-grow:					1;
	text-align:					center !important;
}

.container{
	vertical-align:				middle !important;
}

.base-wrap {
	display:					-webkit-box;
    display:					-ms-flexbox;
    display:					-webkit-flex;
    display:					flex;
 	-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;
}

/*********************************************************************
 * ログインフォーム
 *********************************************************************/
.inner-login {
	width:						600px;
	background:					rgba( 255, 255, 255, 0.6 );
	border-radius:				10px;
	padding:					50px;
	margin:						0 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;
}