@charset "UTF-8";

/* ================================================================== root setting */
:root{
  --people-font-weght-bold: 600;
  --people-gray-color-300: 248, 248, 248;
  --people-gray-color-500: 237, 237, 237;
  --people-container-lg:min(100%, 140rem);
  --people-container-md:min(100%, 120rem);
  --people-container-sm:min(100%, 100rem);
}
.staff {
  font-family: var(--people-font-ja);
}
/* ================================================================== section-staff-mv */
.section-staff-mv__wrapper {
  position: relative;
  margin-inline: auto;
  width: var(--people-container-md);
}
.section-staff-mv__img {
  width: 70rem;
  margin-inline-start: auto;
}
.mv-text-block {
  position: absolute;
  top: 50%;
  left: 10.0rem;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  background-color: #fff;
  max-width: 60rem;
}
.mv-text-block__container {
  padding: 8.0rem 5.0rem;
  background-color: #fff;
}
.mv-text-block__title {
  font-size: 3.2rem;
  line-height: calc(48/32);
  font-weight: var(--people-font-weght-bold);
}
.mv-text-block__name {
  font-size: 1.8rem;
  margin-top: 2.3rem;
  line-height: 1;
}
.mv-text-block__name span {
  font-family: var(--people-font-en);
}
.mv-text-block__career {
  margin-top: 1.0rem;
  line-height: 1;
  font-size: 1.4rem;
}
.mv-text-block__career--block {
  display: inline-block;
  padding: .28em .75em .29em;
  background-color: rgb(var(--people-gray-color-500), 1);
  margin-right: .575em;
}
/* ================================================================== section-staff-content */
.section-staff-content {
  background-color: rgb(var(--people-gray-color-300), 1);
}
.staff-content-inner {
  width: var(--people-container-md);
  margin-inline: auto;
  padding: 8.0rem 0;
}
.staff-content--wrapper {
  background-color: #fff;
}
.staff-content {
  padding: 6.0rem 0;
  width: var(--people-container-sm);
  margin-inline: auto;
}
.staff-content > *:last-child {
  margin-bottom: 0;
}
.staff-content h2 {
  padding: 0.75em;
  margin-bottom: 3.0rem;
  background-color: rgb(var(--people-gray-color-300), 1);
  font-size: 2.0rem;
  font-weight: var(--people-font-weght-bold);
}
.staff-content p {
  font-size: 1.4rem;
  margin-bottom: 4.0rem;
  line-height: calc(21/14);
}
.staff-content dl dt {
  font-size: 1.4rem;
  line-height: calc(21/14);
  margin-top: 1rem;
  font-weight: bold;
}
.staff-content dl dd {
  font-size: 1.4rem;
  line-height: calc(21/14);
}
.staff-content__media {
  display: flex;
  gap: 5.0rem;
  margin-bottom: 4.0rem;
}
.staff-content__media--img {
  width: 50rem;
}
.staff-content__media--text {
  font-size: 1.4rem;
  line-height: calc(21/14);
  flex: 1;
}
.staff-content__media.staff-content__media--reverse {
  flex-direction: row-reverse;
}
.staff-content-footer {
  margin-top: 5.0rem;
}



@media (max-width: 767px) {
  :root{
    --people-container-lg: calc(100% - 40px);
    --people-container-md: calc(100% - 40px);
    --people-container-sm: 100%;
  }
  .section-staff-mv__img {
    width: 100%;
  }
  .section-staff-mv__wrapper {
    width: 100%;
  }
  .mv-text-block {
    position: relative;
    left: 0;
    top: -2.0rem;
    transform: none;
    width: 34rem;
    margin-inline-end: auto;
  }
  .mv-text-block__container {
    padding: 3.0rem 1.5rem 3.0rem 2.0rem;
  }
  .mv-text-block__title {
    font-size: 2.0rem;
  }
  .mv-text-block__name {
    font-size: 1.5rem;
    margin-top: 2.0rem;
    line-height: 1;
  }
  .mv-text-block__career {
    margin-top: .8rem;
    line-height: 1;
    font-size: 1.3rem;
  }
  .staff-content-inner {
    padding: 5.0rem 0;
  }
  .staff-content--wrapper {
    padding: 4.0rem 2.0rem;
  }
  .staff-content {
    padding: 0;
  }
  .staff-content h2 {
    margin-bottom: 2.0rem;
    font-size: 1.6rem;
    line-height: calc(24/16);
  }
  .staff-content p {
    font-size: 1.3rem;
    line-height: calc(22/13);
  }
  .staff-content dl dt {
    font-size: 1.3rem;
    line-height: calc(22/13);
    font-weight: bold;
  }
  .staff-content dl dd {
    font-size: 1.3rem;
    line-height: calc(22/13);
  }
  .staff-content__media {
    flex-direction: column;
    gap: 1.0rem;
  }
  .staff-content__media > *:last-child {
    margin-bottom: 0;
  }
  .staff-content__media--img {
    width: 100%;
  }
  .staff-content__media--text {
    font-size: 1.3rem;
    line-height: calc(22/13);
  }
  .staff-content__media.staff-content__media--reverse {
    flex-direction: column;
  }
  .staff-content-footer {
    margin-top: 3.0rem;
  }
}