/* style_gofuku.css */

/* リセット */
* {
  margin:0; padding:0; box-sizing:border-box;
}
body {
  font-family:"Noto Sans JP",sans-serif;
  color:#333;
  background:#fff;
    /* ヘッダーの上下余白15px×2 + ロゴ(アイコン)の最大高さ40px = 70px */
  padding-top: 70px;
}
a {
  display:inline-block;
  text-decoration:none;
  color:inherit;
}
img {
  max-width:100%;
  display:block;
}

/* コンテナ */
.container {
  max-width:1200px;
  margin:0 auto;
  padding:0 16px;
}

/* ── Header ── */
header {
  position: fixed;
  top: 0; left: 0;
  width: 100%;
  background: #fff;
  border-bottom: 1px solid #ddd;
  z-index: 1000;
}

/* ヘッダー内コンテナをフレックスで均等配置、高さ180pxに */
/* ── Header ── */
.header-inner {
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  max-width: 1200px;
  margin: 0 auto;
  padding: 10px 16px;   /* 上下15px、左右16px */
  gap: 24px;
  /* height は指定しないので、コンテンツに合わせて自動調整されます */
}

/* モバイル時も同様に */
@media (max-width: 768px) {
  .header-inner {
    padding: 10px 12px;
    gap: 24px;
  }
}

/* ヘッダー画像は高さ100%まで拡大、幅は自動 */
.header-inner a img {
  max-height: 100%;
  width: auto;
}

/* 旧nav・ハンバーガー関連は無効化 */
.global-nav, .menu-btn {
  display: none !important;
}

.logo img {
  height:40px;
}
.global-nav {
  display:flex;
  gap:16px;
}
.global-nav a img {
  height:24px;
}
.menu-btn {
  display:none;
  background:none;
  border:none;
  font-size:24px;
  cursor:pointer;
}

/* 2段目：スライドショー */
.slideshow {
  /* margin-top: 56px; ← これを削除または上書き */
  max-width: 1200px;
  margin: 0 auto;    /* 上下0、左右auto */
  position: relative;
  overflow: hidden;
}
/* スライド内の画像もブロック要素化し中央に */
.slideshow .slide img {
  display: block;
  margin: 0 auto;
}
.slides {
  display:flex;
  transition:transform .6s ease;
}
.slide {
  flex-shrink:0;
  width:100%;
}
.slideshow button {
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  background:rgba(0,0,0,0.3);
  color:#fff;
  border:none;
  padding:8px;
  cursor:pointer;
  font-size:18px;
}
.prev { left:8px; }
.next { right:8px; }

/* ── ３・４段目：コンテンツ画像を中央配置 ── */
.section-img {
  /* 既に .container がある場合はこれで OK */
  text-align: center;
}
.section-img img {
  display: inline-block; /* 横幅固定なら inline-block、可変なら block+auto も可 */
  /* もし幅が大きすぎる場合は max-width:100%; を追加してください */
}
/* ── ５段目：News下のトピックテキスト体裁 ── */
.news-list {
  max-width: 750px;
  margin: 24px auto;
  padding: 0 16px;
}
.news-list hr {
  border: none;
  border-top: 1px solid #ddd;
  margin: 16px 0;
}
.news-item + hr {
  /* hrの直前に余白が出ないよう、必要に応じて調整 */
  margin-top: 0;
}
.news-item {
  padding: 16px 0;
}
.news-date {
  font-size: 14px;
  color: #666;
  margin-bottom: 8px;
}
.news-title {
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 8px;
}
.news-body {
  font-size: 14px;
  line-height: 1.6;
  margin-bottom: 8px;
}

/* ── 5段目：Newsバナースクロールマージン ── */
#news {
  scroll-margin-top: 130px;
}

/* ── 5段目：Newsバナー画像を中央寄せ ── */
#news {
  text-align: center;
}
#news > img {
  display: inline-block;
  margin: 0 auto;
}
/* ── Newsトピックスは左揃え ── */
#news .news-list {
  text-align: left;
}
/* ── 5段目：Newsトピックス外枠（背景1200px） ── */
#news .news-bg {
  background-color: #fafafa;
  max-width: 1200px;
  margin: 0 auto;      /* 中央寄せ */
  padding: 16px 0;     /* 上下余白 */
}

/* ── 5段目：Newsトピックス内側（テキスト幅750px） ── */
#news .news-list.container {
  max-width: 750px;
  margin: 0 auto;      /* 外側ラッパー内で中央 */
  padding: 0 16px;     /* 左右パディング */
  background: none;    /* 旧 background-color をクリア */
}

/* 6〜8段目：バナーリンク */
.banner-link {
  margin:32px 0;
  text-align:center;
}
.banner-link img {
  border-radius:8px;
}

/* ── ９段目：トップへバナーアイコン ── */
.to-top {
  /* 通常フローに戻し、上下マージンで間隔を確保 */
  position: static;
  margin: 40px auto;    /* 上下40px、左右中央 */
  text-align: center;
}

.to-top img {
  /* 原寸を保つ */
  display: inline-block;
  width: auto;
  height: auto;
  max-width: none;      /* レスポンシブ制約を解除 */
}


/* 10段目：ボトムナビ */
.bottom-nav {
  display:none;
}
.bottom-nav {
  position:fixed;
  bottom:0; left:0;
  width:100%;
  background:#fff;
  border-top:1px solid #ddd;
  z-index:1000;
}
.bottom-nav ul {
  display:flex;
}
.bottom-nav li {
  flex:1;
  text-align:center;
  padding:8px 0;
}
.bottom-nav li a img {
  height:24px;
}

/* 11段目：フッター */
footer {
  padding:16px 0;
  text-align:center;
  font-size:12px;
  border-top:1px solid #ddd;
  background: #e50112;  /* ← ここを変更 */
  color: #fff;          /* ※必要に応じて文字色も白に */
}

/* ── 5〜9段目上部に120pxの余白 ── */
/* 5段目：Newsセクション */
#news {
  margin-top: 120px;
}

/* 6段目：メニューページバナー */
#menu.banner-link {
  margin-top: 120px;
}

/* 7段目：店舗一覧バナー */
#locations.banner-link {
  margin-top: 120px;
}

/* 8段目：お問い合わせバナー */
#contact.banner-link {
  margin-top: 120px;
}

/* 9段目：トップへスクロールバナー */
.to-top {
  margin-top: 120px; /* 既存の margin:auto を上書き */
}


/* レスポンシブ */
@media (max-width:768px) {
  .global-nav {
    display:none;
    flex-direction:column;
    background:#fff;
    position:absolute;
    top:56px;
    right:16px;
    border:1px solid #ddd;
  }
  .global-nav.open {
    display:flex;
  }
  .menu-btn {
    display:block;
  }
  .bottom-nav {
    display:block;
  }
  .section-img {
    margin:24px 0;
  }
  .slideshow button {
    padding:6px;
    font-size:16px;
  }
}