#tpl-contents{
	margin-top: 112px;

	-webkit-transition: margin-top .2s;
	-moz-transition: margin-top .2s;
	transition: margin-top .2s;
}
#tpl-contents.is-fixed{
	margin-top: 87px;
}
@media screen and (max-width: 750px){
#tpl-contents,
#tpl-contents.is-fixed{
	margin-top: 51px;
	padding-top: 0;
}
}



/* #visual
-----------------------------*/
#visual{
	margin: 0 auto;
	max-width: 1400px;
}

	#visual .list{
		opacity: 0;
		-webkit-transition: opacity .2s;
		-moz-transition: opacity .2s;
		transition: opacity .2s;
	}
	#visual.is-init .list{
		opacity: 1;
	}

	#visual a img{
		-webkit-transition: opacity .2s;
		-moz-transition: opacity .2s;
		transition: opacity .2s;
	}
	#visual a:hover img{
		opacity: 0.8;
	}


	/* [ slick reset ] */
	#visual .slick-slide img.only-sp{
		display: none;
	}
	@media screen and (max-width: 750px){
	#visual .slick-slide img.only-pc{
		display: none;
	}
	#visual .slick-slide img.only-sp{
		display: block;
	}
	}

	/* .slick-dots
	-----------------------------*/
	#visual .slick-dots{
		position: absolute;
		z-index: 5;
		bottom: 2.4%;/* 12/500 */

		display: block;

		width: 100%;
		padding: 0;
		margin: 0;

		list-style: none;

		text-align: center;
	}
		#visual .slick-dots li{
			position: relative;

			display: inline-block;

			width: 12px;
			height: 12px;
			margin: 0 5px;
			padding: 0;

			cursor: pointer;
		}

		#visual .slick-dots li button{
			font-size: 0;
			line-height: 0;

			display: block;

			cursor: pointer;

			color: transparent;
			border: 0;
			outline: none;
			background: transparent;

			position: absolute;
			top: 0;
			left: 0;

			width: 12px;
			height: 12px;

			background: #fff;
			border: 1px solid #fff;
			border-radius: 6px;
		}
		@media screen and (max-width: 750px){
		#visual .slick-dots li button{
			width: 10px;
			height: 10px;
		}
		}
		#visual .slick-dots li button:hover,
		#visual .slick-dots li button:focus{
			outline: none;
		}
		#visual .slick-dots li button:hover,
		#visual .slick-dots li button:focus{
			opacity: 1;
		}
		#visual .slick-dots li.slick-active button{
			background: #006d4f;
		}



/* #ex-important
-----------------------------*/
#ex-important{
	margin: 35px auto;
	max-width: 1254px;
}
@media screen and (max-width: 750px){
#ex-important{
	margin: 25px 15px;
}
}

#ex-important .wrap{
	display: table;
	width: 100%;
	border: 2px solid #ff0000;
}

	#ex-important .title{
		display: table-cell;
		width: 230px;
		vertical-align: middle;

		border-right: 2px solid #ff0000;
		text-align: center;

		padding: 30px;

		color: #ff0000;
		font-size: 15px;
		line-height: 1;
	}
	@media screen and (max-width: 750px){
	#ex-important .title{
		display: block;
		width: 100%;
		border-right: none;
		border-bottom: 2px solid #ff0000;

		padding: 15px;
	}
	}
		#ex-important .title::before{
			content: "";
			display: block;
			width: 32px;
			height: 32px;
			background: url(/top/img/ex-important-icon.png) no-repeat;
			margin: 0 auto 10px;
		}


	#ex-important .text-wrap{
		display: table-cell;
		vertical-align: middle;
		padding: 30px;
	}
	@media screen and (max-width: 750px){
	#ex-important .text-wrap{
		display: block;
		padding: 15px;
	}
	}
		#ex-important .text-wrap .item{
			font-size: 15px;
		}
		@media screen and (max-width: 750px){
		#ex-important .text-wrap .item{
			font-size: 14px;
		}
		}

		#ex-important .text-wrap .item + .item{
			margin-top: 15px;
		}
		@media screen and (max-width: 750px){
		#ex-important .text-wrap .item + .item{
			margin-top: 10px;
		}
		}


