/* ---------------------------------------
   H E A D E R
------------------------------------------ */
/* mv */
.index-main{
	height: 370px;
	width: 100%;
	position: relative;
	display: flex; }
	.index-main__img{
		overflow: hidden;
		width: 50%; }
		.index-main__img img{
			height: 100%;
			width: 100%;
			object-fit: cover; }
	.index-main__text{
		font-size: 1.5rem;
		text-shadow: 0 0 5px rgba(14,14,42,1);
		line-height: 2.285;
		-ms-writing-mode: tb-rl;
		writing-mode: vertical-rl;
		text-orientation: upright;
		width: 100%;
		height: 100%;
		color: var(--white);
		justify-content: center;
		align-items: center;
		display: flex;
		position: absolute; }
@media screen and (min-width:480px) {
	.index-main{ height: 555px;}
	.index-main__text{ font-size: 2rem; }
}
@media screen and (min-width:768px) {
	/* header */
	/* mv */
	.index-main__text{ font-size: 3rem; }
	.index-main{ height: 900px; }
}

/* ---------------------------------------
   C O M M O N
------------------------------------------ */
.index-content__head{
	margin-bottom: 7vw;
	position: relative;
	text-align: center; }
.content-head__read{
	font-size: 1rem;
	margin-top: 2em;
	line-height: 1.875; }
@media screen and (min-width:480px) {
	.content-head__read{ font-size: 1.125rem; }
}
@media screen and (max-width:768px) {
	.content-head__read{ text-align: left; }
	.content-head__read .pc{ display: none; }
}
@media screen and (min-width:768px) {
	.content-head__read{ font-size: 0.9375rem; }
	.index-content__head{ margin-bottom: 70px; }
}
@media screen and (max-width:1080px) {
	.index-content__head .content-head__button{ display: none; }
}
@media screen and (min-width:1080px) {
	.index-content__head{ padding: 0 220px; }
	.index-content__head .content-head__button{
		display: flex;
		align-items: center;
		right: 0;
		top: 0; bottom: 0;
		margin: auto;
		position: absolute;
		width: 200px; }
}

/* ---------------------------------------
   A B O U T
------------------------------------------ */
.about-content__text{
	padding: 0 3vw 50px;
	text-align: center; }
.about-content__text .content-button{
	vertical-align: bottom;
	display: inline-block; }
.about-title{
	line-height: 1.7778;
	padding-top: 2em;
	margin: 0 auto 1.5em;
	font-size: 1.714285rem;
	writing-mode: vertical-rl;
	text-orientation: upright; }
.about-title .wrap{
	padding: 1em 0.4em 0.5em;
	position: relative;
	display: inline-block; }
.about-title .wrap:before,
.about-title .wrap:after{
	content: "";
	width: 1.5rem;
	height: 1.5rem;
	display: block;
	position: absolute; }
.about-title .wrap:before{
	border-top: solid 1px var(--main);
	border-right: solid 1px var(--main);
	right: 0;
	top: 0; }
.about-title .wrap:after{
	border-left: solid 1px var(--main);
	border-bottom: solid 1px var(--main);
	left: 0;
	bottom: 0; }
.about-body{
	font-size: 1rem;
	margin-bottom: 3.25em;
	line-height: 2.5333; }
.about-img{ position: relative; }
.about-img img{ width: 100%; }
.about-img .pc{ display: none; }
@media screen and (min-width:480px) {
	.about-content__text{ padding: 0 5vw 70px;}
	.about-title{ font-size: 2.5rem; }
	.about-body{ font-size: 1.125rem; }
}
@media screen and (min-width:768px) {
	.about-title{
		font-size: 2.25rem;
		padding-top: 1em; }
	.about-title .wrap:before,
	.about-title .wrap:after{
		content: "";
		width: 1.5rem;
		height: 1.5rem;
	}
	.about-img{
		position: relative;
		overflow: hidden;
		height: 870px; }
	.about-body{ font-size: 1rem; }
	.about-img .sp{ display: none; }
	.about-img .pc{ display: block; }
	.about-img img{
		object-fit: cover;
		height: 100%;
		width: 100%; }
	.about-content{
    margin-top: 100px;
		position: relative; }
	.about-content:after{
		content: "";
		display: block;
		width: 100%;
		height: 80px;
		bottom: 0;
		z-index: -1;
		background: var(--gray);
		position: absolute; }
	.about-body{ font-size: 0.9375rem; }
}
/* ---------------------------------------
   R E C I P E
------------------------------------------ */
#index-recipe{ padding: 16vw 5vw; }
.recipe-content{ text-align: left; }
.recipe-content .pc{ display: none; }
.recipe-content__title{
	margin: 0.5em 0 0.25em;
	font-size: 1.25rem; }
