@charset "UTF-8";
/* ================================================ vw vh */
/* hover
=================================================================== */
/* common
=================================================================== */
/* layout
=================================================================== */
/* imgCover
=================================================================== */
/* background
=================================================================== */
/* flex
=================================================================== */
/* animation delay
=================================================================== */
/* 3d
=================================================================== */
/* font
=================================================================== */
/* vw
=================================================================== */
/* form
=================================================================== */
/* ================================================================================================================ 1023px */
@media only screen and (max-width: 1023px) {
  /* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー main */
  .atMain .atMain__title {
    font-size: 30px; }

  .atMain__people {
    font-size: 14px; }

  /* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー list */
  .articlesList .block {
    width: calc((100% - 90px) / 3); }
    .articlesList .block:nth-child(4n) {
      margin-right: 45px; }
    .articlesList .block:nth-child(3n) {
      margin-right: 0; }

  /* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー sectionBlock footer */
  .activitiesDetail .adArticle .sectionBlock__footer .sectionBlock__footer--credit {
    width: 100%; }

  /* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー detail Recipes */
  .adRecipes .adRecipes__section {
    flex-wrap: wrap; }
    .adRecipes .adRecipes__section .adRecipes__section--material, .adRecipes .adRecipes__section .adRecipes__section--step {
      width: 100%; }
    .adRecipes .adRecipes__section .adRecipes__section--material {
      margin-bottom: 45px; } }
/* ================================================================================================================ 1023px */
@media only screen and (max-width: 767px) {
  /* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー main */
  .atMain__people {
    font-size: 11px;
    line-height: 1;
    margin-bottom: 20px; }

  .atMain__date {
    font-size: 10px; }
    .atMain__date .link__underLine {
      transform: scale(0.9);
      margin-left: 10px; }

  .atMain {
    /* ーーーーーーーーーーーーーーーーーーーーーーーーーーーー arrow */
    /* ーーーーーーーーーーーーーーーーーーーーーーーーーーーー current */ }
    .atMain .atMain__detail {
      width: 100%;
      bottom: 65px;
      padding-left: 33px;
      padding-right: 33px; }
    .atMain .atMain__title {
      width: 85%;
      font-size: 20px;
      margin-bottom: 15px; }
      .atMain .atMain__title br {
        display: none; }
    .atMain .atMain__arrow {
      bottom: 25px;
      padding-left: 33px;
      padding-right: 33px; }
      .atMain .atMain__arrow > li {
        width: 38px; }
        .atMain .atMain__arrow > li.atMain__arrow--prev {
          margin-right: 15px; }
    .atMain .mainCurrent {
      height: calc(100% - 100px); }

  .activities__inner {
    margin-bottom: 70px; }

  /* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー recipes */
  .recipes__block--info {
    margin-top: 15px; }
    .recipes__block--info .recipes__title {
      font-size: 13px;
      text-align: left;
      margin-bottom: 8px; }
    .recipes__block--info .activities__date {
      font-size: 10px;
      margin-bottom: 6px; }
    .recipes__block--info .recipes__relatedProducts {
      margin-top: 20px; }
      .recipes__block--info .recipes__relatedProducts > a dl {
        width: calc(100% - 60px); }
        .recipes__block--info .recipes__relatedProducts > a dl > dt {
          font-size: 12px;
          margin-bottom: 3px; }
        .recipes__block--info .recipes__relatedProducts > a dl > dd {
          transform: scale(0.9);
          transform-origin: left center; }

  /* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー articlesList */
  .articlesList .block {
    width: calc(50% - 14px);
    margin-right: 28px !important;
    margin-bottom: 40px; }
    .articlesList .block:nth-child(2n) {
      margin-right: 0 !important; }

  .articlesList__btn {
    justify-content: flex-start;
    margin-top: 13px; }
    .articlesList__btn > li {
      width: calc(50% - 12px);
      min-width: inherit;
      margin: 0 6px 11px; }
      .articlesList__btn > li > a {
        width: 100%; }

  /* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ activities detail */
  .activitiesDetail {
    /* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー kv */
    /* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー adArticle */
    /* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー adRecommend */ }
    .activitiesDetail .atMain__date {
      margin-bottom: 25px; }
    .activitiesDetail .adArticle .sectionBlock__contents {
      margin-bottom: 50px; }
    .activitiesDetail .adArticle .sectionBlock__h3 {
      font-size: 17px; }
    .activitiesDetail .adRecommend {
      margin-bottom: 20px; }
      .activitiesDetail .adRecommend .grid--s {
        padding-left: 28px;
        padding-right: 28px; }

  .activitiesDetail .adArticle .sectionBlock__footer .sectionBlock__footer--credit, .activitiesDetail .adArticle .sectionBlock__footer .sectionBlock__share {
    padding-top: 25px; }

  .activitiesDetail .adArticle .sectionBlock__footer .sectionBlock__footer--credit > h4 {
    font-size: 13px; }
  .activitiesDetail .adArticle .sectionBlock__footer .sectionBlock__footer--credit > p {
    font-size: 11px; }

  /* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ adRecipes */
  .adRecipes {
    /* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー section */
    /* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー cookpad */
    /* ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー credit */ }
    .adRecipes .adRecipes__section {
      margin-bottom: 65px; }
      .adRecipes .adRecipes__section .adRecipes__section--title {
        font-size: 13px;
        padding-bottom: 10px;
        margin-bottom: 15px; }
      .adRecipes .adRecipes__section .material__list > li, .adRecipes .adRecipes__section .step__list > li {
        font-size: 12px; }
      .adRecipes .adRecipes__section .adRecipes__section--material {
        margin-top: 10px;
        margin-bottom: 40px; }
    .adRecipes .sectionBlock__contents .adRecipes__step {
      gap: 15px;
      margin-bottom: 35px; }
      .adRecipes .sectionBlock__contents .adRecipes__step .adRecipes__step--no {
        font-size: 22px;
        margin-bottom: 10px; }
      .adRecipes .sectionBlock__contents .adRecipes__step .adRecipes__step--text {
        font-size: 14px; }
    .adRecipes .sectionBlock__contents > p.adRecipes__point {
      flex-direction: column;
      gap: 8px;
      font-size: 14px;
      padding: 15px;
      margin-bottom: 30px; }
      .adRecipes .sectionBlock__contents > p.adRecipes__point strong {
        margin-top: 0; }
    .adRecipes .sectionBlock__contents > p.adRecipes__closing {
      font-size: 15px;
      line-height: 1.9;
      padding-left: 16px;
      margin: 5px 0 50px !important; }
    .adRecipes .sectionBlock__contents .adRecipes__caution {
      margin-bottom: 60px; }
    .adRecipes .adRecipes__cookpad {
      padding-top: 25px;
      padding-bottom: 25px; }
      .adRecipes .adRecipes__cookpad .cookpad__link {
        font-size: 12px;
        line-height: 1.4;
        padding-left: 40px;
        padding-right: 20px; }
        .adRecipes .adRecipes__cookpad .cookpad__link:after {
          width: 28px;
          height: 28px; }
        .adRecipes .adRecipes__cookpad .cookpad__link .arrowBlank {
          width: 9px;
          height: 9px; }
    .adRecipes .sectionBlock__footer--credit .block {
      margin-top: 20px;
      margin-bottom: 0; }
      .adRecipes .sectionBlock__footer--credit .block .blockImg--wrapper {
        width: 95px; }
      .adRecipes .sectionBlock__footer--credit .block .blockInfo {
        width: calc(100% - 120px); }
        .adRecipes .sectionBlock__footer--credit .block .blockInfo .products__name {
          font-size: 12px; }
        .adRecipes .sectionBlock__footer--credit .block .blockInfo .link__underLine {
          margin-bottom: 14px; }
        .adRecipes .sectionBlock__footer--credit .block .blockInfo .product__desc {
          font-size: 10px; }
        .adRecipes .sectionBlock__footer--credit .block .blockInfo .btn.btnShop > a {
          font-size: 10px; }
          .adRecipes .sectionBlock__footer--credit .block .blockInfo .btn.btnShop > a > p {
            padding-left: 33px; }
            .adRecipes .sectionBlock__footer--credit .block .blockInfo .btn.btnShop > a > p .icon {
              width: 35px;
              height: 35px; } }

