/* =====================================================================
   株式会社GReen — Design System (scoped to .greentokyo)
   SWELL child theme / additional.css
   Source of truth: site-build/CONTRACT.md
   すべて .greentokyo にスコープ。例外はヘッダーお問い合わせボタン(§7)のみ。
   ===================================================================== */

/* ---------------------------------------------------------------------
   1. デザイントークン + ベース
   --------------------------------------------------------------------- */
.greentokyo{
  --green:#4CAF50;
  --green-d:#2E7D32;
  --green-l:#EAF6EC;
  --pink:#FF7BA7;
  --pink-d:#F0568C;
  --ink:#232A25;
  --sub:#5C6B60;
  --line:#E2E9E3;
  --white:#FFFFFF;
  --paper:#FBFDFB;
  --radius:16px;
  --radius-sm:10px;
  --shadow:0 14px 40px rgba(31,60,40,.08);
  --shadow-sm:0 6px 18px rgba(31,60,40,.06);
  --maxw:1120px;

  position:relative;
  background:var(--white);
  color:var(--ink);
  font-family:"Noto Sans JP", sans-serif;
  font-weight:400;
  line-height:1.9;
  letter-spacing:.02em;

  /* フルブリード */
  width:100vw;
  max-width:100vw;
  margin-left:calc(50% - 50vw);
  overflow:hidden;
}

.greentokyo *,
.greentokyo *::before,
.greentokyo *::after{ box-sizing:border-box; }

.greentokyo img{ max-width:100%; height:auto; }

.greentokyo a{ color:var(--green-d); text-decoration:none; }
.greentokyo a:hover{ text-decoration:underline; }

/* 見出し共通 */
.greentokyo h1,
.greentokyo h2,
.greentokyo h3,
.greentokyo h4{
  font-family:"Noto Sans JP", sans-serif;
  line-height:1.35;
  letter-spacing:.02em;
  color:var(--ink);
  margin:0;
}

/* SWELL / Gutenberg 対策：group の内側ラッパー箱を消す */
.greentokyo .wp-block-group__inner-container{ display:contents; }

/* ---------------------------------------------------------------------
   コンテナ / セクション帯
   --------------------------------------------------------------------- */
.greentokyo .container{
  max-width:var(--maxw);
  margin-inline:auto;
  padding-inline:clamp(20px,5vw,32px);
  width:100%;
}

.greentokyo .section{
  padding-block:clamp(56px,8vw,112px);
}
.greentokyo .section.pad-sm{
  padding-block:clamp(32px,5vw,56px);
}
.greentokyo .section.tint{
  background:var(--green-l);
}
.greentokyo .section.dark{
  background:var(--green-d);
  color:var(--white);
}
/* ダーク帯：子の補助テキスト・見出しを白系に上書き */
.greentokyo .section.dark h1,
.greentokyo .section.dark h2,
.greentokyo .section.dark h3,
.greentokyo .section.dark h4,
.greentokyo .section.dark p,
.greentokyo .section.dark .sec-title,
.greentokyo .section.dark .sec-lead{
  color:var(--white);
}
.greentokyo .section.dark .eyebrow{
  color:#CFEBD3;
}

/* セクション内は container 幅に収める（.section 直下の要素） */
.greentokyo .section .sec-head,
.greentokyo .section .cards,
.greentokyo .section .rep,
.greentokyo .section .rep-full,
.greentokyo .section .biz-cards,
.greentokyo .section .flow,
.greentokyo .section .faq-list,
.greentokyo .section .spec,
.greentokyo .section .legal,
.greentokyo .section .form,
.greentokyo .section .sns,
.greentokyo .section .wp-block-table,
.greentokyo .section > .wp-block-buttons,
.greentokyo .section .member-cta{
  max-width:var(--maxw);
  margin-inline:auto;
  padding-inline:clamp(20px,5vw,32px);
  width:100%;
}

/* ---------------------------------------------------------------------
   2/3. 見出しブロック
   --------------------------------------------------------------------- */
.greentokyo .sec-head{
  margin-bottom:clamp(28px,4vw,48px);
}
.greentokyo .eyebrow{
  font-family:"Montserrat", sans-serif;
  font-weight:700;
  font-size:.82rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--green);
  line-height:1.4;
  margin:0 0 .6em;
}
.greentokyo .sec-title{
  font-size:clamp(1.6rem,3.6vw,2.4rem);
  font-weight:900;
  line-height:1.3;
  color:var(--ink);
  margin:0 0 .4em;
}
.greentokyo .sec-title em,
.greentokyo .sec-title strong{
  color:var(--green-d);
  font-style:normal;
}
.greentokyo .sec-lead{
  color:var(--sub);
  font-size:1rem;
  margin:.6em 0 0;
  max-width:64ch;
}

/* ---------------------------------------------------------------------
   3. ボタン（core wp:button）
   --------------------------------------------------------------------- */
.greentokyo .wp-block-button{ margin:0; }
.greentokyo .wp-block-buttons{
  gap:14px;
  margin-top:clamp(20px,3vw,32px);
}
.greentokyo .wp-block-button__link{
  display:inline-block;
  background:var(--green);
  color:var(--white);
  font-family:"Noto Sans JP", sans-serif;
  font-weight:700;
  letter-spacing:.03em;
  border:2px solid var(--green);
  border-radius:999px;
  padding:.85em 2em;
  line-height:1.5;
  box-shadow:var(--shadow-sm);
  transition:background .25s ease, transform .25s ease, box-shadow .25s ease, color .25s ease, border-color .25s ease;
}
.greentokyo .wp-block-button__link:hover{
  background:var(--green-d);
  border-color:var(--green-d);
  color:var(--white);
  transform:translateY(-2px);
  box-shadow:var(--shadow);
  text-decoration:none;
}

/* 枠：ghost */
.greentokyo .wp-block-button.ghost .wp-block-button__link{
  background:transparent;
  color:var(--green-d);
  border-color:var(--green);
  box-shadow:none;
}
.greentokyo .wp-block-button.ghost .wp-block-button__link:hover{
  background:var(--green);
  color:var(--white);
  border-color:var(--green);
}

