<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>美術館</title>
<style>
body {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
line-height: 1.6;
margin: 0;
padding: 0;
background-color: #f4f4f4;
color: #333;
}
header {
background: #333;
color: #fff;
padding: 20px 0;
text-align: center;
}
nav ul {
list-style: none;
padding: 0;
}
nav ul li {
display: inline;
margin: 0 15px;
}
nav ul li a {
color: #fff;
text-decoration: none;
font-weight: bold;
}
section {
padding: 20px;
margin: 20px;
background: #fff;
border-radius: 8px;
box-shadow: 0 0 10px rgba(0,0,0,0.1);
}
footer {
background: #333;
color: #fff;
text-align: center;
padding: 10px 0;
position: fixed;
bottom: 0;
width: 100%;
}
</style>
</head>
<body>
<header>
<h1>美術館</h1>
<nav>
<ul>
<li><a href="#home">ホーム</a></li>
<li><a href="#exhibitions">展示</a></li>
<li><a href="#news">ニュース</a></li>
<li><a href="#access">アクセス</a></li>
</ul>
</nav>
</header>
<section id="home">
<h2>ホーム</h2>
<p>ようこそ、美術館のホームページへ。ここでは最新の展示情報、美術館のニュース、アクセス方法などをご紹介しています。</p>
<img src="https://example.com/art_museum.jpg" alt="美術館の外観" style="width:100%; border-radius: 8px;">
</section>
<section id="exhibitions">
<h2>展示</h2>
<p>現在開催中の展示と今後の予定をご紹介します。</p>
<ul>
<li>展示1: 近代アート展 - 2024年8月1日から2024年10月31日まで</li>
<li>展示2: 日本画の美 - 2024年11月1日から2025年1月31日まで</li>
</ul>
</section>
<section id="news">
<h2>ニュース</h2>
<p>美術館からのお知らせや最新ニュースです。</p>
<ul>
<li>2024年7月1日: 新しい展示スペースがオープンしました。</li>
<li>2024年6月15日: 夏季特別展のお知らせ。</li>
</ul>
</section>
<section id="access">
<h2>アクセス</h2>
<p>美術館へのアクセス情報です。</p>
<p>住所: 〒123-4567 東京都千代田区1-2-3</p>
<p>電話: 03-1234-5678</p>
<p>最寄り駅: 東京駅から徒歩10分</p>
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3240.935144089116!2d139.76712581521927!3d35.68123618019395!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x60188bf8a8d8d8d8%3A0x2b6c8a2e0bbd0d0d!2z44CSMTAwLTAwMDEg5p2x5Lqs6YO95aSn55Sw5Yy65pel5pys77yS5LiB55uu77yR77yR4oiS77yR!5e0!3m2!1sja!2sjp!4v1598878033562!5m2!1sja!2sjp" width="100%" height="450" frameborder="0" style="border:0;" allowfullscreen="" aria-hidden="false" tabindex="0"></iframe>
</section>
<footer>
<p>© 2024 美術館</p>
</footer>
</body>
</html>
