/* =========================================================
   site.css &#8212; Minimal Modern Theme (SoraCraftLab)
   - 全ページ共通のベース/レイアウト
   - ヘッダー / ナビ（固定CTAボタン） / ヒーロー
   - グリッド / カード / フッター
   - 画像（About用） / ネイティブcontactフォーム
   - 折りたたみポリシー（.policy）
   - 斜体の無効化 / ダークモード最適化 / レスポンシブ強化
   - ★ ボタンは全て角丸なし（四角）
   ======================================================= */

/* ===== Design Tokens ===== */
:root{
  --bg:#ffffff;        /* 背景 */
  --text:#0f172a;      /* 本文 */
  --muted:#64748b;     /* 補助文字 */
  --border:#e2e8f0;    /* ボーダー */
  --surface:#f8fafc;   /* カード背景 */

  --brand:#0ea5e9;     /* 主色（ブルー） */
  --brand-600:#0284c7; /* ホバー */

  --radius:14px;       /* カード等の角丸 */
  --container:1080px;  /* コンテナ幅 */

  --s1:8px; --s2:12px; --s3:16px; --s4:24px; --s5:40px; --s6:72px;

  /* Breakpoints */
  --bp-sm: 480px;
  --bp-md: 768px;
  --bp-lg: 1024px;
  --bp-xl: 1280px;

  /* Footer gap */
  --footer-gap: 96px;         /* デスクトップ */
}
@media (max-width: 600px){
  :root{ --footer-gap: 48px; }/* モバイル */
}

/* ===== Base ===== */
*{box-sizing:border-box}
html{font-size:16px}
body{
  margin:0; background:var(--bg); color:var(--text);
  font-family:ui-sans-serif,system-ui,-apple-system,"Segoe UI","Noto Sans JP","Hiragino Kaku Gothic ProN","Yu Gothic","Meiryo",sans-serif;
  line-height:1.7; letter-spacing:.01em;
}
img{max-width:100%; display:block}
a{color:var(--text); text-underline-offset:3px}
p{margin:0 0 var(--s3)}
ul{margin:0 0 var(--s3) 1.2em; padding-left:1.2em}
.container{max-width:var(--container); margin:0 auto; padding:0 var(--s4)}
.section{padding:var(--s6) 0}
.section-sm{padding:var(--s5) 0}

/* ===== Typography ===== */
.h1{margin:0 0 var(--s3); font-weight:800; font-size:clamp(30px,4.6vw,48px); letter-spacing:.01em}
.h2{margin:0 0 var(--s3); font-weight:800; font-size:clamp(22px,3vw,28px)}
.lead{margin:0; color:var(--muted); font-size:clamp(16px,2.2vw,19px)}

/* 斜体の無効化（ヒーロー/本文中の emphasis を通常書体へ） */
em, .hero em, .lead em, .card em, i, cite, dfn, var, address {
  font-style:normal !important; font-weight:inherit;
}

/* ===== Header / Nav ===== */
.site-header{
  position:sticky; top:0; z-index:40;
  background:rgba(255,255,255,.9);
  backdrop-filter:saturate(160%) blur(10px);
  border-bottom:1px solid var(--border);
}

/* ヘッダーの .container を下層 .container と同条件にしつつ、gridで左右端を厳密アライン */
header.site-header .container.navbar{
  max-width: var(--container);
  margin: 0 auto;
  padding-left: var(--s4);
  padding-right: var(--s4);
  display: grid !important;
  grid-template-columns: 1fr auto;  /* 左：brand を左端まで / 右：CTA を右端まで */
  align-items: center;
  gap: 0;
}
@media (max-width: 1024px){
  header.site-header .container.navbar{ padding-left: var(--s3); padding-right: var(--s3); }
}
@media (max-width: 480px){
  header.site-header .container.navbar{ padding-left: var(--s2); padding-right: var(--s2); }
}

/* 屋号（ブランド）&#8212; コンテナ左端に厳密に揃える */
.brand{
  display:flex; align-items:center; gap:10px;
  text-decoration:none; color:var(--text); font-weight:800;
  margin:0; padding:0; line-height:1;
  justify-self: start;  /* grid左端 */
}

/* ナビ（空でもOK。端のアライン崩しをしない） */
.nav{background:transparent !important;}

