/* pages/company.css */

body[data-path="/company/"] {
}

body[data-path="/company/message/"] {
  .p-hero-image {
    margin-block-end: calc(40 * 1rem / 16);
    @media (width >= 768px) {
      position: relative;
      margin-block-end: 80px;
    }

    .c-hero-image {
      z-index: 1;
      margin-block-end: calc(60 * 1rem / 16);
      @media (width >= 768px) {
        margin-block-end: unset;
      }
    }

    .p-hero-image__text {
      @media (width >= 768px) {
        position: absolute;
        inset: 120px auto auto 50%;
        z-index: 2;
        line-height: 1.8;
        padding-inline: 1em;
        padding-block: 0.5em;
        background-color: var(--color--white);
        margin-right:15px;
      }

      /* span {
        @media (width >= 768px) {
          padding-inline: 1em;
          padding-block: 0.5em;
          background-color: var(--color--white);
          -webkit-box-decoration-break: clone;
          box-decoration-break: clone;
        }
      } */
    }
  }

  .p-signature {
    .c-image {
      max-inline-size: calc(180 * 1rem / 16);
      @media (width >= 768px) {
        max-inline-size: 200px;
      }
    }
  }
}

body[data-path="/company/philosophy/"] {
  .p-bg {
    block-size: calc(720 * 1rem / 16);
    margin-inline: calc(var(--padding--page-sm) * -1rem / 16);
    padding-inline: calc(20 * 1rem / 16);
    padding-block: calc(40 * 1rem / 16);
    background-color: #0a49cb;
    background-image: url("/assets/img/pages/company/philosophy/bg.webp");
    background-position: left bottom;
    background-repeat: no-repeat;
    background-size: cover;
    @media (width >= 768px) {
      block-size: 700px;
      margin-inline: unset;
      padding-inline: 50px;
      padding-block: 50px;
    }
  }
}

body[data-path="/company/outline/"] {
  .p-table {
    .c-table {
      tbody {
        th {
          inline-size: calc(280 * 1rem / 16);
          text-align: left;
          @media (width >= 768px) {
            inline-size: 280px;
          }
        }
      }
    }
  }
}

body[data-path="/company/group/"] {
  .p-table {
    .c-table {
      tbody {
        td {
          line-height: 1.8;
        }

        td:nth-of-type(1),
        td:nth-of-type(2) {
          inline-size: calc(300 * 1rem / 16);
          @media (width >= 768px) {
            inline-size: 300px;
          }
        }
        address {
          p + p {
            margin-block-start: calc(15 * 1rem / 16);
            padding-block-start: calc(15 * 1rem / 16);
            border-block-start: 1px solid var(--color--border-gray);
            @media (width >= 768px) {
              margin-block-start: 15px;
              padding-block-start: 15px;
            }
          }
        }
      }
    }
  }
}

body[data-path="/company/officer/"] {
  .p-directors {
  }

  .p-auditors {
  }

  .p-executive-officers {
  }

  .p-members {
    display: grid;
    grid-template-columns: 1fr;
    gap: calc(60 * 1rem / 16);
    @media (width >= 768px) {
      grid-template-columns: repeat(2, 1fr);
      column-gap: 50px;
      row-gap: 80px;
    }
  }

  .p-member {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: auto calc(20 * 1rem / 16) auto calc(40 * 1rem / 16) auto;
    grid-template-areas:
      "image"
      "."
      "name"
      "."
      "timeline";
    @media (width >= 768px) {
      grid-template-columns: 220px 50px 1fr;
      grid-template-rows: auto 40px 1fr;
      grid-template-areas:
        "image . name"
        ". . ."
        "timeline timeline timeline";
    }

    .p-member__name {
      grid-area: name;
      @media (width >= 768px) {
        align-self: center;
      }

      .c-text.c-text--s14 {
        line-height: 1.8;
      }
    }

    .p-member__image {
      grid-area: image;
    }

    .p-member__timeline {
      grid-area: timeline;
      align-self: start;
      display: grid;
      /* grid-template-columns: calc(130 * 1rem / 16) 1fr; */
      /* padding-inline-start: calc(29 * 1rem / 16); */
      grid-template-columns: auto 1fr;
      column-gap: 1em;
      padding-inline-start: 1em;
      border-inline-start: 1px solid var(--color--border-gray);
      line-height: 1.85;
      @media (width >= 768px) {
        grid-template-columns: 130px 1fr;
        column-gap: revert;
        padding-inline-start: 29px;
      }
    }
  }

  .p-executive-officers .p-members {
    grid-template-columns: repeat(2, 1fr);
    column-gap: unset;
    row-gap: calc(40 * 1rem / 16);
    @media (width >= 768px) {
      grid-template-columns: repeat(4, 1fr);
      row-gap: 50px;
    }

    .p-member {
      display: revert;
    }
  }
}

body[data-path="/company/history/"] {
  .p-table {
    .c-table {
      tbody {
        th,
        td {
          line-height: 1.8;
        }

        th,
        td:nth-of-type(1) {
          white-space: nowrap;
        }

        th {
          padding-inline: calc(40 * 1rem / 16);
          font-weight: 400;
          text-align: left;
        }

        td {
          mark {
            text-decoration: underline;
            text-decoration-color: var(--color--red);
            text-decoration-thickness: calc(3 * 1rem / 16);
            text-underline-offset: calc(5 * 1rem / 16);
            @media (width >= 768px) {
              text-decoration-thickness: 3px;
              text-underline-offset: 5px;
            }

            strong {
              color: var(--color--red);
              font-size: 1.35em;
              letter-spacing: -0.03em;
            }

            strong::before,
            strong::after {
              content: "\00A0";
            }
          }
        }

        td:nth-of-type(1) {
          padding-inline-start: calc(40 * 1rem / 16);
          text-align: right;
        }

        td + td {
          border-inline-start-width: 0;
        }
      }
    }

    .p-table__highlight {
      strong {
      }
    }
  }
}

body[data-path="/company/organization/"] {
}

body[data-path="/company/clause/"] {
}
