@charset "utf-8";

/*________________________________________________

	name:			top.css
	author:			kumi morita
	mail:			morimori@elf.coara.or.jp
	create Date:	2009-09-25
	lastmodified:	****-**-**
________________________________________________*/


@import url(reset.css);
@import url(search.css);
@import url(style.css);
@import url(sidebar.css);

/*--------------------------------------------------------------

--------------------------------------------------------------*/
#flash {
	position: relative;
	clear: both;
	width: 930px;
	height: 300px;
	margin: 0 auto;
	padding: 0;
	background: url(../flash/flash.jpg) top center no-repeat;
	text-align: left;
	z-index: 0;
}
/* xfade2フェードイン切り替えのスライドショー */
#topflash {
	position: relative;
	display: block;
	margin: 0 auto;
	width: 930px; /*画像の横幅*/
	height: 300px; /*画像の縦幅*/
	background: url(../img/common/loading.gif) center middle no-repeat;
	overflow: hidden;
	z-index: 5;
}
#topflash img {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 6;
}

/*--------------------------------------------------------------
#slideshow　slideshow
--------------------------------------------------------------*/
#slideshow {
    position: relative;
    height: 300px;
    z-index: 1;
}

#slideshow img {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    opacity: 0.0;
}

#slideshow img.active {
    z-index: 3;
    opacity:1.0;
}

#slideshow img.last-active {
    z-index: 4;
}

/*--------------------------------------------------------------
top_banner
--------------------------------------------------------------*/
ul.top_banner {
	display: block;
	width: auto;
	height: auto;
	margin: 0 0 10px 0;
	padding: 0;
}
ul.top_banner li {
	display: block;
	float: left;
	width: 300px;
	padding: 0;
}

ul.top_banner li.first {
	width: 300px;
	height: 150px;
	margin: 0 20px 0 0;
	padding: 0;
}


/* comment　トップページのフラッシュ下コメント部分 */
.comment {
	display: block;
	clear: both;
	width: 880px; /* 900px */
	height: auto;
	margin: 5px auto;
	padding: 10px;
	background: #d3e1e7;
}
.comment p {
	margin: 0;
	padding: 5px 10px;
	background: #ffffff;
	line-height: 130%;
}


/*--------------------------------------------------------------
#sidebar
--------------------------------------------------------------*/
#sidebar {
	position: absolute;
	display: block;
	clear: both;
	width: auto;
	height: auto;
	left: 0;
	top: 30px;
	margin: 0 0 0 0;
	padding: 0;
	text-align: left;
	z-index: 10;
}
#sidebar_inner {
	float: left;
	width: 322px; /* 342px */
	height: 109px; /* 129px */
	margin: 0;
	padding: 10px;
	background: #ffffff;
	text-align: left;
	filter: alpha(opacity=70);
	opacity: 0.7;
}
#sidebar h2 {
	color: #fc961a;
	font-size: 110%;
	font-weight: bold !important;
}
#sidebar p {
	margin-bottom: 10px;
	filter: alpha(opacity=100);
	opacity: 1.0;
}
#button {
	float: left;
	width: 25px;
	height: 70px;
}

/*--------------------------------------------------------------
sidebar prototype.jsで作る横スライドのサイドバー
ボツにしたけど一応バックアップ 2009-09-26
--------------------------------------------------------------*/
#sideBar {
	text-align: left;
	z-index: 10;
}
#sideBar h2 {
	color: #fc961a;
	font-size: 110%;
	margin: 10px;
	font-weight: bold !important;
}
#sideBar h2 span {
	font-size: 125%;
	font-weight: normal !important;
}
#sideBar p {
	color: #333333;
	margin: 10px;
}
#sideBar ul {
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
}
#sideBar li {
	margin: 0px 10px 3px 10px;
	padding: 2px;
	display:block;
	background: #DA1074;
	width:177px;
	color:#FFFFFF;
}
#sideBar li a {
	width: 100%;
}
#sideBar li a:link,
#sideBar li a:visited{
	display: block;
	width: 100%;
	margin: 0;
	padding: 0;
	color: #fc961a;
	text-decoration :none;
}
#sideBar li a:hover{
	color: #fc961a;
	text-decoration: underline;
}
/* サイドバーの固定位置の指定 */
#sideBar {
	position: absolute;
	width: auto;
	height: auto;
	top: 30px;
	left: 0px;
	z-index: 10000;
}
/* スライドタブボタン */
#sideBarTab {
	float: left;  /* ボタンを右におく場合はright、左に置く場合はleft */
	width: 25px;
	height: 90px;
}
/* ここがサイドバーのサイズを指定している部分 */
#sideBarContents {
	float: left;
	width: 342px;
	height: 129px;
	background: #ffffff;
	overflow: hidden !important;
}
#sideBarContentsInner {
	width: 342px;
}

