/* ==========================================================================
   Company(会社案内)
   ========================================================================== */

/* --------------------------------------------------------------------------
   Page head
   -------------------------------------------------------------------------- */
.c-page-head--company {
  background-image: url("../img/company/sp/bg.jpg");
}

@media (min-width: 768px) {
  .c-page-head--company {
    background-image: url("../img/company/bg.jpg");
  }
}

/* --------------------------------------------------------------------------
   共通見出し(代表挨拶 / 会社概要)
   -------------------------------------------------------------------------- */
.p-company__heading {
  font-family: var(--font-ttl);
  font-size: 2.4rem;
  font-weight: var(--fw-ttl);
  line-height: 1.5;
  letter-spacing: 0.05em;
  text-align: center;
  color: var(--color-brown);
}

/* --------------------------------------------------------------------------
   代表挨拶(SP〜)
   -------------------------------------------------------------------------- */
.p-company-message {
  position: relative;
  padding: 110px 20px 0;
}

.p-company-message__leaf {
  position: absolute;
  top: -47.2px;
  left: 0;
  width: 156px;
  pointer-events: none;
}

.p-company-message__inner {
  position: relative;
  z-index: 1;
}

.p-company-message__text {
  margin-top: 30px;
}

.p-company-message__ceo {
  margin-top: 40px;
  text-align: center;
}

.p-company-message__ceo img {
  width: 225px;
  margin-inline: auto;
  border-radius: 25px;
}

.p-company-message__name {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 11px;
  margin-top: 13px;
  font-family: var(--font-ttl);
  font-size: 2.2rem;
  font-weight: var(--fw-ttl);
  line-height: 1.5;
  letter-spacing: 0.05em;
  color: var(--color-key);
}

.p-company-message__position {
  font-size: 1.6rem;
}

/* --------------------------------------------------------------------------
   会社概要(SP〜)
   -------------------------------------------------------------------------- */
.p-company-profile {
  margin-top: 110px;
  padding: 0 20px 90px;
}

.p-company-profile__table {
  margin-top: 30px;
  font-size: 1.6rem;
  line-height: 1.8;
  letter-spacing: 0.02em;
  border-bottom: 2px solid #b6b6b6;
}

.p-company-profile__row {
  padding: 19px 15px;
  border-top: 2px solid #b6b6b6;
}

.p-company-profile__row dt {
  font-weight: var(--fw-bold);
}

.p-company-profile__row dd {
  margin: 0;
}

/* --------------------------------------------------------------------------
   PC(768px〜)
   -------------------------------------------------------------------------- */
@media (min-width: 768px) {
  .p-company__heading {
    font-size: 3rem;
  }

  .p-company-message {
    padding-top: 158px;
  }

  .p-company-message__leaf {
    top: -62.7px;
    width: 291px;
  }

  .p-company-message__inner {
    max-width: 980px;
    margin-inline: auto;
  }

  .p-company-message__ceo img {
    width: 295px;
  }

  .p-company-message__name {
    margin-top: 20px;
    font-size: 2.5rem;
  }

  .p-company-message__position {
    font-size: 2rem;
  }

  .p-company-profile {
    margin-top: 143px;
    padding-bottom: 137px;
  }

  .p-company-profile__table {
    max-width: 760px;
    margin: 39px auto 0;
    font-size: 1.8rem;
  }

  .p-company-profile__row {
    display: flex;
    padding: 19px 50px 18.6px;
  }

  .p-company-profile__row dt {
    flex-shrink: 0;
    width: 174px;
    font-weight: var(--fw-medium);
  }

  /* TELはスマホのみリンクにする */
  .p-company-profile__tel {
    pointer-events: none;
  }
}

/* 代表挨拶: 本文と写真の横並び(1024px〜) */
@media (min-width: 1024px) {
  .p-company-message__inner {
    display: flex;
    align-items: flex-start;
    gap: 40.75px;
  }

  .p-company-message__body {
    flex: 0 1 645px;
  }

  .p-company-message__body .p-company__heading {
    text-align: left;
  }

  .p-company-message__ceo {
    flex: 0 0 295px;
    margin-top: 67.5px;
  }
}
