﻿:root {
  --base-font-size: 88;
}




.recipes-list-box{
    display: grid;
    gap: 20px;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    margin: 20px 0;
}
.recipes-list-box li{
	position:relative;	
	cursor: pointer;
}
.recipes-list-box li .recipe-tit{
	color:#fff;
	font-weight:bold;
    position: absolute;
    bottom: 10px;
    left: 10px;
}

.recipes-list-box li::after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: url(../../img/recipe/waku.svg) center center no-repeat;
    background-size: contain;
    z-index: 10;
    opacity: 0;
}
.recipes-list-box li a{
	opacity:1 !important;
}
.recipes-list-box li:hover .pic img{
border:4px solid #dc6a74;
}
.recipes-list-box li:hover .btn-recipe {
           border: none !important;
        background: url(../../img/recipe/btn_recipes.svg) center center no-repeat;
        background-size: contain;
}
.recipes-list-box li:hover .btn-recipe:before,
.recipes-list-box li:hover .btn-recipe:after{
	    background: #fff;
}

    .top .content.recipes-content .recipes-box .recipes-box-inner .recipes-list-box li::after {
        width: calc(0.348rem * var(--base-font-size));
        height: calc(0.48rem * var(--base-font-size));
        transition: all 0.2s ease-out;
    }

.recipes-list-box li .btn-recipe{
        right: 10px;
        bottom: 10px;
        width: calc(0.06rem * var(--base-font-size));
        height: calc(0.06rem * var(--base-font-size));
        border-width: 0.002rem;
border-radius: calc(0.03rem * var(--base-font-size));
}

.recipes-box .recipes-box-inner .recipes-list-box li .btn-recipe {
    position: absolute;
    border: #F5AF5F solid;
}

.recipes-content .recipes-box .recipes-box-inner .recipes-list-box li .btn-recipe::after {
        width: calc(0.02rem * var(--base-font-size));
        height: calc(0.002rem * var(--base-font-size));
}

.recipes-list-box li::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.3); /* 仮の例 */
  opacity: 0;
  transform: translate(-50%, -50%) scale(1);
  transition: all 0.3s ease;
  z-index: 1;
}
.recipes-list-box li .pic img {
  position: relative;
  transition: transform 0.3s ease;
}
.recipes-list-box li:hover .pic img {
  transform: scale(1.0588);
}

.btn-recipe::before {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #F5AF5F;
	z-index: 2;
}
.btn-recipe::after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #F5AF5F;
	z-index: 2;
}
.btn-recipe::before {
        width: calc(0.002rem * var(--base-font-size));
        height: calc(0.02rem * var(--base-font-size));
}


.recipes-list-box li img{
	border-radius: 10px;
}


