/*
Theme Name: Flower Nakashima Child
Theme URI:
Template: twentytwentyfive
Description: 静的HTMLから変換した子テーマ (Flower Nakashima)
Author:
Author URI:
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: flower-nakashima-child
*/

/* =========================================
   1. Reset
========================================= */

/* Box sizing */
*, *::before, *::after {
  box-sizing: border-box;
}

/* 基本文字・余白リセット */
html, body {
  margin: 0;
  padding: 0;
  height: 100%;
  line-height: 1.5;
  -webkit-text-size-adjust: 100%;
  text-rendering: optimizeLegibility;
}

body {
  word-break: break-word;
  font-size: 16px;
}

/* 見出しのデフォルト装飾を無効化 */
h1, h2, h3, h4, h5, h6 {
  margin: 0;
  padding: 0;
  font-size: inherit;
  font-weight: inherit;
}

/* テキスト系 */
p, blockquote, figure {
  margin: 0;
  padding: 0;
}

/* リスト */
ul, ol {
  margin: 0;
  padding: 0;
  list-style: none;
}

/* リンク */
a {
  color: inherit;
  text-decoration: none;
}
a:focus-visible {
  outline: 2px solid #000;
  outline-offset: 2px;
}

/* メディア要素 */
img, picture, video, canvas, svg {
  display: block;
  max-width: 100%;
}
img { border-style: none; }

/* テーブル */
table {
  border-collapse: collapse;
  border-spacing: 0;
}
th, td {
  padding: 0;
}

/* フォーム要素をフラット化 */
button, input, select, textarea {
  font: inherit;
  color: inherit;
  background: transparent;
  border: none;
  border-radius: 0;
  -webkit-appearance: none;
  appearance: none;
  padding: 0;
}

::placeholder {
  color: inherit;
  opacity: .6;
}

/* code / pre */
pre, code, kbd, samp {
  font-family: monospace, system-ui;
  font-size: 1em;
}

/* アクセシビリティ */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* PC・TBでは電話リンク解除 ---------------------------- */
@media (min-width: 751px) {
    a[href*="tel:"] {
      pointer-events: none;
  }
}



/* =========================
   Flower Nakashima – style.css (clean)
   ========================= */

/* ===== Base ===== */
:root{
  --bg:#fafafa; --panel:#ffffff; --ink:#222; --ink-weak:#666;
  --silver:#cfd4da; --silver-weak:#e7eaee; --gold:#c7a86a;

  --header-h:72px;
  --logo-h:48px;

  /* MV bokeh colors (final) */
  --mv-bokeh-gold:   rgba(199,168,106,.85);
  --mv-bokeh-silver: rgba(207,212,218,.72);

  /* calm accents */
  --acc-grad: linear-gradient(90deg, var(--gold), var(--silver));
}

*{ box-sizing:border-box; }
html,body{ height:100%; }
body{
  margin:0; color:var(--ink); background:var(--bg);
  font-family:"Noto Sans JP",system-ui,-apple-system,"Segoe UI",Roboto,"Hiragino Kaku Gothic ProN","Noto Sans JP",sans-serif;
  line-height:1.6;
}
.container{ width:min(1200px,92%); margin-inline:auto; }
.btn,.card,.pill,.placeholder,.thumb,.logo,.footer,.news__item,.shop__map,.nav,.header{ border-radius:0; }

/* ===== Header（常時透明。色のみ切替） ===== */
/* ▼ 修正方針
   - .header--solid 付与時：文字は黒（PC/SP共通）
   - 背景はPCのみ付与、SPは透明のまま
   - ハンバーガー（.nav-toggle-btn）は常に header の color を継承して色追従
*/
.header{
  position:fixed; inset:0 0 auto 0; height:var(--header-h);
  display:flex; align-items:center; z-index:30;
  background-color: transparent;
  color:#fff;
  border:0; box-shadow:none;
  transition:
    color .25s ease,
    background-color .25s ease,
    backdrop-filter .25s ease,
    -webkit-backdrop-filter .25s ease;
}
.header::before,.header::after{ content:none; display:none; }
.header a{ color:inherit; text-decoration:none; }
.header__inner{ display:flex; align-items:center; gap:.8rem; width:100%; height:var(--header-h); padding-inline:clamp(24px,5vw,72px); }

/* スムーススクロール（全体） */
html { scroll-behavior: smooth; }

/* 固定ヘッダーに被らないよう、アンカー位置を少し下げる */
#choose-product {
  scroll-margin-top: calc(var(--header-h, 72px) + 12px);
}

/* ロゴ切替 */
.logo{ display:inline-flex; align-items:center; }
.logo__img{ display:block; height:var(--logo-h); width:auto; }
.header:not(.header--solid) .logo__img--solid{ display:none; }
.header.header--solid .logo__img--hero{ display:none; }

/* スクロール後：文字色は黒（PC/SP共通）、背景はデバイス別に */
.header.header--solid{
  color:var(--ink);
  background-color: transparent; /* SPの要件：背景は付けない（デフォルト透明） */
}

/* PCだけ：solid時に背景色を付ける */
@media (min-width:1025px){
  .header.header--solid{
    background-color: rgba(255, 255, 255, 0.6);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
  }
}

/* SPだけ：solid時も背景透明を強制（filterも解除） */
@media (max-width:1024px){
  .header.header--solid{
    background-color: transparent;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }
}

/* Nav */
.nav{ margin-left:auto; }
.nav__list{ display:flex; gap:clamp(1rem,2.2vw,2.4rem); list-style:none; margin:0 1rem 0 0; padding:0; white-space:nowrap; font-size:.92rem; text-align: center; }
.nav__item a{ position:relative; padding:.2rem 0 .35rem; }
.nav__item a::after{
  content:""; position:absolute; left:0; right:0; bottom:-6px; height:2px;
  transform:scaleX(0); transform-origin:left; transition:transform .25s ease;
}
.header:not(.header--solid) .nav__item a::after{ background:rgba(255,255,255,.55); }
.header.header--solid .nav__item a::after{ background:var(--acc-grad); opacity:.5; }
.nav__item a:hover::after{ transform:scaleX(1); }

/* ヘッダーCTAはSPでは非表示（※すでにあればこの行は不要） */
@media (max-width: 1024px) {
  .header__cta {
    display: none;
  }
}

/* ハンバーガーメニュー内にだけ出したい項目 */
@media (max-width: 1024px) {
  .nav__item--sp-only {
    margin-top: 1rem;
  }
  .nav__item--sp-only .cta {
    width: 100%;
    justify-content: center;
  }
}

/* PCではSP専用項目を消す */
@media (min-width: 1025px) {
  .nav__item--sp-only {
    display: none;
  }
}

/* CTA */
.header__cta{ display:inline-flex; align-items:center; gap:.5rem; }
.header__cta .cta{
  position:relative; display:inline-flex; align-items:center; gap:.45rem;
  height:34px; padding:0 10px; font-size:.85rem; font-weight:700;
  text-decoration:none; color:inherit; background:transparent; border:0;
}
.header__cta .cta.cta--link::after{
  content:""; position:absolute; left:10px; right:10px; bottom:-6px; height:2px;
  transform:scaleX(0); transform-origin:left; transition:transform .25s ease;
}
.header:not(.header--solid) .header__cta .cta.cta--link::after{ background:rgba(255,255,255,.55); }
.header.header--solid .header__cta .cta.cta--link::after{ background:var(--acc-grad); opacity:.5; }
.header__cta .cta.cta--link:hover::after{ transform:scaleX(1); }
.header__cta .cta__icon{
  width:1.05em; height:1.05em; display:inline-block; opacity:.95;
  -webkit-mask: var(--icon-url) center/contain no-repeat;
  mask: var(--icon-url) center/contain no-repeat;
  background-color: currentColor;
}

/* Mobile nav */
.nav-toggle{ display:none; }
.nav-toggle-btn{
  display:none;
  cursor:pointer;
  width:40px; height:32px;
  align-items:center; justify-content:center;
  gap:5px;
  flex-direction:column;
  color: inherit; /* ← header の color を常に継承（SPのハンバーガー白固定対策） */
}
.nav-toggle-btn span{ display:block; width:26px; height:2px; background:currentColor; }

/* ===== MV ===== */
.mv{
  position:relative; min-height:100vh; min-height:100dvh;
  display:flex; align-items:center; justify-content:center;
  background-image:var(--mv-image, none); background-size:cover;
  background-position:center var(--mv-y, 0px); background-repeat:no-repeat;
  isolation:isolate; overflow:hidden;
}
.mv__shade{ position:absolute; inset:0; z-index:0; background:linear-gradient(180deg,rgba(0,0,0,.32) 0%,rgba(0,0,0,.44) 50%,rgba(0,0,0,.30) 100%); }
.mv__inner{ position:relative; z-index:2; color:#fff; text-shadow:0 2px 14px rgba(0,0,0,.35); padding:clamp(24px,5vw,56px) 0; }
.mv__shop{ margin:0 0 .1em; font-family:"Great Vibes", cursive; font-weight:400; font-size:clamp(40px,7.0vw,82px); line-height:1.05; }
.mv__tagline{ margin:.4em 0 .9em; font-family:"Great Vibes", cursive; font-size:clamp(26px,5vw,56px); line-height:1.1; }

/* Ornament */
.mv__ornament{

  width: clamp(120px, 22vw, 280px);
  height: 4px;

  background:
  linear-gradient(90deg, rgba(255,255,255,.35), rgba(255,255,255,0)) 0 0/100% 100% no-repeat,
  linear-gradient(90deg, rgba(199,168,106,.95), rgba(167,130,62,.98)) 0 0/0% 100% no-repeat;
  border-top:1px solid rgba(255,255,255,.45);
  box-shadow:0 1px 0 rgba(0,0,0,.12) inset;
  animation:mvOrnamentShine 6s ease-in-out .6s infinite alternate;
  opacity:.95;
}
@keyframes mvOrnamentShine{
  0%{background-size:100% 100%,0% 100%}
  45%{background-size:100% 100%,100% 100%}
  100%{background-size:100% 100%,20% 100%}
}

/* Vignette（中央に白グロー＋縁を軽く） */
.mv__vignette{
  position:absolute; inset:-4vw; z-index:1; pointer-events:none;
  background:
  radial-gradient(60% 45% at 40% 52%, rgba(255,255,255,.22) 0, rgba(255,255,255,.10) 55%, transparent 90%),
  radial-gradient(115% 85% at 50% 55%, transparent 0 58%, rgba(0,0,0,.10) 84%, rgba(0,0,0,.16) 100%);
}

/* Bokeh */
.mv__bokeh{ position:absolute; inset:0; z-index:4; pointer-events:none; mix-blend-mode:screen; }
.mv__bokeh span{
  position:absolute; display:block; width:clamp(14px,1.4vw,28px); aspect-ratio:1/1; border-radius:50%;
  opacity:.90; filter:brightness(1.25) blur(1.4px) drop-shadow(0 0 10px rgba(255,230,170,.45));
  animation:mvBokehFloat var(--d,18s) linear infinite; transform:translateY(110vh) translateX(0) scale(var(--s,1));
}
@keyframes mvBokehFloat{ from{ transform:translateY(110vh) translateX(0) scale(var(--s,1)); } to{ transform:translateY(-15vh) translateX(var(--dx,8vw)) scale(var(--s,1)); } }
.mv__bokeh span:nth-child(1)  { left: 6%;  --dx:10vw; --s:1.0; --d:22s; animation-delay:-2s;  background:radial-gradient(circle,var(--mv-bokeh-gold),transparent 65%); }
.mv__bokeh span:nth-child(2)  { left:14%;  --dx: 6vw; --s:.9;  --d:18s; animation-delay:-6s;  background:radial-gradient(circle,var(--mv-bokeh-silver),transparent 65%); }
.mv__bokeh span:nth-child(3)  { left:22%;  --dx: 9vw; --s:1.1; --d:20s; animation-delay:-10s; background:radial-gradient(circle,var(--mv-bokeh-gold),transparent 65%); }
.mv__bokeh span:nth-child(4)  { left:30%;  --dx: 7vw; --s:.8;  --d:16s; animation-delay:-4s;  background:radial-gradient(circle,var(--mv-bokeh-silver),transparent 65%); }
.mv__bokeh span:nth-child(5)  { left:41%;  --dx: 8vw; --s:.9;  --d:19s; animation-delay:-12s; background:radial-gradient(circle,var(--mv-bokeh-gold),transparent 65%); }
.mv__bokeh span:nth-child(6)  { left:50%;  --dx:12vw; --s:1.2; --d:24s; animation-delay:-8s;  background:radial-gradient(circle,var(--mv-bokeh-silver),transparent 65%); }
.mv__bokeh span:nth-child(7)  { left:62%;  --dx: 7vw; --s:.85; --d:20s; animation-delay:-14s; background:radial-gradient(circle,var(--mv-bokeh-gold),transparent 65%); }
.mv__bokeh span:nth-child(8)  { left:70%;  --dx: 9vw; --s:1.0; --d:17s; animation-delay:-5s;  background:radial-gradient(circle,var(--mv-bokeh-silver),transparent 65%); }
.mv__bokeh span:nth-child(9)  { left:78%;  --dx: 6vw; --s:.95; --d:19s; animation-delay:-11s; background:radial-gradient(circle,var(--mv-bokeh-gold),transparent 65%); }
.mv__bokeh span:nth-child(10) { left:86%;  --dx:11vw; --s:.9;  --d:21s; animation-delay:-7s;  background:radial-gradient(circle,var(--mv-bokeh-silver),transparent 65%); }
.mv__bokeh span:nth-child(11) { left:92%;  --dx: 8vw; --s:1.05;--d:23s; animation-delay:-3s;  background:radial-gradient(circle,var(--mv-bokeh-gold),transparent 65%); }
.mv__bokeh span:nth-child(12) { left:35%;  --dx: 5vw; --s:.8;  --d:15s; animation-delay:-9s;  background:radial-gradient(circle,var(--mv-bokeh-silver),transparent 65%); }

/* 動きを抑制したいユーザーに配慮 */
@media (prefers-reduced-motion: reduce){
  .mv__bokeh{ display:none; }
  .mv__ornament{ animation:none; }
}

/* ===== MV右：スライダー（PC=縦） ===== */
.mv__film{
  position:absolute; top:67%;
  right: var(--film-right, clamp(16px,6vw,80px));
  width: var(--film-w, 500px);
  height: var(--film-h, 90vh);
  transform: translateY(-50%);
  pointer-events: none; z-index: 2;
}

/* 窓（隙間の基調色はここで決まる） */
.film__window{
  position:relative; width:100%; height:100%;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.28);
  box-shadow: 0 18px 60px rgba(0,0,0,.26),
  0 1px 0 rgba(255,255,255,.12) inset,
  0 -1px 0 rgba(0,0,0,.18) inset;
  backdrop-filter: blur(3px) saturate(112%); -webkit-backdrop-filter: blur(3px) saturate(112%);
  overflow: hidden;
}

