営業時間の表を載せたフッター

選んだ内容は、上の仕上がり例と下のプロンプト全文に反映されます。

書き換える項目

プロンプト内の［ ］の部分を、つくりたいサイトに合わせて書き換えてから使ってください。

[店舗名]

例：さくら歯科クリニック

[営業時間]

時間帯ごと・曜日ごとの営業。例：9:00〜12:30 月〜土、14:00〜18:00 月火木金

[休みの補足]

例：休診日：水曜午後・日曜・祝日

[電話番号]

例：03-0000-0000

[使用技術]

例：HTML/CSS、React + Tailwind CSS

あなたはWebデザイナー兼フロントエンドエンジニアです。
以下の条件で「営業時間の表を載せたフッター」を実装してください。

## 表示内容
- 左：店舗名（[店舗名]）、電話番号（[電話番号]）、予約ボタン
- 右：営業時間の表
[営業時間]
- 表の下に、休みの補足：[休みの補足]
- 最下段：コピーライト

## 営業時間の表
- 列：月・火・水・木・金・土・日（7列）と、左端に時間帯の列
- 行：時間帯ごと（例：午前、午後）
- 営業しているマスは「●」、休みのマスは「−」

## レイアウト
- PC：左に店舗の情報（幅 35%）、右に表
- スマホ：店舗の情報を上、表を下に。表は横スクロールさせず、文字を小さくして7列を収める

## デザイン
- 背景 #F7F9FC、上端に 1px solid #E2E8F0
- 店舗名：18px、font-weight 700、色 #1B2A44
- 電話番号：24px、font-weight 700、色 #1463F0
- 表：背景 #FFFFFF、枠線 1px solid #E2E8F0、角丸 8px、13px
- 表の見出し（曜日）：背景は #1463F0 の9%の淡い色、font-weight 700。土曜・日曜も同じ色にする（色に意味を持たせない）
- 「●」：色 #1463F0。「−」：色 #CBD5E1
- 休みの補足：12px、色 #5F6D84

## 表示の工夫
- 今日の曜日の列に、薄い背景（#1463F0 の15%の淡い色）を付ける

## アクセシビリティ
- table 要素を使い、曜日は th（scope="col"）、時間帯は th（scope="row"）にする
- caption で「診療時間」などの表の名前を付ける
- 「●」「−」には、読み上げ用に「診療あり」「休診」の文言を付ける
- 電話番号は tel: リンクにする

## 出力形式
- [使用技術]のコードを1つ出力