@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=Zen+Kaku+Gothic+New:wght@400;500;700&family=Zen+Maru+Gothic:wght@400;500&family=Dai+Banna+SIL:ital,wght@1,600&family=Damion&family=Crimson+Text:wght@400;700&display=swap');

:root {
  font-size: calc(100vw * 16 / 1440); /* 1rem */
  --font-sans-serif: "Noto Sans JP", sans-serif;
  --font-kaku: "Zen Kaku Gothic New", sans-serif;
  --font-maru: "Zen Maru Gothic", sans-serif;
  --font-crimson: "Crimson Text", serif;
  --font-damion: "Damion", cursive;
  --font-dai: "Dai Banna SIL", serif;
  --font-serif: serif;
  --color-body: #70472E;
  --color-link: inherit;
  --border-radius-pill: 50rem;
  --padding-container: 1.25rem;
  --max-width: 60rem;
  --max-width-container: calc(var(--max-width) + var(--padding-container) * 2);
}

body {
  font-family: var(--font-sans-serif);
  font-size: 1rem;
  letter-spacing: 10%;
  line-height: 2;
  color: var(--color-body);
  scrollbar-gutter: stable;
}

section {
  display: flow-root;
  position: relative;
}

a {
  color: inherit;
  text-decoration: none;
  transition: all .3s ease-out;
}

img {
  max-width: 100%;
}

h1, h2, h3, h4, h5, h6, dl, dt, dd {
  display: flow-root;
  font-family: inherit;
  font-weight: inherit;
  padding: 0;
  margin: 0;
}

.my-ajax-loading {
  position: fixed;
  inset: 0;
  background-color: rgba(255, 255, 255, .5);
  z-index: 2000;
  > .spinner-grow {
    position: absolute;
    inset: 0;
    place-self: center;
  }
}

.my-container {
  position: relative;
  max-width: var(--max-width-container);
  margin-inline: auto;
  padding: 0 var(--padding-container);
}

.my-cols,
.my-rows {
  display: flex;
  list-style: none;
  padding: 0;
  margin: 0;
  &.my-rows {
    flex-direction: column;
  }
}

.my-breadcrumb {
  padding-top: 1.25rem;
  font-size: 1rem;
  > ol {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    padding: 0;
    margin: 0;
    li + li::before {
      content: '/';
      margin-inline: 1.25rem;
    }
    a {
      color: #F78A23;
      &:hover {
        opacity: 0.6;
      }
    }
  }
}

.my-sec {
  padding-top: 3rem;
}

.my-pagetitle {
  background: url(../img/pagetitle-bg02.svg) center / cover no-repeat,
    url(../img/pagetitle-bg01.png?v1) center / cover no-repeat;
  padding-block: 1.62rem;
  h2 {
    color: #fff;
    font-size: 2rem;
    font-weight: 500;
    line-height: 180%;
    letter-spacing: 20%;
    margin: 0;
  }
  [lang="en"] {
    color: #fff;
    font-family: var(--font-crimson);
    font-size: 1rem;
    font-weight: 700;
    line-height: 250%;
    margin: 0;
  }
}

.my-mainvisual {
  text-align: center;
  margin-block: 2rem;
  img {
    max-width: 100%;
  }
}

.my-title01 {
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: 1.25rem;
  font-size: 2rem;
  font-weight: 500;
  line-height: 1.8;
  letter-spacing: 20%;
  margin-bottom: 1.88rem;
  &::after {
    content: '';
    display: block;
    width: 3.5625rem;
    height: 0.1875rem;
    background: #F78A23;
  }
}

.my-title02 {
  font-size: 1.25em;
  color: #F78A23;
  font-weight: 500;
  line-height: 2;
  margin-bottom: 1rem;
}

.my-title03 {
  font-size: 1.5em;
  color: #F78A23;
  font-weight: 700;
  line-height: 2;
  margin-bottom: 1.25rem;
  border-bottom: max(0.0625rem, 1px) solid #F78A23;
}

.my-hgroup01 {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  column-gap: 1.87rem;
  margin-bottom: 1rem;
  [lang="en"] {
    width: 100%;
    font-family: var(--font-crimson);
    font-size: 1rem;
    font-weight: 700;
    line-height: 2.5;
    color: #FF8000;
  }
  h2 {
    display: flex;
    column-gap: 0.5em;
    font-size: 2rem;
    font-weight: 500;
    line-height: 180%;
    letter-spacing: 20%;
    .-icon {
      width: 1.875rem;
      height: 1.875rem;
      margin-top: 0.5em;
    }
  }
  p {
    color: #657072;
    font-size: 1.5rem;
    line-height: 200%;
    margin: 0;
  }
}