/* スライダー本体（縦） */
.film__slider{ position:absolute; inset:10px 12px; height:100%; }
.film__slider .slick-list{ height:100%; }
.film__slider .slick-track{ display:block; }       /* 縦並び */
.film__slider .slick-slide{
  height: var(--frame-h, 240px) !important;
  margin: 0 0 var(--frame-gap,10px) !important;
  outline: 0;
}
.film__slider .slick-slide:last-child{ margin-bottom:0; }

/* ===== MV：フレームと画像（端末共通の基本） ===== */

/* 既定は「見切れゼロ」 */
:root{
  --frame-pad: 12px;         /* 画像四方の余白（SP/Tablet で上書き） */
  --fit-mode: contain;       /* 見切れゼロ（PC は後で cover に切替） */
}

/* フレーム：スライド高いっぱい＋四方に余白 */
.mv__film .film__slider .frame{
  display:flex; align-items:center; justify-content:center;
  height: var(--frame-h, 260px);              /* ← JS が算出 */
  padding: var(--frame-pad) !important;       /* 四方の余白 */
  box-sizing: border-box;
  background: transparent !important;
  border:0 !important; box-shadow:none !important;
  overflow:hidden;
}

/* 画像：fit モード（contain/cover）で統一・中央表示 */
.mv__film .film__slider .frame img{
  display:block; margin:0 auto;
  width:100%; height:100%;
  object-fit: var(--fit-mode);
  object-position:center;
  max-width:none;                /* Safari 縮み防止 */
  border-radius:0 !important;    /* 角あり */
  background:transparent !important; border:0 !important; box-shadow:none !important;
}

/* ===== Sections（共通） ===== */
.section{ padding:clamp(1.6rem,4vw,2.8rem) 0; scroll-margin-top:calc(var(--header-h) + 12px); }
.section--alt{ border-top:1px solid var(--silver-weak);}

.wf-h2{ font-size:clamp(1.2rem,2.2vw,1.6rem); margin:0 0 1rem; font-weight:700; letter-spacing:.04em; position:relative; padding-bottom:.4rem; }
.wf-h2::after{ content:""; position:absolute; left:0; bottom:0; width:120px; height:2px; background:var(--acc-grad); opacity:.45; }
.wf-h3{ font-size:1.05rem; margin:.6rem 0 .2rem; }
.wf-h4{ font-size:1rem; margin:0 0 .4rem; }
.wf-text{ color:var(--ink-weak); margin:.5rem 0; }

.grid{ display:grid; gap:1rem; }
.grid-3{ grid-template-columns:repeat(3,1fr); }
#ig-feed{ gap:1rem; }
#ig-feed .ig{
  position:relative; display:block; aspect-ratio:1/1; overflow:hidden;
  background:#fff; border:1px solid var(--silver-weak);
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
#ig-feed .ig:hover{
  transform:translateY(-2px);
  box-shadow:0 12px 28px rgba(0,0,0,.10);
  border-color:var(--gold);
}
#ig-feed .ig img{ width:100%; height:100%; object-fit:cover; display:block; }
#ig-feed .ig__badge{
  position:absolute; top:6px; right:6px; z-index:2;
  font-size:.8rem; line-height:1; color:#fff; background:rgba(0,0,0,.55);
  padding:.22rem .42rem; border-radius:4px;
}

