@charset "utf-8";
@import url(base.css);



	#imagewrapper{
		max-width:1200px;
		width:100%;
		margin:0 auto 50px;
		position:relative;
		overflow:hidden;
	}
		
@media screen and (max-width:1200px){

	#imagewrapper{
		margin-bottom:0;
	}
		
}
		
@media screen and (max-width:640px){

	#imagewrapper{overflow:hidden;}

	#imagewrapper li{
	}
		
}
	

	main{
		padding-top:0;
		position:relative;
	}
		

	
		#imagemain{
			width:100%;
		}
		
			#imagemain img{
				width:100%;
			}



		#brakenews{
			padding:30px 0 50px;
			color:#100c57;
			background-color:#f2f2f2;
			z-index:100;
		}
		
	@media screen and (max-width:1000px){

		#brakenews{
			margin:0;
		}
		
	}

	@media screen and (max-width:420px){

		#brakenews{
			padding:10px 0 30px;
		}
		
	}

		#brakenews .inner{
			max-width:1000px;
			width:90%;
			margin:10px auto 0;
		}


		#brakenews li{
			padding:15px 5px;
			list-style:none;
			border-bottom:1px dashed #ccc;
		}
		#brakenews li:nth-of-type(1){
			border-top:1px dashed #ccc;
		}
		


			#brakenews li{zoom:1;}
			#brakenews li:after{
			  content: ""; 
			  display: block; 
			  clear: both;
			}



			#brakenews h3{
				margin-bottom:10px;
			}
			
			#brakenews h3:before{
				content:url(../shared/ico_info.png);
				position:relative;
				margin-right:15px;
				top:5px;
			}

		@media screen and (max-width:770px){

			#brakenews h3{
				margin:9px 10px 0;
				font-size:0.9em;
			}
			
			#brakenews h3:before{
				margin-right:10px;
				top:5px;
			}
		}


			#brakenews .entrydate{
				width:80px;
				color:#369;
				float:left;
			}

			#brakenews p.newsentry{
				width:calc(100% - 100px);
				margin:0;
				float:right;
			}

		@media screen and (max-width:770px){

			#brakenews .entrydate{
				float:none;
			}

			#brakenews p.newsentry{
				width:100%;
				float:none;
			}

		}

/* 共通 */

	.stdsec{
		padding:50px 0 0;
	}
	
@media screen and (max-width:640px){
	.stdsec{
		padding:20px 0 0;
	}
	
}
	
@media screen and (max-width:430px){
	.stdsec{
		padding:10px 0 0;
	}
	
}



	.stdsec h2{
		margin-bottom:15px;
		color:#363;
		font-size:1.9em;
		font-family:"kozuka-mincho-pro";
	}
		
@media screen and (max-width:1100px){
	
	.stdsec h2{
		font-size:1.8em;
	}
		
}
	
@media screen and (max-width:640px){
	
	.stdsec h2{
		margin:30px 0 20px;
		line-height:1.4em;
		text-align:center;
	}
	
}
	
@media screen and (max-width:370px){
	
	.stdsec h2{
		font-size:1.6em;
	}
	
}





/* ごあいさつ */
	
	#message{
		clear:both;
		max-width:1000px;
		width:100%;
		margin:0 auto;
	}
	
@media screen and (max-width:1000px){
	
	#message{
		width:90%;
	}
	
}
			
		#message .inner{
			max-width:1000px;
			width:90%;
			margin:0 auto;
		}

	
			
		#message img{
			display:block;
			max-width:300px;
			width:35%;
			margin-right:10px; 
			float:right;
		}
	
	@media screen and (max-width:1000px){
		
		#message img{
			width:240px;
			margin:0 auto -20px; 
			float:none;
		}
	
	}
	
	@media screen and (max-width:640px){
		
		#message img{
			width:50%;
			min-width:180px;
		}
	
	}
			
				#message .note{
					width:65%;
					font-size:1.1em;
					font-family:"kozuka-mincho-pro";
					float:left;
				}
	
			@media screen and (max-width:1000px){
		
				#message .note{
					max-width:640px;
					width:90%;
					margin:0 auto 30px;
					padding:0;
					float:none;
				}
	
			}
	
			@media screen and (max-width:640px){
		
				#mainnote li .note{
					font-size:1.0em;
					margin:0 auto;
					padding-top:0;
				}
	
			}
			

/* 強み */

	#tsuyomi{
		padding-bottom:80px;
		background-color:#eef5ee;
	}
		
@media screen and (max-width:1000px){
	#tsuyomi{
		padding-bottom:70px;
	}
}
		
@media screen and (max-width:640px){
	#tsuyomi{
		padding-bottom:50px;
	}
}
		
