@charset "utf-8";
.loading_base {
		position: fixed;
		top: 0;
		left: 0;
		width: 100vw;
		height: 100vh;
		height: 100dvh;
		display: flex;
		align-items: center;
		justify-content: center;
		flex-direction: column;
		color: #F55282;
		font-family: 'Inter';
		color: #fff;
		background: linear-gradient(#0c1521 0%, #344a64 100%);
		z-index: 9999
}
.loadingCircle {
		position: relative;
		width: 196px;
		height: 196px;
}
.loadingCircleIn {
		width: 196px;
		height: 196px;
		border: none;
		font-size: 15px;
		cursor: pointer;
		display: flex;
		justify-content: center;
		align-items: center;
}
.loadingCircle .loadingLine {
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
		overflow: visible;
		pointer-events: none;
		border-radius: 50%;
		box-sizing: border-box;
}
.loadingLineBack, .loadingLineFront {
		fill: none;
		stroke-width: 2;
		stroke-dasharray: 603.2;
}
.loadingLineBack {
		stroke: rgba(255, 255, 255, 0.2);
		stroke-dashoffset: 0;
}
.loadingLineFront {
		stroke: #F55282;
		stroke-dashoffset: 603.2;
}
@media (max-width: 767px) {
		.loadingCircle {
				width: 140px;
				height: 140px;
		}
		.loadingCircleIn {
				width: 140px;
				height: 140px;
		}
}
header {
		transition: opacity 0.8s;
		opacity: 0;
		pointer-events: none;
}
header.isAppear {
		opacity: 1;
		pointer-events: all;
}
.sp_nav {
		transition: opacity 0.8s;
		opacity: 0;
}
header.isAppear + .sp_nav {
		opacity: 1;
}
.kv {
		position: relative;
		height: 100vh;
		overflow: hidden;
		min-height: 600px;
}
#kvParticle {
		width: 100%;
		position: fixed;
		/* top: 50px; */
		top: 0;
		left: 21.2vw;
		z-index: 2000;
		pointer-events: none;
		transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}
