/* ===============================
   📌 初期化 + 変数定義（style.css用）
   スマホ・PC対応、丸ゴシック指定
================================== */

/* Googleフォント：M PLUS Rounded 1c（丸ゴシック） */
@import url('https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c&display=swap');

/* 🌱 カスタム変数定義（色・フォント・シャドウなど） */
:root {
  /* 色 */
  --color-important: #e53935;  /* 赤：緊急 */
  --color-warning:   #fdd835;  /* 黄：注意 */
  --color-info:      #43a047;  /* 緑：案内 */
  --color-accent:    #007acc;  /* 青系：リンクなど */
  --color-bg:        #f9f9f9;  /* 背景色 */
  --color-text:      #333;     /* 本文文字色 */

  /* フォント */
  --font-main: 'M PLUS Rounded 1c', sans-serif;

  /* シャドウ（共通） */
  --button-shadow: rgba(76, 175, 245, 0.21);
}

/* 🌐 初期化（全要素のマージン・パディング・サイズ計算） */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/* 📄 全体の基本設定 */
body {
  font-family: var(--font-main);
  background-color: var(--color-bg);
  color: var(--color-text);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  padding: 0;
  word-break: break-word;
}

/* 📱 レスポンシブ対応のための画像サイズ制御 */
img {
  max-width: 100%;
  height: auto;
  display: block;
}

/* 🖋️ 基本見出し設定 */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-main);
  line-height: 1.25;
  font-weight: bold;
  color: var(--color-text);
  margin-bottom: 0.5em;
}

/* 📄 リンク装飾（共通） */
a {
  color: var(--color-accent);
  text-decoration: none;
}
a:hover,
a:focus {
  text-decoration: underline;
}

/*//ここから全体に対する制御メディアクエリ//*/
/* --- スマホ用: 縦画面（600px以下）でボタン3つを下部中央に表示 --- */
@media (max-width: 600px) and (orientation: portrait) {
  .fixed-nav-container {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    justify-content: center;
    display: flex;
    z-index: 9999;
  }

  .fixed-nav-bg {
    display: block;
  }

  .fixed-buttons {
    flex-direction: row;
    padding: 0.5rem 0;
    gap: 0.8rem;
  }
}

/*//-見出し-//*/
/* style.css などに追加 */
h1 {
  font-size: 1.0rem;  /* 例：大きすぎない見出しサイズ */
  font-weight: bold;
  margin: 1em 0;
  text-align: center; /* 中央揃えも可 */
}