@charset "UTF-8";
@import "base.css";

/*============CONTENT COLOR SCHEME=================*/
/*                                                 */
/*    a:Link Color    - Gray          #666666      */
/*    a:Visited Color - Light Gray    #999999      */
/*    a:Hover Color   - Dark blue     #82141B      */
/*    a:Active Color  - Dark blue     #82141B      */
/*    Font Color      - Gray          #666666      */
/*                                                 */
/*    bacs.css 44行目に指定                        */
/*============CONTENT COLOR SCHEME-END=============*/

/*============NAVI COLOR SCHEME====================*/
/*                                                 */
/*    a:Link Color    - Gray          #0000FF      */
/*    a:Visited Color - Light Gray    #0000FF      */
/*    a:Hover Color   - Dark blue     #556677      */
/*    a:Active Color  - Dark blue     #556677      */
/*    Font Color      - Gray          #666666      */
/*                                                 */
/*    bacs.css 52行目に指定                        */
/*============NAVI COLOR SCHEME-END================*/

/*============フォントサイズ=======================*/
/*                                                 */
/*    10px      1.0em                              */
/*    11px      1.1em                              */
/*    12px      1.2em                              */
/*    13px      1.3em                              */
/*    14px      1.4em                              */
/*    15px      1.5em                              */
/*    16px      1.6em                              */
/*                                                 */
/*============フォントサイズ-END===================*/

/*----フォントサイズはbase.css内にbody {font-size:62.5%;}が記述されいるので
ピクセル単位の感覚で文字サイズ指定をすることができます。
しかし文字サイズを入れ子で入れてしまうと表示が崩れてしまうので注意してください。
例：div要素にfont-sizeを指定した上にtableやpタグにfont-sizeを指定してし
まった場合表示が崩れます。----*/

/*---------- 01  Base -----------*/

/*-- 冒頭の @import で外部CSSを読み込み --*/

/*---------- 02  Container -----------*/


body {
	background: url(../images/other_header_bg.jpg) center 0 no-repeat;
	text-align:center;
}

#wrapper {
	width: 940px;
	margin: 0 auto;
	text-align: left;
	}

/*--#main {}*/

#content {
	width: 630px;
	float: right;
	margin: 120px 0 0 0;
	display:inline;
	}

#navi{
	width: 280px;
	float: left;
	margin: 120px 0 0 0;
	display:inline;
}


/*---------- 03  Header -----------*/

#header{
	position:relative;
	height:75px;
}

#header h1{
	position:absolute;
	width:310px;
	height:75px;
	top: 0;
	text-indent:-9999px; 
}

#header h1 a{
	background: url(../images/header_logo.jpg) 0 0 no-repeat;
	display:block;
	width:310px;
	height:75px;
	outline:none;
	text-decoration:none;
}

#header h2{
	font-size:0.4em;
	color:#7EBE2C;
}

#header #contact{
	position:absolute;
	width:121px;
	height:30px;
	top: 0px;
	text-indent:-9999px;
	left: 820px;
}

#header #contact a{
	background: url(../images/header_contact.jpg) 0 0 no-repeat;
	display:block;
	width:121px;
	height:30px;
	outline:none;
	text-decoration:none;
}

/*---------- 04  HeaderImg -----------*/

#index #header-img{
	background:url(../images/index_header_img.jpg) 0 0 no-repeat;
	height:431px;
	width:940px;
	text-indent:-9999px;
}

/*---------- 05  Navi -----------*/

#navi li a{
	display:block;
	width:280px;
	text-indent:-9999px;
	text-decoration:none;
	outline:none;
}

#navi01 a{
	background:url(../images/navi01.jpg) 0 0 no-repeat;
	height:130px;
	margin:0 0 5px 0;
}

#navi02 a{
	background:url(../images/navi02.jpg) 0 0 no-repeat;
	height:90px;
	margin:0 0 5px 0;
}

#navi03 a{
	background:url(../images/navi03.jpg) 0 0 no-repeat;
	height:90px;
	margin:0 0 5px 0;
}

#navi04 a{
	background:url(../images/navi04.jpg) 0 0 no-repeat;
	height:45px;
	margin:0 0 2px 0;
}
#navi05 a{
	background:url(../images/navi05.jpg) 0 0 no-repeat;
	height:45px;
	margin:0 0 2px 0;
}
#navi06 a{
	background:url(../images/navi06.jpg) 0 0 no-repeat;
	height:45px;
	margin:0 0 2px 0;
}
#navi07 a{
	background:url(../images/navi07.jpg) 0 0 no-repeat;
	height:45px;
	margin:0 0 2px 0;
}
#navi08 a{
	background:url(../images/navi08.jpg) 0 0 no-repeat;
	height:45px;
	margin:0 0 2px 0;
}
#navi09 a{
	background:url(../images/navi09.jpg) 0 0 no-repeat;
	height:45px;
	margin:0 0 2px 0;
}
#navi10 a{
	background:url(../images/navi10.jpg) 0 0 no-repeat;
	height:130px;
	margin:0 0 5px 0;
}

/*---------- 06  content -----------*/

.section{
	margin:0 0 20px 0;
}

#content p{
	line-height:22px;
	margin:15px 10px 0px 10px;
}

h4{
	height:50px;
	text-indent:60px;
	line-height:65px;
	font-size:18px;
	font-weight:bold;
	color:#FE4D01;
	margin:0 0 15px 0;
}