@media screen and (max-width:430px){
	#tsuyomi{
		padding-bottom:30px;
	}
}

			
		#tsuyomi .inner{
			max-width:1000px;
			width:90%;
			margin:0 auto;
		}

	
		#tsuyomi ul{
		}
	
		#tsuyomi li{
			margin-top:50px;
			padding-left:12%;
			list-style:none;
			background-image:url(../images/img_1.png);
			background-repeat:no-repeat;
			background-size:6% auto;
			background-position:2% 0;
		}
		#tsuyomi li:nth-of-type(1){background-image:url(../images/img_1.png);}
		#tsuyomi li:nth-of-type(2){background-image:url(../images/img_2.png);}
		#tsuyomi li:nth-of-type(3){background-image:url(../images/img_3.png);}
		
	@media screen and (max-width:1000px){
		#tsuyomi li{
			margin-top:40px;
		}
	}
		
	@media screen and (max-width:640px){
		#tsuyomi li{
			margin-top:30px;
		}
	}
	
			#tsuyomi li h3{
				color:#c33;
				font-weight:700;
				font-size:2.6em;
				line-height:1.4em;
			}
		
		@media screen and (max-width:1000px){
			#tsuyomi li h3{font-size:1.9em;}
		}
		
		@media screen and (max-width:640px){
			#tsuyomi li h3{font-size:1.4em;}
		}
		
		@media screen and (max-width:480px){
			#tsuyomi li h3{font-size:1.2em;}
		}

			#tsuyomi li p{
				margin:20px 0 0;
				font-size:1.2em;
				font-family:"kozuka-mincho-pro";
			}
		
		@media screen and (max-width:1000px){
			#tsuyomi li p{margin:15px 0 0;}
		}
		
		@media screen and (max-width:640px){
			#tsuyomi li p{
				margin:10px 0 0;
				font-size:1.1em;}
		}
		
		@media screen and (max-width:480px){
			#tsuyomi li p{
				
				font-size:1.0em;
			}
		}


			.tsuyomiyotei{
				margin-top:50px;
				padding:10px;
				color:#fff;
				font-size:1.4em;
				line-height:1.4em;
				font-weight:700;
				text-align:center;
				background-color:#f60;
			}
			.tsuyomiyotei:before{
				content:url(../images/img_yajirushi.png);
				display:block;
				width:36px;
				margin:0 auto -35px;
				position:relative;
				top:-50px;
			}
		
		@media screen and (max-width:1000px){
			.tsuyomiyotei{
				font-size:1.3em;
			}
		}
		
		@media screen and (max-width:770px){
			.tsuyomiyotei{
				font-size:1.1em;
			}
		}
		
		@media screen and (max-width:660px){
			.tsuyomiyotei{
				font-size:1.0em;
			}
		}
		
		@media screen and (max-width:430px){
			.tsuyomiyotei{
				padding:10px 5px;
				font-size:0.9em;
			}
		}

	
	

/* 事業概要 */

	#outline{
		width:50%;
		height:620px;
		float:left;
	}
	
@media screen and (max-width:1000px){

	#outline{
		width:100%;
		height:auto;
		float:none;
	}
	
}
	
	
		#outline .inner{
			width:80%;
			margin:0 auto;
			padding:40px 0;
		}
	
	@media screen and (max-width:1000px){

		#outline .inner{
			width:90%;
			padding:30px 0;
		}
	
	}

		
			#outline h2{
				margin-bottom:35px;
				font-family:"kozuka-mincho-pro";
				font-size:1.7em;
				text-align:center;
			}
	
		@media screen and (max-width:1000px){
	
			#outline h2{
				margin-bottom:25px;
			}
		
		}
	
			#outline ul{
				margin-bottom:30px;
			}
	
			#outline li{
				padding:15px 5px 15px 0;
				border-bottom:1px dashed #b2b2b2;
				list-style:none;
				line-height:1.5em;
			}
			#outline li:nth-of-type(1){border-top:1px dashed #b2b2b2;}
	
#outline li{zoom:1;}
#outline li:after{
  content: ""; 
  display: block; 
  clear: both;
}
	
		@media screen and (max-width:1000px){
		
			#outline li{
				padding:12px 0 12px;
			}
			
		}
	

				#outline li h3{
					width:100px;
					color:#000;
					font-weight:700;
					text-align:center;
					float:left;
				}
	
			@media screen and (max-width:430px){
		
				#outline li h3{
					width:80px;
				}
			
			}
	

				#outline li p{
					width:calc(100% - 120px);
					margin:0;
					float:right;
				}
	
			@media screen and (max-width:1000px){
		
				#outline li p{
					width:calc(100% - 120px);
				}
			
			}
	
			@media screen and (max-width:430px){
		
				#outline li p{
					width:calc(100% - 90px);
				}
			
			}

				#outline li p span{
					font-size:0.9em;
				}
	
			@media screen and (max-width:1000px){
		
				#outline li p span{
					font-size:0.8em;
				}
			
			}

/* アクセス */

	#access{
		width:50%;
		height:620px;
		float:right;
	}
	
@media screen and (max-width:1000px){

	#access{
		width:100%;
		height:400px;
		float:none;
	}
	
}
	


