/*
 Theme Name:   BASE SQUARE
 Theme URI:    https://understrap.com
 Description:  Understrap Child Theme
 Template:     understrap
 Version:      1.1.0
 License: GNU General Public License v2 or later
 License URI: http://www.gnu.org/licenses/gpl-2.0.html
 Text Domain:  understrap-child
 GitHub Theme URI: understrap/understrap-child
*/

:root{
  /* --- Bootstrap 変数の値をブランドカラーに差し替え（変数名は据え置き） --- */
  --bs-primary:#2c7a43;
  --bs-primary-rgb:44, 122, 67;
  --bs-secondary:#e9b949;
  --bs-secondary-rgb:233, 185, 73;
  --bs-success:#2c7a43;
  --bs-success-rgb:44, 122, 67;
  --bs-dark:#15191b;
  --bs-dark-rgb:21, 25, 27;
  --bs-body-color:#1b1e1c;
  --bs-body-color-rgb:27, 30, 28;
  --bs-body-bg:#ffffff;
  --bs-body-bg-rgb:255, 255, 255;
  --bs-link-color:#2c7a43;
  --bs-link-hover-color:#3f9a59;
  --bs-border-color:#e2dccf;

  /* --- ブランド追加変数（末尾に追加） --- */
  --gh-ink:#15191b;          /* 濃色背景 */
  --gh-green:#2c7a43;        /* ブランドグリーン */
  --gh-green-bright:#3f9a59; /* 明るいグリーン */
  --gh-green-dark:#348a4d;   /* ボタンhover */
  --gh-heading:#1b1e1c;      /* 見出し文字 */
  --gh-muted:#6f7368;        /* 本文グレー（明色背景） */
  --gh-gray:#a9a89c;         /* 補助グレー */
  --gh-body:#cdd0c8;         /* 本文（濃色背景の明るい文字） */
  --gh-line:#e2dccf;         /* 罫線（明色） */
  --gh-line-dark:#2d3436;    /* 罫線（濃色） */
  --gh-gold:#e9b949;         /* ゴールド／アクセント */
  --gh-accent:#e9b949;
  --gh-cream:#f4f1ea;        /* クリーム背景 */
  --gh-cream2:#ece6da;       /* クリーム背景（やや濃い） */
  --gh-white: #fcfcfc;       /* 白 */
}

/* ---- フォントサイズ基準（スマホ14px / PC16px、以降は rem/em で処理） ---- */
html{ font-size:14px; }
@media (min-width:768px){ html{ font-size:16px; } }

/* ---- リンク色（サイト共通） ---- */
a{ color:var(--gh-green); }
a:hover{ color:var(--gh-green-bright); }
/* 暗色セクション内のリンク */
.gh-sec a, .gh-contact a, .gh-footer a{ color:var(--gh-green-bright); }
.gh-sec a:hover, .gh-contact a:hover, .gh-footer a:hover{ color:var(--gh-green); }

/* ---- 本文フォント（サイト共通） ---- */
body{
  font-family:"Noto Sans JP",sans-serif;
  /* 文字制御 */
  word-break: normal;
  overflow-wrap: anywhere;
  line-break: strict;
}

/* ---- 共通：セクション見出しラベル（eyebrow） ---- */
.gh-eyebrow{
  display:inline-flex; align-items:center; gap:12px; margin:0 0 16px;
  font-family:"Oswald",sans-serif; font-weight:600;
  font-size:.78125rem; letter-spacing:.22em; text-transform:uppercase; color:var(--gh-green);
}
.gh-eyebrow::before{ content:""; width:26px; height:2px; background:var(--gh-green); }

/* ---- 共通：セクション見出し（title / lead） ---- */
.gh-section-title{
  margin:0 0 18px;
  font-weight:900;
  font-size:clamp(1.625rem,6vw,2.6rem); line-height:1.3; letter-spacing:.01em;
  color:var(--gh-heading); text-wrap:balance;
}
.gh-section-title em{ font-style:normal; color:var(--gh-green); }
.gh-section-lead{
  margin:0 auto; max-width:44em;
  font-weight:400;
  font-size:clamp(.875rem,3.6vw,.9375rem); line-height:1.85; color:var(--gh-muted);
}
/* 改行制御 */
.break-ctrl {
  word-break: keep-all;
  overflow-wrap: anywhere;
  line-break: strict;
}

.grid { display: grid; }
.place-content-center { place-content: center; }
.place-items-center { place-items: center; }

.to-top-btn {
	position: fixed;
	bottom: 20px;
	right: 20px;
	z-index: 9999999;
	background-color: rgba(0,0,0,.6);
	width: 45px;
	height: 45px;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 3px;
}


/* =====================================================================
   Section - HERO
   ===================================================================== */
.gh-hero{
  background:var(--gh-ink);
  padding-block:96px 72px;
}
.gh-hero .gh-hero__bg{
  position:absolute; inset:0;
  background-image:url("../images/hero-bg.jpg");
  background-size:cover;
  background-position:60% 50%;
}
.gh-hero .gh-hero__overlay{
  position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgba(11,14,12,.55) 0%, rgba(11,14,12,0) 30%),
    linear-gradient(0deg, rgba(11,14,12,.85) 0%, rgba(11,14,12,0) 52%),
    linear-gradient(82deg, rgba(11,14,12,.94) 4%, rgba(11,14,12,.72) 40%, rgba(11,14,12,.28) 70%, rgba(11,14,12,.12) 96%);
}
.gh-hero .gh-eyebrow{
  gap:12px;
  margin:0 0 20px;
  font-family:"Oswald",sans-serif; font-weight:600;
  font-size:.75rem; letter-spacing:.16em;
  color:var(--gh-green-bright);
}
.gh-hero .gh-eyebrow__line{ width:34px; height:2px; background:var(--gh-green-bright); }
.gh-hero .gh-eyebrow::before{ content:none; }

.gh-hero .gh-title{ margin:0 0 20px; }
.gh-hero .gh-title__sup{
  display:block; margin-bottom:6px;
  font-weight:700;
  font-size:clamp(1.25rem,5.4vw,2rem); letter-spacing:.04em;
  color:var(--gh-gray);
}
.gh-hero .gh-title__main{
  display:block;
  font-weight:900;
  font-size:clamp(2.375rem,11vw,4rem); line-height:1.15;
  color:var(--gh-green-bright);
}
.gh-hero .gh-script{
  margin:0 0 22px;
  font-family:"Kaushan Script",cursive; font-weight:400;
  font-size:clamp(1.75rem,8vw,2.5rem); line-height:1; color:#fff;
}
.gh-hero .gh-lead{
  max-width:51ch; margin:0 0 30px;
  font-weight:400;
  font-size:clamp(.9375rem,4vw,1.125rem); line-height:1.7; color:var(--gh-body);
}

