お世話になっております。
下記を楽天RMSのヘッダー・フッター・レフトナビのテンプレート設定からレフトナビに貼り付けたところ、ページの途中でバナーが切れてしまいました。
ページによって縦の長さも違ってきてしまうので、全てのページに対してぴったりと切れないように表示させるには、どのように修正すればよろしいでしょうか？
お手数ですがご回答よろしくお願いいたします。



<style type="text/css">

#tate_left { left: 0px; }
#tate_right { right: 0px; }

#tate_left a,
#tate_right a {
display: block;
min-height: 100%;
width: 100px; 　　　　　　/* 画像の横幅 */
visibility: visible;
height: 12000px;
text-indent:-9999px;
}

#tate_left,
#tate_right {
position: absolute;
width: 100px; 　　　　　 /* 画像の横幅 */
min-height:100%;
visibility: visible;
display: block;
}


/***********************
左縦帯バナー設定
************************/
.tateobi1 {
background: url(https://image.rakuten.co.jp/SHOP-URL/cabinet/05518794/05741568/supersale1202obi80.jpg) repeat-y scroll;
min-height: 100%;
height: 15000px;
top: 75px;
z-index: auto;
visibility: visible;
}

/***********************
右縦帯バナー設定
************************/
.tateobi2 {
background: url(https://image.rakuten.co.jp/SHOP-URL/cabinet/05518794/05741568/supersale1202obi80.jpg) repeat-y scroll;
min-height: 100%;
height: 15000px;
top: 75px;
z-index: auto;
visibility: visible;
}

@media screen and (max-width: 1220px) {
#tate_left, #tate_right {
visibility: hidden;
}
}

</style>


<ul>
<!-- 左縦帯バナー -->
<li class="tateobi1" id="tate_left"><a href="https://item.rakuten.co.jp/SHOP-URL/ITEM-URL/ITEM-URL/"></a></li>

<!-- 右縦帯バナー -->
<li class="tateobi2" id="tate_right"><a href="https://item.rakuten.co.jp/SHOP-URL/ITEM-URL/ITEM-URL/"></a></li>
</ul>