@charset "utf-8";
/* CSS Document */
*{
	box-sizing: border-box;
}


/*---MV---*/
.top_mv{
	margin:0 auto 20px;
}
.top_mv video{
	display: block;
	margin:0 auto;
	max-width: 100%;
}
.top_mv > div,
.top_mv_1_1 > div,
.top_mv_1_7 > div,
.top_mv_2_4 > div{
	float: left;
	box-sizing: border-box;
	overflow: hidden;
	position: relative;
}
.top_mv_1_1 img{
    position: absolute;
    left: 10%;
    bottom: -13%;
    width: 75%;
}
.top_mv_1_1_1{
	background: url("images/mv/mv1_1_bg1.png") 50% 50% repeat;
	background-size: 7px 12px;
	
}
.top_mv_1_1_2{
	background: url("images/mv/mv1_1_bg2.png") 50% 50% repeat;
	background-size: 15px 19px;
}
.top_mv_1_2{
	background:#fdcc64;
}
.top_mv_1_2 img{
	position: absolute;
}
.top_mv_1_2_fork{
top: -89%;
    left: 8%;
    width: 44%;
}
/*.top_mv_1_2_spoon{
	top:17%;
	left:51%;
	width:32.5%;
}*/
.top_mv_1_2_spoon,
.top_mv_1_2_spoon_bucho{
	top:10%;
	left:53%;
	width:40%;
}
.top_mv_1_2_spoon{
	opacity:1;
}
.top_mv_1_2_spoon_bucho{
	opacity:0;
}

/*.top_mv_1_2_bucho{
	top:-70%;
	left:46%;
	width:44.64%;
}*/
.top_mv_1_3{
	background: url("images/mv/mv1_3_bg.png");
	background-size:6px 12px;
}
.top_mv_1_3_obj{
	    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 77.52%;
}
.top_mv_1_4,
.top_mv_2_8{
	background:#FCDD64;
}
.top_mv_1_4_logo{
	position: absolute;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	width:90%;
	height:90%;
}
.top_mv_1_5{
	background: url("images/mv/mv1_5_bg.png");
	background-size:18px;
}
.top_mv_1_5 img{
	position:absolute;
}
.top_mv_1_5 .top_mv_1_5_dish{
	top:0%;
	left:-28.6%;
	width:128.5%;
	max-width:none;
}

/*.top_mv_1_5 .top_mv_1_5_dish{
	top:-32.6%;
	left:-28.6%;
	width:128.5%;
}*/
.top_mv_1_5 .top_mv_1_5_hand,
.top_mv_1_5 .top_mv_1_5_hand_thumb{
    left: 180%;
    top: -160%;
    width: 42.8%;
	transform: rotate(-132deg);
}
.top_mv_1_5_bucho{
	opacity: 0;
	left:8%;
	width:48%;
	bottom:-1%;
}
.top_mv_1_6,
.top_mv_2_7{
	background:#A3CC7A;
}
.top_mv_1_6_text{
	    width: 82%;
    top: 7%;
    position: absolute;
    left: 6%;
}
.top_mv_1_7 img{
	position:absolute;
}

