@charset "utf-8";
/* CSS Document */

/*共通部分*/
body {
      font-size: 1.4rem;
      color: #444444;
      line-height: 1.4;
}

a{color:#333;text-decoration:none;}
a:hover{text-decoration:none;}
a img:hover {
      opacity:.7;
}
img{
	max-width:100%;
	}
.font_l{font-size:140%;}
.font_s{font-size:80%;}

.tab_none{
	display:none;
	}
.sp_none{
	display:none ;
	}
.color01{color: #38A64C;}
.color02{color: #0084B3;}
.color03{color:#2973DF}
.color04{color:#00A2DB}
.back01{background:#F4F4F4;}
.back02{background-image:url(../img/common/back01.gif);}
.back03{background-image:url(../img/common/back02.gif);}
.back04{background:#F9FDFA;}
.back05{background:#00A2DB !important;}
.back06{background:#FF8000 !important;}
.scrap_back{background-color:#008D1A;color: #FFFFFF}
.disused_back{background-color:#FF8000;color: #FFFFFF}
.garbage_back{background-color:#00A2DB;color: #FFFFFF}
.pt30{padding-top:30px;}
.pb60{padding-bottom:60px;}
.mb30{margin-bottom:30px !important;}
.mb20{margin-bottom:20px !important;}
.auto{width:auto !important;}
.txt_center{
	text-align:center !important;
	margin-bottom:30px;
	}
.txt_right{
	text-align:right;
	}
.txt_left{
	text-align:left;
	}
.modal{
	text-align:center;
	}
.modal img{
	width:70%;
	}
.halfsp>*{
	width:48%;
	text-align:center;
	float:left;
	box-sizing:border-box;
	margin-right:4%;
	}
.halfsp>*:nth-child(2n){
	margin-right:0;
}
.pattern02 img {
      width: 100%;
}
.pattern03 img {
      width: 100%;
}
.cover {
      margin:0 auto;
 	  max-width: 1000px;
}
.maparea{
	position:relative;
	padding-bottom:40%;
	height:0;
	overflow:hidden;
	margin-bottom:20px;
	}
.maparea iframe{
	position:absolute;
	left:0;
	top:0;
	width:100% !important;
	height:100% !important;
	}
/*ナビ*/

nav{
	background-color: #38A64C;
}
nav li{
	border-bottom:1px solid #EEEEEE;
}
nav li a{
	display: block;
	padding:3% 10%;
	color:#fff;
}/*ナビend*/
/* ------------------------------------------------------*/
/* clearfix huck */
/* ------------------------------------------------------*/
.clearfix{
    display: inline-table;
    zoom: 1;
}
.clearfix:after{
    content: ".";
    height: 0px;
    clear: both;
    display: block;
    visibility: hidden;
}
/* Hides from IE-mac ＼*/
* html .clearfix {
    height: 1%;
}
.clearfix {
    display: block;
}
/* End hide from IE-mac */

@media screen and (min-width:768px){

	.tab_none{
	display:block ;
	}
	.pc_none{
	display:none !important;
	}

body {
      font-size: 14px;
      color: #444444;
      line-height:1.9;
}

.pattern02 .lefttxt {
      float: left;
	  width: 50%;
}
.pattern02 .righttxt {
      float: right;
	  width: 50%;
}
.pattern02 .leftimg {
      float: left;
	  width: 50%;
}
.pattern02 .rightimg {
      float: right;
	  width: 50%;
}
.lefttxt,.righttxt, .txt{

}
.pattern03{
	width:100%;
	display:table;
}
.pattern03 .lefttxt {
      display:table-cell;
	  vertical-align:middle;
}
.pattern03 .righttxt {
      display:table-cell;
	  vertical-align:middle;
}
.pattern03 .leftimg {
      display:table-cell;
	  vertical-align:middle;
}
.pattern03 .rightimg {
      display:table-cell;
	  vertical-align:middle;
}
.column3{
	clear:both;
	}
.column3 li{
	float:left;
	width:30%;
	margin-bottom:40px;
	margin-right:5%;
	}
.column3 li:nth-child(3n){
	margin-right:0;
	}
.column3 li>*{
	margin-bottom:10px;
	}
.column4{
	clear:both;
	}
.column4 li img{
	width:100%;
}
.column4 li{
	float:left;
	width:22%;
	margin-bottom:30px;
	margin-right:4%;
	}
.column4 li:nth-child(4n){
	margin-right:0;
	}
.column4 li>*{
	margin-bottom:10px;
	}
.halfsp>*{
	width:inherit;
	text-align:center;
	float:none;
	margin-right:0;
	}

	/*ナビ*/
	nav li{
		border-bottom: none;
		border-top: none !important;
}
	nav li a{
	padding:10% 5%;
}/*ナビ*/
}
@media screen and (min-width:1000px){

.sp_none{
	display:inherit;
	}

} /*共通部分end*/


/*ヘッダー*/
h1{
	display: none;
	font-size:1.2rem;
	padding: 5px;
}
#header_top{
	padding: 2%;
	border-bottom:3px solid #38A64C;
}
#logo{
	float: left;
	
}
#logo img{
	width:100%;
	
}
#nav-open{
	width:10%;
	vertical-align:middle;
	float: right;
	}
#nav-open .menu-trigger,.menu-trigger span {
	display: inline-block;
	transition: all .4s;
	box-sizing: border-box;
	}
#nav-open .menu-trigger {
	position: relative;
	width: 100%;
	height:40px;
	text-align: center;
	}
#nav-open .menu-trigger span{
	width:80%;
	height:3px;
	background-color:#000;
	display:inline-block;
	position:absolute;
	top:50%;
	left:0;
	transition: all .2s;
    text-align: center;
	}
#nav-open .menu-trigger span:last-child{
-moz-transform: rotate(-90deg);
-webkit-transform: rotate(-90deg);
-o-transform: rotate(-90deg);
-ms-transform: rotate(-90deg);}
#nav-open .menu-trigger.active span{
-moz-transform: rotate(-45deg);
-webkit-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);}
#nav-open .menu-trigger.active  span:last-child{
-moz-transform: rotate(-135deg);
-webkit-transform: rotate(-135deg);
-o-transform: rotate(-135deg);
-ms-transform: rotate(-135deg);}
#gnav{
	display: none;
}
#gnav li:first-child{
	border-top:1px solid #EEEEEE;
}
@media screen and (min-width:480px){}
@media screen and (min-width:768px){
	h1{display: block;}
	#logo{
		float: left;
		width: 30%;
		margin-right: 3.3333%;
	}
	#header_top{
			border-bottom:none;
		}
	#header_right{
		float: right;
		width: 60%;
	}
	#tel,#mail{
		float: left;
		width: 50%;
		text-align: center;
	}
	#gnav{
		display: block;
		border-bottom: 4px solid #EEEEEE;
		border-top: 4px solid #EEEEEE;
	}
	#gnav ul{
		display: table;
		width: 100%;
		max-width:1000px;
		margin: 0 auto;
	}
	#gnav li{
		display: table-cell;
		width: 16.6666%;
		text-align: center;
		position: relative;
	}
	#gnav li:hover{
		background-color:#096d14;
	}
	#gnav li a:after{
		content: "";
		width: 1px;
		height: 40px;
		background-color: #1F8A2B;
		position: absolute;
		right:0;
		top:50%;
		margin-top: -20px;
	}
	#gnav li:last-child a:after{
		content: none;
	}
}
@media screen and (min-width:1000px){
		#header_right{
		width: 50%;
	}
}


