@charset "UTF-8";


/* ブロック要素のデフォルト・スタイルをリセット。 */
/* fieldsetは、なんとなく除外しておく。 dir、menuなどのdeprecatedな要素も除外。 */

body, div, p, hr, blockquote, pre, adress,
dl, dt, dd, ul, ol, li,
h1, h2, h3, h4, h5, h6,
table, tr, th, td, caption, col, colgroup, thead, tfoot, tbody,
form, map, embed, object, iframe, noframes, script, norscripts {
	margin: 0px;
	padding: 0px;
	text-align: left;
}

table, th, td, img { border: 0px; }


/*1*/
p, hr, blockquote, pre, adress,
dl, dt, dd,
h1, h2, h3, h4, h5, h6,
embed, object { zoom: 1; }
span, label { zoom: 1; }

ol { padding-left: 2em; }
li { vertical-align: top; }

/*2*/
html, body { height: 100%; }

/*3*/
html:not([lang*=""]) { overflow-y: scroll; }

/*4*/
body { text-align: center; }

/*5*/
object, embed { vertical-align: top; }

/*6*/
.clearfix:after { content: "."; display: block; clear: both; visibility: hidden; height: 0.1px; font-size: 0.1em; line-height: 0; }
.clearfix { min-height: 1px; }
* html .clearfix { display: inline-block; } /* IE5以前のみ */
/*\*/ * html .clearfix { height: 1%; } .clearfix { display: block; } /**/ /* Mac版IEから隠す */


/*
---------------------------------------------------------------------------
1.
「IEでhasLayoutの値がtrueの要素とfalseの要素が混在するとユーザがズームを変
更した際に要素が重なってしまう。また、flaotした要素の周辺の要素のhasLayout
の値がfalseのとき、marginやpaddingの解釈がおかしい」というバグを回避。
zoomプロパティ（IEの独自拡張のためinvalidですが）を指定することで、必要な要
素のhasLayoutをtrueにします。
body、img、input、table、tdは、もとから常にtrue。
参考： http://msdn.microsoft.com/en-us/library/ms533776(VS.85).aspx

単純に「* { zoom: 1; }」だと問題が生じます（下記URL参照）。
そこで、ここで採用している方法では、img要素やinput要素の後のプレーンテキス
トをspan要素またはlabel要素でマークアップする必要があります。
また、div要素等には、必要な場合に個別にzoom: 1を指定することとし、このスタ
イルシート内では指定しません。
参考： http://hpbuilder.net/weblog/2007/08/07123842.html
参考： http://likealunatic.jp/2007/09/16_zoom1.php

続くリスト関連の指定は、いずれもやはり、IEのhasLayout関連のバグ対処。

「hasLayoutがtrueなol要素で、リスト番号が消えてしまう」バグ。消えてしまった
番号を出すために左側にpaddingをとります。
参考： http://hpbuilder.net/weblog/2007/08/06203819.html

「li要素ないしその子孫要素におけるhasLayoutがtrueである場合、リストマーカが
下方にずれる」バグ。hasLayoutがtrueになってしまう状況は、例えばfloatを利用
した場合。li要素内でimg要素をfloat: leftする等。
参考： http://end-of-file.net/blog/2008-11.html


2.
Firefoxでswfなどを縦100%でレンダリングさせる場合、「height: 100%;」が必要。


3.
FireFoxでは、コンテンツが少ない場合に縦スクロールバーが消えてしまい、ページ
移動の際にセンタリングがずれることがあります。これを防ぐために、縦スクロー
ルバーを常に表示させておきます。
IEでは縦スクロールバーが二重に表示される場合があるため、FireFoxのみに有効な
セレクタで記述しています。（要検証：このCSSハックは正しく機能しているか？）
なお、Operaにも同様の問題がありますが、ここではあきらめています。どうしても
必要な場合は下記。
html:first-child body {
	min-height: 100%;
	padding-bottom: 1px;
}


4.
IE6のquirkモードで margin: auto; によるセンタリングができないバクの対策。
後続の子ブロック要素で text-align: center; を指定して左寄せに戻す必要あり。


5.
FireFoxでembed要素、Operaでobject要素の下に余白ができてしまう問題を回避。


6.
floatしたブロック要素の高さはその親要素の高さには反映されないため、親要素の
高さの方が小さい場合には、親要素に指定したborderやbackground-imageが、意図
に反して途切れてしまう（floatした子要素がはみ出してしまう）ことがあります。
（これはCSSの解釈としては正しいのでバグではない。）
親要素のクラスに上記で設定したclearfixを指定することで、この問題を解消しま
す。
---------------------------------------------------------------------------
*/