.modal {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 10000;
  display: none;
  background: rgba(255, 255, 255, 0.8);
}
.modal .md-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.modal .md-close-btn {
  position: absolute;
	top: 0;
	border:0;
  background: url(../../img/common/bg_hbg.svg) center center no-repeat;
  background-size: cover;
}
.modal .md-close-btn::before, .modal .md-close-btn::after {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  background: #fff;
  z-index: 2;
}
.modal .md-close-btn::before {
  transform: translateX(-50%) rotate(45deg);
}
.modal .md-close-btn::after {
  transform: translateX(-50%) rotate(-45deg);
}
.modal .md-content {
  display: none;
}
.modal.modal-yt {
  position: fixed;
}
.modal.modal-yt .md-content {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 90%;
  max-width: 960px;
  border: 1px solid #F0824B;
  background: #fff;
  overflow: hidden;
}
.modal.modal-yt .md-content .yt {
  overflow: hidden;
}
.modal.modal-yt .md-content .yt #ytplayer {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.modal.modal-recipes {
  position: absolute;
}
{
  margin: 0 auto;
  background: #fff;
  border: 1px solid #F0824B;
}
.md-recipe-box {
  display: none;
}
 .md-tit {
  font-weight: 500;
  text-align: center;
  color: #F0824B;
  line-height: 1.25;
}
 .md-tit.md-tit-cook em {
  display: block;
}
 .md-copy {
  font-weight: 500;
  text-align: center;
  line-height: 1.5;
}
 .md-pic .md-cook-box {
  position: absolute;
}
 .md-pic .md-cook-box .md-cook {
  position: absolute;
  z-index: 2;
}
 .md-pic .md-cook-box .md-cook-p {
  overflow: hidden;
  border: solid #fff;
}
 .md-intro {
  font-weight: 500;
  text-align: center;
}
 .md-intro a {
  color: #F0824B;
  text-decoration: underline;
}
 .md-subtit {
  font-weight: 500;
  text-align: center;
  color: #fff;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
}
 .md-zairyo-box {
  border-top: 1px solid rgba(50, 50, 50, 0.2);
}
 .md-zairyo-box li {
  display: flex;
  align-items: center;
  border-bottom: 1px solid rgba(50, 50, 50, 0.2);
}
 .md-zairyo-box li p {
  line-height: 1.5;
}
 .md-zairyo-box li.md-zairyo-list {
  flex-wrap: wrap;
}
 .md-zairyo-box li.md-zairyo-list .md-zairyo-list-inner dt {
  font-weight: 500;
  line-height: 1.5;
  color: #a0a0a0;
}
 .md-zairyo-box li.md-zairyo-list .md-zairyo-list-inner dd {
  border-top: 1px solid rgba(50, 50, 50, 0.2);
  display: flex;
  align-items: center;
}
 .md-howto-box li {
  display: flex;
  line-height: 2;
}
 .md-howto-box li p.md-howto-no {
  margin-right: 0.25em;
  color: #F0824B;
}
 .c {
  margin: 0 0.25em;
  display: inline-block;
  color: #fff;
}
 .c i {
  top: calc(-0.075rem * var(--base-font-size));
}
 .c::before {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: #F0824B;
}
.recipe-wrap{
margin-bottom:32px;	
}

.es-content-title {
    display: block;
    margin: 110px 0 20px;
}
.m-breadcrumb {
    margin-bottom: -40px;
}
@media screen and (max-width: 767px) {
    .es-content-title {
        margin: calc(80 / 375 * 100vw) 0 calc(36 / 375 * 100vw);
    }
}
.recipe-wrap a {
  display: inline;
  color: #F0824B;
  text-decoration: underline;
}
 .md-info-box {
  border: solid #F0824B;
  text-align: center;
}
 .md-info-box span {
  color: #F0824B;
}
 .md-point-box .md-box {
  display: flex;
}
 .md-point-box .md-box .md-text-box {
  line-height: 2;
}
 .md-point-box .md-box .md-text-box .md-box-tit {
  font-weight: 500;
  color: #F0824B;
}
 .md-point-box .md-box .md-text-box em {
  font-weight: 500;
}
 .md-point-box .md-box .md-text-box .md-text-box-inner dd {
  display: flex;
}
 .md-point-box .md-box .md-text-box .md-text-box-inner dd p.md-howto-no {
  margin-right: 0.25em;
  color: #F0824B;
}
 .md-recommend-box {
  margin-inline: auto;
  border: solid #F0824B;
  background: rgba(245, 175, 95, 0.1);
}
 .md-recommend-box .md-recommend-tit {
  text-align: center;
  color: #F0824B;
  font-weight: 500;
  line-height: 1.5;
}
 .md-recommend-box .md-recommend-subtit {
  text-align: center;
  color: #F0824B;
  font-weight: 500;
  line-height: 2;
}
 .md-recommend-box p {
  line-height: 2;
}
 .md-recommend-box p.md-text {
  font-weight: 500;
}
 .md-recommend-box p.md-text-i {
  text-indent: -1em;
  padding-left: 1em;
}
.on {
  display: block;
}
.modal.on {
  display: block;
}
.modal.on .md-content {
  display: block;
}