/* #news-important
-----------------------------*/
#news-important.first{
	padding: 30px 0 15px;
	max-width: 1254px;
	margin: 0 auto;
	text-align: center;
	border-bottom: 1px dotted #b2b2b2;
}

#news-important{
	padding: 15px 0 30px;
	max-width: 1254px;
	margin: 0 auto;
	text-align: center;
}




/* #news-important2
-----------------------------*/
#news-important2.first{
	padding: 30px 0 15px;
	max-width: 1254px;
	margin: 0 auto;
	text-align: center;
	border-bottom: 1px dotted #b2b2b2;
}

#news-important2{
	padding: 90px 0 30px;
	max-width: 1254px;
	margin: 0 auto;
	text-align: center;
}



@media screen and (max-width: 750px){
#news-important{
	padding: 25px 15px;
}
}
#ex-important + #news-important{
	padding-top: 0;
}

	#news-important p{
		font-size: 1.5rem;
		line-height: 1.8;
	}
	@media screen and (max-width: 750px){
	#news-important p{
		font-size: 1.4rem;
		line-height: 1.6;
	}
	}
	#news-important p + p{
		margin-top: 25px;
	}
	@media screen and (max-width: 750px){
	#news-important p + p{
		margin-top: 15px;
	}
	}


	/* .text-traceabilitya
	-----------------------------*/
	#news-important .text-traceability a{
		font-size: 2.0rem;
	}
	@media screen and (max-width: 750px){
	#news-important .text-traceability a{
		font-size: 1.8rem;
	}
	}
		#news-important .text-traceability .fz-small{
			font-size: 1.4rem;
		}
		@media screen and (max-width: 750px){
		#news-important .text-traceability .fz-small{
			font-size: 1.2rem;
		}
		}

	/* .text-bottom
	-----------------------------*/
#news-important .text-bottom{
	margin-top: 30px;
	padding-top: 30px;
	border-top: 1px solid #c5c5c5;
}
	#news-important .text-bottom a{
		font-size: 2.0rem;
	}
	@media screen and (max-width: 750px){
	#news-important .text-bottom a{
		font-size: 1.8rem;
	}
	}






/* #info-ticker
-----------------------------*/
#info-ticker{
	background: #f0f0f0;
	font-size: 1.4rem;

	position: relative;

	margin: 0 auto;
}
	#info-ticker .tpl-inner-wrap{
		display: table;
		width: 100%;
		max-width: 1254px;
		padding: 10px 0;
	}
	@media screen and (max-width: 750px){
	#info-ticker .tpl-inner-wrap{
		display: block;
	}
	}



	/* .title
	-----------------------------*/
	#info-ticker .title{
		display: table-cell;
		vertical-align: middle;

		color: #006d4f;
		font-weight: 500;

		border-right: 1px solid #aaa;
		padding-right: 20px;
	}
	@media screen and (max-width: 750px){
	#info-ticker .title{
		float: none;
		width: auto;
		display: block;
		text-align: center;
		padding-bottom: 10px;
		border: none;
	}
	}

	/* .list-wrap
	-----------------------------*/

	#info-ticker .list-wrap{
		visibility: hidden;
	}
	#info-ticker.is-init .list-wrap{
		float: left;
		width: 1020px;
		padding-left: 20px;

		visibility: visible;
	}
	@media screen and (max-width: 750px){
	#info-ticker.is-init .list-wrap{
		float: none;
		width: 90%;
		margin: 0 auto;
		background: #fff;

		padding: 10px;
	}
	}

		/* [ slick reset ] */
		#info-ticker .list-wrap .slick-arrow{
			display: none !important;
		}

		#info-ticker .list-wrap .item{
			outline: none;
		}

		#info-ticker .list-wrap a{
			display: block;
			text-decoration: none;
		}
		#info-ticker .list-wrap .item .date{
			float: left;
			display: block;
			padding-right: 10px;

			font-size: 1.3rem;
			font-weight: 500;
		}
		@media screen and (max-width: 750px){
		#info-ticker .list-wrap .item .date{
			float: none;
			display: block;
			padding-right: 0;
		}
		}

		#info-ticker .list-wrap .text{
			overflow: hidden;
			display: block;
		}
		#info-ticker .list-wrap a:hover .text{
			text-decoration: underline;
		}


	/* .btn-wrap
	-----------------------------*/
	#info-ticker .btn-wrap{
		float: right;
		width: 100px;

		visibility: hidden;
	}
	#info-ticker.is-init .btn-wrap{
		visibility: visible;
	}
		#info-ticker .btn-wrap .btn{
			display: inline-block;
			width: 34px;
			position: relative;
		}
		#info-ticker .btn-wrap .btn a::before{
			content: "";
			width: 34px;
			height: 20px;
			position: absolute;
			top: 0;
			left: 0;
		}
		#info-ticker .btn-wrap .btn a:hover::before{
			opacity: 0.8;
		}

			#info-ticker .btn-wrap .btn a{
				display: block;
				height: 20px;
				text-indent: -9999px;
			}
		@media screen and (max-width: 750px){
		#info-ticker .btn-wrap .btn{
			position: absolute;
			top: 60%;
			-webkit-transform: translateY(-50%);
			-ms-transform: translateY(-50%);
			transform: translateY(-50%);
		}
		}

		#info-ticker .btn-wrap .btn-prev{
			border-right: 1px solid #ccc;
		}
			#info-ticker .btn-wrap .btn-prev a::before{
				background: url(/common/img/icon-arrow-black-rev.png) no-repeat center center;
			}
			#info-ticker .btn-wrap .btn-next a::before{
				background: url(/common/img/icon-arrow-black.png) no-repeat center center;
			}

		@media screen and (max-width: 750px){
		#info-ticker .btn-wrap .btn-prev{
			left: 0;
			border: none;
		}
		#info-ticker .btn-wrap .btn-next{
			right: 0;
		}
		}






