<div class='out'>
  <div class='left'>
    Left
  </div>
  <div class='right'>
    <div class='big'>
      Big
    </div>
    <div class='small'>
      Small
    </div>
    <div class='small'>
      Small
    </div>
    <div class='small'>
      Small
    </div>
  </div>
</div>
    

* {
  text-align: center;
}

div {
  align-items: stretch;
} 

.out {
  display: flex;
  gap: 10px;
}

.left {
  flex: 1 1;
  background-color: #dff;
  padding: 10px 0;
  border: 2px solid black;
}

.right {
  display: flex;
  flex: 3 3;
  flex-wrap: wrap;
  gap: 10px;
}

.big {
  background-color: #fdf;
  flex: 1 1 100%;
  padding: 10px 0;
  border: 2px solid black;
}

.small {
  flex: 1 1;
  background-color: #dfd;
  padding: 10px 0;
  border: 2px solid black;
}