@charset "UTF-8";

/* ブラウザ初期設定解除CSS */

/* ================= 目次 =====================

【1】リセット
【2】フォント関連
【3】リンクカラー

============================================ */


/* =============================================================
　■□■ 1. リセット ■□■
============================================================= */

body, form, h1, h2, h3, h4, h5, h6, p, ol, ul, pre, blockquote, input, dl, dd, dt, div, address, label
{
	margin: 0;
	padding: 0;
}

a img { border: 0; }

li { list-style: none; }

ol li /* 数字のリストは数字マーカーを残す */
{
	list-style-type: decimal;
	list-style-position: outside;
	margin-left: 25px;
}

em
{
	font-style: normal;
	font-weight: bold;
}

address
{ 
 	font-style: normal;
 	font-weight: normal;
}

form, input, select, textarea
{
	margin: 0 2px 0 0;
	font-family: "Tahoma","ヒラギノ角ゴPro W3","Hiragino Kaku Gothic Pro",Osaka,"MS UI Gothic",sans-serif;
	padding: 1px;
	color: #404040;
	font-size: 100%;
}

*:first-child+html form,
*:first-child+html input,
*:first-child+html select,
*:first-child+html textarea /* For Only IE7 */
{
	font-family: "Verdana","ヒラギノ角ゴPro W3","Hiragino Kaku Gothic Pro",Osaka,"MS UI Gothic",sans-serif;
}


/* =============================================================
　■□■ 2. フォント関連 ■□■
============================================================= */

body
{
	font-family: "Tahoma","ヒラギノ角ゴPro W3","Hiragino Kaku Gothic Pro",Osaka,"MS UI Gothic",sans-serif;
	font-size: 75%;
	color: #333;
	line-height: 1.5;
	text-align: center;
	background:#e7ecf0 url(../img/bg_body.gif) repeat-y center;
}

*:first-child+html body /* For Only IE7 */
{
	font-family: "Verdana","ヒラギノ角ゴPro W3","Hiragino Kaku Gothic Pro",Osaka,"MS UI Gothic",sans-serif;
}

table
{
	font-family: "Tahoma","ヒラギノ角ゴPro W3","Hiragino Kaku Gothic Pro",Osaka,"MS UI Gothic",sans-serif;
	color: #404040;
	line-height: 1.5;
	background-color: #FFFFFF;
	text-align: left;
}

*:first-child+html table /* For Only IE7 */
{
	font-family: "Verdana","ヒラギノ角ゴPro W3","Hiragino Kaku Gothic Pro",Osaka,"MS UI Gothic",sans-serif;
}

h1, h2, h3, h4, h5, h6
{
	font-size: small;
}


/* =============================================================
　■□■ 3. リンクカラー ■□■
============================================================= */

a:link /* リンク未訪問の色指定 */
{
	color: #0075c6;
	background-color: transparent;
}

a:visited /* リンク訪問済みの色指定 */
{
/*	color: #7C7C7C;*/
	color: #0075c6;
	background-color: transparent;
}

a:hover,
a:active /* リンクマウスオーバー時の色指定 */
{
	color:#CC0000;
	background-color: transparent;
	text-decoration: none;
}


/* =============================================================
　■□■ 4. 基本レイアウト ■□■
============================================================= */

#wrapper
{
	width: 800px;
	padding: 0;
	margin: 0 auto 20px;
	text-align: left;
}

#wrapper h1
{
	background:url(../img/bg_h1.gif) repeat-x ;
	padding:8px 20px 5px 20px;
	font-size:14px;
}

#header
{
	padding:10px 20px;
}

#header #logo
{
	color:#0054ba;
	font-size:24px;
	font-family:"HG創英角ｺﾞｼｯｸUB";
}

#contents
{
	padding:30px 20px 10px 20px;
	background: url(../img/bg_contents.gif) repeat-x top;
}

#main
{
	width:530px;
	float:left;
}

#main p
{
	margin-bottom:1.5em;
}

#main ol
{
	margin-bottom:1.5em;
}

#main li
{
	background:url(../img/list_02.gif) no-repeat left 0.4em;
	padding-left:12px;
}

