﻿@charset "utf-8";

/*============================================
全般的なスタイル
============================================*/
* {
	margin:0; padding:0; 		/*全要素のマージン・パディングをリセット*/
}

body {
	background-color: #e6f7ff; /* ← ここを薄い水色に変更 */
	font-size:100%;
	font-family: "ＭＳ ゴシック",sans-serif;
	line-height:1.5;
	color:#333333;
	padding:165;
        margin:-20px 0px;
}

div#pagebody {
	width:1000px; margin:0 auto;	/*内容全体をセンタリング*/
	background-color:##e6f7ff;		/*内容全体の背景色*/
	/*background-image:url("images/bg_pagebody.png");	/*コンテンツ全体の背景画像*/
	/*background-repeat:repeat-y;			/*背景画像を縦方向に繰り返す*/
}
/*
background-repeatプロパティに指定できる値
repeat …… 縦横に背景画像をタイル状に繰り返して表示（初期値）
repeat-x …… 横方向にのみ背景画像を繰り返して表示
repeat-y …… 縦方向にのみ背景画像を繰り返して表示
no-repeat …… 背景画像を一回だけ表示して繰り返さない
*/

img {border:0;}						/*画像のボーダーを0にする*/

p {
	width:660px;		/*幅の指定*/
	margin:8px;		/*マージン*/
	text-indent:1em;		/*インデント幅*/
	font-size:13px;				/*フォントのサイズ*/
}

hr {
	clear:both;		/*フロート配置をクリアする*/
	width:680px;		/*幅の指定*/
	margin:10px 0px;		/*マージン*/
	border:1px dotted #cccccc;	/*内容の区切りをグレーの点線表示にする*/
}

hr.class2 {
	clear:both;		/*フロート配置をクリアする*/
	width:980px;		/*幅の指定*/
	margin:10px 0px;		/*マージン*/
	border:1px dotted #cccccc;	/*内容の区切りをグレーの点線表示にする*/
}


/*============================================
ヘッダ
============================================*/
div#header {
	height:80px;				/*ヘッダ部分の高さ*/
}
div#header h1 {
	padding:10px 0px 5px 20px;		/*見出しの位置調整*/
	font-size:12px;				/*フォントのサイズ*/
	font-family:Arial, Helvetica, sans-serif;	/*フォントの種類*/
}
div#header h1 a {text-decoration:none;} 	/*リンクの下線を無くす*/


/*============================================
ヘッダ固定
============================================*/
div#fixed-navbar {
  position: fixed;
  top: 0;
  z-index: 1000; /* 他の要素より前に出す */
  width: 1000px;     /* ページ全体の中央寄せ幅 */
  margin: 0 auto;    /* 中央寄せ */
   background-color:#ffffff
}




/*============================================
メインメニュー
============================================*/
ul#menu {
	width:960px; height:50px; 	/*メインメニュー部分の幅と高さ*/
	margin:0px 20px 0px 20px; 		/*上下マージン0px、左右マージン20px*/

/*marginプロパティとpaddingプロパティでは、
値を2つ指定すると、[上下][左右]と指定していることになります。
値を3つ指定した場合には [上] [左右] [下] 、
値を4つ指定した場合には[上][右][下][左]、
値を1つだけ指定すると[上下左右]に同じ値をまとめて指定したことになります。
marginとpaddingは良く使うプロパティなので、覚えておくとよいでしょう。*/

}
#menu li {
	list-style-type:none;		/*リストマーカー無しにする*/
	display:inline;			/*リスト項目をインライン表示にする*/
	float:left;			/*リスト項目を横に並べる*/
}
#menu li a {
	background-color:#e6f7ff;	/*背景色 navy*/
	color:#000000;		/*文字色*/
	display:block;			/*リンク部分をブロック表示にする*/
	width:130px; height:30px;	/*幅と高さ*/
	padding:10px 0px 0px 0px;	/*上パディング*/
	text-align:center;		/*テキストをセンター揃えにする*/
	text-decoration:none;		/*リンク部分を下線無しにする*/
	/*background-image:url(images/bg_menu1.png);	/*背景画像を指定*/
	/*background-repeat:no-repeat; 			/*背景画像を繰り返さない*/
}
#menu li a:hover {
	text-decoration:underline;	/*リンクにマウスが乗ったら下線を表示*/
	/*background-color:#000044; 	/*リンクにマウスが乗ったら背景色を変更する*/
    /*background-image:url(images/bg_menu2.png); 	/*リンクにマウスが乗ったら背景画像を変更する*/
}

