@charset "UTF-8";
/*
 * ======================================
 * 追加クラス一覧（共通SCSS取り込み検討用）
 * ======================================
 *
 * .agm-header / .agm-logo / .agm-nav / .agm-header__tel  - sticky白ヘッダー・テキストロゴ・EN+JP2段ナビ・電話ブロック
 * .agm-eyebrow(--light/--sm)                             - Montserrat英字ラベル（見出し上の小ラベル）
 * .agm-sec-title(--sm)                                   - セクション日本語見出し（clamp可変）
 * .agm-media                                             - 角丸・aspect比の画像枠
 * .agm-btn(--green/--white/--navy)                       - デザイン固有のCTAボタン
 * .agm-mv                                                - メインビュー（写真＋グラデ＋テキスト、角丸下カット）
 * .agm-greet-grid / .agm-service-grid / .agm-service-detail-grid / .agm-feature-grid / .agm-works-grid
 *                                                        - auto-fitグリッド（比率可変で折返し）
 * .agm-feature-wrap / .agm-feature-card                  - 選ばれる理由の角丸大枠＋白カード
 * .agm-svc-card / .agm-more                              - 事業内容カード＋「詳しく見る→」リンク
 * .agm-cta                                               - 写真＋グラデCTA帯
 * .agm-page-hero                                         - 下層ページのグラデヒーロー
 * .agm-table                                             - 会社概要の角丸2カラム表
 * .agm-pill / .agm-checks / .agm-specs                   - 事業内容の導入ピル・チェックリスト・仕様リスト
 * .agm-step(--navy/--light)                              - 問い合わせの流れステップ（交互配色）
 * .agm-form / .agm-input / .agm-fieldset                 - 問い合わせフォーム
 * .agm-works-list / .agm-work-case / .agm-ba-img / .agm-ba-arrow / .agm-ba-cap - 施工実績ビフォーアフター（画像2枚＋矢印）
 * .agm-note / .agm-muted                                 - 補足・注釈テキスト
 *
 * ======================================
 * 共通SCSSに不足していたもの（5分類）
 * ======================================
 * ・構造不足 : 「小さい英字ラベル＋大きい日本語見出し」の縦積み見出し（共通heading系は英字が主役の構成）
 * ・構造不足 : 2行テキストロゴ（アクセント語＋ドット）／EN+JP2段の可変幅ナビ
 * ・構造不足 : auto-fit可変グリッド（共通grid-2/3/4は固定列）
 * ・装飾パターン不足 : 交互配色のステップ帯／ビフォーアフター比較カード
 * ・値の粒度不足 : clamp()による流体タイポ／角丸16〜28pxの大きめradius
 */

/* ==========================================================================
   共通トークン（デザイン基準色）
   base=#26436f  navy2=#1f3050  accent=#8ba2d3  green=#04fe01
   ========================================================================== */
:root {
  --agm-navy: #26436f;
  --agm-navy-d: #1f3050;
  --agm-blue: #8ba2d3;
  --agm-green: #04fe01;
  --agm-line: #e4ebf6;
  --agm-line2: #eef3fa;
  --agm-soft: #f5f8fc;
  --agm-muted: #7688a3;
}

/* ==========================================================================
   フォント基盤（英字=Montserrat / 和文見出し=Noto Sans JP 700 / 本文=Lato 400）
   ========================================================================== */
body {
  font-family: "Lato", "Noto Sans JP", "游ゴシック体", YuGothic, "Yu Gothic", "ヒラギノ角ゴ ProN", sans-serif;
  font-weight: 400;
  line-height: 1.85;
  letter-spacing: normal;
}
h1, h2, h3, h4, h5, h6 {
  font-family: "Noto Sans JP", "游ゴシック体", YuGothic, "Yu Gothic", "ヒラギノ角ゴ ProN", sans-serif;
  font-weight: 700;
}

/* ==========================================================================
   汎用：ラベル・見出し・画像枠
   ========================================================================== */
.agm-eyebrow {
  display: inline-block;
  font-family: "Montserrat", sans-serif;
  font-weight: 500;
  letter-spacing: 0.04em;
  text-transform: none;
  color: var(--agm-navy);
  font-size: clamp(2.6rem, 3.6vw, 3.8rem);
  line-height: 1.1;
}
/* ヒーロー・カード用の英語ラベルは従来どおり小さく */
.agm-eyebrow--light {
  color: #bfe9c0;
  font-size: 1.3rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  line-height: 1;
}
.agm-eyebrow--sm {
  color: var(--agm-blue);
  font-size: 1.2rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  line-height: 1;
}

/* 日本語は英語見出しの下に小さく添える */
.agm-sec-title {
  font-size: clamp(1.6rem, 2.2vw, 2rem);
  color: var(--agm-navy);
  font-weight: 700;
  line-height: 1.6;
  margin-top: 6px;
}
.agm-sec-title--sm { font-size: clamp(1.5rem, 2vw, 1.8rem); }

.agm-media {
  aspect-ratio: 4 / 3;
  border-radius: 16px;
  overflow: hidden;
}
.agm-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.agm-media--16-10 { aspect-ratio: 16 / 10; }

