/**********
** p-knee-feature
***********************************/
.p-knee-feature__bg {
  background-color: #FAFAFA;
  padding-block: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-knee-feature__bg {
    padding-block: 6.25rem;
  }
}

.p-knee-feature__img {
  margin-top: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-knee-feature__img {
    margin-top: 3.125rem;
  }
}

.p-knee-feature__img img {
  aspect-ratio: 345/230;
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
}
@media screen and (min-width: 768px) {
  .p-knee-feature__img img {
    aspect-ratio: 1090/320;
  }
}

.p-knee-feature__textBox {
  margin-top: 1.25rem;
}

@media screen and (min-width: 768px) {
  .p-knee-feature__text {
    text-align: center;
  }
}

.p-knee-feature__text + .p-knee-feature__text {
  margin-top: 1.6em;
}
@media screen and (min-width: 768px) {
  .p-knee-feature__text + .p-knee-feature__text {
    margin-top: 2.1em;
  }
}

.p-knee-feature__content {
  margin-top: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-knee-feature__content {
    margin-top: 3.125rem;
  }
}

.p-knee-feature__lists {
  display: grid;
  gap: 2.3125rem;
}
@media screen and (min-width: 768px) {
  .p-knee-feature__lists {
    grid-template-columns: repeat(5, 1fr);
    gap: 2.1875rem;
  }
}

/**********
** p-knee-section
***********************************/
.p-knee-section {
  overflow-x: clip;
}

.p-knee-section__bg {
  padding-block: 3.125rem;
  position: relative;
}
@media screen and (min-width: 768px) {
  .p-knee-section__bg {
    padding-block: 6.25rem;
  }
}
._movie .p-knee-section__bg {
  padding-block: 1.9375rem 1.5625rem;
}
@media screen and (min-width: 768px) {
  ._movie .p-knee-section__bg {
    padding-block: 6.25rem;
  }
}

.p-knee-section__bg::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url(../images/knee-feature/bg_movie.webp) repeat top left/contain;
}

.p-knee-section__bg._bgCase {
  padding-block: 1.9375rem 1.5625rem;
}
@media screen and (min-width: 768px) {
  .p-knee-section__bg._bgCase {
    padding-block: 3.125rem;
  }
}

.p-knee-section__bg._bgCase::before {
  background-color: #FAFAFA;
  background-image: none;
}

.p-knee-section__bg._bgColumn {
  padding-block: 1.75rem 3.1875rem;
}
@media screen and (min-width: 768px) {
  .p-knee-section__bg._bgColumn {
    padding-block: 3.125rem;
  }
}

.p-knee-section__bg._bgColumn::before {
  background: none;
}

.p-knee-section__bg._bgQa {
  padding-block: 1.5625rem 1.5625rem;
}
@media screen and (min-width: 768px) {
  .p-knee-section__bg._bgQa {
    padding-block: 3.125rem;
  }
}

.p-knee-section__bg._bgQa::before {
  background: -webkit-gradient(linear, right top, left top, from(#E5DECC), to(#AE9E78));
  background: linear-gradient(270deg, #E5DECC 0%, #AE9E78 100%);
}

.p-knee-section__inner {
  position: relative;
}

.p-knee-section__text {
  margin-top: 1.25rem;
  font-size: 0.875rem;
}
@media screen and (min-width: 768px) {
  .p-knee-section__text {
    text-align: center;
    margin-top: 3.125rem;
  }
}
@media screen and (min-width: 768px) {
  ._case .p-knee-section__text {
    margin-top: 2.625rem;
  }
}

.p-knee-section__slider {
  margin-top: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-knee-section__slider {
    margin-top: 3.125rem;
  }
}
._case .p-knee-section__slider {
  margin-top: 1.875rem;
}
@media screen and (min-width: 768px) {
  ._case .p-knee-section__slider {
    margin-top: 2.5rem;
  }
}

.p-knee-section__cards {
  margin-top: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-knee-section__cards {
    margin-top: 2.5rem;
  }
}

.p-knee-section__accordion {
  margin-top: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-knee-section__accordion {
    margin-top: 2.5rem;
  }
}

.p-knee-section__btn {
  margin-top: 1.25rem;
  text-align: center;
  position: relative;
}
@media screen and (min-width: 768px) {
  .p-knee-section__btn {
    margin-top: 3.375rem;
  }
}
._case .p-knee-section__btn {
  margin-top: 2.0625rem;
}
@media screen and (min-width: 768px) {
  ._case .p-knee-section__btn {
    margin-top: 2.5rem;
  }
}
._column .p-knee-section__btn {
  margin-top: 1.5rem;
}
@media screen and (min-width: 768px) {
  ._column .p-knee-section__btn {
    margin-top: 2.8125rem;
  }
}
@media screen and (min-width: 768px) {
  ._qa .p-knee-section__btn {
    margin-top: 2.5rem;
  }
}/*# sourceMappingURL=page-knee-feature.css.map */