@charset "utf-8";

/* --- 全体の背景・テキスト --- */
body {
margin: 0;
padding: 0;
background-color: #ffffff; /* ページの背景色 */
color: #333333; /* 全体の文字色 */
font-size: 80%; /* 全体の文字サイズ */
text-align:center;
overflow:scroll; /* 常にスクロールバーを表示 */
}

/* --- 全体のリンクテキスト --- */
a:link { color: #0000ff; }
a:visited { color: #800080; }
a:hover { color: #ff0000; }
a:active { color: #ff0000; }


/* --- ■ コンテナ ■ --- */
#container {
width: 100%; /* ページの幅 */
margin: 0 auto; /* センタリング */
background-color: #ffffff; /* メインカラムの背景色 */
border-left: 0px #c0c0c0 solid; /* 左の境界線 */
border-right: 0px #c0c0c0 solid; /* 右の境界線 */
}

/* --- ■ ヘッダ ■ --- */
#header {
width: 98%; /* ページの幅 */
margin: 5px 0px 5px;  /*（上、左右、下）*/
background-color: #ffffff; /* ヘッダの背景色 */
color: #333333; /* ヘッダの文字色 */
}


/* ヘッダ左の設定*/

#headerleft {
width: 100%; /* 幅 */
margin: 0px 0px 0px;  /*（上、左右、下）*/
padding: 0px 2px 0px; /*（上、左右、下）*/
}

.head01{
float: left;
width:40%;
height:125px;
background-color:#5ac2dd;
text-align: center;	
border-color:#ffffff;
border-style:solid;
border-width:1px;
color: #ffffff;
margin-bottom: 2px ;
padding: 5px 0px 5px;
}


.head02{
float: right;
width:58%;
background-color:#d4727f;
border-color:#ffffff;
border-style:solid;
border-width:1px;
color: #ffffff; 
padding: 2px 0px 2px;
}


.head03{
float: right;
width:58%;
background-color:#0f9b6d;
border-color:#ffffff;
border-style:solid;
border-width:1px;
color: #ffffff; 
padding: 2px 0px 2px;
}

.head04{
float: right;
width:58%;
background-color:#778bff;
border-color:#ffffff;
border-style:solid;
border-width:1px;
color: #ffffff; 
padding: 2px 0px 2px;
}

.head05{
float: left;
width:98%;
background-color:#ffffff;
border-color:#ffffff;
border-style:solid;
border-width:1px;
color: #333333; 
margin: 5px 0px 0px;  /*（上、左右、下）*/
padding: 2px 0px 0px;
}


p.t01{
font-size:138%;
font-weight:bold;
margin-top: 15px;
margin-bottom: 5px ;
margin-left: 5px;
margin-right: 5px;
}

p.t02{
font-size:95%;
font-weight:bold;
margin-top: 5px;
margin-bottom: 5px ;
margin-left: 5px;
margin-right: 5px;
}

p.t03{
font-size:100%;
font-weight:bold;
margin-top: 10px;
margin-bottom: 10px ;
margin-left: 10px;
margin-right: 10px;
}


/* ヘッダ右の設定*/

#headerright {
width: 100%; /* ページの幅 */
margin: 0px 0px 5px;  /*（上、左右、下）*/
padding: 0px 2px 0px; /*（上、左右、下）*/
}


/* --- ■横並びメインメニュー--- */

/* --- ナビゲーションバー --- */
div.nav {
width: 100%; /* ナビゲーションの幅 */
background: #004080 url(gazou/hor2_menu2_off.gif) repeat-x top; /* ナビゲーションの背景 */
border-top: 1px #002448 solid; /* 上境界線 */
border-bottom: 1px #002448 solid; /* 下境界線 */
font-size: 80%;
}

/* --- メニューエリア --- */
div.nav ul.nl {
width: 100%; /* メニューの幅 */
margin: 0;
padding: 1px 0; /* メニューのパディング（上下、左右） */
list-style-type: none;
text-align: center;
}

/* --- メニュー項目 --- */
div.nav ul.nl li {
float: left;
}

/* --- 項目の幅（emで指定） --- */
div.nav ul.nl li.item1 {
width: 9em;
}
div.nav ul.nl li.item2 {
width: 9em;
}
div.nav ul.nl li.item3 {
width: 9em;
}
div.nav ul.nl li.item4 {
width: 9em;
}
div.nav ul.nl li.item5 {
width: 9em;
}

