div.mv_top {
	position: relative;
	width: 100%;
	height: calc(100vh - 100px);
	overflow: hidden;
	transition: all .2s ease-in;
}

/* .slick-slide
-------------------------------------------------------------*/

div.mv_top li.slick-slide {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: flex-start;
	flex-direction: column;
	width: 100%;
	height: calc(100vh - 100px);
	/* padding-left: 83px; */
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
}
div.mv_top li.slick-slide div.wipe {
	opacity: 0;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
	width: 100%;
	height: calc(100vh - 100px);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	pointer-events: none;
}
div.mv_top li.slick-slide.SC div.wipe {
	animation: img-wrap 1.5s cubic-bezier(.4, 0, .2, 1) forwards;
	animation-delay: 5.4s;

	@-moz-document url-prefix() {/* Firefoxで時間がずれるので対処 */
		animation-delay: 9s;
	}
}

_::-webkit-full-page-media, _:future, :root div.mv_top li.slick-slide.SC div.wipe {
/* ここにsafariブラウザのみ適用したいCSSプロパティを入れる */
animation-delay: 6.2s;
}



@keyframes img-wrap {
	0% {
		opacity: 0;
		clip-path: circle(0 at 0% 50%);
	}
	10% {
		opacity: 1;
	}

	100% {
		opacity: 1;
		clip-path: circle(200% at 0% 50%);
	}
}

div.mv_top li.slick-slide span {
	margin-bottom: 30px;
	font-weight: bold;
	font-size: min(3.4vw,4rem);
	letter-spacing: 0.05em;
	line-height: 1.6;
	color: #fff;
}
div.mv_top li.mvL1.slick-slide span {
	color: #000;
}
div.mv_top li.slick-slide span br.sp_only {
	display: none;
}
div.mv_top li.slick-slide a {
	color: #fff;
}
div.mv_top li.mvL1.slick-slide a {
	color: #000;
	border-color: #000;
}
div.mv_top li.mvL1.slick-slide a:hover {
	border-color: #fff;
}
div.mv_top li.mvL1.slick-slide a::after {
	color: #000;
	background-color: #000;
}
div.mv_top li.mvL1.slick-slide a:hover::after {
	background-color: #0099C8;
}
div.mv_top li.slick-slide a:hover {
	color: #0099C8;
}


div.mv_top li.slick-slide span,
div.mv_top li.slick-slide a {
	opacity: 0;
}
div.mv_top li.slick-slide.SC span {
	animation: span-fade 7s cubic-bezier(.4, 0, .2, 1) forwards;

	@-moz-document url-prefix() {/* Firefoxで時間がずれるので対処 */
		animation: span-fade 10.6s cubic-bezier(.4, 0, .2, 1) forwards;
	}
}
div.mv_top li.slick-slide.SC a {
	animation: a-fade 7s cubic-bezier(.4, 0, .2, 1) forwards;

	@-moz-document url-prefix() {/* Firefoxで時間がずれるので対処 */
		animation: span-fade 10.6s cubic-bezier(.4, 0, .2, 1) forwards;
	}
}

_::-webkit-full-page-media, _:future, :root div.mv_top li.slick-slide.SC span {
/* ここにsafariブラウザのみ適用したいCSSプロパティを入れる */
	animation: span-fade 8s cubic-bezier(.4, 0, .2, 1) forwards;
}

_::-webkit-full-page-media, _:future, :root div.mv_top li.slick-slide.SC a {
/* ここにsafariブラウザのみ適用したいCSSプロパティを入れる */
	animation: span-fade 8s cubic-bezier(.4, 0, .2, 1) forwards;
}

@keyframes span-fade {
	0%  {opacity: 0;}
	15% {opacity: 1;}
	20% {opacity: 1;}
	70% {opacity: 1;}
	85% {opacity: 0;}
	100%{opacity: 0;}
}
@keyframes a-fade {
	0%  {opacity: 0;}
	25% {opacity: 1;}
	30% {opacity: 1;}
	70% {opacity: 1;}
	85% {opacity: 0;}
	100%{opacity: 0;}
}

/* 
div.mv_top li.slick-slide span,
div.mv_top li.slick-slide a {
	opacity: 0;
}
div.mv_top li.slick-slide.SC span {
	animation: span-fade 1s cubic-bezier(.4, 0, .2, 1) forwards;
	animation-delay: .1s;
}
div.mv_top li.slick-slide.SC a {
	animation: a-fade 1s cubic-bezier(.4, 0, .2, 1) forwards;
	animation-delay: 1.1s;
}
@keyframes span-fade {
	0% {opacity: 0;}
	100% {opacity: 1;}
}
@keyframes a-fade {
	0% {opacity: 0;}
	100% {opacity: 1;}
}
 */

