@charset "UTF-8";

/* intro
---------------------------------------------- */
.loginTtl .txt::before{
	width: 148.8%;
	background-color: var(--color-beige);
}

.intro .sunlight{
	top: 0;
	right: 0;
	width: calc(850 / 1500 * 100%);
}
@media screen and (max-width: 768px){
	.intro .sunlight{
		width: calc(305 / 375 * 100%);
	}
}

/* contents
---------------------------------------------- */
.contents{
	position: relative;
	margin-top: 85px;
	z-index: 0;
}
.contents .sunlight{
	top: -230px;
	left: 0;
	width: calc(1075 / 1500 * 100%);
}
@media screen and (max-width: 768px){
	.contents{
		margin-top: 40px;
	}
	.contents .sunlight{
		top: auto;
		bottom: -200px;
		width: calc(459 / 375 * 100%);
	}
}

/* loginBox
---------------------------------------------- */
.loginBox{
	width: 50%;
	background-color: rgba(178,174,148,.8);
	padding: min(calc(100 / 1500 * 100%),100px) 40px min(calc(210 / 1500 * 100%),210px);
}
	.loginBox__inner{
		width: 100%;
		max-width: 390px;
		margin-inline: auto min(calc(110 / 750 * 100%),110px);
	}
		.contents__copy{
			line-height: 1.7;
		}
		.contents__txt{
			letter-spacing: .1em;
		}
		.loginBox .contents__txt{
			margin-top: calc(30 / 390 * 100%);
		}

		.loginFormWrap{
			margin-top: 28px;
		}
			.loginForm__input{
			width: 100%;
			height: 60px;
			padding: 0 20px;
			font-size: 14px;
			letter-spacing: .2em;
			background-color: #fff;
			color: #333;
			border-radius: 0;
			border: 1px solid #ccc;
			appearance: none;
			outline: none;
			}
			.login-btnWrap{
			margin-top: 30px;
			}
			.login__btn{
				height: 60px;
				background-color: #333;
				font-size: 16px;
				letter-spacing: 0.1em;
			}

::placeholder {
	color: #ccc;
}
@media screen and (min-width: 769px) and (max-width: 900px){
	.contents__txt br{
		display: none;
	}
}
@media screen and (max-width: 768px){
	.loginBox{
		width: 100%;
		padding: 55px 0 80px;
	}
		.loginBox__inner{
			width: calc(320 / 375 * 100%);
			max-width: 560px;
			margin-inline: auto;
		}
			.contents__copy{
				line-height: 1.4;
			}

			.loginBox .contents__txt{
				margin-top: 1em;
			}

			.loginFormWrap{
				margin-top: 36px;
			}
			.login-btnWrap{
				margin-top: 35px;
			}
}

/* limitedBox
---------------------------------------------- */
.limitedBox{
	width: 50%;
	background-color: #333;
	color: #fff;
	padding: min(calc(130 / 1500 * 100%),130px) 40px min(calc(110 / 1500 * 100%),110px);
}
	.limitedBox__inner{
		width: 100%;
		max-width: 540px;
	}
	.limitedBox .contents__txt{
		margin-top: calc(50 / 540 * 100%);
	}

	.limSliderWrap{
		position: relative;
		margin-top: 50px;
	}
		.limSlider{
			overflow: hidden;
		}
			.limSlider .swiper-slide{
				position: relative;
			}
			.limSlider .slide-txtBox{
				position: absolute;
				top: 50%;
				left: 50%;
				transform: translate(-50%,-50%);
				width: 100%;
				color: #fff;
				text-align: center;
			}
			.limSlider .slide-txtBox:has(.coming){
				top: 53%;
			}
			.limSlider .slideTtl{
				font-size: clamp(15px,0.493rem + 0.741vw,19px);
				font-weight: 300;
				letter-spacing: 0.05em;
				text-shadow: 2px 2px 20px rgb(0, 0, 0, 30%), -2px 2px 20px rgb(0, 0, 0, 30%), 2px -2px 20px rgb(0, 0, 0, 30%), -2px -2px 20px rgb(0, 0, 0, 30%);
			}
				.limSlider .slideTtl::after{
					content: '';
					display: block;
					width: 44px;
					height: 1px;
					background-color: #fff;
					margin: 12px auto 0;
				}
				.limSlider .slideTxt{
					font-size: 12px;
					letter-spacing: 0.1em;
					line-height: 1.67;
					margin-top: 1em;
					text-shadow: 2px 2px 20px rgb(0, 0, 0, 30%), -2px 2px 20px rgb(0, 0, 0, 30%), 2px -2px 20px rgb(0, 0, 0, 30%), -2px -2px 20px rgb(0, 0, 0, 30%);
				}
				.limSlider .coming{
					width: fit-content;
					background-color: rgba(0,0,0,.66);
					border-radius: 50vw;
					color: rgba(255,255,255,.62);
					font-size: clamp(13px,0.59rem + 0.37vw,15px);
					letter-spacing: 0.05em;
					margin: 20px auto 0;
					padding: 6px 8.5%;
				}
				.limSlider .swiper-slide{
					position: relative;
					z-index: 0;
				}
				.limSlider .swiper-slide.is-new::after{
					content: '';
					position: absolute;
					top: 0;
					right: 0;
					width: 70px;
					height: 70px;
					background: url(../../img/common/pc/txt_new.svg) center/contain no-repeat;
					z-index: 1;
				}
				.lim-slideBtn .swiper-button-prev,
				.lim-slideBtn .swiper-button-next{
					width: calc(18 / 540 * 100%);
					height: 18px;
				}
				.lim-slideBtn .swiper-button-prev{
					left: 12%;
				}
				.lim-slideBtn .swiper-button-next{
					right: 12%;
				}