.my-link01 {
  color: #F78A23;
  font-weight: 700;
  color: var(--, #F78A23);
  text-decoration-line: underline;
  text-decoration-style: solid;
  text-decoration-skip-ink: auto;
  text-decoration-thickness: auto;
  text-underline-offset: auto;
  text-underline-position: from-font;
  transition: opacity ease-out 0.7s;
  &:hover {
    opacity: 0.6;
  }
  &[target="_blank"] {
    &::after {
      content: '\F1C5';
      display: inline-block;
      font-family: bootstrap-icons;
      padding-inline: 0.25em;
    }
  }
}

.my-btn01 {
  display: inline-block;
  background: #F78A23;
  color: #FFFBF3;
  font-size: 2rem;
  font-weight: 700;
  line-height: 1;
  padding: 1.3125rem 3.125rem;
  border: 0.25rem solid #F78A23;
  border-radius: var(--border-radius-pill);
  box-shadow: 0 0.625rem 0 0 #FFC187;
  &.-external::after {
    content: '';
    display: inline-block;
    vertical-align: middle;
    width: 0.8125rem;
    height: 0.8125rem;
    background: url(../img/icon-external-w.svg) center / contain no-repeat;
    margin-left: 0.5em;
  }
}

.my-btn02 {
  --color: #70472E;
  display: inline-block;
  background: #FFFFFF;
  color: var(--color);
  font-size: 2rem;
  font-weight: 700;
  line-height: 1;
  padding: 1.3125rem 3.125rem;
  border: 0.25rem solid var(--color);
  border-radius: var(--border-radius-pill);
  box-shadow: 0 0.625rem 0 0 var(--color);
  &.-orange {
    --color: #FF824C;
  }
}

.my-btn03 {
  position: relative;
  display: inline-block;
  background: #FF824C;
  color: #fff;
  font-family: var(--font-kaku);
  font-size: 2rem;
  font-weight: 600;
  line-height: 1.8;
  padding: 0.25rem 5.625rem 0.25rem 2.5rem;
  border: 0.375rem solid #FF824C;
  border-radius: var(--border-radius-pill);
  box-shadow: 0 0.5rem 0 0 #00000040;
  &::after {
    content: '';
    position: absolute;
    inset: 0 1.65625rem 0 auto;
    margin-block: auto;
    width: 1.1875rem;
    height: 1.375rem;
    background: #fff;
    clip-path: polygon(0 0, 100% 50%, 0 100%);
  }
}

.my-btn04 {
  position: relative;
  display: inline-block;
  background: #fff;
  color: #10C080;
  font-family: var(--font-kaku);
  font-size: 2rem;
  font-weight: 600;
  line-height: 1.8;
  padding: 0.625rem 5.625rem 0.625rem 2.5rem;
  border-radius: var(--border-radius-pill);
  box-shadow: 0 0.5rem 0 0 #00000040;
  &::after {
    content: '';
    position: absolute;
    inset: 0 1.65625rem 0 auto;
    margin-block: auto;
    width: 1.1875rem;
    height: 1.375rem;
    background: #10C080;
    clip-path: polygon(0 0, 100% 50%, 0 100%);
  }
}

.my-btn05 {
  position: relative;
  display: inline-block;
  background: #DB750E;
  color: #fff;
  font-size: 2.5rem;
  font-weight: 500;
  letter-spacing: 20%;
  line-height: 1.8;
  padding: 0.25rem 5.625rem 0.25rem 2.5rem;
  border: 0.3125rem solid #DB750E;
  border-radius: var(--border-radius-pill);
  box-shadow: 0 0.4375rem 0 0 #CEB8A2;
  &::after {
    content: '';
    position: absolute;
    inset: 0 2rem 0 auto;
    margin-block: auto;
    width: 1.1875rem;
    height: 1.375rem;
    background: #fff;
    clip-path: polygon(0 0, 100% 50%, 0 100%);
  }
}

.my-btn06 {
  --color: #F78A23;
  position: relative;
  display: inline-block;
  background: var(--color);
  color: #fff;
  font-family: var(--font-kaku);
  font-size: 2rem;
  font-weight: 600;
  line-height: 1.8;
  padding: 0.25rem 5.625rem 0.25rem 2.5rem;
  border: 0.375rem solid var(--color);
  border-radius: var(--border-radius-pill);
  box-shadow: 0 0.5rem 0 0 #00000040;
  &.-blue {
    --color: #4FB1EF;
  }
  &.-green {
    --color: #10C080;
  }
  &::after {
    content: '';
    position: absolute;
    inset: 0 1.65625rem 0 auto;
    margin-block: auto;
    width: 1.1875rem;
    height: 1.375rem;
    background: #fff;
    clip-path: polygon(0 0, 100% 50%, 0 100%);
  }
}

.my-btn07 {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  width: 11.25rem;
  height: 3.25rem;
  background: #fff;
  color: #F78A23;
  border: max(0.0625rem, 1px) solid #fff;
  border-radius: var(--border-radius-pill);
  font-size: 1rem;
  letter-spacing: 0;
  padding-inline: 1.875rem;
  &.-contact {
    background: linear-gradient(90deg, #F78A23 0%, #FF6D31 100%);
    color: #fff;
    &::before {
      content: '';
      display: block;
      width: 0.875rem;
      height: 0.625rem;
      background: url(../img/icon-mail-w.svg) center / contain no-repeat;
    }
  }
}

.my-table01 {
  width: fit-content;
  background: #fff;
  border: max(0.0625rem, 1px) solid #F78A23;
  border-radius: 0.625rem;
  overflow: hidden;
  margin-bottom: 1rem;
  table {
    margin: max(-0.0625rem, -1px);
    th, td {
      padding: 0.63rem 1.25rem;
      border: max(0.0625rem, 1px) solid #F78A23;
    }
    th {
      thead & {
        text-align: center;
      }
      background: #FAEBD3;
      font-weight: 700;
    }
  }
}

.my-time01 {
  color: #657072;
  font-family: var(--font-crimson);
  font-size: 1rem;
  font-weight: 700;
  line-height: 250%;
}

.my-news_list {
  list-style: none;
  margin: 0;
  padding: 0;
  border-top: 0.1875rem solid #D9D9D9;
  display: flex;
  flex-direction: column;
  li {
    border-bottom: max(0.0625rem, 1px) solid #D9D9D9;
    a {
      --color: #E83940;
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 0.7rem 1.25rem;
      padding: 1.25rem 0;
      &.-color01 {
        --color: #E83940;
      }
      &.-color02 {
        --color: #6750A4;
      }
      &.-color03 {
        --color: #F78A23;
      }
      &:hover {
        color: #F78A23;
      }
      > time {
        color: #657072;
        font-family: var(--font-crimson);
        font-size: 1rem;
        font-weight: 700;
      }
      > small {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 7.875rem;
        height: 2rem;
        border-radius: var(--border-radius-pill);
        border: max(0.0625rem, 1px) solid var(--color);
        color: var(--color);
        font-size: 1rem;
        line-height: 1;
        letter-spacing: 5%;
        transition: all ease-out 0.3s;
        a:hover & {
          color: #fff;
          background: var(--color);
        }
      }
      > div {
        flex: 1;
        position: relative;
        padding-right: 3.75rem;
        &::after {
          content: '';
          position: absolute;
          inset: 0 1.25rem 0 auto;
          width: 1.875rem;
          height: 1.875rem;
          margin-block: auto;
          background: #F78A23 url(../img/icon-arrow-right-w.svg) center / 1.3125rem no-repeat;
          border-radius: 50%;
          transition: transform ease-out 0.3s;
        }
        a:hover > &::after {
          transform: translateX(0.625rem);
        }
      }
    }
  }
}

.my-event_list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  border-top: 0.1875rem solid #D9D9D9;
  li {
    padding-block: 1.25rem;
    border-bottom: max(0.0625rem, 1px) solid #D9D9D9;
    a {
      display: flex;
      gap: 2.5rem;
      &:hover {
        color: #F78A23;
      }
      .-img {
        width: 12.5rem;
        height: 9.375rem;
        background: #D9D9D9 url(../img/logo.png) center / 90% no-repeat;
        img {
          display: block;
          width: 12.5rem;
          height: 9.375rem;
          object-fit: cover;
        }
      }
      dl {
        flex: 1;
        dt {
          time {
            color: #657072;
            font-family: var(--font-crimson);
            font-size: 1rem;
            font-weight: 700;
            line-height: 250%;
          }
        }
        dd {
          position: relative;
          font-size: 1.5rem;
          padding-right: 4rem;
          &::after {
            content: '';
            position: absolute;
            inset: 0 1.5rem 0 auto;
            width: 1.875rem;
            height: 1.875rem;
            margin-block: auto;
            background: #F78A23 url(../img/icon-arrow-right-w.svg) center / 1.3125rem no-repeat;
            border-radius: 50%;
            transition: transform ease-out 0.3s;
          }
          a:hover &::after {
            transform: translateX(0.625rem);
          }
        }
      }
    }
  }
}

.my-menu_col2 {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  padding: 0;
  margin: 0;
  gap: 1.5rem;
  li {
    width: calc((100% - 1.5rem) / 2);
    overflow: hidden;
    border: max(0.0625rem, 1px) solid #F78A23;
    border-radius: 0.625rem;
    a {
      display: block;
      background: #FFF6ED;
      &:hover {
        background: #FF8000;
      }
      img {
        display: block;
        width: 100%;
        height: 6.875rem;
        object-fit: cover;
      }
      dl {
        padding: 1.25rem;
        dt {
          color: #F78A23;
          font-size: 1.5rem;
          a:hover & {
            color: #fff;
          }
        }
        dd {
          font-size: 1rem;
          letter-spacing: 0.5%;
          a:hover & {
            color: #fff;
          }
        }
      }
    }
  }
}

.my-menu_col5 {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1.25rem 0.62rem;
  li {
    position: relative;
    width: calc((100% - 0.62rem * 4) / 5);
    background: #fff;
    overflow: hidden;
    border-radius: 0.625rem;
    filter: drop-shadow(0 0 0.625rem #E7DACD);
    a {
      display: block;
      > img {
        display: block;
        width: 100%;
        height: 7.5rem;
        object-fit: cover;
      }
      dl {
        padding: 1.25rem 1.25rem 3rem 1.25rem;
        &::after {
          content: '';
          position: absolute;
          inset: auto auto 0.6rem 1.25rem;
          width: 1.875rem;
          height: 1.875rem;
          margin-block: auto;
          background: #F78A23 url(../img/icon-arrow-right-w.svg) center / 1.3125rem no-repeat;
          border-radius: 50%;
          transition: transform ease-out 0.3s;
        }
        a:hover &::after {
          transform: translateX(0.625rem);
        }
        dt {
          color: #F78A23;
          font-size: 1rem;
          letter-spacing: 5%;
        }
        dd {
          font-size: 1rem;
        }
      }
    }
  }
}

.my-qa01 {
  line-height: 1.7;
  dt {
    position: relative;
    background: #FFAC5D;
    color: #fff;
    font-weight: 700;
    padding: 0.4em 0.5em 0.4em 10rem;
    border-radius: 0.625rem 0.625rem 0 0;
    &::before {
      content: '';
      position: absolute;
      inset: 0.3125rem auto auto 3.75rem;
      width: 3.375rem;
      height: 3.125rem;
      background: url(../img/icon-q.svg) center / contain no-repeat;
    }
  }
  dd {
    position: relative;
    background: #FFFBF3;
    font-weight: 350;
    padding: 0.75em 0.5em 0.75em 10rem;
    border-radius: 0 0 0.625rem 0.625rem;
    &::before {
      content: '';
      position: absolute;
      inset: 1rem auto auto 3.75rem;
      width: 3.375rem;
      height: 3.125rem;
      background: url(../img/icon-a.svg) center / contain no-repeat;
    }
    + dt {
      margin-top: 3.125rem;
    }
  }
}

.my-qa02 {
  color: #5C331A;
  dt {
    position: relative;
    font-size: 2rem;
    padding: 2.5rem 3.75rem 1.875rem 8.125rem;
    background: url(../img/line01.svg) left top / auto 0.1875rem repeat-x;
    &::before {
      content: '';
      position: absolute;
      inset: 2.9375rem auto auto 3.75rem;
      width: 2.9375rem;
      height: 2.9375rem;
      background: url(../img/icon-q02.svg) center / contain no-repeat;
    }
  }
  dd {
    position: relative;
    padding: 0 3.75rem 0 8.125rem;
    &::before {
      content: '';
      position: absolute;
      inset: 0.125rem auto auto 3.75rem;
      width: 2.9375rem;
      height: 2.9375rem;
      background: url(../img/icon-a02.svg) center / contain no-repeat;
    }
    + dt {
      margin-top: 2.8125rem;
    }
  }
}

.my-infinite_gallery {
  position: relative;
  overflow: hidden;
  .-container {
    display: flex;
    width: max-content;
    img {
      display: block;
      width: auto;
      height: 21.875rem;
    }
  }
  &.-is_ready {
    .-container {
      animation: infinite_gallery 45s linear infinite;
      &.-reverse {
        animation-direction: reverse;
      }
    }
  }
}

@keyframes infinite_gallery {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(calc(-50%));
  }
}

.my-carousel01 {
  .-scroll {
    position: relative;
    > .-next {
      position: absolute;
      inset: 0 23.5625rem 0 auto;
      margin-block: auto;
      width: 4rem;
      height: 4rem;
      background: url(../img/btn-circle-right.svg) center / contain no-repeat;
      &::before {
        content: '';
        position: absolute;
        inset: 0;
        background: url(../img/btn-circle-right-hover.svg) center / contain no-repeat;
        opacity: 0;
        transition: opacity ease-out .3s;
      }
      .-type_a & {
        right: 18rem;
      }
      &:hover {
        &::before {
          opacity: 1;
        }
      }
    }
    > ul {
      list-style: none;
      display: flex;
      padding: 0 0 0.5rem;
      margin: 0;
      overflow-x: scroll;
      -ms-overflow-style: none;
      scrollbar-width: none;
      scroll-behavior: auto;
      &::-webkit-scrollbar {
        display: none;
      }
      .-type_a & {
        padding-inline: var(--padding-container);
      }
      > li {
        flex-shrink: 0;
        width: 37.5rem;
        margin-right: 5rem;
        background: #fff;
        border-radius: 0.625rem;
        box-shadow: 0.25rem 0.25rem 0.25rem 0 #00000040;
        .-type_a & {
          width: 47.5rem;
          margin-right: 1.875rem;
          box-shadow: none;
        }
        dl {
          padding: 1.25rem 2.25rem 2.25rem;
          dt {
            position: relative;
            text-align: center;
            padding-bottom: 0.625rem;
            margin-bottom: 0.625rem;
            &::after {
              content: '';
              position: absolute;
              inset: auto 0 0 0;
              margin-inline: auto;
              width: 100%;
              height: 0;
              border-bottom: 1px solid #F4E9E2;
            }
            .-type_a &::after {
              width: 82%;
            }
            .-human {
              display: inline-flex;
              align-items: center;
              min-height: 4rem;
              padding-left: 2.375rem;
              background: url(../img/icon-human.svg) center left / 1.75rem no-repeat;
              font-size: 1.25rem;
              line-height: 1.6;
              text-align: left;
              margin-bottom: 0.625rem;
            }
            .-voice {
              position: relative;
              display: inline-flex;
              flex-direction: column;
              justify-content: space-between;
              min-height: 5rem;
              padding-left: 6.25rem;
              line-height: 1.2;
              text-align: left;
              margin-bottom: 0.625rem;
              strong {
                font-size: 2rem;
                font-weight: inherit;
              }
              .-num {
                position: absolute;
                inset: 0 auto 0 0;
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: center;
                width: 6.25rem;
                font-family: var(--font-damion);
                font-size: 1.5rem;
                letter-spacing: 20%;
                color: #DCF3EB;
                i {
                  font-family: var(--font-dai);
                  font-size: 4rem;
                  font-weight: 600;
                  font-style: italic;
                  letter-spacing: 0;
                }
              }
              .-row1:empty::before {
                content: '　';
              }
              .-badge {
                display: inline-block;
                background: #10C080;
                color: #fff;
                padding-inline: 0.625rem;
                border-radius: 0.625rem;
                margin-right: 1.25rem;
              }
            }
            > strong {
              display: flex;
              justify-content: center;
              align-items: center;
              height: 6.25rem;
              font-family: var(--font-maru);
              font-size: 1.5rem;
              font-weight: 700;
              line-height: 1.7;
              white-space: nowrap;
              color: #F78A23;
              background: url(../img/bg-circle-color01.png) center / 100% 100% no-repeat;
              .-type_a & {
                white-space: normal;
                font-family: var(--font-kaku);
                font-size: 2rem;
              }
            }
          }
        }
        &.-color02 {
          dl dt > strong {
            color: #10C080;
            background-image: url(../img/bg-circle-color02.png);
          }
        }
        &.-color03 {
          dl dt > strong {
            color: #FF4362;
            background-image: url(../img/bg-circle-color03.png);
          }
        }
      }
    }
  }
  nav {
    display: flex;
    justify-content: center;
    gap: 3.75rem;
    margin-top: 5.625rem;
    > a {
      position: relative;
      width: 1.25rem;
      height: 1.25rem;
      background: #E4E4E4;
      border-radius: 50%;
      &::after {
        content: '';
        position: absolute;
        inset: -50%;
      }
      &.-active {
        background: #F78A23;
        .-type_a & {
          background: #10C080;
          transform: scaleX(2);
        }
      }
    }
  }
}

.my-header {
  display: flow-root;
  position: fixed;
  inset: 0 0 auto;
  background: #fff;
  border-top: 0.1875rem solid #FF8000;
  z-index: 11;
  .-link {
    &:hover {
      opacity: .7;
    }
  }
  > .my-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    padding-block: 0.625rem;
  }
  .my-header-title {
    .-logo {
      display: block;
      width: 12.625rem;
    }
  }
  .my-header-subnav {
    ul {
      list-style: none;
      padding: 0;
      margin: 0;
      display: flex;
      align-items: center;
      > li {
        position: relative;
        display: flex;
        align-items: center;
        + li:has(.-link)::before {
          content: '';
          position: absolute;
          inset: 0 auto 0 0;
          width: max(0.0625rem, 1px);
          height: 1.375rem;
          margin-block: auto;
          background: #657072;
        }
        .-link {
          display: inline-block;
          font-size: 1rem;
          color: #657072;
          padding-inline: 1.25rem;
        }
      }
    }
  }
  .my-header-menu {
    display: none;
    cursor: pointer;
    &::before {
      content: '\F479';
      display: flex;
      justify-content: center;
      align-items: center;
      width: 1.5em;
      height: 1.5em;
      font-family: bootstrap-icons;
      font-size: 1.5em;
      color: #FF8000;
    }
    #menu-toggle:checked ~ &::before {
      content: '\F62A';
    }
  }
  .my-header-nav {
    width: 100%;
    ul {
      list-style: none;
      padding: 0;
      margin: 0;
      display: flex;
      align-items: center;
      justify-content: space-between;
      width: 100%;
      margin-top: 1.5rem;
      .-link {
        display: block;
        font-size: 1.125rem;
        font-weight: 500;
        color: #70472E;
        line-height: 1;
      }
    }
  }
}

