@charset "UTF-8";

/* ============================================================
   style.css
   防災サイト メインスタイルシート
   ============================================================

   目次（INDEX）
   ──────────────────────────────────────────────
   00. CSS カスタムプロパティ（変数）
   01. リセット・ベース
   02. レスポンシブ切り替えクラス
   03. ナビゲーション
       03-a. PC ナビ
       03-b. ハンバーガーメニュー（SP）
   04. イントロセクション
       04-a. intro_bg（背景）
       04-b. intro_img（sticky キャラクター）
       04-c. intro_box（テキストエリア）
       04-d. intro テキスト
       04-e. contents_box（一覧）
       04-f. open_chat_btn
       04-g. open_chat_text
       04-h. scroll
   05. カーブ区切り（curve_01 〜 curve_05）
   06. 災害時リンクセクション（iza / link_box）
       06-a. iza（背景帯）
       06-b. link_box（ドット背景）
       06-c. link_intro・link_text_box・link_img_box
       06-d. category_box（タブ付きリンク一覧）
       06-e. tab ナビゲーション
       06-f. パネル（panel）
       06-g. リンクグリッド（link-grid / link-item）
   07. 備えセクション（sonae_box）
   08. スライダー（sonae コンテンツ）
       08-a. スライダー構造
       08-b. カード（card）
       08-c. スライダーコントロール
   09. ニュースセクション（news_box）
   10. フッター
   11. ブログトップページ（bousai_blog_top）
   12. ブログカテゴリページ（bcat-*）
   13. ブログ記事詳細ページ（bousai_blog_single）
       13-a. 記事ナビゲーション（bousai-post-nav）
       13-b. 記事本文スタイル（single_box）
   14. ランダム記事ボックス（random_box）
   15. フォントサイズ統一上書き（--fs-adjust）
   16. レスポンシブ（ブレークポイント別）
       16-a. max-width: 600px  
       16-b. max-width: 900px
       16-c. max-width: 850px
       16-d. max-width: 666px
       16-e. max-width: 610px
       16-f. max-width: 480px
   ──────────────────────────────────────────────
*/


/* ============================================================
   00. CSS カスタムプロパティ（変数）
   ============================================================ */

:root {
  --fs-adjust: 0px;
}


/* ============================================================
   01. リセット・ベース
   ============================================================ */

* {
  margin: 0;
  padding: 0;
  line-height: 1;
  font-family: fot-tsukuardgothic-std, sans-serif !important;
  color: #57454d;
}

html,
body {
  margin: 0;
  padding: 0;
}

.seed {
  font-family: "LINE Seed JP", sans-serif !important;
}

img {
  width: 100%;
  vertical-align: bottom;
}

a {
  color: #000;
  text-decoration: none;
}

a:hover {
  cursor: pointer;
}

ul {
  list-style: none;
}


/* ============================================================
   02. レスポンシブ切り替えクラス
   ============================================================ */

.pc_only { display: block; }
.sp_only { display: none; }


/* ============================================================
   03. ナビゲーション
   ============================================================ */

/* ── 03-a. PC ナビ ── */
.header_logo{
	position: absolute;
	top: 1.5vw;
	left: 5vw;
	z-index: 3;
}

.header_logo a{
	display: block;
	width: 7vw;
	max-width: 100px;
}

.header_logo img{
	display: block;
	width: 100%;
	height: auto;
	
}

.pc_nav {
  position: fixed;
  top: 1.5vw;
  right: 5vw;
  z-index: 999;
  border-radius: 999px;
  display: flex;
  align-items: center;
  gap: 2em;
  padding: 6px 6px 6px 2em;
  background-color: #fff;
  border: 1.5px solid #faf07b;
}

.pc_nav ul {
  display: flex;
  gap: 1.5em;
  align-items: center;
}

.pc_nav a {
  font-weight: 700;
  font-size: clamp(17px, 1.5vw, 19px);
}

.for_line_chat {
  background-color: #8ac7b4;
  color: #fff;
  padding: 10px 28px;
  border-radius: 999px;
  white-space: nowrap;
  line-height: 1;
}

.pc_nav a:hover{opacity:0.6;}


/* ── 03-b. ハンバーガーメニュー（SP） ── */

/* チェックボックス（非表示・状態管理用） */
.menu-toggle:checked + .menu-button .menu-button__line {
  opacity: 0;
}

/* ハンバーガーボタン */
.menu-button {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  row-gap: 1.25vw;
  cursor: pointer;
  position: fixed;
  top: 3.5vw;
  right: 5vw;
  z-index: 1001;
  width: 52px;
  height: 33px;
  border: 1.5px solid #faf07b;
  background-color: #fff;
  border-radius: 16px;
}

/* 三本線（共通） */
.menu-button__line,
.menu-button::before,
.menu-button::after {
  content: "";
  width: 14px;
  height: 1.5px;
  background-color: #57454d;
  border-radius: 999px;
  transition: transform 0.6s, opacity 0.6s;
}

.menu-button::before,
.menu-button::after {
  position: absolute;
}

.menu-button::before {
  transform: translateY(-5.5px);
}

.menu-button::after {
  transform: translateY(5.5px);
}

/* 中央ライン（実体） */
.menu-button__line {
  position: relative;
  display: block;
  background: #57454d;
  transition: opacity 0.6s;
}

/* 開いた状態 */
.menu-toggle:checked + .menu-button {
  background: #fff;
}

.menu-toggle:checked + .menu-button .menu-button__line {
  opacity: 0;
  visibility: hidden;
}

.menu-toggle:checked + .menu-button::before {
  transform: translateY(0) rotate(45deg);
  background: #57454d;
}

.menu-toggle:checked + .menu-button::after {
  transform: translateY(0) rotate(-45deg);
  background: #57454d;
}

/* メニューオーバーレイ */
.menu-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #ef940e;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.6s;
  z-index: 1000;
}

.menu-toggle:checked ~ .menu-overlay {
  opacity: 0;
  pointer-events: auto;
}

/* メニュー本体 */
.menu {
  position: fixed;
  top: 0;
  height: 100%;
  right: -0.833vw;
  transform: translateX(100%);
  width: 100%;
  background-color: #ef940e;
  padding: 1.667vw;
  transition: transform 0.6s;
  z-index: 1000;
}

.menu-toggle:checked ~ .menu {
  transform: translateX(0);
}

/* メニューリスト */
.menu-list {
  width: 75%;
  margin: 20% auto 0;
  padding: 0;
  list-style: none;
}

.menu-list li {
  color: #fff;
  font-size: clamp(20px, 5vw, 23px);
  position: relative;
  padding: 25px 0;
  text-align: center;
  font-weight: 500;
}

.menu-list li::before,
.menu-list li::after {
  content: "";
  position: absolute;
  left: 0;
  width: 100%;
  height: 1px;
  background-color: #fff;
}

.menu-list li::before { top: 0; }
.menu-list li::after  { bottom: -1px; }

.menu-list li a {
  font-weight: 400;
  color: #fff;
  display: inline-block;
  width: 100%;
  padding: 0;
}

