@charset "utf-8";

/* Harasaki Concept Works - Screen CSS							Version 0.82
******************************************************************************

   1. HTML Tag			 7. Header Layout		13. Category Navigation
   2. Base Layout		 8. Footer Layout		14. Page Navigation
   3. Head Line Tag		 9. Toppage Layout		15. Page Contents
   4. Link Color		10. Topicpath			16. Sitemap
   5. List Tag			11. Template Layout
   6. Table Tag			12. Category Contents	

   body.top,body.sitemap,body.contact,body.service,body.works,
   body.client,body.ecology,body.consult,body.faq,
   body.company,body.contact{

   css/print.css (for Print media only)

******************************************************************************/


/* 1. HTML Tag
-----------------------------------*/

html, body{
	width: 100%;
	text-align: center;
}

body{
	font: 13px/1.4 "ＭＳ Ｐゴシック",Arial, Helvetica, sans-serif;
	color: #666;
	width: auto;
	margin: 0;
	background: #F6F6F6 url(../images/layout/module/body_bg.gif) repeat;
}

div{
	margin: 0;
	padding: 0;
}

h1, h2, h3, h4, h5, h6, p, blockquote{
	margin: .5em 0;
	padding: 0;
}

p, blockquote{
	margin-bottom: 1em;
}

blockquote{
	padding: 25px;
	border: #999;
	background: #E7E7E7;
}

img{
	border: none;
	vertical-align: top;
}

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


/* 2. Base Layout
-----------------------------------*/

#wrapper{
	background: url(../images/layout/module/wrapper_bg.gif) top center repeat-y;
}

#container{
	width: 900px;
	text-align: left;
	margin: 0 auto;
	padding: 0;
	position: relative;
}	

#header{
	background: url(../images/layout/module/header_bg.jpg) top center no-repeat;
	height: 133px;
	overflow: hidden;
}

#main{
	clear: both;
	width: 900px;
	margin: 0;
	padding-bottom: 75px;
	min-height: 830px;
	background: url(../images/layout/module/main_bg.png) bottom center no-repeat;
	overflow: auto;
}

#footer{
	clear: both;
	background: url(../images/layout/module/footer_bg.jpg) bottom center no-repeat;
	height: 140px;
}


/* 3. Head Line Tag
-----------------------------------*/

h1{
	font-size: 1.62em;
	margin-top: 0;
}

h2{
	font-size: 1.3em;
}

h3{
	font-size: 1.15em;
}

h4, h5, h6{
	font-size: 1em;
	font-weight: normal;
}


/* 4. Link Color
-----------------------------------*/

a:link{
    color: #069;
	text-decoration: none;
}
   
a:visited{  
    color: #069;  
	text-decoration: none;
}

a:hover{
    color: #069;
    text-decoration: underline;
}
 
a:active{
	color: #E50003;
    text-decoration: none;  
}


/* 5. List Tag
-----------------------------------*/

dl, dt, dd, ul, ol, li{
	margin: 0;
	padding: 0;
}

dl, ul, ol{
	margin-left: 2em;
}

dt{
	padding: 5px 0;
	font-weight: bold;
}

dd{
	padding: 5px;
}

li{
	list-style: disc;
}


/* 6. Table Tag
-----------------------------------*/

table{
	margin: .5em 0;
	border-collapse: collapse;
	border: solid 1px #CCC;
	font-size: 100%;
}

caption{
	margin: .5em 0;
	text-align: left;
}

th, td{
	border: solid 1px #CCC;
	padding: 4px 6px;
	text-align: left;
	white-space: nowrap;
}

th{
	background: #F6F6F6;
}

	
/* 7. Header Layout
-----------------------------------*/

/* Logo */

#logo{
	float: left;
	font-size: 2.7em;
	color: #043f7b;
	margin: 35px 0 0 14px;
	padding: 0;
}

/* Top Navigation */

#topnav{
	display: inline;
	margin: 29px 12px 4px 0;
	padding: 0 0 4px;
	list-style: none;
	float: right;
	background: url(../images/layout/module/topnav_bg.gif) bottom right no-repeat;
	width: 276px;
}

#topnav li{
	display: inline;
}

#topnav li a{
	color: #aaa;
	padding: 16px 0 0 8px;
	line-height: .9em;
	height: 0;
	overflow: hidden;
	display: block;
	float: right;
	background-repeat: no-repeat;
	background-position: 50% 0;
}

#topnav li a:hover{
	color: #333;
	background-position: 50% -50px;
}
	
#topnav_1 a{
	background-image: url(../images/layout/module/topnav_1.gif);
	width: 41px;
}

