﻿@charset "utf-8";

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

#bnr li {
	display: block;
	float: left;}

#bnr .brnmgn {
	margin-left: 13px;}

.wnavi01 li,.wnavi02 li {
	float: left;
	width: 230px;
	text-indent: -9999px;}

.wnavi01 li a,.wnavi02 li a {
	display: block;
	overflow: hidden;
	height:0 !important;
	height /**/: 31px;
	padding-top: 31px;}

.wnavi01 li a {	background-image: url(../img/wnavi.jpg);}
.wnavi02 li a {	background-image: url(../img/wnavi02.jpg);}

.tnav02,.tnav03,.tnav04,.tnav05,.tnav02on,.tnav03on,.tnav04on,.tnav05on {
	margin-left: 4px;}

.tnav01 a {background-position: 0 0;}
.tnav02 a {background-position: -230px 0;}
.tnav03 a {background-position: -460px 0;}
.tnav04 a {background-position: -690px 0;}

.tnav01 a:hover {background-position: 0 -31px;}
.tnav02 a:hover {background-position: -230px -31px;}
.tnav03 a:hover {background-position: -460px -31px;}
.tnav04 a:hover {background-position: -690px -31px;}

.tnav01on a {background-position: 0 -62px;}
.tnav02on a {background-position: -230px -62px;}
.tnav03on a {background-position: -460px -62px;}
.tnav04on a {background-position: -690px -62px;}


#fnv {
	padding-top: 45px;}

.msg {
	clear: both;
	margin-bottom: 20px;
	padding-top: 15px;}

/* forIE */
*:first-child+html .msg {padding-top: 0;} 
* html .msg {padding-top: 0;} 

h3 {margin-bottom: 10px;}

.worksbox {
	clear: both;
	width: 932px; }

.mgn {margin-bottom: 20px;}

.worksbox div {
	position: relative;
	width: 450px;
	height: 195px;
	border: 1px dotted #75725e;}

.worksbox .leftbox {float: left;}
.worksbox .rightbox {float: right;}

.worksbox div p a img {
	position: absolute;
	left: 10px; top: 10px;
	width: 175px;
	height: 175px;}

.worksbox div p a:hover img {
	filter: alpha(opacity=60);
	-moz-opacity:0.60;
	opacity:0.60;}

.worksbox div dl {
	position: absolute;
	right: -1px; top: 10px;
	width: 260px;}

.worksbox div dl dt {
	overflow: auto;
	_height: 1%;
	color: #fff;
	font-size: 12px;
	line-height: 24px;
	padding: 0 8px 0 5px;
	background-color: #75725e;}

.worksbox div dl dt em {
	float: left;
	font-size: 14px;}

.worksbox div dl dt span {float: right;}

.worksbox div dl dd {
	padding: 10px 12px 0 5px;
	line-height: 1.6em;}

.worksbox div a img {
	position: absolute;
	right: 3px; bottom: 8px;}

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

/* WORKS DETAIL COMMON */

#tarea {
	float: left;}

#tarea p {line-height: 2em;}

#parea {
	float: right;}

/* WORKS01 ============================= */

.w01 #tarea {
	width: 460px;}

.w01 #tarea p {
	text-indent: 1em;
	margin: 0 25px 2em 5px;}

.w01 #parea {
	width: 460px;}

.w01 #parea h4 {
	margin: 50px 0 10px 0;
	padding: 3px 8px;
	border: 1px dotted #75725e;}

/* WORKS03 ============================= */

.w03 #tarea {
	width: 460px;}

.w03 #tarea p {
	margin: 0 25px 210px 5px;}

.w03 #parea {
	width: 460px;}

/* WORKS04 ============================= */

.w04 #tarea {
	width: 460px;}


.w04 #tarea p {
	margin: 0 25px 10px 5px;}

.w04 #parea {
	text-align: center;
	width: 460px;}

/* WORKS05 ============================= */

#w05box ul li {
	float: left;
	display: block;
	width: 280px;
	height: 340px;
	padding-top: 15px;}

#w05box ul li dl dd {
	padding: 10px 5px;
	line-height: 2em;}

#w05box .mgn {
	margin-right: 43px;}

/* WORKS06 ============================= */

.w06 #tarea {
	width: 587px;}

.w06 #tarea p {
	margin: 0 15px 2em 5px;}

.w06 #parea {
	width: 310px;}

.w06list {
	clear: both;
	margin-left: 10px;}

.w06list li {
	float: left;
	display: block;
	width: 280px;
	height: 300px;
	padding-top: 15px;}

.w06list li dl dd {
	padding: 10px 5px;
	line-height: 2em;}

.w06list .mgn {
	margin-right: 41px;}

/* WORKS07 ============================= */

.w07 #tarea {
	width: 557px;}

.w07 #tarea p {
	margin: 0 0 30px 5px;}

.w07 #parea {
	width: 352px;}

