ケーキショップ　Wants Cake

CSS課題

作業時間：5時間
↓
http://felica.boy.jp/cakeshop/index.html
↑

html

index

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>ホーム｜Wants Cake</title>
<link rel="stylesheet" href="css/base.css" media="screen,print">
<link rel="stylesheet" href="css/style.css" media="screen,print">
</head>
<body>
<div id="container">
<div id="content">
	<h1><a href="index.html"><img src="images/logo.jpg" alt="Wants Cake"></a></h1>
	<div id="global_nav">
    	<ul>
    		<li id="home"><a href="index.html">*ホーム</a></li>
    		<li id="products"><a href="products.html">*商品のご案内</a></li>
    		<li id="shop"><a href="shop.html">*店舗案内</a></li>
    		<li id="order"><a href="order.html">*お問い合せ</a></li>
    	</ul>
    </div>
	<div id="index_billboard">
		<h2><img src="images/main_photo.jpg" alt="メインイメージ"></h2>
	</div>
	<div id="index_wrapper">
		<div id="index_content">
			<h3 class="index_h3"><img src="images/news_title.gif" alt="新着情報"></h3>
			<dl>
				<dt>2008.10.10</dt>
			    <dd>スペシャルキャンペーン期間中、お休みをさせて頂いておりました、<strong>N.Y.チーズケーキ、レアチーズケーキ</strong>のオーダー受付を再開させて頂きました。</dd>
				<dt>2008.09.25</dt>
			    <dd><strong>スペシャルキャンペーン</strong>実施中！ 人気のケーキが<strong>5%オフ！</strong></dd>
			</dl>
			<h3 class="index_h3"><img src="images/recommend_title.gif" alt="おすすめ商品"></h3>
			<div class="index_productswrapper_top">
				<div class="index_productsdetail">
				<h4 class="index_h4">チーズスフレ</h4>
				<div class="price"><p>1個 480円</p></div>
				<p>ふんわりと口の中で溶けるチーズスフレに、生クリームをたっぷり乗せた一品です。</p>
				<div class="btn_area">
					<a href="item.html"><img src="images/top_moreinfo_btn.gif" alt="詳細を見る"></a>
					<a href="images/item_photo01.jpg"><img src="images/top_morelook_btn.gif" alt="大きな写真を見る"></a>
				</div>
				</div>
				<div class="index_productsphoto">
					<p><img src="images/top_item_photo1.jpg" alt="チーズスフレ 商品写真"></p>
				</div>
			</div>
			<div class="index_productswrapper">
				<div class="index_productsdetail">
				<h4 class="index_h4">苺のバースデーケーキ</h4>
				<div class="price"><p>1個 2,480円</p></div>
				<p>大切な方のお誕生日に。ほどよい甘さで大人も子供もおいしくお召し上がりいただけます。</p>
				<div class="btn_area">
					<a href="item2.html"><img src="images/top_moreinfo_btn.gif" alt="詳細を見る"></a>
					<a href="images/item_photo02.jpg"><img src="images/top_morelook_btn.gif" alt="大きな写真を見る"></a>
				</div>
				</div>
				<div class="index_productsphoto">
					<p><img src="images/top_item_photo2.jpg" alt="苺のバースデーケーキ 商品写真"></p>
				</div>
			</div>
			<div class="index_productswrapper">
				<div class="index_productsdetail">
				<h4 class="index_h4">焼菓子の詰め合わせ</h4>
				<div class="price"><p>1箱 1,680円</p></div>
				<p>当店自慢の焼菓子の詰め合わせです。無添加の素材でひとつずつ丹念にお作りしています。</p>
				<div class="btn_area">
					<a href="item3.html"><img src="images/top_moreinfo_btn.gif" alt="詳細を見る"></a>
					<a href="images/item_photo03.jpg"><img src="images/top_morelook_btn.gif" alt="大きな写真を見る"></a>
				</div>
				</div>
				<div class="index_productsphoto">
					<p><img src="images/top_item_photo3.jpg" alt="焼菓子の詰め合わせ 商品写真"></p>
				</div>
			</div>
		</div><!-- index_content -->
		<div id="index_leftnav">
			<ul>
				<li><a href="order.html"><img src="images/banner01.jpg"></a></li>
				<li><a href="http://d.hatena.ne.jp/epikhigh/" target="_blank"><img src="images/banner02.jpg"></a></li>
			</ul>
		</div><!-- index_leftnav -->
	</div><!-- index_wrapper -->
