.fv {
  background-image: url(../img/top/fv_background.webp);
  background-size: cover;
  background-position: center top;
  background-repeat: no-repeat;
  & .inner {
    /* height: 55rem;  */
    height: calc(100vh - 4.625rem);
    width: 100%;
    position: relative;
  }
  & .wrap01 {
    position: absolute;
    bottom: 5rem; 
    right: 4.6875rem; 
  }
  & .img01 {
    width: 1.25rem; 
  }
  & .heading {
    text-align: center;
    & .small,
    & .middle,
    & .big {
      font-weight: 800;
      background: var(--mainBlue);
      color: white;
      display: block;
      width: 27.1875rem; 
    }
    & .small {
      font-size: 3.5rem;
      padding: 0.3125rem 0 0.46875rem; 
      margin-bottom: -1.25rem; 
    }
    & .middle {
      font-size: 6.125rem;
      padding-bottom: 0.46875rem; 
      margin-bottom: -1.25rem; 
      & span {
        font-size: 7rem; 
        line-height: 1; 
      }
    }
    & .big {
      font-size: 6.3125rem; 
      padding: 0.15625rem 0 0.46875rem;
    }
  }
}
@media screen and (max-width: 768px) {
  .fv {
    background-image: url(../img/top/fv_background-sp.webp);
    & .inner {
      height: 68.096rem;
      align-items: end;
      padding-bottom: 31.36rem;
      gap: 1.28rem;
    }
    & .wrap01 {
      bottom: 0;
      right: 0;
      position: relative;
    }
    & .img01 {
      width: 1.792rem;
    }
    & .heading {
      & .small,
      & .middle,
      & .big {
        width: 29.568rem;
      }
      & .small {
        font-size: 3.84rem;
      }
      & .middle {
        font-size: 6.4rem;
        & span {
          font-size: 7.68rem;
        }
      }
      & .big {
        font-size: 7.168rem;
      }
    }
  }
}

/* ニューススライダー */
.section00 {
  margin-bottom: 4.6875rem; 
  & .inner {
    padding: 1.25rem 0; 
  }
  & .item {
    position: relative;
    margin-right: 3.125rem; 
    width: 9.8125rem;
    color: var(--mainBlue);
  }
  & .text01,
  & .text02 {
    font-size: 0.75rem; 
    font-weight: 600;
    position: relative;
    padding-left: 1.09375rem; 
    &::before {
      content: '';
      position: absolute;
      left: 0;
      width: 0.5rem; 
      height: 0.5rem; 
      background: var(--mainBlue);
    }
  }
  & .text01 {
    padding-top: 0.09375rem;
    line-height: 1;
    margin-bottom: 0.3125rem;
    &::before {
      top: 50%; 
      transform: translateY(-50%);
    }
  }
  & .text02 {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    &::before {
      top: 0.3125rem; 
    }
  }
}
@media screen and (max-width: 768px) {
  .section00 {
    margin-bottom: 2.5rem;
    & .inner {
      padding: 2.25rem 0;
    }
    & .item {
      margin-right: 5.5rem;
      width: 17.536rem;
    }
    & .text01,
    & .text02 {
      font-size: 1.536rem;
      padding-left: 2.56rem;
      &::before {
        width: 1.024rem;
        height: 1.024rem;
      }
    }
    & .text01 {
      padding-top: 0.32rem;
      margin-bottom: 1rem;
    }
    & .text02 {  
      &::before {
        top: 0.768rem;
      }
    }
  }
}

