@charset "UTF-8";
@keyframes cta-btn-flash {
  100% {
    left: 120%;
  }
}
/* --- 薬膳雑穀LP --- */
#zakkoku {
  --font-zen-gothic: "Zen Kaku Gothic New", "Noto Sans JP", sans-serif;
  --font-zen-mincho: "Zen Old Mincho", serif;
  --font-noto: "Noto Sans JP", sans-serif;
  font-family: var(--font-zen-gothic);
  letter-spacing: 0;
}
#zakkoku * {
  box-sizing: border-box;
  letter-spacing: 0;
  line-height: 1.6;
}
#zakkoku .section {
  background: #fff;
}
#zakkoku .is-sp {
  display: none;
}
  #zakkoku .is-pc {
    display: none;
  }
  #zakkoku .is-sp {
    display: revert;
  }
/* --- FV / 悩み画像 --- */
#zakkoku .mainImg,
#zakkoku .problemImg {
  width: 100%;
  max-width: 1180px;
  margin: 0 auto;
  padding: 0;
}
#zakkoku .mainImg picture,
#zakkoku .mainImg img,
#zakkoku .problemImg picture,
#zakkoku .problemImg img {
  display: block;
  width: 100%;
  height: auto;
}
/* --- 提案エリア --- */
#zakkoku .proposalArea {
  position: relative;
  width: 100%;
  max-width: 1180px;
  height: clamp(566.9745762712px, 73.7288135593vw, 870px);
  margin: 0 auto;
  overflow: visible;
  color: #231815;
  background-color: #231815;
  background-image: var(--proposal-bg);
  background-repeat: no-repeat;
  background-position: center top;
  background-size: 100% 100%;
}
  #zakkoku .proposalArea {
    height: 512.0512820513vw;
    background-color: #fffcf7;
    background-image: var(--proposal-bg-sp), var(--proposal-texture-sp);
    background-repeat: no-repeat, repeat;
    background-position: center top, center 197.4358974359vw;
    background-size: 100% 197.4358974359vw, 100% auto;
  }
/* --- 見出し（木目バナー） --- */
#zakkoku .proposalArea__head {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 4;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  height: clamp(100.3610169492px, 13.0508474576vw, 154px);
  padding-top: clamp(10.4271186441px, 1.3559322034vw, 16px);
  margin: 0;
}
  #zakkoku .proposalArea__head {
    height: 37.4358974359vw;
    padding-top: 4.1025641026vw;
  }
#zakkoku .proposalArea__wood {
  position: absolute;
  inset: 0;
  z-index: 0;
  margin: 0;
  pointer-events: none;
}
#zakkoku .proposalArea__wood picture,
#zakkoku .proposalArea__wood img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top center;
}
#zakkoku .proposalArea__eyebrow {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  width: clamp(112.0915254237px, 14.5762711864vw, 172px);
  height: clamp(26.0677966102px, 3.3898305085vw, 40px);
  margin: 0;
  padding: clamp(2.606779661px, 0.3389830508vw, 4px) clamp(10.4271186441px, 1.3559322034vw, 16px);
  font-family: var(--font-zen-gothic);
  font-size: clamp(13.0338983051px, 1.6949152542vw, 20px);
  font-weight: 700;
  line-height: 1.6;
  color: #fffcf7;
  white-space: nowrap;
  background: #231815;
  border-radius: 32px;
}
  #zakkoku .proposalArea__eyebrow {
    width: 29.2307692308vw;
    height: 7.6923076923vw;
    padding: 1.0256410256vw 2.0512820513vw;
    font-size: 3.5897435897vw;
  }
#zakkoku .proposalArea__title {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: baseline;
  justify-content: center;
  margin: 0;
  font-family: var(--font-zen-mincho);
  font-weight: 500;
  color: #fffcf7;
  white-space: nowrap;
}
#zakkoku .proposalArea__titleBrand {
  font-size: clamp(20.8542372881px, 2.7118644068vw, 32px);
  line-height: 1.6;
}
  #zakkoku .proposalArea__titleBrand {
    font-size: 8.2051282051vw;
  }
#zakkoku .proposalArea__titleFrom {
  font-size: clamp(15.6406779661px, 2.0338983051vw, 24px);
  line-height: 1.6;
}
  #zakkoku .proposalArea__titleFrom {
    font-size: 6.1538461538vw;
  }
#zakkoku .proposalArea__titleAccent {
  font-size: clamp(26.0677966102px, 3.3898305085vw, 40px);
  line-height: 1.3;
  color: #fffb00;
}
  #zakkoku .proposalArea__titleAccent {
    font-size: 10.2564102564vw;
  }
/* --- メイン吹き出し --- */
#zakkoku .proposalArea__bubble {
  position: absolute;
  top: clamp(102.9677966102px, 13.3898305085vw, 158px);
  left: clamp(269.15px, 35vw, 413px);
  z-index: 5;
  width: clamp(217.6661016949px, 28.3050847458vw, 334px);
  margin: 0;
}
#zakkoku .proposalArea__bubble img {
  display: block;
  width: 100%;
  height: auto;
}
  #zakkoku .proposalArea__bubble {
    top: 42.0512820513vw;
    left: 6.4102564103vw;
    width: 86.9230769231vw;
  }
/* --- パッケージ --- */
#zakkoku .proposalArea__package {
  position: absolute;
  top: clamp(239.1720338983px, 31.1016949153vw, 367px);
  left: clamp(297.8245762712px, 38.7288135593vw, 457px);
  z-index: 3;
  width: clamp(174.0025423729px, 22.6271186441vw, 267px);
  margin: 0;
}
#zakkoku .proposalArea__package img {
  display: block;
  width: 100%;
  height: auto;
}
  #zakkoku .proposalArea__package {
    top: 96.4102564103vw;
    left: 23.8461538462vw;
    width: 52.3076923077vw;
  }
/* --- 7種の和漢素材 --- */
#zakkoku .proposalArea__wakan {
  position: absolute;
  top: clamp(213.1042372881px, 27.7118644068vw, 327px);
  left: clamp(73.6415254237px, 9.5762711864vw, 113px);
  z-index: 2;
  width: clamp(168.7889830508px, 21.9491525424vw, 259px);
  margin: 0;
}
#zakkoku .proposalArea__wakan picture,
#zakkoku .proposalArea__wakan img {
  display: block;
  width: 100%;
  height: auto;
}
  #zakkoku .proposalArea__wakan {
    top: 207.6923076923vw;
    left: 4.1025641026vw;
    width: 91.7948717949vw;
  }
/* --- 和漢素材って --- */
#zakkoku .proposalArea__note {
  position: absolute;
  top: clamp(429.4669491525px, 55.8474576271vw, 659px);
  left: clamp(64.5177966102px, 8.3898305085vw, 99px);
  z-index: 3;
  width: clamp(202.0254237288px, 26.2711864407vw, 310px);
  height: clamp(92.5406779661px, 12.0338983051vw, 142px);
  margin: 0;
}
  #zakkoku .proposalArea__note {
    top: 337.6923076923vw;
    left: 4.1025641026vw;
    width: 91.7948717949vw;
    height: 42.0512820513vw;
  }
#zakkoku .proposalArea__noteBg {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
}
#zakkoku .proposalArea__noteTitle {
  position: absolute;
  top: clamp(18.2474576271px, 2.3728813559vw, 28px);
  left: 50%;
  z-index: 1;
  margin: 0;
  font-family: var(--font-zen-mincho);
  font-weight: 600;
  line-height: 1;
  color: #231815;
  text-align: center;
  white-space: nowrap;
  transform: translateX(-50%);
}
  #zakkoku .proposalArea__noteTitle {
    top: 7.4358974359vw;
  }
#zakkoku .proposalArea__noteAccent {
  font-size: clamp(20.8542372881px, 2.7118644068vw, 32px);
  color: #e35731;
  border-bottom: 1px dotted #e35731;
}
  #zakkoku .proposalArea__noteAccent {
    font-size: 9.2307692308vw;
  }
#zakkoku .proposalArea__noteSuffix {
  font-size: clamp(11.7305084746px, 1.5254237288vw, 18px);
}
  #zakkoku .proposalArea__noteSuffix {
    font-size: 5.1282051282vw;
  }
#zakkoku .proposalArea__noteLead {
  position: absolute;
  top: clamp(53.4389830508px, 6.9491525424vw, 82px);
  left: 50%;
  z-index: 1;
  width: clamp(181.1711864407px, 23.5593220339vw, 278px);
  margin: 0;
  font-family: var(--font-zen-gothic);
  font-size: clamp(7.8203389831px, 1.0169491525vw, 12px);
  font-weight: 400;
  line-height: 1.8;
  color: #231815;
  text-align: left;
  transform: translateX(-50%);
}
#zakkoku .proposalArea__noteLead span {
  display: block;
  white-space: nowrap;
}
  #zakkoku .proposalArea__noteLead {
    top: 24.358974359vw;
    width: 82.5641025641vw;
    font-size: 3.5897435897vw;
  }
/* --- 大豆イソフラボン --- */
#zakkoku .proposalArea__iso {
  position: absolute;
  top: clamp(216.3627118644px, 28.1355932203vw, 332px);
  left: clamp(509.6254237288px, 66.2711864407vw, 782px);
  z-index: 2;
  width: clamp(171.3957627119px, 22.2881355932vw, 263px);
  margin: 0;
}
#zakkoku .proposalArea__iso picture,
#zakkoku .proposalArea__iso img {
  display: block;
  width: 100%;
  height: auto;
}
  #zakkoku .proposalArea__iso {
    top: 390vw;
    left: 4.1025641026vw;
    width: 91.7948717949vw;
  }
#zakkoku .ctaArea {
  width: 100%;
  max-width: 1180px;
  margin: 0 auto;
  color: #231815;
  background-color: #5c2e1f;
  background-image: var(--cta-bg);
  background-position: center top;
  background-size: cover;
  background-repeat: no-repeat;
}
  #zakkoku .ctaArea {
    background-image: var(--cta-bg-sp);
  }
