@charset "UTF-8";

/* ++++++++++++++++++++++++++++++
movie page
++++++++++++++++++++++++++++++ */
#postList li figure a {
	display: block;
	position: relative;
}
#postList li figure a::after {
	content: "";
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	position: absolute;
	background: no-repeat center center;
	background-image: url(../images/icon_youtube_w.svg);
}
#postList li dt { color: #6633cc; }
#postList li dt > * { display: block; }
#postList li dt time { font-family: "Noto Sans JP", sans-serif; }
@media screen and (min-width:769px), print{
	#mainHeader #pageInfo { padding-bottom: 185px; }
	#lowerBox { margin-top: -90px; }
	#postList {
		display: flex;
		flex-wrap: wrap;
		padding-bottom: 250px;
	}
	#postList li {
		margin-bottom: 140px;
		width: calc((100% - 40px) / 3);
	}
	#postList li:nth-child(3n+2),
	#postList li:nth-child(3n) {
		margin-left: 20px;
	}
	#postList li figure a::after {
		background-size: 40px;
		transition-duration: .3s;
		transition-property: background-color;
	}
	#postList li figure a:hover::after { background-color: rgba(0,0,0,0.6); }
	#postList li dl { padding-right: 50px; }
	#postList li dt {
		line-height: 1.6;
		margin-top: 20px;
		margin-bottom: 20px;
	}
	#postList li dt time { font-size: 12px; }
}
@media screen and (max-width:768px){
	#mainHeader { padding-bottom: 112px; }
	#mainTitle { height: auto; }
	#lowerBox #postList {
		padding: 0 25px;
		margin-top: -90px;
	}
	#lowerBox #postList li + li { margin-top: 70px; }
	#postList li figure a::after { background-size: 34px; }
	#postList li dt time {
		font-size: 10.5px;
		margin-top: 18px;
	}
	#postList li dt span { font-size: 12px; }
	#postList li dd {
		font-size: 12px;
		margin-top: 15px;
	}
}