</div><!-- content -->
<div id="footer">
	Copyright (C) 2012 Wants Cake Corporation. All Rights Reserved.
</div>
</div><!-- container -->
</body>
</html>

products

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>商品のご案内｜Wants Cake</title>
<link rel="stylesheet" href="css/base.css" media="screen,print">
<link rel="stylesheet" href="css/style.css" media="screen,print">
</head>
<body>
<div id="container">
<div id="content">
	<h1><a href="index.html"><img src="images/logo.jpg" alt="Wants Cake"></a></h1>
	<div id="global_nav">
    	<ul>
    		<li id="home"><a href="index.html">*ホーム</a></li>
    		<li id="products"><a href="products.html">*商品のご案内</a></li>
    		<li id="shop"><a href="shop.html">*店舗案内</a></li>
    		<li id="order"><a href="order.html">*お問い合せ</a></li>
    	</ul>
    </div>
	<div id="index_wrapper">
		<div id="index_content">
			<h2><img src="images/item_title.gif" alt="商品のご紹介"></h2>
			<div id="products_list">
				<ul>
					<li><img src="images/mark.gif"><span>ショートケーキ</span></li>
					<li><img src="images/mark.gif"><span>バースデーケーキ</span></li>
					<li><img src="images/mark.gif"><span>洋菓子</span></li>
				</ul>
			</div>
			<h3 class="products_h3">ショートケーキ</h3>
			<div class="products_productswrapper">
				<div class="index_productsdetail">
				<h4 class="index_h4">チーズスフレ</h4>
				<div class="price"><p>1個 480円</p></div>
				<p>ふんわりと口の中で溶けるチーズスフレに、生クリームをたっぷり乗せた一品です。</p>
				<div class="btn_area">
					<a href="item.html"><img src="images/top_moreinfo_btn.gif" alt="詳細を見る"></a>
					<a href="images/item_photo01.jpg"><img src="images/top_morelook_btn.gif" alt="大きな写真を見る"></a>
				</div>
				</div>
				<div class="index_productsphoto">
					<p><img src="images/top_item_photo1.jpg" alt="チーズスフレ 商品写真"></p>
				</div>
			</div>
			<h3 class="products_h3">バースデーケーキ</h3>
			<div class="products_productswrapper">
				<div class="index_productsdetail">
				<h4 class="index_h4">苺のバースデーケーキ</h4>
				<div class="price"><p>1個 2,480円</p></div>
				<p>大切な方のお誕生日に。ほどよい甘さで大人も子供もおいしくお召し上がりいただけます。</p>
				<div class="btn_area">
					<a href="item2.html"><img src="images/top_moreinfo_btn.gif" alt="詳細を見る"></a>
					<a href="images/item_photo02.jpg"><img src="images/top_morelook_btn.gif" alt="大きな写真を見る"></a>
				</div>
				</div>
				<div class="index_productsphoto">
					<p><img src="images/top_item_photo2.jpg" alt="苺のバースデーケーキ 商品写真"></p>
				</div>
			</div>
			<h3 class="products_h3">洋菓子</h3>
			<div class="products_productswrapper">
				<div class="index_productsdetail">
				<h4 class="index_h4">焼菓子の詰め合わせ</h4>
				<div class="price"><p>1箱 1,680円</p></div>
				<p>当店自慢の焼菓子の詰め合わせです。無添加の素材でひとつずつ丹念にお作りしています。</p>
				<div class="btn_area">
					<a href="item3.html"><img src="images/top_moreinfo_btn.gif" alt="詳細を見る"></a>
					<a href="images/item_photo03.jpg"><img src="images/top_morelook_btn.gif" alt="大きな写真を見る"></a>
				</div>
				</div>
				<div class="index_productsphoto">
					<p><img src="images/top_item_photo3.jpg" alt="焼菓子の詰め合わせ 商品写真"></p>
				</div>
			</div>
		</div><!-- index_content -->
		<div id="index_leftnav">
			<ul>
				<li><a href="order.html"><img src="images/banner01.jpg"></a></li>
				<li><a href="http://d.hatena.ne.jp/epikhigh/" target="_blank"><img src="images/banner02.jpg"></a></li>
			</ul>
		</div><!-- index_leftnav -->
	</div><!-- index_wrapper -->