#zakkoku .ctaArea__inner {
  max-width: 1180px;
  margin: 0 auto;
  padding: clamp(36.4949152542px, 4.7457627119vw, 56px) clamp(10.4271186441px, 1.3559322034vw, 16px);
}
  #zakkoku .ctaArea__inner {
    padding: 14.358974359vw 4.1025641026vw;
  }
#zakkoku .ctaArea--withBubble .ctaArea__inner,
#zakkoku .ctaArea--withSpec .ctaArea__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(10.4271186441px, 1.3559322034vw, 16px);
}
  #zakkoku .ctaArea--withBubble .ctaArea__inner,
  #zakkoku .ctaArea--withSpec .ctaArea__inner {
    gap: 6.1538461538vw;
  }
/* --- 注文吹き出し --- */
#zakkoku .ctaArea__orderBubble {
  display: flex;
  justify-content: center;
  width: 100%;
  margin: 0;
}
#zakkoku .ctaArea__orderBubble picture,
#zakkoku .ctaArea__orderBubble img {
  display: block;
  width: clamp(307.6px, 40vw, 472px);
  height: auto;
}
  #zakkoku .ctaArea__orderBubble picture,
  #zakkoku .ctaArea__orderBubble img {
    width: 88.4615384615vw;
  }
/* --- CTA見出し --- */
#zakkoku .ctaArea__heading {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: clamp(10.4271186441px, 1.3559322034vw, 16px) 0;
  color: #fff;
  text-align: center;
}
  #zakkoku .ctaArea__heading {
    margin-bottom: 6.1538461538vw;
  }
#zakkoku .ctaArea--withBubble .ctaArea__heading,
#zakkoku .ctaArea--withSpec .ctaArea__heading {
  margin-bottom: 0;
}
/* --- カートアイコン（見出し左に絶対配置） --- */
#zakkoku .ctaArea__headingInner {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
  #zakkoku .ctaArea__headingInner {
    width: 89.7435897436vw;
    max-width: 100%;
  }
#zakkoku .ctaArea__cart {
  position: absolute;
  top: clamp(-42px, -3.5593220339vw, -27.3711864407px);
  right: 100%;
  z-index: 1;
  width: clamp(50.8322033898px, 6.6101694915vw, 78px);
  height: clamp(50.8322033898px, 6.6101694915vw, 78px);
  margin: 0 clamp(5.213559322px, 0.6779661017vw, 8px) 0 0;
}
#zakkoku .ctaArea__cart picture,
#zakkoku .ctaArea__cart img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
  #zakkoku .ctaArea__cart {
    top: -6.4102564103vw;
    right: auto;
    left: 9.7435897436vw;
    width: 13.5897435897vw;
    height: 13.8461538462vw;
    margin: 0;
  }
/* --- 吹き出し付きCTAのカート位置 --- */
#zakkoku .ctaArea--withBubble .ctaArea__cart {
  top: clamp(-99px, -8.3898305085vw, -64.5177966102px);
  right: auto;
  left: clamp(-37px, -3.1355932203vw, -24.1127118644px);
  width: clamp(61.9110169492px, 8.0508474576vw, 95px);
  height: clamp(61.9110169492px, 8.0508474576vw, 95px);
  margin: 0;
}
  #zakkoku .ctaArea--withBubble .ctaArea__cart {
    top: -5.1282051282vw;
    left: 9.4871794872vw;
    width: 13.5897435897vw;
    height: 13.8461538462vw;
  }
#zakkoku .ctaArea__headingText {
  display: flex;
  flex-wrap: nowrap;
  align-items: last baseline;
  justify-content: center;
  gap: clamp(3.9101694915px, 0.5084745763vw, 6px);
  margin: 0;
}
  #zakkoku .ctaArea__headingText {
    position: relative;
    display: block;
    width: 100%;
  }
#zakkoku .ctaArea__headingCopy {
  display: block;
  margin: 0;
}
  #zakkoku .ctaArea__headingCopy {
    width: 100%;
    text-align: center;
  }
#zakkoku .ctaArea__titleDeco {
  display: block;
  flex-shrink: 0;
  width: clamp(14.3372881356px, 1.8644067797vw, 22px);
  height: auto;
  transform: translateY(clamp(3.9101694915px, 0.5084745763vw, 6px));
}
  #zakkoku .ctaArea__titleDeco {
    position: absolute;
    bottom: 0;
    width: 5.641025641vw;
    transform: none;
  }
  #zakkoku .ctaArea__titleDeco--left {
    left: 1.0256410256vw;
  }
  #zakkoku .ctaArea__titleDeco--right {
    right: 1.0256410256vw;
  }
#zakkoku .ctaArea__headingLabel,
#zakkoku .ctaArea__headingLead {
  /* Makeshop テーマの `p { width: 100% }` を打ち消し、1行表示を維持 */
  display: inline;
  width: fit-content;
  max-width: none;
  margin: 0;
  font-size: clamp(20.8542372881px, 2.7118644068vw, 32px);
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.02em;
  color: #fff;
  white-space: nowrap;
}
  #zakkoku .ctaArea__headingLabel,
  #zakkoku .ctaArea__headingLead {
    display: block;
    width: 100%;
    font-size: 6.1538461538vw;
    line-height: normal;
  }
#zakkoku .ctaArea__headingLead {
  margin-left: 0.35em;
}
  #zakkoku .ctaArea__headingLead {
    margin-left: 0;
  }
/* --- 商品カード --- */
#zakkoku .ctaArea__card {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: clamp(482.2542372881px, 62.7118644068vw, 740px);
  max-width: 100%;
  margin: 0 auto;
  gap: clamp(15.6406779661px, 2.0338983051vw, 24px);
  padding: clamp(26.0677966102px, 3.3898305085vw, 40px);
  background: #fff;
  border-radius: clamp(10.4271186441px, 1.3559322034vw, 16px);
}
  #zakkoku .ctaArea__card {
    width: 100%;
    gap: 6.1538461538vw;
    padding: 10.2564102564vw 4.1025641026vw;
    border-radius: 4.1025641026vw;
  }
#zakkoku .ctaArea__main {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(15.6406779661px, 2.0338983051vw, 24px);
  width: 100%;
}
  #zakkoku .ctaArea__main {
    flex-direction: column;
    gap: 6.1538461538vw;
  }
#zakkoku .ctaArea__product {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: clamp(10.4271186441px, 1.3559322034vw, 16px);
  width: clamp(207.2389830508px, 26.9491525424vw, 318px);
  min-width: 0;
}
  #zakkoku .ctaArea__product {
    width: 100%;
    max-width: 81.5384615385vw;
    gap: 4.1025641026vw;
  }
#zakkoku .ctaArea__media {
  flex: 0 0 auto;
  width: clamp(91.8889830508px, 11.9491525424vw, 141px);
}
#zakkoku .ctaArea__media img {
  display: block;
  width: 100%;
  height: auto;
}
  #zakkoku .ctaArea__media {
    width: 36.1538461538vw;
  }
#zakkoku .ctaArea__info {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  align-items: flex-start;
  gap: clamp(5.213559322px, 0.6779661017vw, 8px);
  min-width: 0;
  color: #231815;
  text-align: left;
}
  #zakkoku .ctaArea__info {
    gap: 2.0512820513vw;
    width: 37.4358974359vw;
  }
#zakkoku .ctaArea__nameBlock {
  width: 100%;
}
#zakkoku .ctaArea__name {
  margin: 0;
  font-family: var(--font-zen-gothic);
  font-size: clamp(23.4610169492px, 3.0508474576vw, 36px);
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: 0;
}
  #zakkoku .ctaArea__name {
    font-size: 9.2307692308vw;
  }
#zakkoku .ctaArea__blend {
  width: fit-content;
  max-width: none;
  margin: clamp(-2px, -0.1694915254vw, -1.3033898305px) 0 0;
  font-family: var(--font-zen-gothic);
  font-size: clamp(10.4271186441px, 1.3559322034vw, 16px);
  font-weight: 500;
  line-height: 1.6;
}
  #zakkoku .ctaArea__blend {
    margin-top: -0.5128205128vw;
    font-size: 4.1025641026vw;
  }
#zakkoku .ctaArea__size {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  max-width: none;
  margin: 0;
  padding: clamp(2.606779661px, 0.3389830508vw, 4px) clamp(5.213559322px, 0.6779661017vw, 8px);
  font-size: clamp(7.8203389831px, 1.0169491525vw, 12px);
  font-weight: 400;
  line-height: normal;
  color: #231815;
  white-space: nowrap;
  background: #eae1d4;
  border-radius: 40px;
}
  #zakkoku .ctaArea__size {
    padding: 1.0256410256vw 2.0512820513vw;
    font-size: 3.0769230769vw;
  }
#zakkoku .ctaArea__price {
  display: flex;
  flex-wrap: nowrap;
  align-items: last baseline;
  width: fit-content;
  max-width: none;
  margin: clamp(10.4271186441px, 1.3559322034vw, 16px) 0 0;
  line-height: 1;
  white-space: nowrap;
}
  #zakkoku .ctaArea__price {
    margin-top: 4.1025641026vw;
  }
#zakkoku .ctaArea__priceNum {
  font-family: var(--font-zen-mincho);
  font-size: clamp(32.5847457627px, 4.2372881356vw, 50px);
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0;
}
  #zakkoku .ctaArea__priceNum {
    font-size: 12.8205128205vw;
  }
#zakkoku .ctaArea__priceUnit {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  margin-left: clamp(1.3033898305px, 0.1694915254vw, 2px);
}
  #zakkoku .ctaArea__priceUnit {
    margin-left: 0.5128205128vw;
  }
#zakkoku .ctaArea__priceTax {
  margin: 0 0 clamp(1.3033898305px, 0.1694915254vw, 2px) clamp(-6px, -0.5084745763vw, -3.9101694915px);
  font-family: var(--font-zen-mincho);
  font-size: clamp(7.8203389831px, 1.0169491525vw, 12px);
  font-weight: 500;
  line-height: 1;
}
  #zakkoku .ctaArea__priceTax {
    margin: 0 0 0.5128205128vw -1.5384615385vw;
    font-size: 3.0769230769vw;
  }
#zakkoku .ctaArea__priceYen {
  font-family: var(--font-zen-mincho);
  font-size: clamp(15.6406779661px, 2.0338983051vw, 24px);
  font-weight: 500;
  line-height: 1;
}
  #zakkoku .ctaArea__priceYen {
    font-size: 6.1538461538vw;
  }
