/*
 * navigation.css
 * 2重の入れ子リスト（u-list）から2段ナビゲーションを作成する。
 * 上段: グローバル・ナビゲーション
 * 下段: ローカル・ナビゲーション
 */

/**** グローバル・ナビゲーション（上段）とローカル・ナビゲーション（下段）の両方に適用されるスタイル ****/
/* ナビゲーションのコンテナ */
nav div#navisite, div#navsite {
  position: relative;
  height: 3.0em;			/* ナビゲーション全体（上段+下段）と同じ高さ */
  line-height: 1.5em;			/* 各ナビゲーションの高さ（子要素へ継承） */
  font-weight: bold;
  background-color: #2ca9e1;
}

div#navsite h3 {
  display: none;			/* 見出しは表示しない */
}

/* ナビゲーションの実体 */
nav div#navsite ul, div#navsite ul {
  margin: 0;
  padding: 0;
}

nav div#navsite li, div#navsite li {
  margin: 0;
  padding: 0;
  list-style-type: none;
}

/* ナビゲーション内のリンク */
nav div#navsite a, div#navsite a {
  color: white;
  text-decoration: none;
  display: block;			/* クリックできる範囲が上下に広がる（line-heightまで） */
  margin: 0 0.75em;			/* ナビゲーションのラベル同士を離す */
/*  padding: 0 1.0em;*/			/* クリックできる範囲を左右に広げる */
}

nav div#navsite a:focus, nav div#navsite a:hover, div#navsite a:focus,
div#navsite a:hover {
  text-decoration: underline;
  outline-style: none;
}

/**** グローバル・ナビゲーション（上段） ****/
/* 非選択状態のグローバル・ナビゲーション */
nav div#navsite ul.level-1 li, div#navsite ul.level-1 li {
  float: left;
  background-color: #2ca9e1;
/*  margin-right: 2px;*/		/* グローバル・ナビゲーションのラベル間の区切り（背景が見える） */
}

/* 選択状態のグローバル・ナビゲーション */
nav div#navsite ul.level-1 li.current, div#navsite ul.level-1 li.current {
  background-color: #00b66e;
}

nav div#navsite ul.level-1 li.current a, div#navsite ul.level-1 li.current a {
  font-weight: bold;
}

/**** ローカル・ナビゲーション（下段） ****/
/* ローカル・ナビゲーションの背景 */
nav div#navsite ul.level-1, div#navsite ul.level-1 {
  height: 1.5em;			/* グローバル・ナビゲーションと同じ高さ */
  border-bottom: 1.5em solid #00b66e;	/* ローカル・ナビゲーションと同じ高さ */
}

/* すべてのローカル・ナビゲーションに適用されるスタイル */
nav div#navsite ul.level-2, div#navsite ul.level-2 {
  position: absolute;
  left: 0;
  visibility: hidden;
}

nav div#navsite ul.level-2 li, div#navsite ul.level-2 li {
  float: left;
  background-color: #00b66e;
  font-size: 0.84em;
}

/* 選択状態のローカル・ナビゲーション */
nav div#navsite ul.level-1 li.current ul.level-2, div#navsite ul.level-1 li.current ul.level-2 {
  visibility: visible;
}

nav div#navsite ul.level-1 li.current ul.level-2 li.current, div#navsite ul.level-1 li.current ul.level-2 li.current {
  background-color: #e68c00;
}
