@charset "UTF-8";
/* Scss Document */
body {
  overflow-x: clip; }

/* ---------------------------------------
KV intro
--------------------------------------- */
body.home:not(.intro-start) #header .logo,
body.home:not(.intro-start) #header .entryStatus,
body.home:not(.intro-start) #header .navToggle {
  opacity: 0;
  translate: 0 -5rem; }

body.home:not(.intro-start) .kvTtl img {
  opacity: 0; }

body.home:not(.intro-start) .kvScroll {
  opacity: 0;
  translate: -7rem 0; }

body.home:not(.intro-start) .kvNews {
  opacity: 0;
  translate: 0 7rem; }

body.home:not(.intro-start) .fixedNav {
  opacity: 0;
  translate: 7rem 0; }

body.home.intro-start #header .logo,
body.home.intro-start #header .entryStatus,
body.home.intro-start #header .navToggle {
  animation: kvHeaderIn 0.8s cubic-bezier(0.25, 1, 0.5, 1) both; }

body.home.intro-start .kvTtl img {
  animation: kvTitleBounceInDown 1.25s both;
  animation-delay: .15s; }

body.home.intro-start .kvScroll {
  animation: kvScrollIn 0.8s cubic-bezier(0.25, 1, 0.5, 1) both;
  animation-delay: .4s; }

body.home.intro-start .kvNews {
  animation: kvNewsIn 0.8s cubic-bezier(0.25, 1, 0.5, 1) both;
  animation-delay: .5s; }

body.home.intro-start .fixedNav {
  animation: fixedNavIn 0.8s cubic-bezier(0.25, 1, 0.5, 1) both;
  animation-delay: .6s; }

@keyframes kvHeaderIn {
  0% {
    opacity: 0;
    translate: 0 -5rem; }
  100% {
    opacity: 1;
    translate: 0 0; } }
@keyframes kvScrollIn {
  0% {
    opacity: 0;
    translate: -7rem 0; }
  100% {
    opacity: 1;
    translate: 0 0; } }
@keyframes kvNewsIn {
  0% {
    opacity: 0;
    translate: 0 7rem; }
  100% {
    opacity: 1;
    translate: 0 0; } }
@keyframes fixedNavIn {
  0% {
    opacity: 0;
    translate: 7rem 0; }
  100% {
    opacity: 1;
    translate: 0 0; } }
@keyframes kvTitleBounceInDown {
  0% {
    opacity: 0;
    translate: 0 -100vh;
    scale: 1 1.5; }
  60% {
    opacity: 1;
    translate: 0 2.5rem;
    scale: 1 .92; }
  75% {
    translate: 0 -1.2rem;
    scale: 1 1.03; }
  90% {
    translate: 0 .6rem;
    scale: 1 .99; }
  100% {
    opacity: 1;
    translate: 0 0;
    scale: 1; } }
/* ---------------------------------------
共通
--------------------------------------- */
.ttlBox {
  position: relative;
  width: clamp(42rem, calc(10.8695652174vw + 31.1304347826rem), 52rem);
  aspect-ratio: 520 / 280;
  padding: 2rem 4rem;
  background: url("../img/home/ttlBg_blue.png") center/contain no-repeat;
  margin-left: -7rem; }
  .ttlBox .ttl {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 12rem;
    margin-left: 1rem;
    padding: .8rem 2.5rem;
    background: #fff;
    border: 3px solid #4A7CC9;
    border-radius: 10rem;
    color: #4A7CC9;
    font-size: clamp(2rem, 1.8vw, 3.2rem);
    font-weight: 700;
    line-height: 1; }
  .ttlBox .deco {
    margin-top: 1vw;
    padding-left: clamp(2rem, calc(2.1739130435vw + -0.1739130435rem), 4rem);
    color: #fff;
    font-size: clamp(8rem, calc(2.1739130435vw + 5.8260869565rem), 10rem);
    line-height: 1; }
  .ttlBox.orange {
    background-image: url("../img/home/ttlBg_orange.png"); }
    .ttlBox.orange .ttl {
      border-color: #F4BF12;
      color: #F4BF12; }
  .ttlBox.purple {
    background-image: url("../img/home/ttlBg_purple.png"); }
    .ttlBox.purple .ttl {
      border-color: #A65EB0;
      color: #A65EB0; }
  .ttlBox.yellow {
    background-image: url("../img/home/ttlBg_yellow.png"); }
    .ttlBox.yellow .ttl {
      border-color: #F4BF12;
      color: #F4BF12; }
  .ttlBox.white {
    width: auto;
    aspect-ratio: auto;
    padding: 0;
    margin-left: 0;
    background: none; }
    .ttlBox.white .ttl {
      display: block;
      min-width: 0;
      margin-left: 0;
      padding: 0;
      background: none;
      border: none;
      border-radius: 0;
      color: #fff;
      line-height: 1.5;
      font-size: clamp(3.2rem, calc(0.8695652174vw + 2.3304347826rem), 4rem); }
    .ttlBox.white .deco {
      margin-top: .5rem;
      padding-left: 0;
      color: #fff;
      font-size: clamp(8rem, calc(2.1739130435vw + 5.8260869565rem), 10rem); }
  .ttlBox.ttlCenter {
    text-align: center; }
  @media (max-width: 999px) {
    .ttlBox {
      width: min(100%, 38rem);
      padding: 1.5rem 3rem;
      max-width: 30rem; }
      .ttlBox .ttl {
        min-width: 9rem;
        margin-left: 0;
        padding: .6rem 1.8rem;
        border-width: 2px;
        font-size: 2rem; }
      .ttlBox .deco {
        margin-top: 1rem;
        padding-left: 2.5rem;
        font-size: 5rem; }
      .ttlBox.white {
        width: auto;
        padding: 0; }
        .ttlBox.white .ttl {
          min-width: 0;
          padding: 0;
          font-size: 1.4rem; }
        .ttlBox.white .deco {
          margin-top: .5rem;
          padding-left: 0;
          font-size: 5rem; } }

.leadBox {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: clamp(4rem, calc(4.347826087vw + -0.347826087rem), 8rem); }
  .leadBox .ttlBox {
    flex-shrink: 0; }
  .leadBox .txt {
    width: 100%;
    max-width: 85rem;
    font-size: clamp(1.6rem, calc(0.4347826087vw + 1.1652173913rem), 2rem);
    line-height: 2; }
  @media (max-width: 999px) {
    .leadBox {
      display: block; }
      .leadBox .ttlBox {
        margin: 0 auto 3rem; }
      .leadBox .txt {
        max-width: none;
        font-size: 1.4rem; } }

.catchTtl {
  position: relative;
  display: flex;
  align-items: center;
  width: fit-content;
  padding: 0 2.5rem;
  color: #fff; }
  .catchTtl::before, .catchTtl::after {
    content: "";
    position: absolute;
    top: 50%;
    width: 1.6rem;
    height: 3rem;
    background: url("../img/ico_kakko_white.svg") center/contain no-repeat;
    transform: translateY(-50%); }
  .catchTtl::before {
    left: 0; }
  .catchTtl::after {
    right: 0;
    transform: translateY(-50%) scaleX(-1); }
  @media (max-width: 999px) {
    .catchTtl {
      padding: 0 2rem; }
      .catchTtl::before, .catchTtl::after {
        width: 1.4rem;
        height: 2.6rem; } }

/* ---------------------------------------
メインビジュアル
--------------------------------------- */
#kv {
  position: fixed;
  z-index: 0;
  width: 100%;
  height: 100vh;
  min-height: 72rem;
  overflow: hidden;
  --forest-left-x:0px;
  --forest-right-x:0px; }
  #kv .kvMovie {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    pointer-events: none; }
  #kv .kvDeco {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 4;
    width: 100%;
    height: auto;
    pointer-events: none; }
  #kv .kvTtl {
    position: absolute;
    top: 20%;
    left: 50%;
    z-index: 5;
    width: clamp(56rem, 34vw, 70rem);
    transform: translateX(-50%); }
    #kv .kvTtl img {
      display: block;
      width: 100%;
      height: auto; }
  @media (max-width: 999px) {
    #kv {
      height: calc(100vw * 1216 / 750);
      min-height: 0;
      max-height: 72rem; }
      #kv .kvMovie {
        object-position: center top; }
      #kv .kvDeco {
        width: 100%; }
      #kv .kvTtl {
        top: 18rem;
        width: 82%;
        max-width: 48rem; } }

.spNewsArea {
  display: none; }
  @media (max-width: 999px) {
    .spNewsArea {
      position: relative;
      display: block;
      padding: 0 2rem 0; }
      .spNewsArea__deco {
        position: absolute;
        top: -28rem;
        left: 0;
        z-index: 1;
        display: block;
        width: 100%;
        height: auto;
        max-width: none;
        pointer-events: none;
        max-width: 2000%;
        width: auto;
        height: 70rem;
        margin: 0 auto;
        left: 50%;
        transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%); }
      .spNewsArea__box {
        position: relative;
        z-index: 2;
        width: 100%;
        padding: 1.6rem 2rem 1.8rem;
        margin: 0 auto;
        background: #fff;
        border-radius: 3rem;
        max-width: 42rem; }
      .spNewsArea__ttl {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: .8rem;
        margin-bottom: 1rem;
        color: #2DA338;
        font-size: 1.6rem; }
        .spNewsArea__ttl i {
          font-size: 1.8rem; }
      .spNewsArea__item {
        display: block;
        color: #333;
        text-decoration: none; }
        .spNewsArea__item:not(:last-child) {
          margin-bottom: 1rem; }
        .spNewsArea__item time {
          display: block;
          margin-bottom: .4rem;
          font-size: 1.2rem;
          line-height: 1.5; }
        .spNewsArea__item span {
          display: block;
          font-size: 1.4rem;
          font-weight: 700;
          line-height: 1.65; } }

