@charset "utf-8";
.loading_base {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100vh;
		background: #000;
		z-index: 9999;
}
.loading_base .loading_logo {
		width: 123px;
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		text-align: center;
		color: #fff;
}
@media(max-width: 767px) {
		.loading_base {
				height: 100vh;
				height: 100dvh;
		}
		.loading_base .loading_logo {
				width: 58px;
		}
}
.loading_count_wrap {
		display: flex;
		justify-content: center;
		padding-top: 50px;
}
.loading_count {
		font-family: Inter;
		font-size: 10px;
}
.loading_count span {
		font-size: 15px;
		width: 25px;
		display: inline-block;
}
@media(max-width: 767px) {
		.loading_count_wrap {
				padding-top: 25px;
		}
		.loading_count {
				font-size: 10px;
		}
		.loading_count span {
				font-size: 13px;
				width: 22px;
		}
}
.loading_logo_rocket {
		position: relative;
		transition: all 1.5s cubic-bezier(0.16, 1, 0.3, 1);
		transition-delay: 0.8s;
		top: 0;
		width: 123px;
}
.loading_logo_rocket img {
		width: 100%;
		height: auto;
}
@media(max-width: 767px) {
		.loading_logo_rocket {
				width: 58px;
		}
}
.loading_logo_rocket .rocket_cover {
		position: absolute;
		top: -10px;
		left: -10px;
		width: calc(100% + 20px);
		height: calc(100% + 20px);
		background: rgba(0, 0, 0, 0.8);
		transform-origin: top center;
		z-index: 10
}
.isStart .loading_logo_rocket {
		top: -80vh
}
.isStart .loading_count {
		opacity: 0;
		transition: opacity 0.4s;
		transition-delay: 0.75s;
}
main {
		margin-top: 130px;
}
.kv {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		overflow: hidden;
		height: 100vh;
		z-index: 0
}
.kv_movie {
		width: 100%;
		height: 100%;
		overflow: hidden;
		position: relative;
}
.kv_movie::after {
		content: '';
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: rgba(0, 0, 0, 0.6);
}
.kv_movie video {
		width: 100%;
		height: 100vh;
		height: 100dvh;
		object-fit: cover;
}
#movieSP {
		display: none
}
@media screen and (orientation: portrait) and (max-width: 767px) {
		.kv {
				height: 100vh;
				height: 100dvh;
				top: 0
		}
		#moviePC {
				display: none
		}
}
.kv_spacer {
		height: 150vh;
		min-height: 600px;
}
@media(min-width: 1195px) {
		.kv_spacer {
				display: none
		}
}
.kv_catch {
		position: absolute;
		left: 0;
		top: 50%;
		z-index: 100;
		width: 100%;
		transform: translateY(-3.5vw);
		mix-blend-mode: difference;
}
@media(max-width: 767px) {
		.kv_catch {
				transform: translateY(-10vh);
		}
}
.kv_catch .kv_catch_txt {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		z-index: 100;
		transition: transform 0.6s cubic-bezier(0.87, 0, 0.13, 1), opacity 1s;
		opacity: 0.5;
}
.kv_catch img {
		width: 100%;
		height: auto;
		transform: scale(40);
		transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}