.thumb{ aspect-ratio:1/1; }
.placeholder{ background: repeating-linear-gradient(45deg,#ddd,#ddd 10px,#efefef 10px,#efefef 20px); border:1px solid var(--silver); display:flex; align-items:center; justify-content:center; color:#888; font-weight:700; letter-spacing:.08em; min-height:140px; }
.placeholder--sm{ min-height:80px; }




/* ===== Calm THEME ===== */
.section--calm{
  position:relative;
  background:
  radial-gradient(1200px 70% at 15% -20%, rgba(199,168,106,.12), transparent 55%),
  radial-gradient(900px 70% at 100% 0%, rgba(207,212,218,.12), transparent 60%);
  border-top:0;
  border-bottom:1px solid var(--silver-weak);
}
.section--calm-plain{
  background:
  radial-gradient(900px 60% at 0% 0%, rgba(199,168,106,.10), transparent 55%),
  radial-gradient(900px 60% at 100% 0%, rgba(207,212,218,.10), transparent 55%);
  border-top:0;
}
.section__head.section__head--calm .eyebrow{
  display:block; font-family:"Great Vibes", cursive;
  font-size:clamp(32px,3.4vw,42px); line-height:1; color:#b89554;
  margin-bottom:.2rem;
}
.section__head.section__head--calm .title{
  margin: 1.05rem 0 .4rem;
  font-size: clamp(1rem, 1.5vw, 1.8rem);
  letter-spacing: .03em;
}
.section__head.section__head--calm .sub{
  margin: 1.05rem 0 .4rem;
  font-size: clamp(1rem, 2vw, 1.2rem);
  letter-spacing: .03em;
}

/* ====== 商品カード ====== */
.grid-product{ padding: 1rem 0 0 0; display:grid; grid-template-columns:repeat(3,1fr); gap:1.1rem; }
@media (max-width:960px){ .grid-product{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:520px){ .grid-product{ grid-template-columns:1fr; } }

.product-card{
  background:var(--panel);
  border:1px solid var(--silver-weak);
  box-shadow:0 10px 26px rgba(0,0,0,.06);
  display:flex; flex-direction:column;
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.product-card:hover{
  transform:translateY(-2px);
  box-shadow:0 16px 36px rgba(0,0,0,.12);
  border-color:var(--gold);
}
.product-card__media .placeholder{ min-height:auto; height:100%; }
.product-card__badge{
  position:absolute; left:-8px; top:-8px;
  font-size:.78rem; font-weight:700; color:#fff;
  padding:.28rem .5rem; background:var(--acc-grad);
  box-shadow:0 6px 16px rgba(0,0,0,.18);
}
.product-card__body{ display:flex; align-items:center; justify-content:space-between; gap:.8rem; padding:.9rem 1rem 1rem; }
.product-card__title{ margin:0; font-size:1.02rem; }

/* product-card のメディア内を画像にしたので調整 */
.product-card__media{ position:relative; display:block; aspect-ratio: 4 / 3; }
.product-card__media img{
  width:100%; height:100%; display:block; object-fit:cover; /* きれいにトリミング */
  transform: translateZ(0);
}
.product-card:hover .product-card__media img{ transform: scale(1.03); transition: transform .5s ease; } /* さりげないズーム */


/* view more */
.btn-view{
  position:relative; display:inline-flex; align-items:center; gap:.35rem;
  font-weight:700; text-decoration:none; color:inherit;
}
.btn-view::after{
  content:""; position:absolute; left:0; right:0; bottom:-4px; height:2px;
  background:var(--acc-grad); transform:scaleX(0); transform-origin:left; transition:transform .25s ease;
}
.btn-view .arrow{ transition:transform .25s ease; }
.btn-view:hover::after{ transform:scaleX(1); }
.btn-view:hover .arrow{ transform:translateX(2px); }

/* ====== 目的で選ぶ（チップ） ====== */
.chips{ display:flex; flex-wrap:wrap; gap:.6rem; }
.chip{
  display:inline-block; padding:.65rem 1rem; font-weight:700; text-decoration:none;
  border-radius:9999px; color:var(--ink);
  border:2px solid transparent;
  background: linear-gradient(#fff,#fff) padding-box, var(--acc-grad) border-box;
}
.chip:hover{
  background: linear-gradient(#fffdf7,#fff) padding-box, var(--acc-grad) border-box;
}

/* ====== 注文・配達 ====== */
.grid-info .info-card{
  background:var(--panel); border:1px solid var(--silver-weak);
  padding:1rem; display:flex; flex-direction:column; gap:.5rem;
  position:relative; overflow:hidden;
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.grid-info .info-card::before{
  content:""; position:absolute; left:0; right:0; top:0; height:4px; background:var(--acc-grad);
}
.grid-info .info-card:hover{
  transform:translateY(-2px); border-color:var(--gold);
  box-shadow:0 16px 36px rgba(0,0,0,.12);
}

/* ===== 店舗情報 ===== */
#shop .shop{
  display: grid; grid-template-columns: 1.25fr 1fr;
  gap: clamp(16px, 2.8vw, 32px); align-items: start;
}
#shop .shop__map{ width:100%; min-height:260px; }
#shop .defs{ display:grid; grid-template-columns:7.5em 1fr; column-gap:1.2em; row-gap:.6rem; margin:0; }
#shop .defs > div{ display:contents; }
#shop .defs dt{ grid-column:1; font-weight:700; }
#shop .defs dd{ grid-column:2; margin:0; color:var(--ink-weak); }
#shop .shop__actions{ display:flex; flex-wrap:wrap; gap:.6rem; margin-top:.8rem; }

/* Shop intro */
.shop__sub{
  margin:.4rem 0 .2rem; font-weight:800; letter-spacing:.02em;
  border-bottom:1px solid rgba(0,0,0,.08); padding-bottom:.28rem;
}
.shop__desc{ color:var(--ink-weak); margin:.4rem 0 1rem; line-height:1.8; }


/* ===== Footer ===== */
.footer__grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; padding:1.6rem 0; }
.list{ margin:0; padding-left:1.2rem; color:var(--ink-weak); }
.footer__bottom{ display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.8rem 0; border-top:1px solid var(--silver-weak); }
.footer__links{ list-style:none; padding:0; margin:0; display:flex; flex-wrap:wrap; gap:.8rem; }
.footer__links a{ color:var(--ink-weak); text-decoration:none; }


/* ===== Footer (brand-left) ===== */
.footer__grid--brand-left{
  display:grid;
  grid-template-columns: minmax(220px, 320px) 1fr;
  gap: clamp(16px,3vw,32px);
  align-items:start;
  padding: clamp(18px,3vw,28px) 0;
}
.footer__brand{ position:relative; padding-left:10px; }
.footer__brand::before{
  content:""; position:absolute; left:0; top:.2rem; bottom:.2rem; width:2px;
  background: var(--acc-grad); opacity:.35;
}
.footer__logo img{ height:48px; width:auto; display:block; }
.footer__brandName{ font-weight:800; margin:.4rem 0 .2rem; letter-spacing:.04em; }
.footer__addr{ margin:0; color:var(--ink-weak); font-style:normal; line-height:1.7; }

.footer__nav{ width:100%; }
.footer__menu{
  --col: 4;
  display:grid; gap:.6rem 1.2rem;
  grid-template-columns: repeat(var(--col), minmax(120px,1fr));
  list-style:none; padding:0; margin:.2rem 0 0;
}
.footer__menu a{
  position:relative; text-decoration:none; color:inherit; font-weight:700;
  padding:.35rem .1rem .28rem;
}
.footer__menu a::after{
  content:""; position:absolute; left:0; right:0; bottom:-2px; height:1px;
  background: var(--acc-grad); transform:scaleX(0); transform-origin:left; transition:transform .25s ease;
  opacity:.55;
}
.footer__menu a:hover::after{ transform:scaleX(1); }

@media (max-width:960px){
  .footer__grid--brand-left{ grid-template-columns: 1fr; }
  .footer__menu{ --col: 2; }
}
@media (max-width:520px){
  .footer__menu{ --col: 1; }
}


/* ===== Responsive ===== */

/* === SP（<=720px）：ハンバーガー右寄せ＋オフキャンバス === */
@media (max-width:1024px){
  .nav-toggle-btn{
    display:flex;
    margin-left:auto;
    position:relative; z-index:50;
    -webkit-tap-highlight-color:transparent;
  }
  .nav{
        position: fixed;
        top: 0;
        right: 0;
        left: 0;
        width: 100vw;
        height: 100vh;
        background-image: url(images/AdobeStock_142290090_Preview.jpg);
/*         border-left: 1px solid var(--silver); */
        padding: 1rem 1rem 1.2rem calc(1rem + env(safe-area-inset-left));
        color: var(--ink);
        transform: translateX(100%);
        transition: transform .24s ease;
        margin: 0;
        z-index: 40;
        visibility: hidden;
        pointer-events: none;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
  }
  #nav-toggle:checked ~ .nav{
    transform:translateX(0);
    visibility:visible; pointer-events:auto;
  }
  .nav__list{
    max-width: 36rem;
    flex-direction: column;
    gap: .6rem;
    margin: 5rem auto;
    border-radius: 1rem;
    padding: 2rem;
    box-sizing: border-box;
    font-size: 1rem;
    white-space: normal;
    background-color: #ffffff6e;
    backdrop-filter: blur(3px);
  }
  .header__cta{ display:none; }
  .header__inner, .logo{ min-width:0; }
  html, body{ overflow-x:hidden; }
  .mv{ min-height:70vh; }
  :root{ --logo-h:42px; }

  /* メニュー展開中は背景スクロールをロック（対応ブラウザ） */
  @supports selector(body:has(#nav-toggle:checked)){
    body:has(#nav-toggle:checked){ overflow:hidden; }
  }
}

/* MV直下の上線は常に無効（既存の仕様） */
.mv + .section,
.mv + .section--calm,
.mv + .section--calm-plain,
.mv + .section--alt{ border-top:0 !important; }

/* スクロールイン・アニメ（既存） */
:root{ --hpfx-dur:.7s; --hpfx-ease:cubic-bezier(.22,.61,.36,1); }
.hpfx{ opacity:0; transform:translateZ(0); will-change:opacity,transform;
  transition:opacity var(--hpfx-dur) var(--hpfx-ease), transform var(--hpfx-dur) var(--hpfx-ease); }
  .hpfx--fade{ transform:translateY(16px); }
  .hpfx--slide-left{ transform:translateX(-28px); }
  .hpfx--slide-right{ transform:translateX( 28px); }
  .hpfx--in{ opacity:1; transform:none; }
  @media (prefers-reduced-motion: reduce){
    .hpfx{ transition:none !important; opacity:1 !important; transform:none !important; }
  }

/* === Mobile / Tablet（<=960px）：横スライダー均一表示＆中央表示 === */
@media (max-width:960px){
  :root{ --frame-pad: 30px; --frame-gutter: 10px; --window-pad: 20px; }

  .mv__ornament{
    margin: .2rem auto 1rem
  }


  /* ヒーロー縦積み（上：テキスト / 下：スライダー） */
  .mv{
    min-height:100vh; min-height:100dvh;
    display:flex; flex-direction:column;
    justify-content:flex-start; align-items:center;
    padding-top: calc(var(--header-h) + clamp(8px, 3vh, 20px));
    padding-bottom: clamp(10px, 3vh, 20px);
  }
  .mv__inner{
    text-align:center;
    transform: translateY(-2vh);
    padding: clamp(12px, 3vw, 24px) 0;
  }

  /* スライダー本体：画面幅いっぱい＋“窓”にも四方の外余白 */
  .mv__film{
    position:static; transform:none; right:auto; top:auto;
    width:min(96vw, 680px);
    height:clamp(260px, 56vh, 600px);
    margin: clamp(8px, 2vh, 16px) auto 0;
    pointer-events:none;
  }
  .film__window{
    width:100%; height:100%;
    padding: var(--window-pad);
    box-sizing:border-box;
  }

  /* slick の中央ズレ防止：list に負 margin / slide に左右 padding */
  .mv__film .film__slider{ position:relative; inset:auto; height:100%; }
  .mv__film .film__slider .slick-list{
    height:100%; overflow:hidden;
    margin: 0 calc(var(--frame-gutter) * -0.5);
  }
  .mv__film .film__slider .slick-slide{
    height:100% !important;
    padding: 0 calc(var(--frame-gutter) * 0.5) !important;
    margin:0 !important; float:left; box-sizing:border-box;
  }

  /* モバイル時は各フレームの高さ＝窓の高さ */
  .mv__film .film__slider .frame{ height:100%; }
}

/* さらに小さい端末（<=520px）は少し小ぶりに＋余白微調整 */
@media (max-width:520px){
  :root{ --frame-pad: 30px; --frame-gutter: 10px; --window-pad: 20px; }
  .mv__film{ width:94vw; height:clamp(220px, 54vh, 325px); }
}

/* PC：店名・コピーは中央寄せ（右の縦スライダーぶんだけ右に余白） */
@media (min-width:961px){
  :root{ --fit-mode: cover; --frame-pad: 10px; --film-h: 120vh; }
  .mv__inner{
    width: max-content;
    margin-inline:auto;
    padding-right: calc(
      var(--film-w, 360px) +
      var(--film-right, clamp(16px,6vw,80px)) +
      12px
    );
  }
}



/* ========= Order & Delivery : 3つの理由 ========= */
.section--order .reasons{
  counter-reset: reason;
  display:grid; gap: clamp(14px,2.4vw,22px);
  grid-template-columns: repeat(3,1fr);
}
@media (max-width: 960px){
  .section--order .reasons{ grid-template-columns: repeat(2,1fr); }
}
@media (max-width: 520px){
  .section--order .reasons{ grid-template-columns: 1fr; }
}

.section--order .reason{
  position:relative;
  background:#fff;                   /* 画像は使わない、読みやすさ優先 */
  border:1px solid var(--silver-weak);
  box-shadow:0 10px 26px rgba(0,0,0,.06);
  padding: clamp(14px,2.2vw,22px) clamp(16px,2.6vw,26px);
  transition: box-shadow .25s ease, transform .25s ease, border-color .25s ease;
}
.section--order .reason:hover{
  transform: translateY(-2px);
  border-color: var(--gold);
  box-shadow:0 16px 36px rgba(0,0,0,.12);
}

/* 左上に大きな番号（装飾） */
.section--order .reason::before{
  counter-increment: reason;
  content: counter(reason, decimal-leading-zero);
  position:absolute; left: clamp(12px,1.6vw,16px); top: clamp(10px,1.2vw,14px);
  font-weight:800; font-size: clamp(18px,2.4vw,22px);
  background: var(--acc-grad);
  -webkit-background-clip:text; background-clip:text; color: transparent;
  opacity:.85; letter-spacing:.02em;
}

/* 見出しを強調（下線をグラデで） */
.section--order .reason__title{
  margin: 0 0 .35rem;
  line-height: 1.2;
}
.section--order .reason__title span{
  display:inline-block; font-weight:800;
  font-size: clamp(1.06rem,2vw,1.34rem); letter-spacing:.02em;
  padding-bottom:.28rem;
  background:
  linear-gradient(90deg, rgba(199,168,106,.95), rgba(167,130,62,.98)) 0 100% / 120px 3px no-repeat;
}

/* リード文は少し大きく */
.section--order .reason__lead{
  margin:.35rem 0 .6rem;
  font-size: clamp(.95rem, 1.6vw, 1.05rem);
  color: var(--ink);
}

/* 箇条書きは読みやすい行間とドット */
.section--order .reason__list{
  margin:.2rem 0 0; padding-left:1.1em; color:var(--ink-weak);
}
.section--order .reason__list li{ margin:.28rem 0; }

/* セクション下の共通CTA（角は丸めない） */
.section--order .order-cta{
  display:flex; justify-content:center; margin-top: clamp(14px,2.4vw,22px);
}
.btn-solid{
  border: 2px solid transparent;
  background: linear-gradient(#111,#111) padding-box, var(--acc-grad) border-box;
  color:#fff; font-weight:800; text-decoration:none;
  padding:.9rem 1.4rem; line-height:1; border-radius:0; /* ← 角を丸めない */
  transition: transform .2s ease, filter .2s ease;
}
.btn-solid.btn-wide{ min-width: min(320px, 80%); text-align:center; }
.btn-solid .arrow{ margin-left:.4rem; }
.btn-solid:hover{ transform: translateY(-1px); filter: brightness(1.05); }

/* ===== Order Guide ===== */
.section--order-guide {
  background-image: url('images/sectionback.jpg');
  background-repeat: no-repeat;
  background-size: cover;
}

.section--order-guide .guide-cards{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:clamp(14px,2.4vw,22px);
}
@media (max-width:960px){ .section--order-guide .guide-cards{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:520px){ .section--order-guide .guide-cards{ grid-template-columns:1fr; } }

.guide-card{
  position:relative;
  background:var(--panel);
  border:1px solid var(--silver-weak);
  border-radius:10px;
  padding: clamp(14px,2.2vw,18px);
  box-shadow:0 10px 26px rgba(0,0,0,.06);
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
  overflow:hidden;
}
.guide-card::before{
  /* 上辺にうっすら金ライン */
  content:""; position:absolute; left:0; right:0; top:0; height:3px;
  background: var(--acc-grad); opacity:.35;
}
.guide-card:hover{
  transform:translateY(-2px);
  border-color:var(--gold);
  box-shadow:0 16px 36px rgba(0,0,0,.12);
}

.guide-card__head{
  display:flex; align-items:center; gap:.6rem;
  margin-bottom:.35rem;
}
.guide-card__num{
  font-weight:800; font-variant-numeric: tabular-nums;
  letter-spacing:.04em;
  color:#b89554;
  border:1px solid rgba(199,168,106,.45);
  border-radius:6px;                /* 角は残す */
  padding:.14rem .42rem;
  line-height:1;
  background:linear-gradient(180deg,#fff, #fffdf8);
}
.guide-card__title{
  margin:0; font-size:1.12rem; letter-spacing:.02em;
}
.guide-card__lead{
  margin:.35rem 0 .5rem; color:var(--ink-weak);
}
.guide-card__points{
  margin:.4rem 0 0; padding:0; list-style:none;
  display:grid; gap:.38rem;
}
.guide-card__points li{
  position:relative; padding-left:1.2rem;
}
.guide-card__points li::before{
  content:""; position:absolute; left:.1rem; top:.35rem;
  width:.55rem; height:.32rem; border:2px solid var(--gold);
  border-top:0; border-left:0; transform:rotate(45deg);
}

/* まとめボタン（角は残す） */
.btn.btn-wide{
  display:inline-flex; align-items:center; justify-content:center; gap:.45rem;
  min-width: min(320px, 80%);
  padding:.9rem 1.2rem;
  font-weight:800;
  color:#fff; text-decoration:none;
  background: linear-gradient(90deg, #222, #444);
  border-radius: 10px;              /* ← 角は無くさない */
  border:1px solid #333;
  box-shadow: 0 6px 18px rgba(0,0,0,.16);
}
.btn.btn-wide .arrow{ transition:transform .25s ease; }
.btn.btn-wide:hover .arrow{ transform: translateX(2px); }

.section--order-guide .guide-cta{
  display:flex; justify-content:center; padding-top: clamp(10px,1.2vw,14px);
}


/* ===== News (お知らせ) ===== */
.section--news { background:#fff; }

.section--news .news-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:clamp(14px,2.4vw,22px);
}
@media (max-width:960px){ .section--news .news-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:520px){ .section--news .news-grid{ grid-template-columns:1fr; } }

/* カード（角あり＝角丸なし） */
.news-card{
  background:var(--panel);
  border:1px solid var(--silver-weak);
  border-radius:0;                       /* ← 角あり */
  position:relative;
  overflow:hidden;
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.news-card::before{
  content:""; position:absolute; left:0; right:0; top:0; height:3px;
  background:var(--acc-grad); opacity:.35;
}
.news-card:hover{
  transform:translateY(-2px);
  border-color:var(--gold);
  box-shadow:0 16px 36px rgba(0,0,0,.12);
}

.news-card__link{
  display:block;
  color:inherit; text-decoration:none;
  padding:clamp(14px,2.2vw,18px);
}

.news-card__meta{
  display:flex; align-items:center; gap:.6rem;
  font-size:.9rem; color:var(--ink-weak);
  margin-bottom:.2rem;
}
.news-card .date{ letter-spacing:.04em; }
.news-card .cat{
  padding:.14rem .5rem; line-height:1;
  border:1px solid rgba(199,168,106,.45);
  background:linear-gradient(180deg,#fff,#fffdf8);
  color:#b89554; font-weight:700;
  border-radius:0;                        /* ← 角あり */
}

.news-card__title{
  margin:.2rem 0 .35rem;
  font-size:1.08rem; letter-spacing:.02em; font-weight:700;
}
.news-card__excerpt{ color:var(--ink-weak); margin:0; }

/* セクションの下ボタン（角あり） */
.news-cta{ display:flex; justify-content:center; padding-top: clamp(10px,1.2vw,14px); }
.btn.btn-wide{ min-width:min(320px,80%); }
.btn, .btn-outline, .btn.btn-wide{ border-radius:0; }   /* ← 角あり統一 */


/* === Order / Guide：角丸なし + 既存CTAを非表示（最小上書き） === */
.section--order .reason,
.section--order-guide .guide-cards .guide-card,
.section--order-guide .guide-cards .guide-card::before,
.section--order-guide .guide-cards .guide-card__head .guide-card__num,
.btn.btn-wide{
  border-radius:0 !important;
}

/* 既存の「まとめボタン」ブロックは非表示に */
.section--order-guide .guide-cta,
.section--order .order-cta{ display:none !important; }


/* === Contact CTA（角丸なし / トンマナ合わせ） === */
.section--contact-cta{
  background-image: url('images/sectionback.jpg');
  background-repeat: no-repeat;
  background-size: contain;
}
.section--contact-cta .contact-cta__box{
  background:var(--panel);
  border:1px solid var(--silver-weak);
  box-shadow:0 10px 26px rgba(0,0,0,.06);
  padding: clamp(16px,3vw,28px);
  border-radius:0;                /* 角あり */
  text-align:center;
  position:relative;
}
.section--contact-cta .contact-cta__box::before{
  content:""; position:absolute; left:0; right:0; top:0; height:3px;
  background:var(--acc-grad); opacity:.35;   /* 上辺のうっすら金ライン */
}
.section--contact-cta .contact-cta__head .eyebrow{
  display:block; font-family:"Great Vibes", cursive;
  font-size:clamp(32px,3.4vw,42px); line-height:1; color:#b89554;
  margin-bottom:.2rem;
}
.section--contact-cta .contact-cta__head .title{
  margin: 1.05rem 0 .4rem;
  font-size: clamp(1rem, 1.5vw, 1.8rem);
  letter-spacing: .03em;
}

.section--contact-cta .contact-cta__head .lead{
  color:var(--ink-weak); margin:.4rem 0 1.0rem;
}

/* ボタン（角あり） */
.contact-cta__actions{
  display:flex; flex-wrap:wrap; justify-content:center;
  gap:.6rem;
}
.contact-cta__actions2 {
	margin: 50px 0 0 0;
}
.contact-cta__actions2 img {
	width: 180px; text-align: center; margin: 20px auto 0;
}
.cta-btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:.85rem 1.2rem; min-width:min(280px, 90%);
  font-weight:800; text-decoration:none; color:#111;
  background:#fff; border:2px solid #333; border-radius:0; /* 角あり */
}
.cta-btn--tel{ background:linear-gradient(#fff,#fff) padding-box, var(--acc-grad) border-box; border-color:transparent; color:#111; }
.cta-btn--form{ background:#111; color:#fff; border-color:#111; }
.cta-btn--line{ background:#f7f7f7; border-color:#aaa; }
.cta-btn:hover{ filter:brightness(1.03); transform:translateY(-1px); transition:.2s ease; }




/* ==== News：細線の表（角あり、最小限） ====
   既存テーマ変数: --acc-grad / --ink-weak / --gold を利用 */
   :root{
    --news-hair: rgba(0,0,0,.08);         /* 罫線色（極細） */
    --news-pad-y: clamp(.7rem,1.4vw,1rem);
    --news-pad-x: .25rem;
  }

  .section--news-min .news-min{
    list-style:none; margin:0; padding:0;
    border-top:1px solid var(--news-hair);
    border-bottom:1px solid var(--news-hair);
  }
  .section--news-min .news-min__row{
    border-top:1px solid var(--news-hair);
  }
  .section--news-min .news-min__row:first-child{ border-top:0; }

/* 1行＝表の1レコード */
.section--news-min .news-min__row > a{
  display:grid; align-items:baseline; gap:clamp(.5rem,2vw,1rem);
  grid-template-columns: 10ch 8ch 1fr auto;   /* 日付 / カテゴリ / タイトル / 矢印 */
  padding: var(--news-pad-y) var(--news-pad-x);
  color:inherit; text-decoration:none; position:relative;
}

/* 極細アンダーライン（ホバー時のみ出現：スタイリッシュ） */
.section--news-min .news-min__row > a::after{
  content:""; position:absolute; left:10ch; right:0; bottom:0;
  height:1px; background: var(--acc-grad);
  transform: scaleX(0); transform-origin:left; transition: transform .25s ease;
  opacity:.65;
}
.section--news-min .news-min__row > a:hover::after{ transform: scaleX(1); }

.section--news-min .news-min__date{
  font-variant-numeric: tabular-nums;
  color: var(--ink-weak); font-size:.92rem;
}
.section--news-min .news-min__cat{
  font-size:.72rem; letter-spacing:.06em; font-weight:800;
  color:#b89554; line-height:1;
  border:1px solid currentColor; padding:.14rem .42rem; /* 角ありのバッジ */
}
.section--news-min .news-min__ttl{
  line-height:1.35; font-weight:600; -webkit-line-clamp: 2; display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden;
}
.section--news-min .news-min__arrow{
  font-weight:800; opacity:.35; transition: transform .2s ease, opacity .2s ease;
}
.section--news-min .news-min__row > a:hover .news-min__arrow{
  transform: translateX(3px); opacity:.65;
}

/* 小さめ画面：カテゴリ列を省略して3カラム */
@media (max-width:640px){
  .section--news-min .news-min__row > a{ grid-template-columns: 9.5ch 1fr auto; }
  .section--news-min .news-min__cat{ display:none; }
  .section--news-min .news-min__row > a::after{ left:9.5ch; }
}

/* “一覧を見る” リンクも細線で */
.section--news-min .news-min__more{
  display:flex; justify-content:center; padding-top: clamp(10px,1.2vw,14px);
}
.section--news-min .news-min__link{
  position:relative; font-weight:800; text-decoration:none; color:inherit;
}
.section--news-min .news-min__link::after{
  content:""; position:absolute; left:0; right:0; bottom:-4px; height:1px;
  background: var(--acc-grad); transform:scaleX(0); transform-origin:left;
  transition:transform .25s ease;
}
.section--news-min .news-min__link:hover::after{ transform:scaleX(1); }


/* ===== 店舗情報（角あり・細線・金ライン） ===== */
#shop .shop{
  display:grid;
  grid-template-columns: 1.35fr 1fr;
  gap: clamp(16px, 3.2vw, 36px);
  align-items: stretch;
}

/* Map 面（角あり・薄枠＋影） */
#shop .shop__map{
  background:#fff;
  border:1px solid var(--silver-weak);
  box-shadow:0 10px 26px rgba(0,0,0,.06);
}
#shop .shop__map iframe{
  display:block; width:100%; height:100%;
  min-height:340px; border:0;
}

/* 右の情報パネル（上辺にうっすら金ライン） */
#shop .shop__panel{
  position:relative;
  background:var(--panel);
  border:1px solid var(--silver-weak);
  box-shadow:0 10px 26px rgba(0,0,0,.06);
  padding: clamp(16px, 2.6vw, 24px);
}

/* 住所を強めに */
#shop .shop__addr{
  margin:0 0 .65rem; font-style:normal;
  font-weight:800; letter-spacing:.02em; line-height:1.45;
}

/* 定義リスト（細線・読みやすい行間） */
#shop .defs--shop{
  display:grid; grid-template-columns:7.5em 1fr;
  column-gap:1.2em; row-gap:.5rem; margin:0;
}
#shop .defs--shop > div{ display:contents; }
#shop .defs--shop dt{ grid-column:1; font-weight:800; color:var(--ink); }
#shop .defs--shop dd{ grid-column:2; margin:0; color:var(--ink-weak); }
#shop .defs--shop a{ color:inherit; text-decoration:none; border-bottom:1px solid rgba(0,0,0,.12); }
#shop .defs--shop a:hover{ border-bottom-color: transparent; }

/* ボタン（角あり固定） */
#shop .shop__actions{
  display:flex; flex-wrap:wrap; gap:.6rem;
  margin-top: clamp(.9rem, 2.2vw, 1.2rem);
}
#shop .shop__btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:.85rem 1.2rem; min-width: min(220px, 100%);
  font-weight:800; text-decoration:none; color:#111;
  background:#fff; border:2px solid #333; border-radius:0;
  transition:transform .2s ease, filter .2s ease;
}
#shop .shop__btn:hover{ transform:translateY(-1px); filter:brightness(1.03); }

/* レスポンシブ：1カラム＋余白調整 */
@media (max-width: 960px){
  #shop .shop{ grid-template-columns:1fr; }
  #shop .shop__map iframe{ min-height:300px; }
}

/* ===== Shop info（カードではなく、縦の金ライン＋細線） ===== */
#shop .shop{
  grid-template-columns: 1.35fr 1fr;
}

/* 右ブロック：枠/影を消し、左に金の縦ライン */
#shop .shop__panel{
  position:relative;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  padding: 0 0 0 clamp(16px, 2.6vw, 28px);
}

/* 住所タイポ */
#shop .shop__addr{
  margin:0 0 .6rem; font-style:normal; line-height:1.5;
}
#shop .shop__addr .zip{ color:var(--ink-weak); letter-spacing:.03em; }
#shop .shop__addr strong{ font-weight:800; letter-spacing:.02em; }

/* 定義リスト：細線で区切り（高級メニュー風） */
#shop .defs--shop{ grid-template-columns:7.5em 1fr; }
#shop .defs--lined > div + div{
  border-top:1px solid rgba(0,0,0,.10);
  margin-top:.55rem; padding-top:.55rem;
}
#shop .defs--shop dt{ font-weight:800; color:var(--ink); }
#shop .defs--shop dd{ color:var(--ink-weak); }
#shop .defs--shop a{
  color:inherit; text-decoration:none; border-bottom:1px solid rgba(0,0,0,.15);
}
#shop .defs--shop a:hover{ border-bottom-color:transparent; }

/* 行動ボタン：ゴールドのラインボタン（角あり） */
#shop .shop__actions{
  display:flex; flex-wrap:wrap; gap:.6rem;
  margin-top: clamp(.9rem, 2.2vw, 1.2rem);
}
.btn-lined{
  display:inline-flex; align-items:center; gap:.45rem;
  padding:.85rem 1.2rem;
  font-weight:800; letter-spacing:.02em; text-decoration:none;
  border:2px solid transparent; border-radius:0;          /* 角あり */
  color:#111;
  background:
  linear-gradient(#fff, #fff) padding-box,
  var(--acc-grad) border-box;                             /* 金の縁 */
  transition:transform .2s ease, filter .2s ease, background .25s ease, color .25s ease;
}
.btn-lined .arrow{ transition:transform .2s ease; }
.btn-lined:hover{ transform:translateY(-1px); }
.btn-lined:hover .arrow{ transform:translateX(2px); }

/* バリエーション（今は同じ見た目。必要ならここで差別化可能） */
.btn-lined--gold:hover{
  background:
  linear-gradient(#fffdf8,#fff) padding-box,               /* ごく薄いシャンパン色に */
  var(--acc-grad) border-box;
}

/* レスポンシブ：1カラム時の間隔 */
@media (max-width:960px){
  #shop .shop{ grid-template-columns:1fr; }
  #shop .shop__panel{ padding-left: clamp(14px, 3vw, 20px);
    margin: 32px 0px 0.6rem;}
  }


/* ========== Buttons（小ぶり＆上質） ========== */

/* CTA（お問い合わせセクション）のボタンをコンパクトに */
.section--contact-cta .contact-cta__actions { gap: .5rem; }
.section--contact-cta .cta-btn{
  font-size: .92rem;                 /* 少し小ぶり */
  font-weight: 800;
  padding: .68rem 1.0rem;            /* 高さを抑える */
  min-width: min(240px, 78%);        /* 幅も控えめ */
  border-width: 1.5px;               /* 細めのラインで上質に */
  letter-spacing: .02em;
  line-height: 1;
}
.section--contact-cta .cta-btn .arrow{ margin-left:.36rem; }

/* Shop 情報のラインボタン（会社概要 / Googleマップ）も小ぶりに */
#shop .shop__actions { gap: .5rem; }
#shop .shop__actions .btn-lined{
  font-size: .9rem;
  padding: .62rem .95rem;
  min-width: auto;                   /* 固定幅を外して軽やかに */
  border-width: 1.5px;
  letter-spacing: .02em;
  line-height: 1;
}
#shop .shop__actions .btn-lined .arrow{ font-size:.9em; margin-left:.3rem; }

/* 触感（hover）は控えめに上方向へ 1px */
.section--contact-cta .cta-btn:hover,
#shop .shop__actions .btn-lined:hover{
  transform: translateY(-1px);
}

