@charset "utf-8";
/*<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />*/

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

	[works.css]
	
	@author S.Kaizu

	1. photos (flash)
	2. content
		2-1. container
		2-2. title and data
		2-3. section
		2-4. page

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

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

	1. photos (flash)

------------------------------------------------------------*/
div.photos {
	position: absolute;
	left: 0;
	top: 70px;
	width: 100%;
	height: 300px;
	background: #413732;
}

div.photos noscript {
	display: block;
	width: 900px;
	height: 300px;
	margin: 0 auto;
	text-align: center;
}

div.photos noscript p {
	margin: 0;
}

div.photos noscript p img {
	display: block;
}

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

	2. content

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

/*	2-1. container
------------------------------------------------------------*/
div.content,
div.navigation {
	margin-top: 350px;
}

div.content h1 {
	height: 50px;
}

div.section div.photo {
	float: left;
}

div.section div.text {
	float: right;
	width: 420px;
}

div.content {
	margin-bottom: 60px;
}

div.content img {
	display: block;
}

/*	2-2. title and data
------------------------------------------------------------*/
div.content h1 img,
div.content p#data img {
	display: block;
}

/* title */
div.content h1 {
	width: 690px;
	height: 24px;
	margin: 24px 0 52px;
	padding: 0;
}

/* data */
div.content p#data {
	position: absolute;
	left: 0;
	top: 0;
	width: 690px;
	height: 24px;
	margin: 0;
}

/*	2-3. section
------------------------------------------------------------*/
div.section {
	position: relative;
	width: 510px;
	margin: 50px 0 0;
	padding: 0 0 0 180px;
}
* html div.section {
	width: 690px;
}

/* heading */
div.section h2 {
	position: absolute;
	left: 0;
	top: 0;
	width: 150px;
	height: 100px;
	margin: 0;
	padding: 0;
	font-size: 1em;
}

div.section h3 {
	margin: 0 0 1.8333em;
	font-size: 1em;
}

div.section p {
	text-align: justify;
	text-justify: inter-ideograph; /*IE*/
	word-break: break-all; /*IE*/
}

div#point1 p,
div#point2 p {
	margin-right: 138px;
}

/* appearance-diagram */
p.diagram {
	margin: 1.6666em 0;
}

/* photo */
div#concept p.photo {
	float: left;
	width: 180px;
	margin: 0 18px 9px 0;
}
* html div#concept p.photo {
}

div#point1 p.photo,
div#point2 p.photo {
	float: right;
	width: 120px;
	margin: 0 0 9px 18px;
}

/*	2-4. page
------------------------------------------------------------*/
ul#pager {
	position: absolute;
	bottom: 36px;
	right: 30px;
	width: 150px;
	margin: 0;
	list-style: none;
}

ul#pager li {
	margin: 0;
}

ul#pager li.prev {
	float: left;
}

ul#pager li.next {
	float: right;
}

ul#pager li img {
	display: block;
}