/*
 * ======================================
 * 追加クラス一覧（共通SCSS取り込み検討用）
 * ======================================
 *
 * 【site.css（全ページ共通）】
 * .btn-pill--okadasen(-lg/-xl/-tint/-submit) - btn-pill の値差分（1.5px枠・角丸999px・#fff/#efe9f3地・hover #efe9f3/#e4dbec）
 * .okadasen-container--1200 / --880           - container の幅バリエーション（読み物系）
 * .okadasen-washi                             - 和紙テクスチャ帯（#f2efe7 + bg_washi.png 乗算）
 * .okadasen-seigaiha(--footer/--kodawari)     - 青海波の円形あしらい（CSS gradient）
 * .okadasen-vttl / __ja / __en (--stretch)    - 縦書き見出し（日本語＋英字ラベル横並び）
 * .okadasen-ttl__en / __ja                    - 横書き見出し（英字ラベル13px上置き＋日本語）
 * .okadasen-stack(--1em)                      - 段落の縦積み（gap 1.2em / 1em）
 * .okadasen-intro                             - 下層ページのリード文
 * .okadasen-frame-box                         - 二重罫（border＋outline -8px）の白ボックス
 * .okadasen-header / __inner / __nav / __right / __tel / __cta - ヘッダーの値差分（sticky・96%幅）
 * .okadasen-logo / __mark / __name / __sub    - ロゴ（マーク＋社名＋英字）
 * .okadasen-nav-toggle                         - 丸枠のハンバーガー（開くと×）
 * .okadasen-sp-nav / __cta / __tel            - ヘッダー直下に開くSPメニュー
 * .okadasen-footer / __inner / __left / __logo / __name / __info / __label / __tel / __nav / __bottom - フッター
 * .okadasen-page-hero / __glow / __inner / __kanji / __body / __en / __title - 下層ヒーロー（大漢字＋紫ドット＋パンくず）
 * .okadasen-field / __label, .okadasen-req(--opt), .okadasen-input(--textarea/--zip), .okadasen-choice / __item - フォーム部品
 * .okadasen-privacy / __head, .okadasen-privacy-box - 個人情報保護方針のスクロール枠（本文は includes/privacy.php）
 * .okadasen-agree                            - 個人情報保護方針への同意チェック
 * [data-hidden]                              - JS表示切替用の初期非表示
 *
 * 【ページ固有CSS】
 * top-custom.css      : .okadasen-mv / -top-news / -news-list / -about / -kodawari / -top-products / -marquee / -top-business / -link-line / -top-shops
 * products-custom.css : .okadasen-products / -product / -spec / -badge-new / -delivery
 * order-custom.css    : .okadasen-order-* / -flow / -form-ttl / -select
 * business-custom.css : .okadasen-biz-intro / -materials / -biz-cols / -biz-contact
 * company-custom.css  : .okadasen-greeting / -company-sec / -dl / -map / -direct / -shops / -shop
 * contact-custom.css  : .okadasen-contact / -form
 * news-custom.css     : .okadasen-news-layout / -news-main / -news-list-page / -pagination / -news-side / -entry（news.php・entry.php 共用）
 *
 * ======================================
 * 共通SCSSに不足していたもの
 * ======================================
 *
 * ■ 値の粒度不足
 *   - mt/mb/gap/fz の刻みに clamp() 値・4/6/12/14/16/18/22/24/26/28/32/36px が無い（デザインは連続値＋clamp で指定）
 *   - 40px以上の余白 utility が tablet で自動半減するため、半減しない固定値は site 側で指定
 *   - ls utility に .06em/.08em/.12em/.14em/.24em/.3em が無い
 *   - container が 1200px 固定・左右 padding なし（本案件は 1400px＋clamp(20px,5vw,40px)）→ $width_base 上書き＋site で padding
 * ■ 指定方向不足
 *   - object-position の任意値（50% 62% 等）を指定する utility が無い
 * ■ 状態不足
 *   - hover で背景のみ変える pill ボタン（文字色固定）が無い（btn-pill--outline は反転）
 *   - 現在地の下線を「全幅・常時表示」にする header__nav-item--current のバリエーションが無い
 * ■ 構造不足
 *   - 縦書き（writing-mode）見出しで日英を横並びにする heading（heading-vertical は absolute 前提）
 *   - 下層ヒーローの「大漢字＋英字＋h1＋パンくず」型（page-hero は写真／ベタ塗り前提）
 *   - SPメニューを「ヘッダー直下に開くパネル」にする sp-nav のバリエーション（既定は全画面オーバーレイ）
 *   - ヘッダーが sticky（header-bar は fixed、header-sticky は JS 切替）
 *   - flex-basis＋wrap で折り返す2カラム（column2 は %幅＋tablet で縦積み）
 * ■ 装飾パターン不足
 *   - 和紙テクスチャ乗算帯／青海波の円形あしらい／市松（repeating-conic-gradient）
 *   - 二重罫ボックス（border＋outline-offset）
 *
 */