.gh-hero .gh-actions{ gap:14px; }
.gh-hero .gh-btn{
  min-height:56px; padding:0 32px; border-radius:8px;
  font-weight:700;
  font-size:clamp(.9375rem,4vw,1.1rem); letter-spacing:.04em;
  color:#fff; transition:transform .15s ease, background-color .15s ease, box-shadow .15s ease;
}
.gh-hero .gh-btn--primary{ background:var(--gh-green); box-shadow:0 10px 26px -12px rgba(44,122,67,.9); }
.gh-hero .gh-btn--primary:hover{ background:var(--gh-green-dark); transform:translateY(-2px); color:#fff; }
.gh-hero .gh-btn--ghost{ box-shadow:inset 0 0 0 1px rgba(255,255,255,.35); background:rgba(255,255,255,.001); }
.gh-hero .gh-btn--ghost:hover{ box-shadow:inset 0 0 0 1px rgba(255,255,255,.7); background:rgba(255,255,255,.06); color:#fff; }

.gh-hero .gh-note{
  margin:0;
  font-weight:400;
  font-size:.8125rem; letter-spacing:.02em; color:var(--gh-gray);
}

.gh-hero .gh-usecases{ position:relative; margin-top:56px; }
.gh-hero .gh-usecases__head{ gap:16px; }
.gh-hero .gh-usecases__rule{ flex:1; height:1px; background:rgba(255,255,255,.16); }
.gh-hero .gh-usecases__label{
  flex:none;
  font-weight:400;
  font-size:1rem; letter-spacing:.04em; color:#dfe2da;
}

.gh-hero .gh-card{
  position:relative; display:block; overflow:hidden;
  aspect-ratio:3 / 4; border-radius:10px;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);
  text-decoration:none;
}
.gh-hero .gh-card__img{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; transition:transform .5s ease;
}
.gh-hero .gh-card:hover .gh-card__img{ transform:scale(1.05); }
.gh-hero .gh-card__grad{
  position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(11,14,12,0) 38%, rgba(11,14,12,.86) 100%);
}
.gh-hero .gh-card__cap{
  position:absolute; left:14px; right:14px; bottom:16px;
  display:flex; align-items:baseline; flex-wrap:wrap; gap:4px 10px;
}
.gh-hero .gh-card__en{ font-family:"Oswald",sans-serif; font-weight:600; font-size:.8125rem; letter-spacing:.04em; color:#fff; }
.gh-hero .gh-card__ja{ font-weight:400; font-size:.6875rem; color:#c7cabf; }

.gh-hero .gh-banner{
  position:absolute; z-index:3; right:-6px; top:16px;
  width:126px; height:126px;
  transform:rotate(-6deg);
}
@media (min-width:768px){
  .gh-hero{ padding-block:120px 88px; }
  .gh-hero .gh-banner{ width:182px; height:182px; top:-28px; right:12px; }
}
@media (min-width:992px){
  .gh-hero{ padding-block:150px 110px; min-height:100vh; }
  .gh-hero .gh-hero__bg{ background-position:75% 50%; }
  .gh-hero .gh-lead{ margin-bottom:38px; }
  .gh-hero .gh-usecases{ margin-top:80px; }
  .gh-hero .gh-banner{ width:170px; height:170px; top:0%; right:-8px; transform:translateY(-40%) rotate(-6deg); }
}
@media (min-width:1200px){
  .gh-hero .gh-banner{ width:220px; height:220px; right:-16px; }
}


/* =====================================================================
   Section - FEATURES
   ===================================================================== */
.gh-features{
  --gh-num:var(--gh-gray);   /* 番号・ラベル用グレー（=gray） */
  position:relative;
  background:#fff;
  padding-block:72px;
  overflow:hidden;
}
.gh-features .gh-features__head{ margin:0 auto 44px; }
.gh-features .gh-eyebrow{ margin-bottom:18px; }
.gh-features .gh-section-title{ margin-bottom:22px; }
.gh-features .gh-section-title-mark{
  margin-inline: 0.25em;
	font-size: 0.85em;
	vertical-align: 0.08em;
}
/* features: lead は共通 .gh-section-lead */
.gh-features .gh-feat{
  display:grid; grid-template-columns:auto 1fr;
  column-gap:16px; row-gap:10px;
  padding:26px 28px;
  border:1px solid var(--gh-line); border-radius:10px;
  background:#fff;
}
.gh-features .gh-feat + .gh-feat{ margin-top:18px; }
/* スマホ・タブレットは 01 をアイコンの上に重ねて幅を節約 */
.gh-features .gh-feat__num{
  grid-column:1; grid-row:1; justify-self:center; text-align:center;
  min-width:22px;
  font-family:"Oswald",sans-serif; font-weight:700;
  font-size:.8125rem; letter-spacing:.1em; color:var(--gh-num);
}
.gh-features .gh-feat__icon{
  grid-column:1; grid-row:2; justify-self:center;
  width:44px; height:44px; flex:none; color:var(--gh-green);
}
.gh-features .gh-feat__icon svg{ width:100%; height:100%; }
.gh-features .gh-feat__title{
  grid-column:2; grid-row:1 / span 2; margin:0; align-self:center;
  font-weight:900;
  font-size:clamp(1.125rem,4.6vw,1.5rem); line-height:1.35; color:var(--gh-heading);
}
/* スマホ・タブレットは本文を全幅に折り返す */
.gh-features .gh-feat__desc{
  grid-column:1 / -1; grid-row:3; margin:0;
  font-weight:400;
  font-size:clamp(.875rem,3.6vw,.9375rem); line-height:1.7; color:var(--gh-muted);
}
.gh-features .gh-freestyle{
  display:none;
  position:absolute; right:5%; bottom:150px; z-index:2;
  font-family:"Kaushan Script",cursive; font-size:2.75rem; color:var(--gh-heading);
  transform:rotate(-14deg); pointer-events:none;
}
.gh-features .gh-freestyle::after{
  content:""; display:block; width:70%; height:6px; margin:2px 0 0 8px;
  border-bottom:3px solid var(--gh-green); border-radius:50%;
  transform:rotate(-3deg);
}
.gh-features .gh-vs{
  margin-top:48px; padding:clamp(22px,4vw,40px) clamp(18px,4vw,80px);
  background:var(--gh-ink); border-radius:10px; color:#fff;
}
.gh-features .gh-vs__head{ display:none; }
.gh-features .gh-vs__head span{ font-family:"Oswald",sans-serif; font-weight:700; font-size:1rem; letter-spacing:.05em; }
.gh-features .gh-vs__head .is-base{ color:var(--gh-green-bright); }
.gh-features .gh-vs__head .is-vs{ text-align:center; color:#fff; }
.gh-features .gh-vs__head .is-other{ color:var(--gh-gray); }
.gh-features .gh-vs__row{ display:grid; grid-template-columns:1fr; gap:10px; }
.gh-features .gh-vs__row + .gh-vs__row{ margin-top:14px; }
.gh-features .gh-vs__label{
  order:-1;
  font-weight:400;
  font-size:.875rem; letter-spacing:.04em; text-align:center; color:var(--gh-num);
}
.gh-features .gh-pill{
  display:flex; align-items:center; gap:12px;
  min-height:52px; padding:0 16px; border-radius:12px;
  font-weight:700; font-size:1rem;
}
.gh-features .gh-pill--base{ background:var(--gh-green); color:#fff; justify-content:flex-start; }
/* スマホは一般コンテナと同じくチェックを左に */
.gh-features .gh-pill--base .gh-pill__ic{ order:-1; }
.gh-features .gh-pill--other{
  background:rgba(255,255,255,.05); box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);
  color:#8b8f86; font-weight:400;
}
.gh-features .gh-pill__ic{ flex:none; width:26px; height:26px; }
.gh-features .gh-pill--base .gh-pill__ic{ color:var(--gh-green); }
.gh-features .gh-pill--other .gh-pill__ic{ color:#5a5f57; }
@media (min-width:768px){
  .gh-features{ padding-block:100px; }
  .gh-features .gh-feat{ column-gap:28px; padding:30px 34px; }
  .gh-features .gh-feat__icon{ width:54px; height:54px; }
  .gh-features .gh-freestyle{ display:block; }
  .gh-features .gh-vs__head{
    display:grid; grid-template-columns:minmax(0,1fr) 120px minmax(0,1fr);
    align-items:center; gap:16px; margin-bottom:20px;
  }
  .gh-features .gh-vs__row{ grid-template-columns:minmax(0,1fr) 120px minmax(0,1fr); align-items:center; gap:16px; }
  .gh-features .gh-vs__row + .gh-vs__row{ margin-top:12px; }
  .gh-features .gh-vs__label{ order:0; }
  /* PCはチェックを右に戻す */
  .gh-features .gh-pill--base{ justify-content:space-between; }
  .gh-features .gh-pill--base .gh-pill__ic{ order:0; }
}

/* PCは番号・アイコンを左に並べ、本文をテキスト列に戻す */
@media (min-width:992px){
  .gh-features .gh-feat{ grid-template-columns:auto auto 1fr; }
  .gh-features .gh-feat__num{ grid-column:1; grid-row:1 / span 2; justify-self:start; text-align:left; align-self:start; padding-top:4px; }
  .gh-features .gh-feat__icon{ grid-column:2; grid-row:1 / span 2; align-self:start; }
  .gh-features .gh-feat__title{ grid-column:3; grid-row:1; }
  .gh-features .gh-feat__desc{ grid-column:3; grid-row:2; margin:6px 0 0; }
}


/* =====================================================================
   Section - FLOW
   ===================================================================== */
.gh-flow{
  position:relative;
  background:var(--gh-cream);
  padding-block:72px;
  overflow:hidden;
}
/* セクション間のセパレーター */
.gh-separate {
	position: absolute;
  top: 0;
  left: 0;
	right: 0;
	z-index: -1;
	width: stretch;
}
/* text-center はHTML側クラスで付与 */
.gh-flow .gh-flow__head{ max-width:820px; margin:0 auto 52px; }
/* eyebrow は共通 .gh-eyebrow を使用 */
/* flow: title は共通 .gh-section-title */
/* flow: lead は共通 .gh-section-lead */
.gh-flow .gh-flow__steps{ position:relative; display:flex; flex-direction:column; gap:30px; }
.gh-flow .gh-flow__steps::before{
  content:""; position:absolute; left:26px; top:24px; bottom:24px; width:2px;
  background:linear-gradient(180deg, var(--gh-green), var(--gh-line));
}
.gh-flow .gh-step{ position:relative; display:grid; grid-template-columns:54px 1fr; column-gap:18px; align-items:start; }
.gh-flow .gh-step__circle{
  position:relative; z-index:1;
  width:54px; height:54px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:var(--gh-white); box-shadow:inset 0 0 0 1px var(--gh-green);
  font-family:"Oswald",sans-serif; font-weight:700; font-size:1.3rem; color:var(--gh-green);
}
.gh-flow .gh-step__title{
  margin:2px 0 6px;
  font-weight:900;
  font-size:1.05rem; line-height:1.35; color:var(--gh-heading);
}
.gh-flow .gh-step__desc{
  margin:0;
  font-weight:400;
  font-size:.875rem; line-height:1.7; color:var(--gh-muted);
  text-align: start;
}
.gh-flow .gh-steel{
  margin-top:52px; overflow:hidden; border-radius:10px;
  box-shadow:0 18px 44px -22px rgba(20,25,22,.5);
  display:grid; grid-template-columns:1fr;
}
.gh-flow .gh-steel__media{ position:relative; min-height:280px; background:var(--gh-ink); }
.gh-flow .gh-steel__media img{ display:block; width:100%; height:100%; object-fit:cover; }
.gh-flow .gh-steel__panel{ background:var(--gh-ink); color:#fff; padding:clamp(28px,5vw,48px); }
.gh-flow .gh-steel__panel .gh-eyebrow{ color:var(--gh-green-bright); }
.gh-flow .gh-steel__title{
  margin:0 0 20px;
  font-weight:900;
  font-size:clamp(1.375rem,5vw,1.75rem); line-height:1.4; color:#fff;
}
.gh-flow .gh-steel__text{
  margin:0 0 24px;
  font-weight:400;
  font-size:.9rem; line-height:1.9; color:var(--gh-body);
}
.gh-flow .gh-steel__text p{ margin:0 0 1em; }
.gh-flow .gh-steel__text p:last-child{ margin:0; }
.gh-flow .gh-tags{ display:flex; flex-wrap:wrap; gap:10px; }
.gh-flow .gh-tag{
  display:inline-flex; align-items:center; min-height:32px; padding:0 14px;
  border-radius:999px; box-shadow:inset 0 0 0 1px var(--gh-line-dark);
  font-weight:400; font-size:.78125rem;
  letter-spacing:.04em; color:var(--gh-body);
}
@media (min-width:768px){
  .gh-flow{ padding-block:100px; }
  .gh-flow .gh-steel{ grid-template-columns:1.1fr 1fr; }
  .gh-flow .gh-steel__media{ min-height:100%; }
}
@media (min-width:992px){
  .gh-flow .gh-flow__steps{ flex-direction:row; gap:22px; }
  .gh-flow .gh-flow__steps::before{ left:9%; right:9%; top:26px; bottom:auto; width:auto; height:2px;
    background:linear-gradient(90deg, var(--gh-green), var(--gh-line)); }
  .gh-flow .gh-step{ flex:1; grid-template-columns:1fr; justify-items:center; text-align:center; row-gap:16px; }
  .gh-flow .gh-step__title{ margin-top:0; }
  .gh-flow .gh-steel{ grid-template-columns:1.3fr 1fr; }
}


/* =====================================================================
   Section - PLANS
   ===================================================================== */
.gh-plans{
  position:relative;
  background:var(--gh-cream2);
  padding-block:72px;
  overflow:hidden;
}
/* text-center はHTML側クラスで付与 */
.gh-plans .gh-plans__head{ max-width:840px; margin:0 auto 44px; }
/* eyebrow は共通 .gh-eyebrow を使用 */
/* plans: title は共通 .gh-section-title */
/* plans: lead は共通 .gh-section-lead */
.gh-plans .gh-plan{
  position:relative; height:100%;
  padding:26px 29px; border-radius:10px;
  background:#fff; box-shadow:inset 0 0 0 1px var(--gh-line);
}
.gh-plans .gh-plan--dark{ background:var(--gh-ink); box-shadow:inset 0 0 0 1px var(--gh-ink); }
.gh-plans .gh-plan__label{
  margin:0 0 10px;
  font-family:"Oswald",sans-serif; font-weight:400; font-size:.8125rem;
  letter-spacing:.08em; text-transform:uppercase; color:var(--gh-green);
}
.gh-plans .gh-plan--dark .gh-plan__label{ color:var(--gh-green-bright); }
.gh-plans .gh-plan__size{
  margin:0 0 4px;
  font-weight:900; font-size:1.8125rem;
  line-height:1.2; color:var(--gh-heading);
}
.gh-plans .gh-plan--dark .gh-plan__size{ color:#fff; }
.gh-plans .gh-plan__dim{
  margin:0 0 18px;
  font-weight:400; font-size:.9rem;
  line-height:1.7; color:var(--gh-muted);
}
.gh-plans .gh-plan--dark .gh-plan__dim{ color:var(--gh-body); }
.gh-plans .gh-plan__use{ padding:16px; border-top:1px solid var(--gh-line); margin-bottom: unset; }
.gh-plans .gh-plan--dark .gh-plan__use{ border-color:var(--gh-line-dark); }
.gh-plans .gh-plan__use dt{
  margin:0 0 4px;
  font-weight:700; font-size:.78125rem;
  letter-spacing:.06em; color:var(--gh-heading);
}
.gh-plans .gh-plan--dark .gh-plan__use dt{ color:#fff; }
.gh-plans .gh-plan__use dd{
  margin:0;
  font-weight:400; font-size:.9rem;
  line-height:1.7; color:var(--gh-muted);
}
.gh-plans .gh-plan--dark .gh-plan__use dd{ color:var(--gh-body); }
.gh-plans .gh-plan__badge{
  position:absolute; top:19px; right:0;
  padding:4px 12px 4px 14px; border-radius:4px 0 0 4px;
  background:var(--gh-accent);
  font-weight:700; font-size:.75rem;
  letter-spacing:.06em; color:var(--gh-ink);
}

.gh-plans .gh-table-title {
  margin: 36px 0 18px;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 900;
  font-size: 1.5rem;
  color: var(--gh-heading);
}
.gh-plans .gh-table-wrap{
  overflow:hidden; border-radius:10px; background:#fff;
  box-shadow:inset 0 0 0 1px var(--gh-line), 0 8px 22px -14px rgba(20,25,22,.45);
}
.gh-plans .gh-table-scroll{ overflow-x:auto; -webkit-overflow-scrolling:touch; }
.gh-plans .gh-table{ width:100%; min-width:720px; border-collapse:collapse; }
.gh-plans .gh-table thead th{
  background:var(--gh-ink); color:#fff; text-align:left;
  padding:16px 20px;
  font-weight:500; font-size:.8125rem; letter-spacing:.06em;
  white-space:nowrap;
}
.gh-plans .gh-table tbody td{
  padding:15px 20px; border-bottom:1px solid var(--gh-line); vertical-align:middle;
}
.gh-plans .gh-table tbody tr:last-child td{ border-bottom:none; background:var(--gh-cream); }
.gh-plans .gh-td-size{ font-family:"Oswald",sans-serif; font-weight:600; font-size:1.05rem; color:var(--gh-heading); white-space:nowrap; }
.gh-plans .gh-table tbody tr:last-child .gh-td-size{ font-family:"Noto Sans JP",sans-serif; font-weight:700; }
.gh-plans .gh-td-dim{ font-weight:400; font-size:.9rem; color:var(--gh-muted); white-space:nowrap; }
.gh-plans .gh-td-price{ white-space:nowrap; }
.gh-plans .gh-td-price b{ font-weight:900; font-size:1.125rem; color:var(--gh-heading); }
.gh-plans .gh-td-price span{ font-weight:500; font-size:.8125rem; color:var(--gh-muted); margin-left:4px; }
.gh-plans .gh-td-use{ font-weight:400; font-size:.875rem; color:var(--gh-muted); }
.gh-plans .gh-plans__notes{
  display:flex; flex-wrap:wrap; gap:0.5em 1em; margin:18px 2px 0;
  font-weight:400; font-size:.8125rem; color:var(--gh-muted);
}
.gh-plans .gh-plans__notes span {
  display:inline-flex;
  background-color: var(--gh-white);
  padding: 0.5em 1em;
  border-radius: 2em;
}
@media (min-width:768px){ .gh-plans{ padding-block:100px; } }


/* 費用の内訳イメージ */
.gh-plans .gh-costex{ margin-top:40px; container-type:inline-size; }
.gh-plans .gh-costex__lead{
  margin:0 0 18px;
  font-family:"Noto Sans JP",sans-serif; font-weight:900; font-size:1.5rem;
  color:var(--gh-heading);
}
.gh-plans .gh-costex__formula{
  display:flex; flex-wrap:wrap; align-items:stretch; justify-content:center; gap:16px;
}
.gh-plans .gh-costex__parts{
  flex:1 1 420px; min-width:0;
  display:flex; align-items:center; justify-content:center; gap:clamp(6px,1.6vw,16px);
}
.gh-plans .gh-costex__sum{
  flex:1 1 300px; min-width:260px;
  display:flex; align-items:center; justify-content:center; gap:clamp(6px,1.6vw,16px);
}
.gh-plans .gh-costex__card{
  display:flex; flex-direction:column; align-items:center; justify-content:space-between; gap:12px;
  flex:1 1 0; min-width:0; max-width:157px; min-height:203px; padding:21px 14px 20px;
  background:var(--gh-green); border-radius:22px; box-shadow:inset 0 0 0 1px var(--gh-line);
}
.gh-plans .gh-costex__icon{
  width:100%; max-width:116px; aspect-ratio:1; height:auto; border-radius:19px; background:#f6f6f6; overflow:hidden;
  display:flex; align-items:center; justify-content:center; color:var(--gh-green);
}
.gh-plans .gh-costex__icon svg{ width:57%; height:57%; }
.gh-plans .gh-costex__name{
  font-family:"Noto Sans JP",sans-serif; font-weight:700; font-size:.9375rem; line-height:1.35;
  text-align:center; word-break:keep-all; color:#fbfbfb;
}
.gh-plans .gh-costex__op{
  font-family:"Noto Sans JP",sans-serif; font-weight:700; font-size:1.75rem;
  color:var(--gh-ink); line-height:1;
}
.gh-plans .gh-costex__result{
  display:grid; grid-template-columns:1fr auto 1fr; align-items:baseline; align-content:center; column-gap:0;
  flex:1 1 auto; min-width:0; align-self:stretch; min-height:203px;
  padding:24px 20px; border-radius:10px;
  background:#fff; box-shadow:inset 0 0 0 1px var(--gh-line);
  color:var(--gh-green);
}
.gh-plans .gh-costex__pre{ justify-self:end; }
.gh-plans .gh-costex__unit{ justify-self:start; }
.gh-plans .gh-costex__pre{ font-family:"Noto Sans JP",sans-serif; font-weight:900; font-size:1.75rem; }
.gh-plans .gh-costex__num{
  font-family:"Oswald",sans-serif; font-weight:700; font-size:4.25rem; line-height:1; letter-spacing:.01em; margin:0 .12em;
}
.gh-plans .gh-costex__unit{ font-family:"Noto Sans JP",sans-serif; font-weight:900; font-size:1.75rem; }
@media (max-width:575px){
  .gh-plans .gh-costex__name{ font-size:.8125rem; }
  .gh-plans .gh-costex__op{ font-size:1.35rem; }
  .gh-plans .gh-costex__num{ font-size:3.25rem; }
}
@container (max-width:440px){
  .gh-plans .gh-costex__parts{ flex-direction:column; align-items:stretch; gap:10px; }
  .gh-plans .gh-costex__card{
    flex:0 0 auto; max-width:none; min-height:0;
    flex-direction:row; align-items:center; justify-content:flex-start; gap:14px;
    padding:12px 18px 12px 12px; border-radius:16px;
  }
  .gh-plans .gh-costex__icon{ flex:none; width:64px; max-width:none; border-radius:12px; }
  .gh-plans .gh-costex__name{ text-align:left; font-size:.9375rem; }
  .gh-plans .gh-costex__op{ align-self:center; }
  .gh-plans .gh-costex__sum{ min-width:0; }
  .gh-plans .gh-costex__result{ min-height:150px; padding:20px 16px; }
}


/* =====================================================================
   Section - SECURITY
   ===================================================================== */
.gh-sec{
  --gh-line:var(--gh-line-dark);  /* このセクションは濃色罫線 */
  --gh-body:#bcbfb6;              /* このセクション固有の本文グレー */
  position:relative;
  background:var(--gh-ink);
  color:#fff;
  padding-block:72px;
  overflow:hidden;
}
.gh-sec .bg-camera { top: 0; right: -20%; width: 400px; z-index: -1; overflow: hidden;}

.gh-sec .gh-sec__head{ margin:0 auto 44px; }
.gh-sec .gh-eyebrow{ color:var(--gh-green-bright); }
.gh-sec .gh-section-title{ color:#fff; }
.gh-sec .gh-section-lead{ color:var(--gh-body); }
.gh-sec .gh-card{ height:100%; border-radius:10px; box-shadow:inset 0 0 0 1px var(--gh-line); overflow:hidden; }
.gh-sec .gh-basic{ background:#1e2426; }
.gh-sec .gh-basic__head{ display:flex; align-items:center; gap:14px; padding:22px 26px; border-bottom:1px solid var(--gh-line); }
.gh-sec .gh-badge{
  flex:none; padding:5px 12px; border-radius:5px; background:var(--gh-green);
  font-weight:400; font-size:.75rem; letter-spacing:.06em; color:#fff;
}
.gh-sec .gh-basic__title{ margin:0; font-weight:900; font-size:1.2rem; line-height:1.25; color:#fff; }
.gh-sec .gh-sensor{ display:grid; grid-template-columns:auto 1fr; gap:16px; align-items:start; padding:20px 26px; border-bottom:1px solid var(--gh-line); }
.gh-sec .gh-basic .gh-sensor:last-child{ border-bottom:none; }
.gh-sec .gh-sensor__ic{
  width:46px; height:46px; border-radius:9px;
  background:rgba(63,154,89,.15); color:var(--gh-green-bright);
}
.gh-sec .gh-sensor__t{ margin:0 0 4px; font-weight:700; font-size:1rem; line-height:1.3; color:#fff; }
.gh-sec .gh-sensor__d{ margin:0; font-weight:400; font-size:.875rem; line-height:1.7; color:var(--gh-body); }
.gh-sec .gh-opt{ background:linear-gradient(160deg, #23302a, #1a211f); padding:26px 28px; }
.gh-sec .gh-opt__eyebrow{
  margin:0 0 14px; font-family:"Oswald",sans-serif; font-weight:400; font-size:.75rem;
  letter-spacing:.1em; text-transform:uppercase; color:var(--gh-gold);
}
.gh-sec .gh-opt__title{ margin:0 0 12px; font-weight:900; font-size:1.35rem; line-height:1.25; color:#fff; }
.gh-sec .gh-opt__desc{ margin:0 0 20px; font-weight:400; font-size:.9375rem; line-height:1.7; color:var(--gh-body); }
.gh-sec .gh-opt__list{ margin:0; padding:0; list-style:none; display:flex; flex-direction:column; gap:12px; }
.gh-sec .gh-opt__list li{
  position:relative; padding-left:20px;
  font-weight:400; font-size:.9375rem; line-height:1.5; color:#dfe2da;
}
.gh-sec .gh-opt__list li::before{ content:""; position:absolute; left:0; top:.55em; width:7px; height:7px; border-radius:50%; background:var(--gh-green-bright); }
.gh-sec .gh-plan{
  margin-top:24px; padding:clamp(24px,4vw,40px);
  border-radius:10px; box-shadow:inset 0 0 0 1px var(--gh-line);
  background:linear-gradient(132deg, #23302a 24%, #1a211f 76%);
}
/* ★ 主役：セキュリティプランを一番目立たせる（index.html は security-2 レイアウト） */
.gh-sec .gh-plan--hero{
  position:relative; margin-top:8px; margin-bottom:48px;
  padding:clamp(30px,4.5vw,56px);
  box-shadow:inset 0 0 0 2px var(--gh-green-bright), 0 26px 64px -28px rgba(63,154,89,.75);
  background:linear-gradient(132deg, #26362e 18%, #1b2320 82%);
}
.gh-sec .gh-plan__grid>div { margin-bottom: 4em; }

.gh-sec .gh-plan--hero .gh-plan__title{ font-size:clamp(1.5rem,4vw,1.85rem); }
.gh-sec .gh-plan--hero .gh-price__v .num{ font-size:2rem; }
.gh-sec .gh-plan--hero .gh-price__k{ color:#fff; }
.gh-sec .gh-plan__flag{
  position:absolute; top:0; left:clamp(20px,4vw,40px); transform:translateY(-50%);
  display:inline-flex; align-items:center; padding:6px 16px; border-radius:999px;
  background:var(--gh-green-bright); box-shadow:0 8px 20px -8px rgba(63,154,89,.85);
  font-weight:700; font-size:.75rem; letter-spacing:.06em; color:#fff;
}
/* 補足見出し */
.gh-sec .gh-sec__subhead{
  margin:0 0 16px; font-family:"Oswald",sans-serif; font-weight:600; font-size:.8125rem;
  letter-spacing:.16em; text-transform:uppercase; color:var(--gh-gray);
}
.gh-sec .gh-plan__eyebrow{ margin:0 0 8px; font-family:"Oswald",sans-serif; font-weight:400; font-size:.75rem; letter-spacing:.1em; text-transform:uppercase; color:var(--gh-gold); }
.gh-sec .gh-plan__title{ margin:0 0 16px; font-weight:900; font-size:1.35rem; line-height:1.25; color:#fff; }
.gh-sec .gh-tags{ display:flex; flex-wrap:wrap; gap:8px; }
.gh-sec .gh-tag{
  display:inline-flex; align-items:center; gap:6px; padding:3px 12px; border-radius:6px;
  background:rgba(63,154,89,.15);
  font-weight:700; font-size:.8125rem; color:var(--gh-green-bright);
}
.gh-sec .gh-tag small{ font-weight:400; font-size:.625rem; letter-spacing:-.04em; color:var(--gh-gray); }
.gh-sec .gh-prices{ display:flex; flex-wrap:wrap; align-items:center; justify-content:center; }
.gh-sec .gh-price{ flex:1 1 0; min-width:130px; text-align:center; padding:6px 10px; }
.gh-sec .gh-price__bd{ border-top: 1px solid var(--gh-muted); border-bottom: 1px solid var(--gh-muted); padding-block: 0.5em; margin-block: 0.5em; }
.gh-sec .gh-prices__plus{ flex:none; font-weight:400; font-size:1.625rem; color:var(--gh-body); padding:0 4px; }
.gh-sec .gh-price__k{ margin:0 0 12px; font-weight:700; font-size:1rem; color:var(--gh-body); }
.gh-sec .gh-price__m{ margin:0 0 6px; font-weight:700; font-size:.9375rem; color:var(--gh-body); }
.gh-sec .gh-price__v{ display:flex; align-items:baseline; justify-content:center; gap:3px; white-space:nowrap; }
.gh-sec .gh-price__v .approx,.gh-sec .gh-price__v .tax{ font-weight:400; font-size:.8125rem; color:var(--gh-body); }
.gh-sec .gh-price__v .num{ font-family: "Oswald", sans-serif; font-weight:900; font-size:1.6875rem; color:#fff; }
.gh-sec .gh-price__v .yen{ font-weight:700; font-size:.9375rem; color:#fff; }
.gh-sec .gh-plan__note{ margin:22px 0 0; font-weight:700; font-size:.9375rem; line-height:1.7; color:#fff; }
.gh-sec .gh-sec__foot{ margin:20px 2px 0; text-align:right; font-weight:400; font-size:.875rem; color:var(--gh-body); }
.gh-sec .fukidashi {
  position: absolute;
	top: -2.5em; left: 0; right: 0;
	background-color: var(--gh-accent);
	width: fit-content;
	margin-inline: auto;
	padding: 3px 14px;
	border-radius: 50px;
	color: var(--bs-highlight-color); font-size: 0.8em;
}
.gh-sec .fukidashi:after {
  content: "";
	position: absolute;
	top: 100%; left: 50%; transform: translateX(-50%);
	border-width: 7px 6px 0 6px; border-style: solid; border-color: var(--gh-accent) transparent transparent transparent;
}

@media (min-width:768px){
  .gh-sec{ padding-block:100px; }
  .gh-sec .bg-camera { right: 0; width: 500px; }
}
@media (min-width:992px){
  .gh-sec .gh-plan__grid{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.4fr); gap:32px; align-items:center; }
  .gh-sec .gh-plan__grid>div { margin-bottom: unset; }
  .gh-sec .gh-plan__note{ grid-column:1 / -1; }
}


/* =====================================================================
   Section - CASES
   ===================================================================== */
.gh-cases{
  --gh-cream:var(--gh-cream2);  /* アバター背景 */
  position:relative;
  background:#fff;
  padding-block:72px;
  overflow:hidden;
}
.gh-cases .gh-head{ max-width:820px; margin:0 auto 40px; }
.gh-cases .gh-eyebrow{ margin-bottom:14px; }
.gh-cases .gh-section-title{ margin-bottom:16px; }
/* cases: sub は共通 .gh-section-lead */
.gh-cases .gh-case{ align-items:center; }
.gh-cases .gh-case__imgs{ display:grid; grid-template-columns:1.33fr 1fr; gap:14px; }
.gh-cases .gh-case__imgs img{ display:block; width:100%; height:100%; object-fit:cover; border-radius:8px; }
/* case eyebrow は共通 .gh-eyebrow を使用 */
.gh-cases .gh-case__title{
  margin:0 0 18px;
  font-weight:900;
  font-size:clamp(1.375rem,4.8vw,1.75rem); line-height:1.45; color:var(--gh-heading);
}
.gh-cases .gh-case__body{
  margin:0 0 22px;
  font-weight:400;
  font-size:clamp(.875rem,3.6vw,.9375rem); line-height:1.85; color:var(--gh-muted);
}
.gh-cases .gh-case__tags{ display:flex; flex-wrap:wrap; gap:10px; }
.gh-cases .gh-tag{
  display:inline-flex; align-items:center; min-height:34px; padding:0 14px;
  border-radius:999px; background:#fff; box-shadow:inset 0 0 0 1px var(--gh-line);
  font-weight:400; font-size:.8125rem;
  letter-spacing:.02em; color:var(--gh-heading);
}
.gh-cases .gh-voice{ margin-top:72px; }
.gh-cases .gh-testi{
  height:100%; padding:29px 28px 26px;
  border-radius:10px; background:#fff; box-shadow:inset 0 0 0 1px var(--gh-line);
  display:flex; flex-direction:column;
}
.gh-cases .gh-testi__mark{ font-family:"Anton",sans-serif; font-size:3rem; line-height:.6; color:var(--gh-green); opacity:.18; }
.gh-cases .gh-testi__quote{
  margin:14px 0 24px; flex:1 1 auto;
  font-weight:400;
  font-size:.9375rem; line-height:1.7; color:var(--gh-heading);
}
.gh-cases .gh-testi__person{ display:flex; align-items:center; gap:12px; padding-top:20px; border-top:1px solid var(--gh-line); }
.gh-cases .gh-testi__avatar{
  flex:none; width:42px; height:42px; border-radius:50%; background:var(--gh-cream);
  display:flex; align-items:center; justify-content:center;
  font-family:"Oswald",sans-serif; font-weight:700; font-size:1rem; color:var(--gh-green);
}
.gh-cases .gh-testi__name{ margin:0; font-weight:700; font-size:.9375rem; color:var(--gh-heading); }
.gh-cases .gh-testi__cat{ margin:0; font-weight:400; font-size:.78125rem; color:var(--gh-muted); }
@media (min-width:768px){ .gh-cases{ padding-block:100px; } }
@media (max-width:991.98px){
  .gh-cases .gh-case__imgs{ margin-bottom:32px; max-width:560px; }
}


/* =====================================================================
   Section - チラ見せ  (Swiper 併用)
   ===================================================================== */
.gh-peek{
  position:relative;
  background:var(--gh-cream);
  padding-top:56px; padding-bottom:60px;
  overflow:hidden;
}
.gh-peek .cover-img {
  position: absolute;
  top: 0;
  left: -30%;
  z-index: 1;
  height: stretch;
  overflow: hidden;
}
.gh-peek .gh-peek__head{ position:relative; z-index:1; margin:0 0 32px; }
.gh-peek .gh-eyebrow{ margin-bottom:12px; }
.gh-peek .gh-section-title{ margin:0; font-size:clamp(1.625rem,6.6vw,2.6rem); line-height:1.25; }
.gh-peek .gh-peek__swiper{ position:relative; z-index:1; overflow:visible; }
.gh-peek .gh-peek__swiper .swiper-wrapper{ transition-timing-function:linear !important; }
.gh-peek .gh-peek__swiper .swiper-slide{ width:min(74vw,410px); height:auto; }
.gh-peek .gh-peek__item{ width:100%; aspect-ratio:1; background:#d9d9d9; overflow:hidden; }
.gh-peek .gh-peek__item img{ display:block; width:100%; height:100%; object-fit:cover; }
@media (min-width:768px){
  .gh-peek{ padding-top:72px; padding-bottom:80px; }
  .gh-peek .gh-peek__swiper .swiper-slide{ width:410px; }
  .gh-peek .gh-peek__arc{ right:-11%; top:-64%; width:85%; }
  .gh-peek .cover-img { left: 0; }
}


/* =====================================================================
   Section - FAQ
   ===================================================================== */
.gh-faq{
  position:relative;
  background:var(--gh-cream2);
  padding-block:72px;
}
.gh-faq .gh-faq__head{ max-width:820px; margin:0 auto 40px; }
.gh-faq .gh-eyebrow{ margin-bottom:14px; }
.gh-faq .gh-section-title{ margin:0; }
.gh-faq .gh-faq__list{ display:flex; flex-direction:column; gap:14px; }
.gh-faq .gh-faq__item{ background:#fff; border-radius:10px; box-shadow:inset 0 0 0 1px var(--gh-line); overflow:hidden; }
.gh-faq .gh-faq__item summary{
  display:flex; align-items:center; gap:16px; cursor:pointer; list-style:none;
  padding:22px 24px;
  font-weight:700;
  font-size:clamp(.9375rem,4vw,1.0625rem); line-height:1.5; color:var(--gh-heading);
}
.gh-faq .gh-faq__item summary::-webkit-details-marker{ display:none; }
.gh-faq .gh-faq__q{
  flex:none; width:30px; height:30px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:var(--gh-green); color:#fff;
  font-family:"Oswald",sans-serif; font-weight:700; font-size:.9375rem;
}
.gh-faq .gh-faq__qt{ flex:1 1 auto; }
.gh-faq .gh-faq__plus{ flex:none; position:relative; width:18px; height:18px; transition:transform .25s ease; }
.gh-faq .gh-faq__plus::before,.gh-faq .gh-faq__plus::after{ content:""; position:absolute; background:var(--gh-green); border-radius:2px; }
.gh-faq .gh-faq__plus::before{ left:0; top:8px; width:18px; height:2px; }
.gh-faq .gh-faq__plus::after{ left:8px; top:0; width:2px; height:18px; }
.gh-faq .gh-faq__item[open] .gh-faq__plus::after{ opacity:0; }
.gh-faq .gh-faq__a{
  padding:0 24px 24px 70px;
  font-weight:400;
  font-size:clamp(.875rem,3.6vw,.9375rem); line-height:1.8; color:var(--gh-muted);
}
@media (min-width:768px){ .gh-faq{ padding-block:100px; } }


/* =====================================================================
   Section - 施工アイディア  (Swiper 併用)
   ===================================================================== */
.gh-idea{
  position:relative;
  /*padding-top:56px; padding-bottom:60px;*/
  overflow:hidden;
}
.gh-idea .gh-idea__head{ position:relative; z-index:1; margin:0 0 32px; }
.gh-idea .gh-eyebrow{ margin-bottom:12px; }
.gh-idea .gh-eyebrow::after{ content:""; width:26px; height:2px; background:var(--gh-green); }
.gh-idea .gh-idea__swiper{ position:relative; z-index:1; overflow:visible; }
.gh-idea .gh-idea__swiper .swiper-wrapper{ transition-timing-function:linear !important; }
.gh-idea .gh-idea__swiper .swiper-slide{ width:min(74vw,310px); height:auto; }
.gh-idea .gh-idea__item{ width:100%; aspect-ratio:1; background:#d9d9d9; overflow:hidden; }
.gh-idea .gh-idea__item img{ display:block; width:100%; height:100%; object-fit:cover; }
@media (min-width:768px){
  /*.gh-idea{ padding-top:72px; padding-bottom:80px; }*/
  .gh-idea .gh-idea__swiper .swiper-slide{ width:310px; }
}


/* =====================================================================
   Section - CTA / CONTACT
   ===================================================================== */
.gh-contact{
  --gh-line:var(--gh-line-dark);  /* このセクションは濃色罫線 */
  position:relative;
  background:var(--gh-ink);
  color:#fff;
  padding-block:72px;
  overflow:hidden;
}
.gh-contact .gh-eyebrow{ color:var(--gh-green-bright); }
.gh-contact .gh-section-title{ font-size:clamp(1.75rem,6.4vw,2.75rem); color:#fff; }
.gh-contact .gh-section-title em{ color:var(--gh-green-bright); }
.gh-contact .gh-contact__lead{
  margin:0 0 30px;
  font-weight:400;
  font-size:clamp(.875rem,3.6vw,.9375rem); line-height:1.85; color:var(--gh-body);
}
/* d-flex gap-3 mb-3 はHTML側クラスで付与 */
.gh-contact .gh-qr{
  flex:1 1 0; display:flex; flex-direction:column; align-items:center; text-align:center;
  padding:20px 16px; border-radius:10px; text-decoration:none;
  background:rgba(255,255,255,.04); box-shadow:inset 0 0 0 1px var(--gh-line);
  transition:background-color .15s ease, transform .15s ease;
}
.gh-contact .gh-qr:hover{ background:rgba(255,255,255,.08); transform:translateY(-2px); }
.gh-contact .gh-qr__img{ width:100%; max-width:150px; aspect-ratio:1; border-radius:8px; background:#fff; padding:12px; }
.gh-contact .gh-qr__img img{ display:block; width:100%; height:100%; object-fit:contain; }
.gh-contact .gh-qr__cap{ margin:14px 0 2px; font-weight:400; font-size:.75rem; letter-spacing:.05em; color:var(--gh-gray); }
.gh-contact .gh-qr__name{ font-weight:700; font-size:1rem; color:#fff; margin-block-start: 1em; }
.gh-contact .gh-qr-hint{ margin:0 0 20px; font-weight:400; font-size:.78125rem; color:var(--gh-gray); }
.gh-contact .gh-tel{
  display:flex; align-items:center; gap:16px;
  padding:16px 20px; border-radius:10px; text-decoration:none;
  background:rgba(255,255,255,.04); box-shadow:inset 0 0 0 1px var(--gh-line);
}
.gh-contact .gh-tel:hover{ background:rgba(255,255,255,.08); }
.gh-contact .gh-tel__ic{ flex:none; width:44px; height:44px; border-radius:10px; background:var(--gh-green); display:flex; align-items:center; justify-content:center; color:#fff; }
.gh-contact .gh-tel__ic svg{ width:22px; height:22px; }
.gh-contact .gh-tel__num{ display:block; font-family:"Oswald",sans-serif; font-weight:600; font-size:clamp(1.25rem,5vw,1.5625rem); letter-spacing:.02em; color:#fff; }
.gh-contact .gh-tel__note{ display:block; font-weight:400; font-size:.75rem; color:var(--gh-gray); }
.gh-contact .gh-form{ background:#fff; color:var(--gh-ink); border-radius:12px; padding:clamp(24px,4vw,36px); }
.gh-contact .gh-form__title{ margin:0 0 6px; font-weight:900; font-size:1.25rem; color:var(--gh-ink); }
.gh-contact .gh-form__sub{ margin:0 0 22px; font-weight:400; font-size:.8125rem; color:var(--gh-muted); }
.gh-contact .gh-field{ margin-bottom:16px; }
.gh-contact .gh-field label{ display:flex; align-items:center; gap:8px; margin-bottom:7px; font-weight:700; font-size:.875rem; color:var(--gh-ink); }
.gh-contact .gh-req{ font-weight:700; font-size:.625rem; padding:2px 7px; border-radius:4px; background:rgba(44,122,67,.12); color:var(--gh-green); }
.gh-contact .gh-field input,.gh-contact .gh-field select,.gh-contact .gh-field textarea{
  width:100%; padding:12px 14px; border-radius:8px;
  border:1px solid #d7d3c8; background:#fbfaf7;
  font-weight:400; font-size:.9375rem; color:var(--gh-ink);
}
.gh-contact .gh-field input:focus,.gh-contact .gh-field select:focus,.gh-contact .gh-field textarea:focus{ outline:none; border-color:var(--gh-green); box-shadow:0 0 0 3px rgba(44,122,67,.14); background:#fff; }
.gh-contact .gh-field textarea{ min-height:110px; resize:vertical; }
.gh-contact .gh-field--row2{ display:grid; grid-template-columns:1fr; gap:16px; }
.gh-contact .gh-submit{
  width:100%; min-height:56px; border:none; border-radius:8px; cursor:pointer;
  background:var(--gh-green); color:#fff;
  font-weight:700; font-size:1.0625rem; letter-spacing:.04em;
  transition:background-color .15s ease, transform .15s ease;
}
.gh-contact .gh-submit:hover{ background:var(--gh-green-dark); transform:translateY(-2px); }
.gh-contact .gh-privacy{ margin:14px 0 0; font-weight:400; font-size:.75rem; line-height:1.6; color:var(--gh-muted); text-align:center; }
.gh-contact .gh-form__success{ display:none; text-align:center; padding:20px 0; }
.gh-contact .gh-form__success.is-visible{ display:block; }
.gh-contact .gh-form__success .ico{ width:56px; height:56px; margin:0 auto 16px; border-radius:50%; background:rgba(44,122,67,.12); display:flex; align-items:center; justify-content:center; }
.gh-contact .gh-form__success .ico svg{ width:28px; height:28px; fill:none; stroke:var(--gh-green); stroke-width:2.4; stroke-linecap:round; stroke-linejoin:round; }
.gh-contact .gh-form__success h3{ margin:0 0 8px; font-weight:900; font-size:1.1875rem; color:var(--gh-ink); }
.gh-contact .gh-form__success p{ margin:0; font-weight:400; font-size:.875rem; line-height:1.7; color:var(--gh-muted); }
@media (min-width:768px){
  .gh-contact{ padding-block:100px; }
  .gh-contact .gh-field--row2{ grid-template-columns:1fr 1fr; }
}


/* =====================================================================
   Footer - FOOTER
   ===================================================================== */
.gh-footer{
  --gh-body:#b3b6ad;  /* フッター本文グレー */
  background:#0f1315;
  color:#fff;
  padding-top:60px;
}
.gh-footer .gh-footer__top{ display:grid; grid-template-columns:1fr; gap:36px; padding-bottom:40px; }
.gh-footer .gh-footer__brand img{ width: 80%; margin:0 0 16px; }
.gh-footer .gh-footer__brand p{
  margin:0; max-width:34em;
  font-weight:400; font-size:.875rem; line-height:1.85; color:var(--gh-body);
}
.gh-footer .gh-footer__h{
  margin:0 0 16px;
  font-family:"Oswald",sans-serif; font-weight:600; font-size:.78125rem; letter-spacing:.16em; text-transform:uppercase; color:var(--gh-green-bright);
}
.gh-footer .gh-footer__menu{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:12px; }
.gh-footer .gh-footer__menu a{ font-weight:400; font-size:.875rem; color:var(--gh-body); text-decoration:none; }
.gh-footer .gh-footer__menu a:hover{ color:#fff; }
.gh-footer .gh-footer__info{ font-weight:400; font-size:.8125rem; line-height:1.95; color:var(--gh-body); }
.gh-footer .gh-footer__info b{ color:#fff; font-weight:700; }
.gh-footer .gh-footer__bottom{
  display:flex; flex-direction:column; gap:12px; align-items:flex-start;
  padding:22px 0 28px; border-top:1px solid var(--gh-line-dark);
}
.gh-footer .gh-footer__copy{ font-weight:400; font-size:.75rem; color:#7d827a; }
.gh-footer .gh-footer__links{ display:flex; flex-wrap:wrap; gap:20px; }
.gh-footer .gh-footer__links a{ font-weight:400; font-size:.78125rem; color:var(--gh-body); text-decoration:none; }
.gh-footer .gh-footer__links a:hover{ color:#fff; }
@media (min-width:768px){
  .gh-footer{ padding-top:80px; }
  .gh-footer .gh-footer__top{ grid-template-columns:1.6fr 1fr 1.4fr; gap:48px; padding-bottom:52px; }
  .gh-footer .gh-footer__bottom{ flex-direction:row; align-items:center; justify-content:space-between; }
}


/* =======================================================================
   Section - CTA
   ===================================================================== */
.gh-cta{
  --gh-line:var(--gh-line-dark);  /* このセクションは濃色罫線 */
  position:relative;
  background:#2d3436;
  color:#fff;
  padding-block:56px;
}
.gh-cta .gh-eyebrow{ margin-bottom:14px; color:var(--gh-green-bright); }
.gh-cta .gh-section-title{ margin-bottom:10px; font-size:clamp(1.5rem,5.5vw,2rem); color:#fff; }
.gh-cta .gh-cta__sub{
  font-weight:400;
  font-size:clamp(.8125rem,3.4vw,.9375rem); line-height:1.7; color:#cdd0c8;
}

/* --- アクションボタン --- d-flex flex-column flex-md-row gap-3 はHTML側 */
.gh-cta .gh-act{
  display:flex; align-items:center; gap:16px; flex:1 1 0;
  min-height:92px; padding:0 22px; border-radius:10px; text-decoration:none;
  background:rgba(255,255,255,.04); box-shadow:inset 0 0 0 1px var(--gh-line);
  transition:background-color .15s ease, transform .15s ease;
}
.gh-cta .gh-act:hover{ background:rgba(255,255,255,.08); transform:translateY(-2px); }
.gh-cta .gh-act--form{ background:rgba(233,185,73,.46); }
.gh-cta .gh-act--form:hover{ background:rgba(233,185,73,.58); }
.gh-cta .gh-act__ic{
  flex:none; width:50px; height:50px; border-radius:10px; background:var(--gh-green);
  display:flex; align-items:center; justify-content:center; color:#fff;
}
.gh-cta .gh-act__ic svg{ width:26px; height:26px; }
.gh-cta .gh-act__body{ flex:1 1 auto; min-width:0; }
.gh-cta .gh-act__cap{ display:block; font-weight:400; font-size:.75rem; letter-spacing:.06em; color:#a9a89c; }
.gh-cta .gh-act__title{ display:block; font-weight:900; font-size:clamp(1.1875rem,4.6vw,1.3rem); letter-spacing:.02em; color:#fff; }
.gh-cta .gh-act__tel{ display:block; font-family:"Oswald",sans-serif; font-weight:600; font-size:clamp(1.25rem,5vw,1.325rem); letter-spacing:.02em; color:#fff; }
.gh-cta .gh-act__arrow{ flex:none; font-size:1.1875rem; color:#a9a89c; }

/* --- QRカード --- d-flex gap-3 はHTML側 */
.gh-cta .gh-qr{
  flex:1 1 0; display:flex; flex-direction:column; align-items:center; text-align:center;
  padding:24px 18px; border-radius:10px; text-decoration:none;
  background:rgba(255,255,255,.04); box-shadow:inset 0 0 0 1px var(--gh-line);
  transition:background-color .15s ease, transform .15s ease;
}
.gh-cta .gh-qr:hover{ background:rgba(255,255,255,.08); transform:translateY(-2px); }
.gh-cta .gh-qr__img{
  width:100%; max-width:200px; aspect-ratio:1; border-radius:8px; background:#fff; padding:14px;
  position:relative;
}
.gh-cta .gh-qr__img img{ display:block; width:100%; height:100%; object-fit:contain; }
.gh-cta .gh-qr__handle{
  position:absolute; left:0; right:0; bottom:10px;
  font-weight:700; font-size:.8125rem; color:#da5d19;
}
.gh-cta .gh-qr__cap{ margin:16px 0 2px; font-weight:400; font-size:.75rem; letter-spacing:.06em; color:#a9a89c; }
.gh-cta .gh-qr__name{ font-weight:700; font-size:1.0625rem; color:#fff;  margin-block-start: 1em; }

@media (min-width:768px){
  .gh-cta{ padding-block:72px; }
}


/* =====================================================================
   Contact Form 7 対応（独自フォームデザインを維持するための調整）
   ===================================================================== */
/* CF7が各入力を包む span を block 化し、input/select/textarea の width:100% を効かせる */
.gh-contact .wpcf7-form-control-wrap{ display:block; }
/* CF7が自動で入れる段落の余白を殺す（レイアウト崩れ防止） */
.gh-contact .wpcf7-form p{ margin:0; }
/* 送信中スピナー位置 */
.gh-contact .wpcf7-spinner{ display:block; margin:10px auto 0; }
/* バリデーションメッセージ */
.gh-contact .wpcf7-not-valid-tip{ font-size:.75rem; margin-top:6px; }
.gh-contact .gh-field input.wpcf7-not-valid,
.gh-contact .gh-field select.wpcf7-not-valid,
.gh-contact .gh-field textarea.wpcf7-not-valid{ border-color:#d33; }
/* 送信後の応答メッセージ */
.gh-contact .wpcf7-response-output{ margin:14px 0 0; padding:12px 14px; border-radius:8px; font-size:.85rem; }