@import "../../app/variables";

.hello_shop {
  padding: 1rem;
  .next,
  .prev {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
    cursor: pointer;
    svg {
      path {
        transition: all ease 300ms;
      }
    }
    &:hover {
      svg {
        path {
          fill: var(--white-2);
        }
      }
    }
  }
  .next {
    right: -1rem;
  }
  .prev {
    left: -1rem;
  }
}

.blue-box {
  background-color: $primary-blue;
  .more{
        width: 70px;
        height: 70px ;
        p{
          color: $text-medium;
        }
        }

}

@media screen and (max-width: 768px) {
  .hello_shop {
    .next,
    .prev {
      display: none;
    }
  }
}