右ナビゲーション-スタイルシートの説明

@charset "shift_jis";
/*__________________ 基本設定 __________________ */
body {
  text-align: center;
  margin-top:10px;
  padding : 0;
  background-color:#00bfff;　背景色の設定（青系）
}
/*___________ コンテナーブロック設定 ___________ */
#container {
  width : 720px;
  overflow: hidden;
  margin-top:0;
  margin-left: auto;
  margin-right: auto;
  text-align:left;
  background-color : #000088;　背景色の設定（ネービー）ヘッダー及びフッターも同一色
  background-position: center;
}
/*_____________ バナーブロック設定 _____________ */
#banner {
  width:720px;　画像の幅を指定
  height:100px;　画像の高さを指定
  text-align:left;
  background-image: url("banner6.gif");　Jtrimで作成した画像をここで指定
  background-position:center;
  background-repeat: no-repeat;
  padding-top:0px;
  margin-left:auto;
  margin-right: auto;
  overflow: hidden;
}
h1 {
  font-family : "MS UI Gothic";
  font-size:28px;
  text-align:center;　センタリング
  margin-top:15px;
  margin-bottom:0px;　下マージンは無し
  color:#ffffff;　文字色は白
}
h2 {
  font-family : "ＭＳ Ｐゴシック";
  font-size:15px;
  margin-left:15px;　左マージン
  margin-right:15px;　右マージン
  margin-top:10px;　上マージン
  margin-bottom:10px;　下マージン
  color:#ffd700;　文字色（ゴールド）
}
/*___________ コンテンツブロック設定 ___________ */
#contents {
  width : 540px;
  float : left;
  padding : 0;
  background-position: center;
  overflow: hidden;
  position:relative;
  background-color : #ffffff;　背景色は白
}
p {
  font-family : "ＭＳ Ｐゴシック";
  font-size:15px;
  margin-top:5px;
  margin-bottom:5px;
  margin-left:10px;
  margin-right:10px;
  line-height:140%;
  color:#000088;　コンテンツ上部の文字色はバナー、メニュー、フッターと同一色
}
.ubox {　小さい方の角丸ボックス部分の設定
  background-image: url(content1.gif);　画像を指定
  background-position: 35px 0px;　画像の位置の指定、左から35pxの位置、上からは離れない
  background-repeat: no-repeat;
  overflow: visible;
  height:90px;　高さを指定する
  margin-top:15px;　画像の上部の余白、0にするとくっつく
}
h3 {　角丸ボックス内のオレンジ色の文字の設定
  font-family : "ＭＳ Ｐゴシック";
  font-size:15px;
  text-align:center;
  margin-bottom:0px;　下マージンは０にする
  padding-top:10px;
  color:#daa520;
}
.c1 {　角丸ボックス内の暗い色の文字の設定
  margin-left:60px;
  line-height:100%;　字間を空けない
  color:#333333;
}
.ubox2 {　大きい方の角丸ボックス部分の設定
  background-image: url("content2.gif");
  background-position: 35px 0px;
  background-repeat: no-repeat;
  overflow: visible;
  height:160px;　高さの指定
  margin-top:15px;　 画像の上部の余白
}
.cont a:link {　コンテンツ部分のリンクの設定
  color:#191970;　リンクの色は紺
  background:#ffffff;　背景色を白としコンテンツの色に同化
  text-decoration:underline;　下線有り
}
.cont a:visited {　一度クリックしたリンク部分の色
  color:#191970;
  background:#ffffff;
  text-decoration:underline;
}
.cont a:hover {　マウスカーソルを当てると色が反転する
  color:#ffffff;　文字色は白
  background-color:#191970;　背景色は紺
  text-decoration: none;　下線無し
}
.cont a:active {
  text-decoration:underline;
}
/*________右ナビゲーションブロック設定 _________ */
#rightsidebar {　
  width : 180px;
  float : right;
  text-align:left;
  padding:0;
  overflow: hidden;
  background-color:#000088;　背景色はネービー
}
ul {　メニューのリストの設定
  margin-left : 10px;
  padding-left :0;
  padding-top:55px;　メニューの上部余白
}
li {　メニューのリストの設定
  line-height:100%;　「ボタン」高さの設定
  list-style-type : none;
  margin-left:8px;
  margin-right:12px;
  margin-bottom:20px;　 「ボタン」と「ボタン」の間の設定
}
.menu a {　「ボタン」の設定部分
  display:block;　表示形式をブロックレベルに設定　幅で指定した通りに表示する
  width:150px;　幅
  border:solid 2px;　ボタンの枠線のサイズ
  border-color:#ffffff #000066 #000066 #ffffff;　ボタンの枠線の色指定、上は白、右は紺、下は紺、左は白
  text-align:center;
  text-decoration:none;
  font-family : "MS UI Gothic";
  font-size:12px;
  font-weight:600;
  background:#0000cd;　背景色はブルー
  color:#ffffff;　文字色は白
  padding:2px;　文字と枠線の間隔は上下左右2pxずつ
}
.menu a:hover {　「ボタン」にマウスカーソルが乗った際の設定部分
  padding:4px 0px 0px 4px;　 文字が右下に2pxずつ移動する
  border-color:#ffffff #000000 #000000 #ffffff;　 ボタンの枠線の色指定、上は白、右は黒、下は黒、左は白
  background:#191970;　背景色は紺、尚、文字色は白のままです
}
/*____________ フッターブロック設定 ____________ */
#footer {
  width:720px;
  height:100px;
  float : left;
  text-align:center;
  background-image: url("footer6.gif");　画像を指定
  background-position:center;
  background-repeat: no-repeat;
  margin:0px;
  overflow: hidden;
}
.fmenu {
  padding: 15px 50px;　リンク部分の位置をここで調整する
}
.cl {　回り込みの解除
  clear: both;
}
.menu2 a {　フッター部分リンクの設定
  float:left;　左寄せ
  margin-left:10px;
  margin-bottom:15px;
  text-decoration:none;
　font-family : "MS UI Gothic";
  font-size:12px;
  font-weight:600;
  color:#ffffff;　文字色は白
}
.menu2 a:hover {　マウスカーソルが乗った際の設定部分
  color:#0000cd;　文字色は青系
  background:#ffffff;　背景色は白
}
address {
　font-family : "MS UI Gothic";
  font-size:12px;
  font-style:normal;
  padding-top:10px;
  padding-bottom:0px;
  color:#ffffff;
  line-height:140%;
}
.powerd a:link {
  color:#191970;
  background:#00bfff;
  text-decoration:underline;
}
.powerd a:visited {
  color:#191970;
  background:#00bfff;
  text-decoration:underline;
}
.powerd a:hover {
  color:#00bfff;
  background-color:#191970;
  text-decoration: none;
}
.powerd a:active {
  text-decoration:underline;