/****************************************************************************

	Kube Framework 4
	
	http://k1.imperavi.com/

****************************************************************************/

@import "kube402/less/mixins.less";
@import "kube402/less/variables.less";

@import "kube402/less/reset.less";
@import "kube402/less/typography.less";

@import "kube402/less/grid.less";
@import "kube402/less/blocks.less";

@import "kube402/less/tables.less";
@import "kube402/less/forms.less";

@import "kube402/less/navigation.less";
@import "kube402/less/buttons.less";

@import "kube402/less/notifications.less";
@import "kube402/less/labels.less";

@import "kube402/less/progress.less";
@import "kube402/less/accordion.less";
@import "kube402/less/filterbox.less";
@import "kube402/less/tooltip.less";
@import "kube402/less/dropdown.less";
@import "kube402/less/livesearch.less";
@import "kube402/less/upload.less";
@import "kube402/less/autocomplete.less";
@import "kube402/less/modal.less";

@import "kube402/less/helpers.less";
@import "kube402/less/prettyprint.less";

@import "kube402/less/grid-responsive.less";
@import "kube402/less/blocks-responsive.less";
@import "kube402/less/typography-responsive.less";
@import "kube402/less/navigation-responsive.less";
@import "kube402/less/forms-responsive.less";

@import "kube402/less/print.less";

/****************************************************************************

	My Style Less

****************************************************************************/

/*
* INDEX
*
*	Typography
*	Link
*	Common
*	Image Replacement（画像置換）
*
*	Header Box Fiexed（ヘッダー固定メニュー）
*	Header
*	
*	Home Slider
*	Home Section1：MENU
*	Home Section1：Animation
*	Home Section2：TOPICS
*	Home Section3：直売所通信
*	Home Section4：コミュニティ雑誌・facobook公式ページ
*
*	Banner
*	footer
*
*	Fixed Menu
*	Page Top for Mobile
*	Scroll Animation
*
*	Box Conent（ホーム以外のコンテンツ）
*	Swiper（Smart Phone Second Menu）
*	Mobile Modal Menu
*
*	Page Login（会員ログインページ）
*
*	Responsive Display On/Off
*
*/


/* Typography
-----------------------------------------------------------------------------*/
body{
	font-family:"メイリオ",Meiryo,"ＭＳ Ｐゴシック","MS PGothic","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,sans-serif;
}



/* Link
-----------------------------------------------------------------------------*/
a,
a:hover{
	transition: all 0.3s ease 0s;
}


/* Common
-----------------------------------------------------------------------------*/
.wrapper{
	max-width:960px;
	margin:0 auto;
	height:100%;
	padding:0 15px;
	position:relative;
}
.content{
	padding-top:0;
}
section{
	position:relative;
	z-index:999;
}




/* Image Replacement（画像置換）
-----------------------------------------------------------------------------*/
.ht {
    background-repeat: no-repeat;
    background-size: cover;
    display: block;
    height: 0;
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    width: 100%;
}





/* Header Box Fiexed
-----------------------------------------------------------------------------*/
header .box-fixed{
	color:#006837;
	font-size:0.8em;
	background-color:rgba(255,255,255,0.9);
	width:100%;
	position:fixed;
	top:0;
	z-index:99999;
	box-shadow: 0 1px 3px rgba(0,0,0,0.1);
}

/* Site Title */
header .box-fixed .site-title{
	height: 27px;
	margin-bottom: 0;
	margin-top: 19px;
	width: 223px;
	
	& a:hover{
		opacity:0.5;
		@media only screen and (max-width: 1024px) {
			opacity:1;
		}
	}
	& .logo01{
		background-image:url(images/header/logo01@2x.png);
		background-repeat:no-repeat;
		background-size:cover;
		display:block;
		width:100%;
		height:0;
		padding-top:12.054%
	}
	
	@media only screen and (max-width: 1023px) {
    width: 200px;
		margin-bottom:10px;
	}
	@media only screen and (max-width: 659px) {
    width: 150px;
	}

}

/* サイト内検索 */
header .box-fixed .box-search{
	position: absolute;
	right: 150px;
	top: 0;	

	& input{
		border-color: #006837!important;
		font-size: 0.8em;
		line-height: 1!important;
		border-radius: 4px!important;
		background-color:transparent!important;
		height:18px;
		margin-left: 6px;
		position:relative;
		top:-2px;
		&:focus,
		&:hover{
			background-color:#fff!important;;
		}
	}

}


@-moz-document url-prefix() {
	header .box-fixed .box-search input{
		top:-2px;
	}
}

/* 文字サイズ */
header .box-fixed .box-font-size{
	background-color: #006837;
	border: 1px solid #006837;
	border-radius: 4px;
	height: 18px;
	overflow: hidden;
	position: absolute;
	right: 15px;
	top: 2px;
	
	& .box-title{
    color: #fff;
    font-size: 0.8em;
    padding: 0 8px;
    position: relative;
    top: -4px;
	}
	
	& .box-body {
		background-color: #fff;
		box-sizing: border-box;
		padding: 0 5px;
	}
		
	& ul{
		margin-left:0;
	}
	
	& li{
    float: left;
    font-size: 12px;
    height: 17px;
    list-style-type: none;
    padding: 0 2px;
    position: relative;
    top: 0;
		
		&:hover{
			cursor:pointer;
			opacity:0.5;
		}
		
		&.active{
			background-color: #006837;
			border-radius: 10px;
			color: #fff;
			height: 16px;
			letter-spacing: -1px;
			line-height: 1.3;
			top: 1px;		
		}
	}
}

