@charset "shift_jis";

/*                                                                   目次
=========================================================================
グローバルナビゲーション サイドバー などがないテンプレートについては
該当箇所の指定はしてありません。
-------------------------------------------------------------------------  
[1] リンクの指定
-------------------------------------------------------------------------
[2] 各ブロック毎のフォントサイズ指定とp要素
-------------------------------------------------------------------------
[3] レイアウト指定

[3-1] 全体の横幅 及び 基本的な段組みを指定
[3-2] 余白等の指定
[3-3] 各ブロックの背景等を指定（外枠部分）
[3-4] 各ブロックの背景等を指定（内枠部分）
-------------------------------------------------------------------------   
[4] ヘッダーブロック内の各要素指定

[4-1]トップレベルキーワードの指定
[4-2]ロゴ部分のフォントサイズと配置
[4-3]ロゴ部分のリンク色
[4-4]ロゴ部分のロールオーバー時指定
[4-5]概要部分の指定
----------------------------------
[4-6]グローバルナビゲーションの指定
-------------------------------------------------------------------------   
[5] コンテンツブロック内の各要素指定
-------------------------------------------------------------------------
[6] サイドバーブロック内の各要素指定
-------------------------------------------------------------------------
[7] フッターブロック内の各要素指定
-------------------------------------------------------------------------
[8] テンプレンジャー ウェブマジッククレジット部分の指定

=========================================================================
           http://template.hp-webmagic.com/ http://www.hp-webmagic.com */

/*-----------------------------------------------------------------------
すべての div要素 のみ余白をゼロに指定しています。 */

div {
  margin: 0;
  padding: 0;
}

/*
=========================================================================
                                                         リンクの指定 [1]
=========================================================================
下線を取りたい場合は text-decoration: none; と書き換えて下さい。*/

a:link {
  color: #0000ff;
  text-decoration: underline;
}

a:visited {
  color: #990099;
  text-decoration: underline;
}

a:hover {
  color: #ff0000;
  text-decoration: underline;
}

a:active {
  color: #ff0000;
  text-decoration: underline;
}

/*
=========================================================================
                              各ブロック毎のフォントサイズ指定とp要素 [2]
=========================================================================
各ブロックで個別に指定可能です。px や em 等でも可*/

#header { font-size: 85%; }

#content { font-size: 85%; }

#sidebar { font-size: 85%; }

#footer { font-size: 85%; }

/* -- すべての要素内の文字 -- */
p {
  line-height: 1.8em;
  margin: 0 0 0.5em;
  padding: 0;
}

/*
=========================================================================
                                                       レイアウト指定 [3]
=========================================================================
[3-1] 全体の横幅 及び 基本的な段組みを指定
[3-2] 余白等の指定
[3-3] 各ブロックの背景等を指定（外枠部分）
[3-4] 各ブロックの背景等を指定（内枠部分）*/

body {
  text-align: center;
  font-family: "メイリオ", "Meiryo", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  margin: 0;
  padding: 0;
}

#wrapper {
  text-align: left;
  margin: 0 auto;
  border: 1px solid #ccc;
}

/* 
[3-1] 全体の横幅 及び 基本的な段組みを指定
-----------------------------------------------------------------------
#wrapper { width: 906px; } 部分が全体の幅となります。
-----------------------------------------------------------------------*/

/* 全体の幅 */
#wrapper { width: 906px; }

/* ヘッダーの高さ */
#header {
  width: 100%;
  height: 144px;
}

/* コンテンツの幅 */
#content {
  width: 660px;
  float: right;
}

/* サイドバーの幅 */
#sidebar {
  width: 200px;
  float: left;
}

#footer { clear: both; }

/*
[3-2] 余白等の指定
-----------------------------------------------------------------------
余白の指定は中枠の要素へ指定します*/

/* ヘッダー中枠 */
.header-inner {
  width: 100%;
  height: 100%;
  position: relative;
}

/* コンテンツ中枠 */
.content-inner { margin: 20px 20px; }

/* サイドバー中枠 */
.sidebar-inner { margin: 20px 5px; }

/* フッター中枠 */
.footer-inner { padding: 10px 20px 5px; }

/*
[3-3] 各ブロックの背景等を指定（外枠部分）
-----------------------------------------------------------------------
自由に指定して下さい */

/* 全体を囲む枠 */
#wrapper { }

/* ヘッダー部分背景指定など */
#header { background-color: #ccc; }

/* コンテンツ部分背景指定など */
#content { }