</div><!-- content -->
<div id="footer">
	Copyright (C) 2012 Wants Cake Corporation. All Rights Reserved.
</div>
</div><!-- container -->
</body>
</html>

item

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>チーズスフレ｜Wants Cake</title>
<link rel="stylesheet" href="css/base.css" media="screen,print">
<link rel="stylesheet" href="css/style.css" media="screen,print">
</head>
<body>
<div id="container">
<div id="content">
	<h1><a href="index.html"><img src="images/logo.jpg" alt="Wants Cake"></a></h1>
	<div id="global_nav">
    	<ul>
    		<li id="home"><a href="index.html">*ホーム</a></li>
    		<li id="products"><a href="products.html">*商品のご案内</a></li>
    		<li id="shop"><a href="shop.html">*店舗案内</a></li>
    		<li id="order"><a href="order.html">*お問い合せ</a></li>
    	</ul>
    </div>
	<div id="index_wrapper">
		<div id="index_content">
			<h3 class="index_h3"><img src="images/item_title.gif" alt="商品のご紹介"></h3>
			<h4 class="item_h4">チーズスフレ</h4>
			<img src="images/item_photo01.jpg">
			<h5 class="item_h5">当店人気メニュー！</h5>
			<p>ふんわりと口の中で溶けるチーズスフレに、生クリームをたっぷり乗せた一品です。チョコとオレンジのトッピングが、やわらかな味わいの中にアクセントを与えてくれます。</p>
			<br>
			<p>甘さ控えめとなっておりますので、カロリーが気になる方も安心です。お茶のお供にも是非どうぞ。</p>
			<br>
			<div class="item_price">
				<p><b>価格</b>： 480円 (税込)</p>
			</div>
			<a href="order.html"><img src="images/buy_btn.gif" alt="この商品を購入する"></a>
		</div><!-- index_content -->
		<div id="index_leftnav">
			<ul>
				<li><a href="order.html"><img src="images/banner01.jpg"></a></li>
				<li><a href="http://d.hatena.ne.jp/epikhigh/" target="_blank"><img src="images/banner02.jpg"></a></li>
			</ul>
		</div><!-- index_leftnav -->
	</div><!-- index_wrapper -->
</div><!-- content -->
<div id="item_footer">
	Copyright (C) 2012 Wants Cake Corporation. All Rights Reserved.
</div>
</div><!-- container -->
</body>
</html>

item2

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>苺のバースデーケーキ｜Wants Cake</title>
<link rel="stylesheet" href="css/base.css" media="screen,print">
<link rel="stylesheet" href="css/style.css" media="screen,print">
</head>
<body>
<div id="container">
<div id="content">
	<h1><a href="index.html"><img src="images/logo.jpg" alt="Wants Cake"></a></h1>
	<div id="global_nav">
    	<ul>
    		<li id="home"><a href="index.html">*ホーム</a></li>
    		<li id="products"><a href="products.html">*商品のご案内</a></li>
    		<li id="shop"><a href="shop.html">*店舗案内</a></li>
    		<li id="order"><a href="order.html">*お問い合せ</a></li>
    	</ul>
    </div>
	<div id="index_wrapper">
		<div id="index_content">
			<h3 class="index_h3"><img src="images/item_title.gif" alt="商品のご紹介"></h3>
			<h4 class="item_h4">苺のバースデーケーキ</h4>
			<img src="images/item_photo02.jpg">
			<h5 class="item_h5">当店人気メニュー！</h5>
			<p>大切な方のお誕生日に。ほどよい甘さで大人も子供もおいしくお召し上がりいただけます。</p>
			<br>
			<div class="item_price">
				<p><b>価格</b>： 2,480円 (税込)</p>
			</div>
			<a href="order.html"><img src="images/buy_btn.gif" alt="この商品を購入する"></a>
		</div><!-- index_content -->
		<div id="index_leftnav">
			<ul>
				<li><a href="order.html"><img src="images/banner01.jpg"></a></li>
				<li><a href="http://d.hatena.ne.jp/epikhigh/" target="_blank"><img src="images/banner02.jpg"></a></li>
			</ul>
		</div><!-- index_leftnav -->
	</div><!-- index_wrapper -->
</div><!-- content -->
<div id="item_footer">
	Copyright (C) 2012 Wants Cake Corporation. All Rights Reserved.