/* Navigation */
header .box-fixed nav{
	margin:8px 0 5px;
	& ul{
		margin:0;
	}
	
	& li{
		list-style-type:none;
		float:left;
		margin-left:19px;
		
		&:first-child{
			margin-left:0;
		}
		
		&.menu-item{
			& a:hover{
				opacity:0.5;
			}
			& .parts{
				width:100%;
				height:100%;
			}
		}
		
		&.menu-item-01{
			width:62px;
			height:12px;
			position:relative;
			top:1px;
			& .parts{
				background-image:url(images/header/box-fixed/menu-item01.png);
			}
		}
		&.menu-item-02{
			width:58px;
			height:14px;
			position: relative;
			top: 1px;
			& .parts{
				background-image:url(images/header/box-fixed/menu-item02.png);
			}
		}
		&.menu-item-03{
			width:58px;
			height:14px;
			& .parts{
				background-image:url(images/header/box-fixed/menu-item03.png);
			}
		}
		&.menu-item-04{
			width:69px;
			height:14px;
			position: relative;
			top: 1px;
			& .parts{
				background-image:url(images/header/box-fixed/menu-item04.png);
			}
		}
		&.menu-item-05{
			width:68px;
			height:14px;
			position: relative;
			top: 1px;
			& .parts{
				background-image:url(images/header/box-fixed/menu-item05.png);
			}
		}
		&.menu-item-06{
			width:99px;
			height:14px;
			position: relative;
			top: 1px;
			& .parts{
				background-image:url(images/header/box-fixed/menu-item06.png);
			}
		}
		&.menu-item-07{
			width:78px;
			height:14px;
			& .parts{
				background-image:url(images/header/box-fixed/menu-item07.png);
			}
		}
		&.menu-item-08{
			width:145px;
			height:14px;
			& .parts{
				background-image:url(images/header/box-fixed/menu-item08.png);
			}
		}
		&.menu-item-09{
			width:84px;
			height:14px;
			position: relative;
			top: 1px;
			& .parts{
				background-image:url(images/header/box-fixed/menu-item09.png);
			}
		}
		&.menu-item-10{
			width:22px;
			height:22px;
			position:relative;
			top:-7px;
			& .parts{
				background-image:url(images/header/box-fixed/menu-item10.png);
			}
		}
	
	}

}

/*  Mobile Button */
header .box-fixed{
	& .btn-contact{
    border: 1px solid #006837;
    border-radius: 4px;
    box-sizing: border-box;
    display: block;
    height: 40px;
    padding: 2px;
    position: absolute;
    right: 60px;
    top: -10px;
    width: 40px;
						
		& .parts{
			background-image:url(images/button/btn-item01.png);
			width:100%;
			height:100%;
		}
	}
	
	& .btn-menu{
    border: 1px solid #006837;
    border-radius: 4px;
    box-sizing: border-box;
    display: block;
    height: 40px;
    padding: 2px;
    position: absolute;
    right: 15px;
    top: -10px;
    width: 40px;
						
		& .parts{
			background-image:url(images/button/btn-item02.png);
			width:100%;
			height:100%;
		}
	}
	
	
}






/* Header
-----------------------------------------------------------------------------*/
header{
	background-image:url(images/header/header01-bg.jpg);
	background-position:center bottom;
	width:100%;
	height:250px;
	position:relative;
	overflow:hidden;
	
	&.day{
		background-image:url(images/header/header01-bg.png);
		background-color:#6bbaee;
		
	}
	&.night{
		background-image:url(images/header/header02-bg.png);
		background-color:#2657bf;
	}
	&.day .item-night{
		display:none;
	}
	&.night .item-day{
		display:none;
	}
	
	& .item{
		position:absolute;
	}
	
	@media only screen and (max-width: 659px) {
		height:150px;
		background-size:cover;
	}
	
}


/* Home Heder */
body.home header{
	background-position:center top;
	height:450px;
	
	@media only screen and (max-width: 659px) {
		height:250px;
		background-size:cover;
	}
	
}
/* 検索・文字 */
header .item01,
header .item00{
	right: 53px;
	top: 20px;
}

/* サイトタイトル（ロゴ） */
header{
	& .item03{
		left: 50%;
		top: 50%;
		margin-left:-112.5px;
		margin-top:-13.5px;
		width:223px;
		height:27px;
		opacity:0;
	}
	& .logo01{
		background-repeat:no-repeat;
		background-size:cover;
		display:block;
		width:100%;
		height:0;
		padding-top:12.054%
	}
	&.day .logo01 {
		background-image:url(images/header/logo01@2x.png);
	}
	&.night .logo01 {
		background-image:url(images/header/logo02@2x.png);
	}
	
	@media only screen and (max-width: 1023px) {
		& .item03{
			margin-left:-100px;
			margin-top:-11.5px;
			width:200px;
			height:23px;
		}
	}
	@media only screen and (max-width: 659px) {
		& .item03{
			margin-left:-75px;
			margin-top:-9.5px;
			width:150px;
			height:19px;
		}
		
	}
}

/* 太陽 */
header .item04 {
	right: 144px;
	top: 55px;
	& .parts{
		width:123px;
		height:120px;
		background-image:url(images/header/sun.png);
	}
	
	@media only screen and (max-width: 659px) {
		right: 10%;
		top: 40px;
		& .parts{
			width:61.5px;
			height:60px;
		}
	}

}

/* 月 */
header .item07 {
	right: 144px;
	top: 100px;
	& .parts{
    height: 49px;
    width: 50px;
		background-image:url(images/header/moon.png);
	}
	
	@media only screen and (max-width: 659px) {
		right: 10%;
		top: 60px;
		& .parts{
			width:25px;
			height:24.5px;
		}
	}
	
	
}

/* 普通自動車 */
header{
	& .item05,
	& .item08 {
		bottom: 9px;
		left:-10%;
	}
	& .item05{
		& .parts{
			width:24px;
			height:16px;
			background-image:url(images/header/car-normal-day.png);
		}
	}
	& .item08{
		& .parts{
			width:41px;
			height:16px;
			background-image:url(images/header/car-normal-night.png);
		}
	}
	
	@media only screen and (max-width: 659px) {
		& .item05,
		& .item08 {
			bottom: 3px;
		}
	}
	
}

/* 軽トラ */
header{
	& .item10,
	& .item11 {
		bottom: 9px;
		left:-10%;
	}
	& .item10{
		& .parts{
			width:36px;
			height:21px;
			background-image:url(images/header/car-track-day.png);
		}
	}
	& .item11{
		& .parts{
			width:53px;
			height:19px;
			background-image:url(images/header/car-track-night.png);
		}
	}
	
	@media only screen and (max-width: 659px) {
		& .item10,
		& .item11 {
			bottom: 3px;
		}
	}

}

/* キャラクター*/
#charcter{
	bottom: 80%;
	left:100%;
	position:relative;
	z-index:999;
	& .parts{
    height: 17px;
    width: 21.7px;
		background-image:url(images/home/sec1-item07.png);
	}
}