/* .sec
-----------------------------*/
.sec{
	padding: 40px 0 60px;
	width: 1254px;
	margin: 0 auto;
}
@media screen and (max-width: 750px){
.sec{
	padding: 30px 15px 50px;
	width: 100%;
}
}
	/* .title-wrap
	-----------------------------*/
	.sec .title-wrap{
		text-align: center;
	}
		.sec .title-wrap .icon{
		}
		@media screen and (max-width: 750px){
		.sec .title-wrap .icon{
			width: 30px;
			margin: 0 auto;
		}
		}

		.sec .title-wrap .title{
			font-size: 2.8rem;
			line-height: 1;
			padding-top: 14px;
		}
		@media screen and (max-width: 750px){
		.sec .title-wrap .title{
			font-size: 2rem;
			padding-top: 10px;
		}
		}
		.sec .title-wrap .sub{
			padding: 10px 0 0;
			font-size: 1.1rem;
			color: #006d4f;
			font-weight: 500;
		}


		.sec .banner{
			padding-top: 35px;
		}
		@media screen and (max-width: 750px){
		.sec .banner{
			padding-top: 15px;
		}
		}
		.sec .banner .list{
			overflow: hidden;
		}
			.sec .banner .list .item{
				float: left;
				width: 612px;
				position: relative;
			}
			.sec .banner .list .item + .item{
				float: right;
			}
			@media screen and (max-width: 750px){
			.sec .banner .list .item{
				float: none;
				width: 100%;
			}
			.sec .banner .list .item + .item{
				float: none;
				margin-top: 15px;
			}
			}



		.sec .banner2{
			padding-top: 35px;
		}
		@media screen and (max-width: 750px){
		.sec .banner2{
			padding-top: 15px;
		}
		}
		.sec .banner2 .list{
			overflow: hidden;
		}
			.sec .banner2 .list .item{
				float: none;
				width: 612px;
				position: relative;
			}
			.sec .banner2 .list .item + .item{
				float: right;
			}
			@media screen and (max-width: 750px){
			.sec .banner2 .list .item{
				float: none;
				width: 100%;
			}
			.sec .banner2 .list .item + .item{
				float: none;
				margin-top: 15px;
			}
			}






