@charset "UTF-8";






@charset "UTF-8";



.pTitle {
	font-size: 2em;
	padding:1.5em 1em 1em;
}


em {
	color: #00629B;
	font-style: normal;
}





#contents {
	width: 100%;
}

#movStage {
	width: 100%;
	margin: 50px auto;
	background-color: #F2F2F2;
	padding: 90px 0;
}



/*　絞り込み　*/

#extract {
	text-align: left;
	width: 1030px;
	margin: 0 auto 50px;
}


/*　ツールチップ　*/
.tip {
	color: #fff;
	font-size: 0.95em;
	line-height: 1.5;
	background: rgba(88,105,143, 0.9);
	padding: 1.2em;
	position: absolute;
	/*bottom:-100%;*/
	top:-100%;
	left:0;
	width: 246px;
	box-sizing: border-box;
	z-index:99;
}

.slick-slide > div {
	overflow: hidden;
}


/*　いいね　*/
.like {
	display: none;
}


/*　動画一覧部分　*/

#movSlide {
	width: 1030px;
	margin: 50px auto 0;
	text-align: left;
}



#movSlide li {
	margin-bottom: 4em;
	position: relative;
	vertical-align: top;
	/*overflow: hidden;*/
	display: inline-block;
	box-sizing: border-box;
	max-width: 100%;
}


#movSlide .movItem a {
	display: block;
	margin-bottom: 0.5em;
	text-decoration: none;
	width: 246px;
	/*overflow: hidden;*/
	position: relative;
}
#movSlide .movOpt {
	display: block;
	width: 246px;
}

#movSlide h2 {
	color: #000;
	font-size: inherit;
	font-weight: bold;
	line-height: 1.5;
	padding-left:2.3em;
	position: relative;
	margin-top: 0.5em;
}
#movSlide h2 .movNo {
	position: absolute;
	top:0;
	left:0;
}

#movSlide .tip h2 {
	color: #fff;
	line-height: 1.3;
	margin: 0;
	margin-bottom:0.7em;
	padding-bottom: 0.3em;
	border-bottom: 1px solid #fff;
	
	/*overflow: hidden;
	margin-bottom:0.7em;
	padding-bottom: 0em;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;
	height: 1;
	white-space: normal;*/
}


#movSlide h2 .movNo:after {
	content: ".";
}

#movSlide .explane {
	font-size: 0.9em;
	margin-top: 0.3em;
	color: #4D4D4D;
	height: 1.5em;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}




.movCGT {
	font-size: 0.85em;
	line-height: 1;
	color: #fff;
	position: absolute;
	top: 3px;
	left: 3px;
	padding: 0.2em 0.4em 0.3em;
}
.mtl {
	background-color:#FF7BAC;
}
.cpt {
	background-color:#3FA9F5;
}
.stn {
	background-color:#7AC943;
}
			
			

.movTiem {
	position: relative;
	font-size: 0.85em;
}

.like {
}






/*　スライドの外観設定　*/
.slick-prev, .slick-next {
	width: 60px;
	height: 61px;
	top: 45%;
}

.slick-prev:before,
.slick-next:before {
	content:"";
}

.slick-prev {
	background-image:url(../../common/img/btn_back.png);
	left: -90px;
}
.slick-prev:hover,
.slick-prev:focus {
	background-image:url(../../common/img/btn_back.png);
	left: -90px;
}
.slick-next {
	background-image:url(../../common/img/btn_next.png);
	right: -75px;
}
.slick-next:hover,
.slick-next:focus {
	background-image:url(../../common/img/btn_next.png);
	right: -75px;
}

.slick-dots li button:before {
	font-size:0.92rem;
}


.slick-dots li button:before
{
    color: #B3B3B3;
}
.slick-dots li.slick-active button:before
{
    opacity: 1;
    color: #5CC0C0;
}

.slick-dots {
	height: 1.5em;
}







@media screen and (max-width: 559px) {
	
		
	.pTitle {
		padding: 0.5em;
	}
	
	
	#movStage {
		margin: 3em auto 0;
		padding: 2em 3%;
		box-sizing: border-box;
	}
	
	
	
	
	/*　絞り込み　*/
	
	#extract {
		position: fixed;
		bottom:0;
		background-color: #9ED9E5;
		text-align: left;
		margin: 0;
		left: 0;
		padding: 1em 0.5em;
		box-sizing: border-box;
		z-index: 999;
	}
	
	#extract select {
		padding:0.2em;
		border: 1px solid #999;
		padding: 0.5em;
		font-size: 1.23rem;
		border-radius: 0.3em;
	}
	
	
	
	/*　ツールチップ　*/
	.tip {
		top: 0;
		bottom: 0;
		left:-100%;
		font-size: 0.9em;
		width: 100%;
		z-index: 99;
		padding-right: 2.2em;
		height: fit-content;
		box-sizing: border-box;
	}
	
	
	.btnCloseInfo {
		position: absolute;
		top: 0.3em;
		right: 0.3em;
		width: 2em;
		height: 2em;
		display: block;
	}
	
	
	/*　いいね　*/
	.like {
		display: none;
	}
	
	
	
	/*　動画一覧部分　*/
	
	#movSlide {
		width: 100%;
		box-sizing: border-box;
		margin: 0;
		text-align: left;
		overflow: hidden;
	}
	
	
	
					
	#movSlide li {
		margin-bottom: 2em;
		overflow: visible;
		min-height: 7em;
	}
					
	
	#movSlide .movItem a {
		width: auto;
		padding-bottom: 1em;
	}
	
	
	#movSlide .movItem a img {
		width: 9em;
		position: absolute;
		top: 0;
		left: 0;
	}
	
	
	
	#movSlide .movOpt {
		display: block;
		width: 246px;
	}
	
	#movSlide h2 {
		font-size: 0.9em;
		margin-top: 0;
		margin-left: 10.5rem;
	}
	
	#movSlide .explane {
		font-size: 0.9em;
		margin-top: 0.3em;
		margin-left: 10.5rem;
	display: -webkit-box;
			-webkit-box-orient: vertical;
			-webkit-line-clamp: 2;
			height: auto;
			white-space: normal;
	}
	
	
	.btnMore {
		color: #0071BC;
		font-size: 0.8em;
		text-decoration: underline;
		padding: 0.5em 0;
		margin-left: 10.5rem;
		z-index:99;
	}
	
	
	
	.movCGT {
		font-size: 0.6em;
		position: absolute;
		top: 9.2em;
		left: 0;
		padding: 0.3em 0.4em;
	}
	.mtl {
		background-color:#FF7BAC;
	}
	.cpt {
		background-color:#3FA9F5;
	}
	.stn {
		background-color:#7AC943;
	}
				
				
	
	.movTiem {
		position: absolute;
		font-size: 0.6em;
		display: inline-block;
		width: 15em;
		top: 9.2em;
		left: 0;
		text-align: right;
	}
	
	.like {
	}
	
	
	


}