/* --- カートボタン装飾 --- */
#zakkoku .ctaArea__actions {
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: clamp(10.4271186441px, 1.3559322034vw, 16px);
  align-items: center;
  justify-content: flex-end;
  width: clamp(207.2389830508px, 26.9491525424vw, 318px);
  min-height: clamp(99.0576271186px, 12.8813559322vw, 152px);
}
  #zakkoku .ctaArea__actions {
    width: 100%;
    min-height: 38.9743589744vw;
    gap: 4.1025641026vw;
  }
#zakkoku .ctaArea__btnWrap {
  position: relative;
  display: block;
  width: 100%;
  padding-top: clamp(18.2474576271px, 2.3728813559vw, 28px);
  color: inherit;
  text-decoration: none;
  cursor: pointer;
  transition: transform 0.2s ease;
}
  #zakkoku .ctaArea__btnWrap {
    padding-top: 7.1794871795vw;
  }
#zakkoku .ctaArea__trial {
  position: absolute;
  top: 0;
  left: 50%;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: max-content;
  max-width: 100%;
  background: #fff;
  border: 1px solid #1d7875;
  border-radius: 9999px;
  transform: translateX(-50%);
  /* 右上デコ（吹き出しの外側） */
}
#zakkoku .ctaArea__trial::before {
  position: absolute;
  z-index: 3;
  pointer-events: none;
  content: "";
  background: var(--trial-deco) no-repeat center/contain;
}
  #zakkoku .ctaArea__trial::before {
    top: -1.5384615385vw;
    right: -1.5384615385vw;
    width: 2.8205128205vw;
    height: 2.8205128205vw;
  }
  #zakkoku .ctaArea__trial {
    min-height: 9.2307692308vw;
    padding: 1.0256410256vw 8.2051282051vw;
  }
#zakkoku .ctaArea__trialTip {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
#zakkoku .ctaArea__trialTip::before, #zakkoku .ctaArea__trialTip::after {
  position: absolute;
  left: 50%;
  width: 0;
  height: 0;
  border-style: solid;
  transform: translateX(-50%);
  content: "";
}
#zakkoku .ctaArea__trialTip::before {
  z-index: 0;
  border-color: #1d7875 transparent transparent;
}
#zakkoku .ctaArea__trialTip::after {
  z-index: 1;
  border-color: #fff transparent transparent;
}
  #zakkoku .ctaArea__trialTip::before {
    bottom: -2.0512820513vw;
    border-width: 2.0512820513vw 1.5384615385vw 0;
  }
  #zakkoku .ctaArea__trialTip::after {
    bottom: -1.7948717949vw;
    border-width: 2.0512820513vw 1.5384615385vw 0;
  }
#zakkoku .ctaArea__trialText {
  position: relative;
  z-index: 1;
  margin: 0;
  font-family: var(--font-noto);
  font-size: clamp(9.1237288136px, 1.186440678vw, 14px);
  font-weight: 700;
  line-height: 1.6;
  color: #231815;
  white-space: nowrap;
}
  #zakkoku .ctaArea__trialText {
    font-size: 3.5897435897vw;
  }
#zakkoku .ctaArea__btn {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  overflow: hidden;
  font-weight: 700;
  line-height: normal;
  color: #fff;
  text-decoration: none;
  border-radius: 9999px;
  transition: box-shadow 0.2s ease, transform 0.2s ease;
}
#zakkoku .ctaArea__btn::before {
  position: absolute;
  top: 0;
  left: -60%;
  z-index: 0;
  width: 50%;
  height: 100%;
  pointer-events: none;
  content: "";
  background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%);
  transform: skewX(-25deg);
}
#zakkoku .ctaArea__btn > * {
  position: relative;
  z-index: 1;
}
#zakkoku .ctaArea__btn--set {
  gap: clamp(5.213559322px, 0.6779661017vw, 8px);
  width: clamp(207.2389830508px, 26.9491525424vw, 318px);
  height: clamp(45.6186440678px, 5.9322033898vw, 70px);
  padding: 0 clamp(10.4271186441px, 1.3559322034vw, 16px);
  background: linear-gradient(180deg, #2dada9 0%, #3583a7 100%);
  box-shadow: 0 clamp(2.606779661px, 0.3389830508vw, 4px) 0 #1f6f8e;
}
  #zakkoku .ctaArea__btn--set {
    gap: 2.0512820513vw;
    width: 100%;
    max-width: 81.5384615385vw;
    height: 17.9487179487vw;
    margin-inline: auto;
    padding: 0 4.1025641026vw;
    box-shadow: 0 1.0256410256vw 0 #1f6f8e;
  }
#zakkoku .ctaArea__btn--single {
  width: clamp(162.9237288136px, 21.186440678vw, 250px);
  height: clamp(32.5847457627px, 4.2372881356vw, 50px);
  padding: 0 clamp(26.0677966102px, 3.3898305085vw, 40px);
  font-size: clamp(10.4271186441px, 1.3559322034vw, 16px);
  background: linear-gradient(180deg, #e89003 0%, #e86100 100%);
  box-shadow: 0 clamp(2.606779661px, 0.3389830508vw, 4px) 0 #c85905;
}
  #zakkoku .ctaArea__btn--single {
    width: 64.1025641026vw;
    height: 12.8205128205vw;
    padding: 0 10.2564102564vw;
    font-size: 4.1025641026vw;
    box-shadow: 0 1.0256410256vw 0 #c85905;
  }
#zakkoku .ctaArea__ship {
  display: grid;
  flex: 0 0 clamp(28.6745762712px, 3.7288135593vw, 44px);
  place-items: center;
  width: clamp(28.6745762712px, 3.7288135593vw, 44px);
  height: clamp(28.6745762712px, 3.7288135593vw, 44px);
  font-size: clamp(8.4720338983px, 1.1016949153vw, 13px);
  font-weight: 900;
  line-height: 1.29;
  color: #338ca7;
  text-align: center;
  background: #fff7b2;
  border-radius: 32px;
}
  #zakkoku .ctaArea__ship {
    flex-basis: 11.2820512821vw;
    width: 11.2820512821vw;
    height: 11.2820512821vw;
    font-size: 3.3333333333vw;
  }
#zakkoku .ctaArea__btnText {
  flex: 0 1 auto;
  font-size: clamp(10.4271186441px, 1.3559322034vw, 16px);
  font-weight: 700;
  color: #fff;
  text-align: center;
  letter-spacing: 0;
  white-space: nowrap;
}
  #zakkoku .ctaArea__btnText {
    font-size: 4.1025641026vw;
  }
#zakkoku .ctaArea__btnTextMain {
  font-size: clamp(15.6406779661px, 2.0338983051vw, 24px);
}
  #zakkoku .ctaArea__btnTextMain {
    font-size: 6.1538461538vw;
  }
#zakkoku .ctaArea__btnTextSub {
  font-size: clamp(10.4271186441px, 1.3559322034vw, 16px);
}
  #zakkoku .ctaArea__btnTextSub {
    font-size: 4.1025641026vw;
  }
#zakkoku .ctaArea__arrow {
  display: grid;
  flex: 0 0 clamp(15.6406779661px, 2.0338983051vw, 24px);
  place-items: center;
  width: clamp(15.6406779661px, 2.0338983051vw, 24px);
  height: clamp(15.6406779661px, 2.0338983051vw, 24px);
  border: 1px solid #fff;
  border-radius: 40px;
}
#zakkoku .ctaArea__arrow::before {
  width: 0;
  height: 0;
  content: "";
  border-style: solid;
  border-width: 0.28em 0 0.28em 0.4em;
  border-color: transparent transparent transparent #fff;
  transform: translateX(12%);
}
  #zakkoku .ctaArea__arrow {
    flex-basis: 6.1538461538vw;
    width: 6.1538461538vw;
    height: 6.1538461538vw;
  }
#zakkoku .ctaArea__btn--single .ctaArea__arrow {
  position: absolute;
  top: 50%;
  right: clamp(10.4271186441px, 1.3559322034vw, 16px);
  transform: translateY(-50%);
}
  #zakkoku .ctaArea__btn--single .ctaArea__arrow {
    right: 4.1025641026vw;
  }
/* --- 成分・規格表 --- */
#zakkoku .ctaArea__spec {
  width: 100%;
  margin: 0;
  border-collapse: collapse;
  table-layout: fixed;
  color: #231815;
}
#zakkoku .ctaArea__spec th,
#zakkoku .ctaArea__spec td {
  padding: clamp(10.4271186441px, 1.3559322034vw, 16px) clamp(5.213559322px, 0.6779661017vw, 8px);
  font-family: var(--font-zen-gothic);
  font-size: clamp(9.1237288136px, 1.186440678vw, 14px);
  line-height: 1.6;
  text-align: left;
  vertical-align: middle;
  border: 1px solid #999;
}
  #zakkoku .ctaArea__spec th,
  #zakkoku .ctaArea__spec td {
    padding: 4.1025641026vw 2.0512820513vw;
    font-size: 4.1025641026vw;
  }
#zakkoku .ctaArea__spec th {
  width: clamp(83.4169491525px, 10.8474576271vw, 128px);
  font-weight: 700;
  background: #eee;
}
  #zakkoku .ctaArea__spec th {
    width: 32.8205128205vw;
  }
#zakkoku .ctaArea__spec td {
  font-weight: 400;
  word-break: break-word;
  background: #fff;
}
#zakkoku .ctaArea__specNote {
  font-size: clamp(7.8203389831px, 1.0169491525vw, 12px);
  font-weight: 400;
  line-height: 1.6;
}
  #zakkoku .ctaArea__specNote {
    font-size: 3.0769230769vw;
  }
#zakkoku .aboutArea {
  width: 100%;
  max-width: 1180px;
  margin: 0 auto;
  overflow: visible;
  color: #231815;
  background-color: #f7f4ef;
  background-image: var(--texture-bg);
  background-position: left top;
  background-size: clamp(418.3881355932px, 54.406779661vw, 642px) clamp(628.8855932203px, 81.7796610169vw, 965px);
  background-repeat: repeat;
}
  #zakkoku .aboutArea {
    overflow: hidden;
    background-image: var(--texture-bg-sp);
    background-size: 100vw 225.641025641vw;
  }
