/* ==========================================================================
   pages-staff.css
   ========================================================================== */

.p-staff__section--profiles {
  margin-top: 56px;
}

.p-staff__profiles {
  max-width: var(--pricing-max);
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: var(--pricing-gap);
}

.p-staff__profileGroup {
  background: var(--group-bg, #fff);
  border-radius: var(--group-radius, 10px);
  padding: var(--group-pad-y, 18px) var(--group-pad-x, 18px);
  border: var(--group-border, 1px) solid var(--line, var(--ui-border));
}

.p-staff__profileGroup > .c-h3 {
  margin: 0 0 var(--group-title-gap);
}

/* H3は lesson の思想を踏襲 */
.p-staff__h3.c-h3.c-h3--dot-lsn {
  position: relative;
  font-size: var(--h3-lsn-size);
  font-weight: var(--h3-lsn-weight);
  padding-left: var(--h3-lsn-x);
  color: var(--brand);
}

.p-staff__h3.c-h3.c-h3--dot-lsn::after {
  content: var(--h3-lsn-dot-content);
  display: block;
  margin-top: var(--h3-lsn-dot-top);
  padding-left: var(--h3-lsn-dot-x);
  font-size: var(--h3-lsn-dot-size);
  letter-spacing: var(--h3-lsn-dot-letter);
  color: var(--h3-lsn-dot-color);
}

/* プロフィール本体 */
.p-staff__profileBlock {
  display: grid;
  grid-template-columns: 280px 1fr;
  column-gap: 32px;
  align-items: start;
}

/* 写真 */
.p-staff__profileMedia {
  width: 100%;
}

.p-staff__profileImg {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 10px;
}

/* 本文 */
.p-staff__profileBody {
  min-width: 0;
}

.p-staff__profileRole {
  font-size: var(--h4-size);
  font-weight: var(--h4-weight);
  color: var(--brand);
  margin: 0 0 var(--block-inner-gap);
}

/* c-proseの頭だけ詰める */
.p-staff__profileProse > *:first-child {
  margin-top: 0;
}

/* 原文の段落感を壊さない */
.p-staff__profileProse p {
  line-height: 1.8;
}

/* SP */
@media (max-width: 767px) {
  .p-staff__section--profiles {
    margin-top: 40px;
  }

  .p-staff__profileBlock {
    grid-template-columns: 1fr;
    row-gap: 20px;
  }

  .p-staff__profileMedia {
    max-width: 320px;
  }
}