@charset "UTF-8";

/* ============================================================================
   orbiter.css
   アクリルSHOPオービター 共通スタイルシート

   設置場所 : FTPで /docs/css/orbiter.css
   参照URL  : https://www.orbiter1.jp/css/orbiter.css
   読み込み : デザイン設定 > テーマ > HTMLのカスタマイズ > headタグへの追記 に
              <link rel="stylesheet" href="https://www.orbiter1.jp/css/orbiter.css?v=20260817">
              ※カート画面は別ドメインのため絶対URL必須
              ※更新時は ?v= の日付を変えること（キャッシュ対策）

   ----------------------------------------------------------------------------
   【重要】このファイルには要素セレクタ（body, h1, a, ul など単体）を
   一切書いていません。すべてのルールが下記いずれかの接頭辞で始まります。
   該当するHTMLが無いページでは1バイトも影響しません。

     .o-ann   … お知らせバー
     .o-hd    … 共通ヘッダー
     .o-sp    … スマホ専用ブロック（ヘッダー直下）
     #o-dw    … スマホドロワー用チェックボックス
     .o-in    … 共通の内側コンテナ
     .o-gd    … ガイドページ本体
     .o-crumb … パンくず
     .orb-cut … 記事18の本文

   ----------------------------------------------------------------------------
   目次
     SECTION 0  変数
     SECTION 1  共通ヘッダー／お知らせバー      → 全ページ
     SECTION 2  ガイドページ                    → フリーページのみ
     SECTION 3  記事18                          → entries/18・categories/27048のみ
     SECTION 4  スマホ（全セクション分をまとめて）
   ========================================================================== */


/* ==========================================================================
   SECTION 0 : 変数
   :root はグローバルですが、変数は宣言しただけでは何も描画しません。
   すべて --o- 接頭辞なので他CSSと衝突しません。
   ========================================================================== */
:root{
  --o-navy:#042d7a;
  --o-navy-d:#03215c;
  --o-gold:#e8d48a;
  --o-band:#f1f3f7;
  --o-tint:#f7f8fa;
  --o-line:#e3e6ec;
  --o-ink:#242a35;
  --o-sub:#6f7885;
  --o-sale:#b8352a;
}


/* ==========================================================================
   SECTION 1 : 共通ヘッダー／お知らせバー
   影響範囲 : 全ページ（トップ・商品・フリーページ・カテゴリ一覧・カート）
   条件     : ヘッダーHTMLを4か所すべてに貼った場合のみ描画されます。
              貼っていないページでは .o-hd が存在しないため無効です。

   2026-08 改訂：
     ・既存のアイコン付きカテゴリバー（11項目）を踏襲し、SVGで描き直し
     ・グローバルナビは廃止（カテゴリバーと内容が重複していたため）
     ・NEW / SALE バッジはCSSで描画（画像不要）
   ========================================================================== */

/* --- 共通の土台 --- */
.o-hd,.o-hd *,.o-ann,.o-ann *,.o-sp,.o-sp *{box-sizing:border-box;}
.o-hd,.o-ann,.o-sp{
  font-family:"Hiragino Kaku Gothic ProN","Yu Gothic Medium","Yu Gothic",Meiryo,sans-serif;
  color:var(--o-ink);
  font-feature-settings:"palt";
}
.o-hd a,.o-ann a,.o-sp a{text-decoration:none;color:inherit;}
.o-hd ul,.o-ann ul,.o-sp ul{list-style:none;margin:0;padding:0;}
.o-hd :focus-visible,.o-ann :focus-visible,.o-sp :focus-visible{outline:2px solid var(--o-navy);outline-offset:2px;}
.o-in{max-width:1200px;margin:0 auto;padding:0 24px;}

/* ガイド・FAQ本文は、ショップサーブのサイドバーの右側に入ります。
   幅を固定せず、与えられた本文カラムいっぱいに広がるようにします。 */
.o-gd .o-in{max-width:none;margin:0;padding:0;}

