/* ==================================================
  layout.css
  - レイアウト専用（見た目は書かない）
================================================== */

/* ---------- Base ---------- */
html, body {
  margin: 0;
  padding: 0;
}

main.main {
  padding: 24px 0 48px;
}

/* ---------- Container ---------- */
/* Bootstrap container を前提に最大幅だけ制御 */
@media (min-width: 992px) {
  .container {
    max-width: 1200px;
  }
}

/* ---------- Layout Grid ---------- */
/* PC: 2カラム / SP: 1カラム */
.layout-grid {
  width: 100%;
}

/* ---------- Content / Sidebar ---------- */
.content-surface {
  width: 100%;
}

/* Sidebar は全ページ共通 */
.sidebar-wrap {
  width: 100%;
}

/* ---------- PC Only ---------- */
@media (min-width: 992px) {

  /* サイドバーは追従させる（不要なら消してOK） */
  .sidebar-wrap {
    position: sticky;
    top: 96px; /* header 高さ想定 */
  }
}

/* ---------- SP Only ---------- */
@media (max-width: 991.98px) {

  /* SPではサイドバーを本文の後ろに */
  .sidebar-wrap {
    margin-top: 24px;
  }
}



/* =========================
   SITE FOOTER
========================= */

.site-footer {
  background: #0f1115; /* ほぼ黒（完全黒は避ける） */
  color: rgba(255,255,255,.75);
}

.site-footer a {
  color: rgba(255,255,255,.75);
  text-decoration: none;
}

.site-footer a:hover {
  color: #fff;
  text-decoration: underline;
}

/* ---------- Brand ---------- */
.footer-brand__name {
  font-weight: 800;
  font-size: 1.05rem;
  color: #fff;
}

.footer-logo {
  height: 22px;
  width: auto;
}

.footer-desc {
  font-size: .9rem;
  line-height: 1.7;
  color: rgba(255,255,255,.7);
}

/* ---------- Titles ---------- */
.footer-title {
  font-size: .85rem;
  font-weight: 800;
  color: #fff;
  margin-bottom: 10px;
}

/* ---------- Links ---------- */
.footer-links li {
  margin-bottom: 6px;
}

.footer-links a {
  font-size: .85rem;
}

/* ---------- Meta ---------- */
.footer-meta__line {
  font-size: .75rem;
  color: rgba(255,255,255,.55);
  margin-bottom: 4px;
}

.footer-meta__line a {
  color: rgba(255,255,255,.7);
}

/* ---------- Trust chip ---------- */
.footer-chip {
  display: inline-block;
  padding: 4px 10px;
  font-size: .7rem;
  font-weight: 700;
  border-radius: 999px;
  background: rgba(255,255,255,.08);
  color: #fff;
}

/* ---------- Separator ---------- */
.footer-sep {
  border: none;
  border-top: 1px solid rgba(255,255,255,.12);
  margin: 24px 0;
}

/* ---------- Bottom ---------- */
.footer-bottom {
  font-size: .75rem;
  color: rgba(255,255,255,.5);
}

.footer-mini-links a {
  font-size: .75rem;
  color: rgba(255,255,255,.6);
}
