@charset "UTF-8";
.index-hero {
  height: 55rem;
  overflow: hidden;
}

.index-hero__bg-wrapper {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background: url(../img/decor/hero_back.jpg) no-repeat center center/cover;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 42.916375rem;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  left: calc((100% - 100vw) / 2);
  position: absolute;
  width: 100vw;
}

.index-hero__bg-ribbon {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 53.64546875vw;
  overflow: hidden;
  position: absolute;
  right: 0;
  top: 0;
  -webkit-transition: width 1s;
  transition: width 1s;
  width: 0;
}

.index-hero__bg-ribbon picture {
  aspect-ratio: 1280/686.662;
  position: absolute;
  right: 0;
  top: 0;
  width: 100vw;
}

.index-hero__bg-ribbon picture source,
.index-hero__bg-ribbon picture img {
  width: 100%;
  height: 42.916rem;
}

.index-hero__bg-ribbon.--scrolled {
  width: 100%;
}

.index-hero__bg-shape-left {
  left: 0;
  position: absolute;
  top: 0;
  width: 12.91625rem;
}

.index-hero__bg-shape-left source,
.index-hero__bg-shape-left img {
  height: 42.916375rem;
  width: 100%;
}

.index-hero__bg-shape-right {
  position: absolute;
  right: 0;
  top: 0;
  width: 55.20625rem;
}

.index-hero__bg-shape-right source,
.index-hero__bg-shape-right img {
  height: 42.916375rem;
  width: 100%;
}

.index-hero__bg-text {
  left: 1.5625rem;
  position: absolute;
  top: 5rem;
}

/*見出し文字サイズ*/
.index-hero__bg-text h1 {
  color: #f62837;
  font-size: 4rem;
  font-weight: 700;
  line-height: 1.2;
  opacity: 0;
  -webkit-animation: fadeInFromLeft 0.8s 0s forwards;
          animation: fadeInFromLeft 0.8s 0s forwards;
}

.index-hero__bg-text p {
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.5;
  margin-top: 1.8125rem;
  opacity: 0;
  -webkit-animation: fadeInFromLeft 0.8s 0.5s forwards;
          animation: fadeInFromLeft 0.8s 0.5s forwards;
}

.index-hero__text {
  bottom: 0;
  font-size: 1.5rem;
  font-weight: 700;
  left: 50%;
  line-height: 1.25;
  position: absolute;
  text-align: center;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  width: 100%;
}

.index-cta {
  padding-bottom: 3.1875rem;
  padding-top: 3rem;
}

.badge {
  padding: 4px 18px;
  width: -moz-fit-content;
  width: -webkit-fit-content;
  width: fit-content;
}

.news {
  padding-top: 2.875rem;
  padding-bottom: 2.875rem;
  overflow: hidden;
}

.news__inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0;
}

.news__title-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.news__ttl {
  font-size: 3.75rem;
  font-weight: 800;
}

.news__cat {
  color: #f62837;
  font-size: 1rem;
  font-weight: 700;
  line-height: normal;
}

