@charset "utf-8";
/* ========================================
   Suifeel Partner Login - SP
   max-width: 767px
======================================== */

.PartnerLoginPage{
	overflow:hidden;
	background:#fff;
	color:#0D0B2B;
}

.PartnerLoginContainer{
	width:100%;
	padding:0 22px;
	box-sizing:border-box;
}

.PartnerLoginSection{
	min-height:auto;
	padding:124px 0 104px;
	background:
		radial-gradient(circle at 84% 12%, rgba(123,175,203,.16) 0%, rgba(123,175,203,0) 36%),
		linear-gradient(180deg, #ffffff 0%, #f8fcfd 100%);
}

.PartnerLoginIntro{
	text-align:left;
}

.PartnerLoginTitle{
	margin:22px 0 0;
	font-size:30px;
	line-height:1.55;
	font-weight:400;
	letter-spacing:.055em;
	color:#0D0B2B;
}

.PartnerLoginLead{
	margin:22px 0 0;
	font-size:13px;
	line-height:2.02;
	letter-spacing:.035em;
	color:rgba(13,11,43,.66);
}

.PartnerLoginCard{
	margin:42px auto 0;
	padding:40px 24px 38px;
	background:rgba(255,255,255,.94);
	border:1px solid rgba(13,11,43,.07);
	border-radius:30px;
	box-shadow:0 22px 60px rgba(13,11,43,.06);
	box-sizing:border-box;
	overflow:hidden;
}

.PartnerLoginCard::before{
	width:150px;
}

.PartnerLoginError{
	margin:0 0 24px;
	padding:15px 16px;
	font-size:12.5px;
	line-height:1.8;
}

.PartnerLoginField{
	margin-top:24px;
}

.PartnerLoginField:first-child{
	margin-top:0;
}

.PartnerLoginField label{
	margin-bottom:10px;
	font-size:12.5px;
	line-height:1.7;
}

.PartnerLoginField input{
	height:54px;
	padding:0 14px;
	font-size:14px;
}

.PartnerLoginField p{
	margin-top:11px;
	font-size:11.5px;
	line-height:1.85;
}

.PartnerLoginSubmit{
	width:100%;
	min-height:56px;
	margin-top:34px;
	padding:0 22px;
	font-size:13.5px;
}

.PartnerLoginLinks{
	display:grid;
	grid-template-columns:1fr;
	gap:12px;
	margin-top:30px;
	padding-top:26px;
}

.PartnerLoginLinks a{
	font-size:12.5px;
	line-height:1.8;
}

.PartnerLoginCard {
  max-width: 100%;
}

/* Password Toggle */

.PartnerPasswordWrap{
	position:relative;
	width:100%;
}

.PartnerPasswordWrap input{
	padding-right:56px;
}

.PartnerPasswordToggle{
	position:absolute;
	right:14px;
	top:50%;
	width:34px;
	height:34px;
	padding:0;
	border:none;
	background:transparent;
	transform:translateY(-50%);
	cursor:pointer;
	opacity:.58;
	transition:opacity .25s ease, transform .25s ease;
}

.PartnerPasswordToggle:hover{
	opacity:.9;
	transform:translateY(-50%) scale(1.04);
}

.PartnerPasswordToggle span{
	position:absolute;
	left:50%;
	top:50%;
	width:20px;
	height:13px;
	border:1.5px solid rgba(13,11,43,.56);
	border-radius:50% / 58%;
	transform:translate(-50%, -50%);
	box-sizing:border-box;
}

.PartnerPasswordToggle span::before{
	content:"";
	position:absolute;
	left:50%;
	top:50%;
	width:5px;
	height:5px;
	background:rgba(13,11,43,.56);
	border-radius:50%;
	transform:translate(-50%, -50%);
}

.PartnerPasswordToggle span::after{
	content:"";
	position:absolute;
	left:50%;
	top:50%;
	width:24px;
	height:1.5px;
	background:rgba(13,11,43,.56);
	transform:translate(-50%, -50%) rotate(-38deg);
	opacity:1;
	transition:opacity .2s ease;
}

.PartnerPasswordToggle.is-visible span::after{
	opacity:0;
}

.PartnerLoginForgotLink{
	display:inline-block;
	margin-top:6px;
	color:#4D6A7F;
	text-decoration:none;
	border-bottom:1px solid rgba(123,175,203,.45);
	transition:color .25s ease, border-color .25s ease;
}

.PartnerLoginForgotLink:hover{
	color:#0D0B2B;
	border-color:#0D0B2B;
}