@charset "utf-8";

/*
*
*	1-1.Yahoo UI Library Fonts CSS
*	1-2.Settings
*	1-3.Universal selector
*	1-4.Structure Module
*	1-5.Text Module
*	1-6.Hypertext Module
*	1-7.List Module
*	1-8.Edit Module
*	1-9.Forms Module
*	1-10.Tables Module
*	1-11.Image Module
*	1-12.Object Module
*
*/

/*======================================

 1-1.Yahoo UI Library Fonts CSS
 *Copyright (c) 2006, Yahoo! Inc. All rights reserved.
 *http://developer.yahoo.com/yui/license.txt

=======================================*/
/*
 Font-size Adjustment
  77% = 10px  |  122% = 16px  |  167% = 22px
  85% = 11px  |  129% = 17px  |  174% = 23px
  92% = 12px  |  136% = 18px  |  182% = 24px
 100% = 13px  |  144% = 19px  |  189% = 25px
 107% = 14px  |  152% = 20px  |  197% = 26px
 114% = 15px  |  159% = 21px  |
*/

/*======================================

	1-2. Font size setting

=======================================*/
body {
	font-size: 13px;
	*font-size: small;
	*font: x-small;
}
table {
	font-size: inherit;
	font: 100%;
}

/*======================================

	1-3.Universal selector

=======================================*/
* {
	font-style: normal;
	font-weight: normal;
	font-size: 100%;
	line-height: 1.6;
}

/*======================================

	1-4.Structure Module

=======================================*/
html {
	margin: 0;
	padding: 0;
	background: url(images/back.png) center 41px;
}
body {

	font-family:'メイリオ',Meiryo,'ＭＳ Ｐゴシック','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro',sans-serif;/*'メイリオ',Meiryo,*/
	margin: 0;
	padding: 0;
	background: url(images/body.png) center 41px repeat-x;
	text-align: center;
	color:#645023;
	}

/*======================================

	1-5.Text Module

=======================================*/
p {
	margin: 1em 3em;

}

h1.index_header {
	margin: 0;
	padding: 50px 50px 0 50px;
	width: 800px;
	height: 450px;
	background:url(images/index_header.png) top center no-repeat;
	
}
h1.header {
	margin: 0;
	padding: 50px 50px 0 50px;
	width: 800px;
	height: 200px;
	background:url(images/header.png) top center no-repeat;
	
}
h2 {
	margin: 0 0 1em 0;
	padding: 0;
	clear: both;
}
h3 {
	margin: 0 1em 1em 1em;
	padding: 0.5em 0 4px 1em;
	line-height: 1;
	background: url(images/width_line.gif) left bottom repeat-x;
	color:#666633;
	font-size: 122%;
	clear: both;
}
h4 {
	margin: 0.5em 20px;
	padding: 0;
	line-height: 1;
	color:#666633;
	font-weight: bold;
	clear: both;
}
br {
	letter-spacing: 0;
}
hr {
	margin: 1em 0;
	height: 1px;  
	border: 0px;  /* borderを一旦リセットする（基本設定でしていれば不要）*/
	background: url(images/info_line.gif);
}
em {
	color: #C00;
}
big {
	font-size:114%;
}
small {
	font-size: 85%;
	line-height: 1.2;
}
strong {
	font-weight: bold;
}

/*======================================

	1-6.Hypertext Module

=======================================*/
a {
	text-decoration: underline;
	font-weight: normal;
}
a:link {
	color: #CC6600;
}
a:visited {
	color: #666600;
}
a:hover {
	color: #009966;
}

/*======================================

 	1-7.List Module

=======================================*/
dl {
}
dt {
}
dd {

}
dd img{

}

ul {
	list-style: square;
}
ul li img {

}

/*======================================

	1-10. Tables Module

=======================================*/
table {
	margin: 0 auto;
	padding: 0;
	width:auto;
	border-collapse: separate;
	border-spacing: 8px;
}

table th {
	text-align: center;
	font-weight: bold;
	background: url(images/height_line.gif) top right repeat-y;
}
table th, td {
	padding: 0.3em 0.5em;
	line-height: 1;

}

/*======================================

	1-11.Image Module

=======================================*/
img {
	vertical-align: bottom;
}
a img {
	border: none;
}

a[rel="external"]{	
	background:transparent url(images/external.gif) center right no-repeat;
	padding-right:16px;

}
p#wp a[rel="external"]{	
	background:none;
	padding-right:0;

}
/*
*
*	1-1. Body
*	1-2. Header
*	1-3. Container
*	1-4. Main Area
*	1-5. Sidebar
*	1-6. Footer
*	1-7. Other
*
*/

