@charset "UTF-8";

/*-------------------------------------------------
    common
=================================================*/
  
body {
	font-family: "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
    font-size: 14px;
    color: #333;
	line-height: 1.8;
	background:#fff;
	text-align: center;
	-webkit-text-size-adjust: 100%;
	word-break:break-word;
}

::-moz-selection {
    background: #000;
    color: #a8a07a;
    text-shadow: none;
}

::selection {
    background: #000;
    color: #a8a07a;
    text-shadow: none;
}


/* リンク
------------------------------------------*/
a{
	color: #77aa00;
	text-decoration: underline;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

a:hover{
	text-decoration: none;
}

a:visited {
	color: #77aa00;
	}

a.effect:hover{
	opacity:0.8;
	filter: alpha(opacity=80);
	-ms-filter: "alpha( opacity=80 )";
}



/* 共通class
------------------------------------------*/
.clearfix:after,
section:after {
	content: "";
	display: block;
	clear: both;
	visibility: hidden;
	height: 0;
}
.clearfix {
	display: inline-block;
}
/* hide macie ¥*/
*html .clearfix {
	height: 1%;
}
.clearfix {
	display: block;
}

.clear {
	clear: both;
}


/*フォント*/
.fw_b {
	font-weight: bold;
}
.fs_11 {
	font-size: 85%;
}
.fs_12 {
	font-size: 92%;
}
.fs_14 {
	font-size: 107%;
}
.fs_16 {
	font-size: 122%;
}
.fs_18 {
	font-size: 136%;
}
.fs_48 {
	font-size: 364%;
}

.mt0 {margin-top:0 !important;}
.mt5 {margin-top:5px !important;}
.mt10 {margin-top:10px !important;}
.mt15 {margin-top:15px !important;}
.mt20 {margin-top:20px !important;}
.mt30 {margin-top:30px !important;}
.mt40 {margin-top:40px !important;}
.mt50 {margin-top:50px !important;}

.mr0 {margin-right:0 !important;}
.mr5 {margin-right:5px !important;}
.mr10 {margin-right:10px !important;}
.mr15 {margin-right:15px !important;}
.mr20 {margin-right:20px !important;}
.mr30 {margin-right:30px !important;}
.mr40 {margin-right:40px !important;}
.mr50 {margin-right:50px !important;}

.mb0 {margin-bottom:0 !important;}
.mb5 {margin-bottom:5px !important;}
.mb10 {margin-bottom:10px !important;}
.mb15 {margin-bottom:15px !important;}
.mb20 {margin-bottom:20px !important;}
.mb30 {margin-bottom:30px !important;}
.mb40 {margin-bottom:40px !important;}
.mb50 {margin-bottom:50px !important;}

.ml0 {margin-left:0 !important;}
.ml5 {margin-left:5px !important;}
.ml10 {margin-left:10px !important;}
.ml15 {margin-left:15px !important;}
.ml20 {margin-left:20px !important;}
.ml30 {margin-left:30px !important;}
.ml40 {margin-left:40px !important;}
.ml50 {margin-left:50px !important;}

.ml-5 {margin-left:-5px !important;}

sup {
	font-size: 9px;
	vertical-align: super;
	line-height: 1;
}

.tal {text-align:left !important;}
.tar {text-align:right !important;}
.tac {text-align:center !important;}

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

.gray {color:#999;}
.red {color:#ff0000;}

.ofauto {
	overflow:auto;
	}
	
.vbottom {vertical-align:bottom;}

p {
	margin:0;
	padding:0;
	}

/*------------------------------------------*/


header {
	width:950px;
	height:97px;
	margin:0 auto;
	text-align:left;
	position:relative;
	}
	
header .logo {
	position:absolute;
	top:21px;
	left:0;
	}	

header h1 {
	position:absolute;
	top:57px;
	left:298px;
	font-size:14px;
	font-weight:normal;
	margin:0;
	padding:0;
	}

header .tel {
	position:absolute;
	top:0;
	right:0;
	}	
	
nav#gnavi {
	background:url("../images/navi_bg.png") repeat-x top left;
	height:64px;
	position:relative;
	z-index:100;
}

nav#gnavi ul {
	width:950px;
	margin:0 auto;
	padding:0;
	overflow:hidden;
}

nav#gnavi ul li {
	margin:0;
	padding:0;
	list-style:none;
	float:left;
}