.my-main {
  display: flow-root;
  position: relative;
  overflow: hidden;
}

.my-footer {
  display: flow-root;
  font-size: 1.5rem;
  .my-footer-top {
    padding-block: 1.5rem;
    background: url(../img/footer-top-bg01.png) right center / contain no-repeat,
      linear-gradient(90deg, #FD9F41 0%, #FD8950 100%);
    .-txt {
      color: #fff;
      width: 26rem;
      p {
        margin: 0;
      }
      strong {
        font-size: 2rem;
        font-weight: 700;
        line-height: 1.8;
        letter-spacing: 0.4rem;
      }
    }
    .-btn {
      flex: 1;
      display: flex;
      justify-content: flex-end;
      align-items: center;
      gap: 1.87rem;
    }
  }
  .my-footer-bottom {
    padding-block: 6.25rem;
    .-link {
      &:hover {
        opacity: 0.7;
      }
    }
    .my-cols {
      flex-wrap: wrap;
      align-items: center;
      .my-footer-title {
        width: 20rem;
        .-logo {
          display: block;
          width: 15.4375rem;
          margin-bottom: 0.62rem;
        }
        p {
          font-size: 1rem;
          line-height: 2;
          margin: 0;
        }
      }
      .my-footer-nav {
        flex: 1;
        position: relative;
        padding-left: 5rem;
        &::before {
          content: '';
          position: absolute;
          inset: 0 auto 0 0;
          background: #657072;
          width: max(0.0625rem, 1px);
        }
        ul {
          list-style: none;
          display: flex;
          flex-wrap: wrap;
          gap: 2.8rem 2.5rem;
          .-link {
            display: block;
            line-height: 1;
            font-size: 1.125rem;
            font-weight: 500;
            color: #70472E;
          }
        }

      }
      .my-footer-subnav {
        display: flex;
        justify-content: space-between;
        width: 100%;
        border-top: max(0.0625rem, 1px) solid #657072;
        padding-top: 1.25rem;
        margin-top: 2.5rem;
        ul {
          list-style: none;
          display: flex;
          margin: 0;
          padding: 0;
          li + li::before {
            content: '／';
            padding-inline: 1em;
          }
          .-link {
            font-size: 1rem;
            color: #657072;
            line-height: 2;
          }
        }
        small {
          color: #657072;
          font-size: 1rem;
        }
      }
    }
  }
}

#home,
#subpage {
  .my-main {
    background: #FFF7EA;
  }
}