/*======================================

	1-2. Header

=======================================*/
div#header {
	margin: 0 auto;
	padding: 5px 0;
	width: 100%;
	height: 30px;
	background: url(images/back.gif);
	text-align: left;
	border-bottom: 1px solid #aaa ;
}
div#header > ul.header {
	width: 780px;
	margin: auto;
	padding: 0;
	list-style: none;
}
div#header > ul.header li a{
	color: #eee;
	vertical-align: bottom;
	font-family: century;
	font-size: 85%;
	text-decoration: none;
}


/*======================================

	1-3. Container

=======================================*/
div.container {
	margin: 0 auto;
	padding: 0;
	width: 900px;
	background: url(images/container.png) center top repeat-y;
}
div.entry {
	margin: 0;
	padding: 25px 90px 10px 90px;
	width: 720px;
	background: url(images/entry.png) center top no-repeat;
	text-align: left;
	clear: both;
}

ul#navi {
	margin: 0;
	padding: 0 140px;
	width: 620px;
	height: 50px;
	background: url(images/navi.png) center -50px;}
ul#navi li{
	margin: 0;
	padding: 0;
	list-style: none;

}
ul#navi li a{
	float: left;
	display:block;
	height: 0;
	padding: 50px 0 0 0;
	overflow: hidden;
}

ul#navi li.navi_top a {width: 60px;background: url(images/navi.png) -140px top no-repeat;}
ul#navi li.navi_story a {width: 75px;background: url(images/navi.png) -200px top no-repeat;}
ul#navi li.navi_chara a { width: 125px;background: url(images/navi.png) -275px top no-repeat;}
ul#navi li.navi_sample a { width: 130px;background: url(images/navi.png) -400px top no-repeat;}
ul#navi li.navi_staff a { width: 140px;background: url(images/navi.png) -530px top no-repeat;}
ul#navi li.navi_special a { width: 90px;background: url(images/navi.png) -670px top no-repeat;}

/*======================================

	1-4. Main Area

=======================================*/
/*--------------------------------------
		DIV Box
---------------------------------------*/

div.halfBox_l {
	width: 350px;
	margin: 0 0 10px 0;
	padding: 0 10px 0 0;
	float: left;
}
div.halfBox_r {
	width: 350px;
	margin: 0 0 0 10 px;
	padding: 0 0 0 10px;
	float: right;
}

div.halfBox_l p,
div.halfBox_r p {
	margin: 1.2em 18px;
	line-height: 1.6em;
}
div.halfBox_l dl,
div.halfBox_r dl {
	margin: 1.2em 20px;
}

/*--------------------------------------
		history
---------------------------------------*/
div.info {
	margin: 0 1em 1em 1em;
	padding: 5px 0;
	width: auto;
	height: 110px;
	background: url(images/info_back.png) left top repeat-x;

}
dl.info {
	margin:  0 0 0 0.5em;
	padding: 0;
	width: auto;
	height: 100px;
	overflow: auto;
	font-size: 92%;
}
dl.info dt{
	margin:0;
	padding: 0.4em 0 0 0.5em;
	width: auto;
	text-align: left;
	font-weight: bold;
}
dl.info dd{
	margin: -1.6em 0 0 0;
	padding: 0 0.4em 0.4em 10em;
	background: url(images/info_line.gif) center bottom repeat-x;
}
/*dl.info dt{
	margin:0;
	padding: 0.4em;
	width: 9em;
	text-align: center;
}
dl.info dd{
	margin: -2.4em 0 0 0;
	padding: 0.4em 0.4em 0.4em 9em;
	background: url(images/info_line.gif) center bottom no-repeat;
}*/
dl.info dd.foot{
	background: none;
}


div.index_left {
	margin: 0 0 1em 0;
	padding: 0 0 0 10px;
	float: left;	
	width: 400px;
}

div.index_left h3 {
	margin: 0 0 1em 0;
}
div.index_left p.op {
	margin: -0.5em 0 0 0; 
	padding: 0.3em; 
	background: #DDB88F;
	color: #fff;
	font-weight:bold;
	font-size:114%;
	text-align: center;
}
div.ss_banner {
	margin: 0 0 1em 0;
	padding: 0 0 10px 0;
	width: 300px;
	height: auto;
	float: right;
}
div.ss_banner p{
}
div.ss_banner h3 {
	margin: 0 0 1em 0;
}
/*--------------------------------------
		Story
---------------------------------------*/
div.story {
	margin: 1em auto;
	padding: 50px 0;
	width: 700px;
	height: 400px;
	background: url(images/story.jpg) center center no-repeat;
}
div.story p {
	margin: 0.8em 5em;
	text-indent: 1em;

}
/*--------------------------------------
		Character
---------------------------------------*/
div.chara_nicole {
	width: 300px;
	margin: 10px 20px 10px 40px;
	padding: 0;
	float: left;
}