.sp-button{ text-align: center; }
.sp-button .content-button{
	vertical-align: bottom;
	margin-top: 3em;
	display: inline-block; }

@media screen and (min-width:480px) {
	.recipe-content__title{
		margin: 0.5em 0 0.25em;
		font-size: 1.5rem; }
	#index-recipe{ padding: 70px 5vw; }
}
@media screen and (max-width:768px) {
	.recipe-content .flex-contents{
		display: flex;
		flex-wrap: wrap; }
	.recipe-content .flex-item{
		margin-right: 6vw;
		width: 42vw; }
	.recipe-content .flex-item:nth-child(n+3){ margin-top: 6vw; }
	.recipe-content .flex-item:nth-child(2n){ margin-right: 0; }
	.recipe-content__item .pc{ display: none; }
}
@media screen and (min-width:768px) {
	#index-recipe{ padding: 120px 3vw 140px; }
	.recipe-content__title{
		margin: 1em 0 0.5em;font-size: 1.25rem; }
	.recipe-content__item:nth-child(n+4){ display: none; }
	.recipe-content__item p{ font-size: 0.8125rem; }
	.recipe-content .sp{ display: none; }
	.recipe-content .pc{ display: block; }
}

/* ---------------------------------------
   C U L T U R E
------------------------------------------ */
#index-culture{ padding: 70px 5vw 16vw; }
.culture-content{ text-align: left; }
.culture-content .pc{ display: none; }
.culture-content__title{
	margin: 0.5em 0 0.25em;
	font-size: 1.25rem; }

.sp-button{ text-align: center; }
.sp-button .content-button{
	vertical-align: bottom;
	margin-top: 3em;
	display: inline-block; }

@media screen and (min-width:480px) {
	.culture-content__item p{ font-size: 0.9735rem; }
	.culture-content__title{
		margin: 0.5em 0 0.25em;
		font-size: 1.5rem; }
	.culture-content__item .pc{ display: none; }
}
@media screen and (max-width:768px) {
	.culture-content .flex-contents{
		display: flex;
		flex-wrap: wrap; }
	.culture-content .flex-item{
		margin-right: 6vw;
		width: 42vw; }
	.culture-content .flex-item:nth-child(n+3){ margin-top: 6vw; }
	.culture-content .flex-item:nth-child(2n){ margin-right: 0; }
}
@media screen and (min-width:768px) {
	#index-culture{ padding: 120px 3vw 200px; }
	.culture-content__title{
		margin: 1em 0 0.5em;font-size: 1.25rem; }
	.culture-content__item:nth-child(n+4){ display: none; }
	.culture-content__item p{ font-size: 0.8125rem; }
	.culture-content .sp{ display: none; }
	.culture-content .pc{ display: inline; }
}

/* ---------------------------------------
   N E W S
------------------------------------------ */
#index-news{ padding: 0 5vw 70px; }
.culture-content{ text-align: left; }
@media screen and (max-width:768px) {
	#index-news .news-list__item:last-child a{ border-bottom: solid 1px #e6e6e6;}
}
@media screen and (min-width:768px) {
	#index-news{ padding: 0 3vw 140px; }
	#index-news .news-list__item a{
		border: solid 1px #e6e6e6; }
	#index-news .news-list__item+.news-list__item{ margin-top: 0.5625em; }
}

