@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Mr+De+Haviland&display=swap');
@font-face{font-family:"Yu Gothic M";src:local("Yu Gothic Medium");}
@font-face{font-family:"Yu Gothic M";src:local("Yu Gothic Bold");font-weight:bold;}

/* CSS Document */

/* ============================================= ==

	common style

=============================================== */
html #content{opacity:0;}
html.ready #content{opacity:1;}

#content{width:100%;color:#342d30;font-family:"游ゴシック体", YuGothic, "Yu Gothic M", "游ゴシック Medium", "Yu Gothic Medium", Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;}
#content *{font:inherit;}
#content h1, #content h2, #content h3{font-weight:bold;}
#content h1, #content h2, #content h3, #content figure{border:0;margin:0;padding:0;}
#content img{max-width:100%;width:auto;}
#content em{font-style:normal;}
#content a{text-decoration:none;}

#content .en{font-family: 'Mr De Haviland', cursive;letter-spacing: 0;font-weight: normal;line-height: 1;}
#content > section {position: relative;}

#content .common-ttl{text-align: center;}
#content .common-ttl .en{font-size: 60px;}
#content .common-ttl .en small {font-size: 48px;}
#content .common-ttl span{display: block;/*margin-top: 30px;*/}

#content .common-btn{background:#fff;display:block;width:100%;max-width:240px;text-align:center}
#content .common-btn a{font-weight:700;font-size:16px;padding:11px 0;display:block;position:relative}
#content .common-btn a:after{content:"";position:absolute;bottom:4px;right:4px;border-style:solid;border-width:0 0 10px 10px;border-color:transparent transparent #342d30}
#content .common-btn2{width:100%;max-width:240px;text-align:center}
#content .common-btn2 a{display:block;border:solid 1px #342d30;background:transparent;color:#342d30;font-size:12px;padding:5px 0;position:relative;}
#content .common-btn2 a:after{content:"";position:absolute;top:50%;right:20px;width:14px;height:4px;margin-top:-2px;background:url(../images/arrow2_b.png) center / auto no-repeat;transition-duration:.3s}
.pc #content .common-btn2 a{transition:.3s}
.pc #content .common-btn2 a:hover{background: #342d30;color: #fff;opacity: 1;}
.pc #content .common-btn2 a:hover:after{background:url(../images/arrow2.png) center / auto no-repeat;}
.pc #content .common-btn2 a:hover:after{right:12px}

.pc #content{font-size:14px;min-width:1200px;line-height:2em;letter-spacing: .075em;}
.pc #content .content-inner{width:1000px;margin:auto;position: relative;z-index: 1;}
.pc #content a{transition:opacity .3s;}
.pc #content a:hover{opacity:0.7;}
.pc #content .only-sp{display:none !important;}

.pc #content .pkg{
	margin-top:10px; font-size: 12px; margin-left: 68%;
}

#content sub {
	font-size: 40%;
}

/*---------------------------
.content-mv
---------------------------*/
#content .content-mv{position:relative;max-width:1200px;width:100%;margin:auto;z-index:10;}
#content .content-mv .mv-img{width:100%;}
.pc #content .content-mv h1{position:absolute;top:20px;left:0;}
.pc #content .content-mv h2 {position: absolute;bottom:40px;left:40px;}

/*---------------------------
#block-lead
---------------------------*/
#content #block-lead{background-color: #f5c6c6;margin-top: 66px;padding: 106px 0 158px;text-align: center;}
#content #block-lead:before{content:'';position: absolute;top: -34px;left: 0;width: 100%; height: calc( 100% + 68px ); background: url(../images/lead_bg01.png) top 34px left / auto no-repeat,url(../images/lead_bg02.png) bottom left / auto no-repeat,url(../images/lead_bg03.png) top right / auto no-repeat,url(../images/lead_bg04.png) bottom 100px right / auto no-repeat;}
#content #block-lead:after{content:'';position: absolute;top: 0;left: 50%;width: 1px; height: 50px; background: #342d30;}
#content #block-lead .txt{margin-top: 56px;padding: 36px 0;border-top:solid 1px #342d30;border-bottom:solid 1px #342d30;font-weight: bold;font-size:16px;}
#content #block-lead .txt p + p{margin-top: 40px;}
#block-lead + .bnr{margin-top:-120px;position:relative;z-index:1}

