@charset "utf-8";
/* =========================================================
   サービス特徴（管理） /kanri/  ページ固有CSS
   出どころ：現行 https://aircon.co.jp/kanri/assets/css/style.css?v=31 （2026/08/28 取得）
   ★本文（No.2以降のセクション）は1文字も変えていない。

   現行から外したのは1か所だけ：
     「No.1 ヘッダー」章（元 79〜266行）を丸ごと削除。
     理由：確定版ヘッダー（assets/header.css）と .topbar / .container / .brand /
     .contact / .hours / .head-btn / .gnav / .header-inner などクラス名が全部ぶつかり、
     古い指定が確定版ヘッダーに漏れて崩れるため。ヘッダーのHTMLも確定版に差し替え済みで、
     この章はもう使われていない。
   ※ .container（ベース章）は本文では使っていないが、現行のまま残してある。

   ヘッダー／サイドバー／CTA／フッターは確定版（assets/header.css・sidebar.css・
   cta/cta.css・footer.css・company.css）を読み込んで使う。このファイルには書かない。
   ========================================================= */

/* =========================================================
   フォント読み込み（源ノ角ゴシック = Noto Sans JP・自己ホスト）
   ★2026/08/29 パスだけ直しました。
     現行は /kanri/assets/css/style.css にあったので ../fonts/ で正解でしたが、
     このファイルは V.3/assets/kanri.css に置いたため ../fonts/ だと404になります。
     assets/fonts/ を指すよう fonts/ に変更（フォントの実体・見た目は変わりません）。
   ========================================================= */
@font-face{ font-family:"Noto Sans JP"; font-weight:400; font-style:normal;
  font-display:swap; src:url("fonts/noto-sans-jp-400.woff2") format("woff2"); }
@font-face{ font-family:"Noto Sans JP"; font-weight:500; font-style:normal;
  font-display:swap; src:url("fonts/noto-sans-jp-500.woff2") format("woff2"); }
@font-face{ font-family:"Noto Sans JP"; font-weight:700; font-style:normal;
  font-display:swap; src:url("fonts/noto-sans-jp-700.woff2") format("woff2"); }
@font-face{ font-family:"Noto Sans JP"; font-weight:900; font-style:normal;
  font-display:swap; src:url("fonts/noto-sans-jp-900.woff2") format("woff2"); }

/* =========================================================
   デザイントークン（このプロジェクトの基準値）
   ※あとで既存テーマのCSS変数に合わせて微調整します
   ========================================================= */
:root {
  /* --- 基準幅・レイアウト --- */
  --design-width: 1500px;   /* デザインの基準幅（イラレのカンバス幅） */
  --container:    1280px;   /* コンテンツの最大幅（左右余白 約110px） */

  /* --- カラー --- */
  --c-blue:      #2F56AB;   /* ブランド青（上部バー・ナビ・業務用ボタン） */
  --c-red:       #CA2927;   /* CTA赤（ルームエアコンボタン） */
  --c-orange:    #F46A25;   /* ロゴ */
  --c-tel:       #F14826;   /* 電話番号（赤オレンジ） */
  --c-yellow:    #EBF053;   /* ボタン内の強調文字（黄） */
  --c-badge:     #43649E;   /* 通常/夏季バッジの青 */
  --c-black-bar: #0E0F0E;   /* 黒帯（電話1本で〜） */
  --c-white:     #FFFFFF;
  --c-text:      #333333;   /* 本文テキスト */
  --c-text-sub:  #555555;   /* 補足テキスト */

  /* --- フォント --- */
  /* 源ノ角ゴシック（Noto Sans JP）を基本にする */
  --font-base: "Noto Sans JP","Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;

  /* --- ヘッダー各段の高さ --- */
  --h-topbar: 47px;
  --h-header: 124px;
  --h-nav:    61px;
}

/* =========================================================
   ベース
   ========================================================= */
* { margin: 0; padding: 0; box-sizing: border-box; }

body {
  font-family: var(--font-base);
  color: var(--c-text);
  background: var(--c-white);
  /* ★line-height:1.6 は body から .pc-view へ移した（2026/08/28）
     body に置いたままだと、確定版のヘッダー・サイドバー・CTA・フッターにも
     継承されてしまい、確定版の見た目が変わる（実測：ヘッダーのロゴ下の
     「愛知県知事許可…」が行間19.2pxになり、確定版より1.7px高くなった）。
     .pc-view は本文セクション全部を包んでいるので、本文の見た目は1pxも変わらない。 */
  -webkit-font-smoothing: antialiased;
  /* PC版はデザイン基準幅1500pxの固定レイアウト。
     画面が狭くても広くても伸縮・折り返しをせず、常にこの幅で正確に再現する
     （min-widthだけだと1500pxより広い画面でbodyが伸びてしまい、
      width:100%の背景画像とpx固定のオーバーレイ<a>がズレるため、
      widthで固定し中央寄せする）
     （スマホ専用デザインは後日メディアクエリで別途対応） */
  width: var(--design-width);
  margin: 0 auto;
}

