@charset "UTF-8";
#cmeFooter .toPageTop a { z-index: 100; }
.wrapper { font-family: 'Noto Sans JP', sans-serif; font-size: 1.3333333333333em; font-weight: 400; }
.wrapper img {height: auto; vertical-align: bottom; max-width: 100%; }
.container { position: relative; margin: 0 auto; padding-right: 13px; padding-left: 13px; max-width: 1414px; z-index: 10; }
.view-recipe {font-size: 0.9375em;line-height: calc(28 / 15);letter-spacing: 0.08em;padding-right: 38px;position: relative;color: #333333;display: inline-block;}
.view-recipe__line {position: relative; display: inline-block;}
.view-recipe__line::after {content: ""; position: absolute; left: 0; bottom: -2px; width: 100%; height: 1px; background-color: #E0AC00; transform: scale(0, 1); transform-origin: right top; transition: transform 0.3s ease;}
.view-recipe .view-recipe__icon { border: 1px solid #E0AC00; border-radius: 50%; background-size: contain; display: inline-block; height: 26px; position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 26px;transition: background-color 0.3s ease; }
.view-recipe .view-recipe__icon span { height: 8px; left: 50%; line-height: 1; margin: auto 0; overflow: hidden; position: absolute; top: 50%; transform: translate(-50%, -50%); width: 11px; }
.view-recipe .view-recipe__icon span:after { background: url(/club-me/food/hare/img/common/img_arrow_white.svg) no-repeat 50% 50%; background-size: contain; content: ""; height: 8px; left: 0; position: absolute; width: 11px;z-index: 1000; }
.view-recipe .view-recipe__icon span:before { background: url(/club-me/food/hare/img/common/img_arrow.svg) no-repeat 50% 50%; background-size: contain; content: ""; height: 8px; left: 0; position: absolute; width: 11px;z-index: 1000; }
.view-recipe .view-recipe__icon span:after { transform: translateX(-100%); }
.mv-heading {text-align: center;}
.mv-heading img{max-width: 246px;}
.date { margin-top: 52px; }
.date .container {max-width: 1174px;}
.date-text { text-align: right; }
.page_back { margin-top: 68px; }
.page_back p { text-align: center; }
.page_back p a { border-radius: 3px; border: 1px solid #dbdbdb; color: #222222; display: inline-block; vertical-align: bottom; padding: 10px 20px; }
.page_back p a:hover { text-decoration: none; }
.page_back p a span { display: inline-block; position: relative; padding: 0 20px; }
.page_back p a span::after { content: ''; display: block; position: absolute; top: calc(50% - 4px); right: 0px; width: 7px; height: 7px; border-top: 2px solid #c00; border-right: 2px solid #c00; transform: rotate(45deg); }
@keyframes arrowOut {
    0% { transform: translateX(0); }
    100% { transform: translateX(150%); }
}
@keyframes arrowIn {
    0% { transform: translateX(-150%); }
    100% { transform: translateX(0); }
}
.recipe {margin-top: 120px;}
a.recipe-item {color: #333333;text-decoration: none;}
.recipe-grid { display: grid; gap: 30px 0.2828%; grid-template-columns: repeat(auto-fit, 24.7524%); justify-content: center; }
.recipe-item__img {display: block; overflow: hidden;}
.recipe-item__img img {transition: transform .3s ease;}
.recipe-item__content{margin-top: 30px;padding: 0 15px;}
.recipe-item__num{color: #E0AC00;font-weight: 700;font-size: 0.875em;font-family: 'Ubuntu', sans-serif;letter-spacing: 0.13em;}
.recipe-item__title{margin-top: 14px;font-size: 1.125em;font-weight: 700;letter-spacing: 0.08em;line-height: calc(27 / 18);}
.recipe-item__txt{margin-top: 20px;line-height: calc(30 / 16);letter-spacing: 0.08em;}
.recipe-item__btn {margin-top: 20px;}
.fade-txt { opacity: 0; overflow: hidden; transform: translate3d(0, 10%, 0); }
.fade-txt.in-view-from-bottom { transition: opacity .5s calc(var(--index) * .02s) cubic-bezier(.18, .06, .23, 1), transform 2.3s calc(var(--index) * .02s) cubic-bezier(.47, .16, .24, 1); opacity: 1; transform: translateZ(0); }
.fade-txt.in-view-from-bottom span { transition: transform .8s calc(var(--index) * .02s) cubic-bezier(.47, .16, .24, 1); transform: translateZ(0); }
.fade-txt span { display: inline-block; transform: translate3d(0, 120%, 0); }
.fade-txt-line {display: flex;position: relative;width: fit-content; }
.sr-text { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }
.ls-2 {letter-spacing: -0.02em!important;}
@media print, screen and (min-width: 768px){
.sp-only {display: none!important;}
.is-hover:hover .view-recipe .view-recipe__line::after { transform: scale(1, 1);transform-origin: left top; }
.is-hover:hover .view-recipe .view-recipe__icon {background-color: #E0AC00;}
.is-hover:hover .view-recipe .view-recipe__icon span:before { animation: arrowOut .6s ease forwards; }
.is-hover:hover .view-recipe .view-recipe__icon span::after { animation: arrowIn .6s ease forwards; }
.page_back p a { transition: background-color 0.3s ease, color 0.3s ease;min-width: 425px;}
.page_back p a:hover { color: #c00; background-color: #f5f5f5; }
.recipe-item:hover .recipe-item__img img {transform: scale(1.07);}
.ls-8 {letter-spacing: 0.08em!important;}
}
@media only screen and (max-width: 767.98px){
.container { padding-right: 20px; padding-left: 20px; }
.pc-only {display: none!important;}
.view-recipe {font-size: 1.0714285714286em;padding-right: 38px;}
.recipe-item__img {text-align: center;}
.mv-heading img{width: 41.8666vw;max-width: 300px;}
.recipe {margin-top: 70px;}
.recipe-grid {grid-template-columns: 1fr;gap: 40px 0;}
.recipe-item__num {font-size: 1em;}
.recipe-item__title{margin-top: 14px;font-size: 1.2857142857143em;}
.recipe-item__txt {font-size: 1.1428571428571em;}
.date { margin-top: 40px; }
.date-text { font-size: 1.1428571428571em; }
.page_back { margin: 25px 0 40px 0; }
.page_back p a { display: block; font-size: 0.92857142857143em; }
.page_back p a span::after { top: calc(50% - 3px); width: 5px; height: 5px; }
}
