/* ===== patch.css（完全置換版：11/11ベース＋翻訳メニュー封じ＋HERO統合）===== */

/* --- スクロール/安全域/CTA高さ --------------------- */
:root{
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-right: env(safe-area-inset-right, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --cta-h: 72px;
  --menu-head-h: 56px; /* ハンバーガー見出しの想定高さ */

  /* footer */
  --foot-bg:#0b1220;
  --foot-fg:#cbd5e1;
  --foot-border:#1f2937;
}

html,body{margin:0;padding:0}
html, body { overflow:auto !important; height:auto !important; }
body{ padding-bottom: calc(var(--cta-h) + var(--safe-bottom)); }

/* --- アコーディオン ------------------------------- */
details summary{
  padding:1rem 1.2rem;cursor:pointer;list-style:none;
  border:1px solid #e5e7eb;border-radius:10px;background:#fff;font-weight:700;
}
details[open] summary{
  background:#f8fafc;
  border-bottom-left-radius:0;
  border-bottom-right-radius:0;
}
details .content{
  border:1px solid #e5e7eb;border-top:0;
  border-bottom-left-radius:10px;border-bottom-right-radius:10px;
  padding:1rem 1.2rem .9rem;background:#fff;
}
.accordion>details{margin:.55rem 0!important;}
.text-sm{font-size:.86em;opacity:.9;}
.muted{color:#475569;}
.note{display:block;font-size:.82em;color:#475569;margin-top:.35rem;}
.smallish{font-size:clamp(20px,3.6vw,24px);margin-bottom:.75rem;font-weight:800;}
.security-note{
  font-size:.9em;color:#334155;background:#f1f5f9;
  border:1px solid #e2e8f0;border-radius:10px;
  padding:.8rem 1rem;margin-top:.6rem;
}

/* --- 価格ボックス ------------------------------- */
.price-promo{
  border:1px solid #e5e7eb;background:#f9fafb;
  border-radius:12px;padding:16px 16px 14px;
  margin:14px 0;box-shadow:0 2px 10px rgba(0,0,0,.03);
}
.price-promo .row{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px;}
.price-promo .label{color:#475569;font-weight:700;}
.price-promo .old{color:#64748b;text-decoration:line-through;}
.price-promo .now{
  font-weight:800;font-size:clamp(18px,2.2vw,22px);
  color:#d32f2f;
}
.price-promo .badge{
  display:inline-block;background:#ef4444;color:#fff;
  border-radius:999px;padding:.2rem .6rem;
  font-size:.8em;font-weight:700;margin-left:.25rem;
}
.price-promo .meta{font-size:.86em;color:#475569;margin-top:6px;line-height:1.6;}
.price-promo .proof{
  display:flex;gap:10px;flex-wrap:wrap;
  margin-top:8px;color:#0b1220;
}
.price-promo .proof span{
  background:#fff;border:1px solid #e5e7eb;
  border-radius:999px;padding:.25rem .6rem;font-weight:700;
}

/* --- 進行ステップ ------------------------------- */
.progress-steps{display:flex;gap:8px;flex-wrap:wrap;margin:.5rem 0;}
.progress-steps .step{
  padding:.4rem .7rem;border-radius:999px;
  border:1px solid #e5e7eb;background:#fff;
}
.progress-steps .completed{background:#f0fdf4;border-color:#dcfce7;}

/* --- テーブル共通 ------------------------------- */
table{width:100%;border-collapse:collapse;margin:.5rem 0;}
th,td{border:1px solid #e5e7eb;padding:.5rem .6rem;text-align:right;}
th:first-child,td:first-child{text-align:left;}

@media (max-width:480px){
  h2{
    font-size:clamp(18px,5.6vw,22px);
    line-height:1.28;margin:0 0 .8rem;
  }
}

/* --- KYCと料金の隙間調整 ------------------------- */
#corp-setup{padding-bottom:0!important;}
#plans{padding-top:0!important;margin-top:0!important;}

/* --- 右上ハンバーガーボタン ---------------------- */
.menu-button{
  position:fixed;
  top:calc(10px + var(--safe-top));
  right:calc(10px + var(--safe-right));
  z-index:10000;
  display:inline-flex;align-items:center;justify-content:center;
  width:48px;height:48px;border-radius:12px;
  background:#111827;color:#fff;
  box-shadow:0 4px 14px rgba(0,0,0,.15);
  border:1px solid rgba(255,255,255,.08);
}
.menu-button .bars{
  display:block;width:28px;height:20px;position:relative;
}
.menu-button .bars::before,
.menu-button .bars::after,
.menu-button .bars span{
  content:"";position:absolute;left:0;right:0;
  height:2px;background:#fff;border-radius:2px;
}
.menu-button .bars::before{top:0;}
.menu-button .bars span{top:9px;}
.menu-button .bars::after{bottom:0;}

/* ★追加：開いている時はハンバーガーが×に見える */
html.menu-open .menu-button .bars::before{
  top:9px;
  transform: rotate(45deg);
}
html.menu-open .menu-button .bars::after{
  bottom:auto;
  top:9px;
  transform: rotate(-45deg);
}
html.menu-open .menu-button .bars span{
  opacity:0;
}

/* --- ハンバーガーメニュー本体 ------------------- */
.menu-wrap{position:fixed;inset:0;z-index:9999;pointer-events:none;}
.menu-backdrop{
  position:absolute;inset:0;
  background:rgba(0,0,0,.35);
  opacity:0;transition:opacity .18s ease;
  backdrop-filter:blur(1px);
}
.menu-panel{
  position:absolute;top:0;right:0;
  height:100%;width:min(420px,92vw);
  background:#f5f7fa;color:#0b1220;
  border-left:1px solid #e5e7eb;
  box-shadow:-16px 0 40px rgba(0,0,0,.12);
  transform:translateX(100%);
  transition:transform .22s ease;
  font-size:14px;line-height:1.38;
  display:flex;flex-direction:column;
}
.menu-head{
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  padding:12px 14px;border-bottom:1px solid #e5e7eb;background:#fff;
  position:sticky;top:0;z-index:2;min-height:var(--menu-head-h);
}
.menu-title{font-weight:800;color:#111827;}
.menu-close{
  width:36px;height:36px;
  display:inline-flex;align-items:center;justify-content:center;
  border-radius:10px;border:1px solid #e5e7eb;
  background:#fff;color:#111827;
}
.menu-close:hover{background:#f3f4f6;}

/* ★修正：大きすぎるpaddingを撤去 */
.menu-groups{
  flex:1 1 auto; overflow:auto; height:auto !important;
  padding: 10px 0 12px;
  scroll-padding-top: calc(var(--menu-head-h) + 8px);
  -webkit-overflow-scrolling: touch;
}

.menu-group{padding:8px 10px 6px;}
.menu-group h4{
  margin:0 0 6px;padding:0 6px;
  font-size:.92rem;color:#111827;font-weight:700;opacity:.9;
}
.menu-list{list-style:none;margin:0;padding:0;}
.menu-list li a{
  display:block;padding:7px 10px;margin:0 6px 6px;
  border-radius:8px;text-decoration:none;
  color:#334155;background:#fff;border:1px solid #e5e7eb;
}
.menu-list li a:hover{background:#eef2f7;border-color:#d4d8de;}

/* ★追加：detailsの子項目 */
.menu-list li.sub a{
  padding-left: 22px;
  font-size: 0.95em;
  opacity: 0.95;
}

html.menu-open .menu-wrap{pointer-events:auto;}
html.menu-open .menu-backdrop{opacity:1;}
html.menu-open .menu-panel{transform:none;}
html.menu-open,html.menu-open body{overflow:hidden;}

/* --- 画面最下部 固定CTA ------------------------- */
.fixed-cta{
  position:fixed;left:0;right:0;bottom:0;z-index:9998;
  background:#ffffffcc;
  backdrop-filter:saturate(140%) blur(8px);
  border-top:1px solid rgba(0,0,0,.06);
  padding-bottom:var(--safe-bottom);
}
.fixed-cta .row{
  max-width:64rem;margin:0 auto;
  display:flex;gap:.6rem;align-items:center;justify-content:flex-end;
  padding:.6rem 1rem;min-height:var(--cta-h);
}
.btn{
  display:inline-flex;gap:.5rem;align-items:center;justify-content:center;
  border-radius:10px;padding:.55rem .9rem;
  font-weight:700;border:1px solid transparent;
  text-decoration:none;white-space:nowrap;cursor:pointer;
}
.btn.neutral{background:#e5e7eb;color:#111827;}
.btn.secondary{background:#1f2937;color:#fff;}
.btn.success{background:#10b981;color:#fff;}
.btn:hover{opacity:.92;}

/* --- 言語スイッチ（既存：封じる） ---------------- */
.lang-button,
.lang-wrap{ display:none !important; }

/* --- Google翻訳の青バー等を隠す ------------------ */
#goog-gt-tt,
iframe#goog-te-banner-frame,
.goog-te-banner-frame{
  display:none!important;visibility:hidden!important;
  height:0!important;max-height:0!important;overflow:hidden!important;
}
body > .skiptranslate{display:none!important;}

#google_translate_element{
  position:fixed;left:-9999px;top:-9999px;
  width:0;height:0;overflow:hidden;opacity:0;pointer-events:none;
}
iframe.goog-te-menu-frame,
.goog-te-menu2{
  display:none !important;
}

/* 青バーが出た端末向けのバッファ */
html.gtbar body{ padding-top:44px; }

/* --- フッター（常に黒） ------------------------- */
.site-foot{
  background:var(--foot-bg) !important;
  color:var(--foot-fg) !important;
  border-top:1px solid var(--foot-border) !important;
  text-align:center;
  padding:14px 16px;
  padding-bottom:calc(14px + env(safe-area-inset-bottom,0px));
  font-size:13px; line-height:1.7;
}
.site-foot small{
  display:block;margin:0 auto;
  max-width:min(1100px,92%);letter-spacing:.02em;
}
.site-foot a{
  color:#93c5fd;
  text-decoration:underline;
  text-underline-offset:2px;
}
.site-foot .foot-pc{ display:none; }
.site-foot .foot-sp{ display:block; }

@media (min-width:640px){
  .site-foot .foot-pc{ display:inline; }
  .site-foot .foot-sp{ display:none; }
}

/* --- アンカー位置調整 ---------------------------- */
section[id],
details[id]{ scroll-margin-top: 70px; }

/* --- スマホ時の上辺マージン ---------------------- */
@media (max-width: 480px){
  body{ padding-top:66px; }
  html.gtbar body{ padding-top: calc(66px + 44px); }
}

/* --- フォントをサイト既定に ---------------------- */
html, body,
button, input, select, textarea, summary, details,
nav, a, .menu-panel, .menu-list, .lang-panel{
  font-family: -apple-system, BlinkMacSystemFont,
               "Hiragino Sans", "Hiragino Kaku Gothic ProN",
               "Yu Gothic", Meiryo, "Noto Sans JP",
               "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
}

/* === UXポリッシュ ================================ */
h1, .hero h1, .page-title, .hero .lead {
  word-break: keep-all;
  overflow-wrap: anywhere;
  line-break: strict;
  text-wrap: balance;
}

/* 為替シミュレーション表：横スク時にヘッダー固定 */
.fx-wrap{ overflow:auto; -webkit-overflow-scrolling: touch; }
.fx-sim thead th{
  position: sticky; top: 0; z-index: 1;
  background: #ffffff;
}

/* 動きに弱い利用者への配慮 */
@media (prefers-reduced-motion: reduce){
  *{
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
  }
}

/* フォーカス輪郭 */
:focus-visible {
  outline: 2px solid #2563eb;
  outline-offset: 2px;
}

/* 改行させたくない語用 */
.nowrap { white-space: nowrap; }

/* === コンプライアンス文の視認性補助 ============= */
#disclaimer .accordion > details > summary {
  position: relative;
}
#disclaimer .accordion > details > summary::after{
  content:""; position:absolute;
  inset:auto 14px 10px auto;
  width:8px; height:8px;
  border-radius:999px; background:#e5e7eb;
}
#disclaimer .accordion > details[open] > summary::after{
  background:#93c5fd;
}

/* ===== cf- (Compounding Tool) ==================== */
.cf-card{
  border:1px solid #e5e7eb;background:#fff;
  border-radius:12px;padding:14px;
}
.cf-grid{
  display:grid;grid-template-columns:140px 1fr;
  gap:10px 12px;margin-top:6px;
}
.cf-grid label{align-self:center;color:#0b1220;font-weight:600;}
.cf-grid input,
.cf-grid select{
  height:40px;border:1px solid #d1d5db;
  border-radius:8px;padding:0 10px;font-size:14px;
}
.cf-subrow{grid-column:2 / 3;color:#475569;font-size:.9em;margin-top:-4px;}
.cf-preset{
  display:flex;flex-wrap:wrap;align-items:center;
  gap:8px;margin:10px 0 6px;
}
.cf-chip{
  border:1px solid #e5e7eb;background:#f8fafc;
  border-radius:999px;padding:.25rem .6rem;
  font-weight:700;cursor:pointer;
}
.cf-chip:hover{background:#eef2f7;}
.cf-ack{
  display:flex;gap:8px;align-items:flex-start;
  border:1px solid #e5e7eb;background:#f9fafb;
  border-radius:10px;padding:10px;margin:10px 0;
}
.cf-actions{display:flex;gap:8px;justify-content:flex-start;margin:8px 0;}
.cf-out{
  margin-top:8px;border:1px dashed #d1d5db;
  border-radius:10px;padding:10px;background:#fafafa;
}
.cf-out .cf-kv{
  display:grid;grid-template-columns:180px 1fr;
  gap:6px 10px;
}
.cf-out h5{margin:.3rem 0 .4rem;font-weight:800;}
.cf-links{list-style:none;margin:.4rem 0 0;padding-left:1rem;}
.cf-links li{margin:.2rem 0;}

@media (max-width:640px){
  .cf-grid{grid-template-columns:1fr;gap:8px;}
  .cf-subrow{grid-column:auto;}
  .cf-out .cf-kv{grid-template-columns:1fr;}
}

/* --- 要点リストの行間 ---------------------------- */
.quick-summary .qs-list{
  list-style: disc;
  padding-left: 1.4rem;
  margin-top: .4rem;
}
.quick-summary .qs-list li + li{ margin-top: .8rem; }
.quick-summary .qs-tag{ margin: 0 0 .1rem; }
.quick-summary .row{ margin-bottom: .8rem; }

/* === 料金プラン表（#plans）の横スク対応 ========= */
#plans .plan-table-wrap{
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
#plans .plan-table-wrap table{
  min-width: 640px;
}
#plans .plan-table-wrap th,
#plans .plan-table-wrap td{
  word-break: keep-all;
  white-space: normal;
}
#plans .plan-table-wrap th:nth-child(2),
#plans .plan-table-wrap td:nth-child(2){
  text-align: center;
  padding-left: 0.9rem;
  padding-right: 0.9rem;
  white-space: nowrap;
}
@media (max-width: 480px){
  #plans .plan-table-wrap th:nth-child(2),
  #plans .plan-table-wrap td:nth-child(2){
    font-size: 0.90em;
  }
}
#plans .plan-table-wrap table th:nth-child(1),
#plans .plan-table-wrap table td:nth-child(1){
  width: 32%;
}
#plans .plan-table-wrap table th:nth-child(2),
#plans .plan-table-wrap table td:nth-child(2){
  width: 28%;
  text-align: right;
  padding-right: 0.8rem;
}
#plans .plan-table-wrap table th:nth-child(3),
#plans .plan-table-wrap table td:nth-child(3){
  width: 40%;
}

/* =========================================================
   TOPヒーロー（統合版：カード無し／暗すぎない／文字強め／iPhoneモザイク回避）
   ========================================================= */

.glp-hero{
  position: relative;
  border-radius: 16px;
  overflow: hidden;
  margin: 0 0 24px;
  min-height: min(560px, 92vh);
  color: #ffffff;
  box-shadow: 0 10px 24px rgba(0,0,0,0.35);
  display: flex;
  align-items: flex-end;
}

.glp-hero-bg{
  position:absolute;
  inset:0;
  z-index:0;
}

.glp-hero-img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position: 50% 22%;
  transform: translateZ(0);
  filter: none;
}

.glp-hero-gradient{
  position:absolute;
  inset:0;
  background:
    linear-gradient(
      to bottom,
      rgba(2, 6, 23, 0.10) 0%,
      rgba(2, 6, 23, 0.18) 40%,
      rgba(2, 6, 23, 0.55) 78%,
      rgba(2, 6, 23, 0.72) 100%
    );
}

.glp-hero-content{
  position: relative;
  z-index: 1;
  padding: 24px 18px 26px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  max-width: 620px;
}

.glp-hero-title{
  font-size: 20px;
  font-weight: 800;
  line-height: 1.4;
  margin: 0 0 8px;
  letter-spacing: .06em;
  text-shadow: 0 2px 14px rgba(0,0,0,0.25);
}
.glp-hero-lead{
  font-size: 13px;
  line-height: 1.7;
  margin: 0 0 10px;
  text-shadow: 0 2px 14px rgba(0,0,0,0.22);
}
.glp-hero-note{
  font-size: 11px;
  line-height: 1.6;
  color: #e5e7eb;
  margin: 0 0 14px;
}
.glp-hero-actions{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

@media (min-width: 768px) {
  .glp-hero{ border-radius: 18px; }
  .glp-hero-content{ padding: 32px 32px 34px; }
  .glp-hero-title{ font-size: 26px; }
  .glp-hero-lead{ font-size: 14px; }
  .glp-hero-note{ font-size: 12px; }
}

@supports (-webkit-touch-callout: none) {
  .glp-hero-img{ backface-visibility: hidden; }
}