/*
 * cl-indexslider.css - Ver.1.4
 * トップページ メインビジュアル 2カラムオーバーレイ
 * 配置先: /httpdocs/inc/cl-indexslider.css
 *
 * V1.0 → V1.1:
 * V1.1 → V1.2:
 * V1.2 → V1.3:
 * - SP静的画像が複数出力されても1枚目のみ表示するCSS安全策追加
 *   .mv10__sp-image ~ .mv10__sp-image { display:none !important }
 *   .mv10__sp-image:first-of-type { display:block } (SP)
 * - .mainVisual__slider → .mv10__slider / .mainVisual__slide → .mv10__slide（main.css衝突回避）
 * - リンク関連CSS削除（.mv10__slide a）
 * - ツールチップCSS削除（.mv10-tooltip）
 */

/* ===== コンテナ（z-index:0でヘッダー下に封じ込め） ===== */
.mv10 { position: relative; overflow: hidden; z-index: 0; }
@media (min-width:769px) { .mv10 { height: 55vh; min-height: 420px; } }

/* ===== 背景 ===== */
.mv10__bg { position: absolute; top:0; left:0; width:100%; height:100%; z-index:0; }
@media (max-width:768px) { .mv10__bg { position: relative; height: auto; } }

/* スライダー */
.mv10 .mv10__slider { position:relative; width:100%; height:100%; }
.mv10 .mv10__slide {
  position:absolute; top:0; left:0; width:100%; height:100%;
  opacity:0; transition: opacity 2s ease-in-out;
}
.mv10 .mv10__slide.is-active { opacity:1; }
.mv10 .mv10__slide img { width:100%; height:100%; object-fit:cover; display:block; }

/* SP静的画像（2枚目以降は強制非表示） */
.mv10__sp-image { display:none; }
.mv10__sp-image ~ .mv10__sp-image { display:none !important; }
@media (max-width:768px) {
  .mv10 .mv10__slider { display:none; }
  .mv10__sp-image:first-of-type { display:block; }
  .mv10__sp-image img { width:100%; height:auto; display:block; }
}

/* ===== SP装飾画像（画像上にabsolute） ===== */
.mv10__sp-deco { display:none; }
@media (max-width:768px) {
  .mv10__sp-deco {
    position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
    z-index:3; text-align:center; pointer-events:none;
  }
  .mv10__sp-deco img { width:55%; height:auto; filter:drop-shadow(0 2px 10px rgba(0,0,0,0.5)); }
}

/* ===== 2カラムオーバーレイ（子要素2つのみ） ===== */
.mv10__overlay { position:relative; z-index:5; width:100%; height:100%; }
@media (min-width:769px) {
  .mv10__overlay {
    display:grid; grid-template-columns:1fr 1fr;
    max-width:1240px; margin:0 auto; padding:0 20px;
    align-items:center;
  }
}

/* ===== 左カラム（装飾画像・PCのみ） ===== */
.mv10__left {
  display:flex; flex-direction:column; justify-content:center;
  align-items:flex-start; padding:32px 36px;
}
.mv10__left img {
  width:100%; height:auto;
  filter:drop-shadow(0 2px 8px rgba(0,0,0,0.4));
}
@media (max-width:768px) { .mv10__left { display:none; } }

/* ===== 右カラム（1つのボックス） ===== */
.mv10__right { display:flex; align-items:center; justify-content:center; padding:24px 20px; }
@media (max-width:768px) { .mv10__right { padding:0; } }

.mv10__box {
  background:rgba(0,0,0,0.68); border-radius:10px; padding:28px 30px;
  color:#fff; width:100%;
  backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
}
@media (max-width:768px) { .mv10__box { border-radius:0; padding:20px 16px; } }
.mv10__box a { color:rgba(255,255,255,0.85); }
.mv10__box a:hover { color:#fff; }

/* h1 / サブタイトル */
.mv10__title {
  font-size:clamp(18px,2.2vw,32px); font-weight:700; color:#fff;
  line-height:1.5; text-shadow:0 1px 8px rgba(0,0,0,0.8);
}
.mv10__subtitle {
  font-size:clamp(12px,1.3vw,15px); font-weight:700; color:#fff;
  margin-top:8px; margin-bottom:18px;
  text-shadow:0 1px 5px rgba(0,0,0,0.8); letter-spacing:0.05em;
}
@media (max-width:768px) {
  .mv10__title { font-size:15px; }
  .mv10__subtitle { font-size:12px; margin-bottom:14px; }
}

/* 検索フォーム（SPでは非表示） */
.mv10__searchWrap { margin-bottom:14px; }
@media (max-width:768px) { .mv10__searchWrap { display:none; } }

/* キーワード（折り返し整理） */
.mv10__box .search__keywords {
  display:flex; flex-wrap:wrap; justify-content:center;
  gap:2px 4px; font-size:1.3rem; line-height:1.8;
}
@media (max-width:768px) {
  .mv10__box .search__keywords { margin-top:0; }
}

/* 更新日 */
.mv10__updateInfo {
  font-size:13px; color:rgba(255,255,255,0.7); line-height:1.6; text-align:center;
}
.mv10__updateInfo a {
  color:rgba(255,255,255,0.9);
  text-decoration:underline; text-decoration-color:rgba(255,255,255,0.3);
}

/* ===== SP専用帯（不要、非表示） ===== */
.mv10__sp-keywords { display:none; }