/* X Kitchenについて */
.section01 {
  & .inner {
    font-weight: 600;
  }
  & .wrap01{
    margin-bottom: 3.75rem;
  }
  & .wrap02 {
    position: relative;
    max-width: 34rem;
    width: 44%;
  }
  & .texts01 {
    flex: 1;
  }
  & .img01 {
    width: 100%;
  }
  & .heading01 {
    font-size: 4.625rem;
    line-height: 1.3;
    margin-bottom: 2.1875rem;
    letter-spacing: -0.025em;
  }
  & .text01 {
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 0.625rem;
  }
  & .text02 {
    font-size: 1.75rem;
    max-width: 41.5rem;
    letter-spacing: 0.05em;
    line-height: 1.6;
  }
  & .link{
    width: 100%;
    background: var(--mainBlue);
    color: var(--mainGray);
    font-size: 2rem;
    gap: 1.875rem;
    padding: 1.875rem 0;
    & img{
      width: 1.5rem;
    }
  }
}
@media screen and (max-width: 768px) {
  .section01 {
    padding-bottom: 0;
    & .wrap01{
      flex-direction: column;
      gap: 2.56rem;
    }
    & .wrap01{
      margin-bottom: 3.84rem;
    }
    & .wrap02 {
      max-width: none;
      width: 100%;
    }
    & .img01{
      width: 100%;
    }
    & .heading01 {
      font-size: 3.84rem;
      margin-bottom: 3.2rem;
      letter-spacing: 0.01em;
    }
    & .text01 {
      font-size: 2.56rem;
      margin-bottom: 1.28rem;
    }
    & .text02 {
      font-size: 1.536rem;
      max-width: 100%;
    }
    & .link{
      font-size: 2.304rem;
      gap: 2.56rem;
      padding: 3rem 0;
      & img{
        width: 3.072rem;
      }
    }
  }
}

/* 採用情報 */
.section03 {
  & .wrap01 {
    margin-bottom: 7rem;
  }
  & .item {
    width: calc(33% + 6px);
    position: relative;
  }
  & .texts01{
    flex: 1;
  }
  & .img01 {
    /* max-width: 35rem; */
    width: 48%;
  }
  & .heading01 {
    font-size: 5.75rem;
    line-height: 1.2;
    margin-bottom: 2.5rem;
    font-weight: 600;
  }
  & .text01 {
    font-size: 2.75rem;
    font-weight: 700;
    margin-bottom: 0.3125rem;
  }
  & .text02 {
    font-size: 1rem;
    font-weight: 600;
    max-width: 31.875rem;
    line-height: 1.8;
  }
  & .common-link {
    gap: 0.625rem;
  }
  & .link{
    position: relative;
    width: 100%;
    padding: 3.75rem 0;
    & .text{
      font-size: 1.5rem;
    }
  }
}
@media screen and (max-width: 768px) {
  .section03 {
    & .wrap01 {
      margin-bottom: 5.12rem;
    }
    & .list{
      flex-direction: column;
    }
    & .item {
      width: 100%;
      border-left: none;
      border-right: none;
      &:not(:last-child) {
        border-bottom: 3px solid var(--mainBlue);
      }
    }
    & .img01 {
      max-width: 99%;
      width: 99%;
      margin-bottom: 3.2rem;
    }
    & .heading01 {
      font-size: 5.504rem;
      margin-bottom: 3.2rem;
    }
    & .text01 {
      font-size: 3.072rem;
      margin-bottom: 0.64rem;
    }
    & .text02 {
      font-size: 1.536rem;
      max-width: 100%;
    }
    & .link{
      padding: 3rem 0;
      & .text {
        font-size: 2.304rem;
      }
    }
  }
}

