@charset "utf-8";
/* CSS Document */
/*〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓*/
/*流用・共通のデザイン（固定ページなどに使用）*/
/*〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓*/

main {
  .main_inner,
  .inner {
    position: relative;
    z-index: 10;
    &.max-1140 {
      max-width: 114rem;
      margin: auto;
    }
    &.padding {
      padding: 0 2rem;
    }
  }
  &.bace_wrap {
    margin: 10.2rem 0 19.5rem;

    @media screen and (max-width: 480px) {
      margin: 0 0 8rem;
    }
  }

  /*--------------------*/
  /* 背景画像 */
  &.page_bg {
    position: relative;
    &::before,
    &::after {
      content: "";
      display: block;
      position: absolute;
      background-repeat: no-repeat;
      background-size: contain;
      z-index: 1;
    }
    /* 背景・左 */
    &.left {
      &::before {
        background-image: url(../img/common/page_bg-left.webp);
        max-width: 35.8rem;
        width: 25vw;
        aspect-ratio: 358/876;
        top: 9.6rem;
        left: 0;
      }
      @media screen and (max-width: 1280px) {
        &::before {
          width: 18.75vw;
        }
      }
      @media screen and (max-width: 768px) {
        &::before {
          width: 15vw;
        }
      }
    }
    /* 背景・右 */
    &.right {
      &::after {
        background-image: url(../img/common/page_bg-right.webp);
        max-width: 46rem;
        width: 32vw;
        aspect-ratio: 460/240;
        top: 0;
        right: 0;
      }
      @media screen and (max-width: 1280px) {
        &::after {
          width: 24vw;
        }
      }
      @media screen and (max-width: 768px) {
        &::after {
          width: 19.2vw;
        }
      }
    }
    /* 背景画像*/
    &.child_img {
      &::after {
        max-width: 46rem;
        width: 32vw;
        top: 0;
        right: 0;
        height: 100%;
        background-repeat: no-repeat, no-repeat;
        background-size:
          93% auto,
          contain;
        background-position:
          right top min(8vw, 11rem),
          right top;
      }
      @media screen and (max-width: 1280px) {
        &::after {
          width: 24vw;
        }
      }
      @media screen and (max-width: 768px) {
        &::after {
          width: 19.2vw;
        }
      }
      &.child-01 {
        &::after {
          background-image: url(../img/common/page_bg-img01.webp);
        }
      }
      &.right.child-01 {
        &::after {
          background-image: url(../img/common/page_bg-img01.webp), url(../img/common/page_bg-right.webp);
        }
      }
      &.child-02 {
        &::after {
          background-image: url(../img/common/page_bg-img02.webp);
        }
      }
      &.right.child-02 {
        &::after {
          background-image: url(../img/common/page_bg-img02.webp), url(../img/common/page_bg-right.webp);
        }
      }
      &.child-03 {
        &::before {
          background-image: url(../img/common/page_bg-img03.webp);
          transform: translateY(25%);
        }
      }
    }

    /* 背景・スパイラルのみ*/
    &.spiral {
      background-image: url(../img/common/page_bg-spiral.svg);
      background-repeat: no-repeat;
      background-size: min(79vw, 114.6rem) auto;
      background-position: left -0.8rem top 17rem;
    }
    /* 背景・スパイラル・斜線 */
    &.diagonal.spiral {
      background-image: url(../img/common/page_bg-diagonal.svg), url(../img/common/page_bg-spiral.svg);
      background-repeat: no-repeat, no-repeat;
      background-size:
        min(53vw, 78.4rem) auto,
        min(79vw, 114.6rem) auto;
      background-position:
        right 1.6rem top 0,
        left -0.8rem top 24.2rem;
    }
  }
  /*--------------------*/
  /* 共通デザイン */
  .common_wrap {
    background-color: #fff;
    max-width: 114rem;
    box-sizing: border-box;
    padding: 6.2rem 4.2rem;
    border-radius: 0.8rem;
    margin: 4rem auto;
    color: #000;
    &:first-child {
      margin-top: 12.4rem;
    }
    &:last-of-type {
      margin-bottom: 0;
    }
    @media screen and (max-width: 480px) {
      padding: 3rem 2rem;
      margin: 2rem auto;
      border-radius: 0.4rem;
      &:first-child {
        margin-top: 2rem;
      }
    }
    h2 {
      font-size: 3rem;
      line-height: 1.4;
      margin: 2.3em 0 1.1em;
      @media screen and (max-width: 480px) {
        font-size: 2rem;
      }
      &:first-of-type {
        margin-top: 0;
      }
    }
  }
}

/*〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓*/
/*共通パーツ*/
/*〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓*/

/* タイトル*/
/*--------------------*/
/* リボン付き*/
.title-ribbon {
  position: relative;
  /* 基本サイズ */
  padding-top: 7.3rem;
  span {
    display: block;
    &.en {
      width: 9.6em;
      font-size: 1.4rem;
      font-weight: 600;
      letter-spacing: 0.2em;
      text-transform: uppercase;
    }
    &.ja {
      font-size: 2.9rem;
      line-height: 1.75;
      letter-spacing: 0.04em;
    }
  }
  &::before {
    content: "";
    display: block;
    aspect-ratio: 65/63;
    background-image: url(../img/common/title_deco_ribbon.svg);
    background-repeat: no-repeat;
    background-size: contain;
    position: absolute;
    top: 0;
    width: 6.5rem;
  }
  @media screen and (max-width: 480px) {
    padding-top: 5.8rem;
    span {
      &.en {
        font-size: 1.2rem;
      }
      &.ja {
        font-size: 2.1rem;
      }
    }
    &::before {
      width: 4.8rem;
    }
  }
  /* リボン小 */
  &.size-s {
    padding-top: 5rem;
    span {
      &.ja {
        font-size: 2.5rem;
      }
    }
    &::before {
      width: 4.8rem;
    }
    @media screen and (max-width: 480px) {
      padding-top: 3.6rem;
      span {
        &.ja {
          font-size: 1.8rem;
        }
      }
      &::before {
        width: 3.2rem;
      }
    }
  }
  /* ボーダー */
  &.border {
    border-bottom: 1px solid #545454;
    padding-bottom: 1.6rem;
    @media screen and (max-width: 480px) {
      padding-bottom: 0.8rem;
    }
  }

  /* 文字センター */
  &.center {
    text-align: center;
    span {
      &.en {
        padding-left: 0.2em;
        margin-bottom: 0.6rem;
        margin: auto;
      }
      &.ja {
        padding-left: 0.04em;
      }
    }
    &::before {
      left: 50%;
      transform: translateX(-50%);
    }
  }
  /* 文字左*/
  &.left {
    span {
      &.en {
        margin-bottom: 1.6rem;
        @media screen and (max-width: 480px) {
          margin-bottom: 1rem;
        }
      }
    }
  }
}
/*--------------------*/
/* 下部ボーダー */
.title-border {
  border-bottom: 1px solid #545454;
  line-height: 1.75;
  padding-bottom: 1.4rem;
  text-align: left;
  @media screen and (max-width: 480px) {
    padding-bottom: 1.2rem;
  }
  .ja {
    font-size: 2.9rem;
    letter-spacing: 0.04em;
    @media screen and (max-width: 480px) {
      font-size: 2.1rem;
    }
  }
  &.plus-en {
    .ja {
      margin-right: 0.75em;
    }
    .en {
      font-size: 1.4rem;
      letter-spacing: 0.22em;
      text-transform: uppercase;
      font-weight: 700;
      display: inline-block;
      vertical-align: -0.05em;
      @media screen and (max-width: 480px) {
        font-size: 1.2rem;
      }
    }
  }
  &.size-s {
    .ja {
      font-size: 2.3rem;
      @media screen and (max-width: 480px) {
        font-size: 1.8rem;
      }
    }
  }
}
/*--------------------*/
/* スパイラル */
.title-spiral {
  position: relative;
  width: 23rem;
  padding-top: 12.9rem;
  background-image: url(../img/common/title_deco_spiral.svg);
  background-repeat: no-repeat;
  background-position: top right;
  background-size: 96.1% auto;
  @media screen and (max-width: 480px) {
    width: 20rem;
    padding-top: 11.22rem;
  }
  span {
    display: block;
    &.en {
      font-size: 1.4rem;
      text-align: center;
      font-weight: 700;
      letter-spacing: 0.2em;
      @media screen and (max-width: 480px) {
        font-size: 1.2rem;
      }
    }
    &.ja {
      font-size: 3.2rem;
      line-height: 1.5;
      margin-top: 0.28em;
      text-align: center;
      font-weight: 700;
      letter-spacing: 0.02em;
      @media screen and (max-width: 480px) {
        font-size: 2.4rem;
      }
    }

    &.deco-img {
      position: absolute;

      top: 0;
      &.child-16 {
        width: 79.13%;
        right: 0;
        transform: translate(-11%, 1.6%);
      }
      &.footer_children-02 {
        width: 23%;
        right: 17.4%;
        transform: translate(0, -31.6%);
      }
      &.footer_children-04 {
        width: 17.8%;
        right: 43.5%;
        transform: translate(0, 19%);
      }
    }
  }
}