/* 白：light（ダーク帯の上） */
.greentokyo .wp-block-button.light .wp-block-button__link{
  background:var(--white);
  color:var(--green-d);
  border-color:var(--white);
}
.greentokyo .wp-block-button.light .wp-block-button__link:hover{
  background:var(--green-l);
  color:var(--green-d);
  border-color:var(--green-l);
}

/* ピンク：pink */
.greentokyo .wp-block-button.pink .wp-block-button__link{
  background:var(--pink);
  color:var(--white);
  border-color:var(--pink);
}
.greentokyo .wp-block-button.pink .wp-block-button__link:hover{
  background:var(--pink-d);
  border-color:var(--pink-d);
  color:var(--white);
}

/* 素の <a class="btn/ghost/light/pink"> 用（wp:html 内など） */
.greentokyo a.btn,
.greentokyo a.ghost,
.greentokyo a.light,
.greentokyo a.pink{
  display:inline-block;
  font-family:"Noto Sans JP", sans-serif;
  font-weight:700;
  letter-spacing:.03em;
  border-radius:999px;
  padding:.85em 2em;
  line-height:1.5;
  border:2px solid transparent;
  transition:background .25s ease, transform .25s ease, box-shadow .25s ease, color .25s ease, border-color .25s ease;
}
.greentokyo a.btn{
  background:var(--green); color:var(--white);
  border-color:var(--green); box-shadow:var(--shadow-sm);
}
.greentokyo a.btn:hover{
  background:var(--green-d); border-color:var(--green-d);
  color:var(--white); transform:translateY(-2px);
  box-shadow:var(--shadow); text-decoration:none;
}
.greentokyo a.ghost{
  background:transparent; color:var(--green-d); border-color:var(--green);
}
.greentokyo a.ghost:hover{
  background:var(--green); color:var(--white); text-decoration:none;
}
.greentokyo a.light{
  background:var(--white); color:var(--green-d); border-color:var(--white);
}
.greentokyo a.light:hover{
  background:var(--green-l); text-decoration:none;
}
.greentokyo a.pink{
  background:var(--pink); color:var(--white); border-color:var(--pink);
}
.greentokyo a.pink:hover{
  background:var(--pink-d); border-color:var(--pink-d);
  color:var(--white); text-decoration:none;
}

/* ---------------------------------------------------------------------
   画像フレーム（切り抜き）
   --------------------------------------------------------------------- */
/* 画像フレーム：比率は img 自身に aspect-ratio で持たせる（絶対配置を使わない）。
   絶対配置＋親aspect-ratio方式はスマホで高さが潰れて画像が消えることがあったため、
   width:100% + aspect-ratio + object-fit:cover のロバストな方式に変更。 */
.greentokyo .figure{
  overflow:hidden;
  border-radius:var(--radius);
  background:var(--green-l);
  box-shadow:var(--shadow-sm);
  line-height:0;
}
.greentokyo .figure .wp-block-image{ margin:0; }
.greentokyo .figure .wp-block-image,
.greentokyo .figure .wp-block-image img{
  display:block;
  width:100%!important;
  height:auto!important;
}
.greentokyo .figure .wp-block-image img{ object-fit:cover; }
.greentokyo .figure.r169 .wp-block-image img{ aspect-ratio:16/9; }
.greentokyo .figure.r43  .wp-block-image img{ aspect-ratio:4/3; }
.greentokyo .figure.r11  .wp-block-image img{ aspect-ratio:1/1; }
.greentokyo .figure.r34  .wp-block-image img{ aspect-ratio:3/4; }
.greentokyo .figure.r43v .wp-block-image img{ aspect-ratio:3/4; }
.greentokyo .figure.r32  .wp-block-image img{ aspect-ratio:3/2; }
.greentokyo .figure.r23  .wp-block-image img{ aspect-ratio:2/3; }

/* ---------------------------------------------------------------------
   カード（grid）
   --------------------------------------------------------------------- */
.greentokyo .cards{
  display:grid;
  grid-template-columns:1fr;
  gap:clamp(20px,3vw,32px);
  align-items:stretch;      /* 枠の高さを揃える */
}
.greentokyo .cards.col2{ grid-template-columns:repeat(2,1fr); }
.greentokyo .cards.col3{ grid-template-columns:repeat(3,1fr); }

.greentokyo .card{
  background:var(--white);
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow-sm);
  padding:clamp(20px,2.6vw,30px);
  height:100%;              /* グリッド行いっぱいに伸ばして四角枠を揃える */
  transition:transform .3s ease, box-shadow .3s ease;
}
.greentokyo .card:hover{
  transform:translateY(-4px);
  box-shadow:var(--shadow);
}
/* サービスカードのアイコン（インラインSVG）— 中央表示 */
.greentokyo .card-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  width:60px;
  height:60px;
  border-radius:16px;
  background:var(--green-l);
  color:var(--green-d);
  margin:0 auto 16px;
}
.greentokyo .card-icon svg{ width:32px; height:32px; stroke:currentColor; fill:none; }
.greentokyo .biz-card .card-icon{
  width:54px; height:54px; border-radius:14px; margin-bottom:12px;
}

/* ---------------------------------------------------------------------
   6. ヒーロー（TOP FV / wp:html）
   --------------------------------------------------------------------- */
/* ヒーローは標準の wp:cover ブロックで構築（編集画面でも表示される） */
/* 高さは「画面幅」に連動させる。coverブロックが style="min-height:600px" を
   インラインで出力するため、!important で上書きする必要がある。
   幅が広いほど高さも伸びるので、ワイドディスプレイでも上下の切れが最小になる。 */
.greentokyo .hero{
  position:relative;
  min-height:clamp(520px,46vw,900px) !important;
  display:flex;
  align-items:center;
  overflow:hidden;
}
.greentokyo .hero.wp-block-cover{ padding:0; }
/* cover の背景画像 */
/* 切り抜きの基準位置を上寄りに。人物の顔は画像の上〜中央（高さの約20〜45%）に
   あるため、中央基準だと広い画面で頭が切れる。25%基準にして顔を優先的に残す。 */
