@charset "UTF-8";
/* ----------------
 * Staff
 * ---------------- */
#introduction {
  padding-top: 5rem;
  padding-bottom: 6.9rem; }
  @media (min-width: 768px) {
    #introduction {
      width: 100%;
      padding-top: 9rem;
      padding-bottom: 6.2rem; } }
  @media (max-width: 767px) {
    #introduction {
      width: 100%;
      padding-right: 4rem;
      padding-left: 4rem; } }
  #introduction .inner {
    margin-top: 5rem; }
    @media (min-width: 768px) {
      #introduction .inner {
        width: 94rem;
        margin-left: auto;
        margin-right: auto;
        left: 0;
        right: 0; } }
    @media (max-width: 767px) {
      #introduction .inner {
        width: 100%; } }
    #introduction .inner .image {
      margin-left: -4rem;
      margin-right: -4rem; }
      @media (min-width: 768px) {
        #introduction .inner .image {
          margin-left: -21.3rem;
          margin-right: -21.3rem; } }
      #introduction .inner .image img {
        width: 100%;
        height: auto; }
    #introduction .inner .lead {
      margin-top: 5rem;
      font-size: 2.4rem;
      line-height: 4.8rem;
      letter-spacing: .2em;
      font-weight: bold; }
      @media (min-width: 768px) {
        #introduction .inner .lead {
          margin-top: 7rem;
          line-height: 5rem;
          text-align: center; } }
    #introduction .inner .text {
      margin-top: 2.8rem;
      font-size: 1.6rem;
      line-height: 3.5rem;
      letter-spacing: .06em; }
      @media (min-width: 768px) {
        #introduction .inner .text {
          margin-top: 5rem; } }
    #introduction .inner .signature {
      margin-top: 3rem;
      display: flex;
      justify-content: center;
      align-items: center; }
      @media (min-width: 768px) {
        #introduction .inner .signature {
          margin-top: 5rem; } }
      #introduction .inner .signature .position {
        font-size: 1.5rem;
        line-height: 3.2rem;
        letter-spacing: .12em;
        font-weight: bold; }
      #introduction .inner .signature .name {
        margin-left: 2.2rem;
        font-size: 2.4rem;
        line-height: 3.2rem;
        letter-spacing: .13em;
        font-weight: bold; }
  #introduction picture {
    display: block;
    margin-top: calc(8px * 6); }

@media (min-width: 768px) {
  .staff-list {
    width: 100%;
    padding-top: 12rem;
    padding-bottom: 10.8rem; } }
@media (min-width: 768px) {
  .staff-list > ul {
    width: 102.5rem;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0; } }
@media (min-width: 768px) {
  .staff-list > ul > li {
    display: flex;
    justify-content: space-between; } }
.staff-list > ul > li + li {
  margin-top: 4rem; }
  @media (min-width: 768px) {
    .staff-list > ul > li + li {
      margin-top: 6rem; } }
@media (min-width: 768px) {
  .staff-list > ul > li .base {
    width: 25rem; } }
.staff-list > ul > li .base .image img {
  width: 100%;
  height: auto; }
.staff-list > ul > li .base .meta {
  padding: 3rem 4rem 0; }
  @media (min-width: 768px) {
    .staff-list > ul > li .base .meta {
      padding: 3rem 0 0; } }
  .staff-list > ul > li .base .meta .position {
    font-size: 1.5rem;
    letter-spacing: .06em;
    font-weight: bold; }
  .staff-list > ul > li .base .meta .name {
    margin-top: 2rem;
    font-size: 2.4rem;
    letter-spacing: .15em;
    font-weight: bold; }
  .staff-list > ul > li .base .meta .en {
    margin-top: 1rem;
    font-size: 1.4rem;
    letter-spacing: .12em; }
.staff-list > ul > li .profile {
  background-color: #FFFFFF;
  padding: 4rem 4rem 4rem; }
  @media (min-width: 768px) {
    .staff-list > ul > li .profile {
      width: calc(100% - 25rem - 2rem);
      padding: 6rem 7rem 5ta 0.5rem; } }
  .staff-list > ul > li .profile .title {
    font-family: "Open Sans", sans-serif;
    color: #E45403;
    font-size: 1.8rem;
    letter-spacing: .12em; }
  .staff-list > ul > li .profile .block {
    margin-top: 2.4rem; }
    .staff-list > ul > li .profile .block > ul {
      margin-top: 2rem; }
      .staff-list > ul > li .profile .block > ul > li {
        padding-left: 2rem;
        font-size: 1.4rem;
        line-height: 2.6rem;
        letter-spacing: .07em;
        position: relative; }
        .staff-list > ul > li .profile .block > ul > li:before {
          position: absolute;
          top: 0;
          left: 0; }
        .staff-list > ul > li .profile .block > ul > li .date {
          position: absolute;
          top: 0;
          left: 2rem; }
      .staff-list > ul > li .profile .block > ul.history > li {
        padding-left: 12rem; }
.staff-list .buttons {
  margin: 4rem 2rem; }
  @media (min-width: 768px) {
    .staff-list .buttons {
      margin: 8.7rem 0 0; } }
  .staff-list .buttons .button.pdf.performance {
    background-color: #E45403; }
    @media (max-width: 767px) {
      .staff-list .buttons .button.pdf.performance {
        text-align: center; } }
    .staff-list .buttons .button.pdf.performance .size {
      color: #E45403; }

/*SP仕様*/
@media screen and (max-width: 767px) {
  .introduction {
    width: 100%;
    padding-right: 4rem;
    padding-left: 4rem; }
    .introduction .inner {
      width: 100%; } }
