/* ============================================================
   GREENPLANTS — 下層ページ用スタイル
   トップページ（kz.css）のトーンを引き継いだ記事レイアウト
============================================================ */

.pg-hero{
  position:relative;
  padding:170px 0 74px;
  background:var(--gp-forest);
  color:var(--gp-ivory);
  overflow:hidden;
}
.pg-hero::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(12,20,16,.72),rgba(12,20,16,.52));
}
.pg-hero__bg{
  position:absolute;inset:0;
  background-size:cover;background-position:center;
  opacity:.55;
}
.pg-hero .gp-container{position:relative;z-index:2}
.pg-hero .sec-en{color:var(--gp-gold);margin-bottom:14px}
.pg-hero h1{
  margin:0 0 20px;
  font-size:clamp(26px,3.9vw,44px);
  line-height:1.5;font-weight:500;letter-spacing:.05em;
  color:var(--gp-ivory);
}
.pg-hero__lead{
  margin:0;max-width:760px;
  font-size:clamp(14px,1.5vw,16px);line-height:2.1;
  color:rgba(243,239,230,.86);
}

/* ---- パンくず ---- */
.pg-bc{
  background:var(--gp-ivory-soft);
  border-bottom:1px solid var(--gp-line);
  font-size:12.5px;letter-spacing:.06em;
}
.pg-bc ol{
  display:flex;flex-wrap:wrap;gap:8px;
  list-style:none;margin:0;padding:13px 0;
}
.pg-bc li{color:var(--gp-fresh)}
.pg-bc li+li::before{content:"›";margin-right:8px;color:var(--gp-line)}
.pg-bc a{color:var(--gp-forest-soft);text-decoration:none}
.pg-bc a:hover{text-decoration:underline}

/* ---- 本文 ---- */
.pg-body{padding:80px 0 20px}
.pg-body .gp-container{max-width:900px}
.pg-sec{margin:0 0 68px}
.pg-sec h2{
  margin:0 0 22px;padding-bottom:14px;
  border-bottom:1px solid var(--gp-line);
  font-size:clamp(21px,2.6vw,29px);
  line-height:1.55;font-weight:500;letter-spacing:.05em;
  color:var(--gp-forest);
}
.pg-sec h3{
  margin:34px 0 12px;
  font-size:clamp(17px,2vw,20px);
  line-height:1.6;font-weight:500;color:var(--gp-forest-soft);
}
.pg-sec p{margin:0 0 18px;font-size:15px;line-height:2.15}
.pg-sec ul,.pg-sec ol{margin:0 0 20px;padding-left:1.3em}
.pg-sec li{font-size:15px;line-height:2.05;margin-bottom:7px}
.pg-sec strong{font-weight:700;color:var(--gp-forest)}