/* プリンター関連
---------------------------------------------------------------------------
*/

/* プリント時以外は表示しない要素。 */
.printOnly { display : none; }

/* プリンタ用指定 */
@media print {

	/* overflowにvisible以外を指定した要素も印刷されるように。 */
	* { overflow: visible; }

	/* プリントされず、レイアウトからも消える要素。 */
	.noPrint { display: none; }

	/* プリントされないものの、レイアウトには影響を与える要素（単なる非表示）。 */
	.noPrintContent { visibility: hidden; }

	/* プリント時以外は表示しない要素。＝プリント時のみ表示する要素。 */
	.printOnly, div.printOnly { display: block; }
	span.printOnly, label.printOnly { display: inline; }
	table.printOnly { display: table; }
	tr.printOnly { display: table-row; }
	td.printOnly { display: table-cell; }

}

/* フォント・スタイル
---------------------------------------------------------------------------
*/

* {
	font-style: normal;
	font-weight: normal;
	font-variant:normal;
	text-decoration: none;
	vertical-align: baseline;
}

b, em { font-weight: bold; }
i, var { font-style: italic; }
u { text-decoration: underline; }
s, strike { text-decoration: line-through; }
tt, pre, code, kbd, samp { font-family: monospace; }
abbr, acronym { border-bottom: 1px dotted #000; }

ins { }
del { text-decoration: line-through; }


/* フォント・サイズ
---------------------------------------------------------------------------
*/

body { font-size: 12px; }
body.en { font-size: 14px; }
* html body { font-size: 75%; } /* for IE */

/*
以上でブラウザごとのデフォルトのフォントサイズの違いを平準化しています。
IEでは相対指定でないとユーザが文字サイズを変更できないため、デフォルトのフォ
ントサイズが16pxであるという前提のもとで、16 * 0.625 = 10 として10pxに揃えて
います。
以降、フォントサイズ指定は10pxを基準に%で行います。
（フォントサイズを%指定した要素が入れ子になる場合に注意すること。）
*/

/* IEのテーブルなどでフォントサイズが継承されない場合があるため。 */
input, select, table, th, td { font-size: 1em; }


.en input, .en select, .en table, .en th, .en td { font-size: 1.1em; }


/* 要素が入れ子になる場合に備えて。 */
li li, li p, td p, blockquote p { font-size: 1em; }


h1 { font-size: 190%; }
h2 { font-size: 170%; }
h3 { font-size: 150%; }
h4 { font-size: 140%; letter-spacing: 0.5em; }
h5 { font-size: 130%; letter-spacing: 0.5em; }

sub { font-size: 80%; }
sup { font-size: 80%; }

big   { font-size: 110%; }
small { font-size: 90%; }


/* その他
---------------------------------------------------------------------------
*/

ul, ol, dl { padding-left: 2.5em; }
dd { padding-left: 2em; }

table {
	border-collapse: collapse;
	border-spacing: 0px;
	border: 0px;
}
th,td {
	border: 0px;
	empty-cells: hide;
	vertical-align: middle;
}
th img, td img { vertical-align: middle; }
caption, th { text-align: left; }

img { border: 0px; }

/* JavaScriptでロールオーバーなどを設定するとOperaでカーソルが変わらない場合があることへの対策。 */
a img { cursor: pointer; }


/* サイト
---------------------------------------------------------------------------
*/

body { background: #FFFEEE; }

#container {
	width:660px;
	margin: 0px auto;
	text-align: left;
}


#contents {
	float: left;
	width: 660px;
 }