/* 流星1 */
header .item09 {
	right:20%;
	top:20%;
	& .parts{
    height: 20px;
    width: 38px;
		background-image:url(images/header/star.png);
	}
}



/* Slider
-----------------------------------------------------------------------------*/
.slider-outer{
    left: 50%;
    position:absolute;
    top: 125px;
    width: 660px;
    margin-left: -335px;
		z-index:9999;
			
	& .flexslider {
			border: none;
			border-radius: 0;
			box-shadow: none;
			margin:0px;
			background-color:transparent;
	}
		
	& .flex-viewport{
		overflow:visible!important;
	}
	
	& .flex-direction-nav a{
		opacity:1;
		width:31px;
		height:27px;
	}
	
	& .flex-direction-nav .flex-next,
		.flex-direction-nav .flex-next:hover{
			right: -10px-!important;
			text-align: right;
	}
	
	& .flex-direction-nav .flex-prev,
		.flex-direction-nav .flex-prev:hover{
			left: -10px!important;
	}
	
	& .flex-direction-nav a::before {
			content: "";
			display: block;
			width:100%;
			height:100%;
			background-repeat:no-repeat;
	}
	& .flex-direction-nav .flex-prev::before{
			background-image:url(images/slide/btn-prev.png);
	}
	& .flex-direction-nav .flex-next::before{
			background-image:url(images/slide/btn-next.png);
	}
	
	& .flex-control-nav {
			bottom: -25px;
	}
	& .flex-control-paging li a {
			height: 8px;
			width:8px;
	}
	
	@media only screen and (max-width: 659px) {
		
		left: 50%;
		position:absolute;
		top: 75px;
		width: 300px;
		margin-left: -150px;
			
		& .flex-direction-nav{
			display:none;
		}
		& .flex-control-nav {
				display:none;
		}
	}
	
	
	
}

/* トップページ
-----------------------------------------------------------------------------*/


/*
@media only screen and (max-width: 659px) {
	
	.slider-outer{
		left: 0;
		position:absolute;
		top: 125px;
		width: 100%;
		margin-left: 0;
			
		& .flex-viewport{
			overflow:hidden!important;
		}
		
		& .flex-direction-nav{
			display:none;
		}
		& .flex-control-nav {
				display:none;
		}
	}
}
*/


/* Home Section1：MENU
-----------------------------------------------------------------------------*/
/* タイトル */
body.home .sec1{
	background-image:url(images/common/bg01.png);
	background-repeat:no-repeat;
	background-size:cover;
	padding:30px 0 70px;
	overflow:hidden;
	
	& .sec-title{
		 margin-bottom:50px;
		 .parts{
				margin:0 auto;
				height: 66px;
				width: 176px;
				background-image:url(images/home/sec1-item01.png);
			 }
	}
	
	@media only screen and (max-width: 767px) {	
		padding:15px 0 70px;
		
		& .sec-title{
			 margin-bottom:25px;
			 .parts{
					height: 33px;
					width: 88px;
				 }
		}
	
	}
	
	
}

/* Scroll */
body.home .sec1{
	& #scroll{
    color: rgba(0, 0, 0, 0.1);
    display: block;
    margin-top: 0;
    position: absolute;
    left: 50%;
    margin-left: -36px;
    top: 81px;
		
		@media only screen and (max-width: 767px) {
			top: 40px;
		}
	}
}

/* Menu Blocks */
body.home .sec1{
	& nav{
		& li{
			margin-bottom:80px;
			position:relative;
			z-index:9999;
			
			@media only screen and (max-width: 767px) {
				margin-bottom:30px;
			}
			
			& a{
				display:block;
				transition: all 0.3s ease 0s;
				&:hover{
					animation-name: floating;
					-webkit-animation-name: floating;
				
					animation-duration: 1.5s;	
					-webkit-animation-duration: 1.5s;
				
					animation-iteration-count: infinite;
					-webkit-animation-iteration-count: infinite;
				}
			}
			
		}
		
		& .image{
			max-width:206px;
			margin:0 auto 15px;
			& .parts{
				height: 0;
				width: 100%;
				padding-top:83.001%;
			}
			&.expandUp{
				animation-duration: 2s;	
				-webkit-animation-duration: 2s;
			}

		}
		& .text{
			margin:0 auto;
			& .parts{
				height: 0;
				width: 100%;
			}
			&.expandUp{
				animation-duration: 2s;	
				-webkit-animation-duration: 2s;
			}
			
		}
	
	}
}

/* Menu Parts */
body.home .sec1{
	& nav{
		
		& .menu01{
			& .image .parts{
				background-image:url(images/home/sec1-menu01.png);
			}
			& .text{
				max-width: 143px;
				& .parts{
					background-image:url(images/home/sec1-menu01-text.png);
					padding-top:13.907%;
				}
			}
		}
		
		& .menu02{
			& .image .parts{
				background-image:url(images/home/sec1-menu02.png);
			}
			& .text{
				max-width: 72px;
				& .parts{
					background-image:url(images/home/sec1-menu02-text.png);
					padding-top:27.778%;
				}
			}
		}
		
		& .menu03{
			& .image .parts{
				background-image:url(images/home/sec1-menu03.png);
			}
			& .text{
				max-width: 72px;
				& .parts{
					background-image:url(images/home/sec1-menu03-text.png);
					padding-top:27.778%;
				}
			}
		}
		
		& .menu04{
			& .image .parts{
				background-image:url(images/home/sec1-menu04.png);
			}
			& .text{
				max-width: 72px;
				& .parts{
					background-image:url(images/home/sec1-menu04-text.png);
					padding-top:27.778%;
				}
			}
		}
		
		& .menu05{
			& .image .parts{
				background-image:url(images/home/sec1-menu05.png);
			}
			& .text{
				max-width: 74px;
				& .parts{
					background-image:url(images/home/sec1-menu05-text.png);
					padding-top:27.027%;
				}
			}
		}
		
		& .menu06{
			& .image .parts{
				background-image:url(images/home/sec1-menu06.png);
			}
			& .text{
				max-width: 121px;
				& .parts{
					background-image:url(images/home/sec1-menu06-text.png);
					padding-top:16.529%;
				}
			}
		}
		
		& .menu07{
			& .image .parts{
				background-image:url(images/home/sec1-menu07.png);
			}
			& .text{
				max-width: 99px;
				& .parts{
					background-image:url(images/home/sec1-menu07-text.png);
					padding-top:19.192%;
				}
			}
		}
		
		& .menu08{
			& .image .parts{
				background-image:url(images/home/sec1-menu08.png);
			}
			& .text{
				max-width: 166px;
				& .parts{
					background-image:url(images/home/sec1-menu08-text.png);
					padding-top:12.651%;
				}
			}
		}
		
		& .menu09{
			& .image .parts{
				background-image:url(images/home/sec1-menu09.png);
			}
			& .text{
				max-width: 116px;
				& .parts{
					background-image:url(images/home/sec1-menu09-text.png);
					padding-top:16.380%;
				}
			}
		}
		
	}
}