.kvScroll {
  position: absolute;
  left: 0;
  bottom: 4rem;
  z-index: 6;
  width: clamp(18rem, 16vw, 32rem);
  height: auto;
  pointer-events: none; }
  .kvScroll__deco {
    position: relative;
    z-index: 3;
    display: block;
    width: 100%;
    height: auto; }
  .kvScroll__spiderArea {
    position: absolute;
    top: 18%;
    right: 5%;
    width: 34%;
    height: 65%; }
  .kvScroll__thread {
    position: absolute;
    top: 0;
    left: 50%;
    z-index: 1;
    width: 1px;
    height: 4rem;
    background: #333;
    transform: translateX(-50%);
    animation: spiderThread 3s ease-in-out infinite; }
  .kvScroll__spider {
    position: absolute;
    top: 4rem;
    left: 50%;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 7rem;
    transform: translateX(-50%);
    animation: spiderMove 3s ease-in-out infinite; }
    .kvScroll__spider img {
      display: block;
      width: 100%;
      height: auto; }
  .kvScroll__text {
    margin-top: 1rem;
    font-size: 1.6rem;
    line-height: 1;
    writing-mode: vertical-rl; }
  @media (max-width: 999px) {
    .kvScroll {
      display: none; } }

@keyframes spiderMove {
  0%,
    100% {
    top: 4rem; }
  50% {
    top: 8rem; } }
@keyframes spiderThread {
  0%,
    100% {
    height: 4rem; }
  50% {
    height: 8rem; } }
body.home.intro-start #home00 .kvBird {
  animation: kvBirdMove 5s ease-in-out infinite;
  animation-delay: 1.2s; }

@keyframes kvBirdMove {
  0%,12% {
    translate: 0 0;
    rotate: 0deg; }
  16% {
    translate: 0 -.8rem;
    rotate: -3deg; }
  20% {
    translate: 0 .1rem;
    rotate: 2deg; }
  24% {
    translate: 0 -.45rem;
    rotate: -2deg; }
  28% {
    translate: 0 0;
    rotate: 0deg; }
  34% {
    rotate: 4deg; }
  40% {
    rotate: -2deg; }
  46%,100% {
    translate: 0 0;
    rotate: 0deg; } }
#home00 {
  --forest-left-x:0px;
  --forest-right-x:0px; }
  #home00 .kvForest {
    position: absolute;
    left: 0;
    right: 0;
    bottom: -64vw;
    z-index: 3;
    height: 82vw;
    max-height: 150rem;
    overflow: hidden;
    pointer-events: none; }
  #home00 .kvForest__left,
  #home00 .kvForest__right {
    position: absolute;
    top: 0;
    display: block;
    width: auto;
    height: 118%;
    max-width: none;
    will-change: transform; }
  #home00 .kvForest__left {
    left: -15%;
    transform: translate3d(var(--forest-left-x), 0, 0); }
  #home00 .kvForest__right {
    right: -10%;
    transform: translate3d(var(--forest-right-x), 0, 0); }
  @media (max-width: 999px) {
    #home00 .kvForest {
      position: absolute;
      left: 0;
      right: 0;
      bottom: -180vw;
      z-index: 8;
      height: 122vw;
      pointer-events: none;
      overflow-x: clip; } }

#home00 {
  height: 100vh; }
  #home00 .kvBird {
    position: absolute;
    right: 10%;
    bottom: 8%;
    z-index: 5;
    width: clamp(12rem, 8vw, 18rem);
    height: auto;
    transform-origin: 50% 90%; }
  #home00 .kvNews {
    position: absolute;
    left: 50%;
    bottom: 6rem;
    z-index: 6;
    display: flex;
    align-items: flex-start;
    gap: 4rem;
    width: min(56vw, 110rem);
    min-height: 11rem;
    padding: 2.5rem 4rem;
    background: #fff;
    border-radius: 10rem;
    transform: translateX(-50%); }
  #home00 .kvNews__ttl {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-top: .25vw;
    color: #2DA338;
    font-size: 1.8rem;
    line-height: 1; }
    #home00 .kvNews__ttl i {
      font-size: 2rem; }
  #home00 .kvNews__list {
    flex: 1; }
  #home00 .kvNews__item {
    display: grid;
    grid-template-columns: 8rem minmax(0, 1fr);
    gap: 2rem;
    color: #333;
    font-size: 1.8rem;
    line-height: 1.6; }
    #home00 .kvNews__item:not(:last-child) {
      margin-bottom: 1rem; }
    #home00 .kvNews__item time {
      white-space: nowrap; }
    #home00 .kvNews__item span {
      font-weight: 700;
      transition: all .3s; }
    #home00 .kvNews__item:hover {
      opacity: 1; }
      #home00 .kvNews__item:hover span {
        color: #2DA338; }
  @media (max-width: 999px) {
    #home00 {
      height: 80vh; }
      #home00 .kvBird {
        right: 4%;
        bottom: 13%;
        width: 8rem; } }

body.home.intro-done .kvNews {
  animation: none;
  translate: 0 0; }

/* ---------------------------------------
home01
--------------------------------------- */
#home01 {
  position: relative;
  padding-bottom: 12rem;
  -webkit-mask-image: url("../img/home/01_wave_top.svg");
  mask-image: url("../img/home/01_wave_top.svg");
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: top center;
  mask-position: top center;
  -webkit-mask-size: cover;
  mask-size: cover;
  /* 上中央 */
  /* キャラクター・雲 共通 */ }
  #home01 .home01Scene {
    position: relative;
    width: 100%;
    max-width: 1920px;
    margin: 0 auto;
    aspect-ratio: 1920 / 1080;
    container-type: inline-size; }
  #home01 .home01Copy {
    position: absolute;
    z-index: 1;
    top: 47%;
    left: 50%;
    width: 100%;
    transform: translateX(-50%);
    text-align: center;
    color: #fff; }
  #home01 .ttl {
    margin: 0 0 2.5cqw;
    font-size: clamp(4.2rem, 2.55vw, 5.2rem);
    line-height: 1.5;
    letter-spacing: .04em; }
  #home01 .txt {
    margin: 0;
    font-size: clamp(1.8rem, 1.05cqw, 2rem);
    line-height: 2;
    font-weight: 700; }
  #home01 .ico01 {
    position: absolute;
    z-index: 1;
    top: 14%;
    left: 60%;
    width: 18%;
    height: auto;
    transform: translateX(-50%); }
  #home01 .home01Characters,
  #home01 .home01Clouds {
    position: absolute;
    inset: 0;
    pointer-events: none; }
    #home01 .home01Characters img,
    #home01 .home01Clouds img {
      position: absolute;
      display: block;
      height: auto; }
  #home01 .home01Characters {
    z-index: 1; }
  #home01 .home01Clouds {
    z-index: 1; }
  #home01 .ico02 {
    top: 42%;
    left: 5%;
    width: 10%; }
  #home01 .ico03 {
    top: 77%;
    left: 12%;
    width: 14%; }
  #home01 .ico04 {
    top: 70%;
    right: 7%;
    width: 12%; }
  #home01 .cloud01 {
    top: 18%;
    left: 23%;
    width: 5.5%; }
  #home01 .cloud02 {
    top: 11%;
    left: 34%;
    width: 3.5%; }
  #home01 .cloud03 {
    top: 26%;
    right: 21%;
    width: 7%; }
  @media (max-width: 999px) {
    #home01 {
      padding-bottom: 12rem;
      padding-top: 12rem; }
      #home01 .home01Scene {
        width: 100%;
        max-width: none;
        aspect-ratio: auto;
        padding: 15rem 0 18rem; }
      #home01 .inner16 {
        position: relative;
        z-index: 5; }
      #home01 .home01Copy {
        position: relative;
        top: auto;
        left: auto;
        width: 100%;
        padding: 0 3rem;
        transform: none;
        text-align: center;
        color: #fff; }
      #home01 .ttl {
        margin: 0 0 2rem;
        font-size: clamp(2rem, calc(1.6025641026vw + 1.3990384615rem), 3rem);
        line-height: 1.6; }
      #home01 .txt {
        margin: 0;
        font-size: clamp(1.4rem, calc(0.641025641vw + 1.1596153846rem), 1.8rem);
        line-height: 2;
        font-weight: 700; }
      #home01 .ico01 {
        top: 4rem;
        left: auto;
        right: 5rem;
        width: 10rem;
        transform: none; }
      #home01 .ico02 {
        top: 4rem;
        left: 5rem;
        width: 5rem; }
      #home01 .ico03 {
        top: auto;
        bottom: 8rem;
        left: 3rem;
        width: 8rem; }
      #home01 .ico04 {
        top: auto;
        right: 3rem;
        bottom: 8rem;
        width: 7rem; }
      #home01 .home01Clouds {
        display: none; } }

#home01 .home01Chara {
  opacity: 0;
  translate: 0 -3rem;
  scale: .8; }
  #home01 .home01Chara.is-show {
    animation: home01CharaPoyon 0.8s cubic-bezier(0.34, 1.56, 0.64, 1) forwards; }

@keyframes home01CharaPoyon {
  0% {
    opacity: 0;
    translate: 0 -3rem;
    scale: .8; }
  45% {
    opacity: 1;
    translate: 0 .6rem;
    scale: 1.08 .94; }
  65% {
    translate: 0 -.5rem;
    scale: .97 1.04; }
  82% {
    translate: 0 .2rem;
    scale: 1.02 .99; }
  100% {
    opacity: 1;
    translate: 0 0;
    scale: 1; } }