/*--------------------------------------------------------------
.access　　トップ左メニュー
--------------------------------------------------------------*/
ul.access {
	display: block;
	clear: both;
	width: 260px;
	height: auto;
	margin: 3px 0 20px 0;
	padding: 0;
}
ul.access li {
	display: inline;
	float: left;
	width: auto;
	height: auto;
	margin: 0 4px 0 0;
	padding: 0;
}
ul.access li.lastChild {
	margin: 0 0 2px 0!important;
}

/*--------------------------------------------------------------
.guide　　トップ左メニュー
--------------------------------------------------------------*/
.guide {
	display: block;
	clear: both;
	width: 260px;
	height: auto;
	margin: 0;
	padding: 0;
}
.guide ul, ul.guide2 {
	display: block;
	clear: both;
	width: 260px;
	height: auto;
	margin: 0;
	padding: 0;
}
.guide li {
	display: block;
	width: auto;
	height: auto;
	margin: 0 0 3px 0;
	padding: 0;
}
.btn_kannaimap {
	display: block;
	clear: both;
	width: auto;
	height: auto;
	margin: 0;
	padding: 0;
	text-align: right;
}

/* blog　マーシャルくんブログ */
.ba_blog {
	display: block;
	clear: both;
	width: auto;
	height: auto;
	margin: 20px 0 0 0;
	padding: 0;
}

/*--------------------------------------------------------------
#top_center　　トップセンターコンテンツ
--------------------------------------------------------------*/
#top_center {
	display: block;
	float: left;
	width:　400px;
	height: auto;
	margin: 0;
	padding: 0;
	text-align: right;
}
#top_center h2 {
	display: block;
	clear: both;
	width: 400px;
	height: auto;
	margin: 0;
	padding: 0;
	text-align: left;
}

/*--------------------------------------------------------------
#top_news　　トップ新着情報
--------------------------------------------------------------*/
#top_news {
	display: block;
	clear: both;
	width:　400px;
	height: auto;
	margin: 0 0 15px 0;
	padding: 0;
	text-align: right;
}
#top_news ul {
	display: block;
	width: 400px;
	height: auto;
	margin: 0;
	padding: 0;
	text-align: left;
}
#top_news li {
	display: block;
	clear: both;
	width: 345px; /* 40px */
	height: auto;
	margin: 0;
	padding: 10px 0 10px 55px;
	background: url(../img/top/li_new.gif) left center no-repeat;
	border-bottom: 1px #333333 dashed;
	color: #333333;
}
#top_news li.new {
	display: block;
	clear: both;
	width: 345px; /* 40px */
	height: auto;
	margin: 0;
	padding: 10px 0 10px 55px;
	background: url(../img/top/new.gif) center left no-repeat!important;
	border-bottom: 1px #333333 dashed;
	color: #333333;
	line-height: 15px;
}
#top_news li span {
	width: 80px;
	float: left;
	margin-right: 15px;
}
#top_news li a {
	display: block;
	width: 230px;
	float: left;
	margin: 0;
}
#top_news li a {
	color: #333333;
	text-decoration: none;
}
#top_news li a:hover {
	color: #5353aa;
	text-decoration: underline;
}
#top_news p {
	display: block;
	clear: both;
	width: auto;
	height: auto;
	margin: 10px 0 0 0;
	font-size: 90%;
	text-align: right;
}
#top_news p a {
	background: url(../img/common/ya.gif) left center no-repeat;
	padding-left: 15px;
	color: #5353aa;
	text-decoration: underline;
}
#top_news p a:hover {
	color: #7f7fc5;
	text-decoration: underline;
}

