/** Shopify CDN: Minification failed

Line 516:17 Expected "}" to go with "{"

**/
/* ==========================================================================
   cocochi 器企画 特集LP「器を選ぶ、暮らしを楽しむ」
   ルート: .cch-utsuwa-feature
   ・全セレクタを .cch-utsuwa-feature 配下にスコープ（body / h1 / p / img 等への直接指定なし）
   ・単位は px と em のみ（rem 不使用。テーマが html{font-size:62.5%} でも崩れない）
   ・JavaScript なし
   ・テーマ側の見出し・本文の指定に負けないよう、宣言には !important を付けている
     （28周年祭LPと同じ対処。色などの変数 --cch-* と @keyframes の中には付けていない）
   ・写真のサイズは2種類だけ
       __photo … 縦位置 4:5。1枚ずつ、どのセクションでも同じ幅・同じ位置
       __item  … 単品 1:1。__grid の中で同じ大きさに並べる（スマホ2列／PC4列）
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. 変数・土台
   -------------------------------------------------------------------------- */
.cch-utsuwa-feature {
  /* 色：背景・文字・線・アクセントの4系統のみ */
  --cch-bg: #faf8f4;          /* 少し温かいオフホワイト。白にするなら #fff */
  --cch-ink: #2b2a27;         /* 本文（墨色に近いダークグレー） */
  --cch-ink-sub: #5a554d;     /* 補足 */
  --cch-line: #d9d3c8;        /* 罫線 */
  --cch-accent: #76614d;      /* 写真の木・土から拾った低彩度の土色。無彩色にするなら #5a554d */
  --cch-photo-bg: #ebe6dc;    /* 画像読み込み前の地色 */

  --cch-gutter: 22px;
  --cch-gap: 14px;                              /* 写真どうしの間隔 */
  --cch-block-gap: 44px;                        /* 文章と写真の間隔 */
  --cch-section-gap: clamp(104px, 15vw, 192px); /* セクションの間隔 */

  --cch-font-serif: "Hiragino Mincho ProN", "Yu Mincho", YuMincho, "Noto Serif JP", "Noto Serif CJK JP", serif;
  --cch-font-sans: "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Yu Gothic Medium", "Yu Gothic", YuGothic, "Noto Sans JP", "Noto Sans CJK JP", Meiryo, sans-serif;

  box-sizing: border-box !important;
  max-width: 1200px !important;
  margin: 0 auto !important;
  padding: clamp(36px, 7vw, 88px) var(--cch-gutter) clamp(96px, 14vw, 176px) !important;
  color: var(--cch-ink) !important;
  background-color: var(--cch-bg) !important;
  /* 背景色だけを左右いっぱいに伸ばす（レイアウト幅は変えない） */
  box-shadow: 0 0 0 100vmax var(--cch-bg) !important;
  clip-path: inset(0 -100vmax) !important;
  font-family: var(--cch-font-sans) !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 2.1 !important;
  letter-spacing: 0.05em !important;
  text-align: left !important;
  -webkit-text-size-adjust: 100% !important;
  text-size-adjust: 100% !important;
  -webkit-font-smoothing: antialiased !important;
}

.cch-utsuwa-feature *,
.cch-utsuwa-feature *::before,
.cch-utsuwa-feature *::after {
  box-sizing: border-box !important;
}

.cch-utsuwa-feature h1,
.cch-utsuwa-feature h2,
.cch-utsuwa-feature p,
.cch-utsuwa-feature figure,
.cch-utsuwa-feature ul,
.cch-utsuwa-feature li,
.cch-utsuwa-feature dl,
.cch-utsuwa-feature dt,
.cch-utsuwa-feature dd {
  margin: 0 !important;
  padding: 0 !important;
}

/* テーマが記事本文の h1 / p / a などに直接かけている文字指定を打ち消し、
   このLPのルート（.cch-utsuwa-feature）の指定を引き継がせる */
.cch-utsuwa-feature h1,
.cch-utsuwa-feature h2,
.cch-utsuwa-feature p,
.cch-utsuwa-feature li,
.cch-utsuwa-feature dt,
.cch-utsuwa-feature dd,
.cch-utsuwa-feature a,
.cch-utsuwa-feature span,
.cch-utsuwa-feature time {
  font-family: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  font-style: normal !important;
  line-height: inherit !important;
  letter-spacing: inherit !important;
  color: inherit !important;
  text-transform: none !important;
  text-align: inherit !important;
  text-indent: 0 !important;
}

.cch-utsuwa-feature div,
.cch-utsuwa-feature header,
.cch-utsuwa-feature section {
  margin: 0 !important;
  padding: 0 !important;
}

