body {
  display: flex;
  margin: 0;
  height: 100vh;
}

#login_form .lang_area {
	margin-bottom: 60px !important;
}
#login_form .change_lang {
	color: #808080;
	font-size: 24px;
	font-family: 'Ubuntu-Bold', sans-serif;
}
#login_form .change_lang.active {
	color: #000;
}
#login_form .change_lang:hover {
	cursor: pointer;
	color: #000;
}
#login_form .change_lang:not(:last-child) {
	margin-right: 20px;
}
.container {
	max-width: 700px;
	height: 100%;
}
.logo_area {
	margin-bottom: 10px;
}
.logo_img {
	width: 300px;
}
#loginId {
    font-size: 25px;
    font-family: 'Ubuntu-Regular', sans-serif;
	border: none;
	border-bottom: 1px solid #707070;
	border-radius: 0;
	outline: none;
	appearance: none;
	-webkit-appearance: none;
}
.login-div {
    margin-top: calc(25vh - 75px) !important;
}
#password {
	font-size: 25px;
    font-family: 'Ubuntu-Regular', sans-serif;
	border: none;
	border-bottom: 1px solid #707070;
	border-radius: 0;
	outline: none;
	appearance: none;
	-webkit-appearance: none;
}
#loginBtn, #newHereBtn {
	font-family: 'ZenKakuGothicNew-Bold', sans-serif;
	width: 140px;
	letter-spacing: 0.7px;
}

.bg-corporate {
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	width: 1100px;
	height: auto;
}

.bg-white {
	background-size: 100% 100%;
}

.form-item input {
	padding-left: 10px;
}

.width-50 {
	width: 50%;
}
.btn-login {
	font-size: 19px !important;
	height: 55px !important;
}
#forget_password {
	color: #ec6d74;
	font-size: 12px;
	font-family: 'ZenKakuGothicNew-Medium', sans-serif;
}
.mb-30-form {
	margin-bottom: 30px !important;
}
#passwordModal .modal-dialog
,#passwordCompleteModal .modal-dialog {
	width: 500px;
	height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
	margin-top: 0;
}
#passwordModal .modal-content
,#passwordCompleteModal .modal-content {
	background: #f39196;
	width: 100%;
}
#passwordModal .modal-title {
	color: #fff;
	margin-top: 20px;
	font-family: 'ZenKakuGothicNew-Bold', sans-serif;
	font-size: 22px;
	letter-spacing: 1.76px;
}
#passwordModal .modal-title.en {
	font-family: 'Ubuntu-Bold', sans-serif;
}
#passwordCompleteModal .modal-title {
	color: #fff;
	margin-top: 40px;
	font-family: 'ZenKakuGothicNew-Medium', sans-serif;
}
#passwordModal .modal-header
,#passwordCompleteModal .modal-header {
	border-bottom: none;
}
#passwordModal .modal-header button
,#passwordCompleteModal .modal-header button {
	color: #fff;
}
#passwordModal .modal-body {
    color: #fff;
	font-family: 'ZenKakuGothicNew-Bold', sans-serif;
	padding: 15px 40px;
}
#passwordModal .modal-body.en {
	font-family: 'Ubuntu-Regular', sans-serif;
}
#passwordCompleteModal .modal-body {
    color: #fff;
	font-family: 'Ubuntu-Bold', sans-serif;
	padding: 15px 40px;
	margin-bottom: 30px;
}
#passwordModal .modal-footer {
	border-top: none;
	display: table;
	margin: 0 auto;
}
#passwordModal .modal-footer button {
	background: #f39196;
	box-shadow: none;
	border: 2px solid #fff;
	border-radius: 10px;
	width: inherit;
	min-width: inherit;
	font-size: 20px;
	padding: 0 10px;
	font-family: 'ZenKakuGothicNew-Bold', sans-serif;
	letter-spacing: 1.5px;
	line-height: 0;
}
.btn-block + .btn-block {
	margin-top: 0;
}
#passwordCompleteModal .forget_password_text {
	color: #fff;
	font-size: 18px;
	font-family: 'Ubuntu-Medium', sans-serif;
}
#passwordModal input
,#passwordCompleteModal input {
	font-size: 18px;
	color: #880000;
	border-top: none;
	border-left: none;
	border-right: none;
	border-bottom: none;
	outline: none;
	background-color: #f39196;
}
#passwordCompleteModal .control-label {
	font-family: 'ZenKakuGothicNew-Bold', sans-serif;
	font-size: 21px;
	letter-spacing: 1.68px;
}