/* ---------------------------------------
home02
--------------------------------------- */
#home02 {
  position: relative;
  z-index: 1;
  padding: 0 clamp(2rem, 4vw, 8rem);
  /* 全体ステージ */
  /* 共通 */
  /* 学ぶ */
  /* 触れ合う・育む 共通 */
  /* 知る */
  /* SP */ }
  #home02 .deco {
    position: absolute;
    top: -12rem;
    left: 50%;
    width: 100%;
    height: auto;
    transform: translateX(-50%); }
  #home02 .home02Scene {
    position: relative;
    width: 100%;
    max-width: 1920px;
    margin: 0 auto;
    aspect-ratio: 1920 / 1240;
    top: -12rem;
    background: url("../img/home/02_bgDeco_01.png") center bottom/100% auto no-repeat; }
    @media (max-width: 999px) {
      #home02 .home02Scene {
        background: url("../img/home/02_bgDeco_01_sp.png") center bottom/100% auto no-repeat; } }
  #home02 .home02Item {
    position: absolute;
    z-index: 2; }
  #home02 .home02Btn {
    position: relative;
    z-index: 3;
    display: block;
    transition: transform .3s ease; }
    #home02 .home02Btn img {
      display: block;
      width: 100%;
      height: auto; }
  #home02 .home02Illust {
    position: relative;
    display: block;
    width: 100%;
    height: auto;
    pointer-events: none; }
  #home02 .home02Item--learn {
    top: 0;
    left: 50%;
    width: 30%;
    transform: translateX(-50%); }
    #home02 .home02Item--learn .home02Btn {
      width: 80%;
      max-width: 40rem;
      margin: 0 auto; }
    #home02 .home02Item--learn .home02Illust {
      width: 90%;
      margin: 1% auto 0; }
  #home02 .home02Item--touch,
  #home02 .home02Item--grow {
    top: 29%;
    width: 31%; }
    #home02 .home02Item--touch .home02Btn,
    #home02 .home02Item--grow .home02Btn {
      width: 72%;
      max-width: 40rem;
      margin: 0 auto; }
    #home02 .home02Item--touch .home02Illust,
    #home02 .home02Item--grow .home02Illust {
      width: 100%;
      margin-top: -1%; }
  #home02 .home02Item--touch {
    left: 5%; }
  #home02 .home02Item--grow {
    right: 5%; }
  #home02 .home02Item--know {
    top: 43%;
    left: 50%;
    width: 25%;
    transform: translateX(-50%); }
    #home02 .home02Item--know .home02Btn {
      width: 96%;
      max-width: 40rem;
      margin: 0 auto; }
    #home02 .home02Item--know .home02Illust {
      width: 63%;
      margin: 6% auto 0; }
  @media (max-width: 999px) {
    #home02 {
      padding: 0 0 0;
      margin-top: 7rem;
      /* absolute解除 */
      /* 学ぶ */
      /* 触れ合う・育む */
      /* 触れ合う */
      /* 知る */ }
      #home02 .deco {
        top: -2rem;
        z-index: 2; }
      #home02 .home02Scene {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 2rem 1rem;
        width: 100%;
        max-width: none;
        aspect-ratio: auto;
        padding: 0rem 2rem 12rem;
        background-position: center 12rem;
        background-size: auto 100%;
        margin-top: -9rem; }
      #home02 .home02Item {
        position: relative;
        inset: auto;
        width: 100%;
        transform: none; }
      #home02 .home02Item--learn {
        grid-column: 1 / -1; }
        #home02 .home02Item--learn .home02Btn {
          width: 80%;
          max-width: 30rem;
          margin: 0 auto; }
        #home02 .home02Item--learn .home02Illust {
          width: 70%;
          max-width: 34rem;
          margin: 1rem auto 0; }
      #home02 .home02Item--touch,
      #home02 .home02Item--grow {
        max-width: 26rem;
        margin: 0 auto; }
        #home02 .home02Item--touch .home02Btn,
        #home02 .home02Item--grow .home02Btn {
          width: 100%;
          margin: 0 auto; }
        #home02 .home02Item--touch .home02Illust,
        #home02 .home02Item--grow .home02Illust {
          width: 90%;
          margin: 0 auto; }
      #home02 .home02Item--touch .home02Illust {
        margin: 20px auto 0; }
      #home02 .home02Item--know {
        grid-column: 1 / -1;
        width: 100%;
        margin: 0 auto; }
        #home02 .home02Item--know .home02Btn {
          width: 80%;
          margin: 0 auto; }
        #home02 .home02Item--know .home02Illust {
          width: 42%;
          margin: 2rem auto 0; } }

@media (hover: hover) {
  #home02 .home02Btn {
    transform-origin: 50% 70%;
    transition: translate .25s ease; }
    #home02 .home02Btn img {
      transform-origin: 50% 70%; }
    #home02 .home02Btn:hover {
      opacity: 1;
      translate: 0 -.4rem; }
      #home02 .home02Btn:hover img {
        animation: home02BtnPoyon 0.5s cubic-bezier(0.34, 1.56, 0.64, 1); }
      #home02 .home02Btn:hover + .home02Illust {
        animation: home02IllustPop 0.55s cubic-bezier(0.34, 1.56, 0.64, 1); } }
@keyframes home02BtnPoyon {
  0% {
    transform: scale(1) rotate(0); }
  35% {
    transform: scale(1.06, 0.96) rotate(-1deg); }
  55% {
    transform: scale(0.98, 1.04) rotate(1deg); }
  75% {
    transform: scale(1.02, 0.99) rotate(-0.5deg); }
  100% {
    transform: scale(1) rotate(0); } }
@keyframes home02IllustPop {
  0% {
    translate: 0 0;
    scale: 1; }
  35% {
    translate: 0 -1.5rem;
    scale: 1.04 .96; }
  60% {
    translate: 0 .2rem;
    scale: .98 1.03; }
  78% {
    translate: 0 -.4rem;
    scale: 1.01 .99; }
  100% {
    translate: 0 0;
    scale: 1; } }
#home02 .home02Btn {
  opacity: 0;
  translate: 0 -8rem;
  scale: .9;
  transform-origin: 50% 80%; }
  #home02 .home02Btn.is-show {
    animation: home02BtnDrop 0.75s cubic-bezier(0.22, 1, 0.36, 1) both;
    animation-delay: var(--delay, 0s); }

@keyframes home02BtnDrop {
  0% {
    opacity: 0;
    translate: 0 -8rem;
    scale: .9; }
  50% {
    opacity: 1;
    translate: 0 1.2rem;
    scale: 1.04 .96; }
  68% {
    translate: 0 -.8rem;
    scale: .98 1.03; }
  82% {
    translate: 0 .35rem;
    scale: 1.02 .99; }
  92% {
    translate: 0 -.15rem;
    scale: .99 1.01; }
  100% {
    opacity: 1;
    translate: 0 0;
    scale: 1; } }
#home02 .home02IllustBase {
  display: block;
  width: 100%;
  height: auto; }
#home02 .home02Illust--touch {
  position: relative;
  width: 100%;
  margin-top: -1%; }
#home02 .home02Goat {
  position: absolute;
  top: -4%;
  left: 0;
  width: 38%;
  height: auto;
  transform-origin: 50% 90%;
  animation: home02GoatKaku 3.8s steps(1, end) infinite;
  animation-delay: 0s; }
#home02 .home02Ladybug {
  position: absolute;
  right: 1%;
  bottom: 0;
  width: 12%;
  height: auto;
  transform-origin: 50% 80%;
  animation: home02LadybugKaku 3.4s steps(1, end) infinite;
  animation-delay: .8s; }
#home02 .home02Illust--grow {
  position: relative;
  width: 100%;
  margin-top: -1%; }
#home02 .home02Watering {
  position: absolute;
  top: 22%;
  left: 1%;
  width: 25%;
  height: auto;
  transform-origin: 35% 45%;
  animation: home02WateringMove 4.2s ease-in-out infinite;
  animation-delay: 1.3s; }
#home02 .home02Illust--know {
  position: relative;
  width: 100%;
  margin-top: 2%; }
#home02 .home02KnowBird {
  position: absolute;
  top: -14%;
  right: 6%;
  width: 20%;
  height: auto;
  transform-origin: 50% 90%;
  animation: home02KnowBirdMove 4s ease-in-out infinite;
  animation-delay: 1.9s; }

/* ヤギ */
@keyframes home02GoatKaku {
  0%,8%,100% {
    translate: 0 0;
    rotate: 0deg; }
  12% {
    translate: -.3rem 0;
    rotate: -3deg; }
  18% {
    translate: .2rem 0;
    rotate: 2deg; }
  24% {
    translate: -.2rem 0;
    rotate: -2deg; }
  30% {
    translate: .15rem 0;
    rotate: 1.5deg; }
  36% {
    translate: 0 0;
    rotate: 0deg; }
  48% {
    translate: .2rem 0;
    rotate: 2deg; }
  54% {
    translate: -.15rem 0;
    rotate: -1.5deg; }
  60% {
    translate: 0 0;
    rotate: 0deg; } }
/* てんとう虫 */
@keyframes home02LadybugKaku {
  0%,10%,100% {
    translate: 0 0;
    rotate: 0deg; }
  14% {
    translate: -.25rem 0;
    rotate: -5deg; }
  20% {
    translate: .2rem 0;
    rotate: 4deg; }
  26% {
    translate: -.15rem 0;
    rotate: -3deg; }
  32% {
    translate: .1rem 0;
    rotate: 2deg; }
  38% {
    translate: 0 0;
    rotate: 0deg; }
  50% {
    translate: .15rem 0;
    rotate: 3deg; }
  56% {
    translate: -.1rem 0;
    rotate: -2deg; }
  62% {
    translate: 0 0;
    rotate: 0deg; } }
/* じょうろ */
@keyframes home02WateringMove {
  0%,8% {
    translate: 0 0;
    rotate: 0deg; }
  14% {
    translate: .2rem .2rem;
    rotate: 7deg; }
  20% {
    translate: .4rem .5rem;
    rotate: 13deg; }
  30% {
    translate: .4rem .5rem;
    rotate: 13deg; }
  36% {
    translate: .2rem .25rem;
    rotate: 6deg; }
  42% {
    translate: 0 0;
    rotate: 0deg; }
  58% {
    translate: .15rem .15rem;
    rotate: 5deg; }
  64% {
    translate: .3rem .35rem;
    rotate: 10deg; }
  72% {
    translate: .15rem .15rem;
    rotate: 5deg; }
  78%,100% {
    translate: 0 0;
    rotate: 0deg; } }
/* 鳥 */
@keyframes home02KnowBirdMove {
  0%,8% {
    translate: 0 0;
    rotate: 0deg; }
  14% {
    translate: 0 -.7rem;
    rotate: -3deg; }
  20% {
    translate: 0 .1rem;
    rotate: 2deg; }
  26% {
    translate: 0 -.35rem;
    rotate: -2deg; }
  32% {
    translate: 0 0;
    rotate: 0deg; }
  40% {
    rotate: 4deg; }
  46% {
    rotate: -2deg; }
  52% {
    rotate: 0deg; }
  64% {
    translate: 0 -.4rem;
    rotate: 2deg; }
  70% {
    translate: 0 .05rem;
    rotate: -1deg; }
  76%,100% {
    translate: 0 0;
    rotate: 0deg; } }
