@charset "utf-8";
/**********
 * MOVIE
 *********/
#movie .cont_h2{
	padding-top: 239px;
}
#movie .cont_h2_txt--eng{
	width: 227px;
	padding-top: 81px;
	background-image: url(../img/movie/movie_contTitle.svg);
}
#movie .contentIn{
	width: 100%;
}

.movieLists{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
}
.movieList{
	width: calc(100% / 3);
}
.movieThumb{
	width: 100%;
	padding-top: 56.25%;
	position: relative;
	overflow: hidden;
	display: block;
}
.movieList .movieThumb:before{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	border: 1px solid rgba(255,255,255,.4);
	z-index: 2;
	transition: .3s ease;
}
@media screen and (min-width: 768px){
	.movieList:not(:nth-of-type(3n)):not(:last-child) .movieThumb:before{
		border-right: unset;
	}
}

.movieThumb:hover .circle_active circle{
	animation: p_circle__eighty 1s forwards;
}


.movieThumb img{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	transition: .3s ease;
}
.movieThumb:hover img{
	transform: scale(1.05);
	opacity: 0.75;
}
.movieTitle{
	font-size: 16px;
	line-height: 1.5;
	padding: 16px 0 24px 24px;
}


@media screen and (max-width: 767px){
	#movie .cont_h2{
		padding-top: 112px;
	}
	#movie .cont_h2_txt--eng{
		width: 100%;
		padding-top: 48px;
	}
	.movieLists{
		flex-direction: column;
	}
	.movieList{
		width: 100%;
	}
	.movieTitle{
		font-size: 1.2rem;
		padding: 10px 0 20px 7.339%;
	}
}


/** Detail **/
.episodesArticle{
	width: 100%;
	position: relative;;
}
.episodesImageListsWrap{
}
.episodesImageLists{
}