/* 日本語サイトの場合 */
body:not(.en) div.mv_top li.mvL1 {background-image: url(/assets/img/top/mv_pc_1.jpg);}
body:not(.en) div.mv_top li.mvL2 {background-image: url(/assets/img/top/mv_pc_2.jpg);}
body:not(.en) div.mv_top li.mvL3 {background-image: url(/assets/img/top/mv_pc_3.jpg);}
body:not(.en) div.mv_top li.mvL4 {background-image: url(/assets/img/top/mv_pc_4.png);}

body:not(.en) div.mv_top li.mvL1 div.wipe {background-image: url(/assets/img/top/mv_pc_2.jpg);}
body:not(.en) div.mv_top li.mvL2 div.wipe {background-image: url(/assets/img/top/mv_pc_3.jpg);}
body:not(.en) div.mv_top li.mvL3 div.wipe {background-image: url(/assets/img/top/mv_pc_4.png);}
body:not(.en) div.mv_top li.mvL4 div.wipe {background-image: url(/assets/img/top/mv_pc_1.jpg);}
/* 日本語サイトの場合ここまで */


/* 英語サイトの場合 */
body.en div.mv_top li.mvL1 {background-image: url(/assets/img/top/mv_pc_1.jpg);}
body.en div.mv_top li.mvL2 {background-image: url(/assets/img/top/mv_pc_2.jpg);}
body.en div.mv_top li.mvL3 {background-image: url(/assets/img/top/mv_pc_3.jpg);}

body.en div.mv_top li.mvL1 div.wipe {background-image: url(/assets/img/top/mv_pc_2.jpg);}
body.en div.mv_top li.mvL2 div.wipe {background-image: url(/assets/img/top/mv_pc_3.jpg);}
body.en div.mv_top li.mvL3 div.wipe {background-image: url(/assets/img/top/mv_pc_1.jpg);}
/* 英語サイトの場合ここまで */


/* .slick-arrow
-------------------------------------------------------------*/

div.mv_top button.slick-arrow {
	position: absolute;
	left: auto;
	top: auto;
	bottom: 74px;
	z-index: 2;
	width: 60px;
	height: 60px;
	display: flex;
	justify-content: center;
	align-items: center;
	border: 1px solid #fff;
	border-radius: 4px;
	transition: all .2s ease-in;
}
div.mv_top button.slick-arrow.button_prev {
	padding-left: 9px;
	right: 115px;
}
div.mv_top button.slick-arrow.button_next {
	padding-right: 9px;
	right: 53px;
}
div.mv_top button.slick-arrow::before {
	content: '';
	width: 14px;
	height: 14px;
	border: 1px solid;
	border-color:  transparent transparent #fff #fff;
	transform: scale(1) rotate(45deg);
	transition: all .2s ease-in;
}
div.mv_top button.slick-arrow.button_next::before {
	border-color:  #fff #fff transparent transparent;
}

/* slick-dots
-------------------------------------------------------------*/

div.mv_top div.mv_dots {
	position: absolute;
	bottom: 50px;
	right: 53px;
	width: 196px;
	height: auto;
}
body:not(.en) div.mv_top div.mv_dots {/* 日本語ページのみ反映 */
	width: 259px;
}
div.mv_top div.mv_dots .slick-dots {
	display: flex;
	justify-content: stretch;
	justify-content: space-between;
}
div.mv_top div.mv_dots .slick-dots li {
	display: inline-block;
	width: 60px;
	height: 3px;
	background: #e2e4e8;
	cursor: pointer;
	overflow: hidden;
}
body:not(.en) div.mv_top div.mv_dots .slick-dots li {/* 日本語ページのみ反映 */
	background: #fff;
}

div.mv_top div.mv_dots .slick-dots button {
	position: relative;
	left: -10px;
	display: block;
	width: 0%;
	height: 3px;
	border: 0;
	outline: none;
	background: #0099C8;
	opacity: 0;
	cursor: pointer;
}
div.mv_top div.mv_dots .slick-dots .slick-active button {
	opacity: 1;
}

/* top_mvScr
-------------------------------------------------------------*/

div.mv_top .top_mvScr {
	position: absolute;
	inset: auto auto 0 50%;
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	transform: translateX(-50%)
}
div.mv_top .top_mvScr_link {
	display: block;
	width: auto;
	height: 76px;
	font-size: 1.2rem;
	font-weight: bold;
	font-family: "Roboto", sans-serif;
	color: #fff;
	letter-spacing: .2em;
	position: relative;
	overflow: hidden
}
div.mv_top .top_mvScr_link span {
	height: 80%;
	display: block;
	position: relative;
	overflow: hidden
}
div.mv_top .top_mvScr_link span::before, div.mv_top .top_mvScr_link span::after {
	content: "";
	display: inline-block;
	width: 1px;
	height: 100%;
	background-color: #fff;
	position: absolute;
	left: 50%
}
div.mv_top .top_mvScr_link span::before {
	background-color: rgba(255, 255, 255, .2);
	top: 0
}
div.mv_top .top_mvScr_link span::after {
	background-color: #fff;
	top: -100%;
	-webkit-animation: scrollAnimation 1.5s ease-in 0s infinite backwards;
	animation: scrollAnimation 1.5s ease-in 0s infinite backwards
}

