@charset "utf-8";
@import url(common.css);

/* ---------------------------------------------------------
	CSS Document Top Page
--------------------------------------------------------- */

#visual {
	clear: both;
	width: 850px;
	height: 252px;
	overflow: hidden;
	margin: 0 auto;
	background: url(../images/visual.jpg) no-repeat 0 0;
	text-align: left;
	text-indent: -9999px;
}

/* ---------------------------------------------------------
	CSS Document Main Banner
--------------------------------------------------------- */

#main_banner {
	clear: both;
	height: 91px;
	overflow: hidden;
	list-style: none;
	text-align: left;
	text-indent: -9999px;
}

#main_banner li#defferences_banner {
	float: left;
	width: 416px;
	height: 81px;
	overflow: hidden;
	margin: 0 auto;
	background: url(../images/defferences_banner.jpg) no-repeat 0 0;
}

#main_banner li#howto_banner {
	float: right;
	width: 416px;
	height: 81px;
	overflow: hidden;
	margin: 0 auto;
	background: url(../images/howto_banner.jpg) no-repeat 0 0;
}

#main_banner a {
	display: block;
	height: 81px;
	overflow: hidden;
}

/* ---------------------------------------------------------
	CSS Document Osusume Item
--------------------------------------------------------- */

#osusume_item {
	clear: both;
	display: block;
	width: 639px;
	min-height: 153px;
	background: #42416d;
}

* html #osusume_item {
	height: 153px;
	overflow: visible;
}

#osusume_item:after {
	content: "";
	display: block;
	clear: both;
	height: 1px;
	overflow: hidden;
}

#osusume_item h3 {
	float: left;
	width: 164px;
	min-height: 153px;
	overflow: hidden;
	background: #42416d url(../images/osusume_item_h3.jpg) no-repeat 0 0;
	text-align: left;
	text-indent: -9999px;
}

* html #osusume_item h3 {
	height: 153px;
	overflow: visible;
}

#osusume_item ul {
	float: left;
	width: 474px;
	min-height: 153px;
	overflow: hidden;
	border: solid 1px #3f3e65;
	border-left: 0;
	border-bottom: 0;
	background: #fff;
	list-style: none;
	font-size: 90%;
	line-height: 120%;
}

* html #osusume_item ul {
	width: 475px;
	border-bottom: solid 1px #3f3e65;
}

* + html #osusume_item ul {
	border-bottom: solid 1px #3f3e65;
}

#osusume_item li {
	float: left;
	width: 138px;
	min-height: 133px;
	overflow: hidden;
	padding: 10px;
	background: url(../images/osusume_item_line.gif) no-repeat right;
}

#osusume_item li.none {
	background: none;
}

* html #osusume_item li {
	width: 158px;
	height: 153px;
}

#osusume_item li a {
	display: block;
	padding-bottom: 6px;
	text-align: center;
}

/*----------------------------------------------------------
	CSS Document News
--------------------------------------------------------- */

#news {
	float: left;
	width: 285px;
	height: 420px;
	overflow: hidden;
}

#news h3 {
	width: 285px;
	height: 29px;
	overflow: hidden;
	background: #42416d url(../images/news_h3.jpg) no-repeat 0 0;
	text-align: left;
	text-indent: -9999px;
}

#news ul {
	width: 283px;
	height: 371px;
	overflow: auto;
	border: solid 1px #2d2c56;
	list-style: none;
}

* html #news ul {
	width: 285px;
}

#news li {
	clear: both;
	min-height: 20px;
	overflow: hidden;
	margin: 2px 7px;
	padding: 7px 5px 8px 15px;
	border-bottom: solid 1px #cabca4;
	background: url(../images/news_li.gif) no-repeat 0 11px;
}

* html #info li {
	height: 20px;
	overflow: visible;
}

#news li span {
	display: block;
	font-weight: bold;
	color: #967a49;
}

/* ---------------------------------------------------------
	CSS Document Topics
--------------------------------------------------------- */

#topics {
	float: right;
	width: 335px;
	height: 420px;
	overflow: hidden;
}

#topics h3 {
	width: 335px;
	height: 30px;
	overflow: hidden;
	background: #42416d url(../images/topics_h3.jpg) no-repeat 0 0;
	text-align: left;
	text-indent: -9999px;
}

#topics ul {
	width: 335px;
	height: 372px;
	overflow: hidden;
	text-align: left;
	text-indent: -9999px;
	list-style: none;
}

#topics li {
	clear: both;
	width: 335px;
	height: 83px;
	overflow: hidden;
	margin-top: 10px;
}

#topics li a {
	display: block;
	height: 83px;
	overflow: hidden;
	background-repeat: no-repeat;
	background-position: 0 0;
}

#topics li#topics1 a {
	background-image: url(../images/topics1.jpg);
}

#topics li#topics2 a {
	background-image: url(../images/topics2.jpg);
}

#topics li#topics3 a {
	background-image: url(../images/topics3.jpg);
}

#topics li#topics4 a {
	background-image: url(../images/topics4.jpg);
}