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

@import url(//fonts.googleapis.com/css?family=Open+Sans:400,400italic,600,600italic,700,700italic);
body{
font-family:Avenir , "Open Sans" , "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "游ゴシック" , "Yu Gothic" , "游ゴシック体" , "YuGothic" , "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , "メイリオ" , Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;

color: #333;
font-size: 14px; 
letter-spacing: 0.05em;
line-height: 1.3;
}

img {	
	max-width: 100%;
}
table {
	 width: 100%;
}

.mobile  {
  display: none;
}
.clearfix:after {
  content: "";
  clear: both;
  display: block;
  }
  
 .text-center {
 text-align: center;
 }
 
 .half {
	 width: 50%;
 }

header nav{
	background-color: #6b8e23;
	}

	
.inner {
	width: 98%;
	max-width: 1000px;
	margin-left: auto;
	margin-right: auto;

	box-sizing:border-box;
	}
	.w50 { width: 50%
	}
	.red { color: #F00;
	}
	.blue { color: #0000ff;
	}
  
  header .inner {
    padding: 20px;
  }
	
	header h1 {
		float: left;
		max-width: 50%; 
	}
	
	/*header .btn {
		float: right;
		margin-top: 30px;
			}*/
	/*header .btn a {
		padding: 0.5em 1em;
		background-color: #6b8e23;
		color: #fff;
		text-decoration: none;
		font-size: 18px;
	}*/
	
header nav ul{
	border-left: 1px solid #fff;
	}
  
header nav ul.inner {
  padding: 0;
}

header nav ul li{
	float: left;
	width: 20%;
	border-right: 1px solid #fff;
	box-sizing: border-box;
	text-align: center;
	}

header nav ul li a{
	color: #FFF;
	text-decoration: none;
	display: block;
	padding-top: 10px;
	padding-bottom: 10px;
	}
	
#mv {	margin-bottom: 50px;
}

.two-colums article {
	float: right;
	width: 80%;
}
.two-colums aside {
	float: left;
	width: 20%;
}

section{
	 margin-bottom: 50px;
}

section h1{
	font-size: 24px;
	color: #004158 ; 
	font-weight: bold ; 
	border-bottom: 1px solid #004158; 
	margin-bottom: 50px;
	}
	 
header nav ul li a:hover {
	background-color: #9acd32;
	}
		
#copy {
	background-color: #6b8e23;
	color: #fff;
	 }
	
/*トップページ*/		
#home main article section ul li {
	float: left;
	width: 25%;
	padding-right: 8px;
	padding-left: 8px;
	box-sizing: border-box;
  position: relative;
	}
  #home main article section ul li a {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 100%;
    text-indent: -9999px;
  }
  #home main article section ul li a:hover {
    background-color: rgba(0,150,0,0.1);
  }
    
#home main article section ul li img {
	border: 1px solid #ccc;
}
	
	
/*
#home main article section ul li:last-child {
 padding-right: 0;}
*/
	
#home main article section ul li h2 {
	font-size: 18px;
	font-weight: bold;
	border-bottom: 1px solid #666;
	margin-bottom: 15px;
		}
		
#home main article section ul li img {
	margin-bottom: 15px;
	width: 100%;
	}
	
#caution {
		background-color: #FFF197;
		box-sizing: border-box;
		padding: 30px;
	}
#caution h1 {
		font-size: 18px;
		font-weight: bold;
		color: #FF5F00;
		margin-bottom: 20px;
	}
	
	/*紹介*/
	.recommend .inner {
		background-color: #e0ffff;
		border: 1px solid #afeeee;
		border-radius: 10px;
		padding: 30px;
		box-shadow: 1px 1px 2px #ccc;
		background-image: url(../img/bk_recommend.png);
		
	}
	
	.recommend h1 {
		font-size: 18px;
		text-align: center;
		border-bottom: none;
		
		text-shadow: 1px 1px 1px #CCC;
		
		min-height: 60px;
		background-repeat: no-repeat;
		padding-top: 35px;
		background-position: 25% 0;
	}
	.r01 h1 { background-image: url(../img/monobutton01.jpg);}
	.r02 h1 { background-image: url(../img/monobutton02.jpg);}
	.r03 h1 { background-image: url(../img/monobutton03.jpg);}
	.r04 h1 { background-image: url(../img/monobutton04.jpg);}
	
	.recommend h2 {
		font-size: 16px;
		margin-bottom: 30px;
		text-align: center;
	}
	
	.recommend h1:before/*
	.recommend h1:after*/ {
		/*content: "■";*/
		/*content: url(../img/monobotton01.jpg);
		font-size: 24px;

		padding-left: 1em;
		padding-right: 1em;
		position: relative;
		top: 40px;*/
}
.recommend h1: after {
	/*content: url(../img/monobutton01.jpg);
	vivibillity: hidden;
	padding-left: 1em;
	padding-right: 1em;*/
}

#contact table tr:nth-child(odd) {
	background-color: #ddd;
}
#contact table th {
	font-weight: bold;
}
#contact table th,
#contact table td {
	padding:15px;
}
#contact input{
	margin-bottom: 10px;
}

#contact table table th,
#contact table table td {
padding: 0;
}
#contact table table th {
	width: 5em;
	font-weight: normal;
}
#contact input[type="email"] {
	width: 70%;
}
#contact textarea {
	width: 90%;
	height: 200px;
	padding: 10px;
}
#contact input[type="reset"],
#contact input[type="submit"]{
	padding: 0.5em 1em;
font-size: 16px;
margin: 30px;
}


#portfolio section ul li img {
	border: 1px solid #ccc;
}