@charset "UTF-8";
/* ===================================================
   おせちメンバーズ限定ページ専用CSS（page-osechi-members.php）
   - ヘッダー・ヒーロー・タイトル・仕様表・会員ログイン・フッターは
     osechi-landing.css（おせち一段重ページ）をそのまま使う。
   - このファイルは「商品ブロック（鶴・亀・寿・竹茂楼一段）」だけを定義する。
   - 必ず osechi-landing.css より後に読み込むこと。
   =================================================== */

body.osechi-members {
  /* 鶴・亀・寿・竹茂楼一段（商品名）= HGS教科書体。Windows標準。未搭載環境は明朝系で代用 */
  --om-kyokasho: "HGSKyokashotai", "HGS教科書体", "HGPKyokashotai", "HGKyokashotai", "UD Digi Kyokasho NK-R", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;
  /* 美濃吉メンバーズクラブ会員様 限定・その他の文字 = BIZ UDPゴシック。Windows標準。未搭載環境はゴシック体で代用 */
  --om-gothic: "BIZ UDPGothic", "BIZ UDPゴシック", "BIZ UDGothic", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Yu Gothic", "游ゴシック", Meiryo, sans-serif;
  /* TSURU・KAME・KOTOBUKI = 小塚明朝 Pro。Adobe製品フォント。未搭載環境は明朝系で代用 */
  --om-mincho: "Kozuka Mincho Pro R", "Kozuka Mincho Pro", "小塚明朝 Pro R", "小塚明朝 Pro", "KozMinPro-Regular", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;
}

/* ===================================================
   商品ブロック（共通）
   =================================================== */
.om-items {
  margin-top: 46px;      /* 説明文の最終行 → 最初の罫線 = 約86px（カンプ実測。.ol-description の下余白40pxと合わせる） */
  margin-bottom: 56px;   /* 最後の罫線 → 仕様表（.ol-specs の上余白30pxと合わせて約86px） */
}
/* 罫線（上）→ 89px → 写真＋パネル → 品書き → 86px → 罫線 */
.om-item {
  max-width: 1100px;
  margin: 0 auto;
  padding: 88px 0 82px;
  border-top: 1px solid #ccc;
}
.om-item:last-child {
  border-bottom: 1px solid #ccc;
}
/* パネル・見出しの色（カンプ実測）: 鶴・寿 #660066 / 亀 #400040 / 竹茂楼一段 #224100 */
.om-item--tsuru,
.om-item--kotobuki {
  --om-c: #660066;
  --om-btn-text: #a802a8;
}
.om-item--kame {
  --om-c: #400040;
  --om-btn-text: #a802a8;
}
.om-item--ichidan {
  --om-c: #224100;
  --om-btn-text: #224100;
}

/* 写真（左）＋パネル（右）。各550px・高さ409px */
.om-card {
  display: flex;
  align-items: stretch;
  text-align: left;
}
.om-photo {
  flex: 0 0 50%;
  background: #f0efde;
}
.om-photo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.om-panel {
  flex: 1 1 50%;
  min-height: 409px;
  padding: 51px 30px 0 52px;
  background: var(--om-c);
  color: #fff;
  font-family: var(--om-gothic);
}

/* 美濃吉メンバーズクラブ会員様 限定 */
.om-label {
  margin: 0;
  color: #ffffbd;
  font-size: 16px;
  font-weight: bold;
  line-height: 18px;
  letter-spacing: 0.025em;
}

/* 鶴  TSURU  二段重・36品目 */
.om-name {
  display: flex;
  align-items: center;
  margin: 17px 0 0;
  font-weight: normal;
  line-height: 1;
}
.om-name-ja {
  font-family: var(--om-kyokasho);
  font-size: 64px;
  line-height: 1;
  color: #fff;
}
.om-name-en {
  flex: 0 0 auto;
  width: 92px;                /* 鶴・亀: 商品名の右端から「二段重…」の開始位置までを揃える */
  margin-left: 13px;
  font-family: var(--om-mincho);
  font-size: 16px;
  letter-spacing: 0.22em;
  color: #e0d0e0;
}
.om-item--kotobuki .om-name-en {
  width: 148px;               /* KOTOBUKI は長いため幅を広げる（カンプ実測） */
}
.om-name-unit {
  font-family: var(--om-gothic);
  font-size: 16px;
  color: #fff;
  letter-spacing: 0;
}
/* 竹茂楼 一段 は文字数が多いため小さめ（カンプ実測: 字高約45px） */
.om-item--ichidan .om-name {
  margin-top: 23px;
}
.om-item--ichidan .om-name-ja {
  font-size: 48px;
  margin-right: 28px;
}

/* ・特別謝恩価格：59,400円（税込） など */
.om-info {
  margin: 12px 0 0;
  padding: 0;
  list-style: none;
}
.om-info li {
  font-size: 15px;
  line-height: 30px;
  letter-spacing: 0;
  color: #fff;
}
.om-item--ichidan .om-info {
  margin-top: 22px;           /* 商品名が小さい分だけ余白を足し、情報行の位置は全商品で揃える */
}
.om-price {
  color: #ffffbd;
  font-size: 17px;
  font-weight: normal;
  letter-spacing: -0.03em;
}