.greentokyo .hero .wp-block-cover__image-background{
  object-fit:cover;
  object-position:center 25%;
}

/* オーバーレイと本文は必ず画像レイヤーより前面に */
.greentokyo .hero .wp-block-cover__background{ z-index:1; }
.greentokyo .hero .wp-block-cover__inner-container{ z-index:2; }

/* ヒーロー内テキストは読み込み後すぐ、順に上からふわっと表示 */
.greentokyo .hero__eyebrow,
.greentokyo .hero__title,
.greentokyo .hero__sub,
.greentokyo .hero .wp-block-buttons{
  animation:gtHeroText .8s cubic-bezier(.22,.61,.36,1) both;
}
.greentokyo .hero__eyebrow{ animation-delay:.05s; }
.greentokyo .hero__title  { animation-delay:.16s; }
.greentokyo .hero__sub    { animation-delay:.27s; }
.greentokyo .hero .wp-block-buttons{ animation-delay:.38s; }
@keyframes gtHeroText{
  from{ opacity:0; transform:translateY(-14px); }
  to  { opacity:1; transform:none; }
}
/* 可読性オーバーレイ（cover の dim を左下がりグラデで上書き） */
.greentokyo .hero .wp-block-cover__background{
  background:linear-gradient(115deg,
     rgba(20,40,26,.66) 0%,
     rgba(20,40,26,.42) 42%,
     rgba(20,40,26,.12) 72%,
     rgba(20,40,26,0) 100%) !important;
  opacity:1 !important;
}
/* 中身：コンテナ幅・左寄せ・白文字 */
.greentokyo .hero .wp-block-cover__inner-container{
  max-width:var(--maxw) !important;
  width:100%;
  margin:0 auto !important;
  padding:0 clamp(20px,5vw,40px);
  color:#fff;
  text-align:left;
}
.greentokyo .hero__eyebrow{
  font-family:"Montserrat", sans-serif;
  font-weight:700;
  letter-spacing:.16em;
  text-transform:uppercase;
  font-size:.9rem;
  margin:0 0 .8em;
  color:#fff;
  opacity:.92;
}
.greentokyo .hero__title{
  color:#fff;
  font-weight:900;
  line-height:1.28;
  letter-spacing:.03em;
  font-size:clamp(1.9rem,5.4vw,3.4rem);
  margin:0 0 .5em;
  text-shadow:0 2px 18px rgba(0,0,0,.28);
}
.greentokyo .hero__sub{
  color:#fff;
  font-size:clamp(.98rem,1.6vw,1.12rem);
  max-width:40ch;
  margin:0 0 1.8em;
  opacity:.96;
  text-shadow:0 1px 12px rgba(0,0,0,.3);
}
.greentokyo .hero__cta{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
}
/* hero専用 白枠ボタン */
.greentokyo .hero .ghost-btn{
  display:inline-block;
  background:transparent;
  color:#fff;
  border:2px solid rgba(255,255,255,.85);
  border-radius:999px;
  padding:.85em 2em;
  font-weight:700;
  letter-spacing:.03em;
  line-height:1.5;
  transition:background .25s ease, color .25s ease, transform .25s ease;
}
.greentokyo .hero .ghost-btn:hover{
  background:#fff;
  color:var(--green-d);
  transform:translateY(-2px);
  text-decoration:none;
}

/* ---------------------------------------------------------------------
   ページヒーロー（下層ページ・緑グラデ帯）
   --------------------------------------------------------------------- */
.greentokyo .page-hero{
  background:linear-gradient(135deg,var(--green) 0%,var(--green-d) 100%);
  color:#fff;
  text-align:center;
  padding-block:clamp(64px,10vw,120px);
  padding-inline:clamp(20px,5vw,32px);
}
.greentokyo .page-hero .eyebrow{
  color:#DFF3E2;
  justify-content:center;
}
.greentokyo .page-hero h1{
  color:#fff;
  font-weight:900;
  font-size:clamp(1.9rem,4.4vw,2.8rem);
  margin:.1em 0 .3em;
}
.greentokyo .page-hero p,
.greentokyo .page-hero .sec-lead{
  color:#EAF6EC;
  max-width:60ch;
  margin-inline:auto;
}

/* ---------------------------------------------------------------------
   2事業紹介（.biz-cards / .biz-card）
   --------------------------------------------------------------------- */
.greentokyo .biz-cards{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:clamp(24px,3vw,36px);
}
.greentokyo .biz-card{
  background:var(--white);
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow-sm);
  overflow:hidden;
  display:flex;
  flex-direction:column;
  transition:transform .3s ease, box-shadow .3s ease;
}
.greentokyo .biz-card:hover{
  transform:translateY(-4px);
  box-shadow:var(--shadow);
}
.greentokyo .biz-card .figure{
  border-radius:0;
  box-shadow:none;
}
.greentokyo .biz-card .eyebrow{
  margin-top:clamp(20px,2.4vw,26px);
  padding-inline:clamp(20px,2.4vw,28px);
}
.greentokyo .biz-card h3,
.greentokyo .biz-card .sec-title{
  font-size:clamp(1.2rem,2.2vw,1.5rem);
  font-weight:900;
  color:var(--ink);
  padding-inline:clamp(20px,2.4vw,28px);
  margin:.1em 0 .3em;
}
.greentokyo .biz-card p{
  color:var(--sub);
  padding-inline:clamp(20px,2.4vw,28px);
  margin:.2em 0 0;
}
.greentokyo .biz-card .wp-block-buttons,
.greentokyo .biz-card .wp-block-button{
  padding-inline:clamp(20px,2.4vw,28px);
}
.greentokyo .biz-card .wp-block-buttons{
  margin-top:auto;
  padding-block:clamp(18px,2.4vw,26px);
}
/* 事業01 ゴルフをやや主役に（アクセントボーダー） */
.greentokyo .biz-card.golf{
  border-top:4px solid var(--green);
}
.greentokyo .biz-card.food{
  border-top:4px solid var(--pink);
}

