@charset "utf-8";

/* トータルの設定
------------------------------ */

body {
	font-family: Verdana, Meiryo, "メイリオ", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 75%;
	line-height: 1.5em;
	color: #333333;
	text-align: center;
}

/* リンク */
a,a:link,a:visited {
	text-decoration: underline;
	color: #0000CC;
}
a:hover,a:active {
	text-decoration: underline;
	color: #0000FF;
}

strong {
	font-weight: bold;
}

#content p {
	margin-bottom: 1.5em;
}

.red {
	color: #CC0000;
	font-weight: bold;
}
.bd {
	font-weight: bold;
}
.bg {
	font-size: 150%;
}
/* 画像の設定 */
img.left {
	float: left;
	margin: 0 10px 10px 0;
}
img.right {
	float: right;
	margin: 0 0 10px 10px;
}
.f_clear {
	clear: both;
}
.center {
	text-align: center;
	margin-bottom: 10px;
}

/* サイト全体の設定
------------------------------ */

/* サイト全体 */
#container {
	margin: 0 auto;
	text-align: center;
}

/* サイトの横幅 */
#container, #branding, #content, 
#footer_inner, #content_bottom {
	width: 800px;
}

/* 中央カラムの横幅 */
#main_col {
	width: 600px;
}

/* サイドカラムの横幅 */
#side_col {
	width: 200px;
}

/*「clearfix」でfloatを解除 */
.clearfix:after{
	visibility: hidden;
	display: block;
	content: ".";
	height: 0;
	clear: both;
}
.clearfix{ display: inline-block; }

* html .clearfix{ height: 1%; };
.clearfix{
	display: block;
}


/* ヘッダーの設定
------------------------------ */

#branding {
	position: relative;
	height: 120px;
	text-align: left;
}
#branding h1 {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	font-size: 80%;
}
#site_logo {
	position: absolute;
	top: 30px;
	left: 0;
	width: 250px;
	height: 50px;
}
#description {
	position: absolute;
	left: 0;
	width: 100%;
	font-size: 80%;
	bottom: 10px;

}
#header_banner {
	position: absolute;
	top: 30px;
	right: 10px;
	height: 50px;
	width: 250px;
	background: #EEEEEE;
}
#header_banner a:hover img {
	filter: alpha(opacity=80);
	-moz-opacity: 0.80;
	opacity: 0.80;
}
/* コンテンツ全体の設定
------------------------------ */

#content {
	float: left;
	background: url(../images/site/container__01.gif) top left repeat-y;
}

/* サイドカラムの設定
------------------------------ */

#side_col {
	float: right;
	padding: 10px 0 5px;
}
.side_content {
	margin: 0 10px 5px;
	border: 1px solid #666;
	background: #FFF;
	width: 178px;
	_width: 180px;
	text-align: left;
	font-size: 85%;
}

h2.side_title {
	padding: 0.3em 10px;
	line-height: 1.4em;
	width: 158px;
	_width: 178px;
	background: #333300 url(../images/site/h2_02.gif) left center repeat-x;
	font-size: 110%;
	color: #FFF;
}
h2.side_title02 {
	padding: 0.3em 10px;
	line-height: 1.4em;
	width: 158px;
	_width: 178px;
	background: #333300 url(../images/site/h2_01.gif) left center repeat-x;
	font-size: 110%;
	color: #FFF;
}
ul.side_menu {
	padding: 10px 5px;
}
ul.side_menu li {
	margin: 0 0 0 1.5em;
	list-style: outside disc;
	line-height: 1.4em;
}

/* サイドバーのランキング */
.side_ranking {
	margin: 0 10px 5px;
	border: 1px solid #666;
	background: #FFF;
	width: 178px;
	_width: 180px;
	text-align: left;
	font-size: 85%;
}
.side_ranking h2.side_title {
	padding: 0.3em 10px;
	line-height: 1.4em;
	width: 158px;
	_width: 178px;
	background: #333300 url(../images/site/h2_03.gif) left center repeat-x;
	font-size: 110%;
	color: #FFF;
}
.side_ranking table {
	margin: 5px;
	width: 168px;
	line-height: 1.3em;
	border-collapse: collapse;
}
.side_ranking tr {
	border-bottom: 1px dotted #CCC;
}
.side_ranking th {
	font-weight: bold;
	padding: 3px;
	text-align: center;
}
th.no1 {
	font-size: 160%;
	color: #FF9900;
}
th.no2 {
	font-size: 140%;
	color: #999999;
}
th.no3 {
	font-size: 140%;
	color: #CC6666;
}
.side_ranking td {
	padding: 3px;
}



/* メインカラムの設定
------------------------------ */

#main_col {
	float: left;
	padding: 10px 0 1px;
	text-align: left;
}

#main_col .post {
	margin: 0 10px 10px;
	border: 1px solid #666;
	width: 578px;
	_width: 580px;
	background: #FFF;
}

#main_col h2 {
	padding: 0.6em 10px;
	line-height: 1.1em;
	background: #333300 url(../images/site/h2_01.gif) left center repeat-x;
}
#main_col h2.recommend {
	padding: 0.6em 10px;
	line-height: 1.1em;
	background: #333300 url(../images/site/h2_03.gif) left center repeat-x;
}
#main_col h2, #main_col h2 a {
	color: #FFF;
	font-weight: bold;
	text-decoration: none;
}

#main_col .post_inner {
	padding: 9px;
	font-size: 90%;
}
.post_inner h3 {
	padding: 0.2em 5px;
	margin-bottom: 10px;
	line-height: 1.3em;
	border-bottom: 1px dotted #666;
	font-weight: bold;
}
.post_2col {
	float: left;
	padding: 0 10px 10px;
	width: 580px;
	_width: 600px;
}
.post_2col .post_l {
	float: left;
	border: 1px solid #666;
	width: 283px;
	_width: 285px;
	background: #FFF;
	height: 385px;
}
.post_2col .post_r {
	float: right;
	border: 1px solid #666;
	width: 283px;
	_width: 285px;
	background: #FFF;
	height: 385px;
}
#main_col ul.merit {
	margin-bottom: 1.5em;
	font-weight: bold;
}

#main_col ul li {
	margin-left: 2em;
	list-style: outside disc;
}
#main_col ol li {
	margin-left: 2em;
	list-style: outside decimal;
}
/* 厳選おすすめFX業者 */
.left_box {
	float: left;
	width: 270px;
	margin-bottom: 10px;
}
.right_box {
	float: left;
	width: 270px;
	margin-bottom: 10px;
	margin-left: 19px;
}

/* コンテンツ下部の設定
------------------------------ */

#content_bottom {
	clear: both;
	text-align: right;
	padding: 5px 0;
	font-size: 80%;
}

/* フッターの設定
------------------------------ */

#footer {
	background: #333;
	border-top: 2px solid #666;
}

#footer_inner {
	margin: 0 auto;
	padding: 40px 0;
	color: #FFF;
	font-size: 80%;
}
#footer_inner a {
	color: #FFF;
}

