@charset "UTF-8";

#body {
  height: 1630px;
}

#contents_01 {
  width: 574px;
  font-size: 108%;
  line-height: 1.7;
  margin-bottom: 360px;

  > h2 {
    &:first-child {
      margin-top: 0;
    }

    margin-top: 200px;
  }

  > p {
    padding: 1.5em 0.5em;
  }

  div {
    img {
      display: block;
      margin: auto;

      &:first-child {
        margin-bottom: 10px;
      }
    }
  }
}

.menu01 {
  display: grid;
  grid-template-columns: repeat(3, 1fr) 230px;
  grid-template-rows: repeat(2, 1fr);
  grid-row-gap: 30px;

  .div01 { grid-area: 1 / 1 / 2 / 2; }
  .div02 { grid-area: 1 / 2 / 2 / 3; }
  .div03 { grid-area: 1 / 3 / 2 / 4; }
  .div04 { grid-area: 2 / 1 / 3 / 2; }
  .div05 { grid-area: 2 / 2 / 3 / 3; }
  .div06 { grid-area: 2 / 3 / 3 / 4; }
  .div07 { grid-area: 1 / 4 / 3 / 5; margin-left: auto;}
}

.menu02 {
  display: grid;
  grid-template-columns: repeat(2, 1fr) 230px;
  grid-column-gap: 50px;

  .div02 {
    margin-right: 25px;
  }
}