/* 読みもの（レシピ以外の activities 記事）・SP: 記事の箱を画面幅いっぱいにし、左右の余白は 24px だけにする
   （タイトルの背景の左右にヒーロー画像を見せず、文字の幅を 283px → 327px に広げる。PC 側の説明は activities.css の末尾・2026-10-29） */
@media only screen and (max-width: 767px) {
  .adArticle--reading > .grid.articleBgColor__inner {
    padding-left: 0;
    padding-right: 0; }
  .adArticle--reading .sectionBlock,
  .adArticle--reading .sectionBlock__title--wrapper {
    padding-left: 24px;
    padding-right: 24px; } }

/* 読みもの・SP: ヒーロー画像を画面幅いっぱいに、切らずに見せる（高さ = ヘッダー 60px + 幅 ÷ 縦横比。一番上から敷くと顔などがヘッダーに隠れるので、ヘッダーの下から敷く。縦横比は記事テンプレートが --hero-ratio で渡す）。
   common.js が .main に画面の高さを style で入れるので !important。タイトルの箱は画像に重ねず、画像の下に置く */
@media only screen and (max-width: 767px) {
  .adMain--reading {
    height: calc(60px + 100vw / (var(--hero-ratio, 3 / 2))) !important;
    min-height: 0 !important; }
  .adArticle--reading .sectionBlock__title--wrapper {
    position: relative;
    transform: none;
    padding: 34px 0 0; } }

/* 読みもの: 今回使用したアイテムは SP で 2 列（PC 側は activities.css の .adItems） */
@media only screen and (max-width: 767px) {
  .adItems {
    margin-bottom: 55px; }
  .adItems .abCards {
    gap: 30px 16px; }
  .adItems .abCard {
    width: calc((100% - 16px) / 2); } }

/* 読みもの・レシピ: 前後の記事ナビ（SP） */
@media only screen and (max-width: 767px) {
  .adjacentNav {
    margin-top: 34px;
    gap: 16px; }
  .activities .adjacentNav .adjacentNav__item {
    gap: 12px; }
  .adjacentNav__arrow {
    width: 36px; }
  .adjacentNav__title {
    font-size: 15px; } }

/* 読みもの: 本文画像の透かし（SP は WITH と同じ 72px） */
@media only screen and (max-width: 767px) {
  .adArticle--reading .sectionBlock__contents .adPhoto::after {
    right: 10px;
    bottom: 8px;
    width: 72px; } }