#home {
  .my-main {
    font-size: 1.5rem;
  }
}

#subpage {
  .my-main {
    padding-bottom: 5rem;
  }
}

#home-hero {
  background: url(../img/home-hero-bg01.jpg?v1) center / cover no-repeat;
  height: 35.375rem;
  overflow: hidden;
  [class^="-img"] {
    position: absolute;
  }
  .-img01 {
    width: 7.875rem;
    inset: 2.94rem 15rem auto auto;
  }
  .-img02 {
    width: 27.53125rem;
    inset: 17.75rem auto auto 5.87rem;
  }
  hgroup {
    margin-top: 8rem;
    h2 {
      font-family: var(--font-kaku);
      font-size: 2.5rem;
      font-weight: 600;
      line-height: 1.8;
      letter-spacing: 20%;
      margin-bottom: 1.25rem;
      small {
        font-size: 1.625rem;
      }
    }
    p {
      width: 28.5rem;
    }
  }
}

#home-sec01 {
  margin-top: -3.31rem;
  .my-cols {
    justify-content: space-between;
    [class^="-link"] {
      --color: #E83940;
      position: relative;
      display: block;
      width: 18.625rem;
      height: 11rem;
      padding: 1.25rem 0 0 7.94rem;
      border-radius: 0.625rem;
      border: 0.1875rem solid #FFF;
      background: url(../img/home-sec01-bg01a.png) right 0.63rem top 0.62rem / 2.25rem no-repeat,
        url(../img/home-sec01-bg01.jpg?v1) left center / contain no-repeat #FDEEEE;
      box-shadow: 0 0 0.625rem 0 #E7DACD;
      overflow: hidden;
      &:hover {
        transform: translateY(0.625rem);
      }
      &::after {
        content: '';
        position: absolute;
        inset: auto 0.63rem 2.31rem auto;
        width: 1.875rem;
        height: 1.875rem;
        border-radius: 50%;
        background: var(--color) url(../img/icon-arrow-right-w.svg) center / 1.3125rem no-repeat;
      }
      dl {
        dt {
          color: var(--color);
          font-family: var(--font-maru);
          font-size: 1.5rem;
          font-weight: 500;
          line-height: 130%;
          letter-spacing: 30%;
          margin-bottom: 0.62rem;
        }
        dd {
          width: 7.375rem;
          font-size: 1rem;
          letter-spacing: 5%;
        }
      }
    }
    .-link02 {
      --color: #0765B0;
      background: url(../img/home-sec01-bg02a.png) right 0.63rem top 0.62rem / 2.75rem no-repeat,
        url(../img/home-sec01-bg02.jpg?v1) left center / contain no-repeat #E2F1FE;
    }
    .-link03 {
      --color: #217E5C;
      background: url(../img/home-sec01-bg03a.png) right 0.75rem top 0.62rem / 1.75rem no-repeat,
        url(../img/home-sec01-bg03.jpg?v1) left center / contain no-repeat #EAF8EE;
    }
  }
}