/* MENUのClearfix*/
body.home .sec1 nav .menu04,
body.home .sec1 nav .menu07{
	clear: both;
}
@media only screen and (max-width: 767px) {
	body.home .sec1 nav .menu04,
	body.home .sec1 nav .menu07{
		clear:none;
	}
	body.home .sec1 nav .menu03,
	body.home .sec1 nav .menu05,
	body.home .sec1 nav .menu07,
	body.home .sec1 nav .menu09{
		clear:both;
	}
	
}

/* Home Section1：Animation
-----------------------------------------------------------------------------*/
body.home .sec1{
	& .item{
		position:absolute;
	}
}

/* 牛 */
body.home .sec1 .item01{
	left: -100px;
	top: 19px;
	& .parts{
    width: 173px;
    height: 102px;
		background-image:url(images/home/sec1-item02.png);
	}
	
	@media only screen and (max-width: 767px) {	
		left: 0;
		top: -10px;
		& .parts{
			width: 86.5px;
			height: 51px;
		}
	}

}

/* 草1 */
body.home .sec1 .item02{
	left: 614px;
	top: 381px;
	& .parts{
    width: 97px;
    height: 29px;
		background-image:url(images/home/sec1-item03.png);
	}
	
	@media only screen and (max-width: 767px) {	
		left: 43%;
		top: 231px;
		& .parts{
			width: 43.25px;
			height: 25.5px;
		}
	}

}

/* 草2 */
body.home .sec1 .item03{
	left: 248px;
	top: 628px;
	& .parts{
    width: 135px;
    height: 29px;
		background-image:url(images/home/sec1-item03.png);
	}
	
	@media only screen and (max-width: 767px) {	
		left: 3%;
		top: 415px;
		& .parts{
			width: 67.5px;
			height: 14.5px;
		}
	}

}

/* トマト・キュウリ */
body.home .sec1 .item05{
	left: 254px;
	top: 303px;
	& .parts{
    width: 103px;
    height: 145px;
		background-image:url(images/home/sec1-item04.png);
	}
	
	@media only screen and (max-width: 767px) {	
		left: 43%;
		top: 365px;
		& .parts{
			width: 51.5px;
			height: 72.5px;
		}
	}
}

/* アスパラ・ほうれん草 */
body.home .sec1 .item06{
	left: 574px;
	top: 578px;
	& .parts{
    width: 107px;
    height: 142px;
		background-image:url(images/home/sec1-item05.png);
	}
	
	@media only screen and (max-width: 767px) {	
		left: 38%;
		top: 558px;
		& .parts{
			width: 53.5px;
			height: 71px;
		}
	}
}

/* 稲 */
body.home .sec1 .item07{
	bottom: -71px;
	left: 126px;
	& .parts{
    width: 55px;
    height: 65px;
		background-image:url(images/home/sec1-item06.png);
	}
	@media only screen and (max-width: 767px) {	
		bottom: -71px;
		left: 30%;
		& .parts{
			width: 27.5px;
			height: 32.5px;
		}
	}
}

/* キャラ */
body.home .sec1 .item08{
	bottom: -70px;
	right: 22px;
	& .parts{
    width: 65px;
    height: 52px;
		background-image:url(images/home/sec1-item07.png);
	}
	@media only screen and (max-width: 767px) {	
		bottom: -70px;
		right: 20%;
		& .parts{
			width: 32.5px;
			height: 26px;
		}
	}
}

/* 木 */
body.home .sec1 .item09{
	bottom: -78px;
	right: -102px;
	& .parts{
    width: 149px;
    height: 208px;
		background-image:url(images/home/sec1-item08.png);
	}
	@media only screen and (max-width: 767px) {	
		bottom: -78px;
		right: 0px;
		& .parts{
			width: 74.5px;
			height: 104px;
		}
	}
}

/* 雲1 */
body.home .sec1 .item10{
	right: -14px;
	top: 28px;
	& .parts{
    width: 145px;
    height: 40px;
		background-image:url(images/home/sec1-item09.png);
	}
	@media only screen and (max-width: 767px) {	
		right: 0px;
		top: 28px;
		& .parts{
			width: 72.5px;
			height: 20px;
		}
	}
}

/* 雲2 */
body.home .sec1 .item11{
	left: 0;
	top: 627px;
	& .parts{
    width: 145px;
    height: 40px;
		background-image:url(images/home/sec1-item09.png);
	}
	@media only screen and (max-width: 767px) {	
		left: 60%;
		top: 814px;
		& .parts{
			width: 72.5px;
			height: 20px;
		}
	}
}

/* しいたけ */
body.home .sec1 .item12{
	right: -14px;
	top: 328px;
	& .parts{
    width: 106px;
    height: 76px;
		background-image:url(images/home/sec1-item10.png);
	}
	@media only screen and (max-width: 767px) {	
		right: 0;
		top: 350px;
		& .parts{
			width: 53px;
			height: 38px;
		}
	}
}

/* かき */
body.home .sec1 .item13{
	bottom: -38px;
	left: -63px;
	& .parts{
    width: 131px;
    height: 95px;
		background-image:url(images/home/sec1-item11.png);
	}
	@media only screen and (max-width: 767px) {	
		bottom: -38px;
		left: 5%;
		& .parts{
			width: 65.5px;
			height: 47.5px;
		}
	}
}

/* はな */
body.home .sec1 .item14{
	bottom: -75px;
	right: 170px;
	& .parts{
    width: 52px;
    height: 83px;
		background-image:url(images/home/sec1-item12.png);
	}
	@media only screen and (max-width: 767px) {	
		bottom: -75px;
		right: 33%;
		& .parts{
			width: 26px;
			height: 41.5px;
		}
	}
}