.w07 .right {
	text-align: right;}

.w07 .right img {
	margin-bottom: 15px;}

/* WORKS08 ============================= */

.w08 #tarea {
	width: 630px;}

.w08 #tarea p {
	margin: 0 5px 2em 5px;}

.w08 #parea {
	width: 266px;}

.w08 .bmgn {
	display: block;
	margin-bottom: 70px;}

/* WORKS09 ============================= */

.w09 #tarea {
	width: 470px;}

.w09 #tarea p {
	margin: 0 5px 2em 5px;}

.w09 #parea {
	width: 266px;}

.w09 .bmgn {
	display: block;
	margin-bottom: 100px;}

/* WORKS10 ============================= */

.w10 #tarea {
	width: 400px;}

.w10 #tarea p {
	margin: 0 5px 2em 5px;}

.w10 #parea {
	width: 500px;}

/* WORKS11 ============================= */

.w11 #tarea {
	width: 460px;}

.w11 #tarea p {
	margin: 0 25px 262px 5px;}

.w11 #parea {
	width: 460px;}

/* WORKS12 ============================= */

.w12 #tarea {
	width: 460px;}

.w12 #tarea p {
	text-indent: 1em;
	margin: 0 25px 2em 5px;}

.w12 #parea {
	width: 460px;}

.w12 #parea h4 {
	margin: 50px 0 10px 0;
	padding: 3px 8px;
	border: 1px dotted #75725e;}

.w12 .bmgn {
	display: block;
	margin-bottom: 180px;}

/* WORKS13 ============================= */

.w13 #tarea {
	width: 460px;}

.w13 #tarea p {
	text-indent: 1em;
	margin: 0 25px 2em 5px;}

.w13 #parea {
	width: 460px;}

.w13 h4 {
	margin: 40px 0 25px 0;
	padding: 5px 8px;
	border: 1px dotted #75725e;}

.w13box {
	overflow: auto;
	padding-bottom: 20px;}

.w13box ul li {
	display: inline;}

.w13box ul .rmgn {
	margin-right: 131px;}

/* WORKS14 ============================= */

.w14 #tarea {
	width: 460px;}

.w14 #tarea p {
	text-indent: 1em;
	margin: 0 25px 2em 5px;}

.w14 #parea {
	width: 460px;}

.w14 #parea h4 {
	margin: 50px 0 10px 0;
	padding: 3px 8px;
	border: 1px dotted #75725e;}

.w14 .bmgn {
	display: block;
	margin-bottom: 305px;}

/* WORKS15 ============================= */

.w15 #tarea {
	width: 505px;}

.w15 #tarea p {
	margin: 0 25px 2em 5px;}

.w15 #parea {
	width: 400px;}

.w15 #parea h4 {
	margin: 50px 0 10px 0;
	padding: 3px 8px;
	border: 1px dotted #75725e;}

.w15 .bmgn {
	display: block;
	margin-bottom: 330px;}

/* WORKS16 ============================= */

.w16 #tarea {
	width: 460px;}

.w16 #tarea p {
	margin: 0 25px 2em 5px;}

.w16 #parea {
	width: 460px;}

.w16 #parea h4 {
	margin: 50px 0 10px 0;
	padding: 3px 8px;
	border: 1px dotted #75725e;}

.w16 .bmgn {
	display: block;
	margin-bottom: 0px;}

.w16list {
	width: 408px;
	height: 149px;
	color: #fff;
	margin: -1em 0 1em 6px;
	padding: 15px 0 0 15px;
	background: url(../img/bg_w16list.gif) left top no-repeat;}

.w16 #parea dl {
	width: 220px;
	text-align: center;
	margin-top: 15px;}

.w16 #parea dl dd {padding-top: 5px;}


.w16list ul li {
	width: 400px;
	margin-bottom: 1em;}

/* WORKS17 ============================= */

.w17 #tarea {
	width: 460px;}

.w17 #tarea p {
	margin: 0 25px 2em 5px;}

.w17 #parea {
	width: 460px;}

.w17 #parea h4 {
	margin: 50px 0 10px 0;
	padding: 3px 8px;
	border: 1px dotted #75725e;}

.w17 .bmgn {
	display: block;
	margin-bottom: 580px;}

.w17 #parea dl {
	width: 220px;
	text-align: center;
	margin-top: 15px;}

.w17 #parea dl dd {padding-top: 5px;}


/* WORKS18 ============================= */

.w18 #tarea {
	width: 460px;}

.w18 #tarea p {
	margin: 0 25px 2em 5px;}

.w18 #parea {
	width: 460px;}

.w18 #parea h4 {
	margin: 50px 0 10px 0;
	padding: 3px 8px;
	border: 1px dotted #75725e;}

.w18 .bmgn {
	display: block;
	margin-bottom: 330px;}

.w18 #parea dl {
	width: 220px;
	text-align: center;
	margin-top: 15px;}