#home-sec02 {
  padding-top: 3rem;
  .my-cols {
    gap: 1.5rem;
    li {
      flex: 1;
      a {
        display: block;
        &:hover {
          opacity: 0.7;
        }
        img {
          display: block;
          width: 100%;
        }
      }
    }
  }
}

#home-sec03,
#home-sec04,
#home-sec05,
#home-sec06,
#home-sec07,
#home-sec08,
#home-sec09 {
  padding-top: 6.25rem;
}

#home-sec06 {
  .my-cols {
    gap: 1.5rem;
    li {
      --color: #F78A23;
      --color-hover: #FFFBF3;
      --color-shadow: #FFC187;
      flex: 1;
      background: #fff;
      overflow: hidden;
      border-radius: 0.625rem;
      box-shadow: 0 0 0.625rem 0 #E7DACD;
      &.-color02 {
        --color: #198B69;
        --color-hover: #E9F2EF;
        --color-shadow: #97c4b6;
      }
      a {
        display: flex;
        img {
          display: block;
          width: 13.875rem;
        }
        dl {
          flex: 1;
          padding: 1.25rem;
          dt {
            color: var(--color);
            font-size: 1rem;
            letter-spacing: 0.5%;
            margin-bottom: 0.63rem;
          }
          dd {
            font-size: 1rem;
            letter-spacing: 0.5%;
            .-btn {
              background: var(--color);
              color: #FFF;
              font-size: 1rem;
              text-align: center;
              padding: 0.5rem 2.75rem;
              margin-top: 0.6rem;
              border-radius: var(--border-radius-pill);
              box-shadow: 0 0.3125rem 0 0 var(--color-shadow);
              transition: all ease-out 0.3s;
              a:hover & {
                background: var(--color-hover);
                color: var(--color);
                border: 0.125rem solid var(--color);
                box-shadow: none;
                transform: translateY(0.3125rem);
              }
            }
          }
        }
      }
    }
  }
}

