@import url(font.css);

/* ===========================================================
   reset
   =========================================================*/
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, caption { margin: 0; padding: 0; border: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; }
table { border-collapse: separate; border-spacing: 1; }
caption, th, td { text-align: left; font-weight: normal; }
table, td, th { vertical-align: middle; }
blockquote:before, blockquote:after, q:before, q:after { content: ""; }
blockquote, q { quotes: "" ""; }
h1, h2, h3, h4, h5, h6 { font-weight: normal; }
a { text-decoration: none; }
a:hover { text-decoration: underline; }
img { vertical-align: top; border: none; }
strong { font-weight: bold; }
em { font-style: italic; }
ul { list-style: none; }
ol{
	font-size: 12px;
	
}
:focus { outline: 0; }

/* ===========================================================
   base
   =========================================================*/
html, body { height: 100%; }
body { background: #fff; font: 12px/1.2 Arial, Helvetica, sans-serif;; color: #515151; -webkit-text-size-adjust: none; }
input, button, select, textarea { margin: 0; padding: 0; font-family: Arial, Helvetica, sans-serif; }
h1, h2, h3, h4, h5, h6 { font-weight: normal; }

.wrapper { min-width: 918px; min-height: 100%; background: url(../img/bg.png) no-repeat center 5px; }
.container { margin: 0 auto; width: 918px; }

/* ===========================================================
   common classes
   =========================================================*/

/* font-family */
.CG { font-family: 'Century Gothic', serif; }


/* margin */
.mt10 { margin-top: 10px; }
.mt20 { margin-top: 20px; }
.mt30 { margin-top: 30px; }
.mt40 { margin-top: 40px; }
.mt50 { margin-top: 50px; }

.ml10 { margin-left: 10px; }
.ml20 { margin-left: 20px; }
.ml30 { margin-left: 30px; }
.ml40 { margin-left: 40px; }
.ml50 { margin-left: 50px; }

/* display */
.block { display: block; }
.inline { display: inline; }
.inline-block { display: inline-block; }

/* text-align */
.tl { text-align: left; }
.tr { text-align: right; }
.tc { text-align: center; }

/* vertical-align */
.vt { vertical-align: top; }
.vm { vertical-align: middle; }
.vb { vertical-align: bottom; }

/* position */
.rel { position: relative; }
.abs { position: absolute; }

/* float */
.fl { float: left; }
.fr { float: right; }

.imagepadding {
	padding-top: 9px;
	padding-right: 9px;
	padding-bottom: 9px;
	padding-left: 0px;
}


/* clear float */
.clear, .clearfix:after { clear: both; }
.clear, .clearfix:before, .clearfix:after { display: block; overflow: hidden; visibility: hidden; width: 0; height: 0; }
.clearfix:before, .clearfix:after { content: '\0020'; }
.lt-IE8 .clearfix { zoom: 1; }

/* inline-block content */
.ib-parent { letter-spacing: -.31em;  word-spacing: -0.43em; }
.ib-child { display: inline-block; letter-spacing: normal; word-spacing: normal; }
.lt-IE8 .ib-parent { letter-spacing: normal; }
.lt-IE8 .ib-child { display: inline; zoom: 1; }

/* image replace */
.ir { display: block; text-align: left; text-indent: -9999px; overflow: hidden; }


/* ===========================================================
   header
   =========================================================*/

.header { z-index: 1; }
.header .container { height: 145px; }

.header .logo { top: 29px; left: 0; }

.header .phone { top: 52px; right: 0; font-size: 14px; color: #424141; }

.nav { top: 96px; right: -10px; }
.nav a:hover { text-decoration: none; }
.nav > li { position: relative; float: left; margin-left: 1px; }
.nav > li > a { display: block; padding: 5px 10px; height: 15px; font-size: 14px; line-height: 15px; font-family: 'Century Gothic', serif; color: #697c37; }
.nav > li > a:hover,
.nav > li.active > a,
.nav > li:hover > a { background: #697c37; color: #fff; }
.nav li ul { position: absolute; top: 25px; left: -9999px; padding: 5px 10px; min-width: 172px; background: #697c37; border-radius: 0 0 5px 5px; }
.nav li:hover ul { left: 0; }
.nav ul li { padding: 5px 0; border-top: 1px solid #728443; }
.nav ul li:first-child { border-top: 0; }
.nav ul li.view-all { font-style: italic; }
.nav ul a { color: #fff; }
.nav ul a:hover,
.nav ul li.active a { color: #ababab; }


/* ===========================================================
   footer
   =========================================================*/

.footer {
	bottom: 0;
	left: 0;
	width: 100%;
	font-size: 11px;
	background-image: url(../img/footer-bg.png);
	background-repeat: no-repeat;
	background-position: center 125px;
}
.footer > .container { height: 212px; }

.links { padding: 35px 0 0 230px; }
.links dl { float: left; width: 140px; }
.links dt { margin-bottom: 15px; font-size: 16px; font-family: 'ConduitITCRegular'; color: #697c37; }
.links dd { line-height: 17px; }
.links dd a { color: #5d5d5d; }

.logos { background: #e3e3e3; }
.logos .container { padding: 13px 0; height: 110px; }
.logos .title { font-size: 18px; line-height: 110px; color: #697c37; }
.logos .list { width: 770px; text-align: right; }
.logos li { vertical-align: middle; margin-left: 60px; }

.crafted { top: 36px; right: 0; color: #697c37; }
.crafted a { color: #697c37; }


/* ===========================================================
   main
   =========================================================*/

.main { padding-bottom: 372px; }
.main-left { float: left; width: 288px; }
.main-right { float: right; width: 606px; }

.banner .mask { top: 0; left: -213px; width: 569px; height: 144px; background: url(../img/banner-mask.png) no-repeat; }

.side-box { padding: 5px 0; width: 100%; background: #697c37 url(../img/sidebox-bg.png) no-repeat; border-radius: 5px; }
.side-box .top { margin: 0 17px; height: 54px; border-bottom: 1px solid #84945b; }
.side-box .top img { top: 12px; left: 0; }
.side-box .title { padding-top: 15px; padding-left: 58px; background: url(../img/arrow-01.png) no-repeat right 20px; font-size: 16px; color: #fff; }
.side-box .content { padding: 0 17px; min-height: 140px; background: #697c37 url(../img/sidebox-bg.png) no-repeat 11px -59px; }
.side-box ul { padding: 6px 0 7px; }
.side-box li { padding: 5px 0 4px; background: url(../img/h-line.png) repeat-x left top; line-height: 16px; }
.side-box li:first-child { padding-top: 5px; background: none; }
.side-box li a { display: block; padding: 2px 0 2px 58px; background: url(../img/icon-02.png) no-repeat left 5px; font-size: 14px; color: #fff; }
.side-box li a:hover, .side-box li.active a { background-image: url(../img/icon-03.png); text-decoration: none; color: #263109; }

.comm-btn { display: inline-block; width: 111px; height: 39px; background: url(../img/comm-button.png) no-repeat; color: #fff !important; }
.comm-btn:hover { background-position: 0 -41px; }
button.comm-btn { border: 0; cursor: pointer; }
a.comm-btn { line-height: 39px; text-align: center; }
a.comm-btn:hover { text-decoration: none; }


/* ===========================================================
   home
   =========================================================*/

.slider .list { height: 299px; }
.slider .list li { display: none; position: absolute; top: 0; left: 0; }
.slider .list li:first-child { display: block; }
.slider .dots { top: 22px; right: 15px; }
.slider .dots li { margin-bottom: 3px; width: 13px; height: 13px; background: url(../img/dot.png) no-repeat; cursor: pointer; }
.slider .dots li.active { background-position: 0 -13px; cursor: default; }

.latest-projects .title,
.awards .title { margin-bottom: 20px; font-size: 18px; line-height: 0.8; color: #697c37; }

.latest-projects { width: 294px; }
.latest-projects ul { margin-left: -20px; }
.latest-projects li:first-child { margin-top: 0; }
.latest-projects li { float: left; margin: 20px 0 0 20px; height: 128px; }
.latest-projects li a { position: relative; display: block; height: 128px; }
.latest-projects li a img.over { display: none; }
.latest-projects li a:hover img { display: none; }
.latest-projects li a:hover img.over { display: block; }

.awards { width: 294px; }
.awards .content { text-align: justify; line-height: 16px; color: #5d5d5d; }


/* ===========================================================
   subpage
   =========================================================*/

.page-container { text-align: justify; }
.page-container h1, .page-container h2 { border-bottom: 1px solid #e7e7e7; font-family: 'Century Gothic', serif; font-size: 22px; line-height: 0.9; color: #697c37; }
.page-container h1 { padding: 15px 0; font-size: 18px; }
.page-container h2 { margin-top: 1.2em; padding-bottom: 11px; background: url(../img/h-line-01.png) repeat-x left bottom; }
.page-container p { margin: 1.2em 0; }
.page-container a { color: #7b8c4f; }
.page-container ul { margin: 2em 0; }
.page-container li {
	margin: 5px 0 5px 20px;
	padding-left: 15px;
	background-image: url(../img/arrow-02.png);
	background-repeat: no-repeat;
	background-position: 4px 4px;
}

.page-container .form { width: 398px; }
.page-container .form .field { position: relative; min-height: 37px; margin: 0 0 10px 83px; }
.page-container .form .field .label { position: absolute; top: 0; left: -83px; width: 83px; line-height: 37px; }
.page-container .form .field .input { width: 293px; height: 15px; padding: 10px; border: 1px solid #cdcdcd; font-size: 12px; line-height: 15px; color: #515151; }
#title2{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	font-weight: bold;
	color: #697c37;
	height: 18px;
	width: 176px;
	vertical-align: bottom;
	text-align: center;
	margin-top: 5px;
	padding-top: 5px;
}
#title3{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #333;
	font-style: italic;
	font-weight: normal;
	height: 18px;
	width: 176px;
	vertical-align: bottom;
	text-align: center;
		padding-top: 5px;
}

/* ===========================================================
   portfolio
   =========================================================*/

.project-list { margin-right: -9px; }
.project-list li {
	float: left;
	width: 176px;
	height: 195px;
	text-align: center;
	font-size: 18px;
	color: #383838;
	margin-top: 0;
	margin-right: 29px;
	margin-bottom: 0;
	margin-left: 0;
	
}


.project-list li > a img {
	width: 176px;
	height: 137px;
}
.project-list .name { margin-top: 10px; }
.project-container h1, .page-container h2 { border-bottom: 1px solid #e7e7e7; font-family: 'Century Gothic', serif; font-size: 22px; line-height: 0.9; color: #697c37; }
.project-container h1 { padding: 15px 0; font-size: 18px; }
.project-container h2 {
	margin-top: 1.2em;
	padding-bottom: 11px;
	background-repeat: repeat-x;
	background-position: left bottom;
}

.break-line { height: 1px; background: url(../img/h-line-01.png) repeat-x; overflow: hidden; }