/* #sec-about
-----------------------------*/
#sec-about{
}
	#sec-about .list{
		/*hidden*/
		width: 1px;
		height: 1px;
		margin: -1px;
		overflow: hidden;
		visibility: hidden;
	}
	#sec-about.is-init .list{
		display: none;
	}

	#sec-about .list.is-active{
		display: block;

		/*visible*/
		width: auto;
		height: auto;
		margin: auto;
		visibility: visible;
	}


	#sec-about .banner .list .item a img{
		-webkit-transition: opacity .2s;
		-moz-transition: opacity .2s;
		transition: opacity .2s;

		width: 100%;
	}
	#sec-about .banner .list .item a:hover img{
		opacity: 0.8;
	}




/* ##sec-special
-----------------------------*/
#sec-special{
	max-width: 1400px;
	margin: 0 auto;

	text-align: center;
}
	#sec-special a{
		display: block;
		position: relative;
		z-index: 5;
		padding-top: 99px;
		height: 430px;
		text-decoration: none;
	}
	@media screen and (max-width: 750px){
	#sec-special a{
		padding-top: 60.93333333333333%;/* 457/750 */
		height: auto;
	}
	}

	#sec-special p{
		position: relative;
		z-index: 10;
	}
	@media screen and (max-width: 750px){
	#sec-special p{
		position: absolute;
		z-index: 5;
		left: 0;
		width: 100%;
	}
	}

	#sec-special .title{
	}
	@media screen and (max-width: 750px){
	#sec-special .title{
		top: 13.12910284463895%;/* 60/457 */
	}
		#sec-special .title img{
			width: 60.26666666666667%;/* 452/750 */
		}
	}

	#sec-special .lead{
		color: #fff;
		font-size: 1.4rem;
		line-height: 1.8;
		text-shadow: 0 0 4px rgba(0,0,0,1);
		padding-top: 30px;
	}
	@media screen and (max-width: 750px){
	#sec-special .lead{
		padding-top: 0;
		top: 55.79868708971554%;/* 255/457 */
	}
	}
	@media screen and (max-width: 480px){
	#sec-special .lead{
		font-size: 1rem;
	}
	}

	#sec-special .btn{
		padding-top: 50px;
	}
	@media screen and (max-width: 750px){
	#sec-special .btn{
		padding-top: 0;
		bottom: 8.096280087527352%;/* 37/457 */
	}
	}

		#sec-special .btn .tpl-btn{
			padding: 10px;
			width: 180px;
			min-width: 0;

			color: #333;
		}
		@media screen and (max-width: 480px){
		#sec-special .btn .tpl-btn{
			padding: 5px;
			width: 140px;
			font-size: 1rem;
		}
		}

	#sec-special .bg{
		position: absolute;
		top: 0;
		left: 0;
		z-index: 1;

		max-width: 1400px;
		width: 100%;
		height: 430px;
		background: url(/top/img/special-bg.jpg) no-repeat center center;

		-webkit-transition: opacity .2s;
		-moz-transition: opacity .2s;
		transition: opacity .2s;
	}
	@media screen and (max-width: 750px){
	#sec-special .bg{
		width: 100%;
		height: auto;
		background-size: cover;

		padding-top: 60.93333333333333%;/* 457/750 */
	}
	}
	#sec-special a:hover .bg{
		opacity: 0.8;
	}



/* #sec-products
-----------------------------*/
#sec-products{
}
#sec-about + #sec-products{
	padding-top: 10px;
}
@media screen and (max-width: 750px){
#sec-about + #sec-products{
	padding-top: 0;
}
}
	#sec-products a{
		text-decoration: none;
	}
	#sec-products .label{
		display: block;
		color: #fff;

		padding: 20px 25px 20px 45px;

		line-height: 1;
		font-size: 2.0rem;

		background: #006d4f url(/common/img/icon-arrow-white-large.png) no-repeat 20px center;
	}
	@media screen and (max-width: 750px){
	#sec-products .label{
		font-size: 1.1rem;

		padding: 15px 20px 15px 25px;
		background: #006d4f url(/common/img/icon-arrow-white-large.png) no-repeat 12px center;
		background-size: auto 11px;
	}
	}
	#sec-products a:hover .label{
		text-decoration: underline;
	}
	#sec-products .label{

	}

	#sec-products .photo img{
		-webkit-transition: opacity .2s;
		-moz-transition: opacity .2s;
		transition: opacity .2s;
	}
	#sec-products a:hover .photo img{
		opacity: 0.8;
	}