/*フッター*/

#addr{
	padding: 3%;
	text-align: center;
	
}
#copy{
	text-align: center;
	background-color: #38A64C;
	color:#FFFFFF;
	padding: 10px 0;
}
@media screen and (min-width:480px){}
@media screen and (min-width:768px){
	footer{
		border-top: 3px solid #38A64C;
	}
	#footer_top{
		padding: 20px 0 10px;
	}
	#sitemap{
		background-color: inherit;
	}
	#sitemap ul{
		float: left;
		width: 31.3333%;
		padding: 0 1%;
		text-align: left;
	}
	#sitemap ul li{
		margin-bottom: 3%;
	}
	#sitemap ul:last-child{
		margin-right: 0%;
	}
	#sitemap a{
		display: inline;
		color: #000;
		padding: inherit;
	}
	#sitemap li:before{
		content: "▶";
		margin-right: 5%;
		text-decoration: none;
	}
	#sitemap a:hover{
		text-decoration: underline;
	}

}
@media screen and (min-width:1000px){
	
	#footer_top{
		padding: 40px 0;
	}
	#sitemap{
		width: 65%;
		float: left;
	}
	#sitemap ul{
		width: 200px;
	}
	#addr{
		padding: 0;
		float: right;
		text-align: right;
	}

} /*フッダーend*/



/*サイド*/


#side{
	padding-top:30px;
	text-align: center;
}
#side section{
	width: 80%;
	margin: 0 auto;
	border: 3px solid #eee;
	margin-bottom: 5%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}
#side section li:hover{
	background-color:#f0f8ff;
}

#side_contact{
	border:none !important;
	}
#side section h2.ttl{
	padding: 10px;
}
#side section img{
	width: 100%;
}
@media screen and (min-width:480px){}
@media screen and (min-width:768px){
	 #side #side_contact{
		display: none;
	}
	.side_left{width: 50%;float: left;}
	.side_right{width: 50%;float: left;}