/* ボタン＋注意書き（callItem の出力を整える。Welcart標準のクラス名に合わせる） */
.om-cart {
  margin-top: 36px;
}
.om-cart article,
.om-cart form {
  margin: 0;
  padding: 0;
}
.om-cart div.fix {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.om-cart .btnArea {
  order: 1;
  list-style: none;
  display: flex;
  gap: 10px;
  margin: 0 0 0 2px;
  padding: 0;
}
.om-cart .btnArea li {
  list-style: none;
}
.om-cart .hide {
  display: none;
}
.om-cart .skuquantity {
  display: none;
}
/* カートに入れる（クリーム地・パネル色の文字）/ ＦＡＸ注文用紙（グレー地・黒文字）。各150×41px */
.om-cart .skubutton,
body.osechi-landing .om-cart .btnArea li:nth-child(2) a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 150px;
  height: 41px;
  margin: 0;
  padding: 0;
  border: none;
  border-radius: 0;
  font-family: var(--om-gothic);
  font-size: 14px;
  font-weight: bold;
  line-height: 1;
  letter-spacing: 0.1em;
  text-decoration: none;
  cursor: pointer;
  transition: opacity 0.3s;
}
.om-cart .skubutton {
  background: #efe6d6;
  color: var(--om-btn-text);
}
body.osechi-landing .om-cart .btnArea li:nth-child(2) a {
  background: #ccc;
  color: #000;
}
.om-cart .btnArea li:nth-child(2) a img {
  display: none;
}
.om-cart .btnArea li:nth-child(2) a::after {
  content: '\FF26\FF21\FF38注文用紙';   /* ＦＡＸ注文用紙 */
}
.om-cart .skubutton:hover,
body.osechi-landing .om-cart .btnArea li:nth-child(2) a:hover {
  opacity: 0.75;
}
.om-cart .notice {
  order: 2;
  margin: 17px 0 0;
  font-family: var(--om-gothic);
  font-size: 12.5px;
  line-height: 18px;
  letter-spacing: 0;
  color: #fff;
}

/* 品書き（《 一の重 》 ・・・） */
.om-menu {
  margin-top: 24px;
  text-align: center;
  font-family: var(--om-gothic);
}
.om-juu + .om-juu {
  margin-top: 13px;
}
.om-juu-title {
  margin: 0;
  font-family: var(--om-gothic);
  font-size: 15px;
  font-weight: normal;
  line-height: 24px;
  letter-spacing: 0.05em;
  color: var(--om-c);
}
.om-juu-items {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  column-gap: 15px;
  margin: 0;
  padding: 0;
  font-size: 12.5px;
  line-height: 23px;
  letter-spacing: 0;
  color: #333;
}
.om-juu-items span {
  white-space: nowrap;
}

/* ===================================================
   RESPONSIVE (768px and below)
   =================================================== */
@media screen and (max-width: 768px) {
  .om-items {
    margin-top: 20px;
    margin-bottom: 20px;
  }
  .om-item {
    padding: 40px 16px 40px;
  }
  .om-card {
    flex-direction: column;
  }
  .om-photo {
    flex: 0 0 auto;
  }
  .om-photo img {
    height: auto;
  }
  .om-panel {
    min-height: 0;
    padding: 28px 20px 30px;
  }
  .om-label {
    font-size: 14px;
  }
  .om-name {
    flex-wrap: wrap;
    row-gap: 6px;
    margin-top: 12px;
  }
  .om-name-ja {
    font-size: 52px;
  }
  .om-name-en {
    width: auto;
    margin: 0 18px 0 14px;
    font-size: 14px;
  }
  .om-item--kotobuki .om-name-en {
    width: auto;
  }
  .om-name-unit {
    font-size: 16px;
  }
  .om-item--ichidan .om-name {
    margin-top: 12px;
  }
  .om-item--ichidan .om-name-ja {
    font-size: 40px;
    margin-right: 16px;
  }
  .om-info {
    margin-top: 10px;
  }
  .om-item--ichidan .om-info {
    margin-top: 10px;
  }
  .om-info li {
    font-size: 14px;
    line-height: 28px;
  }
  .om-price {
    font-size: 16px;
  }
  .om-cart {
    margin-top: 20px;
  }
  .om-cart .btnArea {
    gap: 8px;
  }
  .om-cart .skubutton,
  body.osechi-landing .om-cart .btnArea li:nth-child(2) a {
    width: 140px;
    font-size: 13px;
  }
  .om-cart .notice {
    font-size: 12px;
  }
  .om-menu {
    margin-top: 18px;
  }
  .om-juu-title {
    font-size: 14px;
  }
  .om-juu-items {
    column-gap: 12px;
    font-size: 12px;
    line-height: 22px;
  }
}

/* ===================================================
   VERY SMALL SCREENS (480px and below)
   =================================================== */
@media screen and (max-width: 480px) {
  .om-name-ja {
    font-size: 44px;
  }
  .om-item--ichidan .om-name-ja {
    font-size: 34px;
  }
  /* ボタン: 縦並び・高さ34px。パネルの中央に、幅85%（最大300px）で配置 */
  .om-cart .btnArea {
    flex-direction: column;
    align-items: center;
    gap: 8px;
    width: 100%;
    margin-left: 0;
  }
  .om-cart .btnArea li {
    width: 85%;
    max-width: 300px;
  }
  .om-cart .skubutton,
  body.osechi-landing .om-cart .btnArea li:nth-child(2) a {
    width: 100%;
    max-width: none;
    height: 34px;
  }
}

/* ============================================
   外部サイトからの直接カート投入（?cart=キー）の目隠し
   フォーム自動送信までの一瞬、ページ本体を見せないための全画面カバー。
   ============================================ */
body.om-autocart-active {
  overflow: hidden;
}

.om-autocart {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  font-family: var(--om-gothic);
  font-size: 15px;
  letter-spacing: 0.08em;
  color: #333;
}

/* ============================================
   仕様表「送料」「配送について」の商品グループ見出し
   （【鶴・亀・寿】【竹茂楼 一段重】）
   ============================================ */
.ol-specs td .om-area-title {
  display: block;
  margin-top: 0.6em;
  color: #900092;
  font-weight: bold;
}
.ol-specs td .om-area-title:first-child {
  margin-top: 0;
}