@charset "UTF-8";

/* =====================
  contents
===================== */
.contents {
  padding-block: 120px 95px;
  padding-inline: 160px;

  @media only screen and (width <= 768px) {
    padding-block: calc((100 / 390) * 80 * 1vw) calc((100 / 390) * 64 * 1vw);
    padding-inline: calc((100 / 390) * 16 * 1vw);
  }

  .u-inner {
    --_border-color: #e3e3e3;

    display: block grid;
    gap: 81px;
    padding-block: 75px 80px;
    background: var(--grey03);

    @media only screen and (width <= 768px) {
      gap: 6vw;
      padding-block: calc((100 / 390) * 48 * 1vw);
      padding-inline: calc((100 / 390) * 16 * 1vw);
    }

    .u-hgroup {
      margin-inline: auto;
      translate: -13px 0;

      @media only screen and (width <= 768px) {
        translate: 0 0;
      }
    }
  }

  .u-table {
    --_border-color: var(--grey);

    grid-template-columns: 325px 1fr;
    inline-size: 100%;
    padding-inline: 80px;
    margin-inline: auto;

    @media only screen and (width <= 768px) {
      grid-template-columns: calc((100 / 390) * 93 * 1vw) 1fr;
      padding-inline: 0;
    }

    & .tr {
      align-items: center;

      & :where(dt, dd) {
        align-self: center;
        min-block-size: 100px;
        padding-block: 23px;
        line-height: 2;

        @media only screen and (width <= 768px) {
          min-block-size: auto;
          padding-block: calc((100 / 390) * 14 * 1vw) calc((100 / 390) * 16.7 * 1vw);
          line-height: 1.8;
        }
      }

      & dd {
        display: block grid;
        align-items: center;

        @media only screen and (width <= 768px) {
          padding-inline: 7vw 4.1vw;
        }
      }
    }
  }

  .u-anchor {
    margin-block-start: 56px;
    margin-inline: auto;

    @media only screen and (width <= 768px) {
      margin-block-start: calc((100 / 390) * 32 * 1vw);
    }
  }

  .kyu-ryo-indent {
    @media only screen and (width <= 768px) {
      padding-inline-start: calc((100 / 390) * 44 * 1vw);
    }
  }
}