@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Poppins:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i');

/* slide */
/* .topImg .wrap { padding-top: 450px; } */
/*
.topImg .col-04{ width:32%; padding:13px 10px 10px 24px;}
.topImg .col-04:nth-of-type(1){background: url(../img/top/bg_slide1.png)no-repeat;background-size:contain;}
.topImg .col-04:nth-of-type(2){background: url(../img/top/bg_slide2.png)no-repeat;background-size:contain;margin-left:1%;}
.topImg .col-04:nth-of-type(3){background: url(../img/top/bg_slide3.png)no-repeat;background-size:contain;margin-left:1%;padding-bottom: 20px;}
*/
.topImg p {
	position: relative;
	z-index: 300;
	display: block;
	padding: 0 0 15px;
	font-size: 14px;
	font-weight: bold;
	line-height: 1.3;
	color: #1e2128;
}
.topImg p span { font-size: 11px; }
.topImg ul li.slide1 {
	position: relative;
	top:0;
	left:0;
	z-index: 200;
	width: 100%;
	height:540px;
	background: #000  url(../img/top/slide1.jpg) center top;
	background-size:contain;
}

/* Concept */
.topConcept { padding: 40px 0;}
.topConcept .col-3 img { display: block; margin-bottom: 10px; }
/*.topConcept .col-3 { padding: 0 10px 20px 0; }*/
.topConcept .col-3Box { margin-bottom: 60px; }
.topConcept h2 img {display: block; margin: 0 auto 20px; text-align: center;}
.topConcept p {margin: 0 0 50px;display: block;font-size: 15px; line-height: 1.5; letter-spacing: 0.07em;}
.topConcept h3 {
	margin: 0 0 40px;
	display: block;
	font-family: "Times New Roman", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "メイリオ", Meiryo, serif;
	font-size: 36px;
	font-weight: bold;
	line-height: 1.3;
	letter-spacing: 0;
}
.topConcept h3 span { font-size:44px; }
.topConcept ul.catch1 li {
	margin: 0 0 10px;
	display: block;
	font-size: 16px;
	line-height: 1.5;
}
.topConcept ul.catch1 strong {font-weight: normal;background: linear-gradient(transparent 70%, #ffff66 70%);}

/* topInfo */
.topInfo { padding: 50px 0;}
.topInfo h2 { margin: 0 0 20px;text-align: center;}
.topInfo .update {font-size:13px; padding: 10px 0 0; border-bottom: 1px solid #eee;}
.topInfo p.date {float: left; margin-right: 30px; padding: 5px 25px; line-height: 1.5;background:#f4f8ed;}
.topInfo p.comment {overflow: hidden; padding: 5px 5px 5px 0; line-height: 1.5;}
.topInfo .infoLast {border-bottom: 1px solid #eee;}
.topInfo .infoBox {margin-bottom: 100px;}

/* topWork */
.topWork {
	padding: 30px 0;
	background: #89b52a; /* Old browsers */
	background: -moz-linear-gradient(top,  #89b52a 0%, #4eaf85 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #89b52a 0%,#4eaf85 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #89b52a 0%,#4eaf85 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#89b52a', endColorstr='#4eaf85',GradientType=0 ); /* IE6-9 */
}
.topWork h2 { margin: 0 0 20px;text-align: center;}
.topWork img { margin: 0 0 10px;vertical-align: bottom;}
.topWork .col-04 img {width: 49%; }
.topWork p { clear: both;margin-bottom: 20px;font-size:16px;line-height: 1.1;color: #fff;text-align:center;}

/* topStaff */
.topStaff {padding: 100px 0;}
.topStaff h2 { margin: 0 0 20px;text-align: center;}
.topStaff .staff img{ float: left; vertical-align: bottom;}

/* topAbout */
.topAbout { color: #fff; }
.topAbout .gmap { width: 50%; float: left; }
.topAbout .gmap iframe {width:100%;height:400px;vertical-align:bottom;}
.topAbout .about { background: #1e2128; height: 400px; padding: 50px; width: 50%; float: right; }
.topAbout h2 { display: block; margin-bottom: 20px; }
.topAbout address { margin-bottom: 20px; clear: both; font-size:13px; font-style: normal; line-height: 2;}

.topAbout ul.f_btn li a {
	float: left;
	display: block; 
	color: #fff; 
	width: 180px; 
	height: 30px;
	margin: 10px 10px 8px 0;
	padding: 5px 0; 
	text-align: center;
	border: 2px solid #fff;
	letter-spacing: 1px;
	text-decoration: none;
}
.topAbout ul.f_btn li a.tel { font-family: "poppins",sans-serif; }
.topAbout ul.f_btn li a:hover { opacity: 0.5; }
.topAbout ul.f_btn li i { padding-right: 5px; }

.btn-01 {clear: both; margin: 50px 0;}
.btn-01 a {
	display: block;
	padding: 10px 0;
	text-align: center;
	line-height: 1.1;
	width: 320px;
	margin: 0 auto;
	color: #fff;
	border: 1px solid #fff;
	text-decoration: none;
}
.btn-01 a:hover { color: #fff; opacity: 0.5; }
.btn-01 i { padding-left: 10px; }

.btn-02 {clear: both;}
.btn-02 a {
	display: block;
	padding: 10px 0;
	font-size: 14px;
	text-align: center;
	line-height: 1.1;
	width: 180px;
	color: #fff;
	border: 1px solid #fff;
	background:rgba(255,255,255,0.21);
	text-decoration: none;
}
.btn-02 a:hover { color: #fff; opacity: 0.5; color: #000; }
.btn-02 i { padding-left: 10px; }

.btn-03 {clear: both; margin: 50px 0;}
.btn-03 a {
	display: block;
	padding: 10px 0;
	text-align: center;
	line-height: 1.1;
	width: 320px;
	margin: 0 auto;
	color: #000;
	border: 1px solid #000;
	background:rgba(255,255,255,0.21);
	text-decoration: none;
}
.btn-03 a:hover { color: #000; opacity: 0.5; }
.btn-03 i { padding-left: 10px; }





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

	/* slide */
	.topImg ul li.slide1 { height: 500px; background: url(../img/top/slide1.jpg) center; background-size: cover; }
}


@media screen and (max-width: 667px){
	
	.topConcept,.topInfo,.topwork,.topContact,.topStaff,.topAbout { padding: 40px 10px; }
	
	/* slide */
	.topImg ul li.slide1 { height: 300px; }
	.topImg .col-04 { width: 45%; float: none; margin-bottom: 5px;}	
	.topImg .col-04:nth-of-type(1){background-image: none; background: rgba(255,255,255,0.8);margin-left: 1%;}
	.topImg .col-04:nth-of-type(2){background-image: none; background: rgba(255,255,255,0.8);}
	.topImg .col-04:nth-of-type(3){background-image: none; background: rgba(255,255,255,0.8);}
	.topImg .col-04 p { font-size:12px;}
	.topImg .wrap  { padding-top: 10px;}

	/* topConcept*/
	.topConcept .col3Box { margin-bottom: 30px; }
	.topConcept h3 {
		margin: 0 0 40px;
		font-size: 25px;
	}
	.topConcept h3 span { font-size:30px; }
	.topConcept ul.catch1 li {
		font-size: 14px;
	}
	
	/* topInfo */
	.topInfo p.date {float: none; margin-bottom: 10px;}
	.topInfo .infoBox {margin-bottom: 30px;}
	
	/* topWork */
	.topWork .col-04 img { max-width: 165px; }

	/* topStaff */
	.topStaff .staff img { max-width:110px; }
	
	/* topAbout */
	.topAbout { padding: 0; }
	.topAbout .gmap { width: 100%; float: none; }
	.topAbout .gmap iframe {width:100%;height:250px;vertical-align:bottom;}
	.topAbout .about { display: none; }
	
	.btn-01 a,.btn-02 a,.btn-03 a
	{ width: 90%; }

}

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

	.topImg .col-04 { width: 80%; float: none; padding: 5px 10px;}	
	.topImg .wrap { padding-top: 80px; }
}

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

	.topAbout address {margin-top: 20px;}

}



/* ------------------ 2018-02-13 追加 -------------------- */
	.topConcept .col-3Box{
		margin-bottom:20px;
	}
	.clearfix::after 		{	content: '';display: block;	clear: both;	}
	.topConcept .contents{
		margin: 0 auto 100px;
		padding:0 15px;
		width:90%;	
	}
	
	.topConcept .contents h4	{
		text-align: center;
		font-size:28px;
		line-height: 1;
		padding:0;
		margin:1em 0;
		letter-spacing: 2px;
		font-weight:bold;
		color:#373737;
		font-family: "Times New Roman", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "メイリオ", Meiryo, serif;
	}
	
	.topConcept .contents li	{
		display:block;
		float:left;
		border:1px solid #eee;
		background:#eee;
		color:#777;
		padding:0.5em 2em;
		font-size:16px;
		line-height: 1;
		margin:0 0 10px 10px;
		border-radius:2px;
		letter-spacing: 2px;
		position: relative;
	}

	.topConcept .contents li:first-child	{
		background:#777;
		color:#eee;
	}
	
	.topConcept .contents li:first-child:after{
		content: '';
	  display: inline-block;
	  position: absolute;
	  top: 50%;
	  right: 0;
	  width: 0;
	  height: 0;
	  margin-top: -6px;
	  margin-right:-12px;
	  border-top: 6px solid transparent;
	  border-right: 6px solid transparent;
	  border-bottom: 6px solid transparent;
	  border-left: 6px solid #777;
  }	
  
  
@media screen and (max-width: 667px){
	.topConcept .col-3Box{
	}
	.topConcept .contents{
		margin-bottom: 60px;
		padding:0 0;
		width:100%;	
	}
	
	.topConcept .contents h4	{
	}
	
	.topConcept .contents li	{
		padding:0.5em 1em;
		margin:0 0 5px 5px;
		letter-spacing: 0;
		font-size:14px;
	}

}






/* ---- 2018-03-01 追加 ---- */

.slide1	{
	position:relative;
	border:0px solid green;
}
.slide1 *	{
	box-sizing: border-box;
}

.slide1 .catch-copy	{
	width:1080px;
	border:0px solid red;
	margin:0 auto;
	position:absolute;
	bottom:15px;
	left:50%;
	margin-left:-540px;
}

.slide1 .catch-copy li	{
	border:0px solid black;
	height:80px;
	width:33.33333%;
	padding:0 5px;
	display:block;
	float:left;
	
}

.slide1 .catch-copy li .inner-box	{
	background:url(../img/top/catch-copy-bg.png);
	background-size: 100%;
	height:100%;
	padding:15px 10px 15px 30px;
	position: relative;
	box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.1)
}

.slide1 .catch-copy li:nth-child(3) .inner-box	{
	padding:24px 10px 15px 30px
}

.slide1 .catch-copy li .inner-box:before	{
	content: '';
	width:10px;
	height:50px;
	background:#6F9638;
	border-radius:5px;
	display:block;
	position:absolute;
	left:10px;
	top:15px;
}

.slide1 .catch-copy li:nth-child(2) .inner-box:before	{
	background:#FE813B;
}

.slide1 .catch-copy li:nth-child(3) .inner-box:before	{
	background:#6BC8B5;
}

.slide1 .catch-copy li .inner-box p	{
	font-size:17px;
	line-height: 1;
	padding:0;
	margin: 0;
	font-weight:normal;
	font-style:italic;
}

.slide1 .catch-copy li .inner-box p.txt-sm	{
	font-size:11px;
	line-height: 1.5
}

.catch-copy-sp	{
	padding:5px;
}

.catch-copy-sp li	{
	background:url(../img/top/catch-copy-bg-sp.png);
	backgrond-size:100%;
	margin-bottom:0.5em;
	padding:0.5em;
	border-bottom:1px solid #ddd;
	border-left:8px solid black;
}

.catch-copy-sp li:nth-child(1)	{
	border-color:#6F9638
}

.catch-copy-sp li:nth-child(2)	{
	border-color:#FE813B
}

.catch-copy-sp li:nth-child(3)	{
	border-color:#6BC8B5
}

.catch-copy-sp p	{
	font-size:17px;
	line-height: 1;
	padding:0;
	margin: 0;
	font-weight:normal;
	font-style:italic;
}

.catch-copy-sp p.txt-sm	{
	font-size:11px;
	line-height: 1.5
}

	
@media screen and (max-width: 667px){
	.slide1 .catch-copy	{
		display:none;
	}

}