/* SP 専用 LINE ボタン */
.sp_only_line a {
  position: fixed;
  background-color: #8ac7b4;
  color: #fff;
  font-weight: bold;
  font-size: 14px;
  top: 3.5vw;
  right: 23vw;
  z-index: 1001;
  width: 52px;
  text-align: center;
  padding: 10px;
  border-radius: 16px;
}


/* ============================================================
   04. イントロセクション
   ============================================================ */

/* ── 04-a. intro_bg（背景） ── */

.intro_bg {
  width: 95%;
  margin: 0 auto;
  position: relative;
}

.intro_bg_right {
  position: absolute;
  width: 100%;
  max-width: 27.75vw;
  top: 0;
  right: 0;
}

.intro_bg_left {
  position: absolute;
  width: 100%;
  max-width: 18.75vw;
  top: 12.5vw;
  left: 0;
}


/* ── 04-b. intro_img（sticky キャラクター） ──
   intro_bg の直下に配置することで intro_bg 全体が sticky の親になる */

.intro_img {
  position: sticky;
  top: 65vw;
  transform: translateY(-44vw);
  height: 0;
  overflow: visible;
  z-index: 1;
  pointer-events: none;
}


/* ── 04-c. intro_box（テキストエリア） ── */

.intro_box {
  position: relative;
  z-index: 2; /* intro_img より前面 */
  width: 100%;
  margin: 0 auto;
  max-width: 83.333vw;
  text-align: center;
  padding-top: 16.25vw;
  box-sizing: border-box;
}


/* ── 04-d. intro テキスト ── */

.intro h3 {
  font-size: clamp(13px, 1.3vw, 16px);
  margin-bottom: 2.917vw;
}

.intro h2 {
  font-size: clamp(38.5px, 5.5vw, 66px);
  margin-bottom: 5vw;
}

.intro p {
  font-weight: 700;
  line-height: 2;
  font-size: clamp(16px, 1.6vw, 20px);
  margin-bottom: 2.5vw;
}


/* ── 04-e. contents_box（一覧） ── */

.contents_box {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: 4.167vw;
}

.contents_box li {
  font-size: clamp(13px, 1.3vw, 16px);
  line-height: 1.4;
  margin-bottom: 1vw;
}

/* 背景 SVG 装飾 */
.contents_box ul {
  position: relative;
}

