@charset "utf-8";
#movieOverLay {
		background: rgba(0, 0, 0, 0.8);
		width: 100%;
		height: 100%;
		position: fixed;
		top: 0;
		left: 0;
		z-index: 9999;
		display: none;
}
.movieOverLay_inner {
		text-align: center;
		vertical-align: middle;
		width: 100%;
		height: 100%;
		position: relative;
}
.movieOverLay_inner .movie_holder {
		width: 100%;
		max-width: 1090px;
		height: 620px;
		margin: auto;
		position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
}
@media (max-width: 767px) {
		#movieOverLay .movieOverLay_inner .movie_holder {
				width: 0;
				height: 0;
				position: static;
		}
}
.movie_holder .movie_close {
		position: absolute;
		top: -50px;
		right: 0;
		cursor: pointer;
		width: 30px;
		height: 30px;
}
.movie_close:before, .movie_close:after {
		content: '';
		display: block;
		width: 1px;
		height: 30px;
		background: #FFF;
		position: absolute;
		top: 0;
		left: 15px;
}
.movie_close:before {
		transform: rotate(-45deg);
}
.movie_close:after {
		transform: rotate(45deg);
}
.holder .movie_close img {
		width: 100%;
		height: auto;
}
.movie_item {
		max-width: 450px;
		margin: 0 auto 120px;
		position: relative;
		cursor: pointer;
		transition: opacity 0.4s;
}
.movie_item_inner {
		position: relative;
		display: inline-block;
}
.movie_item_inner::before {
		content: '';
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: rgba(0, 0, 0, 0.2);
		pointer-events: none;
}
.movie_item_flex {
		display: flex;
		justify-content: center;
		padding: 0 40px;
		max-width: 960px;
		margin: 0 auto 120px;
}
.movie_item_flex .movie_item {
		width: calc(50% - 10px);
		max-width: inherit;
		margin: 0 6px;
}
.movie_item img {
		width: 100%;
		height: auto;
}
.movie_item::before {
		content: '';
		display: block;
		position: absolute;
		width: 58px;
		height: 58px;
		border-radius: 29px;
		border: 2px solid rgba(255, 255, 255, 0.8);
		left: calc(50% - 30px);
		top: calc(50% - 30px);
		box-sizing: border-box;
		z-index: 999;
}
.movie_item::after {
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 8px 0 8px 13px;
		border-color: transparent transparent transparent rgba(255, 255, 255, 0.8);
		content: '';
		display: block;
		position: absolute;
		left: calc(50% - 4px);
		top: calc(50% - 8px);
}
@media (hover: hover) {
		.movie_item:hover {
				opacity: 0.6;
		}
}
.movie_item #player_box {
		width: 100%;
		height: 100%;
}

#player_box {
  width: 100%;
  height: 100%;
}

.movie_popup_player {
		width: 100%;
		max-width: 1090px;
		height: 620px;
		margin: auto;
		position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		z-index: 10;
}
@media (max-width: 767px) {
		.movie_popup_player {
				width: 100%;
				height: calc(100vw * 9 / 16);
				margin: auto;
		}
		.movie_holder .movie_close {
				top: 20px;
				right: 20px;
		}
		.movie_item {
				margin-bottom: 80px;
		}
		.movie_item_flex {
				display: block;
				margin-bottom: 80px;
		}
		.movie_item_flex .movie_item {
				width: 100%;
				margin: 0;
		}
		.movie_item_flex .movie_item:first-child {
				margin-bottom: 40px;
		}
}