#zakkoku .aboutArea__inner {
  display: flex;
  flex-direction: column;
  gap: clamp(26.0677966102px, 3.3898305085vw, 40px);
  align-items: center;
  max-width: clamp(560.4576271186px, 72.8813559322vw, 860px);
  margin: 0 auto;
  padding: clamp(41.7084745763px, 5.4237288136vw, 64px) 0;
  overflow: visible;
}
  #zakkoku .aboutArea__inner {
    gap: 0;
    max-width: none;
    padding: 14.358974359vw 4.1025641026vw;
  }
/* --- ABOUT見出し --- */
#zakkoku .aboutArea__head {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: 0;
  text-align: center;
}
  #zakkoku .aboutArea__head {
    margin-bottom: 6.1538461538vw;
  }
#zakkoku .aboutArea__eyebrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  max-width: 100%;
  margin: 0 0 clamp(14.3372881356px, 1.8644067797vw, 22px);
  padding: clamp(5.213559322px, 0.6779661017vw, 8px) clamp(10.4271186441px, 1.3559322034vw, 16px);
  background: #fff;
  border: 1px solid #6a4940;
  border-radius: clamp(5.213559322px, 0.6779661017vw, 8px);
}
#zakkoku .aboutArea__eyebrow picture,
#zakkoku .aboutArea__eyebrow img {
  display: block;
  width: clamp(213.7559322034px, 27.7966101695vw, 328px);
  height: auto;
}
  #zakkoku .aboutArea__eyebrow {
    height: 11.2820512821vw;
    margin: 0 auto 4.1025641026vw;
    padding: 0.7692307692vw 2.0512820513vw;
  }
  #zakkoku .aboutArea__eyebrow picture,
  #zakkoku .aboutArea__eyebrow img {
    width: 63.0769230769vw;
  }
#zakkoku .aboutArea__title {
  position: relative;
  display: flex;
  flex-wrap: nowrap;
  align-items: baseline;
  justify-content: center;
  margin: 0;
  font-family: var(--font-zen-mincho);
  font-weight: 500;
  line-height: 1.3;
  text-align: center;
  white-space: nowrap;
}
  #zakkoku .aboutArea__title {
    flex-direction: column;
    flex-wrap: wrap;
    align-items: center;
    width: 100%;
    max-width: 91.7948717949vw;
    white-space: normal;
  }
#zakkoku .aboutArea__titleLine {
  display: inline-flex;
  flex-wrap: nowrap;
  align-items: baseline;
  justify-content: center;
}
#zakkoku .aboutArea__titleAccent {
  color: #e35731;
}
#zakkoku .aboutArea__titleLg {
  font-size: clamp(39.1016949153px, 5.0847457627vw, 60px);
}
  #zakkoku .aboutArea__titleLg {
    font-size: 12.8205128205vw;
  }
#zakkoku .aboutArea__titleSm {
  font-size: clamp(27.3711864407px, 3.5593220339vw, 42px);
}
  #zakkoku .aboutArea__titleSm {
    font-size: 10.7692307692vw;
  }
#zakkoku .aboutArea__titleDe {
  font-size: clamp(20.8542372881px, 2.7118644068vw, 32px);
  color: #231815;
}
  #zakkoku .aboutArea__titleDe {
    font-size: 8.2051282051vw;
  }
#zakkoku .aboutArea__titleSupport {
  position: relative;
  display: inline-block;
  padding-bottom: clamp(5.213559322px, 0.6779661017vw, 8px);
  font-size: clamp(32.5847457627px, 4.2372881356vw, 50px);
  color: #231815;
  isolation: isolate;
}
  #zakkoku .aboutArea__titleSupport {
    padding-bottom: 3.5897435897vw;
    font-size: 10.2564102564vw;
  }
#zakkoku .aboutArea__titleDeco {
  position: absolute;
  z-index: -1;
  display: block;
  pointer-events: none;
  bottom: clamp(-10px, -0.8474576271vw, -6.5169491525px);
  left: 50%;
  width: clamp(196.1601694915px, 25.5084745763vw, 301px);
  transform: translateX(calc(-50% + clamp(7.8203389831px, 1.0169491525vw, 12px)));
}
#zakkoku .aboutArea__titleDeco img {
  display: block;
  width: 100%;
  height: auto;
}
  #zakkoku .aboutArea__titleDeco {
    bottom: 0vw;
    width: 65.8974358974vw;
    transform: translateX(-50%);
  }
/* --- そもそも + 定義 + 恵み --- */
#zakkoku .aboutArea__body {
  display: flex;
  flex-direction: column;
  gap: clamp(36.4949152542px, 4.7457627119vw, 56px);
  align-items: center;
  width: 100%;
  margin: 0;
  overflow: visible;
}
  #zakkoku .aboutArea__body {
    gap: 14.358974359vw;
    margin-bottom: 10.2564102564vw;
  }
#zakkoku .aboutArea__intro {
  display: flex;
  flex-direction: column;
  gap: clamp(36.4949152542px, 4.7457627119vw, 56px);
  align-items: center;
  width: 100%;
  overflow: visible;
}
  #zakkoku .aboutArea__intro {
    gap: 10.2564102564vw;
  }
#zakkoku .aboutArea__lead {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: clamp(233.306779661px, 30.3389830508vw, 358px);
  margin: 0;
  font-family: var(--font-zen-mincho);
  font-size: clamp(10.4271186441px, 1.3559322034vw, 16px);
  font-weight: 600;
  line-height: 1.6;
  color: #231815;
}
#zakkoku .aboutArea__lead::before, #zakkoku .aboutArea__lead::after {
  flex: 1 1 auto;
  height: 1px;
  content: "";
  background-image: linear-gradient(to right, #6a4940 0 2px, transparent 2px 4px);
  background-repeat: repeat-x;
  background-position: left center;
  background-size: 4px 1px;
}
#zakkoku .aboutArea__lead::before {
  margin-right: clamp(9.1237288136px, 1.186440678vw, 14px);
}
#zakkoku .aboutArea__lead::after {
  margin-left: clamp(9.1237288136px, 1.186440678vw, 14px);
}
#zakkoku .aboutArea__lead span {
  flex: 0 0 auto;
}
  #zakkoku .aboutArea__lead {
    max-width: 91.7948717949vw;
    font-size: 4.1025641026vw;
  }
  #zakkoku .aboutArea__lead::before {
    margin-right: 3.5897435897vw;
  }
  #zakkoku .aboutArea__lead::after {
    margin-left: 3.5897435897vw;
  }
#zakkoku .aboutArea__defs {
  display: grid;
  grid-template-columns: clamp(233.306779661px, 30.3389830508vw, 358px) clamp(233.306779661px, 30.3389830508vw, 358px);
  grid-template-rows: auto auto 1fr;
  row-gap: clamp(10.4271186441px, 1.3559322034vw, 16px);
  column-gap: clamp(56.6974576271px, 7.3728813559vw, 87px);
  align-items: stretch;
  justify-content: center;
  width: 100%;
  overflow: visible;
}
  #zakkoku .aboutArea__defs {
    display: flex;
    flex-direction: column;
    gap: 14.358974359vw;
  }
#zakkoku .aboutArea__def {
  position: relative;
  display: grid;
  grid-template-rows: subgrid;
  grid-row: span 3;
  align-items: stretch;
  width: 100%;
  max-width: clamp(233.306779661px, 30.3389830508vw, 358px);
  min-width: 0;
  min-height: clamp(285.4423728814px, 37.1186440678vw, 438px);
  overflow: visible;
}
  #zakkoku .aboutArea__def {
    display: flex;
    flex-direction: column;
    gap: 4.1025641026vw;
    align-items: flex-start;
    width: 100%;
    max-width: none;
    min-height: 0;
  }
/* --- 定義カード写真（羽付き透過PNG） --- */
#zakkoku .aboutArea__defPhoto {
  position: absolute;
  top: clamp(-37px, -3.1355932203vw, -24.1127118644px);
  right: clamp(-45px, -3.813559322vw, -29.3262711864px);
  z-index: 0;
  width: clamp(151.8449152542px, 19.7457627119vw, 233px);
  aspect-ratio: 466/476;
  pointer-events: none;
  background-image: var(--def-photo);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
  #zakkoku .aboutArea__defPhoto {
    /* 画面右外へ約30px（padding 16 + 30） */
    top: 0vw;
    right: -23.0769230769vw;
    width: 64.358974359vw;
  }
#zakkoku .aboutArea__defPhoto--zenryu {
  top: clamp(-40px, -3.3898305085vw, -26.0677966102px);
  right: clamp(-57px, -4.8305084746vw, -37.1466101695px);
  width: clamp(150.5415254237px, 19.5762711864vw, 231px);
  aspect-ratio: 462/392;
}
  #zakkoku .aboutArea__defPhoto--zenryu {
    top: -7.6923076923vw;
    right: -15.1282051282vw;
    width: 61.0256410256vw;
  }
#zakkoku .aboutArea__defLabel {
  position: relative;
  z-index: 1;
  justify-self: start;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: clamp(29.9779661017px, 3.8983050847vw, 46px);
  margin: 0;
  padding: clamp(1.3033898305px, 0.1694915254vw, 2px) clamp(10.4271186441px, 1.3559322034vw, 16px);
  font-family: var(--font-zen-mincho);
  font-size: clamp(15.6406779661px, 2.0338983051vw, 24px);
  font-weight: 600;
  line-height: 1.6;
  color: #fff;
  background: #e35731;
  border-radius: 48px;
}
  #zakkoku .aboutArea__defLabel {
    min-height: 11.7948717949vw;
    padding: 0.5128205128vw 4.1025641026vw;
    font-size: 6.1538461538vw;
  }
#zakkoku .aboutArea__defHeading {
  position: relative;
  z-index: 1;
  align-self: start;
  max-width: clamp(160.3169491525px, 20.8474576271vw, 246px);
  padding-left: clamp(5.213559322px, 0.6779661017vw, 8px);
  text-shadow: 0 4px 4px #fff;
}
  #zakkoku .aboutArea__defHeading {
    max-width: 63.0769230769vw;
    padding-left: 2.0512820513vw;
  }