/* ---------------------------------------------------------------------
   サービスページ用：事業イントロ（画像＋テキスト2カラム）
   画像は縦写真を適正比率で「小さめ」に。単独画像は中央寄せで最大幅を制限。
   --------------------------------------------------------------------- */
.greentokyo .svc-intro{
  display:grid;
  grid-template-columns:minmax(0,0.85fr) minmax(0,1.15fr);
  gap:clamp(24px,4vw,52px);
  align-items:center;
}
.greentokyo .svc-intro.rev{ grid-template-columns:minmax(0,1.15fr) minmax(0,0.85fr); }
.greentokyo .svc-intro .figure{ max-width:400px; width:100%; margin-inline:auto; }
.greentokyo .svc-media{ max-width:460px; margin-inline:auto; }
.greentokyo .svc-icon{
  display:inline-flex; align-items:center; justify-content:center;
  width:46px; height:46px; border-radius:12px;
  background:var(--green-l); color:var(--green-d); margin-bottom:12px;
}
.greentokyo .svc-icon svg{ width:26px; height:26px; stroke:currentColor; fill:none; }
.greentokyo .biz-tag{
  display:inline-block; font-weight:700; font-size:.8rem; letter-spacing:.06em;
  color:var(--green-d); background:var(--green-l);
  padding:.3em .9em; border-radius:999px; margin-bottom:.6em;
}
.greentokyo .biz-tag.pink{ color:#c14b78; background:#ffe6f0; }
@media (max-width:768px){
  .greentokyo .svc-intro,
  .greentokyo .svc-intro.rev{ grid-template-columns:1fr; gap:22px; }
  .greentokyo .svc-intro .figure{ max-width:320px; }
}

/* ---------------------------------------------------------------------
   代表メッセージ（.rep / .rep-full）2カラム
   --------------------------------------------------------------------- */
.greentokyo .rep,
.greentokyo .rep-full{
  display:grid;
  grid-template-columns:minmax(220px,0.8fr) 1.2fr;
  gap:clamp(28px,4vw,56px);
  align-items:center;
}
.greentokyo .rep-full{
  align-items:start;
}
.greentokyo .rep .eyebrow,
.greentokyo .rep-full .eyebrow{ margin-bottom:.6em; }
.greentokyo .rep .rep-quote,
.greentokyo .rep-full .rep-quote{
  font-size:clamp(1.2rem,2.4vw,1.6rem);
  font-weight:900;
  line-height:1.5;
  color:var(--green-d);
  margin:.2em 0 .6em;
}
.greentokyo .rep p,
.greentokyo .rep-full p{ color:var(--sub); }
.greentokyo .rep .sign,
.greentokyo .rep-full .sign{
  color:var(--ink);
  font-weight:700;
  margin-top:1em;
}

/* 理念 blockquote / .creed（左の縦線は非表示にする） */
/* SWELLはインラインCSSで blockquote::before に二重の縦線
   （幅5px＋左右border 1px）を出力する。border-left では消えないため
   疑似要素ごと非表示にし、余白もSWELL既定(padding-left:3em)から戻す。 */
.greentokyo .creed::before,
.greentokyo .creed::after{
  content:none !important;
  display:none !important;
  border:0 !important;
}
.greentokyo .creed{
  border-left:none;
  background:var(--green-l);
  border-radius:var(--radius-sm);
  padding:clamp(20px,3vw,32px);
  margin:clamp(24px,3vw,36px) 0;
  color:var(--ink);
  font-weight:500;
  line-height:1.9;
}
.greentokyo .creed p{ color:var(--ink); margin:0; }

/* プロフィール小欄 */
.greentokyo .rep-profile{
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:var(--radius-sm);
  padding:clamp(16px,2.4vw,24px);
  margin-top:clamp(20px,3vw,28px);
  color:var(--sub);
  font-size:.94rem;
}
/* 署名 右寄せ */
.greentokyo .sign{
  text-align:right;
  font-weight:700;
  color:var(--ink);
  margin-top:1.4em;
}

/* ---------------------------------------------------------------------
   メンバー（.member）
   --------------------------------------------------------------------- */
.greentokyo .member{
  text-align:center;
}
.greentokyo .member .figure{
  max-width:180px;
  margin:0 auto 14px;
}
/* メンバーのカテゴリ見出し（ゴルフ / 飲食） */
.greentokyo .member-cat{
  font-size:1.1rem;
  font-weight:800;
  color:var(--ink);
  margin:0 0 20px;
  padding-left:.55em;
  border-left:5px solid var(--green);
  line-height:1.3;
}
.greentokyo .member-cat.food{
  border-left-color:var(--pink);
  margin-top:clamp(40px,6vw,64px);
}
/* TOP MEMBERS：4名を1行に横並び。見出しも同じ行の上段に横並びで配置する。
   （ゴルフ指導＝1列目の上／飲食スタッフ＝2〜4列目の上）
   ※ブロックのラッパー(.wp-block-group__inner-container)が間に入るため
     子結合子(>)は使わず、必ず子孫結合子で指定する。 */
.greentokyo .members-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  column-gap:clamp(14px,2.2vw,26px);
  row-gap:10px;
  align-items:start;
}
.greentokyo .members-grid .member-cat{
  margin:0 0 6px;
}
.greentokyo .members-grid .member-cat.golf{ grid-column:1;      grid-row:1; }
.greentokyo .members-grid .member-cat.food{ grid-column:2 / -1; grid-row:1; margin-top:0; }
.greentokyo .members-grid .member{ grid-row:2; }
.greentokyo .member .member-name,
.greentokyo .member h3{
  font-weight:700;
  font-size:1.05rem;
  color:var(--ink);
  margin:.2em 0 .1em;
  line-height:1.4;
}
.greentokyo .member .member-role,
.greentokyo .member p{
  color:var(--sub);
  font-size:.88rem;
  margin:0;
  line-height:1.6;
}
.greentokyo .member-cta{
  text-align:center;
  margin-top:clamp(24px,3vw,36px);
}