/* 文節の途中で折り返さないための塊 */
.cch-utsuwa-feature .cch-utsuwa-feature__nb {
  display: inline-block !important;
}

/* --------------------------------------------------------------------------
   2. レイアウト（スマホ：1列で「文章 → 写真 → 問い」の順）
   -------------------------------------------------------------------------- */
.cch-utsuwa-feature .cch-utsuwa-feature__hero,
.cch-utsuwa-feature .cch-utsuwa-feature__section {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
}

.cch-utsuwa-feature .cch-utsuwa-feature__hero > *,
.cch-utsuwa-feature .cch-utsuwa-feature__section > * {
  min-width: 0 !important;
}

.cch-utsuwa-feature .cch-utsuwa-feature__section {
  margin-top: var(--cch-section-gap) !important;
}

.cch-utsuwa-feature .cch-utsuwa-feature__photo,
.cch-utsuwa-feature .cch-utsuwa-feature__grid,
.cch-utsuwa-feature .cch-utsuwa-feature__question,
.cch-utsuwa-feature .cch-utsuwa-feature__after,
.cch-utsuwa-feature .cch-utsuwa-feature__side {
  margin-top: var(--cch-block-gap) !important;
}

/* --------------------------------------------------------------------------
   3. 写真
   -------------------------------------------------------------------------- */

/* 共通：枠の比率は元画像と同じ（4:5 / 1:1）なのでトリミングは発生しない */
.cch-utsuwa-feature .cch-utsuwa-feature__img {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  border: 0 !important;
  border-radius: 0 !important;
  object-fit: cover !important;
  object-position: 50% 50% !important;
  background-color: var(--cch-photo-bg) !important;
  margin: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
}

/* 縦位置の1枚 */
.cch-utsuwa-feature .cch-utsuwa-feature__photo {
  display: block !important;
  width: 100% !important;
  max-width: 480px !important; /* タブレット幅で大きくなりすぎないように */
}

.cch-utsuwa-feature .cch-utsuwa-feature__photo .cch-utsuwa-feature__img {
  aspect-ratio: 4 / 5 !important;
}

/* 単品を同じ大きさで並べる */
.cch-utsuwa-feature .cch-utsuwa-feature__grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: var(--cch-gap) !important;
}

.cch-utsuwa-feature .cch-utsuwa-feature__item {
  display: block !important;
}

.cch-utsuwa-feature .cch-utsuwa-feature__item .cch-utsuwa-feature__img {
  aspect-ratio: 1 / 1 !important;
}

/* --------------------------------------------------------------------------
   4. 文字
   -------------------------------------------------------------------------- */

/* 日付 */
.cch-utsuwa-feature .cch-utsuwa-feature__date {
  color: var(--cch-accent) !important;
  font-family: var(--cch-font-serif) !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
  letter-spacing: 0.24em !important;
}

/* タイトル（h1） */
.cch-utsuwa-feature .cch-utsuwa-feature__title {
  margin-top: 18px !important;
  color: var(--cch-ink) !important;
  font-family: var(--cch-font-serif) !important;
  font-size: clamp(30px, 2.6vw + 22px, 52px) !important;
  font-weight: 500 !important;
  line-height: 1.55 !important;
  letter-spacing: 0.1em !important;
}

.cch-utsuwa-feature .cch-utsuwa-feature__hero-sub {
  margin-top: 22px !important;
  color: var(--cch-ink) !important;
  font-family: var(--cch-font-serif) !important;
  font-size: clamp(17px, 0.6vw + 15px, 21px) !important;
  line-height: 2 !important;
  letter-spacing: 0.14em !important;
}

/* セクションラベル（番号＋動詞） */
.cch-utsuwa-feature .cch-utsuwa-feature__label {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  margin-bottom: 26px !important;
  color: var(--cch-accent) !important;
  font-size: 13px !important;
  line-height: 1.6 !important;
  letter-spacing: 0.22em !important;
}

.cch-utsuwa-feature .cch-utsuwa-feature__label-num {
  font-family: var(--cch-font-serif) !important;
  letter-spacing: 0.12em !important;
}

.cch-utsuwa-feature .cch-utsuwa-feature__label-num::after {
  content: "" !important;
  display: inline-block !important;
  width: 28px !important;
  height: 1px !important;
  margin-left: 12px !important;
  vertical-align: middle !important;
  background-color: currentColor !important;
  opacity: 0.6 !important;
}

