/*
 * ======================================
 * 追加クラス一覧（共通SCSS取り込み検討用）
 * ======================================
 *
 * .tjs-header / __inner / __logo / __nav / __nav-item / __right / __tel / __cta / __sptel
 *                      - 2段ヘッダー（上段：ロゴ＋電話2番号＋SNS＋CTA／下段：全幅ベタ塗りナビ）
 * .tjs-nav-toggle      - ヘッダー内に収まる丸型ハンバーガー（absolute配置）
 * .tjs-spnav           - ヘッダー直下に開く白パネル型SPナビ（sp-navの見た目差分）
 * .tjs-sns             - 丸型SNSアイコン（Instagram / LINE）
 * .tjs-footer          - 3カラム（会社情報／電話CTA／サイトマップ）のダークフッター
 * .tjs-fixed-bar       - 3分割（固定電話／携帯／フォーム）のSP固定バー（sp-fixed-barの見た目差分）
 * .tjs-section         - clamp()で可変するセクション上下余白（72〜112px）
 * .tjs-w-1100/960/880  - containerの最大幅バリエーション
 * .tjs-heading         - 英字アイブロウ＋日本語見出し＋リードの見出しブロック
 * .tjs-eyebrow         - 両脇に短いサブカラーバーが付く英字ラベル（heading-flankedの見た目差分）
 * .tjs-sechead         - 左見出し＋右ボタンの見出し行
 * .tjs-btn-outline / .tjs-btn-solid / .tjs-btn-tel - pill型ボタン
 * .tjs-deco            - セクション端の装飾イラスト（位置・幅・透過modifier）
 * .tjs-grid            - auto-fit + minmax の可変グリッド（最小幅modifier）
 * .tjs-cta             - 電話2番号＋フォーム／LINEのお問い合わせCTAボックス
 * .tjs-page-hero       - 下層ページヒーロー（ベタ塗り＋パンくず＋英字＋h1＋リード＋写真）
 * .tjs-works-card      - 施工事例カード（サムネ・カテゴリ・日付・タイトル・エリア）
 * .tjs-flow            - 上ボーダー付きSTEPカード
 * .tjs-price           - 左項目名／右金額＋説明の料金表
 * .tjs-faq             - Q/A丸バッジ付きカード型アコーディオン（accordion--qaの見た目差分）
 * .tjs-panel / .tjs-note / .tjs-figure / .tjs-photo - 汎用ボックス・注意書き・キャプション付き写真
 * .tjs-hornet          - 黒×黄の注意喚起ボックス（害虫駆除ページ専用）
 * .tjs-table           - 会社概要テーブル
 * .tjs-form            - お問い合わせフォーム
 * .tjs-blog            - 施工事例一覧・詳細の2カラム（メイン＋サイドバー）
 *
 * ======================================
 * 共通SCSSに不足していたもの
 * ======================================
 *
 * 【値の粒度不足】
 *  - section の上下余白が固定値（120/60px）のみ。clamp() による可変余白がない
 *  - container の最大幅が 1200 / 900 / 1500 のみ（1100・960・880 がない）
 *  - fz-* に 11 / 15 / 17 / 19 / 21 / 26px がない。mb-* が tablet 以下で自動半減し、デザインの固定余白を保てない
 *  - grid-* が固定列数のみ。auto-fit + minmax（最小幅指定）の可変グリッドがない
 *  - opacity-* に 0.8 / 0.85 / 0.9 がない
 * 【指定方向不足】
 *  - 装飾画像を clamp() で画面端から少しはみ出させる位置指定がない（deco-item は固定マージンのみ）
 * 【状態不足】
 *  - body の font-size が tablet 14px / SP 12px に自動縮小される（デザインは全幅で本文16px基準）
 * 【構造不足】
 *  - 2段ヘッダー（ロゴ行＋全幅ナビ行）の構造がない。header__inner は1行 flex 前提
 *  - ヘッダー直下に開くドロップダウン型のSPナビがない（sp-nav はフルスクリーン型のみ）
 *  - 見出し＋右寄せボタンの見出し行、下層ヒーロー（左テキスト＋右写真・パンくず内包）の構造がない
 *  - 料金表（左項目／右金額＋説明、SPで縦積み）の構造がない（price-list はドットリーダー型）
 *  - ビフォーアフター写真の並び（BEFORE/AFTERラベル重ね）の構造がない
 * 【装飾パターン不足】
 *  - 両脇に「短く太い角丸バー」が付く英字ラベル（heading-flanked は細線のみ）
 *  - 黒×黄の斜線ストライプ帯（警告テープ）
 *  - カード型（角丸・カード間gap）で Q/A バッジの大きいアコーディオン
 *
 */

/* ==========================================================================
   Base（デザインは全幅で本文16px・字間0・行間normal基準）
   ========================================================================== */
body {
  font-size: 1.6rem;
  line-height: normal;
  letter-spacing: 0;
}
a:hover {
  color: #083F75;
}
button {
  font-family: inherit;
}
input:focus,
textarea:focus {
  outline: 2px solid #0B5AA6;
  outline-offset: 1px;
}

/* ==========================================================================
   Header
   ========================================================================== */
