BootStrapを使用したレイアウトが崩れを修正したい。

開発環境: visual Studio Code
OS: Windows 10
使用ブラウザ: Chrome

ブラウザで下記のコードを実行し、表示すると、画像のようにレイアウトが崩れてしまいます。
レイアウト崩れが原因がわかる方おられましたら、教えてください。

よろしくお願いいたします。

HTML　Bootstrap###
1
2
3<!DOCTYPE html>
4<html lang="ja">
5<head>
6    <meta charset="UTF-8">
7    <meta name="viewport" content="width=device-width, initial-scale=1.0">
8    <meta http-equiv="X-UA-Compatible" content="ie=edge">
9    <link rel="stylesheet" href="css/bootstrap.min.css">
10    <title>Document</title>
11</head>
12<body>
13
14  <!------------------------------------- Header ------------------------------------------------->
15  <header>
16    <div class="container text-center">
17      <h1><a href="index.html"><img src="img/logo.jpg" alt="Mr.M COFFEE"></a></h1>
18    </div>
19  </header>
20  <!---------------------------------------end Header --------------------------------------------->
21
22
23<div class="py-4 bg-light">
24        <section id="about">
25         <div class="container">
26           <div class="row">  
27       <!-- upper content-->
28           <div class="col-md-8 mb-3">
29            <h3 class="mb-3">Mr.M COFFE について</h3>
30            <p>aaaaaaaaaaa</p>
31            <p>bbbbbbbbbbb</p>
32            <a href="#" class="btn btn-info">メニューを見る</a>
33            <a href="#" class="btn btn-info">店舗情報を見る</a>
34           </div>
35           <div class="col-md-4">
36           　<img src="img/image1.jpg" alt="" class="img-fluid">
37           </div>
38         </div>
39       <!-- /uppercontents -->
40       <!-- lower contents -->
41          <div class="row">
42            <!-- card1 -->
43            <div class="col-md-4">
44              <div class="card mb-3">
45                 <img src="img/image1.jpg" class="img-fluid">
46                 <div class="card-body d-flex justify-content-between">
47                   <h4 class="card-title">くつろぎの空間</h4>
48                   <button type="button" class="btn-secondary">詳しく見る</button>
49                 </div>
50              </div>
51             </div>
52           <!-- /card1 -->
53           <!-- card2 -->
54           <div class="col-md-4">
55           　<div class="card mb-3">
56               <img src="img/image1.jpg" class="img-fluid">
57               <div class="card-body d-flex justify-content-between">
58               　<h4 class="card-title">くつろぎの空間</h4>
59               　<button type="button" class="btn-secondary">詳しく見る</button>
60               </div>
61           　</div>
62           </div>
63           <!-- /card2 -->
64           
65           <!-- card3 -->
66           <div class="col-md-4">
67           　<div class="card mb-3">
68               <img src="img/image1.jpg" class="img-fluid">
69               <div class="card-body d-flex justify-content-between">
70               　<h4 class="card-title">くつろぎの空間</h4>
71               　<button type="button" class="btn-secondary">詳しく見る</button>
72               </div>
73           　</div>
74           </div>
75           <!-- /card3 -->
76          </div>
77          <!-- /row -->
78          <div class="row">
79            <div class="col-md-12 text-right">  
80            <button type="button" class="btn-info">お部屋一覧を見てみる<span class=""></span></button>
81            </div>
82          </div>
83         </div>
84        </section>
85       </div>
86
87       <script src="js/jquery-3.4.1.min.js"></script>
88    <script src="js/bootstrap.bundle.min.js"></script>
89    </body>
90![**__イメージ説明__**](67fd738dabed9de6bc522700ce10abed.png)
91