<div class="container">
  <div class="item"></div>
</div>

* {
  box-sizing: border-box;
}

body {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
}

.container{
  background-color: #eee;
  background-image: url('https://i.imgur.com/T9nIIrM.png');
  width: 300px;
  height: 300px;
  
  display: grid;
  grid-template-rows: repeat(5, 1fr);
  grid-template-columns: repeat(5, 1fr);
}

.item {
  background: rgba(255, 0, 0, 0.5);
  grid-row-start: 2;
  grid-row-end: 5;
  grid-column-start: 2;
  grid-column-end: 4;
}