@charset "UTF-8";
/* COMMON CSS Document */
.content{margin:0 auto; width:960px;}
.content_inner{width:100%; max-width:1600px; margin:0 auto;}
*{font-family: 'Open Sans', sans-serif;box-sizing:border-box;color:#fff;}
a{text-decoration:none;}
.bold{font-weight:bold;}

/*HEADER
====================================*/
#header{
	background: #6abd45;
	padding: 5px 0%;
	width:100%;
	display:block;
	float:left; 
	-webkit-box-shadow: 0px 11px 13px -7px rgba(0,0,0,0.4); 
	-moz-box-shadow: 0px 11px 13px -7px rgba(0,0,0,0.4); 
	box-shadow: 0px 11px 13px -7px rgba(0,0,0,0.4);
}
#header h1{width:140px; float:left;}
#header .cart {color: #fff; line-height: 1; margin-left: 3px;}
.btn_open_close{display:none;cursor:pointer;}

/*NAVIGATION
====================================*/
#gnav{width:900px;margin:0 auto;float:right;padding-top:20px;line-height: 1;}
#gnav ul{display: flex; flex-wrap: wrap; justify-content: space-between;}
#gnav ul li{color:#fff;font-weight:bold;font-size:14px;}
#gnav ul li:last-child{margin-right:0; font-weight: normal;}
#gnav ul li a:hover{opacity:0.8;}

/*MAIN CONTENT
====================================*/
#container{clear: both; padding-bottom: 70px;}

/*FOOTER
===================================*/
#footer{/*background:url(../images/common/bg_footer.jpg) repeat-x bottom center;background-size:100% 100%;*/ color:#fff; background: #6abd45;}
#footer .nav_ft{width:1200px;margin:0 auto;}
#footer .nav_ft ul{display:table;vertical-align:middle;text-align:center;width:100%;padding-top:20px;font-size:18px;}
#footer .nav_ft ul li{width:18%;text-align:center;display:table-cell;vertical-align:middle;}
#footer .nav_ft ul li:nth-child(3){width:28%;}
#footer .nav_ft ul li a{text-decoration:none;font-weight:bold;letter-spacing: 0.2em;;}
#footer .nav_ft ul li a:hover{opacity:0.8;}
#footer .copyr{text-align:center;font-size:12px;padding:20px 0;}
#footer .copyr .bold{font-weight:bold;}

#footer .logo_ft_sp{display:none;}

/*BREADCRUMB*/
.breadcrumb {padding: 40px 0 20px;border-bottom:1px solid #919191; margin-bottom:30px;}
.breadcrumb ul li{float:left;display:inline-block;color:#686867;}
.breadcrumb ul li a:hover{text-decoration:underline;}
.breadcrumb ul li .next{padding:0 10px;box-sizing:border-box;color:#686867;}
.breadcrumb ul li:last-child{font-weight:bold;}

/*===============================
 MEDIA
 ================================*/
 @media only screen and (max-width:1600px){
 	.content_inner{box-sizing:border-box;padding:0 20px;}	
 }
 @media only screen and (max-width:1200px){
 	#footer .nav_ft{width:100%;padding-left:10px;padding-right:10px;}
 }

 @media only screen and (max-width:1024px){
 	#gnav {width:70%;}
 	#gnav ul li{width:19.2%; margin-right: 1%;}
 	.content_inner{padding:0 10px;}
 }

 @media only screen and (max-width:780px){
 	#footer .nav_ft ul li a{letter-spacing: 0.1em;}
}


 @media only screen and (max-width:736px){
 	#header{position:fixed;top:0;z-index:9999;padding:10px 0;box-sizing:border-box;}
 	#header h1{width:30%;}
 	#header .btn_open_close{float:right;display:block;margin-top:2.5%;margin-right:20px; box-sizing:border-box;width:10%;position:relative;}
 	#header .btn_open_close img.open{position:absolute;width:100%;height:100%;top:0;left:0;}
	#header .cart {color: #333;}
	#header .cart i {color: #333;}
 	#header .btn_open_close img.close{position:absolute;width:100%;height:100%;top:0;left:0;}
 	#gnav {padding-top:0;}
 	#gnav ul{ position:absolute;top:0;width:50%;background:#fff;right:0%;z-index:999;display:none;padding:30px;box-sizing:border-box;}
 	#gnav ul li{width:100%;margin:0;color:#434343;text-align:left;padding:6% 0;border-bottom:1px solid #999;}
 	#gnav ul li:first-child{padding-top:0;}


 	#footer .logo_ft_sp{display:block;text-align:center;}
 	#footer .nav_ft ul li a{letter-spacing: 0.2em;}
 	#footer .nav_ft ul li:nth-child(3){display:none;}
 	#footer .nav_ft ul{width:50%;margin:0 auto;font-size:16px;}
 	#footer .nav_ft ul li{width:50%;margin-bottom:20px;}
 	#footer .nav_ft ul li:nth-child(1),#footer .nav_ft ul li:nth-child(4){float:left;text-align:left;}
 	#footer .nav_ft ul li:nth-child(2),#footer .nav_ft ul li:nth-child(5){float:right;text-align:right;}
 }

 @media only screen and (max-width:480px){
 	#header .btn_open_close{width:12%;margin-top:2%;}
 	#gnav ul{width:70%;}
 	#gnav ul li{font-size:14px;}

 	#footer .nav_ft ul li a{font-size:14px;}
 	#footer .nav_ft ul{width:290px;}
 	#footer .nav_ft ul li{text-align:center !important;}
 }
/* Animate */
.fade-in {
	opacity: 0;
	transition: opacity 2s;
}

.fade-in.is-view {
	opacity: 1;
}