/* ---------------------------------------
    K O D A W A R I
------------------------------------------ */
.kodawari-content__title{
	line-height: 1.5556em;
	display: flex;
	align-items: center;
	-ms-writing-mode: tb-rl;
	writing-mode: vertical-rl;
	font-size: 1.5rem;
	text-orientation: upright; }
.kodawari-content__text{
	width: 100%;
	font-size: 0.9375rem; }
.kodawari-content__text{ line-height: 1.857;}
.kodawari-content__title span{ display: inline-block; }

.kodawari-gift{ text-align: center; }
.kodawari-gift .kodawari-gift__text{
	padding: 0 5vw;
	margin-top: 3.5em;
	font-size: 1.125rem; }
.kodawari-gift .kodawari-gift__text .large-text{
	padding-top: 0.5em;
	white-space: nowrap;
	display: inline-block;
	font-size: 1.25em; }
.kodawari-gift .kodawari-gift__img .pc{ display: none; }
@media screen and (min-width:480px) {
	.kodawari-content__title{ font-size: 2rem; }
	.kodawari-content__text{ font-size: 1.125rem; }
}
@media screen and (max-width:767px) {
	.kodawari-content .text-wrap{
		grid-gap: 5vw;
		justify-content: space-between;
		padding: 5vw 5vw 8vw;
		display: flex; }
	.kodawari-content:nth-child(odd) .text-wrap{ flex-direction: row-reverse; }
	.kodawari-content__title{
		margin-top: -5em;
		border-radius: 10px;
		display: inline-block;
		padding: 0.8em 0.5em;
		background: var(--white); }
}
@media screen and (max-width:768px) {
	.kodawari-content__text .pc{ display: none; }
}
@media screen and (min-width:768px) {
	#index-kodawari{ padding: 0 0 250px; }
	.kodawari-content__title{
		width: 100%;
		margin-bottom: 1.5em;
		font-size: 2.25rem; }
	.kodawari-content__text{ font-size: 0.875rem; }
	.kodawari-content{
		height: 540px;
		align-items: center;
		display: flex;
		flex-wrap: wrap; }
	.kodawari-content:nth-child(n+2){ margin-top: 120px; }
	.kodawari-content:nth-child(even){ flex-direction: row-reverse; }
	.kodawari-content .kodawari-img{
		height: 100%;
		overflow: hidden;
		width: calc(100% - 520px); }
	.kodawari-content .kodawari-img img{
		object-fit: cover;
		width: 100%;
		height: 100%; }
	.kodawari-content .text-wrap{
		width: 520px; }
	.kodawari-content .text-wrap > p{ text-align: center; }

	.kodawari-gift{
		text-align: center;
		margin-top: 150px; }
	.kodawari-gift .kodawari-gift__img{
		height: 540px;
		overflow: hidden; }
	.kodawari-gift .kodawari-gift__img .sp{ display: none; }
	.kodawari-gift .kodawari-gift__img .pc{ display: block; }
	.kodawari-gift .kodawari-gift__img img{
		object-fit: cover;
		height: 100%;
		width: 100%; }
	.kodawari-gift .kodawari-gift__text{
		margin-top: 3.5em;
		font-size: 1.5rem; }
	.kodawari-gift .kodawari-gift__text .large-text{
		padding-top: 0.5em;
		display: inline-block;
		font-size: 1.5em; }
}

/* ---------------------------------------
   P R O D U C T
------------------------------------------ */
#index-product{ padding: 16vw 5vw; }
.product-menu .menu-list{
	justify-content: center;
	font-size: 1.3725rem;
	margin-bottom: 8vw;
	flex-wrap: wrap;
	text-align: center;
	display: flex; }
.product-menu .menu-list__item{
	cursor: pointer;
	width: calc(100% / 3);
	position: relative;
	border-left: dotted 1px var(--main); }
.product-menu .menu-list__item .arow{
	width: 12px;
	transition: .2s;
	left: 0; right: 0;
	bottom: 0;
	margin: auto;
	visibility: hidden;
	opacity: 0;
	position: absolute;
	display: block; }
