/* CSSコード */
/*common
------------------------------------------------------------------------------------------------------------------------------------ */
@-webkit-keyframes flash { 0% { opacity: .6; } 100% { opacity: 1; } }
@keyframes flash { 0% { opacity: .6; } 100% { opacity: 1; } }
main.kahonshu a { color: #000; text-decoration: none;  }
main.kahonshu a:hover { opacity: 1; -webkit-animation: flash 1s; animation: flash 1s; }
main.kahonshu a.none:hover { opacity: 1; -webkit-animation: flash 0; animation: flash 0; }
main.kahonshu .food .lychee,
main.kahonshu .lineup .lychee dt { color: #a50000; font-weight: bold; }
main.kahonshu .food .muscat,
main.kahonshu .lineup .muscat dt { color: #17896f; font-weight: bold; }

/* 共通 */
@media screen and (max-width:767px) {
	main.kahonshu { line-height: 1.6; font-size: 3.333333vw; color: #4e4e4e; }
	.forPC { display: none; }
	.forSP { display: inline; }
	img { max-width: 100%; height: auto; -webkit-touch-callout: none; }
	#Contents .wakuwakunokura { margin: 0; padding: 30px 20px; background: #fff!important; }
}
@media screen and (min-width: 768px) {
	main.kahonshu { color: #4e4e4e; font-size: 1.6rem; color: #4e4e4e; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
	.forPC { display: inline; }
	.forSP { display: none; }
	#Contents .wakuwakunokura { margin: 0; padding: 50px 0; background: #fff; }
}

/* KV */
@media screen and (max-width:767px) {
	main.kahonshu .kv img { width: 100%; }
	main.kahonshu .kv figure { margin: 0; padding: 0; }
	main.kahonshu .kv .image { position: relative; margin: 0; }
	main.kahonshu .kv .logo { position: absolute; top: 0; left: 0; z-index: 3; }
	main.kahonshu .kv .text { position: absolute; top: 0; left: 0; z-index: 2; }
}
@media screen and (min-width: 768px) {
	main.kahonshu .kv img { width: 100%; }
	main.kahonshu .kv figure { margin: 0; padding: 0; }
	main.kahonshu .kv .image { position: relative; margin: 0; }
	main.kahonshu .kv .logo,
	main.kahonshu .kv .text { position: absolute; top: 0; left: 0; z-index: 2; }
}


/* intro */
@media screen and (max-width:767px) {
	main.kahonshu .intro { padding: 15vw 0; }
	main.kahonshu .intro dl {display: flex; flex-direction: column-reverse;}
	main.kahonshu .intro dt { margin-top: 8vw; text-align: center; }
	main.kahonshu .intro dt img { width: 54.615vw; }
	main.kahonshu .intro dd { display: flex; flex-direction: row-reverse; padding: 0 10vw; }
	main.kahonshu .intro dd p { -ms-writing-mode: tb-rl; writing-mode: vertical-rl; text-orientation: upright; text-align: start; line-height: 2.2; margin: 0 auto; }
    main.kahonshu .intro dd .horizontal-quote { display: inline-block; transform: rotate(90deg); transform-origin: center; }
}
@media screen and (min-width: 768px) {
	main.kahonshu .intro { padding: 70px 0; }
	main.kahonshu .intro dl { display: flex; width: 940px; margin: 0 auto; }
	main.kahonshu .intro dt { width: 240px; }
	main.kahonshu .intro dt img { width: 236px; }
	main.kahonshu .intro dd { display: flex; flex-direction: row-reverse; width: 700px; text-align: right; gap: 60px; }
	main.kahonshu .intro dd p { -ms-writing-mode: tb-rl; writing-mode: vertical-rl; text-orientation: upright; text-align: start; font-size: 1.6rem; line-height: 2.6; }
    main.kahonshu .intro dd .horizontal-quote { display: inline-block; transform: rotate(90deg); transform-origin: center; }
}

/* brendlogy */
@media screen and (max-width:767px) {
	main.kahonshu .brendlogy { padding: 15vw 0; background: url(/Page/kahonshu/images/bg_product_sp.jpg) center top no-repeat; background-size: 100% auto; }
	main.kahonshu .brendlogy h2 { padding:0; }
	main.kahonshu .brendlogy h2 img { width: 100%; }
	main.kahonshu .brendlogy h3 { margin: 8vw 0 2vw; text-align: center; }
	main.kahonshu .brendlogy h3 + p { padding: 0 5.5vw; margin-bottom: 8vw; font-size: 3.5vw; line-height: 1.8; text-align: center; }
	main.kahonshu .brendlogy ul { margin: 0 8.9743vw; }
	main.kahonshu .brendlogy ul li dt { position: relative; }
	main.kahonshu .brendlogy ul li { margin-bottom: 12vw; }
	main.kahonshu .brendlogy ul li h4 { margin: 6vw 0 4vw; font-size: 3.73333333vw; text-align: center; font-weight: bold; }
	main.kahonshu .brendlogy ul li p { line-height: 1.6; }
}
@media screen and (min-width: 768px) {
	main.kahonshu .brendlogy  { padding: 100px 0; background: url(/Page/kahonshu/images/bg_product.jpg) center top no-repeat; background-size: cover;  }
	main.kahonshu .brendlogy h2 { text-align: center; }
	main.kahonshu .brendlogy h2 img { width: 758px; }
	main.kahonshu .brendlogy h3 { margin: 40px 0 10px; text-align: center; font-size: 1.6rem; }
	main.kahonshu .brendlogy h3 + p { margin-bottom: 40px; text-align: center; line-height: 1.8; }
	main.kahonshu .brendlogy ul { display: flex; flex-wrap: wrap; justify-content: space-between; margin: 0 auto; width: 1080px; }
	main.kahonshu .brendlogy ul li { width: 330px; }
	main.kahonshu .brendlogy ul li h4 { margin: 30px 0 15px; font-size: 1.6rem; text-align: center; font-weight: bold; }
	main.kahonshu .brendlogy ul li p { font-size: 1.5rem; line-height: 1.6; }
	main.kahonshu .brendlogy ul img { width: 330px; }
}

/* concept  */
@media screen and (max-width:767px) {
	main.kahonshu .concept ul { display: flex; flex-direction: column-reverse;  }
	main.kahonshu .concept ul li { width: 100%; }
	main.kahonshu .concept dl dd { padding: 10vw  0 20vw; }
	main.kahonshu .concept dl dd  h2 { margin-bottom: 5vw; }
	main.kahonshu .concept dl dd p { padding: 2.5vw 8.9743vw; font-size: 3.4vw; line-height: 1.7; }
	main.kahonshu .concept dl dd p + p img { margin-top: 5vw; }
	main.kahonshu .concept figure { margin: 0; padding: 0; }
	main.kahonshu .concept figure img { width: 31.92vw; }
}
@media screen and (min-width: 768px) {
	main.kahonshu .concept { position: relative; display: flex; flex-wrap: nowrap; justify-content: space-between; }
	main.kahonshu .concept ul { display: flex; }
	main.kahonshu .concept li { width: 50%; }
	main.kahonshu .concept dl dt img { width: 100%; }
	main.kahonshu .concept dl dd { padding: 30px 0; width: 480px; margin: 0 auto; text-align: center; }
	main.kahonshu .concept dl dd img { width: 101px; }
	main.kahonshu .concept dl dd p { margin-top: 30px; font-size: 1.5rem; line-height: 2; }
	main.kahonshu .concept figure { margin: 0; padding: 0; }
	main.kahonshu .concept figure img { width: 150px; height: auto; }
	main.kahonshu .concept .btnDetail { margin-top: 25px; }
	main.kahonshu .concept .btnDetail img { width: 300px; }
}

/* food */
@media screen and (max-width:767px) {
	main.kahonshu .food { padding: 15vw 0; background: url(/Page/kahonshu/images/bg_product_sp.jpg) center top no-repeat; background-size: 100% auto; }
	main.kahonshu .food h2 { margin-bottom: 10vw; }
	main.kahonshu .food h2 img { width: 100%; }
	main.kahonshu .food h3 { margin: 8vw 0 2vw; text-align: center; }
	main.kahonshu .food h3 + p { padding: 0 5.5vw; margin-bottom: 8vw; font-size: 3.5vw; line-height: 1.8; text-align: center; }
	main.kahonshu .food ul { margin: 0; }
	main.kahonshu .food ul li { margin-bottom: 12vw; }
	main.kahonshu .food ul li dd.forSP { display: block; margin: 4vw 7vw 0 7vw; line-height: 1.6; }
	main.kahonshu .food ul li dd.forSP.lead { text-align: center; }
}
@media screen and (min-width: 768px) {
	main.kahonshu .food  { padding: 100px 0; background: url(/Page/kahonshu/images/bg_product.jpg) center top no-repeat; background-size: cover;  }
	main.kahonshu .food h2 { margin-bottom: 40px; text-align: center; }
	main.kahonshu .food h2 + p { margin-bottom: 40px; text-align: center; line-height: 1.8; display: block;}
	main.kahonshu .food ul { display: flex; flex-wrap: wrap; justify-content: space-between; margin: 0 auto 40px; width: 1150px; }
	main.kahonshu .food ul li { width: 370px; }
	main.kahonshu .food ul img { width: 370px; }
	main.kahonshu .food p.forPC.text { display: block; width: 900px; margin: 20px auto ; line-height: 1.6; }
}

/* gift */
@media screen and (max-width:767px) {
	main.kahonshu .gift { padding-bottom: 20vw;}
	main.kahonshu .gift h2 { margin: 7vw 0; }
	main.kahonshu .gift h2 + p { font-size: 3.5vw; line-height: 1.8; text-align: center; }
}
@media screen and (min-width: 768px) {
	main.kahonshu .gift { padding-bottom: 100px; }
	main.kahonshu .gift dt img { width: 100%; }
	main.kahonshu .gift h2 { margin: 40px 0 20px; text-align: center; }
	main.kahonshu .gift h2 img { height: 36px; width: auto;}
	main.kahonshu .gift h2 + p { text-align: center; line-height: 1.8; }
}



/* lineup */
main.kahonshu .btnShop a { position: relative; display: block; width: 100%; padding: 2em 0; text-align: center; font-weight: bold; }
main.kahonshu .btnShop a::before { content: ''; width: 10px; height: 10px; border: 0; transform: rotate(45deg); position: absolute; top: 0; right: 20px; bottom: 0; margin: auto; }
main.kahonshu .lychee .btnShop a { border: 2px solid #a50000; color: #a50000; }
main.kahonshu .lychee .btnShop a:hover { background: #a50000; color: #fff; }
main.kahonshu .lychee .btnShop a::before { border-top: solid 2px #a50000; border-right: solid 2px #a50000; }
main.kahonshu .lychee .btnShop a:hover::before { border-top: solid 2px #fff; border-right: solid 2px #fff; }
main.kahonshu .muscat .btnShop a { border: 2px solid #17896f; color: #17896f; }
main.kahonshu .muscat .btnShop a:hover { background: #17896f; color: #fff; }
main.kahonshu .muscat .btnShop a::before { border-top: solid 2px #17896f; border-right: solid 2px #17896f; }
main.kahonshu .muscat .btnShop a:hover::before {border-top: solid 2px #fff; border-right: solid 2px #fff; }

@media screen and (max-width:767px) {
	main.kahonshu .lineup { margin: 0; text-align: center; box-sizing: border-box; }
	main.kahonshu .lineup .lineupInner { display: flex; flex-direction: column-reverse; background: url(/Page/kahonshu/images/bg_product_sp.jpg) center top no-repeat; background-size: 100% auto;  }
	main.kahonshu .lineup .lychee { margin-top: 20vw; }
	main.kahonshu .lineup .image { margin: 5vw 0 2vw 0; text-align: center; }
	main.kahonshu .lineup .name { margin-bottom: 5vw; }
	main.kahonshu .lineup .image img,
	main.kahonshu .lineup .name img { width: 100%; }
	main.kahonshu .lineup .detail { margin: 0 8.9743vw; }
	main.kahonshu .lineup .text { margin-bottom: 30px; line-height: 1.7; font-size: 3.4444vw;  }
	main.kahonshu .lineup .spec { display: table; width: 100%; padding: 2.8vw 0; border-top: 1px solid #808080; }
	main.kahonshu .lineup .spec dt { display: table-cell; font-size: 3.46666666vw; vertical-align: top; line-height: 1.7; white-space: nowrap; }
	main.kahonshu .lineup .spec dd { display: table-cell; font-size: 3.46666666vw; vertical-align: top; line-height: 1.7;  }
	main.kahonshu .lineup dl:first-child { margin-bottom: 12vw; }
	main.kahonshu .lineup .spec { display: block; width: 100%; padding: 2.8vw 0; border-top: 1px solid #808080; }
	main.kahonshu .btnShop { margin-top: 3vw; }
}
@media screen and (min-width: 768px) {
	main.kahonshu .lineup { margin-bottom: 80px; padding: 80px 0; background: url(/Page/kahonshu/images/bg_product.jpg) center top no-repeat; background-size: cover;  }
	main.kahonshu .lineup .lineupInner { display: flex; flex-wrap: nowrap; justify-content: space-between; margin: 0 auto; width: 1000px; }
	main.kahonshu .lineup dl { margin: 0 auto; padding: 0 50px; width: 500px; }
	main.kahonshu .lineup .image { text-align: center; }
	main.kahonshu .lineup .image img { width: 165px; height: auto; }
	main.kahonshu .lineup .name { margin: 30px 0 25px; }
	main.kahonshu .lineup .catch { margin: 40px 0 30px; }
	main.kahonshu .lineup .text { margin-bottom: 30px; line-height: 1.7; font-size: 1.4rem; }
	main.kahonshu .lineup .spec { display: table; padding: 15px 0; margin: 0; border-top: 1px solid #808080; width: 100%;  }
	main.kahonshu .lineup .spec dt { display: table-cell; width: 20%; font-size: 1.4rem; line-height: 1.6; }
	main.kahonshu .lineup .spec dd { display: table-cell; width: 80%; font-size: 1.4rem; line-height: 1.6; }
	main.kahonshu .btnShop { margin-top: 20px; }
}

/* フェードイン(初期値) */
.js-fadeUp {
	opacity: 0; /* 最初は非表示 */
	transform: translateY(30px); /* 下に30pxの位置から */
	transition: opacity .8s, transform .8s; /* 透過率と縦方向の移動を0.8秒 */
}
  /* フェードイン(スクロールした後) */
.js-fadeUp.is-inview {
	opacity: 1; /* 表示領域に入ったら表示 */
	transform: translateY(0); /* 30px上に移動する */
	transition-delay: .2s; /* フェード開始を0.5秒遅らせる */
}

.wakuwakunokura {
	margin: 60px 20px;
	text-align: center
}

.wakuwakunokura img {
	max-width: 100%
}

.wakuwakunokura-anchor img {
	-webkit-transition-duration: .2s;
	transition-duration: .2s;
	-webkit-transition-property: opacity;
	transition-property: opacity
}

@media (any-hover:hover) {
	.wakuwakunokura-anchor:hover img {
	opacity: .6
	}
}



/* メインビジュアルアニメーション */
.fadeUpMain {
    animation-name:fadeUpAnimeMain;
    animation-duration:2.5s;
    animation-fill-mode:forwards;
    opacity: 0;
    }
    @keyframes fadeUpAnimeMain{
      from {
        opacity: 0;
        transform: translateY(0px);
      }

      to {
        opacity: 1;
        transform: translateY(0);
      }
    }
    /* アニメーションスタートの遅延時間を決めるCSS*/
    .delay-time01 { animation-delay: 1.5s; }
    .delay-time02 { animation-delay: 2.5s; }
	.delay-time02-2 { animation-delay: 3s; }
    .delay-time03 { animation-delay: 3.5s; }
	.delay-time03-2 { animation-delay: 4s; }