.per_sample_box {
border: 1px solid #ccc;
}
.per_sample_box > div {
width: 200px;
height: 200px;
border: 1px solid #ccc;
margin: 20px 40px;
display: inline-block;
}
.per_sample_box > div > div {
float: left;
width: 55px;
height: 55px;
margin: 5px;
}
.per_red > div {
background-color: red;
transform: perspective( 400px) rotateY( 45deg);
}
.per_sample_box .per_blue {
perspective: 400px;
}
.per_sample_box .per_blue>div {
background-color: blue;
transform: rotateY( 45deg);
}
<!DOCTYPE html>
<html lang="ko">
<head></head>
<body>
<div class="per_sample_box">
<div class="per_red">
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
</div>
<div class="per_blue">
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
</div>
</div>
</body>
</html>