/* --- リンク --- */
div.nav ul.nl li a {
display: block;
height: 25px;
position: relative; /* IE6用 */
padding: 5px 5px; /* リンクエリアのパディング（上下、左右） */
border-right: 1px #004080 solid; /* リンクエリアの右境界線 */
text-decoration: underline; /* テキストの下線（あり） */
}
/* --- リンクテキストの色 --- */
div.nav ul.nl li a:link,
div.nav ul.nl li a:visited,
div.nav ul.nl li a:hover,
div.nav ul.nl li a:active
{
color: #ffffff;
}
/* --- ポイント時の設定 --- */
div.nav ul.nl li a:hover {
background: #004080 url(gazou/hor2_menu2_on.gif) repeat-x 0 -1px; /* ポイント時の背景 */
text-decoration: underline; /* テキストの下線（あり） */
}

/* --- clearfix --- */
.clearFix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.clearFix {
min-height: 1px;
}




/* --- ■ メイン ■ --- */
#main {
clear: both;
width: 100%; /* 幅 */
margin: 1px 0px 5px;  /*（上、左右、下）*/
background-color: #ffffff; /* 背景色 */
}



/* --- ■ 右サイドバー ■ --- */
#side {
clear: both;
width: 100%; /* サイドバーの幅 */
margin: 1px 0px 5px;  /*（上、左右、下）*/
text-align:left;

}


/* --- ■ 右サイドバー リンクリスト --- */
/* --- サイドナビゲーション --- */
div.sideNav {
font-size:100%;
line-height: 150%;　/* 行の間隔 */
margin: 18px 5px 18px;  /*（上、左右、下）*/
}

/* --- メニューエリア --- */
div.sideNav ul.n01 {
margin: 10px;
padding: 0;
list-style-type: none;
text-align:left; 
}

/* --- メニュー項目 --- */
div.sideNav ul.n01 li {
margin: 0px 0px; /* 項目のパディング（上下、左右） */
}

/* --- マーカー画像 --- */
div.sideNav ul.n01 li.rank1 {
background-image: url(gazou/sen01.gif); /* ├ */
padding: 0px 0 0px 30px; /* 項目のパディング（上右下左） */
background-repeat: no-repeat;
background-position: 3px 0px; /* 背景画像の表示位置（左からの距離、上からの距離） */
}

div.sideNav ul.n01 li.rank2 {
background-image: url(gazou/sen02.gif); /* └ */
padding: 0px 0 0px 30px; /* 項目のパディング（上右下左） */
background-repeat: no-repeat;
background-position: 3px 0px; /* 背景画像の表示位置（左からの距離、上からの距離） */
}




/* --- ■ 本文 ■ --- */

#honbun{
width: 90%; /* メインカラムの幅 */
text-align:left;
margin: 5px 10px 5px 7px; /* マージン（上、右、下、左） */
line-height: 180%;　/* 行の間隔 */
letter-spacing: 0.08em; /* 文字の横間隔 */
}


.honbun01{
width:100%;
text-align:left;
margin: 5px 0px 5px 0px; /* マージン（上、右、下、左） */
padding: 0px 5px 0px 10px; /* （上、右、下、左） */
background-color:#ffffff;
border-color:#ffffff;
border-style:solid;
border-width:1px;
}


.honbun03{
width:100%;
text-align:left;
margin: 5px 0px 10px 0px; /* マージン（上、右、下、左） */
padding:10px;
background-color:#fff7fb; /* --- うすいピンク --- */
border-color:#ffffff;
border-style:solid;
border-width:1px;
}

.honbun04{
width:100%;
text-align:left;
margin: 5px 0px 10px 0px; /* マージン（上、右、下、左） */
padding:10px;
background-color:#fafff4; /* --- うすいみどり --- */
border-color:#ffffff;
border-style:solid;
border-width:1px;
}




/* --- ■ ボックス --- */


.box03{
width:80%;
text-align:left;
margin: 5px auto 15px; /* センタリング */
padding:10px;
background-color:#ffffff; 
border-color:#e3e3e3;
border-style:solid;
border-width:1px;
font-size: 80%;
}


.box05{
width:180px;
text-align:left;
margin: 10px 8px 1.5em; /* マージン（上、左右、下） */
padding:10px;
background-color:#ffffff; 
border-color:#000000;
border-style:solid;
border-width:1px;
}