/* ---------------------------------------
home03
--------------------------------------- */
#home03 {
  position: relative;
  margin-top: -12vw;
  z-index: 1; }
  #home03 .illust {
    position: absolute;
    z-index: 1; }
  #home03 .illust1 {
    position: absolute;
    top: -15rem;
    right: 8rem;
    width: clamp(20rem, calc(6.5217391304vw + 13.4782608696rem), 26rem);
    height: auto;
    transform: rotate(9deg); }
    @media (max-width: 999px) {
      #home03 .illust1 {
        top: -4%;
        right: 4vw;
        width: 8rem; } }
  #home03 .illust2 {
    right: -3rem;
    bottom: -8vw;
    width: clamp(10rem, calc(5.4347826087vw + 4.5652173913rem), 15rem);
    height: auto; }
    @media (max-width: 999px) {
      #home03 .illust2 {
        right: -1rem;
        bottom: 33rem;
        width: 10.6vw;
        max-width: 6rem; } }
  #home03 .bgMori {
    position: absolute;
    z-index: -1; }
    #home03 .bgMori.left {
      left: 0;
      bottom: 20%;
      width: 65rem;
      height: auto; }
    #home03 .bgMori.right {
      top: 20%;
      right: 0;
      width: 70rem;
      height: auto; }
  #home03 .boxs {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: clamp(4rem, calc(4.347826087vw + -0.347826087rem), 8rem);
    position: relative; }
    #home03 .boxs .pic {
      width: 50%;
      max-width: 74rem;
      aspect-ratio: 740 / 560;
      overflow: hidden;
      flex-shrink: 0; }
      #home03 .boxs .pic img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover; }
    #home03 .boxs .box {
      width: 100%; }
    #home03 .boxs .logo {
      width: clamp(20rem, calc(6.5217391304vw + 13.4782608696rem), 26rem); }
      #home03 .boxs .logo img {
        display: block;
        width: 100%;
        height: auto; }
    #home03 .boxs .sttl {
      color: #4A7CC9;
      font-size: clamp(2.8rem, calc(0.4347826087vw + 2.3652173913rem), 3.2rem); }
    #home03 .boxs.reverse {
      flex-direction: row-reverse; }
  @media (max-width: 999px) {
    #home03 {
      margin-top: -16rem;
      z-index: 1; }
      #home03 .boxs {
        display: block;
        margin-bottom: 4rem; }
        #home03 .boxs .pic {
          width: 100%;
          max-width: none;
          margin-bottom: 2rem; }
        #home03 .boxs .box {
          margin-bottom: 2rem; }
        #home03 .boxs .logo {
          width: 16rem;
          margin: 0 auto 2rem; }
        #home03 .boxs .sttl {
          font-size: 2rem; }
      #home03 .inner14 {
        padding-bottom: 2rem; } }

@media (max-width: 999px) {
  #home03 .leadBox {
    padding-top: 8rem; }
    #home03 .leadBox .ttlBox {
      margin: 0 auto 3rem;
      position: absolute;
      top: -50px;
      left: 0;
      right: 0; }
    #home03 .leadBox .txt {
      max-width: none;
      font-size: 1.4rem; }
  #home03 .inner16 {
    position: relative; } }

.yura img {
  animation: yurayura 3s ease-in-out infinite;
  transform-origin: 50% 90%; }
@media (hover: hover) {
  .yura:hover img {
    animation: yurayura 3s ease-in-out infinite, pyonpyon .6s ease-out; } }

@keyframes yurayura {
  0% {
    transform: rotate(-3deg); }
  50% {
    transform: rotate(3deg); }
  100% {
    transform: rotate(-3deg); } }
@keyframes pyonpyon {
  0% {
    translate: 0 0; }
  25% {
    translate: 0 -1.2rem; }
  45% {
    translate: 0 -.2rem; }
  65% {
    translate: 0 -.8rem; }
  82% {
    translate: 0 -.1rem; }
  100% {
    translate: 0 0; } }
/* ---------------------------------------
home04
--------------------------------------- */
#home04 {
  position: relative;
  overflow-x: clip;
  padding-bottom: clamp(8rem, calc(4.347826087vw + 3.652173913rem), 12rem);
  z-index: 1; }
  #home04 .inner18 {
    position: relative;
    padding-bottom: 0;
    overflow: visible; }
  #home04 .inner14 {
    position: relative;
    z-index: 3; }
  #home04 .btnCenter {
    position: relative;
    z-index: 3; }
  #home04 .buildingPic {
    position: relative;
    z-index: 2;
    left: 50%;
    width: 100vw;
    transform: translateX(-50%); }
    #home04 .buildingPic img {
      display: block;
      width: 100%;
      height: auto; }
  @media (max-width: 999px) {
    #home04 {
      padding-bottom: 6rem; }
      #home04 .inner14 {
        padding-top: 4rem; }
      #home04 .btnCenter {
        margin-top: 2rem; }
      #home04 .buildingPic {
        margin-top: 3rem; }
      #home04 .btn a {
        width: 90%;
        margin: 0 auto; } }

#home04 .touchPic {
  position: relative;
  z-index: 2;
  left: 50%;
  width: 100vw;
  overflow: hidden;
  transform: translateX(-50%); }
#home04 .touchTrack {
  display: flex;
  width: max-content;
  animation: touchSlide 50s linear infinite; }
#home04 .touchGroup {
  position: relative;
  flex-shrink: 0;
  width: 100vw;
  aspect-ratio: 2048 / 746; }
#home04 .touchItem {
  position: absolute;
  display: block;
  max-width: none;
  height: auto;
  transform-origin: 50% 70%; }
#home04 .touchBughunt {
  top: -1.05%;
  left: 26.28%;
  width: 14.55%; }
#home04 .touchOrange {
  top: 8.04%;
  left: 72.02%;
  width: 10.94%; }
#home04 .touchSoil {
  top: 11.80%;
  left: 1.32%;
  width: 27.10%; }
#home04 .touchCooking {
  top: 11.80%;
  left: 42.58%;
  width: 17.11%; }
#home04 .touchWalk {
  top: 18.10%;
  left: 60.55%;
  width: 10.30%; }
#home04 .touchFrog {
  top: 13.63%;
  left: 80.41%;
  width: 19.96%; }
#home04 .touchGoatfeed {
  top: 32.31%;
  left: 29.83%;
  width: 10.35%; }
#home04 .touchDog {
  top: 34.80%;
  left: 50.17%;
  width: 15.38%; }
#home04 .touchGoatboy {
  top: 41.40%;
  left: 34.62%;
  width: 16.87%; }
#home04 .touchButterfly {
  top: 46.52%;
  left: 2.44%;
  width: 3.61%; }
#home04 .touchRice {
  top: 48.12%;
  left: 61.91%;
  width: 19.04%; }
#home04 .touchWood {
  top: 59.12%;
  left: .20%;
  width: 12.21%; }
#home04 .touchGreen {
  top: 59.92%;
  left: 26.12%;
  width: 11.04%; }
#home04 .touchCreatures {
  top: 55.63%;
  left: 81.34%;
  width: 19.07%; }
#home04 .touchGoatgirl {
  top: 62.74%;
  left: 12.31%;
  width: 15.77%; }
#home04 .touchGroupPhoto {
  top: 68.37%;
  left: 46.83%;
  width: 13.77%; }
@media (hover: hover) {
  #home04 .touchYura:hover {
    z-index: 5;
    animation: touchCloudYura .65s ease-in-out; } }
@media (max-width: 999px) {
  #home04 .touchGroup {
    width: 300vw; } }

@keyframes touchSlide {
  from {
    transform: translateX(0); }
  to {
    transform: translateX(-50%); } }
@keyframes touchCloudYura {
  0% {
    translate: 0 0;
    rotate: 0deg; }
  20% {
    translate: 0 -.3rem;
    rotate: -4deg; }
  40% {
    translate: 0 -.5rem;
    rotate: 4deg; }
  60% {
    translate: 0 -.2rem;
    rotate: -2.5deg; }
  80% {
    translate: 0 -.1rem;
    rotate: 1.5deg; }
  100% {
    translate: 0 0;
    rotate: 0deg; } }
/* ---------------------------------------
home05
--------------------------------------- */
#home05 .inner16 {
  position: relative; }
  @media (max-width: 999px) {
    #home05 .inner16 {
      padding-bottom: 7rem; } }
#home05 .bgMori {
  position: absolute;
  z-index: 0; }
  #home05 .bgMori.left {
    left: -8vw;
    top: -10%;
    width: clamp(60rem, calc(7.6086956522vw + 52.3913043478rem), 67rem);
    height: auto; }
    @media (max-width: 999px) {
      #home05 .bgMori.left {
        left: -23vw;
        top: -103px;
        width: 56vw;
        max-width: 34rem; } }
  #home05 .bgMori.right {
    bottom: -18%;
    right: -5%;
    width: clamp(74rem, calc(13.0434782609vw + 60.9565217391rem), 86rem);
    height: auto; }
    @media (max-width: 999px) {
      #home05 .bgMori.right {
        bottom: -4%;
        right: -5%;
        width: 40rem;
        height: auto; } }
#home05 .boxs {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: clamp(3rem, calc(3.2608695652vw + -0.2608695652rem), 6rem);
  position: relative; }
#home05 .illust {
  position: absolute;
  z-index: 1; }
#home05 .illust1 {
  position: absolute;
  top: -10rem;
  left: -8rem;
  width: clamp(12rem, calc(10.8695652174vw + 1.1304347826rem), 22rem);
  height: auto;
  transform: rotate(-14deg); }
  @media (max-width: 999px) {
    #home05 .illust1 {
      top: -5rem;
      left: -3rem;
      width: 8rem; } }
#home05 .illust2 {
  right: -3rem;
  bottom: -8rem;
  width: clamp(28rem, calc(14.1304347826vw + 13.8695652174rem), 41rem);
  height: auto; }
  @media (max-width: 999px) {
    #home05 .illust2 {
      right: -1rem;
      bottom: -3rem;
      width: 17rem;
      height: auto; } }
#home05 .box {
  width: 100%;
  max-width: 41.6rem; }
  #home05 .box:nth-child(2) {
    margin-top: clamp(10rem, calc(3.2608695652vw + 6.7391304348rem), 13rem); }
  #home05 .box:nth-child(3) {
    margin-top: clamp(4rem, calc(2.1739130435vw + 1.8260869565rem), 6rem); }
#home05 .pic {
  position: relative;
  width: 100%;
  aspect-ratio: 416 / 480;
  margin-bottom: clamp(5rem, calc(2.1739130435vw + 2.8260869565rem), 7rem); }
  #home05 .pic > img:first-child {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: inherit;
    object-fit: cover; }
  #home05 .pic .ico {
    position: absolute;
    z-index: 2;
    left: -3rem;
    bottom: clamp(-6rem, calc(2.1739130435vw + -8.1739130435rem), -4rem);
    width: clamp(13rem, calc(4.0217391304vw + 8.9782608696rem), 16.7rem);
    height: auto;
    object-fit: contain; }