.top_mv_1_7 .top_mv_1_7_text{
	width:94%;
	top:5%;
	left:3%;
}
.top_mv_1_7 .top_mv_1_7_hand{
	width:56.8%;
	top:33%;
	left:0%;
}
.top_mv_1_7 .top_mv_1_7_bucho{
	width: 14.8%;
    top: 35%;
    left: 35%;
}
.top_mv_1_7_1{
	background:url("images/mv/mv1_7_1_bg.png");
}
.top_mv_1_7_2{
	background:url("images/mv/mv1_7_2_bg.gif");
}
.top_mv_2_1{
	background: url("images/mv/mv2_1_bg_2x.png");
	background-size:25px 25px;
}
.top_mv_2_2_pickles{
	position: absolute;
	width: 90%;
	top: 11%;
	left: 7%;
}
.top_mv_2_3{
	background:#A3CC7A;
}
.top_mv_2_3 img{
	position: absolute;
	transition:all 0.75s;
}
.top_mv_2_3_ume{
    top: 23%;
    left: 20%;
    width: 20%;
}
.top_mv_2_3_onigiri1{
    top: 54%;
    left: 16%;
    width: 30%;
}
.top_mv_2_3_onigiri2{
    top: 16%;
    left: 55%;
    width: 30%;
}
.top_mv_2_3_takuan{
    top: 60%;
    left: 55%;
    width: 30%;
}
.top_mv_2_3_rotate{
	transform:rotate(360deg);
}
.top_mv_2_4 img{
	position: absolute;
}
.top_mv_2_4_text{
    top: 7%;
	left: 0%;
    width: 64%;
	height:64%;
}
.top_mv_2_4_hand{
    top: -33%;
    left: 60%;
    width: 70%;
}
.top_mv_2_4_salad{
    top: 44%;
    left: 9%;
    width: 58%;
}
.top_mv_2_4_bucho{
top: 63%;
    left: 36%;
    width: 20%;
}
.top_mv_2_4_1{
	background:url("images/mv/mv2_4_1_bg.png");
	background-size:100%;
	
}
.top_mv_2_5{
	background:url("images/mv/mv2_5_bg.png");
	background-size: 12.5%;
	/*background-position: right center;
	background-size:auto 100%;*/
}
.top_mv_2_5_bucho_1,
.top_mv_2_5_bucho_2{
	position:absolute;
	width:100%;
	left:0;
	top:0;
}
.top_mv_2_5_wink{
	z-index: 2;
}
.top_mv_2_6{
	background: url("images/mv/mv2_6_bg_2x.png");
	background-size:11.1%;
}
.top_mv_2_6 img{
	position: absolute;
	top: 10%;
    left: 20%;
}
.top_mv_2_7 img{
	position:absolute;
}
.top_mv_2_7_music{
 	position:absolute;
   width: 80%;
    height: 70%;
    top: 15%;
    left: 10%;
}
.tateline{
	height:100%;
}
.nanameline{
width: 54%;
    left: 47%;
    top: 38%;
}
.onpu2{
	    width: 30%;
    top: 42%;
    left: 39%;
}
.onpu1{
	width: 20%;
    left: 22%;
    top: 0%;
}
.toon{
	width: 20%;
    top: 50%;
    left: 13%;
}
.music_anim1{
	animation: music_anim1 1s infinite;
}
.music_anim2{
	animation: music_anim2 1s infinite;
}
.music_anim3{
	animation: music_anim3 1s infinite;
}

@keyframes music_anim1{
	25% {top:-10%}
	50%{top:0%}
}
@keyframes music_anim2{
	50% {top:32%}
	75%{top:42%}
}
@keyframes music_anim3{
	75% {top:40%}
	100%{top:50%}
}
.top_mv_2_7_bucho{
	top:100%;
	left:-40%;
	width:90%;
}
.top_mv_2_8 img{
	position: absolute;
	width:100%;
	left:-10%;
}
/*mv 動画*/
.top_mv video{
	display: block;
	margin:0 auto;
}
/*.top_mv div:nth-child(odd){
	background:#999;
}
.top_mv div:nth-child(even){
	background:#333;
}*/


/*--ファーストビューのバナー群--*/
.top_fv_container a{
	box-shadow:3px 2px 5px 0 #ddd;
}
.top_fv_container_left,
.top_fv_container_right{
	float:left;
}
.top_fv_container_left{
	width:80%;
}
.top_fv_container_right{
	width:20%;
}
.top_fv_container_left a{
	display: block;
	overflow: hidden;
	border:1px solid #c8c2c2;
	border-radius: 4px;
	transition: all 0.3s;
	float:left;
	margin:5px;
	/*width:24%;*/
}
.top_fv_container_left a img{
	display: block;
	width:216px;
	height:auto;
	/*max-width: 100%;*/
}