@media screen and (max-width: 768px){
	.limitedBox{
		width: 100%;
		padding: 55px 0 80px;
	}
		.limitedBox__inner{
			width: calc(320 / 375 * 100%);
			max-width: 560px;
		}
		.limitedBox .contents__txt{
			margin-top: 1em;
		}

		.limSliderWrap{
			margin-top: 30px;
		}
			.limSlider .slideTtl{
				font-size: 18px;
			}
				.limSlider .slideTxt{
				}
				.limSlider .coming{
					font-size: 12px;
					margin-top: 1em;
					padding-inline: 9%;
				}
				.limSlider .swiper-slide.is-new::after{
					width: 50px;
					height: 50px;
				}
				.lim-slideBtn .swiper-button-prev,
				.lim-slideBtn .swiper-button-next{
				width: 14px;
				height: 14px;
				}
				.lim-slideBtn .swiper-button-prev{
				left: -7%;
				}
				.lim-slideBtn .swiper-button-next{
				right: -7%;
				}
}

/* register
---------------------------------------------- */
.register{
	padding-block: 110px 140px;
}
	.register__txt{
		text-align: center;
	}
		.register__txt .txt{
			display: inline-block;
			position: relative;
			font-size: 18px;
			letter-spacing: 0.1em;
		}
	.register__txt .txt::before,
	.register__txt .txt::after{
		display: inline-block;
		font-size: inherit;
	}
	.register__txt .txt::before{
		content: '［';
		margin-right: 0.6em;
	}
	.register__txt .txt::after{
		content: '］';
		margin-left: 0.2em;
	}

.lim-flow{
	background-color: rgba(255,255,255,.6);
	margin-top: 50px;
	padding-block: 50px;
}
.lim-flow__ttl{
	justify-content: start;
	flex-wrap: nowrap;
	max-width: 1100px;
}
.lim-flow__ttl .mainTxt{
	color: #b2ae94;
	font-size: 29px;
	letter-spacing: 0.05em;
	white-space: nowrap;
}
.lim-flow__ttl .line{
	width: calc(70 / 1100 * 100%);
	height: 1px;
	background-color: #ccc;
	margin-left: calc(30 / 1100 * 100%);
}
.lim-flow__ttl .subTxt{
	font-size: clamp(13px, 0.478rem + 0.696vw, 16px);
	letter-spacing: 0.1em;
	margin-left: calc(30 / 1100 * 100%);
}
.lim-flow-listWrap{
	max-width: 1000px;
	margin-top: 25px;
}
.lim-flow-list{
	margin-top: -25px;
}
.lim-flow-list > li{
	position: relative;
	margin-top: 25px;
}
.lim-flow-list > li + li::before{
	content: '';
	position: absolute;
	top: 50%;
	left: -46px;
	width: 18px;
	height: 18px;
	border-top: 1px solid var(--color-gold);
	border-right: 1px solid var(--color-gold);
	transform: translateY(-50%) rotate(45deg);
}
.lim-flow-list__ttl .en{
	font-size: 14px;
	font-weight: 300;
	letter-spacing: 0.05em;
}
.lim-flow-list__ttl .ja{
	display: block;
	font-size: clamp(16px,0.737rem + 0.547vw,20px);
	font-weight: 300;
	letter-spacing: 0.1em;
	color: #888041;
	margin-top: 10px;
}
.lim-flow-list__txt{
	font-size: clamp(12px, 0.542rem + 0.433vw, 13px);
	letter-spacing: 0.05em;
	line-height: 1.7;
	margin-top: 0.8em;
}