/* サイドバー部分背景指定など */
#sidebar { }

/* フッター部分背景指定など */
#footer { }

/*
[3-4] 各ブロックの背景等を指定（内枠部分）
-----------------------------------------------------------------------
自由に指定して下さい */

/* ヘッダー部分背景指定 */
.header-inner { }

/* コンテンツ部分背景指定 */
.content-inner { }

/* サイドバー部分背景指定など */
.sidebar-inner { }

/* フッター部分背景指定 */
.footer-inner { background-color: #ccc; }

/*
=========================================================================
                                       ヘッダーブロック内の各要素指定 [4]
=========================================================================
[4-1]トップレベルキーワードの指定
[4-2]ロゴ部分のフォントサイズと配置
[4-3]ロゴ部分のリンク色
[4-4]ロゴ部分のロールオーバー時指定
[4-5]概要部分の指定
----------------------------------
[4-6]グローバルナビゲーションの指定
------------------------------------------------------------------------*/

/*
[4-1]トップレベルキーワードの指定
------------------------------------------------------------------------*/
h1 {
  font-size: 100%;
  font-weight: normal;
  position: absolute;
  top: 5px;
  right: 20px;
}

/*
[4-2]ロゴ部分のフォントサイズと配置
------------------------------------------------------------------------*/
.logo {
  font-size: 160%;
  position: absolute;
  top: 25px;
  left: 20px;
}

/*
[4-3]ロゴ部分のリンク色
------------------------------------------------------------------------*/
.logo a {
  text-decoration: none;
  color: #000;
  background-color: transparent;
}

/*
[4-4]ロゴ部分のロールオーバー時指定
------------------------------------------------------------------------*/
.logo a:hover {
  text-decoration: none;
  color: #f00;
  background-color: transparent;
}

/*
[4-5]概要部分の指定
------------------------------------------------------------------------*/
.description {
  position: absolute;
  top: 70px;
  left: 20px;
}

/*
[4-6]グローバルナビゲーションの指定
-----------------------------------------------------------------------
DL時の指定は各リスト幅は120pxです。
-----------------------------------------------------------------------
[G1]グローバルナビゲーションの配置と背景
[G2]各リストの幅指定
[G3]グローバルナビゲーションの背景と文字色指定
[G4]ロールオーバーの背景と文字色指定  */

/*
[G1]グローバルナビゲーションの配置と背景
------------------------------------------------------------------------*/
/*
[G2]各リストの幅指定 カスタマイズ時はここを変更
------------------------------------------------------------------------*/
/*
[G3]グローバルナビゲーションの背景と文字色指定
------------------------------------------------------------------------*/
/*
[G4]グローバルナビゲーションの背景と文字色指定
------------------------------------------------------------------------*/

/*
=========================================================================
                                     コンテンツブロック内の各要素指定 [5]
=========================================================================
コンテンツブロック内の指定はこちらへ*/


/*
=========================================================================
                                     サイドバーブロック内の各要素指定 [6]
=========================================================================
サイドバーブロック内の指定はこちらへ*/

/* ローカルナビゲーション */
.localnavi {
  list-style-type: none;
  margin: 0 0 20px;
  padding: 0;
  width: 190px;
}

.localnavi li {
  display: inline;
  margin: 0;
  padding: 0;
}

.sidebar-inner .localnavi a {
  text-decoration: none;
  display: block;
  width: 175px;
  margin: 0;
  padding: 5px 0 5px 10px;
  background-color: #ccc;
  color: #000;
  border-right: 5px solid #666;
  border-bottom: 1px solid #fff;
}

.sidebar-inner .localnavi a:hover {
  text-decoration: none;
  background-color: #c9f;
  color: #f00;
  border-right: 5px solid #f00;
}

/*
=========================================================================
                                       フッターブロック内の各要素指定 [7]
=========================================================================
*/

/* コピーライト */
.copyright {
  text-align: center;
  margin: 0;
}

/*
=========================================================================
                                         TEMPOCKクレジット部分の指定 [8]
=========================================================================
*/

/* クレジット部分の配置とフォントサイズ */
#webmagic p {
  text-align: right;
  font-size: 80%;
  line-height: 1;
  font-family: Geneva, Arial, Helvetica, sans-serif;
  margin: 0;
}

/* クレジット部分のリンク指定 */
#webmagic,
#webmagic a,
#webmagic a:hover {
  text-decoration: none;
  color: #000;
  background-color: transparent;
}