.top_fv_container_left a:hover,
.fv_cm:hover,
.fv_radiation:hover{
	transform:translateY(3px);
	background-color:#edffdf;
	box-shadow:0 0 0 0 #ddd;

}
.top_fv_container_right a{
}
.top_fv_container_right a img{
	display: block;
	max-width: 100%;
}
.fv_cm{
	width:218px;
	display: block;
	overflow: hidden;
	border:1px solid #c8c2c2;
	border-radius: 4px;
	transition: all 0.3s;
	margin:5px;
	/*width:24%;*/
}
.fv_radiation{
	width:218px;
	background-color: #81b44b;
	display: block;
	border-radius: 4px;
	transition: all 0.3s;
	margin:9px 5px 5px;
}
.fv_radiation:hover{
	transform:translateY(3px);
	background-color:#729f43;
}

.to_bucho img{
	max-width: 100%;
}
.to_land{
	background: url("images/to_land_bg.png") no-repeat center center;
	background-size: cover;
}
.fv_inner{
	width:1150px;
	padding:0 5px;
	margin:0 auto;
}
.inner{
	width:1150px;
	margin:0 auto;
}

/*レシピ*/
.top_recipe_container{
	display: flex;
	justify-content: space-between;
}
/*商品情報*/
.top_products_box,.top_bottom_box, .top_recipe_box{
	margin:70px 0;

}
.top_products_box a{
	transition:all 0.3s;
}
.top_products_box a:hover{
	transform:translateY(3px);
	background:#edffdf;
}
.top_products_container{
	display:table;
	width:100%;
}
.top_products_container > div{
	display:table-cell;
	width:33.3%;
}
.top_products_container > div:nth-child(2){
	border-left:1px solid #81b44b;
	border-right:1px solid #81b44b;
}
.top_products_container h3{
	text-align:center;
}
h2{
	font-size:30px;
	color:#81b44b;
	margin:0;
}
h3{
	font-size:20px;
	font-weight: normal;
	color:#3f3a3a;
	margin:1em 0;
}
.top_to_tokusetsu a{
	display:block;
	float:left;
	border:1px solid #ccc;
	width:48%;
	margin-bottom:2%;
	border-radius:4px;
}
.top_to_tokusetsu a:nth-child(even){
	margin-right:2%;
}
.top_to_tokusetsu a img{
	display:block;
	max-width:100%;
	margin:0 auto;
}
.top_to_brand a{
	display:block;
	border:1px solid #ccc;
	width:auto;
	margin-bottom:2%;
	border-radius:4px;
	margin:0 auto 2%;
	overflow:hidden;
	    max-width: 366px;
}
.top_to_brand a img{
	display:block;
	max-width:100%;
}
.top_to_brand .to_brand_text{
	margin:0 2% 1.5em;
	font-size:14px;
}
.top_to_brand .to_brand_text div{
	font-weight:bold;
}
.top_to_category a{
	display:block;
	float:left;
	width:48%;
	border:1px solid #ccc;
	border-radius:4px;
}
.top_to_category a:nth-child(even){
	margin:0 2% 2% 2%;
}
.top_to_category a:nth-child(odd){
	margin:0 0 2% 0;
}
.top_to_category a img{
	display:block;
	max-width:100%;
	margin: 0 auto;
}
.top_bottom_box{
	display: table;
	width:100%;
}
.top_bottom_box > div{
	display:table-cell;
	width:50%;
}
.to_shop a{
	display: block;
	float: left;
	width:48%;
	border-radius:4px;
	overflow:hidden;
	border:1px solid #ccc;
	margin-bottom:2%;
	transition:all 0.3s;
}
.to_shop a:hover,
.to_usa:hover{
transform: translateY(3px);
}
.to_shop a:nth-child(even){
	margin-right:2%;
}
.to_shop a img{
	display: block;
	max-width:100%;
}
.news_list{
	border:1px solid #81b44b;
	padding:1em 1em 2.5em;
	font-size:0.8em;
	position:relative;
}
.news_list a{
	display: block;
	color:inherit;
	text-decoration: none;
}
.news_list a:hover{
	text-decoration: underline;
}
.news_list .news_date{
	width:8em;
	display: inline-block;
}
.news_list a.to_news{
	display: block;
	position: absolute;
	bottom:0;
	right:0;
	padding:1em;
	font-weight: bold;
	color:#81b44b;
}
.to_usa{
	display: block;
	background: #81b44b;
	border-radius:6px;
	margin-top:1em;
	color:#fff;
	text-decoration: none;
	font-size:18px;
	text-align:center;
	transition: all 0.3s;
}
.top_recipe_container{
	
}
.top_recipe_container a{
	display: flex;
    border: 1px solid #ccc;
    border-radius: 4px;
	text-align: center;
	text-decoration: none;
	color:#3e3a39;
	font-weight: bold;
	transition: all 0.3s;
	box-shadow: 3px 2px 5px 0 #ddd;
          align-items: center;
          justify-content: center;
			  padding:1em;
}