.h4_01{
	background:url(../images/icon02.jpg) 0 0 no-repeat;
}

.h4_02{
	background:url(../images/icon03.jpg) 0 0 no-repeat;
}

.h4_03{
	background:url(../images/icon04.jpg) 0 0 no-repeat;
}

.h4_04{
	background:url(../images/icon05.jpg) 0 0 no-repeat;
}

.h4_05{
	background:url(../images/icon06.jpg) 0 0 no-repeat;
}

.h4_06{
	background:url(../images/icon07.jpg) 0 0 no-repeat;
}

.h4_07{
	background:url(../images/icon08.jpg) 0 0 no-repeat;
}

table{
	width:610px;
	margin:0 auto;
}
*html table{margin:0 10px;}

#content table{
	font-size:1.0em;
}

#content table,
#content table tr,
#content table td,
#content table th{
	line-height:18px;
	text-align:left;
	vertical-align:top;
}
#content table th{
	background:url(../images/icon01.jpg) 0 10px no-repeat;
	font-weight:bold;
	color:#7DBD2C;
	padding:10px 5px;
	text-indent:15px;
	border-bottom:1px solid #663300;
}
#content table td{
	padding:10px 5px;
	border-bottom:1px solid #663300;
}
#content .pagetop{
	float:right;
}

#contact table th,#contact table td, #cd table th,#cd table td{
	border:none;
}


/*---------- 07  Footer -----------*/

#footer {
	clear:both;
	height:120px;
	text-align:center;
	background:#7EBE2C;
	margin:30px 0 0 0;
	padding:20px 0;
	}

#footer ul { 
	line-height:14px;
	list-style: none;
	margin: 10px 0;
	}

#footer li {
	font-size:1.2em;
	display: inline;
	color:#FFFFFF;
	}

#footer li a{
	margin:0 5px;
	color:#FFFFFF;
}

#footer address,#footer address a {
	height:15px;
	color:#B4DA85;
	margin-top:30px;
}

/*---------- 08  index -----------*/
#index #content {
	margin: 30px 0 0 0;
	}

#index #navi{
	margin: 30px 0 0 0;
}
#index p{
	margin:0px;
}

#index {
	background: url(../images/index_header_bg.jpg) top center no-repeat;
}

#index #section01{
	background:url(../images/index_img01.jpg) right top no-repeat;
	height:205px;
	margin-bottom:10px;
}

#index #title01{
	background:url(../images/index_title01.jpg) 0 0 no-repeat;
	height:55px;
	width:355px;
	text-indent:-9999px;
}

#index #title02{
	background:url(../images/index_title02.jpg) 0 0 no-repeat;
	height:65px;
	width:630px;
	text-indent:-9999px;
	margin:0 0 15px 0;
}

#index #section01 p{
	width:355px;
	margin:10px 0;
}

#index #section02{
	clear:both;
	margin:20px 0 ;
}


/*---------- 08  about -----------*/

#about #title01{
	background:url(../images/about_title01.jpg) 0 0 no-repeat;
	height:70px;
	width:630px;
	text-indent:-9999px;
	margin:0 0 20px 0;
}


/*---------- 08  topics -----------*/

#topics #title01{
	background:url(../images/index_title02.jpg) 0 0 no-repeat;
	height:70px;
	width:630px;
	text-indent:-9999px;
	margin:0 0 20px 0;
}

#topics span{
	color:#7DBD2C;
	font-weight:bold;
}

/*---------- 08  music -----------*/

#music #title01{
	background:url(../images/music_title01.jpg) 0 0 no-repeat;
	height:70px;
	width:630px;
	text-indent:-9999px;
	margin:0 0 20px 0;
}


/*---------- 08  character -----------*/

#character #title01{
	background:url(../images/character_title01.jpg) 0 0 no-repeat;
	height:70px;
	width:630px;
	text-indent:-9999px;
	margin:0 0 20px 0;
}

/*---------- 08  member -----------*/

#member #title01{
	background:url(../images/member_title01.jpg) 0 0 no-repeat;
	height:70px;
	width:630px;
	text-indent:-9999px;
	margin:0 0 20px 0;
}
#member span{
	color:#7DBD2C;
	font-weight:bold;
	font-size:16px;
}

#member .section{
	margin-bottom:40px;
	clear:both;
}
/*---------- 08  cd -----------*/

#cd #title01{
	background:url(../images/cd_title01.jpg) 0 0 no-repeat;
	height:70px;
	width:630px;
	text-indent:-9999px;
	margin:0 0 20px 0;
}

/*---------- 08  story -----------*/

#story #title01{
	background:url(../images/story_title01.jpg) 0 0 no-repeat;
	height:70px;
	width:630px;
	text-indent:-9999px;
	margin:0 0 20px 0;
}

/*---------- 08  menu -----------*/

#menu #title01{
	background:url(../images/menu_title01.jpg) 0 0 no-repeat;
	height:70px;
	width:630px;
	text-indent:-9999px;
	margin:0 0 20px 0;
}


/*---------- 08  contact -----------*/

#contact #title01{
	background:url(../images/contact_title01.jpg) 0 0 no-repeat;
	height:70px;
	width:630px;
	text-indent:-9999px;
	margin:0 0 20px 0;
}