footerの上に要素が隠れてしまうのを治したい

実現したいこと

登録ボタンの上にfooterの要素が被ってしまっているのを治したい

前提

スクロールしても固定で表示するのではなく、
footer以外の要素が少ない時にはfooterを最下部に表示し、
他の要素と被らないようにしたい

該当のソースコード

erb

1<footer id="footer">2 <div class="footer_content">3 <div class="footer_container">4 <div class="footer_logo">5 <%= image_tag asset_path('footer_logo.png'), class: 'footer_club_logo' %>6 </div>7 <div>8 <div class="footer_items">9 <%= link_to '利用規約', 'https://1drv.ms/b/s!AuIts1feOLcPgc0zNz2W8xw0i0SqVA?e=LocU6c', class: 'terms_of_service' %>10 </div>11 <div class="footer_items">12 <%= link_to 'サービス', 'https://1drv.ms/b/s!AuIts1feOLcPgc0zNz2W8xw0i0SqVA?e=LocU6c', class: 'terms_of_service' %>13 </div>14 </div>15 </div>16 </div>17 <div class="footer_copy">18 © 2023 Club Anchor by Comrade Co, Ltd. false 19 </div>20</footer>

css

1#footer {2 background-color: #4d4d4d;3 border-radius: 12px;4 position: fixed;5 bottom: 0; /* 画面下部に固定 */6 width: 100%;7 z-index: 100;8}9 10.footer_container {11 display: flex;12 align-items: center;13 justify-content: center;14 gap: 42px;15 margin-bottom: 100px;16}17 18.footer_club_logo {19 width: 120px;20}21 22.footer_items {23 font-size: 12px;24 color: #fff;25 text-align: center;26 padding: 8px 0;27}28 29.terms_of_service {30 text-decoration: none;31 color: #fff;32}33 34.footer_copy {35 text-align: center;36 color: #fff;37 padding-bottom: 12px;38 font-size: 12px;39}40

このように現状なっており、
教えていただけますと幸いです。
よろしくお願い致します！