body#top .intro.type1{
	margin:0;
	padding:70px 0 0;
	background:no-repeat top center;
}

body#top .area1 .intro.type1{
	background-image:url(../images/emblem_blue.png);
	margin-bottom:35px;
}

body#top .intro.type1 h2{
	margin:0 auto 10px;
	padding:0 15px 50px 15px;
	font-size:16px;
	line-height:1.2em;
	letter-spacing:-1px;
	background:no-repeat bottom center;
	position:relative;
    /*width : -webkit-calc(100% - 40px);
    width : calc(100% - 40px);*/
	overflow:hidden;
	/*width:320px;*/
	text-align:center;
}


body#top .area1 .intro.type1 h2{
	background-image:url(../images/bulldozer.png);
}


body#top .intro.type1 h2:before , body#top .intro.type1 h2:after{
	content:"";
	width:27px;
	height:3.6em;
	display:block;
	background:url(../images/leaf.png) no-repeat left center;
    -moz-background-size:auto 100%;
    background-size:auto 100%;
	position:absolute;
	top:0;
}

body#top .intro.type1 h2:before{
	left:0;
}
body#top .intro.type1 h2:after{
	right:0;
    -moz-transform: rotate(-180deg);
    -ms-transform: rotate(-180deg);
    -webkit-transform: rotate(-180deg);
}

body#top .intro.type1 h2 span{
	display:block;
}

body#top .area2{
	background:#f2f2f2;
}

body#top .area2 h3{
	float:left;
}


body#top .area2 .container > .message{
	float:left;
	padding:0.8em 0 0 1em;
}

body#top .area2 h4{
	margin:0;
	padding:0;
	color:#FFF;
	background:#333;
	line-height:32px;
	text-align:center;
}

body#top .area2 .wrap{
	width:100%;
	padding:2em 32px 20px;
	overflow:hidden;
}

body#top .area2 ul{
	margin:0;
	padding:0;
	width:100%;
	overflow:hidden;
	background-color:#FFF;
	
}

body#top .area2 li{
	margin:0;
	padding:0;
	list-style:none;
	overflow:hidden;
	font-size:12px;
	
}

body#top .area2 li img{
	width:256px;
	height:224px;
	background-color:#999;
	margin:0 0 1em;
	/*float:left;*/
	
}

body#top .area2 dl{
	margin:0 -32px 0 0;
	padding:0 0 16px;
	/*float:left;*/
}

body#top .area2 dt , body#top .area2 dd{
	line-height:16px;
	margin:0 0 0.5em;
	padding:0;
}

body#top .area2 dt{
	line-height:16px;
	width:60px;
	color:#FFF;
	background:#333;
	text-align:center;
	font-size:10px;
	position:absolute;
}

body#top .area2 dd{
	margin-left:68px;
}


body#top .area2 p.align_center:last-child img{
	background-color:#FFF;
}

	body#top .area3 h3{
		margin:0 0 0.5em;
		padding:0;
		display:inline-block;
		padding:0.4em 1.5em;
		color:#fff;
		background-color:#003399;
		font-weight:normal;
	}
	
	body#top .area3 h4{
		margin:0 0.5em 0 0;
		padding:0;
		font-size:16px;
		font-weight:bold;
		line-height:1.5em;
	}

	
	body#top .area3 h4 span{
		display:block;
	}
	
	body#top .area3 p , body#top .area3 div{
		overflow:hidden;		
	}
	
	body#top .area3 .wrap p{
		font-size:13px;
	}
	
	body#top .area3 a.arrow{
		margin-top:0.5em;
	}
	body#top .area3 {
	}
	
	
	body#top .area3 .wrap {
		background:url(../images/plant3.png) right top no-repeat;
		-moz-background-size:auto 90px;
        background-size:auto 90px;
	}
	
	body#top .area4 h3{
		margin:20px 0 0;
		padding:0;
	}
	
	body#top .area4 ul{
		margin:0;
		padding:0;
	}
	body#top .area4 li{
		margin:0;
		padding:0;
		list-style:none;
		line-height:1.5em;
	}
	
	body#top .area4 p{
		margin:0;
		padding:0;
	}
	
	body#top .area4 > ul{
		margin:0;
		padding:20px 0 0;
	}
	body#top .area4 > ul > li{
		margin:0;
		padding:0 0 20px;
	}
	
	
