<div class=container>
  <div class=column>
    <p>K 1</p>
    <div class=container-2>
      <div class=column-2>
        <p>K 1.1</p>
      </div>
      <div class=column-2>
        <p>K 1.2</p>
      </div>
      <div class=column-2>
        <p>K 1.3</p>
      </div>
    </div>
  </div>
  <div class=column>
    <p>K 2</p>
    <div class=container-vw>
      <div class=column-vw>
        <p>K 2.1</p>
      </div>
    </div>
  </div>
  <div class=column>
    <p>K 3</p>
    <div class=container-2>
      <div class=column-2>  
        <p>K 3.1</p>
      </div>
      <div class=column-2>  
        <p>K 3.2</p>
      </div>
      <div class=column-2>  
        <p>K 3.3</p>
      </div>
    </div>
  </div>
</div>

html {
  height: 200px;
  color: white;
  font-family: sans-serif;
}

p {
    padding: 5px 10px 5px 10px;
}

.container {
    display: grid;
    grid-template-columns: 30% 30% 30%;
    grid-template-rows: 100%;
    grid-column-gap: 5%;
    justify-items: stretch;
    align-items: stretch;
    background-color: #1abc9c;
    height: 100vh;
 }

.container-2 {
    display: grid;
    grid-template-columns: 30% 30% 30%;
    grid-template-rows: 100%;
    grid-column-gap: 5%;
    justify-items: stretch;
    align-items: stretch;
    background-color: #16a085;
    height: 100px;
 }

.column {
  background-color: #3498db;
}

.column-2 {
  background-color: #2980b9
    ;
}

.column-vw {
  background-color: #9b59b6;
  height: 200px;
  width: 33vw;
}