.tjs-header {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  background: #fff;
  box-shadow: 0 1px 0 #DCE5EF;
  z-index: 20;
}
.tjs-header__inner {
  flex-wrap: wrap;
  max-width: none;
  height: auto;
  padding: 0;
  gap: 0 16px;
}
.tjs-header__logo {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
  padding: 12px 0;
  margin-left: max(20px, calc((100% - 1200px) / 2));
  color: #1C2B3A;
  text-decoration: none;
}
.tjs-header__logo:hover {
  opacity: 1;
  color: #1C2B3A;
}
.tjs-header__logo img {
  height: 50px;
  width: auto;
  flex-shrink: 0;
}
.tjs-header__logo-text {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.tjs-header__logo-sub {
  font-size: 1.1rem;
  color: #4A5B6E;
  font-weight: 500;
  letter-spacing: .04em;
}
.tjs-header__logo-name {
  font-size: 2rem;
  font-weight: 700;
  letter-spacing: .06em;
  white-space: nowrap;
}

/* 下段：全幅ナビ */
.tjs-header__nav {
  order: 3;
  flex-basis: 100%;
  background: #0B5AA6;
}
.tjs-header__nav-inner {
  display: flex;
  justify-content: space-between;
  width: 100%;
  max-width: 1240px;
  margin: 0 auto;
  padding: 0 20px;
}
.tjs-header__nav-item {
  flex: 1;
}
.tjs-header__nav-item a {
  display: block;
  text-align: center;
  color: #fff;
  font-weight: 700;
  font-size: 1.4rem;
  line-height: 1.5;
  padding: 16px 6px 13px;
  border-bottom: 3px solid transparent;
  letter-spacing: .04em;
  white-space: nowrap;
}
.tjs-header__nav-item + .tjs-header__nav-item a {
  border-left: 1px dotted rgba(255, 255, 255, .55);
}
.tjs-header__nav-item a::after {
  display: none;
}
.tjs-header__nav-item a:hover {
  color: #fff;
  background: rgba(255, 255, 255, .08);
}
.tjs-header__nav-item.header__nav-item--current a {
  border-bottom-color: #bdc733;
}

/* 上段右：電話・SNS・CTA */
.tjs-header__right {
  gap: 22px;
  height: auto;
  margin-right: max(20px, calc((100% - 1200px) / 2));
}
.tjs-header__tels {
  display: flex;
  gap: 20px;
}
.tjs-header__tel {
  display: flex;
  flex-direction: column;
  gap: 2px;
  color: #1C2B3A;
  text-decoration: none;
}
.tjs-header__tel-label {
  font-size: 1.1rem;
  font-weight: 700;
  color: #4A5B6E;
}
.tjs-header__tel-num {
  font-family: "Outfit", sans-serif;
  font-weight: 600;
  font-size: 2.2rem;
  color: #0B5AA6;
  letter-spacing: .02em;
  line-height: 1;
}
.tjs-header__sns {
  display: flex;
  gap: 8px;
}
.tjs-sns {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  text-decoration: none;
}
.tjs-sns--insta {
  background: #F5F8FB;
  border: 1px solid #DCE5EF;
}
.tjs-sns--line {
  background: #06C755;
  color: #fff;
}
.tjs-sns--line i {
  font-size: 2.2rem;
  line-height: 1;
  color: #fff;
}
.tjs-header__cta {
  flex-direction: row;
  gap: 8px;
  height: auto;
  padding: 14px 24px;
  border-radius: 999px;
  font-size: 1.4rem;
  font-weight: 700;
  line-height: 1.5;
  white-space: nowrap;
}
.tjs-header__cta:hover {
  background: #083F75;
  color: #fff;
}

/* SP：電話ボタン＋ハンバーガー */
.tjs-header__sptel {
  display: none;
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: #0B5AA6;
  place-items: center;
  margin-right: 72px;
}
.tjs-nav-toggle {
  position: fixed;
  top: 15px;
  right: 20px;
  z-index: 30;
  border-radius: 50%;
  background: #F5F8FB;
  border: 1px solid #DCE5EF;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}
.tjs-nav-toggle .nav-toggle__line {
  width: 14px;
  height: 2px;
  border-radius: 1px;
  background: #0B5AA6;
}
.tjs-nav-toggle .nav-toggle__line:nth-child(1) { top: 16px; }
.tjs-nav-toggle .nav-toggle__line:nth-child(2) { top: 20px; }
.tjs-nav-toggle .nav-toggle__line:nth-child(3) { top: 24px; }
.tjs-nav-toggle.is-active .nav-toggle__line:nth-child(1),
.tjs-nav-toggle.is-active .nav-toggle__line:nth-child(3) {
  top: 20px;
}

/* SPナビ：ヘッダー直下の白パネル */
.tjs-spnav {
  position: fixed;
  top: 74px;
  bottom: auto;
  z-index: 25;
  display: block;
  max-height: calc(100vh - 74px);
  max-height: calc(100dvh - 74px);
  padding: 8px 20px 24px;
  background: #fff;
  border-top: 3px solid #0B5AA6;
  box-shadow: 0 12px 24px rgba(11, 90, 166, .15);
  overflow-y: auto;
}
.tjs-spnav .sp-nav__list {
  max-width: none;
  text-align: left;
}
.tjs-spnav .sp-nav__item,
.tjs-spnav .sp-nav__item:first-child {
  border-top: 0;
  border-bottom: 1px solid #DCE5EF;
}
.tjs-spnav .sp-nav__link {
  padding: 16px 4px;
  color: #1C2B3A;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.5;
}
.tjs-spnav .sp-nav__link::after {
  content: "›";
  font-family: inherit;
  font-size: 1em;
  font-weight: 700;
  color: #0B5AA6;
  opacity: 1;
}
.tjs-spnav .sp-nav__link:hover {
  background: #F5F8FB;
  color: #1C2B3A;
}
.tjs-spnav__bottom {
  display: grid;
  gap: 10px;
  max-width: none;
  margin-top: 18px;
  text-align: left;
}
.tjs-spnav__tel {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border: 2px solid #0B5AA6;
  border-radius: 12px;
  padding: 12px 16px;
  color: #1C2B3A;
  text-decoration: none;
}
.tjs-spnav__tel--solid {
  background: #0B5AA6;
  color: #fff;
}
.tjs-spnav__tel--solid:hover {
  color: #fff;
}
.tjs-spnav__tel-label {
  font-size: 1.2rem;
  font-weight: 700;
}
.tjs-spnav__tel-num {
  font-family: "Outfit", sans-serif;
  font-weight: 600;
  font-size: 2rem;
  color: #0B5AA6;
}
.tjs-spnav__tel--solid .tjs-spnav__tel-num {
  color: #fff;
}
.tjs-spnav__sns {
  display: flex;
  gap: 10px;
}
.tjs-spnav__sns-link {
  flex: 1;
  text-align: center;
  padding: 12px;
  border-radius: 999px;
  border: 1px solid #DCE5EF;
  color: #0B5AA6;
  font-weight: 700;
  font-size: 1.3rem;
  text-decoration: none;
}
.tjs-spnav__sns-link--line {
  background: #06C755;
  border-color: #06C755;
  color: #fff;
}
.tjs-spnav__sns-link--line:hover {
  color: #fff;
}

@media (max-width: 1100px) {
  /* SP電話ボタンは非表示。ロゴがハンバーガー（right:20px / 44px）に重ならないよう右側を空ける */
  .tjs-header__logo {
    margin-right: 76px;
  }
}
@media (min-width: 1101px) {
  .tjs-spnav {
    display: none;
  }
}

/* ==========================================================================
   Footer
   ========================================================================== */
.tjs-footer {
  background: #083F75;
  color: #fff;
  padding: 72px 20px 32px;
}
.tjs-footer__inner {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  gap: 48px;
  justify-content: space-between;
}
.tjs-footer__info {
  flex: 1 1 300px;
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.tjs-footer__logo {
  display: flex;
  align-items: center;
  gap: 14px;
  color: #fff;
  text-decoration: none;
}
.tjs-footer__logo:hover {
  color: #fff;
}
.tjs-footer__logo-mark {
  display: flex;
}
.tjs-footer__logo-mark img {
  height: 44px;
  width: auto;
}
.tjs-footer__logo-name {
  font-size: 2rem;
  font-weight: 700;
  letter-spacing: .06em;
}
.tjs-footer__address {
  font-size: 1.4rem;
  line-height: 1.9;
  color: #D8E5F2;
}
.tjs-footer__sns {
  display: flex;
  gap: 10px;
}
.tjs-footer__sns-link {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: rgba(255, 255, 255, .12);
  display: grid;
  place-items: center;
  color: #fff;
  text-decoration: none;
}
.tjs-footer__sns-link--line {
  background: #06C755;
  font-family: "Outfit", sans-serif;
  font-weight: 600;
  font-size: 1.2rem;
}
.tjs-footer__sns-link--line i {
  font-size: 2.4rem;
  line-height: 1;
  color: #fff;
}
.tjs-footer__sns-link:hover {
  color: #fff;
}
.tjs-footer__contact {
  flex: 1 1 340px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.tjs-footer__tel {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  background: rgba(255, 255, 255, .08);
  border: 1px solid rgba(255, 255, 255, .2);
  border-radius: 12px;
  padding: 14px 20px;
  color: #fff;
  text-decoration: none;
}
.tjs-footer__tel:hover {
  color: #fff;
}
.tjs-footer__tel--white {
  background: #fff;
  border: 0;
  color: #0B5AA6;
}
.tjs-footer__tel--white:hover {
  color: #0B5AA6;
}
.tjs-footer__tel-label {
  font-size: 1.3rem;
  font-weight: 700;
}
.tjs-footer__tel--white .tjs-footer__tel-label {
  color: #1C2B3A;
}
.tjs-footer__tel-num {
  font-family: "Outfit", sans-serif;
  font-weight: 600;
  font-size: 2.4rem;
}
.tjs-footer__form {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  background: #bdc733;
  color: #1C2B3A;
  border-radius: 999px;
  padding: 15px;
  text-decoration: none;
  font-weight: 700;
  font-size: 1.5rem;
}
.tjs-footer__form:hover {
  color: #1C2B3A;
}
.tjs-footer__nav {
  flex: 1 1 220px;
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  align-content: start;
}
.tjs-footer__nav a {
  color: #fff;
  text-decoration: none;
  font-size: 1.4rem;
}
.tjs-footer__nav a:hover {
  color: #fff;
}
.tjs-footer__copy {
  max-width: 1200px;
  margin: 48px auto 0;
  padding-top: 24px;
  border-top: 1px solid rgba(255, 255, 255, .18);
  font-size: 1.2rem;
  color: #C4D6E9;
  font-family: "Outfit", sans-serif;
  letter-spacing: .06em;
}

/* SP固定バー */
.tjs-fixed-bar {
  z-index: 30;
  padding: 0;
  border-top: 0;
  box-shadow: 0 -4px 16px rgba(8, 63, 117, .18);
}
.tjs-fixed-bar .sp-fixed-bar__link {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  padding: 10px 4px;
  color: #0B5AA6;
  font-size: 1.1rem;
  font-weight: 700;
  line-height: 1.5;
}
.tjs-fixed-bar__item--solid {
  background: #0B5AA6;
}
.tjs-fixed-bar__item--solid .sp-fixed-bar__link,
.tjs-fixed-bar__item--solid .sp-fixed-bar__link:hover {
  color: #fff;
}
.tjs-fixed-bar__item--sub {
  background: #bdc733;
}
.tjs-fixed-bar__item--sub .sp-fixed-bar__link,
.tjs-fixed-bar__item--sub .sp-fixed-bar__link:hover {
  color: #1C2B3A;
}
.tjs-fixed-bar__icon {
  font-size: 1.5rem;
}
@media (min-width: 768px) {
  .tjs-fixed-bar {
    display: none;
  }
}
@media (max-width: 767px) {
  body {
    padding-bottom: 62px;
  }
}

/* ==========================================================================
   Layout
   ========================================================================== */
.tjs-section {
  padding: clamp(72px, 9vw, 112px) 0;
}
.tjs-section--sm {
  padding: clamp(56px, 7vw, 88px) 0;
}
.tjs-w-1320 { max-width: min(1320px, 95%); }
.tjs-w-1100 { max-width: min(1100px, 95%); }
.tjs-w-960  { max-width: min(960px, 95%); }
.tjs-w-880  { max-width: min(880px, 95%); }

/* auto-fit + minmax の可変グリッド */
.tjs-grid {
  display: grid;
  gap: 24px;
}
.tjs-grid--190 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 190px), 1fr)); gap: 16px; }
.tjs-grid--200 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); gap: 16px; }
.tjs-grid--220 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: 20px; }
.tjs-grid--240 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); }
.tjs-grid--240fill { grid-template-columns: repeat(auto-fill, minmax(min(100%, 240px), 1fr)); }
.tjs-grid--260 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); }
.tjs-grid--280 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); gap: 16px; }
.tjs-grid--300 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 16px; }
.tjs-grid--320 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: 28px; }
.tjs-grid--420 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); }
.tjs-grid--440 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 440px), 1fr)); gap: 28px; }
.tjs-grid--520 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 520px), 1fr)); }
/* 4列（1400px以上）→2列（768〜1399px）→1列。カード幅を約300px以上に保つ */
.tjs-grid--4-2 { grid-template-columns: 1fr; }
@media (min-width: 768px) { .tjs-grid--4-2 { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1400px) { .tjs-grid--4-2 { grid-template-columns: repeat(4, 1fr); } }
.tjs-grid--3col { grid-template-columns: repeat(auto-fit, minmax(min(100%, max(220px, calc((100% - 40px) / 3))), 1fr)); gap: 20px; }
.tjs-grid--gap14 { gap: 14px; }
.tjs-grid--gap16 { gap: 16px; }
.tjs-grid--gap18 { gap: 18px; }
.tjs-grid--gap28 { gap: 28px; }

/* ==========================================================================
   Heading
   ========================================================================== */
.tjs-heading {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  text-align: center;
  margin-bottom: 56px;
}
.tjs-heading--mb48 { margin-bottom: 48px; }
.tjs-heading--mb40 { margin-bottom: 40px; }
.tjs-heading--left {
  align-items: flex-start;
  text-align: left;
  margin-bottom: 0;
}
.tjs-heading__ja {
  font-size: clamp(26px, 3.2vw, 36px);
  font-weight: 700;
  letter-spacing: .04em;
  line-height: 1.5;
}
.tjs-heading__ja--catch {
  font-size: clamp(24px, 3vw, 34px);
  letter-spacing: 0;
}
.tjs-heading__lead {
  font-size: 1.5rem;
  line-height: 1.9;
  color: #4A5B6E;
}
.tjs-heading__lead--white {
  color: #E3EDF7;
}

/* 英字アイブロウ（両脇に短いサブカラーバー） */
.tjs-eyebrow {
  gap: 10px;
  font-family: "Outfit", sans-serif;
  font-weight: 600;
  font-size: 1.4rem;
  letter-spacing: .2em;
  line-height: 1.5;
  color: #0B5AA6;
}
.tjs-eyebrow::before,
.tjs-eyebrow::after {
  width: 18px;
  height: 4px;
  border-radius: 2px;
  background: #bdc733;
}
.tjs-eyebrow--left {
  justify-content: flex-start;
}
.tjs-eyebrow--left::after {
  display: none;
}
.tjs-eyebrow--white {
  color: #fff;
}
.tjs-eyebrow--sm {
  font-size: 1.3rem;
  letter-spacing: .16em;
}
.tjs-eyebrow--sm::before,
.tjs-eyebrow--sm::after {
  display: none;
}

/* 左見出し＋右ボタン */
.tjs-sechead {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 44px;
}
.tjs-sechead__title {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

/* 見出し（左の縦バー付き） */
.tjs-bar-title {
  display: flex;
  align-items: center;
  gap: 14px;
  font-size: clamp(22px, 2.6vw, 28px);
  font-weight: 700;
  line-height: 1.5;
}
.tjs-bar-title::before {
  content: "";
  flex-shrink: 0;
  width: 8px;
  height: 32px;
  border-radius: 4px;
  background: #0B5AA6;
}
.tjs-bar-title--md {
  gap: 12px;
  font-size: 2.4rem;
}
.tjs-bar-title--md::before {
  height: 28px;
}
.tjs-bar-title--sm {
  gap: 12px;
  font-size: 1.7rem;
}
.tjs-bar-title--sm::before {
  height: 24px;
}

/* 小見出し（英字ラベル＋h3） */
.tjs-subhead {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.tjs-subhead--center {
  align-items: center;
  gap: 8px;
  text-align: center;
}
.tjs-subhead__title {
  font-size: clamp(20px, 2.4vw, 24px);
  font-weight: 700;
  line-height: 1.5;
}
.tjs-subhead__title--lg {
  font-size: clamp(20px, 2.4vw, 26px);
}

/* サブカラーのマーカー下線 */
.tjs-marker {
  color: #0B5AA6;
  background: linear-gradient(transparent 68%, #bdc733 68%, #bdc733 92%, transparent 92%);
}

/* ==========================================================================
   Buttons
   ========================================================================== */
.tjs-btn-outline {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #fff;
  color: #0B5AA6;
  border: 2px solid #0B5AA6;
  border-radius: 999px;
  padding: 12px 26px;
  font-weight: 700;
  font-size: 1.4rem;
  line-height: 1.5;
  text-decoration: none;
}
.tjs-btn-outline:hover {
  opacity: 1;
  background: #0B5AA6;
  color: #fff;
}
.tjs-btn-outline--lg {
  padding: 14px 28px;
  font-size: 1.5rem;
}
.tjs-btn-outline--wide {
  padding: 12px 32px;
}
.tjs-btn-arrow {
  display: inline-block;
  transition: transform .3s ease;
}
a:hover .tjs-btn-arrow {
  transform: translateX(4px);
}
.tjs-btn-solid {
  display: inline-flex;
  align-items: center;
  background: #0B5AA6;
  color: #fff;
  border-radius: 999px;
  padding: 12px 24px;
  font-weight: 700;
  font-size: 1.4rem;
  line-height: 1.5;
}
.tjs-btn-tel {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  background: #0B5AA6;
  color: #fff;
  text-decoration: none;
  border-radius: 999px;
  padding: 14px 28px 14px 22px;
  box-shadow: 0 6px 18px rgba(11, 90, 166, .28);
}
.tjs-btn-tel:hover {
  opacity: 1;
  color: #fff;
  background: #083F75;
}
.tjs-btn-tel__body {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.tjs-btn-tel__label {
  font-size: 1.1rem;
  font-weight: 700;
}
.tjs-btn-tel__num {
  font-family: "Outfit", sans-serif;
  font-weight: 600;
  font-size: 2.2rem;
  line-height: 1;
}

/* ==========================================================================
   Deco（セクション端の装飾イラスト）
   ========================================================================== */
.tjs-deco {
  position: absolute;
  height: auto;
  pointer-events: none;
  z-index: 0;
}
/* 横位置 */
.tjs-deco--l60 { left: clamp(-60px, -3vw, -20px); }
.tjs-deco--r60 { right: clamp(-60px, -3vw, -20px); }
.tjs-deco--l70 { left: clamp(-70px, -4vw, -24px); }
.tjs-deco--r70 { right: clamp(-70px, -4vw, -24px); }
.tjs-deco--l90 { left: clamp(-90px, -5vw, -30px); }
.tjs-deco--r80 { right: clamp(-80px, -4vw, -30px); }
.tjs-deco--r40 { right: clamp(-40px, -2vw, -10px); }
.tjs-deco--r40h { right: clamp(-40px, -2vw, -12px); }
.tjs-deco--r24 { right: clamp(-24px, -1.5vw, -8px); }
.tjs-deco--r-in64 { right: clamp(16px, 4vw, 64px); }
.tjs-deco--r-in80 { right: clamp(12px, 4vw, 80px); }
.tjs-deco--l-in32 { left: clamp(8px, 2vw, 32px); }
/* 縦位置 */
.tjs-deco--t-24 { top: -24px; }
.tjs-deco--t0 { top: 0; }
.tjs-deco--t16 { top: 16px; }
.tjs-deco--t20 { top: 20px; }
.tjs-deco--t24 { top: 24px; }
.tjs-deco--t32 { top: 32px; }
.tjs-deco--t40 { top: 40px; }
.tjs-deco--b0 { bottom: 0; }
.tjs-deco--b16 { bottom: 16px; }
.tjs-deco--b20 { bottom: 20px; }
.tjs-deco--b24 { bottom: 24px; }
/* 幅 */
.tjs-deco--w160 { width: clamp(90px, 11vw, 160px); }
.tjs-deco--w170 { width: clamp(100px, 11vw, 170px); }
.tjs-deco--w200 { width: clamp(120px, 14vw, 200px); }
.tjs-deco--w220 { width: clamp(120px, 14vw, 220px); }
.tjs-deco--w230 { width: clamp(120px, 15vw, 230px); }
.tjs-deco--w260 { width: clamp(130px, 17vw, 260px); }
.tjs-deco--w300 { width: clamp(180px, 20vw, 300px); }
.tjs-deco--w300s { width: clamp(160px, 20vw, 300px); }
.tjs-deco--w320 { width: clamp(180px, 22vw, 320px); }
.tjs-deco--w360 { width: clamp(180px, 24vw, 360px); }
/* PC（768px以上）のみ幅を拡大。SPは元の w〇〇 のまま */
@media (min-width: 768px) {
  .tjs-deco--pc-w320 { width: clamp(200px, 22vw, 320px); }
}
/* 透過 */
.tjs-deco--o80 { opacity: .8; }
.tjs-deco--o85 { opacity: .85; }
.tjs-deco--o90 { opacity: .9; }

/* ==========================================================================
   Contact CTA
   ========================================================================== */
.tjs-cta {
  background: #fff;
  color: #1C2B3A;
  border-radius: 20px;
  padding: clamp(24px, 4vw, 44px);
  display: flex;
  flex-direction: column;
  gap: 28px;
}
.tjs-cta__row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
  gap: 16px;
}
.tjs-cta__tel {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: 24px;
  border-radius: 14px;
  border: 2px solid #0B5AA6;
  color: #1C2B3A;
  text-align: center;
  text-decoration: none;
}
.tjs-cta__tel:hover {
  color: #1C2B3A;
}
.tjs-cta__tel--solid {
  background: #0B5AA6;
  color: #fff;
}
.tjs-cta__tel--solid:hover {
  color: #fff;
}
.tjs-cta__tel-label {
  font-size: 1.4rem;
  font-weight: 700;
}
.tjs-cta__tel-num {
  font-family: "Outfit", sans-serif;
  font-weight: 600;
  font-size: clamp(28px, 3.4vw, 38px);
  color: #0B5AA6;
  line-height: 1;
}
.tjs-cta__tel--solid .tjs-cta__tel-num {
  color: #fff;
}
.tjs-cta__tel-note {
  font-size: 1.3rem;
  color: #4A5B6E;
}
.tjs-cta__tel--solid .tjs-cta__tel-note {
  color: #E3EDF7;
}
.tjs-cta__link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 20px 24px;
  border-radius: 14px;
  background: #F5F8FB;
  color: #1C2B3A;
  text-decoration: none;
}
.tjs-cta__link:hover {
  color: #1C2B3A;
}
.tjs-cta__link-body {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.tjs-cta__link-title {
  font-weight: 700;
  font-size: 1.6rem;
}
.tjs-cta__link-note {
  font-size: 1.3rem;
  color: #4A5B6E;
}
.tjs-cta__link-arrow {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: #0B5AA6;
  color: #fff;
  display: grid;
  place-items: center;
  transition: transform .3s ease;
}
.tjs-cta__link:hover .tjs-cta__link-arrow {
  transform: translateX(4px);
}
.tjs-cta__link-arrow--line {
  background: #06C755;
}

/* ==========================================================================
   下層ページヒーロー
   ========================================================================== */
.tjs-page-hero {
  background: #0B5AA6;
  color: #fff;
  position: relative;
  overflow: hidden;
}
.tjs-page-hero__inner {
  position: relative;
  z-index: 1;
  max-width: 1200px;
  margin: 0 auto;
  padding: clamp(40px, 5vw, 64px) 20px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 40px;
}
.tjs-page-hero__inner--text {
  flex-direction: column;
  align-items: stretch;
  gap: 16px;
}
.tjs-page-hero__body {
  flex: 1 1 380px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.tjs-page-hero__crumb {
  font-size: 1.3rem;
  color: #D6E4F2;
}
.tjs-page-hero__crumb a,
.tjs-page-hero__crumb a:hover {
  color: #D6E4F2;
  text-decoration: underline;
}
.tjs-page-hero__title {
  font-size: clamp(30px, 4vw, 46px);
  font-weight: 700;
  letter-spacing: .04em;
  line-height: 1.5;
}
.tjs-page-hero__lead {
  font-size: 1.5rem;
  line-height: 2;
  color: #E3EDF7;
}
/* リードをPCで2行に収める（文字列幅を少し広げ、字間を詰める） */
@media (min-width: 768px) {
  .tjs-page-hero__body--wide {
    flex: 1.2 1 420px;
  }
  .tjs-page-hero__body--wide .tjs-page-hero__lead {
    letter-spacing: .02em;
  }
}
.tjs-page-hero__img {
  flex: 1 1 380px;
  min-width: 0;
  width: 100%;
  aspect-ratio: 16 / 10;
  border-radius: 16px;
  overflow: hidden;
}
.tjs-page-hero__img img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.tjs-page-hero__img--pos30 img {
  object-position: center 30%;
}

/* ==========================================================================
   施工事例カード（TOP・各事業ページ・一覧で共通）
   ========================================================================== */
.tjs-works-card {
  display: flex;
  flex-direction: column;
  background: #fff;
  border-radius: 12px;
  overflow: hidden;
  color: #1C2B3A;
  text-decoration: none;
  border: 1px solid #DCE5EF;
  transition: border-color .3s ease, box-shadow .3s ease;
}
.tjs-works-card:hover {
  opacity: 1;
  color: #1C2B3A;
  border-color: #f3c5c7;
  box-shadow: 0 4px 16px rgba(11, 90, 166, .12);
}
.tjs-works-card__img {
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: repeating-linear-gradient(135deg, #DCE6F1 0 12px, #E7EEF6 12px 24px);
  display: grid;
  place-items: center;
}
.tjs-works-card__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .5s ease;
}
.tjs-works-card:hover .tjs-works-card__img img {
  transform: scale(1.03);
}
.tjs-works-card__noimg {
  background: rgba(255, 255, 255, .9);
  color: #33445A;
  font-size: 1.2rem;
  padding: 6px 12px;
  border-radius: 6px;
}
.tjs-works-card__body {
  padding: 18px 20px 22px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.tjs-works-card__meta {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.tjs-cat {
  background: #E4EEF8;
  color: #0B5AA6;
  font-size: 1.2rem;
  font-weight: 700;
  padding: 4px 10px;
  border-radius: 999px;
}
.tjs-cat--lg {
  font-size: 1.3rem;
  padding: 5px 12px;
}
.tjs-date {
  font-family: "Outfit", sans-serif;
  font-weight: 600;
  font-size: 1.3rem;
  color: #4A5B6E;
}
.tjs-date--lg {
  font-size: 1.4rem;
}
.tjs-works-card__title {
  font-weight: 700;
  font-size: 1.6rem;
  line-height: 1.6;
}
.tjs-works-card__area {
  font-size: 1.3rem;
  color: #4A5B6E;
}

/* ==========================================================================
   FLOW（STEPカード）
   ========================================================================== */
.tjs-flow {
  background: #fff;
  border-radius: 14px;
  padding: 26px 20px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  border-top: 4px solid #0B5AA6;
}
.tjs-flow--tint {
  background: #F5F8FB;
}
.tjs-flow__step {
  font-family: "Outfit", sans-serif;
  font-weight: 600;
  font-size: 1.3rem;
  letter-spacing: .14em;
  color: #0B5AA6;
}
.tjs-flow__title {
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 1.5;
}
.tjs-flow__text {
  font-size: 1.3rem;
  line-height: 1.85;
  color: #33445A;
}

/* ==========================================================================
   料金表
   ========================================================================== */
.tjs-price {
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid #DCE5EF;
  background: #fff;
}
.tjs-price__row {
  display: flex;
  flex-wrap: wrap;
  border-bottom: 1px solid #DCE5EF;
}
.tjs-price__name {
  flex: 1 1 260px;
  background: #F5F8FB;
  padding: 22px 24px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 4px;
  font-size: 1.7rem;
  font-weight: 700;
}
.tjs-price--top .tjs-price__name {
  justify-content: flex-start;
}
.tjs-price--alt .tjs-price__name {
  background: #EEF3F8;
}
.tjs-price__name-sub {
  font-size: 1.3rem;
  font-weight: 400;
  color: #4A5B6E;
}
.tjs-price__body {
  flex: 2 1 360px;
  padding: 22px 24px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  justify-content: center;
}
.tjs-price__value {
  font-family: "Outfit", sans-serif;
  font-weight: 600;
  font-size: 2.6rem;
  color: #0B5AA6;
}
.tjs-price__unit {
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-size: 1.4rem;
  font-weight: 700;
  color: #1C2B3A;
  margin-left: 4px;
}
.tjs-price__desc {
  font-size: 1.3rem;
  line-height: 1.8;
  color: #4A5B6E;
}
.tjs-price-note {
  margin-top: 18px;
  font-size: 1.3rem;
  line-height: 1.9;
  color: #4A5B6E;
}

/* ==========================================================================
   FAQ（accordion + accordion--qa の見た目差分）
   ========================================================================== */
.tjs-faq {
  display: flex;
  flex-direction: column;
  gap: 14px;
  max-width: 880px;
  margin: 0 auto;
}
.tjs-faq .accordion,
.tjs-faq .accordion--qa:first-child {
  background: #fff;
  border-radius: 12px;
  border: 1px solid #DCE5EF;
}
.tjs-faq .accordion__head {
  gap: 16px;
  padding: 20px 24px;
  background: none;
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.6;
  color: #1C2B3A;
}
.tjs-faq .accordion__head:hover {
  background: none;
}
.tjs-faq .accordion__head::before {
  position: static;
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  background: #0B5AA6;
  font-family: "Outfit", sans-serif;
  font-weight: 600;
  font-size: 1.6rem;
}
.tjs-faq .accordion__head::after {
  flex-shrink: 0;
  width: 20px;
  margin-left: 0;
  text-align: center;
  font-size: 2.2rem;
  font-weight: 700;
  color: #0B5AA6;
}
.tjs-faq__q {
  flex: 1;
}
.tjs-faq .accordion__body {
  display: block;
  max-height: 0;
  overflow: hidden;
  padding: 0 24px 0 76px;
  border-top: 0;
  background: none;
  transition: max-height .3s ease, padding .3s ease;
}
.tjs-faq .accordion.is-open .accordion__body {
  padding-bottom: 22px;
}
.tjs-faq .accordion__body::before {
  left: 24px;
  width: 36px;
  height: 36px;
  background: #bdc733;
  color: #1C2B3A;
  font-family: "Outfit", sans-serif;
  font-weight: 600;
  font-size: 1.6rem;
}
.tjs-faq .accordion__body p {
  margin-top: 6px;
  font-size: 1.5rem;
  line-height: 1.9;
  color: #33445A;
}
@media (max-width: 639px) {
  .tjs-faq .accordion__head {
    padding: 20px 24px;
    font-size: 1.6rem;
  }
  .tjs-faq .accordion__head::before,
  .tjs-faq .accordion__body::before {
    width: 36px;
    height: 36px;
    font-size: 1.6rem;
  }
  .tjs-faq .accordion__body {
    padding-left: 76px;
    padding-right: 24px;
  }
}

/* ==========================================================================
   汎用パーツ
   ========================================================================== */
/* ボックス */
.tjs-panel {
  background: #fff;
  border: 1px solid #DCE5EF;
  border-radius: 16px;
  padding: clamp(20px, 3vw, 36px);
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.tjs-panel--tint {
  background: #F5F8FB;
  border: 0;
  padding: clamp(20px, 3vw, 32px);
  gap: 18px;
}
.tjs-panel--plain {
  border: 0;
  padding: clamp(24px, 3.5vw, 40px);
  gap: 24px;
}
.tjs-infobox {
  background: #fff;
  border-radius: 12px;
  padding: 20px 22px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.tjs-infobox--tint {
  background: #F5F8FB;
  padding: 18px 20px;
  gap: 8px;
}
.tjs-infobox__title {
  font-size: 1.4rem;
  font-weight: 700;
  color: #0B5AA6;
}
.tjs-text {
  font-size: 1.5rem;
  line-height: 2;
  color: #33445A;
}
.tjs-text--sm {
  font-size: 1.4rem;
  line-height: 1.9;
}
.tjs-text--white {
  color: #E3EDF7;
}

/* 注意書き（ピンク） */
.tjs-note {
  background: #FBEBEC;
  border-radius: 14px;
  padding: 22px 26px;
  display: flex;
  gap: 16px;
  align-items: flex-start;
}
.tjs-note__icon {
  flex-shrink: 0;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: #fff;
  color: #0B5AA6;
  display: grid;
  place-items: center;
  font-weight: 700;
}
.tjs-note__text {
  font-size: 1.4rem;
  line-height: 1.9;
  color: #1C2B3A;
}

/* キャプション付き写真 */
.tjs-figure {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.tjs-figure--gap6 { gap: 6px; }
.tjs-figure--gap10 { gap: 10px; }
.tjs-figure__caption {
  font-size: 1.4rem;
  line-height: 1.7;
  color: #33445A;
  font-weight: 500;
}
.tjs-figure__caption--sm {
  font-size: 1.2rem;
  line-height: 1.6;
}
.tjs-figure__caption--13 {
  font-size: 1.3rem;
  line-height: 1.5;
}
.tjs-photo {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 12px;
}
.tjs-photo--r8 { border-radius: 8px; }
.tjs-photo--r10 { border-radius: 10px; }
.tjs-photo--r14 { border-radius: 14px; }
.tjs-photo--r20 { border-radius: 20px; }
.tjs-photo--square { aspect-ratio: 1 / 1; }
.tjs-photo--wide { aspect-ratio: 16 / 9; }

/* ライトボックス付き写真 */
.tjs-zoom {
  position: relative;
  display: block;
  border-radius: 12px;
  overflow: hidden;
  cursor: zoom-in;
}
.tjs-zoom:hover {
  opacity: 1;
}
.tjs-zoom img {
  border-radius: 0;
  transition: transform .5s ease;
}
.tjs-zoom:hover img {
  transform: scale(1.03);
}
.tjs-zoom__icon {
  position: absolute;
  right: 10px;
  bottom: 10px;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: rgba(28, 28, 28, .72);
  display: grid;
  place-items: center;
}

/* 丸枠イラスト */
.tjs-circle-illust {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 50%;
  background: #fff;
}

/* 2カラム（テキスト＋画像） */
.tjs-split {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(32px, 5vw, 64px);
  align-items: center;
}
.tjs-split__text {
  flex: 1.4 1 420px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.tjs-split__text--13 {
  flex: 1.3 1 420px;
}
.tjs-split__text--12 {
  flex: 1.2 1 420px;
}

/* ==========================================================================
   会社概要テーブル
   ========================================================================== */
.tjs-table {
  background: #fff;
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid #DCE5EF;
}
.tjs-table__row {
  display: flex;
  flex-wrap: wrap;
  border-bottom: 1px solid #DCE5EF;
}
.tjs-table__row:last-child {
  border-bottom: 0;
}
.tjs-table__th {
  flex: 0 0 200px;
  background: #EEF3F8;
  padding: 22px 26px;
  font-weight: 700;
  font-size: 1.5rem;
}
.tjs-table__td {
  flex: 1 1 300px;
  padding: 22px 26px;
  font-size: 1.5rem;
  line-height: 1.9;
}
.tjs-table__td--list {
  line-height: 2.1;
}
.tjs-table__note {
  font-size: 1.3rem;
  color: #4A5B6E;
}
@media (max-width: 639px) {
  .tjs-table__th {
    flex-basis: 100%;
  }
}

/* ==========================================================================
   お問い合わせフォーム
   ========================================================================== */
.tjs-form {
  background: #F5F8FB;
  border-radius: 20px;
  padding: clamp(24px, 4vw, 48px);
  display: flex;
  flex-direction: column;
  gap: 22px;
}
.tjs-form__field {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.tjs-form__label {
  display: flex;
  align-items: center;
  gap: 10px;
  font-weight: 700;
  font-size: 1.5rem;
}
.tjs-form__req {
  background: #0B5AA6;
  color: #fff;
  font-size: 1.1rem;
  padding: 2px 8px;
  border-radius: 4px;
}
.tjs-form .form-input {
  font-size: 1.6rem;
  padding: 14px 16px;
  border: 1px solid #C9D6E4;
  border-radius: 10px;
  background: #fff;
  color: #1C2B3A;
}
.tjs-form textarea.form-input {
  resize: vertical;
  line-height: 1.8;
}
.tjs-form__note {
  font-size: 1.3rem;
  line-height: 1.8;
  color: #4A5B6E;
}
.tjs-form__submit {
  align-self: center;
  background: #0B5AA6;
  color: #fff;
  border: 0;
  border-radius: 999px;
  padding: 18px 64px;
  font-weight: 700;
  font-size: 1.6rem;
  cursor: pointer;
  transition: background .3s ease;
}
.tjs-form__submit:hover {
  background: #083F75;
}

/* ==========================================================================
   施工事例 一覧・詳細（メイン＋サイドバー）
   ========================================================================== */
.tjs-blog {
  display: flex;
  flex-wrap: wrap;
  gap: 48px;
  align-items: flex-start;
}
.tjs-blog__main {
  flex: 1 1 600px;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 32px;
}
.tjs-blog__side {
  flex: 0 1 300px;
  min-width: 260px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.tjs-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.tjs-tabs__item {
  font-weight: 700;
  font-size: 1.4rem;
  line-height: 1.5;
  padding: 10px 20px;
  border-radius: 999px;
  border: 2px solid #0B5AA6;
  background: #fff;
  color: #0B5AA6;
  text-decoration: none;
}
.tjs-tabs__item:hover,
.tjs-tabs__item.is-current {
  opacity: 1;
  background: #0B5AA6;
  color: #fff;
}
.tjs-side-box {
  background: #fff;
  border-radius: 14px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.tjs-side-box--gap14 { gap: 14px; }
.tjs-side-box--gap10 { gap: 10px; }
.tjs-side-box__title {
  font-weight: 700;
  font-size: 1.6rem;
  padding-bottom: 12px;
  border-bottom: 2px solid #0B5AA6;
}
.tjs-side-box__link {
  display: flex;
  justify-content: space-between;
  font-size: 1.4rem;
  color: #1C2B3A;
  text-decoration: none;
  padding: 4px 0;
}
.tjs-side-box__link--arrow {
  padding: 6px 0;
}
.tjs-side-box__link--arrow::after {
  content: "›";
  color: #0B5AA6;
}
.tjs-side-box__link:hover {
  color: #0B5AA6;
}
.tjs-recent {
  display: flex;
  gap: 12px;
  color: #1C2B3A;
  text-decoration: none;
}
.tjs-recent:hover {
  color: #0B5AA6;
}
.tjs-recent__thumb {
  flex-shrink: 0;
  width: 64px;
  height: 48px;
  border-radius: 6px;
  overflow: hidden;
  background: repeating-linear-gradient(135deg, #DCE6F1 0 8px, #E7EEF6 8px 16px);
}
.tjs-recent__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.tjs-recent__body {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.tjs-recent__date {
  font-family: "Outfit", sans-serif;
  font-weight: 600;
  font-size: 1.2rem;
  color: #4A5B6E;
}
.tjs-recent__title {
  font-size: 1.3rem;
  line-height: 1.6;
  font-weight: 500;
}
.tjs-side-cta {
  background: #0B5AA6;
  color: #fff;
  border-radius: 14px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.tjs-side-cta__title {
  font-weight: 700;
  font-size: 1.6rem;
}
.tjs-side-cta__tel,
.tjs-side-cta__tel:hover {
  color: #fff;
  text-decoration: none;
  font-family: "Outfit", sans-serif;
  font-weight: 600;
  font-size: 2.4rem;
}
.tjs-side-cta__note {
  font-size: 1.2rem;
  color: #E3EDF7;
}

/* ページネーション（pagination の見た目差分：丸型） */
.tjs-pagination {
  margin: 0;
}
.tjs-pagination .pagination__link {
  width: 44px;
  min-width: 44px;
  height: 44px;
  padding: 0;
  border-radius: 50%;
  border: 1px solid #DCE5EF;
  background: #fff;
  color: #0B5AA6;
  font-family: "Outfit", sans-serif;
  font-weight: 600;
}
.tjs-pagination .pagination__link.is-current {
  border-color: #0B5AA6;
}

/* 記事詳細 */
.tjs-article {
  flex: 1 1 600px;
  min-width: 0;
  background: #fff;
  border-radius: 20px;
  padding: clamp(24px, 4vw, 48px);
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.tjs-article__title {
  font-size: clamp(24px, 3vw, 32px);
  font-weight: 700;
  line-height: 1.5;
}
.tjs-article__main-img {
  aspect-ratio: 16 / 9;
  border-radius: 14px;
  overflow: hidden;
  background: repeating-linear-gradient(135deg, #DCE6F1 0 14px, #E7EEF6 14px 28px);
  display: grid;
  place-items: center;
}
.tjs-article__main-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.tjs-article__noimg {
  background: rgba(255, 255, 255, .9);
  color: #33445A;
  font-size: 1.3rem;
  padding: 8px 14px;
  border-radius: 8px;
}
.tjs-article__spec {
  display: flex;
  flex-wrap: wrap;
  border: 1px solid #DCE5EF;
  border-radius: 12px;
  overflow: hidden;
}
.tjs-article__spec-item {
  flex: 1 1 180px;
  padding: 14px 18px;
  border-right: 1px solid #DCE5EF;
}
.tjs-article__spec-item:last-child {
  border-right: 0;
}
.tjs-article__spec-label {
  display: block;
  font-size: 1.2rem;
  color: #4A5B6E;
}
.tjs-article__spec-value {
  display: block;
  font-weight: 700;
}
.tjs-article__h2 {
  margin-top: 12px;
  font-size: 2.1rem;
  font-weight: 700;
  padding-bottom: 10px;
  border-bottom: 2px solid #0B5AA6;
}
.tjs-article__text {
  font-size: 1.6rem;
  line-height: 2.1;
  color: #33445A;
}
.tjs-article__ba {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
  gap: 14px;
}
.tjs-article__ba-img {
  position: relative;
  aspect-ratio: 4 / 3;
  border-radius: 10px;
  overflow: hidden;
  background: repeating-linear-gradient(135deg, #E3EBF4 0 10px, #EDF2F8 10px 20px);
}
.tjs-article__ba-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.tjs-article__back {
  align-self: center;
  margin-top: 12px;
}
.tjs-crumb {
  margin-bottom: 28px;
  font-size: 1.3rem;
  color: #4A5B6E;
}

/* BEFORE / AFTER ラベル */
.tjs-ba-label {
  position: absolute;
  left: 12px;
  top: 12px;
  background: #1C2B3A;
  color: #fff;
  font-family: "Outfit", sans-serif;
  font-weight: 600;
  font-size: 1.2rem;
  letter-spacing: .12em;
  line-height: 1.5;
  padding: 5px 12px;
  border-radius: 6px;
}
.tjs-ba-label--after {
  background: #0B5AA6;
}
.tjs-ba-label--sm {
  left: 10px;
  top: auto;
  bottom: 10px;
  font-size: 1.1rem;
  letter-spacing: .1em;
  padding: 3px 10px;
  border-radius: 4px;
}

/* ==========================================================================
   下層ページ共通パーツ
   ========================================================================== */
/* 写真カード（写真＋タイトル＋説明） */
.tjs-card {
  background: #F5F8FB;
  border-radius: 16px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.tjs-card--white {
  background: #fff;
}
.tjs-card__img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}
.tjs-card__img--wide {
  aspect-ratio: 16 / 9;
}
.tjs-card__body {
  padding: 22px 22px 26px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.tjs-card__body--md {
  padding: 26px 26px 30px;
  gap: 12px;
}
.tjs-card__body--lg {
  padding: 28px 28px 32px;
  gap: 14px;
}
.tjs-card__title {
  font-size: 1.9rem;
  font-weight: 700;
  line-height: 1.5;
  color: #0B5AA6;
}
.tjs-card__title--lg {
  font-size: 2.1rem;
}
/* 横並びカード（画像左・文章右／767px以下は縦積み） */
@media (min-width: 768px) {
  .tjs-card--h {
    flex-direction: row;
    align-items: center;
  }
  .tjs-card--h .tjs-card__img {
    width: 48%;
    flex-shrink: 0;
  }
  .tjs-card--h .tjs-card__body {
    flex: 1;
  }
}

/* 番号付き強みカード */
.tjs-strength {
  background: #fff;
  color: #1C2B3A;
  border-radius: 16px;
  padding: 32px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.tjs-strength__num {
  font-family: "Outfit", sans-serif;
  font-weight: 600;
  font-size: 3.6rem;
  color: #0B5AA6;
  line-height: 1;
}
.tjs-strength__title {
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.5;
  color: #0B5AA6;
}
.tjs-strength__text {
  font-size: 1.4rem;
  line-height: 1.95;
  color: #33445A;
}

/* 有害鳥獣：動物ごとの紹介ブロック */
.tjs-animal {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(24px, 4vw, 48px);
  align-items: flex-start;
  background: #F5F8FB;
  border-radius: 20px;
  padding: clamp(24px, 4vw, 44px);
}
.tjs-animal__photos {
  flex: 1 1 320px;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.tjs-animal__thumbs {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}
.tjs-animal__body {
  flex: 1.3 1 400px;
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.tjs-animal-list {
  display: flex;
  flex-direction: column;
  gap: 40px;
}
.tjs-others {
  margin-top: 56px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.tjs-others__title {
  font-size: 2.2rem;
  font-weight: 700;
  line-height: 1.5;
  text-align: center;
}
.tjs-other {
  border: 1px solid #DCE5EF;
  border-radius: 14px;
  padding: 24px 16px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  text-align: center;
}
.tjs-other__icon {
  width: 96px;
  height: 96px;
  object-fit: contain;
  display: block;
}
.tjs-other__name {
  font-size: 1.8rem;
  font-weight: 700;
}
.tjs-other__note {
  font-size: 1.2rem;
  color: #4A5B6E;
  line-height: 1.6;
  margin-top: -6px;
}

/* ビフォーアフター */
.tjs-ba {
  background: #F5F8FB;
  border-radius: 16px;
  padding: clamp(18px, 3vw, 28px);
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.tjs-ba__head {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.tjs-ba__cat {
  background: #0B5AA6;
  color: #fff;
  font-size: 1.2rem;
  font-weight: 700;
  padding: 4px 12px;
  border-radius: 999px;
}
.tjs-ba__title {
  font-size: 1.7rem;
  font-weight: 700;
}
.tjs-ba__pair {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
  gap: 16px;
  align-items: center;
}
.tjs-ba__fig {
  position: relative;
}
.tjs-ba-list {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.tjs-ba-wrap {
  margin-top: 56px;
  display: flex;
  flex-direction: column;
  gap: 28px;
}

/* 機材紹介（写真＋バッジ） */
.tjs-equip__photo {
  flex: 1 1 400px;
  min-width: 0;
  position: relative;
}
.tjs-equip__badge {
  position: absolute;
  left: -12px;
  top: -16px;
  background: #bdc733;
  color: #1C2B3A;
  border-radius: 999px;
  padding: 10px 20px;
  font-weight: 700;
  font-size: 1.4rem;
  line-height: 1.5;
  border: 3px solid #fff;
}
.tjs-chip-dark {
  background: rgba(255, 255, 255, .1);
  border: 1px solid rgba(255, 255, 255, .25);
  border-radius: 12px;
  padding: 16px 18px;
  font-size: 1.4rem;
  font-weight: 700;
  line-height: 1.6;
}
.tjs-grid--180 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr)); gap: 12px; }

/* 丸枠イラスト（右側配置） */
.tjs-circle-box {
  flex: 1 1 300px;
  max-width: 440px;
}
.tjs-circle-box--sm {
  max-width: 420px;
  aspect-ratio: 1 / 1;
  border-radius: 50%;
  border: 4px solid #bdc733;
  background: #fff;
  overflow: hidden;
}
.tjs-circle-box--sm img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transform: scale(1.04);
}

/* 代表挨拶 */
.tjs-greeting {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 28px;
  text-align: center;
}
.tjs-greeting__catch {
  font-size: clamp(20px, 2.4vw, 26px);
  font-weight: 700;
  line-height: 1.7;
  color: #0B5AA6;
}
.tjs-greeting__text {
  font-size: 1.6rem;
  line-height: 2.1;
  color: #33445A;
  text-align: left;
  text-wrap: pretty;
}
.tjs-greeting__sign {
  align-self: flex-end;
  font-size: 1.5rem;
  color: #1C2B3A;
}
.tjs-greeting__name {
  font-size: 2rem;
  font-weight: 700;
  letter-spacing: .1em;
}

/* 会社概要・お問い合わせ：電話カード（小） */
.tjs-cta__tel--sm {
  gap: 6px;
  padding: 20px;
}
.tjs-cta__tel--sm .tjs-cta__tel-label {
  font-size: 1.3rem;
}
.tjs-cta__tel--sm .tjs-cta__tel-num {
  font-size: 3rem;
}
.tjs-line-link {
  margin-top: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 18px;
  border-radius: 14px;
  border: 1px solid #DCE5EF;
  background: #fff;
  color: #1C2B3A;
  text-decoration: none;
  font-weight: 700;
  font-size: 1.5rem;
  text-align: center;
}
.tjs-line-link:hover {
  color: #1C2B3A;
  border-color: #06C755;
}
.tjs-line-link__icon {
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  color: #06C755;
  display: grid;
  place-items: center;
  font-size: 32px;
  line-height: 1;
}
.tjs-mb-40 {
  margin-bottom: 40px;
}
.tjs-mt-40 {
  margin-top: 40px;
}
.tjs-mt-32 {
  margin-top: 32px;
}
.tjs-mt-48 {
  margin-top: 48px;
}
.tjs-catch {
  font-size: clamp(20px, 2.4vw, 26px);
  font-weight: 700;
  line-height: 1.5;
}

/* ==========================================================================
   Form（CMSフォームの上書き）
   ========================================================================== */
.form-pattern-1 dl dt:not(.pattern-exclusion) span.required::before {
  content: '必須' !important;
  color: #fff !important;
  background: #0B5AA6 !important;
}
.form-pattern-1 .submit-btn,
button.submit-btn {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  width: 100% !important;
  max-width: 320px !important;
  margin: 40px auto 0 !important;
  padding: 18px 32px !important;
  background: #0B5AA6 !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 999px !important;
  box-shadow: 0 6px 18px rgba(11, 90, 166, .28) !important;
  font-family: inherit !important;
  font-size: 1.6rem !important;
  font-weight: 700 !important;
  line-height: 1.5 !important;
  letter-spacing: .05em !important;
  cursor: pointer !important;
  transition: background .3s ease !important;
}
.form-pattern-1 .submit-btn:hover,
button.submit-btn:hover {
  opacity: 1 !important;
  background: #083F75 !important;
}

/* ==========================================================================
   Thanks（送信完了ページ）
   ========================================================================== */
.tjs-thanks {
  text-align: center;
}
.tjs-thanks__text {
  margin-top: 24px;
  line-height: 2;
}
.tjs-thanks__btn {
  margin-top: 40px;
}

/* ==========================================================================
   SP調整（767px以下）
   ========================================================================== */
/* SPのみ改行 */
.tjs-br-sp {
  display: none;
}
/* PC・タブレットのみ改行 */
@media (max-width: 767px) {
  .tjs-br-pc {
    display: none;
  }
  .tjs-br-sp {
    display: inline;
  }
  /* 背景イラストを少し透過（選ばれる理由・CONTACT） */
  .tjs-deco-fade-sp > .tjs-deco {
    opacity: .6;
  }
  /* フッターナビ非表示 */
  .tjs-footer__nav {
    display: none;
  }
  /* 固定バーのアイコンを大きく */
  .tjs-fixed-bar__icon {
    font-size: 2rem;
    line-height: 1.2;
  }
}
@media (max-width: 767px) {
  /* 代表挨拶のキャッチを2行に収める（1行最大18文字） */
  .tjs-greeting__catch {
    font-size: clamp(14px, 4.4vw, 20px);
    line-height: 1.8;
  }
}

/* 写真の入れ替え（[data-photo-swap]） */
[data-photo-swap] figure {
  cursor: pointer;
}
[data-photo-swap] figure img {
  transition: opacity .3s ease;
}
[data-photo-swap] figure:hover img,
[data-photo-swap] figure:focus-visible img {
  opacity: .75;
}
[data-photo-swap] figure:focus-visible {
  outline: 2px solid #0B5AA6;
  outline-offset: 3px;
  border-radius: 8px;
}
[data-photo-swap] > img.is-swapped {
  animation: tjs-photo-fade .4s ease;
}
@keyframes tjs-photo-fade {
  from { opacity: 0; }
  to   { opacity: 1; }
}