.parent {
position: relative;
display: inline-block;
width:70%;
text-align: center;
margin-bottom:700px;
}
.parent > img{
width:100%;
height:auto;
}
.layers{
  position: absolute;
  padding: 20px;
  width:72%;
  color: #111;
  font-size: 1em;
  left: 50%;
  transform: translate(-50%,-20%);
  background: rgba(248,248,248, 1);
  padding: 1rem;

    --x-gradient: linear-gradient(90deg, #ddd 0 30px, transparent 0 calc(100% - 30px), #ddd calc(100% - 30px));
    --y-gradient: linear-gradient(#eee 0 30px, transparent 0 calc(100% - 30px), #eee calc(100% - 30px));
    margin: 0.5rem;
    padding: 1rem;
    background-image:
        var(--x-gradient),
        var(--y-gradient),
        var(--x-gradient),
        var(--y-gradient);
    background-repeat: no-repeat;
    background-size: 100% 7px, 7px 100%, 100% 7px, 7px 100%;
    background-position: top, right, bottom, left;

}
.nakawaku{
   background:#e9e9e9;
}

@media screen and (max-width: 768px){
.parent {
  width: 90%;
  margin-bottom:500px;
} 
.layers{
  width:90%;
  font-size: .8em;
  transform: translate(-50%,-10%);
}}



.abst{
  position: absolute;
  top:50%;
  left: -70px;
 -ms-transform: translate(-50%,-50%);
  -webkit-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);
  color: #111;
  font-size: 1.8rem;
  margin: 0!important;
  padding: 0!important;
  font-size:2em;
  font-weight:400;
-ms-writing-mode: tb-rl;
writing-mode: vertical-rl;
writing-mode: sideways-lr;
}





.facility{
background:#f8f8f8;
box-shadow: 0 -3px 5px -3px #888; /* 0 (-3px - 3px) 5px (-3px) #888 */
padding:40px 20px 40px 70px;
text-align:left;
font-size:.9em;
}