/* ========== Footer（細線＋ゴールド、角あり） ========== */

.footer{
  background: var(--panel);
  position: relative;
}
/* 上段グリッド：余白と列比率を少し見直し */
.footer__grid{
  display:grid;
  grid-template-columns: 1.2fr 1fr 1fr 1fr;
  gap: clamp(16px,2.4vw,28px);
  padding: clamp(18px,3vw,28px) 0 clamp(10px,2vw,16px);
}

/* 見出しは太字＋下に極細の金ライン */
.footer .wf-h4{
  margin:0 0 .6rem;
  font-weight:800; letter-spacing:.06em;
  position:relative;
}
.footer .wf-h4::after{
  content:""; position:absolute; left:0; bottom:-6px;
  width:72px; height:2px; background:var(--acc-grad); opacity:.45;
}

/* リストは箇条書き記号を消し、狭い行間で端正に */
.footer .list{
  list-style:none; padding:0; margin:.8rem 0 0;
  color: var(--ink-weak);
}
.footer .list li + li{ margin-top:.4rem; }

/* フッター内リンク：細い下線アニメ（ゴールド） */
.footer a{
  color:#444; text-decoration:none; position:relative;
}
.footer a::after{
  content:""; position:absolute; left:0; right:0; bottom:-3px; height:1px;
  background: var(--acc-grad); transform:scaleX(0); transform-origin:left;
  transition: transform .25s ease;
}
.footer a:hover::after{ transform:scaleX(1); }

