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

/*==========================================
ベースのCSSの設定
============================================*/
/*ベースの要素の設定をリセット*/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,form,input,p,blockquote,th,td {

}

/*フロート解除用のハック*/

/*clearfixの設定*/
.clearfix:after{  
visibility:hidden;/*見えなくする*/ 
height:0;/*見えなくする*/
display: block;/*block要素にする*/
font-size: 0;  
content: " ";  
clear: both;  

}  
* html .clearfix             { zoom: 1; } /* IE6 */  
*:first-child+html .clearfix { zoom: 1; } /* IE7 */



/*==========================================
共通
============================================*/

#wrapper{
	margin:0 auto;
	min-width:1000px;
	overflow:hidden;
	/*background:red;*/
	}

html{
	font-size:62.5%;
	}
	
body{
	color:#333;
	}	
	
a{
	color:inherit;
	text-decoration:none;
	position: relative;
  display: inline-block;
  transition: .3s;
	}
	
a:hover img{
opacity: 0.6;
filter: alpha(opacity=60);
-moz-opacity:0.6;
}	

/*ホバー時下の下線*/
.nav::after {
  position: absolute;
  bottom: 0;
  left: 0;
  content: '';
  width: 0;
  height: 2px;
  background-color:#849974;
  transition: .5s;
}
.nav:hover::after {
  width: 100%;
}


/*==========================================
ヘッダーエリアの設定
============================================*/
header{
	min-height:180px;
	background:#fff;
	background-position:center center;
	background-size:cover;
	background-size:100%;
	margin-bottom:40px;
	
	}
	

	
#header_inner{
	width:1000px;
	height:200px;
	margin:0 auto;
	margin-top:50px;
	text-align:center;
	}
	

.logo{
	text-align:center;
	
	}
	

#navi{
	list-style:none;
	width:1000px;
	margin-left:200px;
	
	}

#navi .nav{
	float:left;
	color:f333;
	margin-top:50px;
	margin-right:40px;
	font-size:2.6rem;
	font-family: 'Cabin Sketch';
	}
	

.sns{
	float:left;
	margin-left:10px;
	margin-top:50px;
	margin-right:17px;
	}

/*ページ上部を固定*/
#navi{
	
	background:#333;
}

#navi ul li a{
	background:#666;
	width: 20%;
	float: left;
	padding:20px 0;
	text-align: center;
	color: #fff;
	text-decoration: none;
	border-right: 1px solid #777;
	box-sizing: border-box;
}

#navi ul li a:hover{
	background:#333;
}

.fixed {
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 10000;
}



/*==========================================
conceptの設定
============================================*/
#concept{
	width:100%;
	height:700px;
	position:relative;
	/*background-attachment:fixed;*/
	}	
	
#box_top img{
	width:100%;
	background:url(../imgs/top/concept_top.png) no-repeat;
	background-size:cover;
	position:absolute;
	top:0;
  
	}
	
#box_bottom img{
    width:100%;
	background:url(../imgs/top/concept_bottom.png) no-repeat;
	background-size:cover;
	position:absolute;
	bottom:0;
	}	
		
	
.concept_inner{
	width:100%;
	height:600px;
	position:absolute;
	text-align:center;
}


.concept_inner h2{
	padding-top:100px;
	}

.concept_inner section{
	
	margin-top:60px;
	margin-bottom:45px;
	line-height:25px;
	font-size:1.5rem;	
	font-family:font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Noto Sans Japanese", "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, Meiryo, sans-serif; 
	}
	
/*==========================================
galleryの設定
============================================*/
#gallery{
	height:1000px;
	min-width:1000px;
	background:#fff;
	background-position:center center;
	background-attachment:fixed;
	background-size:cover;
	background-size:100%;


	}

#gallery_inner{
	width:1000px;
	height:940px;
	margin:0 auto;
	text-align:center;
	}
	
#gallery_inner h2{
	margin-top:80px;
	}	

#gallery_inner section{
	margin-top:60px;
	margin-bottom:60px;
	}
	
#gallery_inner section p{
	font-size:1.5rem;
	line-height:25px;	
	font-family:font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Noto Sans Japanese", "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, Meiryo, sans-serif; 
}

.box{
	float:left;
	margin-left:120px;
	}
	
.more{
	margin-top:60px;}	


			
/*==========================================
newsの設定
============================================*/	
 #news{

	height:1990px;
	margin:0 auto;
	background: #f7f6f5;
	background-size: cover;
	background-position: center center;
	position: relative;
	}

