.index-hero {
  padding: 3.6rem 0;
  background: #F8F8F8; }
  @media (max-width: 1023px) {
    .index-hero {
      padding: 20px 0; } }
  .index-hero__inner {
    display: grid;
    grid-template-columns: 69% auto;
    gap: 2.4rem; }
    @media (max-width: 1023px) {
      .index-hero__inner {
        gap: 16px; } }
    @media (max-width: 767px) {
      .index-hero__inner {
        grid-template-columns: 100%; } }
  .index-hero__slider {
    padding-bottom: 32%;
    position: relative; }
    @media (max-width: 424px) {
      .index-hero__slider {
        padding-bottom: 69.4%; } }
  .index-hero__item {
    border-radius: 1rem; }
    @media (max-width: 1023px) {
      .index-hero__item {
        border-radius: 10px; } }
    .index-hero__item img,
    .index-hero__item picture {
      display: block;
      width: 100%;
      height: 100%;
      object-fit: cover; }
  .index-hero__banner {
    padding-bottom: 35%;
    position: relative;
    overflow: hidden;
    box-shadow: 2px 2px 20px 0px rgba(0, 0, 0, 0.1);
    border-radius: 1rem;
    transition: all ease .3s; }
    @media (max-width: 1023px) {
      .index-hero__banner {
        border-radius: 10px;
        box-shadow: 2px 2px 20px 0px rgba(0, 0, 0, 0.25); } }
    @media (min-width: 1024px) {
      .index-hero__banner {
        cursor: pointer; }
        .index-hero__banner:hover {
          box-shadow: 2px 2px 20px 0px rgba(0, 0, 0, 0.25); } }
    @media (max-width: 424px) {
      .index-hero__banner {
        padding-bottom: 38%;
        box-shadow: 2px 2px 20px 0px rgba(0, 0, 0, 0.25); } }
  .index-hero__img-wrap {
    transition: all 0.3s ease;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center; }
    .index-hero__img-wrap img {
      width: 100%;
      height: 100%;
      object-fit: cover; }
  .index-hero .index-hero__item--main {
    grid-row: 1/3; }
    @media (max-width: 767px) {
      .index-hero .index-hero__item--main {
        grid-column: auto; } }

.slider-fs {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  top: 0; }
  .slider-fs .splide__track {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0; }
  .slider-fs .splide__slide picture {
    overflow: hidden;
    border-radius: 1rem; }
    @media (max-width: 1023px) {
      .slider-fs .splide__slide picture {
        border-radius: 10px; } }
  .slider-fs .splide__slide .lazy-img-wrap {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0; }