#topnav_2 a{
	background-image: url(../images/layout/module/topnav_2.gif);
	width: 72px;
}
	
#topnav_3 a{
	background-image: url(../images/layout/module/topnav_3.gif);
	width: 75px;
}

/* Body Class Topnav */

body.top #topnav_1 a,
body.sitemap #topnav_2 a,
body.contact #topnav_3 a{
	color: #333;
	background-position: 50% -50px;
}	

/* Header Text */

h1, address {
	clear: right;
	float: right;
	text-align: right;
	margin: 0;
	padding: 0 14px;
	font-size: 12px;
	line-height: 16px;
	width: 400px;
}

/* Main Navigation */
	
#mainnav{
	clear: both;
	margin: 0 8px;
	padding:0;
	list-style: none;
	display: block;
	width: 884px;
	position: absolute;
	top: 90px;
}

#mainnav li{
	display: inline;
}

#mainnav li a{
	color: #043f7b;
	margin: 0 4px 0 0;
	display: block;
	float: left;
	font-size: 1.3em;
	font-weight: bold;
	padding: 38px 0 0;
	height: 0;
	width: 107px;
	overflow: hidden;
	background-repeat: no-repeat;
	background-position: 50% 0;
}

#mainnav li.last a{
	margin-right: -4px;
}

#mainnav li a:hover{
	background-position: 50% -50px;
}

/* Body Class Mainnav */

body.service #mainnav_1 a,
body.works #mainnav_2 a,
body.voice #mainnav_3 a,
body.ecology #mainnav_4 a,
body.consult #mainnav_5 a,
body.faq #mainnav_6 a,
body.company #mainnav_7 a,
body.contact #mainnav_8 a{
	background-position:50% -100px;
}

#mainnav_1 a{
	background-image: url(../images/layout/module/mainnav_1.gif);
}

#mainnav_2 a{
	background-image: url(../images/layout/module/mainnav_2.gif);
}

#mainnav_3 a{
	background-image: url(../images/layout/module/mainnav_3.gif);
}

#mainnav_4 a{
	background-image: url(../images/layout/module/mainnav_4.gif);
}

#mainnav_5 a{
	background-image: url(../images/layout/module/mainnav_5.gif);
}

#mainnav_6 a{
	background-image: url(../images/layout/module/mainnav_6.gif);
}

#mainnav_7 a{
	background-image: url(../images/layout/module/mainnav_7.gif);
}

#mainnav_8 a{
	background-image: url(../images/layout/module/mainnav_8.gif);
}


/* 8. Footer Layout
-----------------------------------*/

/* footer corp */

#footer h2{
	margin: 0 auto;
	padding: 18px 0 7px;
	text-align: center;
	height: 21px;
}

#footer p{
	margin: 0 auto;
	padding: 0;
	font-size: 12px;
	line-height: 24px;
	text-align: center;
	font: Arial; 
}

/* Footer Nav */

#footer ul{
	clear: both;
	height: 18px;
	margin: 0 auto;
	padding: 0;
	list-style: none;
	text-align: center;
	display: block;
}

#footer li{
	display: inline;
	margin: 0;
	padding: 0 8px 0 10px;
	font-size: 12px;
	border-left: #CCC 1px solid;
}

#footer li a{
	color: #666;
	text-transform: uppercase;
}

#footer li a:hover{
	color: #333;
}

#footer li.start{
	border-left: none;
}


/* 9. Topage Layout
-----------------------------------*/

/* Photo Album */

#album{
	clear: both;
	width: 880px;
	height: 315px;
	margin: 20px 10px 19px;
}

#mainbox{
	float: left;
	width: 580px;
}

.subbox{
	float: left;
	width: 140px;
	margin-left: 10px;
}

.subbox img{
	width: 140px;
	height: 97px;
	margin-bottom: 12px;
}

.subbox img.clear{
	margin-bottom: 0;
}

.category_banner a{
	clear: both;
	float: left;
}

.category_banner_right a{
	clear: none;
	float: right;
}

.category_banner a,
.category_banner_right a{
	width: 256px;
	height: 97px;
	background: url(../images/layout/category/works_category_bg.gif) 50% 0 no-repeat;
	margin-bottom: 15px;
}

.category_banner a:hover,
.category_banner_right a:hover{
	background: url(../images/layout/category/works_category_bg.gif) 50% -100px no-repeat;
}

/* Top Banner */

#topbanner{
	display: block;
	clear: both;
	width: 900px;
	height: 109px;
	background: url(../images/layout/index/topbanner_bg.gif) top center no-repeat;
}

