@charset "utf-8";

:root {
	--breakpoint-pc1920: 1920;
}



/* ********************************************************************************* */
/* 共通 */
.lp_container {
	width: 100%;
	min-height: 100vh;
}

.block_title {
	width: 100%;
	height: calc(73 / var(--breakpoint-pc1920) * 100vw);
	margin-bottom: calc(60 / var(--breakpoint-pc1920) * 100vw);
}

.block_title span:nth-of-type(1) {
	position: absolute;
	top: 0;
	left: calc(288 / var(--breakpoint-pc1920) * 100vw);
	margin-top: calc(6 / var(--breakpoint-pc1920) * 100vw);
	font-family: "Roboto", Helvetica, sans-serif;
	font-size: calc(42 / var(--breakpoint-pc1920) * 100vw);
	font-weight: bold;
	color: rgba(5, 130, 227, 0.15);
}

.block_title span:nth-of-type(2) {
	position: absolute;
	top: 0;
	left: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	font-size: calc(32 / var(--breakpoint-pc1920) * 100vw);
	text-align: center;
}

.block_title span:nth-of-type(2) img {
	width: calc(303 / var(--breakpoint-pc1920) * 100vw);
	height: calc(63 / var(--breakpoint-pc1920) * 100vw);
}

.block_title hr {
	position: absolute;
	bottom: 0;
	left: 0;
	width: calc(1324 / var(--breakpoint-pc1920) * 100vw);
	margin: 0;
	border: none;
	border-bottom: 1px solid #0582E3;
}
/*
.side_icon {
	display: none;
}
*/


@media (max-width: 768px) {
}

@media (min-width: 1920px) {
	.block_title {
		height: 73px;
		margin-bottom: 60px;
	}

	.block_title span:nth-of-type(1) {
		left: 288px;
		margin-top: 6px;
		font-size: 42px;
	}

	.block_title span:nth-of-type(2) {
		font-size: 32px;
	}

	.block_title span:nth-of-type(2) img {
		width: 303px;
		height: 63px;
	}

	.block_title hr {
		width: 1324px;
	}
}



/* ********************************************************************************* */
/* メンバー登録 */
#lp_registration {
	width: 100%;
}

#lp_registration .registration_box {
	display: flex;
	align-items: center;
	justify-content: center;
	width: calc(1200 / var(--breakpoint-pc1920) * 100vw);
	height: calc(440 / var(--breakpoint-pc1920) * 100vw);
	margin: calc(240 / var(--breakpoint-pc1920) * 100vw) auto calc(140 / var(--breakpoint-pc1920) * 100vw);
	background-color: #F8F8F8;
}

#lp_registration .registration_box .registration_info {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	width: calc(550 / var(--breakpoint-pc1920) * 100vw);
}

#lp_registration .registration_box .registration_info .info_ttl {
	margin-bottom: calc(20 / var(--breakpoint-pc1920) * 100vw);
	font-size: calc(32 / var(--breakpoint-pc1920) * 100vw);
}

#lp_registration .registration_box .registration_info .info_ttl:before {
	content: "|";
	display: inline-block;
	font-weight: bold;
	transform: translate(calc(-20 / var(--breakpoint-pc1920) * 100vw), calc(-2 / var(--breakpoint-pc1920) * 100vw)) rotate(-25deg);
}

#lp_registration .registration_box .registration_info .info_ttl:after {
	content: "|";
	display: inline-block;
	font-weight: bold;
	transform: translate(calc(20 / var(--breakpoint-pc1920) * 100vw), calc(-2 / var(--breakpoint-pc1920) * 100vw)) rotate(25deg);
}

#lp_registration .registration_box .registration_info .info_txt {
	margin-bottom: calc(40 / var(--breakpoint-pc1920) * 100vw);
	font-size: calc(22 / var(--breakpoint-pc1920) * 100vw);
}

#lp_registration .registration_box .registration_info .info_txt ruby {
    font-size: calc(22 / var(--breakpoint-pc) * 100vw);
    text-decoration: underline;
    color: #FF9A34;
}

#lp_registration .registration_box .registration_info a {
	display: flex;
	align-items: center;
	justify-content: center;
	align-self: flex-end;
	width: calc(360 / var(--breakpoint-pc) * 100vw);
	height: calc(42 / var(--breakpoint-pc) * 100vw);
	font-size: calc(18 / var(--breakpoint-pc) * 100vw);
	color: #fff;
	text-decoration: none;
	border-radius: 42px;
}

#lp_registration .registration_box .registration_info a:hover {
	opacity: 0.5;
}

#lp_registration .registration_box .registration_info a.btn_regist {
	margin: 0 auto calc(15 / var(--breakpoint-pc) * 100vw);
	background-color: #FF9A34;
}

#lp_registration .registration_box .registration_info a.btn_select {
	margin: 0 auto;
	background-color: #0582E2;
}

#lp_registration .registration_box .registration_img {
	width: calc(251 / var(--breakpoint-pc1920) * 100vw);
	height: calc(299 / var(--breakpoint-pc1920) * 100vw);
}

#lp_registration .registration_box .registration_img img {
	width: 100%;
	height: auto;
}


@media (max-width: 768px) {
}

@media (min-width: 1920px) {
	#lp_registration .registration_box {
		width: 1200px;
		height: 440px
		margin: 240px;
	}

	#lp_registration .registration_box .registration_info {
		width: 550px;
	}

	#lp_registration .registration_box .registration_info .info_ttl {
		margin-bottom: 20px;
		font-size: 32px;
	}

	#lp_registration .registration_box .registration_info .info_ttl:before {
		transform: translate(-20px, -2px) rotate(-25deg);
	}

	#lp_registration .registration_box .registration_info .info_ttl:after {
		transform: translate(20px, -2px) rotate(25deg);
	}

	#lp_registration .registration_box .registration_info .info_txt {
		margin-bottom: 40px;
		font-size: 22px;
	}

	#lp_registration .registration_box .registration_info .info_txt ruby {
	    font-size: 22px
	}

	#lp_registration .registration_box .registration_info a {
		width: 360px;
		height: 42px;
		font-size: 18px;
	}

	#lp_registration .registration_box .registration_info a.btn_regist {
		margin: 0 auto 15px;
	}

	#lp_registration .registration_box .registration_img {
		width: 251px;
		height: 299px;
	}
}



/* ********************************************************************************* */