/* ★ 常時表示CTA（navの外）&#8212; コンテナ右端に厳密に揃える */
.cta-fixed{
  margin:0;                                           /* 余計なオフセットなし */
  justify-self: end;                                  /* grid右端 */
  display:inline-flex !important; align-items:center;
  background:transparent !important; border:0 !important; box-shadow:none !important;
}
.cta-fixed a{
  display:inline-block !important;
  padding:12px 18px !important;
  border-radius:0 !important;                         /* 角丸なし */
  background-color:var(--brand) !important;
  color:#fff !important;
  text-decoration:none !important;
  font-weight:700 !important; line-height:1 !important;
  border:1px solid transparent !important; box-shadow:none !important;
  cursor:pointer !important; -webkit-appearance:none; appearance:none;
}
.cta-fixed a:hover{ background-color:var(--brand-600) !important; }
.cta-fixed a:focus-visible{ outline:2px solid var(--brand-600) !important; outline-offset:2px !important; }
.cta-fixed a::before, .cta-fixed a::after{ content:none !important; }

/* モバイルメニュー（使う場合） */
.burger{display:none}

/* ===== Hero ===== */
.hero{
  padding:clamp(56px,8vw,96px) 0;
  border-bottom:1px solid var(--border);
  background:radial-gradient(1200px 600px at 80% -200px, #e0f2fe 0%, transparent 60%);
}

/* ===== Buttons / Components ===== */
/* ボタンは全て角丸なしで統一 */
.btn{
  display:inline-block; padding:12px 22px;
  border-radius:0 !important;
  font-weight:700; text-decoration:none; transition:background .15s ease, transform .02s ease;
}
.btn-primary{background:var(--brand); color:#fff; border:1px solid transparent}
.btn-primary:hover{background:var(--brand-600)}
.btn-ghost{border:1px solid var(--border); color:#0f172a; background:transparent}
.btn:active{transform:translateY(1px)}

/* カードやテーブルは従来どおり（必要なら --radius を調整） */
.card{
  background:#fff; border:1px solid var(--border);
  border-radius:var(--radius); padding:var(--s4);
}

/* グリッド */
.grid{display:grid; gap:var(--s4)}
.grid-2{grid-template-columns:1fr}
.grid-3{grid-template-columns:1fr}
@media(min-width:900px){
  .grid-2{grid-template-columns:1fr 1fr}
  .grid-3{grid-template-columns:repeat(3,1fr)}
}

/* Feature / Info table */
.feature .title{margin:0 0 6px; font-weight:700}
.feature p{margin:0; color:var(--muted)}
.info{display:grid; gap:10px}
.info-row{display:grid; grid-template-columns:140px 1fr; gap:12px}
.info-key{color:var(--muted)}

/* ===== Footer ===== */
.site-footer{border-top:1px solid var(--border); padding:16px 0; color:var(--muted); font-size:.95rem}
/* フッター下に余白（セーフエリア考慮） */
.site-footer{ margin-bottom: calc(var(--footer-gap) + env(safe-area-inset-bottom, 0px)); }

.footer-row{display:flex; justify-content:space-between; gap:12px; align-items:center; flex-wrap:wrap}
.footer-nav a{color:var(--muted); text-decoration:none}
.footer-nav a:hover{color:var(--text)}
.dot-sep{color:var(--border); margin:0 8px}

/* ===== About画像（小さめ・中央寄せ） ===== */
.about-visual{margin:0 0 16px; text-align:center;}
.about-visual img{
  width:clamp(240px, 52vw, 560px);  /* 画面に応じて可変／上限560px */
  height:auto; display:inline-block;
  border-radius:12px; border:1px solid var(--border);
  box-shadow:0 6px 24px rgba(17,24,39,.06);
}
@media (max-width:480px){
  .about-visual img{ width:clamp(200px, 70vw, 560px); }
}

/* ===== Contact Form (Native) &#8212; Polished ===== */
.sc-form{max-width:720px;margin:0 auto;}
.sc-field{margin-bottom:16px;}
.sc-field label{display:block;font-weight:700;margin-bottom:8px;color:var(--text);}
.sc-req{color:#ef4444;margin-left:4px;font-weight:700;}
.sc-form input[type=text],
.sc-form input[type=email],
.sc-form input[type=tel],
.sc-form input[type=url],
.sc-form textarea{
  width:100%;
  padding:12px 14px;
  border:1px solid var(--border);
  border-radius:12px; /* 入力欄は視認性優先。0にしたい場合は 0 に。 */
  background:#fff; color:var(--text);
  font-size:16px;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.sc-form textarea{min-height:160px; resize:vertical;}
.sc-form input::placeholder,
.sc-form textarea::placeholder{color:#9aa4b2;}
.sc-form input:focus,
.sc-form textarea:focus{
  outline:3px solid #0ea5e922;
  border-color:var(--brand);
  box-shadow:0 0 0 1px var(--brand) inset;
}
/* 同意チェック */
.sc-form input[type=checkbox]{width:18px;height:18px;margin-top:3px;margin-right:8px;}
.sc-form a{color:var(--brand);text-decoration:none;}
.sc-form a:hover{color:var(--brand-600);}
/* 送信ボタン（角丸なし） */
.sc-form .btn,
.sc-form button[type=submit]{
  display:inline-block;
  padding:12px 22px;
  border:1px solid transparent;
  border-radius:0 !important;
  background:var(--brand); color:#fff;
  font-weight:700; cursor:pointer;
  transition:background .15s ease, transform .02s ease;
}
.sc-form .btn:hover,
.sc-form button[type=submit]:hover{background:var(--brand-600);}
.sc-form .btn:active,
.sc-form button[type=submit]:active{transform:translateY(1px);}
/* 成功/失敗メッセージ */
.notice{max-width:720px;margin:0 auto 16px;padding:12px 14px;border-radius:12px;border:1px solid transparent;}
.notice.ok{background:#ecfdf5;border-color:#bbf7d0;color:#065f46;}
.notice.ng{background:#fef2f2;border-color:#fecaca;color:#991b1b;}
/* 入力エラーの汎用クラス */
.is-invalid{border-color:#ef4444 !important; box-shadow:0 0 0 1px #ef4444 inset !important;}
.help-text{color:#ef4444; font-size:.9rem; margin-top:6px;}
@media (max-width:480px){
  .sc-form button[type=submit]{width:100%;}
  .sc-form input[type=text],
  .sc-form input[type=email],
  .sc-form textarea{ padding:14px 14px; font-size:16px; } /* iOSズーム回避 */
}

/* contactページの縦列そろえ */
.contact-stack{max-width:720px;margin:0 auto;padding:0 var(--s4);}
.contact-stack > * {margin-left:0;margin-right:0;}
@media (max-width:480px){ .contact-stack{ padding:0 var(--s3); } }

/* ===== 折りたたみポリシー（contact内などで使用） ===== */
.policy{ margin:12px 0 18px; }
.policy summary{
  cursor:pointer; font-weight:700; color:var(--text);
  padding:8px 0; list-style:none;
}
.policy summary::-webkit-details-marker{display:none}
.policy .policy-box{
  margin-top:8px; padding:14px; border:1px solid var(--border);
  border-radius:12px; background:var(--surface); color:var(--text);
  max-height:clamp(220px, 50vh, 360px); overflow:auto;
}
.policy .policy-box h3{margin:18px 0 8px; font-size:1.05rem}
.policy .policy-box p{margin:0 0 10px}
.policy .policy-box ul{margin:6px 0 4px 1.2em}
.policy .policy-box li{margin:6px 0}
.policy .policy-box a{ color:var(--brand); text-decoration:none; }
.policy .policy-box a:hover{ color:var(--brand-600); }

/* ===== Responsive container padding ===== */
@media (max-width:1024px){
  .container{ padding-left: var(--s3); padding-right: var(--s3); }
}
@media (max-width:480px){
  .container{ padding-left: var(--s2); padding-right: var(--s2); }
}

/* ===== Grid responsiveness ===== */
@media (max-width:1024px){
  .grid-3{ grid-template-columns: 1fr 1fr; }
}
@media (max-width:768px){
  .grid-2, .grid-3{ grid-template-columns: 1fr; }
}
@media (max-width:480px){
  .card{ padding: var(--s3); }
}

/* ===== Hero / type responsiveness ===== */
@media (max-width:768px){
  .hero{ padding: clamp(40px, 10vw, 64px) 0; }
  .h1{ font-size: clamp(26px, 6vw, 36px); }
  .lead{ font-size: clamp(15px, 3.8vw, 18px); }
}

/* ===== Footer responsiveness ===== */
@media (max-width:600px){
  .footer-row{ gap:8px; }
  .footer-row > *{ width: 100%; }
  .footer-row nav{ display:flex; gap:10px; flex-wrap:wrap; }
}

/* ===== Dark Mode (auto) ===== */
@media (prefers-color-scheme: dark){
  :root{ --bg:#0b1220; --text:#e5e7eb; --surface:#0f172a; --border:#1f2937; --muted:#9aa4b2 }
  .site-header{background:rgba(15,23,42,.7)}
  .nav{background:#0f172a; border-color:#1f2937}
  .card{background:#0f172a}
  /* フォームの色味をダーク向けに */
  .sc-form input[type=text],
  .sc-form input[type=email],
  .sc-form input[type=tel],
  .sc-form input[type=url],
  .sc-form textarea{
    background:#0f172a; color:#e5e7eb; border-color:#1f2937;
  }
  .sc-form input::placeholder,
  .sc-form textarea::placeholder{color:#94a3b8;}
  .notice.ok{background:#052e24;border-color:#0f5132;color:#d1fae5;}
  .notice.ng{background:#3b0d0d;border-color:#7f1d1d;color:#fee2e2;}
  /* 折りたたみポリシーの境界強化 */
  .policy .policy-box{ border-color:#1f2937; }
}

/* 中央配置のカード（縦横センター） */
.center-card{
  display:flex;
  align-items:center;           /* 垂直中央 */
  justify-content:center;       /* 水平中央 */
  min-height: 280px;            /* 高さがない時でも中央に見える基準値 */
  text-align:center;            /* 文章を中央寄せ */
  padding: clamp(24px, 5vw, 48px);
}

/* 読みやすさの微調整（改行多めでも整う） */
.center-card__text{
  margin:0;
  line-height:1.9;
}

/* =========================
   404 (not-found) レイアウト補正
   ========================= */
body.not-found .hero { 
  padding: clamp(40px, 10vw, 72px) 0;
  border-bottom: 1px solid var(--border);
}
body.not-found .section { padding: clamp(32px, 8vw, 64px) 0; }
body.not-found .card{
  max-width: 720px;
  margin: 0 auto;
  padding: clamp(16px, 4vw, 24px);
  display: flex; flex-direction: column; gap: 16px;
}
body.not-found .card .btn-row{ display:flex; gap:12px; flex-wrap:wrap; }
@media (max-width: 480px){
  body.not-found .card .btn-row{ flex-direction: column; }
  body.not-found .card .btn-row .btn{ width:100%; text-align:center; }
}
body.not-found .search-block .sc-form { max-width: 640px; margin: 0; }
body.not-found .search-block .sc-form .sc-field{ margin-bottom: 12px; }
body.not-found header.site-header .cta-fixed{
  margin:0;
  justify-self:end;
  display:inline-flex !important; align-items:center;
  background:transparent !important; border:0 !important; box-shadow:none !important;
}
body.not-found header.site-header .cta-fixed a{
  display:inline-block !important; padding:12px 18px !important;
  border-radius:0 !important; background:var(--brand) !important; color:#fff !important;
  text-decoration:none !important; font-weight:700 !important; line-height:1 !important;
  border:1px solid transparent !important; box-shadow:none !important;
}
@media (max-width:600px){
  :root{ --footer-gap: 56px; } /* 404は少し広め */
}

/* 404 actions area */
.nf-wrap{ display:flex; flex-direction:column; gap:18px; }
.nf-lead{ margin:0 0 4px; color:var(--muted); }
.nf-grid{ display:grid; gap:24px; grid-template-columns: 1.2fr 1fr; }
@media (max-width: 900px){ .nf-grid{ grid-template-columns: 1fr; } }
.nf-title{ margin:0 0 12px; font-weight:800; font-size:1.05rem; }
.nf-actions{ display:flex; flex-direction:column; gap:10px; }
.nf-actions .btn{ width:100%; text-align:center; }
.nf-links{ margin:14px 0 0 1.2em; }
.nf-links li{ margin:6px 0; }
.nf-links a{ text-decoration:none; color:var(--brand); }
.nf-links a:hover{ color:var(--brand-600); }
.nf-search{ max-width: 560px; }
.nf-note{ margin-top:10px; color:var(--muted); font-size:.95rem; line-height:1.8; }

/* ===== Responsive container padding ===== */
@media (max-width:1024px){
  .container{ padding-left: var(--s3); padding-right: var(--s3); }
}
@media (max-width:480px){
  .container{ padding-left: var(--s2); padding-right: var(--s2); }
}

/* ===== Grid responsiveness ===== */
@media (max-width:1024px){
  .grid-3{ grid-template-columns: 1fr 1fr; }
}
@media (max-width:768px){
  .grid-2, .grid-3{ grid-template-columns: 1fr; }
}
@media (max-width:480px){
  .card{ padding: var(--s3); }
}

/* ===== Hero / type responsiveness ===== */
@media (max-width:768px){
  .hero{ padding: clamp(40px, 10vw, 64px) 0; }
  .h1{ font-size: clamp(26px, 6vw, 36px); }
  .lead{ font-size: clamp(15px, 3.8vw, 18px); }
}

/* ===== Footer responsiveness ===== */
@media (max-width:600px){
  .footer-row{ gap:8px; }
  .footer-row > *{ width: 100%; }
  .footer-row nav{ display:flex; gap:10px; flex-wrap:wrap; }
}

/* =========================================================
   Header を .container の左右端＆縦中央に厳密アライン（微調整なし）
   ======================================================= */

/* 1) ヘッダー内ラッパーを .container と同条件にし、gridで左右端を固定 */
header.site-header .container.navbar{
  max-width: var(--container);
  margin: 0 auto;
  padding-left: var(--s4);
  padding-right: var(--s4);
  display: grid !important;
  grid-template-columns: 1fr auto;  /* 左=brand（可変） / 右=CTA（自幅） */
  align-items: center;               /* 縦中央揃え */
  gap: 0;
  min-height: 64px;                  /* 高さを一定化（行間差でズレない） */
}
@media (max-width: 1024px){
  header.site-header .container.navbar{ padding-left: var(--s3); padding-right: var(--s3); }
}
@media (max-width: 480px){
  header.site-header .container.navbar{ padding-left: var(--s2); padding-right: var(--s2); }
}

/* 2) 左端：屋号（brand）をピッタリ左に、余計な余白・行間を排除 */
header.site-header .brand{
  justify-self: start;
  margin: 0 !important;
  padding: 0 !important;
  display: inline-flex;
  align-items: center;               /* 縦中央 */
  line-height: 1;                    /* 行間でズレない */
  background: transparent;
}

/* 3) 右端：CTA をピッタリ右に、縦中央＆確実にボタン見た目 */
header.site-header .cta-fixed{
  justify-self: end;
  margin: 0 !important;
  display: inline-flex !important;
  align-items: center;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
header.site-header .cta-fixed a{
  display: inline-flex !important;   /* ボタン内テキストを縦中央 */
  align-items: center;
  height: 40px;                      /* ヘッダー高とバランスの取れたボタン高 */
  padding: 0 18px !important;
  border-radius: 0 !important;       /* 角丸なし */
  background: var(--brand) !important;
  color: #fff !important;
  text-decoration: none !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  border: 1px solid transparent !important;
  box-shadow: none !important;
  -webkit-appearance: none; appearance: none;
}
header.site-header .cta-fixed a:hover{ background: var(--brand-600) !important; }
header.site-header .cta-fixed a:focus-visible{ outline: 2px solid var(--brand-600) !important; outline-offset: 2px !important; }
header.site-header .cta-fixed a::before,
header.site-header .cta-fixed a::after{ content: none !important; }

/* 4) nav 由来の背景/疑似要素で端がズレないようガード（空でもOK） */
header.site-header .nav,
header.site-header .nav a,
header.site-header .nav a::before,
header.site-header .nav a::after{
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0;
}

/* 5) 下層 .container と左右端がズレないよう、グローバルの .container 余白を同期（再確認） */
@media (max-width: 1024px){
  .container{ padding-left: var(--s3); padding-right: var(--s3); }
}
@media (max-width: 480px){
  .container{ padding-left: var(--s2); padding-right: var(--s2); }
}

/* =========================================================
   Header: 屋号とお問い合わせボタンを .container と縦横で厳密アライン
   - 左右は同じ padding（clamp）で“外向きズレ”を解消
   - 上下は min-height + align-items:center で中央揃え
   ======================================================= */

/* 1) 下層 .container と同じ左右パディングを共通化（clampで一本化） */
.container,
header.site-header .container.navbar{
  max-width: var(--container);
  margin: 0 auto;
  padding-left: clamp(var(--s2), 3vw, var(--s4)) !important;
  padding-right: clamp(var(--s2), 3vw, var(--s4)) !important;
}

/* 2) ヘッダー内は grid で左右端を固定。上下中央に */
header.site-header .container.navbar{
  display: grid !important;
  grid-template-columns: 1fr auto;   /* 左=brand（可変） / 右=CTA（自幅） */
  align-items: center;                /* 縦中央 */
  gap: 0;
  min-height: 64px;                   /* 高さを一定化 */
}

/* 3) 左端：屋号は余計な余白ゼロ・行間の差を排除して左端に */
header.site-header .brand{
  justify-self: start;
  margin: 0 !important;
  padding: 0 !important;
  display: inline-flex;
  align-items: center;                /* 縦中央 */
  line-height: 1;
  background: transparent;
}

/* 4) 右端：CTA は右端に固定。常に“ボタン見た目”で縦中央 */
header.site-header .cta-fixed{
  justify-self: end;
  margin: 0 !important;
  display: inline-flex !important;
  align-items: center;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
header.site-header .cta-fixed a{
  display: inline-flex !important;    /* ボタン内テキストも中央 */
  align-items: center;
  height: 40px;                       /* ヘッダー高とバランスの取れた高さ */
  padding: 0 18px !important;
  border-radius: 0 !important;        /* 角丸なし */
  background: var(--brand) !important;
  color: #fff !important;
  text-decoration: none !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  border: 1px solid transparent !important;
  box-shadow: none !important;
  -webkit-appearance: none; appearance: none;
}
header.site-header .cta-fixed a:hover{ background: var(--brand-600) !important; }
header.site-header .cta-fixed a:focus-visible{
  outline: 2px solid var(--brand-600) !important; outline-offset: 2px !important;
}

/* 5) nav（空でも可）や疑似要素が余白を作らないように */
header.site-header .nav,
header.site-header .nav a,
header.site-header .nav a::before,
header.site-header .nav a::after{
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
}

/* =========================================================
   Header: 左右端は .container に合わせ、上下は完全に中央揃え
   ======================================================= */
header.site-header .container.navbar{
  max-width: var(--container);
  margin: 0 auto;
  /* 左右パディングは下層 .container と同一（clampで一本化） */
  padding: 0 clamp(var(--s2), 3vw, var(--s4));
  /* 高さを一定化＋上下中央 */
  min-height: 64px;
  display: flex !important;
  align-items: center;           /* ★上下中央揃え */
  justify-content: space-between;/* 左=brand / 右=CTA */
  gap: 0;
}

/* 左：屋号（余白・行間を排除して垂直センター） */
header.site-header .brand{
  display: flex;
  align-items: center;           /* ★上下中央 */
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1;                /* 行間のズレ防止 */
  background: transparent;
}

/* 右：お問い合わせ（ボタン見た目で垂直センター） */
header.site-header .cta-fixed{
  display: flex !important;
  align-items: center;           /* ★上下中央 */
  margin: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
header.site-header .cta-fixed a{
  display: flex !important;      /* 中のテキストも中央 */
  align-items: center;
  height: 40px;                  /* ヘッダー高に対して見栄え良く */
  padding: 0 18px !important;
  border-radius: 0 !important;
  background: var(--brand) !important;
  color: #fff !important;
  text-decoration: none !important;
  font-weight: 700 !important;
  line-height: 1 !important;     /* 行間のズレ防止 */
  border: 1px solid transparent !important;
  box-shadow: none !important;
}

/* nav（空でもOK）・疑似要素が余白を作らないように */
header.site-header .nav,
header.site-header .nav a,
header.site-header .nav a::before,
header.site-header .nav a::after{
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
}

/* ==== 長いメール/URLのはみ出し完全防止（プライバシー表＆折りたたみ） ==== */

/* 情報テーブル（/privacy ページ） */
.pp-info .info-row{
  display:grid;
  grid-template-columns: 8em 1fr; /* 左:ラベル固定/右:可変 */
  column-gap: 12px;
  align-items:start;
}
.pp-info .info-row > span:first-child{ white-space: nowrap; } /* 「E-mail」などは折らない */
.pp-info .info-row > span:last-child{
  min-width: 0;                 /* ← Grid の右カラムを折返し可能にするキモ */
  overflow-wrap: anywhere;      /* どこでも改行OK（主要ブラウザ） */
  word-break: break-word;       /* フォールバック */
  hyphens: auto;                /* ハイフネーション支援（対応ブラウザ） */
}
.pp-info .info-row a{
  display: inline;              /* インライン基準で折返し */
  overflow-wrap: anywhere;
  word-break: break-word;
  hyphens: auto;
}

/* 折りたたみ版（/contact の <details class="policy"> 内） */
.policy .policy-box a{
  display: inline;
  overflow-wrap: anywhere;
  word-break: break-word;
  hyphens: auto;
}

/* もっと狭い端末での保険（ラベル幅を少し詰める） */
@media (max-width: 360px){
  .pp-info .info-row{ grid-template-columns: 6.5em 1fr; }
}

