Theme twentythirteen widget area clearfix

There are many approaches to this. This is because the position: absolute on the sidebar-container is making it overlap over the footer.

Try this CSS to override. This is a static solution:

body.single .hentry // Selects the single posts
{
  min-height: 2000px; // Set this according to the height of the sidebar
}  

This one is a better solution:

To work with only large device width because the below CSS will restructure mobile device elements, To avoid that we can set media-queries

@media (min-width: 992px) { 
  #main {
    overflow: hidden; 
  } 

  #primary.content-area {
    float: left;
  }

  .site-main .sidebar-container {
    position: relative;
    float: right;
    width: 25%;
    height: auto;
    padding: 0 15px;
  }
}