#topbanner h2{
	display: block;
	width: 168px;
	float: left;
	height: 79px;
	margin: 16px 7px 0 0;
}

#topbanner h2.start{
	padding-left: 12px;
}

#topbanner h2.end{
	width: 174px;
	height: 75px;
	margin-left: 3px;
	margin-right: 0;
	margin-top: 18px;
}

/* 3col left */

#leftbox{
	display: inline;
	clear: both;
	float: left;
	width: 174px;
	margin-left: 13px;
}
	
#leftbox h3{
	margin: 0 0 19px;
}

.leftbox_img{
	clear: left;
	margin-left: 3px;
}

#leftbox p{
	font-size: 12px;
	margin: 3px 0 16px;
	text-align: center;
}

#leftbox a{
	color: #666;
}

/* 3col center */

#centerbox{
	display: inline;
	float: left;
	width: 494px;
	margin: 0 0 0 12px;
}
	
#centerbox h3{
	margin: 0 0 17px;
}

#centerbox p{
	margin: 0;
	padding: 0 10px 17px;
	line-height: 1.5;
}

#servicebanner{
	clear: both;
	width: 494px;
	margin: 0;
	padding: 12px 1px 15px;
	background: url(../images/layout/index/servicebanner_bg.gif) bottom center no-repeat;
	overflow: auto;
	border-bottom: #CCC 1px dashed;
	border-top: #CCC 1px dashed;
}

#servicebanner img{
	float: left;
	margin: 0;
	padding: 8px;
}

#centerbox p.center{
	clear: both;
	margin: 0;
	line-height: 2.54;
	text-align: center;
}

/* 3col right */

#rightbox{
	display: inline;
	float: right;
	width: 184px;
	margin-right: 11px;
}
	
#rightbox h3{
	margin: 0 0 8px;
}

#rightbox ul{
	margin: 0;
	padding: 0;
	list-style: none;
}

#rightbox ul li{
	display: block;
	margin: 0;
	border-bottom: #CCC 1px dashed;
	line-height: 17px;
}

#rightbox ul li a{
	display: block;
	margin: 0;
	padding: 10px 2px 9px 26px;
	color: #666;
	background: url(../images/layout/index/toplist_faq.gif) no-repeat 3px 10px;
}

#rightbox ul li a:hover{
	color: #9F7C59;
	text-decoration: none;
}


/* 10. topicpath
-----------------------------------*/

/* topicpath */

#topicpath ol{
	clear: left;
	margin: 0;
	padding: 0;
	height: 15px;
	font-size: 13px;
	line-height: 15px;
	background: url(../images/layout/category/topicpath_icon.gif) left center no-repeat;
	padding-left: 18px;
	list-style: none;
	text-align: left;
	position: absolute;
	top: 205px;
	left: 56px;
}

#topicpath li{
	display: inline;
	margin-right: 5px;
	float: left;
}

#topicpath li a{
	padding-right: 12px;
	background: url(../images/layout/category/topicpath_flow.gif) right center no-repeat;
	color: #333;
}

#topicpath li a:hover{
	color: #666;
    text-decoration: underline;
}

body.top #topicpath{
	display: none;
}


/* 11. Template Layout
-----------------------------------*/

/* Title */

#title{
	clear: left;
	margin: 18px 0 0 58px;
	padding: 0;
	height: 34px;
}

/* content */

#contents{
	display: inline;
	clear: both;
	float: left;
	width: 586px;
	margin: 65px 0 0 53px;
	padding: 0;
}

/* menu */

#menu{
	display: inline;
	float: right;
	width: 230px;
	margin: 69px 12px 0 0;
	padding: 0;
}

#menu h3{
	clear: both;
	width: 230px;
	display: inline;
	margin: 0 0 10px;
	padding: 0;
}

/* Body Class Container */

body.service #container{
	background-image: url(../images/layout/category/container_bg_f01.png);
}

body.works #container{
	background-image: url(../images/layout/category/container_bg_f02.png);
}

body.voice #container{
	background-image: url(../images/layout/category/container_bg_f03.png);
}

body.ecology #container{
	background-image: url(../images/layout/category/container_bg_f04.png);
}

body.consult #container{
	background-image: url(../images/layout/category/container_bg_f05.png);
}

body.faq #container{
	background-image: url(../images/layout/category/container_bg_f06.png);
}

body.company #container{
	background-image: url(../images/layout/category/container_bg_f07.png);
}

body.contact #container{
	background-image: url(../images/layout/category/container_bg_f08.png);
}

