@charset "UTF-8";

.recommend-section{
  margin-block: 3rem;

  .recommend-section__title{
    padding-inline: 1.5rem;
  }
}

.recommend-container{
  max-width: 100vw;

  [class*="__recommend--slider"]{
    border-radius: 0;
    padding: 2rem 1.5rem;
    overflow: hidden;
  }

  .dv_recommend{
    overflow: hidden;
    box-shadow: 0px 0px 2rem 0px rgba(29, 24, 26, 0.1);
    border-radius: 1.5rem;
    width: max-content;
  }

  .dv_rc_items{
    background-color: var(--color-white);
    border-right: 1px solid var(--color-bg-gray-light);
    border-radius: 1.5rem;
  }

  .add-cart-slider__item--image{
    width: 100%;
    aspect-ratio: 1;

    :where(img){
      width: 100%;
      height: auto;
      object-fit: contain;
    }
  }

  :where(a){
    text-decoration: none;
  }

  .dv_rc_name{
    --clamp-line: 1;
    padding: 1.5rem 1.5rem 0;
    margin-bottom: 1rem;
    color: var(--color-text-default);
    font-family: var(--font-ja);
    font-size: 1.3rem;
    font-weight: var(--fw-regular);
    letter-spacing: 0.08em;
    line-height: 1.3;
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: var(--clamp-line);
    line-clamp: var(--clamp-line);
  }

  .dv_rc_description{
    padding: 0 1.5rem 1rem;
    font-size: 1.6rem;
    font-family: var(--font-en);
  }

  .dv_rc_price:not(:empty){
    background-color: var(--color-emphasis);
    color: var(--color-white);
    font-size: 1rem;
    letter-spacing: 0.05em;
    line-height: 1;
    padding: 0.3rem 0.4rem;
    margin-inline: 1.5rem;
    margin-bottom: 2rem;
    display: inline-block;
  }
}

[id^="recommender_"]{
  transition: opacity var(--transition-default);

  &.swiper-initialized{
    opacity: 1;
  }
  
  &:not(.swiper-initialized){
    height: 34rem;
    opacity: 0;
  }
}