#zakkoku .aboutArea__def--zenryu .aboutArea__defHeading {
  max-width: 100%;
}
#zakkoku .aboutArea__defNote {
  margin: 0;
  font-family: var(--font-zen-gothic);
  font-size: clamp(9.1237288136px, 1.186440678vw, 14px);
  font-weight: 400;
  line-height: 1.6;
}
  #zakkoku .aboutArea__defNote {
    font-size: 3.5897435897vw;
  }
#zakkoku .aboutArea__defLead {
  margin: 0;
  font-family: var(--font-zen-mincho);
  font-size: clamp(20.8542372881px, 2.7118644068vw, 32px);
  font-weight: 500;
  line-height: 1.3;
}
  #zakkoku .aboutArea__defLead {
    font-size: 8.2051282051vw;
  }
#zakkoku .aboutArea__defCard {
  position: relative;
  z-index: 1;
  align-self: stretch;
  width: 100%;
  height: 100%;
  padding: clamp(26.0677966102px, 3.3898305085vw, 40px) clamp(15.6406779661px, 2.0338983051vw, 24px);
  background: #fff;
  border-radius: clamp(10.4271186441px, 1.3559322034vw, 16px);
  box-shadow: 0 clamp(2.606779661px, 0.3389830508vw, 4px) clamp(1.3033898305px, 0.1694915254vw, 2px) rgba(0, 0, 0, 0.15);
}
#zakkoku .aboutArea__defCard p {
  margin: 0;
  font-size: clamp(10.4271186441px, 1.3559322034vw, 16px);
  font-weight: 400;
  line-height: 1.6;
  color: #231815;
}
#zakkoku .aboutArea__defCard strong {
  font-weight: 700;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
  background-image: linear-gradient(#fff7b2, #fff7b2);
  background-repeat: no-repeat;
  background-position: left center;
  background-size: 100% 1em;
}
  #zakkoku .aboutArea__defCard {
    height: auto;
    padding: 10.2564102564vw 4.1025641026vw;
    border-radius: 4.1025641026vw;
    box-shadow: 0 1.0256410256vw 0.5128205128vw rgba(0, 0, 0, 0.15);
  }
  #zakkoku .aboutArea__defCard p {
    font-size: 4.1025641026vw;
  }
/* --- 7つの自然の恵み --- */
#zakkoku .aboutArea__bless {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: 0;
  text-align: center;
}
#zakkoku .aboutArea__blessHead {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  max-width: clamp(350.6118644068px, 45.593220339vw, 538px);
}
  #zakkoku .aboutArea__blessHead {
    max-width: 85.8974358974vw;
  }
#zakkoku .aboutArea__blessLabels {
  display: flex;
  flex-direction: column;
  gap: clamp(3.2584745763px, 0.4237288136vw, 5px);
  align-items: center;
  margin: 0 0 clamp(5.213559322px, 0.6779661017vw, 8px);
}
#zakkoku .aboutArea__blessLabels p {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  height: clamp(26.0677966102px, 3.3898305085vw, 40px);
  margin: 0;
  padding: 0 clamp(6.5169491525px, 0.8474576271vw, 10px);
  font-family: var(--font-zen-mincho);
  font-size: clamp(13.0338983051px, 1.6949152542vw, 20px);
  font-weight: 500;
  line-height: 1;
  color: #fff;
  white-space: nowrap;
  background: #231815;
}
  #zakkoku .aboutArea__blessLabels {
    gap: 1.0256410256vw;
    margin-bottom: 2.0512820513vw;
  }
  #zakkoku .aboutArea__blessLabels p {
    height: 8.2051282051vw;
    padding: 0 2.0512820513vw;
    font-size: 5.1282051282vw;
  }
#zakkoku .aboutArea__blessTitle {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: baseline;
  justify-content: center;
  width: 100%;
  margin: 0;
  font-family: var(--font-zen-mincho);
  font-weight: 500;
  line-height: 1;
  color: #e35731;
  text-align: center;
}
#zakkoku .aboutArea__blessNum {
  font-size: clamp(52.1355932203px, 6.7796610169vw, 80px);
  line-height: 1;
}
  #zakkoku .aboutArea__blessNum {
    font-size: 13.5897435897vw;
  }
#zakkoku .aboutArea__blessText {
  font-size: clamp(26.0677966102px, 3.3898305085vw, 40px);
  line-height: 1;
}
  #zakkoku .aboutArea__blessText {
    font-size: 8.2051282051vw;
  }
#zakkoku .aboutArea__blessDeco {
  width: 100%;
  margin: clamp(3.9101694915px, 0.5084745763vw, 6px) 0 0;
}
#zakkoku .aboutArea__blessDeco picture,
#zakkoku .aboutArea__blessDeco img {
  display: block;
  width: 100%;
  height: auto;
}
  #zakkoku .aboutArea__blessDeco {
    width: 79.4871794872vw;
    margin-top: 1.0256410256vw;
  }
#zakkoku .aboutArea__blessImg {
  width: clamp(350.6118644068px, 45.593220339vw, 538px);
  margin-top: clamp(-4px, -0.3389830508vw, -2.606779661px);
}
#zakkoku .aboutArea__blessImg picture,
#zakkoku .aboutArea__blessImg img {
  display: block;
  width: 100%;
  height: auto;
}
  #zakkoku .aboutArea__blessImg {
    width: 100%;
    max-width: 91.7948717949vw;
    margin-top: 0;
  }
/* --- 穀物特長アコーディオン --- */
#zakkoku .aboutArea__accordion {
  width: 100%;
  /* close時はボタン下の影（box-shadow）を切らない */
  overflow: visible;
  background: #ffefe1;
  border-radius: clamp(10.4271186441px, 1.3559322034vw, 16px);
  box-shadow: 0 clamp(2.606779661px, 0.3389830508vw, 4px) clamp(1.3033898305px, 0.1694915254vw, 2px) rgba(154, 154, 154, 0.15);
}
#zakkoku .aboutArea__accordion[open] {
  overflow: hidden;
  border-radius: clamp(10.4271186441px, 1.3559322034vw, 16px) clamp(10.4271186441px, 1.3559322034vw, 16px) 0 0;
}
  #zakkoku .aboutArea__accordion {
    border-radius: 4.1025641026vw;
    box-shadow: 0 1.0256410256vw 0.5128205128vw rgba(154, 154, 154, 0.15);
  }
  #zakkoku .aboutArea__accordion[open] {
    border-radius: 4.1025641026vw 4.1025641026vw 0 0;
  }
#zakkoku .aboutArea__accordionBtn {
  display: flex;
  gap: clamp(5.213559322px, 0.6779661017vw, 8px);
  align-items: center;
  justify-content: center;
  width: 100%;
  height: clamp(46.9220338983px, 6.1016949153vw, 72px);
  padding: clamp(5.213559322px, 0.6779661017vw, 8px) clamp(10.4271186441px, 1.3559322034vw, 16px);
  font-family: var(--font-zen-gothic);
  font-size: clamp(13.0338983051px, 1.6949152542vw, 20px);
  font-weight: 700;
  line-height: 1.6;
  color: #fff;
  list-style: none;
  cursor: pointer;
  background: #e35731;
  border: 0;
  border-radius: clamp(10.4271186441px, 1.3559322034vw, 16px);
  box-shadow: 0 clamp(2.606779661px, 0.3389830508vw, 4px) 0 #be4727;
  transition: background-color 0.2s ease;
}
#zakkoku .aboutArea__accordionBtn::-webkit-details-marker {
  display: none;
}
  #zakkoku .aboutArea__accordionBtn {
    gap: 2.0512820513vw;
    height: 18.4615384615vw;
    padding: 2.0512820513vw 4.1025641026vw;
    font-size: 5.1282051282vw;
    border-radius: 4.1025641026vw;
    box-shadow: 0 1.0256410256vw 0 #be4727;
  }
#zakkoku .aboutArea__accordionIcon {
  display: block;
  flex: 0 0 clamp(15.6406779661px, 2.0338983051vw, 24px);
  width: clamp(15.6406779661px, 2.0338983051vw, 24px);
  height: clamp(15.6406779661px, 2.0338983051vw, 24px);
  transition: transform 0.25s ease;
  /* icon_up は左向き。閉じ時は下向き（展開を示す） */
  transform: rotate(-90deg);
}
  #zakkoku .aboutArea__accordionIcon {
    flex-basis: 6.1538461538vw;
    width: 6.1538461538vw;
    height: 6.1538461538vw;
  }
#zakkoku .aboutArea__accordion[open] .aboutArea__accordionIcon {
  /* 開いているときは上向き（折りたたみを示す） */
  transform: rotate(90deg);
}
#zakkoku .aboutArea__accordionPanel {
  display: none;
  padding: clamp(26.0677966102px, 3.3898305085vw, 40px) clamp(15.6406779661px, 2.0338983051vw, 24px);
}
  #zakkoku .aboutArea__accordionPanel {
    padding: 10.2564102564vw 4.1025641026vw;
  }
#zakkoku .aboutArea__accordion[open] .aboutArea__accordionPanel {
  display: block;
}
#zakkoku .aboutArea__cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(10.4271186441px, 1.3559322034vw, 16px);
}
  #zakkoku .aboutArea__cards {
    grid-template-columns: 1fr;
    gap: 4.1025641026vw;
  }
#zakkoku .aboutArea__card {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: #fff;
  border: 1px solid #231815;
  border-radius: clamp(10.4271186441px, 1.3559322034vw, 16px);
}
  #zakkoku .aboutArea__card {
    border-radius: 4.1025641026vw;
  }
#zakkoku .aboutArea__cardMedia {
  width: 100%;
  height: clamp(109.4847457627px, 14.2372881356vw, 168px);
  overflow: hidden;
  border-radius: clamp(10.4271186441px, 1.3559322034vw, 16px) clamp(10.4271186441px, 1.3559322034vw, 16px) 0 0;
}
#zakkoku .aboutArea__cardMedia img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
  #zakkoku .aboutArea__cardMedia {
    height: 43.0769230769vw;
    border-radius: 4.1025641026vw 4.1025641026vw 0 0;
  }