/*---------------------------
#block-recipe-nav
---------------------------*/
#content #block-recipe-nav{padding:80px 0;}
#content #block-recipe-nav:before{content:'';position: absolute;top: 0;right:0; width: 50%;height: 100%;background: #f8f5f5;}
#content #block-recipe-nav ul{display: flex;justify-content: space-between;}
#content #block-recipe-nav li{width: 13%;text-align: center;}
#content #block-recipe-nav li a{display: block;}
#content #block-recipe-nav li figure img{width: 100%;height: auto}
#content #block-recipe-nav li .txt{min-height:84px;display: flex;align-items: center;justify-content: center;font-size: 13px; line-height: 1.38em;font-weight:bold;margin-top: 20px;padding-bottom: 32px;position: relative;    box-sizing: border-box;}
#content #block-recipe-nav li .txt:before{content:'';position: absolute;bottom: 4px;left: 0; height: 24px; width: 100%;background:url(../images/arrow.png) bottom center / auto no-repeat;transition-duration: .3s;}
#content #block-recipe-nav li a:hover .txt:before{bottom: 0;}

/*---------------------------
#block-recipe
---------------------------*/
#content #block-recipe{padding:100px 0;background:#f5f0f1}
#content #block-recipe:after{content:'';position:absolute;top:0;left:50%;width:1px;height:50px;background:#342d30}
#content #block-recipe .box{padding-top:60px;position:relative}
#content #block-recipe .box:before{content:"";position:absolute;top:380px;left:0;width:300px;height:300px;background:#f5c6c6;z-index:0}
#content #block-recipe .box:after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;z-index:1}
#content #block-recipe .box:nth-of-type(odd):before{top:110px;left:inherit;right:0}
#content #block-recipe .box .content-inner{z-index:2}
#content #block-recipe .box .img{margin-right:50px;position:relative}
#content #block-recipe .box .img .cheese{position:absolute;top:-20px;left:-20px;width:120px}
#content #block-recipe .box .recipe-txt{background:#fff;margin-left:50px;margin-top:-60px;z-index:1;position:relative}
#content #block-recipe .box .recipe-txt .recipe-detail{padding:46px 60px}
#content #block-recipe .box .recipe-txt .recipe-detail .ttl{font-size:24px}
#content #block-recipe .box .recipe-txt .recipe-detail .txt{margin-top:14px}
#content #block-recipe .box .recipe-txt .recipe-detail .en-ttl{position:absolute;top:-30px;right:-50px;font-size:60px;color:#f5c6c6;transform:rotate(-10deg)}
/*#content #block-recipe .box .recipe-txt .point{background:#65565b;color:#fff;padding:30px 40px 34px;display:flex;position:relative}*/
#content #block-recipe .box .recipe-txt .point{background:#65565b;color:#fff;padding:30px 40px 34px;display:flex;position:relative; flex-wrap: wrap; }
#content #block-recipe .box .recipe-txt .point .en-ttl{font-size:50px;color:#ccaeb8;position:absolute;top:-20px;left:40px;transform:rotate(-10deg)}
#content #block-recipe .box .recipe-txt .point .txt{width:72.4%;box-sizing:border-box;padding:0 60px 0 90px;line-height:2.28em;color:#fff}
#content #block-recipe .box .recipe-txt .point .btn{width:27.6%;box-sizing:border-box;display:flex;align-items:center;justify-content:center}
#content #block-recipe .box#recipe1:after{background:url(../images/recipes-01_bg_01.png) top 190px right / auto no-repeat,url(../images/recipes-01_bg_02.png) top 620px left 20px / auto no-repeat}
#content #block-recipe .box#recipe2:after{background:url(../images/recipes-02_bg_01.png) top 500px left 44px / auto no-repeat,url(../images/recipes-02_bg_02.png) top 70px right 0 / auto no-repeat}
#content #block-recipe .box#recipe3:after{background:url(../images/recipes-03_bg_01.png) top 40px right / auto no-repeat,url(../images/recipes-03_bg_02.png) top 270px left 0 / auto no-repeat,url(../images/recipes-03_bg_03.png) top 520px right 44px / auto no-repeat}
#content #block-recipe .box#recipe4:after{height:calc(100% + 20px);background:url(../images/recipes-04_bg_01.png) top 10px left / auto no-repeat,url(../images/recipes-04_bg_02.png) top 340px right 0 / auto no-repeat,url(../images/recipes-04_bg_03.png) top 650px left 20px / auto no-repeat,url(../images/recipes-04_bg_04.png) bottom right 150px / auto no-repeat}
#content #block-recipe .box#recipe5:after{background:url(../images/recipes-05_bg_01.png) top 390px right / auto no-repeat,url(../images/recipes-05_bg_02.png) top 520px left 0 / auto no-repeat}
#content #block-recipe .box#recipe6:after{top:-90px;background:url(../images/recipes-06_bg_01.png) top 0 right 70px / auto no-repeat,url(../images/recipes-06_bg_02.png) top 650px left 70px / auto no-repeat}

