@charset "UTF-8";
/* =====================
  採用メッセージ
===================== */
.article[data-id='1'] {
  position: relative;
  padding-top: calc((100 / 750) * 91 * 1vw);
  padding-bottom: calc((100 / 750) * 111 * 1vw);
  background-color: #ededed;
  .message_wrap {
    margin-top: calc((100 / 750) * 72 * 1vw);
    .message-title {
      flex-shrink: 0;
      & > h3 {
        font-size: calc((100 / 750) * 52 * 1vw);
        font-weight: 500;
        line-height: 1.7;
      }
      .en-catch {
        margin-top: calc((100 / 750) * 6 * 1vw);
      }
    }
    .message_unit {
      margin-top: calc((100 / 750) * 41 * 1vw);
      line-height: 2;
      & p + p {
        margin-top: 2em;
      }
    }
  }
}

/* =====================
  求める人物像
===================== */
.article[data-id='2'] {
  position: relative;
  padding-top: calc((100 / 750) * 92 * 1vw);
  padding-bottom: calc((100 / 750) * 128 * 1vw);
  .inner {
    & > ol {
      counter-reset: number 0;
      margin-top: calc((100 / 750) * 31 * 1vw);
      & > li {
        padding-block: calc((100 / 750) * 47 * 1vw);
        border-bottom: solid 1px #9e9e9e;
        .person-title {
          flex-shrink: 0;
          display: flex;
          align-items: center;
          flex-direction: row-reverse;
          justify-content: space-between;
          gap: calc((100 / 750) * 56 * 1vw);
          .recruit-hgroup {
            display: flex;
            align-items: flex-end;
            gap: 0.6em;
            margin-top: calc((100 / 750) * 6 * 1vw);
            & h4 {
              position: relative;
              font-size: calc((100 / 750) * 30 * 1vw);
              font-weight: 500;
              line-height: 1.7;
              &::before {
                counter-increment: number 1;
                content: '0' counter(number);
                display: block;
                font-family: var(--lexend);
                font-size: calc((100 / 750) * 36 * 1vw);
                font-weight: 500;
                line-height: 1;
                letter-spacing: calc((100 / 750) * 1.44 * 1vw);
                color: #24845b;
                margin-bottom: calc((100 / 750) * 12 * 1vw);
              }
            }
            & p {
              font-size: calc((100 / 750) * 28 * 1vw);
              letter-spacing: calc((100 / 750) * 1.12 * 1vw);
              line-height: 1.7;
            }
          }
          & > picture {
            & > img {
              width: calc((100 / 750) * 136 * 1vw);
            }
          }
        }
        & > P {
          line-height: 2;
          margin-top: calc((100 / 750) * 29 * 1vw);
        }
        &:last-child {
          border-bottom: none;
        }
      }
    }
    .person_wrap {
      margin-top: calc((100 / 750) * 26 * 1vw);
      display: grid;
      grid-template-rows: auto auto;
      row-gap: calc((100 / 750) * 24 * 1vw);
      .person_unit {
        position: relative;
        background: linear-gradient(127deg, #24845b 5%, #2fa371 94%);
        border-radius: calc((100 / 750) * 30 * 1vw);
        &::before {
          content: '';
          position: absolute;
          top: calc((100 / 750) * 4 * 1vw);
          bottom: calc((100 / 750) * 4 * 1vw);
          left: calc((100 / 750) * 4 * 1vw);
          right: calc((100 / 750) * 4 * 1vw);
          background-color: #fff;
          border-radius: calc((100 / 750) * 26 * 1vw);
          pointer-events: none;
        }
        .person_content {
          padding-inline: calc((100 / 750) * 48 * 1vw);
          padding-block: calc((100 / 750) * 37 * 1vw) calc((100 / 750) * 42 * 1vw);
          & > h3 {
            position: relative;
            font-size: calc((100 / 750) * 32 * 1vw);
            font-weight: 500;
            line-height: 1.8;
            text-align: center;
            color: #24845b;
          }
          & > p {
            position: relative;
            margin-top: calc((100 / 750) * 18 * 1vw);
            & > span {
              display: inline-block;
              font-size: calc((100 / 750) * 25 * 1vw);
            }
          }
          & > h4 {
            position: relative;
            color: #2fa371;
            margin-top: calc((100 / 750) * 8 * 1vw);
            font-weight: 500;
          }
          & > ul {
            position: relative;
            & > li {
              position: relative;
              display: flex;
              align-items: center;
              gap: calc((100 / 750) * 16 * 1vw);
              &::before {
                content: '';
                display: block;
                width: calc((100 / 750) * 16 * 1vw);
                height: calc((100 / 750) * 16 * 1vw);
                border-radius: 50rem;
                background-image: linear-gradient(140deg, #24845b 4%, #2fa371 96%);
              }
              & + li {
                margin-top: calc((100 / 750) * 6 * 1vw);
              }
            }
          }
          .eg {
            position: relative;
            font-size: calc((100 / 750) * 25 * 1vw);
            line-height: 1.4;
            color: #1b1b1e;
            margin-top: calc((100 / 750) * 10 * 1vw);
          }
        }
        &[data-id='1'] {
          .person_content {
            & > ul {
              margin-top: calc((100 / 750) * 18 * 1vw);
            }
          }
        }
        &[data-id='2'] {
          .person_content {
            padding-block: calc((100 / 750) * 37 * 1vw) calc((100 / 750) * 49 * 1vw);
            & > ul {
              margin-top: calc((100 / 750) * 6 * 1vw);
            }
          }
        }
      }
    }
  }
}
/* =====================
  企業理念
===================== */
.article[data-id='3'] {
  position: relative;
  padding-top: calc((100 / 750) * 90 * 1vw);
  padding-bottom: calc((100 / 750) * 82 * 1vw);
  background-image: linear-gradient(140deg, #24845b 4%, #2fa371 96%);
  .inner {
    & > ul {
      margin-top: calc((100 / 750) * 57 * 1vw);
      & > li {
        position: relative;
        padding-block: calc((100 / 750) * 28 * 1vw);
        & > h4 {
          position: relative;
          font-size: calc((100 / 750) * 36 * 1vw);
          font-weight: 500;
          line-height: 1;
          color: #fff;
          display: flex;
          flex-direction: row-reverse;
          align-items: center;
          justify-content: center;
          gap: 0.7em;
          flex-direction: column;
          
          
          &::before {
            content: attr(data-text);
            display: block;
            font-family: var(--lexend);
            font-size: calc((100 / 750) * 28 * 1vw);
            font-weight: 500;
            line-height: 1;
            letter-spacing: calc((100 / 750) * 1.12 * 1vw);
            color: #fff;
            translate: 0 0.3vw;
          }
        }
        .philosophy_content {
          background-color: #fff;
          border-radius: calc((100 / 750) * 20 * 1vw);
          padding-inline: calc((100 / 750) * 32 * 1vw);
          padding-block: calc((100 / 750) * 30 * 1vw);
          font-size: calc((100 / 750) * 28 * 1vw);
          line-height: 2;
          margin-top: calc((100 / 750) * 38 * 1vw);
          text-align: center;
        }
        &[data-id='1'] {
          .philosophy_content {
            text-align: center;
          }
        }
      }
    }
    .philosophy_wrap {
      margin-top: calc((100 / 750) * 49 * 1vw);
      & > picture {
        display: block;
        text-align: center;
        & > img {
          width: calc((100 / 750) * 568 * 1vw);
        }
      }
      & > ol {
        counter-reset: number 0;
        width: 100%;
        & > li {
          position: relative;
          padding-inline: calc((100 / 750) * 24 * 1vw);
          padding-block: calc((100 / 750) * 30 * 1vw) calc((100 / 750) * 36 * 1vw);
          & > h4 {
            font-size: calc((100 / 750) * 30 * 1vw);
            font-weight: 500;
            line-height: 1.8;
            color: #fff;
            position: relative;
            &::before {
              counter-increment: number 1;
              content: '0' counter(number);
              font-family: var(--lexend);
              font-size: calc((100 / 750) * 26 * 1vw);
              font-weight: 500;
              line-height: 1;
              letter-spacing: calc((100 / 750) * 1.04 * 1vw);
              color: #fff;
              vertical-align: baseline;
              margin-right: 0.6em;
            }
          }
          & > p {
            font-size: calc((100 / 750) * 28 * 1vw);
            line-height: 1.6;
            color: #fff;
            margin-top: calc((100 / 750) * 8 * 1vw);
          }
          &::after {
            content: '';
            display: block;
            background-size: calc((100 / 750) * 10 * 1vw) calc((100 / 750) * 4 * 1vw);
            background-image: linear-gradient(to right, #fff calc((100 / 750) * 5 * 1vw), transparent calc((100 / 750) * 5 * 1vw));
            background-repeat: repeat-x;
            background-position: left bottom;
            position: absolute;
            bottom: 0;
            left: 0;
            width: 100%;
            height: 1px;
          }
          &:last-child {
            &::after {
              display: none;
            }
          }
        }
      }
    }
  }
}

.vision-text {
  font-weight: bold;
  text-align: center;
  color: white;
  margin-block-start: calc((100 / 750) * 32 * 1vw);
  margin-block-end: calc((100 / 750) * 8 * 1vw);
  font-size: calc((100 / 750) * 32 * 1vw);
}
.philosophy_wrap {
  margin-top: 0 !important;
}
