PythonでのスクレイピングでHTMLに同じクラス・タグが含まれ、必要な情報のみを取得したい。

前提・実現したいこと

スクレイピングにおいて、スクレイピングしたいhtmlのタグが複数存在しています。
一致しているタグから、最初の一つだけを入手し、配列に入れます。
しかし、同じHTMLに同じタグが複数あるのでいらない情報まで配列に入れてしまいます。
同じタグの中で、指定したものを一つだけを持ってくるor合致したもの一つだけを配列に入れるにはどのようにしたらいいですか？

開発環境はpython3.9.6です。

（参考）

<div class="panel panel-default ccl-panel-default"> <div class="panel-heading"> <div class="panel-title"><h2>「食塩」の売れ筋ランキング</h2></div> </div> <div class="panel-body"> <div class="panel panel-default ccl-panel-default"> <div class="panel-heading"> <div class="panel-title"><h2>「食塩」に含まれる商品</h2></div> </div> <div class="panel-body">

↑↑↑↑↑↑↑↑↑
上記のように、HTMLに同じクラス・タグが存在します。

※参考にしたURL
https://urecon.jp/categories/%E9%A3%9F%E5%93%81/%E5%8A%A0%E5%B7%A5%E9%A3%9F%E5%93%81/%E8%AA%BF%E5%91%B3%E6%96%99/%E9%A3%9F%E5%A1%A9/110109

発生している問題・エラーメッセージ

['「食塩」の売れ筋ランキング', '「食塩」の売れ筋ランキング', '「食塩」の売れ筋ランキング', '「食塩」の売れ筋ランキング', '「食塩」の売れ筋ランキング', '「食塩」の売れ筋ランキング', '「食塩」の売れ筋ランキング', '「食塩」の売れ筋ランキング', '「食塩」に含まれる商品', '「食塩」に含まれる商品']

↑↑↑↑↑↑↑↑↑
上記において、「「食塩」の売れ筋ランキング」の情報のみ取得したいです。

該当のソースコード

python
1import requests
2from bs4 import BeautifulSoup
3
4r = requests.get('https://urecon.jp/categories/%E9%A3%9F%E5%93%81/%E5%8A%A0%E5%B7%A5%E9%A3%9F%E5%93%81/%E8%AA%BF%E5%91%B3%E6%96%99/%E9%A3%9F%E5%A1%A9/110109')
5
6release = []
7theme = []
8
9soup = BeautifulSoup(r.text, 'html.parser')
10
11for div in soup.find_all('div'):
12    if title := div.find('div',class_='panel-title'):
13        if title2 := div.find('h2'):
14            theme.append((title2.text))
15
16print(theme)