/* Home Section2：TOPICS
-----------------------------------------------------------------------------*/
body.home .sec2{
	background-color:#7ac943;
	padding:30px 0;
	@media only screen and (max-width: 767px) {
		padding:30px 0 10px;
	}
}

/* タイトル */
body.home .sec2{
	& .sec-title{
		margin-bottom:30px;
		@media only screen and (max-width: 767px) {
			margin-bottom:15px;
		}
	}
	& .sec-title .parts {
		background-image: url("images/home/sec2-item01.png");
		height: 66px;
		margin: 0 auto;
		width: 176px;
		
		@media only screen and (max-width: 767px) {
			height: 33px;
			margin: 0;
			width: 88px;
		}
	}
}

/* Carousel */
body.home .sec2{
	& .carousel{
		& .flexslider {
			background: transparent;
			border: none;
			border-radius: none;
			box-shadow: none;
			margin: 0 0 50px;
			position: relative;
			
			& li{
				margin-right:15px;
			}
			& .slides a{
				display:block;
				background-color:#fff;
				padding:10px;
				text-decoration:none;
				color:#222;
				&:hover{
					background-color:#efefef;
				}
			}
			
			@media only screen and (max-width: 767px) {
				margin: 0 0 35px;
			}
				
		}
	}
}

/* Carousel Content */
body.home .sec2{
	& .carousel{
		& .flexslider {
				
				& .category{
					float:left;
				}
				& .date{
					float:left;
					margin-left:10px;
				}
				& .category-news{
					width: 59px;
					height: 22px;
					background-image:url(images/home/sec2-label-news.png);
				}
				& .category-info{
					width: 59px;
					height: 22px;
					background-image:url(images/home/sec2-label-info.png);
				}
				& .category-event{
					width: 59px;
					height: 22px;
					background-image:url(images/home/sec2-label-event.png);
				}
				& .category-sample{
					width: 59px;
					height: 22px;
					background-image:url(images/home/sec2-label-sample.png);
				}
				
				& .title{
					font-weight: normal;
					white-space: nowrap;
					overflow: hidden;
					text-overflow: ellipsis;
					font-size: 1.2em;
					margin: 6px 0;
					padding-bottom:3px;
					&:after{
						content: "";
						width: 100%;
						height: 3px;
						display: block;
						background-image: url(images/home/sec2-item03.png);
						background-size:cover;
						background-repeat:no-repeat;
						position:relative;
						bottom:-3px;					
					}
				}
				
				& .description p{
					line-height:1.2;
				}
				
		}
	}
}

/* Carousel Control Navigation */
body.home .sec2{
	& .carousel{
		& .flexslider {
				
				& .flex-control-nav{
					bottom: -58px;
					position: absolute;
					text-align: center;
					width: 100%;
					
					@media only screen and (max-width: 767px) {
						bottom: -30px;
					}
					
					&:before {
					background: #fff none repeat scroll 0 0;
					border-radius: 20px;
					content: "";
					display: block;
					height: 25px;
					left: 50%;
					margin-left: -100px;
					position: absolute;
					top: -8px;
					width: 200px;
					z-index: -1;
					
					@media only screen and (max-width: 1024px) {
						background-color:transparent;
					}
					}
					
					& li{
						margin-right:4px;
						& a{
							height:8px;
							width:8px;
							&.flex-active{
								background-color:#b2145a;
							}
						}
					}
				}
				
				@media only screen and (max-width: 1024px) {
					& .flex-direction-nav{
						display:none;
					}
				}
				
				.flex-direction-nav a {
						display: block;
						width:5px;
						height:8px;
						background-repeat:no-repeat;
						opacity:1;
						margin:0;
						top:auto;
						bottom:-40px;
						text-indent:-9999px;
						&.flex-prev{
							background-image: url(images/home/sec2-item04-left.png);
							margin-left:-85px;
							left:50%;
						}
						&.flex-next{
							background-image: url(images/home/sec2-item04-right.png);
							margin-right:-85px;
							right:50%;
						}
						&:before{
							content:none;
							font-family:none;
						}
				}
				
		}
	}
}

/* Button To List */
body.home .sec2{
	& .carousel{
		& .flexslider {
				
				& .btn-tolist{
						background-color: #fff;
						display: block;
						height: 25px;
						width: 93px;
						padding-top: 3px;
						position: absolute;
						right: 5px;
						top: -39px;
						transition: all 0.3s ease 0s;		

						&:hover{
							right: -5px;
							transition: all 0.3s ease 0s;	
						}
						
						@media only screen and (max-width: 767px) {
							width:60px;
							height:19px;
						}
						
						& span{
							background-image: url(images/home/sec2-item02.png);
							width:69px;
							height:19px;
							margin:0 auto;
							@media only screen and (max-width: 767px) {
								width:46px;
								height:13px;
							}
						}
				}
				
		}
	}
}




/* Home Section3：直売所通信
-----------------------------------------------------------------------------*/
body.home .sec3{
	background-color:#fff;
	padding:30px 0;
	
	@media only screen and (max-width: 767px) {
		padding:15px 0;
	}
	
	& .box{
		border:solid 3px #ffa213;
	}
}

/* タイトル */
body.home .sec3{
	
	& .sec-title{
    background-image: url("images/home/sec3-bg01.png");
    background-repeat: no-repeat;
    background-size: cover;
    min-height: 77px;
    background-position: center top;
		padding-top: 13px;
		
		@media only screen and (max-width: 767px) {
			padding-left:15px;
			background-position: center -10px;
		}
	}
	
	& .sec-title .parts {
    background-image: url("images/home/sec3-item01.png");
    height: 28px;
    margin: 0 auto;
    width: 152px;
		
		@media only screen and (max-width: 767px) {
			background-image: url("images/home/sec3-item01.png");
			height: 17px;
			margin: 0;
			width: 90px;
		}
		
	}
}

