Fixed column with the same height as the row that contains it

* {
  box-sizing: border-box
}

.tabla-responsive {
  margin: 2em auto;
}

.tabla-responsive table {
  border: solid 1px steelblue;
}

.tabla-responsive thead th {
  background-color: aliceblue;
}

.tabla-responsive tbody tr {
  background-color: beige;
}

.tabla-responsive tbody tr td:first-child,
.tabla-responsive thead tr th:first-child {
  background-color: bisque;
}

.tabla-responsive tbody tr:nth-child(odd) {
  background-color: azure;
}

.wrapper-fixed-table {
  padding: 0;
  margin: 0;
}

.tabla-responsive {
  overflow-x: auto;
}

.tabla-responsive table {
  min-width: 600px;
}

.tabla-responsive table::after {
  content: "";
  display: block;
  height: 0;
  width: 10em;
}

.tabla-responsive table th:first-child::after,
.tabla-responsive table th:first-child::before,
.tabla-responsive table td:first-child::before,
.tabla-responsive table td:first-child::after {
  content: "";
}

.tabla-responsive table thead th:first-child,
.tabla-responsive table tbody td:first-child {
  position: absolute;
  width: 10em;
  z-index: 500;
}

<div class="wrapper-fixed-table">
  <div class="tabla-responsive">
    <table>
      <thead>
        <tr>
          <th>Id</th>
          <th>Nombre</th>
          <th>Apellidos</th>
          <th>Edad en que se realizo el registro ante la sociedad tributaria antes SAT</th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <td>1</td>
          <td>Micael</td>
          <td>Marz</td>
          <td>3</td>
        </tr>
        <tr>
          <td>2</td>
          <td>Reauserc hertzz marcuam refell thire secodn martz</td>
          <td>Rodriguez</td>
          <td>15</td>
        </tr>
      </tbody>
    </table>
  </div>
</div>