.catchwrap {
	margin-top:-10px;
	min-width:950px;
	/width:950px;
	overflow:hidden;
	}
	
.catchwrap .catch {
	margin:0 -125px;
	}	

.pankuzu {
	width:950px;
	margin:0 auto;
	text-align:left;
	margin-bottom:10px;
	font-size:12px
	}

h2.pagetitle {
	margin:0 0 20px;
	padding:0;
	}

#contents {
	margin:0 auto;
	width:950px;
	overflow:hidden;
	text-align:left;
	}

#contents.local {
	background:url("../images/local_bg.png") repeat-y top center;
	margin-bottom:37px;
}

#leftcolumn {
	width:670px;
	float:left;
	}

#rightcolumn {
	width:250px;
	float:right;
	}

section {
	position:relative;
	margin:0 0 37px 0;
	overflow:hidden;
	}

#rightcolumn section {
	padding:15px;
	margin:0;
	}

#rightcolumn section.access {
	border-bottom:1px solid #fff;
	}

#rightcolumn section.access .map {
	border:1px solid #b3a89a;
	}

#rightcolumn section.access .map iframe {
	vertical-align:middle;
	}

#rightcolumn section h2 {
	padding:0;
	margin:0 0 8px;
	line-height:1;
	font-size:10px;
	}


#rightcolumn section ul {
	margin:0;
	padding:0;
	}

#rightcolumn section ul li {
	margin:0 0 10px;
	padding:0;
	list-style:none;
	text-align:center;
	}



section#top_point {
	background:#f6f1e9;
	padding:18px 0 50px 0;
	border-top:7px solid #97d011;
	border-bottom:1px solid #e6ddcf;
	}
	
section#top_point .inner {
	margin:0 auto;
	width:950px;
	text-align:left;
	position:relative;
	}
	
section#top_point h2 {
	margin:0 0 18px;
	padding:0;
	}
	
section#top_point .btn {
	position:absolute;
	top:11px;
	right:0;
	}
	
section#top_point ul {
	margin:0 0 0 -30px;
	padding:0;
	overflow:hidden;	
	}
	
section#top_point ul li {
	margin:0 0 0 30px;
	padding:0;
	width:215px;
	float:left;
	list-style:none;
	}
	
section#top_point ul li h3 {
	margin:0 0 0 0;
	padding:0;
	color:#72a200;
	font-size:16px;
	}
	
section#latest_case {}

section#latest_case .btn {
	position:absolute;
	top:0px;
	right:0;
	}
	


section#latest_case h2 {
	margin:0 0 13px 0;
	padding:0;
	background:url("../images/top_hw_case_line.png") repeat-x center center;
	}

section#latest_case ul {
	margin:0 0 0 -26px;
	padding:0;
	}
	
section#latest_case ul li {
	margin:0 0 0 26px;
	padding:0;
	width:218px;
	list-style:none;
	float:left;
	}
section#latest_case ul li a {
	text-decoration:none;
	display:block;
}
section#latest_case ul li a:hover {
	opacity:0.8;
	filter: alpha(opacity=80);
	-ms-filter: "alpha( opacity=80 )";
}
	
section#latest_case ul li .photo {
	border:1px solid #cbcbcb;
}

section#latest_case ul li .photo img {
	border:4px solid #fff;
	width:208px;
}

section#latest_case ul li h3 {
	color:#6e5632;
	font-size:16px;
	margin:0;
	padding:5px 0 0;
}

section#latest_case ul li .class {
	border-bottom:1px dotted #97d011;
	background:url("../images/icon_checkbox.png") no-repeat left center;
	padding:0 0 0 20px;
	margin:0 0 5px;
	color:#333;
	font-weight:bold;
}

section#latest_case ul li .paint {
	padding:0 0 0 20px;
	color:#333;
	line-height:1.3;
}


section#caselist {
	margin-bottom:17px;
	}


section#caselist ul {
	margin:0 0 0 -20px;
	padding:0;
	}
	
section#caselist ul li {
	margin:0 0 20px 20px;
	padding:0;
	width:210px;
	list-style:none;
	float:left;
	}
	
