:root{
  --bg:#0b0b0f; --bg2:#0e0e16; --ink:#f1f1f3; --muted:#b8b8c7; --gold:#c9a14a;
  --max:1100px; --radius:18px; --shadow:0 18px 48px rgba(0,0,0,.35);
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:"Noto Serif JP",serif; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}

/* container */
.container{max-width:var(--max); margin:0 auto; padding:0 20px}

/* loading */
.loading{position:fixed; inset:0; display:grid; place-items:center; background:#0a0a0d; z-index:9999}
.loading__inner{width:min(520px,90vw); text-align:center}
.loading__logo{letter-spacing:.06em; font-weight:600; font-size:24px; margin-bottom:14px; color:#e9e9ee}
.loading__bar{height:4px; background:rgba(255,255,255,.08); border-radius:999px; overflow:hidden}
.loading__bar span{display:block; height:100%; width:30%; background:linear-gradient(90deg,#fff,#ddd); animation:ld 1.4s ease-in-out infinite}
@keyframes ld{50%{transform:translateX(240%)}100%{transform:translateX(0)}}
.loading.is-hide{opacity:0; transition:opacity .7s ease}

/* header */
.site-header{position:sticky; top:0; z-index:50; backdrop-filter:saturate(120%) blur(8px);
  background:linear-gradient(180deg,rgba(15,15,24,.65),rgba(15,15,24,.35) 60%,transparent);
  border-bottom:1px solid rgba(255,255,255,.06)}
.nav{max-width:var(--max); margin:0 auto; padding:10px 20px; display:flex; align-items:center; gap:16px}
.nav__brand{color:#fff; text-decoration:none; font-weight:700; letter-spacing:.05em}
.nav__menu{margin-left:auto; display:flex; gap:14px; align-items:center}
.nav__link{color:#d9d9e0; text-decoration:none; font-size:14px; padding:8px 10px; border-radius:8px; transition:background .2s}
.nav__link:hover{background:rgba(255,255,255,.08)}
.nav__toggle{display:none; background:none; border:0; margin-left:auto}
.nav__toggle span{display:block; width:22px; height:2px; background:#fff; margin:5px 0}
@media (max-width:840px){
  .nav__toggle{display:block}
  .nav__menu{position:absolute; right:12px; top:56px; flex-direction:column; background:#14141e; padding:10px; border-radius:12px; box-shadow:var(--shadow); display:none}
  .nav__menu.is-open{display:flex}
}

/* hero */
.hero{position:relative; overflow:hidden; border-radius:var(--radius); margin:18px 18px 28px; background:var(--bg); box-shadow:var(--shadow)}
.hero__bg{position:absolute; inset:-3%;
  background:
    radial-gradient(1200px 600px at 85% 10%, rgba(123,198,255,.22), transparent 60%),
    radial-gradient(800px 400px at 0% 100%, rgba(201,161,74,.22), transparent 60%),
    linear-gradient(180deg, var(--bg), var(--bg2));
  animation:bgFloat 22s ease-in-out infinite alternate;
  will-change:transform}
.hero__grain{position:absolute; inset:0; pointer-events:none; opacity:.18;
  background:
    radial-gradient(2px 2px at 12% 18%, rgba(255,255,255,.7), transparent 60%),
    radial-gradient(1.5px 1.5px at 84% 34%, rgba(255,255,255,.6), transparent 60%),
    radial-gradient(1.5px 1.5px at 46% 78%, rgba(255,255,255,.5), transparent 60%)}
@keyframes bgFloat{to{transform:translateY(-12px)}}
.hero__inner{position:relative; z-index:1; text-align:center; padding:76px 20px}
.hero__title{font-size:clamp(28px,6.4vw,64px); line-height:1.06; margin:0 0 8px; font-weight:800; letter-spacing:.02em}
.grad{background:linear-gradient(90deg,#fff,#e8e8e8); -webkit-background-clip:text; background-clip:text; color:transparent}
.hero__sub{max-width:760px; margin:0 auto 20px; color:var(--muted); font-size:15px}
.hero__cta{display:inline-flex; gap:12px; flex-wrap:wrap; justify-content:center}
.btn{display:inline-block; padding:12px 18px; border-radius:999px; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.14);
  color:#fff; text-decoration:none; transition:transform .2s, background .2s, box-shadow .2s; box-shadow:0 10px 24px rgba(0,0,0,.28)}
.btn:hover{transform:translateY(-2px); background:rgba(255,255,255,.12)}
.btn--gold{background:linear-gradient(180deg, rgba(201,161,74,.9), rgba(201,161,74,.58)); color:#1b1406; border:none}
.btn--gold::after{content:""; position:absolute; inset:-1px; border-radius:inherit; pointer-events:none;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.35), transparent); transform:translateX(-120%); filter:blur(.4px)}
.btn--gold:hover::after{transform:translateX(120%); transition:transform .6s}

@media (max-width:768px){
  .hero{margin:12px; border-radius:12px}
}

/* sections */
.sec{padding:48px 0}
.sec__title{font-size:26px; font-weight:700; letter-spacing:.04em; margin:0 0 12px; padding-left:12px; position:relative}
.sec__title::before{content:""; position:absolute; left:0; top:50%; width:4px; height:1.35em; background:var(--gold); transform:translateY(-50%); border-radius:2px}
.sec__lead{color:var(--muted)}

/* products grid */
.grid{display:grid; grid-template-columns:repeat(3,1fr); gap:18px}
@media (max-width:840px){.grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.grid{grid-template-columns:1fr}}
.card{background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.03)); border:1px solid rgba(255,255,255,.08);
  border-radius:16px; backdrop-filter:blur(3px); box-shadow:0 10px 26px rgba(0,0,0,.28); padding:14px; will-change:transform; transform-style:preserve-3d}
.card__media{height:160px; border-radius:12px; background:
  radial-gradient(180px 100px at 60% 15%, rgba(201,161,74,.35), transparent 65%),
  radial-gradient(150px 80px at 10% 85%, rgba(123,198,255,.35), transparent 65%),
  linear-gradient(180deg,#12121a,#191926); border:1px solid rgba(255,255,255,.06)}
.card__title{margin:10px 8px 4px; font-size:16px; font-weight:700}
.card__meta{margin:0 8px 6px; color:var(--muted); font-size:13px}

/* footer */
.site-footer{padding:22px 0; border-top:1px solid rgba(255,255,255,.06); text-align:center; color:#cfcfda}

/* scroll reveal */
.sr{opacity:0; transform:translateY(14px)}
.sr.in{opacity:1; transform:none; transition:opacity .65s ease, transform .65s ease}
.tilt{transition:transform .08s linear}

/* motion-reduce */
@media (prefers-reduced-motion: reduce){
  .hero__bg{animation:none}
  .sr{opacity:1; transform:none}
  .tilt, .btn--gold::after{transition:none}
}

/*３商品横並び*/
/* ========== TOPの商品リストを3列グリッド化（ULに .g3 が付いた時のみ） ========== */
ul.row.unstyled.g3{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:18px;
  padding:0;              /* ブラウザ既定の余白を除去 */
  list-style:none;
}
ul.row.unstyled.g3 > li{
  margin:0 !important;
  width:auto !important;
  float:none !important;   /* 既存のfloat/col系を無効化 */
}
@media (max-width: 840px){
  ul.row.unstyled.g3{ grid-template-columns:repeat(2, minmax(0,1fr)); }
}
@media (max-width: 520px){
  ul.row.unstyled.g3{ grid-template-columns:1fr; }
}

/* 商品カードの見栄えを維持（既存スタイルを補強） */
ul.row.unstyled.g3 > li img{
  display:block;
  width:100%;
  height:auto;
  border-radius:12px;
}
/*0930-3*/
/* =========================
   Features（左テキスト×右パネル）
   ========================= */
.sec.features { padding: 64px 0; }
.features__wrap {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 32px;
  align-items: center;
}
.features__title{
  font-size: clamp(28px, 4.6vw, 48px);
  letter-spacing: .04em; margin: 0 0 24px; color:#f1eee5;
}
.features__title::after{
  content:""; display:block; width:56px; height:2px;
  background: var(--gold); margin-top:10px;
}
.features__list{ display:grid; gap:24px; }
.feature{ padding-left:18px; border-left:4px solid var(--gold); }
.feature__head{ margin:0 0 4px; font-weight:700; color:#e9e7de; }
.feature__desc{ margin:0; color:#c9c9d2; }

.features__panel{
  background:#1d1d23; border-radius:18px; min-height:360px;
  display:grid; place-items:center; box-shadow: var(--shadow);
}
.features__panel .label{ color:#eae7de; letter-spacing:.12em; }

/* SP：1カラム化 */
@media (max-width: 840px){
  .features__wrap{ grid-template-columns: 1fr; }
  .features__panel{ min-height:260px; }
}

/* =========================
   Productsを“白地×金アクセント”に
   ========================= */
.sec--light{ background: linear-gradient(180deg,#fbf8f3,#ffffff); color:#2e2e2e; }
.sec--light .sec__title{ color:#2e2e2e; }
.sec--light .sec__title::before{ background: var(--gold); }

/* モデルの白カード質感に寄せる */
.sec--light .grid .card{
  background: linear-gradient(180deg,#ffffff,#f6f6f6);
  border:1px solid rgba(0,0,0,.06);
  box-shadow:0 14px 28px rgba(0,0,0,.10);
}
.sec--light .card__title{ color:#2e2e2e; }
.sec--light .card__meta{ color:#6f6f7a; }

/* ColorMe側（おすすめ/新着/売れ筋）のULを3列カード風に */
ul.row.unstyled.g3 > li{
  background: linear-gradient(180deg,#ffffff,#f6f6f6);
  border:1px solid rgba(0,0,0,.06);
  border-radius:16px;
  box-shadow:0 14px 28px rgba(0,0,0,.10);
  padding:14px; text-align:left; color:#2e2e2e;
}
ul.row.unstyled.g3 > li a{ color:#2e2e2e; text-decoration:none; }
ul.row.unstyled.g3 > li a:hover{ text-decoration:underline; }
ul.row.unstyled.g3 > li img{
  border-radius:12px;
  background: linear-gradient(180deg,#f5f5f5,#ececec);
}
/* 価格（ColorMe側が <span class="price"> を出力する想定） */
.recommend-unit .price,
.new-item-unit .price,
.seller-unit .price{ color:#c9a14a; font-weight:700; }

/*画像追加*/
/* ===== メイン画像（ヒーロー）を指定：テキストはそのまま前面に表示 ===== */
.hero__bg{
  /* 画像の上に薄い黒グラデ＝スケルトンで可読性UP */
  background:
    linear-gradient(180deg, rgba(0,0,0,.55), rgba(0,0,0,.45) 40%, rgba(0,0,0,.58)),
    url("https://img21.shop-pro.jp/PA01489/032/etc_base64/MDg1Q0FCMzAtMTMyRi00RjM4LUI1NDQtQUJDQTUzODBDRTQw.jpeg?cmsp_timestamp=20250930195845");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  opacity: 0.98;               /* ほんのり落ち着かせる */
}

/* ヒーローテキストは既存通り前面（z-index指定は既にOKだが保険で） */
.hero__inner{ position:relative; z-index:1; }

/* ===== 職人の技：画像を背景にしてラベルは前面 ===== */
.features__panel{
  position: relative;
  overflow: hidden;
  background: #1d1d23; /* 画像未読込のときの下地 */
}
/* 背景画像本体 */
.features__panel::before{
  content:"";
  position:absolute; inset:0;
  background:
    url("https://img21.shop-pro.jp/PA01489/032/etc_base64/MTE4.jpg?cmsp_timestamp=20250930195845")
    center / cover no-repeat;
  filter: saturate(105%);
}
/* 読みやすくする薄い黒ベール（スケルトン） */
.features__panel::after{
  content:"";
  position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(0,0,0,.28), rgba(0,0,0,.28));
}
/* ラベルは最前面に */
.features__panel .label{ position: relative; z-index: 1; }

/*ロゴ位置変更*/
/* ===== About 左にロゴスペースを確保 ===== */
#about.about-wrap{
  display:grid;
  grid-template-columns: 340px 1fr;   /* 左ロゴ 340px／右本文 */
  gap: 32px;
  align-items: start;
}
.about-wrap__logo{
  min-height: 240px;
  display:flex; align-items:center; justify-content:center;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 14px;
  overflow:hidden;
}
.about-wrap__logo img{
  display:block; max-width:100%; height:auto;
  /* 余白が欲しければパディングで微調整 */
  padding: 10px;
}
.about-wrap__body{ min-width:0; } /* 折返し安定 */

@media (max-width: 960px){
  #about.about-wrap{ grid-template-columns: 1fr; }
  .about-wrap__logo{ order:-1; } /* モバイルはロゴを上に */
}
/* ===== TOPだけ：ヘッダ上のロゴを隠して上に詰める ===== */
body.top-header-compact #header .header-logo,
body.top-header-compact #header .logo,
body.top-header-compact #header #logo,
body.top-header-compact #header #shop_logo,
body.top-header-compact .globalHeader .logo,
body.top-header-compact .hd_logo,
body.top-header-compact #contents > .shop-logo {
  display: none !important;
}

/* 万一、ロゴ画像がコンテンツ直下に素の <img> で置かれている場合も隠す（URLが“logo”等） */
body.top-header-compact #contents > img[src*="logo"],
body.top-header-compact #contents > *:first-child img[src*="logo"] {
  display: none !important;
}

/* 余白の圧縮（テーマ差異に広めに対応） */
body.top-header-compact #header,
body.top-header-compact .site-header { margin-bottom: 0 !important; padding-top: 0 !important; }
body.top-header-compact #contents { padding-top: 0 !important; margin-top: 0 !important; }

/* ヒーローがある場合はわずかに余白を残す（好みで調整） */
body.top-header-compact #cm-top-hero,
body.top-header-compact #hero { margin-top: 8px !important; }
/* TOPだけ：ヘッダ上のロゴ（画像＋直後の店名テキスト）を確実に隠す */
body.top-header-compact #header .header-logo,
body.top-header-compact #header .hd_logo,
body.top-header-compact #header .shop-logo,
body.top-header-compact #header .shopLogo,
body.top-header-compact #header .logo,
body.top-header-compact #header #logo,
body.top-header-compact #header #shop_logo,
body.top-header-compact #globalHeader .logo,
body.top-header-compact #header img[alt*="NAKAMURYA"],
body.top-header-compact #header img[alt*="日本酒専門店"],
body.top-header-compact #header img[src*="logo"],
/* 画像の直後に店名テキスト要素があるパターンも消す */
body.top-header-compact #header img[alt*="NAKAMURYA"] + *,
body.top-header-compact #header img[alt*="日本酒専門店"] + * {
  display: none !important;
}

/* 余白を詰める（テーマ差異に広めに対応） */
body.top-header-compact #header,
body.top-header-compact .globalHeader,
body.top-header-compact .site-header { margin-top: 0 !important; padding-top: 0 !important; }
body.top-header-compact #contents { margin-top: 0 !important; padding-top: 0 !important; }

/* ヒーローがある場合、ほんの少しだけ余白 */
body.top-header-compact #hero,
body.top-header-compact #cm-top-hero { margin-top: 8px !important; }
/* 1) 上段の Products セクションをまるごと隠す */
#products{ display:none !important; }

/* 3) 「おすすめ商品」をフル幅に寄せて詰める */
.recommend-box{ 
  padding-left:0 !important; 
  padding-right:0 !important; 
  margin-left:0 !important; 
  margin-right:0 !important;
}

/* ULを確実にグリッド全幅に。右の空きが出ないよう余白をゼロ化 */
.recommend-box ul.row.unstyled.g3{
  width:100% !important;
  padding:0 !important;
  margin:0 !important;
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:14px; /* もっと詰めたいなら 10px などに */
}
.recommend-box ul.row.unstyled.g3 > li{
  margin:0 !important;
  width:auto !important;
  float:none !important;
}

@media (max-width: 840px){
  .recommend-box ul.row.unstyled.g3{ grid-template-columns:repeat(2, minmax(0,1fr)); }
}
@media (max-width: 520px){
  .recommend-box ul.row.unstyled.g3{ grid-template-columns:1fr; }
}
/* --- おすすめ商品の左右余白を完全にゼロ／左に詰める --- */
#contents .recommend-box{
  /* container幅に揃える（見出しと同じ左位置に）*/
  max-width: var(--max);
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* 親.row/ULに残る左右のmargin/paddingを無効化 */
#contents .recommend-box > .row,
#contents .recommend-box > ul.row.unstyled{
  margin-left: 0 !important;
  padding-left: 0 !important;
  width: 100% !important;
  box-sizing: border-box;
}

/* ULをグリッド化（左端からピタッと） */
#contents .recommend-box > ul.row.unstyled{
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 14px;                /* もっと詰めたい場合は 10px などに */
  justify-content: stretch; 
  align-items: stretch;
}

/* li側に残るcol/float系を完全無効化 */
#contents .recommend-box > ul.row.unstyled > li{
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  padding-left: 0 !important;   /* col系の左右パディングを殺す */
  padding-right: 0 !important;
}
@media (max-width: 840px){
  #contents .recommend-box > ul.row.unstyled{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 520px){
  #contents .recommend-box > ul.row.unstyled{ grid-template-columns: 1fr; }
}
/* --- TOPだけ完全1カラム化（サイド非表示 & 左余白ゼロ）--- */
body.top-onecol #side{ display:none !important; }
body.top-onecol #contents{
  float:none !important;
  width:auto !important;
  padding-left:0 !important;
}
body.top-onecol #contents .row,
body.top-onecol #contents .col,
body.top-onecol #contents [class*="col-"]{
  float:none !important;
  width:100% !important;
  margin-left:0 !important;
}

/* --- おすすめ商品の左右の空きゼロ＆3列グリッド固定 --- */
body.top-onecol .recommend-box{ margin:0 !important; padding:0 !important; }
body.top-onecol .recommend-box ul.row.unstyled{ margin:0 !important; padding:0 !important; }
body.top-onecol .recommend-box ul.row.unstyled.g3{
  width:100% !important;
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:14px;
}
@media (max-width:840px){ body.top-onecol .recommend-box ul.row.unstyled.g3{ grid-template-columns:repeat(2, minmax(0,1fr)); } }
@media (max-width:520px){ body.top-onecol .recommend-box ul.row.unstyled.g3{ grid-template-columns:1fr; } }

/* --- （重要）Productsを消していた行を削除 or 無効化 --- */
/* #products{ display:none !important; }  ← この1行は削除する（またはコメントアウト） */
/* --- おすすめ商品：常に3列（サイドがあっても3列）--- */
.recommend-box ul.row.unstyled{
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0,1fr)) !important;
  gap: 16px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none;
}
.recommend-box ul.row.unstyled > li{
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}
.recommend-box ul.row.unstyled > li img{
  display: block;
  width: 100% !important;
  height: auto !important;
}

/* モバイルだけ段階的に落とす（閾値を下げる） */
@media (max-width: 680px){
  .recommend-box ul.row.unstyled{
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (max-width: 420px){
  .recommend-box ul.row.unstyled{
    grid-template-columns: 1fr !important;
  }
}
/* このテンプレのTOPだけで、フリースペース（重複テキスト）を非表示 */
body.top-onecol .row.mar_b_50 { display: none !important; }
/* ==== TOPだけに適用（他テンプレは無影響） ==== */
body.top-onecol .pb-products-section{margin:80px auto;max-width:1200px;padding:0 16px;}
body.top-onecol .pb-section-title{font-size:28px;font-weight:700;letter-spacing:.08em;border-bottom:1px solid rgba(255,255,255,.2);padding-bottom:.4em;margin-bottom:20px;}
body.top-onecol .pb-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:24px;}
body.top-onecol .pb-more-wrap{display:flex;justify-content:center;margin-top:24px;}
body.top-onecol .pb-more{display:inline-block;padding:10px 24px;border:1px solid rgba(255,255,255,.35);border-radius:999px;text-decoration:none}
body.top-onecol .pb-more:hover{opacity:.85}

/* 「おすすめ商品」リストを6件に制限（JSで付与するマーカーに反応） */
body.top-onecol .pb-limit-featured > *:nth-child(n+7){ display:none !important; }
/* ========== TOPだけ：Pick UP ITEMS を3列の均一カードに ========== */
body.top-onecol .p-pickup-list{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:24px;
  margin:24px 0 0;
  padding:0;            /* ULの既定余白を除去 */
  list-style:none;      /* 左の「・」を消す */
}
@media (max-width: 980px){
  body.top-onecol .p-pickup-list{ grid-template-columns:repeat(2, minmax(0,1fr)); }
}
@media (max-width: 640px){
  body.top-onecol .p-pickup-list{ grid-template-columns:1fr; }
}

/* 各カード枠（高さを統一・float等の旧スタイル無効化） */
body.top-onecol .p-pickup-list__item{
  display:flex; flex-direction:column;
  background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.03));
  border:1px solid rgba(255,255,255,.08);
  border-radius:14px; overflow:hidden;
  min-height:460px;                   /* ← 好みに応じて 420&#12316;520px で調整 */
  margin:0 !important; width:auto !important; float:none !important;
}

/* 画像エリア：比率固定で揃える（古い画像でもOK） */
body.top-onecol .p-pickup-list__img{
  position:relative;
  width:100%;
  aspect-ratio: 4 / 3;                /* 固定比率（対応外ブラウザは下の高さが効く） */
  height:auto;                         /* 予備：古いブラウザは下行を使う */
}
@supports not (aspect-ratio: 4 / 3){
  body.top-onecol .p-pickup-list__img{ height:240px; }
}
body.top-onecol .p-pickup-list__img a,
body.top-onecol .p-pickup-list__img img{
  display:block; width:100%; height:100%; object-fit:cover;
}
body.top-onecol .p-pickup-list__img .p-pickup-list__img-bg{
  position:absolute; inset:0; pointer-events:none;   /* 既存の薄いオーバレイを維持 */
}

/* テキスト部をカード下端にそろえる */
body.top-onecol .p-pickup-list__txt{ 
  display:flex; flex-direction:column; gap:8px;
  padding:12px 14px 16px; margin-top:auto;
}
body.top-onecol .p-pickup-list__ttl{ margin:0; font-weight:700; }
body.top-onecol .p-pickup-list__body{ margin:0; opacity:.85; }
body.top-onecol .p-pickup-list__btn{ margin-top:auto; } /* MOREボタンを最下部へ */
/* ====== TOPだけ：ヘッダー／フッターの文字色を白に ====== */
body.top-onecol #header a:not(.btn):not([class*="btn"]),
body.top-onecol #Head a:not(.btn):not([class*="btn"]),
body.top-onecol header nav a {
  color:#fff !important;
  opacity:1 !important;   /* うっすら灰色になる対策 */
  text-decoration:none;
}
body.top-onecol #footer a,
body.top-onecol #Footer a,
body.top-onecol footer nav a {
  color:#fff !important;
  opacity:1 !important;
  text-decoration:none;
}
body.top-onecol #header a:hover,
body.top-onecol #footer a:hover { text-decoration:underline; }

/* （任意）黒アイコンを白に。白スプライトがある場合はこちらを有効化
body.top-onecol #header .icon-lg-b,
body.top-onecol #footer .icon-lg-b {
  background-image:url(https://img.shop-pro.jp/tmpl_img/73/icon24_w.png) !important;
}
@media (min-resolution:2dppx){
  body.top-onecol #header .icon-lg-b,
  body.top-onecol #footer .icon-lg-b {
    background-image:url(https://img.shop-pro.jp/tmpl_img/73/icon24_2x_w.png) !important;
  }
}
*/

/* （代替）画像アイコンを反転して白っぽく見せる */
body.top-onecol #header img[src*="icon"],
body.top-onecol #footer img[src*="icon"] { filter: invert(1) brightness(1.1); }
/* TOPだけ：問い合わせリンクの見た目 */
body.top-onecol .contact-lead a{
  color:#fff; text-decoration:underline; font-weight:700;
}
body.top-onecol .contact-lead a:hover{ opacity:.85; }

/* フッターをページ最下部に固定（内容が短いページでも下へ） */
body{ display:flex; flex-direction:column; min-height:100vh; }       /* 既存指定に追加OK */
.site-footer{ margin-top:auto; }                                      /* 既存 .site-footer に追加 */
/* TOPだけ：下の&#169;行（横線含む）を完全に消す */
body.top-onecol .site-footer{
  display:none !important;
  border:0 !important;
  padding:0 !important;
  margin:0 !important;
}
/* --- Products ドロップダウン --- */
.nav__item{ position:relative; }
.nav__submenu{
  position:absolute; top:calc(100% + 6px); right:0;
  display:none; min-width: 240px;
  background:#14141e; border:1px solid rgba(255,255,255,.08);
  border-radius:12px; padding:8px; box-shadow:0 18px 48px rgba(0,0,0,.35);
  z-index:60;
}
.nav__submenu a{
  display:block; padding:10px 12px; border-radius:8px;
  color:#e9e9ee; text-decoration:none; white-space:nowrap;
}
.nav__submenu a:hover{ background:rgba(255,255,255,.08); }

/* PCホバー表示／キーボード操作でも開く */
.has-sub:hover .nav__submenu,
.has-sub:focus-within .nav__submenu{ display:block; }

/* モバイル時：メニュー展開時にクリックで開閉 */
@media (max-width:840px){
  .nav__submenu{
    position:static; display:none; width:100%; margin-top:6px;
    background:#14141e; border:1px solid rgba(255,255,255,.08);
  }
  .has-sub.is-open .nav__submenu{ display:block; }
}