/* 下段：区切り線＋セパレーター（細い縦線） */
.footer__bottom{
  display:flex; align-items:center; justify-content:space-between;
  gap:1rem; padding: .9rem 0;
  border-top:1px solid rgba(0,0,0,.08);
}
.footer__links{
  list-style:none; padding:0; margin:0;
  display:flex; flex-wrap:wrap; gap:.6rem;
}
.footer__links li + li{ position:relative; padding-left:.9rem; }
.footer__links li + li::before{
  content:""; position:absolute; left:.45rem; top:50%;
  width:1px; height:.9em; background:rgba(0,0,0,.15);
  transform:translateY(-45%);
}

.copy {color:var(--ink);}

.nav a { pointer-events: auto; }

/* レスポンシブ（2列→1列） */
@media (max-width:960px){
  .footer__grid{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:520px){
  .footer__grid{ grid-template-columns:1fr; }
  .footer__bottom{ flex-direction:column; align-items:flex-start; gap:.6rem; }
}

/* ===== Footer : modern (reference-like) ===== */
.footer--modern{
  background-image: url('images/footer_sectionback.jpg');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: right;
}
.footerM{
  display:grid;
  grid-template-columns: minmax(520px, 2.2fr) 1fr;
  gap:clamp(24px,4vw,56px);
  padding: clamp(24px,4vw,30px) 0;
}

/* --- CTA pill --- */
.footerM__cta{
  display:flex; align-items:center; justify-content:space-between;
  height: clamp(54px, 8vw, 68px);
  padding: 0 clamp(16px, 2.6vw, 28px);
  border-radius: 9999px;
  background: #f5f7fa;
  border: 1px solid var(--silver-weak);
  box-shadow: inset 0 1px #fff, 0 10px 24px rgba(0,0,0,.04);
  text-decoration:none; color:inherit;
  transition: box-shadow .25s ease, transform .25s ease, background .25s ease;
}
.footerM__cta:hover{
  background:#f7f9fb; transform: translateY(-1px);
  box-shadow: inset 0 1px #fff, 0 16px 36px rgba(0,0,0,.06);
}
.footerM__ctaLabel{ font-weight:800; letter-spacing:.02em; line-height:1.05; }
.footerM__ctaLabel small{
  display:block; font-size:.72rem; font-weight:700; color:var(--ink-weak);
}
.footerM__ctaArrow{ font-weight:800; opacity:.55; transform:translateX(0); transition:transform .25s ease, opacity .25s ease; }
.footerM__cta:hover .footerM__ctaArrow{ transform:translateX(6px); opacity:.8; }

/* --- menus --- */
.footerM__nav{
  display:grid; grid-template-columns: 1fr 1fr; gap: clamp(18px,3vw,32px);
  margin-top: clamp(18px,3vw,28px);
}
.footerM__col{ list-style:none; margin:0; padding:0; }
.footerM__col li+li{ margin-top:.65rem; }
.footerM__col a{
  text-decoration:none; color:inherit; font-weight:700; letter-spacing:.01em;
  position:relative; padding:.12rem .05rem;
}
.footerM__col a::after{
  content:""; position:absolute; left:0; right:0; bottom:-2px; height:1px;
  background:var(--acc-grad); transform:scaleX(0); transform-origin:left;
  transition:transform .25s ease; opacity:.55;
}
.footerM__col a:hover::after{ transform:scaleX(1); }
/* 外部リンク ↗ */
.footerM__col a.is-external::after{ right:1.1em; } /* 余白確保 */
.footerM__col a.is-external::before{
  content:"↗"; font-weight:800; margin-left:.35rem; opacity:.55;
}

/* --- brand side --- */
.footerM__brand{ display:flex; flex-direction:column; gap:1rem; align-items:flex-start; }
.footerM__logo img{ height:46px; width:auto; display:block; }
.footerM__name{ margin:0; color:var(--ink-weak); font-size:.92rem; letter-spacing:.02em; }

.footerM__sns{ display:flex; gap:.6rem; }
.sns{
  display:inline-flex; align-items:center; justify-content:center;
  width:34px; height:34px; border-radius:50%;
  border:1px solid var(--silver-weak); color:#111; text-decoration:none;
  font-weight:800; font-size:.82rem; background:#fff;
  transition:transform .2s ease, box-shadow .2s ease, color .2s ease;
}
.sns:hover{ transform:translateY(-1px); box-shadow:0 8px 18px rgba(0,0,0,.08); color:#000; }
.footerM__notice{ font-size:.9rem; color:var(--ink-weak); line-height:1.7; }
.footerM__notice a{ color:inherit; text-decoration:none; border-bottom:1px solid rgba(0,0,0,.08); }
.footerM__notice a:hover{ border-bottom-color:rgba(0,0,0,.25); }

.footerM__bottom{
  display:flex; align-items:center; justify-content:center;
  gap:1rem; padding: .8rem 0;
}


/* --- responsive --- */
@media (max-width: 960px){
  .footerM{ grid-template-columns: 1fr; }
  .footerM__nav{ grid-template-columns: 1fr 1fr; }
}
@media (max-width: 520px){
  .footerM__nav{ grid-template-columns: 1fr; }
}

/* SNS アイコン（画像版） */section
.footerM__sns{ display:flex; gap:.6rem; }
.sns{
  display:inline-flex; align-items:center; justify-content:center;
  width:32px; height:32px; border-radius:50%;
  background:#fff; border:1px solid var(--silver-weak);
  text-decoration:none; transition:transform .2s ease, box-shadow .2s ease;
}
.sns:hover{ transform:translateY(-1px); box-shadow:0 8px 18px rgba(0,0,0,.08); }

.sns__img{
  width:18px; height:18px; display:block; object-fit:contain;
  /* 視認性を少しだけ上げる */
  filter: contrast(1.05);
}

.gallery--img{background-image: url('images/sectionback.jpeg');}

/* 下層ヒーロー（角丸なし） */
.hero-sub{ background:#fff; border-bottom:1px solid var(--silver-weak); }
.hero-sub__title{ font-size:clamp(1.6rem,3vw,2rem); margin:.2rem 0; }
.hero-sub__lead{ color:var(--ink-weak); margin:.4rem 0 .8rem; }
.hero-sub__cta{ display:flex; gap:.5rem; flex-wrap:wrap; }
.btn-lined{ display:inline-flex; align-items:center; padding:.6rem .9rem; border:1px solid #333; text-decoration:none; color:#111; }
.btn-lined--gold{ background:linear-gradient(#fff,#fff) padding-box, var(--acc-grad) border-box; border-color:transparent; }
.chip--ghost{ background:#fff; border:1px solid var(--silver-weak); }

/* 小さな3ステップ */
.flow3{ display:grid; grid-template-columns:repeat(3,1fr); gap:.8rem; list-style:none; padding:0; margin:.6rem 0 0; }
.flow3 li{ border:1px solid var(--silver-weak); padding:.8rem; background:#fff; }
.qa{ border:1px solid var(--silver-weak); background:#fff; padding:.6rem .8rem; }
.qa + .qa{ margin-top:.6rem; }
.qa summary{ cursor:pointer; font-weight:700; }

/* ===== Subpage Hero（下層：コンパクト版） ===== */
.mv--sub{
  min-height: clamp(280px, 44vh, 520px);
}
.mv--sub .mv__film{ display: none !important; }         /* 右の縦スライダーは非表示 */
.mv--sub .mv__inner{ padding-top: calc(var(--header-h) + 8px); }
.mv--sub .mv__shade{
  /* 読みやすさ優先で MV より少し明るめ */
  background: linear-gradient(180deg,rgba(0,0,0,.22) 0%,rgba(0,0,0,.18) 60%,rgba(0,0,0,.16) 100%);
}


/* ===== Breadcrumbs（細め・コンパクト） ===== */
.breadcrumbs{
  padding: .35rem 0;               /* かなり薄め */
  border-bottom: 1px solid var(--silver-weak);
  background: transparent;
  font-size: .9rem; color: var(--ink-weak);
}
.breadcrumbs__list{
  display: flex; flex-wrap: wrap; gap: .35rem .6rem;
  list-style: none; margin: 0; padding: 0;
}
.breadcrumbs__list li{ display:flex; align-items:center; gap:.6rem; }
.breadcrumbs__list li + li::before{
  content: "›"; opacity: .55;
}
.breadcrumbs a{ color: inherit; text-decoration: none; }
.breadcrumbs a:hover{ text-decoration: underline; text-underline-offset: 2px; }


/* ===== Works（制作事例） ===== */
.section--works{ position:relative; background:#fff; overflow:hidden; }
.works__grid{
  display:grid; gap:clamp(12px,2vw,18px);
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}

/* カード本体（リッチ） */
.work-card{
  position:relative; overflow:hidden; background:#fff;
  border:1px solid var(--silver-weak);
  transition: transform .35s ease, box-shadow .35s ease, border-color .35s ease;
}
.work-card:hover{
  transform: translateY(-2px);
  box-shadow: 0 18px 40px rgba(0,0,0,.16);
  border-color: var(--gold);
}
.work-card__media{ position:relative; aspect-ratio:4/3; overflow:hidden; }
.work-card__media img{
  width:100%; height:100%; object-fit:cover; display:block;
  transform: scale(1.03); transition: transform .9s ease;
}
.work-card:hover .work-card__media img{ transform: scale(1.07); }

/* ゴールドの上辺ライン＆下部のグラデ */
.work-card::before{
  content:""; position:absolute; left:0; right:0; top:0; height:3px;
  background: var(--acc-grad); opacity:.35; z-index:2;
}
.work-card__media::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:48%;
  background: linear-gradient(0deg, rgba(0,0,0,.42), rgba(0,0,0,0) 55%);
  z-index:1; pointer-events:none;
}

/* タイトル＆タグ（下部オーバーレイ） */
.work-card__meta{
  position:absolute; left:10px; right:10px; bottom:8px; z-index:3;
  color:#fff; text-shadow:0 2px 14px rgba(0,0,0,.35);
}
.work-card__title{ margin:0 0 .35rem; font-weight:800; letter-spacing:.02em; }
.work-card__tags{ display:flex; gap:.35rem; flex-wrap:wrap; }
.work-card__tag{
  font-size:.78rem; line-height:1; font-weight:700;
  padding:.26rem .5rem; border:1px solid rgba(255,255,255,.55);
  background: rgba(0,0,0,.18);
}

/* カード下のボディ（説明） */
.work-card__body{
  padding: .8rem .95rem 1rem; background:#fff; color:var(--ink-weak);
  border-top:1px solid var(--silver-weak);
}



/* ===== Sub MV（下層） ===== */
.submv{
  position:relative;
  min-height: clamp(240px, 38vh, 420px);   /* TOPより低く */
  display:flex; align-items:center;
  background-position: center 40%;
  background-size: cover; background-repeat:no-repeat;
  isolation:isolate; overflow:hidden;
}
.submv::before{
  /* 上は濃いめ→下は薄いグラデのベール */
  content:""; position:absolute; inset:0; z-index:0;
  background: linear-gradient(180deg, rgba(0,0,0,.38), rgba(0,0,0,.22) 40%, rgba(0,0,0,.16));
}
.submv__inner{ position:relative; z-index:1; color:#fff; text-shadow:0 2px 14px rgba(0,0,0,.35); padding: clamp(24px,4vw,56px) 0; }
.submv__title{ margin:0 0 .25em; font-family:"Great Vibes", cursive; font-weight:400; font-size: clamp(42px,6.2vw,76px); line-height:1.05; }
.submv__lead{ margin:0; font-size: clamp(16px,2.3vw,22px); }

/* ===== Sub MV（下層用・低め） ===== */
.submv{
  position:relative;
  min-height: clamp(28vh, 38vh, 46vh);  /* TOPの100vhより低く */
  display:flex; align-items:flex-end;
  background:
    linear-gradient(180deg, rgba(0,0,0,.22), rgba(0,0,0,.35)),
    var(--submv-image, none) center/cover no-repeat;
}
.submv__inner{ color:#fff; padding: clamp(18px,4vw,28px) 0; }
.submv__title{
  margin:0 0 .2rem; font-family:"Great Vibes", cursive;
  font-size: clamp(42px,6vw,72px); line-height:1.05;
  text-shadow:0 2px 14px rgba(0,0,0,.35);
}
.submv__lead{ margin:0; font-weight:700; text-shadow:0 2px 14px rgba(0,0,0,.35); }

/* ===== パンくず（薄く・低め） ===== */
.breadcrumbs{ border-top:1px solid var(--silver-weak); border-bottom:1px solid var(--silver-weak); background:#fff; }
.breadcrumbs .container{ padding:.35rem 0; }
.breadcrumbs__list{ display:flex; gap:.6rem; align-items:center; font-size:.86rem; list-style:none; margin:0; padding:0; color:var(--ink-weak); }
.breadcrumbs__list li+li::before{ content:"›"; margin:0 .4rem; opacity:.4; }
.breadcrumbs a{ color:inherit; text-decoration:none; }

/* ===== 商品カード：制作事例と同じ“リッチ”なモーションへ ===== */
/* 既存 .product-card（hoverで持ち上げ＆影）は保持しつつ、画像にグラデ面＋わずかなズームを強化 */
.product-card{ overflow:hidden; }
.product-card__media{ position:relative; }
.product-card__media::after{
  content:""; position:absolute; inset:auto 0 0 0; height:48%;
  background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.42) 100%);
  opacity:0; transition: opacity .35s ease;
}
.product-card:hover .product-card__media::after{ opacity:1; }

/* ズーム量を制作事例に合わせて少し強めに */
.product-card__media img{ transform: translateZ(0); transition: transform .55s ease; }
.product-card:hover .product-card__media img{ transform: scale(1.04); }

/* タイトル＋view more を下辺に寄せた“浮き上がり”表現（既存の見た目は維持） */
.product-card__body{
  position:relative; z-index:1;
  transition: transform .35s ease, color .35s ease;
}
.product-card:hover .product-card__body{ transform: translateY(-4px); color:#fff; }
.product-card:hover .btn-view::after{ background:linear-gradient(90deg,#fff,#fff); opacity:.6; }


/* =======================================================
   Products：制作事例に寄せたホバー演出（テキストを消し、縁を強調）
   - 英語バッジはカード外にはみ出す
   - 画像は微ズーム＋薄いビネット
   - 下部のタイトル／view more はフェードアウト
   ======================================================= */



/* 画像：ズーム + ビネット（制作事例と同系統の落ち着いた陰影） */
.product-card__media::after{
  content:""; position:absolute; inset:0;
  background:
    radial-gradient(70% 55% at 50% 65%, rgba(0,0,0,0) 0 55%, rgba(0,0,0,.22) 100%);
  opacity:0; transition:opacity .35s ease;
}
.product-card__media img{
  transform:translateZ(0); transition:transform .6s ease;
}
.product-card:hover .product-card__media img{ transform:scale(1.04); }
.product-card:hover .product-card__media::after{ opacity:1; }

/* 下部のタイトル＆リンクは消す（スペースは残す＝画像と地続きに見える） */
.product-card__body .product-card__title,
.product-card__body .btn-view{
  transition:opacity .25s ease, transform .25s ease;
}
.product-card:hover .product-card__body .product-card__title,
.product-card:hover .product-card__body .btn-view{
  opacity:0; transform:translateY(6px);
}

/* 枠・影：制作事例と同じトーンで強調 */
.product-card{
  border:1px solid var(--silver-weak);
  box-shadow:0 10px 26px rgba(0,0,0,.06);
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.product-card:hover{
  transform:translateY(-2px);
  border-color:var(--gold);
  box-shadow:0 16px 36px rgba(0,0,0,.12);
}

/* タッチ環境では“常時フェードアウト”を避ける（誤タップ対策） */
@media (hover:none){
  .product-card:hover .product-card__body .product-card__title,
  .product-card:hover .product-card__body .btn-view{
    opacity:1; transform:none;
  }
}


/* === Product cards (hover 調整・影削除・バッジ固定) === */

/* 1) カード本体：影なし・はみ出しOK */
.product-card{
  position: relative;
  overflow: visible;             /* バッジをはみ出させる */
  box-shadow: none !important;   /* 影を常に消す */
  transition: transform .25s ease, border-color .25s ease; /* 影のトランジションは不要 */
}
.product-card:hover{
  transform: translateY(-2px);   /* 浮きは残す場合 */
  box-shadow: none !important;   /* ホバー時の影も消す */
}

/* 2) バッジ：マークアップが「外（直下）」でも「中（media 内）」でも正しく配置 */
.product-card > .product-card__badge{          /* 外に置いたケース（今回の修正） */
  position: absolute;
  left: -8px; top: -8px;                       /* はみ出す */
  z-index: 3;
  pointer-events: none;                         /* クリックを邪魔しない */
}
.product-card__media{ position: relative; overflow: hidden; }
.product-card__media > .product-card__badge{   /* 既存の中に置いたカード用（互換） */
  position: absolute;
  left: 10px; top: 10px;                        /* はみ出さない通常配置 */
  z-index: 2;
  pointer-events: none;
}

/* 3) 画像ズームはそのまま（必要なければ次の 2 行を消す） */
.product-card__media img{ transform: translateZ(0); }
.product-card:hover .product-card__media img{ transform: scale(1.03); transition: transform .5s ease; }

/* 4) タイトル/リンクをホバーで消さない（上書き） */
.product-card__body .product-card__title,
.product-card__body .btn-view{ opacity: 1; transform: none; transition: none; }
.product-card:hover .product-card__body .product-card__title,
.product-card:hover .product-card__body .btn-view{ opacity: 1; transform: none; }

/* 5) バッジの見た目（既存と同じ。必要なら調整） */
.product-card__badge{
  font-size:.78rem; font-weight:700; color:#fff;
  padding:.28rem .5rem; background: var(--acc-grad);
  border-radius: 0; border: 0;
  /* 影は付けない場合は次の1行を削除 */
  box-shadow: none !important;
}

/* === Product cards: keep badge always visible, no shadow === */

/* カード自体を基準にしてバッジを絶対配置できるように */
.product-card{
  position: relative;
  /* 影をなくす（初期＆ホバー） */
  box-shadow: none !important;
  transition: border-color .25s ease;   /* 影や移動のトランジションは外す */
}
.product-card:hover{
  box-shadow: none !important;
  transform: none !important;           /* 浮き上がりを止める */
  border-color: var(--gold);            /* 境界色だけ変化させる（お好みで） */
}

/* バッジがリンクの外でも常に最前面に */
.product-card .product-card__badge{
  position: absolute;
  top: -8px;
  left: -8px;
  z-index: 5;                           /* 画像より前へ */
  pointer-events: none;                 /* クリックを邪魔しない */
}

/* 念のため：画像がスタッキングコンテキストを作ってもバッジが負けないように */
.product-card .product-card__media{ position: relative; }

/* ==== Product cards (choose-product)：本文を消さない・影なし・バッジをはみ出しに ==== */

/* カード本体：影/浮き上がりを無効化＆はみ出し許可（バッジ用） */
.grid-product .product-card{
  position: relative;
  overflow: visible;                 /* ← バッジを外へ出す */
  box-shadow: none !important;       /* 影カット */
  transform: none !important;        /* 浮き上がりカット */
  transition: border-color .25s ease;
}
.grid-product .product-card:hover{
  box-shadow: none !important;
  transform: none !important;
  border-color: var(--gold);         /* お好みで境界色だけ変化 */
}

/* 画像枠は中だけをクリップ（オーバーレイや拡大はここで完結） */
.grid-product .product-card__media{
  position: relative;
  overflow: hidden;
  z-index: 1;
}

/* 本文（タイトル＋view more）は最前面で常時表示 */
.grid-product .product-card__body{
  position: relative;
  z-index: 2;
  background: #fff;
  opacity: 1 !important;
  transform: none !important;
}
/* 念押し：ホバー時に消したり動かしたりしない */
.grid-product .product-card:hover .product-card__body{
  opacity: 1 !important;
  transform: none !important;
}

/* 英字バッジをカード外へ“はみ出し”表示（リンクの外でも常に見える） */
.grid-product .product-card .product-card__badge{
  position: absolute;
  top: -8px;                         /* はみ出し量はお好みで */
  left: -8px;
  z-index: 3;                        /* 画像より手前 */
  pointer-events: none;              /* クリックを邪魔しない */
}

/* 画像の拡大はそのまま可・速度もお好みで */
.grid-product .product-card__media img{
  will-change: transform;
}
.grid-product .product-card:hover .product-card__media img{
  transform: scale(1.03);
  transition: transform .5s ease;
}

/* ===== Fix: 商品から選ぶ のカードは文字を消さない／影なし ===== */

/* 影と浮き上がりを無効化（通常＋ホバー） */
#choose-product .grid-product .product-card{
  box-shadow: none !important;
  transform: none !important;
}
#choose-product .grid-product .product-card:hover{
  box-shadow: none !important;
  transform: none !important;
  border-color: var(--gold); /* 境界色だけ軽く変化（不要なら削除可） */
}

/* ホバー時もタイトル＆view more を常に表示（“消す”ルールを打ち消す） */
#choose-product .grid-product .product-card .product-card__body .product-card__title,
#choose-product .grid-product .product-card .product-card__body .btn-view{
  opacity: 1 !important;
  transform: none !important;
}
#choose-product .grid-product .product-card:hover .product-card__body{
  color: inherit !important;  /* ホバーで白くならないよう固定 */
}

/* バッジはカード外にはみ出し表示（クリックを邪魔しない） */
#choose-product .grid-product .product-card > .product-card__badge{
  position: absolute;
  top: -8px; left: -8px;
  z-index: 3;
  pointer-events: none;
}

/* 画像のズームだけは残す（不要なら下2行を削除） */
#choose-product .grid-product .product-card .product-card__media img{
  transform: translateZ(0);
  transition: transform .5s ease;
}
#choose-product .grid-product .product-card:hover .product-card__media img{
  transform: scale(1.03);
}


/* ===== [Fix] 商品から選ぶ：影を完全に消す（通常/ホバー/疑似要素/内側） ===== */
#choose-product .product-card,
#choose-product .product-card:hover{
  box-shadow: none !important;
  filter: none !important;            /* 念のため */
}

/* 画像まわりに影が仕込まれていても無効化 */
#choose-product .product-card .product-card__media,
#choose-product .product-card .product-card__media::before,
#choose-product .product-card .product-card__media::after,
#choose-product .product-card .product-card__media img{
  box-shadow: none !important;
  filter: none !important;
}

/* 万一カードの疑似要素で影を付けているケースにも対応 */
#choose-product .product-card::before,
#choose-product .product-card::after{
  box-shadow: none !important;
  filter: none !important;
}

/* =========================================
   Choose Product：影を全消し＋バッジ常時表示
   ========================================= */

/* 影と疑似要素のオーバーレイを“すべて”無効化 */
#choose-product .product-card,
#choose-product .product-card:hover,
#choose-product .product-card::before,
#choose-product .product-card::after,
#choose-product .product-card *::before,
#choose-product .product-card *::after{
  box-shadow: none !important;
  filter: none !important;
}

/* メディア下部の暗いグラデも影に見えるので消す */
#choose-product .product-card__media::after{
  content: none !important;
}

/* カード本体：浮き上がり・変形を禁止して枠色だけ変化 */
#choose-product .product-card{
  position: relative;
  overflow: visible;                 /* バッジを外へはみ出せるように */
  transform: none !important;
  transition: border-color .25s ease;
}
#choose-product .product-card:hover{
  transform: none !important;
  border-color: var(--gold);
}