.box06{
width:210px;
text-align:left;
margin: 5px 0px 1em; /* マージン（上、左右、下） */
background-color:#ffffff;
border-color:#ffffff;
border-style:solid;
border-width:0px;
}


.box07{
width:200px;
text-align:left;
margin: 5px 0px 1em; /* マージン（上、左右、下） */
padding:10px;
background-color:#fff7fb; /* --- うすいピンク --- */
border-color:#ffffff;
border-style:solid;
border-width:1px;
line-height: 135%;　/* 行の間隔 */
}



.box0pc{ 　/* pc非表示 */
width:100%;
margin: 0px auto; /* センタリング */
padding:0px;
background-color:#ffffff; 
}

.box0sm{　/* スマホ非表示 */
width:100%;
margin: 0px auto; /* センタリング */
padding:0px;
background-color:#ffffff; 
}




/* --- ■ フッタ ■ --- */
#footer {
width: 95%;
padding:5px;
background-color: #effafc; /* フッタの背景色 */
}

/* --- ■ フッタメニュー --- */
/* --- フッタナビゲーション --- */
div.footerNav {
font-size: 100%;
line-height: 180%;　/* 行の間隔 */
}

/* --- メニューエリア --- */
div.footerNav ul.n03 {
margin: 10px;
padding: 0;
list-style-type: none;
text-align: center; /* メニューのセンタリング */
}

/* --- メニュー項目 --- */
div.footerNav ul.n03 li {
margin: 0 4px; /* 項目のパディング（上下、左右） */
display: inline;
}



/* --- ■ パンクズリスト ■ --- */

/* --- リストエリア --- */
ol.topicPath {
margin: 0;
padding: 0;
list-style-type: none;
font-size: 80%;
}

/* --- リスト項目 --- */
ol.topicPath li {
display: inline;
}

/* --- リンク --- */
ol.topicPath li a {
margin-right: 6px; /* リンクエリアの右マージン */
}




/* --- ■見出し --- */


/* --- h1 見出し オレンジ--- */
h1.heading001 {
margin: 0;
padding: 3px 3px 0 5px; /* 見出しのパディング（上右下左） */
border-left: 12px #ff8000 solid; /* 見出しの左境界線 */
border-bottom: 1px #c0c0c0 solid; /* 見出しエリアの下境界線 */
font-size: 110%; /* 見出しの文字サイズ */
line-height: 120%;
margin-bottom: 1em;
margin-top: 1.5em; 
color: #038bd5;　/* --- 文字カラー　うす青 --- */
}

/* --- h1 見出し オレンジ--- */
h1.heading002 {
margin: 0;
padding: 3px 3px 0 10px; /* 見出しのパディング（上右下左） */
border-left: 12px #ff8000 solid; /* 見出しの左境界線 */
border-bottom: 1px #c0c0c0 solid; /* 見出しエリアの下境界線 */
font-size: 110%; /* 見出しの文字サイズ */
line-height: 120%;
margin-bottom: 1em;
margin-top: 1.5em; 
color: #0f9b6d;　/* --- 文字カラー　みどり --- */
}

/* --- h1 見出し オレンジ--- */
h1.heading003 {
margin: 0;
padding: 3px 3px 0 10px; /* 見出しのパディング（上右下左） */
border-left: 12px #ff8000 solid; /* 見出しの左境界線 */
border-bottom: 1px #c0c0c0 solid; /* 見出しエリアの下境界線 */
font-size: 110%; /* 見出しの文字サイズ */
line-height: 120%;
margin-bottom: 1em;
margin-top: 1.5em; 
color: #d4727f;　/* --- 文字カラー　ピンク --- */
}




/* --- h2 ミニ見出し ■うす青--- */
h2.heading001 {
margin: 0;
padding: 3px 3px 0 6px; /* 見出しのパディング（上右下左） */
border-left: 10px #038bd5 solid; /* 見出しの左境界線 */
font-size: 105%; /* 見出しの文字サイズ */
line-height: 100%;　/* --- パソコン用は60％ --- */
margin-bottom: 1em;
margin-top: 1.5em; 
color: #038bd5;　/* --- 文字カラー　青 --- */
}