/* 各直売所 */
body.home .sec3{
	& .box-list{
		padding:15px;
		@media only screen and (max-width: 767px) {
			padding:0 15px 15px;
		}
		
		& li{
			position:relative;
			@media only screen and (max-width: 767px) {
				margin-bottom:10px!important;
				padding-bottom:10px;
				border-bottom:1px dotted orange;
				&:last-child{
					border-bottom:none;
					margin-bottom:0!important;
					padding-bottom:0;
				}
			}
			
			&:after{
				border-left: 1px dotted orange;
				content: "";
				display: block;
				height: 100%;
				left: -16px;
				position: absolute;
				top: 0;
				width: 1px;	
			}
			&:first-child::after{
				border-left:none;
			}
		}
		& a{
			text-decoration:none;
			color:#222;
			&:hover{
				text-decoration:underline;
			}
		}
		
		& .label{
			background-color:#ffa213;
			color:#fff;
		}
		& .date{
			font-size:12.75px;
			line-height:1.2;
		}
		& .title{
			font-size: 1.1em;
			margin: 2px 0;
			overflow: hidden;
			padding-bottom: 3px;
			text-overflow: ellipsis;
			white-space: nowrap;		
		}
		& .description p{
			line-height:1.2;
		}
	}
}

/* Button To List */
body.home .sec3{
	& .btn-tolist{
    background-color: #fff;
    display: block;
    height: 25px;
    padding-top: 3px;
    position: absolute;
    right: 35px;
    top: 16px;
    width: 93px;
		transition: all 0.3s ease 0s;
		
		@media only screen and (max-width: 767px) {
			width:60px;
			height:19px;
		}
		
		&:hover{
			right: 25px;
		}
		
		& span{
			background-image: url(images/home/sec3-item02.png);
			width:69px;
			height:19px;
			margin:0 auto;
			@media only screen and (max-width: 767px) {
				width:46px;
				height:13px;
			}
			
		}
	}
}

/* Home Section4：コミュニティ雑誌・facobook公式ページ
-----------------------------------------------------------------------------*/
body.home .sec4{
	background-color:#fef298;
	padding:30px 0;
	
	@media only screen and (max-width: 767px) {
		padding:30px 0 0;
	}

}

/* コミュニティ雑誌
--------------------------------------*/
body.home .sec4{
	& .box-magazine{
		padding:0 25px;
		@media only screen and (max-width: 767px) {
			padding:0;
			border-bottom:1px solid #222;
		}
		
		& .image a{
			display:block;
			&:hover{
				animation-name: floating;
				-webkit-animation-name: floating;
			
				animation-duration: 1.5s;	
				-webkit-animation-duration: 1.5s;
			
				animation-iteration-count: infinite;
				-webkit-animation-iteration-count: infinite;
			}
		}
		
		>.unit-60{
			padding-left:10px;
		}
		
		& .title{
			max-width:161px;
			max-height:23px;
			& span{
				background-image: url(images/home/sec4-left-item01.png);
				width:100%;
				height:0;
				padding-top:14.286%;
			}
		}
		
		& .description{
			margin-bottom:15px;
			p{
				line-height:1.3;
				font-size:0.9em;
			}
	}
		
		& a.btn-backnumber{
			display:block;
			max-width:254px;
			height:auto;
			& span{
				background-image: url(images/home/sec4-left-item04.png);
				width:100%;
				height:0;
				padding-top:25.197%;
			}
			&:hover{
					animation-name: floating;
					-webkit-animation-name: floating;
				
					animation-duration: 1.5s;	
					-webkit-animation-duration: 1.5s;
				
					animation-iteration-count: infinite;
					-webkit-animation-iteration-count: infinite;
			}
			
		}
		
	}
	
	@media only screen and (max-width: 767px) {
		& .unit-40{
			width:30%;
		}
		& .unit-60{
			width:67%;
		}
	}
}

/* facobook公式ページ
--------------------------------------*/
body.home .sec4{
	& .box-facebook{
		padding:0 25px;
		position:relative;
		@media only screen and (max-width: 767px) {
			padding:0;
		}
		
		&:before{
			content: "";
			display: block;
			width: 1px;
			border-left: solid 1px #222;
			height: 100%;
			position: absolute;
			left: -11px;
			@media only screen and (max-width: 767px) {
				border-left:none;
			}
		
		}
		
		& .title{
			width:122px;
			height:24px;
			margin-bottom:7px;
			& span{
				background-image: url(images/home/sec4-right-item01.png);
				width:100%;
				height:0;
				padding-top:19.672%;

			}
		}
		
		& .rss-fb{
			background-color: #fff;
			color: #222;
			display: block;
			margin-top: 5px;
			padding: 5px 10px;
			text-decoration: none;
			
			&:hover{
				background-color:#efefef;
			}
			
			& .rss-fb-header{
				margin-bottom: 9px;
				padding-left: 45px;
				position: relative;
							
				& .logo-fb{
					background-image: url("images/home/sec4-right-item02.png");
					height: 36px;
					left: 0;
					position: absolute;
					top: 2px;
					width: 36px;				
				}
				
				& .title-fb{
					font-weight: bold;
					line-height: 1;
					margin-bottom: 4px;				
					white-space: nowrap;
					overflow: hidden;
					text-overflow: ellipsis;				
				}
			
			}

			& .description-fb p{
				font-size: 0.9em;
				line-height: 1.3;
			}
				
		}
		
	}
}

/* Banner
-----------------------------------------------------------------------------*/
.sec-banner{
	padding:1.65em 0 0.65em;
	background-color:#fff;
	
	& li{
		margin-bottom:1em;
		
		& a{
			display:block;
			
			&:hover{
				box-shadow:0 0 5px rgba(54,85,128,0.75);
			}
		}
		
	}
}








/* footer
-----------------------------------------------------------------------------*/
footer{
	background-image: url("images/common/bg01.png");
	background-repeat: no-repeat;
	background-size: cover;
	overflow: hidden;
	padding: 30px 0 0;
	position:relative;
	z-index:999;
	overflow:hidden;
	
	& .no-display-768 .row-1st,
	& .no-display-768 .row-2nd{
		padding:0 30px;
		@media only screen and (max-width: 1023px) {
			padding:0;
		}
	}
}

/* メニュータイトル */
footer .box-list{
	&.box-list1 .title span{
		background-image: url("images/footer/footer-item01.png");
		width:135px;
		height:30px;
	}
	&.box-list2 .title span{
		background-image: url("images/footer/footer-item02.png");
		width:75px;
		height:30px;
	}
	&.box-list3 .title span{
		background-image: url("images/footer/footer-item04.png");
		width:75px;
		height:30px;
	}
	&.box-list4 .title span{
		background-image: url("images/footer/footer-item06.png");
		width:75px;
		height:30px;
	}
	&.box-list5 .title span{
		background-image: url("images/footer/footer-item03.png");
		width:112px;
		height:30px;
	}
	&.box-list6 .title span{
		background-image: url("images/footer/footer-item05.png");
		width:75px;
		height:30px;
	}
}