@media screen and (min-width: 769px) {
.modal .md-close-btn {
    right: 0;
    width: calc(0.07rem * var(--base-font-size));
    height: calc(0.07rem * var(--base-font-size));
    cursor: pointer;
    transition: opacity 0.3s ease-out;
  }
  .modal .md-close-btn::before, .modal .md-close-btn::after {
				width: calc(0.036rem * var(--base-font-size));
				
    height: calc(0.002rem * var(--base-font-size));
  }
  .modal .md-close-btn:hover {
    opacity: 0.7;
  }
  .modal.modal-recipes {
    padding-top: calc(0.1rem * var(--base-font-size));
  }
	{
		position: relative;

    padding: calc(0.1rem * var(--base-font-size)) 0;
		width: calc(1.08rem * var(--base-font-size));
		
  }
   .md-tit {
    margin-bottom: calc(0.02rem * var(--base-font-size));
    font-size: calc(0.046rem * var(--base-font-size));
  }
   .md-tit.md-tit-cook {
    margin-top: -0.04rem;
  }
   .md-tit.md-tit-cook em {
    font-size: calc(0.032rem * var(--base-font-size));
  }
   .md-tit.md-tit-cook em span {
    font-size: calc(0.024rem * var(--base-font-size));
  }
	.md-copy {
		margin-bottom: 40px;
    font-size: calc(0.026rem * var(--base-font-size));
  }
   .md-pic {
    margin: calc(0.028rem * var(--base-font-size)) auto 0;
    width: calc(0.96rem * var(--base-font-size));
  }
   .md-pic .md-cook-box {
    bottom: -24px;
    right: calc(0.024rem * var(--base-font-size));
    width: calc(0.212rem * var(--base-font-size));
  }
   .md-pic .md-cook-box .md-cook {
    top: calc(-0.002rem * var(--base-font-size));
  }
   .md-pic .md-cook-box .md-cook.md-cook-fujii {
    left: calc(0.007rem * var(--base-font-size));
    width: calc(0.194rem * var(--base-font-size));
  }
   .md-pic .md-cook-box .md-cook.md-cook-hasegawa {
    left: -0.008rem;
    width: calc(0.22rem * var(--base-font-size));
  }
   .md-pic .md-cook-box .md-cook-p {
    border-width: 5px;
    border-radius: 100%;
  }
   .md-intro {
    margin: calc(0.035rem * var(--base-font-size)) 0 -0.025rem;
    font-size: calc(0.026rem * var(--base-font-size));
    line-height: calc(0.039rem * var(--base-font-size));
  }
   .md-intro em {
    font-size: 0.039rem;
  }
   .md-subtit {
        margin: 30px auto;
        width: calc(0.84rem * var(--base-font-size));
        height: auto;
        font-size: 24px;
        padding: 10px;
        border-radius: 20px;
        color: #fff;
        line-height: 1;
        background: #ff9900;
        background-image: url(../../img/common/bar_md.svg);
  }
   .md-zairyo-box {
    margin: 0 auto;
    width: calc(0.84rem * var(--base-font-size));
  }
   .md-zairyo-box li p {
    padding: 0.005rem 0 0.004rem 0.02rem;
  }
   .md-zairyo-box li p:nth-child(1) {
    width: calc(0.47rem * var(--base-font-size));
  }
   .md-zairyo-box li p:nth-child(2) {
				width: calc(0.37rem * var(--base-font-size));
				
  }
   .md-zairyo-box li.md-zairyo-list .md-zairyo-list-inner dt {
    padding: 0.005rem 0 0.004rem 0.02rem;
  }
   .md-zairyo-box li.md-zairyo-list .md-zairyo-list-inner dd p:nth-child(1) {
    padding-left: calc(0.04rem * var(--base-font-size));
  }
   .md-howto-box {
    margin: 0 auto;
						width: calc(0.82rem * var(--base-font-size));
  }
   a {
    transition: opacity 0.3s ease-out;
  }
   a:hover {
    opacity: 0.5;
  }
   .c {
    font-size: calc(0.015rem * var(--base-font-size));
  }
   .c::before {

						width: calc(0.018rem * var(--base-font-size));
						height: calc(0.018rem * var(--base-font-size));
    border-radius: calc(0.009rem * var(--base-font-size));
  }
   .md-info-box {
    margin: calc(0.06rem * var(--base-font-size)) auto 0;
    display: flex;
    align-content: center;
    flex-wrap: wrap;
    width: calc(0.84rem * var(--base-font-size));
    height: calc(0.11rem * var(--base-font-size));
    border-width: 2px;
    border-radius: calc(0.02rem * var(--base-font-size));
    line-height: calc(0.036rem * var(--base-font-size));
  }
   .md-info-box p {
    width: 100%;
  }
   .md-info-box p em {
		font-size: calc(0.03rem * var(--base-font-size));
		margin-right:6px;
  }
   .md-point-box {
    margin: calc(0.03rem * var(--base-font-size)) auto 0;
    padding-top: calc(0.03rem * var(--base-font-size));
    width: calc(0.84rem * var(--base-font-size));
  }
   .md-point-box .md-box {
    margin-bottom: calc(0.05rem * var(--base-font-size));
  }
   .md-point-box .md-box .md-box-pic {
    margin-right: calc(0.03rem * var(--base-font-size));
    width: calc(0.18rem * var(--base-font-size));
  }
   .md-point-box .md-box .md-text-box {
    margin-top: calc(-0.01rem * var(--base-font-size));
    width: calc(0.63rem * var(--base-font-size));
  }
   .md-point-box .md-box:last-child {
    margin-bottom: 0;
  }
   .md-recommend-box {
    margin-top: calc(0.06rem * var(--base-font-size));
    padding: 16px;
    width: calc(0.84rem * var(--base-font-size));
    border-width: 1px;
		border-radius: calc(0.02rem * var(--base-font-size));
		margin-bottom:32px;
  }
   .md-recommend-box .md-recommend-tit {
    margin-bottom: calc(-0.006rem * var(--base-font-size));
    font-size: calc(0.026rem * var(--base-font-size));
  }
   .md-recommend-box .md-recommend-subtit {
    margin-top: calc(0.05rem * var(--base-font-size));
    font-size: calc(0.022rem * var(--base-font-size));
  }
}
@media only screen and (max-width: 768px) {
.recipes-list-box{
    display: grid;
    gap: 12px;
    grid-template-columns: 1fr 1fr;
    margin: 20px 0;
}
}