div.chara_nicole p{
	margin: 0;
	padding: 0;
	width: 300px;
	height: 250px;
	background: url(images/chara_nicole_02.jpg);
	overflow: hidden;
	text-indent: -9999px;
}
div.chara_alma {
	width: 300px;
	margin: 10px 40px 10px 20px;
	padding: 0;
	float: left;
}

div.chara_alma p{
	margin: 0;
	padding: 0;
	width: 300px;
	height: 250px;
	background: url(images/chara_alma_02.jpg);
	overflow: hidden;
	text-indent: -9999px;
}
div.chara_liry {
	width: 200px;
	margin: 10px 10px 10px 40px;
	padding: 0;
	float: left;
}

div.chara_liry p{
	margin: 0;
	padding: 0;
	width: 200px;
	height: 200px;
	background: url(images/chara_liry_02.jpg);
	overflow: hidden;
	text-indent: -9999px;
}
div.chara_bevel {
	width: 200px;
	margin: 10px;
	padding: 0;
	float: left;
}

div.chara_bevel p{
	margin: 0;
	padding: 0;
	width: 200px;
	height: 200px;
	background: url(images/chara_bevel_02.jpg);
	overflow: hidden;
	text-indent: -9999px;
}
div.chara_george {
	width: 200px;
	margin: 10px 40px 10px 10px;
	padding: 0;
	float: left;
}

div.chara_george p{
	margin: 0;
	padding: 0;
	width: 200px;
	height: 200px;
	background: url(images/chara_george_02.jpg);
	overflow: hidden;
	text-indent: -9999px;
}
/*--------------------------------------
		Sample CG
---------------------------------------*/
div.sample {
	margin: 1em auto;
	width: 640px;
	padding: 0;
}
div.sample img {
	margin: 8px;
	padding: 0;
	border: 1px solid #333;
}
/*--------------------------------------
		Trial
---------------------------------------*/
p.trial {
	margin: 1em auto;
	padding: 131px 0 0 0;
	width: 600px;
	height: 69px;
	background: url(images/orgel_trial.jpg);
}
p.trial a:link,
p.trial a:visited {
	margin: 0 0 0 29px;
	padding: 52px 0 0 0;
	width: 364px;
	height: 0;
	background: url(images/orgel_trial.jpg) -29px -131px;
	display: block;
	overflow: hidden;
}
p.trial a:hover {
	margin: 0 0 0 29px;
	padding: 52px 0 0 0;
	width: 364px;
	height: 0;
	background: url(images/orgel_trial_hover.jpg) -29px -131px;
	display: block;
	overflow: hidden;
}
/*--------------------------------------
		Return ( Page Top )
---------------------------------------*/
p.return {
	text-align: right;
	clear: both;
	margin: 0 0 0.5em auto;
	padding: 0 0.5em;
	width: auto;
	background: url(images/info_line.gif) left bottom repeat-x;
}
p.return a{
	text-decoration: none;
}
/*======================================

	1-6. Footer

=======================================*/
.footer {
	margin: 0 auto;
	padding: 0 50px;
	width: 800px;
	height: 110px;
	clear: both;
	background: url(images/footer.gif) center top;
}
/*======================================

	1-7. Other

=======================================*/
.center {
	text-align: center;
}
.right {
	text-align: right;
}
.clear {
	clear: both;
	vertical-align: middle;
}
.strike {
	text-decoration: line-through ;
} 
p.download a:link,
p.download a:visited{
	width: 17em;
	margin: 0 auto;
	padding: 0.5em 0 0.5em 30px;
	display: block;
	text-indent: 0;
	color: #fff;
	font-weight: bold;
	text-decoration: none;
	background: url(images/download.gif) 10px center no-repeat #ca7;
}
p.download a:hover{
	width: 17em;
	margin: 0 auto;
	padding: 0.5em 0 0.5em 30px;
	display: block;
	text-indent: 0;
	color: #fff;
	font-weight: bold;
	text-decoration: none;
	background: url(images/download_hover.gif) 10px center no-repeat #f60;
}
p.pacth {
	margin: 0;
}
p.pacth a:link,
p.pacth a:visited{
	width: 300px;
	height: 0;
	margin: 0 auto;
	padding: 50px 0 0 0;
	display: block;
	overflow: hidden;
	text-decoration: none;
	background: url(images/patch.png) center top no-repeat;
}
p.pacth a:hover{
	width: 300px;
	height: 0;
	margin: 0 auto;
	padding: 50px 0 0 0;
	display: block;
	overflow: hidden;
	text-decoration: none;
	background: url(images/patch.png) center -50px no-repeat;
}