@charset "UTF-8";

.mv__area--inner {
	justify-content: space-between;
    width: 641px;
}
.mv__area--head h2 {
	position: relative;
	/* width: 365px; */
}

.mv__area--head h2 span {
	position: relative;
	background-color: transparent;
	padding: 0 30px;
	z-index: 0;
	width: 0;
	transition: all ease-in .5s;
  opacity: 0;
}

.mv__area--head h2 span::before {
	content: '';
	z-index: -1;
	position: absolute;
	border-radius: 0px 0px 25px 0px;
	background: #fff;
	height: 100%;
	display: block;
	left: 0;
	width: 0;
	transition: all ease-in .25s;
    opacity: 0;
}

.pageLoaded .mv__area--head h2 span {
	width: 100%;
	opacity: 1;
}

.pageLoaded .mv__area--head h2 span:first-child {
	width: 70%;
	opacity: 1;
}

.pageLoaded .mv__area--head h2 span::before {
	width: 100%;
	opacity: 1;
}

.mv__area--head h2 span.animation-delay-1 {
	transition-delay: 0s;
}

.mv__area--head h2 span.animation-delay-2 {
	transition-delay: .25s;
}

.mv__area--head h2 span.animation-delay-3 {
	transition-delay: 0.5s;
}


.mv__area--img {
	transition: all ease-in .5s;
    opacity: 0;
	transition-delay: .5s;
}

.pageLoaded .mv__area--img {
	opacity: 1;
}

.mv__area p {
	transition: all ease-in .5s;
    opacity: 0;
	transition-delay: .75s;
	scale: 1.15;
}

.pageLoaded .mv__area p {
	opacity: 1;
	scale: 1;
}

.mv__area .disp-pc a {
	transition: all ease-in-out .5s;
	opacity: 0;
	transition-delay: 1.25s;
	/* scale: 0.85; */
	scale: 1.15;
}

.pageLoaded .mv__area .disp-pc a {
	opacity: 1;
	scale: 1;
}

.animation-delay-1 {
	transition-delay: 0s;
}

.animation-delay-2 {
	transition-delay: 0.25s;
}

.animation-delay-3 {
	transition-delay: .75s;
}

.animation-delay-4 {
	transition-delay: 1s;
}

@media screen and (max-width: 768px) {

	.mv__area--head {
		width: calc(280 / 430 * 100vw);
		margin-left:calc(25 / 430 * 100vw);
		display: flex;
		justify-content:flex-start ;
		align-items: flex-start;
	}

	.mv__area--head h2 span {
	padding: 0 calc(20 / 430 * 100vw);
	text-align: left;
}

	.pageLoaded .mv__area--head h2 span:first-child {
		width: 100%;
	}

		.pageLoaded .mv__area--head h2 span {
		width: 80%;
	}

	.mv__area--inner {
		width: 100%;
	}


}