/* ------------------------------------------------------------
フレックスボックス */


/* isf-btn  */
	.flex-container {

		background-color: #eee;     /* 背景色指定 */
		padding: 10px 0 0px 10px;             /* 余白指定 */
		display: flex;              /* フレックスボックスにする */
		width: 100%; 
		display: flex;
		justify-content: center!important; /* 縦の位置指定 */
	}
	
	html,body{
		padding:0;
		margin:0;
		height:100%
	}
	.flex-container {
		height: 100vh;
		padding: 0%;
	}
	
	.flex-container .jumbotron {
		border-radius: 0px;
	}
	.flex-container {
		background-color: #fff;
	}
	
.language{    
	position: absolute;/* 子ボbox指定 */
    right: 18px;
    top: 2px;
	}



/* 縦の上下中央ログインボックス */
.flex-container1{

		display: flex;
  align-items: center!important;
  			justify-content: center!important; /* 位置指定 */
	position: relative;/* 親box指定 */
}
	
@media (max-width: 690px) {
	.flex-container {
		padding: 10px 10px 10px 0px;             /* 余白指定 */
	}     /* 縦の位置指定 */ 
	}

	.flex_test-item {
		padding: 0px;
		margin-bottom:  0px; 
		margin-left:  10px;     /* 外側の余白 */
		border-radius:  0px;        /* 角丸指定 */
		width: 50%;                 /* 幅指定 */
		font-style: 12px;
		text-align:center;
		
	}
	.flex_test-item a{ 	    padding: 20px 10px 10px;
		color:  #fff;              /* 文字色 */
		border-radius:  0px;        /* 角丸指定 */
		display:block;
		line-height:1.2;
	}
	.flex_test-item a:hover{
		background-color: rgba(255, 255, 255, 0.2);
		text-decoration:none;
		color:#fff;
	}
	/* 各カテゴリTOPのflexカード */
	
	.sv_wrap .flex_test-item a{ font-size:1.6rem; }

@media (max-width: 690px) {
	.sv_wrap{width:84%;margin:0 auto;}
	.sv_wrap .flex-container{flex-wrap: wrap;/* 折り返す*/}
	.sv_wrap .flex-container .flex_test-item{width:47%;margin:0 auto 10px;}
	.sv_wrap .flex-container .flex_test-item:first-child {;}/* 最初だけ*/
	}
@media (max-width: 480px) {
	.sv_wrap{width:100%;margin:0 auto;}
	#login-footer {
		padding-left:10%;
		text-align:left;}
	}
	


	.jumbotron { background:url(../img/img-b-login.jpg) 
			center no-repeat; background-size:cover;height:100%;}
	.footer {
		margin: -20px -15px 0;
	}
	/* link */
	.flex_test-item a {
		padding: 10px 10px 10px;
		color: #43a8ff;
		border-radius: -1px;
		display:inline;
		line-height: 1.8;
	}
	.flex_test-item a:hover{
		color:#0082f1;
	}
	
	
	
	input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill {
		background-color: rgb(250, 255, 189) !important;
		background-image: none !important;
		color: rgb(0, 0, 0) !important;
	}
	
	
	.card-container.card {
		max-width: 320px;
		padding: 8px 40px 4px;
		margin: 0 auto 70px;
	}
	
	.btn {
		font-weight: 700;
		height: 36px;
		-moz-user-select: none;
		-webkit-user-select: none;
		user-select: none;
		cursor: default;
	}
	
	/*
	* Card component
	*/
	.card {
		background-color: #F7F7F7;
		/* just in case there no content*/
		
		margin-top: 40px;
		/* shadows and rounded borders */
		-moz-border-radius: 2px;
		-webkit-border-radius: 2px;
		border-radius: 2px;
		-moz-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
		-webkit-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
		box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
	}
	
	.profile-img-card {
		width: 96px;
		height: 96px;
		margin: 0 auto 10px;
		display: block;
		-moz-border-radius: 50%;
		-webkit-border-radius: 50%;
		border-radius: 50%;
	}
	
	/*
	* Form styles
	*/
	.profile-name-card {
		font-size: 16px;
		font-weight: bold;
		text-align: center;
		margin: 10px 0 0;
		min-height: 1em;
	}
	
	.reauth-email {
		display: block;
		color: #404040;
		line-height: 2;
		margin-bottom: 10px;
		font-size: 14px;
		text-align: center;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
	}
	
	.form-signin #inputEmail,
	.form-signin #inputPassword {
		direction: ltr;
		height: 44px;
		font-size: 16px;
	}
	
	.form-signin input[type=email],
	.form-signin input[type=password],
	.form-signin input[type=text],
	.form-signin button {
		width: 100%;
		display: block;
		margin-bottom: 10px;
		z-index: 1;
		position: relative;
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
	}
	
	.form-signin .form-control:focus {
		border-color: rgb(104, 145, 162);
		outline: 0;
		-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgb(104, 145, 162);
		box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgb(104, 145, 162);
	}
	
	.btn.btn-signin {
  cursor:pointer;
		padding: 0px;
		font-weight: 700;
		font-size: 14px;
		height: 36px;
		-moz-border-radius: 3px;
		-webkit-border-radius: 3px;
		border-radius: 3px;
		border: none;
		-o-transition: all 0.218s;
		-moz-transition: all 0.218s;
		-webkit-transition: all 0.218s;
		transition: all 0.218s;
	}

	
	.forgot-password {
		color: rgb(104, 145, 162);
	}
	
	.forgot-password:hover,
	.forgot-password:active,
	.forgot-password:focus{
		color: rgb(12, 97, 33);
	}
	
	
	
	
	.btn.btn-signin {


		padding: 0px;
		color:#fff;
		font-weight: 700;
		font-size: 14px;
		height: 36px;
		
	}
	
	@media screen and (max-width:767px) {
		/* errer */
		.flex_test-item {	width:100%; }
	}
	#login-footer {
    position: relative;
    margin-top: -24px;
    height: 24px;
    clear: both;
    padding-left: 10%;
    text-align: left;
}
.color-g-fss {
    color: #666;
    font-size: 80%;
    line-height: 130%;
}
.form-signin input[type="submit"], .form-signin input[type="button"] {
    margin-top: -6px;
}
.btn-lg{
     padding: 2px 4px; 
    font-size: 16px;
    line-height: 1.3333333;
    border-radius: 6px;
}

/* HP-Link-add-bodais.com-20210118 */
.flex_test-item{ position:relative;}
.hp-link{ position: absolute;
    top: 25px;
    left: 34px;
	width: 255px;
	text-align: left;
	padding: 16px;
	background-color:rgba(90, 75, 75, 0.7);
	color: white;
}
.hp-btn {
	margin-top:14px;
}
.hp-btn a{
	background-color:#258B48;
	color:#fff;
}
.hp-btn a:hover{
	background-color:#61ac62;
	color:#fff;
}
/* smartphone */
.card-container.card {
	position: relative;
}
.hp-link-xs {
    position: absolute;
    bottom: -82px;
    left: 28px;
    width: 255px;
    padding: 16px;
}