/* 本文（花束 / view more）は常に表示・色変化もしない */
#choose-product .product-card__body{
  position: relative; z-index: 2;
  background: #fff;
  opacity: 1 !important;
  transform: none !important;
  color: inherit !important;
}
#choose-product .product-card:hover .product-card__body{
  opacity: 1 !important;
  transform: none !important;
  color: inherit !important;
}

/* ===== バッジ：常に出す・最前面・影なし ===== */
#choose-product .product-card .product-card__badge{
  position: absolute !important;
  z-index: 9 !important;
  display: inline-block !important;
  opacity: 1 !important;
  pointer-events: none !important;
  box-shadow: none !important;
}

/* バッジが “カード直下” に置かれている（今回のマークアップ）場合は
   はみ出し配置にする */
#choose-product .product-card > .product-card__badge{
  top: -8px !important;
  left: -8px !important;
}

/* もし “media 内” に入っているカードが混在しても破綻しないように */
#choose-product .product-card__media > .product-card__badge{
  top: 10px !important;
  left: 10px !important;
}

/* 画像の微ズームだけは残す（不要ならこの2行を消してください） */
#choose-product .product-card__media img{
  transform: translateZ(0);
  transition: transform .55s ease;
}
#choose-product .product-card:hover .product-card__media img{
  transform: scale(1.03);
}