/* ---------------------------------------------------------------------
   お客様の声（.voice-card）
   --------------------------------------------------------------------- */
.greentokyo .voice-card{
  position:relative;
  background:var(--white);
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow-sm);
  padding:clamp(24px,3vw,36px);
  padding-top:clamp(40px,5vw,56px);
  height:100%;              /* お客様の声カードの高さを揃える */
}
.greentokyo .voice-card::before{
  content:"\201C";
  position:absolute;
  top:.1em;
  left:.32em;
  font-family:"Montserrat", sans-serif;
  font-weight:700;
  font-size:3.4rem;
  line-height:1;
  color:var(--green);
  opacity:.35;
}
.greentokyo .voice-card .voice-text,
.greentokyo .voice-card p{
  font-size:1.05rem;
  font-weight:500;
  color:var(--ink);
  margin:0 0 .8em;
  line-height:1.8;
}
.greentokyo .voice-card .voice-who,
.greentokyo .voice-card cite{
  display:block;
  color:var(--sub);
  font-size:.9rem;
  font-style:normal;
  text-align:right;
}

/* ---------------------------------------------------------------------
   会社概要 / テーブル（.wp-block-table）
   --------------------------------------------------------------------- */
.greentokyo .wp-block-table table{
  width:100%;
  border-collapse:collapse;
  background:var(--white);
  border:1px solid var(--line);
  border-radius:var(--radius);
  overflow:hidden;
}
.greentokyo .wp-block-table th,
.greentokyo .wp-block-table td{
  text-align:left;
  vertical-align:top;
  padding:clamp(12px,1.8vw,18px) clamp(14px,2vw,22px);
  border-bottom:1px solid var(--line);
  line-height:1.8;
}
.greentokyo .wp-block-table tr:last-child th,
.greentokyo .wp-block-table tr:last-child td{
  border-bottom:0;
}
.greentokyo .wp-block-table th{
  width:32%;
  min-width:120px;
  background:var(--green-l);
  color:var(--green-d);
  font-weight:700;
  white-space:nowrap;
}
.greentokyo .wp-block-table td{
  color:var(--ink);
}

/* ---------------------------------------------------------------------
   SNS（.sns-mini / ページ下部に小さく）
   --------------------------------------------------------------------- */
.greentokyo .sns-mini{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:14px;
  padding:30px 0 6px;
}
.greentokyo .sns-mini .wp-block-image{ margin:0; }
.greentokyo .sns-mini .wp-block-image img{
  width:38px;
  height:38px;
  display:block;
  transition:transform .2s ease;
}
.greentokyo .sns-mini .wp-block-image a:hover img{ transform:translateY(-2px); }
/* サービス/カードのアイコン画像（緑枠込みPNG・メディア差し替え可） */
.greentokyo .ico-card{ margin:0 auto 14px !important; }
.greentokyo .ico-card img{ width:58px; height:58px; display:block; }
.greentokyo .ico-svc{ margin:0 0 12px !important; }
.greentokyo .ico-svc img{ width:48px; height:48px; display:block; }
.greentokyo .sns-mini__note{
  color:var(--sub);
  font-size:.78rem;
  text-align:center;
  margin:.2em 0 0;
}

/* ---------------------------------------------------------------------
   導入の流れ（.flow / .flow-step 番号バッジ）
   --------------------------------------------------------------------- */
.greentokyo .flow{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  grid-auto-rows:1fr;              /* 各ステップ枠の高さを揃える */
  gap:clamp(16px,2.4vw,26px);
  counter-reset:flow;
  align-items:stretch;
}
.greentokyo .flow-step{
  position:relative;
  background:var(--white);
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow-sm);
  padding:clamp(22px,2.6vw,30px) clamp(18px,2.4vw,26px);
  padding-top:clamp(34px,4vw,44px);
  height:100%;
}
.greentokyo .flow-step::before{
  counter-increment:flow;
  content:counter(flow,decimal-leading-zero);
  position:absolute;
  top:-16px;
  left:20px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:40px;
  height:40px;
  padding:0 .3em;
  border-radius:999px;
  background:var(--green);
  color:#fff;
  font-family:"Montserrat", sans-serif;
  font-weight:700;
  font-size:.95rem;
  box-shadow:var(--shadow-sm);
}
.greentokyo .flow-step .flow-title,
.greentokyo .flow-step h3{
  font-weight:700;
  font-size:1.02rem;
  color:var(--ink);
  margin:0 0 .2em;
}
.greentokyo .flow-step p{
  color:var(--sub);
  font-size:.9rem;
  margin:0;
}

/* ---------------------------------------------------------------------
   仕様リスト（.spec / .spec-item）
   --------------------------------------------------------------------- */
.greentokyo .spec{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  grid-auto-rows:1fr;              /* 4枠すべて同じ高さに揃える */
  gap:clamp(16px,2.4vw,24px);
  margin-top:clamp(20px,3vw,32px);
  align-items:stretch;
}
/* サービスページ サブ見出し（レッスン風景／所属プロ／導入の流れ／料金／紹介スタッフ） */
.greentokyo .svc-subhead{
  font-size:clamp(1.15rem,2vw,1.4rem);
  font-weight:800;
  color:var(--ink);
  line-height:1.3;
  margin:clamp(48px,6vw,76px) 0 clamp(20px,3vw,28px);
  padding-left:.55em;
  border-left:5px solid var(--green);
}
.greentokyo .svc-subhead.pink{ border-left-color:var(--pink); }
.greentokyo .spec-item{
  background:var(--white);
  border:1px solid var(--line);
  border-left:4px solid var(--green);
  border-radius:var(--radius-sm);
  padding:clamp(16px,2.2vw,22px);
  height:100%;
}
.greentokyo .spec-item .spec-label,
.greentokyo .spec-item dt,
.greentokyo .spec-item h3{
  font-family:"Montserrat", sans-serif;
  font-weight:700;
  letter-spacing:.06em;
  font-size:.82rem;
  text-transform:uppercase;
  color:var(--green-d);
  margin:0 0 .35em;
}
.greentokyo .spec-item .spec-body,
.greentokyo .spec-item dd,
.greentokyo .spec-item p{
  color:var(--ink);
  font-size:.96rem;
  margin:0;
}

