.smart-mini-banner {
      position: fixed;
      bottom: 20px;

      width: 40%;
      z-index: 999;
      left: 50%;
      transform: translateX(-50%) translateY(20px);

      background: #fff;
      border-radius: 14px;
      overflow: hidden;

      box-shadow: 0 8px 25px rgba(0, 0, 0, .15);

      opacity: 0;
      visibility: hidden;

      transition: all .3s ease;
  }

  .smart-mini-banner.show {
      opacity: 1;
      visibility: visible;
      transform: translateX(-50%) translateY(0);
  }

  .smart-mini-banner img {
      width: 100%;
      display: block;
  }

  .close-banner {
      position: absolute;
      top: 8px;
      right: 8px;

      width: 28px;
      height: 28px;

      border: none;
      border-radius: 50%;

      background: rgba(0, 0, 0, .6);
      color: #fff;

      cursor: pointer;
      font-size: 18px;
  }

  @media (max-width: 768px) {
      .smart-mini-banner {
          width: 92%;

          left: 50%;
          right: auto;
          bottom: 10rem;

          transform: translateX(-50%) translateY(20px);
      }

      .smart-mini-banner.show {
          /* transform: translateX(50%) translateY(0); */
      }
  }