.tab-list {
  margin-top: 0.875rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  width: 100%;
  max-width: 953px;
  gap: 0.625rem;
}
@media (max-width: 768px) {
  .tab-list {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}

.tab-item {
  border-radius: 5px 5px 0 0;
  background-color: #949494;
  padding: 0.1875rem 1.2rem;
  cursor: pointer;
  color: #FFF;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.875;
  width: 17.875rem;
  text-align: center;
}
.tab-item.--active {
  background-color: #F62837;
}
@media (max-width: 768px) {
  .tab-item {
    font-size: 0.875rem;
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    padding: 0.1875rem 0.75rem;
  }
}

.news__list-add {
  width: 100%;
  max-width: 953px;
  border-radius: 0;
  padding: 0;
  display: none;
}
.news__list-add.--active {
  display: block;
}

.news__item-add {
  padding: 0.75rem 2.3125rem 0.75rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 0;
}
@media (max-width: 768px) {
  .news__item-add {
    padding: 1rem 1rem 1rem;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
  }
}

.news__item-header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.news__date-add {
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.875;
  width: 7.5rem;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  color: #000;
  font-family: "Noto Sans JP", sans-serif;
  line-height: 1.875;
}
@media (max-width: 768px) {
  .news__date-add {
    font-size: 0.875rem;
    width: 5.5rem;
  }
}

.badge-wrapper {
  width: 12.5rem;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}

.badge-add {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 0;
  width: 7.6875rem;
  height: 2.1875rem;
  border-radius: 0.3125rem;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 0.8125rem;
  font-weight: 700;
}
.badge-add.is-ir {
  width: 5rem;
  font-weight: 500;
}
.badge-add.is-green {
  color: #fff;
  background: #2E9D62;
}
.badge-add.is-blue {
  color: #fff;
  background: #0D55C8;
}
.badge-add.is-orange {
  color: #fff;
  background: #FF8C00;
}
.badge-add.is-skyblue {
  color: #fff;
  background: #4F8FE8;
}
.badge-add.is-red {
  color: #fff;
  background: #F62837;
}
@media (max-width: 768px) {
  .badge-add {
    font-size: 0.75rem;
    padding: 0.1875rem 0.875rem;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    min-width: 5rem;
    height: 1.5rem;
  }
}

.news__txt-add {
  color: #000;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.875;
}
@media (max-width: 768px) {
  .news__txt-add {
    font-size: 0.875rem;
    margin-top: 0.2rem;
    width: 100%;
  }
}

.news__btn-wrapper {
  margin-top: 1.4375rem;
  display: none;
}
.news__btn-wrapper.--active {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

@media (max-width: 768px) {
  .news__btn-wrapper .c-btn__round span {
    font-size: 0.875rem; /* 好きな小ささに調整（例: 0.75〜0.9rem） */
  }
}

.news__btn {
  width: 16.6875rem;
}
.news__btn span {
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.2;
}
.news__btn span::after {
  right: -5rem;
}

.index-upper-divider {
  height: 19.28125vw;
  margin-top: 2.5625rem;
  position: relative;
}

.index-upper-divider__image {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 19.28125vw;
  overflow: hidden;
  position: absolute;
  right: 0;
  top: 0;
  -webkit-transition: width 1s;
  transition: width 1s;
  width: 0;
}

.index-upper-divider__image .index-upper-divider__image-wrapper {
  aspect-ratio: 1280/246.8;
  position: absolute;
  right: 0;
  top: 0;
  width: 100vw;
}

.index-upper-divider__image .index-upper-divider__image-wrapper img {
  width: 100%;
}

.index-upper-divider__image.--scrolled {
  width: 100%;
}

/* 初期状態（全デバイスで非表示） */
br.pc-only {
  display: none;
}

/* PC（例：幅1025px以上）のみ表示 */
@media screen and (min-width: 1025px) {
  br.pc-only {
    display: inline;
  }
}
.about__content h2 {
  font-size: 3.75rem;
  font-weight: 800;
}

.about__content h3 {
  font-size: 1rem;
  font-weight: 700;
}

.about__content p {
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.875;
}

.index-about__btn-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-top: 1.25rem;
}

.service__content h2 {
  font-size: 3.75rem;
  font-weight: 800;
}

.service__content span {
  display: block;
  font-size: 1rem;
  font-weight: 700;
  text-align: center;
}

.service__content h3 {
  font-size: 1.3rem;
  font-weight: 600;
  line-height: 1.875;
}

.service__content p {
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.875;
}

.index-service__btn-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-top: 1.1875rem;
}

.index-down-divider {
  height: 19.28125vw;
  margin-bottom: 1.25rem;
  margin-top: 1.25rem;
  position: relative;
}

.index-down-divider__image {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 19.28125vw;
  left: 0;
  overflow: hidden;
  position: absolute;
  top: 0;
  -webkit-transition: width 1s;
  transition: width 1s;
  width: 0;
}

.index-down-divider__image .index-down-divider__image-wrapper {
  aspect-ratio: 1280/246.8;
  left: 0;
  position: absolute;
  top: 0;
  width: 100vw;
}

.index-down-divider__image .index-down-divider__image-wrapper img {
  width: 100%;
}

.index-down-divider__image.--scrolled {
  width: 100%;
}

.company__ttl {
  font-size: 3.75rem;
  font-weight: 800;
}

.company__sub {
  display: block;
  font-size: 1rem;
  font-weight: 700;
  text-align: center;
}

.company__link {
  font-size: 1.25rem;
}

.recruit__ttl {
  font-size: 3.75rem;
  font-weight: 800;
}

.recruit__sub {
  display: block;
  font-size: 1rem;
  font-weight: 700;
  text-align: center;
}

.recruit__lead {
  font-size: 1rem;
}

.index-about__btn-wrapper {
  margin-top: 0;
}

.recruit__actions .c-btn__round span::after {
  top: 45%;
}

.scroll-infinity {
  margin-left: calc((100% - 100vw) / 2);
  width: 100vw;
}

.scroll-infinity__wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 0.375rem;
  overflow: hidden;
}

.scroll-infinity__list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 0.375rem;
  list-style: none;
  padding: 0;
}

.scroll-infinity__list--left {
  -webkit-animation: infinity-scroll-left 40s infinite linear 0.5s both;
          animation: infinity-scroll-left 40s infinite linear 0.5s both;
}

.scroll-infinity__item {
  border-radius: 0.75rem;
  height: 18.375rem;
  overflow: hidden;
  width: 15.25rem;
}

.scroll-infinity__item img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

