@charset "UTF-8";
/* CSS Document */

/*------------------------------ユニバーサルセレクタ------------------------------*/
*{
    margin:0;
	padding:0;
	font-size:100%;
	text-decoration:none;
	list-style:none;
	border:0;
}

/*------------------------------bodyの設定------------------------------*/
body  {
	background: #FFFFFF;
	text-align: center; /* これにより、IE 5* ブラウザではコンテナが中央揃えになります。そして、テキストは、#container セレクタの初期設定である左揃えに設定されます */
}


/*------------------------------bigcontainer & containerの設定------------------------------*/
#bigcontainer { 
	width: 900px;
	margin: 0 auto;
	border: 1px solid #6696C9;
	background-image:url(../img/policy.jpg) ;
	background-repeat:no-repeat;
} 

#container { 
	width: 900px;
	margin: 0 auto;
	margin-top:5px;
	text-align: left; /* この設定は body エレメントの text-align: center より優先されます。 */
} 


/*------------------------------ページ説明文の設定------------------------------*/
#description p {
	font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
	font-size: 9px;
	color:#A7A7A7;
}


/*------------------------------メインナビの設定------------------------------*/
#mainnavi {
    width:900px;
	height:25px;
	margin-left:2px;
}
#mainnavi li {
	float: left;
}
#mainnavi li img {
    vertical-align: top;
    vertical-align: bottom;
}

#mainnavi li.sideimg {
    width:50px;
	height:25px;
}

/*------------------------------パンクズリストの設定------------------------------*/

#path {
    width:450px;
}
#path ul li {
    font-size:9px;
	color:#685F56;
}
#path ul li a {
    font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
    font-size:9px;
	color:#685F56;
}
#path ul li a:hover{
    color:#6696C9;
}


/*------------------------------サイドバーの設定------------------------------*/
/* #sidebar1 に関するヒント：
1. 単位は相対単位であるため、サイドバーで余白を使用することは回避してください。標準に準拠したブラウザでは、余白は全体の幅に追加されるため、実際の幅が不特定の幅になります。 
2. サイドバーの値の単位として em が使用されているので、その幅が初期設定のテキストサイズに応じて変化することに注意してください。
3. 「.twoColHybRtHdr #sidebar1 p」ルールで見られるように、div の端と div に含まれるエレメントの間のスペースは、エレメントに左マージンと右マージンを適用することによって設定できます。
*/
.twoColHybRtHdr #sidebar1 {
	float: right; 
	width: 150px;
	height:750px;
	padding: 20px 50px 15px 4px;
	/*border-left:1px dotted #6696C9 ;*/
}
#sidebar1 img {
	margin-bottom: 5px;
}
#sidebar1 h3 {
    text-align:center;
}


/*------------------------------メインコンテンツの設定------------------------------*/
/* #mainContent に関するヒント：
1. #mainContent と #sidebar1 の間のスペースは、#mainContent div の右マージンによって設定されます。#sidebar1 div に含まれるコンテンツの量に関係なく、#sidebar1 div のスペースは維持されます。#sidebar1 のコンテンツが終了した後のスペースに #mainContent div のテキストを挿入するには、この右マージンを削除します。
2. #mainContent div の幅より広いエレメントが #mainContent div 内に配置されると、フローティングエレメントの落下（フローティング状態ではない #mainContent 領域がサイドバーの下に配置されること）が発生する可能性があります。ハイブリッドレイアウトの場合（全体の幅の単位はパーセント、サイドバーの単位は em）、使用可能な幅を正確に計算できない場合があります。ユーザーのテキストサイズが平均よりも大きい場合、#sidebar1 div が広くなるため、#mainContent div のスペースが狭くなります。クライアントが Contribute を使用してコンテンツを追加する予定である場合は、この制限に注意してください。
3. 下の Internet Explorer の条件分岐コメントでは、#mainContent に「hasLayout」を設定するのにズームプロパティが使用されます。これにより、いくつかの IE 固有のバグを回避できます。
*/
.twoColHybRtHdr #mainContent {
  margin: 20px 0 0 50px; /* 左マージンの値は、ヘッダーおよびフッターの値と同じです。これにより、ドキュメントの左側の整列が設定されます。 */
  background:url(../../img/paper.jpg) repeat-y ;
  width:620px;
  height:auto;
  float:left;
  display:inline;/* for WinIE6*/
  color:#663333;
  position:relative;
  border-right:1px dotted #6696C9 ;
  padding-right:20px;
}
#mainContent h2 img{
    width:610;
	height:40;
}
#mainContent #headcopy {
    float:right;
	color:#407180;
	font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
	font-size: 12px;
	line-height: 24px;
	width:450px;
	height:120px;
	padding-top:12px;
}

#headimg img {
	position: absolute;
	right: 30px;
	top: -10px;
}


/*------------------------------メインコンテンツ内 | 下部 | ページのトップへの設定------------------------------*/
#mainbottomarea{
    width:620px;
}

.space_blue{
    margin:15px 0 5px ;
}
#mainContent .totop {
    width:620px;
}
.totop img {
	vertical-align:text-bottom;
}
#mainContent .totop a {
    font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
    color:#6696C9;
    display:block;
	width:581px;
	text-align:right;
	margin:0;
	padding:0 0 15px ;
	font-size:9px;
}



/*------------------------------フッターの設定------------------------------*/
#footer ul {
    display:block;
	width:900px;
	height:10px;
	padding:5px 0 10px ;
	font-family:"ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
	background-image:url(../../img/copyright900.jpg);
	background-repeat:no-repeat;
}
#footer li {
    font-size:9px;
    display:inline;
	padding-left:10px;
}

#footer li a {
    font-size:9px;
    color:#685F56;
}

#footer li a:hover{
    color:#6696C9;
}
#footer .copyright {
	padding-left: 200px;
}


/*------------------------------再使用できる各種クラス------------------------------*/
.fltrt { /* このクラスは、ページ上でフローティングエレメントを右側に配置するのに使用できます。プローティングエレメントは、ページ上でその横に配置されるエレメントの前に配置される必要があります。 */
	float: right;
	margin-left: 8px;
}
.fltlft { /* このクラスは、ページ上でフローティングエレメントを左側に配置するのに使用できます */
	float: left;
	margin-right: 8px;
}
.clearfloat { /* このクラスは、div またはブレークエレメントに適用される必要があり、また、フローティングエレメントが完全に含まれているコンテナの末尾の直前にある最後のエレメントである必要があります */
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}