/* ===============================
   Bouquet page only: sizes cards
   影ゼロ・文字フェード無効・バッジ固定
   =============================== */
#bouquet-sizes .product-card,
#bouquet-sizes .product-card:hover,
#bouquet-sizes .product-card::before,
#bouquet-sizes .product-card::after,
#bouquet-sizes .product-card *::before,
#bouquet-sizes .product-card *::after{
  box-shadow: none !important;
  filter: none !important;
}

/* 下部の暗いグラデ（影っぽく見える）も無効化 */
#bouquet-sizes .product-card__media::after{
  content: none !important;
}

#bouquet-sizes .product-card{
  position: relative;
  overflow: visible;                /* バッジを外へ */
  transform: none !important;
  transition: border-color .25s ease;
}
#bouquet-sizes .product-card:hover{
  transform: none !important;
  border-color: var(--gold);
}

/* 本文は常に表示。色も変えない */
#bouquet-sizes .product-card__body,
#bouquet-sizes .product-card:hover .product-card__body{
  background: #fff;
  opacity: 1 !important;
  transform: none !important;
  color: inherit !important;
}
/* タイトル・説明のフェードも禁止 */
#bouquet-sizes .product-card__title,
#bouquet-sizes .product-card .wf-text{
  opacity: 1 !important;
  transform: none !important;
  color: inherit !important;
}

/* バッジをカード外にはみ出して常時前面 */
#bouquet-sizes .product-card > .product-card__badge{
  position: absolute;
  top: -8px; left: -8px;
  z-index: 6;
  pointer-events: none;
  box-shadow: none !important;
  opacity: 1 !important;
}

/* 画像は控えめにズーム（任意） */
#bouquet-sizes .product-card__media{ position: relative; overflow: hidden; z-index:1; }
#bouquet-sizes .product-card__media img{
  transform: translateZ(0);
  transition: transform .5s ease;
}
#bouquet-sizes .product-card:hover .product-card__media img{
  transform: scale(1.03);
}

/* 念のため：もし残っていたら光演出は強制で非表示 */
.sparks{ display:none !important; }


/* ========== Utility: サイズカード用（影ゼロ・文字固定・バッジはみ出し） ========== */
.sizes--plain .product-card,
.sizes--plain .product-card:hover,
.sizes--plain .product-card::before,
.sizes--plain .product-card::after,
.sizes--plain .product-card *::before,
.sizes--plain .product-card *::after{
  box-shadow: none !important;
  filter: none !important;
}
.sizes--plain .product-card__media::after{ content:none !important; }

.sizes--plain .product-card{
  position:relative; overflow:visible;
  transform:none !important; transition: border-color .25s ease;
}
.sizes--plain .product-card:hover{ transform:none !important; border-color: var(--gold); }

.sizes--plain .product-card__body,
.sizes--plain .product-card:hover .product-card__body{
  background:#fff; opacity:1 !important; transform:none !important; color:inherit !important;
}
.sizes--plain .product-card__title,
.sizes--plain .product-card .wf-text{
  opacity:1 !important; transform:none !important; color:inherit !important;
}

.sizes--plain .product-card > .product-card__badge{
  position:absolute; top:-8px; left:-8px; z-index:6;
  pointer-events:none; box-shadow:none !important; opacity:1 !important;
}

.sizes--plain .product-card__media{ position:relative; overflow:hidden; z-index:1; }
.sizes--plain .product-card__media img{ transform:translateZ(0); transition: transform .5s ease; }
.sizes--plain .product-card:hover .product-card__media img{ transform: scale(1.03); }