/* --- h2 ミニ見出し ■みどり--- */
h2.heading002 {
margin: 0;
padding: 3px 3px 0 6px; /* 見出しのパディング（上右下左） */
border-left: 10px #0f9b6d solid; /* 見出しの左境界線 */
font-size: 105%; /* 見出しの文字サイズ */
line-height: 100%;　/* --- パソコン用は60％ --- */
margin-bottom: 1em;
margin-top: 1.5em; 
color: #0f9b6d;　/* --- 文字カラー　みどり --- */
}

/* --- h2 ミニ見出し ■ピンク　--- */
h2.heading003 {
margin: 0;
padding: 3px 3px 0 6px; /* 見出しのパディング（上右下左） */
border-left: 10px #d4727f solid; /* 見出しの左境界線 */
font-size: 105%; /* 見出しの文字サイズ */
line-height: 100%;　/* --- パソコン用は60％ --- */
margin-bottom: 1em;
margin-top: 1.5em; 
color: #d4727f;　/* --- 文字カラー　ピンク --- */
}



/* --- h3 ミニ見出し 点--- */
h3.heading001 {
margin: 0;
padding: 3px 3px 0 15px; /* 見出しのパディング（上右下左） */
font-size: 100%; /* 見出しの文字サイズ */
background: url(gazou/square01.gif) no-repeat 1px 0.7em; /* 項目の背景 */
margin-bottom: 0.5em ;
margin-top: 0.5em;
color: #038bd5;　/* --- 文字カラー　青 --- */
}

/* --- h3 ミニ見出し 点--- */
h3.heading002 {
margin: 0;
padding: 3px 3px 0 15px; /* 見出しのパディング（上右下左） */
font-size: 100%; /* 見出しの文字サイズ */
background: url(gazou/square02.gif) no-repeat 1px 0.7em; /* 項目の背景 */
margin-bottom: 0.5em ;
margin-top: 0.5em;
color: #0f9b6d;　/* --- 文字カラー　緑 --- */
}

/* --- h3 ミニ見出し 点--- */
h3.heading003 {
margin: 0;
padding: 3px 3px 0 15px; /* 見出しのパディング（上右下左） */
font-size: 100%; /* 見出しの文字サイズ */
background: url(gazou/square03.gif) no-repeat 1px 0.7em; /* 項目の背景 */
margin-bottom: 0.5em ;
margin-top: 0.5em;
color: #d4727f;　/* --- 文字カラー　ピンク --- */
}

/* --- h3 ミニ見出し 点--- */
h3.heading004 {
margin: 0;
padding: 3px 3px 0 15px; /* 見出しのパディング（上右下左） */
font-size: 100%; /* 見出しの文字サイズ */
background: url(gazou/square04.gif) no-repeat 1px 0.7em; /* 項目の背景 */
margin-bottom: 0.5em ;
margin-top: 0.5em;
color: #000000;　/* --- 文字カラー　黒 --- */
}



/* --- h2 --- */

h2.v01{
font-size:100%;
font-weight:bold;
margin-bottom: 0.5em;
margin-top: 0.5em; 
color: #038bd5;　/* --- 文字カラー　青 --- */
}

h2.v02{
font-size:100%;
font-weight:bold;
margin-bottom: 0.5em;
margin-top: 0.5em; 
color: #0f9b6d;　/* --- 文字カラー　みどり --- */
}

h2.v03{
font-size:100%;
font-weight:bold;
margin-bottom: 0.5em;
margin-top: 0.5em; 
color: #d4727f;　/* --- 文字カラー　ピンク --- */
}



/* --- h3 --- */


h3.v00{
font-size:100%;
font-weight:bold;
margin-bottom: 0.5em;
margin-top: 0.5em; 
color: #000000;　/* --- 文字カラー　青 --- */
}

h3.v01{
font-size:100%;
font-weight:bold;
margin-bottom: 0.5em;
margin-top: 0.5em; 
color: #038bd5;　/* --- 文字カラー　青 --- */
}

h3.v02{
font-size:100%;
font-weight:bold;
margin-bottom: 0.5em;
margin-top: 0.5em;
color: #0f9b6d;　/* --- 文字カラー　みどり --- */
}

h3.v03{
font-size:100%;
font-weight:bold;
margin-bottom: 0.5em;
margin-top: 0.5em;
color: #d4727f;　/* --- 文字カラー　ピンク --- */
}


