@charset "utf-8";



div#cont_video_table {
	position: fixed;
	top: 0;
	display: table;
	width: 100vw;
	height: 100vh;
	background-color: hsla(0, 0%, 0%, 0.507);
	cursor: pointer;
}
div#cont_video_cell {
	display: table-cell;
text-align: center;
vertical-align: middle;
}
div#cont_video_cont {
	position: relative;
	display: inline-block;
}
img#cont_video_hide {
	position: absolute;
	cursor: pointer;
}
@media screen and (min-width: 961px) {
	iframe#cont_video {
		width: 72vw;
		height: 40.5vw;
		}
		img#cont_video_hide {
			top: 0.5vw;
			right: -1.4vw;
		}
	}

@media screen and (max-width: 960px) {
	iframe#cont_video {
		width: 88vw;
		height: 49.5vw;
		}
		img#cont_video_hide {
			width: 2em;
			top: 0.5vw;
			right: -1.4vw;
		}
	}
/*------------------------*/

section.listvideos {
	margin-left: auto;
	margin-right: auto;
	display: block;
}

section.listvideos h1 {
	color: #76bc42;
	text-align: center;
	margin-bottom: 0.4vw;
}

section.listvideos li.cate1 {
	font-size: 3em;
	color: #c0c0c0;
	text-align: center;
	margin-top: 1vw;
	margin-bottom: 0;
}

section.listvideos ul {
	list-style: none;
}

section.listvideos li {
	border-bottom: 1px solid #c0c0c0;
}

section.listvideos li {
	display: table;
	border-bottom: 1px solid #c0c0c0;
}

section.listvideos h2 {
	color: #76bc42;
	font-size: 1.4em;
	margin-top: 0.2em;
	margin-bottom: 0.4em;
}

section.listvideos a {
	color: #8b8b8b;
}

@media screen and (min-width: 961px) {
	section.listvideos {
		width: 60VW;
	}
	section.listvideos li {
		width: 52vw;
		padding-left: 5vw;
		padding-right: 3vw;
		padding-top: 2vw;
		padding-bottom: 2vw;
		display: table;
	}
	section.listvideos span.contvideo, section.listvideos span.conttextes {
		display: table-cell;
		vertical-align: middle;
	}
	section.listvideos span.contvideo {
		width: 18vw;
	}
	section.listvideos span.contvideo img {
		width: 18.2vw;
	}
	section.listvideos span.conttextes {
		width: 33vw;
		padding-left: 1vw;
	}
	section.listvideos a {
		margin-left: 1vw;
	}
	section.listvideos a img {
		width: 1.5vw;
	}
}

@media screen and (min-width: 641px) and (max-width: 960px) {
	section.listvideos {
		width: 90VW;
	}
	section.listvideos li {
		width: 82vw;
		padding-left: 5vw;
		padding-right: 3vw;
		padding-top: 2vw;
		padding-bottom: 2vw;
		display: table;
	}
	section.listvideos span.contvideo, section.listvideos span.conttextes {
		display: table-cell;
		vertical-align: middle;
	}
	section.listvideos span.contvideo {
		width: 24vw;
	}
	section.listvideos span.contvideo img {
		width: 26vw;
	}
	section.listvideos span.conttextes {
		width: 50vw;
		padding-left: 1vw;
	}
	section.listvideos a {
		margin-left: 1vw;
		line-height: 3em;
	}
	section.listvideos a img {
		width: 3vw;
	}
}

@media screen and (max-width: 640px) {
	section.listvideos {
		width: 90VW;
	}
	section.listvideos li {
		width: 80vw;
		padding-left: 5vw;
		padding-right: 5vw;
		padding-top: 2vw;
		padding-bottom: 2vw;
	}

	section.listvideos span.contvideo {
		width: 80vw;
		text-align: center;
		display: block;
	}
	section.listvideos span.contvideo img {
		width: 50vw;
	}
	section.listvideos span.conttextes {
		width: 50vw;
		padding-left: 1vw;
	}
	section.listvideos a {
		margin-left: 1vw;
		line-height: 3em;
	}
	section.listvideos a img {
		width: 6vw;
	}
}