背景のみ斜めにする方法

HTML

<div class=”nanamebg “>
<div class=”nanamebg2”>

</div></div>

 

CSS

 

.nanamebg {
position: relative;
overflow: hidden;

}
.nanamebg:before {
content: ”;
position: absolute;
top: 0;
left: 0;
width: 120%;
height: 80%;
margin: 3.5% -3% 0;
background: #e0e0e0;
-webkit-transform-origin: left center;
-ms-transform-origin: left center;
transform-origin: left center;
-webkit-transform: rotate(5deg);
-ms-transform: rotate(5deg);
transform: rotate(5deg);
z-index: -1;
}
.nanamebg2 {
box-sizing: boder-box;
width: 100%;
height: 100%;
margin: 0 auto;
padding:4em 0px 7em;
color: #fff;
}