/*---------------------------
#block-herbs
---------------------------*/
#content #block-herbs{background:#f5f0f1}
#content #block-herbs:before{content:"";position:absolute;top:-250px;left:0;width:220px;height:380px;background:url(../images/herbs_bg_01.png);z-index:1}
#content #block-herbs:after{content:"";position:absolute;bottom:-158px;right:0;width:200px;height:370px;background:url(../images/herbs_bg_02.png);z-index:1}
.pc #content #block-herbs .content-inner{width:100%;max-width:1200px;position:relative;z-index:2}
#content #block-herbs .ttl-sec .ttl{width:57%;margin-left:43%;padding:60px 0 50px 70px;box-sizing:border-box}
#content #block-herbs .ttl-sec .en-ttl{position:absolute;top:0;right:0;font-size:90px;margin-top:-15px;color:rgba(204,174,184,.5)}
#content #block-herbs .box{background:#65565b}
#content #block-herbs .box .box-inner{position:relative;max-width:1400px;margin:auto}
#content #block-herbs .box .img{float:left;margin-top:-100px;width:43%}
#content #block-herbs .box .txt{color:#fff;font-size:16px}
#content #block-herbs .box .recipe-txt .recipe-detail{width:57%;margin-left:43%;padding:80px 94px 80px 70px;box-sizing:border-box}
#content #block-herbs .box .recipe-txt .recipe-detail .ttl{position:relative;padding-bottom:28px;margin:0 0 24px}
#content #block-herbs .box .recipe-txt .recipe-detail .ttl:after{content:"";position:absolute;bottom:0;left:0;width:60px;height:1px;background:#fff}
#content #block-herbs .box .point{position:relative;border:solid 1px #fff;padding:28px 26px 30px;margin-top:60px}
#content #block-herbs .box .point .other-ttl{text-align:left;font-size:16px;font-weight:700;color:#fff;margin-bottom:0;padding:8px;margin-left:-8px;background:#64565b;display:inline-block;position:absolute;top:-17px;left:26px}

@media screen and (max-width:1420px){
#content #block-herbs:after{bottom:-208px;right:0;width:160px;height:280px;background:url(../images/herbs_bg_02.png) center / 100% auto no-repeat;}
}

/*---------------------------
#block-lineup
---------------------------*/
#content #block-lineup{padding:100px 0;position:relative;background:#f5f0f1}
#content #block-lineup:before{content:"";position:absolute;top:0;left:50%;height:50px;width:1px;background:#342d30}
#content #block-lineup .lineup-list{display:flex;justify-content:center;/*margin-top:64px*/margin-top:34px}
.pc #content #block-lineup .lineup-list li{width:240px;text-align:center}
.pc #content #block-lineup .lineup-list li + li{margin-left:60px}
#content #block-lineup .lineup-list .ttl{font-size:16px;font-weight:700;line-height:1.375em;margin-top:30px}
#content #block-lineup .lineup-list .txt{line-height:1.57em;margin-top:15px;text-align:left}
#content #block-lineup .lineup-list .common-btn2{margin-top:20px}
#content #block-lineup .bnr{margin-top:100px}
#content #block-lineup .pkg {margin-top:30px;font-size: 12px;}

/*---------------------------
#block-other
---------------------------*/
#content #block-other{background:#f5f0f1;padding:100px 0}
#content #block-other:before{content:"";position:absolute;top:0;left:0;width:100%;height:55%;background:#ccaeb8}
#content #block-other:after{content:"";position:absolute;top:0;left:50%;height:50px;width:1px;background:#fff}
#content #block-other .common-ttl .en{color:#fff}
#content #block-other ul{margin-top:60px;display:flex;justify-content: space-around;}
#content #block-other ul li{text-align:center}
#content #block-other ul li h3{font-size:16px;line-height:1.625em;margin-top:24px}
#content #block-other ul li .common-btn2{text-align:center;margin:24px auto 0}
#content #block-other + .bnr{padding:50px 0}

.pc #content #block-other ul li figure a{display:block;position:relative}
.pc #content #block-other ul li figure a:hover{opacity:1}
.pc #content #block-other ul li figure a:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:#f4f0f1;opacity:0;transition-duration:.3s}
.pc #content #block-other ul li figure a:hover:before{opacity:.3}