#main h2
{
	border:1px solid #CCC;
	background:#f7f7f7 url(../img/bg_h2.gif) no-repeat 5px center;
	padding:2px 5px 2px 15px;
	margin-bottom:1em;
	font-size:135%;
}

#main h3
{
	margin:2em 0 1em 0;
	border-top:1px solid #CCC;
	border-bottom:1px solid #CCC;
	padding:5px 5px 3px 5px;
	color:#2672a0;
}

#main p#pan
{
	margin-bottom:1em;
	font-size:86%;
}

#main p#pan a
{
	color:#333333;
}

#main dl
{
	margin:1.5em 0;
	border-left:1px solid #CCC;
	border-right:1px solid #CCC;
	border-bottom:1px solid #CCC;
}

#main dl dt
{
	margin-bottom:0.5em;
	padding:5px 5px 5px 15px;
	background:#EEE;
	border-top:1px solid #CCC;
	font-weight:bold;
}

#main dl dd
{
	padding:0 15px;
	margin-bottom:1.5em;
}

#menu
{
	width:210px;
	float:right;
	padding-top:20px;
}

#menu h3
{
	background:#666666 url(../img/bg_h3_menu.gif) no-repeat 8px center;
	padding:5px 5px 5px 24px;
	color:#FFF;
	font-size:98%;
	border-bottom:1px solid #FFF;
}

#menu li
{
	background:#EEE url(../img/list_01.gif) no-repeat 8px center;
	padding:5px 5px 5px 24px;
	border-bottom:1px solid #FFF;
}

#menu li a
{
	color:#666666;
	text-decoration:none;
}

#menu li a:hover,
#menu li a:action
{
	color:#CC0000;
	text-decoration:underline;
}

#footer-menu
{
	clear:both;
	padding:10px 20px;
	margin-bottom:12px;
}

#footer-menu li
{
	float:left;
	background:url(../img/list_02.gif) no-repeat left 0.5em;
	padding:0 10px;
	width:350px;
	
}

#footer
{
	clear:both;
	background:#333333;
	color:#FFFFFF;
	padding:10px;
	text-align:center;
}


/* サイト共通使用CSS */

/* ================= 目次 =====================

【1】配置関連
【2】float 関連
【3】margin 関連
【4】hack 関連
【5】form 関連
	 ・日本語フォーム
	 ・英語フォーム
【6】noscript
【7】囲い

============================================ */



/* =============================================================
　■□■ 1. 配置関連 ■□■
============================================================= */

/* ------------------ 画像中央寄せ -------------- */

.img-center
{
	text-align: center;
}

.img-center img
{
	margin-left: auto;
	margin-right: auto;
}

/* ------------------ 画像右寄せ -------------- */

.img-right
{
	float: right;
	margin-left: 10px;
	margin-bottom: 3px;
}

/* ------------------ 画像左寄せ -------------- */

.img-left
{
	float: left;
	margin-right: 10px;
	margin-bottom: 3px;
}

/* ------------------ 画像テキストの小アイコン用 -------------- */
.img-bottom
{
	vertical-align: bottom;
	padding:0 2px;
}

/* ------------------ テキスト右寄せ -------------- */

.text-right
{
	text-align: right;
}

/* ------------------ テキスト左寄せ -------------- */

.text-left
{
	text-align: left;
}

/* ------------------ テキスト中央寄せ -------------- */

.text-center
{
	text-align: center;
}

/* ------------------ テキスト囲い -------------- */

div.text-table
{
	border:1px solid #CCC;
	background-color:#EEE;
	padding:5px;
	margin-bottom:1em;
}

div.text-table p
{
	background-color:#FFF;
	padding:5px 8px;	
}

div.text-table ul
{
	background-color:#FFF;
	padding:5px 8px;
}

div.text-table ul li
{
	padding:4px 5px 5px 20px;
	background: url(/img/list_green.gif) no-repeat 8px 1em;
}

/* =============================================================
　■□■ 2. float 関連 ■□■
============================================================= */

/* ------------------ floatをここから回避 ------------------ */
.clear
{
	clear: both;
}


/* -------- floatした中身がBOXからはみ出すのを回避 -------- */

.clearbox:after
{
	content: "";
	display: block;
	clear: both;
	height: 0px;
}