.top_recipe_container a:hover{
	transform: translateY(3px);
    background-color: #edffdf;
    box-shadow: 0 0 0 0 #ddd;
}



.top_recipe_container>a{
    float: left;
	margin-right:10px;
}
.top_recipe_container>a{
    width: 25%;
    background: url(images/recipe_to_recipetop_2x.png) right bottom no-repeat;
    background-size: cover;
}
.healthy_recipes{
	width:75%;
	float: left;
	display: flex;
    flex-wrap: wrap;
}
.healthy_recipes h3{
	flex-basis: 100%;
    margin: 0 0 0.5em;
    border-bottom: 1px solid #ccc;
	background: url("images/healthy.png") left center no-repeat;
	background-size: contain;
	padding-left:2em;
}
.healthy_recipes a{
	width:calc(33.3% - 7px);;
	float: left;
} 
.healthy_recipes a:nth-child(-n+4){
	margin-bottom: 10px;
	
} 
.healthy_recipes a:not(:nth-child(4n)){
	margin-right: 10px;
	
} 
	.half img{
		margin:1.4% auto;
	}

@media (max-width:1159px) {
	.fv_inner,
	.inner,
	.top_products_container{
		width:100%;
		padding:0 5px;
	}
	.top_fv_container_left a{
		display: block;
		overflow: hidden;
		border:1px solid #c8c2c2;
		border-radius: 4px;
		transition: all 0.3s;
		float:left;
		margin:5px;
		width:23%;
	}
	.top_fv_container_left a img{
		display: block;
		/*width:182px;*/
		height:auto;
		max-width: 100%;
	}
	.fv_cm{
		width:93%;
		display: block;
		overflow: hidden;
		border:1px solid #c8c2c2;
		border-radius: 4px;
		transition: all 0.3s;
		margin:5px;
		/*width:24%;*/
	}
	.fv_radiation{
		width:93%;

		background-color: #81b44b;
		display: block;
		border-radius: 4px;
		transition: all 0.3s;
		margin:9px 5px 5px;
	}
	
}
@media (max-width:767px) {
	.fv_inner,
	.inner{
		width:900px;
	}
}
@media (max-width:480px) {
	.fv_inner,
	.inner{
		width:auto;
	}
	h3{
		margin-bottom:0;
	}
	.top_fv_container_left,
	.top_fv_container_right
	{
    	width: auto;
		float: none;
	}
	.top_fv_container_left a,
	.top_fv_container_right a{
		width:48%;
		margin:1%;
	}
	.top_products_container{
		display:block;
	}
	.top_products_container>div{
		display:block;
		width:auto;
		margin-bottom:1em;
	}
	.top_products_container>div:nth-child(2){
		border-left:none;
		border-right:none;
	}
	.top_products_container>div:not(:first-child){
		border-top:1px solid #ccc;
	}
	.top_bottom_box > div{
		display:block;
		width:auto;
	}
	.to_shop{
		margin-bottom:70px;
	}
	.top_recipe_container{
		flex-direction: column;
	}
	.top_recipe_container > a{
		width:auto;
		margin-bottom: 10px;
		background: none;
		margin-right:0;
	}
	.healthy_recipes{
		width: auto;
	}
	.healthy_recipes span{
		display:inline-block;
	}
	.healthy_recipes a{
		width:calc(50% - 5px);
		margin-bottom:10px;
	}
	.healthy_recipes a:nth-child(even){
		margin-right:10px;
	}
	.healthy_recipes a:nth-child(odd){
		margin-right:0;
	}
	.half{
		height:auto;
	}
	.half img{
		margin:2.1% auto;
	}

	

}
.top_fv_container_left half{
	
}