body.sitemap #container{
	background-image: url(../images/layout/category/container_bg_f09.png);
}

#container{
	background-position: 0 134px;
	background-repeat: no-repeat;
}


/* 12. Category Content
-----------------------------------*/

/* category Layout */

#category{
	clear: both;
	width: 540px;
	margin: 29px 23px 0;
	padding: 0;
	display: block;
}

#category p{
	clear: both;
	font-size: 13px;
	line-height: 1.5;
	margin: 0;
	padding-bottom: 18px;
}

/* category Banner */

.category_banner a{
	clear: both;
	float: left;
}

.category_banner_right a{
	clear: none;
	float: right;
}

.category_banner a,
.category_banner_right a{
	width: 256px;
	height: 97px;
	background: url(../images/layout/category/works_category_bg.gif) 50% 0 no-repeat;
	margin-bottom: 15px;
}

.category_banner a:hover,
.category_banner_right a:hover{
	background: url(../images/layout/category/works_category_bg.gif) 50% -100px no-repeat;
}

/* Service */

body.service .category_banner a,
body.service .category_banner_right a{
	width: 256px;
	height: 97px;
	background: url(../images/layout/category/service_category_bg.gif) 50% -100px no-repeat;
	margin-bottom: 15px;
}

body.service .category_banner a:hover,
body.service .category_banner_right a:hover{
	background: url(../images/layout/category/service_category_bg.gif) 50% 0 no-repeat;
}


/* 13. Category Navigation
-----------------------------------*/

/* Base Layout */

#localnavi{
	float: right;
	width: 230px;
	margin-bottom: 10px;
	padding-bottom: 10px;
	border-bottom: #CCC dotted 1px;
	display: inline;
}

#localnavi ol{
	margin: 0;
	padding: 40px 0 12px 8px;
	border-color: #D8D8D8;
	border-style: solid;
	border-width: 1px;
	border-top: none;
	background: url(../images/layout/category/localnavi_bg.gif) repeat;
}

#localnavi li{
	display: block;
	list-style: none;
	height: 30px;
	margin-top: 5px;
}

#localnavi li a{
	display: block;
	width: 210px;
	height: 0;
	padding-top: 30px;
	overflow: hidden;
}

#localnavi li.li_start{
	margin-top: 0;
}

/* Page Layout */

#localnavi h3{
	margin: 0;
	padding: 0;
}

body.page #localnavi ol{
	padding-top: 13px;
}

/* Works Category */

.works_li_01 a, .works_li_02 a, .works_li_03 a, .works_li_04 a, .works_li_05 a,
.works_li_06 a, .works_li_07 a, .works_li_08 a, .works_li_09 a, .works_li_10 a, .works_li_11 a{
	background-image: url(../images/layout/category/works_local_navi.gif);
	background-repeat: no-repeat;
}

.works_li_01 a{	background-position: 0 0;}
.works_li_02 a{	background-position: 0 -35px;}
.works_li_03 a{	background-position: 0 -70px;}
.works_li_04 a{	background-position: 0 -105px;}
.works_li_05 a{	background-position: 0 -140px;}
.works_li_06 a{	background-position: 0 -175px;}
.works_li_07 a{	background-position: 0 -210px;}
.works_li_08 a{	background-position: 0 -245px;}
.works_li_09 a{	background-position: 0 -280px;}
.works_li_10 a{	background-position: 0 -315px;}
.works_li_11 a{	background-position: 0 -350px;}

.works_li_01 a:hover{ background-position: -250px 0;}
.works_li_02 a:hover{ background-position: -250px -35px;}
.works_li_03 a:hover{ background-position: -250px -70px;}
.works_li_04 a:hover{ background-position: -250px -105px;}
.works_li_05 a:hover{ background-position: -250px -140px;}
.works_li_06 a:hover{ background-position: -250px -175px;}
.works_li_07 a:hover{ background-position: -250px -210px;}
.works_li_08 a:hover{ background-position: -250px -245px;}
.works_li_09 a:hover{ background-position: -250px -280px;}
.works_li_10 a:hover{ background-position: -250px -315px;}
.works_li_11 a:hover{ background-position: -250px -350px;}

/* Service Category */

.service_li_01 a, .service_li_02 a, .service_li_03 a, .service_li_04 a, .service_li_05 a,
.service_li_06 a, .service_li_07 a, .service_li_08 a{
	background-image: url(../images/layout/category/service_local_navi.gif);
	background-repeat: no-repeat;
}

