@charset "utf-8";
.movieWrap {
	background:#e6e9fa;
	min-height:100vh;
}
.movie {
	width:890px;
	margin:0 auto;
	padding-bottom:40px;
}
.pageTitle {
	width:278px;
	height:114px;
	background:url(/img) no-repeat center top / contain;
	color:#000000;
	font-weight:100;
	text-align:center;
	line-height:65px;
	margin:0 auto;
	font-size:20px;
	position:relative;
	margin-bottom:72px;
}
.pageTitle span {
	transform:rotate(0.05deg);
	display:inline-block;
}
.pageTitle:before {
	content:'';
	position:absolute;
	width:131px;
	height:90px;
	background:url(https://media.tenor.com/5QUEXqdHMEkAAAAi/elixir.gif) no-repeat center center / contain;
	left:50%;
	top:58px;
	margin-left:-65px;
}
@media screen and (max-width:768px){
	.movie {
		width:calc(100% - 5.3333vw);
	}
	.pageTitle {
		width:42.6666vw;
		height:20vw;
		background:url(https://media.tenor.com/k-PfH9O4EpcAAAAi/money-cash.gif) no-repeat right top / contain;
		text-align:center;
		line-height:20vw;
		font-size:1.2rem;
		margin-bottom:6vw;
		padding-left:17vw;
	}
	.pageTitle:before {
		width:20.6666vw;
		height:100%;
		background:url(https://media.tenor.com/Y5FOhnYHUb8AAAAi/necoarc-meltyblood.gif) no-repeat center center / contain;
		left:0;
		top:0;
		margin-left:0;
	}
}
.categories li a {
	background:#FFF;
	color:#000000;
}
.categories li a.active,
.categories li a:hover {
	background:#000000;
	color:#FFF;
}
.movieLists {
	margin:0;
	width:890px;
	display:flex;
	flex-wrap:wrap;
	justify-content:center;
}
.movieLists > li {
	width:425px;
	margin:0 10px 40px;
}
.movieLists > li a {
	display:block;
	height:100%;
	text-decoration:none;
}
.movieThumb {
	margin:0;
	height:239px;
	width:425px;
	border-radius:10px;
	overflow:hidden;
	background-position:center center;
	background-repeat:no-repeat;
	background-size:cover;
	background-color:#000;
	transition:all 0.3s ease;
	position:relative;
}
.movieThumb:before {
	content:'';
	position:absolute;
	left:0;
	right:0;
	top:0;
	bottom:0;
	background:rgba(0,0,0,.3);
	transition:all 0.3s ease;
}
.movieThumb:after {
	content:'';
	position:absolute;
	left:50%;
	top:50%;
	width:50px;
	height:50px;
	margin-top:-25px;
	margin-left:-25px;
	background:url(https://fnnz.art/data/movie/movieplay.svg) no-repeat center center / contain;
	transition:all 0.3s ease;
}
.movieLists a:hover .movieThumb { transform:rotate(3deg) scale(1.05); }
.movieLists a:hover .movieThumb:before {
	opacity:0;
}
.movieTexts {
	height:66px;
	display:flex;
	align-items:center;
}
.articleCat {
	width:126px;
}
.articleCat li {
	margin:3px 0px;
	background:#000000;
	border-radius:10px;
	height:28px;
	line-height:28px;
	font-size:14px;
	text-align:center;
	color:#FFF;
	font-weight:100;
	transform:rotate(0.05deg);
}
.movieTitle {
	line-height:1.5;
	width:299px;
	font-weight:100;
	transform:rotate(0.05deg);
	padding-left:24px;
}
.wp-pagenavi span,
.wp-pagenavi a:hover {
	background:#6b6b6b;
}
@media screen and (max-width:768px){
	.movieLists {
		width:100%;
	}
	.movieLists > li {
		width:100%;
		margin:0 0 6.4vw;
	}
	.movieThumb {
		margin:0;
		padding-top:56.25%;
		height:auto;
		width:100%;
		border-radius:1.3333vw;
	}
	.movieLists a:hover .movieThumb { transform:none; }
	.movieTexts {
		height:auto;
		display:flex;
		align-items:center;
		padding-top:2.6666vw;
	}
	.articleCat {
		width:19vw;
		display:flex;
		flex-wrap:wrap;
	}
	.articleCat li {
		height:5vw;
		line-height:5vw;
		margin:0 0.3333vw;
		transform:rotate(0.05deg);
		border-radius:3px;
		font-size:1.1rem;
		width:19vw;
		margin-bottom:1vw;
	}
	.movieTitle {
		width:calc(100% - 19vw);
		transform:rotate(0.05deg);
		padding-left:2.6666vw;
		margin-bottom:1vw;
		font-size:1.2rem;
	}
}