@charset "utf-8";

body,div,pre,p,blockquote, 
form,
dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,

embed,object {margin:0; padding:0; vertical-align:baseline; font-size:100%;
}

body {color:#333333; font:20px/1.7 Arial, Helvetica, sans-serif;
}
h1 {font-size:200%; 
text-align:center; padding:24px; line-height:1.4}
h1 a {color:#444; text-decoration:none;}
h1 a:hover {color:#888; text-decoration:underline;}
h2 {font-size:200%; margin:-bottom:0.5em;}
p { 
	margin:-bottom:1em;
	text-align:center;}

.clearfix:before,
.clearfix:after {content:""; display:table;}
.clearfix:after {clear:both;}
.clearfix {zoom:1;}

#article {background:#fff; padding:60px; height:2000px; margin:0 auto 60px; width:560px;}

/* ======================================== */

.nav {padding:0 248px; margin:auto; width:484px; font-size:85%; border-radius:5px;
-webkit-border-radius:5px; -moz-border-radius:5px; background:#333; background:-moz-linear-gradient(top, #666, #333);
background:-webkit-gradient(linear, left top, left bottom, from(#666), to(#333)); background:-o-linear-gradient(top, #666, #333);
-webkit-box-shadow:0px 3px 5px 0px rgba(0,0,0,0.3);-moz-box-shadow:0px 3px 5px 0px rgba(0,0,0,0.3); box-shadow:0px 3px 5px 0px rgba(0,0,0,0.3);
 position:relative;}


.nav ul li {
  list-style: none;
  margin:0;
  padding:0;
  font-size:14px;
  float: left;
  position: relative;
  width: 120px;/*親メニューの幅*/
  height: 40px;/*親メニューの高さ*/
  line-height: 40px;
  background:#333333;/*親メニューの背景色*/
  color: #888888;/*親メニューの文字色*/
  text-align:center;
  font-weight:bold;
}
.nav ul li a {
  color: #888888;
  display: block;
  text-decoration: none;
}
.nav ul li:hover, .menu ul li a:hover {
  background:#EA2839;/*ホバー時の親メニューの背景色*/
  color:#fff;/*ホバー時の親メニューの文字色*/
}
.nav ul li ul {
  position: absolute;
  top: 40px;/*親メニューの高さと同じにする*/
  width: 120px;
  z-index: 100;
}
.nav ul li ul li {
  visibility: hidden;
  overflow: hidden;
  width: 120px;/*サブメニューの幅*/
  height: 0;
  background:#FFDAD7;/*サブメニューの背景色*/
}
.nav ul li ul li:hover, .menu ul li ul li a:hover {
  background:#FFAFA9;/*ホバー時のサブメニューの背景色*/
}
.nav ul li:hover ul li, .menu ul li a:hover ul li{
  visibility: visible;
  overflow: visible;
  height:40px;/*サブメニューの高さ*/
  z-index: 10;
}
.nav * {
  -webkit-transition: 0.5s;
  -moz-transition: 0.5s;
  -ms-transition: 0.5s;
  -o-transition: 0.5s;
  transition: 0.5s;
}