/* ---------------------------------------------------------------------
   FAQ（.faq-list / .faq-item details/summary アコーディオン）
   --------------------------------------------------------------------- */
.greentokyo .faq-list{
  display:flex;
  flex-direction:column;
  gap:14px;
  max-width:820px;
}
.greentokyo .faq-item{
  background:var(--white);
  border:1px solid var(--line);
  border-radius:var(--radius-sm);
  box-shadow:var(--shadow-sm);
  overflow:hidden;
}
.greentokyo .faq-item summary{
  position:relative;
  list-style:none;
  cursor:pointer;
  padding:clamp(16px,2.2vw,22px) clamp(48px,6vw,58px) clamp(16px,2.2vw,22px) clamp(18px,2.4vw,26px);
  font-weight:700;
  color:var(--ink);
  line-height:1.6;
  transition:color .2s ease, background .2s ease;
}
.greentokyo .faq-item summary::-webkit-details-marker{ display:none; }
.greentokyo .faq-item summary::before{
  content:"Q";
  font-family:"Montserrat", sans-serif;
  font-weight:700;
  color:var(--green);
  margin-right:.6em;
}
/* 開閉マーカー（＋/×） */
.greentokyo .faq-item summary::after{
  content:"";
  position:absolute;
  top:50%;
  right:clamp(18px,2.4vw,24px);
  width:14px;
  height:14px;
  margin-top:-7px;
  background:
    linear-gradient(var(--green),var(--green)) center/14px 2px no-repeat,
    linear-gradient(var(--green),var(--green)) center/2px 14px no-repeat;
  transition:transform .3s ease;
}
.greentokyo .faq-item[open] summary::after{
  transform:rotate(135deg);
}
.greentokyo .faq-item summary:hover{
  color:var(--green-d);
  background:var(--green-l);
}
.greentokyo .faq-item .faq-a{
  padding:0 clamp(18px,2.4vw,26px) clamp(16px,2.2vw,22px);
  color:var(--sub);
  line-height:1.9;
  border-top:1px solid var(--line);
  padding-top:clamp(14px,1.8vw,18px);
}
.greentokyo .faq-item .faq-a::before{
  content:"A";
  font-family:"Montserrat", sans-serif;
  font-weight:700;
  color:var(--pink-d);
  margin-right:.6em;
}
/* 開閉トランジション（控えめ） */
.greentokyo .faq-item[open] .faq-a{
  animation:gt-faq-in .28s ease;
}
@keyframes gt-faq-in{
  from{ opacity:0; transform:translateY(-6px); }
  to{ opacity:1; transform:translateY(0); }
}

/* ---------------------------------------------------------------------
   Legal / prose（.legal — privacy / tokushoho の h3+p 縦組み）
   --------------------------------------------------------------------- */
.greentokyo .legal{
  max-width:820px;
}
.greentokyo .legal h3{
  font-size:1.15rem;
  font-weight:700;
  color:var(--green-d);
  margin:clamp(28px,3.6vw,40px) 0 .5em;
  padding-bottom:.4em;
  border-bottom:1px solid var(--line);
}
.greentokyo .legal h3:first-child{ margin-top:0; }
.greentokyo .legal p{
  color:var(--ink);
  margin:0 0 1em;
}
.greentokyo .legal .legal-date{
  margin-top:clamp(24px,3vw,36px);
  color:var(--sub);
  font-size:.9rem;
}

/* ---------------------------------------------------------------------
   お問い合わせ（.contact ダーク帯 / .form 白カード）
   --------------------------------------------------------------------- */
.greentokyo .form{
  background:var(--white);
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  padding:clamp(24px,4vw,44px);
  max-width:720px;
  margin-inline:auto;
  color:var(--ink);
}
.greentokyo .form p{ color:var(--ink); }
.greentokyo .section.dark .form,
.greentokyo .section.dark .form p,
.greentokyo .section.dark .form label{
  color:var(--ink);
}
.greentokyo .contact-note{
  color:#DFF3E2;
  text-align:center;
  font-size:.9rem;
  margin-top:1.4em;
}

/* ---------------------------------------------------------------------
   Contact Form 7
   --------------------------------------------------------------------- */