/* メニュー */
footer .box-list{
	
	& .title{
		margin-bottom:10px;
	}
	& ul{
		list-style: outside none none;
		margin: 0;
		padding-left:10px;
				
		& li{
			line-height: 1.2;
			position:relative;
			padding-left:10px;
			
			&:before{
				content: "";
				display: block;
				width: 6px;
				height: 6px;
				background-image: url(images/footer/footer-item07.png);
				background-repeat: no-repeat;
				position: absolute;
				left: 0;
				top: 5px;
				@media only screen and (max-width: 767px) {
					top:8px;
				}
			}
			
			& a{
				color: #222;
				font-size: 0.8em;
				line-height: 1.2;
				text-decoration: none;
				&:hover{
					text-decoration:underline;
				}
				@media only screen and (max-width: 767px) {
					font-size:1em;
					line-height: 1.65;
				}
			}
		
		}
		
	}
	
}

/* Copyright */
footer{
	& .copyright{
    background-color: #fff;
    padding: 0px 0 60px;
		margin-top:25px;
		
		& .item{
			font-size: 0.8em;
			line-height: 1;
			margin: 0 auto;
			width: 210px;
		}
	
		& .link-fb{
			display: inline-block;
			position: relative;
			top: 9px;
						
			& span{
				background-image: url(images/footer/footer-item09.png);
				width:26px;
				height:26px;
			}
		}
		
	}
}

/* 画像パーツ
-----------------------------------*/
footer .image{
	position:absolute;
}
/* 牛 */
footer .image01{
	top:200px;
	right:0px;
	width:91px;
	height:57px;
	@media only screen and (max-width: 767px) {
		right:40px;
		top:auto;
		bottom:150px;
		width:45.5px;
		height:28.5px;
	}
}
/* もも */
footer .image02{
	top:-23px;
	left:-40px;
	& .parts{
		background-image: url(images/footer/footer-item10.png);
		width:67px;
		height:66px;
	}
	@media only screen and (max-width: 767px) {
		top:170px;
		left:229px;
		& .parts{
			width:33.5px;
			height:33px;
		}
		
	}
}
/* 花 */
footer .image03{
	bottom:-27px;
	left:-30px;
	& .parts{
		background-image: url(images/footer/footer-item11.png);
		width:42px;
		height:75px;
	}
	
	@media only screen and (max-width: 767px) {
		bottom:-36px;
		left:30px;
		& .parts{
			width:21px;
			height:37.5px;
		}
	
	}

}
/* ロゴ */
footer .image04{
	bottom:0;
	right:80px;
	& .parts{
		background-image: url(images/footer/footer-item08.png);
		width:207px;
		height:44px;
	}
	
	@media only screen and (max-width: 767px) {
		bottom:70px;
		right:25px;
		& .parts{
			background-image: url(images/footer/footer-item08.png);
			width:103.5px;
			height:22px;
		}
	}

}


/* Fixed Menu
-----------------------------------------------------------------------------*/
.fixed-menu {
	background-color: #7ac943;
	bottom: 8px;
	box-shadow: 0 0 3px rgba(0, 0, 0, 0.1);
	left: 58%;
	position: fixed;
	width: 100%;
	z-index:9999;
			
	& ul{
		margin:0;
		list-style:none;
		padding:5px 10px;
	}
	& ul li{
		float:left;
		&:first-child{
			padding-right:10px;
			margin-right:15px;
			border-right:1px solid #fff;
			& .parts{
				background-image: url(images/common/fixed-menu01.png);
				height: 20px;
				width: 165px;
			}
		}
		&:last-child{
			& .parts{
				background-image: url(images/common/fixed-menu02.png);
				height: 21px;
				width: 109px;				
			}
		}

		
		& a{
			display:block;
			opacity:0.8;
			&:hover{
				opacity:1;
			}
		}
	}
}

/* Page Top for Mobile
-----------------------------------------------------------------------------*/
#page-top-mobile {
    bottom: 10px;
    color: #006837;
    opacity: 0.5;
    position: fixed;
    right: 6px;
    text-align: center;
    z-index: 9999;
		font-size:1.5em;
}


/* Scroll Animation
-----------------------------------------------------------------------------*/
body.home #footer_cow,
body.home .sec1 .image,
body.home .sec1 .text,
body.home .sec1 .item{
	visibility:hidden;
}

/* Swiper
-----------------------------------------------------------------------------*/
.nav-second{
	&.swiper-container {
			width: 100%;
			height: auto;
			margin: 0 auto 16px;
			overflow: hidden;
			padding: 0 0 20px;
			position: relative;
			z-index: 1;		
	}
	&.swiper-container .btn{
		white-space:nowrap;
		width:auto;
		padding:10px 15px 10px 10px;
		background-color: rgba(255, 255, 255, 0.7);
		box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
	}
	&.swiper-container-horizontal > .swiper-pagination {
			bottom: -5px;
			left: 0;
			width: 100%;
	}
	& .swiper-pagination-bullet-active {
			background-color: #2c9f42!important;
	}
}


/* Box Conent（ホーム以外のコンテンツ）
-----------------------------------------------------------------------------*/
.box-content{
	background-image: url("images/common/bg01.png");
	background-size: cover;
	padding-bottom:50px;
}

/* Box Header */
.box-content .box-header{
	background-color: rgba(255, 255, 255, 0.8);
	padding: 20px 0 15px;
	box-shadow:0 1px 3px rgba(0, 0, 0, 0.1);
	
	& .box-title{
		width:80%;
		@media only screen and (max-width: 767px) {
			width:70%;
		}
	}
	
	& .breadcrumbs{
		margin-top:5px;
	}
	
	& #box-header-slider {
		position: absolute;
		right: 0;
		top: -13px;
		width: 100px;
		
		& .flexslider {
				border: none;
				border-radius: 0;
				box-shadow: none;
				margin:0px;
				background-color:transparent;
		}
	}	
	
}

