Sortable item from list one to list two move not working

Sortable item from list one to list two move not working

I drop ITEM from Dragable which is right side to Sortable ( Sortable List 1 and Sortable List 2 ). After droping when i try to move item from Sortable List 1 to Sortable List 2 then it's not moving. I have scroll on parent div and sortable specific height which is according to my need.
Here is live Fiddle and below myy code is : 
HTML: 

  1.       <div class="main_container">
             <p>
                Item move from List 1 to List 2 is not working. List two is downside scroll
             </p>
             <div class="contianer">
                <h3>
                   Sortable List 1
                </h3>
                <div class="sortable1 sortable">
                </div>
                <h3>
                   Sortable List 2
                </h3>
                <div class="sortable2 sortable">
                </div>
             </div>
             <div class="dragable">
                <li class="item">
                   item1
                </li>
                <li class="item">
                   item2
                </li>
                <li class="item">
                   item3
                </li>
             </div>
          </div>
JQuery :  
  1.  $(".dragable .item").draggable({ revert: "invalid", helper:'clone', appendTo: '.main_container', connectToSortable: '.contianer .sortable', drag: function(event, ui) { //cursor position adjustment $(this).draggable('instance').offset.click = { left: Math.floor(ui.helper.width() / 2), top: Math.floor(ui.helper.height() / 2) } }, }) $('.contianer .sortable').sortable({ connectWith: ".sortable",  });
CSS:
  2. .sortable{
  3.   background: gray;
  4.   height: 750px;
  5.   margin-bottom: 20px;

  7. }
  8. .dragable{
  9.   float: left;
  10. }
  11. .main_container,body,html{
  12.   overflow: hidden;
  13.   height: 100%;
  14. }
  15. .main_container{
  16.   position: absolute;
  17.   width: 100%;
  18.   
  19. }
  20. .contianer{
  21.   overflow: auto;
  22.   width: 300px;
  23.   padding:0 5px;
  24.      height: calc(100% - 57px);
  25.     float: left;

  27. }