img { max-width: 100%; height: auto; vertical-align: bottom; }
a { text-decoration: none; color: inherit; }
ul { list-style: none; }

/* 中央寄せコンテナ */
.container {
  width: var(--container);
  max-width: 100%;
  margin-inline: auto;
  padding-inline: 20px;
}


/* =========================================================
   No.2 ファーストビュー（基準幅1500pxの帯・画像で忠実再現）
   ========================================================= */
.firstview { width: 100%; }
.firstview__img {
  display: block;
  width: 100%;   /* 1500px幅いっぱい。元画像は2倍解像度で鮮明 */
  height: auto;
}

/* 画像で忠実再現するセクション共通（No.3以降のフラットな図版） */
.imgsec { width: 100%; position: relative; }  /* relative: 画像上にリンクを重ねられる */
.imgsec__img {
  display: block;
  width: 100%;   /* 1500px幅いっぱい。元画像は2倍解像度で鮮明 */
  height: auto;
}

/* =========================================================
   No.7 ご好評の一番の理由・10の強み ＋ サイドバー（2カラム）
   左＝大枠画像 / 右＝ボタンを1個ずつ配置（後で個別リンク差し込み）
   ========================================================= */
.strengths {
  position: relative;
  width: 100%;
  height: 1110px;   /* 実測: No.7の高さ（修理10年保証まで） */
}
.strengths__box {
  position: absolute;
  left: 210px;
  top: 45px;
  width: 770px;
  height: auto;
}
.strengths__side a {
  position: absolute;
  left: 1024px;
  width: 368px;
  display: block;
  transition: opacity .2s;
}
.strengths__side a:hover { opacity: .85; }
.strengths__side a img { display: block; width: 100%; height: auto; }
/* 左枠内「詳しく見てみる」ボタン（画像の上に透明リンクを重ねる。別ページへ） */
.strengths__more {
  position: absolute;
  display: block;
  z-index: 2;
  border-radius: 8px;
  transition: background .2s;
}
.strengths__more:hover { background: rgba(255,255,255,.18); }

/* =========================================================
   No.8 お悩み解決（画像1枚＋FAQの詳しく見てみるリンク）
   ========================================================= */
.troubles { position: relative; width: 100%; }
.troubles > img { display: block; width: 100%; height: auto; }
/* 画像の上に重ねる透明リンク（別ページへ・後でURL差し込み） */
.link-overlay {
  position: absolute;
  display: block;
  z-index: 2;
  border-radius: 6px;
  transition: background .2s;
}
.link-overlay:hover { background: rgba(255,255,255,.2); }

/* =========================================================
   レスポンシブ切替（768px以下＝スマホ版 / 769px以上＝PC版）
   ========================================================= */
.pc-view { line-height: 1.6; }       /* 元は body に付いていた。上のコメント参照 */
.sp-view { display: none; }          /* PCではスマホ版を隠す */

@media (max-width: 768px) {
  body { width: 100%; margin: 0; }   /* PC固定幅(1500px)を解除してSP幅に追従 */
  .pc-view { display: block; }        /* スマホではPC版を隠す */
  .sp-view { display: none; }
  /* スマホ版完成するまではnoneのまま */
}

/* --- スマホ版セクション（番号画像1枚＝1セクション） --- */
.sp-view { width: 100%; }
.sp-sec {
  position: relative;                /* 画像の上にリンクを重ねられる */
  width: 100%;
}
.sp-sec > img {
  display: block;
  width: 100%;                       /* SP幅いっぱい。元画像は約2倍解像度で鮮明 */
  height: auto;
}