</div>
</div><!-- container -->
</body>
</html>

item3

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>焼菓子の詰め合わせ｜Wants Cake</title>
<link rel="stylesheet" href="css/base.css" media="screen,print">
<link rel="stylesheet" href="css/style.css" media="screen,print">
</head>
<body>
<div id="container">
<div id="content">
	<h1><a href="index.html"><img src="images/logo.jpg" alt="Wants Cake"></a></h1>
	<div id="global_nav">
    	<ul>
    		<li id="home"><a href="index.html">*ホーム</a></li>
    		<li id="products"><a href="products.html">*商品のご案内</a></li>
    		<li id="shop"><a href="shop.html">*店舗案内</a></li>
    		<li id="order"><a href="order.html">*お問い合せ</a></li>
    	</ul>
    </div>
	<div id="index_wrapper">
		<div id="index_content">
			<h3 class="index_h3"><img src="images/item_title.gif" alt="商品のご紹介"></h3>
			<h4 class="item_h4">焼菓子の詰め合わせ</h4>
			<img src="images/item_photo03.jpg">
			<h5 class="item_h5">当店人気メニュー！</h5>
			<p>当店自慢の焼菓子の詰め合わせです。無添加の素材でひとつずつ丹念にお作りしています。</p>
			<br>
			<div class="item_price">
				<p><b>価格</b>： 1,680円 (税込)</p>
			</div>
			<a href="order.html"><img src="images/buy_btn.gif" alt="この商品を購入する"></a>
		</div><!-- index_content -->
		<div id="index_leftnav">
			<ul>
				<li><a href="order.html"><img src="images/banner01.jpg"></a></li>
				<li><a href="http://d.hatena.ne.jp/epikhigh/" target="_blank"><img src="images/banner02.jpg"></a></li>
			</ul>
		</div><!-- index_leftnav -->
	</div><!-- index_wrapper -->
</div><!-- content -->
<div id="item_footer">
	Copyright (C) 2012 Wants Cake Corporation. All Rights Reserved.
</div>
</div><!-- container -->
</body>
</html>

shop

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>店舗案内｜Wants Cake</title>
<link rel="stylesheet" href="css/base.css" media="screen,print">
<link rel="stylesheet" href="css/style.css" media="screen,print">
</head>
<body>
<div id="container">
<div id="content">
	<h1><a href="index.html"><img src="images/logo.jpg" alt="Wants Cake"></a></h1>
	<div id="global_nav">
    	<ul>
    		<li id="home"><a href="index.html">*ホーム</a></li>
    		<li id="products"><a href="products.html">*商品のご案内</a></li>
    		<li id="shop"><a href="shop.html">*店舗案内</a></li>
    		<li id="order"><a href="order.html">*お問い合せ</a></li>
    	</ul>
    </div>
	<div id="index_wrapper">
		<div id="index_content">
			<h3 class="shop_h3"><img src="images/shop_title.gif" alt="商品のご紹介"></h3>
			<img src="images/shop.jpg" alt="">
			<table border="1" bordercolor="#e5e5e5" cellspacing="0">
				<tr><th>社名</th><td>ウォンツケーキ</td></tr>
				<tr><th>住所</th><td>ウォンツ県一途市三番町4-1-3<br>ケーキビル1F</td></tr>
				<tr><th>TEL</th><td>000-0000-0000</td></tr>
				<tr><th>定休日</th><td>水曜日</td></tr>
				<tr><th>営業時間</th><td>午前9:00〜午後8:00</td></tr>
			</table>
			<div id="map">
				<img src="images/map.png" alt="">
			</div>
		</div><!-- index_content -->
		<div id="index_leftnav">
			<ul>
				<li><a href="order.html"><img src="images/banner01.jpg"></a></li>
				<li><a href="http://d.hatena.ne.jp/epikhigh/" target="_blank"><img src="images/banner02.jpg"></a></li>
			</ul>
		</div><!-- index_leftnav -->
	</div><!-- index_wrapper -->
</div><!-- content -->
<div id="item_footer">
	Copyright (C) 2012 Wants Cake Corporation. All Rights Reserved.
</div>
</div><!-- container -->
</body>
</html>

