/* =========================================================
   [w3] メインビジュアル キャッチコピー文字送り
   #body_wrap.w3-mv-copy-anim 時のみ有効（カスタマイズでオンオフ）
   ※ SWELL は body_class を #body_wrap に付与する
   ========================================================= */

#body_wrap.w3-mv-copy-anim #main_visual .p-mainVisual__slideTitle:not(.w3-mv-title-ready) {
	opacity: 0;
}

#body_wrap.w3-mv-copy-anim #main_visual .p-mainVisual__slideText:not(.w3-mv-sub-shown) {
	opacity: 0;
}

#body_wrap.w3-mv-copy-anim #main_visual .w3-mv-char {
	display: inline-block;
	opacity: 0;
	transform: translate3d(-14px, 0, 0);
	transition:
		opacity 0.7s ease,
		transform 0.7s ease;
}

#body_wrap.w3-mv-copy-anim #main_visual .w3-mv-char.is-in {
	opacity: 1;
	transform: translate3d(0, 0, 0);
}

#body_wrap.w3-mv-copy-anim #main_visual .p-mainVisual__slideText {
	transition: opacity 1s ease;
}

#body_wrap.w3-mv-copy-anim #main_visual .p-mainVisual__slideText.w3-mv-sub-shown {
	opacity: 1;
}

@media (prefers-reduced-motion: reduce) {
	#body_wrap.w3-mv-copy-anim #main_visual .p-mainVisual__slideTitle:not(.w3-mv-title-ready),
	#body_wrap.w3-mv-copy-anim #main_visual .p-mainVisual__slideText:not(.w3-mv-sub-shown),
	#body_wrap.w3-mv-copy-anim #main_visual .w3-mv-char {
		opacity: 1;
		transform: none;
		transition: none;
	}
}