/* --- ハンバーガーメニュー（開閉・JSなし／チェックボックス方式） --- */
.spmenu-toggle { display: none; }
.spmenu-open {                       /* section01の[menu]ボタンに重ねる開くボタン */
  position: absolute;
  display: block;
  z-index: 5;
  cursor: pointer;
}
.sp-menu {                           /* 開いたメニュー画面（全画面オーバーレイ） */
  display: none;
  position: fixed;
  inset: 0;
  z-index: 1000;
  background: #0954A5;               /* メニュー背景の濃紺 */
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
.spmenu-toggle:checked ~ .sp-menu { display: block; }
.sp-menu__inner {
  position: relative;
  width: 100%;
  max-width: 768px;
  margin: 0 auto;
}
.sp-menu__inner > img { display: block; width: 100%; height: auto; }
.sp-menu a,
.sp-menu .spmenu-close {
  position: absolute;
  display: block;
  z-index: 2;
  cursor: pointer;
}


/* ===== 管理ページ No.1（テキスト化） ===== */
.k01{width:100%;}
/* ★2026/08/29 和田さん指示：FVの写真の下端に、吹き出しの四角4つの上端と
   ピンクの細い線が焼き込まれている。その下にHTMLの吹き出しが別にあるので二重になる。
   実測：写真は 1502×560px。y=546（ピンクの線）〜559 の14px分が写り込み。
   → 画像ファイルは触らず、CSSで下14pxぶんだけ隠す。
     （きれいな写真に差し替わったら、この aspect-ratio の1行を消すだけで元に戻る）
   1500px表示のときのFVの高さ：559.25px → 544.27px（−14.98px）。 */
.k01__hero img{display:block;width:100%;height:auto;
  aspect-ratio:1502/545;object-fit:cover;object-position:top;}
.k01__body{padding:0 0 60px;}
.k01__bubbles{display:flex;justify-content:center;gap:34px;margin-top:14px;}
/* ★2026/08/29 和田さん指示：4つの吹き出しのうち2番目と4番目（2行のもの）だけ、
   文字が枠の上に寄っていた。4つは同じ高さにそろっている（flexのstretch）ので、
   行数が少ない2つは下に余白ができて、上寄せに見えていた。
   → display:grid ＋ align-content:center で、文字を上下中央に置く。
     ★display:flex は使わない。flexにすると <br> が無視される（リファレンス6章の失敗2）。
     grid なら中の <br> はそのまま効く。横方向は今までどおり text-align:center。 */
.k01 .bubble{position:relative;background:#fff;border:2px solid #0954A5;border-radius:9px;color:#0954A5;font-weight:700;font-size:20px;line-height:1.42;text-align:center;padding:14px 8px;min-width:172px;display:grid;align-content:center;}
.k01 .bubble::after{content:"";position:absolute;left:50%;bottom:-13px;transform:translateX(-50%);border-left:11px solid transparent;border-right:11px solid transparent;border-top:13px solid #0954A5;}
.k01 .bubble::before{content:"";position:absolute;left:50%;bottom:-9px;transform:translateX(-50%);z-index:1;border-left:9px solid transparent;border-right:9px solid transparent;border-top:11px solid #fff;}
.k01__lead{margin-top:56px;text-align:center;color:#0954A5;font-weight:700;font-size:20px;line-height:2.05;letter-spacing:.02em;}


/* ===== 管理ページ No.2（テキスト化） ===== */
.k02{width:100%;}
.k02__wrap{max-width:1200px;margin:0 auto;display:flex;gap:44px;align-items:flex-start;padding:44px 10px 0;box-sizing:border-box;}
.k02__main{flex:1 1 auto;min-width:0;}
.k02__side{flex:0 0 368px;max-width:368px;width:368px;display:flex;flex-direction:column;gap:5px;align-items:flex-start;overflow:hidden;}
.k02__side>*{width:262px;min-width:0;box-sizing:border-box;}
.k02__side>a{display:block;line-height:0;transition:opacity .2s;}
.k02__side>a:hover{opacity:.88;}
.k02__side .k02__narrow{width:264px;}
.k02__side img{display:block;width:100%;height:auto;}
.k02__faq{position:relative;margin-top:6px;line-height:0;width:264px;}
.k02__faq img{display:block;width:100%;height:auto;}
.k02__banner img{display:block;width:100%;height:auto;}
.k02__note{margin:9px 0 26px;font-size:12px;color:#333;}
.k02__cards{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:0;padding:0;}
.k02__cards li{border:1.5px solid #4a86cf;border-radius:9px;background:#fff;color:#0e4f9c;font-weight:700;font-size:16px;line-height:1.45;text-align:center;padding:12px 8px;display:flex;align-items:center;justify-content:center;min-height:74px;}
.k02__arrow{width:0;height:0;margin:16px auto 8px;border-left:22px solid transparent;border-right:22px solid transparent;border-top:24px solid #0954A5;}
.k02__lead-h{text-align:center;color:#0954A5;font-weight:900;font-size:30px;line-height:1.55;margin:6px 0 22px;letter-spacing:0;}
.k02__lead{text-align:center;color:#0954A5;font-weight:500;font-size:18px;line-height:2.0;margin:0 0 34px;}
.k02__system{background:#cdeefb;border-radius:10px;padding:44px 40px 40px;}
.k02__sys-h{text-align:center;color:#0954A5;font-weight:900;font-size:33px;line-height:1.55;margin:0 0 28px;}
.k02__sys-img img{display:block;width:100%;height:auto;border-radius:4px;}
.k02__badges{list-style:none;display:flex;justify-content:space-between;gap:8px;margin:32px 0 24px;padding:0;}
.k02__badges li{width:112px;height:112px;border-radius:50%;background:#0954A5;color:#fff;font-weight:700;font-size:15px;line-height:1.35;display:flex;align-items:center;justify-content:center;text-align:center;padding:6px;}
.k02__sys-body{text-align:center;color:#0954A5;font-weight:500;font-size:16px;line-height:1.9;margin:0;}


/* ===== 管理ページ No.3（テキスト化） ===== */
.k03{width:100%;padding:58px 24px 64px;}
.k03__inner{max-width:882px;margin:0 auto;}
.k03__photo img{display:block;width:100%;height:auto;}
.k03__h{text-align:center;color:#0954A5;font-weight:900;font-size:36px;margin:46px 0 20px;letter-spacing:.01em;}
.k03__lead{text-align:center;color:#333;font-weight:500;font-size:17px;line-height:1.9;margin:0 0 40px;}
.k03__tags{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:16px 18px;margin:0 0 46px;padding:0;}
.k03__tags li{border:1.5px solid #0954A5;border-radius:4px;color:#0954A5;font-weight:500;font-size:16px;text-align:center;padding:12px 6px;min-height:56px;display:flex;align-items:center;justify-content:center;line-height:1.35;background:#fff;}
.k03__tags li.is-active{background:#0954A5;color:#fff;font-weight:700;}
.k03__btn{display:block;width:max-content;max-width:100%;margin:0 auto 26px;background:#0954A5;color:#fff;font-weight:900;font-size:24px;text-align:center;padding:17px 52px;border-radius:999px;box-shadow:0 5px 0 rgba(6,50,110,.35),0 9px 16px rgba(0,0,0,.18);letter-spacing:.02em;}
.k03__foot{text-align:center;color:#333;font-weight:500;font-size:17px;line-height:1.9;margin:22px 0 0;}


/* ===== 管理ページ No.4（5つのポイント／テキスト化） ===== */
.k04{background:#d8effc;width:100%;padding:52px 0 58px;}
.k04__inner{max-width:1200px;margin:0 auto;padding:0 24px;box-sizing:border-box;}
.k04__h{text-align:center;color:#0954A5;font-weight:900;font-size:36px;margin:0 0 34px;letter-spacing:.02em;}
.k04__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:20px;}
.k04__card{background:#fff;border-radius:8px;padding:22px 36px;display:flex;align-items:center;gap:24px;}
.k04__num{flex:none;color:#b7d2ee;font-weight:700;font-size:46px;line-height:1;min-width:64px;text-align:center;}
.k04__cbody{border-left:1px solid #6f9dcf;padding-left:24px;}
.k04__t{color:#0954A5;font-weight:700;font-size:21px;margin:0 0 8px;}
.k04__p{color:#555;font-weight:500;font-size:15px;line-height:1.75;margin:0;}


/* ===== 管理ページ No.5（「任せやすい」と言われる理由／写真＋4番カード流用） ===== */
.k05{background:#fff;width:100%;padding:0 0 24px;}
.k05__photo{max-width:872px;margin:0 auto;padding:44px 24px 0;box-sizing:border-box;}
.k05__photo img{display:block;width:100%;height:auto;}
.k05__inner{max-width:1200px;margin:0 auto;padding:30px 24px 0;box-sizing:border-box;}
.k05 .k04__h{margin-bottom:30px;}
.k05 .k04__card{border:1px solid #e3e3e8;}


/* ===== 管理ページ No.6（数字で見る管理体制／運用体制・2カラム） ===== */
.k06{background:#d8effc;width:100%;padding:46px 0 50px;}
.k06__inner{max-width:1140px;margin:0 auto;padding:0 24px;display:flex;box-sizing:border-box;}
.k06__col{flex:1;box-sizing:border-box;}
.k06__col--l{padding-right:44px;border-right:1px solid #aacae9;}
.k06__col--r{padding-left:44px;}
.k06__photo img{display:block;max-width:100%;height:auto;border-radius:2px;}
.k06__h{color:#0954A5;font-weight:900;font-size:30px;margin:24px 0 20px;}
.k06__stats{list-style:none;margin:0;padding:0;}
.k06__stats li{display:flex;align-items:baseline;gap:18px;margin-bottom:16px;}
.k06__snum{color:#0954A5;font-weight:700;font-size:22px;min-width:148px;flex:none;}
.k06__sdesc{color:#555;font-weight:500;font-size:15px;}
.k06__bullets{display:flex;gap:28px;margin:0 0 20px;}
.k06__bullets ul{list-style:none;margin:0;padding:0;}
.k06__bullets li{color:#333;font-weight:500;font-size:15px;line-height:1.95;}
.k06__note{color:#555;font-weight:500;font-size:14px;line-height:1.7;margin:0;}


/* ===== 管理ページ No.7（管理ステッカー＋修理対応の流れ・複合） ===== */
.k07{background:#d8effc;width:100%;padding:26px 24px;box-sizing:border-box;}
.k07__card{background:#fff;border-radius:14px;max-width:1180px;margin:0 auto;padding:44px 60px 54px;box-sizing:border-box;}
.k07__center{text-align:center;}
.k07__pill{display:inline-block;background:#0954A5;color:#fff;font-weight:700;font-size:20px;padding:11px 38px;border-radius:26px;box-shadow:0 3px 6px rgba(0,0,0,.18);}
.k07__h{text-align:center;color:#0954A5;font-weight:900;font-size:26px;margin:30px 0 20px;}
.k07__row{display:flex;gap:34px;align-items:flex-start;margin-bottom:6px;}
.k07__rowtext{flex:1;min-width:0;}
.k07__p{color:#333;font-weight:500;font-size:15px;line-height:1.85;margin:0;}
.k07__p--center{text-align:center;}
.k07__note{color:#888;font-weight:500;font-size:12px;line-height:1.6;margin:12px 0 0;}
.k07__sticker{flex:none;}
.k07__sticker img{display:block;width:221px;height:auto;}
.k07__divider{border-top:1px solid #9cc0e8;position:relative;margin:30px 0 32px;}
.k07__divider::after{content:"";position:absolute;left:50%;top:0;transform:translateX(-50%);border-left:13px solid transparent;border-right:13px solid transparent;border-top:13px solid #4a86cf;}
.k07__flow{display:flex;gap:21px;justify-content:center;margin:24px 0 40px;}
.k07__step{flex:1 1 0;max-width:172px;background:#dae1eb;padding:20px 16px;box-sizing:border-box;}
.k07__step h3{color:#0954A5;font-weight:700;font-size:16px;text-align:center;margin:0 0 14px;line-height:1.4;}
.k07__step p{color:#555;font-weight:500;font-size:13px;line-height:1.75;margin:0;letter-spacing:.04em;}
.k07__long{border:1px solid #cfe0f0;border-radius:6px;padding:28px 40px;display:flex;gap:34px;align-items:center;}
.k07__longtext{flex:1;min-width:0;}
.k07__h--left{text-align:left;font-size:23px;margin:0 0 14px;}
.k07__longphoto{flex:none;}
.k07__longphoto img{display:block;width:200px;height:auto;border-radius:2px;}


/* ===== 管理ページ No.8（楽に頼めて、あとからも困らない） =====
   2026/08/29 このセクションのCSSは削除しました。
   和田さんの確定で「楽に頼めて、あとからも困らない。」が共通部品の5点目になり、
   確定版（company.css の .cmp-closing / .cmp-photos2）に差し替えたためです。
   HTMLも .pc-view の外に出してあります。 */


/* ===== 管理ページ No.9（ご相談CTA：オレンジバナー＋3連絡方法） ===== */
.k09{background:#fff;width:100%;padding:40px 0 50px;}
.k09__inner{max-width:1180px;margin:0 auto;padding:0 24px;box-sizing:border-box;}
.k09__banner{position:relative;max-width:760px;margin:0 auto;background:linear-gradient(90deg,#f24d00,#f7930d);color:#fff;font-weight:700;font-size:24px;text-align:center;padding:20px 24px;border-radius:8px;}
.k09__banner::after{content:"";position:absolute;left:50%;bottom:-14px;transform:translateX(-50%);border-left:16px solid transparent;border-right:16px solid transparent;border-top:15px solid #f5850c;}
.k09__features{text-align:center;color:#4a4746;font-weight:700;font-size:22px;letter-spacing:.06em;margin:44px 0 30px;}
.k09__box{background:#f1f1f4;border-radius:12px;padding:26px 24px;display:flex;gap:22px;justify-content:center;}
.k09__card{flex:1 1 0;background:#fff;border-radius:10px;padding:0 0 18px;border:2px solid;box-sizing:border-box;}
.k09__card--tel{border-color:#f2a559;}
.k09__card--line{border-color:#66cf93;}
.k09__card--web{border-color:#6fabde;}
.k09__chead{color:#fff;font-weight:700;font-size:18px;text-align:center;padding:9px 10px;border-radius:22px;margin:14px 16px 16px;}
.k09__chead--tel{background:#f5820a;}
.k09__chead--line{background:#06c755;}
.k09__chead--web{background:#1f7fd4;}
.k09__tel{display:flex;align-items:center;justify-content:center;gap:8px;margin:0 0 12px;}
.k09__tel img{width:28px;height:auto;}
.k09__tel span{color:#16365c;font-weight:900;font-size:35px;letter-spacing:-.01em;}
.k09__hours{display:flex;align-items:center;gap:8px;justify-content:center;margin:0 16px 8px;}
.k09__hbadge{flex:none;border:1px solid #333;color:#333;font-size:11px;padding:2px 5px;border-radius:3px;white-space:nowrap;}
.k09__hbadge--s{background:#333;color:#fff;border-color:#333;}
.k09__htxt{color:#333;font-size:12px;line-height:1.4;}
.k09__imgbtn{display:block;}
.k09__imgbtn img{display:block;width:86%;max-width:280px;margin:0 auto 10px;height:auto;}
.k09__lnote{text-align:center;color:#1a9a52;font-weight:700;font-size:14px;margin:4px 0 0;}
.k09__clabel{margin:14px 16px 0;text-align:center;font-weight:700;font-size:14px;padding:8px;border-radius:5px;}
.k09__clabel--tel{background:#f6820a;color:#fff;}
.k09__clabel--line{background:#e2f6ea;color:#1a9a52;}
.k09__clabel--web{background:#dcebf8;color:#1f6fc0;}

/* =========================================================
   サイドバーの列（2026/08/28・確定版サイドバーへの差し替えに伴い追加）
   旧 .k02__side（幅368px・中のボタンは262px）を、この列だけに置き換えた。
   中身は確定版サイドバー（assets/sidebar.css の .aasb・幅276px）。
   ★列の幅・gap は現行のまま368pxにしてあるので、左の本文カラム（768px）は1pxも動かない。
   ========================================================= */
.k02__sidecol{flex:0 0 368px;max-width:368px;width:368px;}
/* スマホ（768px以下）では確定版サイドバーが display:none になり（中身はフッターへ入る）、
   この列だけが空の368pxとして残って横にはみ出すため、列ごと消す。 */
@media (max-width:768px){ .k02__sidecol{display:none;} }


/* =========================================================
   スマホ版（768px以下）第2段階・2026/08/30
   ★出どころ：デザインデータ/サービス特徴（管理）/サービス特徴（管理）-SP.ai（375×14047px）
     text.tsv・図形/画像のbboxから数値を取り、cqw（＝設計px÷3.75）で実装。
     ルール7章「375px設計→cqw。最大480pxで頭打ち」に従う（cta.cssと同じ方式）。
   ★色はルール5章の置換：#0054AC→#0954A5／#231815・#000000→#333333
   ★共通部品5点には触れていない。セレクタは .k01〜.k07 のページ固有クラスのみ。
   ★PC表示に影響しないための土台（.spbr / .k01__fv / picture）はこの下の3行。
   ========================================================= */
.spbr{display:none;}          /* SPデザイン専用の改行。PCでは存在しない扱い */
.pcbr{display:inline;}        /* PC専用の改行。SPでは消す（SPは行の切り方が違う） */
.k01__fv{display:none;}       /* SP専用FV。PCでは出さない */
picture{display:contents;}    /* pictureを箱として消し、中のimgに既存CSSがそのまま効く */

@media (max-width:768px){
  .spbr{display:inline;}
  .pcbr{display:none;}

  /* 各セクションをコンテナ化（cqwの基準）。CTAと同じく480pxで頭打ち */
  .k01,.k02,.k03,.k04,.k05,.k06,.k07{
    container-type:inline-size;
    width:100%;max-width:480px;margin-inline:auto;
  }

  /* --- No.1 FV（写真は上に150px。見出しは写真の下・白地） ---
     ★2026/08/30 和田さん指示で修正。
       SP.ai を画像に書き出して実測したところ、text.tsv が拾っていた
       「白地・青枠の吹き出し」は旧レイヤーで、実際のデザインは
       「写真150px → 白地に見出し → 青ベタ・黄文字の吹き出し」だった。
       実測値（375px設計）
         写真      y106.75〜256.75（高さ150）
         見出し    上端 269.8 / 309.5 / 348.8（text.tsv）
         吹き出し  箱 幅156・高さ73／左x23・右x197／上段y419.5・下段y514.5
                   三角 底辺13・高さ9／背景#0054AC→#0954A5／文字#FFF100
       原点は写真の上端（＝ヘッダーの下端 y106.75）。以下の top はそこからの差。 */
  .k01__hero{display:none;}
  .k01__fv{display:block;position:relative;overflow:hidden;height:83.4cqw;}
  .k01__fvphoto{position:absolute;left:0;top:0;width:100%;height:40cqw;max-width:none;object-fit:cover;}
  .k01__fvtitle{position:absolute;inset:0;font-weight:900;color:#0954A5;line-height:1;}
  .k01__fvtitle span{position:absolute;white-space:nowrap;}
  .k01__fvt1{left:13.547cqw;top:43.48cqw;font-size:6.579cqw;letter-spacing:.147em;}
  .k01__fvt2{left:26.453cqw;top:54.067cqw;font-size:7.925cqw;letter-spacing:.131em;}
  .k01__fvt3{left:9.147cqw;top:64.547cqw;font-size:7.925cqw;letter-spacing:.095em;}

  .k01__body{padding:0 0 6.48cqw;}
  .k01__bubbles{
    position:relative;z-index:2;
    display:grid;grid-template-columns:41.6cqw 41.6cqw;   /* 箱156px×2 */
    column-gap:4.8cqw;                                     /* 箱と箱の間18px */
    row-gap:5.867cqw;                                      /* 上段の下端→下段の上端22px */
    justify-content:flex-start;padding-left:6.133cqw;      /* 左箱の左端 x23 */
    margin-top:0;                                          /* 写真には重ねない */
  }
  .k01 .bubble{min-width:0;width:41.6cqw;min-height:19.467cqw;  /* 箱の高さ73px */
    background:#0954A5;color:#FFF100;                      /* 青ベタ・黄文字 */
    border:0;border-radius:0;                              /* 枠なし・角丸なし */
    font-size:3.733cqw;line-height:1.393;letter-spacing:0;
    white-space:nowrap;   /* 行はbrで確定。枠幅ぎりぎりでも勝手に折り返さない */
    padding:0;}
  /* 1つ目だけ文字数が多く、デザインでも一段小さい（実測 約12px／他は約14px） */
  .k01 .bubble:first-child{font-size:3.2cqw;line-height:1.458;}
  .k01 .bubble::after{bottom:-2.4cqw;border-left-width:1.733cqw;border-right-width:1.733cqw;
    border-top-width:2.4cqw;border-top-color:#0954A5;}     /* 三角 底辺13・高さ9 */
  .k01 .bubble::before{display:none;}                      /* 枠線用の白い内三角は不要 */
  .k01__lead{margin-top:9.227cqw;font-size:3.733cqw;line-height:1.714;letter-spacing:.11em;font-weight:900;}

  /* --- No.2 バナー・解決カード（1列）・管理システム --- */
  .k02__wrap{display:block;padding:0;max-width:none;}
  .k02__banner img{width:100%;}
  .k02__note{font-size:2.133cqw;margin:1.253cqw 0 1.173cqw 7.013cqw;
    /* 約物が全角のままだと1行に入らない（デザインは1行）。ルール推奨のpaltで詰める */
    font-feature-settings:"palt";letter-spacing:-.02em;}
  .k02__cards{display:block;}
  .k02__cards li{width:84.427cqw;margin:0 auto 2.813cqw;min-height:10.56cqw;
    font-size:3.733cqw;letter-spacing:.02em;white-space:nowrap;
    font-feature-settings:"palt";  /* 約物詰め。全角のままだと長い行が枠を超える */
    border:1.5px solid #0954A5;border-radius:1.867cqw;padding:0;
    display:grid;align-content:center;color:#0954A5;}
  .k02__cards li br{display:none;}
  .k02__arrow{margin:4.1cqw auto 0;border-left-width:5.067cqw;border-right-width:5.067cqw;border-top-width:4.267cqw;}
  .k02__lead-h{font-size:7.2cqw;line-height:1.519;letter-spacing:.045em;margin:16.53cqw 0 3.227cqw;}
  .k02__lead{font-size:3.733cqw;line-height:1.786;font-weight:400;color:#333;margin:0 0 7.36cqw;}
  .k02__system{background:#D8EFFC;border-radius:0;padding:20cqw 0 14.453cqw;}
  .k02__sys-h{font-size:7.2cqw;line-height:1.519;letter-spacing:.08em;margin:0 0 2.173cqw;}
  .k02__sys-img{margin:0 7.493cqw;}
  .k02__badges{flex-wrap:wrap;justify-content:center;gap:2.8cqw;
    width:73.6cqw;margin:16.67cqw auto 7.36cqw;}  /* 丸3個+隙間2つ分。4個並びを防ぐ */
  .k02__badges li{width:22.667cqw;height:22.667cqw;
    background:#fff;color:#0954A5;border:.667cqw solid #0954A5;
    font-size:3.717cqw;line-height:1.2;padding:1cqw;}
  .k02__sys-body{font-size:3.733cqw;line-height:1.5;font-weight:400;color:#333;
    text-align:justify;font-feature-settings:"palt";padding:0 6.72cqw;}
  .k02__sys-body br{display:none;}

  /* --- No.3 サービス履歴をデータ化 --- */
  .k03{padding:0 0 9.867cqw;}
  .k03__inner{max-width:none;}
  .k03__photo{margin-top:-2.667cqw;}
  .k03__photo img{width:100%;}
  .k03__h{font-size:7.2cqw;line-height:1.519;letter-spacing:.03em;margin:17.1cqw 0 0;}
  .k03__lead{font-size:3.733cqw;line-height:1.786;margin:1cqw 0 4.48cqw;}
  .k03__tags{grid-template-columns:41.333cqw 41.333cqw;justify-content:center;
    column-gap:2.96cqw;row-gap:2.187cqw;margin:0 0 8.053cqw;}
  .k03__tags li{font-size:3.2cqw;letter-spacing:.08em;min-height:5.867cqw;
    padding:0 1cqw;border-width:1.2px;border-radius:1.067cqw;white-space:nowrap;}
  .k03__tags li br{display:none;}
  .k03__btn{width:85.307cqw;max-width:none;height:14.72cqw;margin:0 auto;
    display:grid;align-content:center;font-size:4.267cqw;line-height:1.294;
    letter-spacing:.06em;padding:0;border-radius:999px;
    box-shadow:0 3px 0 rgba(6,50,110,.35),0 6px 10px rgba(0,0,0,.18);}
  .k03__foot{font-size:3.733cqw;line-height:1.964;margin-top:9.33cqw;}

  /* --- No.4／No.5 ポイントカード（番号＋縦線＋見出し／本文は全幅で下段） --- */
  .k04{padding:19.673cqw 0 11.253cqw;}
  .k04__inner{max-width:none;padding:0;}
  .k04__h{font-size:8.147cqw;line-height:1.443;letter-spacing:.085em;margin:0 0 .5cqw;}
  .k04__list{display:block;}
  .k04__card{width:85.227cqw;margin:0 auto 5.627cqw;border-radius:2.667cqw;
    display:grid;grid-template-columns:13.093cqw 1fr;align-items:center;
    padding:9.5cqw 3.627cqw 6.9cqw 3.653cqw;gap:0;}
  .k04__list .k04__card:last-child{margin-bottom:0;}
  .k04__cbody{display:contents;}
  .k04__num{font-size:6.843cqw;font-weight:400;color:#0954A5;min-width:0;
    text-align:left;padding-left:2.693cqw;align-self:center;}
  .k04__t{border-left:1px solid #0954A5;padding-left:3.733cqw;margin:0;
    font-size:5.333cqw;line-height:1.47;letter-spacing:.08em;
    /* ★flexにしない。flexだと中の<br>が無視される（リファレンス6章） */
    min-height:12.96cqw;display:grid;align-content:center;}
  .k04__p{grid-column:1/-1;margin-top:3.4cqw;
    font-size:3.733cqw;line-height:1.5;letter-spacing:.05em;color:#333;
    text-align:justify;font-feature-settings:"palt";}
  .k05{padding:0 0 4.8cqw;}
  .k05__photo{max-width:none;padding:0;margin-top:-10cqw;}
  .k05__photo img{width:100%;}
  .k05__inner{max-width:none;padding:0;}
  .k05 .k04__h{margin:15.2cqw 0 1.5cqw;}
  .k05 .k04__card{border:1px solid #e3e3e8;}

  /* --- No.6 数字で見る管理体制（縦積み） --- */
  .k06{padding:9.413cqw 0 0;}
  .k06__inner{display:block;max-width:none;padding:0 7.2cqw;}
  .k06__col--l{padding-right:0;border-right:none;
    padding-bottom:2.7cqw;border-bottom:1px solid #aacae9;margin-bottom:0;}
  .k06__col--r{padding-left:0;padding-top:2.3cqw;}
  .k06__photo img{width:100%;}
  .k06__h{font-size:6.4cqw;letter-spacing:.13em;margin:2.77cqw 0 2cqw;}
  .k06__stats li{gap:0;margin-bottom:.45cqw;}
  .k06__snum{font-size:4cqw;min-width:32.853cqw;color:#333;}
  .k06__sdesc{font-size:3.2cqw;color:#333;}
  .k06__bullets{display:block;margin:0 0 3cqw;}
  .k06__bullets li{font-size:3.733cqw;line-height:1.486;color:#333;}
  .k06__note{font-size:3.733cqw;line-height:1.457;color:#333;margin:4cqw 0 0;}

  /* --- No.7 管理ステッカー＋修理対応の流れ（白カード1枚・1列流し） --- */
  .k07{padding:11.78cqw 0 8.72cqw;}
  .k07__card{max-width:none;width:85.707cqw;margin:0 auto;border-radius:3.2cqw;
    padding:5.84cqw 5.147cqw 3.73cqw;}
  .k07__pill{font-size:4.267cqw;padding:1.87cqw 6.4cqw;border-radius:999px;}
  .k07__h{font-size:8.165cqw;line-height:1.442;margin:10.13cqw 0 1cqw;}
  .k07__row{display:block;margin-bottom:0;}
  .k07__p{font-size:3.733cqw;line-height:1.357;text-align:justify;font-feature-settings:"palt";}
  .k07__p--center{text-align:left;}
  .k07__note{font-size:2.667cqw;line-height:1.6;margin:2cqw 0 0;}
  .k07__sticker{margin:5.71cqw auto 0;width:67.147cqw;}
  .k07__sticker img{width:100%;}
  .k07__divider{margin:11cqw 0 5.87cqw;}
  .k07__divider::after{border-left-width:2.67cqw;border-right-width:2.67cqw;border-top-width:2.67cqw;}
  .k07__flow{display:block;margin:6.67cqw 0 4.73cqw;}
  .k07__step{max-width:none;width:76.5cqw;margin:0 auto 6.4cqw;
    background:#fff;border:1px solid #b9cfe6;padding:2.67cqw 3.76cqw .7cqw;}
  .k07__step:last-child{margin-bottom:0;}
  .k07__step h3{font-size:4.267cqw;letter-spacing:.13em;margin:0 0 1.87cqw;
    padding-bottom:1.87cqw;border-bottom:1px solid #b9cfe6;}
  .k07__step h3 br{display:none;}
  .k07__step p{font-size:3.733cqw;line-height:1.143;letter-spacing:.08em;font-feature-settings:"palt";}
  .k07__long{display:grid;grid-template-columns:1fr 24.747cqw;column-gap:1.5cqw;
    align-items:start;border-radius:1.6cqw;
    padding:5.2cqw 4.53cqw 6.4cqw 4.43cqw;}
  .k07__longtext{display:contents;}
  .k07__h--left{grid-column:1;font-size:4.267cqw;line-height:1.5;margin:3.07cqw 0 0;}
  .k07__longphoto{grid-column:2;grid-row:1;margin:0;}
  .k07__longphoto img{width:100%;}
  .k07__long .k07__p{grid-column:1/-1;margin-top:5.2cqw;line-height:1.286;}
}