#home05 .sttl {
  font-size: 3.2rem;
  margin-bottom: clamp(0.5rem, calc(1.6304347826vw + -1.1304347826rem), 2rem); }
  #home05 .sttl.purple {
    color: #A65EB0; }
@media (max-width: 999px) {
  #home05 .boxs {
    display: block; }
  #home05 .box {
    max-width: none;
    margin-bottom: 4rem; }
    #home05 .box:nth-child(1), #home05 .box:nth-child(2) {
      margin-top: 0; }
  #home05 .pic {
    margin-bottom: 2rem; }
    #home05 .pic .ico {
      left: -1rem;
      bottom: -2rem;
      width: 12rem; } }
    @media (max-width: 999px) and (max-width: 999px) {
      #home05 .pic .ico {
        bottom: -3rem;
        width: 8rem;
        right: -1rem;
        left: inherit; } }
@media (max-width: 999px) {
  #home05 .sttl {
    font-size: 2rem; } }

@media (max-width: 999px) {
  #home05 {
    padding-top: 4rem; }
    #home05 .leadBox {
      padding-top: 8rem;
      margin-bottom: 6rem; }
      #home05 .leadBox .ttlBox {
        margin: 0 auto 3rem;
        position: absolute;
        top: -50px;
        left: 0;
        right: 0; }
      #home05 .leadBox .txt {
        max-width: none;
        font-size: 1.4rem; }
    #home05 .inner16 {
      position: relative; } }

#home05 .illust1 {
  opacity: 0;
  translate: 0 2rem;
  scale: .92; }
  #home05 .illust1.is-show {
    animation: home05IllustShow 0.7s cubic-bezier(0.34, 1.56, 0.64, 1) forwards; }

@keyframes home05IllustShow {
  0% {
    opacity: 0;
    translate: 0 2rem;
    scale: .92; }
  60% {
    opacity: 1;
    translate: 0 -.5rem;
    scale: 1.03; }
  80% {
    translate: 0 .2rem;
    scale: .99; }
  100% {
    opacity: 1;
    translate: 0 0;
    scale: 1; } }
#home05 .home05Tree {
  opacity: 0;
  translate: 0 -7rem;
  scale: .9; }
  #home05 .home05Tree.is-show {
    animation: home05TreePoyon 0.9s cubic-bezier(0.34, 1.56, 0.64, 1) forwards; }

@keyframes home05TreePoyon {
  0% {
    opacity: 0;
    translate: 0 -7rem;
    scale: .9; }
  40% {
    opacity: 1;
    translate: 0 1rem;
    scale: 1.04 .96; }
  58% {
    translate: 0 -1.2rem;
    scale: .98 1.03; }
  72% {
    translate: 0 .5rem;
    scale: 1.02 .98; }
  86% {
    translate: 0 -.3rem;
    scale: .99 1.01; }
  100% {
    opacity: 1;
    translate: 0 0;
    scale: 1; } }
/* ---------------------------------------
home06
--------------------------------------- */
#home06 {
  position: relative; }
  #home06 .illust {
    position: absolute;
    z-index: 1;
    right: clamp(48rem, calc(13.0434782609vw + 34.9565217391rem), 60rem);
    bottom: -20rem;
    width: clamp(16rem, calc(4.347826087vw + 11.652173913rem), 20rem);
    height: auto; }
  #home06 .ashiato {
    position: absolute;
    z-index: 1;
    width: clamp(14rem, calc(4.347826087vw + 9.652173913rem), 18rem);
    height: auto; }
  #home06 .ashiato1 {
    left: 20%;
    top: -33rem;
    transform: rotate(-83deg);
    z-index: 0; }
    @media (max-width: 999px) {
      #home06 .ashiato1 {
        left: 27%;
        top: -11rem;
        width: 7rem; } }
  #home06 .ashiato2 {
    right: 18rem;
    bottom: -25rem;
    transform: rotate(-325deg); }
  #home06 .mapBg {
    position: absolute;
    top: 0;
    left: 54%;
    width: 89.33%;
    max-width: 160rem;
    height: 100%;
    transform: translateX(-50%);
    pointer-events: none; }
    #home06 .mapBg img {
      display: block;
      width: 100%;
      height: auto;
      object-fit: fill; }
  #home06 .inner16 {
    position: relative;
    min-height: clamp(75rem, calc(27.1739130435vw + 47.8260869565rem), 100rem);
    padding: clamp(6rem, calc(2.1739130435vw + 3.8260869565rem), 8rem) 0 clamp(18rem, calc(6.5217391304vw + 11.4782608696rem), 24rem); }
  #home06 .inner14 {
    position: relative;
    z-index: 2; }
  #home06 .ttlBox.yellow {
    background-image: url("../img/home/ttlBg_yellow.png"); }
    #home06 .ttlBox.yellow .ttl {
      border-color: #E9B900;
      color: #E9B900; }
  #home06 .btns {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: clamp(1.5rem, calc(0.5434782609vw + 0.9565217391rem), 2rem) clamp(2rem, calc(1.0869565217vw + 0.9130434783rem), 3rem);
    width: 68%;
    max-width: 90rem;
    margin-left: auto; }
    #home06 .btns .btn {
      width: 100%; }
  #home06 .knowIco {
    position: absolute;
    left: -4vw;
    bottom: clamp(-268.8px, calc(-18.348vw + 83.48px), -100px);
    z-index: 1;
    width: clamp(40rem, calc(32.6086956522vw + 7.3913043478rem), 70rem);
    pointer-events: none; }
    #home06 .knowIco img {
      display: block;
      width: 100%;
      height: auto; }
    #home06 .knowIco .ico2 {
      position: absolute;
      right: 32%;
      bottom: 6%;
      width: clamp(20rem, calc(5.4347826087vw + 14.5652173913rem), 25rem); }
  @media (max-width: 999px) {
    #home06 {
      margin-bottom: 0; }
      #home06 .mapBg {
        width: 89.33%;
        max-width: 536px; }
      #home06 .inner16 {
        min-height: 0;
        padding: 6rem 0 4rem; }
      #home06 .btns {
        grid-template-columns: 1fr;
        gap: .5rem;
        width: 100%;
        max-width: 41rem;
        margin: 0 auto; }
        #home06 .btns .btn {
          width: 100%; }
      #home06 .mapBg,
      #home06 .knowIco {
        display: none; }
      #home06 .leadBox .txt {
        color: #fff; }
      #home06 .illust {
        width: 7rem;
        right: 18rem;
        bottom: -3rem; }
      #home06 .ashiato2 {
        right: 3rem;
        bottom: -5rem;
        width: 7rem; }
      #home06 .pic {
        width: 28rem;
        margin-top: -2rem; }
      #home06 .ico1 {
        margin-top: -8rem;
        z-index: 1;
        position: relative; } }

.kakukakuGlass {
  animation: kakukakuGlass 2.4s steps(1, end) infinite;
  transform-origin: 70% 75%; }

.kakukakuGoat {
  animation: kakukakuGoat 2.4s steps(1, end) infinite;
  transform-origin: center bottom; }

@keyframes kakukakuGlass {
  0%,
    100% {
    translate: 0 0;
    rotate: -4deg; }
  25% {
    translate: -.5rem -.2rem;
    rotate: -8deg; }
  50% {
    translate: .3rem 0;
    rotate: -2deg; }
  75% {
    translate: -.2rem .2rem;
    rotate: -6deg; } }
@keyframes kakukakuGoat {
  0%,
    100% {
    translate: 0 0;
    rotate: 0deg; }
  25% {
    translate: -.4rem -.2rem;
    rotate: -2deg; }
  50% {
    translate: 0 0;
    rotate: 1deg; }
  75% {
    translate: .4rem -.2rem;
    rotate: 2deg; } }
#home06 .ashiato {
  position: absolute;
  z-index: 1;
  width: clamp(14rem, calc(4.347826087vw + 9.652173913rem), 18rem);
  height: auto;
  clip-path: inset(0 0 100% 0); }
  #home06 .ashiato.is-show {
    animation: ashiatoWalk 2.2s linear forwards; }
#home06 .ashiato1 {
  left: 20%;
  top: -33rem;
  transform: rotate(-83deg);
  z-index: 0; }
  @media (max-width: 999px) {
    #home06 .ashiato1 {
      left: 27%;
      top: -11rem;
      width: 7rem; } }
#home06 .ashiato2 {
  right: 18rem;
  bottom: -25rem;
  transform: rotate(-325deg);
  /* PC：ashiato1が終わってから開始 */ }
  #home06 .ashiato2.pcView.is-show {
    animation-delay: 2.2s; }
@media (max-width: 999px) {
  #home06 .ashiato2 {
    right: 3rem;
    bottom: -5rem;
    width: 7rem;
    /* SPはすぐ開始 */ }
    #home06 .ashiato2.is-show {
      animation-delay: 0s; } }

@keyframes ashiatoWalk {
  0% {
    clip-path: inset(0 0 100% 0); }
  8%,
    9% {
    clip-path: inset(0 0 93% 0); }
  17%,
    18% {
    clip-path: inset(0 0 79% 0); }
  26%,
    27% {
    clip-path: inset(0 0 68% 0); }
  35%,
    36% {
    clip-path: inset(0 0 62% 0); }
  44%,
    45% {
    clip-path: inset(0 0 51% 0); }
  53%,
    54% {
    clip-path: inset(0 0 43% 0); }
  62%,
    63% {
    clip-path: inset(0 0 34% 0); }
  71%,
    72% {
    clip-path: inset(0 0 25% 0); }
  80%,
    81% {
    clip-path: inset(0 0 18% 0); }
  89%,
    90% {
    clip-path: inset(0 0 10% 0); }
  99%,
    100% {
    clip-path: inset(0 0 0 0); } }