/* #pickup
-----------------------------*/
#pickup{
	background: #eee;
	padding: 50px 0;

	margin: 0 auto;
}
@media screen and (max-width: 750px){
#pickup{
	padding: 30px 0;
}
}
	#pickup .tpl-inner-wrap{
		position: relative;
	}

	/* .title-wrap
	-----------------------------*/
	#pickup .title-wrap{
		text-align: center;
		padding-bottom: 40px;
	}
	@media screen and (max-width: 750px){
	#pickup .title-wrap{
		padding-bottom: 20px;
	}
	}
		#pickup .title-wrap .title{
			font-size: 2.8rem;
			line-height: 1;
		}
		@media screen and (max-width: 750px){
		#pickup .title-wrap .title{
			font-size: 2rem;
		}
		}
		#pickup .title-wrap .sub{
			padding: 10px 0 0;
			font-size: 1.1rem;
			color: #006d4f;
			font-weight: 500;
		}

	/* .list-wrap
	-----------------------------*/
	#pickup .list-wrap{
		width: 1254px;
		overflow: hidden;
	}
	@media screen and (max-width: 750px){
	#pickup .list-wrap{
		width: 100%;
	}
	}

		#pickup .list{
			opacity: 0;

			-webkit-transition: opacity .2s;
			-moz-transition: opacity .2s;
			transition: opacity .2s;

			/*hidden*/
			width: 1px;
			height: 1px;
			margin: -1px;
			overflow: hidden;
			visibility: hidden;
		}
		#pickup.is-init .list{
			display: none;
		}

		#pickup .list.is-active{
			display: block;
			opacity: 1;

			/*visible*/
			width: auto;
			height: auto;
			margin: auto;
			visibility: visible;
		}

		#pickup .item{
			outline: none;
		}
		/* [ カルーセルの最低数とitem数が同じ場合：PC幅でclone非表示 ] */
		#pickup.is-min-item .item.origin-clone{
			display: none;
		}
		@media screen and (max-width: 750px){
		#pickup.is-min-item .item.origin-clone{
			display: block;
		}
		}

		#pickup .item a{
			display: block;
			width: 291px;
			text-decoration: none;
		}
		@media screen and (max-width: 750px){
		#pickup .item a{
			display: block;
			width: 223px;
			margin: 0 auto;
		}
		}

		#pickup .item .photo{
			padding: 8px;
			background: #fff;
		}
		@media screen and (max-width: 750px){
		#pickup .item .photo{
			padding: 5px;
		}
		}
			#pickup .item .photo img{
				width: 100%;

				-webkit-transition: opacity .2s;
				-moz-transition: opacity .2s;
				transition: opacity .2s;
			}
			#pickup .item a:hover .photo img{
				opacity: 0.8;
			}


		#pickup .item .name{
			font-size: 1.5rem;
			font-weight: 500;
			padding-top: 8px;
		}
		#pickup .item a:hover .name{
			text-decoration: underline;
		}


		/* [ slick reset ] */
		#pickup .list-wrap .slick-list{
			width: 1279px;
		}
		@media screen and (max-width: 750px){
		#pickup .list-wrap .slick-list{
			width: 100%;
		}
		}
		@media screen and (max-width: 650px){
		#pickup .list-wrap .slick-list{
			width: 700px;
			position: relative;
			left: 50%;
			-webkit-transform: translateX(-50%);
			-ms-transform: translateX(-50%);
			transform: translateX(-50%);

			overflow: visible;
		}
		}

		#pickup .list-wrap .slick-arrow{
			display: none !important;
		}

	/* .btn-wrap
	-----------------------------*/
	#pickup .btn-wrap{
		float: right;
		width: 100px;

		visibility: hidden;
	}
	#pickup.is-init .btn-wrap{
		visibility: visible;
	}

		/* .btn
		-----------------------------*/
		#pickup .btn-wrap .btn{
			position: absolute;
			top: 55%;
			-webkit-transform: translateY(-50%);
			-ms-transform: translateY(-50%);
			transform: translateY(-50%);
		}
		@media screen and (max-width: 750px){
		#pickup .btn-wrap .btn{
			top: 49%;
		}
		}
			#pickup .btn-wrap .btn a{
				display: block;
				width: 18px;
				height: 30px;
				text-indent: -9999px;

				-webkit-transition: opacity .2s;
				-moz-transition: opacity .2s;
				transition: opacity .2s;
			}
			@media screen and (max-width: 750px){
			#pickup .btn-wrap .btn a{
				width: 40px;
				height: 40px;
				background-color: rgba(0, 108, 79, 0.9) !important;
				border-radius: 20px;
			}
			}
			#pickup .btn-wrap .btn a:hover{
				opacity: 0.8;
			}

		/* [ カルーセルの最低数とitem数が同じ場合:PC幅でbtn非表示 ] */
		#pickup.is-min-item .btn-wrap .btn{
			display: none;
		}
		@media screen and (max-width: 750px){
		#pickup.is-min-item .btn-wrap .btn{
			display: block;
		}
		}



		#pickup .btn-wrap .btn-next{
			right: -35px;
		}
		@media screen and (max-width: 750px){
		#pickup .btn-wrap .btn-next{
			right: 10px;
		}
		}
			#pickup .btn-wrap .btn-next a{
				background: url(/common/img/icon-arrow-green-exlarge.png) no-repeat;
			}
			@media screen and (max-width: 750px){
			#pickup .btn-wrap .btn-next a{
				background: url(/common/img/icon-arrow-white.png) no-repeat 18px center;
			}
			}

		#pickup .btn-wrap .btn-prev{
			left: -40px;
		}
		@media screen and (max-width: 750px){
		#pickup .btn-wrap .btn-prev{
			left: 10px;
		}
		}
			#pickup .btn-wrap .btn-prev a{
				background: url(/common/img/icon-arrow-green-exlarge-rev.png) no-repeat;
			}
			@media screen and (max-width: 750px){
			#pickup .btn-wrap .btn-prev a{
				background: url(/common/img/icon-arrow-white-rev.png) no-repeat 16px center;
			}
			}

