/*--------------------------
	BACK GROUND ILLUST
--------------------------*/
.bilancia{ background:url(../img/bilancia/illust.jpg) no-repeat right bottom; }
.rust{ background:url(../img/rust/illust.jpg) no-repeat right center; }
.paddle{ background:url(../img/paddle/illust.jpg) no-repeat right bottom; }
.pedal{ background:url(../img/pedal/illust.jpg) no-repeat right center; }
.house01{ background:url(../img/house01/illust.jpg) no-repeat right top; }
.house02{ background:url(../img/house02/illust.jpg) no-repeat right top; }
.apartment01{ background:url(../img/apartment01/illust.jpg) no-repeat right top; }
.jiji{ background:url(../img/jiji/illust.jpg) no-repeat right center; }
.house03{ background:url(../img/house03/illust.jpg) no-repeat right center; }
.display01{ background:url(../img/display01/illust.jpg) no-repeat right center; }
.andpeace{ background:url(../img/andpeace/illust.jpg) no-repeat right center; }
.roji{ background:url(../img/roji/illust.jpg) no-repeat right center; }
.display02{ background:url(../img/display02/illust.jpg) no-repeat right center; }
@media screen and (max-width: 480px){
	.bilancia, .rust, .paddle, .pedal,
	.house01, .house02, .apartment01,
	.jiji,.house03,.display01,.andpeace,.roji,.display02
	{ background:none; }
}

/*--------------------------
	MAIN
--------------------------*/
#main{
	position:relative;
	width:100%;
	height:600px;
	text-align:center;
}

#main h2{
	padding-top:250px;
}
@media screen and (max-width: 480px){
	#main{
		max-width:100%;
		height:300px;
		text-align:center;
	}
	#main h2{
		padding-top:115px;
	}
	/*#main h2 img{
		width:50%;
		height:auto;
	}*/
	#main h2 img{
		width:auto;
		height:50px;
	}
}

/*--------------------------
	WORKS LIST
--------------------------*/
#works_list {
	overflow:hidden;
	max-width:964px;
	margin:0 auto;
	padding-top:60px;
}
#works_list a:link {
	color:#555;
	text-decoration : none;
	}
#works_list a:visited {
	color: #555;
	text-decoration : none;
	}
#works_list a:hover {
	color:#a99655;
	text-decoration : none;
	}
#works_list a:active {
	}
#works_list li{
	float:left;
	padding-bottom:4px;
	width: 33.33333%;
	margin-bottom:30px;
}
#works_list dl{
	padding:0 15px 0 15px;
}
#works_list dd{
	text-align:center;
	margin-top:10px;
}
#works_list img{
	width:100%;
	height:auto;
}
@media screen and (max-width: 964px){
	#works_list {
		width:95%;
	}
}
@media screen and (max-width: 768px){
	#works_list li{
		float:left;
		padding-bottom:4px;
		width: 50%;
		margin-bottom:30px;
	}
}
@media screen and (max-width: 480px) {
	#gallery {
		width:95%;
		margin:0 auto;
	}
	.col4 { width: 50%; }
	.col2 { width: 100%; }
	.col1 { width: 100%;}
}


/*--------------------------
	WORKS INFO
--------------------------*/
#works_info_wrap{
	max-width:960px;
	margin:0 auto;
	padding:70px 0;
	overflow:hidden;
	position:relative;
}
#works_info_wrap .illust{
	position:absolute;
	bottom:0;
	right:20px;
}
#works_info{
	float:left;
	max-width:900px;
}
#works_info h3{
	font-size:123.1% ;
	font-family:Arial, Helvetica, sans-serif;
	font-weight:bold;
}
#works_info h3.ja{
	font-size:116% ;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-weight:bold;
}
#works_info .line{
	width:20px;
	height:1px;
	background:#000;
	margin-top:30px;
}
#works_info dl{
	margin-top:30px;
	font-size:100%;
	overflow:hidden;
}
#works_info dt{
	color:#b3b3b3;
	float:left;
    clear: both;
    width:110px;
	margin-bottom:12px;
}
#works_info dd{
	color:#777;
	margin-bottom:12px;
	margin-left:110px;
	max-width:600px;
}

@media screen and (max-width: 960px){
	#works_info_wrap{
		padding:70px 20px;
	}
}
@media screen and (max-width: 480px){
	#works_info .line{
		margin:0 auto;
		width:20px;
		height:1px;
		background:#000;
		margin-top:30px;
	}
	#works_info_wrap{
		padding:40px 20px;
	}
	.illust{
		display:none;
	}
	#works_info {
		width:95%;
		margin:0 auto;
		background:none;
		text-align:center;
	}
	#works_info .works_ttl{
		width:100%;
		float:none;
		text-align:center;
	}
	#works_info h3{
		padding-right:0px;
	}
	#works_info dl{
		width:100%;
		margin-top:20px;
	}
	#works_info dt{
		color:#b3b3b3;
		float:none;
		clear: both;
		width:100%;
		margin-bottom:4px;
		padding-left:0;
	}
	#works_info dd{
		color:#777;
		margin-bottom:15px;
		margin-left:0px;
		padding-left:0;
	}
}

/*--------------------------
	GALLERY
--------------------------*/
#gallery {
	overflow:hidden;
	max-width:964px;
	margin:0 auto;
}
#gallery li{
	float:left;
	padding-bottom:4px;
}
.col4 { width: 25%; }
.col3 { width: 33.333333%; }
.col2 { width: 50%; }
.col1 { width: 100%;}
.inner{
	padding:0 2px 0 2px;
}
.onerow{
	overflow:hidden;
}
#gallery img{
	width:100%;
	height:auto;
}
@media screen and (max-width: 964px){
	#gallery {
		width:95%;
		margin:0 auto;
	}
}
@media screen and (max-width: 768px){
	#gallery {
		width:95%;
		margin:0 auto;
	}
	#gallery li{
		padding-bottom:2px;
	}
	.inner{
		padding:0 1px 0 1px;
	}
	.col4 { width: 50%; }
	.col2 { width: 100%; }
	.col1 { width: 100%;}
}
@media screen and (max-width: 480px) {
	#gallery {
		width:95%;
		margin:0 auto;
	}
	.col4 { width: 50%; }
	.col3 { width:100%; }
	.col2 { width: 100%; }
	.col1 { width: 100%;}
}

#btn_back{
	text-align:center;
	font-family:Arial, Helvetica, sans-serif;
	margin-top:50px;
	font-size:100%;
	font-weight:bold;
}
#btn_back a:link {
	color:#333;
	text-decoration : none;
	}
#btn_back a:visited {
	color: #333;
	text-decoration : none;
	}
#btn_back a:hover {
	color:#86a955;
	text-decoration : none;
	}
#btn_back a:active {
	}