@charset "utf-8";

body {
	margin: 0;
}
.outer ul {
	overflow: hidden;
	padding: 30px 0;
	margin: 0;
	list-style: none;
}
.outer li {
	float: left;
	box-sizing: border-box;
	width: 20%;
	padding :8px;
	font-size: 0;

	perspective: 500px;
}
.outer li img {
	perspective: 500px;
	width: 100%;
	height: auto;
	transition: all 1s linear;
}
.outer li:hover img {
	transform: rotateY(180deg);
	opacity: 0.5;
	z-index: 100;
}