/* li.top_news_list_item.disable,
li.top_news_list_item.disable a,
li.top_news_list_item.disable p,
li.top_news_list_item.disable span {
	padding-right: 0;
	pointer-events: none;
}
li.top_news_list_item.disable a::after,
li.top_news_list_item.disable a::before {
	content: none;
} */

@media all and (min-width:768px) {

	div.mv_top button.slick-arrow:hover {
		background: #fff;
		padding: 0;
	}
	div.mv_top button.slick-arrow:hover::before {
		border-color:  transparent transparent #0099C8 #0099C8;
		left: 16px;
	}
	div.mv_top button.slick-arrow.button_next:hover::before {
		border-color: #0099C8 #0099C8 transparent transparent;
		left: 16px;
	}

	picture.top_business_img img {
		margin: 70px auto 30px !important;
	}
}

@media all and (max-width:767px) {

	div.mv_top {
		height: 102vw;
	}
	div.mv_top li.slick-slide {
		height: 102vw;
		/* padding-left: 6vw; */
	}
	div.mv_top li.slick-slide div.wipe {
		height: 102vw;
	}
	div.mv_top li.slick-slide span {
		margin-bottom: 10px;
		font-size: min(4.8vw,3.2rem);
	}
	div.mv_top li.slick-slide span br.sp_only {
		display: inline-block;
	}
	div.mv_top li.slick-slide a {
		margin: 0;
		width: fit-content;
		min-width: 160px;
		height: 44px;
	}

	div.mv_top button.slick-arrow {
		bottom: 40px;
		width: 40px;
		height: 40px;
	}
	div.mv_top button.slick-arrow.button_prev {
		padding-left: 6px;
		right: 66px;
	}
	div.mv_top button.slick-arrow.button_next {
		padding-right: 6px;
		right: 23px;
	}
	div.mv_top button.slick-arrow::before {
		width: 8px;
		height: 8px;
	}
	div.mv_top div.mv_dots {
		transform: translate(30px,30px) scale(0.6);
		transform-origin: right bottom;
	}

	/* 日本語サイトの場合 */
	body:not(.en) div.mv_top li.mvL1 {background-image: url(/assets/img/top/mv_sp_1.jpg);}
	body:not(.en) div.mv_top li.mvL2 {background-image: url(/assets/img/top/mv_sp_2.jpg);}
	body:not(.en) div.mv_top li.mvL3 {background-image: url(/assets/img/top/mv_sp_3.jpg);}
	body:not(.en) div.mv_top li.mvL4 {background-image: url(/assets/img/top/mv_sp_4.png);}
	
	body:not(.en) div.mv_top li.mvL1 div.wipe {background-image: url(/assets/img/top/mv_sp_2.jpg);}
	body:not(.en) div.mv_top li.mvL2 div.wipe {background-image: url(/assets/img/top/mv_sp_3.jpg);}
	body:not(.en) div.mv_top li.mvL3 div.wipe {background-image: url(/assets/img/top/mv_sp_4.png);}
	body:not(.en) div.mv_top li.mvL4 div.wipe {background-image: url(/assets/img/top/mv_sp_1.jpg);}
	/* 日本語サイトの場合ここまで */


	/* 英語サイトの場合 */
	body.en div.mv_top li.mvL1 {background-image: url(/assets/img/top/mv_sp_1.jpg);}
	body.en div.mv_top li.mvL2 {background-image: url(/assets/img/top/mv_sp_2.jpg);}
	body.en div.mv_top li.mvL3 {background-image: url(/assets/img/top/mv_sp_3.jpg);}
	
	body.en div.mv_top li.mvL1 div.wipe {background-image: url(/assets/img/top/mv_sp_2.jpg);}
	body.en div.mv_top li.mvL2 div.wipe {background-image: url(/assets/img/top/mv_sp_3.jpg);}
	body.en div.mv_top li.mvL3 div.wipe {background-image: url(/assets/img/top/mv_sp_1.jpg);}
	/* 英語サイトの場合ここまで */

	div.mv_top .top_mvScr {
		display: none;
	}

	picture.top_business_img img {
		margin: 10px auto 0 !important;
	}


}