order

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>お問い合せ｜Wants Cake</title>
<link rel="stylesheet" href="css/base.css" media="screen,print">
<link rel="stylesheet" href="css/style.css" media="screen,print">
</head>
<body>
<div id="container">
<div id="content">
	<h1><a href="index.html"><img src="images/logo.jpg" alt="Wants Cake"></a></h1>
	<div id="global_nav">
    	<ul>
    		<li id="home"><a href="index.html">*ホーム</a></li>
    		<li id="products"><a href="products.html">*商品のご案内</a></li>
    		<li id="shop"><a href="shop.html">*店舗案内</a></li>
    		<li id="order"><a href="order.html">*お問い合せ</a></li>
    	</ul>
    </div>
	<div id="index_wrapper">
		<div id="index_content">
			<h3 class="index_h3"><img src="images/shopping_title.gif" alt="商品のご購入"></h3>
			<form action="#" method="post">
				<p>
					<label for="user"><b>お名前</b></label><br>
					<input type="text" id="user" name="username" size="50">
				</p>
				<p>
					<label for="mail"><b>メールアドレス</b></label><br>
					<input type="text" id="mail" name="mailaddress" size="50">
				</p>
				<p>
					<label for="post"><b>郵便番号</b></label><br>
					<input type="text" id="post" name="postcode" size="20">(ハイフンなし)
				</p>
				<p>
					<label for="address"><b>ご住所</b></label><br>
					<textarea id="address" name="stayaddress" cols="50" rows="8"></textarea>
				</p>
				<p><label for="order"><b>注文商品</b></label><br>
					<label><input type="checkbox" name="mobile" value="1">チーズスフレ</label>
  						<select name="quantity">
  						<option value="1">1個</option>
  						<option value="2">2個</option>
 						<option value="3">3個</option>
  						<option value="4">4個</option>
  						<option value="5">5個</option>
						</select><br>
  					<label><input type="checkbox" name="mobile" value="2">苺のバースデーケーキ</label>
  						<select name="quantity">
  						<option value="1">1個</option>
  						<option value="2">2個</option>
 						<option value="3">3個</option>
  						<option value="4">4個</option>
  						<option value="5">5個</option>
						</select><br>
  					<label><input type="checkbox" name="mobile" value="3">焼菓子の詰め合わせ</label>
  					<select name="quantity">
  						<option value="1">1個</option>
  						<option value="2">2個</option>
 						<option value="3">3個</option>
  						<option value="4">4個</option>
  						<option value="5">5個</option>
						</select><br>
				</p>
				<p><label for="order"><b>当店をどこでお知りになりましたか？</b></label><br>
					<label><input type="radio" name="orderlist" value="search">検索サイトから</label>
					<label><input type="radio" name="orderlist" value="friend">ご家族・ご友人から</label>
					<label><input type="radio" name="orderlist" value="ad">広告・チラシ等</label>
					<label><input type="radio" name="orderlist" value="other">その他</label>
				<p>
				<hr>
				<p><input type="submit" value="送信する" id="submit">
				<input type="reset" value="取り消し" id="reset"></p>
			</form>
					</div><!-- index_content -->
		<div id="index_leftnav">
			<ul>
				<li><a href="order.html"><img src="images/banner01.jpg"></a></li>
				<li><a href="http://d.hatena.ne.jp/epikhigh/" target="_blank"><img src="images/banner02.jpg"></a></li>
			</ul>
		</div><!-- index_leftnav -->
	</div><!-- index_wrapper -->
</div><!-- content -->
<div id="item_footer">
	Copyright (C) 2012 Wants Cake Corporation. All Rights Reserved.
</div>
</div><!-- container -->
</body>
</html>

css

base

@charset "UTF-8";

* {
  margin: 0;
  padding: 0;
}

body {
  font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,Osaka,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
  background-color: #00568f;
  background-image: url(../images/bg.jpg);
  background-repeat: repeat-x;
  font-size: 0.83em;
}

ul {
  list-style-type: none;
}

#container {
  width: 700px;
  background-color: #fff;
  margin: 0 auto;
}

#content {
  width: 680px;
  background-color: #fff;
  padding: 10px 10px 0 10px;
}

#global_nav {
  background-image: url(../images/menubar.jpg);
  background-repeat: repeat-x;
  overflow: hidden;
}
#global_nav ul {
  list-style-type: none;
}
#global_nav li {
  float: left;
}
#global_nav a {
  background-repeat: no-repeat;
  background-position: left top;
  width: 136px;
  height: 36px;
  display: block;
  padding-top: 36px;
  height: 0 !important;
  overflow: hidden;
}