/* 見出し（h2） */
.cch-utsuwa-feature .cch-utsuwa-feature__heading {
  color: var(--cch-ink) !important;
  font-family: var(--cch-font-serif) !important;
  font-size: clamp(23px, 1.5vw + 17px, 34px) !important;
  font-weight: 500 !important;
  line-height: 1.7 !important;
  letter-spacing: 0.08em !important;
}

/* 本文 */
.cch-utsuwa-feature .cch-utsuwa-feature__text {
  max-width: 34em !important;
  margin-top: 1.7em !important;
  color: var(--cch-ink) !important;
  font-size: 16px !important;
  line-height: 2.1 !important;
}

.cch-utsuwa-feature .cch-utsuwa-feature__heading + .cch-utsuwa-feature__text {
  margin-top: 2em !important;
}

.cch-utsuwa-feature .cch-utsuwa-feature__side > .cch-utsuwa-feature__text:first-child {
  margin-top: 0 !important;
}

/* 問いかけ */
.cch-utsuwa-feature .cch-utsuwa-feature__question {
  position: relative !important;
  padding-top: 28px !important;
  color: var(--cch-ink) !important;
  font-family: var(--cch-font-serif) !important;
  font-size: clamp(19px, 1vw + 15px, 25px) !important;
  font-weight: 500 !important;
  line-height: 1.9 !important;
  letter-spacing: 0.1em !important;
}

.cch-utsuwa-feature .cch-utsuwa-feature__question::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 44px !important;
  height: 1px !important;
  background-color: var(--cch-accent) !important;
}

/* --------------------------------------------------------------------------
   5. 03 手に取る：動詞のリスト
   -------------------------------------------------------------------------- */
.cch-utsuwa-feature .cch-utsuwa-feature__verbs {
  list-style: none !important;
  border-top: 1px solid var(--cch-line) !important;
}

.cch-utsuwa-feature .cch-utsuwa-feature__verb {
  padding: 17px 0 16px !important;
  border-bottom: 1px solid var(--cch-line) !important;
  list-style: none !important;
  font-family: var(--cch-font-serif) !important;
  font-size: clamp(18px, 0.6vw + 16px, 21px) !important;
  line-height: 1.8 !important;
  letter-spacing: 0.1em !important;
}

.cch-utsuwa-feature .cch-utsuwa-feature__verb::before {
  content: none !important; /* テーマ側の箇条書き装飾を打ち消す */
}

.cch-utsuwa-feature .cch-utsuwa-feature__verbs + .cch-utsuwa-feature__text {
  margin-top: 2.2em !important;
}

/* --------------------------------------------------------------------------
   6. 05 知る：産地・素材・形
   -------------------------------------------------------------------------- */
.cch-utsuwa-feature .cch-utsuwa-feature__know-list {
  margin-top: 44px !important;
  border-top: 1px solid var(--cch-line) !important;
}

.cch-utsuwa-feature .cch-utsuwa-feature__know-item {
  display: grid !important;
  grid-template-columns: 4.5em minmax(0, 1fr) !important;
  column-gap: 12px !important;
  align-items: baseline !important;
  padding: 18px 0 17px !important;
  border-bottom: 1px solid var(--cch-line) !important;
}

.cch-utsuwa-feature .cch-utsuwa-feature__know-term {
  color: var(--cch-accent) !important;
  font-family: var(--cch-font-serif) !important;
  font-size: 15px !important;
  line-height: 1.9 !important;
  letter-spacing: 0.2em !important;
}

.cch-utsuwa-feature .cch-utsuwa-feature__know-desc {
  font-size: 16px !important;
  line-height: 1.9 !important;
}

.cch-utsuwa-feature .cch-utsuwa-feature__know-note {
  display: block !important;
  margin-top: 6px !important;
  color: var(--cch-ink-sub) !important;
  font-size: 15px !important;
  line-height: 1.9 !important;
}

.cch-utsuwa-feature .cch-utsuwa-feature__know-list + .cch-utsuwa-feature__text {
  margin-top: 2.4em !important;
}

/* --------------------------------------------------------------------------
   7. ENDING：開催情報とCTA
   -------------------------------------------------------------------------- */
.cch-utsuwa-feature .cch-utsuwa-feature__side--info {
  margin-top: 56px !important;
  padding-top: 32px !important;
  border-top: 1px solid var(--cch-line) !important;
}

.cch-utsuwa-feature .cch-utsuwa-feature__info {
  margin-top: 20px !important;
}

.cch-utsuwa-feature .cch-utsuwa-feature__info-row {
  display: grid !important;
  grid-template-columns: 4.5em minmax(0, 1fr) !important;
  column-gap: 12px !important;
  align-items: baseline !important;
  padding: 6px 0 !important;
}