.product-menu .menu-list__item.select .arow{
	bottom: -6px;
	opacity: 1;
	visibility: visible; }
.product-menu .menu-list__item:last-child{ border-right: dotted 1px var(--main); }
.product-content{ text-align: left; }
.product-content__title{
	text-align: center;
	margin: 1em 0 0.5em;
	font-size: 1.3725rem; }
.product-content__item{ text-align: right; }
.product-content__item img{ width: 100%; }
.product-content__item p{
	font-size: 0.9735rem;
	text-align: left; }
.product-content__text{ margin-bottom: 1.5em; }
.product-read{
	text-align: center;
	font-size: 1.3725rem;
	line-height: 1.72222;
	white-space: nowrap; }
.product-content__item .content-button{
	vertical-align: bottom;
	display: inline-block; }
.recipe-content__item img { width: 100%;}

@media screen and (min-width:480px) {
	.product-menu .menu-list{ font-size: 1.5rem; }
	.product-content__title{
		margin: 0.5em 0 0.25em;
		font-size: 1.5rem; }
	.product-read{ font-size: 1.75rem; }
}
@media screen and (max-width:768px) {
	.product-content__head{ margin-bottom: 5vw; }
	.product-content__item .content-button{
		margin-bottom: 1.5em;
		border-bottom: none;
		padding: 0 3em 0 0;
		width: auto;
		max-width: auto; }
	.product-content__item .content-button .button-icon{ right: 0; }
}
@media screen and (min-width:768px) {
	.product-menu .menu-list__item:hover .arow{
	bottom: -6px;
	opacity: 1;
	visibility: visible;}
  .recipe-content__item a:hover img { opacity: 0.6;}
	#index-product{ padding: 0 3vw 120px; }
	.product-menu .menu-list{
		font-size: 1.5rem;
		margin-bottom: 90px;
	}
	.product-menu .menu-list__item .arow{
		width: 12px; }
	.product-menu .menu-list__item.select .arow,
	.product-menu .menu-list__item:hover .arow{ bottom: -6px; }
	.product-menu .menu-list__item{ max-width: 200px; }
	.product-content__item{ text-align: center; }
	.product-content__title{
		text-align: left;
		font-size: 1.5rem; }
	.product-content__item p{ font-size: 0.8725rem; }
	.product-content__text{ margin-bottom: 2.5em; }
	.product-content__item .content-button{
		width: 200px;
		display: inline-block; }
	.product-read{ font-size: 2.25rem; }
	.product-content .sp{ display: none; }
}
/* ---------------------------------------
   O N L I N E S H O P
------------------------------------------ */
.onlineshop-content{
	color: var(--white);
	padding: 12vw 5vw;
	width: 100%;
	background: var(--main); }
.onlineshop-content__title{
	text-align: left;
	font-size: 1.7125em;
	margin-bottom: 1em;
	line-height: 1.6111; }
.onlineshop-content__title .en{
	padding-bottom: 1em;
	display: block;
	font-size: 0.5em;
	color: var(--gold); }
.onlineshop-content__text {
	margin-bottom: 2.1875em;
	text-align: left;
	font-size: 0.9735rem;
	line-height: 2.5; }