h3.v05{
font-size: 90%;　 /* --- 文字　90％ --- */
font-weight:bold;
margin-bottom: 0.5em;
margin-top: 2em; 
color: #000000;　/* --- 文字カラー　黒 --- */
}



/* --- ■ 段落 --- */


p {
margin-top: 0;
margin-bottom: 1em ;
margin-left: 10px;
margin-right: 10px;
}

p.m01{
margin-top: 0; 
margin-bottom: 0 ;
margin-left: 0;
margin-right: 0;
}

p.m02{
margin-top: 1.5em; 
margin-bottom: 1.5em ;
margin-left: 10px;
margin-right: 10px;
}

p.m03{
margin-top: 0; 
margin-bottom: 3.5em ;
margin-left: 10px;
margin-right: 10px;
}

p.m05 {
margin-top: 0;
margin-bottom: 0.8em ;
margin-left: 10px;
margin-right: 10px;
}



.bold00{
font-weight:bold;
color: #000000;
}

.bold01{
font-weight:bold;
color: #ff6699;
}

.bold02{
font-weight:bold;
color: #339999;
}

.bold05{
font-weight:bold;
color: #ff0000;
}



.normal01{     /* 　細字　青 */
font-weight:normal;
color: #038bd5;
}


.normal02{     /* 　細字　みどり */
font-weight:normal;
color: #0f9b6d;
}

.normal03{     /* 　細字　ピンク */
font-weight:normal;
color: #d4727f;
}

.normal05{     /* 　細字　赤 */
font-weight:normal;
color: #ff0000;
}

.small01{     /* 　細字　80% */
font-weight:normal;
font-size: 80%; 
}




p.m11{   /* 　135％　太字 */
margin-top: 0;
margin-bottom: 1.5em ;
margin-left: 10px;
margin-right: 10px;
font-size: 135%; 
font-weight:bold;
}


p.m10{   /* 上下左右隙間なし　80％　細字 */
margin-top: 0; 
margin-bottom: 0 ;
margin-left: 0;
margin-right: 0;
font-size: 80%; 
font-weight:normal;
}


p.m12{   /* 　100％　細字  下0.3　*/
margin-top: 0;
margin-bottom: 0.3em ;
margin-left: 10px;
margin-right: 10px;
font-size: 100%; 
}




/* --- ■　表　■ --- */

/* --- 表全体 --- */
table.example {
width: 100%;
margin-bottom: 10px; /* 表の下マージン */
border: 1px #c0c0c0 solid; /* 大枠の境界線 */
border-collapse: collapse;

}

/* --- 表タイトル --- */
table.example caption {
padding-bottom: 5px; /* 表タイトルの下パディング */
}

/* --- セル --- */
table.example th,
table.example td {
padding: 8px 5px; /* セルのパディング（上下、左右） */
border: 1px #c0c0c0 solid; /* セルの境界線 */
font-size: 90%;
line-height: 150%;　/* 行の間隔 */
}

/* --- 見出しセル --- */
table.example thead th {
background-color: #deefff; /* 見出しセルの背景色 */
text-align: center;
}

/* --- フッタセル --- */
table.example tfoot td {
background-color: #f5f5f5; /* フッタセルの背景色 */
}

/* --- データセル --- */
table.example tbody td {
background-color: #ffffff; /* データセルの背景色 */
}


td.example1 { width: 30%; }

td.example2 { width: 65%; }

td.example3 { width: 5%; }




/* --- 画像の最大サイズを制御 --- */
img { 
    max-width: 100%; 
    height:auto;
}


/* 　非表示にする　　ディスプレイ　568px以下では非表示　*/
@media screen and (max-width: 568px){
#side {display:none;}   　/*　　id非表示にする　*/
.box0sm {display:none;} 　/* 　classを非表示にする　*/
}





/* ■画像の変換 */
img.miniimage { display: none; }

/* 表示領域が420px以上の場合 */
@media screen and (min-width: 420px) {
   img.miniimage { display: none; }  /* miniを非表示 */
   img.bigimage  { display: block; } /* bigを表示 */
}
/* 表示領域が420px未満の場合 */
@media screen and (max-width: 419px) {
   img.miniimage { display: block; } /* miniを表示 */
   img.bigimage  { display: none; }  /* bigを非表示 */
}

p.resizeimage{
margin-top: 0; 
margin-bottom: 0 ;
}