/* ==========================================================================
   Base（claude-design-output 実数値：本文 Zen Old Mincho 500 / 17px / lh2 / ls.06em）
   ========================================================================== */
body {
  font-weight: 500;
}
/* main.css の tablet:1.4rem / sp:1.2rem 縮小を打ち消す（デザインは全幅で17px固定） */
@media (max-width: 896px) {
  body { font-size: 1.7rem; }
}
/* SP（639px以下）：本文を16px・行間1.9に（控えめな調整） */
@media (max-width: 639px) {
  body {
    font-size: 1.6rem;
    line-height: 1.9;
  }
}
a {
  color: #6b5180;
  text-underline-offset: 3px;
}
a:hover {
  color: #9477a7;
  opacity: 1;
}
input, select, textarea, button {
  font-family: inherit;
}

/* container：max-width 1400px（box）＋左右 clamp(20px,5vw,40px) */
.container,
.container-narrow {
  padding-left: clamp(20px, 5vw, 40px);
  padding-right: clamp(20px, 5vw, 40px);
}
@media (max-width: 1320px) {
  .container { max-width: 1400px; }
}
@media (max-width: 639px) {
  .container-narrow { max-width: 960px; }
}
.okadasen-container--1200 { max-width: 1200px; }
.okadasen-container--880 { max-width: 880px; }

