﻿@charset "UTF-8";

/* ----------------------------------
 ログイン
---------------------------------- */
body {
	height: auto !important;
	padding: 60px 0;
	min-height: 100vh !important;
	background-image: url("../../img/usr/common/login_bg.png");
	-webkit-background-size: cover;
	background-size: cover;
	background-repeat: no-repeat;
	display: flex;
	justify-content: center;
	align-items: center;
	box-sizing: border-box;
}
div.wrapper_wrapper_ { min-height: auto !important; margin: auto; display: flex; flex-direction: column; justify-content: center; align-items: center;}
div.wrapper_ { min-height: auto !important; margin: auto; overflow: visible;}
div.col1_ { width: auto; min-width: 600px; margin: 0 auto; overflow: visible;}
#header { display: none;}
#footer { min-width: 600px; padding: 30px 0; margin: 50px auto 0; background: none;}
#footer #for_pagetop { display: none;}
#footer #footer_navi { display: none;}

div.login_.col1_ {
  width: 1000px;
  padding: 50px;
  margin: 0 auto;
  border-radius: var(--border-radius);
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
  background: #FFF;
  box-shadow: 0 6px 6px rgb(0,0,0,0.16);
	overflow: visible;
}
div.login_ #login_header { width: calc(50% - 25px); margin: 0 auto 0 0; text-align: center;}
div.login_ #login_header h1 { padding: 0; margin: 0 0 10px; font-size: 18px; font-weight: 700; text-align: center; line-height: var(--line-height-middle); color: var(--color-base);}
div.login_ #login_header .logo { width: 156px; margin: 0 auto 35px; line-height: 1.0;}
div.login_ #login_header .image { max-width: 275px; margin: 26px auto 0;}
div.login_ div.loginform_ { width: calc(50% - 25px); padding: 0; margin: 0 auto; border: none; overflow: visible;}
div.login_ div.loginform_ div.info_ {
  width: 100%;
  padding: 15px;
  margin: 0 auto 20px;
  border: var(--border-solid-alert);
  border-radius: var(--border-radius);
  background: #FFF;
  box-sizing: border-box;
}
div.login_ div.loginform_ h2.common_headline2_ { display: none;}
div.login_ div.loginform_ div.form_text_ { display: none;}
div.login_ div.loginform_ table.loginform_ { width: 100%; display: block;}
div.login_ div.loginform_ table.loginform_ tbody,
div.login_ div.loginform_ table.loginform_ tr,
div.login_ div.loginform_ table.loginform_ th,
div.login_ div.loginform_ table.loginform_ td { width: 100%; padding: 0; margin: 0; border: none; font-size: 13px; font-weight: 500; text-align: left; display: block;}
div.login_ div.loginform_ table.loginform_ th { padding: 0 0 8px; display: flex; align-items: center;}
div.login_ div.loginform_ table.loginform_ td input {
  width: 100%;
  height: 45px;
  min-height: 45px;
  border: var(--border-solid-base);
	border-radius: 45px;
	font-size: 13px;
	font-weight: 500;
  display: flex;
  align-items: center;
	box-shadow: none;
  background: var(--bg-color-base);
}
div.login_ div.loginform_ table.loginform_ td input::placeholder { color: #A2B2C6;}
div.login_ div.loginform_ table.loginform_ th.uid_::before {
	content: '';
	width: 18px;
	height: 18px;
	margin: 0 5px 0 0;
	display: block;
	background-image: url("../../img/usr/common/ico_login_id.png");
	background-repeat: no-repeat;
	background-position: left top;
	-webkit-background-size: 17px auto;
	background-size: 17px auto;
}
div.login_ div.loginform_ table.loginform_ th.pwd_ { margin: 30px 0 0;}
div.login_ div.loginform_ table.loginform_ th.pwd_::before {
	content: '';
	width: 18px;
	height: 18px;
	margin: 0 5px 0 0;
	display: block;
	background-image: url("../../img/usr/common/ico_login_pass.png");
	background-repeat: no-repeat;
	background-position: left top;
	-webkit-background-size: auto 18px;
	background-size: auto 18px;
}
div.login_ div.loginform_ div.forgotpass_ { margin: 10px 0 0; text-align: right;}
div.login_ div.loginform_ div.forgotpass_ a::before { display: none;}
div.login_ div.loginform_ div.forgotpass_ a { font-size: 12px; font-weight: 500; text-decoration: underline; color: var(--color-link);}
div.login_ div.loginform_ div.inputimage_ { margin: 24px 0; text-align: center;}
div.login_ div.loginform_ div.inputimage_ input.btn.btn-default {
	width: 275px;
	height: 54px;
	padding: 0;
	margin: 0 auto;
  border: var(--btn-cart-bg) 2px solid;
  border-radius: 54px;
	outline: none;
	font-size: 16px;
	font-weight: 700;
	color: #FFF;
	display: flex;
	justify-content: center;
	align-items: center;
  background: var(--btn-cart-bg);
	box-shadow: none;
	transition: var(--transition);
}
div.login_ div.loginform_ div.inputimage_ input.btn.btn-default:hover { color: #FFF; background: var(--btn-cart-bg-hover);}

div.login_ #login_footer .notice-list { margin: 0 0 15px;}
div.login_ #login_footer .notice-list li { padding: 0 0 0 1em; font-size: 12px; font-weight: 500; text-indent: -1em;}
div.login_ #login_footer .contact-text { margin: 0 0 15px; font-size: 12px; font-weight: 500; text-align: center;}
div.login_ #login_footer .partners-net { width: 218px; padding: 8px 12px; margin: 50px auto 0; border: var(--border-solid-base); text-align: center;}
div.login_ #login_footer .partners-net img { width: 100%; vertical-align: top;}
