carousel 작동이 안되요

안녕하세요 쌤 

슬라이드가 안먹히는데 어디서 잘못됐는지 모르겠어요 

답변주심 감사요

<h4 class="my-4 text-center">SHOW</h4>

        <div style="overflow:hidden">
         <div class="slide-container">
          <div class="slide-box">
       
          </div>
        <div class="slide-box">
         
          </div>

          <div class="slide-box">
                     
          </div>
        </div>
        </div>
           

        <button class="slide-1">1</button>
        <button class="slide-2">2</button>
        <button class="slide-3">3</button>

        <div class="my-5"></div>

        <script>
          $('.slide-2').click(function(){
            $('.slide-container').css('transform', 'translateX:translateX(-100vw)');
          });
        </script>

.slide-container{
    width:300vw;
    transition:transform 1s;
    transform:translateX(-100vw);
   
}
.slide-box {
    width:100vw;
    float:left;

}
.slide-box img {
    width:100%;
}