@charset "UTF-8";

/* =====================
  01
===================== */
.tab-invite {
  .article[data-id='1'] {
    padding-block-end: 160px;

    @media (width <=768px) {
      padding-block-end: var(--nudge-9);
    }

    /* ==== u-inner ==== */
    .u-inner {
      display: block grid;
      gap: 40px;

      @media (width > 768px) {
        padding-inline: 80px;
      }

      @media (width <=768px) {
        gap: var(--nudge-3);
      }

      p {
        font-size: 15px;

        @media (width <=768px) {
          font-size: calc((100 / 390) * 14 * 1vw);
        }
      }
    }

    /* ==== section[data-id="1"] ==== */
    section[data-id='1'] {
      display: block grid;
      gap: 9px;
      margin-block-start: 2px;

      @media (width <=768px) {
        gap: var(--nudge-1);
        margin-block-start: 0;
      }

      h4 {
        font-size: 22px;
        font-weight: 600;
        color: #000;

        @media (width <=768px) {
          font-size: calc((100 / 390) * 18 * 1vw);
        }
      }
    }

    /* ==== list ==== */
    .list {
      display: block grid;
      gap: 40px;

      @media (width <=768px) {
        gap: var(--nudge-5);
      }

      section {
        display: block grid;
        gap: 25px;

        @media (width <=768px) {
          gap: var(--nudge-3);
        }
      }
    }
  }
}