﻿@charset "utf-8";

/*============================================
全般的なスタイル
============================================*/
* {
	margin:0; padding:0; 	/*全要素のマージン・パディングをリセット*/
	line-height:1.5;		/*全要素の行の高さを1.5倍にする*/
	color:#333333;			/*文字色*/

} 
body {
	background-color:#3399ff;	/*ページ全体の背景色*/
	text-align:center;			/*IE6以下でセンタリングするための対策*/
}
div#pagebody {
	width:960px; margin:0 auto;		/*内容全体をセンタリング*/
	text-align:left;				/*テキストの配置を左揃えにする*/
/*	background-image:url("images/bg_pagebody.gif");*/	/*内容全体の背景*/
/*	background-repeat:repeat-y;*/		/*背景画像を縦方向に繰り返す*/
	background-color:#ffffff;		/*内容全体の背景色*/
}

/*============================================
ヘッダ
============================================*/
div#header {
	height:250px;								/*背景画像のサイズに合わせてボックスの高さを指定*/
	background-image:url("image/bg_top.jpg");	/*ヘッダ部分の背景画像*/
	background-repeat:no-repeat;				/*背景画像を繰り返さない*/
	background-color:#ffffff;					/*ヘッダ部分の背景色*/
	background-position: center center;
}
h1 {
	padding:10px 0px 0px 20px;					/*見出し内容の位置調整*/
	font-family:Arial, Helvetica, sans-serif;	/*フォントの種類*/
}
h1 a {
	color:#ffffff;
	text-decoration:none; 						/*リンクの下線を無くす*/
}

/*============================================
メインメニュー
============================================*/
ul#menu {
	height:36px; background-color:#ffffff; font-weight:bold;
	margin:4px 0px 5px 4px;				/*[上][右][下][左]*/
}
li#menu01,li#menu02,li#menu03,li#menu04,li#menu05,li#menu06 {
	float:left;						/*リスト項目を横に並べる*/
	display:inline;					/*リスト項目をインライン表示にする*/
	list-style-type:none;			/*リストマーカー無しにする*/
	background-repeat:no-repeat; 	/*背景画像を繰り返さない*/
	margin-left:4px;
}

/*ボタン01～05にはそれぞれ異なる背景画像を指定する*/
li#menu01 {
	width:154px; height:32px;		/*背景画像に合わせたサイズ指定*/
	/*background-image:url("images/bg_menu01.jpg");*/	/*背景画像*/
	background-color:#ffff66;		/*ヘッダ部分の背景色*/
}
li#menu02 {
	width:154px; height:32px;		/*背景画像に合わせたサイズ指定*/
	/*background-image:url("images/bg_menu02.jpg");*/	/*背景画像*/
	background-color:#ffcc66;		/*ヘッダ部分の背景色*/
}
li#menu03 {
	width:154px; height:32px;		/*背景画像に合わせたサイズ指定*/
	/*background-image:url("images/bg_menu03.jpg");*/	/*背景画像*/
	background-color:#99ccff;		/*ヘッダ部分の背景色*/
}
li#menu04 {
	width:154px; height:32px;		/*背景画像に合わせたサイズ指定*/
	/*background-image:url("images/bg_menu05.jpg");*/	/*背景画像*/
	background-color:#ccff99;		/*ヘッダ部分の背景色*/
}
li#menu05 {
	width:154px; height:32px;		/*背景画像に合わせたサイズ指定*/
	/*background-image:url("images/bg_menu04.jpg");*/	/*背景画像*/
	background-color:#ccccff;		/*ヘッダ部分の背景色*/
}
li#menu06 {
	width:154px; height:32px;		/*背景画像に合わせたサイズ指定*/
	/*background-image:url("images/bg_menu05.jpg");*/	/*背景画像*/
	background-color:#ffddff;		/*ヘッダ部分の背景色*/
}
ul#menu a {
	display:block;					/*リンクをブロック表示にする*/
	height:32px; padding-top:4px; text-align:center;
	text-decoration:none; 			/*リンクの下線を無くす*/
	font-family:Arial, Helvetica, sans-serif;	/*フォントの種類*/
}

ul#menu a:hover {
	font-weight:normal;
	font-style: italic;
/*	background-color:#eeeeee;*/		/*リンクにマウスが乗ったら色を変える*/
}


/*============================================
サブメニュー（左カラム）
============================================*/
div#submenu {
	width:160px;				/*幅の指定*/
	margin:20px 10px 10px 20px;	/*位置調整（IE6のバグに注意）[上][右][下][左] */
	display:inline;				/*IE6のマージン算出のバグ対策*/
	float:left;					/*サブメニューのカラムを左寄せにする*/
	min-height:500px;			/*何も無くても下方向に空間を空ける為*/
}

/*サブメニューのヘッダ部分（余白調整・背景画像・背景色・文字サイズなど）*/
div#submenu_header {
	height:26px; padding:4px 0px 0px 0px;
/*	background-image:url("images/bg_submenu_header.gif");*/
/*	background-repeat:no-repeat; background-position:top;*/
	background-color:#3399ff;
	color:#eeeeee;
	font-size:90%; font-weight:bold; text-align:center;
}

/*サブメニューのボディ部分（余白調整・背景画像・背景色）*/
ul#submenu_body {
	padding-bottom:4px;