@media screen and (max-width: 768px){
	.register{
		padding-block: 70px 0;
	}
		.register__txt .txt{
			font-size: 16px;
		}
		.register__txt .txt::before,
		.register__txt .txt::after{
			position: absolute;
			top: 50%;
			transform: translateY(-50%);
			width: 6px;
			height: 50px;
		}
		.register__txt .txt::before{
			content: '';
			left: -1.2em;
			background: url(../img/pc/icon_bracket-l.svg) center/contain no-repeat;
			margin-left: 0;
		}
		.register__txt .txt::after{
			content: '';
			right: -1em;
			background: url(../img/pc/icon_bracket-r.svg) center/contain no-repeat;
			margin-right: 0;
		}

	.lim-flow{
		width: 100%;
		padding-bottom: 50px;
	}
	.lim-flow__ttl{
		justify-content: center;
		flex-direction: column;
		flex-wrap: wrap;
		width: 100%;
		max-width: 560px;
		text-align: center;
	}
	.lim-flow__ttl .mainTxt{
		font-size: 22px;
	}
	.lim-flow__ttl .line{
		width: 70px;
		margin-top: 18px;
		margin-left: 0;
	}
	.lim-flow__ttl .subTxt{
		font-size: 14px;
		margin-top: 18px;
		margin-left: 0;
	}
	.lim-flow-listWrap{
		width: 100%;
		margin-top: 55px;
		padding-inline: 6%;
	}
	.lim-flow-list > li + li::before{
		left: -46px;
		width: 18px;
		height: 18px;
	}
	.lim-flow-list__ttl .ja{
		font-size: 20px;
	}
	.lim-flow-list__txt{
		font-size: 13px;
		margin-top: 1em;
	}
}

/* request-merit
---------------------------------------------- */
.register .request-merit{
	/* background: rgba(224, 224, 224, .8); */
	background: none;
	margin-top: 80px;
	padding: 0;
}
	.register .request-btnList{
		/* margin-top: -105px; */
	}
	.register .request-btnList__link._request{
		background: -webkit-radial-gradient(50% 50%, circle farthest-corner, rgba(164, 158, 133, 1) 0%, rgba(122, 109, 88, 1) 100%);
		background: -webkit-gradient(radial,50% 50% ,0 , 50% 50%, 137.3 ,color-stop(0,rgba(164, 158, 133, 1) ),color-stop(1,rgba(122, 109, 88, 1) ));
		background: radial-gradient(50% 50%, circle farthest-corner, rgba(164, 158, 133, 1) 0%, rgba(122, 109, 88, 1) 100%);
	}
	.register .request-merit__ttl{
		color: #333;
		margin-top: 70px;
	}
	.register .request-merit__txt,
	.register .request-merit-body__txt{
		color: #333;
	}
	.register .request-merit__ttl::before{
		background: linear-gradient(89deg, rgba(155, 152, 135, 1) 0%, rgba(122, 109, 88, 1) 100%);
	}
	.register .request-merit__ttl::after{
		background: linear-gradient(89deg, rgba(122, 109, 88, 1) 0%, rgba(155, 152, 135, 1) 100%);
	}
	.register .request-merit-body__num,
	.register .request-merit-body__txt .em{
		color: #8c8341;
	}
	.register .request-merit-body__txt::before{
		background-color: rgba(209, 206, 191, 1);
	}
	.register .request-merit-list .p-caption.w2{
		opacity: 1;
		text-shadow: 2px 2px 20px rgb(0, 0, 0, 30%), -2px 2px 20px rgb(0, 0, 0, 30%), 2px -2px 20px rgb(0, 0, 0, 30%), -2px -2px 20px rgb(0, 0, 0, 30%);
	}

@media screen and (min-width: 769px) {
	.register .request-merit__ttl{
		max-width: 800px;
	}
	.register .request-merit-list{
		max-width: 800px;
		gap: calc(50 / 800 * 100%);
	}
	.request-merit-list > li{
		width: calc((100% - 50px) / 2);
	}
}
@media screen and (max-width: 768px){
	.register .request-merit{
		width: 100%;
		margin-top: 70px;
		padding-bottom: 70px;
	}
		.register .request-btnList{
			/* margin-top: -80px; */
		}
		.register .request-merit__ttl{
			margin-top: 50px;
		}
		.register .request-merit-list > li + li::before{
			background: #d1cebf;
		}
		.register .request-merit__txt,
		.register .request-merit-body__txt{
			color: #333;
		}
}