.greentokyo .form .wpcf7-form-control-wrap{ display:block; }
.greentokyo .form label{
  display:block;
  font-weight:700;
  color:var(--ink);
  margin:0 0 .4em;
  line-height:1.7;
}
.greentokyo .form p{ margin:0 0 1.1em; }
.greentokyo .form input[type=text],
.greentokyo .form input[type=email],
.greentokyo .form input[type=tel],
.greentokyo .form input[type=url],
.greentokyo .form input[type=number],
.greentokyo .form select,
.greentokyo .form textarea{
  width:100%;
  font-family:inherit;
  font-size:1rem;
  color:var(--ink);
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:var(--radius-sm);
  padding:.75em .9em;
  line-height:1.7;
  transition:border-color .2s ease, box-shadow .2s ease;
}
.greentokyo .form textarea{ min-height:150px; resize:vertical; }
.greentokyo .form input:focus,
.greentokyo .form select:focus,
.greentokyo .form textarea:focus{
  outline:none;
  border-color:var(--green);
  box-shadow:0 0 0 3px rgba(76,175,80,.15);
}
/* submit：主ボタンを踏襲（緑塗り / hover濃緑 / width:100%） */
.greentokyo .form .wpcf7-submit{
  display:block;
  width:100%;
  background:var(--green);
  color:#fff;
  font-family:"Noto Sans JP", sans-serif;
  font-weight:700;
  letter-spacing:.03em;
  border:2px solid var(--green);
  border-radius:999px;
  padding:.9em 2em;
  margin-top:.6em;
  cursor:pointer;
  box-shadow:var(--shadow-sm);
  transition:background .25s ease, transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.greentokyo .form .wpcf7-submit:hover{
  background:var(--green-d);
  border-color:var(--green-d);
  transform:translateY(-2px);
  box-shadow:var(--shadow);
}
/* 必須ラベル（※必須）は赤文字で強調 */
.greentokyo .form .req{
  color:#e60023;
  font-size:.76rem;
  font-weight:700;
  margin-left:.45em;
  letter-spacing:.02em;
  vertical-align:.05em;
}
.greentokyo .form .wpcf7-not-valid-tip{
  color:#c0392b;
  font-size:.85rem;
  font-weight:500;
  margin-top:.3em;
}
.greentokyo .form .wpcf7-not-valid{
  border-color:#c0392b!important;
}
.greentokyo .form .wpcf7-response-output{
  margin-top:18px;
  border:1px solid var(--line);
  padding:14px 16px;
  border-radius:var(--radius-sm);
  color:var(--ink);
  line-height:1.7;
}
.greentokyo .form .wpcf7-spinner{ margin:0 auto; }

/* =====================================================================
   セクションのスクロール表示アニメーション（上からふわっと・遅延なし）
   ---------------------------------------------------------------------
   JSが動いたときだけ html.gt-anim が付く設計。JS無効／エラー時は
   このルール自体が効かず、コンテンツは常に表示されたままになる（安全側）。
   画面内に入った瞬間に発火するので、待たされる感じは出ない。
   ===================================================================== */
html.gt-anim .greentokyo .section,
html.gt-anim .greentokyo .page-hero{
  opacity:0;
  transform:translateY(-26px);
  transition:opacity .65s ease, transform .65s cubic-bezier(.22,.61,.36,1);
  will-change:opacity, transform;
}
html.gt-anim .greentokyo .section.is-inview,
html.gt-anim .greentokyo .page-hero.is-inview{
  opacity:1;
  transform:none;
}
/* 動きを減らす設定の環境では全アニメーションを無効化 */
@media (prefers-reduced-motion: reduce){
  html.gt-anim .greentokyo .section,
  html.gt-anim .greentokyo .page-hero{
    opacity:1 !important;
    transform:none !important;
    transition:none !important;
  }
  .greentokyo .hero__eyebrow,
  .greentokyo .hero__title,
  .greentokyo .hero__sub,
  .greentokyo .hero .wp-block-buttons{
    animation:none !important;
  }
}

/* =====================================================================
   7. ヘッダーお問い合わせボタン（例外ルール：.greentokyo の外・ヘッダー限定）
   ===================================================================== */
/* .greentokyo の外なので CSS変数は使えない → リテラル値。SWELLのgnavリンク
   ( .c-gnav>.menu-item>a : flex/height:100%/padding:0 12px ) を確実に上書きするため
   ancestor id + li型 + !important でピル型に。PC/追従ヘッダー/SPドロワー全てに適用。 */
/* li 自体を flex にして縦中央にピルを配置（ずれ防止）。色はロゴのグリーン。
   ※SPドロワー（#sp_menu / .c-spnav）は対象外＝他項目と同じ通常リンク表示にする。 */
#header li.menu-contact-btn,
#gnav li.menu-contact-btn,
.l-header li.menu-contact-btn,
.l-fixHeader li.menu-contact-btn,
.c-gnavWrap li.menu-contact-btn{
  display:flex !important;
  align-items:center !important;
}
#header li.menu-contact-btn > a,
#gnav li.menu-contact-btn > a,
.l-header li.menu-contact-btn > a,
.l-fixHeader li.menu-contact-btn > a,
.c-gnavWrap li.menu-contact-btn > a{
  background:#4CAF50 !important;
  color:#fff !important;
  border-radius:999px !important;
  padding:.5em 1.5em !important;
  height:auto !important;
  min-height:0 !important;
  align-self:center !important;
  justify-content:center !important;
  font-weight:700 !important;
  line-height:1.4 !important;
  box-shadow:0 4px 12px rgba(76,175,80,.28);
  transition:background .2s ease, transform .2s ease;
}
#header li.menu-contact-btn > a:hover,
#gnav li.menu-contact-btn > a:hover,
.l-header li.menu-contact-btn > a:hover,
.l-fixHeader li.menu-contact-btn > a:hover,
.c-gnavWrap li.menu-contact-btn > a:hover{
  background:#2E7D32 !important;
  color:#fff !important;
  transform:translateY(-1px);
}
/* gnavのホバー下線(:after)はピルでは不要なので消す */
#header li.menu-contact-btn > a::after,
#gnav li.menu-contact-btn > a::after,
.l-header li.menu-contact-btn > a::after,
.c-gnavWrap li.menu-contact-btn > a::after{ display:none !important; }

/* --- SPドロワーメニュー内はピル装飾のみ解除し、余白・文字色・レイアウトは
       SWELL 標準のメニュー項目のまま（他項目と揃える）。 --- */
#sp_menu li.menu-contact-btn > a,
.p-spMenu li.menu-contact-btn > a,
.c-spnav li.menu-contact-btn > a{
  background:none !important;
  border-radius:0 !important;
  box-shadow:none !important;
  transform:none !important;
}

/* =====================================================================
   SWELL 重複ページタイトル非表示 + 余白潰し
   ===================================================================== */
#body_wrap:has(.greentokyo) .c-pageTitle{ display:none; }
#body_wrap:has(.greentokyo) #content,
#body_wrap:has(.greentokyo) #main_content,
#body_wrap:has(.greentokyo) .l-mainContent__inner,
#body_wrap:has(.greentokyo) .post_content{
  padding-block:0!important;
  margin-block:0!important;
}
#body_wrap:has(.greentokyo) .post_content{
  max-width:none!important;
}

/* =====================================================================
   モバイル（<768px）
   ===================================================================== */