/*--------------------*/
/* アコーディオン*/
.aco_wrap {
  .aco_title {
    cursor: pointer;
    &.icon-plus {
      position: relative;
      &::before,
      &::after {
        content: "";
        display: block;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        transition: all 0.2s ease-in-out;
      }
      &::before {
        width: 5.5rem;
        aspect-ratio: 1/1;
        background-color: var(--color-deep-blue);
        border-radius: 2.1rem;
        right: 3.1rem;

        z-index: 5;
      }
      &::after {
        width: 2.5rem;
        aspect-ratio: 1/1;
        background-image: url(../img/common/icon-plus.svg);
        background-repeat: no-repeat;
        background-size: contain;
        right: 4.6rem;
        z-index: 10;
      }
      &.open {
        &::after {
          transform: translateY(-50%) rotate(-45deg);
        }
      }
      @media screen and (max-width: 480px) {
        &::before {
          width: 3.6rem;
          border-radius: 1.2rem;
          right: 1rem;
        }
        &::after {
          width: 2rem;
          right: 1.8rem;
        }
      }
      &:hover {
        opacity: 0.8;
      }
    }
  }
  .dropdown {
    display: grid;
    grid-template-rows: 0fr;
    transition: all 0.4s ease-in-out;
    & > .inner {
      overflow: hidden;
      opacity: 0;
      transition: all 0.6s ease-in-out;
    }
    &.open {
      grid-template-rows: 1fr;
      & > .inner {
        overflow: hidden;
        opacity: 1;
      }
    }
  }
}
/*--------------------*/
/* リードコピー*/
.leadcopy {
  max-width: 44rem;
  margin: 0 auto 15rem;
  @media screen and (max-width: 480px) {
    margin: 0 auto 6rem;
  }
  h2 {
    margin-bottom: 3.2rem;
    @media screen and (max-width: 480px) {
      margin-bottom: 2rem;
    }
  }
  p {
    font-size: 1.6rem;
    line-height: 2.25;
    font-weight: 700;
    @media screen and (max-width: 480px) {
      font-size: 1.4rem;
    }
  }
  &.wide {
    max-width: 53.2rem;
    margin-bottom: 6.4rem;
    @media screen and (max-width: 480px) {
      margin-bottom: 6rem;
    }
  }
}
.spilal_leadcopy_wrap {
  min-width: 44rem;
  max-width: 64rem;
  margin: auto;
  padding-top: 4rem;
  position: relative;
  @media screen and (max-width: 1024px) {
    width: 80%;
    max-width: 48rem;
    min-width: auto;
    padding-top: 2rem;
  }
  .title-spiral {
    position: absolute;
    top: 0;
    left: 0;
    transform: translate(-76.1%, 0);
    @media screen and (max-width: 1024px) {
      position: static;
      margin: auto auto 4rem;
      transform: translate(0, 0);
    }
  }
  p {
    font-size: 1.6rem;
    line-height: 2.4375;
    font-weight: 700;
    letter-spacing: 0.04em;
    position: relative;

    @media screen and (max-width: 480px) {
      font-size: 1.4rem;
    }

    &:first-of-type {
      max-width: 44rem;
      margin-right: 0;
      margin-left: auto;
      margin-bottom: 12.4rem;
    }

    &:nth-of-type(2) {
      max-width: 44rem;
      margin-left: 2rem;
    }
    @media screen and (max-width: 1024px) {
      &:first-of-type {
        max-width: 100%;
        margin-right: auto;
        margin-left: auto;
        margin-bottom: 4rem;
      }

      &:nth-of-type(2) {
        max-width: 100%;
        margin-left: auto;
      }
    }
  }
}
/*--------------------*/
/* FAQリスト*/
.faq_list {
  color: #000;
  font-size: 1.6rem;
  line-height: 1.75;
  @media screen and (max-width: 480px) {
    font-size: 1.4rem;
  }
  .faq_item_wrap {
    .faq_item {
      .question {
        position: relative;
        border-radius: 1em;
        font-weight: bold;
        background-color: #fff;
        padding: 4.2rem 7rem 4.2rem 10rem;
        &:hover {
          opacity: 0.8;
        }
        &::before {
          content: "Q";
          display: flex;
          aspect-ratio: 1/1;
          width: 3em;
          background-color: #001738;
          border-radius: 100%;
          align-items: center;
          justify-content: center;
          color: #fff;
          flex-shrink: 0;
          position: absolute;
          top: 3.2rem;
          left: 3.2rem;
        }
        &::after {
          content: "";
          display: block;
          position: absolute;
          width: 0.7rem;
          aspect-ratio: 1/1;
          border-top: 2px solid var(--color-deep-blue);
          border-right: 2px solid var(--color-deep-blue);
          transform: rotate(135deg);
          top: 48%;
          right: 3.8rem;
          transition: all 0.2s ease-in-out;
        }
        &.open {
          &::after {
            transform: rotate(-45deg);
          }
        }
        @media screen and (max-width: 480px) {
          padding: 2rem 5rem 2rem 6rem;
          &::before {
            width: 2.4em;
            top: 1.4rem;
            left: 1.4rem;
          }
          &::after {
            content: "";
            right: 2rem;
          }
        }
      }
      .answer {
        margin: 0 3rem;
        @media screen and (max-width: 480px) {
          margin: 0 1rem;
        }
        border-bottom: 1px solid #cfcfcf;
        & > .inner {
          padding: 0 0 0 7rem;
          position: relative;
          &::before {
            content: "A";
            display: block;
            position: absolute;
            font-weight: 700;
            left: 2rem;
          }
          @media screen and (max-width: 480px) {
            padding: 0 0 0 5rem;
            &::before {
              left: 1.7rem;
            }
          }
        }

        &.open {
          & > .inner {
            padding: 2rem 0 3.4rem 7rem;
            @media screen and (max-width: 480px) {
              padding: 1.4rem 0 2rem 5rem;
            }
          }
        }
      }
    }
  }
  &.green {
    .faq_item_wrap {
      .faq_item {
        margin-bottom: 1rem;
        .question {
          color: var(--color-deep-green);
          &::before {
            background-color: var(--color-deep-green);
          }
          &::after {
            border-color: var(--color-deep-green);
          }
        }
        .answer {
          border-bottom: none;
          color: #fff;
          & > .inner {
            &::before {
              color: #fff;
            }
          }
          &.open {
            & > .inner {
              padding: 2rem 0 2rem 7rem;
              @media screen and (max-width: 480px) {
                padding: 1.4rem 0 1.4rem 5rem;
              }
            }
          }
        }
      }
    }
  }
}
/*--------------------*/
/* 公表書類*/
.public_documents_wrap {
  max-width: 114rem;
  margin: 20rem auto 0;
  @media screen and (max-width: 480px) {
    margin-top: 6rem;
  }
  ul.public_documents_list {
    margin-top: 2rem;
    @media screen and (max-width: 480px) {
      margin-top: 1.4rem;
    }
    li {
      border-bottom: 1px solid #d0d0d0;
      a {
        display: block;
        padding: 1.6rem 6.4rem;
        color: var(--color-bace);
        font-size: 1.6rem;
        line-height: 1.75;
        text-decoration: underline;
        font-weight: 700;
        letter-spacing: 0.04em;
        @media screen and (max-width: 480px) {
          font-size: 1.4rem;
          padding: 1.2rem 0;
        }
      }
    }
  }
}

/*--------------------*/
/* 上下波形背景*/
.wave_wrap {
  position: relative;
  z-index: 10;
  &::before,
  &::after {
    content: "";
    display: block;
    position: absolute;
    width: 100%;
    height: 6.4rem;
    background-repeat: repeat-x;
    background-size: auto 100%;
    left: 0;
  }
  &::before {
    top: 0;
    transform: translateY(-98%);
    background-position: center top;
  }
  &::after {
    bottom: 0;
    transform: translateY(98%);
    background-position: center bottom;
  }
  &.del-before {
    &::before {
      display: none;
    }
  }
  &.del-after {
    &::after {
      display: none;
    }
  }
  @media screen and (max-width: 480px) {
    &::before,
    &::after {
      height: 6rem;
    }
  }
  /* 茶 */
  &.blown {
    background-color: #e9e0c7;
    &::before {
      background-image: url(../img/common/wave_top-blown.svg);
    }
    &::after {
      background-image: url(../img/common/wave_bottom-blown.svg);
    }
  }
  /* 薄黄色 */
  &.light-yellow {
    background-color: var(--color-light-yellow);
    &::before {
      background-image: url(../img/common/wave_top-light-yellow.svg);
    }
    &::after {
      background-image: url(../img/common/wave_bottom-light-yellow.svg);
      background-position: right -40rem top 0;
    }
  }
  /* 超薄黄色 */
  &.ex-light-yellow {
    background-color: var(--color-light-yellow);
    &::before {
      background-image: url(../img/common/wave_top-ex-light-yellow.svg);
    }
  }
  /* 青 */
  &.blue {
    background-color: var(--color-light-blue);
    &::before {
      background-image: url(../img/common/wave_top-light-blue.svg);
    }
  }
  /* 緑 */
  &.green {
    background-color: var(--color-light-green);
    &::before {
      background-image: url(../img/common/wave_top-light-green.svg);
    }
  }
  /* 白 */
  &.white {
    &::before {
      background-image: url(../img/common/wave_top-light-white.svg);
    }
  }
  @media screen and (max-width: 480px) {
    /* 茶 */
    &.blown {
      &::before {
        background-position: right -45.6rem top 0;
      }
      &::after {
        background-position: right -40rem bottom 0;
      }
    }
    /* 青 */
    &.blue {
      &::before {
        height: 3.3rem;
        background-position: right -17.4rem top 0;
      }
    }
    /* 緑 */
    &.green {
      &::before {
        background-position: right -45.6rem top 0;
      }
    }
  }
  /* 白 */
  &.white {
    &::before {
      background-position: left -64.6rem top 0;
    }
  }
}
/*--------------------*/
/* 写真付き記事リスト*/
.img_text_list_wrap {
  .img_text-item {
    display: flex;
    gap: min(6.6%, 7.5rem);
    margin-bottom: min(22vw, 22rem);
    align-items: flex-start;
    position: relative;
    @media screen and (max-width: 1024px) {
      margin-bottom: min(10.7vw, 12.2rem);
    }
    @media screen and (max-width: 480px) {
      display: block;
    }
    &:last-of-type {
      margin-bottom: 0;
    }
    &.reverse {
      flex-direction: row-reverse;
    }
    &.flex-end {
      justify-content: flex-end;
    }
    .img_wrap {
      max-width: 76.5rem;
      border-radius: 1.8rem;
      border: 1px solid #fff;
      overflow: hidden;
      @media screen and (max-width: 480px) {
        border-radius: 1.2rem;
        margin-bottom: 2.4rem;
      }
    }
    .text_wrap {
      width: 30rem;
      flex-shrink: 0;
      letter-spacing: 0.04em;
      @media screen and (max-width: 480px) {
        width: 100%;
      }
      h4 {
        text-align: left;
        font-size: 2.2rem;
        line-height: 1.68;
        margin-top: 2.7rem;
        font-weight: 500;
        @media screen and (max-width: 480px) {
          font-size: 1.8rem;
          margin-top: 2rem;
        }
      }
      p {
        margin-top: 4rem;
        font-size: 1.5rem;
        font-weight: 500;
        line-height: 1.93;
        @media screen and (max-width: 480px) {
          font-size: 1.4rem;
          margin-top: 2rem;
        }
      }
    }
    &.size-s {
      margin-bottom: min(10.7vw, 12.2rem);
      .img_wrap {
        max-width: 48rem;
      }
    }
  }
}

/*--------------------*/
/* ドットの囲み */
.dotte_wrap {
  background-color: #fff;
  max-width: 91.6rem;
  margin: auto;
  border-radius: 2.8rem;
  padding: 1.8rem;
  @media screen and (max-width: 480px) {
    padding: 1rem;
  }
  .dotte {
    border: 1px dashed var(--color-blown);
    border-radius: 2.8rem;
  }
}