@keyframes ashiatoWalk {
  /* 何も表示しない */
  0% {
    clip-path: inset(0 0 100% 0); }
  /* 1 */
  8%,
    9% {
    clip-path: inset(0 0 93% 0); }
  /* 2 */
  17%,
    18% {
    clip-path: inset(0 0 79% 0); }
  /* 3 */
  26%,
    27% {
    clip-path: inset(0 0 68% 0); }
  /* 4 */
  35%,
    36% {
    clip-path: inset(0 0 62% 0); }
  /* 5 */
  44%,
    45% {
    clip-path: inset(0 0 51% 0); }
  /* 6 */
  53%,
    54% {
    clip-path: inset(0 0 43% 0); }
  /* 7 */
  62%,
    63% {
    clip-path: inset(0 0 34% 0); }
  /* 8 */
  71%,
    72% {
    clip-path: inset(0 0 25% 0); }
  /* 9 */
  80%,
    81% {
    clip-path: inset(0 0 18% 0); }
  /* 10 */
  89%,
    90% {
    clip-path: inset(0 0 10% 0); }
  /* 11 */
  99%,
    100% {
    clip-path: inset(0 0 0 0); } }
/* ---------------------------------------
home07
--------------------------------------- */
#home07 {
  position: relative;
  overflow-x: clip; }
  #home07 .inner14 {
    position: relative; }
  #home07 .illust {
    position: absolute;
    top: 0;
    right: 0;
    width: clamp(20rem, calc(6.5217391304vw + 13.4782608696rem), 26rem); }
    @media (max-width: 999px) {
      #home07 .illust {
        width: 11rem;
        top: 10rem; } }
  #home07 .bgMori {
    position: absolute;
    z-index: -1; }
    #home07 .bgMori.left {
      left: 0;
      top: -10%;
      width: clamp(120rem, calc(21.7391304348vw + 98.2608695652rem), 140rem);
      height: auto; }
    #home07 .bgMori.right {
      bottom: 6%;
      right: 0%;
      width: clamp(60rem, calc(21.7391304348vw + 38.2608695652rem), 80rem);
      height: auto; }
  #home07 .voiceBoxs {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    width: 100%;
    column-gap: 2.857%;
    row-gap: clamp(2rem, calc(2.1739130435vw + -0.1739130435rem), 4rem); }
  #home07 .voiceBox {
    --bg-color: #fff;
    --border-color: #2DA338;
    --border-width: 5px;
    --border-double: 7px;
    --pick-size: 18px;
    --pick-radius: 5px;
    --pick-thin: .55;
    position: relative;
    display: flex;
    align-items: center;
    padding: 2rem 4rem;
    background: var(--bg-color);
    border: var(--border-width) solid var(--border-color);
    border-radius: clamp(3rem, calc(1.0869565217vw + 1.9130434783rem), 4rem); }
    #home07 .voiceBox::before {
      content: "";
      position: absolute;
      left: calc(50% - var(--pick-size) - var(--border-double));
      bottom: calc(0px - var(--pick-size) - var(--border-double));
      z-index: 1;
      width: 0;
      height: 0;
      border-style: solid;
      border-color: transparent var(--border-color) var(--border-color) transparent;
      border-width: calc(var(--pick-size) + var(--border-double));
      border-radius: 0 0 calc(var(--pick-radius) * 1.7) 0;
      transform: scaleX(var(--pick-thin)) rotate(45deg);
      transform-origin: center; }
    #home07 .voiceBox::after {
      content: "";
      position: absolute;
      left: calc(50% - var(--pick-size));
      bottom: calc(2px - var(--pick-size));
      z-index: 2;
      width: 0;
      height: 0;
      border-style: solid;
      border-color: transparent var(--bg-color) var(--bg-color) transparent;
      border-width: var(--pick-size);
      border-radius: 0;
      transform: scaleX(var(--pick-thin)) rotate(45deg);
      transform-origin: center; }
    #home07 .voiceBox p {
      position: relative;
      display: flex;
      align-items: center;
      align-self: stretch;
      width: 100%;
      padding-left: 4rem;
      font-size: clamp(1.6rem, calc(0.2173913043vw + 1.3826086957rem), 1.8rem); }
      #home07 .voiceBox p::before {
        content: "";
        position: absolute;
        top: 1.5rem;
        bottom: 1.5rem;
        left: 0;
        width: .6rem;
        background: #4A7CC9;
        border-radius: 1rem; }
    #home07 .voiceBox:nth-child(2) {
      width: 54.429%;
      aspect-ratio: 762 / 253; }
    #home07 .voiceBox:nth-child(2) {
      width: 37.143%;
      aspect-ratio: 520 / 253; }
    #home07 .voiceBox:nth-child(3) {
      width: 45.929%;
      aspect-ratio: 643 / 326; }
    #home07 .voiceBox:nth-child(4) {
      width: 51.214%;
      aspect-ratio: 717 / 326; }
    #home07 .voiceBox.orange p::before {
      background: #FB9B00; }
    #home07 .voiceBox.purple p::before {
      background: #A65EB0; }
  @media (max-width: 999px) {
    #home07 .voiceBoxs {
      display: block;
      align-items: flex-start; }
    #home07 .voiceBox {
      width: 100% !important;
      aspect-ratio: auto !important;
      min-height: auto;
      margin-bottom: 3rem;
      padding: 2rem;
      --pick-size: 12px;
      --border-width: 3px;
      --border-double: 3px;
      border-radius: 20px; }
      #home07 .voiceBox:last-child {
        margin-bottom: 0; }
      #home07 .voiceBox p {
        padding-left: 2rem;
        font-size: 1.2rem; }
        #home07 .voiceBox p::before {
          top: 0.5rem;
          bottom: 0.5rem;
          width: 3px; }
    #home07 .leadBox .ttlBox {
      margin: 0; }
    #home07 .bgMori.left {
      left: -21%;
      top: clamp(-16rem, calc(-25.641025641vw + 9.6153846154rem), 0rem);
      width: 120%;
      max-width: 120%; } }

.anim-box.voiceZoom {
  opacity: 0;
  transform: scale(0.8);
  transform-origin: center center; }
  .anim-box.voiceZoom.is-animated {
    animation: voiceZoomIn 0.8s cubic-bezier(0.25, 1, 0.5, 1) forwards;
    animation-delay: var(--delay, 0s); }

@keyframes voiceZoomIn {
  0% {
    opacity: 0;
    transform: scale(0.8); }
  70% {
    opacity: 1;
    transform: scale(1.03); }
  100% {
    opacity: 1;
    transform: scale(1); } }
/* ---------------------------------------
home08
--------------------------------------- */
#home08 {
  position: relative;
  overflow-x: clip; }
  #home08 .inner16 {
    position: relative; }
  #home08 .illust {
    position: absolute;
    z-index: 1; }
  #home08 .illust1 {
    position: absolute;
    top: -2rem;
    left: 3vw;
    width: clamp(16rem, calc(5.4347826087vw + 10.5652173913rem), 21rem);
    height: auto;
    transform: rotate(-14deg); }
  #home08 .illust2 {
    right: 13rem;
    top: -4.2vw;
    width: 6.2vw;
    height: auto; }
  #home08 .illust3 {
    right: 27rem;
    bottom: -11.2vw;
    width: clamp(16rem, calc(6.5217391304vw + 9.4782608696rem), 22rem);
    height: auto; }
  #home08 .ashi {
    position: absolute;
    z-index: 0;
    bottom: -10vw;
    left: 0;
    right: 0;
    width: 76vw;
    max-width: 140rem;
    height: auto;
    margin: 0 auto;
    z-index: -1; }
  #home08 .bgDeco {
    position: absolute;
    bottom: -5%;
    width: 102%;
    z-index: -1;
    max-width: 102%;
    margin: 0 auto;
    left: 0;
    right: 0;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%); }
  #home08 .faqList {
    padding: 4rem 6rem;
    background: #fff;
    border-radius: clamp(2rem, calc(2.1739130435vw + -0.1739130435rem), 4rem); }
  #home08 .faqItem {
    border-top: 1px solid #ccc; }
    #home08 .faqItem:last-child {
      border-bottom: 1px solid #ccc; }
    #home08 .faqItem.is-open .toggle::after {
      transform: translate(-50%, -50%) rotate(0deg); }
  #home08 .faqQ {
    position: relative;
    display: flex;
    gap: 1.5rem;
    width: 100%;
    padding: 2rem 7rem 2rem 0;
    text-align: left;
    cursor: pointer; }
    #home08 .faqQ .mark {
      flex-shrink: 0;
      color: #2DA338;
      font-size: clamp(2.8rem, calc(0.4347826087vw + 2.3652173913rem), 3.2rem);
      font-weight: 700;
      line-height: 1; }
    #home08 .faqQ .toggle {
      position: absolute;
      top: 50%;
      right: 0;
      width: clamp(3.8rem, calc(0.652173913vw + 3.147826087rem), 4.4rem);
      height: clamp(3.8rem, calc(0.652173913vw + 3.147826087rem), 4.4rem);
      background: #373737;
      border-radius: 50%;
      transform: translateY(-50%); }
      #home08 .faqQ .toggle::before, #home08 .faqQ .toggle::after {
        content: "";
        position: absolute;
        top: 50%;
        left: 50%;
        width: 1.6rem;
        height: 2px;
        background: #fff;
        transform: translate(-50%, -50%);
        transition: transform .3s; }
      #home08 .faqQ .toggle::after {
        transform: translate(-50%, -50%) rotate(90deg); }
  #home08 .faqA {
    height: 0;
    overflow: hidden;
    transition: height .4s ease; }
  #home08 .faqAInner {
    position: relative;
    display: flex;
    gap: 1.5rem;
    padding: 0 7rem 3rem 0; }
    #home08 .faqAInner .mark {
      flex-shrink: 0;
      color: #373737;
      font-size: clamp(2.8rem, calc(0.4347826087vw + 2.3652173913rem), 3.2rem);
      font-weight: 700;
      line-height: 1; }
  @media (max-width: 999px) {
    #home08 .faqList {
      width: 100%;
      padding: 2rem; }
    #home08 .faqQ {
      min-height: auto;
      gap: 1rem;
      padding: 1.5rem 3rem 1.5rem 0; }
      #home08 .faqQ .mark {
        font-size: 2.6rem; }
      #home08 .faqQ .txt {
        font-size: 1.4rem;
        line-height: 1.5;
        margin-top: 0.4rem; }
      #home08 .faqQ .toggle {
        width: 2rem;
        height: 2rem; }
        #home08 .faqQ .toggle::before, #home08 .faqQ .toggle::after {
          width: 1rem; }
    #home08 .faqAInner {
      gap: 1rem;
      padding: 0 1rem 2.5rem 0; }
      #home08 .faqAInner .mark {
        font-size: 2.6rem; }
    #home08 .ttlBox.white {
      text-align: center;
      margin: 0 auto 2rem; }
    #home08 .illust1 {
      width: clamp(6rem, calc(9.6153846154vw + 2.3942307692rem), 12rem); }
    #home08 .illust2 {
      right: 4rem;
      top: -8.2vw;
      width: 11.2vw;
      height: auto; }
    #home08 .illust3 {
      width: 11rem;
      left: 0;
      right: 0;
      margin: 0 auto;
      bottom: -11rem; }
    #home08 .ashi {
      width: clamp(26rem, calc(35.2564102564vw + 12.7788461538rem), 48rem);
      bottom: clamp(-7rem, calc(-4.8076923077vw + -2.1971153846rem), -4rem); } }

