@charset "utf-8";

#contents {
	padding-bottom:0;
}
#contents p.button {
	margin:0 0 14px;
	text-align:right;
}
#contents p.button a {
	display:inline-block;
	padding:8px 8px 8px 28px;
	border:1px solid #c6c6c6;
	border-radius:2px;
	background:#f8f8f8 url(../img/icon_lnav_01.png) no-repeat 14px center;
	background-size:6px 6px;
	color:#090909;
	font-size:1.3rem;
	line-height:1.1;
}
#contents .pickup h3 {
	margin:0;
	padding:0;
	background:none;
}
#contents .pickup > ul li:nth-child(n+2) {
	display:none;	
}
#contents .pickup .txt {
	font-size:1.3rem;
}
#contents .tab {
	position:relative;
	padding:20px 0 0;
	border-bottom:1px solid #c6c6c6;
	background-color:#e2e2e2;
	background-image: -moz-linear-gradient(top, #d9d9d9 100%, #e2e2e2 95%);
	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(1.0, #d9d9d9), color-stop(0.95, #e2e2e2));	
}
#contents .tab > ul {
	position:relative;
	top:1px;
	margin:0 auto;
	overflow:hidden;
}
#contents .tab > ul li {
	float:left;
	width:25%;
}
#contents .tab > ul li a {
	display:block;
	margin:0 2px;
	padding:24px 0;
	border:1px solid #c6c6c6;
	border-radius:3px 3px 0 0;
	background-position:bottom center, left;
	background-repeat:no-repeat, no-repeat;
	background-size:20px 20px, auto;
	background-color:#f2f2f2;
	color:#000000;
	font-size:1.4rem;
}
#contents .tab > ul li:nth-child(1) a {
	background-image: url(../videolibrary/img/icon_tab_01.png), -moz-linear-gradient(top, #e9e9e9 100%, #f2f2f2 95%);
	background-image: url(../videolibrary/img/icon_tab_01.png), -webkit-gradient(linear, left top, left bottom, color-stop(1.0, #e9e9e9), color-stop(0.95, #f2f2f2));	
}
#contents .tab > ul li:nth-child(1) a.active {
	background-image: url(../videolibrary/img/icon_tab_01.png);	
}
#contents .tab > ul li:nth-child(2) a {
	background-image: url(../videolibrary/img/icon_tab_02.png), -moz-linear-gradient(top, #e9e9e9 100%, #f2f2f2 95%);
	background-image: url(../videolibrary/img/icon_tab_02.png), -webkit-gradient(linear, left top, left bottom, color-stop(1.0, #e9e9e9), color-stop(0.95, #f2f2f2));	
}
#contents .tab > ul li:nth-child(2) a.active {
	background-image: url(../videolibrary/img/icon_tab_02.png);	
}
#contents .tab > ul li:nth-child(3) a {
	background-image: url(../videolibrary/img/icon_tab_03.png), -moz-linear-gradient(top, #e9e9e9 100%, #f2f2f2 95%);
	background-image: url(../videolibrary/img/icon_tab_03.png), -webkit-gradient(linear, left top, left bottom, color-stop(1.0, #e9e9e9), color-stop(0.95, #f2f2f2));	
}
#contents .tab > ul li:nth-child(3) a.active {
	background-image: url(../videolibrary/img/icon_tab_03.png);	
}
#contents .tab > ul li:nth-child(4) a {
	background-image: url(../videolibrary/img/icon_tab_04.png), -moz-linear-gradient(top, #e9e9e9 100%, #f2f2f2 95%);
	background-image: url(../videolibrary/img/icon_tab_04.png), -webkit-gradient(linear, left top, left bottom, color-stop(1.0, #e9e9e9), color-stop(0.95, #f2f2f2));	
}
#contents .tab > ul li:nth-child(4) a.active {
	background-image: url(../videolibrary/img/icon_tab_04.png);	
}
#contents .tab > ul li a.active {
	border-bottom:1px solid #f8f8f8;
	background-color:#f8f8f8;
}
#contents .tab-content {
	background:#f8f8f8;
}
#contents .tab-content > div {
	display:none;
}
#contents .tab-content > div:first-child {
	display:block;
}
#contents .tab-content ul.video li h4 {
	margin:15px 10px 10px;
	padding:0;
	border:none;
	background:none;
	font-size:1.5rem;
	font-weight:bold;
	color:#000000;
}
#contents .tab-content ul.video li p {
	margin:0 10px;
	font-size:1.3rem;
	color:#090909;
}

@media print, screen and (min-width:768px) {
	/*--------------------------------------------------------- */
	.wrapper {
		padding:0;
		max-width:none;
	}
	/*--------------------------------------------------------- header */
	header .wrapper {
		padding:0 15px;
		max-width:990px;
	}
	/*--------------------------------------------------------- #pankuzu */
	#pankuzu {
		margin:0 auto;
		padding:0 15px;
		max-width:990px;
	}
	/*--------------------------------------------------------- #contents */
	#contents h2 {
		margin-right:auto;
		margin-left:auto;
		max-width:960px;
	}
	#contents .pickup {
		margin-right:auto;
		margin-left:auto;
		padding:0 15px;
		max-width:990px;
	}
	#contents .pickup > ul li {
		overflow:hidden;
		margin:0 0 63px;
	}
	#contents .pickup h3 {
		margin:24px 0 14px;
	}
	#contents .pickup .thumbnail {
		float:right;
		width:65.6%;
	}
	#contents .pickup .txt {
		float:left;
		width:30%;
	}
	#contents .tab > ul {
		padding:0 15px;
		max-width:990px;
	}
	#contents .tab > ul li a {
		text-align:center;
	}
	#contents .tab-content {
		padding:80px 0;
	}
	#contents .tab-content > div {
		margin:0 auto 30px;
		padding:0 15px;
		max-width:990px;
	}
	#contents .tab-content ul.video {
		overflow:hidden;
	}
	#contents .tab-content ul.video li {
		float:left;
		margin-bottom:50px;
		width:32%;
	}
	#contents .tab-content ul.video li:nth-child(3n+2) {
		margin-right:2%;
		margin-left:2%;
	}
	#contents .tab-content ul.video li:nth-child(3n+1) {
		clear:both;
	}
	/*--------------------------------------------------------- footer */
	footer .wrapper {
		padding:0 15px;
		max-width:990px;
	}
}
@media screen and (max-width:767px) {
	/*--------------------------------------------------------- */
	.wrapper {
		padding:0;
	}
	/*--------------------------------------------------------- #contents */
	#contents h2,
	#contents .pickup {
		margin-right:15px;
		margin-left:15px;
	}
	#contents .pickup {
		margin-bottom:25px;
	}
	#contents .pickup h3 {
		margin:0 0 12px;
	}
	#contents .pickup .thumbnail {
		margin-bottom:22px;
	}
	#contents .tab {
		padding:12px 15px 0;
	}
	#contents .tab > ul li a {
		display:table;
		margin:0;
		padding:15px 5px 30px;
		width:97%;
		vertical-align:middle;
		text-decoration:none;
	}
	#contents .tab > ul li a span {
		display:table-cell;
		vertical-align:middle;
	}
	#contents .tab-content {
		padding:50px 0 25px;
	}
	#contents .tab-content > div {
		margin:0;
		padding:0 32px;
	}
	#contents .tab-content ul.video li h4 {
		margin:10px;
	}
	#contents .tab-content ul.video li {
		margin-bottom:32px;
	}
}