/***** movie *****/

.movie {
	width: 100%;
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	align-items: center;
}

.movie_layer1 {
	width: 100%;
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 0px 0px;
	display: flex;
	flex-flow: row wrap;
	justify-content: flex-start;
	align-items: center;
}

.movie_layer2 {
	width: 100%;
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 0px 0px;
	display: flex;
	flex-flow: row wrap;
	justify-content: flex-start;
	align-items: center;
}

.movie_layer3 {
	width: 100%;
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 0px 0px;
	display: flex;
	flex-flow: row wrap;
	justify-content: flex-start;
	align-items: center;
}

.movie_object1 {
	position: relative;
	width: 50%;
	padding: 10px 10px 10px 10px;
	margin: 0px 0px 0px 0px;
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	align-items: center;
}

.movie_object2 {
	position: relative;
	width: 100%;
	max-width: 100%;
	padding: 20px 20px 20px 20px;
	margin: 0px 0px 0px 0px;
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	align-items: center;
}

.movie_object3 {
	position: relative;
	width: 50%;
	max-width: 1200px;
	padding: 10px 10px 10px 10px;
	margin: 0px 0px 0px 0px;
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	align-items: center;
}

.movie_object1_layer1,
.movie_object2_layer1,
.movie_object3_layer1 {
	position: relative;
	width: 100%;
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 0px 0px;
	background-color: #000000;
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	align-items: center;
}

.movie_object1_data1,
.movie_object2_data1,
.movie_object3_data1 {
	position: relative;
	overflow: hidden;
	width: 100%;
	height: 0;
	padding-top: 0px;
	padding-bottom: 56.25%;
	margin: 0px 0px 0px 0px;
	background-color: #000000;
	cursor: pointer;
}

.movie_object1_data1 iframe,
.movie_object2_data1 iframe,
.movie_object3_data1 iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.movie_object1_button1,
.movie_object2_button1,
.movie_object3_button1 {
	position: absolute;
	z-index: 10;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.50);
	transition: .3s;
	cursor: pointer;
	opacity: 1;
	visibility: visible;
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	align-items: center;
}

.movie_object1_button1.movie_act1,
.movie_object2_button1.movie_act1,
.movie_object3_button1.movie_act1 {
	opacity: 0;
	visibility: hidden;
}

.movie_object1_button1 svg,
.movie_object2_button1 svg,
.movie_object3_button1 svg {
  width: 150px;
  height: 150px;
  margin: 0px 0px 0px 0px;
  display: block;
}

.movie_object1_button1 svg *,
.movie_object2_button1 svg *,
.movie_object3_button1 svg * {
	fill: #ffffff;
	transition: .3s;
}

.movie_object1:hover .movie_object1_button1 svg *,
.movie_object2:hover .movie_object2_button1 svg *,
.movie_object3:hover .movie_object3_button1 svg * {
	fill: #e72410;
}

/***** responsive *****/

@media ( max-width: 1024px ) {

.movie_object1,
.movie_object2,
.movie_object3 {
  width: 100%;
	padding: 10px 0px 10px 0px;
}

}

@media ( max-width: 767px ) {

.movie_object1,
.movie_object2,
.movie_object3 {
  width: 100%;
	padding: 10px 0px 10px 0px;
}

.movie_object1_button1 svg,
.movie_object2_button1 svg,
.movie_object3_button1 svg {
  width: 80px;
  height: 80px;
}

}
