@charset 'utf-8';

/* MAIN index of FUNCTIONAL FOOD
------------------------------------------------ */
	#ffood{ overflow: hidden; }
	.ffood{ max-width: 1406px; margin: 0 auto; overflow: hidden; margin-bottom: 86px; padding: 0 15px; }
	/* FFOOD slider
	------------------------------------------------ */
		.ffood__slide{ position: relative; margin-bottom: 85px; }
		.ffood__slide:after,.ffood__slide:before{ position: absolute; content: ''; width: 100%; left: 0; z-index: 1; }
		.ffood__slide:after{ height: 10%; background: url(../../img/share/weavyslide.png)no-repeat center center; background-size: cover; bottom: -2px;  }
		.ffood__slide:before{ content: none; height: 100%; top: 0px; }
		/* link inside slider */
			.slider__link{ position: relative; }
			.slider__link:before { position: absolute; content: ''; width: 100%; left: 0; height: 100%;top: 0px; }
			.slider__linkNo:before { content: none; }
			.slider__link--block{ position: absolute; width: fit-content; top: 50%; left: 150px; transform: translateY(-50%); transition: 0.6s ease; }
			.slider__link--block-p{ color: #fff; font-size: 4rem;font-weight:bold; margin-bottom: 10px; text-shadow: 3px 2px 2px #000000c4; }
			.slider__link--block-p-2{ font-size: 2.1rem; font-weight: bold; margin-bottom: .5em; letter-spacing: 0.05em; color:#434343; }
			.slider__link--block a{ width: 200px; height: 46px; display: flex; justify-content: center; align-items: center; background: url(../../img/main/bg-button_fv.png) no-repeat; border: 1px solid #ef804e; border-radius: 23px; color: #fff; font-size: 1.6rem; line-height: 1; font-weight: bold; box-shadow: 0px 0px 20px -6px rgb(0 0 0 / 62%); text-shadow: 2px 2px 2px #333333a6;}
			.slider__link--block a:hover{ background: #fff; color: #ef804e;border: 1px solid #ef804e; transition: ease 0.4s; box-shadow: 0 0px 15px -2px #707070; opacity: 1;text-shadow:2px 2px 2px #d78e46c9; }

	/* FUNCTIONAL FOOD COLUMN
	------------------------------------------------ */
		.ffood__column{ position: relative; display: block; flex-wrap: wrap; width: 100%; }
		.ffood__column:before{ background: #F8E8D7; left: 0; top: 0px; z-index: -1; }
		.ffood__slide .slick-prev:before,
		.ffood__slide .slick-next:before{ -webkit-filter: drop-shadow(0px 0px 0px #ccc); filter: drop-shadow(0px 0px 5px #ccc); }
		/* TITLE */
			.ffood--title{ margin-left: 100px; line-height: 1; }
			.ffood--title-en{ margin-left: 14px; font-size: 1.1rem; color: #EF9E4E; }
			.ffood--title-jp{ font-size: 1.7rem; }
		/* column block */
			.ffood__column--list{ position: relative; display: flex; overflow-x:hidden; background: rgba(234, 182, 130, 0.32); margin-top: 27px; padding: 40px 0 60px; }
			.list__column{ display: inline-flex; background: #FFF; border-radius: 5px; overflow: hidden; margin-right: 27px; }
			.list__column a{ position: relative; display: block; width: 100%; height: 100%; }
			.list__column a:after{ position: absolute; content: ''; width: 100%; height: 18px; background: #fff; bottom: 0; left: 0; }
			.list__column a .new:after{ top: 4px; right: 20px; }
			.list__column--img{ width: 100%; }
			.list__column--img img{ width: 100%; }
			.list__column-top.list__column--img img { height: 180px; }
			.list__column__desc{ width: 100%; display: flex; flex-wrap: wrap; flex-direction: column; margin: 12.5px 0 20px; padding: 0 10px; }
			.list__column__desc.list__column-top{ padding: 0 20px; }
			.list__block__desc--cont > p:nth-child(n+2){ display: none; }
			.list__column__desc--date { margin-bottom: 24px; }
			.list__column__desc--date span{ color: #EF804E; font-size: 1.6rem; overflow: hidden; }
			.list__column__desc--title{ width: fit-content; min-height: 0x; margin-bottom: 10px }
			.list__column__desc--title-t{ font-size: 1.6rem; line-height: 1.75; }
			.list__column__desc--txt{  }
			.list__column__desc--txt-p{ color: #919191; font-size: 1.3rem; }

			/* YOUTUBE */
				.wp-block-video,.wp-block-embed__wrapper,.sub-title{ display: none; }
				.wp-block-video { margin-bottom: 16px; margin-top: 10px; }

			/* view more button */
				.ffood__column--viewmore{ position: absolute; width: 173px; top: -11px; right: 100px; text-align: center; }
				.ffood__column--viewmore a{ display: block; padding: 14px 0; background: #fff; border: 1px solid #434343; border-radius: 23px; font-size: 1.6rem; line-height: 1; }
				.ffood__column--viewmore a:hover{ background: #EF804E; border: transparent; color: #FFF; }

	/* FUNCTIONAL FOOD HEALTH
	------------------------------------------------ */
		.color{ color: #EF804E; }
		.ffood__health{ position: relative; width: 100%; display: block; overflow: hidden; padding: 156px 0 54px; }
		.ffood__health--break { position: relative; max-width: 966px; margin: 0 auto; }
		.ffood__health--break:before,
		.ffood__health--break:after{ position: absolute; content: ''; width: 100%; left: 0; }
		.ffood__health--break:before{ width: 727.13px; height: 220px; top: -82px; left: -200px; background: url(../../img/main/orange.png) no-repeat; background-size: 100%; }
		.ffood__health--break:after{ width: 668.57px; height: 317px; bottom: -37px; right: -200px; left: auto; background: url(../../img/main/plate.png) no-repeat; background-size: 100%; }
		.ffood__health--title,
		.ffood__health--desc{ position: relative; z-index: 1; display: block; text-align: center; }
		.ffood__health--desc{ margin-top: 60px; }
		.ffood__health--title-t{ font-size: 4.2rem; font-weight: bold; line-height: 1.42; color: #6A6A6A; }
		.ffood__health--desc-p{ font-size: 2rem; line-height: 1.8; font-weight: 500; }
		.ffood__health--lnk{ padding-right: 27px; display: block; margin: 50px auto 0; text-align: center; width: 415px; font-size: 1.8rem; font-weight: 500; letter-spacing: 0.072em; line-height: 39px; border:2px solid #EF734E; color:#EF734E; border-radius: 30px; background:url(../../img/main/arrow-down.png) no-repeat calc(100% - 6px) center / 30px 30px; }

	/* FUNCTIONAL FOOD 	REDIRECT LINK
	------------------------------------------------ */
		.ffood__redirect{ position: relative; width: 100%; margin: 40px 0 50px; padding: 170px 0 80px; background: url(../../img/main/orange-bubble.png) no-repeat top center; background-size: 100% 100%; }
		.ffood__redirect:before,.ffood__redirect:after{ position: absolute; content: ''; width: 100%; height: 72px; left: 0; }
		.ffood__redirect:before{ height: 120px; background: linear-gradient(to bottom, rgba(255,255,255, 0.6) 50%, rgba(255,255,255, 0.1) 80%); top: -2px; }
		.ffood__redirect:after{ background: linear-gradient(to top, rgba(255,255,255, 1) 0%, rgba(255,255,255, 0.1) 80%); bottom: 0; }

		.ffood__redirect .next__link{ width: 86px; height: 20px; top: 1%; animation: MoveUpDown 2s linear infinite; }
		.ffood__redirect__block{ position: relative; background: #fff; max-width: 1264px; width: 92.1726408%; display: flex; align-items: center; padding: 6% 0; border-radius: 8px; right: -25px; box-shadow: 0px 0px 20px -6px rgb(0 0 0 / 16%); }
		.ffood__redirect__block:last-child{ margin: 50px 0 0 auto; right: 25px; }
		.ffood__redirect__block:last-child
		.ffood__redirect__block--img{ display: inline-flex; width: 50%; }
		.ffood__redirect__block--cont{ position: relative; display: inline-flex; flex-direction: column; width: 50%; }
		.ffood__redirect__block--cont:before{ position: absolute; content: ''; width: 100%; height: 159%; left: 0; top: -30%; background: url(../../img/main/search.png) no-repeat center center; background-size: 100%;  }
		.ffood__redirect__block:last-child .ffood__redirect__block--cont:before{ display: none;}
		/* REDIRECT LINK INSIDE CONTENT */
			.cont__title{ position: relative; width: 100%; margin-bottom: 40px; padding-bottom: 10px; }
			.cont__title:after { content: ''; display: block; position: absolute; bottom: 0; left: 0; width: 100%; height: 4px; background: linear-gradient(to right,#ef804e,#ef9e4e );  }
			.cont__title--t{ font-size: 3rem; font-weight: 500; }
			.cont__desc{ margin-bottom: 70px; }
			.cont__desc--p{ color: #6A6A6A; font-size: 1.6rem; }
			.cont__link{ width: 290px; height: 52px; z-index: 1; }
			.cont__link a{ width: 100%; height: 100%; position: relative; display: flex; align-items: center; overflow: hidden; justify-content: center; background: #fff; border-radius: 26px; border: 1px solid; color: #fff; font-size: 1.6rem; transition: 0.4s ease; }
			.cont__link a:after { content: ''; display: inline-block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: url(../../img/main/bg-button.png) no-repeat; background-size: 100% 100%; z-index: 0; transition: linear .4s; }
			.cont__link a span { position: relative; display: block; z-index: 1; }
			.cont__link a:hover{ background: #fff; color: #ef804e; }
			.cont__link a:hover:after { opacity: 0; }

	/* FUNCTIONAL FOOD 	INTERVIEW
	------------------------------------------------ */
		.ffood__interview{ position: relative; max-width: 1300px; margin: 82px auto 120px; padding: 0 50px; }
		.ffood__interview__block{ position: relative; background: #fff; padding: 70px 100px 50px; border-radius: 8px; box-shadow: 0px 0px 20px -6px rgb(0 0 0 / 16%); }
		.ffood__interview__block:before,.ffood__interview__block:after{ position: absolute; content: ''; z-index: -1; }
		.ffood__interview__block:before{ width: 390px; height: 50%; background: url(../../img/main/interview--bubble-top.png) no-repeat center center; background-size: contain; left: -170px; top: -50px; }
		.ffood__interview__block:after{ width: 67%; height: 100%;  background: url(../../img/main/interview--bubble-bot.png) no-repeat center center; background-size: 100%; right: -210px; bottom: 50px; }
		.ffood__interview__block .food--title-jp{ color: #67A54D; font-size: 3rem; line-height: 1.6; }
		.ffood__interview__block .food--title-p{ font-size: 1.5rem; }
		.ffood__interview--img{ width: 100%; margin: 60px 0; text-align: center; }
		.ffood__interview--img img{ height: 207px; object-fit: contain; }
		.ffood__interview--link{ width: 345px; height: 52px; margin: 0 auto; border: 2px solid #67A54D; border-radius: 25.5px; }
		.ffood__interview--link a{ width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; color: #67A54D; font-size: 1.8rem; }
		.ffood__interview--link img{ height: 18px; margin-right: 17px; object-fit: contain; vertical-align: middle; }

@media screen and (min-width: 769px){
	.list__column{ max-width: 269px; height: 352px; height: 372px; max-height: 372px;  }
	.ffood__column--list{ position: relative; width: 100%; }
	.ffood__column--list:before,.ffood__column--list:after{ position: absolute; content: ''; width: 105px; height: 100%; top: 0; z-index: 1; }
	.ffood__column--list:after{ right: 0; background: linear-gradient(to right, rgba(248, 232, 215, 0) 0%, rgba(248, 232, 215, 1) 100%); }
	.ffood__column--list:before{ left: 0; background: linear-gradient(to left, rgba(248, 232, 215, 0) 0%, rgba(248, 232, 215, 1) 100%); }
	.list__column--img img{ width: 100%; height: 153px; object-fit: cover; }

	.ffood__column .slick-list{ padding: 0 100px; }
	.ffood__column .slick-prev,.ffood__column .slick-next{ width: 64px; height: 64px; z-index: 2; }
	.ffood__column .slick-prev:hover,.ffood__column .slick-next:hover{ opacity: 1; }
	.ffood__column .slick-prev{ left: 30px; }
	.ffood__column .slick-next{ right: 30px; }
	.ffood__column .slick-next:before,
	.ffood__column .slick-prev:before{ position: absolute; content: ''; width: 100%; height: 100%; left: 0; top: 0; opacity: 1; }
	.ffood__column .slick-prev:before{ background: url(../../img/share/c-prev.png) no-repeat center center; background-size: 100%; }
	.ffood__column .slick-next:before{ background: url(../../img/share/c-next.png) no-repeat center center; background-size: 100%; }

	/* Last child */
		.ffood__redirect__block:last-child .cont__title,
		.ffood__redirect__block:last-child .cont__desc{ padding-left: 10%; }
		.ffood__redirect__block:last-child .cont__link{ margin-left: 10%; }
}

@media screen and (max-width: 768px){
	.list__column--img{ width: 35%; padding: 14px 0 14px 14px; }
	.list__column__desc.list__column-top{ padding: 0 14px; width: 65%; }
	.list__column a{ display: flex; flex-wrap: wrap; align-items: flex-start; }
	.list__column-top.list__column--img img{ height: unset; }
	.ffood__column--list li+li{ margin-top: 20px; }
}

@keyframes MoveUpDown {
  0%, 100% {
    top: 0;
  }
  50% {
    top: 30px;
  }
}

@media screen and (max-width: 1366px){
	.ffood__redirect{ background: url(../../img/main/orange-bubble.png) no-repeat top center; background-size: 1366px; }

}

@media screen and (max-width: 768px){

	.ffood--title{ margin-left: 20px; }
/* MAIN index of FUNCTIONAL FOOD
------------------------------------------------ */
	.ffood__slide{  }
	/* link inside slider */
		.slider__link--block{ position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); }
		.slider__link--block-p{ font-size: 2rem; margin-bottom: 22.5; }
		.slider__link--block-p-2{ font-size: 1.2rem; margin-bottom: 1em; }
		.slider__link--block a{ width: 130px; height: 35px; margin: 0 auto; border-radius: 17.5px; font-size: 1.1rem; }
	/* FFOOD slider */
		.ffood__slide{ margin-bottom: 63px; }
		.ffood__slide:after{ height: 11.5%; bottom: -1px; }
	/* column block */
			.ffood__column--list{ padding: 25px 13.5px; }
			.list__column{ width: 100%; height: auto; margin: 0; }
			/* .list__column__desc{ width: fit-content; margin: 0 0 2px; padding: 0 0 0 16px; } */
			.list__column__desc{ width: 65%; margin: 0 0 2px; padding: 0 0 0 16px; }
			.list__column__desc--date{ margin-bottom: 7.5px; }
			.list__column__desc--date span{ font-size: 1.5rem; }
			.list__column__desc--title{ margin-bottom: 2px; }
			.list__column__desc--title.list__column-top { margin-bottom: 10px; }
			.list__column__desc--title-t{ font-size: 1.4rem;}
			.list__column__desc--txt{  }
			.list__column__desc--txt-p{ font-size: 1.1rem; }
	/* view more button */
		.ffood__column--viewmore{ position: absolute; width: 100%; height: 41px; bottom: 25px; top: auto; left: 0; padding: 0 15px; }
		.ffood__column--viewmore a{ border-radius: 20.5px; font-size: 1.2rem; border-color: transparent; box-shadow: 0px 1px 12px rgb(0 0 0 / 16%); }

/* FUNCTIONAL FOOD HEALTH
------------------------------------------------ */
		.ffood__health{ flex-direction: column; padding: 55px 0 40px; }
		.ffood__health--break { padding: 0 40px; }
		.ffood__health--break:before{ width: 320px; height: 100px; top: -29px; left: 0; background: url(../../img/main/orange.png) no-repeat; background-size: 100% 100px; }
		.ffood__health--break:after{ width: 320px; height: 155px; bottom: 48px; right: 0; left: auto; background: url(../../img/main/plate.png) no-repeat; background-size: 100% 155px; background-position: center bottom; }
		.ffood__health--title,
		.ffood__health--desc{ width: 100%; }
		.ffood__health--title-t { font-size: 2.4rem; line-height: calc(80 / 48); font-weight: bold; text-align: left; letter-spacing: 0.04em; }
		.ffood__health--desc{ margin-top: 15px; text-align: left; }
		.ffood__health--desc-p { font-size: 1.2rem; line-height: calc(50 / 24); letter-spacing: 0.04em; }
		.ffood__health--lnk{ padding-right: 25px; width: calc(100% + 40px); margin-left: -20px; margin-top: 23px; font-size: 1.3rem; font-weight: bold; letter-spacing: 0.036em; line-height: 31px; border-radius: 17px; background-position: calc(100% - 10px) center; background-size: 20px auto; }

/* FUNCTIONAL FOOD 	REDIRECT LINK
------------------------------------------------ */
	.ffood__redirect{ margin: 0 0 50px; padding: 65px 20px 80px; background: url(../../img/main/orange-bubble-sp-v2.png) no-repeat top; background-size: 100% 100%; }
	.ffood__redirect .next__link{ display: flex; width: 68px; height: 20px; top: 1%; left: 35px; }
	.ffood__redirect .next__link a{ font-size: 1rem; }
	.ffood__redirect__block{ max-width: 100%; width: 100%; padding: 40px 0 35px; right: 0; }
	.ffood__redirect__block:last-child{ margin: 25px 0 0 auto; right: 0; }
	.ffood__redirect__block:last-child
	.ffood__redirect__block--img{ width: 100%; margin-bottom: 52px; }
	.ffood__redirect__block--img{ width: 100%; margin-bottom: 25px; }
	.ffood__redirect__block--cont{ width: 100%; flex-wrap: wrap; flex-direction: row; padding: 0 20px; }
	.ffood__redirect__block--cont:before{ display: none;}
	/* REDIRECT LINK INSIDE CONTENT */
		.cont__title{ margin-bottom: 20px; }
		.cont__title:after { height: 2px; }
		.cont__title--t{ font-size: 2rem; }
		.cont__desc{ margin-bottom: 35px; }
		.cont__desc--p{ color: #434343; font-size: 1.2rem; }
		.cont__link{ width: 100%; height: 40px; }
		.cont__link a{ border-radius: 20px; font-size: 1.4rem; }

/* FUNCTIONAL FOOD 	INTERVIEW
------------------------------------------------ */
	.ffood__interview{ max-width: 100%; margin: 50 auto; padding: 0 15px; }
	.ffood__interview__block{ padding: 44px 30px 40px; border-radius: 4px; }
	.ffood__interview__block:before{ left: -210px; transform: rotate(60deg); }
	.ffood__interview__block:after{ width: 130%; height: 83%; right: -15%; bottom: -50px; }
	.ffood__interview__block .food--title-jp{ margin-bottom: 20px; font-size: 2rem; }
	.ffood__interview__block .food--title-p{ font-size: 1.1rem; }
	.ffood__interview--img{ position: relative; width: calc(100% + 60px); left: -30px; margin: 37.5px 0; }
	.ffood__interview--img img{ width: 100%; height: auto; object-fit: contain; }
	.ffood__interview--link{ width: 100%; height: 38px; border-radius: 19px; }
	.ffood__interview--link a{ font-size: 1.2rem; }
		.ffood__interview--link img{ height: 15px; margin-right: 15px; }

}