.forgetMail_area {
	width: 350px;
	margin: 10px auto;
	border-bottom: 1px solid #fff;
}

.forgetMail_label {
	width: 50px;
	line-height: 30px;
	font-family: 'ZenKakuGothicNew-Medium', sans-serif;
}

#forgetMail {
	width: 300px;
	height: 30px;
}

#passwordResetBtn {
	font-family: 'Ubuntu-Bold', sans-serif;
}

.to_catalog_area {
	text-align: center;
	margin-top: 100px;
}

.toCatalogImg {
	width: 24px;
    position: relative;
    margin-bottom: 7px;
}

.corp_no_login_catalog1
,.corp_no_login_catalog2 {
	font-size: 12px;
	font-family: 'ZenKakuGothicNew-Medium', sans-serif;
	letter-spacing: 1px;
}
.toCatalogImg:hover
,.corp_no_login_catalog1:hover
,.corp_no_login_catalog2:hover {
	cursor: pointer;
}

/** PC?? **/
@media(min-width: 1401px) {
	.bg-corporate {
		width: 1100px !important;
	}
	.container {
		width: inherit;
	}
}
@media only screen and (max-width: 1400px) {
	.bg-corporate {
		display: none;
	}
	.container {
		width: 100%;
		clear: both;
	}
}

/** PC???????? **/
@media(min-width: 768px) {
	.container {
		float: right;
	}
	.login-div {
		background: #fff !important;
		width: 450px;
	}
	.button-panel>div:first-child {
		float: right;
		padding: 0;
	}
	.button-panel>div:last-child {
		float: left;
		padding: 0;
	}
	.button-panel>div:first-child {
		float: right;
		padding: 0;
	}
	.button-panel>div:last-child {
		float: left;
		padding: 0;
	}
}

@media only screen and (max-width: 1280px) and (min-width: 768px) {
	.form-wrapper {
		 background-color: none;
	}
	.login-div {
		background: none !important;
	}
	.bg-corporate {
		display: none;
	}
}

/** ??????? **/
@media(max-width:767px) {
	.form-wrapper {
		 background-color: none;
	}
	.bg-corporate {
		display: none;
	}
	.container {
		width: 100%;
		clear: both;
	}
	.login-div {
	    margin: auto !important;
	    border: none;
		background: none !important;
	}
	form {
		width: 300px;
		margin: auto;
	}
	.button-panel>div {
		display: flex;
		justify-content: center;
	}
	#newHereBtn {
		margin-top: 10px;
	}
	#loginId {
		font-size: 2.0rem;
	}
	#password {
		font-size: 2.0rem;
	}
	.logo_area {
		margin-top: 50px;
	}
	#passwordModal .modal-dialog
	,#passwordCompleteModal .modal-dialog {
		width: 95%;
	}
	#passwordModal input
	,#passwordCompleteModal input {
		width: 100%;
	}
	#passwordModal .modal-footer button {
		width: 100px;
	}
	#modalOverlay {
		position: fixed;
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
		background-color: black;
  		z-index: 1000;
	}
	.forgetMail_area {
		width: 100%;
	}
	.forgetMail_area label {
		width: 80%;
	}
	#loginBtn {
		margin-bottom: 20px;
	}
	#forget_password {
		font-size: 13.34px;
	}
	.to_catalog_area {
		margin-top: 80px;
	}
}