section#caselist ul li:nth-child(3n+1) {
	clear:both;
}
	
section#caselist ul li a {
	text-decoration:none;
	display:block;
}
section#caselist ul li a:hover {
	opacity:0.8;
	filter: alpha(opacity=80);
	-ms-filter: "alpha( opacity=80 )";
}
	
section#caselist ul li .photo {
	border:1px solid #cbcbcb;
}

section#caselist ul li .photo img {
	border:4px solid #fff;
	width:200px;
}

section#caselist ul li h3 {
	color:#6e5632;
	font-size:16px;
	margin:0;
	padding:5px 0 0;
}

section#caselist ul li .class {
	border-bottom:1px dotted #97d011;
	background:url("../images/icon_checkbox.png") no-repeat left center;
	padding:0 0 0 20px;
	margin:0 0 5px;
	color:#333;
	font-weight:bold;
}

section#caselist ul li .paint {
	padding:0 0 0 20px;
	color:#333;
}




section#case_detail {
	background:url("../images/case_frame.png") no-repeat top left;
	padding:440px 0 0 0;
	}

section#case_detail h3 {
	position:absolute;
	top:15px;
	left:30px;
	width:610px;
	color:#6e5632;
	font-size:20px;
	margin:0;
	padding:0;
	line-height:1em;
}

section#case_detail .class {
	position:absolute;
	top:59px;
	left:53px;
	width:590px;
	font-size:20px;
	font-weight:bold;
	line-height:1em;
}




section#case_detail .class .paint {
	font-size:14px;
	display:inline-block;
	position:relative;
	top:-3px;
	left:10px;
}

section#case_detail .class .paint strong {
	color:#6e5632;
}

section#case_detail .comment {
	
}

section#case_detail .comment h4 {
	float:left;
	margin:0;
	padding:0;
}

section#case_detail .comment .text {
	float:left;
	width:522px;
	background:#f6f1e9;
	border-radius:5px;
	padding:15px 15px;
	margin-top:10px;
}


section#case_detail .photo_before {
	position:absolute;
	left:20px;
	top:197px;
	width:221px;
	height:164px;
	background:#fff;
}

section#case_detail .photo_after {
	position:absolute;
	left:266px;
	top:145px;
	width:383px;
	height:266px;
	background:#fff;
}

section#case_photo {}

section#case_photo h3 {
	margin-bottom:10px;
	}

section#case_photo ul {
	margin:0 0 0 -5px;
	padding:0;
	}

section#case_photo ul li {
	margin:0 0 5px 5px;
	padding:0;
	width:220px;
	background:#eee;
	list-style:none;
	float:left;
	}
	
	
	
section#company {}

section#company dl {
	margin:0 0 37px;
	padding:0;
	}

section#company dt {
	font-size:16px;
	color:#6e542c;
	margin:10px 0 0 0;
	padding:0;
	font-weight:bold;
	}

section#company dd {
	margin:0 0 0 1em;
	padding:0;
	}

section#company table {
	border:1px solid #c9c9c9;
	}

section#company table th {
	background:#f6f1e9;
	border:1px solid #c9c9c9;
	padding:10px 20px;
	white-space:nowrap;
	color:#6e542c;
	text-align:left;
	}

section#company table td {
	border:1px solid #c9c9c9;
	padding:10px 20px;
	}

section#company table td strong {
	font-size:24px;
	line-height:0.9em;
	display:block;
}


section#company table td strong rb {
}

section#company table td rp,
section#company table td rt {
	font-size:10px;
	}



	
section#point {}

section#point h3 {
	margin:0 0 10px;
	padding:0;
	text-align:center;
	}

section#point ul {
	margin:0;
	padding:0;
	}

section#point ul li {
	margin:0;
	padding:0;
	width:315px;
	float:left;
	list-style:none;
	}
section#point ul li h4 {
	margin:0 0 8px;
	padding:0;
	border-bottom:1px dotted #c9c9c9;
	
	}
section#point ul li p {
	margin:0 0 8px;
	}
section#point ul li.point1 {
	padding:0 20px 8px 0;
	border-right:1px solid #c9c9c9;
}

section#point ul li.point1 .bb {
	border-bottom:1px dotted #c9c9c9;
	padding-bottom:8px;
}