.recipe_top_info{
    padding: 0;
    background: url();
    margin-bottom: 60px;
    text-align: center;
}

.recipe_top_info .en {
	    line-height: 1;
font-family: "Poiret One", sans-serif;
    letter-spacing: auto;
    font-size: 60px;
    color: #fff;
    display: block;
    text-align: center;
}
.recipe_top_info .text {
	padding-top:30px;
}
.no-scroll {
  overflow: hidden;
  height: 100%;
}
.modal.modal-recipes {
    position: fixed;
    overflow-y: scroll;
}


@media screen and (max-width: 768px) {
  :root {
    --base-font-size: 88;
  }
  .modal .md-close-btn {
    width: 0.05rem;
    height: 0.05rem;
  }
  .modal .md-close-btn::before, .modal .md-close-btn::after {
    width: 0.025rem;
    height: 0.001rem;
  }
  .modal.modal-yt .md-close-btn {
    right: 0;
  }
  .modal.modal-recipes {
    padding-top: 0.02rem;
  }
  .modal.modal-recipes .md-close-btn {
    left: 0;
  }
  {
    padding: 0.057rem 0;
    width: 0.355rem;
  }
   .md-tit {
    margin-bottom: 0.011rem;
    font-size: 0.028rem;
  }
   .md-tit.md-tit-cook {
    margin-top: -0.022rem;
  }
   .md-tit.md-tit-cook em {
    font-size: 0.016rem;
  }
   .md-tit.md-tit-cook em span {
    font-size: 0.012rem;
  }
   .md-copy {
    font-size: 0.016rem;
  }
   .md-pic {
    margin: 0.022rem auto 0;
    width: 0.3rem;
  }
   .md-pic .md-cook-box {
    bottom: -0.023rem;
    right: -0.021rem;
    width: 0.106rem;
  }
   .md-pic .md-cook-box .md-cook {
    top: -0.011rem;
  }
   .md-pic .md-cook-box .md-cook.md-cook-fujii {
    left: 0.0035rem;
    width: 0.097rem;
  }
   .md-pic .md-cook-box .md-cook.md-cook-hasegawa {
    left: -0.004rem;
    width: 0.11rem;
  }
   .md-pic .md-cook-box .md-cook-p {
    border-width: 0.003rem;
    border-radius: 0.05rem;
  }
   .md-intro {
    margin: 0.027rem 0 0.03rem;
    font-size: 0.016rem;
    line-height: 0.024rem;
  }
   .md-intro em {
    font-size: 0.024rem;
  }
   .md-subtit {
    margin: 0.03rem auto 0.02rem;
    width: 0.3rem;
    height: 0.03rem;
    font-size: 0.016rem;
    line-height: 0.03rem;
    background-image: url(../imgs/top/modal/bar_md_sp.svg);
  }
   .md-subtit.md-subtit-s {
    letter-spacing: -0.05em;
  }
   .md-zairyo-box {
    margin: 0 auto;
    width: calc(0.3rem * var(--base-font-size));
  }
   .md-zairyo-box li p {
    padding: 0.004rem 0 0.003rem 0.005rem;
    font-size: 0.014rem;
    line-height: 0.02rem;
  }
   .md-zairyo-box li p:nth-child(1) {
    width: 0.165rem;
  }
   .md-zairyo-box li p:nth-child(2) {
    width: 0.135rem;
  }
   .md-zairyo-box li.md-zairyo-list .md-zairyo-list-inner dt {
    padding: 0.004rem 0 0.003rem 0.005rem;
    font-size: 0.014rem;
  }
   .md-zairyo-box li.md-zairyo-list .md-zairyo-list-inner dd p:nth-child(1) {
    padding-left: 0.019rem;
  }
   .md-zairyo-box.md-zairyo-box-2 li p:nth-child(1) {
    width: 0.2rem;
  }
   .md-zairyo-box.md-zairyo-box-2 li p:nth-child(2) {
    width: 0.1rem;
  }
   .md-howto-box {
    margin: 0 auto;
    width: 0.3rem;
    font-size: 0.014rem;
  }
   .c {
    font-size: calc(0.011rem * var(--base-font-size));
  }
   .c::before {
    width: 0.012rem;
    height: 0.012rem;
    border-radius: 0.006rem;
  }
   .md-info-box {
    margin: calc(0.023rem * var(--base-font-size));
    padding: calc(0.013rem * var(--base-font-size));
    width: calc(0.315rem * var(--base-font-size));
    border-width: calc(0.002rem * var(--base-font-size));
    border-radius: calc(0.015rem * var(--base-font-size));
    line-height: calc(0.028rem * var(--base-font-size));
  }
   .md-info-box p {
    font-size: calc(0.014rem * var(--base-font-size));
  }
   .md-info-box p em {
    font-size: calc(0.021rem * var(--base-font-size));
  }
   .md-point-box {
    margin: 0.03rem auto 0;
    padding-top: 0.03rem;
    width: calc(0.315rem * var(--base-font-size));
    font-size: calc(0.014rem * var(--base-font-size));
  }
   .md-point-box .md-box {
    margin-bottom: calc(0.023rem * var(--base-font-size));
  }
   .md-point-box .md-box .md-box-pic {
    margin-right: 0.02rem;
    width: calc(0.11rem * var(--base-font-size));
  }
   .md-point-box .md-box .md-text-box {
    margin-top: -0.007rem;
    width: 0.185rem;
  }
   .md-point-box .md-box:last-child {
    margin-bottom: 0;
  }
   .md-recommend-box {
    margin-top: 0.023rem;
    padding: 0.024rem 0.017rem 44px;
    width: 0.335rem;
    border-width: 0.0028rem;
    border-radius: 0.014rem;
    font-size: 0.014rem;
  }
   .md-recommend-box .md-recommend-tit {
    margin-bottom: -0.01rem;
    font-size: 0.016rem;
  }
   .md-recommend-box .md-recommend-subtit {
    margin-top: 0.028rem;
    font-size: 0.015rem;
  }
}