/* --- 1段目：ロゴ／検索／カート --- */
.o-hd{background:#fff;border-bottom:1px solid var(--o-line);}
.o-hd .o-r1{display:flex;align-items:stretch;height:88px;padding-left:28px;}
.o-hd .o-logo{display:flex;align-items:center;flex:none;}
.o-hd .o-logo img{display:block;height:46px;width:auto;}

.o-hd .o-search,.o-sp .o-search{flex:1;display:flex;align-items:center;margin:0 34px;min-width:0;}
.o-hd .o-search form,.o-sp .o-search form{position:relative;width:100%;max-width:520px;}
.o-hd .o-search input,.o-sp .o-search input{
  width:100%;height:42px;border:1px solid var(--o-line);background:var(--o-tint);
  border-radius:4px;padding:0 46px 0 16px;font-size:13.5px;color:var(--o-ink);
}
.o-hd .o-search input::placeholder,.o-sp .o-search input::placeholder{color:#a3aab5;}
.o-hd .o-search input:focus,.o-sp .o-search input:focus{background:#fff;border-color:var(--o-navy);outline:none;}
.o-hd .o-search button,.o-sp .o-search button{
  position:absolute;right:0;top:0;width:44px;height:42px;border:0;background:none;
  cursor:pointer;color:var(--o-sub);display:grid;place-items:center;
}
.o-hd .o-search svg,.o-sp .o-search svg{width:18px;height:18px;}

.o-hd .o-util{display:flex;align-items:center;gap:22px;flex:none;padding-right:22px;}
.o-hd .o-util a{display:grid;justify-items:center;gap:5px;font-size:10.5px;color:var(--o-sub);}
.o-hd .o-util svg{width:21px;height:21px;stroke-width:1.35;color:#3d4653;}
.o-hd .o-util a:hover,.o-hd .o-util a:hover svg{color:var(--o-navy);}

.o-hd .o-cart{
  flex:none;width:126px;background:var(--o-navy);color:#fff;
  display:grid;place-content:center;justify-items:center;gap:5px;
  font-size:11.5px;position:relative;
}
.o-hd .o-cart svg{width:24px;height:24px;stroke-width:1.4;}
.o-hd .o-cart:hover{background:var(--o-navy-d);}
.o-hd .o-cart .o-num{
  position:absolute;top:18px;right:27px;min-width:19px;height:19px;padding:0 5px;
  background:var(--o-gold);color:var(--o-navy);border-radius:10px;
  font-size:10px;font-weight:700;display:grid;place-items:center;
}

/* --- 2段目：カテゴリバー（既存デザインを踏襲） ---
   背景のグラデーション、下端のゴールド、白抜きアイコン、
   バッジの色は、現行サイトのものをそのまま使っています。         */
.o-hd .orb-cat-bar{
  background:linear-gradient(135deg,#042d7a 0%,#0a4599 100%) !important;
  border-bottom:3px solid #e8d48a !important;
  width:100% !important;display:block !important;position:relative;z-index:10;
}
.o-hd .orb-cat-bar .orb-inner{
  max-width:1280px;margin:0 auto !important;padding:0 8px !important;
  display:flex !important;flex-wrap:nowrap !important;align-items:stretch !important;
  justify-content:center !important;overflow:visible;scrollbar-width:none;
}
.o-hd .orb-cat-bar .orb-inner::-webkit-scrollbar{display:none;}
.o-hd .orb-cat-cell{position:relative;flex-shrink:0;display:flex;}
.o-hd .orb-cat-item{
  display:flex !important;flex-direction:column !important;
  align-items:center !important;justify-content:center !important;gap:5px !important;
  padding:10px 14px !important;text-decoration:none !important;
  color:rgba(255,255,255,0.88) !important;font-size:11px !important;font-weight:700 !important;
  white-space:nowrap !important;position:relative !important;
  border-right:1px solid rgba(255,255,255,0.1) !important;
  min-width:82px !important;flex-shrink:0 !important;
}
.o-hd .orb-cat-item:hover{background:rgba(255,255,255,0.12) !important;color:#fff !important;}
.o-hd .orb-cat-item.active{background:rgba(255,255,255,0.15) !important;color:#e8d48a !important;}
.o-hd .orb-cat-item svg{width:28px !important;height:28px !important;display:block !important;margin:0 auto !important;}
.o-hd .orb-cat-item span{line-height:1.3 !important;text-align:center !important;display:block !important;}
.o-hd .orb-cat-badge{
  position:absolute !important;top:6px !important;right:10px !important;
  background:#e63329 !important;color:#fff !important;
  font-size:9px !important;font-weight:700 !important;padding:1px 5px !important;
  border-radius:3px !important;line-height:1.4 !important;
}
.o-hd .orb-cat-badge.sale{background:#ff6b00 !important;}

/* --- メガメニュー（濃紺の帯から下に開く） --- */
.o-hd .o-mega{
  position:absolute;left:0;top:100%;background:#fff;border:1px solid var(--o-line);
  border-top:3px solid #e8d48a;box-shadow:0 14px 30px rgba(4,45,122,.2);
  padding:22px 26px;display:none;min-width:520px;z-index:60;text-align:left;
}
.o-hd .orb-cat-cell:hover .o-mega,.o-hd .orb-cat-cell:focus-within .o-mega{display:block;}
.o-hd .orb-cat-cell:nth-last-child(-n+5) .o-mega{left:auto;right:0;}
.o-hd .o-mega-h{
  font-size:10px;letter-spacing:.16em;color:#a3aab5;margin:0 0 12px;
  padding-bottom:9px;border-bottom:1px solid var(--o-line);
}
.o-hd .o-mega-g{display:grid;grid-template-columns:repeat(3,1fr);gap:1px 22px;}
.o-hd .o-mega-g a{display:flex;align-items:baseline;gap:6px;padding:9px 0;font-size:13px;color:#3d4653;font-weight:400;}
.o-hd .o-mega-g a:hover{color:var(--o-navy);}
.o-hd .o-mega-g .o-yen{font-size:11px;color:#9aa2af;}
.o-hd .o-mega-g .o-new{font-size:10px;color:#e63329;font-weight:700;}
.o-hd .o-mega-note{
  margin:14px 0 0;padding-top:13px;border-top:1px solid var(--o-line);
  font-size:12px;line-height:1.85;color:var(--o-sub);
}
.o-hd .o-mega-note b{color:var(--o-navy);}

/* --- 3段目：お知らせバー --- */
.o-ann{background:#f5f7fb;border-bottom:1px solid var(--o-line);font-size:13px;}
.o-ann .o-in{display:flex;align-items:center;justify-content:center;gap:14px;height:42px;position:relative;}
.o-ann .o-ann-tag{
  font-size:10px;letter-spacing:.14em;color:var(--o-navy);
  border:1px solid #c5cee2;border-radius:2px;padding:3px 8px;flex:none;background:#fff;
}
.o-ann .o-ann-vp{height:42px;overflow:hidden;flex:none;max-width:calc(100% - 150px);}
.o-ann .o-ann-vp li{height:42px;display:flex;align-items:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.o-ann .o-ann-vp a{color:#33405c;border-bottom:1px solid #b9c3d8;padding-bottom:1px;}
.o-ann .o-ann-vp a:hover{color:var(--o-navy);border-bottom-color:var(--o-navy);}
.o-ann .o-ann-vp .o-hot{color:var(--o-sale);font-weight:700;}
.o-ann .o-ann-vp:not(.is-solo) ul{animation:o-roll 14s infinite;}
@keyframes o-roll{0%,45%{transform:translateY(0);}50%,95%{transform:translateY(-50%);}100%{transform:translateY(0);}}
.o-ann .o-ann-all{font-size:11.5px;color:var(--o-sub);flex:none;}
.o-ann .o-ann-all:hover{color:var(--o-navy);}
.o-ann .o-ann-x{
  position:absolute;right:24px;top:0;height:42px;width:32px;border:0;background:none;
  color:#9aa2af;cursor:pointer;font-size:16px;line-height:1;
}
.o-ann .o-ann-x:hover{color:var(--o-ink);}

/* --- スマホ専用ブロック（PCでは非表示） --- */
.o-sp{display:none;}


/* ==========================================================================
   SECTION 2 : ガイドページ
   影響範囲 : .o-gd を含むフリーページのみ
   商品ページ・カート・トップには .o-gd が無いため一切影響しません。
   ========================================================================== */

.o-gd,.o-gd *,.o-crumb,.o-crumb *{box-sizing:border-box;}
.o-gd,.o-crumb{
  font-family:"Hiragino Kaku Gothic ProN","Yu Gothic Medium","Yu Gothic",Meiryo,sans-serif;
  color:var(--o-ink);font-feature-settings:"palt";
}
.o-gd a,.o-crumb a{text-decoration:none;color:inherit;}
.o-gd ul,.o-crumb ul{list-style:none;margin:0;padding:0;}
.o-gd :focus-visible,.o-crumb :focus-visible{outline:2px solid var(--o-navy);outline-offset:2px;}

/* --- パンくず --- */
.o-crumb{border-bottom:1px solid var(--o-line);font-size:11.5px;color:var(--o-sub);}
.o-crumb .o-in{display:flex;align-items:center;gap:9px;height:44px;overflow:hidden;white-space:nowrap;}
.o-crumb a:hover{color:var(--o-navy);}
.o-crumb .o-sep{color:#c3c9d3;}

/* --- 2カラム --- */
.o-gd .o-cols{display:grid;grid-template-columns:210px 1fr;gap:52px;padding-top:40px;padding-bottom:84px;align-items:start;}

/* --- サイドバー：1リンク＝1ブロック --- */
.o-gd .o-side{position:sticky;top:20px;}
.o-gd .o-side-h{
  font-size:10px;letter-spacing:.16em;color:#a3aab5;margin:0 0 10px;
  padding-bottom:9px;border-bottom:1px solid var(--o-line);
}
.o-gd .o-side-list{display:grid;gap:3px;}
.o-gd .o-side-list a{
  display:flex;align-items:center;justify-content:center;text-align:center;
  min-height:56px;padding:10px 12px;background:var(--o-tint);
  font-size:13px;font-weight:600;color:#3d4653;line-height:1.5;
}
.o-gd .o-side-list a:hover{background:var(--o-band);color:var(--o-navy);}
.o-gd .o-side-list a.is-on{background:var(--o-navy);color:#fff;}
.o-gd .o-side-cta{display:grid;gap:3px;margin-top:22px;}
.o-gd .o-side-cta a{
  display:grid;align-content:center;justify-items:center;gap:4px;
  min-height:74px;padding:12px;text-align:center;font-size:13px;font-weight:600;line-height:1.5;
}
.o-gd .o-side-cta small{font-size:10.5px;font-weight:400;opacity:.85;}
.o-gd .o-side-cta .o-c-quote{background:var(--o-navy);color:#fff;}
.o-gd .o-side-cta .o-c-quote:hover{background:var(--o-navy-d);}
.o-gd .o-side-cta .o-c-biz{background:var(--o-gold);color:#3a2f00;}
.o-gd .o-side-cta .o-c-biz:hover{filter:brightness(.96);}
.o-gd .o-side-fac{margin-top:22px;border:1px solid var(--o-line);}
.o-gd .o-side-fac img{display:block;width:100%;height:auto;}
.o-gd .o-side-fac div{padding:14px;font-size:11.5px;line-height:1.95;color:var(--o-sub);}
.o-gd .o-side-fac b{display:block;font-size:12.5px;color:var(--o-ink);margin-bottom:5px;}
.o-gd .o-side-fac a{color:var(--o-navy);}

/* --- 本文 --- */
.o-gd .o-body{max-width:860px;min-width:0;}
.o-gd .o-body h1{font-size:27px;font-weight:600;letter-spacing:.02em;margin:0 0 7px;line-height:1.5;}
.o-gd .o-body .o-en{font-size:10px;letter-spacing:.18em;color:#a3aab5;margin:0 0 26px;}
.o-gd .o-body .o-lead{font-size:14px;line-height:2.05;color:#454e5c;margin:0 0 40px;}
.o-gd .o-body h2{
  font-size:17px;font-weight:600;margin:54px 0 18px;padding:1px 0 12px 12px;
  border-bottom:1px solid var(--o-line);border-left:3px solid var(--o-navy);letter-spacing:.02em;
}
.o-gd .o-body h2:first-of-type{margin-top:0;}
.o-gd .o-body h3{font-size:14px;font-weight:600;margin:34px 0 12px;}
.o-gd .o-body p{font-size:13.5px;line-height:2.05;color:#3d4653;margin:0 0 16px;}
.o-gd .o-body table{width:100%;border-collapse:collapse;font-size:13.5px;margin:0 0 16px;}
.o-gd .o-body th,.o-gd .o-body td{border-bottom:1px solid var(--o-line);padding:15px 14px;text-align:left;vertical-align:middle;line-height:1.8;}
.o-gd .o-body th{background:var(--o-tint);font-weight:600;width:36%;color:#333c4a;}
.o-gd .o-body td.o-price{font-weight:700;font-size:15px;letter-spacing:.02em;}
.o-gd .o-body .o-memo{font-size:12px;color:var(--o-sub);line-height:1.95;margin:0 0 8px;}
.o-gd .o-body ul.o-dots li{font-size:13.5px;line-height:2.05;color:#3d4653;padding-left:17px;position:relative;}
.o-gd .o-body ul.o-dots li::before{content:"";position:absolute;left:2px;top:14px;width:5px;height:5px;border-radius:50%;background:var(--o-navy);}
.o-gd .o-body figure{margin:0 0 20px;}
.o-gd .o-body figure img{display:block;width:100%;height:auto;border:1px solid var(--o-line);}
.o-gd .o-body figcaption{font-size:11.5px;color:var(--o-sub);margin-top:8px;line-height:1.8;}
.o-gd .o-call{background:var(--o-tint);border-left:3px solid var(--o-navy);padding:20px 22px;margin:0 0 24px;}
.o-gd .o-call p:last-child{margin-bottom:0;}
.o-gd .o-faq dt{font-size:13.5px;font-weight:600;padding:19px 0 9px;border-top:1px solid var(--o-line);}
.o-gd .o-faq dd{font-size:13.5px;line-height:2.05;color:#454e5c;margin:0 0 10px;}
.o-gd .o-next{display:grid;grid-template-columns:1fr 1fr;gap:3px;margin-top:56px;}
.o-gd .o-next a{background:var(--o-tint);padding:22px;font-size:13.5px;font-weight:600;}
.o-gd .o-next a:hover{background:var(--o-band);color:var(--o-navy);}
.o-gd .o-next small{display:block;font-size:10px;letter-spacing:.14em;color:#a3aab5;margin-bottom:7px;font-weight:400;}


/* ==========================================================================
   SECTION 3 : 記事18（2カット無料ページ）
   影響範囲 : .orb-cut を含むページのみ
              = entries/18.html と categories/27048.html

   2026-08 改訂：ガイドページと同じ見た目に統一しました。
     ・見出しのベタ塗り帯 → 左ネイビー線＋下ヘアライン
     ・囲み枠 5種類 → 「重要」「補足」の2種類に整理
     ・使用色 6色 → ネイビー＋注意色の2色
     ・冒頭のLP部分（お困り3つ／POINT3つ）は構造を残し、配色のみ統一
   ========================================================================== */

.orb-cut{
  font-family:"Hiragino Kaku Gothic ProN","Yu Gothic Medium","Yu Gothic",Meiryo,sans-serif;
  color:var(--o-ink);font-feature-settings:"palt";
}
.orb-cut a{color:inherit;}
.orb-cut .orbiter-section{margin-bottom:56px;}

/* --- 見出し --- */
.orb-cut h1.orbiter-h1{
  background:none;color:var(--o-ink) !important;font-size:27px;font-weight:600;
  text-align:left;padding:0;letter-spacing:.02em;margin:0 0 10px;line-height:1.55;
}
.orb-cut h2.orbiter-h2{
  background:none !important;color:var(--o-ink) !important;
  font-size:17px !important;font-weight:600 !important;
  font-family:"Hiragino Kaku Gothic ProN","Yu Gothic Medium",Meiryo,sans-serif !important;
  text-align:left !important;padding:1px 0 12px 12px !important;
  border-left:3px solid var(--o-navy);border-bottom:1px solid var(--o-line);
  letter-spacing:.02em !important;margin:54px 0 18px !important;line-height:1.6 !important;
  height:auto !important;scroll-margin-top:20px;
}
.orb-cut h3.orbiter-h3{
  font-size:14px;font-weight:600;color:var(--o-ink) !important;
  border-left:0;padding-left:0;margin:32px 0 12px;
}
.orb-cut .orbiter-p{font-size:13.5px;line-height:2.05;color:#3d4653;margin:0 0 16px;}
.orb-cut .sub-text{font-size:12px;color:var(--o-sub);line-height:1.95;margin:0 0 8px;display:block;}
.orb-cut .marker{background:none;font-weight:600;color:var(--o-ink);}
.orb-cut .orbiter-red{color:var(--o-sale) !important;font-weight:600;}
.orb-cut .section-img{display:block;width:100%;height:auto;margin:16px 0;border:1px solid var(--o-line);}
.orb-cut .img-text-row{display:flex;gap:24px;align-items:center;margin:16px 0;}
.orb-cut .img-text-row img{flex:0 0 38%;max-width:38%;height:auto;border:1px solid var(--o-line);}
.orb-cut .img-text-row .row-text{flex:1;}

/* --- 冒頭：定義ブロック --- */
.orb-cut .lead-def{
  background:var(--o-tint);border-left:3px solid var(--o-navy);border-radius:0;
  padding:22px 24px;margin:0 0 34px;
}
.orb-cut .lead-def p{font-size:15px;line-height:2.0;color:var(--o-ink);margin:0 0 10px;font-weight:600;}
.orb-cut .lead-def .lead-sub{font-size:13.5px;line-height:2.0;color:#454e5c;font-weight:400;margin:0;}
.orb-cut .spec-list{
  display:grid;grid-template-columns:repeat(2,1fr);gap:1px;
  background:var(--o-line);border:1px solid var(--o-line);margin:18px 0 0;
}
.orb-cut .spec-list div{background:#fff;padding:11px 14px;font-size:13px;color:#3d4653;line-height:1.7;}
.orb-cut .spec-list div b{color:var(--o-navy);font-weight:600;}

/* --- 冒頭：LP部分（構造は残し配色のみ統一） --- */
.orb-cut .catch-block{text-align:center;padding:0;margin-bottom:40px;}
.orb-cut .band-navy{
  background:var(--o-tint);border:1px solid var(--o-line);color:var(--o-navy);
  padding:13px 20px;border-radius:0;margin-bottom:26px;
  font-size:15px;font-weight:600;text-align:center;letter-spacing:.04em;
}
.orb-cut .band-red{
  background:var(--o-navy);color:#fff;padding:15px 20px;border-radius:0;margin-bottom:28px;
  font-size:17px;font-weight:600;text-align:center;letter-spacing:.06em;
}
.orb-cut .trouble-row{display:flex;justify-content:space-around;flex-wrap:nowrap;margin-bottom:28px;gap:12px;}
.orb-cut .trouble-row>div{text-align:center;width:32%;}
.orb-cut .trouble-row img{
  width:120px !important;max-width:120px !important;height:120px !important;
  border:1px solid var(--o-line);border-radius:50%;padding:10px;display:block;margin:0 auto;background:#fff;
}
.orb-cut .trouble-row p{font-size:12.5px;color:#4b5462;margin-top:10px;line-height:1.8;}
.orb-cut .point-lead{display:flex;align-items:center;gap:16px;margin-bottom:24px;text-align:left;}
.orb-cut .point-lead img{width:84px !important;height:auto !important;display:block !important;max-width:84px !important;flex-shrink:0;}
.orb-cut .point-lead p{font-size:16px;font-weight:600;margin:0;line-height:1.8;}
.orb-cut .catch-block .catch-sub{font-size:13.5px;color:#4b5462;line-height:2.0;margin-bottom:8px;}
.orb-cut .point-wrap{display:flex;gap:20px;flex-wrap:wrap;margin:30px 0 8px;justify-content:center;}
.orb-cut .point-item{text-align:center;}
.orb-cut .point-item .point-label{font-size:11.5px;color:var(--o-sub) !important;margin-bottom:8px;}
.orb-cut .point-badge{
  background:#fff;border:2px solid var(--o-navy);color:var(--o-navy) !important;
  border-radius:50%;width:130px;height:130px;box-shadow:none;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;font-weight:600;line-height:1.5;
}
.orb-cut .badge-title{font-size:10px;letter-spacing:.14em;color:var(--o-sub) !important;font-weight:400;}
.orb-cut .badge-body{font-size:12.5px;margin-top:6px;color:var(--o-navy) !important;}

/* --- 囲み枠：重要（薄い面＋左ネイビー線） --- */
.orb-cut .alert-box,
.orb-cut .highlight-box-red,
.orb-cut .rule-box{
  background:var(--o-tint);border:0;border-left:3px solid var(--o-navy);
  border-radius:0;padding:20px 22px;margin:0 0 22px;
}
.orb-cut .alert-box .alert-title,
.orb-cut .rule-box .rule-title{
  font-size:14px;font-weight:600;color:var(--o-sale) !important;margin:0 0 10px;
}
.orb-cut .alert-box p:last-child,
.orb-cut .highlight-box-red p:last-child,
.orb-cut .rule-box ul{margin-bottom:0;}
.orb-cut .highlight-box-red ul{list-style:none;padding-left:0;margin:0;}
.orb-cut .highlight-box-red li{
  font-size:13.5px;line-height:2.0;color:#3d4653;padding-left:17px;position:relative;
}
.orb-cut .highlight-box-red li::before{
  content:"";position:absolute;left:2px;top:14px;width:5px;height:5px;border-radius:50%;background:var(--o-navy);
}
.orb-cut .rule-box ul{list-style:none;padding-left:0;}
.orb-cut .rule-box li{font-size:13.5px;line-height:2.0;padding-left:20px;position:relative;margin-bottom:4px;color:#3d4653;}
.orb-cut .rule-box li::before{content:"";position:absolute;left:2px;top:14px;width:5px;height:5px;border-radius:50%;background:var(--o-navy);}
.orb-cut .rule-box li.ng::before{
  content:"×";background:none;color:var(--o-sale);font-weight:600;font-size:14px;
  top:3px;left:0;width:auto;height:auto;border-radius:0;
}

/* --- 囲み枠：補足（ヘアライン枠） --- */
.orb-cut .highlight-box,
.orb-cut .merit-box,
.orb-cut .fit-box,
.orb-cut .what-box{
  background:#fff;border:1px solid var(--o-line);border-left:1px solid var(--o-line);
  border-radius:0;padding:20px 22px;margin:0 0 22px;
}
.orb-cut .merit-box .merit-title,
.orb-cut .fit-box .fit-title,
.orb-cut .what-box .what-title{
  font-size:14px;font-weight:600;color:var(--o-navy) !important;margin:0 0 12px;
}
.orb-cut .what-box .what-body{font-size:13.5px;line-height:2.05;color:#3d4653;}
.orb-cut .highlight-box ul,.orb-cut .fit-box ul{list-style:none;padding-left:0;margin:0;}
.orb-cut .highlight-box li{font-size:13.5px;line-height:2.0;color:#3d4653;padding-left:17px;position:relative;}
.orb-cut .highlight-box li::before{content:"";position:absolute;left:2px;top:14px;width:5px;height:5px;border-radius:50%;background:var(--o-navy);}
.orb-cut .fit-box li{font-size:13.5px;line-height:2.15;padding-left:0;color:#3d4653;}
.orb-cut .fit-box li::before{
  content:"OK";background:var(--o-navy);color:#fff !important;font-size:9.5px;font-weight:600;
  padding:2px 6px;border-radius:2px;margin-right:9px;letter-spacing:.06em;
}

/* --- 目次 --- */
.orb-cut .toc-wrap{background:var(--o-tint);border:1px solid var(--o-line);border-radius:0;padding:20px 22px;margin:0 0 48px;}
.orb-cut .toc-wrap .toc-title{font-size:10px;letter-spacing:.16em;color:#a3aab5;font-weight:400;margin:0 0 12px;}
.orb-cut .toc-wrap ul{list-style:none;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:3px;}
.orb-cut .toc-wrap ul li a{
  display:block;font-size:13px;color:#3d4653 !important;text-decoration:none;
  background:#fff;border:1px solid var(--o-line);border-radius:0;padding:11px 14px;line-height:1.5;text-align:left;
}
.orb-cut .toc-wrap ul li a::before{content:"";margin:0;}
.orb-cut .toc-wrap ul li a:hover{background:var(--o-navy);color:#fff !important;border-color:var(--o-navy);}

/* --- 表 --- */
.orb-cut .table-wrap{overflow-x:auto;margin:0 0 16px;}
.orb-cut .orbiter-table{width:100%;border-collapse:collapse;font-size:13.5px;min-width:300px;}
.orb-cut .orbiter-table th{
  background:var(--o-tint);color:#333c4a !important;padding:14px 12px;
  text-align:left;font-weight:600;white-space:nowrap;border-bottom:1px solid var(--o-line);
}
.orb-cut .orbiter-table td{
  border:0;border-bottom:1px solid var(--o-line);padding:14px 12px;text-align:left;white-space:nowrap;
}
.orb-cut .orbiter-table tr:nth-child(even) td{background:#fff;}

/* --- 手順 --- */
.orb-cut .step-wrap{display:flex;gap:3px;flex-wrap:wrap;margin:20px 0;}
.orb-cut .step-item{
  flex:1;min-width:160px;position:relative;text-align:left;padding:20px 18px;
  background:var(--o-tint);border:0;border-radius:0;margin:0;
}
.orb-cut .step-item .step-num{
  background:none !important;color:var(--o-navy) !important;font-size:10px !important;
  font-weight:600;border-radius:0;width:auto !important;height:auto !important;
  min-width:0;min-height:0;line-height:1.4 !important;display:block !important;
  text-align:left;margin:0 0 8px;letter-spacing:.16em;
}
.orb-cut .step-item .step-num::before{content:"STEP ";}
.orb-cut .step-item .step-title{font-size:14px;font-weight:600;color:var(--o-ink) !important;margin-bottom:8px;}
.orb-cut .step-item .step-body{font-size:12.5px;color:#4b5462;line-height:1.9;}
.orb-cut .step-item .step-note{font-size:11.5px;color:var(--o-sub);margin-top:8px;display:block;}

/* --- 入力例 --- */
.orb-cut .input-example{
  background:#fff;border:1px solid var(--o-line);border-radius:0;
  padding:16px 18px;margin:12px 0 0;font-size:13.5px;line-height:2.1;
}
.orb-cut .input-example .ex-label{font-size:11px;color:var(--o-sub) !important;margin-bottom:8px;display:block;letter-spacing:.04em;}
.orb-cut .input-example .ex-ok{color:var(--o-navy) !important;font-weight:600;}
.orb-cut .input-example .ex-ng{color:var(--o-sale) !important;text-decoration:line-through;}
.orb-cut .input-example .ex-ng-note{color:var(--o-sale) !important;font-size:12px;margin-left:8px;}

/* --- CTA --- */
.orb-cut .mid-cta{
  text-align:center;padding:26px 20px;background:var(--o-tint);border:0;border-radius:0;margin:44px 0;
}
.orb-cut .mid-cta p{font-size:13.5px;color:#4b5462;margin-bottom:16px;}
.orb-cut .cta-wrap{text-align:center;margin-top:48px;padding:36px 24px;background:var(--o-tint);border-radius:0;}
.orb-cut .cta-row{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-bottom:24px;}
.orb-cut .cta-btn{
  display:inline-block;background:var(--o-navy);color:#fff !important;font-size:14px;font-weight:600;
  padding:15px 34px;border-radius:4px;text-decoration:none;margin:0;letter-spacing:.04em;
}
.orb-cut .cta-btn:hover{background:var(--o-navy-d);}
.orb-cut .cta-btn-orange{
  display:inline-block;background:#fff;color:var(--o-navy) !important;border:1px solid var(--o-navy);
  font-size:14px;font-weight:600;padding:14px 34px;border-radius:4px;text-decoration:none;margin:0;letter-spacing:.04em;
}
.orb-cut .cta-btn-orange:hover{background:var(--o-navy);color:#fff !important;}
.orb-cut .cta-info{
  background:#fff;border:1px solid var(--o-line);border-radius:0;padding:20px 22px;
  text-align:left;font-size:13px;line-height:2.0;
}
.orb-cut .cta-info .info-title{font-weight:600;color:var(--o-navy);margin:0 0 10px;font-size:13.5px;}

/* --- ×印の並び --- */
.orb-cut .ng-row{font-size:13.5px;display:flex;justify-content:space-around;text-align:center;color:#4b5462;}

/* --- FAQ：アコーディオン（JS不要） --- */
.o-gd .o-q{border-bottom:1px solid var(--o-line);}
.o-gd .o-q:first-of-type{border-top:1px solid var(--o-line);}
.o-gd .o-q>summary{
  list-style:none;cursor:pointer;position:relative;
  padding:18px 40px 18px 0;font-size:13.5px;font-weight:600;line-height:1.8;color:var(--o-ink);
}
.o-gd .o-q>summary::-webkit-details-marker{display:none;}
.o-gd .o-q>summary::after{
  content:"";position:absolute;right:8px;top:50%;width:11px;height:11px;
  border-right:1.5px solid var(--o-navy);border-bottom:1.5px solid var(--o-navy);
  transform:translateY(-70%) rotate(45deg);transition:transform .18s;
}
.o-gd .o-q[open]>summary::after{transform:translateY(-30%) rotate(-135deg);}
.o-gd .o-q>summary:hover{color:var(--o-navy);}
.o-gd .o-a{padding:0 0 20px;font-size:13.5px;line-height:2.05;color:#454e5c;}
.o-gd .o-a p{margin:0 0 12px;font-size:13.5px;line-height:2.05;color:#454e5c;}
.o-gd .o-a p:last-child{margin-bottom:0;}
.o-gd .o-a ul{margin:0 0 12px;}
.o-gd .o-a li{font-size:13.5px;line-height:2.0;color:#454e5c;padding-left:16px;position:relative;}
.o-gd .o-a li::before{content:"";position:absolute;left:2px;top:13px;width:4px;height:4px;border-radius:50%;background:#b4bac4;}
.o-gd .o-a a{color:var(--o-navy);text-decoration:underline;}
.o-gd .o-a table{margin:4px 0 12px;}
.o-gd .o-q-note{font-size:12px;color:var(--o-sub);line-height:1.9;margin:6px 0 0;}

.o-guide-nav .o-guide-list a.o-to-faq{background:var(--o-tint);border-color:#c9d2e4;color:var(--o-navy);}
.o-guide-nav .o-guide-list a.o-to-faq:hover{background:var(--o-navy);border-color:var(--o-navy);color:#fff;}

/* --- FAQ：商品別の入口バナー（4枚組） --- */
.o-faq-nav{margin-top:56px;}
.o-faq-nav .o-faq-h{
  font-size:10px;letter-spacing:.16em;color:#a3aab5;margin:0 0 10px;
  padding-bottom:9px;border-bottom:1px solid var(--o-line);
}
.o-faq-nav .o-faq-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:6px;}
.o-faq-nav .o-faq-list a{
  display:grid;align-content:start;gap:6px;padding:18px 16px;
  background:#fff;border:1px solid var(--o-line);
  font-size:13px;font-weight:600;color:#3d4653;line-height:1.55;text-decoration:none;
}
.o-faq-nav .o-faq-list a:hover{background:var(--o-tint);border-color:var(--o-navy);color:var(--o-navy);}
.o-faq-nav .o-faq-list a small{font-size:11px;font-weight:400;color:var(--o-sub);line-height:1.75;}
.o-faq-nav .o-faq-list a.is-on{background:var(--o-navy);border-color:var(--o-navy);color:#fff;}
.o-faq-nav .o-faq-list a.is-on small{color:rgba(255,255,255,.8);}

/* --- ガイドナビ（記事18とガイド5枚で共通） --- */
.orb-cut .o-guide-nav,.o-gd .o-guide-nav{margin-top:56px;}
.o-guide-nav .o-guide-h{
  font-size:10px;letter-spacing:.16em;color:#a3aab5;margin:0 0 10px;
  padding-bottom:9px;border-bottom:1px solid var(--o-line);
}
.o-guide-nav .o-guide-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:6px;}
.o-guide-nav .o-guide-list a{
  display:flex;align-items:center;justify-content:center;text-align:center;
  min-height:56px;padding:10px 12px;background:#fff;border:1px solid var(--o-line);
  font-size:13px;font-weight:600;color:#3d4653;line-height:1.5;text-decoration:none;
}
.o-guide-nav .o-guide-list a:hover{background:var(--o-tint);border-color:var(--o-navy);color:var(--o-navy);}
.o-guide-nav .o-guide-list a.is-on{background:var(--o-navy);border-color:var(--o-navy);color:#fff;}


/* ==========================================================================
   SECTION 4 : スマホ
   ========================================================================== */

/* --- カテゴリバーが詰まる中間幅 --- */
@media (max-width:1240px){
  .o-hd .orb-cat-item{padding:10px 9px !important;min-width:72px !important;font-size:10px !important;}
  .o-hd .orb-cat-item svg{width:24px !important;height:24px !important;}
  .o-hd .o-search{margin:0 20px;}
  .o-hd .o-util{gap:16px;}
  .o-hd .o-mega{min-width:440px;}
}

@media (max-width:960px){

  /* --- 共通ヘッダー --- */
  .o-hd .o-util,.o-hd .o-r1 .o-search{display:none;}
  .o-hd .o-mega{display:none !important;}
  .o-hd .orb-cat-bar .orb-inner{
    justify-content:flex-start !important;padding:0 !important;
    overflow-x:auto;-webkit-overflow-scrolling:touch;
  }
  .o-hd .orb-cat-item{padding:9px 12px !important;min-width:74px !important;font-size:10px !important;gap:4px !important;}
  .o-hd .orb-cat-item svg{width:24px !important;height:24px !important;}
  .o-hd .orb-cat-badge{top:3px !important;right:5px !important;font-size:8px !important;}
  .o-sp{display:block;}
  .o-hd .o-r1{height:56px;padding-left:0;align-items:center;}
  .o-hd .o-logo{margin-left:4px;}
  .o-hd .o-logo img{height:27px;}
  .o-hd .o-burger{
    width:44px;height:44px;border:0;background:none;cursor:pointer;flex:none;
    display:grid;align-content:center;justify-items:center;gap:5px;padding:0;
  }
  .o-hd .o-burger span{display:block;width:20px;height:1.6px;background:var(--o-ink);}
  .o-hd .o-cart{width:74px;align-self:stretch;font-size:10px;gap:3px;margin-left:auto;}
  .o-hd .o-cart svg{width:20px;height:20px;}
  .o-hd .o-cart .o-num{top:8px;right:12px;min-width:17px;height:17px;}

  /* --- お知らせバー --- */
  .o-ann{font-size:12.5px;}
  .o-ann .o-in{padding:0 12px;gap:0;justify-content:flex-start;height:42px;}
  .o-ann .o-ann-vp{height:42px;max-width:calc(100% - 34px);flex:1;min-width:0;}
  .o-ann .o-ann-vp li{height:42px;font-size:12px;display:block;line-height:42px;}
  .o-ann .o-ann-vp a{border-bottom:0;}
  .o-ann .o-ann-tag,.o-ann .o-ann-all{display:none;}
  .o-ann .o-ann-x{right:6px;height:40px;}

  /* --- スマホ専用ブロック --- */
  .o-sp .o-sp-search{padding:9px 14px;border-top:1px solid var(--o-line);}
  .o-sp .o-search{margin:0;}
  .o-sp .o-search form{max-width:none;}
  /* --- ドロワー --- */
  #o-dw{position:absolute;opacity:0;pointer-events:none;}
  .o-sp .o-dw{position:fixed;inset:0 auto 0 0;width:min(88%,340px);background:#fff;z-index:9999;transform:translateX(-100%);transition:transform .24s ease;overflow-y:auto;padding-bottom:44px;}
  #o-dw:checked~.o-dw{transform:none;}
  #o-dw:checked~.o-scrim{opacity:1;pointer-events:auto;}
  .o-sp .o-scrim{position:fixed;inset:0;background:rgba(36,42,53,.38);z-index:9998;opacity:0;pointer-events:none;transition:opacity .24s;}
  .o-sp .o-dw-top{display:flex;justify-content:flex-end;padding:12px 14px;}
  .o-sp .o-dw-top label{padding:6px 8px;cursor:pointer;color:var(--o-sub);font-size:12.5px;}
  .o-sp .o-dw h3{margin:16px 0 0;padding:0 20px 9px;font-size:10px;letter-spacing:.16em;color:#a3aab5;border-bottom:1px solid var(--o-line);}
  .o-sp .o-dw a{display:block;padding:15px 20px;font-size:14px;border-bottom:1px solid #f0f2f5;}
  .o-sp .o-dw a.o-dw-hi{background:var(--o-tint);font-weight:600;color:var(--o-navy);}

  /* --- ガイドページ --- */
  .o-gd .o-cols{grid-template-columns:1fr;gap:0;padding:22px 0 60px;}
  .o-gd .o-body{max-width:none;}
  .o-gd .o-body h1{font-size:21px;}
  .o-gd .o-body th,.o-gd .o-body td{padding:13px 10px;}
  .o-gd .o-body th{width:42%;}
  .o-gd .o-side{position:static;margin-top:52px;}
  .o-gd .o-side-list{grid-template-columns:1fr 1fr;}
  .o-gd .o-side-cta{grid-template-columns:1fr 1fr;}
  .o-gd .o-next{grid-template-columns:1fr;}

  /* --- ガイドナビ／FAQナビ --- */
  .o-guide-nav .o-guide-list{grid-template-columns:1fr 1fr;}
  .o-faq-nav .o-faq-list{grid-template-columns:1fr;}
  .o-gd .o-q>summary{padding:16px 34px 16px 0;font-size:13px;}
}

@media (max-width:600px){
  /* --- 記事18 --- */
  .orb-cut h1.orbiter-h1{font-size:21px;}
  .orb-cut h2.orbiter-h2{font-size:16px !important;margin-top:44px !important;}
  .orb-cut .orbiter-table{font-size:12.5px;}
  .orb-cut .orbiter-table td,.orb-cut .orbiter-table th{padding:11px 9px;white-space:normal;}
  .orb-cut .lead-def{padding:18px;}
  .orb-cut .lead-def p{font-size:14px;}
  .orb-cut .spec-list{grid-template-columns:1fr;}
  .orb-cut .trouble-row{gap:6px;}
  .orb-cut .trouble-row img{width:78px !important;max-width:78px !important;height:78px !important;padding:6px;}
  .orb-cut .trouble-row p{font-size:11px;}
  .orb-cut .band-navy{font-size:13.5px;}
  .orb-cut .band-red{font-size:15px;}
  .orb-cut .point-lead{flex-direction:column;text-align:center;}
  .orb-cut .point-lead p{font-size:14.5px;}
  .orb-cut .point-badge{width:108px;height:108px;}
  .orb-cut .badge-body{font-size:11.5px;}
  .orb-cut .ng-row{flex-direction:column;gap:4px;}
  .orb-cut .img-text-row{flex-direction:column;}
  .orb-cut .img-text-row img{flex:0 0 100%;max-width:100%;}
  .orb-cut .rule-box,.orb-cut .alert-box,.orb-cut .highlight-box-red,
  .orb-cut .highlight-box,.orb-cut .merit-box,.orb-cut .fit-box,.orb-cut .what-box{padding:16px 18px;}
  .orb-cut .step-wrap{flex-direction:column;}
  .orb-cut .cta-btn,.orb-cut .cta-btn-orange{display:block;width:100%;}
}

@media (max-width:480px){
  .orb-cut .toc-wrap ul{grid-template-columns:1fr;}
}

@media (prefers-reduced-motion:reduce){
  .o-hd *,.o-ann *,.o-sp *{animation:none !important;transition:none !important;}
}

/* ==========================================================================
   END
   ========================================================================== */


/* ==========================================================================
   SECTION 5 : 2026-09 追加
   ・タブレット（タッチ操作）でメガメニューが開かない問題の修正
   ・自作ページ（/docs/ に置くページ）専用のフッター
   影響範囲 : .o-hd / .o-ft を含むページのみ
   ========================================================================== */

/* タッチ端末：1回目のタップで開く（header.js が is-open を付けます） */
.o-hd .orb-cat-cell.is-open .o-mega{display:block;}
.o-hd .o-mega-all{display:inline-block;margin-top:12px;font-size:12px;color:var(--o-navy);border-bottom:1px solid #b9c3d8;}

/* 自作ページのフッター（ショップサーブのページには出ません） */
.o-ft,.o-ft *{box-sizing:border-box;}
.o-ft{
  background:#f5f7fb;border-top:1px solid var(--o-line);margin-top:0;
  font-family:"Hiragino Kaku Gothic ProN","Yu Gothic Medium","Yu Gothic",Meiryo,sans-serif;
  color:var(--o-ink);font-feature-settings:"palt";
}
.o-ft a{text-decoration:none;color:inherit;}
.o-ft .o-ft-cols{display:grid;grid-template-columns:repeat(4,1fr) 1.3fr;gap:28px;padding:44px 0 30px;}
.o-ft .o-ft-h{font-size:10px;letter-spacing:.16em;color:#a3aab5;margin:0 0 12px;padding-bottom:9px;border-bottom:1px solid var(--o-line);}
.o-ft .o-ft-cols a{display:block;font-size:12.5px;color:#454e5c;padding:5px 0;}
.o-ft .o-ft-cols a:hover{color:var(--o-navy);}
.o-ft .o-ft-p{font-size:12px;line-height:1.95;color:var(--o-sub);margin:0;}
.o-ft .o-ft-copy{font-size:10.5px;color:#a3aab5;border-top:1px solid var(--o-line);padding:16px 0 22px;margin:0;}

/* 自作ページの本文枠（サイドバーが無いぶん左右に余白を取る） */
.o-page{background:#fff;}
.o-page .o-gd .o-in{max-width:1200px;margin:0 auto;padding:0 24px;}

@media (max-width:960px){
  .o-ft .o-ft-cols{grid-template-columns:1fr 1fr;gap:22px;padding:32px 0 20px;}
  .o-ft .o-ft-cols>div:last-child{grid-column:1 / -1;}
  .o-page .o-gd .o-in{padding:0 16px;}
}


/* ==========================================================================
   SECTION 6 : 2026-10 ヘッダー1段目を紺色に統一
   ロゴ画像の紺色の背景と、ヘッダーの地の色をそろえて一体に見せます
   ========================================================================== */
.o-hd{background:var(--o-navy);border-bottom:0;}
.o-hd .o-r1{border-bottom:1px solid rgba(255,255,255,.12);}
.o-hd .o-search input{background:#fff;border-color:transparent;}
.o-hd .o-search input:focus{border-color:var(--o-gold);}
.o-hd .o-util a{color:rgba(255,255,255,.82);}
.o-hd .o-util svg{color:#fff;}
.o-hd .o-util a:hover,.o-hd .o-util a:hover svg{color:var(--o-gold);}
.o-hd .o-cart{background:var(--o-navy-d);border-left:1px solid rgba(255,255,255,.12);}
.o-hd .o-cart:hover{background:#021a4a;}
/* 電話（番号＋受付時間） */
.o-hd .o-util a.o-tel{display:grid;grid-template-columns:auto auto;grid-template-rows:auto auto;column-gap:8px;row-gap:1px;justify-items:start;align-items:center;padding-left:18px;border-left:1px solid rgba(255,255,255,.15);}
.o-hd .o-util a.o-tel svg{grid-row:1 / 3;width:22px;height:22px;}
.o-hd .o-tel-n{font-size:15px;font-weight:700;color:#fff;letter-spacing:.03em;}
.o-hd .o-tel-h{font-size:10px;color:rgba(255,255,255,.7);}
@media (max-width:1240px){ .o-hd .o-util a.o-tel{display:none;} }
@media (max-width:960px){
  .o-hd .o-burger span{background:#fff;}
  .o-hd .o-r1{border-bottom:0;}
}


/* ==========================================================================
   SECTION 7 : 2026-10 スマホのヘッダー
   ・紺のバー（三本線／ロゴ／検索／カート）を画面上部に固定
   ・検索窓は虫めがねを押したときだけ開く（いつもは隠して縦の長さを節約）
   ・カテゴリ帯は右端をぼかして「横にスクロールできる」ことを示す
   ========================================================================== */
.o-sbtn{display:none;}
@media (max-width:960px){
  .o-hd{padding-top:56px;}
  .o-hd .o-r1{position:fixed;top:0;left:0;right:0;z-index:900;height:56px;background:var(--o-navy);box-shadow:0 2px 10px rgba(0,0,0,.18);}
  .o-hd .o-logo img{height:32px;}
  .o-hd .o-sbtn{display:grid;place-items:center;width:48px;height:56px;margin-left:auto;border:0;background:none;color:#fff;cursor:pointer;padding:0;}
  .o-hd .o-sbtn svg{width:22px;height:22px;}
  .o-hd .o-cart{margin-left:0;width:64px;}
  /* 検索窓：ふだんは隠す。開いたら紺のバーのすぐ下に出す */
  .o-sp .o-sp-search{display:none;position:fixed;top:56px;left:0;right:0;z-index:899;background:var(--o-navy);border-top:1px solid rgba(255,255,255,.12);padding:10px 14px 12px;box-shadow:0 8px 16px rgba(0,0,0,.15);}
  .o-search-open .o-sp .o-sp-search{display:block;}
  .o-sp .o-sp-search input{background:#fff;border-color:transparent;}
  /* カテゴリ帯：右端をぼかす */
  .o-hd .orb-cat-bar{position:relative;}
  .o-hd .orb-cat-bar::after{content:"";position:absolute;top:0;right:0;bottom:0;width:36px;pointer-events:none;background:linear-gradient(90deg,rgba(10,69,153,0),rgba(10,69,153,.95));}
  /* お知らせバーを少し低く */
  .o-ann .o-in,.o-ann .o-ann-vp,.o-ann .o-ann-vp li{height:36px;line-height:36px;}
  .o-ann .o-ann-x{height:34px;}
  /* ドロワー上部のよく使うボタン */
  .o-sp .o-dw-quick{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--o-line);border-top:1px solid var(--o-line);border-bottom:1px solid var(--o-line);}
  .o-sp .o-dw-quick a{display:grid;justify-items:center;gap:4px;background:#fff;padding:14px 6px;font-size:12px;border:0;text-align:center;}
  .o-sp .o-dw-quick svg{width:22px;height:22px;color:var(--o-navy);}
  .o-sp .o-dw-quick small{font-size:10px;color:var(--o-sub);}
  .o-sp a.o-dw-mem{display:block;margin:12px 14px 4px;background:var(--o-navy);color:#fff;text-align:center;font-weight:700;font-size:13.5px;padding:13px;border-radius:4px;border:0;}
}


/* ==========================================================================
   SECTION 8 : 2026-10 フッターを濃いめのグレーに・サイト全体の案内を集約
   ========================================================================== */
.o-ft{background:#e4e7ec;border-top:0;}
.o-ft .o-ft-cols{grid-template-columns:repeat(5,1fr);}
.o-ft .o-ft-h{color:#242a35;font-size:12px;font-weight:700;letter-spacing:.04em;border-bottom-color:#cdd2da;}
.o-ft .o-ft-cols a{color:#3d4653;}
.o-ft .o-ft-shop{display:flex;flex-wrap:wrap;gap:6px 20px;align-items:baseline;border-top:1px solid #cdd2da;padding:18px 0;font-size:12px;color:#454e5c;}
.o-ft .o-ft-shop b{font-size:13px;color:#242a35;}
.o-ft .o-ft-copy{border-top-color:#cdd2da;color:#6f7885;}
@media (max-width:960px){
  .o-ft .o-ft-cols{grid-template-columns:1fr 1fr;}
  .o-ft .o-ft-cols>div:last-child{grid-column:auto;}
  .o-ft .o-ft-shop{flex-direction:column;gap:4px;}
}


/* ==========================================================================
   SECTION 9 : 2026-10 スマホではサイドバーを出さない
   （同じ内容が三本線メニューとフッターにあるため。ページが短くなる）
   本番のショップサーブでは、サイドバーは #sub-column という名前です
   ========================================================================== */
@media (max-width:960px){
  #sub-column{display:none !important;}
  .pv-side{display:none !important;}
  .o-sp a.o-dw-line{display:block;margin:6px 14px 4px;background:#06c755;color:#fff;text-align:center;font-weight:700;font-size:13.5px;padding:12px;border-radius:4px;border:0;}
  .o-sp a.o-dw-shop{display:block;margin:6px 14px 8px;background:#fff;color:var(--o-navy);text-align:center;font-size:12.5px;padding:10px;border-radius:4px;border:1px solid var(--o-navy);}
}
@media (max-width:960px){.o-sp a.o-dw-fax{display:block;margin:0 14px 10px;text-align:center;font-size:12px;color:var(--o-sub);border:0;padding:6px;text-decoration:underline;}}

/* ===== フッター上の案内帯（お支払い・送料納期・サポート） ===== */
.o-ft .o-fi{background:#f4f6f9;border-bottom:1px solid #cdd2da;}
.o-ft .o-fi-g{display:grid;grid-template-columns:1.15fr 1fr 1fr;gap:0;padding:34px 0 30px;}
.o-ft .o-fi-c{padding:0 26px;border-left:1px solid #cdd2da;}
.o-ft .o-fi-c:first-child{border-left:0;padding-left:0;}
.o-ft .o-fi-h{display:flex;align-items:center;gap:10px;font-size:17px;font-weight:700;color:#042d7a;margin:0 0 14px;}
.o-ft .o-fi-ic{width:30px;height:30px;border-radius:50%;border:1.5px solid #042d7a;display:flex;align-items:center;justify-content:center;font-size:14px;flex:none;}
.o-ft .o-fi-s{font-size:11.5px;font-weight:700;color:#454e5c;margin:12px 0 6px;}
.o-ft .o-fi-chips{display:flex;flex-wrap:wrap;gap:5px;}
.o-ft .o-fi-chips span{background:#fff;border:1px solid #cdd2da;border-radius:4px;padding:4px 8px;font-size:11.5px;color:#242a35;}
.o-ft .o-fi-pre span{background:#fff8e8;border-color:#e8d39a;}
.o-ft .o-fi-cards{font-size:10.5px;color:#6f7885;margin:5px 0 0;}
.o-ft .o-fi-warn{margin:12px 0 0;font-size:12px;color:#b3261e;font-weight:700;}
.o-ft .o-fi-warn b{color:#b3261e;}
.o-ft .o-fi-t{width:100%;border-collapse:collapse;font-size:12.5px;margin:0 0 10px;}
.o-ft .o-fi-t th{text-align:left;font-weight:700;color:#242a35;padding:7px 0;border-bottom:1px solid #dde1e8;width:5.5em;white-space:nowrap;}
.o-ft .o-fi-t td{padding:7px 0;border-bottom:1px solid #dde1e8;color:#242a35;}
.o-ft .o-fi-t td b{font-size:19px;color:#042d7a;margin-right:2px;}
.o-ft .o-fi-t td small{display:block;font-size:10.5px;color:#6f7885;}
.o-ft .o-fi-p{font-size:12px;line-height:1.8;color:#3d4653;margin:0 0 6px;}
.o-ft .o-fi-p b{color:#242a35;}
.o-ft .o-fi-note{background:#fff;border-radius:4px;padding:7px 10px;}
.o-ft .o-fi-tel{font-size:13px;color:#6f7885;margin:0 0 2px;}
.o-ft .o-fi-tel a{font-size:24px;font-weight:700;color:#242a35;letter-spacing:.02em;margin-left:6px;}
.o-ft .o-fi-fax{margin-top:0;font-size:16px;font-weight:700;color:#242a35;margin-bottom:8px;}
.o-ft a.o-fi-more{display:inline-block;margin:10px 14px 0 0;font-size:12.5px;font-weight:700;color:#042d7a;}
.o-ft a.o-fi-more::before{content:"▸ ";color:#c9a227;}
@media(max-width:900px){
  .o-ft .o-fi-g{grid-template-columns:1fr;padding:22px 0;}
  .o-ft .o-fi-c{border-left:0;padding:18px 0;border-top:1px solid #cdd2da;}
  .o-ft .o-fi-c:first-child{border-top:0;padding-top:0;}
}
/* ===== ガイド：支払いタイミング・メールの流れ・注意箱 ===== */
.o-gd .o-pay3{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:14px 0 18px;}
.o-gd .o-pay3>div{border:1.5px solid #cdd2da;border-radius:8px;padding:14px;background:#fff;}
.o-gd .o-pay3 h3{margin:0 0 4px!important;font-size:15px!important;color:#042d7a;border:0!important;padding:0!important;}
.o-gd .o-pay3 .o-when{font-size:12px;font-weight:700;margin:0 0 8px!important;}
.o-gd .o-pay3 ul{margin:0;padding-left:1.1em;font-size:13px;line-height:1.8;}
.o-gd .o-pay3 .is-fast{border-color:#1f7a4d;} .o-gd .o-pay3 .is-fast .o-when{color:#1f7a4d;}
.o-gd .o-pay3 .is-pre{border-color:#d29a1b;background:#fffaf0;} .o-gd .o-pay3 .is-pre .o-when{color:#a86b00;}
.o-gd .o-warn{border:2px solid #b3261e;background:#fff5f4;border-radius:8px;padding:14px 16px;margin:16px 0;}
.o-gd .o-warn p{margin:0 0 6px!important;} .o-gd .o-warn p:last-child{margin:0!important;}
.o-gd .o-warn strong{color:#b3261e;}
.o-gd ol.o-steps{list-style:none;counter-reset:st;padding:0;margin:14px 0;}
.o-gd ol.o-steps>li{counter-increment:st;position:relative;padding:12px 14px 12px 52px;border:1px solid #dde1e8;border-radius:8px;margin:0 0 10px;background:#fff;}
.o-gd ol.o-steps>li::before{content:counter(st);position:absolute;left:14px;top:12px;width:26px;height:26px;border-radius:50%;background:#042d7a;color:#fff;font-weight:700;display:flex;align-items:center;justify-content:center;font-size:13px;}
.o-gd ol.o-steps b.o-mail{display:inline-block;background:#eef2fc;border-radius:4px;padding:2px 8px;font-size:13px;color:#042d7a;margin:4px 0;}
.o-gd ol.o-steps p{margin:4px 0 0!important;font-size:13.5px;}
.o-gd .o-tag{display:inline-block;font-size:11px;font-weight:700;border-radius:3px;padding:1px 6px;margin-right:6px;vertical-align:1px;}
.o-gd .o-tag.pre{background:#fff1d6;color:#8a5a00;} .o-gd .o-tag.now{background:#e3f4ea;color:#1f7a4d;} .o-gd .o-tag.after{background:#e8edf9;color:#042d7a;}
.o-gd .o-type{border:1.5px solid #cdd2da;border-radius:8px;padding:14px 16px;margin:0 0 14px;background:#fff;}
.o-gd .o-type h3{margin-top:0!important;}
@media(max-width:768px){.o-gd .o-pay3{grid-template-columns:1fr;}}

/* ===== フッター最下部の黒帯・ページトップへ戻るボタン ===== */
.o-ft .o-ft-bar{background:#111;color:#fff;}
.o-ft .o-ft-bar .o-ft-shop{border-top:0;justify-content:center;text-align:center;padding:22px 0 8px;color:rgba(255,255,255,.85);}
.o-ft .o-ft-bar .o-ft-shop b{color:#fff;}
.o-ft .o-ft-bar .o-ft-copy{border-top:0;text-align:center;color:rgba(255,255,255,.6);padding:6px 0 22px;}
.o-totop{position:fixed;right:20px;bottom:20px;z-index:900;width:48px;height:48px;background:#111;border:1px solid rgba(255,255,255,.4);box-sizing:border-box;color:#fff;display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:opacity .2s,visibility .2s;box-shadow:0 2px 8px rgba(0,0,0,.25);text-decoration:none;}
.o-totop.is-on{opacity:1;visibility:visible;}
.o-totop svg{width:24px;height:24px;}
.o-totop:hover{background:#042d7a;}
@media(max-width:768px){.o-ft .o-ft-bar .o-ft-shop{flex-direction:column;align-items:center;gap:4px;}.o-totop{right:12px;bottom:12px;width:42px;height:42px;}}

/* フッター帯：支払いロゴ */
.o-ft .o-fi-logos{display:flex;flex-wrap:wrap;gap:6px;align-items:center;}
.o-ft .o-fi-logos img{height:34px;width:auto;background:#fff;border:1px solid #cdd2da;border-radius:4px;padding:3px 5px;box-sizing:border-box;}
.o-ft .o-fi-logos img.o-fi-big{height:auto;width:210px;max-width:100%;}
.o-ft .o-fi-chips span.o-fi-chipimg{display:inline-flex;align-items:center;gap:6px;}
.o-ft .o-fi-chipimg img{height:16px;width:auto;}

/* ガイド：ボタン風リンク */
.o-gd .o-btn-link{display:inline-block;background:#042d7a;color:#fff!important;font-weight:700;font-size:13.5px;padding:9px 14px;border-radius:6px;text-decoration:none!important;}
.o-gd .o-btn-link:hover{background:#021a4a;}
.o-gd .is-pre .o-btn-link{background:#a86b00;}