@charset "utf-8";

/* WORKS TOP
----------------------------------------*/

#bg {background: #d4bdaa url(../img/bg_header.jpg) center top no-repeat;}

.works ul {margin-bottom: 45px;}

.works ul li {
	float: left;
	display: block;
	width: 430px;
	height: 210px;
	margin-top: 30px;}

.ex07,.ex05,.ex04,.ex02 {margin-right: 60px;}

.works ul li dl dt a:hover img {
	filter: alpha(opacity=60);
	-moz-opacity:0.60;
	opacity:0.60;}

/* WORKS DETAIL
----------------------------------------*/

#pnavi {margin: -15px 0 20px 0;}

#pnavi li {display:inline;}

#pnavi li a {padding-right: 5px;}

.workdetail h3 {margin-bottom: 25px;}

.worksbox,
.worksbox02,
.worksbox03 {clear: both;}

.worksbox {margin-bottom: 15px;}

.worksbox02 {
	position: relative;
	margin-bottom: 55px;}

.worksbox03 {
	position: relative;
	margin-bottom: 35px;}

.worksbox02 .workimg_up {
	position: absolute;
	left: 0; top: -70px;}

.worksbox03 .workimg_up {
	position: absolute;
	left: 0; top: -60px;}

.worksbox p,
.worksbox02 p,
.worksbox03 p {
	letter-spacing: 0.05em;
	margin-bottom: 0.5em;
	line-height: 2em;}

.worksbox dl,
.worksbox02 dl {width: 518px;}

.worksbox03 dl {width: 600px;}

.worksbox dl dt,
.worksbox02 dl dt,
.worksbox03 dl dt {
	padding: 5px 0;
	background: url(../../img/bdr.gif) left bottom repeat-x;}

.worksbox dl dd {padding: 8px 0 25px 0;}
.worksbox02 dl dd,
.worksbox03 dl dd {padding: 8px 0 50px 0;}

#imgright .workimg {float: right;}

#imgright dl {float: left;}

#imgleft .workimg {float: left;}

#imgleft dl {float: right;}

.ohlink {
	margin-top: 1.5em;
	text-align: center;}

.workdetail h4 {
	clear: both;
	padding-top: 25px;}

#thumb {
	margin: 6px 0 25px 0;
	padding: 10px;
	border: 1px solid #33211a;}

#thumb img {margin-right: 4px;}

#thumb a:hover img {
	filter: alpha(opacity=60);
	-moz-opacity:0.60;
	opacity:0.60;}

.worksnavi {text-align: center;}

.worksnavi li {
	display: inline;
	margin: 0 5px;}