<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>カフェレストラン オ・しゃれ</title>
<style>
/* ページ全体 */
html{
font-family:"Times New Roman", "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "游ゴシック" , "Yu Gothic" , "游ゴシック体" , "YuGothic" , "メイリオ" , Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
}
/* 見出し */
h1{
font-family:Georgia;
font-size:2em;
margin:0.5em 1.5em;
}
h2{
text-align:center;
}
/* ナビゲーション */
header nav{
font-size:1.2em;
margin:0;
padding : 8px 0 6px 0;
}
header nav ul{
display:flex;
justify-content: center;
margin:0;
padding:0;
list-style-type: none;
}
header nav li{
flex-grow:0;
flex-shrink:0;
margin:0;
padding:0 10px;
line-height:1.4em;
}
header nav li+li {
padding:0 10px;
border-left: 1px solid #C0C0C0;
}
nav a{
text-decoration:none;
border-top:black dotted 1px;
border-bottom:black dotted 1px;
color:black;
}
nav a:visited{
color:black;
}
nav a:hover{
background:lavender;
}
/* 記事article */
section{
margin:0 1em;
}
p{
margin-top:0;
font-size:1.1rem;
line-height:1.4rem;
}
/* conceptクラス内の設定 */
.concept{
font-family: "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "游明朝", YuMincho, "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
margin:0 0 0 3em;
}
.concept dt{
font-size:1.7em;
}
.concept dd{
margin-left:0;
}
/* 画像に余白を持たせる */
figure{
margin:0 2em 0 1em;
}
/* 補足aside */
aside.info{
margin:2em 0 0 3em;
padding:0;
}
aside th{
vertical-align:top;
text-align:left;
}
/* フッター */
footer{
border-top:1px black solid;
padding-top:0.5em;
text-align:center;
font-size:0.8em;
}
</style>
</head>
<body>
<header>
<h1>Cafe Restaurant O・Share</h1>
<nav>
<ul>
<li><a href="index.html">Top</a></li>
<li>Concept</li>
<li><a href="menu.html">Menu</a></li>
<li><a href="contact.php">Contact</a></li>
</ul>
</nav>
</header>
<main>
<article>
<h2>Concept</h2>
<div style="display:flex">
<dl class="concept">
<dt>豊かな食を贅沢な空間の中でいただく</dt>
<dd>
<p>京都御所正倉院地下3階にある超絶オシャレなレストラン「オ・しゃれ」。</p>
<p>京都市内で取れる地元の山海の珍味をアジアンテイストに調理してお届けします。</p>
</dd>
<dt>歴史あるたたずまい</dt>
<dd><p>794年の開店当初より変わらない落ち着いたたたずまい。悠久の流れを感じる豊かなひとときを。</p>
</dd>
<dt>1000年の時を超えて変わらない味</dt>
<dd><p>創業シェフ秘伝のレシピを守り続け、いつも変わらない安心の味をご提供いたします。</p>
</dd>
</dl>
<figure>
<img src="image/room.jpg" alt="部屋の写真">
</figure>
</div>
</article>
</main>
<aside class="info">
<table>
<tr>
<th>住所</th><td> 〒602-0881<br>京都府京都市上京区京都御苑3<br>京都御所正倉院地下3階</td>
</tr>
<tr>
<th>Tel</th><td>075-211-0000</td>
</tr>
<tr>
<th>FAX</th><td>075-211-0001</td>
</tr>
<tr>
<th>定休日</th><td>年中休</td>
</tr>
</table>
</aside>
<footer>
©794-2016 カフェレストラン オ・しゃれ<br>学習用素材サイト
写真はすべて<a href="https://www.pakutaso.com/" target="_blank">ぱたくそ―フリー写真素材・無料ダウンロード―さんのサイト</a>からいただいたものです。
</footer>
</body>
</html>