﻿.recommendSlider {
  width: 100%;
  height: auto;
  margin-left: auto;
  margin-right: auto;
  padding-left: 0px;
  padding-right: 0px;
  position: relative;
  /* the parent */ }
  .recommendSlider .slick-slide {
    margin: 0 10px; }
  .recommendSlider .slick-list {
    margin: 0 -10px; }
  .recommendSlider__item {
    transition: box-shadow 2s;
    cursor: pointer;
    position: relative;
    margin: 4px;
    padding: 8px;
    display: flex !important;
    flex-direction: column;
    box-shadow: 0px 4px 8px rgba(103, 109, 126, 0.16);
    border: 1px solid #F6F8FA;
    background-color: #fff;
    border-radius: 16px; }
    .recommendSlider__item:focus {
      border: none !important; }
    .recommendSlider__item--left {
      width: 100%;
      padding-top: 10px; }
      .recommendSlider__item--left img {
        object-fit: cover; }
    .recommendSlider__item--right {
      /*  padding-left: 10px;*/
      padding-top: 10px;
      width: 100%; }
      .recommendSlider__item--right .item-name {
        align-items: center;
        font-weight: 600;
        font-size: 14px;
        line-height: 24px;
        /* identical to box height, or 171% */
        color: #393D42;
        height: 48px;
        text-overflow: ellipsis;
        overflow: hidden;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical; }
      .recommendSlider__item--right .pack-size {
        font-weight: normal;
        font-size: 12px;
        line-height: 18px;
        color: #808080; }
      .recommendSlider__item--right .price-area {
        display: flex;
        flex-direction: column;
        margin-top: 5px;
        height: 38px; }
        .recommendSlider__item--right .price-area .normal-price {
          color: #191E28;
          font-size: 16px;
          font-weight: bold;
          font-weight: 600;
          min-height: 30px; }
        .recommendSlider__item--right .price-area .promotion-price {
          font-weight: 600;
          font-size: 18px;
          line-height: 24px;
          color: #ED1516;
          margin-right: 10px; }
        .recommendSlider__item--right .price-area .markup-price {
          font-size: 12px;
          line-height: 14px;
          color: #C1C0C0;
          text-decoration-line: line-through; }

.recommend-miniSlider {
  width: 100%;
  height: auto;
  margin-left: auto;
  margin-right: auto;
  padding-left: 0px;
  padding-right: 0px;
  position: relative;
  /* the parent */ }
  .recommend-miniSlider .slick-slide {
    margin: 0 10px; }
  .recommend-miniSlider .slick-list {
    margin: 0 -15px; }
  .recommend-miniSlider .slick-track {
    padding-left: 5px;
    padding-right: 16px; }
  .recommend-miniSlider__item {
    transition: box-shadow 2s;
    cursor: pointer;
    position: relative;
    margin: 4px;
    padding: 8px;
    display: flex !important;
    flex-direction: column;
    box-shadow: 0px 4px 8px rgba(103, 109, 126, 0.16);
    border: 1px solid #F6F8FA;
    background-color: #fff;
    border-radius: 16px; }
    .recommend-miniSlider__item:focus {
      border: none !important; }
    .recommend-miniSlider__item--left {
      width: 100%;
      padding-top: 10px; }
      .recommend-miniSlider__item--left img {
        object-fit: cover; }
    .recommend-miniSlider__item--right {
      /*  padding-left: 10px;*/
      padding-top: 10px;
      width: 100%; }
      .recommend-miniSlider__item--right .item-name {
        align-items: center;
        font-weight: 600;
        font-size: 14px;
        line-height: 24px;
        /* identical to box height, or 171% */
        color: #393D42;
        height: 48px;
        text-overflow: ellipsis;
        overflow: hidden;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical; }
      .recommend-miniSlider__item--right .pack-size {
        font-weight: normal;
        font-size: 12px;
        line-height: 18px;
        color: #808080; }
      .recommend-miniSlider__item--right .price-area {
        display: flex;
        flex-direction: column;
        margin-top: 5px;
        height: 38px; }
        .recommend-miniSlider__item--right .price-area .normal-price {
          color: #191E28;
          font-size: 16px;
          font-weight: bold;
          font-weight: 600;
          min-height: 30px; }
        .recommend-miniSlider__item--right .price-area .promotion-price {
          font-weight: 600;
          font-size: 18px;
          line-height: 24px;
          color: #ED1516;
          margin-right: 10px; }
        .recommend-miniSlider__item--right .price-area .markup-price {
          font-size: 12px;
          line-height: 14px;
          color: #C1C0C0;
          text-decoration-line: line-through; }

/* SLICK: ARROWS */
.slick-custom-arrow {
  position: absolute;
  transform: translateY(-50%);
  z-index: 100;
  padding: 10px 14px;
  background-color: #fff;
  color: #393D42;
  border-radius: 50%;
  box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.1); }
  .slick-custom-arrow:hover {
    cursor: pointer;
    color: #000; }
  .slick-custom-arrow-right {
    right: 0;
    top: 55%;
    transform: translateY(-60%) translateX(30px); }
  @media only screen and (max-width: 768px) {
    .slick-custom-arrow-right {
      transform: translateY(-60%) translateX(5px); } }
  .slick-custom-arrow-left {
    left: 0;
    top: 55%;
    transform: translateY(-60%) translateX(-30px); }
  @media only screen and (max-width: 768px) {
    .slick-custom-arrow-left {
      transform: translateY(-60%) translateX(-5px); } }