/* #news
-----------------------------*/
#news{
	padding: 80px 0 0;
}
@media screen and (max-width: 750px){
#news{
	padding: 40px 0 0;
}
	#news .tpl-inner-wrap{
		padding: 0 15px;
	}
}

	#news .wrap{
		display: table;
		width: 100%;
	}
	@media screen and (max-width: 750px){
	#news .wrap{
		display: block;
	}
	}
	#news .wrap + .wrap{
		margin-top: 20px;
		padding-top: 40px;
		border-top: 1px dotted #b2b2b2;
	}
	@media screen and (max-width: 750px){
	#news .wrap + .wrap{
		margin-top: 40px;
		padding-top: 0;
		border-top: none;
	}
	}

	/* .title-box
	-----------------------------*/
	#news .title-box{
		display: table-cell;
		width: 335px;
	}
		#news .title-box .title{
			font-size: 3rem;
			color: #006d4f;
		}
		@media screen and (max-width: 750px){
		#news .title-box .title{
			font-size: 1.8rem;
		}
		}

		#news .title-box .btn{
			margin-top: 25px;
		}
		@media screen and (max-width: 750px){
		#news .title-box .btn{
			display: none;
		}
		}
			#news .title-box .btn a{
				padding: 8px 40px;
				min-width: 0;
			}

	/* .list-box
	-----------------------------*/
	#news .list-box{
	}
		#news .list-box .item:last-child{
			border-bottom: none;
		}


	/*.btn-bottom
	-----------------------------*/
	#news .btn-bottom{
		display: none;
	}
	@media screen and (max-width: 750px){
	#news .btn-bottom{
		padding-top: 10px;

		display: block;
		width: 240px;
		margin: 0 auto;
	}
	}