body#top .area4 > ul > li > a{
	display:block;
	margin:0;
	padding:0 0 0 0.5em;
	line-height:24px;
	height:25px;
	font-size:16px;
	color:#fff;
	background:url(../images/icon_arrow_14px_wg.png) right 0.5em center no-repeat #1E853C;
}

  body#top .area4 li ul , body#top .area4 li p{
	  margin:8px 0 0 8px;
	  white-space: nowrap
  }
  body#top .area4 li li:before{
	  content:"■";
	  color:#1E853C;
  }
  
  body#top .unit{
	  padding-bottom:56px;
  }
  
  body#top .area2{	  
	  padding-top:60px;
	  margin-bottom:87px;
  }
  
  body#top ul.grid{
	  margin-bottom:28px;
  }
  
  
  body#top ul.grid li a img{
	  width:100%;
	  height:auto;
	  display:block;
  }

@media screen and (min-width:480px) {
	body#top .area1 .intro.type1 h2{
		/*width:280px;*/
		width:375px;
	    padding:12px 40px 50px 55px;
	    letter-spacing:0;
	}
	body#top .intro.type1 h2:before , body#top .intro.type1 h2:after{
	    height:5em;
	}
	
    body#top .intro.type1 p span{
	    display:block;
		text-align:center;
    }
	body#top .area2 h4{
	    border:solid 1px #fff;
    }
	
	
	body#top .area3 h4{
		float:left;
	}
	

}
@media screen and (min-width:768px) {
	body#top .area1 .intro.type1 h2{
		width:auto;
		/*max-width:596px;*/
		width:696px;
		max-width:696px;
		/*height:117px;*/
		height:145px;
		font-size:22px;
	    padding:28px 50px 0px;
	    line-height:1.3em;
		padding:0;
	}
	body#top .area1 .intro.type1 h2 .wrap{
		display:block;
		background:url(../images/top/intro.png) no-repeat center top;
		width:562px;
		height:66px;
		margin:25px auto 0;
		text-indent:-9999px;
	}	
    body#top .intro.type1 h2 span{
	  display:inline;
    }
    body#top .intro.type1 h2 > span{
	  display:block;
    }
	body#top .intro.type1 h2:before , body#top .intro.type1 h2:after{
	  height:117px;
	}
	
    body#top .area2 li img{
		float:left;
	}
	
	body#top .area2 dl{
		float:left;
		margin:0 0 0 2em;
	}
}

@media screen and (min-width:960px) {
	
	body#top .area2 ul{
		width:100% !important;
	}
	body#top .area2 li{
	  float:left;
      width : -webkit-calc(100% / 3);
      width : calc(100% / 3);
	}
	
	body#top .area2 dl{
		margin:0 -32px 0 0;
	}
	
	body#top .area2 .wrap{
		border:solid 1px #333;
		border-top-width:0;
	}
	
	body#top .area3 > img{
		float:left;
		width:480px;
		height:360px;
		margin:0 20px 0 0;
		background-color:#CCC;
	}
	
	body#top .area4{
		border:solid 2px #1E853C;
		font-size:12px;
		height:150px;
	}
	
	body#top .area4 h3{
		margin:40px 0 0 20px;
		padding:0;
		float:left;
	}

	body#top .area4 > ul{
		overflow:hidden;
		float:right;
	    width: -moz-fit-content;
        width: fit-content;
	}
	body#top .area4 > ul > li{
		width:220px;
		margin:0 20px 0 0;
		float:left;
	}
}