.service_li_01 a{	background-position: 0 0;}
.service_li_02 a{	background-position: 0 -35px;}
.service_li_03 a{	background-position: 0 -70px;}
.service_li_04 a{	background-position: 0 -105px;}
.service_li_05 a{	background-position: 0 -140px;}
.service_li_06 a{	background-position: 0 -175px;}
.service_li_07 a{	background-position: 0 -210px;}
.service_li_08 a{	background-position: 0 -245px;}

.service_li_01 a:hover{ background-position: -250px 0;}
.service_li_02 a:hover{ background-position: -250px -35px;}
.service_li_03 a:hover{ background-position: -250px -70px;}
.service_li_04 a:hover{ background-position: -250px -105px;}
.service_li_05 a:hover{ background-position: -250px -140px;}
.service_li_06 a:hover{ background-position: -250px -175px;}
.service_li_07 a:hover{ background-position: -250px -210px;}
.service_li_08 a:hover{ background-position: -250px -245px;}


/* 14. Page Navigation
-----------------------------------*/

#pagenavi{
	float: right;
	width: 230px;
	margin-bottom: 10px;
	padding-bottom: 10px;
	border-bottom: #CCC dotted 1px;
	display: inline;
}

#pagenavi ol{
	width: 206px;
	margin: 0;
	padding: 40px 11px 19px;
	border-color: #D8D8D8;
	border-style: solid;
	border-width: 1px;
	border-top: none;
	background: url(../images/layout/category/localnavi_bg.gif) repeat;
}

#pagenavi ol li{
	display: block;
	margin: 0;
	padding-left: 21px;
	border-bottom: #CCC 1px dashed;
	background: url(../images/layout/page/pagenavi_bg.gif) 50% 0 no-repeat;
	font-size: 13px;
	line-height: 33px;
	list-style: none;
	color: #666;
}

#pagenavi ol li a{
	display: block;
	overflow: hidden;
	height: 33px;
	color: #999;
}

#pagenavi ol li a:hover{
	color: #CCC;
	text-decoration: none;
}

#pagenavi ol li.li_start{
	border-top: #CCC 1px dashed;
}

/* Voice Date */

#pagenavi dl{
	width: 206px;
	margin: 0;
	padding: 18px 11px 16px;
	border-color: #D8D8D8;
	border-style: solid;
	border-width: 1px;
	border-top: none;
	background: url(../images/layout/category/localnavi_bg.gif) repeat;
	font-size: 11px;
	min-height:320px;
	height: auto !important;
	height: 320px;
}

#pagenavi h3 img{
	margin: 0 0 4px;
}

#pagenavi dt{
	float: left;
	width: 52px;
	margin-bottom: 4px;
	padding: 0 6px 0 0;
	clear: both;
	font-weight: normal;
	border-right: #CCC dotted 1px;
	text-align: right;
}

#pagenavi dd{
	float: left;
	width: 135px;
	margin-bottom: 4px;
	padding: 0 0 0 8px;
} 


/* 15. Page Content
-----------------------------------*/

#page{
	clear: both;
	width: 540px;
	margin: 32px 23px 0;
	padding: 0;
	display: block;
}

#page h3{
	clear: both;
	width: 537px;
	border-bottom: #CCC solid 1px;
	padding: 0 0 7px 3px;
	margin: 0 0 14px;
	display: block;
}

#page p{
	clear: both;
	font-size: 13px;
	line-height: 1.5;
	margin-bottom: 24px;
}

/* Main Photo */

#mainphoto img{
	width: 506px;
	margin: 0 0 23px;
	padding: 17px;
	border: #CCC solid 1px;
}

/* Sub Photo */

#subbox{
	clear: both;
	width: 540px;
	display: inline;
}

.subbox_left, .subbox_right{
	width: 265px;
	height: 85px;
	margin: 0;
	padding: 14px 0;
	border-top: #CCC dotted 1px;
	display: block;
	overflow: hidden;
	position: relative;
}

.subbox_left{
	float: left;
}

.subbox_right{
	float: right;
}

#subbox img{
	float: left;
	margin: 0 10px 0 9px;
	width: 126px;
}

#subbox h4{
	float: left;
	width: 117px;
	font-size: 12px;
	font-weight: bold;
	margin: 4px 0;
	padding: 0;
	line-height: 14px;
}

#subbox p{
	clear: none;
	font-size: 10px;
	margin: 0 0 3px;
	line-height: 13px;
	padding: 0;
}

.subbox_a a, .subbox_a a:visited{
	font-size: 11px;
	margin: 3px 0 0;
	line-height: 17px;
	padding: 1px 0 0 14px;
	background: url(../images/layout/page/subbox_a.gif) left center no-repeat;
    text-decoration: underline;
	position: absolute;
	top: 78px;
	left: 145px;
}