.w18 #parea dl dd {padding-top: 5px;}


/* ETERIOR08 ============================= */

.ex08 #tarea {
	width: 460px;}

.ex08 #tarea p {
	margin: 0 25px 2em 5px;}

.ex08 #parea {
	width: 460px;}

.ex08 #parea h4 {
	margin: 50px 0 10px 0;
	padding: 3px 8px;
	border: 1px dotted #75725e;}

.ex08 .bmgn {
	display: block;
	margin-bottom: 340px;}

.ex08 #parea dl {
	width: 220px;
	text-align: center;
	margin-top: 15px;}

.ex08 #parea dl dd {padding-top: 5px;}

/* GARDEN07 ============================= */

.gd07 #tarea {
	width: 536px;}

.gd07 #tarea p {
	margin: 0 25px 2em 5px;}

.gd07 #parea {
	width: 355px;}

.gd07 .bmgn {
	display: block;
	margin-bottom: 100px;}

/* GARDEN08 ============================= */

.gd08 #tarea {
	width: 460px;}

.gd08 #tarea p {
	margin: 0 25px 2em 5px;}

.gd08 #parea {
	width: 430px;}

.gd08 .bmgn {
	display: block;
	margin-bottom: 60px;}

/* GARDEN09 ============================= */

.gd09 #tarea {
	width: 620px;}

.gd09 #tarea p {
	margin: 0 25px 2em 5px;}

.gd09 #parea {
	width: 306px;}

.gd09 .bmgn {
	display: block;
	margin-bottom: 40px;}

/* GARDEN10 ============================= */

.gd10 #tarea {
	width: 450px;}

.gd10 #tarea p {
	margin: 0 25px 2em 5px;}

.gd10 #parea {
	width: 455px;}

.gd10 .bmgn {
	display: block;
	width: 500px;
	margin-bottom: 430px;}

.gd10 #tarea .worksnavi  {
	display: block;
	width: 500px;}

/* EXTERIOR 09 ============================= */

.ex09 #tarea {
	width: 400px;}

.ex09 #tarea p {
	margin: 0 5px 2em 5px;}

.ex09 #parea {
	width: 500px;}

.ex09 .bmgn {
	display: block;
	margin-bottom: 250px;}

.ex09 #tarea .worksnavi  {
	display: block;
	width: 500px;}


/* EXTERIOR 10 ============================= */

.ex10 #tarea {
	width: 448px;}

.ex10 #tarea p {
	margin: 0 25px 2em 5px;}

.ex10 #parea {
	width: 442px;}

.ex10 #parea h4 {
	margin: 50px 0 10px 0;
	padding: 3px 8px;
	border: 1px dotted #75725e;}

.ex10 .bmgn {
	display: block;
	width: 500px;
	margin-bottom: 400px;}

/* EXTERIOR 11 ============================= */

.ex11 h4 {
	clear: both;
	margin: 30px 0 20px 0;
	padding: 0 0 8px 5px;
	border-bottom: 1px dotted #456600;}

.ex11 .box {
	float: left;
	width: 280px;
	height: 300px;}

.ex11 .box img {margin-bottom: 1em;}
.ex11 .box p {
	margin-left: 3px;
	margin-right: 3px;}

.ex11 .ex11mgn {margin-right: 30px;}

.ex11 .worksnavi {
	clear: both;
	display: block;}

/* EXTERIOR 12 ============================= */

.ex12 #tarea {
	width: 448px;}

.ex12 #tarea p {
	margin: 0 25px 2em 5px;}

.ex12 #parea {
	width: 448px;}

.ex12 #parea h4 {
	margin: 50px 0 10px 0;
	padding: 3px 8px;
	border: 1px dotted #75725e;}

.ex12 .bmgn {	
	display: block;
	width: 600px;
	margin-bottom: 400px;}

.ex12 .worksnavi {
	position: relative;
	display: block;
	wodth: 800px;}


/* GARDEN 11 ============================= */

.gd11 #tarea {
	width: 458px;}

.gd11 #tarea p {
	margin: 0 25px 2em 5px;}

.gd11 #parea {
	width: 429px;}

.gd11 #parea h4 {
	margin: 50px 0 10px 0;
	padding: 3px 8px;
	border: 1px dotted #75725e;}

.gd11 .bmgn {
	display: block;
	width: 500px;
	margin-bottom: 20px;}


/* RE-GARDEN 06 ============================= */

.rg06 #tarea {
	width: 380px;}

.rg06 #tarea p {
	margin: 0 25px 2em 5px;}

.rg06 #parea {
	width: 513px;}

.rg06 #parea h4 {
	margin: 50px 0 10px 0;
	padding: 3px 8px;
	border: 1px dotted #75725e;}

.rg06 .bmgn {
	display: block;
	width: 500px;
	margin-bottom: 20px;}