@media (max-width: 900px) {
  .service__grid-2cols {
    row-gap: 3.25rem;
  }
}
@media screen and (max-width: 769px) {
  .index-hero {
    height: 23.875rem;
  }
  .index-hero__bg-wrapper {
    height: 100%;
  }
  .index-hero__bg-ribbon {
    height: 40rem;
  }
  .index-hero__bg-ribbon picture {
    aspect-ratio: 774/747;
    height: 22.625rem;
  }
  .index-hero__bg-ribbon picture source,
  .index-hero__bg-ribbon picture img {
    height: 22.619125rem;
  }
  .index-hero__bg-shape-left {
    bottom: 0;
    width: 6.214375rem;
  }
  .index-hero__bg-shape-left source,
  .index-hero__bg-shape-left img {
    height: 20rem;
  }
  .index-hero__bg-shape-right {
    bottom: 0;
    width: 13.55375rem;
  }
  .index-hero__bg-shape-right source,
  .index-hero__bg-shape-right img {
    height: 20rem;
  }
  .index-hero__bg-text {
    left: 0;
    right: 0;
    text-align: center;
    top: 5.75rem;
  }
  .index-hero__bg-text h1 {
    font-size: 1.8rem;
  }
  .index-hero__bg-text p {
    font-size: .9rem;
    margin-top: 0.725rem;
  }
  .index-hero__text {
    font-size: 0.9rem;
  line-height: 1.5;
  }
  .index-cta {
    padding-bottom: 1.875rem;
    padding-top: 1.25rem;
  }
  .news__ttl {
    font-size: 1.875rem;
  }
  .news__cat {
    font-size: 0.75rem;
  }
  .index-upper-divider {
    margin-top: 1.875rem;
  }
  .about__content h2 {
    font-size: 1.875rem;
  }
  .about__content h3 {
    font-size: 0.875rem;
  }
  .about__content p {
    font-size: 0.875rem;
  }
  .service__content h2 {
    font-size: 1.875rem;
  }
  .service__content span {
    font-size: 0.875rem;
  }
  .service__content h3 {
    font-size: 0.875rem;
  }
  .service__content p {
    font-size: 0.875rem;
  }
  .index-down-divider {
    margin-top: 0;
  }
  .company__ttl {
    font-size: 1.875rem;
  }
  .company__sub {
    font-size: 0.875rem;
  }
  .company__link {
    font-size: 1rem;
  }
  .recruit__ttl {
    font-size: 1.875rem;
  }
  .recruit__sub {
    font-size: 0.875rem;
  }
  .recruit__lead {
    font-size: 0.875rem;
  }
  .recruit__actions .c-btn__round {
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    width: 11.5rem;
  }
  .recruit__actions .c-btn__round span {
    width: 100%;
  }
}
@media (max-width: 768px) {
  .index-hero .l-inner.l-inner__hero > .index-hero__text {
    translate: 0 44px !important; /* Xはそのまま、Yだけ+24px */
    will-change: transform; /* レンダリング安定用（任意） */
  }
}
@media (max-width: 768px) {
  .index-hero__text {
    -webkit-transform: translateX(-50%) translateY(33px) !important;
            transform: translateX(-50%) translateY(33px) !important; /* 元のX位置を維持 */
  }
}
/* --- SPだけの調整 --- */
@media (max-width: 768px) {
  /* ① ヒーローの下に確実な余白を作る（切り落とし防止） */
  .index-hero {
    padding-bottom: 32px; /* 欲しい分だけ調整：24〜48px */
    overflow: visible; /* 念のためはみ出し許可 */
    position: relative;
    z-index: 0;
  }
  /* ② CTAセクションをSPだけ下げる（HTMLに合わせたセレクタ） */
  .index-cta {
    margin-top: 44px; /* 好みで 24〜60px */
    position: relative;
    z-index: 1; /* ヒーローの上に出す */
  }
  /* ③ 実カードのレイアウト（HTMLに合わせた命名） */
  .c-cta {
    display: grid;
    gap: 24px;
    grid-template-columns: 1fr; /* SPは1列 */
    max-width: 800px;
    margin: 0 auto;
  }
  /* ④ 既存の .c-cta-card をそのまま使う */
  .c-cta-card {
    padding: 16px;
    border-radius: 12px;
    text-align: center;
    color: #fff;
  }
  .c-cta-card.--blue {
    background: #1d6cf0;
  }
  .c-cta-card.--orange {
    background: #ff8144;
  }
}

@media (max-width: 768px) {
  .c-cta-card__title {
    font-size: clamp(18px, 1.8vw, 25px);
  }
}


@-webkit-keyframes infinity-scroll-left {
  from {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  to {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
  }
}
@keyframes infinity-scroll-left {
  from {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  to {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
  }
}

@media (max-width: 768px) {
  .recruit__lead br {
    display: none;
  }
}