/* ===== Pager（news 用：角あり＋細線＋金グラデ） ===== */
.pager{
  display:flex; align-items:center; justify-content:center; gap:.6rem;
  margin: clamp(12px,2.4vw,18px) 0 0;
  padding-top: clamp(10px,1.6vw,14px);
  border-top: 1px solid rgba(0,0,0,.08);
}
.pager__list{
  display:flex; gap:.35rem; margin:0; padding:0; list-style:none;
}
.pager__page,
.pager__prev,
.pager__next{
  display:inline-flex; align-items:center; justify-content:center;
  min-width: 38px; height: 38px; padding: 0 .8rem;
  font-weight:800; text-decoration:none; color:#111;
  background:#fff; border:1px solid var(--silver-weak); border-radius:0;
  box-shadow:none; transition: transform .2s ease, box-shadow .2s ease, filter .2s ease;
}
.pager a:hover{
  transform: translateY(-1px);
  box-shadow: 0 10px 26px rgba(0,0,0,.08);
  border-color: var(--gold);
}
.pager .is-current{
  background: linear-gradient(#fffdf8,#fff) padding-box, var(--acc-grad) border-box;
  border-color: transparent; color:#111;
}
.pager .is-disabled{
  opacity:.45; pointer-events:none; cursor:default;
}

/* スマホ時は密に */
@media (max-width:520px){
  .pager{ gap:.5rem; }
  .pager__page, .pager__prev, .pager__next{ min-width:34px; height:34px; padding:0 .6rem; }
}

/* =========================================
   Company page (company.html)
   ========================================= */

/* 概要の定義リスト */
.defs--company{
  display:grid;
  grid-template-columns: 10em 1fr;
  column-gap:1.2em; row-gap:.6rem; margin:0;
  border-top:1px solid rgba(0,0,0,.08);
  border-bottom:1px solid rgba(0,0,0,.08);
  padding:.6rem 0;
}
.defs--company > div{ display:contents; }
.defs--company dt{ grid-column:1; font-weight:800; color:var(--ink); }
.defs--company dd{ grid-column:2; margin:0; color:var(--ink-weak); }
.defs--company a{ color:inherit; text-decoration:none; border-bottom:1px solid rgba(0,0,0,.12); }
.defs--company a:hover{ border-bottom-color:transparent; }

/* “私たちの想い” カード */
.company-cards{
  display:grid; gap:clamp(12px,2vw,18px);
  grid-template-columns: repeat(2,1fr);
}
@media (max-width:960px){ .company-cards{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:520px){ .company-cards{ grid-template-columns:1fr; } }

.company-card{
  background:#fff; border:1px solid var(--silver-weak);
  box-shadow:0 10px 26px rgba(0,0,0,.06);
  padding: clamp(14px,2.2vw,18px);
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
  position:relative; overflow:hidden;
}
.company-card::before{
  content:""; position:absolute; left:0; right:0; top:0; height:3px;
  background: var(--acc-grad); opacity:.35;
}
.company-card:hover{
  transform: translateY(-2px);
  border-color: var(--gold);
  box-shadow: 0 16px 36px rgba(0,0,0,.12);
}
.company-card h3{ margin:.2rem 0 .4rem; }
.company-card p{ margin:.2rem 0 0; color:var(--ink-weak); }

/* 私たちの想い：テキスト＋画像2カラム */
.company-message{
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
  gap: clamp(16px, 3vw, 32px);
  margin-bottom: clamp(20px, 3vw, 32px);
}

.company-message__text p + p{
  margin-top: .4rem;
}

.company-message__image img{
  width: 100%;
  height: auto;
  display: block;
}

/* スマホ・タブレットでは縦並びに */
@media (max-width: 960px){
  .company-message{
    grid-template-columns: 1fr;
  }
  .company-message__image{
    max-width: 420px;
    margin-inline: auto;
  }
}




/* 沿革タイムライン */
.timeline{
  position:relative; list-style:none; margin:0; padding:0 0 0 1.2rem;
  border-left:2px solid rgba(0,0,0,.08);
}
.timeline li{ position:relative; padding:.4rem 0 .6rem .6rem; }
.timeline li::before{
  content:""; position:absolute; left:-10px; top:.6rem;
  width:10px; height:10px; border-radius:50%;
  background: linear-gradient(#fff,#fff) padding-box, var(--acc-grad) border-box;
  border:2px solid transparent;
}
.timeline .date{ display:inline-block; min-width:7.5ch; font-variant-numeric:tabular-nums; font-weight:700; }
.timeline .text{ color:var(--ink-weak); }

/* アクセス */
.map{
  background:#fff; border:1px solid var(--silver-weak);
  box-shadow:0 10px 26px rgba(0,0,0,.06);
}
.map iframe{ display:block; width:100%; height:360px; border:0; }

.access-grid{
  display:grid; grid-template-columns:1.2fr 1fr; gap:1rem; margin-top:.8rem;
}
@media (max-width:960px){ .access-grid{ grid-template-columns:1fr; } }


/* ===== Contact Form ===== */
.form__grid{
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(12px,2vw,16px);
}
.form__row{
  display: grid;
  grid-template-columns: 10em 1fr;
  gap: clamp(10px,2vw,16px);
  align-items: start;
}
@media (max-width:640px){
  .form__row{ grid-template-columns: 1fr; }
}

.form__label{
  font-weight:800; letter-spacing:.02em;
  padding-top:.55rem;
}
.form__label .req{
  display:inline-block; margin-left:.4em;
  font-size:.72em; font-weight:800; line-height:1;
  padding:.18em .45em; color:#b89554;
  border:1px solid rgba(199,168,106,.5);
  background:linear-gradient(180deg,#fff,#fffdf8);
}

.input, .select, .textarea{
  width:100%;
  padding:.75rem .9rem;
  border:1px solid var(--silver-weak);
  background:#fff; color:var(--ink);
  border-radius:0; outline: none;
  transition: border-color .2s ease, box-shadow .2s ease;
  font: inherit;
}
.input--sm{ padding:.55rem .7rem; }
.textarea{ resize: vertical; }

.input:focus, .select:focus, .textarea:focus{
  border-color: transparent;
  box-shadow: 0 0 0 2px rgba(0,0,0,0), 0 0 0 2px var(--gold);
}

.form__field{ display:flex; flex-wrap:wrap; gap:.6rem 1rem; }
.form__field--inline{ align-items:center; gap:.6rem; }

.check{
  display:inline-flex; align-items:center; gap:.4rem;
  padding:.2rem .3rem;
  border-radius:4px;
}
.check input{ transform: translateY(1px); }

.agree{
  display:flex; align-items:center; gap:.5rem;
  font-weight:700;
}
.agree a{ color:inherit; text-decoration:none; border-bottom:1px solid rgba(0,0,0,.15); }
.agree a:hover{ border-bottom-color: transparent; }

/* ハニーポットは非表示 */
.hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }

.form__actions{
  display:flex; justify-content:center; margin-top: clamp(10px,2vw,14px);
}
.form__actions .btn-solid.btn-wide{ min-width:min(320px,80%); }

/* サブMV下の余白とフォームの調和 */
.section--calm .form{ margin-top:.4rem; }


/* =========================
   Contact form – spacing / line-height fix
   ========================= */

/* 行間（row 同士）のリズムをそろえる */
.form__grid{
  row-gap: 1.2rem;
}

/* ラベル列と入力列の間隔を少しだけ統一 */
.form__row{
  gap: .6rem 1.6rem;
  padding-top: .05rem;
  padding-bottom: .05rem;
}

/* ラベルの縦位置をそろえる */
.form__label{
  padding-top: .55rem;
}

/* 各行の中（右側カラム）のバラつきをリセット */
.form .form__field{
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: .45rem .9rem;
}

/* form__field 直下の要素は上下マージンをゼロに */
.form .form__field > *{
  margin-top: 0;
  margin-bottom: 0;
}

/* 注意書きなどのテキスト（inline style を含めて強制上書き） */
.form .form__field > .wf-text,
.form p.wf-text{
  margin: .15rem 0 !important;
  line-height: 1.6;
}

/* インライン並び（数量・電話番号など）の高さと間隔を統一 */
.form .form__field--inline{
  align-items: flex-end;
  gap: .45rem 1rem;
}
.form .form__field--inline > *{
  margin: 0;
}

/* ネストされた form__field（電話番号・携帯など）も余白を揃える */
.form .form__field .form__field{
  gap: .45rem 1rem;
  margin: .2rem 0 0;
  padding: 0;
}

/* チェックボックス・ラジオボタンの行間をコンパクトに */
.form .check{
  padding: .05rem .25rem;
}
.form .check input{
  transform: translateY(0);
  margin: 0;
}

/* ご用途・色彩の「その他」は必ず次の行に配置 */
.form__field > div:has(#purpose-other),
.form__field > div:has(#color-other){
  flex-basis: 100%;      /* ここで改行させる */
  margin-top: .4rem;     /* 少しだけ上に余白 */
}

/* ===== ごあいさつ（会社概要上のメッセージ） ===== */
.section--greeting{
  background:#faf7f4;
  padding-block:3.5rem;
}

.company-greeting{
  display:flex;
  flex-direction:column;
  gap:2rem;
}

.company-greeting__text{
  max-width:40rem;
}

.company-greeting__title{
  font-size:1.6rem;
  margin:0 0 1rem;
}

.company-greeting__body{
  margin:0 0 1rem;
  line-height:1.9;
}

.company-greeting__sign{
  margin-top:1.5rem;
  text-align:right;
  line-height:1.6;
}

/* 画像側 */
.company-greeting__photo{
  margin:0;
  max-width:480px;
  width:100%;
  aspect-ratio:4 / 3;
  border-radius:8px;
  overflow:hidden;
  box-shadow:0 10px 26px rgba(0,0,0,.12);
}

.company-greeting__photo img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

/* PC で左右２カラムに */
@media (min-width: 960px){
  .company-greeting{
    flex-direction:row;
    align-items:center;
    justify-content:space-between;
    gap:3rem;
  }
}


/* =========================================
   News Article Custom Styles (Added)
   ========================================= */

/* 読みやすさのために幅を制限するコンテナ */
.container--narrow {
  max-width: 900px;
}

/* 記事全体のレイアウト */

/* 記事ヘッダー */
.news-article__header {
  margin-bottom: 2rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--silver-weak);
}

.news-article__meta {
  margin-bottom: .8rem;
  display: flex;
  align-items: center;
  gap: .6rem;
}

.news-article__meta .date {
  font-weight: 700;
  font-size: .9rem;
  color: var(--ink-weak);
  letter-spacing: .04em;
}

/* 既存の .news-card .cat のスタイルを流用・調整 */
.news-article__meta .cat {
  padding: .14rem .5rem;
  line-height: 1;
  border: 1px solid rgba(199,168,106,.45);
  background: linear-gradient(180deg,#fff,#fffdf8);
  color: #b89554;
  font-weight: 700;
  font-size: .78rem;
}

.news-article__title {
  font-size: clamp(1.4rem, 2.5vw, 1.8rem);
  margin-bottom: 0;
  border: none; /* wf-h2の下線を消す場合 */
  padding-bottom: 0;
}
.news-article__title::after {
  content: none; /* wf-h2の下線を消す */
}

/* 記事本文 */
.news-article__body {
  margin-bottom: 2rem;
}

/* 記事内の画像（枠線付き） */
.news-article__figure {
  margin: 0 0 3rem;
  background: #fff;
  padding: 10px;
  border: 1px solid var(--silver-weak);
  box-shadow: 0 10px 26px rgba(0,0,0,.06);
}
.news-article__figure img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}
.news-article__figure figcaption {
  font-size: .85rem;
  margin-top: .5rem;
  color: var(--ink-weak);
  text-align: right;
}

/* 記事内ガイド（2カラムなど） */
.news-article__guides {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 1.5rem;
  margin-bottom: 3rem;
}
/* guide-cardのタイトルサイズ微調整 */
.news-article__guides .guide-card__title {
  font-size: 1.1rem;
  font-weight: 700;
}

/* 記事下ナビゲーション */
.news-article__nav {
  border-top: 1px solid var(--silver-weak);
  padding-top: 2rem;
  display: flex;
  justify-content: center;
  gap: 1rem;
  flex-wrap: wrap;
}
/* =========================================
   [Fix] CF7のselect / checkbox / radio が効かない対策
   ※ Resetで appearance:none を当てているため
========================================= */

/* --- 1) checkbox / radio を“表示・クリック可能”に戻す --- */
.page-order .form input[type="checkbox"],
.page-order .form input[type="radio"]{
  -webkit-appearance: auto;
  appearance: auto;
  width: 1.05em;
  height: 1.05em;
  margin: 0;
  accent-color: var(--gold); /* チェック色をテーマに合わせる */
  cursor: pointer;
}

/* （任意）date のUI（カレンダー）を戻す：Safari対策にも */
.page-order .form input[type="date"]{
  -webkit-appearance: auto;
  appearance: auto;
}

/* --- 2) CF7のラジオ/チェック（リスト）の並びを .check 相当に整える --- */
.page-order .form .wpcf7-form-control.wpcf7-radio,
.page-order .form .wpcf7-form-control.wpcf7-checkbox,
.page-order .form .wpcf7-form-control.wpcf7-acceptance{
  display: flex;
  flex-wrap: wrap;
  gap: .6rem 1rem;
}

/* CF7デフォの余白（左マージン等）を消す */
.page-order .form .wpcf7-list-item{
  margin: 0;
}

/* 各項目のラベルを“押せる見た目”に */
.page-order .form .wpcf7-list-item > label{
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .2rem .3rem;
  border-radius: 4px;
  cursor: pointer;
  user-select: none;
}

/* hover でうっすら反応（任意） */
.page-order .form .wpcf7-list-item > label:hover{
  background: rgba(199,168,106,.08);
}

/* キーボード操作のフォーカスも見えるように */
.page-order .form input[type="checkbox"]:focus-visible,
.page-order .form input[type="radio"]:focus-visible,
.page-order .form select:focus-visible{
  outline: 2px solid var(--gold);
  outline-offset: 2px;
}

/* --- 3) select を .input と同じトーンに（矢印も自前で表示） --- */
.page-order .form select,
.page-order .form .wpcf7-select{
  width: 100%;
  padding: .75rem .9rem;
  padding-right: 2.2rem;                 /* 矢印ぶん右を空ける */
  border: 1px solid var(--silver-weak);
  background-color: #fff;
  color: var(--ink);
  border-radius: 0;
  outline: none;

  -webkit-appearance: none;
  appearance: none;

  /* 右側の▼をCSSで描画 */
  background-image:
    linear-gradient(45deg, transparent 50%, currentColor 50%),
    linear-gradient(135deg, currentColor 50%, transparent 50%);
  background-position:
    calc(100% - 18px) 50%,
    calc(100% - 12px) 50%;
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;

  cursor: pointer;
}

/* select のフォーカス（既存inputと合わせる） */
.page-order .form select:focus,
.page-order .form .wpcf7-select:focus{
  border-color: transparent;
  box-shadow: 0 0 0 2px rgba(0,0,0,0), 0 0 0 2px var(--gold);
}

/* --- 4) 送信ボタンが input[type="submit"] の場合も念のためクリックカーソル --- */
.page-order .form input[type="submit"],
.page-order .form button[type="submit"]{
  cursor: pointer;
}