.onlineshop-content .content-button{ border-bottom-color: var(--white); }
.onlineshop-content .content-button.tab-link .button-icon:before{ background: var(--white); }
.onlineshop-content .content-button.tab-link .button-icon:after{
		border-left-color: #fff;
		border-bottom-color: #fff; }
.onlineshop-content .content-button{
	vertical-align: bottom;
	display: inline-block; }
@media screen and (min-width:480px) {
	.onlineshop-content__title{ font-size: 2rem; }
.onlineshop-content__text { font-size: 1.125rem; }
}
@media screen and (max-width:768px) {
	.onlineshop-content{ text-align: center; }
}
@media screen and (min-width:768px) {
	#index-onlineshop{
		display: flex;
		justify-content: flex-end;
		background: url(../img/index/index-onlineshop_bg.jpg);
		background-size: cover;
		background-position: center; }
	.onlineshop-content{
		padding: 100px 60px 140px 70px;
		color: var(--white);
		max-width: 620px;
		background: rgba(14,14,42,.8); }
	.onlineshop-content__title{
		font-size: 2.25rem; }
	.onlineshop-content__text {
		margin-bottom: 4.375em;
		font-size: 1rem; }
	.onlineshop-img{ display: none; }
	/* ボタンホバー */
	.onlineshop-content .content-button.tab-link:hover{ color: var(--main); }
	.onlineshop-content .content-button.tab-link:hover{ color: var(--main); }
	.onlineshop-content .content-button:before{ background: transparent; }
	.onlineshop-content .content-button:hover::before{ background: var(--white); }
	.onlineshop-content .content-button.tab-link:hover .button-icon:before{ background: var(--main); }
	.onlineshop-content .content-button.tab-link:hover .button-icon:after{
		border-left-color: var(--main);
		border-bottom-color: var(--main); }
}
/* ---------------------------------------
   Q & A
------------------------------------------ */
#index-qa{ padding: 16vw 0 0; }
.qa-item{
	border-top: solid 1px var(--main);
	padding: 0 5vw; }
.qa-content__title,
.qa-content__text.open{
	opacity: 1;
	line-height: 1.3125;
	height: auto;
	visibility: visible;
	padding-left: 2.5em;
	position: relative; }
.qa-content__title{
	padding:  1.8em 2.5em; }
.qa-content__title .qa-toggle{
	display: block;
	position: absolute;
	right: 0;
	top: 2.125em;
	height: 0.6875em;
	width: 0.6875em; }
.qa-content__title .qa-toggle:before,
.qa-content__title .qa-toggle:after{
	content: "";
	transition: .2s;
	position: absolute;
	right: 0;
	right: 0;
	top: 0;
	bottom: 0;
	margin: auto;
	display: block;
	width: 100%;
	height: 1px;
	background: var(--main); }
.qa-content__title.open .qa-toggle:after{
	-moz-transform: rotate(-90deg);
	-webkit-transform: rotate(-90deg);
	-o-transform: rotate(-90deg);
	-ms-transform: rotate(-90deg); }
.qa-content__text{
	padding-left: 2.5em;
	transition: .2s;
	opacity: 0;
	visibility: hidden;
	line-height: 0;
	height: 0; }
.qa-content__text.open{ padding-bottom: 2em; }
.qa-content__title:before,
.qa-content__text:before{
	position: absolute;
	left: 0;
	font-size: 1.375em; }
.qa-content__title:before{
	top: 1em;
	content: "Q"; }
.qa-content__text:before{
	height: 0;
	top: -0.215em;
	content: "A"; }
.qa-content__text.open:before{ height: auto;}
.qa-item:last-child{ border-bottom: solid 1px var(--main); }
.qa-read{
	padding: 8vw 5vw;
	text-align: center;
	font-size: 1.375rem;
	line-height: 1.72222;
	white-space: nowrap; }
@media screen and (min-width:480px) {
	.qa-read{ font-size: 1.75rem; }
}
@media screen and (min-width:768px) {
	#index-qa{ padding: 80px 0 0; }
	.qa-content__title:hover{
		cursor: pointer;
		text-decoration: underline; }
	.qa-read{
		padding: 90px 3vw 100px;
		font-size: 2.25rem; }
}




/* Loading背景画面設定　*/
#splash {
/*fixedで全面に固定*/
  position: fixed;
  width: 100%;
  height: 100%;
  z-index: 999;
  background:#fff;
  text-align:center;
  color:#fff;
}

/* Loading画像中央配置　*/
#splash_logo {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

/* Loading アイコンの大きさ設定　*/
#splash_logo img {
  width:172px;
}

/* fadeUpをするアイコンの動き */
.fadeUp{
animation-name: fadeUpAnime;
animation-duration:1s;
animation-fill-mode:forwards;
opacity: 0;
}

@keyframes fadeUpAnime{
  from {
    opacity: 0;
  transform: translateY(50px);
  }

  to {
    opacity: 1;
  transform: translateY(0);
  }
}