/* -------------------------------------
   認知症リスクの簡単チェックツール用
   緑ベーステーマ（base.cssの変数を上書き）
--------------------------------------*/

:root {
  /* 背景（柔らかい緑） */
  --bg-body: #e9f7f1;

  /* セクション背景 */
  --bg-panel: #ffffff;

  /* アクセントカラー（見出しなど） */
  --accent-orange: #2f9b6a;          /* 緑寄りアクセント */
  --accent-orange-light: #d6f2e5;    /* 柔らかい薄緑 */

  /* テキスト系 */
  --text-main: #174233;
  --text-muted: #5b746b;

  /* 枠線 */
  --border-light: #c5e2d4;

  /* ボタン色（必要に応じて使用） */
  --btn-blue: #2f9b6a;   /* リンクボタンを緑系にまとめたい場合 */
  --btn-green: #2f9b6a;

  --radius-lg: 16px;
  --radius-md: 10px;
  --shadow-soft: 0 8px 20px rgba(0, 0, 0, 0.05);
}

/* -------------------------------------
   ページ固有の調整
--------------------------------------*/

/* ヒーローセクションを少しだけトーンアップ */
.hero {
  background-color: var(--bg-panel);
}

.hero .main-title {
  text-align: center;
}


/* 概要図のスタイル */
.overview-figure {
  margin-top: 16px;
  text-align: center;
}

.overview-figure img {
  display: block;
  margin: auto;
  max-width: 60%; /* ← より小さくしたい場合は30〜50%に調整可 */
  height: auto;
  border: none;
  background: transparent;
}


/* セクションタイトルは緑に */
.section-title {
  color: var(--accent-orange);
}

/* 強調テキストも緑寄りに */
strong {
  color: var(--accent-orange);
}

/* テキストリンク（URL等） */
.text-link {
  color: var(--accent-orange);
  text-decoration: none;
}
.text-link:hover {
  text-decoration: underline;
}



.pdf-icon-inbtn {
  width: 18px;
  height: auto;
  vertical-align: middle;
  margin-right: 8px;
  display: inline-block;
}

.paper-link {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  margin-top: 8px;
  padding: 10px 18px;
  background-color: #ffffff;
  border-radius: 10px;
  text-decoration: none;
  color: var(--accent-orange);
  font-weight: 600;
  font-size: 0.95rem;
  transition: 0.18s ease;
  border: 1px solid var(--border-light);
}

.paper-link-wrapper {
  text-align: right;
}

.paper-link:hover {
  background-color: var(--btn-green);
  color: #ffffff;
  border-color: var(--btn-green);
  transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(47, 143, 104, 0.25);
}

.pdf-icon {
  width: 20px;      /* おすすめサイズ */
  height: auto;
  vertical-align: middle;
  margin-right: 6px; /* 文字との隙間 */
}

/* リストの間隔を少し広めに */
.tool-card-list li {
  margin-bottom: 5px;
}

.launch-section {
  text-align: center;
  background: #ffffff;
  padding: 28px 10px;
  border-radius: var(--radius-lg);
  margin-top: 16px;
  box-shadow: var(--shadow-soft);
}

.cta-wrapper {
  display: flex;
  justify-content: center;
}

.btn-launch {
  display: inline-block;
  background-color: var(--btn-green);
  color: #ffffff;
  padding: 14px 22px;
  font-size: 1rem;
  border-radius: 999px;
  font-weight: 600;
  text-decoration: none;
  box-shadow: 0 4px 10px rgba(47, 143, 104, 0.25);
  transition: 0.18s ease;
  margin-bottom: 18px;
}

.btn-launch:hover {
  filter: brightness(1.07);
  transform: translateY(-2px);
}

.back-container {
  text-align: center;
  margin-top: 22px;   /* ボタンとの距離 */
  margin-bottom: 20px;
}

.back-button {
  display: inline-block;
  padding: 10px 24px;
  border-radius: 999px;
  font-size: 0.9rem;
  text-decoration: none;
  color: #ffffff;
  background-color: var(--btn-blue);
  transition: 0.2s ease;
}

.back-button:hover {
  filter: brightness(1.05);
}


/* お問い合わせ内のロゴ中央寄せ */
.contact-section {
  text-align: left;
   background-color: var(--bg-panel);
  
}

.contact-section .contact-logo {
  display: block;
  margin: 16px auto 4px;
}

/* フッター文字色を少し落ち着かせる */
.site-footer {
  color: #5c6f7d;
}