@charset "UTF-8";

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

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

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

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

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

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

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

      /* ==== h3 ==== */
      h3 {
        &::before {
          content: '【';
        }

        &::after {
          content: '】';
        }
      }

      /* ==== location ==== */
      .location {
        word-break: auto-phrase;

        @media (width <=768px) {
          padding-inline-start: 1em;
        }
      }

      /* ==== tel-fax ==== */
      .tel-fax {
        display: block flex;
        gap: 5px;
        align-items: center;

        @media (width <=768px) {
          display: block flex;
          flex-direction: column;
          gap: 0;
          align-items: flex-start;
          padding-inline-start: 1em;
        }

        @media (width > 768px) {
          p+p::before {
            margin-inline-end: 3px;
            content: '／';
          }
        }
      }
    }

    /* ==== insurance-list ==== */
    .insurance-list {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 0 9px;

      @media (width <=768px) {
        display: block flex;
        flex-direction: column;
        gap: 0;

        li {
          --indent: 2.1vw;
          padding-inline-start: var(--indent);
          text-indent: calc(var(--indent) * -1);
        }

        li::before {
          margin-inline-end: 1vw;
          content: '-';
          opacity: 0.5;
        }

        li:last-child {
          text-align: right;
        }

        li:last-child::before {
          visibility: hidden;
        }
      }
    }
  }

  /* =====================
  organization
===================== */
  .organization {
    padding-block: 160px;
    background: white;

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

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

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

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

    /* ==== picture ==== */
    .picture {
      display: block flow;
      margin-inline: auto;
    }
  }
}