#home a {
  background-image: url(../images/menu_index.gif);
}
#home a:hover {
  background-image: url(../images/menu_index.gif);
  background-position: left bottom;
}

#products a {
  background-image: url(../images/menu_products.gif);
}
#products a:hover {
  background-image: url(../images/menu_products.gif);
  background-position: left bottom;
}

#shop a {
  background-image: url(../images/menu_shop.gif);
}
#shop a:hover {
  background-image: url(../images/menu_shop.gif);
  background-position: left bottom;
}

#order a {
  background-image: url(../images/menu_mail.gif);
}
#order a:hover {
  background-image: url(../images/menu_mail.gif);
  background-position: left bottom;
}

strong {
  color: #fe6d96;
}

#footer {
  background-image: url(../images/footer_back.gif);
  background-repeat: repeat-x;
  text-align: center;
  width: 700px;
  line-height: 60px;
  margin-top: 50px;
}

style

@charset "UTF-8";

/*index*/
#index_billboard {
  margin-top: 5px;
}

#index_wrapper {
  overflow: hidden;
  width: 680px;
  margin-top: 15px;
}

#index_content {
  width: 470px;
  float: right;
}

h3.index_h3 {
  margin-bottom: 10px;
}
#index_content dt {
  font-weight: bold;
  margin-left: 15px;
  padding-left: 10px;
  border-left: 5px solid #e4e0d4;
}
#index_content dd {
  margin: 10px 20px 15px 30px;
}

#index_leftnav {
  width: 200px;
  float: left;
}

.index_productswrapper {
  width: 470px;
  overflow: hidden;
  float: right;
  padding: 20px 0 15px 0;
  border-bottom: 1px solid #e4e0d4;
}
.index_productswrapper_top {
  width: 470px;
  overflow: hidden;
  float: right;
  padding: 0 0 15px 0;
  border-bottom: 1px solid #e4e0d4;
}

.index_productsphoto {
  float: right;
  width: 150px;
}

.index_productsdetail {
  float: right;
  width: 310px;
  margin-left: 10px;
}
h4.index_h4 {
  font-family: serif;
  color: #1e6da6;
  font-size: 1.1em;
}

.price {
  margin: 10px 0 10px 0;
}

.btn_area {
  margin-top: 5px;
}

/*products*/
#products_list ul {
  margin-bottom: 15px;
  margin-top: 10px;
}
#products_list li {
  font-weight: bold;
  color: #b29a5c;
}
#products_list li span {
  padding-left: 5px;
  vertical-align: top;
}

.products_productswrapper {
  width: 470px;
  overflow: hidden;
  float: right;
  padding: 0 0 15px 0;
  border-bottom: 1px solid #e4e0d4;
  margin-bottom: 20px;
}

h3.products_h3 {
  background-image: url(../images/menubar.jpg);
  background-repeat: repeat-x;
  color: #fff;
  padding: 8px 0 8px 15px;
  margin-bottom: 10px;
  clear: both;
}

/*item*/
h4.item_h4 {
  margin-left: 10px;
  font-size: 1.4em;
  color: #1e6da6;
}

h5.item_h5 {
  color: #fe6d96;
  padding-left: 10px;
  border-left: 5px solid #fe6d96;
  font-size: 1.3em;
  margin-top: 5px;
  margin-bottom: 5px;
}

.item_price {
  border-bottom: 1px solid #e4e0d4;
  padding-bottom: 20px;
  margin-bottom: 20px;
}

#item_footer {
  background-image: url(../images/footer_back.gif);
  background-repeat: repeat-x;
  text-align: center;
  width: 700px;
  line-height: 60px;
  margin-top: 20px;
}

/*shop*/
h3.shop_h3 {
  margin-bottom: -7px;
}

table {
  margin-top: -6px;
}
th {
  text-align: right;
  padding: 5px;
  width: 100px;
  background-color: #cfc89a;
}
td {
  padding: 5px;
  width: 360px;
}

#map {
  text-align: center;
  padding-top: 5px;
}

/*order*/
form {
  padding-bottom: 10px;
  margin-bottom: 5px;
}

hr {
  margin-top: 5px;
  margin-bottom: 5px;
  border: 0;
  border-bottom: 1px solid #ccc;
  background: #ccc;
}