.subbox_a a:hover{
	color: #666;
}

/* Bottom Tab */

#bottom_tab{
	clear: left;
	margin: 0;
	padding: 20px 0;
	width: 540px;
	height: 45px;
	background: url(../images/layout/page/bottom_tab_bg.gif) center 20px repeat-x;
	list-style: none;
	position: relative;
}

#bottom_tab img{
	position: absolute;
	top: 34px;
	left: 6px;	
}

#bottom_tab li{
	display: inline;
	float: right;
}

#bottom_tab li a{
	display: block;
	overflow: hidden;
	background-repeat: no-repeat;
	background-position: 50% 0;
	height: 0;
}

#bottom_tab li a:hover{
	background-position: 50% -50px;
}

#bottom_tab_form a{
	width: 117px;
	background-image: url(../images/layout/page/bottom_tab_form.gif);
	padding-top: 45px;
	margin: 0 8px 0 6px;
}

#bottom_tab_pdf a{
	width: 107px;
	background-image: url(../images/layout/page/bottom_tab_pdf.gif);
	padding-top: 36px;
	margin: 0;
}

#bottom_tab_next a{
	width: 107px;
	background-image: url(../images/layout/page/bottom_tab_next.gif);
	padding-top: 36px;
	margin: 0;
}

#bottom_tab_price a{
	width: 135px;
	background-image: url(../images/layout/page/bottom_tab_price.gif);
	padding-top: 36px;
	margin: 0;
}


/* Works Name */

#worksname{
	clear: both;
	width: 530px;
	height: 39px;
	border-left: #666 solid 10px;
	margin: 0 0 14px;
}

#worksname h3{
	clear: left;
	width: 520px;
	font-size: 20px;
	line-height: 22px;
	margin: 2px 0 3px 7px;
	padding: 0;
	border: none;
	display: block;
}

#worksname p{
	clear: left;
	font-size: 11px;
	line-height: 13px;
	margin: 0 0 0 7px;
	padding: 0;
}

/* Works Data */

#worksdate{
	clear: both;
	width: 524px;
	margin: 5px 0 0 8px;
	padding-bottom: 13px;
	border: #CCC solid 1px;
	background-color: #FFF;
}

#worksdate:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

#worksdate { display: inline-block; }

#worksdate h4{
	clear: both;
	margin: 19px 0 13px 15px;
	padding: 0;
}

#worksdate dl{
	clear: both;
	width: 498px;
	margin: 0;
	padding: 0;
	font-size: 12px;
}

#worksdate dl.left{
	clear: both;
	float: left;
	width: 246px;
	margin: 0 10px 0px 16px;
	_margin: 0 10px 0px 8px;
	border-right: #CCC 1px dotted;
}

#worksdate dl.right{
	clear: none;
	float: right;
	width: 246px;
	margin: 0;
}

#worksdate dt{
	clear: both;
	float: left;
	width: 88px;
	padding: 0 0 2px 0;
	clear: both;
	font-weight: normal; 
}
  
#worksdate dd{
	float: left;
	width: 153px;
	padding: 0 0 2px 0; 
} 

/* Works Data Text */

#works_text{
	float: left;
	width: 300px;
	display: inline;
}

#works_text h4{
	font-size: 15px;
	line-height: 1.5;
	margin: 5px 0 0;
	font-weight: bold;
	color: #844141;
}

#works_text p{
	font-size: 13px;
	line-height: 1.5;
	margin-bottom: 10px;
}

##works_text img{
	clear: both;
}

/* Works Photo */

#works_photo{
	float: left;
	margin: 0;
	padding: 20px 0;
	width: 540px;
	background: url(../images/layout/page/worksphoto_bg.gif) center top repeat-x;
	display: inline;
}

#works_photo img{
	float: left;
	margin: 0 7px 16px 9px;
	width: 253px;
	height: 170px;
}

#works_photo img.works_end{
	margin-bottom: 0;
}

/* Service Chart Image */

#chart {
	clear: both;
	margin: 6px 0 22px;
	padding: 0 0 23px;
	border-bottom: #CCC 1px dashed;
}

/* Service Work Flow */

#workflow{
	clear: both;
	width: 540px;
	display: inline;
}

#workflow h4{
	width: 82px;
	border-top: #CCC 1px solid;
	text-align: center;
	margin: 0;
	padding-top: 9px;
	float: left;
}