/* サービス */
.section04 {
  padding-bottom: 5rem;
  & .wrap01 {
    &.reverse {
      flex-direction: row-reverse;
    }
  }
  & .wrap02,
  & .wrap03 {
    width: 50%;
  }
  & .wrap02 {
    padding: 3.125rem 0;
    gap:0;
    &.reverse {
      flex-direction: row-reverse;
    }
  }
  & .wrap04{
    display: contents;
  }
  & .texts01{
    flex: 1;
    padding: 0 1.5rem;
  }
  & .texts02 {
    &:not(:last-child) {
      padding-bottom: 2.1875rem;
      margin-bottom: 2.5rem;
    }
  }
  & .texts03 {
    width: 88%;
    margin: 0 auto;
  }
  & .img01 {
    max-width: 30rem;
    width: 70%;
  }
  & .img02{
    width: 2.75rem;
  }
  & .img03 {
    width: 2.75rem;
  }
  & .heading01 {
    font-size: 7rem;
    font-weight: 700;
    padding: 3.125rem 0 1.25rem;
  }
  & .heading02 {
    font-size: 3.25rem;
    font-weight: 600;
    line-height: 1.3;
    margin-bottom: 2.1875rem;
    & span{
      position: relative;
      z-index: 1;
      transition: all 0.6s ease 0s;
      padding-right: 0.78125rem;
      &::before{
        content: "";
        background: var(--mainBlue);
        position: absolute;
        z-index: -1;
        top: 0;
        bottom: 0;
        left: -0.46875rem;
        width: 0;
        transition: all 0.6s ease 0s;
      }
    }
    &:hover{
      & span{
        color: var(--mainGray);
        &::before{
          width: 100%;
          right: 0;
        }
      }
    }
  }
  & .text01 {
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: 0.46875rem;
  }
  & .text02 {
    font-size: 4.0625rem;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0.001em;
  }
  & .text03 {
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 2;
    margin-bottom: 1.875rem;
  }
  & .link {
    border: 3px solid var(--mainBlue);
    color: var(--mainBlue);
    font-size: 0.75rem;
    border-radius: 2rem;
    width: 11.1875rem;
    gap: 1.25rem;
    font-weight: 700;
    & span {
      padding-top: 0.3125rem;
    }
  }
  & .animation-link {
    padding: 3.125rem 0;
    gap: 1.25rem;
    & .text {
      font-size: 1.5rem;
    }
  }
}
@media screen and (max-width: 768px) {
  .section04 {
    padding-bottom: 6rem;
    & .wrap01 {
      flex-direction: column-reverse;
      &.reverse {
        flex-direction: column-reverse;
      }
    }
    & .wrap02,
    & .wrap03 {
      width: 100%;
      padding: 3.5rem 0;
    }
    & .wrap02 {
      gap: 0;
      flex-direction: column;
      border-right: none;
      border-top: 3px solid var(--mainBlue);
      &.reverse {
        border-top: 3px solid var(--mainBlue);
        flex-direction: column;
      }
    }
    & .wrap03{
      border-right: none;
    }
    & .wrap04{
      display: flex;
      width: 94%;
      margin: 0 auto 3rem;
      gap: 1.5rem;
      &.reverse{
        flex-direction: row-reverse;
      }
    }
    & .texts01{
      flex: 1;
      padding: 0;
    }
    & .texts03 {
      width: 90%;
    }
    & .img01 {
      max-width: 29.056rem;
      width: 70%;
    }
    & .img02{
      width: 5.632rem;
    }
    & .heading01 {
      font-size: 7.424rem;
      padding: 3.125rem 0 2rem;
    }
    & .heading02 {
      font-size: 4rem;
      padding: 0;
    }
    & .text01 {
      font-size: 1.536rem;
      margin-bottom: 0.8rem;
    }
    & .text02 {
      font-size: 3.584rem;
    }
    & .text03 {
      font-size: 1.536rem;
      margin-bottom: 2.75rem;
    }
    & .link {
      font-size: 1.5rem;
      width: 94%;
      gap: 9rem;
      border-radius: 3.84rem;
      & span{
        text-align: center;
      }
      &.sp{
        display: flex;
      }
    }
    & .animation-link {
      padding: 3rem 0;
      & .text{
        font-size: 2.304rem;
      }
    }
  }
}

/* 会社情報 */
.section05 {
  & .item {
    position: relative;
  }
  & .texts01 {
    gap: 1.875rem;
  }
  & .heading {
    font-size: 3rem;
    font-weight: 700;
    margin-bottom: 1.5625rem;
  }
  & .text01 {
    font-size: 1.5rem;
    font-weight: 600;
  }
  & .text02 {
    font-size: 1.5625rem;
    font-weight: 600;
  }
  & .text03 {
    padding-top: 0.3125rem;
    font-size: 1rem;
    font-weight: 600;
  }
  & .animation-link{
    padding: 2.5rem 0;
    transition: all 0.05s ease 0s;
  }
}
@media screen and (max-width: 768px) {
  .section05 {
    & .item {
      padding: 3.25rem 0;
    }
    & .texts01 {
      gap: 1.25rem;
    }
    & .img01{
      width: 2.048rem;
    }
    & .heading {
      font-size: 3.072rem;
      margin-bottom: 2rem;
    }
    & .text01 {
      font-size: 2.304rem;
    }
    & .text02 {
      font-size: 3.2rem;
    }
    & .text03 {
      padding-top: 0.75rem;
      font-size: 1.536rem;
    }
    & .animation-link .texts::after{
      width: 2.176rem;
      height: 2.816rem;
    }
  }
}