.clearbox
{
	height: 100%;
}


/* =============================================================
　■□■ 3. margin 関連 ■□■
============================================================= */

/* -------------- 上 -------------- */
.top5
{
	margin-top: 5px;
}

.top10
{
	margin-top: 10px;
}

.top20
{
	margin-top: 20px;
}

.p-top10
{
	padding-top: 20px;
}

.p-top20
{
	padding-top: 20px;
}

/* -------------- 下 -------------- */
.bottom5
{
	margin-bottom: 5px;
}

.bottom10
{
	margin-bottom: 10px;
}

.bottom20
{
	margin-bottom: 20px;
}

.bottom30
{
	margin-bottom: 30px;
}

.bottom250
{
	margin-bottom: 250px;
}

/* -------------- 左 -------------- */
.left10
{
	margin-left: 10px;
}

.left20
{
	margin-left: 20px;
}

/* -------------- 右 -------------- */
.right10
{
	margin-right: 10px;
}

.right20
{
	margin-right: 20px;
}


/* =============================================================
　■□■ 4. hack 関連 ■□■
============================================================= */

/* -------- 中身をfloatした場合も背景を下まで伸ばす -------- */

.clearfix:after
{
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

.clearfix
{
	display: inline-block;
}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */



/* -------- IE5.5 ＆ IE6のみで起きる不具合の回避 -------- */

/* Hides from IE5-mac \*/
* html .hollyhack {height: 1%;}
/* End hide from IE5-mac */


/* =============================================================
　■□■ 5. form 関連 ■□■
============================================================= */

/* -------- 日本語フォーム -------- */

.form-jpn /* フォーム内を日本語入力に指定（IEのみ対応） */
{
	ime-mode: active;
	padding: 1px 2px;
}

.textbox-jpn /* テキストボックス内を日本語入力に指定（IEのみ対応） */
{
	ime-mode: active;
	padding: 1px 2px;
}


/* -------- 英語フォーム -------- */

.form-eng /* フォーム内を英語入力に指定（IEのみ対応） */
{
	ime-mode: inactive;
	padding: 1px 2px;
}


/* =============================================================
　■□■ 6. noscript ■□■
============================================================= */

/* ------------- noscript ------------- */
#noscript
{
	clear: both;
	font-size: 82%; /* ----- 文字サイズ固定の場合／font-size: 10px; ----- */
	color: red;
	margin: 10px 0 0 15px;
	padding: 5px 0 10px 28px;
	background: url(/img/ico_attn.gif) no-repeat;
	background-position: 0em 0.2em;
}

/* =============================================================
　■□■ 9.トップページ ■□■
============================================================= */

#toplink_header
{
	background:url(../img/toplink_bg.gif) no-repeat right bottom;
	padding-bottom:20px;
	margin:0 15px;
}

#toplink_header p
{
	font-size:120%;
}

#toplink_main
{
	background:#d5edf9;
	padding-bottom:20px;
}

#toplink_main li
{
	background:url(../img/list_toplink.gif) no-repeat left 0.2em;
	padding-left:18px;
	float:left;
	width:280px;
	margin:0 10px 10px 0;
}

#toplink_main ul.line
{
	background:url(../img/line.gif) repeat-x bottom;
	padding-bottom:20px;
	margin-bottom:20px;
}

#toplink_main h3
{
	clear:both;
	margin-bottom:10px;
}

#toplink_01area,
#toplink_02rosen,
#toplink_03type
{
	margin:0 15px 20px 15px;
	padding:20px 10px 20px 80px;
	border-bottom:2px solid #ff9900;
	clear:both;
}

#toplink_01area{ background:#FFF url(../img/toplink_subttl_01.gif) no-repeat top left;}
#toplink_02rosen{ background:#FFF url(../img/toplink_subttl_02.gif) no-repeat top left;}
#toplink_03type{ background:#FFF url(../img/toplink_subttl_03.gif) no-repeat top left;}

div#move-up
{
	background:url(../img/img_move-up.gif) center repeat-x;
	padding:10px 20px;
	margin:20px 0;
	clear:both;
	text-align:right;
}

.bold
{
	font-weight:bold;
}