section#point ul li.point1 strong {
	color:#6E542C;
}

section#point ul li.point2 {
	padding:0 0px 8px 19px;
}

section#point ul li.point3 {
	clear:both;
	padding:20px 20px 0px 0;
	border-top:1px solid #c9c9c9;
}

section#point ul li.point4 {
	padding:20px 0px 0px 19px;
	border-top:1px solid #c9c9c9;
	border-left:1px solid #c9c9c9;
}



section#staff {}

section#staff ul {
	margin:0 0 0 -24px;
	padding:0;
	}

section#staff ul li {
	margin:0 0 24px 24px;
	padding:30px 20px 20px;
	background:url("../images/staff_frame.png") no-repeat;
	width:283px;
	height:349px;
	float:left;
	list-style:none;
	line-height:1.4;
	}

section#staff ul li h3 {
	font-size:16px;
	color:#6e542c;
	border-bottom:1px dotted #c9c9c9;
	margin:10px 0 10px 0 ;
	padding:0 0 5px 0;
}

section#staff ul li h3 span {
	font-size:14px;
	color:#333;
	font-weight:normal;
}



section#pagefoot {
	margin-bottom:0;
	}

.gotop {
	width:950px;
	text-align:right;
	margin:0 auto;
	padding:0;
}

footer {
	background:url("../images/footer_bg.png") repeat center top;
	padding:23px 0 43px;
	}

footer .inner {
	width:950px;
	margin:0 auto;
	overflow:hidden;
	}
	
footer nav {
	float:left;
	color:#57401d;
	}
footer nav a,
footer nav a:visited {
	color: #57401d;
}


footer .copyright {
	float:right;
	}
	
.sp{display:none;}	
	
	
/*スマホサイズ用スタイル*/
@media screen and (min-width:580px) and (max-width:950px){
	body {zoom:0.8;}

}