/*	background-image:url("images/bg_submenu_footer.gif");*/
/*	background-repeat:no-repeat; background-position:bottom;*/
	background-color:#3399ff;
}
ul#submenu_body li {
	font-size:90%;				/*文字サイズを90%にする*/
	list-style-type:none;		/*リストマーカー無しにする*/
	display:inline;				/*リスト項目をインライン表示にする*/
}
ul#submenu_body li a {
	display:block;				/*リンクをブロック表示にする*/
	margin:0px 4px 0px 4px;		/*サブメニュー項目のマージン*/
	padding:2px 0px 2px 15px;	/*サブメニュー項目のパディング*/
	background-color:#eeffff;	/*サブメニュー項目の背景色*/
	text-decoration:none;		/*リンクの下線を無くす*/
}
ul#submenu_body li a:hover {
	background-color:#ffffff;	/*リンクにマウスが乗ったら色を変える*/
	font-style: italic;
}



/*============================================
コンテンツ（中央と右の2カラム全体）
============================================*/
div#content {
	width:740px; margin:10px 20px 10px 0px;	/*幅の指定と位置調整 [上][右][下][左] */
	float:right;							/*2カラム全体を右寄せにする*/
}

/*============================================
ニュース（中央カラム）
============================================*/
div#news {
	width:560px; margin-right:5px; padding-top:10px;	/*幅の指定と位置調整*/
	margin-top:10px;
	float:left;										/*カラムを左寄せにする*/
	background-image:url("image/bar_news.png");		/*中央カラムの背景画像*/
	background-repeat:no-repeat;					/*背景画像を繰り返さない*/
}

/*見出し・段落・水平線のスタイル指定*/
h2 {
	font-size:100%; margin-bottom:10px; padding-left:25px;
	font-size:95%; border-bottom:solid 1px #cccccc;
	background-image:url("image/icon.png");
	background-repeat:no-repeat; background-position:left center;
}
h3 {font-size:90%; margin-left:15px;}
/* 日付見出し */
date {
	padding-right:10px;
	font-size:85%;
	float:right;
}
p {font-size:95%; margin-bottom:10px; text-indent:10px;}	/*[上][右][下][左]*/
/* リンク */
p.link{	text-align: right; }
image.link{ border:0px; position:relative; top:3px; }
/* 水平線 */
hr {height:1px; border:solid 1px #cccccc; margin-bottom:30px;}

/*============================================
アプリ紹介（中央カラム）
============================================*/
div#app {
	width:560px; margin-right:5px; padding-top:0px;	/*幅の指定と位置調整*/
	margin-top:10px;
	float:left;										/*カラムを左寄せにする*/
/*	background-image:url("image/bar_news.png");*/		/*中央カラムの背景画像*/
	background-repeat:no-repeat;					/*背景画像を繰り返さない*/
}

/*見出し・段落・水平線のスタイル指定*/
h2#app {
	font-size:100%; margin-bottom:10px; padding-left:25px;
	font-size:95%; border-bottom:solid 1px #cccccc;
	background-image:url("image/icon.png");
	background-repeat:no-repeat; background-position:left center;
}
h3#app {
	font-size:95%; padding-left:15px; margin-bottom:10px; margin-left:0px;
	background-color:#ffcc66;
}
h3#wsapp {
	font-size:95%; padding-left:15px; margin-bottom:10px; margin-left:0px;
	background-color:#99ccff;
}
h3#andapp {
	font-size:95%; padding-left:15px; margin-bottom:10px; margin-left:0px;
	background-color:#ccff99;
}
p#app {font-size:90%; margin-bottom:10px; text-indent:10px;}	/*[上][右][下][左]*/
/* アイコン画像 */
image.icon#app{
	border:0px; width:96px; height:96px;
	margin-right:20px;
	padding-bottom:20px;
}


/*============================================
右のCMゾーン（右カラム）
============================================*/
div#zoner_cm {
	width:160px; padding-top:10px; 		/*幅の指定と位置調整*/
	float:right;						/*カラムを右寄せにする*/
}
div#zoner_cm ul {
	margin-left:10px; 			/*左マージンを10px空ける*/
	font-size:90%;				/*フォントサイズを90%にする*/
}
div#zoner_cm li {
	list-style-type:none; 		/*リストマーカー無しにする*/
	line-height:1.8;			/*行の高さを1.8倍にする*/
}

/*============================================
フッタ
============================================*/
div#footer {
/*	height:42px;*/ text-align:center;
	clear:both;					/*回り込みを解除する*/
/*	background-image:url("images/bg_footer.jpg");*/	/*フッタ部分の背景画像*/
/*	background-repeat:no-repeat;*/			/*背景画像を繰り返さない*/
	background-color:#3333ff;			/*フッタ部分の背景色*/
}
address {
	color:#eeeeee;				/*文字色*/
	font-style:normal;			/*フォントスタイルを標準にする*/
	font-size:small;			/*フォントサイズを小さくする*/
	padding:5px 0px 5px 0px;	/*要素内容の位置調整*/
}

/*============================================
ソーシャルボタン関連 [上][右][下][左]
============================================*/
.social_btn {
	margin: 10px 0px 0px 8px;
	padding: 0px;
	width:486px;
}
.social_btn .twitter {
	float: left;
	margin: 0px 10px 0px 0px;
	padding: 0px;
	display: inline;
	width: 88px;
}
.social_btn .facebook {
	float: left;
	margin: 0px 10px 0px 0px;
	padding: 0px;
	display: inline;
	width: 108px;
}
.social_btn .google {
	float: left;
	margin: 1px 10px 0px 0px;
	padding: 0px;
	display: inline;
	width: 70px;
}
.social_btn .hatena {
	float: left;
	margin: 2px 10px 0px 0px;
	padding: 0px;
	display: inline;
	width: 56px;
}
.social_btn .mixi {
	float: left;
	margin: 2px 10px 0px 0px;
	padding: 0px;
	display: inline;
	width: 108px;
}