#news_inner{
	width:1000px;
	margin:0 auto;
	text-align: center;}
	
#news_inner h2{
	padding-top:80px;
	}	

/*フェイスブック*/	
#facebook{
	margin-top:100px;
	margin-left:410px;
	}
	
.fb_box{
	float:left;
	margin-right:30px;
	}

h3{
	margin-top:10px;
	}

#news_inner_fb p{
	margin-top:20px;
	margin-bottom:70px;
	font-size:1.4rem;
	font-family:font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Noto Sans Japanese", "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, Meiryo, sans-serif; 
	}
	
.check{
	position:absolute;
	margin-left:750px;
}
		
	
#fb_plugin{
	margin-bottom:50px;
	}
	
#news_inner_fb{
	margin-bottom:180px;
	}	
	
	
		
/*インスタグラム*/	
	
#instagram{	
    margin-top:100px;
	margin-left:410px;
	}	
	
.ig_box{
	float:left;
	margin-right:30px;
	}
		
h3{
	margin-top:10px;
	}

#news_inner_ig p{
	margin-top:20px;
	margin-bottom:70px;
	font-size:1.4rem;
	font-family:font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Noto Sans Japanese", "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, Meiryo, sans-serif; 
	}
	
.kirinoma{
	position:absolute;
	margin-left:750px;
}
		
	
#ig_snapwidget{
	margin-bottom:50px;
	}
	
	
/* 点滅 */
.blinking{
	-webkit-animation:blink 1.2s ease-in-out infinite alternate;
    -moz-animation:blink 1.2s ease-in-out infinite alternate;
    animation:blink 1.2s ease-in-out infinite alternate;
}

@-webkit-keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}
@-moz-keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}
@keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}


/*==========================================
Contactの設定
============================================*/		

#contact{
	
	height:660px;
	background:url(../imgs/top/contact_back.jpg) no-repeat;
	background-attachment:fixed;
	background-size:cover;
	background-size:100%;
	position:relative;
	margin-bottom:200px;
	}

#contact_inner{
	width:1000px;
	min-height:660px;
	margin:0 auto;
	text-align:center;
	}

#contact_inner h2{
	padding-top:80px;
	}


#contact_inner section{
	padding-top:80px;
	font-size:1.5rem;
	line-height:25px;	
	font-family:font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Noto Sans Japanese", "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, Meiryo, sans-serif; 
	
	}

#contact_inner .contact{
	padding-top:75px;
	
	}

/*==========================================
Pagetopへ戻るの設定
===============*/
.pagetop {
    display: none;
    position: fixed;
    bottom: 30px;
    right: 30px;
	z-index:10;
}
.pagetop a {
    display: block;
    background-color:#fff;
    text-align: center;
    color: #222;
    font-size: 12px;
    text-decoration: none;
    padding: 5px 10px;
	filter:alpha(opacity=50);
    -moz-opacity: 0.5;
    opacity: 0.8;
	border-radius: 50px;
}
.pagetop a:hover {
    display: block;
    background-color: #fff;
    text-align: center;
    color: #fff;
    font-size: 12px;
    text-decoration: none;
    padding:5px 10px;
	filter:alpha(opacity=50);
    -moz-opacity: 0.5;
    opacity: 0.8;
}


/*==========================================
フッターエリア
===============*/
footer{
	min-height:350px;
	background:#fff;
	background-size:cover;
	background-size:100% auto;
	position:relative;
	}	
			
	
#footer_inner{
	height:350px;
	margin: 0 auto;
	text-align:center;
	}

.grass{

	height:185px;
	background:url(../imgs/commons/img/footer_grasses.gif) repeat-x;
	margin-bottom:20px;
	}
		
#footer_sns{
	width:665px;
    margin:0 auto;
	padding-left:335px;
	}
	
.footer_box{
	float:left;
	margin-bottom:40px;
	}			
	
.box_right_1{
	margin-left:100px;
	}

.box_right_2{
	margin-left:20px;
	}		

.snsbox{
	margin-top:25px;
	}

footer p{
	font-family:"Times New Roman", Times, serif;
	font-size:1.2rem;
	}	

@media screen and (max-width: 500px) {
  /* スマホ用のスタイル */
#wrapper{
	 
	 }
body{
	
	max-width:100%;
	height:auto;}

}