@media screen and (max-width: 768px) {
  .modal .md-close-btn {
    width: calc(50 / 375 * 100vw);
    height: calc(50 / 375 * 100vw);
  }
  .modal .md-close-btn::before, .modal .md-close-btn::after {
    width: calc(25 / 375 * 100vw);
    height: calc(1 / 375 * 100vw);
  }
  .modal.modal-yt .md-close-btn {
    right: 0;
  }
  .modal.modal-recipes {
    padding: calc(20 / 375 * 100vw) 0;
  }
  .modal.modal-recipes .md-close-btn {
    left: 0;
  }
  {
    padding: calc(57 / 375 * 100vw) 0;
    width: calc(355 / 375 * 100vw);
  }
   .md-tit {
    margin-bottom: calc(11 / 375 * 100vw);
    font-size: calc(20 / 375 * 100vw);
  }
   .md-tit.md-tit-cook {
    margin-top: calc(-22 / 375 * 100vw);
  }
   .md-tit.md-tit-cook em {
    font-size: calc(16 / 375 * 100vw);
  }
   .md-tit.md-tit-cook em span {
    font-size: calc(12 / 375 * 100vw);
  }
   .c i {
    top: -1px;
    font-style: normal;
  }
   .md-copy {
    font-size: calc(14 / 375 * 100vw);
  }
   .md-pic {
    margin: calc(22 / 375 * 100vw) auto 0;
    width: calc(300 / 375 * 100vw);
  }
   .md-pic .md-cook-box {
    bottom: calc(-23 / 375 * 100vw);
    right: calc(-21 / 375 * 100vw);
    width: calc(106 / 375 * 100vw);
  }
   .md-pic .md-cook-box .md-cook {
    top: calc(-11 / 375 * 100vw);
  }
   .md-pic .md-cook-box .md-cook.md-cook-fujii {
    left: calc(3 / 375 * 100vw);
    width: calc(97 / 375 * 100vw);
  }
   .md-pic .md-cook-box .md-cook.md-cook-hasegawa {
    left: calc(-4 / 375 * 100vw);
    width: calc(110 / 375 * 100vw);
  }
   .md-pic .md-cook-box .md-cook-p {
    border-width: calc(3 / 375 * 100vw);
    border-radius: calc(50 / 375 * 100vw);
  }
   .md-intro {
    margin: calc(27 / 375 * 100vw) 0 calc(30 / 375 * 100vw);
    font-size: calc(16 / 375 * 100vw);
    line-height: calc(24 / 375 * 100vw);
  }
   .md-intro em {
    font-size: calc(24 / 375 * 100vw);
  }
   .md-subtit {
    margin: calc(30 / 375 * 100vw) auto calc(20 / 375 * 100vw);
    width: calc(300 / 375 * 100vw);
    height: calc(30 / 375 * 100vw);
    font-size: calc(16 / 375 * 100vw);
    line-height: calc(30 / 375 * 100vw);
    background-image: url(../../img/modal/bar_md_sp.svg);
  }
   .md-subtit.md-subtit-s {
    letter-spacing: -0.05em;
  }
   .md-zairyo-box {
    margin: 0 auto;
    width: calc(300 / 375 * 100vw);
  }
   .md-zairyo-box li p {
    padding: calc(4 / 375 * 100vw) 0 calc(3 / 375 * 100vw) calc(5 / 375 * 100vw);
    font-size: calc(12 / 375 * 100vw);
    line-height: calc(20 / 375 * 100vw);
  }
   .md-zairyo-box li p:nth-child(1) {
    width: calc(165 / 375 * 100vw);
  }
   .md-zairyo-box li p:nth-child(2) {
    width: calc(135 / 375 * 100vw);
  }
   .md-zairyo-box li.md-zairyo-list .md-zairyo-list-inner dt {
    padding: calc(4 / 375 * 100vw) 0 calc(3 / 375 * 100vw) calc(5 / 375 * 100vw);
    font-size: calc(14 / 375 * 100vw);
  }
   .md-zairyo-box li.md-zairyo-list .md-zairyo-list-inner dd p:nth-child(1) {
    padding-left: calc(19 / 375 * 100vw);
  }
   .md-zairyo-box.md-zairyo-box-2 li p:nth-child(1) {
    width: calc(200 / 375 * 100vw);
  }
   .md-zairyo-box.md-zairyo-box-2 li p:nth-child(2) {
    width: calc(100 / 375 * 100vw);
  }
   .md-howto-box {
    margin: 0 auto;
    width: calc(300 / 375 * 100vw);
    font-size: calc(14 / 375 * 100vw);
  }
   .c {
    font-size: calc(11 / 375 * 100vw);
  }
   .c::before {
    width: calc(12 / 375 * 100vw);
    height: calc(12 / 375 * 100vw);
    border-radius: calc(6 / 375 * 100vw);
  }
   .md-info-box {
    margin: calc(23 / 375 * 100vw) auto 0;
    padding: calc(13 / 375 * 100vw) 0;
    width: calc(315 / 375 * 100vw);
    border-width: calc(2 / 375 * 100vw);
    border-radius: calc(15 / 375 * 100vw);
    line-height: calc(28 / 375 * 100vw);
  }
   .md-info-box p {
    font-size: calc(14 / 375 * 100vw);
  }
   .md-info-box p em {
		font-size: calc(21 / 375 * 100vw);
		margin-right:4px;
  }
   .md-point-box {
    margin: calc(30 / 375 * 100vw) auto 0;
    padding-top: calc(30 / 375 * 100vw);
    width: calc(315 / 375 * 100vw);
    font-size: calc(14 / 375 * 100vw);
  }
   .md-point-box .md-box {
    margin-bottom: calc(23 / 375 * 100vw);
  }
   .md-point-box .md-box .md-box-pic {
    margin-right: calc(20 / 375 * 100vw);
    width: calc(110 / 375 * 100vw);
  }
   .md-point-box .md-box .md-text-box {
    margin-top: calc(-7 / 375 * 100vw);
    width: calc(185 / 375 * 100vw);
  }
   .md-point-box .md-box:last-child {
    margin-bottom: 0;
  }
   .md-recommend-box {
    margin-top: calc(23 / 375 * 100vw);
    padding: calc(24 / 375 * 100vw) calc(17 / 375 * 100vw) calc(44 / 375 * 100vw);
    width: calc(335 / 375 * 100vw);
    border-width: calc(3 / 375 * 100vw);
    border-radius: calc(14 / 375 * 100vw);
		font-size: calc(14 / 375 * 100vw);
				margin-bottom:32px;
  }
   .md-recommend-box .md-recommend-tit {
    margin-bottom: calc(-10 / 375 * 100vw);
    font-size: calc(16 / 375 * 100vw);
  }
   .md-recommend-box .md-recommend-subtit {
    margin-top: calc(28 / 375 * 100vw);
    font-size: calc(15 / 375 * 100vw);
  }

  .recipes-list-box li .btn-recipe {
    width: calc(48 / 375 * 100vw);
    height: calc(48 / 375 * 100vw);
    border-radius: 50%;
  }

  .recipes-content .recipes-box .recipes-box-inner .recipes-list-box li .btn-recipe::before {
    width: calc(2 / 375 * 100vw);
    height: calc(16 / 375 * 100vw);
  }

  .recipes-content .recipes-box .recipes-box-inner .recipes-list-box li .btn-recipe::after {
    width: calc(16 / 375 * 100vw);
    height: calc(2 / 375 * 100vw);
	}
	
	.m-progress-button-wrap__group{
        margin: 0 auto 32px auto;
        max-width: 80%;
	}
	
	
}



/* クリックを透過させる */
.recipes-list-box li::after {
  pointer-events: none;
  z-index: 0; /* ついでに背面へ */
}

/* 飾りならこれも透過させる（必要なら） */
.recipes-list-box li .btn-recipe,
.recipes-list-box li .btn-recipe::before,
.recipes-list-box li .btn-recipe::after {
  pointer-events: none;
}

/* カード全体をリンクにして前面へ（aで全体を囲う想定） */
.recipes-list-box li a {
  display: block;
  position: relative;
  z-index: 2;
}