#home08 .illust3 {
  opacity: 0;
  translate: 0 -6rem;
  scale: .92; }
  #home08 .illust3.is-show {
    animation: home08Poyon 0.9s cubic-bezier(0.34, 1.56, 0.64, 1) forwards; }

@keyframes home08Poyon {
  0% {
    opacity: 0;
    translate: 0 -6rem;
    scale: .92; }
  40% {
    opacity: 1;
    translate: 0 .8rem;
    scale: 1.03 .97; }
  58% {
    translate: 0 -1rem;
    scale: .98 1.03; }
  74% {
    translate: 0 .4rem;
    scale: 1.02 .99; }
  88% {
    translate: 0 -.2rem;
    scale: .99 1.01; }
  100% {
    opacity: 1;
    translate: 0 0;
    scale: 1; } }
#home08 .illust2 {
  transform-origin: 50% 90%;
  animation: home08BirdMove 5.4s ease-in-out infinite; }

@keyframes home08BirdMove {
  0%,14% {
    translate: 0 0;
    rotate: 0deg; }
  18% {
    translate: 0 -.7rem;
    rotate: 3deg; }
  22% {
    translate: 0 .1rem;
    rotate: -2deg; }
  26% {
    translate: 0 -.4rem;
    rotate: 2deg; }
  30% {
    translate: 0 0;
    rotate: 0deg; }
  36% {
    rotate: -4deg; }
  42% {
    rotate: 2deg; }
  48%,100% {
    translate: 0 0;
    rotate: 0deg; } }
/* ---------------------------------------
home09
--------------------------------------- */
#home09 {
  position: relative;
  overflow-x: clip; }
  #home09 .bgMori {
    position: absolute;
    z-index: -1; }
    #home09 .bgMori.left {
      left: 0;
      top: 0;
      width: clamp(120rem, calc(21.7391304348vw + 98.2608695652rem), 140rem);
      height: auto; }
    #home09 .bgMori.right {
      bottom: 6%;
      right: 0%;
      width: clamp(67rem, calc(21.7391304348vw + 45.2608695652rem), 87rem);
      height: auto; }
  #home09 .movieArea .movieLead {
    position: relative;
    width: fit-content;
    margin-left: auto;
    margin-right: auto;
    padding: 0 clamp(4rem, calc(1.0869565217vw + 2.9130434783rem), 5rem);
    color: #fff;
    font-size: clamp(1.8rem, calc(0.4347826087vw + 1.3652173913rem), 2.2rem); }
    #home09 .movieArea .movieLead::before, #home09 .movieArea .movieLead::after {
      content: "";
      position: absolute;
      top: 50%;
      width: .6rem;
      height: 4.5rem;
      background: #fff;
      border-radius: 1rem; }
    #home09 .movieArea .movieLead::before {
      left: 1rem;
      transform: translateY(-50%) rotate(-30deg); }
    #home09 .movieArea .movieLead::after {
      right: 1rem;
      transform: translateY(-50%) rotate(30deg); }
  #home09 .movieArea .movieBoxs {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 4rem; }
  #home09 .movieArea .movieBox {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: clamp(2.5rem, calc(1.0869565217vw + 1.4130434783rem), 3.5rem);
    aspect-ratio: 680 / 178;
    padding: clamp(2rem, calc(1.0869565217vw + 0.9130434783rem), 3rem);
    overflow: hidden;
    border: 5px solid #fff;
    border-radius: clamp(3rem, calc(1.0869565217vw + 1.9130434783rem), 4rem);
    color: #fff;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat; }
    #home09 .movieArea .movieBox:only-child {
      grid-column: 1 / -1;
      justify-self: center;
      width: calc((100% - 4rem) / 2); }
    #home09 .movieArea .movieBox::before {
      content: "";
      position: absolute;
      inset: 0;
      background: rgba(0, 0, 0, 0.35);
      transition: .4s; }
    #home09 .movieArea .movieBox.youtube {
      background-image: url("../img/home/09_movie_01.jpg"); }
      #home09 .movieArea .movieBox.youtube .ico i {
        color: #ff0033; }
    #home09 .movieArea .movieBox.tiktok {
      background-image: url("../img/home/09_movie_02.jpg"); }
      #home09 .movieArea .movieBox.tiktok .ico i {
        color: #000; }
    #home09 .movieArea .movieBox .ico {
      position: relative;
      z-index: 2;
      display: flex;
      align-items: center;
      justify-content: center;
      width: clamp(8rem, calc(2.1739130435vw + 5.8260869565rem), 10rem);
      aspect-ratio: 1 / 1;
      flex-shrink: 0;
      background: #fff;
      border-radius: 50%; }
      #home09 .movieArea .movieBox .ico i {
        font-size: clamp(4rem, calc(1.0869565217vw + 2.9130434783rem), 5rem); }
    #home09 .movieArea .movieBox .txtBox {
      position: relative;
      z-index: 2; }
    #home09 .movieArea .movieBox .stxt {
      margin-bottom: .8rem;
      font-size: clamp(1.6rem, calc(0.2173913043vw + 1.3826086957rem), 1.8rem); }
    #home09 .movieArea .movieBox .ttl {
      color: #fff;
      font-size: clamp(2.6rem, calc(0.652173913vw + 1.947826087rem), 3.2rem);
      line-height: 1.3; }
    #home09 .movieArea .movieBox:hover {
      opacity: 1; }
      #home09 .movieArea .movieBox:hover::before {
        background: rgba(0, 0, 0, 0.5); }
  @media (max-width: 999px) {
    #home09 {
      margin-bottom: 0; }
      #home09 .leadBox .ttlBox {
        margin: 0; }
      #home09 .bgMori.left {
        top: 90px; }
      #home09 .movieArea .movieLead {
        padding: 0 3.5rem;
        font-size: 1.7rem; }
        #home09 .movieArea .movieLead::before, #home09 .movieArea .movieLead::after {
          width: .4rem;
          height: 3rem; }
        #home09 .movieArea .movieLead::before {
          left: .8rem; }
        #home09 .movieArea .movieLead::after {
          right: .8rem; }
      #home09 .movieArea .movieBoxs {
        grid-template-columns: 1fr;
        gap: 2rem; }
      #home09 .movieArea .movieBox {
        width: 100%;
        aspect-ratio: 680 / 200;
        gap: 2rem;
        padding: 2rem;
        border-width: 3px;
        border-radius: 2.5rem; }
        #home09 .movieArea .movieBox:only-child {
          grid-column: auto;
          width: 100%; }
        #home09 .movieArea .movieBox .ico {
          width: 7rem; }
          #home09 .movieArea .movieBox .ico i {
            font-size: 3.5rem; }
        #home09 .movieArea .movieBox .stxt {
          font-size: 1.3rem; }
        #home09 .movieArea .movieBox .ttl {
          font-size: 2rem; } }

.instaAreaWrap {
  position: relative;
  width: 100%;
  overflow: visible; }
  .instaAreaWrap .instaAreaInner {
    overflow: visible; }
  .instaAreaWrap .instaArea {
    position: relative;
    width: calc(100% + (100vw - 100%) / 2);
    padding-bottom: 10rem; }
  .instaAreaWrap .instaSlider {
    position: relative;
    width: 100%; }
    .instaAreaWrap .instaSlider .instagram-gallery-feed {
      width: 100% !important; }
    .instaAreaWrap .instaSlider .instagram-gallery-item {
      overflow: hidden;
      border-radius: 1.4rem; }
    .instaAreaWrap .instaSlider .instagram-gallery-item__media-wrap {
      overflow: hidden;
      border-radius: 1.4rem; }
    .instaAreaWrap .instaSlider .swiper-pagination {
      display: none !important; }
    .instaAreaWrap .instaSlider .instagram-gallery__actions,
    .instaAreaWrap .instaSlider .instagram-gallery-button {
      display: none !important; }
    .instaAreaWrap .instaSlider .swiper-button-prev,
    .instaAreaWrap .instaSlider .swiper-button-next {
      opacity: 0 !important;
      pointer-events: none !important; }
  .instaAreaWrap .instaNav {
    position: absolute;
    left: 0;
    bottom: 1rem;
    display: flex;
    gap: 1rem;
    z-index: 20; }
    .instaAreaWrap .instaNav button {
      width: 5.8rem;
      height: 5.8rem;
      padding: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      border: 0;
      border-radius: 50%;
      background: #333;
      color: #fff;
      cursor: pointer; }
      .instaAreaWrap .instaNav button i {
        font-size: 1.8rem; }
    .instaAreaWrap .instaNav .instaNav__prev i {
      transform: rotate(180deg); }
  .instaAreaWrap .instaFollow {
    position: absolute;
    left: 76%;
    bottom: 1rem;
    transform: translateX(-50%);
    z-index: 20; }
    .instaAreaWrap .instaFollow a {
      display: flex;
      align-items: center;
      gap: 1.4rem;
      color: #fff;
      text-decoration: none; }
    .instaAreaWrap .instaFollow .instaFollow__icon {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 5.8rem;
      height: 5.8rem;
      flex-shrink: 0;
      border-radius: 50%;
      background: #fff;
      color: #333;
      font-size: 2.8rem; }
    .instaAreaWrap .instaFollow .instaFollow__txt {
      color: #fff;
      font-size: 1.5rem;
      font-weight: 700;
      white-space: nowrap;
      text-decoration: underline;
      text-underline-offset: .4rem; }
  .instaAreaWrap .instagram-gallery-item__icon--views {
    font-size: 3vw;
    padding: 0;
    margin: 0;
    top: 50%;
    left: 62%;
    opacity: 1;
    transform: translate(-50%, -62%);
    -webkit-transform: translate(-50%, -62%);
    -ms-transform: translate(-50%, -62%); }
  @media (max-width: 767px) {
    .instaAreaWrap .instagram-gallery-item__icon--views {
      font-size: 8vw; }
    .instaAreaWrap .leadBox {
      margin-bottom: 0; }
    .instaAreaWrap .instaArea {
      width: 100%;
      padding-bottom: 7rem; }
    .instaAreaWrap .instaAreaInner {
      width: 95%;
      margin: 0 0 0 auto; }
    .instaAreaWrap .instaSlider .instagram-gallery-item,
    .instaAreaWrap .instaSlider .instagram-gallery-item__media-wrap {
      border-radius: 1rem; }
    .instaAreaWrap .instaNav {
      bottom: 1rem; }
      .instaAreaWrap .instaNav button {
        width: 4.6rem;
        height: 4.6rem; }
        .instaAreaWrap .instaNav button i {
          font-size: 1.5rem; }
    .instaAreaWrap .instaFollow {
      left: auto;
      right: 0;
      bottom: 1rem;
      transform: none; }
      .instaAreaWrap .instaFollow .instaFollow__icon {
        width: 4.6rem;
        height: 4.6rem;
        font-size: 2.3rem; }
      .instaAreaWrap .instaFollow .instaFollow__txt {
        font-size: 1.3rem; } }