.contents_box ul::after {
  position: absolute;
  content: "";
  background-image: url(bosai-img/intro_list_bg.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 38vw;
  height: 14vw;
  pointer-events: none;
}

.contents_box ul li {
  display: flex;
  gap: .5em;
}

.contents_box ul li::before {
  content: "★";
  flex-shrink: 0;
}

.contents_box ul li:nth-child(odd)::before  { color: #f5b387; }
.contents_box ul li:nth-child(even)::before { color: #8ac7b4; }

.contents_box ul li:last-child::before {
  content: none;
}

.contents_box ul li:last-child {
  margin-left: 1em;
  margin-bottom: 0;
}


/* ── 04-f. open_chat_btn ── */

.open_chat_btn {
  display: flex;
  justify-content: center;
  margin-bottom: 2vw;
  font-weight: 700;
}

.open_chat_btn a {
	  border: 2px solid #8ac7b4;
line-height:1.2;
  display: block;
  background-color: #8ac7b4;
  border-radius: 83.25vw;
  box-sizing: border-box;
  color: #fff;
  font-size: clamp(18px, 2vw, 27px);
  max-width: 480px;
  padding: 15px 45px;
}

.open_chat_btn span {
  font-size: clamp(13px, 1.65vw, 18px);
  color: inherit;
}

.open_chat_btn a:hover {
  background-color: #fff;
  color: #57454d;
}


/* ── 04-g. open_chat_text ── */

.open_chat_text {
  margin-bottom: 6.25vw;
}

.open_chat_text p {
  line-height: 1.5;
  font-size: clamp(13px, 1.3vw, 16px);
}


/* ── 04-h. scroll ── */

.scroll img {
  max-width: 5.667vw;
}


/* ============================================================
   05. カーブ区切り（curve_01 〜 curve_05）
   ============================================================ */

/* -- 白い凸型カーブ（上部） -- */
.curve_01 {
  overflow: hidden;
  height: 10vw;
  width: 100vw;
  position: relative;
  margin-top: -1.667vw;
}

.curve_01__circle {
  width: 166.667vw;
  height: 83.333vw;
  border-radius: 54%;
  background: #fff;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 0;
}

/* -- ドットパターン 凸型カーブ（下部） -- */
.curve_02 {
  margin-top: -10vw;
  overflow: hidden;
  height: 10vw;
  width: 100vw;
  position: relative;
}

.curve_02__circle {
  width: 166.667vw;
  height: 83.333vw;
  border-radius: 54%;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: 0;
  background-color: #f8f6f0;
  background:
    radial-gradient(circle, transparent 20%, #f8f6f0 20%, #f8f6f0 80%, transparent 80%, transparent),
    radial-gradient(circle, transparent 20%, #f8f6f0 20%, #f8f6f0 80%, transparent 80%, transparent) 20px 20px,
    linear-gradient(#d7d5cf 0.28px, transparent 0.28px) 0 -0.14px,
    linear-gradient(90deg, #d7d5cf 0.28px, #f8f6f0 0.28px) -0.14px 0;
  background-size: 10px 10px, 10px 10px, 5px 5px, 5px 5px;
}

/* -- 白地 角丸カーブ -- */
.curve_03 {
  width: 100%;
  height: 5vw;
  background: #fff;
 border-radius: 70px 70px 0 0;
  margin-top: -5vw;
}

/* -- ドットパターン 角丸カーブ（sonae 下） -- */
.curve_04 {
  width: 100%;
  height: 10.3vw;
 border-radius: 70px 70px 0 0;
  margin-top: 8.3vw;
  background-color: #f8f6f0;
  background:
    radial-gradient(circle, transparent 20%, #f8f6f0 20%, #f8f6f0 80%, transparent 80%, transparent),
    radial-gradient(circle, transparent 20%, #f8f6f0 20%, #f8f6f0 80%, transparent 80%, transparent) 20px 20px,
    linear-gradient(#d7d5cf 0.28px, transparent 0.28px) 0 -0.14px,
    linear-gradient(90deg, #d7d5cf 0.28px, #f8f6f0 0.28px) -0.14px 0;
  background-size: 10px 10px, 10px 10px, 5px 5px, 5px 5px;
}

/* -- ドットパターン 角丸カーブ（ブログ用） -- */
.curve_05 {
  width: 100%;
 height: 10.3vw;
 border-radius: 70px 70px 0 0;
  background-color: #f8f6f0;
  background:
    radial-gradient(circle, transparent 20%, #f8f6f0 20%, #f8f6f0 80%, transparent 80%, transparent),
    radial-gradient(circle, transparent 20%, #f8f6f0 20%, #f8f6f0 80%, transparent 80%, transparent) 20px 20px,
    linear-gradient(#d7d5cf 0.28px, transparent 0.28px) 0 -0.14px,
    linear-gradient(90deg, #d7d5cf 0.28px, #f8f6f0 0.28px) -0.14px 0;
  background-size: 10px 10px, 10px 10px, 5px 5px, 5px 5px;
}


/* ============================================================
   06. 災害時リンクセクション（iza / link_box）
   ============================================================ */

/* ── 06-a. iza（背景帯） ── */

.iza {
  background-image: url(bosai-img/iza_bg.svg);
  background-size: 100%;
  margin-top: -10vw;
  padding: 20vw 0;
  text-align: center;
  font-weight: 700;
}

.iza h3 {
  font-size: clamp(25px, 3vw, 36px);
  line-height: 1.5;
  margin-bottom: 7.083vw;
}

.iza p {
  font-size: clamp(16px, 1.6vw, 20px);
  line-height: 1.6;
}


/* ── 06-b. link_box（ドット背景） ── */

.link_box {
  padding-bottom: 21.25vw;
  background-color: #f8f6f0;
  background:
    radial-gradient(circle, transparent 20%, #f8f6f0 20%, #f8f6f0 80%, transparent 80%, transparent),
    radial-gradient(circle, transparent 20%, #f8f6f0 20%, #f8f6f0 80%, transparent 80%, transparent) 20px 20px,
    linear-gradient(#d7d5cf 0.28px, transparent 0.28px) 0 -0.14px,
    linear-gradient(90deg, #d7d5cf 0.28px, #f8f6f0 0.28px) -0.14px 0;
  background-size: 10px 10px, 10px 10px, 5px 5px, 5px 5px;
}


/* ── 06-c. link_intro・link_text_box・link_img_box ── */

.link_intro {
  width: 90%;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  position: relative;
  padding-top: 5.833vw;
  margin-bottom: 6.25vw;
}

.link_text_box {
  width: 41%;
}

.link_text_box h3 {
  position: relative;
  font-size: clamp(25px, 4vw, 48px);
  padding-left: .5em;
  margin-bottom: 4.167vw;
}

/* オレンジ縦線 */
.link_text_box h3:before {
  content: "";
  display: inline-block;
  background: #f5b387;
  position: absolute;
  top: 0;
  left: 0;
  bottom: -0.5vw;
  width: 6px;
  height: 100%;
  border-radius: 0.417vw;
}

.link_text_box p {
  font-weight: 700;
  line-height: 1.8;
  font-size: clamp(13px, 1.5vw, 18px);
}

.link_img_box {
  width: 57%;
  position: absolute;
  bottom: 0;
  right: -5vw;
}

.link_img_box img {
  max-width: 47.083vw;
}


/* ── 06-d. category_box（タブ付きリンク一覧） ── */

.category_box {
  width: 90%;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.category_box img {
  display: block;
  width: 100%;
  max-width: 25vw;
  text-align: center;
  margin-bottom: 2.917vw;
}


/* ── 06-e. タブナビゲーション ── */

.tab-nav {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.833vw;
  margin-bottom: 2.333vw;
}

.tab-btn {
  padding: 1.667vw 1.5vw;
  border-radius: 0.833vw;
  border: 2px solid transparent;
  font-size: clamp(14px, 1.8vw, 22px);
  font-weight: 700;
  cursor: pointer;
  letter-spacing: .04em;
}

/* タブカラー（通常） */
.tab-btn[data-tab="all"]       { background: #f5b387; color: #fff; border-color: #f5b387; }
.tab-btn[data-tab="emergency"] { background: #f5b753; color: #fff; border-color: #f5b753; }
.tab-btn[data-tab="prepare"]   { background: #5fa2b5; color: #fff; border-color: #5fa2b5; }
.tab-btn[data-tab="management"]   { background: #ba96c4; color: #fff; border-color: #ba96c4; }
.tab-btn[data-tab="shelter"]   { background: #8ac7b4; color: #fff; border-color: #8ac7b4; }

/* hover ＆ active（白背景＋ボーダー） */
.tab-btn[data-tab="all"]:hover,
.tab-btn[data-tab="all"].active {
  background: #fff;
  color: #f5b387;
  border-color: #f5b387;
}

.tab-btn[data-tab="emergency"]:hover,
.tab-btn[data-tab="emergency"].active {
  background: #fff;
  color: #f5b753;
  border-color: #f5b753;
}

.tab-btn[data-tab="prepare"]:hover,
.tab-btn[data-tab="prepare"].active {
  background: #fff;
  color: #5fa2b5;
  border-color: #5fa2b5;
}

.tab-btn[data-tab="management"]:hover,
.tab-btn[data-tab="management"].active {
  background: #fff;
  color: #ba96c4;
  border-color: #ba96c4;
}

.tab-btn[data-tab="shelter"]:hover,
.tab-btn[data-tab="shelter"].active {
  background: #fff;
  color: #8ac7b4;
  border-color: #8ac7b4;
}

/* ── 06-f. パネル（panel） ── */

.panel {
  width: 90%;
  background: #fff;
  border-radius: 1.5vw;
  padding: 3vw 3.333vw 3.333vw;
  box-shadow: 0 2px 16px rgba(0, 0, 0, .06);
}

.panel-title {
  text-align: center;
  font-size: clamp(17px, 2.5vw, 30px);
  font-weight: 700;
  margin-bottom: 1.833vw;
}

.panel-divider {
  height: 0.167vw;
  background: var(--divider-color, #f5b387);
  border-radius: 0.167vw;
  margin: 0 auto 28px;
  width: 100%;
  transition: background .25s;
}




/* ── 06-g. リンクグリッド（link-grid / link-item） ── */

.link-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  row-gap: 1.8vw;
  column-gap: 40px;
}

.link-item {
  min-width: 0; /* ← 追加 */
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #f0f0f0;
  border-radius: 1vw;
  padding: 13px 1em;
  text-decoration: none;
  font-size: clamp(14px, 1.8vw, 22px);
  font-weight: 700;
  transition: background .15s, transform .12s;
  gap: 1vw;
}

.link-item:hover {
  background: #ebebeb;
  
}

.link-item span:first-child {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  min-width: 0;
}

/* 三角矢印 */
.link-item .arrow {
  flex-shrink: 0;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 7px 0 7px 11px;
  border-color: transparent transparent transparent #ccc;
}

/* カテゴリ別矢印カラー */
.link-item.emergency .arrow { border-color: transparent transparent transparent #f5b753; }
.link-item.prepare    .arrow { border-color: transparent transparent transparent #5fa2b5; }
.link-item.management    .arrow { border-color: transparent transparent transparent #ba96c4; }
.link-item.shelter    .arrow { border-color: transparent transparent transparent #8ac7b4; }

/* 表示制御 */
.link-item.hidden  { display: none; }

/* フェードインアニメーション */
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}

.link-item.visible {
  animation: fadeUp .22s ease forwards;
}


/* ============================================================
   07. 備えセクション（sonae_box）
   ============================================================ */

.sonae_box {
  width: 90%;
  margin: 0 auto;
  padding-top: 9vw;
  position: relative;
}

.sonae_intro {
  position: relative;
  margin-bottom: 8.25vw;
}

/* 装飾背景 */
.sonae_right_bg {
  z-index: -3;
  position: absolute;
  width: 30%;
  top: 10vw;
  right: -6%;
}

.sonae_left_bg {
  z-index: -3;
  position: absolute;
  max-width: 18vw;
  top: 200%;
  left: -6%;
}

.sonae_text_box {
  width: 41%;
}

.sonae_text_box h3 {
  position: relative;
  font-size: clamp(25px, 4vw, 48px);
  padding-left: .5em;
  margin-bottom: 4.167vw;
}

/* 青縦線 */
.sonae_text_box h3:before {
  content: "";
  display: inline-block;
  background: #5fa2b5;
  position: absolute;
  top: 0;
  left: 0;
  bottom: -0.5vw;
  width: 6px;
  height: 100%;
  border-radius: 0.417vw;
}

.sonae_text_box p {
  font-weight: 700;
  line-height: 1.8;
  font-size: clamp(13px, 1.5vw, 18px);
}

.sonae_img_box {
  width: 57%;
  position: absolute;
  bottom: 0;
  right: -5vw;
}

.sonae_img_box img {
  max-width: 47.083vw;
}


/* ============================================================
   08. スライダー（sonae コンテンツ）
   ============================================================ */

/* ── 08-a. スライダー構造 ── */

.slider-section {
  width: 95%;
  margin-left: auto;
  overflow: hidden;
}

.slider-track-wrapper {}

.slider-track {
  display: flex;
  gap: 4vw;
  transition: transform .4s cubic-bezier(.4, 0, .2, 1);
  will-change: transform;
}


/* ── 08-b. カード（card） ── */

.card {
  flex: 0 0 calc(30% - 21px);
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.card-img {
  width: 100%;
  aspect-ratio: 4/3;
  object-fit: cover;
  border-radius: 1vw;
  display: block;
  background: #e8e5e0;
}

.card-img-placeholder {
  width: 100%;
  aspect-ratio: 4/3;
  border-radius: 1vw;
  background: #d0cdc8;
}

.card-meta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 3vw;
}

.card-date {
  font-size: clamp(11px, 1.1vw, 14px);
  letter-spacing: .03em;
  white-space: nowrap;
}

/* カテゴリバッジ */
.card-cat {
  font-size: clamp(10px, 1.1vw, 14px);
  font-weight: 700;
  padding: 5px 10px;
  border-radius: 999px;
  width: 110px;
  box-sizing: border-box;
  text-align: center;
  white-space: nowrap;
  color: #fff;
}

/* カテゴリ別カラー */
.cat-facility  { background: #f5b387; }
.cat-equipment { background: #ba96c4; }
.cat-goods     { background: #8ac7b4; }
.cat-emergency { background: #f5b753; }
.cat-prepare   { background: #5fa2b5; }
.cat-default   { background: #aaa; }

.card-title {
  margin-top: 1.5vw;
  font-size: clamp(13px, 1.5vw, 18px);
  font-weight: 700;
  line-height: 1.65;
  flex: 1;
}

/* 続きを読むリンク */
.card-read {
  display: flex;
  text-align: center;
  gap: 0.833vw;
  margin-top: 1.167vw;
  padding-bottom: .8vw;
  text-decoration: none;
  font-size: clamp(12px, 1.1vw, 14px);
  font-weight: 700;
  border-bottom: 1.5px solid #ddd;
  transition: opacity .15s;
}

.card-read:hover { opacity: .7; }

.card-read .plus {
  font-size: clamp(14px, 1.5vw, 18px);
  line-height: 1;
  flex-shrink: 0;
}

/* カテゴリ別アンダーライン・プラスカラー */
.card[data-cat="facility"]  .card-read          { border-color: #f5b387; }
.card[data-cat="facility"]  .card-read .plus    { color: #f5b387; }
.card[data-cat="equipment"] .card-read          { border-color: #ba96c4; }
.card[data-cat="equipment"] .card-read .plus    { color: #ba96c4; }
.card[data-cat="goods"]     .card-read          { border-color: #8ac7b4; }
.card[data-cat="goods"]     .card-read .plus    { color: #8ac7b4; }
.card[data-cat="emergency"] .card-read          { border-color: #f5b753; }
.card[data-cat="emergency"] .card-read .plus    { color: #f5b753; }
.card[data-cat="prepare"]   .card-read          { border-color: #5fa2b5; }
.card[data-cat="prepare"]   .card-read .plus    { color: #5fa2b5; }

/* ダミーカード（レイアウト調整用） */
.card.dummy {
  flex: 0 0 calc(30% - 21px);
  min-width: 0;
  background: transparent;
  pointer-events: none;
}


/* ── 08-c. スライダーコントロール ── */

.slider-controls {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 6vw;
  padding: 0 3.333vw;
  margin-left: auto;
  margin-right: auto;
}

.nav-btns {
  display: flex;
  gap: 7vw;
}

.nav-btn {
  width: 5.333vw;
  height: 5.333vw;
  border-radius: 50%;
  border: none;
  background: #5fa2b5;
  color: #fff;
  font-size: 4.167vw;
  cursor: pointer;
  display: flex;
  align-items: stretch;
  justify-content: space-around;
  transition: background .15s, transform .12s;
  flex-shrink: 0;
}

.nav-btn:hover {
  background: #fff;
  color: #5fa2b5;
  border: 2px solid #5fa2b5;
}

.nav-btn:disabled {
  background: #c8dde3;
  cursor: default;
  transform: none;
}

/* アーカイブボタン（共通） */
.btn-archive {
  background: #5fa2b5;
  color: #fff;
  font-family: inherit;
  font-size: clamp(14px, 2.25vw, 27px);
  font-weight: 700;
  letter-spacing: .12em;
  padding: 17px 5vw;
  border: none;
  border-radius: 999px;
  cursor: pointer;
  transition: background .15s, transform .12s;
  text-decoration: none;
  display: inline-block;
}

.btn-archive:hover {
  background: #fff;
  color: #5fa2b5;
  border: 2px solid #5fa2b5;
}


/* ============================================================
   09. ニュースセクション（news_box）
   ============================================================ */

.news_box {
  padding-bottom: 8vw;
  background-color: #f8f6f0;
  background:
    radial-gradient(circle, transparent 20%, #f8f6f0 20%, #f8f6f0 80%, transparent 80%, transparent),
    radial-gradient(circle, transparent 20%, #f8f6f0 20%, #f8f6f0 80%, transparent 80%, transparent) 20px 20px,
    linear-gradient(#d7d5cf 0.28px, transparent 0.28px) 0 -0.14px,
    linear-gradient(90deg, #d7d5cf 0.28px, #f8f6f0 0.28px) -0.14px 0;
  background-size: 10px 10px, 10px 10px, 5px 5px, 5px 5px;
}

.news_intro {
  width: 90%;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  position: relative;
  padding-top: 8vw;
  margin-bottom: 6.25vw;
}

.news_text_box {
  width: 55%;
}

.news_text_box h3 {
  position: relative;
  font-size: clamp(25px, 4vw, 48px);
  padding-left: .5em;
  margin-bottom: 4.167vw;
}

/* 赤縦線 */
.news_text_box h3:before {
  content: "";
  display: inline-block;
  background: #ec7970;
  position: absolute;
  top: 0;
  left: 0;
  bottom: -0.5vw;
  width: 6px;
  height: 100%;
  border-radius: 0.417vw;
}

.news_text_box p {
  font-weight: 700;
  line-height: 1.8;
  font-size: clamp(13px, 1.5vw, 18px);
}

.news_img_box {
  width: 40%;
  position: absolute;
  bottom: 0;
  right: -2vw;
}

.news_img_box img {
  max-width: 37vw;
}

.news_box_item {
  box-sizing: border-box;
  width: 90%;
  margin: 0 auto;
  border-radius: 1.5vw;
  background-color: #fff;
  padding: 3.8vw 4vw;
}


/* ============================================================
   10. フッター
   ============================================================ */

footer {
  background-color: #faf07b;
  background-image: url(bosai-img/footer_bg.svg);
}

.footer_content {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding-top: 8vw;
  padding-bottom: 7vw;
}

.footer_nav {
  margin-top: 4.1vw;
  margin-bottom: 3vw;
}

.footer_nav ul {
  display: flex;
  align-items: center;
  justify-content: space-around;
  gap: 2em;
  padding: 0 1em;
  padding-bottom: 1.6vw;
  border-bottom: 2px solid #f5b387;
}

.footer_nav li {
  font-weight: 700;
  font-size: clamp(17px, 1.5vw, 19px);
}

.add img {
  width: 30vw;
  max-width: 350px;
  margin-bottom: 1.6vw;
}

.add p {
  text-align: center;
  font-size: clamp(13.5px, 1.4vw, 17px);
  line-height: 1.8;
}

.copy {
  color: #fff;
  font-size: 12px;
  padding: 1em 0;
  text-align: center;
  background-color: #4b6f97;
}


/* ============================================================
   11. ブログトップページ（bousai_blog_top）
   ============================================================ */

.bousai_blog_top {
  padding-top: 16vw;
  padding-bottom: 8.3vw;
  background-image: url(bosai-img/blog_top_bg.svg);
  background-size: 100%;
  background-repeat: no-repeat;
  position: relative;
}

.bousai_blog_top h3 {
  text-align: center;
  font-size: clamp(28px, 4vw, 50px);
  margin-bottom: 40px;
}

.bousai_blog_top p {
  width: 36%;
  margin: 0 auto;
  font-weight: 700;
  line-height: 1.8;
  font-size: clamp(13px, 1.5vw, 18px);
}

.blog_top_img {
  position: absolute;
  width: 90%;
  top: 65%;
  left: 50%;
  transform: translate(-50%, -50%);
}


/* ============================================================
   12. ブログカテゴリページ（bcat-*）
   ============================================================ */

/* ページラッパー */
.bcat-page-wrap {
  background:
    radial-gradient(circle, transparent 20%, #f8f6f0 20%, #f8f6f0 80%, transparent 80%, transparent),
    radial-gradient(circle, transparent 20%, #f8f6f0 20%, #f8f6f0 80%, transparent 80%, transparent) 20px 20px,
    linear-gradient(#d7d5cf 0.28px, transparent 0.28px) 0 -0.14px,
    linear-gradient(90deg, #d7d5cf 0.28px, #f8f6f0 0.28px) -0.14px 0;
  background-size: 10px 10px, 10px 10px, 5px 5px, 5px 5px;
  margin: 0 auto;
  padding: 10px 0 80px;
}

.bcat-page-title {
  text-align: center;
  font-size: 32px;
  font-weight: 700;
  letter-spacing: .1em;
  margin-bottom: 36px;
}

/* フィルタータブ */
.bcat-filter-tabs {
  display: flex;
  justify-content: center;
  gap: 12px;
  margin-bottom: 40px;
  flex-wrap: wrap;
}

.bcat-filter-btn {
  font-family: "LINE Seed JP", sans-serif !important;
  padding: 9px 28px;
  border-radius: 999px;
  border: 1.5px solid transparent;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  letter-spacing: .04em;
  color: #fff;
  transition: .2s;
}

/* 通常時（カラフル） */
.bcat-filter-btn[data-filter="all"]       { background: #4b6f97; }
.bcat-filter-btn[data-filter="facility"]  { background: #f5b387; }
.bcat-filter-btn[data-filter="equipment"] { background: #ba96c4; }
.bcat-filter-btn[data-filter="goods"]     { background: #8ac7b4; }

/* hover ＆ active（白背景＋ボーダー） */
.bcat-filter-btn[data-filter="all"]:hover,
.bcat-filter-btn[data-filter="all"].active {
  background: #fff;
  color: #57454d;
  border-color: #4b6f97;
}

.bcat-filter-btn[data-filter="facility"]:hover,
.bcat-filter-btn[data-filter="facility"].active {
  background: #fff;
  color: #f5b387;
  border-color: #f5b387;
}

.bcat-filter-btn[data-filter="equipment"]:hover,
.bcat-filter-btn[data-filter="equipment"].active {
  background: #fff;
  color: #ba96c4;
  border-color: #ba96c4;
}

.bcat-filter-btn[data-filter="goods"]:hover,
.bcat-filter-btn[data-filter="goods"].active {
  background: #fff;
  color: #8ac7b4;
  border-color: #8ac7b4;
}

/* 白パネル */
.bcat-content-panel {
  width: 80%;
  max-width: 1060px;
  margin: 0 auto;
  background: #fff;
  border-radius: 16px;
  padding: 30px 48px 10px;
}

/* カードグリッド */
.bcat-card-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 40px 32px;
}

.bcat-card {
  flex: 0 0 calc(33.333% - 22px);
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.bcat-card-img {
  width: 100%;
  aspect-ratio: 4/3;
  object-fit: cover;
  border-radius: 10px;
  display: block;
  background: #e8e5e0;
}

.bcat-card-meta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 14px;
}

.bcat-card-date {
  font-size: clamp(11px, 1.1vw, 14px);
  letter-spacing: .03em;
  white-space: nowrap;
}

.bcat-card-cat {
  font-size: clamp(10px, 1.1vw, 14px);
  font-weight: 700;
  padding: 5px 10px;
  border-radius: 999px;
  max-width: 110px;
  width: 50%;
  box-sizing: border-box;
  text-align: center;
  white-space: nowrap;
  color: #fff;
}

/* カテゴリバッジカラー */
.bcat-cat-facility  { background: #f5b387; }
.bcat-cat-equipment { background: #ba96c4; }
.bcat-cat-goods     { background: #8ac7b4; }
.bcat-cat-emergency { background: #f5b753; }
.bcat-cat-prepare   { background: #5fa2b5; }
.bcat-cat-default   { background: #aaa; }

.bcat-card-title {
  margin-top: 1.5vw;
  font-size: clamp(13px, 1.5vw, 18px);
  font-weight: 700;
  line-height: 1.65;
  flex: 1;
}

/* 続きを読むリンク */
.bcat-card-read {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 12px;
  padding-bottom: 10px;
  text-decoration: none;
  font-size: 13px;
  font-weight: 700;
  border-bottom: 1.5px solid #ddd;
  color: #333;
  transition: opacity .15s;
}

.bcat-card-read:hover { opacity: .6; }

.bcat-card-read .bcat-plus {
  font-size: 18px;
  line-height: 1;
  flex-shrink: 0;
}

/* カテゴリ別アンダーライン・プラスカラー */
.bcat-card[data-cat="facility"]  .bcat-card-read          { border-color: #f5b387; }
.bcat-card[data-cat="facility"]  .bcat-card-read .bcat-plus { color: #f5b387; }
.bcat-card[data-cat="equipment"] .bcat-card-read          { border-color: #ba96c4; }
.bcat-card[data-cat="equipment"] .bcat-card-read .bcat-plus { color: #ba96c4; }
.bcat-card[data-cat="goods"]     .bcat-card-read          { border-color: #8ac7b4; }
.bcat-card[data-cat="goods"]     .bcat-card-read .bcat-plus { color: #8ac7b4; }
.bcat-card[data-cat="emergency"] .bcat-card-read          { border-color: #f5b753; }
.bcat-card[data-cat="emergency"] .bcat-card-read .bcat-plus { color: #f5b753; }
.bcat-card[data-cat="prepare"]   .bcat-card-read          { border-color: #5fa2b5; }
.bcat-card[data-cat="prepare"]   .bcat-card-read .bcat-plus { color: #5fa2b5; }

.bcat-card.bcat-hidden { display: none; }

/* ページネーション矢印 */
.bcat-page-prev,
.bcat-page-next {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 36px;
  height: 36px;
  margin: 6px;
  border-radius: 50%;
  background: #8ac7b4;
  color: #fff;
  font-size: 18px;
  font-weight: 700;
  text-decoration: none;
  transition: background-color .25s;
}

.bcat-page-prev:hover,
.bcat-page-next:hover {
  background: #6db8a2;
  color: #fff;
}


/* ============================================================
   13. ブログ記事詳細ページ（bousai_blog_single）
   ============================================================ */

.bousai_blog_single {
  padding: 160px 0;
  background:
    radial-gradient(circle, transparent 20%, #f8f6f0 20%, #f8f6f0 80%, transparent 80%, transparent),
    radial-gradient(circle, transparent 20%, #f8f6f0 20%, #f8f6f0 80%, transparent 80%, transparent) 20px 20px,
    linear-gradient(#d7d5cf 0.28px, transparent 0.28px) 0 -0.14px,
    linear-gradient(90deg, #d7d5cf 0.28px, #f8f6f0 0.28px) -0.14px 0;
  background-size: 10px 10px, 10px 10px, 5px 5px, 5px 5px;
}

.single_box {
  box-sizing: border-box;
  width: 90%;
  max-width: 1060px;
  margin: 0 auto;
  background: #fff;
  border-radius: 16px;
  padding: 30px 48px 50px;
}

.single_intro {
  display: flex;
  justify-content: space-between;
  width: 90%;
  max-width: 1060px;
  margin: 0 auto;
  margin-bottom: 10px;
}

.single_intro h3 { font-size: 30px; font-weight: 700; }
.single_intro a  { font-size: 20px; font-weight: 700; }

.bousai-article-meta,
.bousai-article-title {
  margin-bottom: 3vw;
}


/* ── 13-a. 記事ナビゲーション（bousai-post-nav） ── */

.bousai-post-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 3em 0;
  gap: 16px;
}

/* 矢印ボタン */
.bousai-post-nav__arrow {
  width: 5.333vw;
  height: 5.333vw;
  min-width: 36px;
  min-height: 36px;
  max-width: 56px;
  max-height: 56px;
  border-radius: 50%;
  border: none;
  background: #5fa2b5;
  color: #fff;
  font-size:clamp(30px, 4.167vw,45px);
  cursor: pointer;
  display: flex;
     align-items: flex-start;
    justify-content: space-around;
  flex-shrink: 0;
  text-decoration: none;
  transition: background .15s, color .15s;
  line-height: 1;
}

.bousai-post-nav__arrow:hover {
  background: #fff;
  color: #5fa2b5;
  border: 2px solid #5fa2b5;
}

.bousai-post-nav__arrow--disabled {
  background: #c8dde3;
  cursor: default;
  pointer-events: none;
}

/* 一覧へ戻るボタン */
.bousai-post-nav__back {
  background: #5fa2b5;
  color: #fff;
  font-family: inherit;
  font-size: clamp(14px, 2.25vw, 27px);
  font-weight: 700;
  letter-spacing: .12em;
  padding: 8px 12vw;
  border: none;
  border-radius: 999px;
  cursor: pointer;
  transition: background .15s, color .15s;
  text-decoration: none;
  display: inline-block;
  text-align: center;
  white-space: nowrap;
	 border: 2px solid #5fa2b5;
}

.bousai-post-nav__back:hover {
  background: #fff;
  color: #5fa2b5;
 
}


/* ── 13-b. 記事本文スタイル（single_box） ── */

/* アイキャッチ */
.single_box .eyecatch img,
.single_box .wp-post-image {
  border-radius: 1.5vw;
  width: 100%;
  height: auto;
  display: block;
}

/* 目次（非表示） */
.-simple.p-toc { display: none; }

/* 見出し h1 */
.single_box h1 {
  font-size: clamp(20px, 3vw, 36px);
  font-weight: 700;
  margin: 1.6em 0 .8em;
  padding: 0;
}

/* 見出し h2（緑地 + 右オレンジ帯） */
.single_box h2 {
  font-size: clamp(20px, 2vw, 22px);
  font-weight: 700;
  color: #fff;
  background: #8ac7b4;
  margin: 1.8em 0;
  padding: .55em 1em .55em .9em;
  position: relative;
  overflow: hidden;
  border-radius: 4px;
}

.single_box h2::after {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  width: 18px;
  height: 100%;
  background: #f5b387;
  border-radius: 0 4px 4px 0;
}

/* 見出し h4（左オレンジ横線） */
.single_box h4 {
  font-size: clamp(13px, 2vw, 16px);
  font-weight: 700;
  margin: 0 0 1.2em;
  padding-left: 2em;
  position: relative;
}

.single_box h4::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 1em;
  height: 2px;
  background: #f5b387;
}

/* 見出し h5（左ボーダー） */
.single_box h5 {
  font-size: clamp(13px, 1.4vw, 18px);
  font-weight: 700;
  padding-left: .8em;
  border-left: 3px solid #8ac7b4;
  margin: 0 0 1.2em;
}

/* 本文 p */
.single_box p:not(.bcat-card-title) {
  font-size: clamp(13px, 2vw, 16px);
  line-height: 1.9;
  margin: 0 0 1.2em;
}

/* リンク（ナビボタン除外） */
.single_box a:not(.bousai-post-nav__arrow):not(.bousai-post-nav__back):not(.bcat-card-read) {
  color: #57454d;
  text-decoration: underline;
  text-decoration-color: #57454d;
  text-underline-offset: 3px;
}

.single_box a:not(.bousai-post-nav__arrow):not(.bousai-post-nav__back):hover :not(.bcat-card-read):hover {
  text-decoration-color: #8ac7b4;
  color: #8ac7b4;
}

/* 取り消し線 */
.single_box s,
.single_box del {
  text-decoration: line-through;
  text-decoration-color: #57454d;
}

/* 抜粋タイトル */
.single_box .bousai-excerpt__title {
  font-size: clamp(13px, 1.6vw, 18px);
  font-weight: 700;
  background: #f5b387;
  color: #fff;
  margin: 0;
  padding: .55em 1em;
  border-radius: 4px 4px 0 0;
}

/* 抜粋内背景 */
.single_box .bousai-excerpt__body {
  background: #f4f4f4;
  padding: 1.4em 1.6em;
  border-radius: 0 0 4px 4px;
  margin-bottom: 1.6em;
  font-size: clamp(13px, 1.4vw, 16px);
  line-height: 1.9;
}

.single_box .bousai-excerpt__body--solo {
  border-radius: 4px;
}

/* テーブル */
.single_box table {
  width: 100%;
  border-collapse: collapse;
  margin: 1.4em 0 1.8em;
  margin-top: 0;
  font-size: clamp(13px, 2vw, 16px);
}

.single_box table th {
  background: #f5b387;
  color: #fff;
  font-weight: 700;
  padding: .65em 1em;
  border: 1.5px solid #f5b387;
  text-align: left;
  vertical-align: middle;
  white-space: nowrap;
}

.single_box table td {
  background: #fff;
  padding: .65em 1em;
  border: 1.5px solid #f5b387;
  vertical-align: middle;
  line-height: 1.7;
}

.single_box .border{text-decoration:underline;}

.single_box table td:first-child {
  background: #f5b387;
  color: #fff;
  font-weight: 700;
  text-decoration-color: #fff;
  border-bottom: 1.5px solid #fff;
}

.single_box table tr:last-child td:first-child {
  border-bottom: 1.5px solid #f5b387;
}

/* WordPress ブロック マージンリセット */
.single_box h2,
.single_box h3,
.single_box h4,
.single_box h5,
.single_box h6,
.single_box p,
.single_box ul,
.single_box ol,
.single_box dl,
.single_box blockquote,
.single_box pre,
.single_box table,
.single_box img,
.single_box figure,
.wp-block-column + .wp-block-column {
  margin-top: 0 !important;
}

.cap_box_content > *,
.full_wide_content > *,
.swell-block-accordion__body > *,
.swell-block-dl__dd > *,
.swell-block-fullWide__inner > *,
.swell-block-step__body > *,
.swell-styleBox > *,
.wp-block-column > *,
.wp-block-cover__inner-container > *,
.wp-block-group__inner-container > *,
.wp-block-media-text__content > *,
div[class*=is-style-] > * {
  margin-bottom: 0em !important;
}

.wp-block-table > table { margin-bottom: 2em !important; }

:where(.wp-block-columns.is-layout-flex) { gap: 15px !important; }

.bousai-article-img { margin: 0 0 2.2em; }
.wp-block-image     { margin-bottom: 2.2em; }

/* キャプションボックス */
.cap_box_ttl {
  background-color: #f5b387 !important;
  text-align: left !important;
  font-weight: 700 !important;
}

.cap_box_content {
  border: 0 !important;
  background-color: #f4f4f4;
  margin-bottom: 2.2em;
}

/* 区切り線 */
.wp-block-separator {
  border: none;
  border-top: 2px dotted !important;
  max-width: none !important;
  color: #f5b387 !important;
}

.under { text-decoration: underline; }

/* カテゴリバッジ（記事内共通） */
.ccat-card-cat {
  font-size: clamp(13px, 1.4vw, 16px);
  font-weight: 700;
  padding: 5px 10px;
  border-radius: 999px;
  max-width: 110px;
  width: 50%;
  margin-right: 2em;
  box-sizing: border-box;
  text-align: center;
  white-space: nowrap;
  color: #fff;
}

.ccat-cat-facility  { background: #f5b387; }
.ccat-cat-equipment { background: #ba96c4; }
.ccat-cat-goods     { background: #8ac7b4; }
.ccat-cat-emergency { background: #f5b753; }
.ccat-cat-prepare   { background: #5fa2b5; }
.ccat-cat-default   { background: #aaa; }


/* ============================================================
   14. ランダム記事ボックス（random_box）
   ============================================================ */

.random_box { margin: 3vw 0; }

.random_box h3 {
  text-align: center;
  font-size: clamp(24px, 2.3vw, 30px);
  font-weight: bold;
  padding-bottom: .4em;
  border-bottom: 2px solid #f5b387;
}


/* ============================================================
   15. フォントサイズ統一上書き（--fs-adjust）
   ============================================================
   各要素の clamp() 下限・上限に --fs-adjust を加算し、
   ブレークポイントで一括サイズ変更できるようにする。
   ============================================================ */

.pc_nav a {
  font-size: clamp(calc(17px + var(--fs-adjust)), 1.5vw, calc(19px + var(--fs-adjust)));
}

.intro h3 {
  font-size: clamp(calc(13px + var(--fs-adjust)), 1.3vw, calc(16px + var(--fs-adjust)));
}

.intro h2 {
  font-size: clamp(calc(38.5px + var(--fs-adjust)), 5.5vw, calc(66px + var(--fs-adjust)));
}

.intro p {
  font-size: clamp(calc(16px + var(--fs-adjust)), 1.6vw, calc(20px + var(--fs-adjust)));
}

.contents_box li {
  font-size: clamp(calc(13px + var(--fs-adjust)), 1.3vw, calc(16px + var(--fs-adjust)));
}

.open_chat_btn a {
  font-size: clamp(calc(18px + var(--fs-adjust)), 2vw, calc(27px + var(--fs-adjust)));
}

.open_chat_btn span {
  font-size: clamp(calc(13px + var(--fs-adjust)), 1.5vw, calc(18px + var(--fs-adjust)));
}

.open_chat_text p {
  font-size: clamp(calc(13px + var(--fs-adjust)), 1.3vw, calc(16px + var(--fs-adjust)));
}

.iza h3 {
  font-size: clamp(calc(25px + var(--fs-adjust)), 3vw, calc(36px + var(--fs-adjust)));
}

.iza p {
  font-size: clamp(calc(16px + var(--fs-adjust)), 1.6vw, calc(20px + var(--fs-adjust)));
}

.link_text_box h3 {
  font-size: clamp(calc(25px + var(--fs-adjust)), 4vw, calc(48px + var(--fs-adjust)));
}

.link_text_box p {
  font-size: clamp(calc(13px + var(--fs-adjust)), 1.5vw, calc(18px + var(--fs-adjust)));
}

.tab-btn {
  font-size: clamp(calc(14px + var(--fs-adjust)), 1.8vw, calc(22px + var(--fs-adjust)));
}

.panel-title {
  font-size: clamp(calc(17px + var(--fs-adjust)), 2.5vw, calc(30px + var(--fs-adjust)));
}

.card-date {
  font-size: clamp(calc(11px + var(--fs-adjust)), 1.1vw, calc(14px + var(--fs-adjust)));
}

.card-cat {
  font-size: clamp(calc(10px + var(--fs-adjust)), 1.1vw, calc(14px + var(--fs-adjust)));
}

.card-title {
  font-size: clamp(calc(13px + var(--fs-adjust)), 1.5vw, calc(18px + var(--fs-adjust)));
}

.card-read {
  font-size: clamp(calc(12px + var(--fs-adjust)), 1.1vw, calc(14px + var(--fs-adjust)));
}

.card-read .plus {
  font-size: clamp(calc(14px + var(--fs-adjust)), 1.5vw, calc(18px + var(--fs-adjust)));
}

.footer_nav li {
  font-size: clamp(calc(17px + var(--fs-adjust)), 1.5vw, calc(19px + var(--fs-adjust)));
}

.add p {
  font-size: clamp(calc(13.5px + var(--fs-adjust)), 1.4vw, calc(17px + var(--fs-adjust)));
}


/* ============================================================
   16. レスポンシブ（ブレークポイント別）
   ============================================================ */

/* ── 16-a. max-width: 600px（リンクグリッド 1カラム化） ── */

@media (max-width: 600px) {
  .link-grid {
    grid-template-columns: 1fr;
    row-gap: 3.5vw;
  }

  .panel {
    padding: 2vw 1.5vw 2.333vw;
  }
}


/* ── 16-b. max-width: 900px ── */

@media (max-width: 900px) {
  .card {
    flex: 0 0 calc(45% - 24px);
  }

  .slider-section,
  .slider-controls {
    padding-left: 5%;
  }
}


/* ── 16-c. max-width: 850px（--fs-adjust +1px） ── */

@media (max-width: 850px) {
  :root {
    --fs-adjust: 1px;
  }
}


/* ── 16-d. max-width: 666px（SP レイアウト全般） ── */

@media (max-width: 780px) {
  :root {
    --fs-adjust: 3px;
  }
.header_logo {top:4vw;
	left:5vw;}
	.header_logo a {
    width: 12vw;
    max-width: 100px;
}
  .pc_only { display: none; }
  .sp_only { display: block; }

  /* イントロ */
  .contents_box ul::after {
    width: 65vw;
    height: 30vw;
  }

  .sp_intro_img {
    margin-top: -10vw;
    padding-bottom: 15vw;
  }

  /* link セクション */
  .link_intro {
    flex-direction: column;
  }

  .link_text_box {
    width: 100%;
  }

  .link_img_box {
    position: relative;
    right: 0;
    margin: 0 auto;
    margin-top: 5vw;
    width: 70%;
  }

  .link_img_box img {
    max-width: none;
  }

  /* カテゴリボックス */
  .category_box img {
    max-width: 50vw;
    margin-bottom: 6vw;
  }

  .tab-nav {
    width: 100%;
    row-gap: 1vw;
    column-gap: 1vw;
    margin-bottom: 4vw;
  }

  /* sonae セクション */
  .sonae_text_box {
    width: 100%;
  }

  .sonae_img_box {
    position: relative;
    right: 0;
    margin: 0 auto;
    margin-top: 5vw;
    width: 70%;
  }

  .sonae_img_box img {
    max-width: none;
  }

  .sonae_right_bg {
    width: 40%;
    top: 32vw;
  }

  .sonae_left_bg {
    max-width: 30vw;
    top: 155%;
  }

  /* news セクション */
  .news_intro {
    flex-direction: column;
  }

  .news_text_box {
    width: 100%;
  }

  .news_img_box {
    position: relative;
    right: 0;
    margin: 0 auto;
    margin-top: 5vw;
    width: 70%;
  }

  .news_img_box img {
    max-width: none;
  }

  /* フッター */
  .footer_nav {
    width: 80%;
    margin-bottom: 7.5vw;
  }

  .footer_nav ul {
    flex-direction: column;
    padding-bottom: 3vw;
  }

  .add img {
    max-width: none;
    width: 80%;
  }

  /* ブログトップ */
  .bousai_blog_top {
    padding-top: 26vw;
    background-image: url(bosai-img/sp_blog_top_bg.svg);
  }

  .bousai_blog_top p {
    width: 85%;
  }

  .blog_top_img {
    position: relative;
    width: 80%;
    margin: 0 auto;
    margin-top: 8vw;
    top: 0;
    left: 0;
    transform: none;
  }

  /* ブログカテゴリ */
  .bcat-content-panel {
    width: 90%;
    padding: 48px 16px 20px;
  }

  .bcat-filter-btn {
    width: 45%;
  }

  .bcat-card {
    flex: 0 0 calc(50% - 22px);
  }

  .bcat-card_2:last-child {
    display: none;
  }

  .bcat-card-meta {
    flex-direction: column;
    align-items: flex-start;
    margin-top: 3vw;
  }

  .bcat-card-date {
    margin-bottom: 8px;
  }

  .bcat-card-cat {
    width: 82px;
  }

  /* カード共通 */
  .card-meta {
    flex-direction: column;
    align-items: flex-start;
    margin-top: 3vw;
  }

  .card-date {
    margin-bottom: 8px;
  }

  .card-cat {
    width: 82px;
  }

  /* 記事詳細 */
  .single_box {
    box-sizing: border-box;
    width: 95%;
    padding: 30px 28px 30px;
  }

  .bousai_blog_single {
    padding: 80px 0;
  }

  .single_intro h3 { font-size: 24px; }
  .single_intro a  { font-size: 18px; }

  .bousai-pager {
    margin: 3em 0 0;
  }
}


/* ── 16-e. max-width: 610px ── */

@media (max-width: 610px) {
  .contents_box ul::after {
    width: 60vw;
    height: 49vw;
  }
}


/* ── 16-f. max-width: 480px（--fs-adjust リセット） ── */

@media (max-width: 480px) {
  :root {
    --fs-adjust: 0px;
  }

  /* イントロ */
  .intro_box {
    max-width: none;
    width: 100%;
  }

  .contents_box ul::after {
    width: 80vw;
    height: 30vw;
  }

  .contents_box,
  open_chat_btn {
    margin-bottom: 8vw;
  }

  .intro h2 {
    margin-bottom: 10vw;
  }

  .intro p {
    margin-bottom: 5vw;
  }

  .contents_box ul li:last-child {
    margin-top: 0;
  }

  .contents_box {
    margin-top: 8vw;
  }

  /* iza セクション */
  .iza {
    background-image: url(bosai-img/sp_iza_bg.svg);
  }

  /* link セクション */
  .link_intro {
    padding-top: 10vw;
    margin-bottom: 10vw;
  }

  .link_img_box {
    width: 100%;
  }

  /* カテゴリ */
  .category_box img {
    width: 70%;
    max-width: none;
    margin-bottom: 9vw;
  }

  .tab-nav {
    width: 100%;
    row-gap: 3vw;
    column-gap: 2vw;
    margin-bottom: 6vw;
  }
	
	
.tab-btn {
	padding: 2.7vw 2.5vw;}

  .panel {
    padding: 5vw 5.5vw 10vw;
  }

  /* sonae セクション */
  .sonae_box {
    padding-top: 10vw;
  }

  .sonae_intro {
    margin-bottom: 18vw;
  }

  .sonae_img_box {
    width: 100%;
  }

  /* カード */
  .card-read {
    margin-top: 1em;
  }

  /* スライダーコントロール */
  .slider-controls {
    margin-top: 10vw;
    margin-bottom: 10vw;
  }

  .nav-btn {
    width: 40px;
    height: 40px;
    font-size: 35px;
  }

  /* news セクション */
  .news_intro {
    padding-top: 10vw;
  }

  .news_img_box {
    width: 90%;
  }

  .news_box {
    padding-bottom: 25vw;
  }

  /* フッター */
  .footer_content {
    padding-top: 20vw;
    padding-bottom: 10vw;
  }
}