@charset "utf-8";
/*
 * ======================================
 * 追加クラス一覧（共通SCSS取り込み検討用）
 * ======================================
 *
 * ■ レイアウト補助
 * .gsk-pad-x            - コンテナ左右24pxパディング（デザイン共通の左右余白 / content-box）
 * .gsk-w-1240 / -1340 / -1080 / -1000 / -960 / -900
 *                       - デザイン固有のコンテンツ幅。.container は wide 以下で
 *                         max-width:95% + padding:10px のフォールバックが入り
 *                         デザインの「max-width + 左右24px」と挙動が違うため独自に用意
 *
 * ■ 共通パーツ
 * .gsk-header / __inner / __right / __tel  - stickyヘッダー（2段ロゴ+EN/JAナビ+電話+LINE）
 * .gsk-logo / __name                       - 画像アイコン94px + 明朝体社名のロゴ
 * .gsk-nav                                 - ナビ間隔22px・EN小/JA中の2段テキスト
 * .gsk-nav-toggle / .gsk-sp-nav            - 52px角丸16pxのMENUボタン / 白背景ドロワー
 * .gsk-btn（--blue/--orange/--green/--white/--outline/--outline-green/--gray）
 *   + サイズ（--sm/--lg/--wide/--tel/--block）/ .gsk-btns（--center）
 *                       - 幅が内容依存のインラインpillボタン群
 * .gsk-badge（--blue/--green/--gray/--orange/--onphoto） - 物件種別・タグのpillバッジ
 * .gsk-label--onblue    - 青背景上のENラベル色
 * .gsk-h2 / .gsk-h3 / .gsk-h4 - clamp()流体サイズの見出し（h3は左に緑バー、h4は装飾なし）
 * .gsk-crumb            - デザインの1行パンくず（ホーム ／ 現在地）
 * .gsk-cta / __wave / __title / __text / __note / .gsk-cta-section - グラデCTAパネル
 * .gsk-footer 一式      - 波画像 + 2カラム（会社情報 / 地図）+ 中央ナビ + コピーライト
 * .gsk-spbar / .gsk-page-top - SP固定バー・ページトップの配色
 *
 * ■ TOP
 * .gsk-mv 一式          - 角丸32pxのMVカード（#slideshow）
 * .gsk-news 一式        - 170px+1fr のお知らせカード
 * .gsk-message 一式     - 写真44% + 白カード56%（左に-58pxはみ出し）の代表メッセージ
 * .gsk-slider-row / .gsk-arrow - 左右矢印付きカード列
 * .gsk-card 一式 / .gsk-price  - 物件カード（写真+バッジ+価格）
 * .gsk-bnr 一式         - 写真+グラデ暗幕の大バナー
 * .gsk-balloon / .gsk-area 一式 / .gsk-checklist - 対応エリア
 *
 * ■ 下層
 * .gsk-hero 一式        - グラデ背景 + 下端波型のページヒーロー
 * .gsk-filter / __item  - カテゴリ絞り込みpill列（common.js で is-current 切替）
 * .gsk-cards .is-hidden / .gsk-cards__empty - 絞り込みで非表示になったカード / 0件表示
 * .gsk-spec 一式        - 物件概要テーブル（2列 / 4列）
 * .gsk-gallery 一式     - 主画像+サムネイルの物件ギャラリー
 * .gsk-ba 一式          - BEFORE / AFTER 2枚並び
 * .gsk-ba-thumb 一式    - 一覧カードの施工前後2分割サムネ（中央に矢印）
 * .gsk-step 一式        - 112pxの番号帯付きSTEPカード
 * .gsk-faq 一式         - details/summary のQ&Aアコーディオン
 * .gsk-msgbox 一式      - 代表メッセージの淡緑ボックス（右下に葉の装飾）
 * .gsk-wbox / .gsk-dashlist - 白カード / 点線プレースホルダー
 * .gsk-access 一式      - 地図 + アクセス情報の2カラム
 * .gsk-ways / .gsk-way 一式 - 電話 / LINE / メールの3連絡カード
 * .gsk-form / .gsk-form__after - CMSフォームを載せる白カードと下部の注記
 * #cms-contact-1-1-area 配下 - CMSフォーム（design_pattern=2）の見た目上書き
 *                       （CMSが実行時に差し込む mail-form.css より後勝ちにするためID指定）
 *
 * ■ box-sizing について
 * デザイン（claude-design-output）はCSSリセットを持たず content-box が既定。
 * 「max-width + 左右padding」「min-height + padding」を併記した箱は
 * .gsk-pad-x / .gsk-cta / .gsk-message__card / .gsk-msgbox__placeholder /
 * .gsk-footer__navwrap で box-sizing:content-box を明示して寸法を合わせている。
 *
 * ======================================
 * 共通SCSSに不足していたもの
 * ======================================
 *
 * ・値の粒度不足：左右24pxパディング／1240・1340・1080・1000・960・900px幅／
 *   clamp()による流体フォントサイズ（utilityは固定px刻みのみ）／
 *   line-height:normal の utility（.lh-1〜.lh-xl はあるが normal が無い。
 *   デザインが line-height 未指定＝normal の箇所を再現できない）
 * ・構造不足：position:sticky のヘッダー（header-bar は fixed、header-sticky は
 *   JS前提の absolute→fixed）。写真の外にはみ出す代表メッセージカード。
 *   主画像+サムネイル切替のギャラリー。112px幅の番号帯を持つSTEPカード。
 * ・状態不足：幅が内容依存（width:100%でない）のpillボタン。.btn は
 *   max-width+width:100% 固定でボタンを横並びにできない。
 * ・装飾パターン不足：写真上に載るカテゴリバッジ、BEFORE/AFTERラベル、
 *   価格表記（大きい数字＋小さい単位）
 *
 */

/* ==========================================================================
   0. レイアウト補助
   ========================================================================== */
/* 左右24px（padding-top/bottom はセクション側で個別指定）
   デザイン（claude-design-output）はCSSリセットが無く content-box が既定のため、
   max-width と左右paddingを併せ持つラッパーは content-box で合わせる */
.gsk-pad-x { padding-left: 24px; padding-right: 24px; box-sizing: content-box; }
/* width は指定しない（block の自動幅）。content-box の gsk-pad-x と併用しても
   親幅からはみ出さず、広い画面では max-width が内容幅を決める（デザインと同じ挙動） */
.gsk-w-1240 { max-width: 1240px; margin-left: auto; margin-right: auto; }

.gsk-w-1500,
.gsk-w-1340,
.gsk-w-1080,
.gsk-w-1000,
.gsk-w-960,
.gsk-w-900 { margin-left: auto; margin-right: auto; }
.gsk-w-1500 { max-width: 1500px; }
.gsk-w-1340 { max-width: 1340px; }
.gsk-w-1080 { max-width: 1080px; }
.gsk-w-1000 { max-width: 1000px; }
.gsk-w-960  { max-width: 960px; }
.gsk-w-900  { max-width: 900px; }

/* ==========================================================================
   1. 共通テキスト・見出し
   ========================================================================== */
.gsk-h2 {
  font-family: "Zen Maru Gothic", "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: clamp(2.4rem, 3.2vw, 3.3rem);
  color: #1c3c6e;
  line-height: normal;
  margin-top: 4px;
}
.gsk-heading { display: flex; flex-direction: column; align-items: center; }
.gsk-heading .heading__en { display: block; line-height: normal; }
.gsk-h3 {
  font-family: "Zen Maru Gothic", "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: 2.2rem;
  color: #1c3c6e;
  line-height: 1.5;
  display: flex;
  align-items: center;
  gap: 14px;
}
.gsk-h3::before {
  content: "";
  display: block;
  width: 5px;
  height: 24px;
  background: #48B428;
  border-radius: 3px;
  flex: none;
}
.gsk-h3--lg { font-size: 2.4rem; }
.gsk-h3--lg::before { height: 26px; }