@media screen and (max-width:580px){
	.sp { display:block; }
	.pc { display:none; }

	img {
		max-width:100%;
		height:auto;
		}

	header {
		width:100%;
		height:auto;
		margin:0 auto;
		text-align:center;
		}

	header .logo {
		position:relative;
		top:0;
		left:0;
		margin-top:20px;
		}	
	
	header h1 {
		position:relative;
		top:0;
		left:0;
		font-size:10px;
		padding:0px 0 20px;
		}
	
	header .tel {
		position:relative;
		top:0;
		left:0;
		margin-bottom:20px;
		}	

	header .tel img {
		border-radius:5px;
		}	

	nav#gnavi {
		background:url("../images/navi_bg.png") repeat-x top left;
		height:64px;
		position:relative;
		z-index:100;
	}
	
	nav#gnavi ul.sp {
		width:94%;
		margin:0 auto;
		padding:0;
		overflow:hidden;
		display:table;
	}
	
	nav#gnavi ul.sp li {
		margin:0;
		padding:0;
		list-style:none;
		float:none;
		display:table-cell;
		vertical-align:middle;
		line-height:1.3;
		height:54px;
	}

	nav#gnavi ul.sp li a {
		display:block;
		font-size:12px;
		text-decoration:none;
		color:#fff;
		font-weight:bold;
		text-shadow:0 1px 5px rgba(90,128,0,0.7);
	}


	section {
		width:90%;
		margin:0 auto 37px ;
		}

	.catchwrap {
		margin-top:-10px;
		min-width:100%;
		/width:100%;
		overflow:hidden;
		}
	.catchwrap .catch {
		margin:0 -10%;
		}	

	#contents {
		width:100%;
		}

	section#top_point {
		width:100%;
		}

	section#top_point .inner {
		width:90%;
		position:relative;
		}

	section#top_point h2 {
		margin:0 0 18px;
		padding:0;
		}
		
	section#top_point .btn {
		position:relative;
		top:0;
		right:0;
		text-align:center;
		}
		
	section#top_point ul {
		margin:0 0 0 0;
		padding:0;
		overflow:hidden;	
		}
		
	section#top_point ul li {
		margin:0 0 20px 0;
		padding:0;
		width:100%;
		float:none;
		}
		
	section#top_point ul li h3 {
		margin:0 0 0 0;
		padding:0;
		color:#72a200;
		font-size:16px;
		}


	section#latest_case{
		width:100%;
		}
	
	section#latest_case h2{
		width:90%;
		margin:0 auto 20px;
		}
	
	section#latest_case .btn {
		position:relative;
		top:0px;
		right:0;
		text-align:center;
		}
	
	section#latest_case ul {
		margin:0 0 0 0;
		padding:0;
		overflow:hidden;
		}
		
	section#latest_case ul li {
		margin:0 0 5% 5%;
		padding:0;
		width:42%;
		list-style:none;
		float:left;
		}
	section#latest_case ul li a {
		text-decoration:none;
		display:block;
	}
	section#latest_case ul li a:hover {
		opacity:0.8;
		filter: alpha(opacity=80);
		-ms-filter: "alpha( opacity=80 )";
	}
		
	section#latest_case ul li .photo {
		border:1px solid #cbcbcb;
	}
	
	section#latest_case ul li .photo img {
		border:none;
		width:100%;
	}
	
	section#latest_case ul li h3 {
		color:#6e5632;
		font-size:16px;
		margin:0;
		padding:5px 0 0;
	}
	
	section#latest_case ul li .class {
		border-bottom:1px dotted #97d011;
		background:url("../images/icon_checkbox.png") no-repeat left center;
		padding:0 0 0 20px;
		margin:0 0 5px;
		color:#333;
		font-weight:bold;
	}
	
	section#latest_case ul li .paint {
		padding:0 0 0 20px;
		color:#333;
	}


	.gotop {
		width:100%;
		text-align:center;
	}
	footer .inner {
		width:90%;
		text-align:center;
		}

	footer .inner nav {
		float:none;
		margin-bottom:20px;
		}

	footer .inner .copyright {
		font-size:10px;
		float:none;
		}


	#contents.local {
		background:none;
		margin-bottom:37px;
	}
	
	#leftcolumn {
		width:100%;
		float:none;
		margin:0 auto;
		}
	
	#leftcolumn h2 img {
		width:580px;
		max-width:580px;
		}
	
	#rightcolumn {
		width:100%;
		float:none;
		margin:0 auto 0px;
		background:#F0F0F0;
		padding:15px 0;
		text-align:left;
		}
	
	
	#rightcolumn section {
		width:90%;
		padding:0 0 0px;
		margin:0 auto 0px;
		}
	
	
	#rightcolumn section.access {
		padding:0 0 15px;
		margin:0 auto 15px;
		}
	
	#rightcolumn section.access .map {
		margin-bottom:10px;
		}
	
	#rightcolumn section.access .map iframe {
		vertical-align:middle;
		width:100%;
		}
	
	#rightcolumn section h2 {
		padding:0;
		margin:0 0 15px;
		line-height:1;
		font-size:10px;
		}
	
	
	#rightcolumn section ul {
		margin:0;
		padding:0;
		}
	
	#rightcolumn section ul li {
		margin:0 0 10px;
		padding:0;
		list-style:none;
		text-align:center;
		}

	.pankuzu {
		width:90%;
		margin:3px auto 10px auto;
		}



	
	section#point {}
	
	
	section#point ul li {
		width:100%;
		float:none;
		}
	section#point ul li h4 {
		margin:0 0 8px;
		padding:0;
		border-bottom:none;
		
		}
	section#point ul li p {
		margin:0 0 8px;
		}
	section#point ul li.point1 {
		padding:0 0px 8px 0;
		border-right:none;
	}
	
	section#point ul li.point1 .bb {
		border-bottom:none;
		padding-bottom:8px;
	}
	
	section#point ul li.point2 {
		padding:0 0px 8px 0px;
	}
	
	section#point ul li.point3 {
		clear:both;
		padding:0px 0px 8px 0;
		border-top:none;
	}
	
	section#point ul li.point4 {
		padding:0px 0px 0px 0px;
		border-top:none;
		border-left:none;
	}
	section#pagefoot {
		margin-bottom:38px;
		}




	section#company {}
	
	
	section#company table {
		border:1px solid #c9c9c9;
		border-bottom:none;
		}
	
	section#company table th {
		background:#f6f1e9;
		border:none;
		border-bottom:1px solid #c9c9c9;
		padding:10px 20px;
		white-space:nowrap;
		color:#6e542c;
		text-align:left;
		display:block;
		}
	
	section#company table td {
		border:none;
		border-bottom:1px solid #c9c9c9;
		padding:10px 20px;
		display:block;
		}




	section#staff {
		margin-bottom:0;
		}
	
	section#staff ul {
		margin:0 0 0 0;
		padding:0;
		}
	
	section#staff ul li {
		margin:0 0 24px 0;
		padding:0;
		background:#f8f8f8;
		border:1px solid #e6e6e6;
		width:99%;
		height:auto;
		float:none;
		list-style:none;
		line-height:1.4;
		}
	section#staff ul li img {
		width:100%;
	}
	section#staff ul li h3 {
		font-size:16px;
		color:#6e542c;
		border-bottom:1px dotted #c9c9c9;
		margin:10px 10px 10px 10px ;
		padding:0 0 5px 0;
	}
	
	
	section#staff ul li p {
		margin:10px 10px 10px 10px ;
		padding:0 0 0 0;
	}
	
	section#staff ul li h3 span {
		font-size:14px;
		color:#333;
		font-weight:normal;
	}




	section#caselist {
		margin-bottom:17px;
		width:100%;
		}
	
	
	section#caselist ul {
		margin:0 0 0 0px;
		padding:0;
		}
		
	section#caselist ul li {
			margin:0 0 5% 5%;
			padding:0;
			width:42%;
		list-style:none;
		float:left;
		}
		
	section#caselist ul li:nth-child(3n+1) {
		clear:none;
	}
	
	section#caselist ul li:nth-child(2n+1) {
		clear:both;
	}
	
		
	section#caselist ul li a {
		text-decoration:none;
		display:block;
	}
	section#caselist ul li a:hover {
		opacity:0.8;
		filter: alpha(opacity=80);
		-ms-filter: "alpha( opacity=80 )";
	}
		
	section#caselist ul li .photo {
		border:1px solid #cbcbcb;
	}
	
	section#caselist ul li .photo img {
			border:none;
			width:100%;
	}
	


	