/*--------------------------------------------------------------
#top_pickup　　トップピックアップ
--------------------------------------------------------------*/
#top_pickup {
	display: block;
	clear: both;
	width:　400px;
	height: auto;
	margin: 0 0 15px 0;
	padding: 0;
	text-align: right;
}
#top_pickup ul {
	display: block;
	width: 400px;
	height: auto;
	margin: 5px 0 0 0;
	padding: 0;
	text-align: left;
}
#top_pickup li {
	display: block;
	float: left;
	width: 175px; /* 195px */
	height: auto;
	margin: 0;
	padding: 5px;
	border: 5px #e8e8e8 solid;
	color: #333333;
	text-align: left;
}
#top_pickup li.lastChild {
	float: right!important;
	margin: 0 0 0 10px!important;
}
#top_pickup li img {
	display: block;
	clear: both;
	width: 175px;
	margin: 0 auto 5px auto;
	padding: 0;
/*	width: 125px;
	height: 125px;
	margin: 0 auto 5px;
	padding: 5px;
	background: url(../img/top/pickup_bg.gif) left top repeat; */
}
#top_pickup li h3 {
	display: block;
	clear: both;
	width: auto;
	margin: 0 0 5px;
	padding: 0 0 0 10px;
	border-left: 3px #0066cc solid;
	color: #0066cc;
	font-weight: bold;
	text-decoration: none;
}
#top_pickup li a {
	color: #0066cc;
	font-weight: bold;
	text-decoration: none;
}
#top_pickup li a:hover {
	color: #0066cc;
	font-weight: bold;
	text-decoration: none;
}
#top_pickup p {
	display: block;
	clear: both;
	width: 175px;
	height: auto;
	margin: 0 0 5px 0;
	padding: 0;
	color: #333333;
	text-align: left;
}
#top_pickup p.more {
	display: block;
	clear: both;
	width: auto;
	height: auto;
	margin: 5px 0 0 0!important;
	font-size: 90%;
	font-weight: normal;
	text-align: right;
}
#top_pickup p.more a {
	background: url(../img/common/ya.gif) left center no-repeat;
	padding-left: 15px;
	color: #5353aa;
	font-size: 90%;
	font-weight: normal;
	text-decoration: underline;
}
#top_pickup p.more a:hover {
	color: #7f7fc5;
	font-size: 90%;
	font-weight: normal;
	text-decoration: underline;
}

/*--------------------------------------------------------------
#top_center_ba　　トップセンターバナー
--------------------------------------------------------------*/
#top_center_ba {
	display: block;
	clear: both;
	width:　400px;
	height: auto;
	margin: 15px 0 0 0;
	padding: 0;
	text-align: left;
}
#top_center_ba ul {
	display: block;
	width: 400px;
	height: auto;
	margin: 0;
	padding: 0;
	text-align: left;
}
#top_center_ba li {
	display: block;
	float: left;
	width: 195px;
	height: auto;
	margin: 0;
	padding: 0;
}
#top_center_ba li.lastChild {
	float: right!important;
	margin: 0 0 0 10px!important;
}

/*--------------------------------------------------------------
#top_right　　トップライトコンテンツ
--------------------------------------------------------------*/
#top_right {
	display: block;
	float: right;
	width:　230px;
	height: auto;
	margin: 0;
	padding: 0;
	text-align: left;
}
#top_right div {
	display: block;
	clear: both;
	width: 230px;
	height: auto;
	margin: 0 0 15px 0;
	padding: 0;
	text-align: left;
}
#top_right p.more {
	display: block;
	clear: both;
	width: auto;
	height: auto;
	margin: 5px 0 0 0!important;
	font-size: 90%;
	text-align: right;
}
#top_right p.more a, #top_right p.more a:hover {
	background: url(../img/common/ya.gif) left center no-repeat;
	padding-left: 15px;
	color: #5353aa;
	text-decoration: underline;
}

/*--------------------------------------------------------------
.flashdownload　フラッシュダウンロード
--------------------------------------------------------------*/
.flashdownload {
	display: block;
	clear: both;
	width: auto;
	height: auto;
	margin: 20px 0;
	padding: 10px;
	border: 1px #cccccc solid;
}


/*--------------------------------------------------------------
clearfix
--------------------------------------------------------------*/
#flash, #top_news li {
	display: inline-block;
	display: block;
	zoom: 100%;
}
#flash:after, #top_news li:after {
	display: block;
	clear: both;
	height: 0;
	font-size: 0.1em;
	visibility: hidden;
	line-height: 0;
	content: ".";
}
/* Hides from IE-mac \*/
* html #flash, * html #top_news li {
	height: 1%;
}
#flash, #top_news li {
	display: block;
}
/* End hide from IE-mac */