.isDown {
		transform: scale(0.85);
}
.isOff {
		opacity: 0 !important;
		z-index: -1 !important
}
@media(max-width: 1300px) {
		#kvParticle {
				left: 20vw
		}
}
@media(max-width: 960px) {
		#kvParticle {
				left: 25vw;
				top: -15vw;
		}
}
@media(max-width: 767px) {
		#kvParticle {
				top: 0;
				left: 0;
		}
}
@media screen and (orientation: portrait) and (max-width: 767px) {
		#kvParticle {
				position: absolute;
				top: 0;
				left: 0;
				top: 18vw;
				left: 18vw;
		}
}
#kvBG {
		width: 100%;
		height: 100vh;
		z-index: 0;
		position: fixed;
		top: 0;
		left: 0;
		pointer-events: none;
}
@media(min-width: 768px) and (max-height: 600px) {
		.kv {
				height: 600px !important
		}
}
.isBack {
		opacity: 0.4 !important
}
.kv .kv_news {
		position: absolute;
		bottom: 0;
		left: 0;
		width: 100%;
		height: 110px;
		z-index: 6;
		display: flex;
		align-items: center;
		box-sizing: border-box;
		padding: 0 30px;
		color: #fff;
}
.kv_news::before {
		content: '';
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		transform-origin: left center;
		background: linear-gradient(90deg, #111b27 5%, rgba(17, 27, 39, 0) 100%);
		z-index: -1;
		transition: transform 1s cubic-bezier(0.16, 1, 0.3, 1);
		transition-delay: 0.45s;
		transform: scaleX(0);
}
@media(max-width: 960px) {
		.kv_news::before {
				transition: transform 1.5s cubic-bezier(0.16, 1, 0.3, 1);
				transition-delay: 0.45s;
		}
}
.isStart .kv_news::before {
		transform: scaleX(1);
}
.page_down_wrap {
		opacity: 0;
		transition: opacity 0.4s;
		pointer-events: none;
}
.page_down_wrap.isAppear {
		opacity: 1;
		pointer-events: all;
}
.kv .page_down {
		position: absolute;
		right: 40px;
		bottom: 56px;
		width: 108px;
		height: 108px;
		border-radius: 50%;
		background: linear-gradient(45deg, rgba(12, 21, 33, 1) 0%, rgba(27, 43, 62, 1) 100%);
		box-sizing: border-box;
		cursor: pointer;
		z-index: 100;
		transition: transform 0.32s cubic-bezier(0.25, 1, 0.5, 1);
}
@media (hover: hover) {
		.kv .page_down:hover {
				transform: scale(0.8);
		}
}
.page_down::after {
		content: '';
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background-repeat: no-repeat;
		background-position: center center;
		background-size: cover;
		background-image: url("../images/kv_scroll_down_wht.png");
		z-index: 1;
		pointer-events: none
}
.page_down .scrollRing {
		position: absolute;
		top: 0;
		left: 0;
		pointer-events: none;
		width: 108px;
		height: 108px;
		border: 4px solid rgba(255, 255, 255, 0);
		border-left: 4px solid #F55282;
		border-radius: 50%;
		opacity: 0;
		animation: spin 3s ease-out infinite;
		z-index: 2;
		box-sizing: border-box;
}
@media(max-width: 960px) {
		.kv .page_down {
				right: 30px;
				bottom: 46px;
				width: 60px;
				height: 60px;
		}
		.page_down .scrollRing {
				width: 60px;
				height: 60px;
				border: 3px solid rgba(255, 255, 255, 0);
				border-left: 3px solid #F55282;
		}
}
@media(max-width: 767px) {
		.kv .page_down {
				bottom: 36px;
		}
}
@media screen and (orientation: portrait) and (max-width: 767px) {
		.kv .page_down {
				display: none
		}
}
@keyframes spin {
		/* 非表示待機 */
		0%, 70% {
				transform: rotate(0deg);
				opacity: 0;
		}
		/* 出現 */
		71% {
				opacity: 1;
		}
		/* 2回転 */
		85% {
				transform: rotate(720deg);
				opacity: 1;
		}
		/* 少し残す */
		90% {
				transform: rotate(720deg);
				opacity: 1;
		}
		/* フェードアウト */
		100% {
				transform: rotate(720deg);
				opacity: 0;
		}
}
@media(min-width: 768px) and (max-height: 800px) {
		.kv .kv_news {
				height: 80px
		}
}
@media(max-width: 960px) {
		.kv .kv_news {
				height: 80px;
		}
}
.kv_news_inner {
		width: 74vw;
		margin: 0 auto;
		display: flex;
		align-items: center;
}
@media(min-width: 1921px) {
		.kv_news_inner {
				width: 1600px;
		}
}
@media(max-width: 1200px) {
		.kv_news_inner {
				width: 90%;
				box-sizing: border-box;
				padding: 0;
		}
}
@media(max-width: 960px) {
		.kv_news_inner {
				width: 100%;
		}
}
.kv_news_hd {
		font-size: 18px;
		margin-right: 50px;
}
.kv_news_cont {
		display: flex;
		align-items: center;
}
.kv_news_cont a {
		color: #fff;
		text-decoration: underline;
		text-underline-offset: 4px;
}
@media (hover: hover) {
		.kv_news_cont a:hover {
				color: #F55282;
				text-decoration: none;
		}
}
.kv_news_cont dt {
		margin-right: 40px;
		line-height: 1.6;
		font-weight: 300;
}
.kv_news_cont dd {
		flex: 1;
		line-height: 1.6;
		font-weight: 300;
}
@media(max-width: 960px) {
		.kv {
				height: 70vh
		}
}
@media(max-width: 767px) {
		.kv {
				min-height: 100vh;
				min-height: 100dvh;
				height: auto;
				height: auto;
		}
		.kv .kv_news {
				height: 60px;
				bottom: 0;
		}
		.kv_news_hd {
				font-size: 14px;
				margin-right: 25px;
		}
		.kv_news_cont dt {
				font-size: 14px;
				margin-right: 15px;
		}
		.kv_news_cont dd {
				font-size: 14px;
		}
}
@media screen and (orientation: portrait) and (max-width: 767px) {
		.kv .kv_news {
				position: static;
				position: relative;
				left: inherit;
				bottom: inherit;
				padding: 20px 25px;
				height: auto;
		}
		.kv_news_inner {
				display: block;
		}
		.kv_news_hd {
				font-size: 14px;
				margin: 0 0 5px;
		}
		.kv_news_cont dt {
				margin: 0 10px 0 0;
				font-size: 14px;
		}
		.kv_news_cont dd {
				font-size: 14px;
		}
}
.kv_inner {
		display: flex;
		align-items: center;
		height: calc(100vh - 50px);
		max-width: 74vw;
		margin: 0 auto;
		position: relative;
		z-index: 5;
}
@media(max-width: 1200px) {
		.kv_inner {
				max-width: 90vw;
				padding: 0 30px;
		}
}
@media(max-width: 960px) {
		.kv_inner {
				height: calc(77vh - 100px);
				width: 100%;
				max-width: inherit;
		}
}
.kv_catch {
		font-weight: 500;
		margin: 0 0 30px;
		font-size: clamp(2.25rem, 1.25vw + 1.5rem, 3rem); /* 960 - 1920 / 36 - 48 */
		position: relative;
		transition: transform 0.9s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.8s;
		transition-delay: 0.15s;
		opacity: 0;
		transform: translateX(-50px);
}
.isStart .kv_catch {
		opacity: 1;
		transform: translateX(0px);
}
.kv_catch::before {
		content: '';
		display: block;
		position: absolute;
		top: -29px;
		left: 0;
		width: 70px;
		height: 2px;
		background: #F55282;
		transform-origin: left center;
		transition: transform 0.8s cubic-bezier(0.16, 1, 0.3, 1) 0.35s, opacity 0.4s 0.3s;
		transform: scaleX(10);
		opacity: 0;
}
.isStart .kv_catch::before {
		transform: scaleX(1);
		opacity: 1;
}
@media(max-width: 960px) {
		.kv_catch::before {
				width: 56px;
				top: -29px;
		}
}
.kv_caption p {
		line-height: 2.0;
		font-size: clamp(0.938rem, 0.313vw + 0.75rem, 1.125rem); /* 960 - 1920 / 15 - 18 */
}
.kv_caption p:first-child {
		transition: transform 0.9s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.8s;
		transition-delay: 0.25s;
		opacity: 0;
		transform: translateX(-50px);
}
.kv_caption p:nth-child(2) {
		transition: transform 0.9s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.8s;
		transition-delay: 0.35s;
		opacity: 0;
		transform: translateX(-50px);
}
.isStart .kv_caption p {
		opacity: 1;
		transform: translateX(0px);
}
@media(min-width: 1921px) {
		.kv_inner {
				max-width: 1600px;
		}
		.kv_catch {
				font-size: 48px;
		}
		.kv_caption p {
				font-size: 22px;
		}
}
@media(max-width: 1500px) {
		.kv_caption p {
				font-size: 15px;
		}
}
@media(max-width: 767px) {
		.kv_caption p {
				font-size: 13px;
		}
}
.tabletObj {
		display: none
}
@media(min-width: 768px) and (max-width: 960px) {
		.tabletObj {
				display: block;
		}
		.kv_lead {
				display: none
		}
}
.kv_en {
		width: 120%;
		margin: 0 0 7vh;
		aspect-ratio: 10 / 2.35;
		background: #353441;
		background: linear-gradient(90deg, rgba(67, 62, 76, 1) 0%, rgba(229, 114, 149, 1) 40%, rgba(247, 115, 154, 1) 75%, rgba(67, 62, 76, 1) 100%);
		background-size: 150% 150%;
		animation: gradMoveKV 1s linear infinite alternate;
		mask-image: url("../images/kv_en_pc.png");
		mask-repeat: no-repeat;
		mask-position: 0 0;
		mask-size: 100% 100%;
		-webkit-mask-image: url("../images/kv_en_pc.png");
		-webkit-mask-repeat: no-repeat;
		-webkit-mask-position: 0 0;
		-webkit-mask-size: 100% 100%;
		transition: transform 1s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.8s;
		transform: translateX(-20%);
		opacity: 0
}
.isStart .kv_en {
		transform: translateX(0%);
		opacity: 1
}
@keyframes gradMoveKV {
		from {
				background-position: 0% 0;
		}
		to {
				background-position: 100% 0;
		}
}
@media(max-width: 960px) {
		.kv_en {
				margin: 0 0 80px
		}
}
.kv_en_sp {
		display: none;
}
@media screen and (orientation: portrait) and (max-width: 767px) {
		.kv {
				min-height: 100vh;
				min-height: 100dvh;
		}
		.kv_inner {
				padding: 0;
				height: inherit;
				display: block;
				position: relative;
				z-index: 5000
		}
		.kv_en {
				margin: 100px 0 60px;
				margin-top: calc(10vw + 100px);
				aspect-ratio: 10 / 6.8;
				background: linear-gradient(90deg, rgba(53, 52, 65, 1) 0%, rgba(130, 109, 124, 1) 18%, rgba(227, 95, 222, 1) 53%, rgba(97, 59, 128, 1) 80%, rgba(53, 52, 65, 1) 100%);
				mask-image: url("../images/kv_en_sp.png");
				-webkit-mask-image: url("../images/kv_en_sp.png");
				z-index: 0;
				position: relative;
				background-size: 150% 150%;
				display: none;
		}
		.kv_en_sp {
				display: block;
				margin: 0px 0 13vh;
				margin-top: 14vh;
				margin-left: 25px;
				width: 58vw;
				height: 38vh;
				aspect-ratio: initial;
				position: relative;
				/* overflow: hidden;
				display: flex;
				flex-flow: column;
				justify-content: space-between; */
		}
		.kv_en_sp .catch-2, .kv_en_sp .catch-3, .kv_en_sp .catch-4 {
				position: absolute;
				top: 0;
				left: 0;
				width: 100%;
		}
		.kv_en_sp div {
				transition: transform 1.2s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.5s;
				transform: translateX(50px);
				opacity: 0;
		}
		.isStart .kv_en_sp div {
				opacity: 1;
				transform: translateX(0)
		}
		.kv_en_sp div.catch-1 {
				transition-delay: 0.15s
		}
		.kv_en_sp div.catch-2 {
				transition-delay: 0.25s
		}
		.kv_en_sp div.catch-3 {
				transition-delay: 0.35s
		}
		.kv_en_sp div.catch-4 {
				transition-delay: 0.45s
		}
		.kv_en_sp img {
				width: 100%;
				height: auto;
		}
		.kv_catch {
				font-size: 22px;
				padding: 0 25px;
				margin: 0 0 20px;
		}
		.kv_catch::before {
				width: 40px;
				height: 1px;
				left: 25px;
				top: -20px;
		}
		.kv_lead {
				display: block;
				padding: 0 25px;
				line-height: 1.8;
				font-size: 15px;
				margin-bottom: 80px;
		}
		.kv_lead br {
				display: none
		}
}