@charset "shift_jis";

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

	structure CSS

 -----------------------------------------
	INDEX
 -----------------------------------------
 	0.reset
	
 	1.structure
		html, body
		wrapper
		header
		side
		contents
			works
		footer
	
	2.margin, padding, text-align
	
========================================== */


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

	0.reset

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


/* http://meyerweb.com/eric/tools/css/reset/ */
/* v1.0 | 20080212 */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
body {
	line-height: 1;
	font:13px/1 "メイリオ","Meiryo","ＭＳ Ｐゴシック","Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3",sans-serif;}
* html body {font-size: small;}
*:first-child+html body {font-size: small;}
h1,h2,h3,h4,h5,h6 {clear: both;}

ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

/* remember to define focus styles! */
:focus {
	outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}

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

	1. structure CSS

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

html, body {
	background: #FFFFFF;
	color: #333;
	width: 1024px;
	padding: 0 16px;
	margin: 1px auto 0 ;
	 _height: 100%;
	 _overflow: auto;  
}
#header {
	width: 100%;
	zoom: 1;
	overflow: hidden;
	margin:0 32px;
	height: 110px
}
#header:after { /* for Modern Browser */
	content: "."; display: block; clear: both; height: 0; visibility: hidden; font-size: 0;
}


/* --------------------------------------
	side
-----------------------------------------*/

#side {
	float: left;
	display: inline;
	width: 23.4375%;
	margin:20px 16px;
	padding: 0;
	position: fixed;
	top: 25px;
	z-index: 20;  
}  
* html div#side {
	position: absolute;
	top: expression(eval(document.documentElement.scrollTop+227px));
}  
#side p.contactInfo {
	padding-bottom: 10px;
	font-size: 77%; font-family: 'Georgia', Times, serif;
	line-height: 1.2;
	color:#000000;
	white-space:pre;
}
#side ul.sideNav{
	margin: 20px 0;
}
#side ul.sideNav li{
	font-size:107.8%; font-family: 'Georgia', Times, serif;
	line-height: 1.429;
	color:#000000;
}
#side ul.sideNav li.In{
	font-size:107.8%; font-family: 'Georgia', Times, serif;
 font-weight:bold;
	line-height: 1.429;
	color:#000;
}
#side ul.sideNav li a,
#side ul.sideNav li.In a {
	width: 100%;
	color: #000;
	text-decoration: none;
}
#side ul.sideNav li  a:hover,
#side ul.sideNav li.In a:hover {
	background: #000;
	color: #ff6666;
}

/* --------------------------------------
	contents
-----------------------------------------*/
#contents {
	float: right;
	display: inline;
	margin: 20px 16px 54px;
	padding: 0;
	width: 70.315%;
}
#contents p {
	font-size: 100%; line-height:1.666;
}
#contents h2 {
	margin-bottom:30px;
}
#contents div.col1 {
	float: left;
	display: inline;
	margin-bottom: 20px;
	padding: 0;
	width: 216px;
}
#contents div.col2 {
	float: left;
	display: inline;
	margin: 0 30px 20px 30px;
	padding: 0;
	width: 216px;
}
#contents div.col3 {
	float: left;
	display: inline;
	margin: 0 30px 20px 0;
	padding: 0;
	width: 462px;
}
/* --------------------------------------
	works
-----------------------------------------*/
ul.pageNext	{
	padding-bottom: 1em;	
}
ul.pageNext li	{
	display: inline;
	margin-right: .1em;
}
ul.pageNext li.last	{
	display: inline;
	margin: 0;
}
ul.pageNext a	{
	display: inline-block;
	background: #FFF;
	padding: .1em .2em;
	color: #000;
	text-decoration: none;
}
ul.pageNext a:hover	{
	background: #000;
	color: #ff6666;
}
/* --------------------------------------
	about
-----------------------------------------*/
p.companyInfo{
	white-space:pre;
}
p.subTitle{
	font-weight: bold;
	margin-bottom:10px;
}
dl.company {
	margin-bottom: 20px;
	padding: 0;
	width: 100%;
	border-bottom: #ccc 1px dotted ;
	zoom: 1;
	overflow: hidden;
}
dl.company:after { /* for Modern Browser */
	content: "."; display: block; clear: both; height: 0; visibility: hidden; font-size: 0;
}
dl.company dt {
	width:80px;
	margin: 0;
	padding: 8px 0;
	font-size: 100%; line-height:1.666; font-weight: bold;
	vertical-align: top;
	border-top: #ccc 1px dotted ;
	float: left;
	display:inline;
	clear: left;
}
dl.company dd {
	margin-left: 90px;
	padding: 8px 0;
	font-size: 100%; line-height:1.666; 
	border-top: #ccc 1px dotted ;
}
dl.company dd a {
	display: block;
	width: 100%;
	color: #000;
	text-decoration: none;
}
dl.company dd a:hover {
	background: #000;
	color: #ff6666;
}
#privacy h3 { margin-bottom: 10px; font-size:123.1%; line-height: 1.374; font-weight: bold;}
#privacy h4 { margin-bottom: 10px; font-weight: bold;}
ol.flow { margin: 10px 0;}
ol.flow li { 
	margin-left: 20px;
	padding-bottom:8px;
	font-size: 100%; line-height:1.666; 
	list-style: outside decimal;
}

/* --------------------------------------
	footer
-----------------------------------------*/
#footer {
	width: 100%;
	background:#FFF url(../images/common/bg_footer.png) repeat-x;
	position: fixed;
	bottom:0;
	left:0;  
}
#footerIn {
	width: 950px;
	margin: 0 auto;
	padding: 10px 0;
}	
#footerIn p.pagetop {
	text-align: right;
}

/* =======================================
	
	2.margin, padding, text-align

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

.mT5  { margin:  5px 0 0 0; }
.mT10 { margin: 10px 0 0 0; }
.mT15 { margin: 15px 0 0 0; }
.mT20 { margin: 20px 0 0 0; }
.mT30 { margin: 30px 0 0 0; }

.mR5  { margin: 0  5px 0 0; }
.mR10 { margin: 0 10px 0 0; }
.mR15 { margin: 0 15px 0 0; }
.mR20 { margin: 0 20px 0 0; }

.mL5  { margin: 0 0 0  5px; }
.mL10 { margin: 0 0 0 10px; }
.mL15 { margin: 0 0 0 15px; }
.mL20 { margin: 0 0 0 20px; }

.mB5  { margin: 0 0  5px 0; }
.mB10 { margin: 0 0 10px 0; }
.mB15 { margin: 0 0 15px 0; }
.mB20 { margin: 0 0 20px 0; }
.mB30 { margin: 0 0 30px 0; }


.p50 { padding:50px; }
.p30 { padding:30px; }
.p20 { padding:20px; }
.p15 { padding:15px; }
.p10 { padding:10px; }
.p5 { padding:5px; }
.pT50 { padding-top:50px; }
.pT30 { padding-top:30px; }
.pT20 { padding-top:20px; }
.pT15 { padding-top:15px; }
.pT10 { padding-top:10px; }
.pT5 { padding-top:5px; }
.pB50 { padding-bottom:50px; }
.pB30 { padding-bottom:30px; }
.pB20 { padding-bottom:20px; }
.pB15 { padding-bottom:15px; }
.pB10 { padding-bottom:10px; }
.pB5 { padding-bottom:5px; }


.al-left { text-align:left; }
.al-right { text-align:right; }
.al-center { text-align:center; }