#main { padding-bottom: 20px; }

#header {
	padding: 30px 0;
 }


#header #cover {
	float: right;
	position: relative;
 }

#header #cover img {
	border: 1px #ccc solid;
	margin-bottom: 10px;
 }

#header #cover span {
	display: block;
	width: 168px;
	font-size: 85%;
 }
#header #cover span em {
	font-style: italic;
	font-weight: normal;
 }

#header #navi { float: left; }

#header #navi h1 { margin-bottom: 30px; }

#navi ul {
	margin-bottom: 10px;
	padding: 0;
}
#navi ul li {
	height: 32px;
	list-style-type: none;
 }

#navi ul li * { color: #484848 !important; }

#navi ul li.language { padding-top: 25px; }

#navi ul.lang li {
	float: left;
	padding-right: 10px;
}

#navi li a img { padding-bottom: 1px; }
#navi ul.lang a img { border-bottom: 1px #FFFEEE solid; }
#navi li a.active img { border-bottom: 1px #000 solid; }


#main {
	float: left;
	width: 660px;
	min-height: 300px;
 }

.section {
	margin-bottom: 40px;
}

table.list {
	width: 100%;
	margin-top: -10px;
	margin-bottom: 30px;
 }

table.list th {
	width: 40px;
	padding: 10px 0;
	vertical-align: top;
	border-bottom: 1px #ccc dotted;
 }

table.list td {
	width: 540px;
	padding: 10px 0;
	vertical-align: top;
	color: #666666;
	border-bottom: 1px #ccc dotted;
}

table.list a {
	padding: 1px 5px;
	background: #50942b;
	color: #fff;
	text-decoration: none;
	border-radius: 3px;        /* CSS3草案 */
	-webkit-border-radius: 3px;    /* Safari,Google Chrome用 */
	-moz-border-radius: 3px;   /* Firefox用 */
 }

table.list span.end { color: #ff0033; }

table.list a:hover {
	background: #000;
	color: #fff;
	text-decoration: none;
 }


#footer {
	clear: both;
	width: 660px;
	height: 80px;
	margin: 0px auto;
	border-top: 1px #000 solid;
	text-align: left;
}

#footer .inner {
	padding: 20px 0px;
	text-align: right;
	font-size: 90%;
}

#footer #contact { float: left; }

#footer #copyrights { float: right; }

/**/

* {
	line-height: 1.67em;
}

h2 {
	margin-bottom: 20px;
	padding-bottom: 10px;
	font-size: 120%;
	border-bottom: 2px solid #000;
 }

h3 {
	margin-bottom: 20px;
	font-size: 100%;
	font-weight: bold;
 }

:link { color: #50942b; }
:visited { color: #939; }
:link:hover, :visited:hover { color: #333; text-decoration: underline; }
:link:active, :visited:active { color: #000; }

strong,
strong * { font-weight: bold; }

.caption { 	font-size: 85%; }

.text-danger {
	color: #ff0033;
}

p {
	margin-bottom: 1.67em;
 }

.floatLeft { float: left; }
.floatRight { float: right; }

/* N add 170131 */

#navi .lang li {
	height: auto;
}

#cover {
	margin-bottom: 30px;
	font-size: 85%;
}
#cover img {
	display: block;
	margin-bottom: 10px;
}
#cover em {
	font-style: italic;
	font-weight: normal;
}
	table.list-news td {
		padding: 20px 0;
	}
	table.list-news td *:last-child {
		margin-bottom: 0;
	}
	table.list-news .meta {
		margin-bottom: 1em;
	}

.en table.list th {
	padding-right: 10px;
}