@charset "UTF-8";

.main {
  /* =====================
    message
  ===================== */
  .message {
    padding-block: 116px 126px;

    @media (width <= 768px) {
      padding-block: calc((100 / 750) * 113 * 1vw) calc((100 / 750) * 124 * 1vw);
    }
    .message_wrap {
      inline-size: 860px;
      margin-inline: auto;

      @media (width <= 768px) {
        inline-size: 100%;
      }
      .title {
        font-family: var(--yumin);
        font-size: 30px;
        font-weight: 600;
        line-height: 1.8;
        text-align: center;

        @media (width <= 768px) {
          font-size: calc((100 / 750) * 38 * 1vw);
        }
      }
      .description {
        margin-block-start: calc(72px + var(--leading-trim));

        @media (width <= 768px) {
          margin-block-start: calc((100 / 750) * 59 * 1vw);
          line-height: 1.77;
        }
      }
      .name-set {
        inline-size: fit-content;
        margin-inline: auto 0;
        margin-block-start: 30px;
        .name {
          display: block flex;
          align-items: center;
          gap: 20px;
          & dt {
            font-weight: 500;
          }
          & dd {
            font-family: var(--yuji);
            font-size: 32px;
            line-height: 1;
            letter-spacing: 1.28px;
            color: #000;
          }
        }

        @media (width <= 768px) {
          margin-block-start: calc((100 / 750) * 60 * 1vw);
          .name {
            gap: calc((100 / 750) * 32 * 1vw);
            & dd {
              font-size: calc((100 / 750) * 50 * 1vw);
            }
          }
        }
      }
    }
  }
  /* =====================
    profile
  ===================== */
  .profile {
    padding-block: 130px;

    @media (width <= 768px) {
      padding-block: calc((100 / 750) * 130 * 1vw);
    }
    .u-table[data-url='profile'] {
      margin-block-start: 57px;

      @media (width <= 768px) {
        margin-block-start: calc((100 / 750) * 54 * 1vw);
      }
    }
    & h3.title {
      margin-block-start: 110px;
      font-family: var(--yumin);
      font-size: 24px;
      font-weight: 600;
      line-height: 2.5;
      text-align: center;
      color: #282823;

      @media (width <= 768px) {
        margin-block-start: calc((100 / 750) * 60 * 1vw);
        font-size: calc((100 / 750) * 36 * 1vw);
      }
    }
    .u-table[data-url='history'] {
      @media (width <= 768px) {
        margin-block-start: calc((100 / 750) * 26 * 1vw);
      }
    }
  }
  /* =====================
  access
  ===================== */
  .access {
    padding-block: 130px;

    @media (width <= 768px) {
      padding-block: calc((100 / 750) * 130 * 1vw);
    }
    .u-inner {
      display: block grid;
      align-items: end;

      .u-h2-title {
        grid-column: 1/3;

        @media (width <= 768px) {
          grid-column: 1/2;
          grid-row: 1/2;
        }
      }

      .address {
        grid-column: 1/2;
        margin-block-start: 80px;
        line-height: 2.13;

        @media (width <= 768px) {
          grid-column: 1/2;
          grid-row: 2/3;
          margin-block-start: calc((100 / 750) * 48 * 1vw);
          line-height: 1.67;
        }
      }
      .u-anchor {
        grid-column: 2/3;
        margin-inline: auto 0;
        margin-block-end: 11px;

        @media (width <= 768px) {
          grid-column: 1/2;
          grid-row: 4/5;
          margin-inline: auto;
          margin-block-start: calc((100 / 750) * 60 * 1vw);
          margin-block-end: 0;
        }
        & span {
          font-family: var(--yugo);
          font-size: 14px;
          font-weight: bold;
          &::before {
            inline-size: 13px;
            aspect-ratio: 1 / 1;
            background-repeat: no-repeat;
            background-image: url(../img/_common/icon_link.svg);
            mask-image: unset;
            background-color: unset;
            right: 34px;
          }

          @media (width <= 768px) {
            font-size: calc((100 / 750) * 24 * 1vw);
            &::before {
              background-size: cover;
              inline-size: calc((100 / 750) * 26 * 1vw);
              right: calc((100 / 750) * 47 * 1vw);
            }
          }
        }
      }
      & iframe {
        grid-column: 1/3;
        margin-block-start: 19px;

        @media (width <= 768px) {
          grid-column: 1/2;
          grid-row: 3/4;
          margin-block-start: calc((100 / 750) * 48 * 1vw);
          inline-size: calc((100 / 750) * 670 * 1vw);
          block-size: calc((100 / 750) * 600 * 1vw);
        }
      }
    }
  }
}