/*============================================
ヘッダ画像
============================================*/
#img_index {
	width:960px; height:360px;	/*トップページのヘッダ画像の表示サイズを指定*/
	margin:15px 20px;		/*マージン*/
}

/*============================================
サブメニュー（左カラム）
============================================*/
h2 {
	width:160px; height:43px;		/*幅と高さ*/
	padding:17px 0px 0px 100px;		/*パディング*/
	font-size:16px;			/*フォントサイズ*/
	background-image:url('../../images/bg_menu2.png');	/*背景画像*/
	background-repeat:no-repeat;		/*背景画像を繰り返さない*/
	background-color:#000033;		/*背景色*/
	color:#ffffff;			/*文字色*/
}

div#submenu {
	width:260px;		/*幅の指定*/
	margin:50px 10px 10px 25px;	/*位置調整*/
	float:left;			/*サブメニューのカラムを左寄せにする*/
}

div#submenu ul li {
	list-style-type:none;			/*リストマーカー無しにする*/
}
div#submenu ul li a {
	display:block;			/*リンク部分をブロック表示にする*/
	height:45px;			/*高さを45pxにする*/
	padding:15px 0px 0px 30px;	/*パディング*/
	text-decoration:none;		/*リンクの下線を無くす*/
	border-bottom:1px dotted gray;	/*リンク領域の下部にボーダーを付ける*/
	
	background-repeat:no-repeat;	/*背景画像を繰り返さない*/
	color:#000000;			/*文字色*/


}
div#submenu ul li:first-child a {
	border-top:1px dotted gray;		/*一番上のリンクに上線を表示*/
}
div#submenu ul li a:hover	{
	text-decoration:underline;	/*リンクにマウスが乗ったら下線を表示*/
}

div#submenu ul li a:before {
	content: url("images/icon_submenu.png");	/*アイコン画像を挿入*/
	margin:0px 10px 0px 0px;		/*マージン*/
	vertical-align:text-top;			/*縦方向の表示位置*/
}

/*============================================
インフォメーション（右カラム）
============================================*/
div#info {
	width:660px;		/*幅の指定*/
	float:left;			/*カラムを左寄せにする*/
	padding:50px 20px 0px 0px;		/*パディング*/
	line-height:1.8;
}

h3 {
	font-size:20px;			/*文字サイズ*/
	width:660px;			/*横幅*/
	padding:10px 0px 10px 20px;		/*パディング*/
	background-color:#003399;		/*背景色*/
	color:#ffffff;			/*文字色*/
	border-radius:3px;			/*角丸にする*/
}

h3.class2 {
	font-size:20px;			/*文字サイズ*/
	width:660px;			/*横幅*/
	padding:10px 0px 10px 20px;		/*パディング*/
	background-color:#0099ff;		/*背景色*/
	color:#ffffff;			/*文字色*/
	border-radius:3px;			/*角丸にする*/
	scroll-margin-top: 175px;
}

.infoimg_index {
	width:200px; height:150px;	/*画像の表示サイズを指定*/
	margin:20px 0px 20px 20px;	/*マージン*/
	float:right;			/*画像を右寄せにする*/
	line-height:1.8;
}


/*============================================
ブログ用
============================================*/
div#info_bg {
	width:980px;		/*幅の指定*/
	float:left;			/*カラムを左寄せにする*/
	padding:50px 20px 0px 0px;		/*パディング*/
}


h4 {
	font-size:14px;			/*文字サイズ*/
	width:960px;			/*横幅*/
	padding:10px 0px 10px 20px;		/*パディング*/
	background-color:#003399;		/*背景色*/
	color:#ffffff;			/*文字色*/
	border-radius:3px;			/*角丸にする*/
}

p.class2 {
	width:960px;		/*幅の指定*/
	margin:8px;		/*マージン*/
	text-indent:1em;		/*インデント幅*/
	font-size:13px;				/*フォントのサイズ*/
}

/*============================================
フッタ
============================================*/
div#footer {
	clear:both;			/*回り込みを解除する*/
	height:40px;			/*高さの指定*/
	padding:10px 40px 0px 0px;	/*パディング*/
	font-size:18px;		/*フォントサイズを小さくする x-small;*/
	text-align:right;	/*center;		/*センタリング*/
}



hr {
	clear:both;			/*フロート配置をクリアする*/
}


