diff --git a/public/build/beike/shop/default/css/app.css b/public/build/beike/shop/default/css/app.css
index 2d2a9901..3d45a07b 100644
--- a/public/build/beike/shop/default/css/app.css
+++ b/public/build/beike/shop/default/css/app.css
@@ -481,6 +481,14 @@ body.page-cart .total-wrap .list-group li .total-price {
 body.page-checkout .checkout-black {
   margin-bottom: 2.6rem;
 }
+body.page-checkout .right-column {
+  position: relative;
+}
+@media (min-width: 992px) {
+  body.page-checkout .right-column {
+    padding-left: 2rem;
+  }
+}
 body.page-checkout .checkout-title {
   border-bottom: 1px solid #e5e5e5;
   padding-bottom: 16px;
diff --git a/public/build/beike/shop/default/js/app.js b/public/build/beike/shop/default/js/app.js
index 0a59726f..b18e9339 100644
--- a/public/build/beike/shop/default/js/app.js
+++ b/public/build/beike/shop/default/js/app.js
@@ -42,21 +42,41 @@ $(document).ready(function ($) {
     var totalWrapWidth = $('.fixed-top-line').outerWidth();
     var totalWrapHeight = $('.fixed-top-line').outerHeight();
     var totalWrapLeft = $('.fixed-top-line').offset().left;
+    var footerTop = $('footer').offset().top;
+    var footerMarginTop = Math.abs(parseInt($('footer').css("marginTop")));
     $(window).scroll(function () {
       if ($(this).scrollTop() > totalWrapTop) {
-        $('.fixed-top-line').addClass('fixed-top-line-fixed').css({
-          'left': totalWrapLeft,
+        $('.fixed-top-line').css({
+          position: 'fixed',
+          top: 0,
+          bottom: 'auto',
           'width': totalWrapWidth
         });
-        if ($('.total-old').length > 0) return;
-        $('.fixed-top-line').before('<div class="total-old" style="height:' + totalWrapHeight + 'px; width:100%;"></div>');
+
+        if (!$('.total-old').length) {
+          $('.fixed-top-line').before('<div class="total-old" style="height:' + totalWrapHeight + 'px; width:100%;"></div>');
+        }
+
+        if ($(this).scrollTop() + totalWrapHeight > footerTop - footerMarginTop) {
+          $('.fixed-top-line').css({
+            position: 'absolute',
+            top: 'auto',
+            bottom: '0',
+            'width': totalWrapWidth
+          });
+        }
       } else {
         $('.total-old').remove();
-        $('.fixed-top-line').removeClass('fixed-top-line-fixed').css({
-          'left': 0,
-          'width': 'auto'
-        });
-      }
+        $('.fixed-top-line').removeAttr('style');
+      } // if ($(this).scrollTop() > totalWrapTop) {
+      //   $('.fixed-top-line').addClass('fixed-top-line-fixed').css({'left': totalWrapLeft, 'width': totalWrapWidth})
+      //   if ($('.total-old').length > 0) return;
+      //   $('.fixed-top-line').before('<div class="total-old" style="height:' + totalWrapHeight + 'px; width:100%;"></div>');
+      // } else {
+      //   $('.total-old').remove();
+      //   $('.fixed-top-line').removeClass('fixed-top-line-fixed').css({'left': 0, 'width': 'auto'})
+      // }
+
     });
   })(window.jQuery);
 });
diff --git a/resources/beike/shop/default/css/page-checkout.scss b/resources/beike/shop/default/css/page-checkout.scss
index 84bd235d..ad059eda 100644
--- a/resources/beike/shop/default/css/page-checkout.scss
+++ b/resources/beike/shop/default/css/page-checkout.scss
@@ -4,6 +4,14 @@ body.page-checkout {
   .checkout-black {
     margin-bottom: 2.6rem;
   }
+
+  .right-column {
+    position: relative;
+    @media (min-width: 992px) {
+      padding-left: 2rem;
+    }
+  }
+
   .checkout-title {
     border-bottom: 1px solid #e5e5e5;
     padding-bottom: 16px;
diff --git a/resources/beike/shop/default/js/app.js b/resources/beike/shop/default/js/app.js
index 549ac22b..a6210272 100644
--- a/resources/beike/shop/default/js/app.js
+++ b/resources/beike/shop/default/js/app.js
@@ -31,16 +31,33 @@ $(document).ready(function ($) {
     const totalWrapWidth = $('.fixed-top-line').outerWidth();
     const totalWrapHeight = $('.fixed-top-line').outerHeight();
     const totalWrapLeft = $('.fixed-top-line').offset().left;
+    const footerTop = $('footer').offset().top;
+    const footerMarginTop = Math.abs(parseInt($('footer').css("marginTop")));
 
     $(window).scroll(function () {
       if ($(this).scrollTop() > totalWrapTop) {
-        $('.fixed-top-line').addClass('fixed-top-line-fixed').css({'left': totalWrapLeft, 'width': totalWrapWidth})
-        if ($('.total-old').length > 0) return;
-        $('.fixed-top-line').before('<div class="total-old" style="height:' + totalWrapHeight + 'px; width:100%;"></div>');
+        $('.fixed-top-line').css({position: 'fixed', top: 0, bottom: 'auto', 'width': totalWrapWidth})
+        if (!$('.total-old').length) {
+          $('.fixed-top-line').before('<div class="total-old" style="height:' + totalWrapHeight + 'px; width:100%;"></div>');
+        }
+
+        if ($(this).scrollTop() + totalWrapHeight > footerTop - footerMarginTop) {
+          $('.fixed-top-line').css({position: 'absolute', top: 'auto', bottom: '0', 'width': totalWrapWidth})
+        }
       } else {
         $('.total-old').remove();
-        $('.fixed-top-line').removeClass('fixed-top-line-fixed').css({'left': 0, 'width': 'auto'})
+        $('.fixed-top-line').removeAttr('style')
       }
+
+
+      // if ($(this).scrollTop() > totalWrapTop) {
+      //   $('.fixed-top-line').addClass('fixed-top-line-fixed').css({'left': totalWrapLeft, 'width': totalWrapWidth})
+      //   if ($('.total-old').length > 0) return;
+      //   $('.fixed-top-line').before('<div class="total-old" style="height:' + totalWrapHeight + 'px; width:100%;"></div>');
+      // } else {
+      //   $('.total-old').remove();
+      //   $('.fixed-top-line').removeClass('fixed-top-line-fixed').css({'left': 0, 'width': 'auto'})
+      // }
     })
   })(window.jQuery);
 });
diff --git a/themes/default/checkout.blade.php b/themes/default/checkout.blade.php
index 252956ae..d5510df6 100644
--- a/themes/default/checkout.blade.php
+++ b/themes/default/checkout.blade.php
@@ -85,7 +85,7 @@
         </div>
       </div>
 
-      <div class="col-12 col-md-4">
+      <div class="col-12 col-md-4 right-column">
         <div class="card total-wrap fixed-top-line">
           <div class="card-header"><h5 class="mb-0">CART TOTALS</h5></div>
           <div class="card-body">