/* ---------------------------------------
home10
--------------------------------------- */
#home10 {
  position: relative; }
  #home10 .inner16 {
    position: relative; }
  #home10 .illust {
    position: absolute;
    z-index: 1; }
  #home10 .illust1 {
    position: absolute;
    top: -6vw;
    left: 0;
    right: 0;
    width: clamp(90rem, calc(8.6956521739vw + 81.3043478261rem), 98rem);
    height: auto;
    margin: 0 auto;
    z-index: 0; }
  #home10 .illust2 {
    top: -3.5vw;
    left: 0;
    right: 0;
    width: clamp(16rem, calc(8.6956521739vw + 7.3043478261rem), 24rem);
    height: auto;
    margin: 0 auto; }
  #home10 .ttl {
    color: #2DA338;
    font-size: 4.2rem;
    text-align: center; }
  #home10 .charaBoxs {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    column-gap: clamp(2rem, calc(2.1739130435vw + -0.1739130435rem), 4rem);
    row-gap: clamp(4rem, calc(2.1739130435vw + 1.8260869565rem), 6rem); }
  #home10 .charaBox {
    text-align: center; }
    #home10 .charaBox .pic {
      display: flex;
      align-items: center;
      justify-content: center;
      width: clamp(22rem, calc(6.5217391304vw + 15.4782608696rem), 28rem);
      aspect-ratio: 1 / 1;
      margin: 0 auto 2rem; }
      #home10 .charaBox .pic img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: contain; }
    #home10 .charaBox .name {
      width: fit-content;
      min-width: clamp(11rem, calc(5.4347826087vw + 5.5652173913rem), 16rem);
      margin: 0 auto 2rem;
      padding: .5rem 2rem;
      background: #2DA338;
      border-radius: 10rem;
      color: #fff;
      font-size: clamp(2rem, calc(0.4347826087vw + 1.5652173913rem), 2.4rem);
      line-height: 1.4; }
    #home10 .charaBox .txt {
      font-size: clamp(1.6rem, calc(0.2173913043vw + 1.3826086957rem), 1.8rem); }
  @media (max-width: 999px) {
    #home10 {
      padding-bottom: 6rem; }
      #home10 .illust1 {
        top: clamp(1rem, calc(-1.6025641026vw + 2.6009615385rem), 2rem);
        width: clamp(30rem, calc(25.641025641vw + 20.3846153846rem), 46rem); }
      #home10 .illust2 {
        top: clamp(-2rem, calc(-1.6025641026vw + -0.3990384615rem), -1rem);
        width: clamp(10rem, calc(3.2051282051vw + 8.7980769231rem), 12rem); }
      #home10 .ttl {
        font-size: 2.6rem; }
      #home10 .charaBoxs {
        grid-template-columns: repeat(2, 1fr);
        gap: 2rem 1rem; }
      #home10 .charaBox .pic {
        width: 100%;
        max-width: 18rem;
        margin-bottom: -1rem; }
      #home10 .charaBox .name {
        min-width: 10rem;
        margin-bottom: 1rem;
        padding: .4rem 1.5rem;
        font-size: 1.2rem; }
      #home10 .charaBox .txt {
        font-size: 1rem; } }

#home10 .home10Rainbow {
  opacity: 0;
  clip-path: inset(0 100% 0 0); }
  #home10 .home10Rainbow.is-show {
    animation: home10RainbowShow 1s cubic-bezier(0.22, 1, 0.36, 1) forwards; }
#home10 .home10Sprout {
  opacity: 0;
  translate: 0 4rem;
  scale: .85; }
  #home10 .home10Sprout.is-show {
    animation: home10SproutShow 0.65s cubic-bezier(0.34, 1.56, 0.64, 1) forwards; }

@keyframes home10RainbowShow {
  0% {
    opacity: 1;
    clip-path: inset(0 100% 0 0); }
  100% {
    opacity: 1;
    clip-path: inset(0 0 0 0); } }
@keyframes home10SproutShow {
  0% {
    opacity: 0;
    translate: 0 4rem;
    scale: .85; }
  50% {
    opacity: 1;
    translate: 0 -.6rem;
    scale: 1.06 .94; }
  70% {
    translate: 0 .3rem;
    scale: .98 1.03; }
  85% {
    translate: 0 -.15rem;
    scale: 1.01 .99; }
  100% {
    opacity: 1;
    translate: 0 0;
    scale: 1; } }
/* ---------------------------------------
home11
--------------------------------------- */
#home11 {
  position: relative;
  overflow-x: clip; }
  #home11 .bgMori {
    position: absolute;
    z-index: -1; }
    #home11 .bgMori.left {
      left: 0;
      top: -64%;
      width: clamp(126rem, calc(32.6086956522vw + 93.3913043478rem), 156rem);
      height: auto; }
    #home11 .bgMori.right {
      bottom: 14%;
      right: 0%;
      width: clamp(60rem, calc(21.7391304348vw + 38.2608695652rem), 80rem);
      height: auto; }
  #home11 .inner14 {
    position: relative; }
    #home11 .inner14::before {
      content: "";
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      z-index: 0;
      width: 85.714%;
      background: #fff;
      border-radius: clamp(10rem, calc(10.8695652174vw + -0.8695652174rem), 20rem); }
  #home11 .illust {
    position: absolute;
    z-index: 1;
    width: clamp(24rem, calc(15.2173913043vw + 8.7826086957rem), 38rem);
    height: auto; }
  #home11 .illust1 {
    top: -7vw;
    left: -9vw; }
  #home11 .illust2 {
    bottom: -4.5vw;
    right: -2vw;
    z-index: -1; }
  #home11 .wrap {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    min-height: clamp(64rem, calc(13.0434782609vw + 50.9565217391rem), 76rem);
    padding: clamp(6rem, calc(4.347826087vw + 1.652173913rem), 10rem) 0 clamp(6rem, calc(4.347826087vw + 1.652173913rem), 10rem) clamp(6rem, calc(4.347826087vw + 1.652173913rem), 10rem); }
  #home11 .box {
    position: relative;
    z-index: 2;
    width: 50%; }
  #home11 .subTtl {
    color: #2DA338;
    font-size: clamp(2.4rem, calc(0.8695652174vw + 1.5304347826rem), 3.2rem); }
  #home11 .ttl {
    color: #2DA338;
    font-size: clamp(8rem, calc(2.1739130435vw + 5.8260869565rem), 10rem);
    line-height: 1; }
  #home11 .catch {
    position: relative;
    z-index: 2;
    width: max-content;
    color: #2DA338;
    font-size: clamp(2.8rem, calc(0.8695652174vw + 1.9304347826rem), 3.6rem);
    line-height: 1.5; }
    #home11 .catch span {
      padding: .2rem .8rem;
      background: #fff;
      border-radius: .8rem;
      -webkit-box-decoration-break: clone;
      box-decoration-break: clone; }
  #home11 .pic {
    position: relative;
    z-index: 1;
    width: 52%;
    aspect-ratio: 740 / 560;
    margin-left: clamp(-4rem, calc(2.1739130435vw + -6.1739130435rem), -2rem);
    overflow: hidden;
    flex-shrink: 0; }
    #home11 .pic img {
      display: block;
      width: 100%;
      height: 100%;
      object-fit: cover; }
  @media (max-width: 999px) {
    #home11 .bgMori.left {
      top: -24%;
      width: 42rem; }
    #home11 .illust1 {
      top: -2rem;
      left: inherit;
      width: 11rem;
      right: -10px; }
    #home11 .illust2 {
      width: 11rem;
      right: inherit;
      left: 0; }
    #home11 .inner14::before {
      width: 100%;
      border-radius: 3rem;
      bottom: 10rem; }
    #home11 .wrap {
      display: block;
      min-height: 0;
      padding: 3rem 2rem; }
    #home11 .box {
      width: 100%;
      margin-bottom: 4rem; }
    #home11 .subTtl {
      font-size: 2rem; }
    #home11 .ttl {
      font-size: 5rem; }
    #home11 .catch {
      width: 100%;
      font-size: 1.6rem; }
    #home11 .pic {
      width: 100%;
      margin-left: 0; } }

#home11 .home11Pic {
  opacity: 0;
  scale: .85; }
  #home11 .home11Pic.is-show {
    animation: home11PicZoom 0.8s cubic-bezier(0.25, 1, 0.5, 1) forwards; }
#home11 .home11Catch {
  opacity: 0;
  translate: -5rem 0; }
  #home11 .home11Catch.is-show {
    animation: home11CatchSlide 0.7s cubic-bezier(0.25, 1, 0.5, 1) forwards; }

@keyframes home11PicZoom {
  0% {
    opacity: 0;
    scale: .85; }
  100% {
    opacity: 1;
    scale: 1; } }
@keyframes home11CatchSlide {
  0% {
    opacity: 0;
    translate: -5rem 0; }
  100% {
    opacity: 1;
    translate: 0 0; } }