#workflow dl{
	float: left;
	margin: 0 0 22px;
	padding-left: 15px;
	border-left: #CCC 1px solid;
}

#workflow dt{
	clear: both;
	float: left;
	width: 100px;
	height: 38px;
	margin: 0;
	padding: 5px;
	border-bottom: #CCC 1px dotted;
	font-weight: normal;
}
  
#workflow dd{
	float: left;
	width: 321px;
	height: 38px;
	margin: 0;
	padding: 5px;
	border-bottom: #CCC 1px dotted;
} 

/* Block Level */

div.block{
	clear: both;
	width: 540px;
	display: block;
	margin: 6px 0 10px;
}

div.block h4{
	clear: both;
	width: 537px;
	font-size: 15px;
	line-height: 23px;
	border-bottom: #CCC dashed 1px;
	padding: 0 0 3px;
	margin: 0 0 14px;
	display: block;
	font-weight: bold;
	color: #666;
}

div.block img{
	clear: both;
	width: auto;
	margin: 3px auto 28px;
	text-align: center;
}

div.block ul{
	margin-bottom: 25px;
}

div.block dl{
	width: 540px;
	margin: 0;
	padding: 18px 0;
}

div.block dt{
	float: left;
	width: 96px;
	padding: 0 0 10px;
	clear: both;
	font-weight: normal;
}

div.block dd{
	float: left;
	width: 426px;
	padding: 0 8px 10px;
	border-left: #CCC dotted 1px;
} 

/* Photo Float */

.photoRight{
	float: right;
	margin: 0 0 15px 10px;
}

/* Photo Bottom */

.photoBottom{
	clear:both;
	margin: 0 0 24px;
}

.photoMargn15_0{
	clear:both;
	margin: 10px 0 24px;
}

/* Company Profile */

#page table{
	margin: .5em 0 40px;
	border-collapse: collapse;
	border: none;
	width: 100%;
}

#page th, #page td{
	border: none;
	border-bottom: dotted 1px #CCC;
	padding: 8px 10px;
	text-align: left;
	white-space: nowrap;
}

#page th{
	background: none;
	text-align: center;
	border-right: dotted 1px #CCC;
}

/* Point Text */

#pointtext{
	clear: both;
	padding: 8px 16px 14px;
	border: #CCC solid 1px;
	margin-bottom: 20px;
}

#pointtext h5{
	border-left: #444 solid 8px;
	padding-left: 5px;
	line-height: 20px;
	font-size: 15px;
}

#pointtext p{
	font-size: 12px;
	line-height: 1.5;
	margin: 0;
}

/* Company Photo Album 1 */

#company_album{
	width: 120px;
	margin: 18px 0 10px;
	float: left;
}

#company_album img{
	margin: 0 0 28px;
}

/* Boss Proflie */

#boss{
	width: 420px;
	margin: 18px 0 10px;
	float: left;
}

#boss table{
	margin: 0 0 12px;
	border-collapse: collapse;
	border: none;
	width: 265px;
	float: left;
	font-size: 12px;
}

#boss caption{
	font-weight: bold;
	font-size: 15px;
	line-height: 16px;
	padding-bottom: 6px;
}

#boss th, #boss td{
	border: none;
	padding: 0 0 2px;
	text-align: left;
	white-space: normal; 
	vertical-align: top;
}

#boss th{
	background: none;
	width: 55px;
	font-weight: normal;
}

#boss td{
	width: 200px;
}

#boss img{
	float: left;
	margin: 0 15px 0 0;
}

#boss p{
	clear: both;
	margin: 0 0 8px;
	width: 400px;
	font-size: 12px;
	line-height: 17px;
}

/* Boss Proflie */

#history{
	width: 410px;
	margin: 8px 0 10px 7px;
	float: left;
}

#history p, #history h5{
	margin: 0 0 10px 10px;
	clear: left;
	font-size: 12px;
	line-height: 17px;
}

#history h5{
	clear: left;
	font-size: 17px;
	font-weight: bold;
}

/* Company Photo Album 2 */

#company_album2{
	width: 120px;
	margin: 10px 0 10px;
	float: left;
}

#company_album2 img{
	margin: 0 0 25px;
}

/* Works Photo */

#happy_photo{
	clear: both;
	margin: 30px 0 20px;
	width: 540px;
}

#happy_photo img{
	clear: both;
	margin: 0 0 10px;
}

#happy_photo p{
	clear: both;
	margin: 0 0 8px;
	text-align: center;
	font-size: 15px;
}

.happy_box{
	float: left;
	margin: 0 6px 20px;
	width: 253px;
	text-align: center;
}