#home-sec08 {
  .-box {
    background: url(../img/home-sec08-bg01.jpg?v1) center / cover no-repeat;
    height: 24.5rem;
    padding: 1.88rem;
    border-radius: 0.625rem;
    box-shadow: 0 0 0.625rem 0 rgba(0, 0, 0, 0.25);
    dl {
      dt {
        color: #F78A23;
        font-size: 2rem;
        font-weight: 700;
        line-height: 180%;
        letter-spacing: 20%;
        margin-bottom: 1.25rem;
      }
      dd {
        .-btn {
          margin-top: 1.25rem;
        }
      }
    }
  }
}

#home-sec09 {
  padding-bottom: 6.25rem;
  .my-cols {
    gap: 1.5rem;
    li {
      flex: 1;
      a {
        display: block;
        &:hover {
          opacity: 0.7;
        }
        figure {
          margin: 0;
          .-img {
            position: relative;
            &::before {
              content: '';
              position: absolute;
              inset: 0;
              width: 1.6875rem;
              height: 1.6875rem;
              margin: auto;
              background: url(../img/icon-play.svg) center / contain no-repeat;
            }
            img {
              display: block;
              width: 100%;
              height: 6.25rem;
              object-fit: cover;
              border-radius: 0.625rem;
            }
          }
          figcaption {
            margin: 0;
          }
        }
      }
    }
  }
}

#event_student {
  iframe {
    display: block;
    width: 100%;
    margin-top: 1.88rem;
  }
}

#contact-sec01 {
  .my-cols {
    flex-wrap: wrap;
    gap: 1.25rem;
    margin: 1.88rem 0 5rem 1.87rem;
    li {
      width: 27.5rem;
      height: 5.5rem;
      label {
        position: relative;
        cursor: pointer;
        display: flex;
        align-items: center;
        border-radius: 0.625rem;
        border: 0.1875rem solid #FFF;
        background: #FFF url(../img/icon-img-type05.png) 1.25rem center / 3.5rem no-repeat;
        box-shadow: 0 0 0.625rem 0 #E7DACD;
        width: 100%;
        height: 100%;
        padding-inline: 6rem 4rem;
        line-height: 1.5;
        letter-spacing: 5%;
        transition: all ease-out .3s;
        &.-type_education {
          background-image: url(../img/icon-img-type01.png);
        }
        &.-type_instrument {
          background-image: url(../img/icon-img-type02.png);
        }
        &.-type_turning {
          background-image: url(../img/icon-img-type03.png);
        }
        &.-type_used {
          background-image: url(../img/icon-img-type04.png);
        }
        input {
          display: none;
        }
        &::before,
        &::after {
          content: '';
          position: absolute;
          inset: 0 1.25rem 0 auto;
          margin-block: auto;
          border-radius: 50%;
        }
        &::before {
          width: 1.5rem;
          height: 1.5rem;
          background: #fff;
          border: 0.125rem solid #A8A8A8;
        }
        &::after {
          right: 1.75rem;
          width: 0.5rem;
          height: 0.5rem;
          background: #FAD1AA;
          opacity: 0;
          transition: opacity ease-out .3s;
        }
        &:hover {
          &::after {
            opacity: 1;
          }
        }
        &:has(:checked) {
          border-color: #F78A23;
          background-color: #FFF7EA;
          color: #F78A23;
          font-weight: 500;
          &::before {
            border-color: #F78A23;
          }
          &::after {
            right: 1.62rem;
            background: #F78A23;
            width: 0.75rem;
            height: 0.75rem;
            opacity: 1;
          }
        }
      }
    }
  }
}

@media (min-width: 980px) {
  .my-btn01 {
    &:hover {
      background: #FFFBF3;
      color: #F78A23;
      transform: translateY(0.625rem);
      box-shadow: 0 0 0 0 #FFC187;
      &.-external::after {
        background-image: url(../img/icon-external.svg);
      }
    }
  }

  .my-btn02 {
    &:hover {
      transform: translateY(0.625rem);
      box-shadow: 0 0 0 0 var(--color);
    }
  }

  .my-btn03 {
    &:hover {
      background: #fff;
      color: #FF824C;
      transform: translateY(0.5rem);
      box-shadow: 0 0 0 0 #00000040;
      &::after {
        background: #FF824C;
      }
    }
  }

  .my-btn04 {
    &:hover {
      background: #10C080;
      color: #fff;
      transform: translateY(0.5rem);
      box-shadow: 0 0 0 0 #00000040;
      &::after {
        background: #fff;
      }
    }
  }

  .my-btn05 {
    &:hover {
      background: #FEF8EF;
      color: #615C57;
      transform: translateY(0.4375rem);
      border-color: #615C57;
      box-shadow: 0 0 0 0 #CEB8A2;
      &::after {
        background: #615C57;
      }
    }
  }

  .my-btn06 {
    &:hover {
      background: #fff;
      color: var(--color);
      transform: translateY(0.5rem);
      box-shadow: 0 0 0 0 #00000040;
      &::after {
        background: var(--color);
      }
    }
  }

  .my-btn07 {
    &:hover {
      color: #F78A23;
      box-shadow: 0 0 1.25rem 0 #70472E;
    }
    &.-contact {
      &:hover {
        color: #fff;
      }
    }
  }

  .my-pc-none {
    display: none !important;
  }
}

