@charset "UTF-8";
/* CSS Document */

body{
	background-color: #fff;
	background-image: url(../images/bg.gif);
	background-repeat: repeat;
	background-position: center top;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

header > div,
article,
footer > div{
	width: 970px;
	margin: 0 auto;
	/zoom: 1;
}

header{
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	z-index: 99;
}

header > div{
	overflow: hidden;
}

header > div h1{
	float: left;
	display: inline;
}

header > div nav{
	width: 253px;
	height: 54px;
	float: left;
	display: inline;
	background: url(../images/navBg.jpg) no-repeat right top;
}

header > div nav ul{
	overflow: hidden;
}

header > div nav ul li{
	float: left;
	display: inline;
	margin-left: 1px;
}

header > div nav ul li:first-child{
	margin-left: 0;
}

article{
	overflow: hidden;
	position: relative;
}

article > h1{
	float: right;
	display: inline;
}

article > section{
	clear: both;
}

article p#ssBtn{
	position: absolute;
	left: 26px;
	top: 547px;
}

/* story */

article section#story{
	background: url(../images/sectionStoryBg.jpg) no-repeat right top;
	/zoom: 1;
}

/* character01 */


article section#character01,
article section#character01 section,
article section#character02,
article section#character02 section{
	position: relative;
}

article section#character01 h2{
	position: absolute;
	right: 0;
	top: 0;
}

article section#character01 section#kariya{
	background: url(../images/sectionCharacter01KariyaBg.jpg) no-repeat right top;
	height: 567px;
}

article section#character01 section#kariya h3,
article section#character01 section#kariya p.charaDesc,
article section#character01 section#kariya p.charaVoice{
	position: absolute;
}

article section#character01 section#kariya h3{
	left: 0;
	top: 331px;
}

article section#character01 section#kariya p.charaDesc{
	left: 0;
	top: 447px;
}

article section#character01 section#kariya p.charaVoice{
	left: 0;
	top: 0;
}

article section#character01 section#kikka{
	background: url(../images/sectionCharacter01KikkaBg.jpg) no-repeat left top;
	height: 427px;
}

article section#character01 section#kikka h3,
article section#character01 section#kikka p.charaDesc,
article section#character01 section#kikka p.charaVoice{
	position: absolute;
}

article section#character01 section#kikka h3{
	right: 0;
	top: 266px;
}

article section#character01 section#kikka p.charaDesc{
	right: 0;
	top: 376px;
}

article section#character01 section#kikka p.charaVoice{
	right: 0;
	top: 0;
}

/* character02 */

article section#character02 h2{
	position: absolute;
	left: 0;
	top: 0;
}

article section#character02 section{
	float: left;
	display: inline;
}


article section#character02 section#mariya{
	background: url(../images/sectionCharacter02MariyaBg.jpg) no-repeat right top;
	width: 301px;
	height: 522px;
	margin-top: 151px;
}

article section#character02 section#mariya h3,
article section#character02 section#mariya p.charaDesc,
article section#character02 section#mariya p.charaVoice{
	position: absolute;
}

article section#character02 section#mariya h3{
	left: 0;
	top: 338px;
}

article section#character02 section#mariya p.charaDesc{
	left: 0;
	top: 406px;
}

article section#character02 section#mariya p.charaVoice{
	left: 0;
	top: 0;
}

article section#character02 section#mirai{
	background: url(../images/sectionCharacter02MiraiBg.jpg) no-repeat right top;
	width: 325px;
	height: 673px;
}

article section#character02 section#mirai h3,
article section#character02 section#mirai p.charaDesc,
article section#character02 section#mirai p.charaVoice{
	position: absolute;
}

article section#character02 section#mirai h3{
	left: 0;
	top: 465px;
}

article section#character02 section#mirai p.charaDesc{
	left: 0;
	top: 532px;
}

article section#character02 section#mirai p.charaVoice{
	left: 0;
	top: 0;
}

article section#character02 section#wakaba{
	background: url(../images/sectionCharacter02WakabaBg.jpg) no-repeat left top;
	width: 344px;
	height: 673px;
}

article section#character02 section#wakaba h3,
article section#character02 section#wakaba p.charaDesc,
article section#character02 section#wakaba p.charaVoice{
	position: absolute;
}

article section#character02 section#wakaba h3{
	left: 0;
	top: 465px;
}

article section#character02 section#wakaba p.charaDesc{
	left: 0;
	top: 532px;
}

article section#character02 section#wakaba p.charaVoice{
	right: 0;
	top: 0;
}






footer{
	position: fixed;
	bottom: 0;
	width: 100%;
	font-size: 12px;
	color: #fff;
}

footer > div{
	height: 35px;
	background-color: #000;
	oveflow: hidden;
}

footer > div small{
	float: left;
	display: inline;
	margin-left: 7px;
	margin-top: 12px;
	color: #fff;
	font-size: 12px;
	font-family:"ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
}

footer > div div#sns{
	float: right;
	display: inline;
	margin-top: 8px;
}