/* 和紙テクスチャ帯（#f2efe7 + bg_washi.png 乗算） */
.okadasen-washi {
  background: url(https://ros-cdn.s3.ap-northeast-1.amazonaws.com/hp/img/ros_keiyaku/28780/bg_washi.png) center center / cover #f2efe7;
  background-blend-mode: multiply;
}

/* 青海波の円形あしらい */
.okadasen-seigaiha {
  position: absolute;
  border-radius: 50%;
  background-color: #f2efe7;
  background-image:
    radial-gradient(circle at 100% 150%, #f2efe7 24%, #c7b6d3 24%, #c7b6d3 28%, #f2efe7 28%, #f2efe7 36%, #c7b6d3 36%, #c7b6d3 40%, transparent 40%),
    radial-gradient(circle at 0 150%, #f2efe7 24%, #c7b6d3 24%, #c7b6d3 28%, #f2efe7 28%, #f2efe7 36%, #c7b6d3 36%, #c7b6d3 40%, transparent 40%),
    radial-gradient(circle at 50% 100%, #c7b6d3 10%, #f2efe7 10%, #f2efe7 23%, #c7b6d3 23%, #c7b6d3 30%, #f2efe7 30%, #f2efe7 43%, #c7b6d3 43%, #c7b6d3 50%, #f2efe7 50%, #f2efe7 63%, #c7b6d3 63%, #c7b6d3 71%, transparent 71%),
    radial-gradient(circle at 100% 50%, #c7b6d3 5%, #f2efe7 5%, #f2efe7 15%, #c7b6d3 15%, #c7b6d3 20%, #f2efe7 20%, #f2efe7 29%, #c7b6d3 29%, #c7b6d3 34%, #f2efe7 34%, #f2efe7 44%, #c7b6d3 44%, #c7b6d3 49%, transparent 49%),
    radial-gradient(circle at 0 50%, #c7b6d3 5%, #f2efe7 5%, #f2efe7 15%, #c7b6d3 15%, #c7b6d3 20%, #f2efe7 20%, #f2efe7 29%, #c7b6d3 29%, #c7b6d3 34%, #f2efe7 34%, #f2efe7 44%, #c7b6d3 44%, #c7b6d3 49%, transparent 49%);
  background-size: 44px 22px;
}
.okadasen-seigaiha--footer { right: -40px; top: -40px; width: 180px; height: 180px; }
.okadasen-seigaiha--kodawari { left: -40px; bottom: 120px; width: 160px; height: 160px; }

/* ==========================================================================
   Button（btn-pill ベース：1.5px #9477a7 枠・角丸999px・#6b5180 700・末尾「›」）
   ========================================================================== */
.btn-pill--okadasen {
  gap: 14px;
  min-height: 52px;
  padding: 0 30px;
  border: 1.5px solid #9477a7;
  border-radius: 999px;
  background: #fff;
  color: #6b5180;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.1em;
  line-height: normal;
  text-align: center;
  transition: none;
}
.btn-pill--okadasen:hover {
  background: #efe9f3;
  color: #6b5180;
  opacity: 1;
}
.btn-pill--okadasen-lg { min-height: 56px; padding: 0 32px; }
.btn-pill--okadasen-xl { min-height: 60px; padding: 0 44px; font-size: 17px; letter-spacing: 0.12em; }
/* 送信ボタン（#efe9f3 地 → hover #e4dbec） */
.btn-pill--okadasen-tint { background: #efe9f3; }
.btn-pill--okadasen-tint:hover { background: #e4dbec; }
.btn-pill--okadasen-submit {
  min-height: 64px;
  min-width: min(340px, 100%);
  padding: 0 44px;
  font-size: 18px;
  letter-spacing: 0.14em;
  cursor: pointer;
}

/* ==========================================================================
   Heading
   ========================================================================== */
/* 縦書き：日本語＋英語ラベル横並び */
.okadasen-vttl {
  display: flex;
  gap: 4px;
  align-items: flex-start;
}
.okadasen-vttl--stretch { align-items: stretch; }
.okadasen-vttl__ja {
  margin: 0;
  writing-mode: vertical-rl;
  font-size: clamp(22px, 2.4vw, 28px);
  font-weight: 700;
  letter-spacing: 0.3em;
  line-height: 1.2;
}
.okadasen-vttl__ja--26 { font-size: 26px; }
.okadasen-vttl__ja--28 { font-size: 28px; }
.okadasen-vttl__en {
  writing-mode: vertical-rl;
  font-family: "Peddana", serif;
  font-size: 13px;
  letter-spacing: 0.3em;
  line-height: 1;
  color: #6b5180;
}

/* 横書き：英語ラベル（上）＋日本語見出し（下） */
.okadasen-ttl__en {
  margin-bottom: 4px;
  font-family: "Peddana", serif;
  font-size: 13px;
  letter-spacing: 0.3em;
  line-height: 1;
  color: #6b5180;
}
.okadasen-ttl__ja {
  margin: 0;
  font-size: clamp(22px, 2.4vw, 28px);
  font-weight: 700;
  letter-spacing: 0.14em;
  line-height: 1.3;
}

/* ==========================================================================
   Header（sticky / 幅96% / padding 12px 0 / gap 24px / 1079px でSP切替）
   ========================================================================== */
.okadasen-header {
  position: sticky;
  top: 0;
  z-index: 50;
  background: rgba(246, 245, 239, 0.96);
  box-shadow: none;
}
.okadasen-header__inner {
  gap: 24px;
  width: 96%;
  max-width: none;
  height: auto;
  margin: 0 auto;
  padding: 12px 0;
  border-bottom: 1px solid #e2d9c6;
}
.okadasen-logo {
  flex-shrink: 1; /* header__logo の flex-shrink:0 を戻す（狭幅で社名を折り返す） */
  gap: 12px;
  color: #282828;
  font-size: 13.3333px;
  font-weight: 400;
  line-height: normal;
  letter-spacing: normal;
  text-decoration: none;
}
.okadasen-logo:hover { color: #282828; }
.okadasen-logo .okadasen-logo__mark {
  display: block;
  flex: 0 0 auto;
  width: 46px;
  height: 46px;
  object-fit: contain;
}
.okadasen-logo .header-logo__body { line-height: 1.3; }
.okadasen-logo__name {
  color: #282828;
  font-size: 17px;
  font-weight: 700;
  letter-spacing: 0.08em;
  line-height: 1.3;
}
.okadasen-logo__sub {
  color: #6b5180;
  font-family: "Peddana", serif;
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0.12em;
}

.okadasen-header__nav {
  gap: clamp(14px, 1.6vw, 26px);
  margin-right: 0;
}
.okadasen-header__nav .header__nav-item a {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  padding: 8px 0;
  color: #282828;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.08em;
  line-height: normal;
  transition: none;
}
.okadasen-header__nav .header__nav-item a:hover { color: #6b5180; }
.okadasen-header__nav .header__nav-item a::after { display: none; }
.okadasen-header__nav .header__nav-item--current a::after {
  display: block;
  left: 0;
  right: 0;
  bottom: 2px;
  width: auto;
  height: 2px;
  background: #9477a7;
  transform: none;
  transition: none;
}
.okadasen-header__nav .header__nav-ja {
  margin-top: 0;
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
}

.okadasen-header__right {
  gap: 16px;
  height: auto;
  margin-left: 8px;
}
.okadasen-header__tel {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  line-height: 1.2;
}
.okadasen-header__tel-label {
  color: #57524a;
  font-size: 11px;
  letter-spacing: 0.1em;
}
.okadasen-header__tel .header__tel {
  color: #282828;
  font-size: 24px;
  font-weight: 500;
  letter-spacing: 0.06em;
}
.okadasen-header__tel .header__tel::before { display: none; }
.okadasen-header__tel .header__tel:hover { color: #282828; opacity: 1; }
.okadasen-header__cta {
  flex-direction: row;
  height: auto;
  min-height: 52px;
  padding: 0 26px;
  font-size: 15px;
}

/* SP（1079px以下）：社名を1行で表示＋右端の丸ボタン（nav-toggle）分の余白を確保 */
@media (max-width: 1079px) {
  .okadasen-header__inner { padding-right: 60px; } /* トグル 48px + 余白 12px */
  .okadasen-logo__name,
  .okadasen-logo__sub { white-space: nowrap; }
  .okadasen-logo__name { font-size: min(17px, 4.4vw); } /* 狭い端末（〜385px）は1行に収まるよう縮小 */
}
/* ハンバーガー（丸枠・3本線 → 開くと×） */
.okadasen-nav-toggle {
  top: calc((var(--okadasen-header-h, 71px) - 1px - 48px) / 2); /* ヘッダー行の上下中央（header高さはJSで取得） */
  right: 2%;
  width: 48px;
  height: 48px;
  border: 1.5px solid #9477a7;
  border-radius: 50%;
  background: #fff;
  backdrop-filter: none;
}
.okadasen-nav-toggle .nav-toggle__line {
  width: 20px;
  background: #6b5180;
}
.okadasen-nav-toggle .nav-toggle__line:nth-child(1) { top: 15px; }
.okadasen-nav-toggle .nav-toggle__line:nth-child(2) { top: 22px; }
.okadasen-nav-toggle .nav-toggle__line:nth-child(3) { top: 29px; }
.okadasen-nav-toggle.is-active .nav-toggle__line:nth-child(1),
.okadasen-nav-toggle.is-active .nav-toggle__line:nth-child(3) { top: 22px; }

/* SPメニュー：ヘッダー直下に開くパネル */
.okadasen-sp-nav {
  top: var(--okadasen-header-h, 73px); /* ヘッダー直下（12 + 48 + 12 + border 1） */
  bottom: auto;
  max-height: calc(100vh - var(--okadasen-header-h, 73px));
  align-items: stretch;
  justify-content: flex-start;
  padding: 12px 20px 28px;
  border-top: 1px solid #e2d9c6;
  background: #f6f5ef;
  transition: none;
}
.okadasen-sp-nav .sp-nav__list {
  max-width: none;
  text-align: left;
}
.okadasen-sp-nav .sp-nav__item,
.okadasen-sp-nav .sp-nav__item:first-child {
  border: 0;
  opacity: 1;
  transform: none;
  transition: none;
}
.okadasen-sp-nav .sp-nav__link {
  min-height: 56px;
  padding: 0 4px;
  border-bottom: 1px solid #e2d9c6;
  color: #282828;
  font-size: 17px;
  font-weight: 700;
  letter-spacing: 0.1em;
  line-height: normal;
  transition: none;
}
.okadasen-sp-nav .sp-nav__link::after {
  content: "›";
  color: #9477a7;
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  opacity: 1;
}
.okadasen-sp-nav .sp-nav__link:hover { background: none; }
.okadasen-sp-nav .sp-nav__bottom {
  display: flex;
  flex-direction: column;
  max-width: none;
  margin-top: 0;
  opacity: 1;
  transform: none;
  transition: none;
}
.okadasen-sp-nav__cta {
  margin-top: 20px;
  min-height: 56px;
  font-size: 17px;
}
.okadasen-sp-nav .okadasen-sp-nav__tel {
  display: block;
  margin-top: 12px;
  color: #282828;
  font-size: 26px;
  font-weight: 500;
  letter-spacing: 0.06em;
  text-align: center;
}
.okadasen-sp-nav .okadasen-sp-nav__tel::before { display: none; }

/* ==========================================================================
   Footer
   ========================================================================== */
.okadasen-footer {
  position: relative;
  padding: clamp(56px, 7vw, 88px) 0 28px;
  border-top: 1px solid #e2d9c6;
  overflow: hidden;
}
.okadasen-footer__inner {
  position: relative;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: clamp(32px, 5vw, 64px);
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 clamp(20px, 5vw, 40px);
}
.okadasen-footer__left {
  display: flex;
  flex: 1 1 420px;
  flex-direction: column;
  gap: 18px;
  width: auto;
}
.okadasen-footer__logo {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 0;
}
.okadasen-footer__logo img {
  display: block;
  flex: 0 0 auto;
  width: 52px;
  height: 52px;
  object-fit: contain;
}
.okadasen-footer__name {
  font-size: 20px;
  font-weight: 700;
  letter-spacing: 0.1em;
}
.okadasen-footer__info {
  margin-bottom: 0;
  color: #282828;
  font-size: 15px;
  line-height: 1.9;
}
.okadasen-footer__label {
  margin-right: 12px;
  color: #6b5180;
  font-weight: 700;
}
.okadasen-footer__tel {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 28px;
  font-family: "Peddana", serif;
  font-size: 24px;
  line-height: 1.4;
  letter-spacing: 0.04em;
}
.okadasen-footer__tel a {
  color: #282828;
  text-decoration: none;
}
.okadasen-footer__mail {
  margin-top: -14px; /* 親の gap:18px を打ち消し、TEL/FAX の行間（4px）に揃える */
  font-family: "Peddana", serif;
  font-size: 20px;
  line-height: 1.4;
  letter-spacing: 0.04em;
  overflow-wrap: anywhere;
}
.okadasen-footer__mail a {
  color: #282828;
  text-decoration: none;
}
.okadasen-footer__nav {
  display: grid;
  flex: 0 1 380px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 24px;
  align-content: start;
}
.okadasen-footer__nav .footer-body__nav-item a {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 46px;
  border-bottom: 1px solid #e2d9c6;
  color: #282828;
  font-size: 15px;
  font-weight: 400;
  letter-spacing: normal;
  line-height: normal;
  transition: none;
}
.okadasen-footer__nav .footer-body__nav-item a::before {
  content: "·";
  color: #9477a7;
}
.okadasen-footer__nav .footer-body__nav-item a:hover { color: #6b5180; }
/* SP（639px以下）：フッターナビは非表示（ハンバーガーメニューで代替） */
@media (max-width: 639px) {
  .okadasen-footer__nav { display: none; }
}
.okadasen-footer__bottom {
  position: relative;
  max-width: 1400px;
  margin: 48px auto 0;
  padding: 0 clamp(20px, 5vw, 40px);
  text-align: left;
}
.okadasen-footer__bottom .footer-bottom__copyright {
  padding-top: 20px;
  border-top: 1px solid #d8cfbd;
  color: #57524a;
  font-family: "Peddana", serif;
  font-size: 13px;
  letter-spacing: 0.08em;
}

/* ==========================================================================
   下層ページ ヒーロー（大漢字＋英字＋h1＋パンくず）
   ========================================================================== */
.okadasen-page-hero {
  position: relative;
  padding: clamp(56px, 8vw, 100px) 0 clamp(40px, 5vw, 64px);
  overflow: hidden;
}
.okadasen-page-hero__glow {
  position: absolute;
  right: -10%;
  top: 10%;
  width: 70%;
  height: 260px;
  background: radial-gradient(rgba(217, 186, 127, 0.28), rgba(217, 186, 127, 0) 62%);
}
.okadasen-page-hero__inner {
  position: relative;
  display: flex;
  align-items: flex-end;
  gap: clamp(16px, 3vw, 32px);
}
.okadasen-page-hero__kanji {
  position: relative;
  font-size: clamp(100px, 14vw, 170px);
  font-weight: 900;
  line-height: 1;
}
.okadasen-page-hero__kanji::after {
  content: "";
  position: absolute;
  right: -4px;
  top: 4px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #9477a7;
}
.okadasen-page-hero__body {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding-bottom: 10px;
}
.okadasen-page-hero__en {
  color: #6b5180;
  font-family: "Peddana", serif;
  font-size: 16px;
  letter-spacing: 0.3em;
}
.okadasen-page-hero__title {
  margin: 0;
  font-size: clamp(26px, 3.2vw, 36px);
  font-weight: 700;
  letter-spacing: 0.14em;
  line-height: 1.5;
}
.okadasen-page-hero .breadcrumb {
  padding: 0;
  color: #57524a;
  font-size: 13px;
}
.okadasen-page-hero .breadcrumb__item:not(:last-child)::after {
  content: "　›　";
  margin: 0;
  color: inherit;
}
.okadasen-page-hero .breadcrumb__link {
  color: #6b5180;
  font-weight: 400;
  letter-spacing: normal;
  line-height: normal;
  text-decoration: underline;
}
.okadasen-page-hero .breadcrumb__current { color: #57524a; }

/* 段落スタック（p の縦並び：gap 1.2em / 1em） */
.okadasen-stack {
  display: flex;
  flex-direction: column;
  gap: 1.2em;
  text-wrap: pretty;
}
.okadasen-stack--1em { gap: 1em; }

/* 下層リード文（clamp(18px,1.9vw,21px) / ls .1em） */
.okadasen-intro {
  margin-bottom: clamp(48px, 6vw, 80px);
  font-size: clamp(18px, 1.9vw, 21px);
  letter-spacing: 0.1em;
  line-height: 2;
  text-wrap: pretty;
}

/* 二重罫の白枠ボックス（1px枠＋内側8pxにoutline） */
.okadasen-frame-box {
  border: 1px solid #9477a7;
  outline: 1px solid #9477a7;
  outline-offset: -8px;
  background: #fff;
}

/* ==========================================================================
   Form（ご注文・お問い合わせ共通）
   ========================================================================== */
.okadasen-field {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.okadasen-field__label { font-weight: 700; }
.okadasen-req {
  margin-left: 8px;
  padding: 0 8px;
  border: 1px solid #9477a7;
  color: #6b5180;
  font-size: 12px;
}
.okadasen-req--opt {
  border-color: #c9bfa9;
  color: #57524a;
}
.okadasen-input {
  min-height: 54px;
  padding: 12px 16px;
  border: 1px solid #d8cfbd;
  border-radius: 2px;
  background: #fff;
  color: #282828;
  font-size: 17px;
  font-weight: 400;
  letter-spacing: normal;
  line-height: normal;
  transition: none;
}
.okadasen-input:focus { border-color: #d8cfbd; outline: auto; }
.okadasen-input--textarea {
  min-height: 0;
  line-height: 1.8;
}
.okadasen-input--zip { max-width: 220px; }
/* 選択肢（ラジオ）カード */
.okadasen-choice { gap: 12px; }
.okadasen-choice__item {
  flex: 1 1 220px;
  gap: 12px;
  min-height: 58px;
  padding: 0 20px;
  border: 1px solid #d8cfbd;
  background: #fff;
  font-size: inherit;
}
.okadasen-choice__item input {
  width: 22px;
  height: 22px;
  accent-color: #9477a7;
}

/* 個人情報保護方針（スクロール枠内テキスト） */
.okadasen-privacy {
  max-height: 400px;
  padding-right: 8px;
  overflow-y: auto;
}
.okadasen-privacy p { text-wrap: pretty; }
.okadasen-privacy .okadasen-privacy__head {
  margin: 20px 0 4px;
  color: #282828;
  font-weight: 700;
}
.okadasen-privacy-box {
  padding: clamp(24px, 3vw, 36px);
  border: 1px solid #d8cfbd;
  background: #fff;
  color: #57524a;
  font-size: 15px;
  line-height: 1.9;
}

/* data-hidden：JSで表示切替する要素の初期非表示（お届け先2・3件目 等） */
[data-hidden] { display: none; }

/* 個人情報保護方針への同意チェック（form-checkbox ベース） */
.okadasen-agree {
  justify-content: center;
  gap: 10px;
  margin-top: 20px;
  font-size: 15px;
}
.okadasen-agree input {
  width: 20px;
  height: 20px;
  accent-color: #9477a7;
}

/* ==========================================================================
   SP の改行調整
   ========================================================================== */
/* CMS から入る短いテキスト（記事タイトル等）は文節で改行（対応ブラウザのみ。非対応は通常改行） */
.news-list__title,
.breadcrumb__current,
.okadasen-entry__title,
.okadasen-news-side__title {
  word-break: auto-phrase;
  text-wrap: pretty;
}

/* ==========================================================================
   OP演出（ローダー）：ロゴがじんわり現れ → 全体がゆっくりフェードアウト
   JS不要（CSSアニメーションのみで自動で消える）。2ページ目以降は head 内スクリプトで .is-op-skip を付けて非表示
   ========================================================================== */
.okadasen-loader {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #f6f5ef;
  animation: okadasenLoaderOut 1.2s ease 2.4s forwards; /* ロゴ表示（0.2〜1.6s）→ 少し留めて 2.4s からフェードアウト */
}
.okadasen-loader__logo {
  width: 96px;
  height: auto;
  opacity: 0;
  animation: okadasenLoaderLogo 1.4s ease 0.2s forwards;
}
.is-op-skip .okadasen-loader { display: none; }
@keyframes okadasenLoaderLogo {
  from { opacity: 0; transform: scale(0.96); }
  to   { opacity: 1; transform: scale(1); }
}
@keyframes okadasenLoaderOut {
  to { opacity: 0; visibility: hidden; }
}

/* ==========================================================================
   スクロールでじんわりフェードイン（js/common.js が .okadasen-fade を付与）
   ========================================================================== */
.okadasen-fade {
  opacity: 0;
  transform: translateY(16px);
  transition: opacity 1.4s ease, transform 1.4s ease;
}
.okadasen-fade.is-inview {
  opacity: 1;
  transform: none;
}

/* 動きを減らす設定の端末では演出なし */
@media (prefers-reduced-motion: reduce) {
  .okadasen-loader { display: none; }
  .okadasen-fade { opacity: 1; transform: none; transition: none; }
}