.kv_catch div:nth-child(1) {
		transform: translateY(-70vh);
		transition-delay: 0.18s;
}
.kv_catch div:nth-child(2) {
		transform: translateY(42vh);
		transition-delay: 0.27s;
}
.kv_catch div:nth-child(3) {
		transform: translateY(-18vh);
		transition-delay: 0.11s;
}
.kv_catch div:nth-child(4) {
		transform: translateY(57vh);
		transition-delay: 0.24s;
}
.kv_catch div:nth-child(5) {
		transform: translateY(-35vh);
		transition-delay: 0.15s;
}
.kv_catch div:nth-child(6) {
		transform: translateY(11vh);
		transition-delay: 0.30s;
}
.kv_catch div:nth-child(7) {
		transform: translateY(-70vh);
		transition-delay: 0.13s;
}
.kv_catch div:nth-child(8) {
		transform: translateY(28vh);
		transition-delay: 0.22s;
}
.kv_catch div:nth-child(9) {
		transform: translateY(-7vh);
		transition-delay: 0.17s;
}
.kv_catch div:nth-child(10) {
		transform: translateY(60vh);
		transition-delay: 0.29s;
}
.kv_catch div:nth-child(11) {
		transform: translateY(-55vh);
		transition-delay: 0.12s;
}
.kv_catch div:nth-child(12) {
		transform: translateY(20vh);
		transition-delay: 0.25s;
}
.kv_catch div:nth-child(13) {
		transform: translateY(-26vh);
		transition-delay: 0.20s;
}
.kv_catch div:nth-child(14) {
		transform: translateY(60vh);
		transition-delay: 0.14s;
}
.kv_catch div:nth-child(15) {
		transform: translateY(-13vh);
		transition-delay: 0.28s;
}
.kv_catch div:nth-child(16) {
		transform: translateY(38vh);
		transition-delay: 0.16s;
}
.kv_catch div:nth-child(17) {
		transition: opacity 0.4s;
		transition-delay: 1.5s;
		opacity: 0;
		mix-blend-mode: normal;
}
.isStart .kv_catch div {
		transform: translateY(0) !important;
		opacity: 1;
}
.isStart .kv_catch img {
		transform: scale(1);
}
/* ================= */
.kv .kv_writing {
		position: absolute;
		z-index: 50;
		mix-blend-mode: difference;
}
.writing-1 {
		top: 13vw;
		left: 10vw;
		width: 10vw;
}
.writing-2 {
		bottom: 6.5vw;
		left: 26vw;
		width: 10vw;
}
.writing-3 {
		top: 13.1vw;
		right: 13vw;
		width: 9vw;
}
.writing-4 {
		top: 5vw;
		left: 50vw;
		width: 11vw;
}
.writing-5 {
		bottom: 10vw;
		right: 20vw;
		width: 9vw;
}
.writing-6 {
		top: 27vw;
		left: 10vw;
		width: 8.9vw;
}
.writing-1 .st0, .writing-2 .st0, .writing-3 .st0, .writing-4 .st0, .writing-5 .st0, .writing-6 .st0 {
		fill: none;
		stroke: #fff;
		stroke-width: 2;
		stroke-dasharray: 4000;
		stroke-dashoffset: 4000;
}
.isDraw .writing-2 .st0 /*1 */ {
		animation: drawLine 5s cubic-bezier(0.16, 1, 0.3, 1) forwards;
		animation-delay: 3s;
}
.isDraw .writing-4 .st0 /*2 */ {
		animation: drawLine 5s cubic-bezier(0.16, 1, 0.3, 1) forwards;
		animation-delay: 4s;
}
.isDraw .writing-1 .st0 /* 3 */ {
		animation: drawLine 5s cubic-bezier(0.16, 1, 0.3, 1) forwards;
		animation-delay: 5s;
}
.isDraw .writing-5 .st0 /*4 */ {
		animation: drawLine 5s cubic-bezier(0.16, 1, 0.3, 1) forwards;
		animation-delay: 6s;
}
.isDraw .writing-3 .st0 /*5 */ {
		animation: drawLine 5s cubic-bezier(0.16, 1, 0.3, 1) forwards;
		animation-delay: 7s;
}
.isDraw .writing-6 .st0 /*6 */ {
		animation: drawLine 4.5s cubic-bezier(0.16, 1, 0.3, 1) forwards;
		animation-delay: 8s;
}
@keyframes drawLine {
		0% {
				stroke-dashoffset: 4000;
		}
		100% {
				stroke-dashoffset: 0;
		}
}
@media screen and (orientation: portrait) and (max-width: 767px) {
		.writing-1 {
				top: 20vh;
				left: 10vw;
				width: 25vw;
		}
		.writing-2 {
				bottom: 6vh;
				left: 26vw;
				width: 25vw;
		}
		.writing-3 {
				top: 15vh;
				right: 0;
				width: 25vw;
		}
		.writing-4 {
				top: 29vh;
				left: 60vw;
				width: 25vw;
		}
		.writing-5 {
				bottom: 18vh;
				right: 10px;
				width: 25vw;
		}
		.writing-6 {
				top: inherit;
				bottom: 25vh;
				left: 15px;
				width: 17vw;
		}
}