/*〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓*/
/*フッター上の先生・施設紹介へのリンク*/
/*〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓*/
.introduction_wrap {
  padding: 0 2rem 9rem;
  margin-top: 13.5rem;
  @media screen and (max-width: 768px) {
    padding: 0 2rem 6rem;
    margin-top: 10rem;
  }
  @media screen and (max-width: 480px) {
    padding: 0 2rem 2rem;
  }
  ul {
    max-width: 114rem;
    margin: auto;
    display: flex;
    justify-content: space-between;
    @media screen and (max-width: 480px) {
      flex-direction: column;
      gap: 4.6rem;
    }
    li {
      max-width: 51.2rem;
      width: 48%;
      @media screen and (max-width: 480px) {
        width: 100%;
      }
      a {
        display: flex;
        height: 100%;
        gap: 4%;
        @media screen and (max-width: 480px) {
          flex-direction: column-reverse;
        }
        h3 {
          writing-mode: vertical-rl;
          @media screen and (max-width: 480px) {
            writing-mode: horizontal-tb;
            margin-bottom: 2.5rem;
          }
          .ja {
            font-size: 3.4rem;
            @media screen and (max-width: 768px) {
              font-size: 1.8rem;
            }
            @media screen and (max-width: 480px) {
              font-size: 3.4rem;
            }
          }
          .en {
            font-size: 1.4rem;
            margin-left: 0.5em;
            text-transform: uppercase;
            @media screen and (max-width: 768px) {
              font-size: 1rem;
            }
            @media screen and (max-width: 480px) {
              font-size: 1.4rem;
              margin: 0 0 1.4rem;
            }
          }
        }
        .img_box {
          position: relative;
          .img_wrap {
            border: 0.8rem solid #fff;
            border-radius: 6rem;
            overflow: hidden;
            box-sizing: border-box;
            height: 100%;
            z-index: 10;
            @media screen and (max-width: 768px) {
              border-width: 0.4rem;
              border-radius: 2rem;
            }
            @media screen and (max-width: 480px) {
              aspect-ratio: 350/248;
              border-radius: 6rem;
              border: 0.8rem solid #fff;
            }
          }
          .badge {
            position: absolute;
            display: flex;
            align-items: center;
            justify-content: center;
            z-index: 20;
            box-sizing: border-box;
            width: 11.4rem;
            aspect-ratio: 1/1;
            border-radius: 9999px;
            background-color: #fff;
            border: 0.2rem dotted var(--color-yellow);
            bottom: 0;
            right: -0.5rem;
            transform: translate(0, 50%);
            box-shadow: 0 0 0 3px #fff;
            @media screen and (max-width: 768px) {
              aspect-ratio: 3/1;
              transform: translate(0, 50%);
            }
            @media screen and (max-width: 480px) {
              display: none;
            }
            span {
              font-size: 1.7rem;
              padding-left: 2.2rem;
              font-weight: 700;
              color: var(--color-blown);
              letter-spacing: 0.05em;
              @media screen and (max-width: 768px) {
                font-size: 1.2rem;
                padding-left: 1.8rem;
              }
            }
          }
        }
        &:hover {
          .badge {
            background-color: var(--color-yellow);
            span {
              color: #fff;
            }
          }
        }
      }
    }
  }
}

/*〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓*/
/* 各ページヘッダ */
/*〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓*/
.content_wrap {
  .page_header {
    height: 65.3rem;
    background-image: url(../img/common/page_header_img_bg.webp);
    background-repeat: no-repeat;
    background-size: 144rem auto;
    background-position: left top;
    display: flex;
    position: relative;
    @media screen and (max-width: 1024px) {
      height: 48rem;
      background-size: auto 100%;
      background-position: left -2rem top;
    }
    @media screen and (max-width: 480px) {
      flex-direction: column-reverse;
      gap: 1.4rem;
      padding: 2rem;
      height: auto;
      background-size: cover;
      background-position: left -3rem top;
    }
    /*--------------------*/
    /* 子ども画像 */
    .img_child {
      position: absolute;
      z-index: 30;
    }
    /* 子ども画像 各ページ */
    &.header-other {
      .img_child {
        &.child-01 {
          width: 8.1rem;
          left: 10rem;
          top: 14.7rem;
          &.life {
            top: 11rem;
          }
          @media screen and (max-width: 1200px) {
            left: 3rem;
          }
          @media screen and (max-width: 1024px) {
            left: auto;
            right: 3rem;
            top: 0;
            &.life {
              top: 0;
            }
          }
          @media screen and (max-width: 480px) {
            left: 1rem;
            right: auto;
            top: 7rem;
            width: 6rem;
            &.life {
              top: 7rem;
            }
          }
        }
        &.child-02 {
          width: 9.6rem;
          left: 34.3rem;
          bottom: 2.1rem;
          @media screen and (max-width: 1200px) {
            left: 24.3rem;
          }
          @media screen and (max-width: 1024px) {
            width: 7.2rem;
            left: 11rem;
            bottom: 1rem;
          }
          @media screen and (max-width: 480px) {
            width: 5.2rem;
            left: auto;
            right: 1rem;
            bottom: 4rem;
          }
        }
        &.child-04 {
          width: 10.3rem;
          left: 9.2rem;
          top: 10.8rem;
          @media screen and (max-width: 1200px) {
            left: 2rem;
          }
          @media screen and (max-width: 1024px) {
            left: 11rem;
            top: 4rem;
          }
          @media screen and (max-width: 480px) {
            width: 7rem;
            left: 0rem;
            top: 2rem;
          }
        }
        &.child-07 {
          width: 19.4rem;
          left: 27.4rem;
          bottom: 1.4rem;
          @media screen and (max-width: 1200px) {
            left: 18rem;
          }
          @media screen and (max-width: 1024px) {
            width: 16rem;
            left: 2rem;
            bottom: 1rem;
          }
          @media screen and (max-width: 480px) {
            width: 12rem;
            left: auto;
            right: 0;
            bottom: 9rem;
          }
        }
        &.child-03 {
          width: 13.4rem;
          left: 5.8rem;
          top: 8.7rem;
          @media screen and (max-width: 1200px) {
            left: 2rem;
          }
          @media screen and (max-width: 1024px) {
            left: auto;
            right: 10rem;
            top: 0;
          }
          @media screen and (max-width: 480px) {
            width: 8rem;
            left: auto;
            right: 7rem;
            top: 0;
          }
        }
        &.child-08 {
          width: 12rem;
          left: 33.2rem;
          bottom: 1.1rem;
          @media screen and (max-width: 1200px) {
            left: 18rem;
          }
          @media screen and (max-width: 1024px) {
            left: 10rem;
            bottom: 1rem;
          }
          @media screen and (max-width: 480px) {
            width: 8rem;
            left: 2rem;
            bottom: 6rem;
          }
        }
      }
    }
    /*--------------------*/
    /* タイトル文字 */
    .title_wrap {
      width: 39rem;
      flex-shrink: 0;
      position: relative;
      @media screen and (max-width: 1200px) {
        width: 29rem;
      }
      @media screen and (max-width: 1024px) {
        width: 14rem;
      }
      @media screen and (max-width: 480px) {
        width: 100%;
      }
      h1 {
        position: absolute;
        writing-mode: vertical-rl;
        right: 12rem;
        top: 22.3rem;
        @media screen and (max-width: 1200px) {
          right: 9rem;
        }
        @media screen and (max-width: 1024px) {
          top: 4rem;
          right: 3rem;
        }
        @media screen and (max-width: 480px) {
          position: static;
          writing-mode: horizontal-tb;
          text-align: center;
        }
        .ja {
          font-size: 4.2rem;
          margin-left: 1.6rem;
          @media screen and (max-width: 1024px) {
            font-size: 3.2rem;
            margin-left: 1.2rem;
          }
          @media screen and (max-width: 480px) {
            font-size: 2.4rem;
            margin: 0 0 1rem;
          }
        }
        .en {
          font-size: 1.4rem;
          margin: 0.5rem 0.5rem 0 0;
          text-transform: uppercase;
          @media screen and (max-width: 480px) {
            margin: 0.8rem 0 0;
            display: inline-block;
            margin: 0 0.125em;
          }
        }
      }
    }
    /*--------------------*/
    /* タイトル画像 */
    .img_wrap {
      width: calc(100% - 39rem);
      box-sizing: border-box;
      position: relative;
      overflow: hidden;
      @media screen and (max-width: 1200px) {
        width: calc(100% - 29rem);
      }
      @media screen and (max-width: 1024px) {
        width: calc(100% - 14rem);
      }
      @media screen and (max-width: 480px) {
        width: 100%;
      }
      .page_header_img {
        position: absolute;
        z-index: 10;
        box-sizing: border-box;
        left: 0;
        bottom: 0;
        width: 100%;
        height: 56.4rem;
        border-left: 0.8rem solid #fff;
        border-top: 0.8rem solid #fff;
        border-radius: 10rem 0 0 0;
        overflow: hidden;
        @media screen and (max-width: 1024px) {
          height: 44rem;
        }
        @media screen and (max-width: 480px) {
          position: static;
          border-radius: 4rem;
          height: 20rem;
          border: 0.4rem solid #fff;
        }
      }
      .pege_header_title-en {
        position: absolute;
        z-index: 20;
        font-size: 14rem;
        color: #fff;
        font-weight: 900;
        letter-spacing: 0.02em;
        left: 6rem;
        bottom: -0.15em;
        overflow: hidden;
        &.about {
          left: auto;
          right: -0.2em;
          bottom: 0.1em;
          writing-mode: vertical-rl;
        }
        @media screen and (max-width: 1024px) {
          font-size: 10rem;
        }
        @media screen and (max-width: 480px) {
          left: 0rem;
          font-size: 5rem;
          width: 100%;
          text-align: center;
          bottom: auto;
          top: -0.15em;
        }
      }
    }
  }
}
/*--------------------*/
/* テキスト色切り替え*/
.color_title_wrap {
  .color_text {
    letter-spacing: 0.2em;
    font-weight: 700;
  }
  /* 色指定 */
  /* 茶色 */
  &.blown {
    .color_title {
      color: var(--color-blown);
    }
    .color_text {
      span {
        color: var(--color-blown);
        &:nth-child(2n) {
          color: var(--color-light-blown);
        }
      }
    }
  }
  /* 青 */
  &.blue {
    .color_title {
      color: var(--color-fluorescent-blue);
    }
    .color_text {
      span {
        color: var(--color-deep-blue);
        &:nth-child(2n) {
          color: var(--color-fluorescent-blue);
        }
      }
    }
  }
  /* 緑 */
  &.green {
    .color_title {
      color: #18c35f;
    }
    .color_text {
      span {
        color: #18c35f;
        &:nth-child(2n) {
          color: var(--color-fluorescent-green);
        }
      }
    }
  }
}
/*〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓
other
〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓*/

