/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Apr 21 2026 | 01:08:03 */
/* =========================
   サムネイルエリア
========================= */
.thumb-list {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.thumb-item {
  flex: 1 1 200px; /* ←これが最適解 */
  cursor: pointer;
}

.thumb-item img {
  width: 100%;
  height: auto;
  display: block;
}

/* SEO用テキスト（非表示） */
.thumb-text {
  display: none;
}


/* =========================
   モーダル全体
========================= */
#xModal {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.6);
  z-index: 9999;
}


/* =========================
   モーダル中身（レスポンシブ対応）
========================= */
.xModal-content {
  background: #fff;

  /* ★可変幅（最強パターン） */
  width: min(90%, 800px);

  /* ★高さ制御（長文対策） */
  max-height: 70vh;
  overflow-y: auto;

  /* ★中央配置（安定版） */
  margin: 10vh auto;

  padding: 20px;
  border-radius: 8px;
  position: relative;
}


/* =========================
   モーダルテキスト
========================= */
.xModal-text {
  line-height: 1.7;
  word-break: break-word;
}


/* =========================
   改行の余白制御（重要）
========================= */

/* 方法①：<br class="space"> */
.xModal-text br.space {
  display: block;
  margin-bottom: -5px;
}

/* 方法②：spanで制御 */
.xModal-text span {
  display: block;
}

.xModal-text .mb {
  margin-bottom: 10px;
}


/* =========================
   閉じるボタン
========================= */
.xModal-close {
  position: absolute;
  top: 8px;
  right: 12px;

  font-size: 30px;
  line-height: 1;

  background: none;
  border: none;
  cursor: pointer;
}


/* =========================
   モバイル微調整（任意）
========================= */
@media (max-width: 750px) {
  .xModal-content {
    width: 92%;
    margin: 8vh auto;
    padding: 16px;
  }
}