@media (max-width: 979.98px) {
  :root {
    font-size: calc(100vw * 16 / 390);
  }

  body:has(#menu-toggle:checked) {
    overflow: hidden;
  }

  .my-pagetitle {
    background: url(../img/pagetitle-bg02-sp.svg) center / cover no-repeat,
      url(../img/pagetitle-bg01.png?v1) center / cover no-repeat;
    padding-block: 1.88rem;
    h2 {
      font-size: 1.75rem;
    }
  }

  .my-hgroup01 {
    h2 {
      font-size: 1.5rem;
      .-icon {
        margin-top: 0.3em;
      }
    }
    p {
      font-size: 1rem;
    }
  }

  .my-btn01 {
    font-size: 1.25rem;
    line-height: 1.8;
    padding: 0.875rem 1rem;
    border: 0;
    box-shadow: 0 0.25rem 0.25rem 0 #8A4C12;
  }

  .my-btn02 {
    font-size: 1.25rem;
    line-height: 1.8;
    padding: 0.625rem 1.25rem;
    border: 0;
    box-shadow: none;
    &.-sp-border {
      border: 0.125rem solid var(--color);
      box-shadow: 0 0.25rem 0 0 var(--color);
    }
  }

  .my-btn03 {
    font-size: 1.25rem;
    padding: 0.75rem 1.875rem;
    border: 0;
    box-shadow: none;
    &.-sp-shadow {
      box-shadow: 0 0.25rem 0 0 #00000040;
    }
    &::after {
      display: none;
    }
  }

  .my-btn04 {
    font-size: 1.25rem;
    padding: 0.75rem 1.875rem;
    border: 0;
    box-shadow: none;
    &::after {
      display: none;
    }
  }

  .my-btn05 {
    font-size: 1.25rem;
    padding-inline: 3.75rem 5.625rem;
    box-shadow: 0 0.1875rem 0 0 #CEB8A2;
    &::after {
      right: 3.75rem;
      width: 0.8125rem;
      height: 0.9375rem;
    }
  }

  .my-btn06 {
    font-size: 1.25rem;
    line-height: 1;
    padding: 0.75rem 3.75rem 0.75rem 1.875rem;
    border: 0;
    box-shadow: none;
    &::after {
      right: 1.875rem;
      width: 0.8125rem;
      height: 0.9375rem;
    }
  }

  .my-news_list {
    li {
      a {
        > div {
          flex: none;
          width: 100%;
        }
      }
    }
  }


  .my-event_list {
    li {
      a {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 0.5rem;
        dl {
          dt {
            time {
              color: #657072;
              font-family: var(--font-crimson);
              font-size: 1rem;
              font-weight: 700;
              line-height: 250%;
            }
          }
          dd {
            font-size: 1rem;
            padding-right: 3.75rem;
            &::after {
              right: 0.81rem;
            }
          }
        }
      }
    }
  }

  .my-menu_col2 {
    flex-direction: column;
    li {
      width: 100%;
    }
  }

  .my-menu_col5 {
    flex-direction: column;
    li {
      width: 100%;
      a {
        > img {
          height: 7.5rem;
        }
        dl {
          display: flex;
          gap: 1.25rem;
          padding: 1rem 3.5rem 1rem 1.25rem;
          &::after {
            inset: auto 1.25rem 1.13rem auto;
          }
        }
      }
    }
  }

  .my-qa01 {
    line-height: 2;
    dt {
      padding: 0.2em 0.5em 0.2em 3.125rem;
      &::before {
        inset: 0.25rem auto auto 0.8125rem;
        width: 1.6875rem;
        height: 1.6875rem;
      }
    }
    dd {
      padding: 0.875em 0.5em 0.875em 3.125rem;
      &::before {
        inset: 0.875rem auto auto 0.8125rem;
        width: 1.6875rem;
        height: 1.6875rem;
      }
      + dt {
        margin-top: 1.875rem;
      }
    }
  }

  .my-qa02 {
    dt {
      font-size: 1.25rem;
      padding: 1.5rem 0 0.625rem 2.625rem;
      &::before {
        inset: 1.5625rem auto auto 0;
        width: 2.3125rem;
        height: 2.3125rem;
      }
    }
    dd {
      padding: 0 0 0 2.625rem;
      &::before {
        inset: 0 auto auto 0;
        width: 2.3125rem;
        height: 2.3125rem;
      }
      + dt {
        margin-top: 1.5625rem;
      }
    }
  }

  .my-carousel01 {
    .-scroll {
      > .-next {
        right: 1.625rem;
        width: 2.625rem;
        height: 2.625rem;
        &:hover {
          &::before {
            opacity: 0;
          }
        }
      }
      > ul {
        .-type_a & {
          flex-direction: column;
          gap: 1.25rem;
        }
        > li {
          width: 19.375rem;
          margin-right: 1.875rem;
          &:nth-child(1) {
            margin-left: -1.6rem;
          }
          .-type_a & {
            width: 100%;
            margin: 0;
          }
          dl {
            padding: 1.25rem;
            dt {
              .-type_a &::after {
                width: 100%;
                border-bottom: 2px dashed #10C080
              }
              .-human {
                min-height: 3.25rem;
                padding-left: 2.6875rem;
                background-size: 1.75rem;
                font-size: 1rem;
              }
              .-voice {
                min-height: 5rem;
                padding: 0.8rem 0 0;
                margin-bottom: 1rem;
                strong {
                  font-size: 1.5rem;
                }
                .-num {
                  inset: 0 auto auto 0;
                  display: block;
                  width: auto;
                  font-size: 1.25rem;
                  letter-spacing: 10%;
                  span {
                    position: absolute;
                    inset: 0.7em auto auto 0;
                    color: #AADFBE;
                    z-index: 1;
                  }
                  i {
                    font-size: 3rem;
                    padding-left: 0.65em;
                  }
                }
                .-row1 {
                  padding-left: 7.125rem;
                }
                .-badge {
                  font-size: 1rem;
                  font-weight: 700;
                  text-align: center;
                  line-height: 2;
                  min-width: 8.125rem;
                  padding-inline: 0.3125rem;
                  margin-right: 0.625rem;
                }
              }
              > strong {
                height: 4.6875rem;
                font-size: 1rem;
                font-weight: 500;
                letter-spacing: 0;
                .-type_a & {
                  height: auto;
                  font-size: 1rem;
                  font-weight: 700;
                  letter-spacing: 10%;
                  line-height: 1.8;
                  text-align: left;
                  background: none;
                }
              }
            }
            dd {
              .-type_a & {
                position: relative;
                overflow: hidden;
                max-height: 8rem;
                transition: max-height ease-out 0.3s;
                &::after {
                  content: '';
                  position: absolute;
                  inset: auto 0 0 0;
                  height: 5rem;
                  background: linear-gradient(to bottom, rgba(255,255,255,0), rgba(255,255,255,1));
                }
                .-show & {
                  max-height: 50rem;
                  &::after {
                    display: none;
                  }
                }
              }
            }
          }
          .-collapse {
            display: block;
            padding-block: 0 1.25rem;
            color: #10C080;
            > span {
              position: relative;
              display: flex;
              align-items: center;
              justify-content: space-between;
              width: 40%;
              margin-inline: auto;
              font-weight: 700;
              line-height: 1;
              &::before {
                content: '続きを読む';
              }
              &::after {
                content: '';
                width: 0.6875rem;
                height: 0.6875rem;
                background: url(../img/icon-arrow-down-g.svg) center / contain no-repeat;
              }
            }
            .-show & {
              > span {
                &::before {
                  content: '閉じる';
                }
                &::after {
                  background-image: url(../img/icon-arrow-up-g.svg);
                }
              }
            }
          }
        }
      }
    }
    nav {
      gap: 1.5rem;
      margin-top: 3.75rem;
      > a {
        position: relative;
        width: 0.625rem;
        height: 0.625rem;
      }
    }
    .-more {
      display: block;
      padding: 0.5rem 1.25rem;
      margin: 1.25rem var(--padding-container) 0;
      background: #10C080;
      color: #fff;
      border-radius: 0.625rem;
      > span {
        position: relative;
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        height: 1.875rem;
        font-weight: 700;
        line-height: 1;
        padding-inline: 1em;
        border-top: 2px dashed #fff;
        border-bottom: 2px dashed #fff;
        &::before {
          content: '先輩たちの声をもっと読む';
        }
        &::after {
          content: '';
          width: 0.6875rem;
          height: 0.6875rem;
          background: url(../img/icon-arrow-down-w.svg) center / contain no-repeat;
        }
      }
      .-open & {
        background: #fff;
        color: #10C080;
        > span {
          border-color: #10C080;
          &::before {
            content: '先輩たちの声を閉じる';
          }
          &::after {
            background-image: url(../img/icon-arrow-up-g.svg);
          }
        }
      }
    }
  }

  .my-sp-none {
    display: none !important;
  }

  .my-header {
    .my-header-title {
      .-logo {
        width: 12.625rem;
      }
    }
    .my-header-subnav {
      display: none;
    }
    .my-header-menu {
      display: block;
    }
    .my-header-nav {
      display: none;
    }
    &:has(#menu-toggle:checked) {
      .my-header-logo,
      .my-header-menu {
        z-index: 11;
      }
      .my-header-nav {
        position: fixed;
        inset: 4rem 0 0;
        background: #F78A23;
        display: flex;
        justify-content: center;
        z-index: 10;
        ul {
          display: flex;
          flex-direction: column;
          align-items: center;
          justify-content: flex-start;
          gap: 3rem;
          margin-top: 3rem;
          .-link {
            color: #fff;
          }
        }
      }
    }
  }

  .my-footer {
    font-size: 1rem;
    .my-footer-top {
      padding-block: 1.88rem;
      background: linear-gradient(0deg, #FD9F41 0%, #FD8950 100%);
      .my-cols {
        display: block;
      }
      .-txt {
        width: 100%;
        strong {
          font-size: 1.5rem;
          font-weight: 700;
          letter-spacing: 0.3rem;
        }
      }
      .-btn {
        flex-direction: column;
        justify-content: center;
        gap: 1.88rem;
        margin-top: 1.88rem;
      }
    }
    .my-footer-bottom {
      .my-cols {
        flex-direction: column;
        .my-footer-title {
          width: 100%;
          .-logo {
            margin-inline: auto;
          }
          p {
            text-align: center;
            font-size: 1rem;
            line-height: 2;
            margin: 0;
          }
        }
        .my-footer-nav {
          display: none;
        }
        .my-footer-subnav {
          flex-direction: column;
          align-items: center;
          small {
            margin-top: 3em;
            font-size: 0.75rem;
          }
        }
      }
    }
  }

  #home {
    .my-main {
      font-size: 1rem;
    }
  }

  #home-hero {
    background-image: url(../img/home-hero-bg01-sp.jpg?v1);
    height: 37.8125rem;
    .-img01 {
      inset: 3rem -2.44rem auto auto;
    }
    .-img02 {
      inset: 24.25rem auto auto -10.06rem;
    }
    hgroup {
      margin-top: 18rem;
      h2 {
        font-size: 2rem;
      }
      p {
        width: 100%;
      }
    }
  }

  #home-sec01 {
    margin-top: 2.5rem;
    .my-cols {
      flex-direction: column;
      justify-content: normal;
      align-items: center;
      gap: 1.88rem;
    }
  }

  #home-sec02 {
    .my-cols {
      flex-direction: column;
    }
  }

  #home-sec06 {
    .my-cols {
      flex-direction: column;
      li {
        flex: 1;
        a {
          flex-direction: column;
          img {
            width: 100%;
          }
          dl {
            dd {
              .-btn {
                width: 12.875rem;
                margin-inline: auto;
              }
            }
          }
        }
      }
    }
  }


  #home-sec08 {
    .-box {
      background: #fff url(../img/home-sec08-bg01-sp.jpg?v1) center top / contain no-repeat;
      height: auto;
      padding: 20.2rem 1.25rem 1.25rem;
      dl {
        dd {
          .-btn {
            text-align: center;
          }
        }
      }
    }
  }

  #home-sec09 {
    .my-cols {
      flex-direction: column;
    }
  }

  #contact-sec01 {
    .my-cols {
      flex-direction: column;
      margin-left: 0;
      li {
        width: 100%;
        label {
          background-size: 2.5rem;
          background-position-x: 0.6rem;
          padding-inline: 3.5rem 2.5rem;
          letter-spacing: 0;
        }
      }
    }
  }
}