.content_wrap {
  /*--------------------*/
  /* プライバシーポリシー */
  &.policy {
    .common_wrap {
      p,
      ul {
        font-size: 1.6rem;
        line-height: 2.25;
        font-weight: bold;
        padding-left: 2.1875em;
        @media screen and (max-width: 480px) {
          font-size: 1.4rem;
          padding: 0;
        }
      }
    }
  }
  /*--------------------*/
  /* よくある質問 */
  &.faq {
    /* ページジャンプ */
    .page_jump_wrap {
      display: flex;
      flex-wrap: wrap;
      max-width: 114rem;
      box-sizing: border-box;
      margin: 3rem auto;
      background-color: #fff;
      border-radius: 0.8rem;
      font-size: 1.6rem;
      font-weight: bold;
      @media screen and (max-width: 480px) {
        border-radius: 0.4rem;
        font-size: 1.4rem;
        margin: 2rem auto;
      }
      li {
        width: 25%;
        @media screen and (max-width: 480px) {
          width: 50%;
        }
        a {
          display: block;
          padding: 2.4rem 0;
          text-align: center;
          color: #000;
          position: relative;
          @media screen and (max-width: 480px) {
            padding: 1.6rem 0;
          }
          &:hover {
            background-color: #f1f1f1;
          }
          &::after {
            content: "";
            display: block;
            width: 1px;
            height: 1.5em;
            background-color: #000;
            position: absolute;
            right: 0;
            top: 50%;
            transform: translateY(-50%);
          }
        }
        &:last-of-type {
          a {
            &::after {
              display: none;
            }
          }
        }
        @media screen and (max-width: 480px) {
          &:nth-child(-n + 2) {
            a {
              &::before {
                content: "";
                display: block;
                width: 80%;
                height: 1px;
                background-color: #000;
                position: absolute;
                bottom: 0;
                left: 50%;
                transform: translateX(-50%);
              }
            }
          }
          &:nth-child(2n) {
            a {
              &::after {
                display: none;
              }
            }
          }
        }
      }
    }
    /* FAQリスト */
    .faq_list {
      .faq_item_wrap {
        .faq_item {
          .question {
            padding: 4.2rem 0rem 4.2rem 6.8rem;
            &::before {
              left: 0;
            }
            &::after {
              right: 1.6rem;
            }

            @media screen and (max-width: 480px) {
              padding: 2rem 1.4rem 2rem 5rem;
              &::after {
                right: 0.6rem;
              }
            }
          }
          .answer {
            margin: 0;
            & > .inner {
              padding: 0 3rem 0 7rem;
              @media screen and (max-width: 480px) {
                padding: 0 0 0 5rem;
              }
            }
            &.open {
              & > .inner {
                padding: 2rem 3rem 3.4rem 7rem;
                @media screen and (max-width: 480px) {
                  padding: 1.4rem 0 2rem 5rem;
                }
              }
            }
          }
        }
      }
    }
  }
  /*--------------------*/
  /* 交通アクセス */
  &.access {
    .main_inner {
      padding-top: 6rem;
      .map_wrap {
        margin-bottom: 7.2rem;
        @media screen and (max-width: 480px) {
          margin-bottom: 4rem;
        }
        iframe {
          width: 100%;
          height: 53rem;
          @media screen and (max-width: 480px) {
            aspect-ratio: 1/1;
            height: auto;
          }
        }
        address {
          font-size: 1.6rem;
          line-height: 1.7;
          font-weight: 500;
          margin-top: 1.5em;
        }
      }
      .access_note_wrap {
        display: flex;
        justify-content: space-between;
        @media screen and (max-width: 768px) {
          flex-direction: column;
          gap: 4rem;
        }

        .note_item {
          width: 47%;
          max-width: 52.5rem;
          @media screen and (max-width: 768px) {
            width: 100%;
            max-width: 100%;
          }
          h3 {
            margin-bottom: 2.6rem;
            @media screen and (max-width: 480px) {
              margin-bottom: 1.6rem;
            }
          }
          p {
            font-size: 1.5rem;
            line-height: 2;
            font-weight: 500;
            letter-spacing: 0.04em;
            @media screen and (max-width: 480px) {
              font-size: 1.4rem;
              line-height: 1.75;
            }
          }
        }
      }
    }
  }
  /*--------------------*/
  /* 園だより */
  &.infomation {
    /*--------------------*/
    /* タクソノミー */
    span.entry_icon {
      line-height: 2.4rem;
      font-size: 1.4rem;
      font-weight: 700;
      flex-shrink: 0;
      letter-spacing: 0.05em;
      border-radius: 0.2em;
      margin-top: 0.5rem;
      @media screen and (max-width: 480px) {
        font-size: 1.2rem;
        line-height: 2rem;
        margin-top: 0;
      }
      &.tax {
        display: inline-block;
        width: 6em;
        text-align: center;
        color: #fff;
        /* タクソノミー別の色 */
        &.sonota {
          background-color: #e39c2a;
        }
        &.gyoji {
          background-color: #dc7759;
        }
      }
      /* 日付 */
      &.date {
        font-size: 1.4rem;
        line-height: 2.4rem;
        font-weight: 700;
        width: 8.7em;
        color: #666;
      }
    }
    /* 記事一覧 */
    .entry_list-info {
      position: relative;
      z-index: 10;
      max-width: 114rem;
      padding: 0 2rem;
      margin: auto;
      li {
        a {
          display: flex;
          align-items: flex-start;
          gap: 3.8rem;
          padding: 3rem 0;
          @media screen and (max-width: 480px) {
            display: block;
            padding: 1.6rem 0;
          }
          span.entry_icon {
            &.tax {
              @media screen and (max-width: 480px) {
                margin-right: 1em;
              }
            }
          }
          .title {
            font-size: 1.8rem;
            line-height: 1.75;
            color: #3a4851;
            letter-spacing: 0.05em;
            @media screen and (max-width: 480px) {
              margin-top: 0.25em;
              font-size: 1.6rem;
            }
          }
        }
      }
    }
    /*--------------------*/
    /* シングルページ */
    /* エントリー部分 */
    .entry_content_wrap {
      position: relative;
      z-index: 10;
      max-width: 68rem;
      padding: 0 2rem;
      margin: 2rem auto 10rem;
      @media screen and (max-width: 480px) {
        margin-bottom: 8rem;
      }
      .entry_title_wrap {
        margin-bottom: 13.8rem;
        @media screen and (max-width: 480px) {
          margin-bottom: 6rem;
        }
        .entry_title {
          font-size: 2.8rem;
          line-height: 1.5;
          margin-bottom: 2.4rem;
          letter-spacing: 0.08em;
          @media screen and (max-width: 480px) {
            font-size: 1.8rem;
            margin-bottom: 1.6rem;
          }
        }
        .entry_icon.tax {
          margin-right: 3rem;
          @media screen and (max-width: 480px) {
            margin-right: 1.6rem;
          }
        }
      }
      .entry_content {
        font-size: 1.8rem;
        font-weight: 500;
        line-height: 1.75;
        letter-spacing: 0.05em;
        @media screen and (max-width: 480px) {
          font-size: 1.4rem;
        }
        h2,
        h3,
        h4,
        h5,
        h6,
        p {
          margin: 3.4em 0;
          @media screen and (max-width: 480px) {
            margin: 3em 0;
          }
        }
      }
    }

    /* 記事一覧 */
    .entry_list_wrap {
      background-color: #ebe093;
      padding: 9.6rem 0 6.8rem;
      @media screen and (max-width: 480px) {
        padding: 3rem 0 5rem;
      }
      .entry_list-info {
        max-width: 80rem;
      }
      .button_wrap {
        margin-top: 6rem;
        @media screen and (max-width: 480px) {
          margin-top: 3rem;
        }
        a.button-back {
          display: block;
          background-color: var(--color-deep-green);
          width: 16.8rem;
          border-radius: 0.3em;
          font-size: 1.8rem;
          color: #fff;
          font-weight: 700;
          text-align: center;
          padding: 0.78em;
          margin: auto;
          @media screen and (max-width: 480px) {
            font-size: 1.6rem;
            width: 14rem;
          }
        }
      }
    }
  }
  /*--------------------*/
  /* お問い合わせ */
  &.contact {
    /* フォーム */
    .contactform_wrap {
      max-width: 73.8rem;
      margin-left: 23%;
      @media screen and (max-width: 1024px) {
        margin: auto;
      }
      .contactform {
        /* アイコン */
        .form_icon {
          display: inline-block;
          font-size: 1.3rem;
          font-weight: 600;
          box-sizing: border-box;
          padding: 0.6rem 0;
          width: 4em;
          text-align: center;
          border: 1px solid #000;
          border-radius: 0.46em;
          margin-right: 0.7em;
          @media screen and (max-width: 480px) {
            font-size: 1.2rem;
            padding: 0.5rem 0;
          }
          &.shissu {
            color: #dc3545;
            border-color: #dc3545;
          }
          &.nini {
            color: #5cc0bd;
            border-color: #5cc0bd;
          }
        }
        /* フォームの項目 */
        .koumoku_wrap {
          display: flex;
          justify-content: space-between;
          margin-bottom: 2rem;
          @media screen and (max-width: 480px) {
            flex-direction: column;
            gap: 1rem;
          }
          .koumoku {
            display: flex;
            align-items: flex-start;
            padding-top: 0.4rem;
            @media screen and (max-width: 480px) {
              padding: 0;
            }

            .title {
              font-size: 1.5rem;
              font-weight: 700;
              line-height: 2.7rem;
              color: #001738;
              @media screen and (max-width: 480px) {
                font-size: 1.4rem;
                line-height: 2.5rem;
              }
            }
          }
        }
        /* フォーム部分 */
        .form_item {
          width: 42.3rem;
          @media screen and (max-width: 480px) {
            width: 100%;
          }
          /* フォームパーツ */
          input,
          textarea,
          select {
            width: 100%;
            font-size: 1.6rem;
            line-height: 1.5;
            border: 1px solid #5a5a5a;
            border-radius: 0.375em;
            padding: 0.8125em 1em;
            box-sizing: border-box;
            background-color: #fff;
            @media screen and (max-width: 480px) {
              font-size: 1.4rem;
            }
          }
          input::placeholder,
          select {
            color: #adb5bd;
          }
          textarea {
            height: 21em;
          }
          select {
            background-image: url(../img/common/form_bg-select.svg);
            background-repeat: no-repeat;
            background-position: right 1em center;
            background-size: 1em auto;
          }
        }
        /* 確認 */
        .confirmation_wrap {
          color: #565656;
          width: 59rem;
          margin: 6rem auto;
          @media screen and (max-width: 480px) {
            width: 100%;
            margin: 3rem auto;
          }
          p {
            font-size: 1.6rem;
            line-height: 1.5;
            margin-top: 0.5rem;
            padding-left: 11rem;
            @media screen and (max-width: 480px) {
              margin-top: 1.6rem;
              padding: 0;
              font-size: 1.4rem;
            }
            a {
              text-decoration: underline;
            }
          }
          .confirmation {
            display: flex;
            align-items: center;
            label.checkbox_label {
              cursor: pointer;
              position: relative;
              display: inline-block;
              font-size: 1.6rem;
              line-height: 1.5;
              padding-left: 5rem;

              @media screen and (max-width: 480px) {
                font-size: 1.4rem;
                padding-left: 4rem;
              }
              input[type="checkbox"] {
                width: 0;
                height: 0;
                position: absolute;
                left: 0;
                top: 50%;
              }
              &::before {
                content: "";
                display: block;
                position: absolute;
                border: 1px solid #1b1b1b;
                border-radius: 0.8rem;
                width: 3.2rem;
                aspect-ratio: 1/1;
                left: 0;
                top: 50%;
                transform: translateY(-50%);
                background-color: #fff;
              }
              &:has(input:checked) {
                &::before {
                  background-color: var(--color-light-blue);
                  border-color: var(--color-blue);
                }
                &::after {
                  content: "";
                  display: block;
                  position: absolute;
                  border-bottom: 0.5rem solid var(--color-blue);
                  border-left: 0.5rem solid var(--color-blue);
                  width: 1.6rem;
                  aspect-ratio: 3/2;
                  left: 0;
                  top: 50%;
                  transform: translate(30%, -75%) rotate(-45deg);
                }
              }
              @media screen and (max-width: 480px) {
                &::before {
                  border-radius: 0.4rem;
                  width: 2.8rem;
                }
                &:checked {
                  &::after {
                    width: 1.4rem;
                  }
                }
              }
            }
          }
        }
      }
      /* 送信ボタン */
      .button_wrap {
        text-align: center;
        button.contactform_button {
          cursor: pointer;
          background-color: #0e63c4;
          color: #fff;
          background-image: url(../img/common/form_bg-submit.svg);
          background-repeat: no-repeat;
          background-position: center right 1.8rem;
          width: 30rem;
          height: 6rem;
          font-size: 1.6rem;
          border-radius: 9999px;
          letter-spacing: 0.05em;
          margin: 0 1rem;
        }
      }
    }
  }
  /*--------------------*/
  /* 採用情報 */
  &.recruit {
    /* 募集リスト */
    .recruit_list {
      margin-bottom: 10rem;
      @media screen and (max-width: 480px) {
        margin-bottom: 6rem;
      }
      .recruit_item_wrap {
        .recruit_item {
          border-bottom: 1px solid #d8d8d8;
          .bosyukomoku {
            position: relative;
            display: flex;
            padding: 3.8rem 12rem 4.2rem 0;
            align-items: center;
            @media screen and (max-width: 480px) {
              padding: 1rem 7rem 1rem 0;
              flex-wrap: wrap;
              gap: 1rem;
            }
            .syokusyu {
              font-size: 2.1rem;
              line-height: 1.5;
              letter-spacing: 0.05em;
              width: 16rem;
              margin-right: 2rem;
              @media screen and (max-width: 480px) {
                font-size: 1.6rem;
                width: auto;
                min-width: 6em;
              }
            }
            .tax_list {
              display: flex;
              gap: 1.3rem;
              margin-right: 6.8rem;
              @media screen and (max-width: 480px) {
                margin: 0;
              }
              .tax_item {
                min-width: 8.6rem;
                @media screen and (max-width: 480px) {
                  min-width: 6rem;
                }
                .tax_icon {
                  display: block;
                  background-color: #e39c2a;
                  font-size: 1.4rem;
                  letter-spacing: 0.06em;
                  padding-left: 0.06em;
                  text-align: center;
                  color: #fff;
                  line-height: 1.714;
                  border-radius: 0.2em;
                  @media screen and (max-width: 480px) {
                    font-size: 1.2rem;
                  }
                }
              }
            }
            .note {
              font-size: 1.5rem;
              line-height: 1.5;
              letter-spacing: 0.04em;
              font-weight: 500;
              @media screen and (max-width: 480px) {
                font-size: 1.2rem;
              }
            }
          }
          .gaiyo {
            padding-bottom: 0;
            .inner {
              padding-left: 18rem;
              font-size: 1.6rem;
              font-weight: 700;
              color: #000;
              line-height: 2.48;
              @media screen and (max-width: 480px) {
                padding: 0;
                font-size: 1.4rem;
                line-height: 1.75;
              }
            }
            &.open {
              padding-bottom: 3.5rem;
              @media screen and (max-width: 480px) {
                padding: 1.6rem 0;
              }
            }
          }
        }
      }
    }
    /* よくある質問 */
    .faq_list {
      margin-top: 3.8rem;
      @media screen and (max-width: 480px) {
        margin-top: 2.4rem;
      }
    }
    /* 応募の流れ */
    .flow_list {
      counter-reset: item;
      color: #333;
      margin-top: 7.2rem;
      margin-bottom: 13.2rem;
      @media screen and (max-width: 480px) {
        margin-top: 3.6rem;
        margin-bottom: 6rem;
      }
      .flow-item {
        counter-increment: item;
        position: relative;
        min-height: 6.8rem;
        padding-left: 9.4rem;
        margin-bottom: 6.2rem;
        @media screen and (max-width: 480px) {
          margin-bottom: 3.6rem;
          padding-left: 6.4rem;
          min-height: 4.8rem;
        }
        &::before {
          content: counter(item, decimal-leading-zero);
          display: flex;
          align-items: center;
          justify-content: center;
          position: absolute;
          box-sizing: border-box;
          left: 0;
          top: 0;
          font-size: 2.4rem;
          font-weight: 700;
          font-family: "Fredoka", sans-serif;
          letter-spacing: 0.13em;
          padding-left: 0.13em;
          width: 6.8rem;
          aspect-ratio: 1/1;
          background-color: var(--color-deep-blue);
          color: #fff;
          border-radius: 100%;
          z-index: 10;
        }
        &::after {
          content: "";
          display: block;
          position: absolute;
          width: 1px;
          height: calc(100% + 6.2rem);
          background-color: var(--color-deep-blue);
          top: 3.4rem;
          left: 3.4rem;
          z-index: 5;
        }
        &:last-of-type {
          margin-bottom: 0;
          &::after {
            display: none;
          }
        }
        @media screen and (max-width: 480px) {
          &::before {
            font-size: 1.8rem;
            width: 4.8rem;
          }
          &::after {
            height: calc(100% + 3.6rem);
            top: 2.4rem;
            left: 2.4rem;
          }
        }
        h3 {
          font-size: 2.1rem;
          line-height: 1.5;
          margin-bottom: 0.5rem;
          @media screen and (max-width: 480px) {
            font-size: 1.8rem;
          }
        }
        p {
          font-size: 1.6rem;
          line-height: 1.7;
          font-weight: 700;
          @media screen and (max-width: 480px) {
            font-size: 1.4rem;
          }
        }
      }
    }
  }
  /*--------------------*/
  /* 法人情報 */
  &.outline {
    .main_inner {
      padding-top: 2rem;
      table.gaiyou {
        width: 100%;
        margin-top: 5.8rem;
        font-size: 1.6rem;
        letter-spacing: 0.04em;
        line-height: 2.4375;
        position: relative;
        border-top: 1px solid #d0d0d0;
        @media screen and (max-width: 480px) {
          margin-top: 3rem;
          font-size: 1.4rem;
          line-height: 2;
        }
        tbody {
          position: relative;
          z-index: 1;
          tr {
            border-bottom: 1px solid #d0d0d0;
            th,
            td {
              text-align: left;
              padding: 2.6rem 3.5rem;
              vertical-align: top;
              @media screen and (max-width: 480px) {
                padding: 1rem 1rem;
              }
            }
            th {
              width: 21.2rem;
              box-sizing: border-box;
              background-color: #edf7f5;
              word-break: keep-all;
              @media screen and (max-width: 480px) {
                width: 9.4rem;
              }
            }
          }
        }
      }
    }
  }
  /*--------------------*/
  /* 先生 */
  &.teacher {
    /* 先生の紹介 */
    .teachers_introduction_wrap {
      h2 {
        font-size: 2.3rem;
        letter-spacing: 0.04em;
        margin-bottom: 6rem;
        @media screen and (max-width: 480px) {
          font-size: 1.8rem;
          margin-bottom: 2rem;
        }
        strong {
          font-size: 2.4em;
          display: inline-block;
          margin: 0 0.1em 0 0.3em;
        }
        span {
          font-size: 0.74em;
        }
      }
      .teachers_introduction {
        margin-bottom: 20rem;
        @media screen and (max-width: 480px) {
          margin-bottom: 8rem;
        }
        .teacher {
          dl {
            border-bottom: 1px solid #000;
            dt {
              display: flex;
              gap: 2.3rem;
              align-items: center;
              padding: 2.2rem 12rem 2.2rem 3.2rem;
              font-size: 1.3rem;
              font-weight: 700;
              letter-spacing: 0.04em;
              @media screen and (max-width: 480px) {
                font-size: 1.2rem;
                gap: 0.5rem 1rem;
                padding: 1.2rem 5.6rem 1.2rem 0;
                flex-wrap: wrap;
              }
              .icon {
                width: 6rem;
                flex-shrink: 0;
                @media screen and (max-width: 480px) {
                  width: 3rem;
                }
              }
              .name_wrap {
                .name {
                  width: 7.8em;
                  font-size: 2.1rem;
                  margin: 0.33em 0 0.43em;
                  @media screen and (max-width: 480px) {
                    font-size: 1.6rem;
                    width: 10em;
                  }
                }
                .furigana {
                  font-size: 1rem;
                  letter-spacing: 0.3em;
                  font-weight: 700;
                }
              }
              .year {
                width: 10rem;
                flex-shrink: 0;
                @media screen and (max-width: 480px) {
                  width: auto;
                }
              }
              .note {
                text-align: left;
                line-height: 1.5;
                @media screen and (max-width: 480px) {
                  width: 100%;
                  margin-left: 4rem;
                }
              }
            }
            dd {
              padding: 0 11.5rem 0;
              @media screen and (max-width: 480px) {
                padding: 0 1rem;
              }
              .inner {
                font-size: 1.6rem;
                line-height: 1.75;
                @media screen and (max-width: 480px) {
                  font-size: 1.4rem;
                }
              }
              &.open {
                padding: 0 11.5rem 2rem;
                @media screen and (max-width: 480px) {
                  padding: 0 1rem 1.6rem;
                }
              }
            }
          }
        }
      }
    }
    /* 保護者の声 */
    .voice_wrap {
      margin-top: 11rem;
      @media screen and (max-width: 480px) {
        margin-top: 5rem;
      }
      .voice_item {
        border: 0.8rem solid #ececec;
        margin: 4.8rem auto;
        box-sizing: border-box;
        max-width: 106.4rem;
        padding: 3.2rem;
        border-radius: 1rem;
        &:last-of-type {
          margin-bottom: 0;
        }
        @media screen and (max-width: 480px) {
          margin: 3rem auto;
          border: 0.6rem solid #ececec;
          padding: 1.6rem;
        }
        h3 {
          font-size: 2rem;
          margin-bottom: 0.9em;
          position: relative;
          padding-left: 3em;
          line-height: 1.7;
          @media screen and (max-width: 480px) {
            font-size: 1.8rem;
          }
          span {
            position: absolute;
            left: 0;
            top: 0.65rem;
            display: inline-block;
            font-size: 1.6rem;
            width: 3em;
            background-color: var(--color-deep-green);
            color: #fff;
            line-height: 1.3125;
            text-align: center;
            border-radius: 9999px;
            font-weight: 500;
            margin-right: 0.75em;
            line-height: 1.3125;
            @media screen and (max-width: 480px) {
              font-size: 1.4rem;
            }
          }
        }
        ul {
          font-size: 1.6rem;
          line-height: 1.7;
          padding-left: 6rem;
          @media screen and (max-width: 480px) {
            font-size: 1.4rem;
            padding-left: 0;
          }
          li {
            margin-bottom: 1em;
            &:last-child {
              margin-bottom: 0;
            }
          }
        }
      }
    }
  }
  /*--------------------*/
  /* 施設クラス紹介 */
  &.facility {
    /* クラス編成 */
    .nenrei_img {
      max-width: 105.6rem;
      display: block;
      margin: 5.8rem auto 13.8rem;
      @media screen and (max-width: 480px) {
        margin: 3rem auto 8rem;
      }
    }
    /* 施設紹介 */
    .facility_wrap {
      /* リード */
      .facility_lead_wrap {
        margin: 9rem 0 15rem;
        overflow: hidden;
        position: relative;
        height: 70vw;
        min-height: 70rem;
        max-height: 95.6rem;
        @media screen and (max-width: 480px) {
          margin: 3rem 0 6rem;
          height: auto;
          padding: 18rem 0 16rem;
          max-height: 100%;
          min-height: 0;
        }
        p {
          max-width: 58rem;
          width: 50%;
          margin: auto;
          font-size: 1.6rem;
          line-height: 2;
          letter-spacing: 0.04em;
          position: absolute;
          top: 50%;
          left: 50%;
          transform: translate(-50%, -50%);
          @media screen and (max-width: 480px) {
            position: static;
            transform: none;
            width: 70%;
            font-size: 1.4rem;
          }
        }
        /* 写真 */
        .img_wrap {
          position: absolute;
          border-radius: 0.8rem;
          overflow: hidden;
          left: 50%;
          &.img-01 {
            max-width: 40.8rem;
            width: 28.34vw;
            aspect-ratio: 408/378;
            top: 11.4rem;
            transform: translateX(calc(-100% - min(32vw, 43.4rem)));
            @media screen and (max-width: 480px) {
              width: 36.8vw;
              top: 2rem;
              transform: translateX(calc(-100% - 30vw));
            }
          }
          &.img-02 {
            max-width: 37.4rem;
            width: 25.98vw;
            aspect-ratio: 374/282;
            transform: translateX(-76%);
            top: 0;
            @media screen and (max-width: 480px) {
              width: 33.8vw;
              transform: translateX(-70%);
            }
          }
          &.img-03 {
            max-width: 45rem;
            width: 31.25vw;
            aspect-ratio: 450/378;
            transform: translateX(min(27vw, 44rem));
            top: 0;
            @media screen and (max-width: 480px) {
              width: 40.6vw;
              transform: translateX(24vw);
            }
          }
          &.img-04 {
            max-width: 38.6rem;
            width: 26.81vw;
            aspect-ratio: 386/266;
            transform: translateX(calc(-100% - min(30vw, 41.3rem)));
            bottom: 3.1rem;
            @media screen and (max-width: 480px) {
              width: 34.8vw;
              transform: translateX(calc(-100% - 26vw));
            }
          }
          &.img-05 {
            max-width: 41.4rem;
            width: 28.75vw;
            aspect-ratio: 414/244;
            transform: translateX(-36%);
            bottom: 0;
            @media screen and (max-width: 480px) {
              width: 37.4vw;
              transform: translateX(-45%);
            }
          }
          &.img-06 {
            max-width: 40.4rem;
            width: 28.06vw;
            aspect-ratio: 404/286;
            transform: translateX(min(32vw, 44rem));
            bottom: 13.8rem;
            @media screen and (max-width: 480px) {
              width: 36.5vw;
              transform: translateX(26vw);
              bottom: 3rem;
            }
          }
        }
      }
      /* 紹介 */
      .facility_wrap {
        max-width: 114rem;
        padding: 0 2rem;
        margin: auto;
      }
    }
    /* 安全対策 */
    .safety_wrap {
      margin: 29.5rem 0 16rem;
      padding: 4rem 0 20rem;
      @media screen and (max-width: 480px) {
        margin: 15rem 0 12rem;
        padding: 2rem 0 4rem;
      }
      .inner {
        .safety_list {
          margin-top: 8.6rem;
          @media screen and (max-width: 480px) {
            margin-top: 3rem;
          }
          li {
            display: flex;
            margin-bottom: 14rem;
            gap: 6rem;
            align-items: flex-start;
            @media screen and (max-width: 480px) {
              flex-direction: column;
              gap: 2rem;
              margin-bottom: 4rem;
            }
            &:last-child {
              margin-bottom: 0;
            }
            .img_wrap {
              max-width: 48rem;
              width: 43%;
              flex-shrink: 0;
              border: 1px solid #fff;
              border-radius: 1.8rem;
              overflow: hidden;
              @media screen and (max-width: 480px) {
                width: 100%;
                border-radius: 1rem;
              }
            }
            .text_wrap {
              flex-grow: 1;
              letter-spacing: 0.04em;
              h4 {
                font-size: 2.2rem;
                line-height: 1.7;
                margin: 2.7rem 0;
                font-weight: 500;
                @media screen and (max-width: 480px) {
                  font-size: 1.6rem;
                  margin: 1.8rem 0 1.4rem;
                }
              }
              p {
                font-size: 1.5rem;
                line-height: 2;
                font-weight: 500;
                @media screen and (max-width: 480px) {
                  font-size: 1.4rem;
                }
              }
            }
          }
        }
      }
    }
  }
  /*--------------------*/
  /* ライフ */
  &.life {
    /*--------------------*/
    /* 食べるチカラ */
    .life-02_list_wrap {
      margin-bottom: 13.5rem;
      @media screen and (max-width: 480px) {
        margin-bottom: 8rem;
      }
      .ife-02_list-item {
        margin-bottom: 12rem;
        @media screen and (max-width: 480px) {
          margin-bottom: 4rem;
        }
        .img_text_wrap {
          margin-top: 4.8rem;
          display: flex;
          justify-content: space-between;
          align-items: flex-start;
          @media screen and (max-width: 480px) {
            display: block;
            margin-top: 3rem;
          }
          .img_wrap {
            max-width: 51.1rem;
            width: 45%;
            border-radius: 1.8rem;
            overflow: hidden;
            @media screen and (max-width: 480px) {
              border-radius: 1rem;
              width: 100%;
            }
          }
          .text_wrap {
            max-width: 56.2rem;
            width: 50%;
            font-size: 1.5rem;
            line-height: 2;
            font-weight: 500;
            @media screen and (max-width: 480px) {
              font-size: 1.4rem;
              width: 100%;
              margin-top: 2rem;
            }
            strong {
              font-weight: 800;
            }
          }
        }
        &:nth-of-type(2n) {
          .img_text_wrap {
            flex-direction: row-reverse;
          }
        }
        &:last-of-type {
          margin-bottom: 0;
        }
      }
    }
    /* 給食メニュー */
    .kyusyokumenu_wrap {
      padding: 6rem 0 7rem;
      margin-top: 14rem;

      @media screen and (max-width: 480px) {
        padding: 2rem 0 3rem;
        margin-top: 6rem;
      }
      p {
        margin: 3.6rem auto 5.8rem;
        max-width: 59.6rem;
        font-size: 1.5rem;
        line-height: 2;
        font-weight: 500;
        @media screen and (max-width: 480px) {
          font-size: 1.4rem;
          margin: 3rem auto;
        }
      }
      .menu_list_wrap {
        position: relative;
        &::before,
        &::after {
          content: "";
          display: block;
          position: absolute;
          top: -2.4rem;
          width: 1.8rem;
          height: 5.4rem;
          background-image: url(../img/life/parts-menu.svg);
          background-repeat: no-repeat;
          background-size: contain;
        }
        &::before {
          left: 7.2rem;
        }
        &::after {
          right: 7.2rem;
        }
        @media screen and (max-width: 480px) {
          &::before,
          &::after {
            top: -1.5rem;
            width: 1.08rem;
            height: 3.24rem;
          }
          &::before {
            left: 5rem;
          }
          &::after {
            right: 5rem;
          }
        }
        .menu_list {
          padding: 6rem 2rem 7rem;
          @media screen and (max-width: 480px) {
            padding: 2rem 1.6rem 3rem;
          }
          li {
            margin: 0 auto 4rem;
            max-width: 49.6rem;
            &:last-child {
              margin-bottom: 0;
            }
            @media screen and (max-width: 480px) {
              margin: 0 auto 2rem;
            }
            @media screen and (max-width: 480px) {
              a {
                span {
                  font-size: 1.4rem;
                }
              }
            }
          }
        }
      }
    }
    /*--------------------*/
    /* 対話と地域 */
    .leadcopy.has-child {
      position: relative;
      .child_wrap {
        position: absolute;
        &.child-10 {
          max-width: 19.4rem;
          width: 30vw;
          top: 0;
          right: 0;
          transform: translate(75%, 0%);
        }
        &.child-13 {
          max-width: 16rem;
          width: 12vw;
          bottom: 0;
          right: 0;
          transform: translate(150%, -10%);
          @media screen and (max-width: 1024px) {
            bottom: auto;
            top: 0;
            right: 0;
            transform: translate(60%, -30%);
          }
          @media screen and (max-width: 480px) {
            width: 28vw;
            right: 0;
            transform: translate(-10%, 20%);
          }
        }
      }
    }
    .arigato_wrap {
      margin-bottom: 14rem;
      @media screen and (max-width: 480px) {
        margin-bottom: 8rem;
      }
      h3 {
        font-size: 2.2rem;
        line-height: 1.7;
        margin-bottom: 6rem;
        font-weight: 500;
        @media screen and (max-width: 480px) {
          font-size: 1.8rem;
          margin-bottom: 2rem;
        }
      }
      p {
        font-size: 1.5rem;
        line-height: 1.933;
        font-weight: 500;
        @media screen and (max-width: 480px) {
          font-size: 1.4rem;
        }
      }
    }
    .life-03_list_wrap {
      margin-bottom: 8rem;
      @media screen and (max-width: 480px) {
        margin-bottom: 4rem;
      }
    }
    /*--------------------*/
    /* 園での1日 */
    .spilal_leadcopy_wrap.life-01 {
      margin-bottom: 9rem;
      @media screen and (max-width: 768px) {
        margin-bottom: 4rem;
      }
      p {
        margin-right: 5rem;
        @media screen and (max-width: 1024px) {
          margin-right: auto;
        }
      }
    }
    .life_lead_img_wrap {
      display: flex;
      position: relative;
      max-width: 2237px;
      width: 155.4%;
      left: 50%;
      z-index: 10;
      transform: translateX(-52%);
      gap: min(4%, 9.1rem);
      margin-bottom: 35rem;
      align-items: flex-start;
      @media screen and (max-width: 1360px) {
        margin-bottom: 28rem;
      }
      @media screen and (max-width: 768px) {
        margin-bottom: 18rem;
      }
      @media screen and (max-width: 480px) {
        margin-bottom: 10rem;
        gap: 1.6rem;
      }
      .img_wrap {
        border: 0.6rem solid #fff;
        box-sizing: border-box;
        border-radius: 4rem;
        overflow: hidden;
        @media screen and (max-width: 480px) {
          border-radius: 2rem;
        }
        &.img-01 {
          transform: translateY(100%);
        }
        &.img-02 {
          transform: translateY(32%);
        }
        &.img-04 {
          transform: translateY(45%);
        }
        @media screen and (max-width: 1360px) {
          &.img-01 {
            transform: translateY(40%);
          }
          &.img-02 {
            transform: translateY(20%);
          }
          &.img-04 {
            transform: translateY(30%);
          }
        }
      }
    }
    /* 時間割 */
    .life-01_list_wrap {
      margin-bottom: 19.6rem;
      @media screen and (max-width: 480px) {
        margin-bottom: 8rem;
      }
      .ife-01_list-item {
        display: flex;
        justify-content: space-between;
        margin-bottom: 24rem;
        position: relative;
        align-items: flex-start;
        &::after {
          content: "";
          display: block;
          position: absolute;
          width: 2px;
          height: 16.2rem;
          bottom: -4rem;
          left: 50%;
          transform: translate(-50%, 100%);
          background-image: repeating-linear-gradient(180deg, #545454, #545454 7px, transparent 7px, transparent 12px);
          background-position: right top;
          background-repeat: repeat-y;
          background-size: 2px 100%;
        }
        &:last-of-type {
          &::after {
            display: none;
          }
        }
        @media screen and (max-width: 480px) {
          display: block;
          margin-bottom: 12rem;
          &::after {
            height: 8.1rem;
            bottom: -2rem;
          }
        }
        .text_wrap {
          max-width: 30rem;
          width: 26.5%;
          @media screen and (max-width: 480px) {
            width: 80%;
            max-width: 100%;
            margin: auto auto 2rem;
          }
          h3 {
            display: flex;
            align-items: center;
            gap: 2.7rem;
            border-bottom: 1px solid #545454;
            padding: 0 0 1.3rem 1rem;
            margin-bottom: 2.7rem;
            @media screen and (max-width: 480px) {
              gap: 1.6rem;
              padding: 0 0 1rem 0;
              margin-bottom: 2rem;
            }
            .icon {
              width: 6.9rem;
              @media screen and (max-width: 480px) {
                width: 4.8rem;
              }
            }
            .time {
              font-size: 1.9rem;
              font-weight: 700;
              letter-spacing: 0.17em;
            }
          }
          h4 {
            font-size: 2.2rem;
            letter-spacing: 0.04em;
            line-height: 1.7;
            font-weight: 500;
            margin-bottom: 2.7rem;
            @media screen and (max-width: 480px) {
              font-size: 1.8rem;
              margin-bottom: 2rem;
              text-align: center;
            }
          }
          p {
            font-size: 1.5rem;
            line-height: 2;
            letter-spacing: 0.04em;
            font-weight: 500;
            @media screen and (max-width: 480px) {
              font-size: 1.4rem;
            }
          }
        }
        .img_wrap {
          max-width: 76.5rem;
          width: 67.5%;
          padding-top: 0.8rem;
          @media screen and (max-width: 480px) {
            width: 100%;
          }
          img {
            display: block;
            border-radius: 1.8rem;
            @media screen and (max-width: 480px) {
              border-radius: 1rem;
            }
          }
          &.images_wrap {
            display: flex;
            flex-wrap: wrap;
            justify-content: space-between;
            gap: 1.8%;
            img {
              width: 49.1%;
              max-width: 37.5rem;
              &:nth-child(n + 3) {
                margin-top: 1.8%;
              }
            }
          }
        }
      }
    }
    /* 季節のイベント */
    .event_list_wrap {
      padding: 3.6rem 0 5rem;
      @media screen and (max-width: 480px) {
        padding: 2rem 0 5rem;
      }
      .event_list {
        margin-top: 10rem;
        @media screen and (max-width: 1024px) {
          margin-top: 6rem;
        }
        .event-item {
          display: flex;
          justify-content: space-between;
          align-items: flex-start;
          margin-bottom: 14rem;
          @media screen and (max-width: 1024px) {
            margin-bottom: 6rem;
          }

          &:last-of-type {
            margin-bottom: 0;
          }
          &:nth-child(2n) {
            flex-direction: row-reverse;
          }
          @media screen and (max-width: 480px) {
            flex-direction: column-reverse;
            &:nth-child(2n) {
              flex-direction: column-reverse;
            }
          }
          .img_wrap {
            max-width: 48.1rem;
            width: 42.2%;
            border-radius: 1.8rem;
            overflow: hidden;
            @media screen and (max-width: 480px) {
              border-radius: 1rem;
              width: 90%;
              margin: auto;
            }
          }
          .text_wrap {
            width: 52.5%;
            max-width: 59.8rem;
            @media screen and (max-width: 480px) {
              width: 100%;
              margin-bottom: 2rem;
            }
            h3 {
              padding: 1.2rem 0.6rem;
              display: flex;
              align-items: center;
              gap: 2.4rem;
              border-bottom: 1px solid #545454;
              margin-bottom: 2.7rem;
              @media screen and (max-width: 480px) {
                margin-bottom: 1.8rem;
              }
              .ja {
                font-size: 3.7rem;
                @media screen and (max-width: 1024px) {
                  font-size: 2.9rem;
                }
                @media screen and (max-width: 480px) {
                  font-size: 2.1rem;
                }
              }
              .en {
                font-size: 1.4rem;
                font-weight: 700;
                letter-spacing: 0.5em;
                @media screen and (max-width: 480px) {
                  font-size: 1.2rem;
                }
              }
            }
            table {
              width: 100%;
              th,
              td {
                letter-spacing: 0.04em;
                vertical-align: middle;
                padding: 1.2rem 0;
                @media screen and (max-width: 480px) {
                  padding: 0.6rem 0;
                }
              }
              th {
                width: 34%;
                font-size: 2.2rem;
                padding-right: 0.5em;
                font-weight: 500;
                line-height: 1.2;
                word-break: keep-all;
                text-align: left;
                @media screen and (max-width: 1024px) {
                  font-size: 1.8rem;
                }
                @media screen and (max-width: 480px) {
                  font-size: 1.5rem;
                }
                small {
                  font-size: 0.8em;
                }
              }
              td {
                font-size: 1.5rem;
                line-height: 1.5;
                @media screen and (max-width: 480px) {
                  font-size: 1.2rem;
                }
              }
            }
          }
        }
      }
    }
  }
  /*--------------------*/
  /* 入園について */
  &.join {
    .leadcopy_join {
      margin-left: 39rem;
      @media screen and (max-width: 1200px) {
        margin-left: 29rem;
      }
      @media screen and (max-width: 1024px) {
        margin-left: 14rem;
      }
      @media screen and (max-width: 480px) {
        margin-left: 0;
        padding: 4rem 2rem 0;
      }
    }
    .whats_wrap {
      display: flex;
      flex-direction: row-reverse;
      margin-bottom: 15.4rem;
      justify-content: space-between;
      @media screen and (max-width: 480px) {
        display: block;
        margin-bottom: 12rem;
      }
      .img_wrap {
        width: 42.2%;
        max-width: 48.1rem;
        border-radius: 1.8rem;
        overflow: hidden;
        @media screen and (max-width: 480px) {
          width: 90%;
          margin: auto auto 4rem;
        }
      }
      .text_wrap {
        width: 49.3%;
        max-width: 56.2rem;
        p {
          font-size: 1.5rem;
          font-weight: 500;
          line-height: 2;
          margin-top: 4.2rem;
        }
        @media screen and (max-width: 480px) {
          width: 100%;
          p {
            font-size: 1.4rem;
            margin-top: 2rem;
          }
        }
      }
    }
    /* 認定チェック */
    .nintei_flow_wrap {
      padding: 8rem 0;
      @media screen and (max-width: 480px) {
        padding: 2rem 0;
      }
      &::after {
        display: none;
      }
      .nintei_flow {
        max-width: 78.6rem;
        width: 90%;
        margin: 6rem auto 6rem;
        @media screen and (max-width: 480px) {
          width: 100%;
          margin: 3rem auto;
        }
        h3 {
          text-align: center;
          font-size: 2.2rem;
          line-height: 1.75;
          text-align: center;
          font-weight: 700;
          letter-spacing: 0.04em;
          margin-bottom: 3rem;
          @media screen and (max-width: 480px) {
            margin-bottom: 2rem;
            font-size: 1.7rem;
          }
          &.kekka {
            span {
              display: inline-block;
              background-color: #fff;
              border-radius: 9999px;
              width: 8em;
            }
          }
        }
        .sentaku {
          .buttons {
            display: flex;
            justify-content: space-between;
            button {
              max-width: 35.2rem;
              width: 44.8%;
              aspect-ratio: 352/240;
              border-radius: 1rem;
              background-color: #f9f9f9;
              box-shadow: 0 0 9px rgba(0, 0, 0, 0.25);
              cursor: pointer;
              opacity: 0.9;
              font-size: 2.9rem;
              font-weight: 700;
              line-height: 1.5;
              color: var(--color-bace);
              font-family: "M PLUS Rounded 1c", sans-serif;
              box-sizing: border-box;
              &:hover {
                opacity: 0.7;
              }
              @media screen and (max-width: 480px) {
                font-size: 2.4rem;
                aspect-ratio: 4/3;
              }
            }
          }
          .result {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            aspect-ratio: 786/240;
            background-color: var(--color-yellow);
            border-radius: 2rem;
            box-sizing: border-box;
            padding: 2rem;
            @media screen and (max-width: 480px) {
              aspect-ratio: 350/117.6;
              border-radius: 1rem;
            }
            .title {
              font-size: 4rem;
              font-weight: 700;
              margin-bottom: 0.6em;
              @media screen and (max-width: 480px) {
                font-size: 2rem;
                margin-bottom: 0.4em;
              }
            }
            .discription {
              font-size: 1.8rem;
              line-height: 1.75;
              font-weight: 500;
              @media screen and (max-width: 480px) {
                font-size: 1.6rem;
                line-height: 1.5;
              }
            }
          }
        }
        .footer {
          margin-top: 4rem;
          display: flex;
          justify-content: center;
          gap: 2rem;
          @media screen and (max-width: 480px) {
            margin-top: 2rem;
          }
          button {
            font-size: 1.6rem;
            font-weight: 700;
            width: 12rem;
            background-color: #fff;
            color: var(--color-bace);
            height: 3em;
            border-radius: 9999px;
            box-shadow: 0 0 9px rgba(0, 0, 0, 0.25);
            cursor: pointer;
            @media screen and (max-width: 480px) {
              font-size: 1.4rem;
            }
          }
          &::after {
            content: "";
            display: block;
            width: 12rem;
          }
        }
      }
      .jiyu_wrap {
        .jiyu {
          padding: 3.8rem 5.8rem 4.2rem;
          @media screen and (max-width: 480px) {
            padding: 2rem 3rem;
          }
          h3 {
            font-size: 2.2rem;
            line-height: 1.5;
            margin-bottom: 0.9em;
            @media screen and (max-width: 480px) {
              font-size: 2rem;
            }
          }
          p {
            font-size: 1.6rem;
            line-height: 1.625;
            @media screen and (max-width: 480px) {
              font-size: 1.4rem;
            }
          }
        }
      }
    }
    /* よくある質問 */
    .join_faq_wrap {
      background-color: var(--color-deep-green);
      padding: 3.5rem 0 17vw;
      @media screen and (max-width: 480px) {
        display: block;
      }
      & > .inner {
        display: flex;
        flex-direction: row-reverse;
        justify-content: space-between;
        @media screen and (max-width: 480px) {
          display: block;
        }
        h2 {
          padding: 5.2rem 2rem 0 2rem;
          position: relative;
          color: #fff;
          @media screen and (max-width: 480px) {
            padding: 0;
            text-align: center;
            margin-bottom: 2rem;
          }
          .en {
            display: block;
            position: absolute;
            font-size: 1.6rem;
            font-weight: 700;
            text-align: center;
            top: 0;
            left: 0;
            width: 100%;
            letter-spacing: 0.2em;
            @media screen and (max-width: 480px) {
              margin-bottom: 0.5rem;
              position: static;
            }
          }

          .ja {
            font-size: 3.2rem;
            writing-mode: vertical-rl;
            line-height: 1.5;
            @media screen and (max-width: 480px) {
              writing-mode: horizontal-tb;
              font-size: 2.1rem;
              text-align: center;
            }
          }
        }
        .faq_list {
          width: calc(100% - 12rem);
          @media screen and (max-width: 480px) {
            width: 100%;
          }
        }
      }
    }
    /* 募集要項 */
    .bosyu_wrap {
      background-image: url(../img/join/bosyu_bg.webp);
      background-size: 100% auto;
      background-position: top center;
      padding-top: 20vw;
      padding-bottom: 4rem;
      margin-top: -15vw;
      @media screen and (max-width: 480px) {
        background-size: cover;
        padding-top: 30vw;
      }
      .inner {
        display: flex;
        justify-content: space-between;
        @media screen and (max-width: 480px) {
          display: block;
        }
        .youkou {
          width: 50%;
          @media screen and (max-width: 480px) {
            width: 100%;
            margin-bottom: 6rem;
          }
          h2 {
            display: flex;
            align-items: center;
            margin-bottom: 8rem;
            @media screen and (max-width: 480px) {
              margin-bottom: 2rem;
            }
            .ja {
              font-size: 4.6rem;
              font-weight: 500;
              letter-spacing: 0.1em;
              margin-right: 0.75em;
              @media screen and (max-width: 480px) {
                font-size: 2.4rem;
              }
            }
            .en {
              font-size: 1.8rem;
              font-weight: 400;
              color: var(--color-deep-green);
              letter-spacing: 0.2em;
              @media screen and (max-width: 480px) {
                font-size: 1.4rem;
              }
            }
          }
          dl {
            display: flex;
            flex-wrap: wrap;
            dt,
            dd {
              letter-spacing: 0.05em;
              padding: 2rem 0;
              @media screen and (max-width: 480px) {
                padding: 1rem 0;
              }
            }
            dt {
              width: 27%;
              font-size: 1.8rem;
              line-height: 1.778;
              color: var(--color-deep-green);
              @media screen and (max-width: 480px) {
                font-size: 1.6rem;
              }
            }
            dd {
              width: 73%;
              font-size: 1.6rem;
              line-height: 2;
              border-bottom: 1px solid var(--color-deep-green);
              @media screen and (max-width: 480px) {
                font-size: 1.4rem;
              }
              &:last-of-type {
                border-bottom: none;
              }
            }
          }
        }
        .toiawase {
          width: 46%;
          position: relative;
          @media screen and (max-width: 480px) {
            width: 100%;
          }
          &::after {
            content: "";
            display: block;
            max-width: 20.1rem;
            width: 20vw;
            aspect-ratio: 1/1;
            background-image: url(../img/join/bosyu_badge.webp);
            background-repeat: no-repeat;
            background-size: contain;
            position: absolute;
            right: 0;
            top: 0;
            transform: translate(20%, -20%);
          }
          @media screen and (max-width: 1280px) {
            &::after {
              transform: translate(10%, -70%);
            }
          }
          @media screen and (max-width: 480px) {
            &::after {
              width: 12rem;
              transform: translate(20%, -70%);
            }
          }
          .lead {
            font-size: 1.8rem;
            line-height: 1.75;
            color: var(--color-deep-green);
            margin-bottom: 5.8rem;
            @media screen and (max-width: 1280px) {
              margin-bottom: 2rem;
              margin-top: 6rem;
            }
            @media screen and (max-width: 480px) {
              font-size: 1.4rem;
              margin-bottom: 2rem;
              margin-top: 0;
            }
          }
          .wrap {
            background-color: #fff;
            border-radius: 1.6rem;
            padding: 3.2rem 2rem 3.8rem;
            margin-bottom: 1rem;
            @media screen and (max-width: 480px) {
              padding: 2rem 2rem 2.8rem;
            }
            h3 {
              display: flex;
              justify-content: center;
              font-size: 2rem;
              align-items: center;
              margin-bottom: 0.6em;
              @media screen and (max-width: 480px) {
                font-size: 1.8rem;
              }
              .icon {
                width: 3.2rem;
                margin-right: 1rem;
                @media screen and (max-width: 480px) {
                  width: 2.6rem;
                }
              }
              .ja {
                font-weight: 500;
                letter-spacing: 0.05em;
              }
            }
            &.tel {
              text-align: center;
              .number_wrap {
                letter-spacing: 0.1em;
                .head {
                  font-size: 1.6rem;
                  margin-right: 0.5em;
                  @media screen and (max-width: 480px) {
                    font-size: 1.4rem;
                  }
                }
                a {
                  font-size: 3.2rem;
                  color: var(--color-deep-green);
                  @media screen and (max-width: 480px) {
                    font-size: 2.8rem;
                  }
                  span {
                    display: inline-block;
                    padding-bottom: 0.05em;
                    border-bottom: 2px solid var(--color-deep-green);
                  }
                }
              }
              .jikan {
                font-size: 1.6rem;
                margin-top: 0.8em;
                line-height: 1.5;
                @media screen and (max-width: 480px) {
                  font-size: 1.4rem;
                }
              }
            }
            &.mail {
              a.button_kakumaru {
                max-width: 32rem;
                margin: auto;
              }
            }
          }
        }
      }
    }
  }
  /*--------------------*/
  /* 入園について */
  &.about {
    /* 園長先生 */
    .director_wrap {
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      margin: 24.2rem auto 8.2rem;
      @media screen and (max-width: 480px) {
        flex-direction: column;
        margin: 8rem auto 6rem;
      }
      .img_wrap {
        position: relative;
        max-width: 49.1rem;
        width: 43.1%;
        margin-top: 5.4rem;
        @media screen and (max-width: 480px) {
          width: 80%;
          margin: auto auto 4rem;
        }
        .img-director {
          border: 0.6rem solid #fff;
          border-radius: 4rem;
          box-sizing: border-box;
          overflow: hidden;
          aspect-ratio: 491/512;
        }
        .children.child-12 {
          position: absolute;
          z-index: 10;
          top: 0;
          right: 0;
          max-width: 14.1rem;
          width: 28.8%;
          transform: translate(-14%, -46.4%);
        }
      }
      .text_wrap {
        max-width: 51.9rem;
        width: 45.5%;
        @media screen and (max-width: 480px) {
          width: 100%;
        }
        p {
          font-size: 1.6rem;
          line-height: 2.25;
          font-weight: 700;
          margin: 5.2rem 0 5.4rem;
          letter-spacing: 0.04em;
          @media screen and (max-width: 480px) {
            font-size: 1.4rem;
          }
        }
        h6 {
          font-size: 1.3rem;
          font-weight: 500;
          margin-bottom: 1.1em;
          letter-spacing: 0.04em;
        }
        h5 {
          display: flex;
          align-items: center;
          .ja {
            font-size: 2.5rem;
            font-weight: 700;
            letter-spacing: 0.04em;
            margin-right: 1em;
          }
          .en {
            font-size: 1.4rem;
            letter-spacing: 0.22em;
            font-weight: 400;
          }
        }
      }
    }
    /* 金屋こども園が大切にしていること */
    .policy_wrap {
      .policy_list {
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
        gap: 4.4%;
        margin: 7.5rem 0 0;
        @media screen and (max-width: 480px) {
          flex-direction: column;
          gap: 3rem;
          margin: 3rem 0 0;
        }
        .policy_list-item {
          max-width: 36.4rem;
          width: 30.4%;
          margin-bottom: 2.4rem;
          @media screen and (max-width: 480px) {
            max-width: 100%;
            width: 100%;
          }
          .img_wrap {
            border-radius: 1.8rem;
            overflow: hidden;
            position: relative;
          }
          h3 {
            position: relative;
            margin-top: -2.6rem;
            margin-bottom: 2.2rem;

            span.outer {
              display: inline-block;
              padding: 0 0.4rem 0.4rem 0;
              border-radius: 0 1.6rem 1.6rem 0;
              background-color: var(--color-base);
              span.inner {
                display: inline-block;
                font-size: 2rem;
                line-height: 2.5;
                background-color: #fffbf3;
                border-radius: 0 1.4rem 1.4rem 0;
                padding: 0 1em;
                @media screen and (max-width: 480px) {
                  font-size: 1.8rem;
                }
              }
            }
          }
          p {
            font-size: 1.6rem;
            line-height: 1.625;
            letter-spacing: 0.04em;
            font-weight: 700;
            padding-right: 1em;
            @media screen and (max-width: 480px) {
              font-size: 1.4rem;
            }
          }

          &:nth-of-type(1) {
            margin-top: 12.5rem;
          }
          &:nth-of-type(3) {
            margin-top: 8.3rem;
          }

          &:nth-of-type(4) {
            margin: 8.3rem 5.5rem 0;
          }
          &:nth-of-type(5) {
            margin: 0 5.5rem 0;
          }
          @media screen and (max-width: 480px) {
            &:nth-of-type(2n) {
              margin: 0;
            }
            &:nth-of-type(2n + 1) {
              margin: 0;
            }
          }
        }
      }
    }
    .footer_copy {
      background-image: url(../img/common/page_bg-mokumoku-white.svg);
      background-position: right bottom;
      background-repeat: no-repeat;
      background-size: 100% auto;
      padding: 18rem 2rem 2.4rem;
      @media screen and (max-width: 480px) {
        background-size: 200% auto;
        background-position: right -5rem bottom;
        padding: 6rem 2rem 8rem;
      }
      .footer_copy_inner {
        max-width: 86rem;
        margin: auto;
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        @media screen and (max-width: 480px) {
          flex-direction: column;
          gap: 4rem;
        }
        .img_wrap {
          max-width: 41.3rem;
          width: 48.1%;
          border-radius: 6rem;
          overflow: hidden;
          border: 1px solid #fff;
          @media screen and (max-width: 480px) {
            max-width: 100%;
            width: 90%;
            margin: auto;
          }
        }
        .text_wrap {
          width: 100%;
          p {
            font-size: 1.9rem;
            line-height: 2.79;
            font-weight: 700;

            @media screen and (max-width: 480px) {
              font-size: 1.6rem;
              text-align: center;
              &:first-of-type {
                margin-bottom: 1.6em;
              }
            }
          }
        }
      }
    }
  }
}