/**
 *
 * page-home-loading.scss
 *
 */
/* ------------------------------------------------------------
 loading
------------------------------------------------------------ */
:root {
	--color-home-loading: #1a81b9;
	--z-index-home-loading: 100000;
	--opacity-home-loading-start: .12;
	--transition-home-loading-appear: 1600ms var( --ease-level1 );
	--transition-home-loading-leave: 900ms var( --ease-heavy1 );
	--animation-home-loading-swim: 300ms;
}

/* ------------------------------------------------------------
 home-loading
------------------------------------------------------------ */
html.is-home-loading,
html.is-home-loading body {
	overflow: hidden;
}

.home-loading {
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: var(--z-index-home-loading);
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	pointer-events: auto;
}

.home-loading::before {
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background-color: var(--color-home-loading);
	transition: var(--transition-home-loading-leave);
	transition-property: opacity;
}

.home-loading[hidden] {
	display: none;
}

.home-loading.is-visible .home-loading__fish {
	opacity: 1;
}

.home-loading.is-leaving::before {
	opacity: 0;
}

.home-loading.is-leaving .home-loading__visual {
	-webkit-transform: translateX(calc(-50vw - 50% - 1rem));
	transform: translateX(calc(-50vw - 50% - 1rem));
}

.home-loading.is-leaving .home-loading__fish {
	opacity: 1;
	transition: none;
	-webkit-animation: home-loading-swim var(--animation-home-loading-swim) var(--ease-heavy1) infinite;
	animation: home-loading-swim var(--animation-home-loading-swim) var(--ease-heavy1) infinite;
}

.home-loading__visual {
	position: relative;
	flex: none;
	transition: var(--transition-home-loading-leave);
	transition-property: -webkit-transform;
	transition-property: transform;
	transition-property: transform, -webkit-transform;
}

@media screen and (min-width: 1024px) {
	.home-loading__visual {
		width: 44.025rem ;
	}
}

@media screen and (max-width: 1023px) {
	.home-loading__visual {
		width: 22.0125rem ;
	}
}

.home-loading__fish {
	display: block;
	width: 100%;
	height: auto;
	opacity: var(--opacity-home-loading-start);
	transition: var(--transition-home-loading-appear);
	transition-property: opacity;
}

@-webkit-keyframes home-loading-swim {
	0%, 100% {
		-webkit-transform: rotate(0deg) scaleX(1);
		transform: rotate(0deg) scaleX(1);
	}
	25% {
		-webkit-transform: rotate(-2deg) scaleX(0.97);
		transform: rotate(-2deg) scaleX(0.97);
	}
	75% {
		-webkit-transform: rotate(2deg) scaleX(0.97);
		transform: rotate(2deg) scaleX(0.97);
	}
}

@keyframes home-loading-swim {
	0%, 100% {
		-webkit-transform: rotate(0deg) scaleX(1);
		transform: rotate(0deg) scaleX(1);
	}
	25% {
		-webkit-transform: rotate(-2deg) scaleX(0.97);
		transform: rotate(-2deg) scaleX(0.97);
	}
	75% {
		-webkit-transform: rotate(2deg) scaleX(0.97);
		transform: rotate(2deg) scaleX(0.97);
	}
}

@media (prefers-reduced-motion: reduce) {
	.home-loading::before,
	.home-loading__visual,
	.home-loading__fish {
		transition: none;
		-webkit-animation: none;
		animation: none;
	}
}
/*# sourceMappingURL=sourcemaps/page-home-loading.css.map */