/* ----------------------------
 header-mainvisual
---------------------------- */

.mainvisual {
	height: 652px;
	margin-bottom: 0;
	padding: 0;
	position: relative;
	width: 100%;
}

.mainvisual__copy {
	animation: fadeout-anim_copy 1s ease-in forwards 2s;
	left: 50%;
	opacity: 1;
	position: absolute;
	top: 48%;
	transform: translate(-50%, -50%);
	width: 100%;
	z-index: 3;
}

.mainvisual__copy p {
	color: #3D3D3D;
	letter-spacing: 0.14em;
	margin-bottom: -20px;
	text-align: center;
}

.mainvisual__copy01 {
	animation: fadein-anim 1s ease-in forwards 0s;
	opacity: 0;
}

.mainvisual__copy02 {
	animation: fadein-anim 1s ease-in forwards 0.7s;
	opacity: 0;
}

.mainvisual__img__wrap {
	height: 652px;
	position: absolute;
	width: 100%;
	z-index: 2;
}

.mainvisual img {
	height: 652px;
	vertical-align: top;
	width: 100%;
	-o-object-fit: cover;
	object-fit: cover;
}

.mainvisual__topimg-outline {
	animation: fadeout-anim_outline 5s forwards 2.5s;
	height: 652px;
	opacity: 1;
	position: absolute;
	width: 100%;
	z-index: 2;
}

.maincopy {
	animation: fadein-anim 2s ease-in forwards 3.2s;
	left: 50%;
	letter-spacing: 0.1em;
	line-height: 1.4;
	opacity: 0;
	position: absolute;
	text-align: center;
	text-shadow: 0px 0px 10px rgb(255, 255, 255), 0px 0px 30px rgb(255, 255, 255), 0px 0px 40px rgba(255, 255, 255, 0.7);
	top: 45%;
	transform: translate(-50%, -50%);
	width: 100%;
	z-index: 5;
}

.mainvisual__topimg {
	animation: fadein-anim 3s ease-in forwards 3.5s;
	height: 652px;
	opacity: 0;
	position: absolute;
	width: 100%;
}

@media (max-width: 767px) {

.mainvisual {
	height: 286px;
}

.mainvisual__copy {
	font-size: 2.6rem;
	width: 100%;
}

.mainvisual__copy p {
	letter-spacing: normal;
	margin-bottom: -20px;
}

.mainvisual__img__wrap {
	height: 286px;
	overflow: hidden;
}

.mainvisual img {
	height: 320px;
	top: -3%;
}

.mainvisual__topimg-outline {
	height: 320px;
	top: -3%;
}

.maincopy {
	font-size: 2.8rem;
	letter-spacing: 0.05em;
}

.mainvisual__topimg {
	height: 320px;
	top: -3%;
}

}

@keyframes fadeout-anim_copy {

100% {
	opacity: 0;
}

}

@keyframes fadein-anim {

100% {
	opacity: 1;
}

}

@keyframes fadeout-anim_outline {

70% {
	opacity: 0.3;
}

100% {
	opacity: 0;
}

}