.gsk-label--onblue { color: #bcd4ff; line-height: normal; }
.gsk-label--ongreen { color: #e6f6de; line-height: normal; }

.gsk-note {
  font-size: 1.25rem;
  color: #7a93bd;
  line-height: 1.8;
}

/* パンくず（デザインは1行テキスト） */
.gsk-crumb {
  font-size: 1.3rem;
  color: #7a93bd;
  padding-top: 10px;
}
.gsk-crumb a { color: #3560C3; }
.gsk-crumb a:hover { color: #3560C3; opacity: 1; }

/* ==========================================================================
   2. ボタン
   ========================================================================== */
.gsk-btns { display: flex; flex-wrap: wrap; gap: 12px; }
.gsk-btns--center { justify-content: center; }
@media (max-width: 639px) {
  .gsk-btns--center { flex-direction: column; align-items: stretch; }
  .gsk-btns--center .gsk-btn { width: 100%; }
}

.gsk-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 13px 24px;
  border: 0;
  border-radius: 999px;
  font-size: 1.45rem;
  font-weight: 700;
  line-height: normal;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  transition: all 0.3s ease;
}
.gsk-btn:hover { opacity: 1; transform: translateY(-2px); }

.gsk-btn--sm   { padding: 11px 18px; font-size: 1.6rem; }
.gsk-btn--lg   { padding: 18px 30px; font-size: 1.6rem; }
.gsk-btn--wide { padding: 16px 38px; font-size: 1.8rem; font-family: "Zen Maru Gothic", "Noto Sans JP", sans-serif; }
.gsk-btn--wide.gsk-btn--compact { padding-left: 18px; padding-right: 18px; font-size: 1.5rem; gap: 6px; }
.gsk-btn--tel  { padding: 16px 30px; font-size: 2.1rem; font-family: "Zen Maru Gothic", "Noto Sans JP", sans-serif; }
.gsk-btn--block { width: 100%; padding-left: 14px; padding-right: 14px; }
.gsk-btn--flex { flex: 1; min-width: 200px; }

.gsk-btn--blue   { background: #3560C3; color: #fff; box-shadow: 0 6px 16px rgba(53, 96, 195, 0.28); }
.gsk-btn--orange { background: #F7962B; color: #fff; }
.gsk-btn--green  { background: #48B428; color: #fff; box-shadow: 0 4px 12px rgba(72, 180, 40, 0.3); }
.gsk-btn--white  { background: #fff; color: #2E5FC0; border: 1.5px solid #fff; }
.gsk-btn--outline { background: #fff; color: #3560C3; border: 1.5px solid #b9cef0; }
.gsk-btn--outline-green { background: #fff; color: #3d9a22; border: 1.5px solid #cbe6bf; }
.gsk-btn--gray { background: #8b7d64; color: #fff; }

/* ==========================================================================
   3. バッジ
   ========================================================================== */
.gsk-badge {
  display: inline-block;
  border-radius: 999px;
  padding: 4px 12px;
  font-size: 1.2rem;
  font-weight: 700;
  line-height: normal;
  white-space: nowrap;
}
.gsk-badge--blue   { background: #eaf2fc; color: #3560C3; }
.gsk-badge--green  { background: #eaf7e6; color: #3d9a22; }
.gsk-badge--gray   { background: #eef0f6; color: #5c7399; }
.gsk-badge--orange { background: #fdefdd; color: #d97d13; }
.gsk-badge--onphoto {
  position: absolute;
  left: 14px;
  top: 14px;
  z-index: 2;
  background: #3560C3;
  color: #fff;
  padding: 5px 13px;
}

/* ==========================================================================
   4. ヘッダー
   ========================================================================== */
.gsk-header {
  position: sticky;
  top: 0;
  background: #fff;
  box-shadow: 0 2px 14px rgba(53, 96, 195, 0.08);
}
/* ヘッダーだけコンテンツ幅(1240)より広く取る（$width_wide 相当） */
.gsk-header__inner {
  max-width: 1500px;
  height: auto;
  padding: 14px 24px 10px;
  gap: 20px;
}

.gsk-logo { display: flex; align-items: center; gap: 12px; flex: none; }
.gsk-logo img { width: 82px; height: 94px; object-fit: contain; }
.gsk-logo__name {
  font-family: "Shippori Mincho", "Hiragino Mincho ProN", serif;
  font-weight: 600;
  font-size: 2.3rem;
  color: #1B4C9E;
  letter-spacing: 0.01em;
  line-height: 1.2;
}

.gsk-nav { gap: 30px; margin-left: auto; margin-right: 0; }
.gsk-nav .header__nav-item a { display: block; padding: 4px 0; text-align: center; }
/* ナビ下線は使わない。hover・現在ページは文字色で示す */
.gsk-nav .header__nav-item a::after { display: none; }
.gsk-nav .header__nav-item a:hover .header__nav-ja,
.gsk-nav .header__nav-item--current .header__nav-ja { color: #3560C3; }
.gsk-nav .header__nav-en {
  display: block;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 1.1rem;
  font-weight: 400;
  letter-spacing: 0.14em;
  color: #8fa7cc;
  line-height: normal;
  white-space: nowrap;
}
.gsk-nav .header__nav-ja {
  display: block;
  font-family: "Zen Maru Gothic", "Noto Sans JP", sans-serif;
  font-size: 1.65rem;
  font-weight: 600;
  color: #1c3c6e;
  margin-top: 4px;
  line-height: normal;
  white-space: nowrap;
}


.gsk-header__right { gap: 10px; height: auto; margin-left: auto; flex: none; }
.gsk-header__telbox {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  margin-right: 2px;
}
.gsk-header__tel {
  font-family: "Zen Maru Gothic", "Noto Sans JP", sans-serif;
  font-size: 2.3rem;
  font-weight: 700;
  color: #3560C3;
  letter-spacing: 0.01em;
  line-height: 1.2;
}
.gsk-header__hours {
  font-size: 1.1rem;
  font-weight: 700;
  color: #7a93bd;
  line-height: normal;
  margin-top: 2px;
  white-space: nowrap;
}
.gsk-header__tel::before { display: inline-block; width: 20px; font-size: 0.86em; margin-right: 8px; text-align: center; }

/* 1400px以下：ロゴ・ナビ間隔を少し詰めて、電話番号の表示幅を確保する */
@media (max-width: 1400px) {
  .gsk-logo img { width: 80px; height: 80px; }
  .gsk-logo__name { font-size: 2.15rem; }
  .gsk-nav { gap: 22px; }
  .gsk-header__tel { font-size: 2.15rem; }
}
/* 1300px以下：さらに詰める */
@media (max-width: 1300px) {
  .gsk-logo img { width: 66px; height: 66px; }
  .gsk-logo__name { font-size: 1.9rem; }
  .gsk-nav { gap: 14px; }
  .gsk-nav .header__nav-ja { font-size: 1.5rem; }
  .gsk-header__tel { font-size: 1.95rem; }
}
/* 1180px以下：さらに詰める */
@media (max-width: 1180px) {
  .gsk-logo img { width: 52px; height: 52px; }
  .gsk-logo__name { font-size: 1.6rem; }
  .gsk-nav { gap: 6px; }
  .gsk-nav .header__nav-ja { font-size: 1.2rem; }
  .gsk-header__tel { font-size: 1.65rem; }
}
/* 1000px以下：ハンバーガーメニューに切り替わるタイミングで、ナビと一緒に電話番号も隠す
   （= ハンバーガーが出ていない間は常に電話番号を表示） */
@media (max-width: 1000px) {
  .gsk-header__telbox { display: none; }
  .gsk-header__inner { padding: 10px 16px; }
  .gsk-logo img { width: 58px; height: 58px; }
  .gsk-logo__name { font-size: 1.9rem; }
}
@media (max-width: 639px) {
  .gsk-header__inner { padding: 8px 14px; }
  .gsk-logo img { width: 46px; height: 46px; }
  .gsk-logo__name { font-size: 1.9rem; }
}

/* -- ハンバーガー（デザインの角丸MENUボタンに合わせる） -- */
.gsk-nav-toggle {
  width: 52px;
  height: 52px;
  top: 14px;
  right: 16px;
  border-radius: 16px;
  background: #3560C3;
  backdrop-filter: none;
  box-shadow: 0 6px 16px rgba(53, 96, 195, 0.28);
}
.gsk-nav-toggle .nav-toggle__line { background: #fff; width: 20px; }
.gsk-nav-toggle .nav-toggle__line:nth-child(1) { top: 17px; }
.gsk-nav-toggle .nav-toggle__line:nth-child(2) { top: 25px; }
.gsk-nav-toggle .nav-toggle__line:nth-child(3) { top: 33px; }
.gsk-nav-toggle.is-active .nav-toggle__line:nth-child(1) { top: 25px; }
.gsk-nav-toggle.is-active .nav-toggle__line:nth-child(3) { top: 25px; }
@media (max-width: 639px) {
  .gsk-nav-toggle { width: 46px; height: 46px; top: 8px; right: 12px; border-radius: 14px; }
  .gsk-nav-toggle .nav-toggle__line:nth-child(1) { top: 14px; }
  .gsk-nav-toggle .nav-toggle__line:nth-child(2) { top: 22px; }
  .gsk-nav-toggle .nav-toggle__line:nth-child(3) { top: 30px; }
  .gsk-nav-toggle.is-active .nav-toggle__line:nth-child(1) { top: 22px; }
  .gsk-nav-toggle.is-active .nav-toggle__line:nth-child(3) { top: 22px; }
}

/* -- SPドロワー（デザインの白いMENUパネルに合わせる） -- */
.gsk-sp-nav {
  background: #fff;
  justify-content: flex-start;
  padding: 88px 24px 40px;
}
.gsk-sp-nav__list { max-width: 520px; text-align: left; }
.gsk-sp-nav .sp-nav__item { border-bottom: 1px dashed #dfe8f6; }
.gsk-sp-nav .sp-nav__item:first-child { border-top: none; }
.gsk-sp-nav .sp-nav__link {
  color: #1c3c6e;
  font-family: "Zen Maru Gothic", "Noto Sans JP", sans-serif;
  font-size: 1.7rem;
  font-weight: 700;
  padding: 15px 4px;
}
.gsk-sp-nav .sp-nav__link:hover { background: #f4f8fd; }
.gsk-sp-nav .sp-nav__link::after { color: #b9cef0; opacity: 1; }
.gsk-sp-nav__bottom .gsk-btn--tel { padding: 14px; font-size: 1.9rem; }
.gsk-sp-nav__bottom {
  display: grid;
  gap: 10px;
  max-width: 520px;
  margin-top: 28px;
}

/* ==========================================================================
   5. メインビュー（TOP）
   ========================================================================== */
.gsk-mv-section {
  padding-top: 26px;
  background: linear-gradient(180deg, #eaf4fe, #ffffff);
}
.gsk-mv {
  position: relative;
  height: 78vh;
  min-height: 520px;
  border-radius: 32px;
  overflow: hidden;
  display: grid;
  place-items: center;
  text-align: center;
  box-shadow: 0 18px 40px rgba(53, 96, 195, 0.22);
}
.gsk-mv__slide { position: absolute; inset: 0; }
.gsk-mv__slide img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gsk-mv__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(20, 50, 110, 0.24), rgba(20, 50, 110, 0.42));
}
/* MV上部の花あしらい（左右） */
.gsk-mv__flower {
  position: absolute;
  top: 0;
  width: clamp(150px, 19vw, 300px);
  height: auto;
  pointer-events: none;
}
.gsk-mv__flower--left  { left: 0; }
.gsk-mv__flower--right { right: 0; }

.gsk-mv__body { position: relative; padding: 32px; }
.gsk-mv__badge {
  display: inline-block;
  padding: 7px 18px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.9);
  color: #2b4fa5;
  font-size: 1.6rem;
  font-weight: 700;
  letter-spacing: 0.06em;
}
.gsk-mv__title {
  margin: 20px 0 0;
  font-family: "Zen Maru Gothic", "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: clamp(3.3rem, 5vw, 6.1rem);
  line-height: 1.45;
  letter-spacing: 0.02em;
  color: #fff;
  text-shadow: 0 3px 18px rgba(20, 50, 110, 0.35);
}
.gsk-mv__lead {
  margin: 24px 0 0;
  color: #fff;
  font-weight: 600;
  font-size: 1.7rem;
  line-height: 1.9;
  text-shadow: 0 2px 10px rgba(20, 50, 110, 0.3);
}
@media (max-width: 920px) {
  .gsk-mv { height: auto; min-height: 560px; padding: 70px 0; }
}
@media (max-width: 639px) {
  .gsk-mv { min-height: 460px; border-radius: 24px; padding: 50px 0; }
  .gsk-mv__flower { width: clamp(110px, 34vw, 170px); }
  .gsk-mv__body { padding: 20px 6px; }
  .gsk-mv__badge { font-size: 1.3rem; }
  .gsk-mv__lead {
    font-size: 1.3rem;
    text-align: center;
    text-wrap: balance;
    word-break: auto-phrase;
  }
}

/* ==========================================================================
   6. お知らせ（TOP）
   ========================================================================== */
.gsk-news-section { padding-top: 80px; padding-bottom: 80px; position: relative; overflow: hidden; }
/* 左下角のハイビスカス装飾（コンテンツの背面） */
.gsk-news-section > .gsk-w-1000 { position: relative; z-index: 1; }
.gsk-news__hana {
  position: absolute;
  left: -55px;
  bottom: -45px;
  z-index: 0;
  width: clamp(210px, 26vw, 360px);
  height: auto;
  opacity: 0.45;
  pointer-events: none;
}
.gsk-news {
  background: #fff;
  border-radius: 28px;
  box-shadow: 0 8px 26px rgba(53, 96, 195, 0.09);
  padding: 26px 30px;
  display: grid;
  grid-template-columns: 170px 1fr;
  gap: 26px;
  align-items: start;
}
.gsk-news__en {
  font-family: "Zen Maru Gothic", "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: 3.9rem;
  color: #3560C3;
  line-height: normal;
}
.gsk-news__ja { font-size: 1.6rem; color: #7a93bd; margin-top: 4px; }

.gsk-news__list { border-top: none; display: block; }
.gsk-news__list .blog-list__item { border-bottom: 1px dashed #d9e4f4; }
.gsk-news__list .blog-list__item:last-child { border-bottom: none; }
.gsk-news__list .blog-list__link {
  display: grid;
  grid-template-columns: 100px 1fr auto;
  align-items: center;
  gap: 14px;
  padding: 14px 4px;
  color: #22355c;
}
.gsk-news__list .blog-list__date {
  font-family: "Noto Sans JP", sans-serif;
  font-size: 1.35rem;
  line-height: normal;
  color: #7a93bd;
}
.gsk-news__list .blog-list__title { font-size: 1.65rem; font-weight: 400; line-height: normal; }
.gsk-news__list .blog-list__link:hover { background: #f4f8fd; }
.gsk-news__list .blog-list__link:hover .blog-list__title { color: #3560C3; }
.gsk-news__arrow { color: #b9cef0; font-size: 1.5rem; }
@media (max-width: 920px) {
  .gsk-news { grid-template-columns: 1fr; padding: 24px 20px; }
  .gsk-news__list .blog-list__link { grid-template-columns: 90px 1fr auto; gap: 10px; }
}
@media (max-width: 639px) {
  .gsk-news-section { padding-top: 48px; padding-bottom: 48px; }
  .gsk-news__list .blog-list__link { grid-template-columns: 72px 1fr; gap: 6px 10px; }
  .gsk-news__list .blog-list__title { font-size: 1.4rem; font-weight: 400; }
  .gsk-news__arrow { display: none; }
}

/* ==========================================================================
   7. 代表メッセージ（TOP）
   ========================================================================== */
.gsk-message {
  background: #F2F8F0;
  padding: 0 0 10px;
  position: relative;
  overflow: hidden;
}
.gsk-message__inner {
  display: grid;
  grid-template-columns: 57% 45%;
  align-items: center;
  /* 背景装飾（__shisa）より前面に置く */
  position: relative;
  z-index: 1;
}
.gsk-message__photo {
  align-self: stretch;
  min-height: 520px;
  border-right: 6px solid #48B428;
  overflow: hidden;
}
.gsk-message__photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gsk-message__col { padding: 70px 24px 70px 0; }
.gsk-message__card {
  display: grid;
  grid-template-columns: 34px 1fr;
  gap: 26px;
  align-items: start;
  max-width: 640px;
  margin-left: -58px;
  box-sizing: content-box;
  background: #fff;
  border-radius: 28px;
  padding: 44px 46px;
  box-shadow: 0 14px 34px rgba(31, 58, 26, 0.1);
}
.gsk-message__vertical {
  writing-mode: vertical-rl;
  font-family: "Zen Maru Gothic", "Noto Sans JP", sans-serif;
  font-size: 1.3rem;
  font-weight: 700;
  letter-spacing: 0.34em;
  color: #48B428;
  padding-top: 4px;
}
.gsk-message__title {
  margin: 0;
  font-family: "Zen Maru Gothic", "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: clamp(2.2rem, 3.3vw, 3.6rem);
  color: #1c3c6e;
  line-height: 1.6;
}
.gsk-message__bar { display: block; width: 52px; height: 3px; background: #48B428; margin: 24px 0 26px; }
.gsk-message__text { font-size: 1.5rem; line-height: 2.1; color: #2c4266; }
.gsk-message__text p + p { margin-top: 18px; }
.gsk-message__sign {
  margin-top: 32px;
  padding-top: 22px;
  border-top: 1px solid #dfe8d8;
  font-family: "Zen Maru Gothic", "Noto Sans JP", sans-serif;
  font-size: 1.6rem;
  color: #1c3c6e;
}
/* ボタンは gsk-message__col の中で左右中央 */
.gsk-message__btns {
  margin-top: 26px;
  justify-content: center;
}
.gsk-message__wave { margin: 120px 0 -10px; position: relative; }
.gsk-message__wave svg { height: 70px; }

/* 背景右下のシーサー装飾（波の手前・カードの後ろ） */
.gsk-message__shisa {
  position: absolute;
  right: clamp(0px, 1.5vw, 24px);
  bottom: 62px;
  z-index: 0;
  width: clamp(240px, 24vw, 360px);
  height: auto;
  pointer-events: none;
}
@media (max-width: 920px) {
  .gsk-message__wave { margin-top: 74px; }
  .gsk-message__shisa { right: 0; bottom: 62px; width: 190px; }
  .gsk-message__inner { grid-template-columns: 1fr; }
  .gsk-message__photo {
    min-height: 260px;
    border-right: none;
    border-bottom: 6px solid #48B428;
  }
  .gsk-message__col { padding: 0 24px 44px; }
  .gsk-message__card {
    grid-template-columns: 1fr;
    gap: 14px;
    margin-left: 0;
    margin-top: -30px;
    padding: 32px 24px;
    max-width: none;
  }
  .gsk-message__vertical { writing-mode: horizontal-tb; letter-spacing: 0.2em; padding-top: 0; }
  .gsk-message__wave svg { height: 40px; }
}

/* ==========================================================================
   7-2. お悩み → 解決（TOP）
   イラスト（悩んでいる人／解決した人）を上下に並べ、間を矢印でつなぐ。
   画像はS3（img()）。未アップの間は枠だけが表示される。
   ========================================================================== */
.gsk-solve-section { padding-top: 60px; padding-bottom: 60px; }
.gsk-solve {
  margin-top: 26px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: stretch;
  gap: 14px;
}

.gsk-solve__box {
  display: grid;
  grid-template-columns: 1fr;
  align-content: start;
  gap: 14px;
  border-radius: 22px;
  padding: 24px 26px;
}
.gsk-solve__box--worry  { background: #f4f8fd; border: 1px solid #C8DAF3; }
.gsk-solve__box--solved { background: #F2F8F0; border: 1px solid #CBE3BF; }

.gsk-solve__illust { text-align: center; }
.gsk-solve__illust img { width: 100%; max-width: 200px; }

.gsk-solve__list { display: grid; gap: 10px; }
.gsk-solve__list li {
  display: grid;
  grid-template-columns: 28px 1fr;
  align-items: start;
  gap: 12px;
  font-family: "Zen Maru Gothic", "Noto Sans JP", sans-serif;
  font-weight: 500;
  font-size: 1.9rem;
  line-height: 1.6;
  color: #1c3c6e;
}
.gsk-solve__mark {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 999px;
  background: #3560C3;
  color: #fff;
  font-size: 1.4rem;
}
.gsk-solve__box--solved .gsk-solve__mark { background: #48B428; }

.gsk-solve__arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  margin: 0;
  align-self: center;
  transform: rotate(-90deg);
  flex: none;
  border-radius: 999px;
  background: #48B428;
  color: #fff;
  font-size: 2rem;
  box-shadow: 0 6px 16px rgba(72, 180, 40, 0.3);
}

.gsk-solve__title {
  font-family: "Zen Maru Gothic", "Noto Sans JP", sans-serif;
  font-weight: 700;
  /* 2カラム時にタイトルが1行で収まるサイズ */
  font-size: 2.1rem;
  line-height: 1.5;
  color: #1c3c6e;
}
.gsk-solve__bar { display: block; width: 46px; height: 3px; background: #48B428; margin: 12px auto 14px; }
.gsk-solve__text { line-height: 1.9; }
.gsk-solve__btns { margin-top: 26px; }

/* 2カラムだとタイトル・リストが折り返すので縦積みに戻す（矢印も下向き） */
@media (max-width: 1128px) {
  .gsk-solve { grid-template-columns: 1fr; }
  .gsk-solve__arrow { transform: none; margin: 8px auto; }
  .gsk-solve__title { font-size: 2.4rem; }
}

@media (max-width: 920px) {
  .gsk-solve-section { padding-top: 40px; padding-bottom: 40px; }
  .gsk-solve { margin-top: 22px; }
  .gsk-solve__box {
    grid-template-columns: 1fr;
    gap: 16px;
    padding: 22px 20px;
    border-radius: 18px;
  }
  .gsk-solve__illust img { max-width: 190px; }
  .gsk-solve__list li { font-size: 1.5rem; }
  .gsk-solve__title { font-size: 2rem; }
  .gsk-solve__arrow { width: 46px; height: 46px; font-size: 2rem; margin: 10px auto; }
}

@media (max-width: 639px) {
  .gsk-solve__title {
    text-align: center;
    text-wrap: balance;
    word-break: auto-phrase;
  }
  .gsk-solve__text { font-size: 1.4rem; }
  .gsk-solve__list li { gap: 5px; }
  .gsk-solve__mark { width: 22px; height: 22px; font-size: 1.3rem; }
}

/* ==========================================================================
   8. カード列（矢印付き）と物件カード
   ========================================================================== */
.gsk-estate-section {
  background: linear-gradient(180deg, #eaf4fe, #dcebfb);
  padding-top: 80px;
  padding-bottom: 80px;
}

.gsk-slider-row { display: flex; align-items: center; gap: 14px; margin-top: 28px; }
.gsk-slider {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  background: transparent;
  /* カードの影（0 8px 24px）が切れないように上下へ余白を確保 */
  padding: 16px 0 26px;
  margin: -16px 0 -26px;
}
.gsk-slider__track {
  display: flex;
  gap: 22px;
  transition: transform 0.45s ease;
}
.gsk-slider__track > * {
  flex: 0 0 calc((100% - 44px) / 3);
  box-shadow: 0 8px 24px rgba(53, 96, 195, 0.14);
}
.gsk-arrow.is-disabled { opacity: 0.35; pointer-events: none; }
.gsk-arrow {
  flex: none;
  box-sizing: border-box;
  width: 52px;
  height: 52px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  font-size: 1.9rem;
  text-decoration: none;
  transition: all 0.3s ease;
}
.gsk-arrow--outline {
  background: #fff;
  border: 1.5px solid #cddcf3;
  color: #3560C3;
  box-shadow: 0 4px 12px rgba(53, 96, 195, 0.1);
}
.gsk-arrow--solid {
  background: #3560C3;
  color: #fff;
  box-shadow: 0 6px 16px rgba(53, 96, 195, 0.28);
}
.gsk-arrow:hover { opacity: 1; transform: translateY(-2px); }
@media (max-width: 920px) {
  .gsk-slider__track > * { flex: 0 0 calc((100% - 22px) / 2); }
}
@media (max-width: 639px) {
  .gsk-slider__track > * { flex: 0 0 100%; }
  .gsk-estate-section { padding-top: 48px; padding-bottom: 48px; }
  /* 左右の余白を詰めてカードを広く見せ、矢印ボタンはカードの端に半分かぶせる */
  .gsk-estate-section .gsk-pad-x { padding-left: 18px; padding-right: 18px; }
  .gsk-slider-row { position: relative; gap: 0; }
  .gsk-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
    width: 40px;
    height: 40px;
    font-size: 1.6rem;
  }
  .gsk-arrow:hover { transform: translateY(-50%); }
  /* コンテナ左右paddingが18pxなので、それを超えない範囲でカードに半分かぶせる */
  .gsk-arrow--outline { left: -18px; }
  .gsk-arrow--solid { right: -18px; }
}

.gsk-card {
  border-radius: 26px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(53, 96, 195, 0.1);
  color: #22355c;
}
.gsk-card:hover { box-shadow: 0 14px 34px rgba(53, 96, 195, 0.2); }
.gsk-card__img { position: relative; }
.gsk-card__img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gsk-card__body { padding: 18px 20px 22px; }
.gsk-card__meta { display: flex; align-items: center; gap: 8px; }
.gsk-card__title {
  font-family: "Zen Maru Gothic", "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: 1.85rem;
  color: #1c3c6e;
  line-height: 1.6;
  margin: 10px 0 0;
}
.gsk-card__title--sm { font-size: 1.75rem; }
.gsk-card__price { display: flex; align-items: baseline; gap: 10px; margin-top: 8px; }
@media (max-width: 639px) {
  .gsk-card__price { margin-top: 0; }
}
.gsk-price {
  font-family: "Zen Maru Gothic", "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: 2.5rem;
  color: #F7962B;
  line-height: normal;
}
.gsk-price__unit { font-size: 1.5rem; }
.gsk-card__spec { font-size: 1.4rem; line-height: normal; color: #5c7399; }
.gsk-card__text { font-size: 1.35rem; color: #5c7399; margin-top: 8px; line-height: 1.8; }

/* ==========================================================================
   9. 大バナー（TOP）
   ========================================================================== */
.gsk-bnr-section {
  padding-top: 80px;
  padding-bottom: 80px;
}
.gsk-bnr-grid { gap: 24px; }
.gsk-bnr {
  position: relative;
  display: grid;
  place-items: center;
  min-height: 280px;
  border-radius: 28px;
  overflow: hidden;
  box-shadow: 0 10px 28px rgba(53, 96, 195, 0.16);
  text-decoration: none;
}
.gsk-bnr--green { box-shadow: 0 10px 28px rgba(72, 180, 40, 0.18); }
.gsk-bnr__img { position: absolute; inset: 0; width: 100%; height: 100%; }
.gsk-bnr__img img { width: 100%; height: 100%; object-fit: cover; }
.gsk-bnr__overlay--blue  { background: linear-gradient(150deg, rgba(53, 96, 195, 0.72), rgba(20, 50, 110, 0.78)); }
.gsk-bnr__overlay--green { background: linear-gradient(150deg, rgba(72, 180, 40, 0.68), rgba(28, 92, 14, 0.78)); }
.gsk-bnr__body { position: relative; z-index: 2; text-align: center; padding: 24px; }
.gsk-bnr__en { display: block; color: #d7e7ff; font-weight: 700; line-height: normal; letter-spacing: 0.24em; }
.gsk-bnr--green .gsk-bnr__en { color: #e7f7e0; }
.gsk-bnr__title {
  display: block;
  margin-top: 8px;
  font-family: "Zen Maru Gothic", "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: clamp(2.5rem, 3vw, 3.1rem);
  color: #fff;
  line-height: normal;
}
.gsk-bnr__arrow {
  display: inline-grid;
  place-items: center;
  width: 46px;
  height: 46px;
  margin-top: 18px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.92);
  color: #3560C3;
  font-size: 1.9rem;
}
.gsk-bnr--green .gsk-bnr__arrow { color: #3d9a22; }
@media (max-width: 920px) {
  .gsk-bnr-grid { grid-template-columns: 1fr; }
}
@media (max-width: 639px) {
  .gsk-bnr-section { padding-top: 48px; padding-bottom: 48px; }
  .gsk-bnr { min-height: 220px; }
}

/* ==========================================================================
   10. 対応エリア（TOP）
   ========================================================================== */
.gsk-area-section { padding-top: 80px; padding-bottom: 80px; }
/* コンテンツ幅の写真パネル。上下の縁を白い波線で抜く（文字を読ませるため白を薄くかぶせる） */
.gsk-area-panel {
  position: relative;
  overflow: hidden;
  background:
    linear-gradient(rgba(255, 255, 255, 0.68), rgba(255, 255, 255, 0.68)),
    url("https://ros-cdn.s3.ap-northeast-1.amazonaws.com/hp/img/ros_keiyaku/28572/bg-kengai.png") center / cover no-repeat;
  padding: 84px 30px;
}
.gsk-area-panel__wave {
  position: absolute;
  left: 0;
  width: 100%;
  line-height: 0;
}
.gsk-area-panel__wave svg { display: block; width: 100%; height: 40px; }
.gsk-area-panel__wave--top    { top: 0; transform: scaleY(-1); }
.gsk-area-panel__wave--bottom { bottom: 0; }
.gsk-balloon {
  border: none;
  border-radius: 999px;
  padding: 16px 40px;
  box-shadow: 0 8px 20px rgba(53, 96, 195, 0.22);
  font-size: inherit;
}
.gsk-balloon__title {
  margin: 0;
  font-family: "Zen Maru Gothic", "Noto Sans JP", sans-serif;
  font-size: clamp(2.3rem, 3vw, 3.1rem);
  font-weight: 700;
  line-height: normal;
  color: #fff;
}
.gsk-balloon::after {
  bottom: -13px;
  border-left-width: 14px;
  border-right-width: 14px;
  border-top-width: 14px;
}
/* 吹き出しの下三角(13px)分を足して、見出しとリード文の間に余白を取る */
.gsk-area__lead { margin: 28px 0 0; font-size: 1.55rem; font-weight: 700; line-height: 1.9; color: #5c7399; }
.gsk-area__cols { max-width: 1100px; margin: 40px auto 0; align-items: center; }
.gsk-area__cols > .column2__child { width: calc(50% - 28px); }
.gsk-area__map { display: grid; place-items: center; }
.gsk-area__map img { width: 100%; max-width: 300px; height: auto; display: block; }
.gsk-area__title {
  font-family: "Zen Maru Gothic", "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: 2.1rem;
  color: #1c3c6e;
  line-height: normal;
}
.gsk-area__bar { display: block; width: 44px; height: 3px; background: #48B428; margin: 14px 0 20px; }
.gsk-checklist { display: grid; gap: 14px; font-size: 1.6rem; font-weight: 700; color: #3d5480; }
.gsk-checklist li { display: flex; align-items: flex-start; gap: 12px; line-height: 1.8; }
.gsk-checklist__mark {
  flex: none;
  width: 22px;
  height: 22px;
  margin-top: 3px;
  border-radius: 999px;
  background: #48B428;
  color: #fff;
  display: grid;
  place-items: center;
  font-size: 1.2rem;
  font-weight: 700;
}
@media (max-width: 920px) {
  .gsk-area-section { padding-top: 48px; padding-bottom: 48px; }
  .gsk-area__cols > .column2__child { width: 100%; }
  .gsk-area__cols > .column2__child:not(:last-child) { margin-bottom: 30px; }
}
@media (max-width: 639px) {
  .gsk-area__lead { margin: 28px 0 0; font-size: 1.5rem; }
  .gsk-checklist { font-size: 1.4rem; font-weight: 600; }
  .gsk-area-panel { padding: 58px 18px; }
  .gsk-area-panel__wave svg { height: 26px; }
  .gsk-area__map img { max-width: 180px; }
  .gsk-area__text { padding-left: 10px; padding-right: 10px; }
}

/* ==========================================================================
   11. お問い合わせCTAパネル（共通）
   ========================================================================== */
.gsk-cta-section { padding-top: 80px; padding-bottom: 80px; }
.gsk-cta {
  position: relative;
  overflow: hidden;
  box-sizing: content-box;
  border-radius: 32px;
  background: linear-gradient(150deg, #3560C3, #2b4fa5);
  padding: 52px 40px;
  text-align: center;
  box-shadow: 0 16px 36px rgba(53, 96, 195, 0.24);
}
.gsk-cta__bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 65%;
}
.gsk-cta__overlay {
  position: absolute;
  inset: 0;
  /* 暗幕なし（写真そのまま） */
}
.gsk-cta__body { position: relative; z-index: 1; }
.gsk-cta__title {
  margin: 6px 0 0;
  font-family: "Zen Maru Gothic", "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: clamp(2.5rem, 3.2vw, 3.3rem);
  color: #fff;
  line-height: normal;
}
.gsk-cta__text { margin: 14px 0 0; color: #fff; font-weight: 700; font-size: 1.55rem; line-height: 1.9; }
.gsk-cta .gsk-btns { margin-top: 26px; }
.gsk-cta__note { margin-top: 14px; font-size: 1.3rem; color: #fff; font-weight: 700; }
.gsk-cta .gsk-btn--white { color: #3560C3; }
@media (max-width: 639px) {
  .gsk-cta-section { padding-top: 48px; padding-bottom: 48px; }
  .gsk-cta { padding: 36px 20px; border-radius: 24px; }
  .gsk-cta__title { font-size: clamp(2rem, 3.2vw, 3.3rem); }
  .gsk-cta__text { font-size: 1.3rem; }
}

/* ==========================================================================
   12. フッター
   ========================================================================== */
.gsk-footer__wave { display: block; width: 100%; height: auto; margin-bottom: -1px; }
/* 波画像との間に余白を足す（8px + 30px） */
.gsk-footer__body { background: #1476D2; padding: 38px 24px 0; }
/* マップは左カラム（会社情報＋ボタン）の高さに合わせて伸ばす */
.gsk-footer__inner {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
  gap: 44px;
  align-items: stretch;
  max-width: 1240px;
  padding: 0 0 36px;
}
.gsk-footer__left, .gsk-footer__right { width: auto; }
.gsk-footer__name {
  font-family: "Shippori Mincho", "Hiragino Mincho ProN", serif;
  font-weight: 600;
  font-size: 2.2rem;
  color: #fff;
  letter-spacing: 0.06em;
  line-height: normal;
}
.gsk-footer__dl {
  margin: 22px 0 0;
  display: grid;
  grid-template-columns: 88px 1fr;
  row-gap: 11px;
  column-gap: 14px;
  font-size: 1.45rem;
  color: #e6eeff;
  line-height: 1.7;
}
.gsk-footer__dl dt { font-size: 1.35rem; font-weight: 700; color: #BFE0FF; height: fit-content; }
.gsk-footer__dl dd { margin: 0; }
.gsk-footer__btns { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
.gsk-footer__right { height: 100%; }
.gsk-footer__map {
  height: 100%;
  min-height: 240px;
  border-radius: 24px;
  background: #dbe7f7;
  border: 1px solid rgba(255, 255, 255, 0.5);
}
.gsk-footer__navwrap {
  max-width: 1240px;
  margin: 0 auto;
  padding: 26px 24px 34px;
  box-sizing: content-box;
  border-top: 1px solid rgba(255, 255, 255, 0.28);
}
.gsk-footer__nav { flex-direction: row; flex-wrap: wrap; justify-content: center; gap: 10px 22px; font-size: 1.45rem; }
.gsk-footer__nav .footer-body__nav-item a { font-size: 1.45rem; color: #e6eeff; }
.gsk-footer__nav .footer-body__nav-item a:hover { color: #fff; }
.gsk-footer__bottom { background: #0F5DAA; padding: 14px; font-size: 1.25rem; }
.gsk-footer__bottom .footer-bottom__copyright {
  font-family: "Noto Sans JP", sans-serif;
  font-size: 1.25rem;
  letter-spacing: 0.04em;
  line-height: normal;
  color: #cfe0ff;
}
@media (max-width: 920px) {
  .gsk-footer__inner { grid-template-columns: 1fr; gap: 30px; }
  .gsk-footer__map { height: auto; min-height: 0; aspect-ratio: 16 / 10; }
}
@media (max-width: 639px) {
  .gsk-footer__dl { grid-template-columns: 0.5fr 1fr; row-gap: 2px; }
  .gsk-footer__dl dt { margin-top: 8px; }
  /* 所在地・TELは全幅で1行ずつ、営業時間と定休日だけ横並び */
  .gsk-footer__dl dt:nth-child(1), .gsk-footer__dl dd:nth-child(2),
  .gsk-footer__dl dt:nth-child(3), .gsk-footer__dl dd:nth-child(4) {
    grid-column: 1 / -1;
  }
  .gsk-footer__dl dt:nth-child(5) { grid-column: 1; grid-row: 5; }
  .gsk-footer__dl dd:nth-child(6) { grid-column: 1; grid-row: 6; }
  .gsk-footer__dl dt:nth-child(7) { grid-column: 2; grid-row: 5; }
  .gsk-footer__dl dd:nth-child(8) { grid-column: 2; grid-row: 6; }
  /* 3つのボタンはSP固定バー（電話・LINE・お問い合わせ）と重複するため非表示 */
  .gsk-footer__btns { display: none; }
  /* ナビはSPナビ（ハンバーガー）と重複するため非表示 */
  .gsk-footer__navwrap { display: none; }
}

/* ==========================================================================
   13. ページトップ / SP固定バー
   ========================================================================== */
.gsk-spbar__link {
  display: block;
  margin: 2px 4px;
  border-radius: 12px;
  background: #3560C3;
  font-size: 1.15rem;
  font-weight: 700;
  color: #fff;
}
.gsk-spbar__link i { display: block; font-size: 1.7rem; margin-bottom: 3px; color: #fff; }
.gsk-spbar__link--line { background: #48B428; }
.gsk-spbar__link--contact { background: #F7962B; }
.gsk-spbar__label { display: block; }

/* ==========================================================================
   14. 下層ページ共通：ページヒーロー / パンくず
   ========================================================================== */
.gsk-hero {
  padding: 118px 24px 0;
  overflow: hidden;
  text-align: center;
}
.gsk-hero--blue   { --hero-bg: linear-gradient(160deg, #8fd3f4, #3560C3 70%); }
.gsk-hero--green  { --hero-bg: linear-gradient(160deg, #a6de8f, #48B428 72%); }
.gsk-hero--orange { --hero-bg: linear-gradient(160deg, #ffc98a, #F7962B 72%); }
.gsk-hero__bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
/* 写真の上に各ページの色を薄く重ねて白文字を読ませる */
.gsk-hero__overlay { position: absolute; inset: 0; }
.gsk-hero--blue .gsk-hero__overlay   { background: linear-gradient(160deg, rgba(143, 211, 244, 0.72), rgba(53, 96, 195, 0.86) 70%); }
.gsk-hero--green .gsk-hero__overlay  { background: linear-gradient(160deg, rgba(166, 222, 143, 0.7), rgba(72, 180, 40, 0.86) 72%); }
.gsk-hero--orange .gsk-hero__overlay { background: linear-gradient(160deg, rgba(255, 201, 138, 0.7), rgba(247, 150, 43, 0.86) 72%); }
/* 上部の花あしらい（左右・MVと共通の素材） */
.gsk-hero__flower {
  position: absolute;
  top: 0;
  width: clamp(110px, 13vw, 190px);
  height: auto;
  pointer-events: none;
}
.gsk-hero__flower--left  { left: 0; }
.gsk-hero__flower--right { right: 0; }

.gsk-hero__inner { position: relative; z-index: 1; padding-bottom: 104px; }
/* page-hero--solid 側が .page-hero--solid .heading__en（クラス2つ）で
   指定しているため、こちらも .gsk-hero を前置して詳細度を合わせる */
.gsk-hero .gsk-hero__en {
  display: block;
  font-size: 1.5rem;
  font-weight: 700;
  letter-spacing: 0.24em;
  line-height: normal;
  color: #d5e6ff;
  margin-bottom: 0;
}
.gsk-hero--green .gsk-hero__en  { color: #e6f6de; }
.gsk-hero--orange .gsk-hero__en { color: #fff2e0; }
.gsk-hero .gsk-hero__ja {
  margin: 8px 0 0;
  font-family: "Zen Maru Gothic", "Noto Sans JP", sans-serif;
  font-size: clamp(2.7rem, 3.6vw, 3.9rem);
  font-weight: 700;
  letter-spacing: normal;
  line-height: normal;
  color: #fff;
}
.gsk-hero__wave { position: relative; z-index: 1; width: calc(100% + 48px); margin: 0 -24px; }
.gsk-hero__wave svg { height: 56px; }
@media (max-width: 639px) {
  .gsk-pad-x { padding-left: 15px; padding-right: 15px; }
  .gsk-hero { padding: 66px 20px 0; }
  .gsk-hero__flower { width: clamp(80px, 24vw, 120px); }
  .gsk-hero__inner { padding-bottom: 56px; }
  .gsk-hero__wave { width: calc(100% + 40px); margin: 0 -20px; }
  .gsk-hero__wave svg { height: 34px; }
}

/* ==========================================================================
   15. 一覧ページ（物件情報 / リフォーム）
   ========================================================================== */
.gsk-list-section { padding-top: 80px; padding-bottom: 80px; }

.gsk-filter { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
@media (max-width: 639px) {
  .gsk-filter { justify-content: center; }
}
.gsk-filter__item {
  display: inline-block;
  background: #fff;
  color: #3560C3;
  border: 1.5px solid #cddcf3;
  border-radius: 999px;
  padding: 11px 22px;
  font-size: 1.45rem;
  font-weight: 700;
  line-height: normal;
  text-decoration: none;
  transition: all 0.3s ease;
}
.gsk-filter__item:hover { opacity: 1; border-color: #3560C3; }
.gsk-filter__item.is-current { background: #3560C3; color: #fff; border-color: #3560C3; }
.gsk-filter--green .gsk-filter__item { color: #3d9a22; border-color: #cbe6bf; }
.gsk-filter--green .gsk-filter__item:hover { border-color: #48B428; }
.gsk-filter--green .gsk-filter__item.is-current { background: #48B428; color: #fff; border-color: #48B428; }

.gsk-cards { margin-top: 26px; gap: 22px; }

.gsk-ba-thumb { position: relative; display: grid; grid-template-columns: 1fr 1fr; gap: 2px; }
.gsk-ba-thumb__img { aspect-ratio: 1 / 1; overflow: hidden; }
.gsk-ba-thumb__img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gsk-ba-thumb__arrow {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 34px;
  height: 34px;
  border-radius: 999px;
  background: #fff;
  color: #48B428;
  display: grid;
  place-items: center;
  font-size: 1.4rem;
  font-weight: 700;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.14);
}

/* ==========================================================================
   16. 詳細ページ共通（物件詳細 / リフォーム詳細）
   ========================================================================== */
.gsk-detail-title {
  margin: 14px 0 0;
  font-family: "Zen Maru Gothic", "Noto Sans JP", sans-serif;
  font-size: clamp(2rem, 3.4vw, 3.5rem);
  font-weight: 700;
  line-height: 1.5;
  color: #1c3c6e;
}
/* タイトル下の小さなあしらい（緑のショートバー） */
.gsk-detail-title::after {
  content: "";
  display: block;
  width: 44px;
  height: 3px;
  margin-top: 18px;
  background: #48B428;
}
/* --top / --under は片側だけを上書きする（.gsk-detail-title より後に置いて確実に効かせる） */
.gsk-detail-title--top { margin-bottom: 46px; }
.gsk-detail-title--under { margin-top: 26px; }
.gsk-detail-lead { margin: 16px 0 0; font-size: 1.6rem; line-height: 2.1; color: #3d5480; }
/* タイトル＋説明のブロックと写真の間の余白 */
.gsk-detail-head { padding-top: 80px; padding-bottom: 0; }
.gsk-detail-body { padding-top: 80px; padding-bottom: 80px; }
.gsk-detail-h2 { margin: 38px 0 0; }
.gsk-h4 {
  margin: 0;
  font-family: "Zen Maru Gothic", "Noto Sans JP", sans-serif;
  font-size: 2.2rem;
  font-weight: 700;
  line-height: normal;
  color: #1c3c6e;
}

/* -- ギャラリー -- */
.gsk-gallery__main {
  position: relative;
  aspect-ratio: 16 / 10;
  border-radius: 28px;
  overflow: hidden;
  background: #e7eef8;
}
.gsk-gallery__main img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gsk-gallery__nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.92);
  color: #3560C3;
  font-size: 2.1rem;
  display: grid;
  place-items: center;
  cursor: pointer;
  box-shadow: 0 4px 12px rgba(31, 58, 110, 0.18);
}
.gsk-gallery__nav--prev { left: 14px; }
.gsk-gallery__nav--next { right: 14px; }
@media (max-width: 639px) {
  /* スマホはサムネイルタップで切り替えるため、矢印ボタンは非表示 */
  .gsk-gallery__nav { display: none; }
}
.gsk-gallery__thumbs { display: flex; gap: 10px; margin-top: 12px; overflow-x: auto; padding-bottom: 6px; }
.gsk-gallery__thumb {
  flex: none;
  width: 132px;
  aspect-ratio: 4 / 3;
  padding: 0;
  overflow: hidden;
  border: 3px solid transparent;
  border-radius: 14px;
  background: #e7eef8;
  cursor: pointer;
}
.gsk-gallery__thumb.is-current { border-color: #3560C3; }
.gsk-gallery__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }

.gsk-pdf-btns { margin-top: 34px; }
.gsk-btn--pdf {
  padding: 20px 56px;
  font-size: 1.8rem;
  font-family: "Zen Maru Gothic", "Noto Sans JP", sans-serif;
  box-shadow: 0 8px 20px rgba(53, 96, 195, 0.26);
}

/* -- 物件概要テーブル（dl grid） -- */
.gsk-spec { display: grid; margin-top: 16px; border-top: 1px solid #e2e9f5; }
.gsk-spec dt {
  padding: 14px 16px;
  background: #f4f8fd;
  border-bottom: 1px solid #e2e9f5;
  font-size: 1.4rem;
  font-weight: 700;
  line-height: normal;
  color: #3560C3;
  text-align: center;
}
.gsk-spec dd {
  min-height: 1.9em;
  margin: 0;
  padding: 14px 16px;
  border-bottom: 1px solid #e2e9f5;
  font-size: 1.45rem;
  line-height: normal;
  color: #33507d;
}
.gsk-spec--2 { grid-template-columns: 200px 1fr; }
.gsk-spec--4 { grid-template-columns: 150px 1fr 150px 1fr; margin-top: 34px; }
.gsk-spec--wide { grid-template-columns: 150px 1fr; margin-top: 0; border-top: 0; }
.gsk-spec--wide dd { line-height: 1.9; }
.gsk-spec--works { margin-top: 16px; border-top: 1px solid #e2e9f5; }
.gsk-spec--works dd { font-size: 1.5rem; line-height: normal; }
.gsk-spec--outline { grid-template-columns: 180px 1fr; margin-top: 18px; }
.gsk-spec--outline dt { padding: 16px; text-align: left; }
.gsk-spec--outline dd { padding: 16px; font-size: 1.5rem; line-height: 1.9; }
@media (max-width: 920px) {
  .gsk-spec--4 { grid-template-columns: 130px 1fr; }
}
@media (max-width: 639px) {
  .gsk-spec--2, .gsk-spec--4, .gsk-spec--wide, .gsk-spec--outline { grid-template-columns: 105px 1fr; }
  .gsk-spec dt, .gsk-spec dd,
  .gsk-spec--outline dt, .gsk-spec--outline dd { padding: 12px 10px; }
  .gsk-spec dd { font-size: 1.4rem; }
}

.gsk-detail-cta { display: grid; gap: 14px; margin-top: 34px; }
.gsk-btnrow .gsk-btn { flex: 1; min-width: 200px; padding: 16px; font-size: 1.6rem; }
.gsk-btnrow .gsk-btn--tel { padding: 15px; font-size: 2rem; }
.gsk-detail-cta__note { margin: 0; text-align: center; font-size: 1.3rem; color: #7a93bd; }

/* ==========================================================================
   17. リフォーム 詳細（BEFORE / AFTER）
   ========================================================================== */
.gsk-ba-section { padding-top: 80px; padding-bottom: 0; }
.gsk-ba { margin-bottom: 40px; }
.gsk-ba__grid { gap: 16px; }
.gsk-ba__label {
  display: inline-block;
  border-radius: 999px;
  padding: 8px 22px;
  font-size: 1.5rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  line-height: normal;
  color: #fff;
}
.gsk-ba__label--before { background: #8b7d64; }
.gsk-ba__label--after  { background: #48B428; }
.gsk-ba__img { margin-top: 10px; aspect-ratio: 4 / 3; border-radius: 20px; overflow: hidden; }
.gsk-ba__img img { width: 100%; height: 100%; object-fit: cover; display: block; }

.gsk-works-spec { padding-top: 80px; padding-bottom: 80px; }
.gsk-works-cta { padding-top: 80px; padding-bottom: 80px; }
.gsk-greenbox { border-radius: 28px; background: #F2F8F0; padding: 34px; text-align: center; }
.gsk-greenbox__title {
  font-family: "Zen Maru Gothic", "Noto Sans JP", sans-serif;
  font-size: 2.3rem;
  font-weight: 700;
  line-height: normal;
  color: #1c3c6e;
}
.gsk-greenbox__text { margin: 12px 0 0; font-size: 1.5rem; line-height: 2; color: #4a608a; }
.gsk-greenbox__btns { margin-top: 22px; }
@media (max-width: 639px) {
  .gsk-greenbox { padding: 26px 20px; }
  .gsk-greenbox__title { font-size: 2rem; }
  .gsk-greenbox__text { font-size: 1.4rem; text-wrap: balance; word-break: auto-phrase; }
}
.gsk-btn--md  { padding: 15px 28px; font-size: 1.55rem; }
.gsk-btn--md2 { padding: 17px 28px; font-size: 1.55rem; }

/* ==========================================================================
   18. 売りたい方へ（FLOW / FAQ）
   ========================================================================== */
.gsk-h2--sm { font-size: clamp(2.5rem, 3.2vw, 3.1rem); margin-top: 6px; }

.gsk-flow-section { padding-top: 80px; padding-bottom: 80px; }
.gsk-steps { margin-top: 36px; }
.gsk-step {
  display: grid;
  grid-template-columns: 112px 1fr;
  border-radius: 16px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 4px 14px rgba(53, 96, 195, 0.08);
}
.gsk-step__num {
  background: #3560C3;
  color: #fff;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 2px;
  padding: 22px 10px;
}
.gsk-step__label {
  font-family: "Zen Maru Gothic", "Noto Sans JP", sans-serif;
  font-size: 1.2rem;
  letter-spacing: 0.14em;
  line-height: normal;
  text-align: center;
}
.gsk-step__no {
  font-family: "Zen Maru Gothic", "Noto Sans JP", sans-serif;
  font-size: 3.1rem;
  font-weight: 700;
  line-height: 1;
  color: #fff;
  text-align: center;
}
.gsk-step__body { padding: 22px 26px; }
.gsk-step__title {
  font-family: "Zen Maru Gothic", "Noto Sans JP", sans-serif;
  font-size: 2rem;
  font-weight: 700;
  line-height: normal;
  color: #1c3c6e;
}
.gsk-step__text { margin: 8px 0 0; font-size: 1.5rem; line-height: 1.95; color: #4a608a; }
.gsk-step__arrow { display: flex; justify-content: center; padding: 10px 0; }
.gsk-step__arrow svg { width: 18px; height: 11px; }
@media (max-width: 920px) {
  .gsk-step { grid-template-columns: 1fr; }
  .gsk-step__num { padding: 14px 10px; }
}
@media (max-width: 639px) {
  .gsk-step__text { font-size: 1.4rem; line-height: 1.8; }
}

.gsk-faq-section { padding-top: 80px; padding-bottom: 80px; }
.gsk-faq__lead { margin: 12px 0 0; font-size: 1.5rem; line-height: normal; color: #5c7399; }
.gsk-faqs { display: grid; gap: 12px; margin-top: 26px; }
.gsk-faq { background: #fff; border-radius: 22px; box-shadow: 0 5px 16px rgba(53, 96, 195, 0.07); overflow: hidden; }
.gsk-faq__head { display: flex; align-items: center; gap: 14px; padding: 20px 24px; list-style: none; cursor: pointer; }
.gsk-faq__head::-webkit-details-marker { display: none; }
.gsk-faq__q {
  flex: none;
  width: 30px;
  height: 30px;
  border-radius: 10px;
  background: #eaf2fc;
  color: #3560C3;
  display: grid;
  place-items: center;
  font-family: "Zen Maru Gothic", "Noto Sans JP", sans-serif;
  font-size: 1.7rem;
  font-weight: 700;
}
.gsk-faq__title {
  font-family: "Zen Maru Gothic", "Noto Sans JP", sans-serif;
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 1.6;
  color: #1c3c6e;
}
.gsk-faq__mark { margin-left: auto; color: #b9cef0; font-size: 1.9rem; line-height: 1; }
.gsk-faq__mark::before { content: "＋"; }
.gsk-faq[open] .gsk-faq__mark::before { content: "－"; }
.gsk-faq__body { padding: 0 24px 24px 68px; font-size: 1.5rem; line-height: 2.1; color: #4a608a; }
/* プライバシーポリシー：Qバッジが無いので左paddingを他方向に合わせる */
.gsk-privacy__body { padding-left: 24px; }
.gsk-privacy__body p + p,
.gsk-privacy__body p + h3,
.gsk-privacy__body h3 + p,
.gsk-privacy__body ul + h3 { margin-top: 16px; }
.gsk-privacy__heading {
  font-family: "Zen Maru Gothic", "Noto Sans JP", sans-serif;
  font-size: 1.6rem;
  font-weight: 700;
  color: #1c3c6e;
}
.gsk-privacy__list { margin-top: 10px; padding-left: 1.2em; }
.gsk-privacy__list li + li { margin-top: 6px; }
@media (max-width: 639px) {
  .gsk-privacy__body { padding-left: 18px; }
}
@media (max-width: 639px) {
  .gsk-faq__head { padding: 16px 18px; }
  .gsk-faq__body { padding: 0 18px 18px 18px; }
  .gsk-faq__title { font-size: 1.5rem; }
  .gsk-faq__body { font-size: 1.35rem; }
}

.gsk-sell-cta { padding-top: 80px; padding-bottom: 80px; }
.gsk-cta--plain { box-sizing: border-box; border-radius: 30px; padding: 44px 34px; }
.gsk-cta--plain .gsk-cta__title { margin-top: 0; }
.gsk-cta--plain .gsk-cta__text { margin-top: 12px; line-height: 2; }
.gsk-cta--plain .gsk-btns { margin-top: 24px; }
.gsk-cta--plain .gsk-btn--tel { padding: 16px 28px; font-size: 2rem; }
.gsk-cta__title--sm { font-size: clamp(2.3rem, 3vw, 2.9rem); }

/* 右余白のイラスト（枠から少しはみ出す） */
.gsk-cta--illust { overflow: visible; }
.gsk-cta__illust {
  position: absolute;
  right: -22px;
  bottom: -20px;
  z-index: 2;
  width: clamp(140px, 13vw, 185px);
  height: auto;
  pointer-events: none;
}
@media (max-width: 1080px) {
  .gsk-cta__illust { display: none; }
}
@media (max-width: 639px) {
  .gsk-cta--plain { padding: 32px 20px; }
}

/* ==========================================================================
   19. 会社概要
   ========================================================================== */
.gsk-msgbox-section { padding-top: 80px; padding-bottom: 80px; }
.gsk-msgbox { position: relative; overflow: hidden; background: #F2F8F0; border-radius: 30px; padding: 36px; }
.gsk-msgbox__body { position: relative; }
.gsk-msgbox__en { display: block; line-height: normal; }
.gsk-msgbox__title {
  margin: 6px 0 0;
  font-family: "Zen Maru Gothic", "Noto Sans JP", sans-serif;
  font-size: clamp(2.3rem, 3vw, 2.9rem);
  font-weight: 700;
  line-height: normal;
  color: #1c3c6e;
}
.gsk-msgbox__placeholder {
  box-sizing: content-box;
  margin-top: 20px;
  min-height: 180px;
  padding: 24px;
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.6);
  display: grid;
  place-items: center;
  font-size: 1.5rem;
  color: #7a93bd;
}

.gsk-profile-heading { margin-top: 60px; }
.gsk-profile { grid-template-columns: 0.9fr 1.1fr; gap: 26px; margin-top: 18px; align-items: start; }
.gsk-wbox { background: #fff; border-radius: 26px; padding: 26px; box-shadow: 0 6px 20px rgba(53, 96, 195, 0.08); }
.gsk-wbox__title {
  font-family: "Zen Maru Gothic", "Noto Sans JP", sans-serif;
  font-size: 1.8rem;
  font-weight: 700;
  line-height: normal;
  color: #3560C3;
}
.gsk-wbox__list { margin: 14px 0 0; padding-left: 1.1em; font-size: 1.5rem; line-height: 2.2; color: #4a608a; }
.gsk-wbox__list li { margin-bottom: 0; }
.gsk-dashlist { display: grid; gap: 10px; margin-top: 14px; }
.gsk-dashlist__item { border: 1.5px dashed #cddcf3; border-radius: 14px; padding: 14px 16px; font-size: 1.4rem; color: #7a93bd; }
.gsk-dashlist__item--wait { display: grid; place-items: center; min-height: 92px; }

.gsk-outline-section { padding-top: 80px; padding-bottom: 80px; }
.gsk-outline-section .heading { margin-bottom: 24px; }
.gsk-outline__access { margin-top: 60px; }

.gsk-access { grid-template-columns: 1.1fr 0.9fr; gap: 24px; align-items: stretch; }
.gsk-access__map { border-radius: 28px; background: #dbe7f7; border: 1px solid #c6d8f2; min-height: 280px; }
.gsk-access__box { padding: 28px; border-radius: 28px; }
.gsk-access__title {
  font-family: "Zen Maru Gothic", "Noto Sans JP", sans-serif;
  font-size: 2rem;
  font-weight: 700;
  line-height: normal;
  color: #1c3c6e;
}
.gsk-access__text { margin: 12px 0 0; font-size: 1.5rem; line-height: 2.1; color: #4a608a; }
.gsk-access__btns { display: grid; gap: 10px; margin-top: 20px; }
.gsk-access__btns .gsk-btn--tel { padding: 14px; font-size: 2rem; }
@media (max-width: 920px) {
  .gsk-profile, .gsk-access { grid-template-columns: 1fr; }
}

/* ==========================================================================
   20. お問い合わせ
   ========================================================================== */
.gsk-ways-section { padding-top: 80px; padding-bottom: 0; }
.gsk-ways { gap: 16px; }
.gsk-way {
  display: block;
  background: #fff;
  border-radius: 24px;
  padding: 24px;
  box-shadow: 0 6px 20px rgba(53, 96, 195, 0.08);
  text-align: center;
  text-decoration: none;
  color: #22355c;
  transition: all 0.3s ease;
}
a.gsk-way:hover { opacity: 1; transform: translateY(-3px); }
.gsk-way--line { background: #48B428; color: #fff; box-shadow: 0 6px 20px rgba(72, 180, 40, 0.2); }
.gsk-way--tel { background: #3560C3; color: #fff; box-shadow: 0 6px 20px rgba(53, 96, 195, 0.28); }
.gsk-way--tel .gsk-way__label,
.gsk-way--tel .gsk-way__note { color: #d5e6ff; }
.gsk-way--tel .gsk-way__main--tel { color: #fff; }
.gsk-way__label { font-size: 1.25rem; font-weight: 700; letter-spacing: 0.1em; color: #7a93bd; }
.gsk-way--line .gsk-way__label { color: #e2f7d9; }
.gsk-way__main {
  margin-top: 6px;
  font-family: "Zen Maru Gothic", "Noto Sans JP", sans-serif;
  font-size: 2.3rem;
  font-weight: 700;
  line-height: normal;
}
.gsk-way__main--tel { font-size: 2.7rem; color: #3560C3; }
.gsk-way__main--sm { font-size: 1.8rem; color: #1c3c6e; }
.gsk-way__note { margin-top: 6px; font-size: 1.25rem; color: #5c7399; }
.gsk-way--line .gsk-way__note { color: #e2f7d9; }

.gsk-form-section { padding-top: 80px; padding-bottom: 80px; }
.gsk-form__title { margin: 0 0 18px; }
.gsk-form { background: #fff; border-radius: 30px; padding: 36px; box-shadow: 0 10px 28px rgba(53, 96, 195, 0.1); }
.gsk-form__rows { display: grid; gap: 26px; }
.gsk-form__grid { gap: 20px; }
.gsk-form__label { display: block; margin-bottom: 10px; font-size: 1.45rem; font-weight: 700; line-height: normal; color: #1c3c6e; }
.gsk-form__block .gsk-form__label { margin-bottom: 0; }
.gsk-form__req { margin-left: 6px; font-size: 1.25rem; color: #F7962B; }
.gsk-form__radios { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 12px; }
.gsk-radio {
  display: flex;
  align-items: center;
  gap: 8px;
  border: 1.5px solid #d6e2f3;
  border-radius: 999px;
  padding: 12px 20px;
  font-size: 1.5rem;
  cursor: pointer;
}
.gsk-radio input, .gsk-check input { width: auto; accent-color: #3560C3; }
.gsk-form__field { display: block; }
.gsk-input {
  width: 100%;
  background: #fff;
  border: 1.5px solid #d6e2f3;
  border-radius: 14px;
  padding: 14px 16px;
  font-family: inherit;
  font-size: 1.55rem;
  color: #22355c;
}
.gsk-input:focus { border-color: #3560C3; box-shadow: 0 0 0 3px rgba(53, 96, 195, 0.12); outline: none; }
.gsk-form__privacy { background: #f4f8fd; border-radius: 20px; padding: 22px; }
.gsk-form__privacy-text { margin: 0; font-size: 1.4rem; line-height: 2; color: #4a608a; }
.gsk-check {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 14px;
  font-size: 1.5rem;
  font-weight: 700;
  color: #1c3c6e;
  cursor: pointer;
}
.gsk-form__privacy-note { margin: 10px 0 0; font-size: 1.2rem; color: #7a93bd; }
.gsk-btn--submit {
  width: 100%;
  padding: 19px;
  font-size: 1.8rem;
  font-family: "Zen Maru Gothic", "Noto Sans JP", sans-serif;
  box-shadow: 0 8px 20px rgba(247, 150, 43, 0.32);
}
.gsk-form__foot { margin: 0; text-align: center; font-size: 1.35rem; line-height: 1.9; color: #7a93bd; }
@media (max-width: 639px) {
  .gsk-form__foot { text-align: left; }
}
@media (max-width: 639px) {
  .gsk-form { padding: 24px 18px; border-radius: 24px; }
  .gsk-list-section, .gsk-form-section, .gsk-works-cta, .gsk-sell-cta,
  .gsk-detail-body, .gsk-works-spec, .gsk-flow-section, .gsk-faq-section,
  .gsk-msgbox-section, .gsk-outline-section { padding-top: 48px; padding-bottom: 48px; }
  .gsk-ways-section, .gsk-ba-section { padding-top: 48px; padding-bottom: 0; }
  .gsk-detail-head { padding-top: 48px; }
}

/* ==========================================================================
   21. CMSお問い合わせフォーム（cms_ajax / design_pattern=2）の見た目上書き
   ------------------------------------------------------------------------
   CMS は実行時に mail-form.css を <link> で body に差し込むため、
   site.css より後ろのスタイルシートになる。クラスだけの指定では負けるので
   #cms-contact-1-1-area（ID）で詳細度を上げて上書きしている。
   ラベル上・入力欄下の縦積み ＋ デザイン（claude-design-output）の
   入力欄・必須ラベル・送信ボタンに合わせる。
   ========================================================================== */
#cms-contact-1-1-area .form-contents { padding: 0; }
#cms-contact-1-1-area .form-pattern-2 { background: transparent; border-radius: 0; }
#cms-contact-1-1-area form dl { margin-bottom: 0; }

/* -- 項目名（dt）：2カラムfloatを解除して入力欄の上に積む -- */
#cms-contact-1-1-area form dl dt:not(.pattern-exclusion) {
  float: none;
  width: auto;
  margin: 26px 0 0;
  padding: 0 0 10px;
  font-size: 1.45rem;
  font-weight: 700;
  line-height: normal;
  color: #1c3c6e;
}
#cms-contact-1-1-area form dl dt:not(.pattern-exclusion):first-child { margin-top: 0; }
#cms-contact-1-1-area form dl dd:not(.pattern-exclusion) {
  margin: 0;
  padding: 0;
  border-bottom: 0;
}

/* -- 必須ラベル：デザインどおり項目名の右にオレンジ文字で出す -- */
#cms-contact-1-1-area dt span.required {
  display: inline-flex;
  flex-direction: row-reverse;
  align-items: baseline;
}
#cms-contact-1-1-area dt span.required::before {
  margin: 0 0 0 6px;
  padding: 0;
  border-radius: 0;
  top: 0;
  background: transparent;
  color: #F7962B;
  font-size: 1.25rem;
  font-weight: 700;
}

/* -- 入力欄 -- */
#cms-contact-1-1-area .textarea,
#cms-contact-1-1-area .textarea-serect,
#cms-contact-1-1-area .textarea-date,
#cms-contact-1-1-area .textarea-time,
#cms-contact-1-1-area .textarea-datetime,
#cms-contact-1-1-area .textarea-datetimepicker {
  /* CMSのHTMLは input に size="70" が付くため、幅は必ずこちらで上書きする
     （CDNの mail-form.css が読み込まれない場合でも横あふれしない） */
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  height: auto;
  padding: 14px 16px;
  background: #fff;
  border: 1.5px solid #d6e2f3;
  border-radius: 14px;
  font-family: inherit;
  font-size: 1.55rem;
  color: #22355c;
}
#cms-contact-1-1-area input.textarea { height: auto; }
#cms-contact-1-1-area .textarea:focus,
#cms-contact-1-1-area .textarea-serect:focus {
  border-color: #3560C3;
  box-shadow: 0 0 0 3px rgba(53, 96, 195, 0.12);
  outline: none;
}
#cms-contact-1-1-area .textarea::placeholder { color: #9db2d3; }

/* -- 送信ボタン：デザインのオレンジpillに合わせる -- */
#cms-contact-1-1-area .submit-btn {
  width: 100%;
  max-width: none;
  margin: 26px auto 0;
  padding: 19px;
  background: #F7962B;
  border: 0;
  border-radius: 999px;
  color: #fff;
  font-family: "Zen Maru Gothic", "Noto Sans JP", sans-serif;
  font-size: 1.8rem;
  font-weight: 700;
  box-shadow: 0 8px 20px rgba(247, 150, 43, 0.32);
  transition: all 0.3s ease;
}
#cms-contact-1-1-area .submit-btn::before { display: none; }
#cms-contact-1-1-area .submit-btn:hover {
  background: #F7962B;
  color: #fff;
  transform: translateY(-2px);
}

/* -- 送信完了メッセージ・エラーメッセージ -- */
#cms-contact-1-1-area .form-thanks-msg {
  padding: 36px 24px;
  border: 0;
  border-radius: 20px;
  background: #f4f8fd;
  box-shadow: none;
}
#cms-contact-1-1-area .form-thanks-msg .thanks-msg-area {
  font-size: 1.55rem;
  line-height: 2;
  color: #22355c;
}
#cms-contact-1-1-area .form-thanks-msg .back-home-btn a {
  width: 260px;
  padding: 14px 5px;
  background: #fff;
  border: 1.5px solid #b9cef0;
  border-radius: 999px;
  color: #3560C3;
  font-size: 1.5rem;
  letter-spacing: normal;
}
#cms-contact-1-1-area .form-thanks-msg .back-home-btn a:hover { background: #eaf2fc; }
#cms-contact-1-1-area .form-err-msg {
  margin: 0 0 20px;
  border-radius: 14px;
  font-size: 1.45rem;
  line-height: 1.9;
}

/* -- フォーム下の注記 -- */
.gsk-form__after { margin-top: 22px; display: grid; gap: 14px; }
.gsk-form__after .gsk-form__privacy-text {
  background: #f4f8fd;
  border-radius: 20px;
  padding: 22px;
}
@media (max-width: 639px) {
  #cms-contact-1-1-area .submit-btn { font-size: 1.6rem; padding: 16px; }
}

/* -- カテゴリ絞り込みの表示/非表示（common.js が is-hidden を付ける） -- */
.gsk-cards .is-hidden { display: none; }
.gsk-cards__empty {
  grid-column: 1 / -1;
  margin: 10px 0 0;
  padding: 30px 20px;
  background: #f4f8fd;
  border-radius: 20px;
  text-align: center;
  font-size: 1.5rem;
  color: #5c7399;
}

/* ==========================================================================
   22. お知らせ（ブログCMS）一覧・詳細
   ========================================================================== */
.gsk-entry-section { padding-top: 80px; padding-bottom: 80px; }

/* -- 一覧 -- */
.gsk-entry-list { border-top: 1px solid #d9e4f4; }
.gsk-entry-list .blog-list__item { border-bottom: 1px dashed #d9e4f4; }
.gsk-entry-list .blog-list__link {
  display: grid;
  grid-template-columns: 110px 1fr auto;
  align-items: center;
  gap: 14px;
  padding: 18px 4px;
  color: #22355c;
}
.gsk-entry-list .blog-list__link:hover { background: #f4f8fd; }
/* 矢印は非表示（お知らせ一覧では使わない） */
.gsk-entry-list .gsk-news__arrow { display: none; }
.gsk-entry-list .blog-list__date {
  font-family: "Noto Sans JP", sans-serif;
  font-size: 1.35rem;
  line-height: normal;
  color: #7a93bd;
}
.gsk-entry-list .blog-list__title { font-size: 1.65rem; font-weight: 400; line-height: 1.6; }
.gsk-entry-list .blog-list__link:hover .blog-list__title { color: #3560C3; }

/* -- 詳細 -- */
.gsk-entry__date {
  display: block;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 1.35rem;
  color: #7a93bd;
}
.gsk-entry__title {
  margin: 10px 0 0;
  padding-bottom: 22px;
  border-bottom: 1px solid #e2e9f5;
  font-family: "Zen Maru Gothic", "Noto Sans JP", sans-serif;
  font-size: clamp(2.2rem, 3vw, 2.9rem);
  font-weight: 700;
  line-height: 1.5;
  color: #1c3c6e;
}
.gsk-entry__body { margin-top: 26px; font-size: 1.5rem; line-height: 2.1; color: #3d5480; }
.gsk-entry__body > div { overflow: visible; }
.gsk-entry__pager { margin-top: 40px; }
.gsk-entry__pager .pages {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: space-between;
}
.gsk-entry__pager .pages a {
  display: inline-flex;
  align-items: center;
  color: #3560C3;
  font-size: 1.4rem;
  font-weight: 700;
  transition: all 0.3s ease;
}
.gsk-entry__pager .pages a:hover { color: #F7962B; opacity: 1; }
.gsk-entry__pager .page_prev { margin-left: auto; }
.gsk-entry__back { margin-top: 28px; }

/* -- サイドバー（月別アーカイブ） -- */
.gsk-side__title {
  font-family: "Zen Maru Gothic", "Noto Sans JP", sans-serif;
  font-size: 1.7rem;
  font-weight: 700;
  line-height: normal;
  color: #1c3c6e;
  padding-bottom: 12px;
  border-bottom: 2px solid #3560C3;
}
.gsk-side__nav { margin-top: 6px; }
.gsk-side__nav li { border-bottom: 1px dashed #d9e4f4; }
.gsk-side__nav li:first-child { border-top: none; }
.gsk-side__nav a { font-size: 1.45rem; color: #22355c; padding: 13px 4px; }
.gsk-side__nav a::after { color: #b9cef0; }

@media (max-width: 920px) {
  .gsk-entry-section { padding-top: 48px; padding-bottom: 48px; }
}
@media (max-width: 639px) {
  .gsk-entry-list .blog-list__link { grid-template-columns: 100px 1fr; gap: 8px; }
}
