<hr>の線を指定の位置に配置したいのですが、出来ません

<hr>の線を下から5pxの位置に配置したいのですが、出来ないので、ご教授お願い致します。 <hr class="line-2">に対して margin-bottom: 5px;を指定したいのですが、思うように配置できないので、教えてくださいませ。 ![イメージ説明](https://d1666c7av167g2.cloudfront.net/questions/2022-01-12/b03e14a1-9c7e-4a77-8ead-fb5850aed572.jpeg)

footer.php

<div class="footer-back">
<hr class="line-1">
<div class="container">
    <div class="saigo">
        <p>&copy 2022 by LittlePeople. All Rights Reserved.</p>
        
    </div>
</div>
<hr class="line-2">
<div>

style.css

.footer-back {
    height: 100px;
    background-color: rgb(0, 0, 0);
    padding-top: 5px;
}

.saigo p {
    /*footer 文字　*/
    font-size: 13px;
    color: rgb(255, 255, 255);
    text-align: center;
    margin-top: 30px;
    font-family: 'Arimo', sans-serif;
}

.line-1 {
    /*線*/
    width: 100%;
    border-width: 0.5px 0 0 0;
    border-style: solid;
    border-color: rgb(70, 70, 70);
    margin-top: 5px;
}

.line-2 {
    /*線*/
    width: 100%;
    border-width: 0.5px 0 0 0;
    border-style: solid;
    border-color: rgb(70, 70, 70);
    margin-bottom: 5px;
}

ご教授お願い致します。