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


@import url(basic.css);
@import url(../common/common.css);


/* clearFix hack */
section:after {
	content		: "."; 
	display		: block; 
	height		: 0; 
	clear		: both; 
	visibility	: hidden;
}


body {
	display		: block;
	position	: relative;
	margin		: 0;
	padding		: 0;
	background	: #000000;
	color		: #ffffff;
	font-size	: 14pt;
	line-height	: 1.4;
}


/* -------------------------------------------------------------------
	Common Block
---------------------------------------------------------------------- */



#spring,
#howto,
#catalog
{
	display		: block;
	position	: relative;
	width		: 640px;
	height		: 960px;
	margin		: 0 auto;
	padding		: 0;
	background	: #000000;
	zoom		: 1;
	border-top:1px solid #000000;
}


section article {
	display		: block;
	position	: relative;
	margin		: 270px 0 0 0;
}

section article h2 {
	padding		: 10px 0;
	text-align	: center;
}

section article h3 {
	padding		: 0;
	text-align	: center;
}


/* -------------------------------------------------------
	HOME
---------------------------------------------------------- */


#HOME {
	display		: block;
	position	: relative;
	width		: 640px;
	height		: 800px;
	margin		: 0 auto;
	overflow	: hidden;
}

#HOME .scene {
	width				: 640px;
	height				: 960px;
	position			: absolute;
	top					: 50%;
	left				: 50%;
	margin				: -480px 0 0 -320px;
	background-position	: center center;
	background-repeat	: no-repeat;
	background-color	: #000000;
	text-indent			: -9999px;
	overflow			: hidden;
}

#HOME #scene00 { z-index:8; text-indent:0; }
#HOME #scene01 { z-index:1; background-image:url(img/splash01.png); }
#HOME #scene02 { z-index:2; background-image:url(img/splash02.jpg); }
#HOME #scene03 { z-index:3; background-image:url(img/splash03.jpg); }
#HOME #scene04 { z-index:4; background-image:url(img/splash04.jpg); }
#HOME #scene05 { z-index:5; background-image:url(img/splash05.jpg); }
#HOME #scene06 { z-index:6; background-image:url(img/splash06.jpg); }
#HOME #scene07 { z-index:7; background-image:url(img/splash07.png); }
#HOME #scene08 { z-index:9; background-image:url(img/splash08.png); }

#HOME #scene00 p {
	margin		: 400px 0 0 0;
	text-align	: center;
}


/* ---------------------------------------------------------
	春
------------------------------------------------------------ */

#spring {
	background	: url(img/spring_bg.jpg) center center no-repeat;
}

#spring article h2 {
	padding-top	: 0;
}

#spring .slides {
	display		: block;
	position	: relative;
	width		: 640px;
	height		: 300px;
	overflow	: hidden;
}

#spring .slides ul {
	width		: 6400px;
}

#spring .slides ul li {
	_display	: inline;
	float		: left;
	vertical-align	: top;
}


/* -----------------------------------------------
	使い方
-------------------------------------------------- */


#howto {
	background	: url(img/howto_bg.jpg) center center no-repeat;
}

#howto article {
	margin-top	: 200px;
}

#howto p {
	margin		: 1em 0;
	text-align	: center;
}

#howto .slides {
	display		: block;
	position	: relative;
	float		: left;
	width		: 300px;
	height		: 390px;
	margin		: 10px 0 0 10px;
	overflow	: hidden;
}

#howto .slides ul {
	width		: 1550px;
}

#howto .slides ul li {
	float		: left;
	width		: 310px;
	text-align	: left;
}

#howto #howto04 {
	display		: block;
	position	: relative;
	float		: right;
	margin		: 10px 10px 0 0;
}

#howto a.btn {
	display		: block;
	position	: absolute;
	top			:  38px;
	left		:   0;
	width		: 300px;
	height		:  50px;
	text-align	: center;
	background	: url(img/howto_btn.png) 0 0 no-repeat;
	line-height	: 50px;

	color		: #231815;
	text-decoration	: none;
	font-weight	: bold;
}

#howto a.btn:hover {
	background-position	: 0 -50px;
}

#howto .attxt{ font-size: 0.8em; text-align: center;}
#howto .attxt a{ color: #fff;}
/* -------------------------------------------------------------------
	カタログ
---------------------------------------------------------------------- */


#catalog {
	background	: url(img/catalog_bg.jpg) center center no-repeat;
	color		: #231815;
}

#catalog article {
	margin-top	: 180px;
}

#catalog p {
	margin		: 1em 10px;
	text-align	: center;
}

#catalog a {
	display		: block;
	width		: 400px;
	height		:  50px;
	position	: relative;
	margin		: 10px auto;
	background	: url(img/catalog_btn.png) 0 0 no-repeat;
	color		: #231815;
	text-align	: center;
	line-height	: 50px;
	font-weight	: bold;
	text-decoration	: none;
}

#catalog a:hover {
	background-position	: 0 -50px;
}

#catalog .slides {
	display		: block;
	position	: relative;
	width		: 640px;
	height		: 400px;
	margin		: 30px 0 0 0;
	overflow	: hidden;
	background	: url(img/catalog_arrow.png) center center no-repeat;
}

#catalog .slides ul {
	width		: 6400px;
}

#catalog .slides ul li {
	float		: left;
	width		: 640px;
	text-align	: center;
}