【解説06】クロージングとフッターを作成

<section class="signup text-white">
    <div class="container">
        <div class="signup_text">
            <h2>
                無料登録
            </h2>
            <p>
                山路やまみちを登りながら、こう考えた。智ちに働けば角かどが立つ。情じょうに棹さおさせば流される。意地を通とおせば窮屈きゅうくつだ。とかくに人の世は住みにくい。山路や
            </p>
            <div>
                <a href="#" class="btn btn-yellow btn-now signup_button-pc text-center text-bold">
                今すぐテストを受ける
                </a>
            </div>
        </div>
        <div class="signup_img">
            <img src="images/topimg@2x-8.png" class="img-fluid" alt="Qbase WEBイメージ">
            <div class="signup_img_icon">
                <img src="images/top4.svg" class="img-fluid" alt="未経験Webデザイナーのためのデジタル問題集&検定サイト">
            </div>
        </div>
        <div class="signup_button text-center">
            <a href="#" class="btn btn-yellow btn-now text-center text-bold">
            今すぐテストを受ける
            </a>
        </div>
    </div>
</section>

/* ---------------------- */
/* signup
/* ---------------------- */
.signup {
  background-color: #039dd2;
}

.signup_img {
  position: relative;
}

.signup_img_icon {
  position: absolute;
  top: 0;
  right: 0;
  width: 140px;
  height: 140px;
}

.signup_button-pc{
  display: none;
}

<footer class="text-white text-center">
    <div class="container">
        <h3  class="mt-0">
            Qbase WEB の購読には<br>Facebookが便利です
        </h3>
        <p class="copyright">
            © UGUISS 2021
        </p>
    </div>
</footer>