/* Navigation Second */
.box-content .nav-second{
	& li{
		margin-right:0.5em;
		margin-bottom:0.5em;
		&.active a{
			color:#fff;
			background-color:#2c9f42;
		}
		& a{
			background-color:rgba(255, 255, 255, 0.7);
			box-shadow:0 1px 3px rgba(0, 0, 0, 0.1);
			&:hover{
				background-color:rgba(255, 255, 255, 0.7);
				box-shadow: 0 0 0 3px #2c9f42 inset;
				color: #2c9f42;
				font-weight: bold;
				text-decoration: none;			
			}
		}
	}
}

/* Box Body */
.box-content .box-body{
	text-shadow:1px 1px 1px rgba(255, 255, 255, 0.7);
	
	& h3{
    background: rgba(255, 255, 255, 0.6) none repeat scroll 0 0;
    border-radius: 2px;
    border-top: medium solid #2c9f42;
    box-shadow: 0 0 2px rgba(0, 0, 0, 0.2);
    padding: 10px;		
	}
	
	& h4{
    background: rgba(255, 255, 255, 0.6) none repeat scroll 0 0;
    border-radius: 2px;
    box-shadow: 0 0 2px rgba(0, 0, 0, 0.2);
    padding: 10px;		
	}
	
	& h5 {
			border-bottom: 1px solid rgba(255, 255, 255, 0.8);
			padding: 5px 10px;
	}	
	& h6 {
			border-bottom: 1px dotted rgba(255, 255, 255, 0.8);
			padding: 5px 10px;
	}
	

}



/* Mobile Modal Menu
-----------------------------------------------------------------------------*/
.modal-box {
	bottom: 0;
	left: 0;
	overflow-x: hidden;
	overflow-y: auto;
	position: fixed;
	right: 0;
	top: 0;
	z-index: 99999;
		
	& .modal header {
		font-size: 18px;
		font-weight: bold;
		padding: 15px 15px 5px;
		height: auto!important;
		border-bottom: solid 1px #efefef;
		text-align: center;
	}
	
	& .modal-close{
		color:#006837;
		display: inline-block;
		font: normal normal normal 14px/1 FontAwesome;
		font-size: inherit;
		text-rendering: auto;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
		font-size: 2em;
		&:before{
			content: "\f057";
		}
	}
	
	& .modal section {
		padding: 15px;
		
		& .btn-search{
			background-color:#006837;
			color:#fff;
		}
		
		& li{
			position:relative;
			border-bottom:solid 1px #efefef;

			&:before{
				content: "\f0da";
				display: block;
				color:#006837;
				font: normal normal normal 14px/1 FontAwesome;
				font-size: inherit;
				text-rendering: auto;
				-webkit-font-smoothing: antialiased;
				-moz-osx-font-smoothing: grayscale;
				position:absolute;
				top:12px;			
			}
			
			& a{
				display:block;
				padding-left:10px;
			}
		}
	}	
	
	& .modal footer {
		background-image: none;
		padding-top:0;
		padding-bottom:10px;
		& .modal-close-btn{
			background-color:transparent;
			color:#fff;
			display:block;
			margin:0 auto;
			width:150px!important;
			background-color:#006837;
			border-radius:4px;
			text-align:right;
			position:relative;
			
			&:before{
				content: "\f057";
				display: block;
				color:#fff;
				font: normal normal normal 14px/1 FontAwesome;
				text-rendering: auto;
				-webkit-font-smoothing: antialiased;
				-moz-osx-font-smoothing: grayscale;
				position:absolute;
				top:6px;
				left:30px;
				font-size:2em;
			}
			
		}
	}



}

/* Page Login（会員ログインページ）
-----------------------------------------------------------------------------*/
body.page-template-page-login-php{
	background-image: url("images/login/bg01.png");
	background-repeat: no-repeat;
	background-size: cover;
	background-position:center center;
	background-attachment:fixed;
	
	@media only screen and (max-width: 767px) {
		background-position:left center;
	}
			
	& header{
		background-image:none;
		height:110px;
	}
}

/* Title */
body.page-template-page-login-php{
	& .page-title{
		max-width:447px;
		height:26px;
		
		@media only screen and (max-width: 767px) {
			margin-left:auto;
			margin-right:auto;
		}
		
		& .parts{
			background-image:url(images/login/item01.png);
			width:100%;
			height:0;
			padding-top:5.817%
			
		}
	}
}

/* Login Box */
body.page-template-page-login-php{
	& .box-login-outer{
		max-width: 320px;
		@media only screen and (max-width: 767px) {
			margin:0 auto;
		}

		& .box-login{
			background-color:rgba(255,255,255,0.5);
			border-radius:5px;
			box-shadow:0 0 3px rgba(0,0,0,0.1);
			padding:15px;
			margin-bottom:15px;
			@media only screen and (max-width: 767px) {
				background-color:rgba(255,255,255,0.8);
			}
			
			& .box{
				margin-bottom:15px;
			}
		& .btn-green{
			background-color:#006837;
			&:hover{
				background-color:#2c9f42;
			}
		}
		}
	}
}

/* Slider Character  */
body.page-template-page-login-php{
	& #charcter-slider{
    background:transpearant none repeat scroll 0 0;
    left: 50%;
    max-width: 300px;

		& .flexslider {
			border: none;
			border-radius: 0;
			box-shadow: none;
			margin:0px;
			background-color:transparent;
		}
	}
	
}
/* Slider Character  */
body.page-template-page-login-php{
	& .copyright{
    font-size: 0.8em;
    line-height: 1;
    margin: 0 auto;
    width: 210px;
		
		& .link-fb span {
				background-image: url("images/footer/footer-item09.png");
				height: 26px;
				width: 26px;
		}
		
		& .link-fb {
				display: inline-block;
				position: relative;
				top: 9px;
		}		

	}
	
	
}



/* Responsive Display On/Off
-----------------------------------------------------------------------------*/
/* 1024px未満で非表示 */

.on-display-1024{
	display:none!important;
}
@media only screen and (max-width: 1023px) {
	.no-display-1024{
		display:none!important;
	}
	.on-display-1024{
		display:block!important;
	}
}

/* 768px未満で非表示 */

.on-display-768{
	display:none!important;
}
@media only screen and (max-width: 767px) {
	.no-display-768{
		display:none!important;
	}
	.on-display-768{
		display:block!important;
	}
}