p.happytext{
	margin: 0 0 4px;
	padding: 0;
}

/* FAQ */

#page p.q {
	padding: 4px 0 4px 31px;
	margin: 4px 0 0 0;
	background-color: #F6F6F6;
	background-image: url(../images/layout/page/q.gif);
	background-repeat: no-repeat;
	background-position: 5px center;
	color: #666;
	font-weight: bold;
	border-bottom-color: #CCC;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
}

#page p.a {
	margin: 8px 0 7px 0;
	padding: 0 0 0 31px;
	background-image:url(../images/layout/page/a.gif);
	background-repeat: no-repeat;
	background-position: 5px 0;
	clear: both;
	min-height:24px;
	height: auto !important;
	height: 24px;
}

#page p.a a:link{
	color: #C30;
	text-decoration: underline;	
}

#page p.a a:hover{
	text-decoration: none;	
}

#page p.top {
	margin: 13px 0 20px 0;
	padding-top: 7px;
	border-top-color: #CCC;
	border-top-width: 1px;
	border-top-style: solid;
	text-align: right;
}


#page p.a_end {
	margin: 8px 0 25px 0;
}


/* 16. Sitemap
-----------------------------------*/

#sitemap{
	clear: both;
	margin: 130px 0 0 85px;
	padding: 0;
}

#sitemap h2{
	clear:both;
	border: #999 solid 1px;
	border-left:  #999 solid 9px;
	margin: 0 0 12px;
	padding: 0 6px;
	font-size: 15px;
	font-weight: normal;
	line-height: 25px;
	background-color: #FFF;
}

#sitemap ul{
	clear: both;
	margin: 0 0 15px;
	padding: 0 0 0 26px;
}

.sitemapbox{
	float: left;
	width: 220px;
	margin-right: 37px;
}


/* Form Tag
-----------------------------------*/

#form_img{
	margin: 98px 0 16px 76px;
}

form{
	clear: both;
	margin: 0 0 0 140px;
	padding: 0;
	padding: 16px;
	border: solid 1px #CCC;
	cursor: pointer;
	width: 600px;
	background-color: #FFF;
	text-align: center;
}

fieldset{
	display: block;
	margin: 0;
	padding: 15px 10px;
	border: none;
	border-bottom: dotted 1px #CCC;
	clear: left;
}

legend{
	font-size: 1.1em;
	color: #666;
	font-weight: bold;
}

label{
	float: left;
	width: 100px;
	margin: 0 0 10px 0;
	padding: 2px 0 3px 6px;
	text-align: left;
	border-left: solid 4px #666;
}

input, select, textarea{
	float: left;
	width: 130px;
	padding: 2px 5px;
	margin: 0 20px 10px 0;
	background-color: #FAFAFA;
	border: solid 1px #A4B97F;
}

select{
	width: 130px;
	padding: 2px;
	margin: 0 20px 10px 0;
	background-color: #FAFAFA;
	border: solid 1px #A4B97F;
	color: #666;
}

input:hover, select:hover, textarea:hover, input:focus, select:focus, textarea:focus{
	border: solid 1px #A4B97F;
	background-color: #FFF;
}

.form_coment{
	clear: left;
	font-size: 10px;
	color: #666;
	margin: 0;
	padding-left: 110px;
	height: 12px;
	font-size: 10px;
	text-align: left;
}

div.form_coment span{
	margin-left: 146px;
}

#form_box{
	clear: left;
	margin: 13px 0 0 110px;
	border-top: dotted 1px #CCC;
	padding-top: 13px;
}

.form1{
	width: 240px;
}

.form2{
	width: 53px;
	margin-right: 50px;
}

.form3{
	width: 95px;
}

.form4{
	width: 195px;
}

.form5{
	width: 435px;
	height: 125px;
}

.lebel2{
	float: left;
	width: 20px;
	margin: 0;
	padding: 2px 0 3px 0;
	text-align: left;
	border: none;
}

.lebel3{
	float: left;
	width: 65px;
	margin: 0;
	padding: 2px 0 3px 0;
	text-align: left;
	border: none;
}

.lebel4{
	float: left;
	width: 48px;
	margin: 0;
	padding: 2px 0 3px 0;
	text-align: left;
	border: none;
}

.field_short{
	float: left;
	margin: 0;
	padding: 15px 10px;
	border: none;
	border-bottom: dotted 1px #CCC;
	width: 280px;
	clear: none;
}

.none{
	display: none;
}

#form_botton{
	float: right;
	margin: 30px 215px 15px 0;
	width: 170px;
	height: 34px;
	text-align: center;
}