/*	#side #side_scrap,#side #side_disused,#side #side_garbage{
		width: 30%;
		float: left;
		margin-right: 5%;
	}
	#side #side_garbage{
		margin-right: 0;
	}
	#side #side_access,#side #side_blog{
		width: 40%;
		float: left;
	}
	#side #side_blog{
		width: 40%;
	}*/
}
@media screen and (min-width:1000px){
	
	#logo{
		float: left;
		width: 30%;
		margin-right: 3.3333%;
	}
	
	#side{
	float: left;
	width: 23%;
}
	#side #side_contact .ttl{
		font-weight: normal;
	}
	#side section, #side #side_contact{
		display: block;
		width: 100%;
		margin-bottom: 30px;
	}
	.side_left,.side_right{width:100%;float: none;}
	#side .innerlist li:last-child a{
		border-bottom: none;
	}
	#side .innerlist a{
		display: block;
		width: 90%;
		margin:0 auto;
		padding: 10px 0;
		border-bottom: 1px solid #ccc;
		position: relative;
	}
	#side .innerlist a:after{
		content: ">";
		position: absolute;
		right: 3%;
	}
}

/*コンテンツ*/
main{
	padding: 20px  0 4%;
}
#content{
	margin-bottom:10%;
}
#content>section{
margin-bottom:8%;
}

.section_ttl{
	
}
.section_ttl{
	position: relative;
}

#page-top{
	position:fixed;
	bottom:20px;
	right:20px;
	}
.ttl_border{
	padding: 20px 0 10px;
	font-weight: normal;
	margin-bottom: 30px;
	font-size: 2rem;
	padding-left:25px;
	display: block;

}

.ttl_border:after{
	position:absolute;
	bottom:0;
	left: 0;
	content:"";
	height:3px;
	width:100%;
	display:block;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#319f2d+0,319f2d+28,e4e4e4+28,e4e4e4+100 */
background: rgb(49,159,45); /* Old browsers */
background: -moz-linear-gradient(left,  rgba(49,159,45,1) 0%, rgba(49,159,45,1) 28%, rgba(228,228,228,1) 28%, rgba(228,228,228,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  rgba(49,159,45,1) 0%,rgba(49,159,45,1) 28%,rgba(228,228,228,1) 28%,rgba(228,228,228,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  rgba(49,159,45,1) 0%,rgba(49,159,45,1) 28%,rgba(228,228,228,1) 28%,rgba(228,228,228,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#319f2d', endColorstr='#e4e4e4',GradientType=1 ); /* IE6-9 */

}

#pager{
	text-align:center;

	}
#pager li{
	font-size:18px;
	display:inline-block;
	border:1px solid #0085ca;
	margin:0 4px;
	padding: 0 8px;
	text-align:center;
	}
#pager li a{
	display:block;
	color:#0085ca;
	}	
#pager li:first-child,#pager li:last-child{

	}
#pager li:first-child a,#pager li:last-child a{
	vertical-align:middle;
	}
.box_border{
	border: 2px solid #DEDEDE;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}
.lead span{
	color:#B5050B;
	font-weight:bold;
}

.inner{
	width:96%;
	margin:0 auto;
}

.btntwo{
	text-align:center;
	margin-bottom:3%;
	}
	
.btn{}
.btn a{
	display:inline-block;
	padding:2% 5%;
	background-color:#fff;
	position:relative;
	border: 2px solid #DEDEDE;
	}

.btn a:after{
    content: ">";
    background-color: #38A64C;
    color: #fff;
    border-radius: 26px;
    width: 20px;
    height: 20px;
    display: inline-block;
    text-align: center;
    line-height: 19px;
    margin-left: 10px;
	}
.btn a.color04:after{
	    background-color: #00A2DB;
}


.btn02 a {
    display: inline-block;
    padding: 2% 1%;
    position: relative;
    color: #FFFFFF;
    border-radius: 10px;
	width:200px;
}	

.btn02 a:after{
    color: #fff;
    border-radius: 26px;
    width: 20px;
    height: 20px;
    display: inline-block;
    text-align: center;
	vertical-align:middle;
    line-height: 19px;
    margin-left: 10px;
	margin-top:-5px;
	}
.btn02 a.back05:after{
    content:url(../img/common/arrow_icon03.png);
	}
.btn02 a.back06:after{
    content:url(../img/common/arrow_icon02.png);
	}
	

	
@media screen and (min-width:480px){}
@media screen and (min-width:768px){
	.btntwo p{
	display:inline;
	}
.btntwo p:first-child{
	margin-right:5%
	}
.btn02 a{
	display:inline-block;
	padding:1% 4%;
	position:relative;
	color:#FFFFFF;
	border-radius:15px;
	width: 30%;
	}
}
@media screen and (min-width:1000px){
	#content{
		width: 73%;
		float: right;
	}
}

@media (max-width: 1020px) and (min-width: 768px) {
	#logo{
		float: left;
		width: 50%;
	}	
}