@charset "utf-8";
/*-----------------------------------------------
 * movie - lists
-------------------------------------------------*/
.categoryLists{
	display:flex;
	justify-content:center;
	flex-wrap:wrap;
	gap:10px;
	padding-bottom:40px;
}
.categoryList__link{
	display:inline-block;
	position:relative;
	text-decoration:none;
	padding:14px 40px;
	line-height:1.25;
	background-color:#fff;
	color:#000;
	border:1px solid #000;
	border-radius:40px;
}
.categoryList__link.--is-current{
	background-color:var(--color-main-red);
	color:#FFF;
}
.categoryList__link > span{
	position:relative;
}
@media (hover:hover) and (pointer:fine){
	.categoryList__link{
		transition:.3s ease;
	}
	.categoryList__link:before{
		content:'';
		position:absolute;
		top:0;
		left:0;
		right:0;
		bottom:0;
		border-radius:40px;
		opacity:0;
		transform:scale(80%);
		background-color:var(--color-main-red);
		transition:.6s ease;
	}
	.link_btn--arrow{
		transition:.3s ease .2s;
	}

	.categoryList__link:hover{
		border-color:var(--color-main-red);
	}

	.categoryList__link:hover::before{
		transform:scale(100%);
		opacity:1;
	}
}
@media screen and (max-width:767px){
	.categoryLists{
		gap:var(--sp-size-16);
		padding-bottom:var(--sp-size-80);
	}
	.categoryList__link{
		padding:var(--sp-size-24) var(--sp-size-48);
		border-radius:64px;
		border-width:var(--sp-size-2);
	}
}
/**
* MOVIE LISTS
**/
.movieLists{
	width:100%;
	display:grid;
	grid-template-columns:repeat(2, 1fr);
	column-gap:min(calc(40 / var(--def-ww) * 100vw), calc(40px * var(--max-percent)));
	row-gap:min(calc(32 / var(--def-ww) * 100vw), calc(32px * var(--max-percent)));
}
.movieList{
	width:100%;
	display:block;
	position:relative;
}
.btn_moviePlay{
	display:block;
	width:100%;
	text-decoration:none;
	line-height:2;
	position:relative;
}
.btn_moviePlay:before{
	content:'';
	position:absolute;
	top:0;
	left:0;
	right:0;
	bottom:0;
	background-color:#d90011;
    mix-blend-mode:multiply;
	z-index:1;
	opacity:45%;
}
.btn_moviePlay-img{
	display:block;
	width:100%;
	padding-top:52.5%;
	position:relative;
	overflow:hidden;
}
.btn_moviePlay-img img{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	object-fit:cover;
}
.btn_moviePlay-icon{
	position:absolute;
	top:0;
	left:0;
	right:0;
	bottom:0;
	margin:auto;
	width:11.1112%;/* 40 */
	height:21.1641%;/* 40 */
	background:url(../img/common/arrow_r.svg) no-repeat center / contain;
	z-index:2;
}
.movieTitle{
	padding-top:1em;
}

@media screen and (hover:hover) and (pointer:fine){
	.btn_moviePlay:before,
	.btn_moviePlay-icon,
	.movieTitle{
		transition:.3s ease;
	}
	.btn_moviePlay:hover::before{
		opacity:20%;
	}
	.btn_moviePlay:hover .btn_moviePlay-icon{
		transform:scale(110%);
	}
	.btn_moviePlay:hover + .movieTitle{
		color:var(--color-main-red);
	}
}

@media screen and (max-width:767px){
	.movieLists{
		grid-template-columns:repeat(1, 1fr);
		column-gap:var(--sp-size-48);
	}
}

.movieLists{
	opacity:0;
	transition:opacity .6s ease;
}
.movieLists.--is-view{
	opacity:1;
}