/* ===============================================
	SP style
=============================================== */
.sp #content h1, .sp #content h2, .sp #content h3, .sp #content h4, .sp #content img{display:block;}
.sp #content{margin:0 auto;}
.sp #content p{font-size:13px;line-height:2;letter-spacing: .075em;}
.sp #content img{width:100%;height:auto;max-width:100%;}
.sp #content .only-pc{display:none !important;}
.sp #content .content-inner{padding:0 4%;box-sizing:border-box;z-index: 1;position: relative;}
.sp .breadcrumbs + br{display:none;}

.sp #content .common-ttl .en{font-size: 43px;}
.sp #content .common-ttl .en small {font-size: 34px;}
.sp #content .common-ttl span{display: block; margin-right: auto; margin-left: auto;/*margin-top: 15px;*/margin-top: 0px;}

.sp #content .pkg{
	margin-top:10px; font-size: 10px; text-align: center;
}

/*---------------------------
.content-mv
---------------------------*/
.sp #content .content-mv .ttl{background:#65565b;padding-bottom:15px}
.sp #content .content-mv .ttl h1{width:100%;max-width:342px;margin:-20px 0 0}
.sp #content .content-mv .ttl h2{width:80%;margin-top:10px;margin-left:16%;margin-right:4%}
.sp #content #block-lead:before{top:0;height:100%;background:url(../images/lead_bg01.png) top left / 25% auto no-repeat,url(../images/lead_bg02.png) bottom 20px left / 18% auto no-repeat,url(../images/lead_bg03.png) top right / 25% auto no-repeat,url(../images/lead_bg04.png) bottom 46px right / 15% auto no-repeat}
.sp #content #block-lead .txt{margin-top:30px;padding:24px 0;font-size:15px;text-align:left}
.sp #content #block-lead .txt p{font-size:15px}

/*---------------------------
#block-lead
---------------------------*/
.sp #content #block-lead{padding:80px 0;margin:0 auto}
.sp #content #block-lead .common-ttl span{max-width:258px}
.sp #block-lead + .bnr{margin-top:-40px}

/*---------------------------
#block-recipe-nav
---------------------------*/
.sp #content #block-recipe-nav{padding:35px 0 50px}
.sp #content #block-recipe-nav .content-inner{padding:0}
.sp #content #block-recipe-nav ul{flex-wrap:wrap}
.sp #content #block-recipe-nav li{width:50%;text-align:left;padding-left:15px;box-sizing:border-box}
.sp #content #block-recipe-nav li:nth-of-type(n+3){margin-top:30px}
.sp #content #block-recipe-nav li a{display:flex;align-items:center}
.sp #content #block-recipe-nav li figure{width:38%}
.sp #content #block-recipe-nav li .txt{padding-left:6px;padding-right:28px;padding-bottom:0;min-height:inherit;width:62%;margin-top:0;    justify-content: flex-start;}
.sp #content #block-recipe-nav li .txt:before{bottom:50%;left:inherit;height:6px;width:10px;right:10px;background:url(../images/arrow.png) center right / 100% auto no-repeat;margin-top:0}
.sp #content #block-recipe-nav li .txt p{line-height:1.3;font-size:12px;letter-spacing:0}

/*---------------------------
#block-recipe
---------------------------*/
.sp #content #block-recipe{padding:80px 0;background:url(../images/recipes-01_bg_01.png) top 90px right / 20% auto no-repeat #f5f0f1}
.sp #content #block-recipe .common-ttl span{max-width:190px}
.sp #content #block-recipe #recipe1{padding-top:30px}
.sp #content #block-recipe .box{padding-top:60px}
.sp #content #block-recipe .box .img .cheese{position:absolute;top:-10px;left:-10px;width:80px}
.sp #content #block-recipe .box .img{margin-right:15px}
.sp #content #block-recipe .box .recipe-txt{margin-left:15px;margin-top:0}
.sp #content #block-recipe .box .recipe-txt .recipe-detail{padding:65px 35px 35px}
.sp #content #block-recipe .box .recipe-txt .recipe-detail .en-ttl{top:-10px;right:-2%;font-size:40px}
.sp #content #block-recipe .box .recipe-txt .recipe-detail .ttl{font-size:20px;text-align:left}
.sp #content #block-recipe .box .recipe-txt .point{padding:35px 35px 30px;display:block}
.sp #content #block-recipe .box .recipe-txt .point .txt{width:100%;padding:0;font-size:14px;line-height:1.85em;letter-spacing:.03em}
.sp #content #block-recipe .box .recipe-txt .point .btn{width:100%;margin-top:20px}
.sp #content #block-recipe .box:before{top:inherit;bottom:-4%;left:0;width:150px;height:150px}
.sp #content #block-recipe .box:nth-of-type(odd):before{top:inherit;bottom:-4%;left:inherit;right:0}
.sp #content #block-recipe .box#recipe1:after{content:none}
.sp #content #block-recipe .box#recipe2:after{top:-20px;background:url(../images/recipes-02_bg_01.png) top 0 left -40px / 30% auto no-repeat,url(../images/recipes-02_bg_02.png) bottom right / 50% auto no-repeat}
.sp #content #block-recipe .box#recipe3:after{background:url(../images/recipes-03_bg_02.png) top 30px left / 24% auto no-repeat,url(../images/recipes-03_bg_03.png) bottom 20% right -26px / 24% auto no-repeat}
.sp #content #block-recipe .box#recipe4:after{height:calc(100% + 20px);top:20px;background:url(../images/recipes-04_bg_01.png) top 50% left -20px / 30% auto no-repeat,url(../images/recipes-04_bg_02.png) top right 0 / 16% auto no-repeat,url(../images/recipes-04_bg_03.png) bottom right -30px / 24% auto no-repeat}
.sp #content #block-recipe .box#recipe5:after{top:-20px;background:url(../images/recipes-05_bg_01.png) top 76% right -50px / 30% auto no-repeat,url(../images/recipes-05_bg_02.png) top 30% left 0 / 30% auto no-repeat}
.sp #content #block-recipe .box#recipe6:after{top:-30px;background:url(../images/recipes-06_bg_01.png) top 0 right -30px / 30% auto no-repeat}