.agm-note { text-align: center; margin-top: 26px; font-size: 1.35rem; color: var(--agm-muted); }
.agm-muted { color: var(--agm-muted); }
.agm-lead-strong { color: #3a5b9b; font-weight: 500; }

/* フェードイン（common.js の data-fade 用） */
[data-fade] { opacity: 0; transform: translateY(16px); transition: opacity .7s ease, transform .7s ease; }
[data-fade].is-in { opacity: 1; transform: none; }

/* ==========================================================================
   ボタン
   ========================================================================== */
.agm-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 16px 34px;
  border: none;
  border-radius: 12px;
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.3;
  text-decoration: none;
  cursor: pointer;
  transition: transform .25s ease, opacity .25s ease, box-shadow .25s ease, background .25s ease;
}
.agm-btn:hover { transform: translateY(-2px); opacity: 1; }
.agm-btn--green {
  padding: 16px 40px;
  border-radius: 10px;
  background: var(--agm-green);
  color: #0b2a12;
  box-shadow: 0 10px 30px rgba(4, 254, 1, 0.28);
}
.agm-btn--white { background: #fff; color: var(--agm-navy); font-family: "Montserrat", sans-serif; }
.agm-btn--navy { background: var(--agm-navy); color: #fff; }

/* ==========================================================================
   ヘッダー
   ========================================================================== */
.agm-header {
  position: sticky;
  top: 0;
  background: #fff;
  border-bottom: 1px solid #eef1f6;
  box-shadow: none;
}
.agm-header__inner {
  max-width: 1280px;
  height: auto;
  padding: 14px 26px;
  gap: 24px;
}

/* ロゴ */
.agm-logo { display: flex; flex-direction: column; line-height: 1.2; flex-shrink: 0; text-decoration: none; }
.agm-logo__sub { font-weight: 700; font-size: 1.1rem; letter-spacing: 0.1em; color: #5b6b86; }
.agm-logo__main {
  display: flex; align-items: center; gap: 8px; white-space: nowrap;
  font-weight: 700; font-size: clamp(1.7rem, 2.1vw, 2.2rem); color: var(--agm-navy-d);
}
.agm-logo__accent { color: var(--agm-blue); }

/* PCナビ（EN+JP 2段） */
.agm-nav { gap: 8px; }
.agm-nav .header__nav-item a { padding: 6px 14px 5px; }
.agm-nav .header__nav-en {
  font-family: "Montserrat", sans-serif; font-size: 1.6rem; font-weight: 500;
  color: #33445e; letter-spacing: 0.02em; line-height: 1;
}
.agm-nav .header__nav-ja {
  font-family: "Noto Sans JP", sans-serif; font-weight: 700; font-size: 1.3rem;
  color: #8296ab; margin-top: 3px;
}
/* ホバー下線は中央基点で幅だけ広げる（left値は動かさない） */
.agm-nav .header__nav-item a::after {
  background: var(--agm-green); height: 2px;
  left: 50%; transform: translateX(-50%); width: 0;
  transition: width 0.3s ease;
}
.agm-nav .header__nav-item a:hover::after { left: 50%; width: 80%; }
.agm-nav .header__nav-item--current a::after { left: 50%; transform: translateX(-50%); width: 100%; }
.agm-nav .header__nav-item--current .header__nav-en { color: var(--agm-navy); }

/* 電話ブロック */
.agm-header__right { gap: 0; }
.agm-header__tel { display: flex; flex-direction: column; align-items: flex-end; text-decoration: none; }
.agm-header__tel-label { font-size: 1.1rem; color: #8296ab; letter-spacing: 0.08em; }
.agm-header__tel-num {
  font-family: "Montserrat", sans-serif; font-weight: 700; font-size: 2.6rem;
  white-space: nowrap; color: var(--agm-navy-d); line-height: 1.1;
}
.agm-header__tel-icon { font-size: 0.72em; color: #8ba2d3; margin-right: 0.35em; vertical-align: middle; }

body.is-nav-open { overflow: hidden; }

/* ==========================================================================
   メインビュー
   ========================================================================== */
.agm-mv { padding: 0 30px; }
#slideshow {
  position: relative;
  height: clamp(480px, 76vh, 760px);
  overflow: hidden;
  border-radius: 0 0 28px 28px;
}
/* CMSスライダー（内部Swiper）が外枠#slideshowの高さいっぱいに追従するように。
   Swiper本体のスライド配置は干渉しないよう上書きしない（絶対配置にしない）。 */
#cms-slider-1-1-area { position: absolute; inset: 0; z-index: 0; }
#cms-slider-1-1-area .slideshow,
#cms-slider-1-1-area .swiper,
#cms-slider-1-1-area .swiper-wrapper { width: 100%; height: 100%; }
.agm-mv .swiper-slide { height: 100%; overflow: hidden; }
.agm-mv .swiper-slide img { width: 100%; height: 100%; object-fit: cover; display: block; }
.agm-mv__overlay { position: absolute; inset: 0; z-index: 1; background: linear-gradient(rgba(18,34,60,0.3), rgba(18,34,60,0.34)); pointer-events: none; }
.agm-mv__side {
  position: absolute; left: 24px; bottom: 56px; z-index: 2;
  writing-mode: vertical-rl; transform: rotate(180deg);
  font-family: "Montserrat", sans-serif; font-weight: 600; letter-spacing: 0.3em;
  font-size: 1.15rem; color: rgba(255,255,255,0.85);
}
.agm-mv__bar { position: absolute; left: 0; bottom: 0; z-index: 2; width: 190px; height: 5px; background: var(--agm-green); }
.agm-mv__content {
  position: absolute; inset: 0; z-index: 2; display: flex; flex-direction: column;
  align-items: center; justify-content: center; text-align: center; padding: 0 26px;
}
.agm-mv__eyebrow { display: flex; align-items: center; gap: 16px; margin-bottom: 22px; }
.agm-mv__eyebrow span:first-child {
  font-family: "Montserrat", sans-serif; font-weight: 600; letter-spacing: 0.28em;
  font-size: 1.3rem; color: #fff;
}
.agm-mv__eyebrow-line { width: 46px; height: 1px; background: rgba(255,255,255,0.7); display: inline-block; }
.agm-mv__title {
  font-size: clamp(3.4rem, 6vw, 6.8rem); font-weight: 700; color: #fff;
  line-height: 1.32; margin: 0 0 26px; letter-spacing: 0.03em;
  text-shadow: 0 2px 26px rgba(15,30,55,0.28);
}
.agm-mv__lead {
  font-size: clamp(1.5rem, 1.9vw, 1.8rem); color: #fff; line-height: 2;
  margin: 0 0 32px; font-weight: 500; text-shadow: 0 1px 14px rgba(15,30,55,0.35);
}

/* ==========================================================================
   セクション共通ラッパー（余白・最大幅）
   ========================================================================== */
.agm-sec { padding: clamp(6.4rem, 9vw, 11rem) 26px; }
.agm-sec--w1080 { max-width: 1080px; margin: 0 auto; }
.agm-sec--w1300 { max-width: 1300px; margin: 0 auto; }
.agm-sec--w1200 { max-width: 1200px; margin: 0 auto; }
.agm-sec--w1000 { max-width: 1000px; margin: 0 auto; }
.agm-sec--w900 { max-width: 900px; margin: 0 auto; }
.agm-sec--w820 { max-width: 820px; margin: 0 auto; }
.agm-sec-head { text-align: center; margin-bottom: clamp(3.6rem, 5vw, 5.8rem); }

/* 下層ページ用のセクション上下余白バリエーション */
.agm-pad-top    { padding: clamp(56px, 8vw, 96px) 26px 0; }
.agm-pad-mid    { padding: clamp(40px, 6vw, 64px) 26px clamp(56px, 8vw, 90px); }
.agm-pad-bottom { padding: 0 26px clamp(64px, 9vw, 110px); }
.agm-pad-svc-intro { padding: clamp(56px, 8vw, 90px) 26px 0; }
.agm-pad-svc-body  { padding: clamp(40px, 6vw, 60px) 26px clamp(64px, 9vw, 110px); }
.agm-pad-flow   { padding: clamp(56px, 8vw, 90px) 26px 80px; }
.agm-pad-form   { padding: clamp(48px, 7vw, 80px) 26px clamp(64px, 9vw, 110px); }
.agm-pad-works  { padding: clamp(56px, 8vw, 90px) 26px clamp(64px, 9vw, 110px); }
.agm-prose p { margin: 0 0 16px; }
.agm-prose p:last-child { margin-bottom: 0; }

/* ==========================================================================
   ごあいさつ（TOP）
   ========================================================================== */
.agm-greet-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: clamp(3.2rem, 5vw, 6.4rem); align-items: center;
}
.agm-greet-photos {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(1.6rem, 2.4vw, 2.6rem);
  align-items: start;
}
.agm-greet-photo {
  position: relative;
  border-radius: 16px;
}
.agm-greet-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 16px;
  position: relative;
  z-index: 1;
}
.agm-greet-photo--tall  { grid-column: 1; grid-row: 1 / span 2; align-self: stretch; }
.agm-greet-photo--small { grid-column: 2; grid-row: 1; aspect-ratio: 4 / 3; }
.agm-greet-photo--main  { grid-column: 2; grid-row: 2; aspect-ratio: 4 / 3; }
.agm-greet-photo::after {
  content: "";
  position: absolute;
  right: -16px;
  bottom: -16px;
  z-index: 0;
  width: 100%;
  height: 100%;
  background: #8ba2d3;
  border-radius: 16px;
}
.agm-greet-grid .agm-sec-title { margin: 8px 0 22px; }
.agm-greet-grid p { margin: 0 0 16px; }
.agm-greet-grid p:last-child { margin-bottom: 0; }

/* スマホ：写真3枚を縦積み */
@media (max-width: 600px) {
  .agm-greet-photos { grid-template-columns: 1fr; }
  .agm-greet-photo--tall  { grid-column: 1; grid-row: auto; aspect-ratio: 4 / 3; }
  .agm-greet-photo--small,
  .agm-greet-photo--main  { grid-column: 1; grid-row: auto; }
  .agm-greet-photo::after { right: -12px; bottom: -12px; }
}

/* ==========================================================================
   選ばれる理由（TOP）
   ========================================================================== */
.agm-feature-band { background: #fff; padding: clamp(4rem, 6vw, 7.2rem) 0; }
.agm-feature-wrap {
  margin: 10px 30px; background: var(--agm-line2); border-radius: 28px;
  padding: clamp(4.8rem, 7vw, 9rem) clamp(2.4rem, 5vw, 6.4rem);
}
.agm-feature-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 22px;
}
.agm-feature-card {
  background: #fff; border-radius: 16px; padding: 32px 26px; border: 1px solid var(--agm-line);
  transition: transform .3s ease, box-shadow .3s ease;
}
.agm-feature-card:hover { transform: translateY(-4px); box-shadow: 0 14px 30px rgba(38,67,111,0.08); }
.agm-feature-card__illust {
  aspect-ratio: 4 / 3; border-radius: 12px; overflow: hidden; margin-bottom: 20px;
}
.agm-feature-card__illust img { width: 100%; height: 100%; object-fit: cover; display: block; background: #e6effd; }
.agm-feature-card__no {
  font-family: "Montserrat", sans-serif; font-weight: 700; font-size: 2.2rem;
  color: var(--agm-green); display: flex; align-items: baseline; gap: 2px;
}
.agm-feature-card__no span { font-size: 1.4rem; color: var(--agm-blue); }
.agm-feature-card h3 { font-size: 1.9rem; color: var(--agm-navy); font-weight: 700; margin: 12px 0 8px; }
.agm-feature-card p { margin: 0; font-size: 1.45rem; }

/* ==========================================================================
   事業内容カード（TOP）
   ========================================================================== */
/* 全幅バンド：幾何学パターン背景（サイトのブルー #8ba2d3 / ソフト #f5f8fc に配色） */
.agm-svc-band {
  background-image:
    linear-gradient(-164deg, rgba(139,162,211,0.05) 0%, rgba(139,162,211,0.05) 25%, transparent 25%, transparent 96%, rgba(139,162,211,0.03) 96%, rgba(139,162,211,0.03) 100%),
    linear-gradient(236deg, rgba(139,162,211,0.04) 0%, rgba(139,162,211,0.04) 53%, transparent 53%, transparent 59%, rgba(245,248,252,0.7) 59%, rgba(245,248,252,0.7) 100%),
    linear-gradient(265deg, rgba(139,162,211,0.04) 0%, rgba(139,162,211,0.04) 46%, transparent 46%, transparent 71%, rgba(139,162,211,0.05) 71%, rgba(139,162,211,0.05) 100%),
    linear-gradient(316deg, rgba(245,248,252,0.8) 0%, rgba(245,248,252,0.8) 26%, transparent 26%, transparent 49%, rgba(245,248,252,0.9) 49%, rgba(245,248,252,0.9) 100%),
    linear-gradient(90deg, #fff, #fff);
}
.agm-service-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 24px;
}
.agm-svc-card {
  border: 1px solid var(--agm-line); border-radius: 16px; overflow: hidden; background: #fff;
  transition: transform .3s ease, box-shadow .3s ease;
}
.agm-svc-card:hover { transform: translateY(-4px); box-shadow: 0 16px 34px rgba(38,67,111,0.1); }
.agm-svc-card__media { aspect-ratio: 16 / 10; overflow: hidden; }
.agm-svc-card__media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .5s ease; }
.agm-svc-card:hover .agm-svc-card__media img { transform: scale(1.05); }
.agm-svc-card__body { padding: 26px 24px 28px; }
.agm-svc-card__body h3 { font-size: 2rem; color: var(--agm-navy); font-weight: 700; margin: 6px 0 12px; }
.agm-svc-card__body p { margin: 0 0 18px; font-size: 1.45rem; }
.agm-more {
  font-weight: 700; font-size: 1.4rem; color: var(--agm-navy);
  display: inline-flex; align-items: center; gap: 6px; text-decoration: none;
}
.agm-more span { color: var(--agm-green); transition: transform .25s ease; }
.agm-more:hover { color: var(--agm-navy); opacity: 1; }
.agm-more:hover span { transform: translateX(4px); }

/* ==========================================================================
   お問い合わせCTA帯
   ========================================================================== */
.agm-cta {
  background: linear-gradient(135deg, rgba(31,48,80,0.82), rgba(58,91,155,0.72)),
              url(https://ros-cdn.s3.ap-northeast-1.amazonaws.com/hp/img/ros_keiyaku/28392/contact-bg.jpg) center / cover no-repeat;
  padding: clamp(6.4rem, 9vw, 11rem) 26px;
  color: #fff;
}
.agm-cta .agm-eyebrow--light { font-size: 3.8rem; }
.agm-cta .agm-sec-title { color: #fff; }
.agm-cta__lead { max-width: 620px; margin: 0 auto 34px; color: rgba(255,255,255,0.9); }
.agm-cta__btns {
  display: inline-grid; grid-auto-flow: column; grid-auto-columns: 1fr;
  gap: 14px; justify-content: center;
}
/* 立体的なCTAボタン（下方向のソリッド影＋ドロップシャドウ、ホバーで押し込む） */
.agm-cta .agm-btn--white,
.agm-cta .agm-btn--navy {
  font-size: 1.7rem; padding: 16px 34px;
  position: relative;
  transition: transform .12s ease, box-shadow .12s ease;
}
.agm-cta .agm-btn--white {
  background: linear-gradient(#ffffff, #eef3fa);
  box-shadow: 0 7px 0 #aebfda, 0 14px 22px rgba(15, 30, 55, 0.28);
}
.agm-cta .agm-btn--navy {
  background: linear-gradient(#2f4f82, var(--agm-navy));
  box-shadow: 0 7px 0 #14233d, 0 14px 22px rgba(8, 18, 38, 0.4);
}
.agm-cta .agm-btn--white:hover,
.agm-cta .agm-btn--navy:hover {
  transform: translateY(4px);
}
.agm-cta .agm-btn--white:hover { box-shadow: 0 3px 0 #aebfda, 0 7px 14px rgba(15, 30, 55, 0.25); }
.agm-cta .agm-btn--navy:hover  { box-shadow: 0 3px 0 #14233d, 0 7px 14px rgba(8, 18, 38, 0.35); }
.agm-cta .agm-btn--white:active,
.agm-cta .agm-btn--navy:active {
  transform: translateY(7px);
}
.agm-cta .agm-btn--white:active { box-shadow: 0 0 0 #aebfda, 0 3px 8px rgba(15, 30, 55, 0.22); }
.agm-cta .agm-btn--navy:active  { box-shadow: 0 0 0 #14233d, 0 3px 8px rgba(8, 18, 38, 0.32); }
.agm-cta__tel-icon { font-size: 0.82em; margin-right: 0.4em; vertical-align: middle; }

/* ==========================================================================
   下層ページヒーロー
   ========================================================================== */
.agm-page-hero {
  background: linear-gradient(135deg, rgba(38,67,111,0.82) 0%, rgba(58,91,155,0.72) 100%),
              url(https://ros-cdn.s3.ap-northeast-1.amazonaws.com/hp/img/ros_keiyaku/28392/page-hero.jpg) center / cover no-repeat;
  padding: clamp(4.8rem, 7vw, 8rem) 0;
}
.agm-page-hero__inner { max-width: 1200px; margin: 0 auto; padding: 0 26px; }
.agm-page-hero__title { font-size: clamp(2.6rem, 4vw, 4.2rem); font-weight: 700; margin: 8px 0 0; color: #fff; }

/* ==========================================================================
   会社概要テーブル
   ========================================================================== */
.agm-table { border: 1px solid var(--agm-line); border-radius: 16px; overflow: hidden; }
.agm-table__row { display: grid; grid-template-columns: minmax(120px, 190px) 1fr; border-bottom: 1px solid var(--agm-line2); }
.agm-table__row:last-child { border-bottom: none; }
.agm-table__th { background: var(--agm-soft); padding: 16px 22px; font-weight: 700; color: var(--agm-navy); font-size: 1.45rem; }
.agm-table__td { padding: 16px 22px; font-size: 1.45rem; word-break: break-word; }
.agm-map { border: 1px solid var(--agm-line); border-radius: 16px; overflow: hidden; }
.agm-map iframe { width: 100%; height: 400px; border: 0; display: block; }

/* ==========================================================================
   事業内容ページ
   ========================================================================== */
.agm-pill {
  display: inline-flex; align-items: center; gap: 10px; background: var(--agm-line2);
  border-radius: 999px; padding: 10px 22px; color: var(--agm-navy); font-weight: 700; font-size: 1.5rem;
}
.agm-pill__dot { width: 8px; height: 8px; border-radius: 50%; background: var(--agm-green); display: inline-block; flex-shrink: 0; }
.agm-pill__text { text-align: center; }

.agm-service-detail { display: flex; flex-direction: column; gap: clamp(4rem, 6vw, 7.2rem); }
.agm-service-detail-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: clamp(2.8rem, 4vw, 4.8rem); align-items: start;
}
.agm-service-detail-grid .agm-sec-title { font-size: clamp(2.1rem, 2.6vw, 2.8rem); margin: 6px 0 14px; }
.agm-service-detail-grid p { margin: 0 0 14px; }

.agm-checks { list-style: none; padding: 0; margin: 0 0 14px; display: flex; flex-direction: column; gap: 8px; }
.agm-checks li { display: flex; gap: 10px; align-items: flex-start; font-size: 1.45rem; }
.agm-checks li::before { content: "\2713"; color: var(--agm-green); font-weight: 700; }

.agm-specs { border-top: 1px solid var(--agm-line); padding-top: 16px; }
.agm-specs__item { display: flex; gap: 10px; padding: 5px 0; font-size: 1.4rem; color: #5b6b86; }
.agm-specs__item::before { content: "\30FB"; color: var(--agm-blue); }

/* ==========================================================================
   問い合わせの流れ（ステップ）
   ========================================================================== */
.agm-steps { display: flex; flex-direction: column; gap: 22px; }
.agm-step {
  display: flex; flex-wrap: wrap; align-items: center; gap: clamp(1.6rem, 3vw, 3rem);
  border-radius: 18px; padding: clamp(2.4rem, 4vw, 3.8rem) clamp(2.4rem, 4vw, 4.4rem);
}
.agm-step--navy { background: var(--agm-navy); }
.agm-step--light { background: #fff; border: 1.5px solid #cdd9ec; }
.agm-step__num { flex: 0 0 auto; width: 78px; text-align: center; }
.agm-step__label { font-family: "Montserrat", sans-serif; font-weight: 600; font-size: 1.3rem; letter-spacing: 0.16em; }
.agm-step__no { font-family: "Montserrat", sans-serif; font-weight: 700; font-size: 4.2rem; line-height: 1.05; }
.agm-step__body { flex: 1 1 0; min-width: 180px; }
.agm-step__body h3 { margin: 0 0 10px; font-size: 1.9rem; font-weight: 700; letter-spacing: 0.02em; }
.agm-step__body p { margin: 0; font-size: 1.45rem; line-height: 1.9; }
.agm-step__icon { flex: 0 0 auto; width: 72px; height: 72px; display: flex; align-items: center; justify-content: center; }
.agm-step__icon img { width: 100%; height: 100%; object-fit: contain; }
/* 配色（濃紺ステップ＝白文字・白アイコン／白ステップ＝紺文字・紺アイコン） */
.agm-step--navy .agm-step__label { color: rgba(255,255,255,0.7); }
.agm-step--navy .agm-step__no,
.agm-step--navy .agm-step__body h3 { color: #fff; }
.agm-step--navy .agm-step__body p { color: rgba(255,255,255,0.9); }
.agm-step--navy .agm-step__icon img { filter: brightness(0) invert(1); }
.agm-step--light .agm-step__label { color: var(--agm-blue); }
.agm-step--light .agm-step__no,
.agm-step--light .agm-step__body h3 { color: var(--agm-navy); }
.agm-step--light .agm-step__body p { color: #33445e; }
.agm-step--light .agm-step__icon img {
  filter: brightness(0) saturate(100%) invert(23%) sepia(23%) saturate(1400%) hue-rotate(184deg) brightness(94%) contrast(88%);
}

/* ==========================================================================
   問い合わせフォーム
   ========================================================================== */
.agm-form { display: flex; flex-direction: column; gap: 20px; }
.agm-form__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 20px; }
.agm-form label.agm-field { display: flex; flex-direction: column; gap: 7px; font-weight: 700; font-size: 1.4rem; color: var(--agm-navy); }
.agm-req { color: var(--agm-green); }
.agm-input {
  padding: 13px 14px; border: 1px solid #d8e2f1; border-radius: 10px;
  font-size: 1.5rem; font-weight: 400; color: #33445e; background: #fff; width: 100%; font-family: inherit;
  outline: none; transition: border-color .2s ease;
}
.agm-input:focus { border-color: var(--agm-blue); }
textarea.agm-input { resize: vertical; }
.agm-fieldset { border: 1px solid #d8e2f1; border-radius: 12px; padding: 18px 20px; margin: 0; }
.agm-fieldset legend { font-weight: 700; font-size: 1.4rem; color: var(--agm-navy); padding: 0 8px; }
.agm-radio-row { display: flex; gap: 22px; flex-wrap: wrap; margin-top: 6px; }
.agm-radio { display: flex; align-items: center; gap: 8px; font-size: 1.45rem; font-weight: 400; }
.agm-radio input { accent-color: var(--agm-navy); }
.agm-vehicle-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 16px; margin-top: 6px; }
.agm-field--sm { display: flex; flex-direction: column; gap: 6px; font-size: 1.3rem; font-weight: 500; color: #5b6b86; }
.agm-field--sm .agm-input { padding: 11px 13px; border-radius: 9px; font-size: 1.4rem; }
.agm-form__submit { align-self: center; padding: 16px 48px; }

/* ==========================================================================
   施工実績（ビフォーアフター）
   ========================================================================== */
.agm-works-note { text-align: center; color: var(--agm-muted); font-size: 1.45rem; margin: 0 0 clamp(36px, 5vw, 56px); }

/* ビフォーアフター：画像2枚を横並び＋中央に緑の矢印、キャプションは画像下 */
.agm-works-list { display: flex; flex-direction: column; gap: clamp(44px, 6vw, 80px); }
/* 事例1件分（見出し＋ビフォーアフター） */
.agm-work-item { width: 100%; max-width: 980px; margin: 0 auto; }
.agm-work-item__title {
  font-size: clamp(1.6rem, 2.2vw, 2rem);
  font-weight: 700;
  line-height: 1.6;
  color: var(--agm-navy);
  border-left: 4px solid var(--agm-green);
  padding-left: 14px;
  margin: 0 0 clamp(16px, 2vw, 24px);
}
.agm-work-case {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  column-gap: clamp(16px, 3vw, 44px);
  row-gap: 16px;
  align-items: center;
  width: 100%;
  max-width: 980px;
  margin: 0 auto;
}
.agm-ba-img {
  aspect-ratio: 4 / 3;
  border: 1px solid var(--agm-line);
  border-radius: 10px;
  background: var(--agm-soft);
  overflow: hidden;
  display: flex; align-items: center; justify-content: center;
  color: #9aabc7; font-size: 1.35rem; letter-spacing: 0.04em;
}
.agm-ba-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
/* 画像リンク（lightboxポップアップ）のホバー演出 */
a.agm-ba-img { cursor: zoom-in; padding: 0; transition: box-shadow .25s ease, transform .25s ease; }
a.agm-ba-img:hover { box-shadow: 0 12px 26px rgba(31, 48, 80, 0.18); transform: translateY(-2px); }
a.agm-ba-img img { transition: transform .4s ease; }
a.agm-ba-img:hover img { transform: scale(1.05); }
.agm-ba-img--before { grid-column: 1; grid-row: 1; }
.agm-ba-img--after  { grid-column: 3; grid-row: 1; }
.agm-ba-cap {
  grid-row: 2;
  font-family: "Montserrat", sans-serif;
  font-weight: 700;
  font-size: clamp(1.7rem, 2.2vw, 2.2rem);
  color: var(--agm-navy);
  text-align: center;
  letter-spacing: 0.02em;
}
.agm-ba-cap--before { grid-column: 1; }
.agm-ba-cap--after  { grid-column: 3; }
.agm-ba-arrow {
  grid-column: 2; grid-row: 1;
  justify-self: center;
  width: 0; height: 0;
  border-top: 13px solid transparent;
  border-bottom: 13px solid transparent;
  border-left: 22px solid #1f3050;
}

/* スマホ：縦積み＋下向き矢印 */
@media (max-width: 600px) {
  .agm-work-case { grid-template-columns: 1fr; max-width: 420px; }
  .agm-ba-img--before { grid-column: 1; grid-row: 1; }
  .agm-ba-cap--before { grid-column: 1; grid-row: 2; }
  .agm-ba-arrow       { grid-column: 1; grid-row: 3; transform: rotate(90deg); margin: 6px 0; }
  .agm-ba-img--after  { grid-column: 1; grid-row: 4; }
  .agm-ba-cap--after  { grid-column: 1; grid-row: 5; }
}

/* ==========================================================================
   フッター
   ========================================================================== */
.agm-footer { background: var(--agm-navy-d); padding: clamp(48px, 7vw, 72px) 0 0; }
.agm-footer .footer-body__inner { max-width: 1200px; padding: 0 26px; gap: 40px; }
.agm-footer__col { color: rgba(255,255,255,0.82); }
.agm-footer__brand { font-family: "Montserrat", sans-serif; font-weight: 700; letter-spacing: 0.24em; color: var(--agm-blue); font-size: 1.2rem; }
.agm-footer__name { font-weight: 700; font-size: 1.9rem; color: #fff; margin: 2px 0 16px; }
.agm-footer__txt { margin: 0 0 6px; font-size: 1.4rem; }
.agm-footer__btns { display: flex; gap: 14px; margin-top: 22px; flex-wrap: wrap; }
.agm-footer__btn {
  display: inline-flex; align-items: center; justify-content: center;
  width: 52px; height: 52px; padding: 0; border-radius: 50%;
  background: transparent; border: 2px solid var(--agm-green);
  color: var(--agm-green); font-size: 1.9rem; line-height: 1;
  text-decoration: none; transition: background .25s ease, color .25s ease;
}
.agm-footer__btn:hover { background: var(--agm-green); color: #0b2a12; opacity: 1; }
.agm-footer__heading { font-family: "Montserrat", sans-serif; font-weight: 600; letter-spacing: 0.14em; color: var(--agm-blue); font-size: 1.2rem; margin-bottom: 14px; }
.agm-footer__nav { display: flex; flex-direction: column; }
.agm-footer__nav a { display: block; padding: 7px 0; color: rgba(255,255,255,0.82); font-size: 1.4rem; text-decoration: none; }
.agm-footer__nav a:hover { color: #fff; opacity: 1; }
.agm-footer__map { border-radius: 12px; }
.agm-footer__map iframe { width: 100%; height: 190px; border: 0; display: block; }
.agm-footer-bottom {
  background: var(--agm-navy-d); text-align: left; padding: 36px 0 0;
}
.agm-footer-bottom .footer-bottom__copyright {
  max-width: 1200px; margin: 0 auto; padding: 30px 26px;
  border-top: 1px solid rgba(255,255,255,0.12); font-size: 1.25rem; color: rgba(255,255,255,0.5);
}

/* ページトップ（アイコン中央寄せ） */
.page-top__link { display: flex; align-items: center; justify-content: center; }

/* ==========================================================================
   レスポンシブ
   ========================================================================== */
@media (max-width: 1080px) {
  .agm-header__inner { padding: 12px 20px; }
}

/* SPのみ改行（PCでは非表示、SPで表示）※メディアクエリより前に定義して打ち消されないようにする */
.br-sp { display: none; }

@media (max-width: 640px) {
  .agm-sec { padding: 56px 20px; }

  /* --- メインビュー（スマホ調整） --- */
  .agm-mv { padding: 0 12px; }
  #slideshow { height: clamp(440px, 78vh, 560px); border-radius: 0 0 16px 16px; }
  .agm-mv__side { display: none; }
  .agm-mv__bar { width: 120px; height: 4px; }
  .agm-mv__content { padding: 0 20px; }
  .agm-mv__eyebrow { gap: 10px; margin-bottom: 14px; }
  .agm-mv__eyebrow span:first-child { font-size: 1.05rem; letter-spacing: 0.16em; }
  .agm-mv__eyebrow-line { width: 26px; }
  .agm-mv__title { font-size: clamp(2.6rem, 8vw, 3.4rem); line-height: 1.4; margin-bottom: 16px; }
  .agm-mv__lead { font-size: 1.4rem; line-height: 1.85; margin-bottom: 24px; }
  .agm-mv .agm-btn--green { padding: 13px 24px; font-size: 1.45rem; }

  .agm-table__row { grid-template-columns: 1fr; }
  .agm-table__th { border-bottom: 1px solid var(--agm-line2); }
  .agm-step { justify-content: center; text-align: left; }
  .agm-footer .footer-body__inner { grid-template-columns: 1fr; }
  .agm-cta__btns { grid-auto-flow: row; }
  .br-sp { display: inline; }
  .agm-footer__col--menu { display: none; }
}

/* 問い合わせの流れ：スマホは縦積み中央寄せ（STEP番号→アイコン→見出し→説明） */
@media (max-width: 600px) {
  .agm-step {
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: center;
    text-align: center;
    gap: 10px;
    padding: clamp(2.8rem, 8vw, 3.8rem) 2rem;
  }
  .agm-step__num { order: 1; width: auto; }
  .agm-step__icon { order: 2; width: 64px; height: 64px; margin: 6px 0 2px; }
  .agm-step__body { order: 3; width: 100%; min-width: 0; }
  .agm-step__body h3 { text-align: center; }
  .agm-step__body p { text-align: left; }
}

/* MVテキストの極小画面フォールバック */
@media (max-width: 380px) {
  .agm-mv__title { font-size: 2.4rem; }
  .agm-mv__eyebrow span:first-child { font-size: 0.95rem; letter-spacing: 0.1em; }
  .agm-mv__content { padding: 0 16px; }
}

/* 送信完了ページ：ボタン上の余白 */
.thanks-actions { margin-top: 50px; }

/* ==========================================================================
   事業内容ページ：サービス詳細（画像＋テキスト 左右交互）
   ========================================================================== */
.svc-blocks { display: flex; flex-direction: column; gap: clamp(40px, 6vw, 72px); }

/* サービスカード（ダークバー＋左テキスト・右画像） */
.svc-card2 {
  background: #fff;
  border: 1px solid var(--agm-line);
  border-radius: 18px;
  box-shadow: 0 22px 50px rgba(31, 48, 80, 0.10);
  overflow: hidden;
}

/* 上部ダークバー＋右端の緑ディテール */
.svc-card2__bar {
  position: relative;
  overflow: hidden;
  background: #333;
  padding: 20px clamp(24px, 4vw, 42px);
}
.svc-card2__bar::after {
  content: "";
  position: absolute;
  top: 0; bottom: 0; right: -40px;
  width: clamp(90px, 12vw, 170px);
  background: #8ba2d3;
  transform: skewX(-20deg);
}
.svc-card2__en {
  position: relative; z-index: 1;
  display: block;
  font-family: "Montserrat", sans-serif; font-weight: 500;
  font-size: 1.2rem; letter-spacing: 0.18em; text-transform: uppercase;
  color: rgba(255, 255, 255, 0.6); margin-bottom: 4px;
}
.svc-card2__title {
  position: relative; z-index: 1;
  margin: 0;
  font-size: clamp(2rem, 2.8vw, 2.6rem); font-weight: 700; color: #fff;
  line-height: 1.3;
}

/* 本体：左テキスト・右画像 */
.svc-card2__body {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(28px, 4vw, 56px);
  align-items: start;
  padding: clamp(28px, 4vw, 44px) clamp(24px, 4vw, 42px);
}
.svc-card2__lead {
  font-size: 1.8rem; font-weight: 700; color: var(--agm-navy-d);
  line-height: 1.7; margin: 0 0 24px;
}
.svc-card2__figure {
  border-radius: 12px; overflow: hidden;
  aspect-ratio: 4 / 3;
  box-shadow: 0 14px 32px rgba(31, 48, 80, 0.12);
}
.svc-card2__figure img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* ポイント：緑見出し＋グレー説明＋緑の点線区切り */
.svc-points { margin: 0; display: flex; flex-direction: column; gap: 18px; }
.svc-point { padding-bottom: 16px; border-bottom: 2px dotted #8ba2d3; }
.svc-point:last-child { border-bottom: none; padding-bottom: 0; }
.svc-point dt {
  font-weight: 700; font-size: 1.6rem; color: #1f3050;
  letter-spacing: 0.02em; margin-bottom: 6px;
}
.svc-point dt::before {
  content: "\2713";
  color: var(--agm-green);
  font-weight: 700;
  margin-right: 8px;
}
.svc-point dd { margin: 0; font-size: 1.4rem; color: #5a6b82; line-height: 1.8; }

@media (max-width: 860px) {
  .svc-card2__body { grid-template-columns: 1fr; }
  .svc-card2__figure { order: -1; }
}

/* ==========================================================================
   CMSフォーム（cms_ajax）出力の上書き
   ※CMSが出力する .form-pattern-1 / .submit-btn 等をサイトのデザインに合わせる
   ========================================================================== */
/* 送信ボタン：サイトのボタン（.agm-btn--navy）デザイン＋中央配置 */
.submit-btn {
  display: block !important;
  width: -webkit-fit-content !important;
  width: fit-content !important;
  margin: 8px auto 0 !important;
  padding: 16px 48px !important;
  border: none !important;
  border-radius: 12px !important;
  background: var(--agm-navy) !important;
  color: #fff !important;
  font-family: "Lato", "Noto Sans JP", sans-serif !important;
  font-size: 1.6rem !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  text-align: center !important;
  cursor: pointer !important;
  transition: transform .25s ease, opacity .25s ease, background .25s ease !important;
}
.submit-btn:hover { transform: translateY(-2px) !important; opacity: .95 !important; }

/* 必須ラベル：赤バッジ「必須」→ サイトのグリーンの「＊」 */
.form-pattern-1 dl dt:not(.pattern-exclusion) span.required::before {
  content: '＊' !important;
  color: var(--agm-green) !important;
  background: transparent !important;
  padding: 0 !important;
  margin: 0 2px !important;
  font-weight: 700 !important;
}