bootstrapで画像を入れたい

Question

前提・実現したいこと

bootstrapでdivの全体にぴったり収まるように画像を埋め込みたいのですが、
上手く行きません。。
下の枠に画像が収まるようにしたいです。

下のようになってしまいます。。

<div class="border border-dark rounded">の中に <img src="images/sample.jpg" class="img-thumbnail"> を入れればぴったり収まる想定だったのですが、、

ご教示いただければと思います。

該当のソースコード

<div class="d-flex my-box-light justify-content-center flex-wrap mb-2">
	<div>
		<div class="shop_list panel-covered">
			<div class="border border-dark rounded">
			<img src="images/sample.jpg" class="img-thumbnail">
				<h2 class="shop_name"><a href="/area/1">テスト</a></h2>
				<h2 class="shop_count">テスト</h2>
			</div>
		</div>
	</div>
	<div>
		<div class="shop_list panel-covered">
			<div class="border border-dark rounded">
			<img src="images/sample.jpg" class="img-thumbnail">
				<h2 class="shop_name"><a href="/area/34">テスト</a></h2>
				<h2 class="shop_count">テスト</h2>
			</div>
		</div>
	</div>
</div>

補足情報（FW/ツールのバージョンなど）

bootstrap4

Answer 1

以下のようにして上手くできました。
画像の下に文字が表示されていたため、レイアウトが崩れていたようでした。

<div class="d-flex my-box-light justify-content-center flex-wrap mb-2">
			<div>
				<div class="shop_list panel-covered">
					<div class="border border-dark rounded">
					<div class="card">
						<img class="card-img" src="images/sample.jpg">
						<div class="card-img-overlay">
							<h2 class="shop_name"><a href="/area/1">テスト</a></h2>
							<h2 class="shop_count">テスト</h2>
						</div>
					</div>
					</div>
				</div>
			</div>
			<div>
				<div class="shop_list panel-covered">
					<div class="border border-dark rounded">
					<div class="card">
						<img class="card-img" src="images/sample.jpg">
						<div class="card-img-overlay">
							<h2 class="shop_name"><a href="/area/34">テスト</a></h2>
							<h2 class="shop_count">テスト</h2>
						</div>
					</div>
					</div>
				</div>
			</div>