#zakkoku .aboutArea__cardBody {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: clamp(10.4271186441px, 1.3559322034vw, 16px);
  padding: clamp(15.6406779661px, 2.0338983051vw, 24px) clamp(10.4271186441px, 1.3559322034vw, 16px);
  background: #fffcf7;
  border-radius: 0 0 clamp(10.4271186441px, 1.3559322034vw, 16px) clamp(10.4271186441px, 1.3559322034vw, 16px);
}
  #zakkoku .aboutArea__cardBody {
    gap: 4.1025641026vw;
    padding: 6.1538461538vw 4.1025641026vw;
    border-radius: 0 0 4.1025641026vw 4.1025641026vw;
  }
#zakkoku .aboutArea__cardTxt {
  display: flex;
  flex-direction: column;
  gap: clamp(5.213559322px, 0.6779661017vw, 8px);
  width: 100%;
}
  #zakkoku .aboutArea__cardTxt {
    gap: 2.0512820513vw;
  }
#zakkoku .aboutArea__cardName {
  margin: 0;
  font-size: clamp(10.4271186441px, 1.3559322034vw, 16px);
  font-weight: 700;
  line-height: 1.6;
  color: #231815;
}
  #zakkoku .aboutArea__cardName {
    font-size: 4.1025641026vw;
  }
#zakkoku .aboutArea__cardText {
  margin: 0;
  font-size: clamp(10.4271186441px, 1.3559322034vw, 16px);
  font-weight: 400;
  line-height: 1.6;
  color: #231815;
}
  #zakkoku .aboutArea__cardText {
    font-size: 4.1025641026vw;
  }
#zakkoku .aboutArea__tags {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(2.606779661px, 0.3389830508vw, 4px);
  align-items: flex-start;
  margin: 0;
  padding: 0;
  list-style: none;
}
#zakkoku .aboutArea__tags li {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: clamp(3.9101694915px, 0.5084745763vw, 6px) clamp(7.8203389831px, 1.0169491525vw, 12px);
  font-size: clamp(7.8203389831px, 1.0169491525vw, 12px);
  font-weight: 500;
  line-height: 1;
  color: #fff;
  white-space: nowrap;
  background: #e35731;
  border-radius: 9999px;
}
  #zakkoku .aboutArea__tags {
    gap: 1.0256410256vw;
  }
  #zakkoku .aboutArea__tags li {
    padding: 1.5384615385vw 3.0769230769vw;
    font-size: 3.0769230769vw;
  }
/* --- こんな方におすすめ --- */
#zakkoku .recommendArea {
  width: 100%;
  max-width: 1180px;
  margin: 0 auto;
  overflow: visible;
  color: #231815;
  background-color: #f7f1df;
  background-image: var(--recommend-bg);
  background-position: left top;
  background-size: clamp(265.2398305085px, 34.4915254237vw, 407px) auto;
  background-repeat: repeat;
}
  #zakkoku .recommendArea {
    overflow-x: hidden;
  }
#zakkoku .recommendArea__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  max-width: 1180px;
  margin: 0 auto;
  padding: clamp(41.7084745763px, 5.4237288136vw, 64px) clamp(10.4271186441px, 1.3559322034vw, 16px) clamp(31.2813559322px, 4.0677966102vw, 48px);
  overflow: visible;
}
  #zakkoku .recommendArea__inner {
    padding: 13.0769230769vw 4.1025641026vw 10.2564102564vw;
  }
#zakkoku .recommendArea__title {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  width: clamp(261.9813559322px, 34.0677966102vw, 402px);
  height: clamp(54.0906779661px, 7.0338983051vw, 83px);
  margin: 0;
  font-family: var(--font-zen-mincho);
  font-size: clamp(26.0677966102px, 3.3898305085vw, 40px);
  font-weight: 500;
  line-height: 1.3;
  color: #fff;
  white-space: nowrap;
  background: #6a4940;
  border-radius: 99999px;
}
#zakkoku .recommendArea__title::after {
  position: absolute;
  top: clamp(-6px, -0.5084745763vw, -3.9101694915px);
  left: clamp(-3px, -0.2542372881vw, -1.9550847458px);
  width: 100%;
  height: 100%;
  pointer-events: none;
  content: "";
  border: 1px solid #e35731;
  border-radius: 99999px;
}
  #zakkoku .recommendArea__title {
    width: 84.6153846154vw;
    height: 17.4358974359vw;
    font-size: 8.2051282051vw;
  }
  #zakkoku .recommendArea__title::after {
    top: -1.2820512821vw;
    left: -1.2820512821vw;
  }
#zakkoku .recommendArea__titleAccent {
  color: #fff175;
}
#zakkoku .recommendArea__leadWrap {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: clamp(417.0847457627px, 54.2372881356vw, 640px);
  margin: clamp(26.0677966102px, 3.3898305085vw, 40px) 0 0;
}
  #zakkoku .recommendArea__leadWrap {
    max-width: 91.7948717949vw;
    margin-top: 8.7179487179vw;
  }
#zakkoku .recommendArea__lead {
  display: flex;
  flex-direction: column;
  gap: clamp(5.213559322px, 0.6779661017vw, 8px);
  align-items: center;
  justify-content: center;
  padding: clamp(26.0677966102px, 3.3898305085vw, 40px) clamp(10.4271186441px, 1.3559322034vw, 16px);
  line-height: 1.6;
  background: linear-gradient(180deg, #fff 0%, #fefbf3 100%);
  box-shadow: 0 clamp(2.606779661px, 0.3389830508vw, 4px) clamp(2.606779661px, 0.3389830508vw, 4px) #e1d8bc;
}
#zakkoku .recommendArea__lead p {
  width: 100%;
  margin: 0;
  font-family: var(--font-zen-mincho);
  font-size: clamp(10.4271186441px, 1.3559322034vw, 16px);
  font-weight: 600;
  text-align: center;
}
  #zakkoku .recommendArea__lead {
    gap: 2.0512820513vw;
    padding: 10.2564102564vw 4.1025641026vw;
    box-shadow: 0 1.0256410256vw 1.0256410256vw #e1d8bc;
  }
  #zakkoku .recommendArea__lead p {
    font-size: 4.1025641026vw;
  }
#zakkoku .recommendArea__em {
  color: #e35731;
}
#zakkoku .recommendArea__azuki {
  position: absolute;
  right: clamp(-130px, -11.0169491525vw, -84.7203389831px);
  bottom: clamp(-30px, -2.5423728814vw, -19.5508474576px);
  z-index: 2;
  display: block;
  width: clamp(141.4177966102px, 18.3898305085vw, 217px);
  height: auto;
  pointer-events: none;
}
#zakkoku .recommendArea__azuki img {
  display: block;
  width: 100%;
  height: auto;
}
  #zakkoku .recommendArea__azuki {
    right: -20vw;
    bottom: -15.3846153846vw;
    width: 55.641025641vw;
  }
#zakkoku .recommendArea__cards {
  position: relative;
  width: 100%;
  max-width: clamp(625.6271186441px, 81.3559322034vw, 960px);
  height: clamp(219.6211864407px, 28.5593220339vw, 337px);
  margin: clamp(31.2813559322px, 4.0677966102vw, 48px) 0 0;
  padding: 0;
  overflow: visible;
  list-style: none;
}
  #zakkoku .recommendArea__cards {
    display: flex;
    flex-direction: column;
    gap: 10.2564102564vw;
    max-width: 91.7948717949vw;
    height: auto;
    margin-top: 14.358974359vw;
  }
#zakkoku .recommendArea__card {
  position: relative;
  margin: 0;
  padding: 0;
}
#zakkoku .recommendArea__card picture,
#zakkoku .recommendArea__card img {
  display: block;
  width: 100%;
  height: auto;
}
#zakkoku .recommendArea__card--meal {
  z-index: 1;
}
#zakkoku .recommendArea__card--family {
  z-index: 2;
}
#zakkoku .recommendArea__card--health {
  z-index: 3;
}
/* --- でも… --- */
#zakkoku .concernArea {
  width: 100%;
  max-width: 1180px;
  margin: 0 auto;
}
#zakkoku .concernArea__bar {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: clamp(37.7983050847px, 4.9152542373vw, 58px);
  margin: 0;
  font-family: var(--font-zen-mincho);
  font-size: clamp(20.8542372881px, 2.7118644068vw, 32px);
  font-weight: 500;
  line-height: 1.3;
  color: #231815;
  text-align: center;
  background: #a99f96;
}
  #zakkoku .concernArea__bar {
    height: 16.9230769231vw;
    font-size: 8.2051282051vw;
  }
#zakkoku .concernArea__img {
  width: 100%;
  margin: 0;
  padding: 0;
  background: #f2ebe1;
}
#zakkoku .concernArea__img picture,
#zakkoku .concernArea__img img {
  display: block;
  width: 100%;
  height: auto;
}
/* --- こだわり（おいしさ＋簡便性） --- */
#zakkoku .appealArea {
  width: 100%;
  max-width: 1180px;
  margin: 0 auto;
  overflow: hidden;
  color: #231815;
  background-color: #f7f1df;
  background-image: var(--appeal-bg);
  background-position: left top;
  background-size: clamp(265.2398305085px, 34.4915254237vw, 407px) auto;
  background-repeat: repeat;
}
#zakkoku .appealArea__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  max-width: 1180px;
  margin: 0 auto;
  padding: 0 clamp(10.4271186441px, 1.3559322034vw, 16px) clamp(26.0677966102px, 3.3898305085vw, 40px);
}
  #zakkoku .appealArea__inner {
    padding: 0 0 6.1538461538vw;
  }
#zakkoku .appealArea__banner {
  position: relative;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  width: clamp(456.186440678px, 59.3220338983vw, 700px);
  height: clamp(75.5966101695px, 9.8305084746vw, 116px);
  margin: 0;
}
#zakkoku .appealArea__banner picture,
#zakkoku .appealArea__banner .appealArea__bannerShape {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
}
#zakkoku .appealArea__banner img {
  display: block;
  width: 100%;
  height: 100%;
}
  #zakkoku .appealArea__banner {
    width: 79.4871794872vw;
    height: 29.7435897436vw;
  }