/*---------------------------
#block-herbs
---------------------------*/
.sp #content #block-herbs:before{top:-110px;width:120px;height:180px;background:url(../images/herbs_bg_01.png) center / 100% auto no-repeat}
.sp #content #block-herbs:after{bottom: -50px;width: 60px;height: 104px;background:url(../images/herbs_bg_02.png) center / 100% auto no-repeat}
.sp #content #block-herbs .box{background:none}
.sp #content #block-herbs .box .img{float:none;width:84%;margin:auto}
.sp #content #block-herbs .ttl-sec .en-ttl{position:relative;top:inherit;right:inherit;font-size:60px;color:rgba(204,174,184,.5);margin:auto;text-align:center;z-index: -1;}
.sp #content #block-herbs .ttl-sec .ttl{width:100%;max-width:225px;padding:0;margin:-20px auto 20px;box-sizing:border-box}
.sp #content #block-herbs .box .recipe-txt{background:#65565b;margin-top:-100px;padding:130px 4% 60px}
.sp #content #block-herbs .box .recipe-txt .recipe-detail{width:100%;margin-left:0;padding:0;box-sizing:border-box}
.sp #content #block-herbs .box .recipe-txt .recipe-detail .ttl{max-width:200px;padding-bottom:20px;margin:0 0 16px}
.sp #content #block-herbs .box .recipe-txt .recipe-detail .ttl:after{width:40px}
.sp #content #block-herbs .box .txt { font-size: 14px;}
.sp #content #block-herbs .box .point{padding:22px 22px 24px;margin-top:30px}
.sp #content #block-herbs .box .point .other-ttl{font-size: 16px;top: -17px;}

/*---------------------------
#block-lineup
---------------------------*/
.sp #content #block-lineup{padding:80px 0}
.sp #content #block-lineup .common-ttl span{max-width:148px}
.sp #content #block-lineup .lineup-list{display:block;margin-top:0}
.sp #content #block-lineup .lineup-list li{display:flex;margin-top:40px}
.sp #content #block-lineup .lineup-list li figure{width:30%;text-align:center;display:flex;align-items:center}
.sp #content #block-lineup .lineup-list li .txt-sec{width:70%;padding-left:20px;box-sizing:border-box}
.sp #content #block-lineup .lineup-list .ttl{font-size:15px;margin-top:0}
.sp #content #block-lineup .lineup-list .txt{margin-top:8px;font-size:12px}
.sp #content #block-lineup .lineup-list .common-btn2{margin-top:8px}
.sp #content #block-lineup .bnr{margin-top:60px}
/*.sp #content #block-lineup .pkg {margin-top:40px;font-size: 10px; text-align: center;}*/

/*---------------------------
#block-other
---------------------------*/
.sp #content #block-other{padding:80px 0}
.sp #content #block-other:before{height:300px}
.sp #content #block-other .common-ttl span{max-width:315px}
.sp #content #block-other ul{margin-top:40px;display:block;padding:0 4%}
.sp #content #block-other ul li + li{margin-top:40px}
.sp #content #block-other ul li h3{font-size:15px;line-height:1.5em;margin-top:14px}
.sp #content #block-other ul li .common-btn2{margin:12px auto 0}
.sp #content #block-other + .bnr{padding:30px 0}


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

}
