/* .............Caroseoul....................................... */

.wrapper .carousel{
    white-space: nowrap;
    font-size: 0px;
    cursor: pointer;
    overflow: hidden;
    scroll-behavior: smooth;
  }
  .carousel.dragging{
      cursor: grab;
      scroll-behavior: auto;
  
  }
  .carousel.dragging img{
  pointer-events: none;
  }
  .wrapper{
    max-width: 2200px;
    position: relative;
    /* z-index: -10; */
  }
  
  .carousel img:first-child{
      margin-left: -5px;
  }
  .carousel img{
  height: 550px;
  object-fit: cover;
  width: calc(100% / 3);
  margin-left: 10px;
  }
  .wrapper{
  padding: 0px 10px;
  }
  
  .wrapper i{
      top:50%;
      height: 46px;
      width: 46px;
      text-align: center;
      position: absolute;
      line-height: 46px;
      background-color: rgb(219, 219, 219);
      border-radius: 50%;
      cursor: pointer;
      font-size: 1.5rem;
      transform: translateY(-50%);
      opacity: 0.6;
  }
  .wrapper i:first-child{
      left: 30px;
  }
  
  .wrapper i:last-child{
      right: 25px;
  }
  
  @media screen and (max-width: 900px) {
      .carousel img{
          width: calc(100% / 2);
      }
  }
  
  @media screen and (max-width: 550px) {
      .carousel img{
          width: 100% ;
      }
  }