#zakkoku .appealArea__bannerText {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  padding: clamp(15.6406779661px, 2.0338983051vw, 24px) clamp(10.4271186441px, 1.3559322034vw, 16px) 0;
  font-family: var(--font-zen-gothic);
  font-size: clamp(15.6406779661px, 2.0338983051vw, 24px);
  font-weight: 700;
  line-height: 1.5;
  color: #fffcf7;
  text-align: center;
}
  #zakkoku .appealArea__bannerText {
    padding-top: 2.9487179487vw;
    font-size: 6.1538461538vw;
  }
#zakkoku .appealArea__brSp {
  display: none;
}
  #zakkoku .appealArea__brSp {
    display: inline;
  }
#zakkoku .appealArea__head {
  display: flex;
  flex-direction: column;
  gap: clamp(10.4271186441px, 1.3559322034vw, 16px);
  align-items: center;
  width: 100%;
  max-width: clamp(560.4576271186px, 72.8813559322vw, 860px);
  margin: clamp(26.0677966102px, 3.3898305085vw, 40px) 0 0;
}
  #zakkoku .appealArea__head {
    gap: 3.0769230769vw;
    max-width: none;
    margin-top: 6.1538461538vw;
  }
#zakkoku .appealArea__lead {
  position: relative;
  width: fit-content;
  max-width: clamp(337.5779661017px, 43.8983050847vw, 518px);
  margin: 0 auto;
  padding-bottom: clamp(5.213559322px, 0.6779661017vw, 8px);
  font-family: var(--font-zen-gothic);
  font-size: clamp(10.4271186441px, 1.3559322034vw, 16px);
  font-weight: 400;
  line-height: 1.8;
  color: #231815;
  text-align: center;
}
#zakkoku .appealArea__lead::after {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  display: block;
  height: 0;
  content: "";
  border-bottom: 1px dashed #cf9b48;
}
  #zakkoku .appealArea__lead {
    display: flex;
    flex-direction: column;
    gap: 1.0256410256vw;
    align-items: center;
    max-width: 71.0256410256vw;
    padding-bottom: 0;
    font-size: 4.1025641026vw;
  }
  #zakkoku .appealArea__lead::after {
    display: none;
  }
  #zakkoku .appealArea__leadLine {
    display: block;
    width: fit-content;
    max-width: 100%;
    padding-bottom: 1.0256410256vw;
    border-bottom: 1px dashed #cf9b48;
  }
#zakkoku .appealArea__headline {
  display: flex;
  flex-wrap: nowrap;
  gap: clamp(2.606779661px, 0.3389830508vw, 4px);
  align-items: center;
  justify-content: center;
  width: 100%;
  font-family: var(--font-zen-gothic);
  font-size: clamp(20.8542372881px, 2.7118644068vw, 32px);
  font-weight: 700;
  line-height: 1.6;
  color: #231815;
}
  #zakkoku .appealArea__headline {
    flex-direction: column;
    gap: 2.0512820513vw;
    max-width: none;
    font-size: 5.1282051282vw;
  }
#zakkoku .appealArea__headlinePrimary,
#zakkoku .appealArea__headlineSecondary {
  display: contents;
}
  #zakkoku .appealArea__headlinePrimary,
  #zakkoku .appealArea__headlineSecondary {
    display: flex;
    flex-wrap: nowrap;
    gap: 1.0256410256vw;
    align-items: center;
    justify-content: center;
  }
  #zakkoku .appealArea__headlineSecondary {
    position: relative;
    width: 100%;
  }
#zakkoku .appealArea__deco {
  display: block;
  flex-shrink: 0;
  width: clamp(20.2025423729px, 2.6271186441vw, 31px);
  height: clamp(29.9779661017px, 3.8983050847vw, 46px);
}
  #zakkoku .appealArea__deco {
    width: 7.9487179487vw;
    height: 11.7948717949vw;
  }
  #zakkoku .appealArea__deco--left {
    position: absolute;
    top: 50%;
    left: 4.1025641026vw;
    transform: translateY(-50%);
  }
#zakkoku .appealArea__deco--right {
  transform: scaleX(-1);
}
  #zakkoku .appealArea__deco--right {
    position: absolute;
    top: 50%;
    right: 4.1025641026vw;
    transform: translateY(-50%) scaleX(-1);
  }
#zakkoku .appealArea__badge {
  display: inline-flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  padding: 0 clamp(5.213559322px, 0.6779661017vw, 8px);
  font-family: var(--font-zen-mincho);
  font-size: clamp(26.0677966102px, 3.3898305085vw, 40px);
  font-weight: 600;
  line-height: 1.6;
  color: #fff;
  white-space: nowrap;
  background: #cf9b48;
  border-radius: clamp(5.213559322px, 0.6779661017vw, 8px);
}
  #zakkoku .appealArea__badge {
    padding: 0 2.0512820513vw;
    font-size: 8.2051282051vw;
    border-radius: 2.0512820513vw;
  }
#zakkoku .appealArea__plus,
#zakkoku .appealArea__headlineOf {
  flex-shrink: 0;
}
#zakkoku .appealArea__headlineRest {
  flex-shrink: 0;
  white-space: nowrap;
}
  #zakkoku .appealArea__headlineRestNo {
    display: none;
  }
#zakkoku .appealArea__cards {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(15.6406779661px, 2.0338983051vw, 24px);
  align-items: stretch;
  width: 100%;
  max-width: clamp(560.4576271186px, 72.8813559322vw, 860px);
  margin: clamp(26.0677966102px, 3.3898305085vw, 40px) 0 0;
  padding: 0;
  list-style: none;
}
  #zakkoku .appealArea__cards {
    display: flex;
    flex-direction: column;
    gap: 6.1538461538vw;
    max-width: 91.7948717949vw;
    margin-top: 6.1538461538vw;
  }
#zakkoku .appealArea__card {
  display: flex;
  flex-direction: column;
  gap: clamp(10.4271186441px, 1.3559322034vw, 16px);
  margin: 0;
  padding: clamp(26.0677966102px, 3.3898305085vw, 40px) clamp(15.6406779661px, 2.0338983051vw, 24px);
  background: #fff;
  border-radius: clamp(10.4271186441px, 1.3559322034vw, 16px);
  box-shadow: 0 clamp(2.606779661px, 0.3389830508vw, 4px) clamp(2.606779661px, 0.3389830508vw, 4px) rgba(0, 0, 0, 0.15);
}
  #zakkoku .appealArea__card {
    gap: 4.1025641026vw;
    padding: 10.2564102564vw 4.1025641026vw;
    border-radius: 4.1025641026vw;
    box-shadow: 0 1.0256410256vw 1.0256410256vw rgba(0, 0, 0, 0.15);
  }
#zakkoku .appealArea__cardHead {
  display: flex;
  gap: clamp(10.4271186441px, 1.3559322034vw, 16px);
  align-items: center;
  width: 100%;
}
  #zakkoku .appealArea__cardHead {
    gap: 2.0512820513vw;
  }
#zakkoku .appealArea__cardIcon {
  display: block;
  flex-shrink: 0;
  width: clamp(39.1016949153px, 5.0847457627vw, 60px);
  height: clamp(39.1016949153px, 5.0847457627vw, 60px);
}
#zakkoku .appealArea__cardIcon img {
  display: block;
  width: 100%;
  height: 100%;
}
  #zakkoku .appealArea__cardIcon {
    width: 15.3846153846vw;
    height: 15.3846153846vw;
  }
#zakkoku .appealArea__cardTitle {
  flex: 1 1 auto;
  margin: 0;
  font-family: var(--font-zen-mincho);
  font-size: clamp(20.8542372881px, 2.7118644068vw, 32px);
  font-weight: 500;
  line-height: 1.3;
  color: #e35731;
}
  #zakkoku .appealArea__cardTitle {
    font-size: 8.2051282051vw;
  }
#zakkoku .appealArea__cardTitle--split {
  font-size: 0;
  line-height: 0;
}
#zakkoku .appealArea__cardTitleAccent {
  font-size: clamp(20.8542372881px, 2.7118644068vw, 32px);
  font-weight: 500;
  line-height: 1.3;
  color: #e35731;
}
  #zakkoku .appealArea__cardTitleAccent {
    font-size: 8.2051282051vw;
  }
#zakkoku .appealArea__cardTitleSub {
  font-size: clamp(15.6406779661px, 2.0338983051vw, 24px);
  font-weight: 600;
  line-height: 1.6;
  color: #231815;
}
  #zakkoku .appealArea__cardTitleSub {
    font-size: 6.1538461538vw;
  }
#zakkoku .appealArea__cardBody {
  display: flex;
  flex-direction: column;
  width: 100%;
  padding-top: clamp(10.4271186441px, 1.3559322034vw, 16px);
  font-family: var(--font-zen-gothic);
  font-size: clamp(10.4271186441px, 1.3559322034vw, 16px);
  font-weight: 400;
  line-height: 1.6;
  color: #231815;
  border-top: 1px dashed #6a4940;
}
#zakkoku .appealArea__cardBody p {
  margin: 0;
  font-size: clamp(10.4271186441px, 1.3559322034vw, 16px);
}
  #zakkoku .appealArea__cardBody p {
    font-size: 4.1025641026vw;
  }
#zakkoku .appealArea__cardBody em {
  font-family: var(--font-zen-gothic);
  font-style: normal;
  font-weight: 700;
  color: #e35731;
}
  #zakkoku .appealArea__cardBody {
    padding-top: 4.1025641026vw;
    font-size: 4.1025641026vw;
  }
#zakkoku .appealArea__visual {
  width: 100%;
  max-width: clamp(417.0847457627px, 54.2372881356vw, 640px);
  margin: clamp(26.0677966102px, 3.3898305085vw, 40px) 0 0;
}
#zakkoku .appealArea__visual picture,
#zakkoku .appealArea__visual img {
  display: block;
  width: 100%;
  height: auto;
}
  #zakkoku .appealArea__visual {
    max-width: none;
    margin-top: 6.1538461538vw;
  }