/* 造園実績 */

		#works{
			padding:30px 0 60px;
		}
		
	@media screen and (max-width:420px){

		#works{
			padding:30px 0;
		}
		
	}
	
			
				#works .inner{
					max-width:1000px;
					width:90%;
					margin:0 auto;
					padding:57px 0 0;
					background-image:url(../images/img_circle.png);
					background-repeat:no-repeat;
				}
	
			@media screen and (max-width:1100px){
			
				#works .inner{
					padding:24px 0 0 30px;
					background-image:none;
				}
	
			}
	
			@media screen and (max-width:900px){
		
				#works .inner{
					max-width:640px;
					width:90%;
					margin:0 auto 30px;
					padding:34px 0 0;
					float:none;
				}
	
			}
	
			@media screen and (max-width:640px){
		
				#works .inner{
					margin:0 auto;
					padding-top:0;
				}
	
			}
			
	
					#works h4{
						padding-left:30px;
						color:#c30;
						font-size:1.9em;
						font-family:"kozuka-mincho-pro";
					}
			
		
				@media screen and (max-width:1100px){
		
					#works h4{
						padding-left:0;
						font-size:1.8em;
						text-align:center;
					}
		
				}
		
				@media screen and (max-width:640px){
		
					#works h4{
						line-height:1.4em;
						text-align:center;
					}
		
				}
		
				@media screen and (max-width:370px){
		
					#works h4{
						font-size:1.6em;
					}
		
				}

			
				#works h5{
					margin:30px 0 20px;
					padding-bottom:10px;
					color:#369;
					font-weight:700;
					font-size:1.4em;
					text-align:center;
					border-bottom:1px solid #369;
				}
				#works h5:nth-of-type(1){
					margin:50px 0 10px 2%;
				}
		
			@media screen and (max-width:420px){
	
				#works h5,
				#works h5:nth-of-type(1){
					margin:10px 0;
					font-size:1.2em;
					border-bottom:0;
				}

			}
	
					#works ul{
						width:100%;
						margin:0 auto;
					}
		
				@media screen and (max-width:640px){
	
					#works ul{
						width:100%;
						max-width:480px;
						margin:0 auto;
					}
		
				}

					#works ul{zoom:1;}
					#works ul:after{
					  content: ""; 
					  display: block; 
					  clear: both;
					}
				

	
						#works li{
							width:23%;
							margin:0 1% 15px;
							padding:10px 0;
							float:left;
							list-style:none;
							border-radius:8px;
					-moz-box-shadow:0 0 0 1px #ccc inset;
					-webkit-box-shadow:0 0 0 1px #ccc inset;
					box-shadow:0 0 0 1px #ccc inset;
						}
		
				@media screen and (max-width:900px){
	
						#works li{
							width:calc((100% / 3) - 2%);
						}
		
				}
		
				@media screen and (max-width:640px){
	
						#works li{
							width:calc((100% / 2) - 2%);
						}
		
				}
		
				@media screen and (max-width:420px){
	
						#works li{
							max-width:240px;
							width:100%;
							margin:0 auto 15px;
							float:none;
						}
		
				}
				
				
							#works li .imgbox{
								display:-webkit-flex;
								display:flex;
								justify-content: center;
								-webkit-align-items:center;
								align-items:center;
								margin:5px 0 0;
								text-align:center;
						}
	
							#works li img{
								width:90%;
							}
	
							#works li p{
								margin:10px 1% 0;
								text-align:center;
								line-height:1.4em;
							}




	/* ウイルス感染対策 */

	.covid19{
		margin:20px 0 60px;
		background-colog:#fff;
		position:relative;
		z-index:100;
	}

@media screen and (max-width:1020px){

	.covid19{
		margin:20px 0 30px;
	}

}

@media screen and (max-width:770px){

	.covid19{
		margin:10px 0 20px;
	}

}

		
		
		.covid19 .inner{
			max-width:calc(1000px - 10%);
			width:84%;
			padding:20px 3%;
			margin:0 auto;
			border:1px solid #c00;
			border-radius:8px;
			background-colog:#fff;
		}
		
	
	@media screen and (max-width:480px){
	
		.covid19 .inner{
			width:82%;
			padding:15px 4%;
		}
	
	}
	
		.covid19 h2{
			color:#c33;
			font-weight:700;
			position:relative;
			left:-1%;
		}
	
		.covid19 p{
			margin-bottom:0;
		}
	
	@media screen and (max-width:430px){
	
		.covid19 .inner{
			font-size:0.9em;
		}
	
	}
		
		.covidlist{
			margin-left:20px;
		}
		
			.covidlist li{
				margin-bottom:5px;
			}
		
		.covidphoto{
			margin-top:20px;
		}
		
			.covidphoto li{
				max-width:240px;
				width:32%;
				margin-right:2%;
				float:left;
				list-style:none;
			}
			.covidphoto li:nth-last-of-type(1){margin-right:0;}

				.covidphoto li img{
					width:100%;
				}




