/* ===== フォント設定 ===== */
/* 日本語：ヒラギノ明朝 / 英字：Times New Roman */
body {
  font-family:
    "Hiragino Mincho ProN", "Hiragino Mincho Pro",
    "ヒラギノ明朝 ProN W3", "ヒラギノ明朝 Pro W3",
    "MS Mincho", serif;
}
:lang(en), h2, nav, .site-logo {
  font-family: "Times New Roman", Times, serif;
}

/* ===== 変数 ===== */
:root {
  --bar-h: 48px;
  --icon: 36px;
  --bar-bg: rgba(152, 158, 179, 0.7);   /* #989EB3 70% */
  --bar-border: rgba(152, 158, 179, 0.7);
}

html {
  font-size: 16px;
}
body {
  margin: 0;
  padding-top: calc(var(--bar-h) * 2);  /* ロゴ+ナビ分 */
  background: #fff;
  color: #333;
  line-height: 1.6;
}

/* ===== ロゴ（固定） ===== */
.site-logo {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: var(--bar-h);
  background-color: var(--bar-bg);
  padding: 0 12px;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  z-index: 1000;
}
.site-logo img {
  height: calc(var(--bar-h) - 8px);
  width: auto;
  display: block;
}

/* ===== ナビ（固定） ===== */
nav {
  position: fixed;
  top: var(--bar-h);
  left: 0;
  width: 100%;
  height: var(--bar-h);
  display: flex;
  align-items: center;
  justify-content: stretch;
  background-color: var(--bar-bg);
  border-top: 1px solid var(--bar-border);
  border-bottom: 1px solid #fff;  /* 下の1pxラインを白に */
  box-sizing: border-box;
  z-index: 999;
}
nav a {
  flex: 1 1 auto;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
}
nav img {
  height: calc(var(--bar-h) - 8px);
  width: auto;
  display: block;
}
/* 現在ページだけ白背景（角は丸めない） */
nav a.active {
  background-color: #fff;
}

/* ===== Information セクション ===== */
.information-area {
  min-height: calc(100vh - (var(--bar-h) * 2));
  display: block;
  padding: 38px 20px 40px 20px;
  background: #fff;
  box-sizing: border-box;
}

.information {
  max-width: 800px;
  margin: 0 auto;
  text-align: left;
  padding: 0 30px;
  box-sizing: border-box;
  word-break: normal;
}

/* タイトル（柱つき・ノベルページと統一） */
.information h2 {
  position: relative;
  padding-left: 14px;
  font-size: 1.25rem;  /* ← 少し大きめに変更 */
  font-weight: 400;
  margin: 20px 0;
  width: fit-content;
  text-align: left;
}
.information h2::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.2em;
  width: 4px;
  height: 1.1em;
  background: linear-gradient(
    to bottom,
    #fdd9c7,  /* 淡いオレンジ */
    #e0b8d1,  /* ピンク〜紫 */
    #a5b7e1,  /* 青みがかった紫 */
    #5c6e91   /* 深い藍色 */
  );
  border-radius: 0;
}