/* ---- カード ---- */
.pg-cards{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
  gap:18px;margin:0 0 24px;
}
.pg-card{
  background:#fff;border:1px solid var(--gp-line);border-radius:4px;
  padding:26px 24px;
}
.pg-card b{
  display:block;margin-bottom:9px;
  font-family:var(--gp-serif);font-size:17px;font-weight:500;
  color:var(--gp-forest);letter-spacing:.05em;
}
.pg-card span{display:block;font-size:13.5px;line-height:1.95;color:#5b6157}

/* ---- 表 ---- */
.pg-table{width:100%;border-collapse:collapse;margin:0 0 24px;font-size:14.5px}
.pg-table th,.pg-table td{
  border:1px solid var(--gp-line);padding:14px 16px;
  text-align:left;line-height:1.9;vertical-align:top;
}
.pg-table th{background:var(--gp-ivory-soft);font-weight:700;width:34%;color:var(--gp-forest)}
.pg-table-wrap{overflow-x:auto;margin:0 0 24px}

/* ---- 流れ ---- */
.pg-flow{list-style:none;margin:0 0 24px;padding:0;counter-reset:flow}
.pg-flow li{
  position:relative;padding:0 0 26px 58px;counter-increment:flow;
  font-size:15px;line-height:2.05;
}
.pg-flow li::before{
  content:counter(flow);
  position:absolute;left:0;top:2px;
  width:36px;height:36px;border-radius:50%;
  background:var(--gp-forest);color:var(--gp-ivory);
  font-family:var(--gp-en);font-size:15px;letter-spacing:0;
  display:flex;align-items:center;justify-content:center;
}
.pg-flow li::after{
  content:"";position:absolute;left:17px;top:42px;bottom:6px;
  width:1px;background:var(--gp-line);
}
.pg-flow li:last-child{padding-bottom:0}
.pg-flow li:last-child::after{display:none}
.pg-flow b{display:block;font-family:var(--gp-serif);font-size:16.5px;color:var(--gp-forest);font-weight:500}

/* ---- FAQ ---- */
.pg-faq{border-top:1px solid var(--gp-line)}
.pg-faq details{border-bottom:1px solid var(--gp-line)}
.pg-faq summary{
  list-style:none;cursor:pointer;position:relative;
  padding:20px 44px 20px 30px;
  font-family:var(--gp-serif);font-size:16px;font-weight:500;
  color:var(--gp-forest);line-height:1.7;
}
.pg-faq summary::-webkit-details-marker{display:none}
.pg-faq summary::before{
  content:"Q";position:absolute;left:0;top:20px;
  font-family:var(--gp-en);color:var(--gp-gold);font-size:15px;
}
.pg-faq summary::after{
  content:"";position:absolute;right:10px;top:29px;
  width:11px;height:11px;
  border-right:1px solid var(--gp-fresh);border-bottom:1px solid var(--gp-fresh);
  transform:rotate(45deg);transition:transform .25s ease;
}
.pg-faq details[open] summary::after{transform:rotate(-135deg)}
.pg-faq .pg-faq__a{
  position:relative;padding:0 10px 22px 30px;
  font-size:14.5px;line-height:2.1;color:#4b5249;
}
.pg-faq .pg-faq__a::before{
  content:"A";position:absolute;left:0;top:0;
  font-family:var(--gp-en);color:var(--gp-fresh);font-size:15px;
}

/* ---- エリア ---- */
.pg-area{
  display:flex;flex-wrap:wrap;gap:9px;margin:0 0 22px;padding:0;list-style:none;
}
.pg-area li{
  padding:7px 16px;border:1px solid var(--gp-line);border-radius:999px;
  background:#fff;font-size:13px;letter-spacing:.06em;color:var(--gp-forest-soft);
}
.pg-area li.is-main{background:var(--gp-forest);border-color:var(--gp-forest);color:var(--gp-ivory)}

/* ---- CTA ---- */
.pg-cta{
  margin:0 0 60px;padding:46px 40px;
  background:var(--gp-forest);color:var(--gp-ivory);
  border-radius:4px;text-align:center;
}
.pg-cta h2{
  margin:0 0 12px;border:0;padding:0;
  font-size:clamp(20px,2.6vw,27px);color:var(--gp-ivory);font-weight:500;
}
.pg-cta p{margin:0 0 26px;font-size:14.5px;color:rgba(243,239,230,.82);line-height:2}
.pg-cta__btns{display:flex;flex-wrap:wrap;gap:14px;justify-content:center}
.pg-btn{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:230px;padding:17px 30px;border-radius:999px;
  font-size:15px;font-weight:700;letter-spacing:.06em;text-decoration:none;
  transition:transform .2s ease,opacity .2s ease;
}
.pg-btn:hover{transform:translateY(-2px)}
.pg-btn--tel{background:var(--gp-ivory);color:var(--gp-forest)}
.pg-btn--mail{background:var(--gp-fresh);color:#fff}

/* ---- 関連ページ ---- */
.pg-rel{padding:0 0 90px}
.pg-rel .gp-container{max-width:900px}
.pg-rel__ttl{
  font-family:var(--gp-en);font-size:12px;letter-spacing:.4em;
  color:var(--gp-gold);font-style:italic;margin:0 0 18px;text-transform:uppercase;
}
.pg-rel__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px}
.pg-rel__grid a{
  display:block;padding:20px 22px;background:#fff;
  border:1px solid var(--gp-line);border-radius:4px;
  text-decoration:none;transition:border-color .2s ease,transform .2s ease;
}
.pg-rel__grid a:hover{border-color:var(--gp-fresh);transform:translateY(-2px)}
.pg-rel__grid b{
  display:block;font-family:var(--gp-serif);font-size:15.5px;font-weight:500;
  color:var(--gp-forest);margin-bottom:6px;
}
.pg-rel__grid span{display:block;font-size:12.5px;color:#6b7266;line-height:1.85}

@media(max-width:768px){
  .pg-hero{padding:130px 0 54px}
  .pg-body{padding:56px 0 10px}
  .pg-sec{margin-bottom:52px}
  .pg-cta{padding:36px 22px}
  .pg-btn{min-width:100%}
  .pg-table th{width:38%}
}