﻿@charset "utf-8";



/* ================================ video ================================ */
.videolist { position:relative; float:left; width:500px; height:300px; margin-right:50px; margin-top:15px; margin-bottom:30px; }
.videolist:hover{ cursor: pointer; }
.videoed { display:none; width:50px; height:50px; position: absolute; left:45%; top:45%; z-index:99; border-radius:100%; }
.videos{  display:none; border: 1px solid #080808; position:fixed; left:50%; top:50%; margin-left:-320px; margin-top:-210px; z-index:100; width:640px; height:360px; }
.vclose { position:absolute;right:1%; top:1%; border-radius:100%; cursor: pointer; }
#video{border:1px solid #fff; width:640px;} 
.video { width:100%; max-height:375px;padding-top:60px;}
.video ul {
	
	margin-top: -4%;
	 width:100%;
}

.video ul li {
	width: 24%;
	margin-left: 1%;
	margin-top: 4%;
	position:relative; 
	float:left;
	 display:block;
	 overflow:hidden;
}
.video ul li:nth-child(4n+1) {
	margin-left: 0%;
}


.video ul li video{width:100%;max-height:375px; }
.video ul li a {
	width: 100%;
	position: absolute;
	left: 0px;
	top: 0px;
	cursor: pointer;
	  display:block;
	  height:100%;
}

.video ul li strong {
	font-size: 18px;
    text-align: center;
	margin-top: 3%;
	display:block;
}

@media (min-width: 1px) and (max-width: 1044px) {
	
	/* ================================ video ================================ */


.videos{ left:0; top:15%; margin:0; z-index:100; width:100%; }
#video{width:100%;}
.video { padding-top:30px;}
.video ul li {
	width: 48%;
	margin-left:4%;
}
.video ul li:nth-child(4n+1) {
	margin-left:auto;
}
.video ul li:nth-child(2n+1) {
	margin-left: 0%;
}

.video ul li strong {
	font-size: 12px;
}
	
	
	
	}
	
	
	
