/* 全体の基本設定 */
body {
  font-family: 'Noto Sans JP', 'Yu Gothic', 'メイリオ', sans-serif !important;  /* 日本語フォント */
  color: #333 !important;  /* 文字色 */
  background-color: #fff !important;  /* 背景色 */
  line-height: 1.6 !important;  /* 行間の調整 */
  margin: 0 !important;
  padding: 0 !important;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: 600 !important;  /* 見出しの太字設定 */
  margin: 0 !important;
  padding: 0 !important;
}

a {
  color: #007acc !important;  /* リンクの色 */
  text-decoration: none !important;  /* リンクの下線を除去 */
}

a:hover {
  color: #005fa3 !important;  /* リンクホバー時の色 */
  text-decoration: underline !important;  /* ホバー時に下線を追加 */
}

ul, ol {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;  /* リストのデフォルトの丸をなくす */
}

img {
  max-width: 100% !important;  /* 画像が親要素を超えないように */
  height: auto !important;  /* 高さ自動調整 */
}

/* ヘッダーのデザイン */
header {
  background-color: #333 !important;  /* ヘッダー背景色 */
  color: #fff !important;  /* ヘッダー内の文字色 */
  padding: 10px 0 !important;  /* 上下の余白 */
  text-align: center !important;  /* 中央寄せ */
}

/* ナビゲーション */
nav {
  text-align: center !important;
  margin-top: 20px !important;
}

nav a {
  color: white !important;  /* リンクの文字色 */
  margin: 0 15px !important;  /* ナビリンクの左右余白 */
  font-size: 16px !important;
}

nav a:hover {
  color: #f1f1f1 !important;  /* ホバー時にリンク色を変更 */
}

/* フッターのデザイン */
footer {
  background-color: #333 !important;  /* フッター背景色 */
  color: #fff !important;  /* フッター内の文字色 */
  text-align: center !important;
  padding: 20px !important;
  position: relative !important;
  bottom: 0 !important;
  width: 100% !important;
}

/* コンテンツ全体のデザイン */
.container {
  max-width: 1200px !important;  /* コンテンツの最大幅 */
  margin: 0 auto !important;  /* 中央揃え */
  padding: 20px !important;
}

h1, h2, h3 {
  font-family: 'Roboto', sans-serif !important;  /* 見出しフォント */
}

p {
  margin-bottom: 20px !important;  /* 段落の下余白 */
  font-size: 16px !important;  /* 段落のフォントサイズ */
}

/* スマホ用のスタイル */
@media (max-width: 768px) {
  body {
    font-size: 14px !important;  /* 小さい画面では文字を少し小さめに */
  }

  header {
    padding: 15px !important;
  }

  nav {
    margin-top: 10px !important;
  }

  nav a {
    font-size: 14px !important;  /* ナビゲーションリンクを小さめに */
    margin: 0 10px !important;
  }

  .container {
    padding: 10px !important;
  }
}

/* ボタンデザイン */
button {
  background-color: #007acc !important;  /* ボタン背景色 */
  color: white !important;  /* ボタン文字色 */
  border: none !important;
  padding: 10px 20px !important;  /* ボタン内の余白 */
  font-size: 16px !important;
  cursor: pointer !important;  /* マウスオーバーでポインターを表示 */
  border-radius: 5px !important;  /* 角丸に */
}

button:hover {
  background-color: #005fa3 !important;  /* ホバー時に色変更 */
}

/* 不動産賃貸 セクションのフォント変更 */
.topicsBox {
  font-family: 'Noto Sans JP', 'Yu Gothic', 'メイリオ', sans-serif !important;
}

/* または、強調したい部分（strongタグ）のフォント変更 */
.topicsBox strong {
  font-family: 'Noto Sans JP', 'Yu Gothic', 'メイリオ', sans-serif !important;
}
