/*
  index.css
  2025 coded by K.Kobiki
*/

@charset "utf-8";

/* リセット */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/* 全体 */
html,
body {
  margin: 0;
  background-color: #e9e2cc;
  font-family: "Noto Sans JP", sans-serif;
  width: 897px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
}

/* 背景画像 */
#bg_image {
  width: 100%;
  display: block;
}

/* 文字の重なりレイヤー */
.overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  color: #3b1f0a;
  text-align: center;
}

/* ロゴ文字 */
.logo-main {
  font-size: 36px;
  letter-spacing: 6px;
}

.logo-sub {
  font-size: 18px;
  margin-top: 4px;
}

/* 路線ブロック */
.section {
  width: 100%;
  position: absolute;
}

.top-section {
  top: 345px;
}

.bottom-section {
  bottom: 115px;
}

.route-title {
  font-size: 20px;
  margin-bottom: 0;
}

.next-bus {
  font-size: 50px;
  font-weight: normal;
}

.after-bus {
  font-size: 25px;
  margin-top: 5px; /* ← 半角に修正 */
}

.remain {
  font-size: 25px;
  margin-left: 8px;
}

/* ===== 下のリンク画像 ===== */

/* 配置位置（上下はここで調整） */
.seian {
  position: absolute;
  top: 598px;   /* ← 上下調整 */
  left: 50%;
  transform: translateX(305px); /* 左側 */
}

.media {
  position: absolute;
  top: 595px;   /* ← 上下調整 */
  left: 50%;
  transform: translateX(375px);  /* 右側 */
}

/* ★ 画像サイズ調整はここ ★ */
.seian img,
.media img {
  width: 45px;      /* ← この数字を変えるだけでサイズ変更 */
  height: auto;
  display: block;
}

/* 現在時刻 */
.now-title {
  margin-top: 120px;
  font-size: 18px;
}

.current-time {
  position: absolute;
  top: 155px;   /* ← 現在時刻ブロックの上下 */
  width: 100%;
  text-align: center;
}

.date {
  font-size: 18px;
}

.clock {
  font-size: 32px;
  margin-top: 4px;
}

.dia {
  font-size: 16px;
  margin-top: 4px;
}