.a-layout {
  display: table;
  max-width: 1200px;
  margin: 0 auto;
  width: 100%;
}
.a-layout > .one-space,
.a-layout > .one-side,
.a-layout > .two-space,
.a-layout > .two-side,
.a-layout > .three-space {
  display: table-cell;
  vertical-align: top;
}
.a-layout > .one-space,
.a-layout > .three-space {
  width: 20px;
}
.a-layout > .two-space {
  width: 50px;
}
.a-layout > .two-side {
  width: 300px;
}
@media screen and (max-width: 1020px) {
  .a-layout > .two-space {
    width: 30px;
  }
}
@media screen and (max-width: 800px) {
  .a-layout > .two-space {
    display: none;
  }
  .a-layout > .one-side,
  .a-layout > .two-side {
    display: block;
    width: 100%;
    float: none;
  }
}
@media screen and (max-width: 500px) {
  .a-layout > .one-space,
  .a-layout > .three-space {
    width: 10px;
  }
}