.cch-utsuwa-feature .cch-utsuwa-feature__info-term {
  color: var(--cch-ink-sub) !important;
  font-size: 14px !important;
  line-height: 1.9 !important;
  letter-spacing: 0.16em !important;
}

.cch-utsuwa-feature .cch-utsuwa-feature__info-desc {
  font-size: 16px !important;
  line-height: 1.9 !important;
}

.cch-utsuwa-feature .cch-utsuwa-feature__cta {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 24px !important;
  width: 100% !important;
  max-width: 340px !important;
  min-height: 60px !important;
  margin-top: 36px !important;
  padding: 16px 24px !important;
  border: 1px solid var(--cch-ink) !important;
  color: var(--cch-ink) !important;
  background-color: transparent !important;
  font-family: var(--cch-font-serif) !important;
  font-size: 16px !important;
  line-height: 1.6 !important;
  letter-spacing: 0.16em !important;
  text-decoration: none !important;
  transition: color 0.5s ease, background-color 0.5s ease !important;
}

.cch-utsuwa-feature .cch-utsuwa-feature__cta-arrow {
  position: relative !important;
  flex: 0 0 auto !important;
  width: 30px !important;
  height: 1px !important;
  background-color: currentColor !important;
  transition: transform 0.5s ease !important;
}

.cch-utsuwa-feature .cch-utsuwa-feature__cta-arrow::after {
  content: "" !important;
  position: absolute !important;
  top: -3px !important;
  right: 0 !important;
  width: 7px !important;
  height: 7px !important;
  border-top: 1px solid currentColor !important;
  border-right: 1px solid currentColor !important;
  transform: rotate(45deg) !important;
}

.cch-utsuwa-feature .cch-utsuwa-feature__cta:focus-visible {
  outline: 2px solid var(--cch-accent) !important;
  outline-offset: 4px !important;
}

@media (hover: hover) {
  .cch-utsuwa-feature .cch-utsuwa-feature__cta:hover {
    color: var(--cch-bg) !important;
    background-color: var(--cch-ink) !important;
  }

  .cch-utsuwa-feature .cch-utsuwa-feature__cta:hover .cch-utsuwa-feature__cta-arrow {
    transform: translateX(4px) !important;
  }
}

/* --------------------------------------------------------------------------
   8. タブレット（600px〜）
   -------------------------------------------------------------------------- */
@media (min-width: 600px) {
  .cch-utsuwa-feature {
    --cch-gutter: 40px;
    --cch-gap: 20px;
    --cch-block-gap: 52px;
  }
}

/* --------------------------------------------------------------------------
   9. PC（900px〜）：左右2列。左に文章、右に写真。単品は4列
   -------------------------------------------------------------------------- */
@media (min-width: 900px) {
  .cch-utsuwa-feature {
    --cch-gap: 24px;
    --cch-block-gap: 64px;
  }

  .cch-utsuwa-feature .cch-utsuwa-feature__hero,
  .cch-utsuwa-feature .cch-utsuwa-feature__section {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    column-gap: var(--cch-gap) !important;
  }

  .cch-utsuwa-feature .cch-utsuwa-feature__section {
    grid-template-rows: auto 1fr !important;
  }

  .cch-utsuwa-feature .cch-utsuwa-feature__text,
  .cch-utsuwa-feature .cch-utsuwa-feature__know-desc,
  .cch-utsuwa-feature .cch-utsuwa-feature__info-desc {
    font-size: 17px !important;
  }

  .cch-utsuwa-feature .cch-utsuwa-feature__label {
    margin-bottom: 32px !important;
  }

  /* 左列：文章・問い・動詞リスト */
  .cch-utsuwa-feature .cch-utsuwa-feature__hero-head,
  .cch-utsuwa-feature .cch-utsuwa-feature__body,
  .cch-utsuwa-feature .cch-utsuwa-feature__question,
  .cch-utsuwa-feature .cch-utsuwa-feature__after {
    grid-column: 1 !important;
  }

  .cch-utsuwa-feature .cch-utsuwa-feature__hero-head {
    align-self: center !important;
  }

  .cch-utsuwa-feature .cch-utsuwa-feature__question,
  .cch-utsuwa-feature .cch-utsuwa-feature__after {
    align-self: start !important;
  }

  /* 右列：縦位置の写真（どのセクションも同じ幅・同じ位置） */
  .cch-utsuwa-feature .cch-utsuwa-feature__photo {
    grid-column: 2 !important;
    grid-row: 1 / span 2 !important;
    max-width: none !important;
    margin-top: 0