section#case_detail {
	background:none;
	padding:0 0 0 0;
	}

section#case_detail h3 {
	position:relative;
	top:0px;
	left:0px;
	width:100%;
	color:#6e5632;
	font-size:20px;
	margin:0 0 15px;
	padding:0 0 10px;
	line-height:1em;
	border-bottom :1px dotted #aaaaaa;
}

section#case_detail .class {
	position:relative;
	top:0px;
	left:0px;
	width:100%;
	font-size:20px;
	font-weight:bold;
	line-height:1em;
}




section#case_detail .class .paint {
	font-size:14px;
	display:inline-block;
	position:relative;
	top:0px;
	left:0px;
	width:100%;
	margin-bottom:15px;
}


section#case_detail .comment {
	
}

section#case_detail .comment h4 {
	float:left;
	margin:0;
	padding:0;
	width:59px;
}

section#case_detail .comment .text {
	float:none;
	width:auto;
	background:#f6f1e9;
	border-radius:5px;
	padding:15px 15px;
	margin-top:10px;
	overflow:auto;
}


section#case_detail .photo_before {
	position:relative;
	top:0px;
	left:0px;
	width:90%;
	height:auto;
	background:url("../images/case_frame_sp.png") no-repeat center bottom #fff;
	background-size:100%;
	text-align:left;
	padding:0 5% 15px;
}

section#case_detail .photo_before img {
	border:5px solid #fff;
	box-shadow:0 0 1px #aaa;
	width:50%;
}
section#case_detail .photo_after {
	position:relative;
	top:0px;
	left:0px;
	width:100%;
	height:auto;
	background:#fff;
	text-align:center;
	padding:0 0 15px 0;
}

section#case_detail .photo_after img {
	border:5px solid #fff;
	box-shadow:0 0 1px #aaa;
	width:90%;
}


section#case_photo {
	width:100%;
	margin-bottom:17px;
	}

section#case_photo h3 {
	margin:0 auto 15px;
	width:90%;
	}

section#case_photo ul {
	margin:0 0 0 0;
	padding:0;
	}

section#case_photo ul li {
	margin:0 0 5% 5%;
	padding:0;
	width:42%;
	background:#eee;
	list-style:none;
	float:left;
	}
	


}