@charset "utf-8";

/* --------------------------------------------------
 0:Reset
-------------------------------------------------- */

html,body,div,
header,footer,article,section,aside,
h1,h2,h3,h4,h5,h6,
dl,dt,dd,ul,ol,li,
img,
p,blockquote,pre,cite,code,caption,
object,iframe,
a,strong,address,span,
sub,sup,
form,fieldset,legend,input,textarea,select,option,label,caption,
table,tbody,tfoot,thead,tr,th,td {
	margin: 0;
	padding: 0;
}

h1,h2,h3,h4,h5,h6 {
	font-size: 100%;
	font-weight: normal;
}

img,table {
	border: none;
}

ol,ul {
	list-style: none;
}

img {
	vertical-align: top;
}

address,em,cite {
	font-style: normal;
}

fieldset {
	border:medium none;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

header,footer,hgroup,article,section,aside {
	display: block;
}

/* --------------------------------------------------
1:Base Setting
-------------------------------------------------- */

body {
	margin: 0;
	padding: 0;
	background: #000000 url(../images/background.png) left top repeat;
	color: #CCC;
	font: 11px/1.75 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'ＭＳ Ｐゴシック', "MS PGothic", arial, helvetica, sans-serif, verdana;
	*font-size: small;
	*font: x-small;
}

a:link,
a:visited {
	color: #CCC;
	text-decoration: underline;
}

a:hover,
a:active {
	color: #FFF;
	text-decoration:underline
}

a img {
	transition: all 0.15s ease-out;
	-o-transition: all 0.15s ease-out;
	-ms-transition: all 0.15s ease-out;
	-moz-transition: all 0.15s ease-out;
	-webkit-transition: all 0.15s ease-out;
}

a:hover img {
	opacity: 0.7;
	-o-opacity: 0.7;
	-ms-opacity: 0.7;
	-moz-opacity: 0.7;
	-webkit-opacity: 0.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha(opacity=70)";
}

#wrap {
	width: 100%;
	text-align: center;
	background: url(../img/bg_main.png) center top no-repeat;
}


/* --------------------------------------------------
2:Layout Setting
-------------------------------------------------- */

/* ----- header ----- */
header {
	position: relative;
	display: block;
	margin: 0 auto 20px;
	width: 960px;
}

	header #gotohome {
		position: absolute;
		top: 20px;
		left: 0;
	}

	header #sns-list {
		position: absolute;
		top : 20px;
		right: 0px;
		width: 217px;
	}

		header #sns-list .twitter {
			float: left;
			width: 68px;
			margin-right: 10px;
			overflow: hidden;
		}

		header #sns-list .facebook {
			float: left;
			width: 71px;
			margin-right: 10px;
			overflow: hidden;
		}

		header #sns-list .gplus {
			float: left;
			width: 32px;
			overflow: hidden;
		}



/* ----- description ----- */

#description {
	margin: 0 auto 20px;
	padding: 50px 0 60px;
	width: 100%;
	text-align: center;
	background: url(../img/bg_description.png) center top no-repeat;
}

	#description h2 {
		margin-bottom: 40px;
	}


/* ----- detail ----- */
#detail {
	margin: 0 auto 20px;
	width: 960px;
	text-align: left;
}

		#detail dt {
			float: left;
			width: 250px;
		}

	#detail dd {
		margin-bottom: 40px;
		padding-left: 250px;
	}


/* ----- sample gallary ----- */
#sample-gallary {
	display: block;
	margin-bottom: 40px;
	padding: 40px 0 15px;
	width: 100%;
	text-align: center;
	background: url(../img/bg_sample.png) center top no-repeat;
}

	#sample-gallary div {
		margin: 0 auto;
		width: 960px;
		text-align: left;
	}

	#sample-gallary div h2 {
		margin-bottom: 30px;
	}

	#sample-gallary div ul {
		float: left;
		margin: 0 10px;
		width: 220px;
	}

		#sample-gallary div ul li{
			margin-bottom: 20px;
		}


/* ----- staff list ----- */
#staff {
	display: block;
	margin: 0 auto;
	width: 960px;
	text-align: left;
}
#staff h2 {
	margin-bottom: 40px;
}
	#staff dl {
		float: left;
		width: 480px;
	}
		#staff dl dt {
			float: left;
			width: 190px;
		}

		#staff dl dd {
			margin-bottom: 40px;
			padding-left: 190px;
		}

		#staff dl dd span{
			font-weight: bold;
		}

		#staff dl dd ul {
			margin: 5px 0 15px;
		}
			#staff dl dd ul li {
				color: #7F7F7F;
			}


/* ----- footer ----- */
#banner {
	margin: 0 auto 40px;
	width: 960px;
	text-align: left;
}
	#banner h2 {
		margin-bottom: 40px;
	}

	#banner input {
		margin-top: 10px;
		padding: 4px;
		width: 550px;
		border: #333 1px solid;
		background: #222;
		color: #AAA;
	}

	#banner dt {
		float: left;
		width: 200px;
	}

	#banner dd {
		padding-left: 200px;
	}



/* ----- footer ----- */
footer {
	display: block;
	width: 100%;
	height: 45px;
	line-height: 1em;
	text-align: left;
	background: #FFF;
	color: #000;
	font-size: 10px;
}

	footer div {
	position: relative;
		margin: 0 auto;
		width: 960px;
	}

	footer div #copyright {
		position: absolute;
		top: 20px;
		left: 0;
		width: 460px;
	}
	footer div #attention {
		position: absolute;
		top: 20px;
		right: 0;
		width: 460px;
		text-align: right;
	}



/* Clear Fix */
#sample-gallary div:after,
#staff:after,
#banner dl:after { content:"."; display:block; clear:both; height:0; visibility:hidden; font-size:0; }

#sample-gallary div,
#staff,
#banner dl { display:inline-block; }
/*\*/
* html #sample-gallary div,
* html #staff,
* html #banner dl { height:1%; }

#sample-gallary div,
#staff,
#banner dl { display:block; }
/**/