/* --- 炊き方 / 味変レシピ --- */
#zakkoku .howtoArea {
  width: 100%;
  max-width: 1180px;
  margin: 0 auto;
  color: #231815;
  background-color: #f7f4ef;
  background-image: var(--texture-bg);
  background-position: left top;
  background-size: clamp(418.3881355932px, 54.406779661vw, 642px) clamp(628.8855932203px, 81.7796610169vw, 965px);
  background-repeat: repeat;
}
  #zakkoku .howtoArea {
    background-image: var(--texture-bg-sp);
    background-size: 100vw 225.641025641vw;
  }
#zakkoku .howtoArea__inner {
  display: flex;
  flex-direction: column;
  gap: clamp(26.0677966102px, 3.3898305085vw, 40px);
  align-items: center;
  max-width: 1180px;
  margin: 0 auto;
  padding: clamp(41.7084745763px, 5.4237288136vw, 64px) clamp(10.4271186441px, 1.3559322034vw, 16px);
}
  #zakkoku .howtoArea__inner {
    gap: 14.358974359vw;
    padding: 14.358974359vw 0;
  }
/* --- 炊き方 --- */
#zakkoku .howtoArea__cook {
  display: flex;
  flex-direction: column;
  gap: clamp(5.213559322px, 0.6779661017vw, 8px);
  align-items: center;
  width: 100%;
  max-width: clamp(453.5796610169px, 58.9830508475vw, 696px);
}
  #zakkoku .howtoArea__cook {
    gap: 2.0512820513vw;
    max-width: none;
  }
#zakkoku .howtoArea__cookTitle {
  display: flex;
  align-items: center;
  justify-content: center;
  width: clamp(254.1610169492px, 33.0508474576vw, 390px);
  height: clamp(125.1254237288px, 16.2711864407vw, 192px);
  margin: 0;
  padding: clamp(10.4271186441px, 1.3559322034vw, 16px) 0 clamp(5.213559322px, 0.6779661017vw, 8px);
}
#zakkoku .howtoArea__cookTitle img {
  display: block;
  width: clamp(222.2279661017px, 28.8983050847vw, 341px);
  height: auto;
}
  #zakkoku .howtoArea__cookTitle {
    width: 100%;
    height: 49.2307692308vw;
    padding: 4.1025641026vw 0 2.0512820513vw;
  }
  #zakkoku .howtoArea__cookTitle img {
    width: 87.4358974359vw;
  }
#zakkoku .howtoArea__cookCard {
  display: flex;
  gap: clamp(26.0677966102px, 3.3898305085vw, 40px);
  align-items: flex-start;
  justify-content: center;
  width: 100%;
  padding: clamp(26.0677966102px, 3.3898305085vw, 40px);
  background: #fff;
  border-radius: clamp(26.0677966102px, 3.3898305085vw, 40px);
  box-shadow: 0 clamp(2.606779661px, 0.3389830508vw, 4px) clamp(1.3033898305px, 0.1694915254vw, 2px) rgba(154, 154, 154, 0.15);
}
  #zakkoku .howtoArea__cookCard {
    flex-direction: column;
    gap: 8.2051282051vw;
    align-items: center;
    width: 91.7948717949vw;
    max-width: calc(100% - 8.2051282051vw);
    padding: 6.1538461538vw 4.1025641026vw 10.2564102564vw;
    border-radius: 10.2564102564vw;
    box-shadow: 0 1.0256410256vw 0.5128205128vw rgba(154, 154, 154, 0.15);
  }
#zakkoku .howtoArea__steps {
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  width: clamp(191.5983050847px, 24.9152542373vw, 294px);
  margin: 0;
  padding: 0;
  list-style: none;
}
  #zakkoku .howtoArea__steps {
    width: 100%;
  }
#zakkoku .howtoArea__step {
  display: flex;
  gap: clamp(10.4271186441px, 1.3559322034vw, 16px);
  align-items: center;
  width: 100%;
  margin: 0;
  padding: clamp(15.6406779661px, 2.0338983051vw, 24px) 0;
  border-bottom: 1px dashed #6a4940;
}
#zakkoku .howtoArea__step:first-child {
  padding-top: 0;
}
  #zakkoku .howtoArea__step {
    gap: 4.1025641026vw;
    padding: 6.1538461538vw 0;
  }
#zakkoku .howtoArea__step--last {
  border-bottom: 0;
  padding-bottom: 0;
}
#zakkoku .howtoArea__stepIcon {
  flex-shrink: 0;
  display: block;
  width: clamp(32.5847457627px, 4.2372881356vw, 50px);
  height: auto;
}
#zakkoku .howtoArea__stepIcon img {
  display: block;
  width: 100%;
  height: auto;
}
  #zakkoku .howtoArea__stepIcon {
    width: 12.8205128205vw;
  }
#zakkoku .howtoArea__stepBody {
  display: flex;
  flex-direction: column;
  gap: clamp(5.213559322px, 0.6779661017vw, 8px);
  min-width: 0;
}
  #zakkoku .howtoArea__stepBody {
    gap: 2.0512820513vw;
  }
#zakkoku .howtoArea__stepText {
  margin: 0;
  font-family: var(--font-zen-gothic);
  font-size: clamp(10.4271186441px, 1.3559322034vw, 16px);
  font-weight: 700;
  line-height: 1.6;
  color: #231815;
}
  #zakkoku .howtoArea__stepText {
    font-size: 4.1025641026vw;
  }
#zakkoku .howtoArea__stepNote {
  margin: 0;
  font-family: var(--font-zen-gothic);
  font-size: clamp(7.8203389831px, 1.0169491525vw, 12px);
  font-weight: 400;
  line-height: 1.6;
  color: #231815;
}
  #zakkoku .howtoArea__stepNote {
    font-size: 3.0769230769vw;
  }
#zakkoku .howtoArea__cookVisual {
  flex-shrink: 0;
  width: clamp(183.7779661017px, 23.8983050847vw, 282px);
}
#zakkoku .howtoArea__cookVisual img {
  display: block;
  width: 100%;
  height: auto;
}
  #zakkoku .howtoArea__cookVisual {
    width: 100%;
  }
/* --- 味変レシピ --- */
#zakkoku .howtoArea__recipes {
  display: flex;
  flex-direction: column;
  gap: clamp(26.0677966102px, 3.3898305085vw, 40px);
  align-items: center;
  width: 100%;
  max-width: clamp(645.1779661017px, 83.8983050847vw, 990px);
}
  #zakkoku .howtoArea__recipes {
    gap: 6.1538461538vw;
    width: 91.7948717949vw;
    max-width: calc(100% - 8.2051282051vw);
  }
#zakkoku .howtoArea__recipesHead {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  max-width: clamp(304.993220339px, 39.6610169492vw, 468px);
  padding-top: clamp(31.2813559322px, 4.0677966102vw, 48px);
}
  #zakkoku .howtoArea__recipesHead {
    max-width: none;
    padding-top: 13.3333333333vw;
  }
#zakkoku .howtoArea__bubble {
  position: absolute;
  top: clamp(7.8203389831px, 1.0169491525vw, 12px);
  left: clamp(27.3711864407px, 3.5593220339vw, 42px);
  display: block;
  width: clamp(75.5966101695px, 9.8305084746vw, 116px);
  transform: rotate(-11.89deg);
  transform-origin: center center;
}
#zakkoku .howtoArea__bubble picture,
#zakkoku .howtoArea__bubble img {
  display: block;
  width: 100%;
  height: auto;
}
  #zakkoku .howtoArea__bubble {
    top: 0;
    left: 0;
    width: 29.7435897436vw;
  }
#zakkoku .howtoArea__recipesTitle {
  position: relative;
  z-index: 1;
  margin: 0;
  font-family: var(--font-zen-gothic);
  font-size: clamp(26.0677966102px, 3.3898305085vw, 40px);
  font-weight: 700;
  line-height: 1.6;
  color: #231815;
  text-align: center;
}
  #zakkoku .howtoArea__recipesTitle {
    font-size: 8.2051282051vw;
  }
#zakkoku .howtoArea__recipesAccent {
  color: #e35731;
}
#zakkoku .howtoArea__pen {
  position: relative;
  top: clamp(-8px, -0.6779661017vw, -5.213559322px);
  left: clamp(-43px, -3.6440677966vw, -28.0228813559px);
  z-index: 0;
  display: block;
  width: clamp(265.8915254237px, 34.5762711864vw, 408px);
  margin-top: clamp(-8px, -0.6779661017vw, -5.213559322px);
}
#zakkoku .howtoArea__pen img {
  display: block;
  width: 100%;
  height: auto;
}
  #zakkoku .howtoArea__pen {
    top: 0;
    left: 0;
    width: 77.1794871795vw;
    margin-top: 2.0512820513vw;
  }
#zakkoku .howtoArea__recipeList {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(15.6406779661px, 2.0338983051vw, 24px);
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
}
  #zakkoku .howtoArea__recipeList {
    display: flex;
    flex-direction: column;
    gap: 6.1538461538vw;
  }
#zakkoku .howtoArea__recipeCard {
  display: flex;
  flex-direction: column;
  overflow: clip;
  background: #fff;
  border: clamp(3.2584745763px, 0.4237288136vw, 5px) solid #fff;
  box-shadow: 0 clamp(2.606779661px, 0.3389830508vw, 4px) clamp(2.606779661px, 0.3389830508vw, 4px) rgba(154, 154, 154, 0.15);
}
  #zakkoku .howtoArea__recipeCard {
    border-width: 1.2820512821vw;
    box-shadow: 0 1.0256410256vw 1.0256410256vw rgba(154, 154, 154, 0.15);
  }
#zakkoku .howtoArea__recipeMedia {
  width: 100%;
  aspect-ratio: 315/197;
  overflow: hidden;
}
#zakkoku .howtoArea__recipeMedia img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
#zakkoku .howtoArea__recipeName {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  padding: clamp(10.4271186441px, 1.3559322034vw, 16px) clamp(5.213559322px, 0.6779661017vw, 8px);
  font-family: var(--font-zen-gothic);
  font-size: clamp(11.7305084746px, 1.5254237288vw, 18px);
  font-weight: 700;
  line-height: 1.6;
  color: #231815;
  text-align: center;
  background: #fff;
}
  #zakkoku .howtoArea__recipeName {
    padding: 2.0512820513vw;
    font-size: 4.6153846154vw;
  }