@media (max-width:768px){
  .greentokyo .cards.col2,
  .greentokyo .cards.col3,
  .greentokyo .biz-cards,
  .greentokyo .flow,
  .greentokyo .spec{
    grid-template-columns:1fr;
  }
  .greentokyo .rep,
  .greentokyo .rep-full{
    grid-template-columns:1fr;
    gap:24px;
  }
  .greentokyo .rep .figure,
  .greentokyo .rep-full .figure{
    max-width:340px;
    margin-inline:auto;
  }
  .greentokyo .sec-title{ font-size:clamp(1.5rem,7vw,2rem); }
  /* PC側を !important で上書きしているので、SPも !important が必要 */
  .greentokyo .hero{ min-height:clamp(460px,78vh,600px) !important; }
  /* SPは縦構図画像なので中央基準に戻す */
  .greentokyo .hero .wp-block-cover__image-background{ object-position:center center; }
  /* スマホでは背景画像を FV_SP_1（縦構図）に差し替え */
  .greentokyo .hero .wp-block-cover__image-background{
    /* ドメイン・プロトコル非依存のルート相対パス（本番移行後もそのまま動く） */
    content:url(/wp-content/uploads/2026/07/fv-sp.jpg);
  }
  /* SPは下側を暗く（縦グラデ） */
  .greentokyo .hero .wp-block-cover__background{
    background:linear-gradient(to top,
       rgba(20,40,26,.74) 0%,
       rgba(20,40,26,.40) 45%,
       rgba(20,40,26,.10) 78%,
       rgba(20,40,26,0) 100%) !important;
  }
  .greentokyo .hero__cta{ flex-direction:column; align-items:stretch; }
  .greentokyo .hero__cta .btn,
  .greentokyo .hero__cta .ghost-btn{ text-align:center; }
  /* 会社概要など：左ラベル列は折り返さず1行で（td/th 両対応・幅は内容に合わせる） */
  .greentokyo .wp-block-table td:first-child,
  .greentokyo .wp-block-table th:first-child,
  .greentokyo .wp-block-table th{
    white-space:nowrap;
    width:1%;
    min-width:0;
  }
  .greentokyo .wp-block-table td{ white-space:normal; }
  /* ゴルフプロ1名はスマホでは中央表示に */
  .greentokyo .member.solo{ margin-inline:auto; }
  /* MEMBERS：スマホは2カラム、見出しは横幅いっぱいで元の順序どおりに流す */
  .greentokyo .members-grid{ grid-template-columns:repeat(2,1fr); row-gap:6px; }
  .greentokyo .members-grid .member-cat.golf,
  .greentokyo .members-grid .member-cat.food{ grid-column:1 / -1; grid-row:auto; }
  .greentokyo .members-grid .member{ grid-row:auto; }
  .greentokyo .members-grid .member-cat.food{ margin-top:30px; }
}

@media (max-width:480px){
  .greentokyo .wp-block-table table{ font-size:.92rem; }
  .greentokyo .wp-block-table th,
  .greentokyo .wp-block-table td{ padding:12px 12px; }
}

/* =====================================================================
   ブロックエディタ用ガード（.editor-styles-wrapper 前置。front に影響させない）
   フルブリード無効化・figure の aspect-ratio 解除・画像を通常フローに
   ===================================================================== */
/* --- フルブリード(100vw)だけ無効化。エディタキャンバス幅に収める --- */
.editor-styles-wrapper .greentokyo{
  width:auto !important;
  max-width:100% !important;
  margin-left:0 !important;
  margin-right:0 !important;
  overflow:visible !important;
}

/* --- ここが要：エディタは wp:group の子を
       .block-editor-inner-blocks > .block-editor-block-list__layout の2層で包む。
       そのままだとグリッドの子要素が「1個」になり、全部が縦積み（縦長）になる。
       フロントの .wp-block-group__inner-container{display:contents} と同じく
       ラッパーの箱を消して、孫要素が直接グリッドアイテムになるようにする。

       ※これらのクラスはエディタにしか存在しないため .editor-styles-wrapper を
         前置しない（WPがエディタCSSへ自動前置しても二重化で無効にならないように）。

       ただし現在のGutenbergは、そのレイアウトクラスをブロック要素“自身”に統合する
       場合があり（その場合 .cards などのグリッド本体に付く）、無条件に
       display:contents にすると逆にグリッドが壊れる。ブロック本体には必ず
       data-block 属性が付くので「data-block を持たない＝純粋なラッパーのときだけ」
       箱を消す。 --- */
.greentokyo .block-editor-inner-blocks:not([data-block]),
.greentokyo .block-editor-block-list__layout:not([data-block]){
  display:contents;
}

/* --- ブロックラッパー既定の上下マージンでグリッドがずれるのを防ぐ --- */
.greentokyo .cards > *,
.greentokyo .spec > *,
.greentokyo .flow > *,
.greentokyo .svc-intro > *,
.greentokyo .rep > *,
.greentokyo .rep-full > *,
.greentokyo .faq-list > *,
.greentokyo .members-grid > *{
  margin-block:0;
}

/* --- 枠の大きさを揃える ---
   フロントでは直下が .wp-block-group__inner-container（display:contents）なので
   height/width 指定は無効＝影響なし。
   エディタでは実ブロックが直下に来るため、ここで高さ・幅が揃う。 */
.greentokyo .cards > *,
.greentokyo .spec > *,
.greentokyo .flow > *{
  height:100%;
  align-self:stretch;
}
.greentokyo .faq-list > *{
  width:100%;
  max-width:none;
  align-self:stretch;
  margin-inline:0;
}

/* --- アイコン画像はエディタでも実サイズを維持 --- */
.greentokyo .ico-card img{ width:56px; height:56px; }
.greentokyo .ico-svc img{ width:48px; height:48px; }

/* --- hero は標準 wp:cover。エディタでもネイティブ描画される --- */
.editor-styles-wrapper .greentokyo .hero{ min-height:460px !important; }

/* --- エディタでは演出を無効化（編集の邪魔になるので常に表示状態にする） --- */
.editor-styles-wrapper .greentokyo .hero__eyebrow,
.editor-styles-wrapper .greentokyo .hero__title,
.editor-styles-wrapper .greentokyo .hero__sub,
.editor-styles-wrapper .greentokyo .hero .wp-block-buttons,
.editor-styles-wrapper .greentokyo .section,
.editor-styles-wrapper .greentokyo .page-hero{
  animation:none !important;
  opacity:1 !important;
  transform:none !important;
}