:root{
  --bg:#0b0f17;
  --panel:#111827;
  --line:rgba(255,255,255,.08);
  --text:#e5e7eb;
  --muted:#9ca3af;
  --accent:#60a5fa;
  --accent2:#f59e0b;
}

*{box-sizing:border-box}
body{
  margin:0;
  font-family: system-ui, -apple-system, "Hiragino Kaku Gothic ProN", "Noto Sans JP", sans-serif;
  background:radial-gradient(1200px 600px at 20% 0%, rgba(96,165,250,.12), transparent 60%),
             radial-gradient(900px 500px at 90% 20%, rgba(245,158,11,.10), transparent 60%),
             linear-gradient(180deg,#070a10,#0b0f17 35%, #070a10);
  color:var(--text);
}

.site-header{
  position:static; 
  background:rgba(7,10,16,.86);
  backdrop-filter: blur(10px);
  border-bottom:1px solid var(--line);
  padding:14px 18px;
}
.brand .logo{font-weight:900; letter-spacing:.10em}
.brand .tag{color:var(--muted); font-size:12px; margin-top:4px}

.layout{
  display:grid;
  grid-template-columns: 260px minmax(0, 1fr);
  gap:14px;
  padding:14px;
  max-width: 1400px;
  margin:0 auto;
}

.side, .center{
  border:1px solid var(--line);
  border-radius:16px;
  background:rgba(17,24,39,.72);
  overflow:hidden;
}

.side{padding:12px}
.center{padding:12px}

.menu h2{font-size:14px; margin:6px 0 10px}
.menu-item{
  width:100%;
  text-align:left;
  padding:10px 10px;
  border-radius:12px;
  border:1px solid transparent;
  background:transparent;
  color:var(--text);
  cursor:pointer;
}
.menu-item:hover{border-color:var(--line); background:rgba(255,255,255,.03)}
.menu-item.is-active{border-color:rgba(96,165,250,.35); background:rgba(96,165,250,.10)}

.box{
  margin-top:12px;
  border-top:1px solid var(--line);
  padding-top:12px;
}
.box h2,.box h3{margin:0 0 10px; font-size:14px}

.note{
  margin:10px 0 0;
  color:var(--muted);
  font-size:12px;
  line-height:1.6;
}

.chips{display:flex; flex-wrap:wrap; gap:8px}
.chip{
  padding:8px 10px;
  border-radius:999px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.03);
  color:var(--text);
  cursor:pointer;
}
.chip:hover{border-color:rgba(255,255,255,.16)}
.chip.is-active{border-color:rgba(96,165,250,.35); background:rgba(96,165,250,.10)}

.center-head{
  border:1px solid var(--line);
  border-radius:14px;
  padding:10px 12px;
  background:rgba(0,0,0,.12);
  margin-bottom:12px;
}
.center-head h1{margin:0 0 4px; font-size:18px}
.center-head p{margin:0; color:var(--muted); font-size:12px}

.twitter-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:12px;
}
.twitter-card{
  border:1px solid var(--line);
  border-radius:14px;
  background:rgba(0,0,0,.16);
  padding:10px;
  min-height: 320px;
}
.twitter-card-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:8px;
}
.twitter-card h3{margin:0; font-size:13px; color:var(--text)}
.badge{
  font-size:11px;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid rgba(96,165,250,.35);
  background:rgba(96,165,250,.10);
  color:var(--text);
}
.badge-2{
  border-color: rgba(245,158,11,.35);
  background: rgba(245,158,11,.10);
}

.center-note{
  margin-top:12px;
  border:1px solid var(--line);
  border-radius:14px;
  padding:10px 12px;
  background:rgba(0,0,0,.10);
}
.center-note h2{
  margin:0 0 8px;
  font-size:14px;
}
.center-note ul{
  margin:0;
  padding-left:18px;
  color:var(--muted);
  font-size:12px;
  line-height:1.7;
}

.links{margin:0; padding-left:18px; color:var(--muted)}
.links a{color:var(--text); text-decoration:none}
.links a:hover{color:var(--accent)}

.site-footer{
  padding:16px;
  text-align:center;
  color:var(--muted);
}

@media (max-width: 980px){
  .layout{grid-template-columns: 1fr; }
  .twitter-grid{grid-template-columns: 1fr;}
}


/* halls page */
.layout.single{ grid-template-columns: 1fr; max-width: 1100px; }

.hall-toolbar{
  display:flex;
  gap:12px;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  border:1px solid var(--line);
  border-radius:14px;
  padding:10px;
  background:rgba(0,0,0,.12);
  margin-bottom:12px;
}


.tabs{display:flex; gap:8px; flex-wrap:wrap}
.tab{
  padding:9px 12px;
  border-radius:999px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.03);
  color:var(--text);
  cursor:pointer;
}
.tab.is-active{
  border-color:rgba(96,165,250,.35);
  background:rgba(96,165,250,.10);
}

.search input{
  padding:10px 12px;
  border-radius:12px;
  border:1px solid var(--line);
  background:rgba(0,0,0,.18);
  color:var(--text);
  outline:none;
}
.search input::placeholder{ color: rgba(229,231,235,.45); }

.hall-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap:12px;
}

.hall-card{
  border:1px solid var(--line);
  border-radius:14px;
  background:rgba(0,0,0,.16);
  padding:12px;
}
.hall-card h3{margin:0 0 6px; font-size:14px}
.hall-meta{color:var(--muted); font-size:12px; line-height:1.6; margin:0 0 10px}

.hall-actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.hall-actions a{
  display:inline-block;
  padding:8px 10px;
  border-radius:12px;
  border:1px solid var(--line);
  text-decoration:none;
  color:var(--text);
  background:rgba(255,255,255,.03);
}
.hall-actions a:hover{ border-color:rgba(255,255,255,.16); color:var(--accent); }

@media (max-width: 980px){
  .hall-grid{ grid-template-columns: 1fr; }
}

.menu-link{
    display:block;
    text-decoration:none;
  }

  
  /* テキストロゴ → 画像ロゴ */
.logo-header .brand{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
  }
  
  .site-logo{
    width: 100%;
    height: auto;
    display: block;
    max-width: none;     /* ★小さくならない */
  }
  
  /* スマホ用の max-width:280px は消す（または無効化） */
  @media (max-width: 980px){
    .site-logo{
      max-width: none;   /* ★ここが重要 */
      width: 100%;
    }
  }

  .layout{
    display:grid;
    grid-template-columns: 260px minmax(0, 1fr) 320px;
    gap:14px;
    padding:14px;
    max-width: 1400px;
    margin:0 auto;
  }

  /* 右：広告カラム */
.side.ads{
    padding:12px;
    display:flex;
    flex-direction:column;
    gap:12px;
  }
  
  .ad-slot{
    position: sticky;
    top: 86px; /* ヘッダー分の逃げ。ズレたら調整OK */
    border:1px solid var(--line);
    border-radius:14px;
    background:rgba(0,0,0,.16);
    padding:10px;
  }
  
  .ad-slot + .ad-slot{
    top: 610px; /* 2枠目を下に固定したい場合（不要なら消してOK） */
  }
  
  .ad-label{
    font-size:11px;
    color:var(--muted);
    margin-bottom:8px;
    letter-spacing:.08em;
  }
  
  .ad-slot img{
    width:100%;
    height: 600px;      /* 縦長広告の高さ */
    object-fit: cover;  /* 画像を枠いっぱいに */
    border-radius:12px;
    display:block;
  }
  
  /* スマホでは広告は下に回す or 非表示（好みで） */
  @media (max-width: 980px){
    .layout{ grid-template-columns: 1fr; }
    .ad-slot{ position: static; }
    .ad-slot img{ height: 420px; }
  }
/* ズーム・選択・タップ拡大防止 */
html, body {
  touch-action: manipulation;
  -webkit-text-size-adjust: 100%;
}

img, a, button {
  touch-action: manipulation;
  user-select: none;
  -webkit-user-select: none;
}

/* ===== スマホ：店舗名検索 はみ出し完全防止 ===== */

.hall-toolbar{
  display: flex;
  gap: 12px;
  align-items: center;
  flex-wrap: wrap;        /* 横に収まらなければ折り返す */
}

/* searchの箱が縮められるようにする */
.hall-toolbar .search{
  flex: 1 1 240px;
  min-width: 0;           /* ★これがないと横にはみ出る */
  width: 100%;
}

/* inputは必ず親幅100% */
.hall-toolbar .search input{
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  font-size: 16px;        /* iPhoneのズーム防止 */
  padding: 10px 12px;
}
  
/* ===== 中央ガイド表示 ===== */
.center-guide{
  border:1px solid var(--line);
  border-radius:16px;
  padding:16px;
  background:rgba(0,0,0,.15);
  text-align:center;
}

.guide-title{
  margin:0 0 14px;
  font-size:18px;
  font-weight:700;
}

.guide-image img{
  width:100%;
  max-width:520px;
  border-radius:14px;
  display:block;
  margin:0 auto 16px;
}

.guide-x-links{
  display:flex;
  gap:12px;
  justify-content:center;
  flex-wrap:wrap;
}

.guide-x-links a{
  padding:10px 14px;
  border-radius:999px;
  border:1px solid var(--line);
  text-decoration:none;
  color:var(--text);
  background:rgba(255,255,255,.05);
  font-size:14px;
}

.guide-x-links a:hover{
  border-color:rgba(96,165,250,.5);
  color:var(--accent);
}
/* ===== 北陸参考アカウント表示 ===== */

.account-grid{
  display:grid;
  grid-template-columns: repeat(2, 1fr);
  gap:16px;
  margin-top:16px;
}

.account-card{
  border:1px solid var(--line);
  border-radius:16px;
  background:rgba(0,0,0,.15);
  padding:12px;
  text-align:center;
}

.account-card img{
  width:100%;
  aspect-ratio: 1 / 1;   /* 正方形で統一 */
  object-fit: cover;
  border-radius:12px;
  margin-bottom:10px;
}

.account-card a{
  display:inline-block;
  margin-top:4px;
  padding:8px 14px;
  border-radius:999px;
  border:1px solid var(--line);
  text-decoration:none;
  color:var(--text);
  font-size:14px;
  background:rgba(255,255,255,.05);
}

.account-card a:hover{
  border-color:rgba(96,165,250,.5);
  color:var(--accent);
}

/* スマホは縦並び */
@media (max-width: 980px){
  .account-grid{
    grid-template-columns: 1fr;
  }
}
/* ===== 中央上部 広告エリア ===== */
.center-ad{
  border:1px solid var(--line);
  border-radius:16px;
  background:rgba(0,0,0,.18);
  padding:10px;
  margin-bottom:12px;
}

.center-ad img{
  width:100%;
  height:auto;
  display:block;
  border-radius:12px;
}
/* ① 案内 */
.center-intro{
  border:1px solid var(--line);
  border-radius:14px;
  padding:12px;
  margin-bottom:12px;
  background:rgba(0,0,0,.12);
  text-align:center;
  font-size:13px;
  color:var(--muted);
}

/* ② 中央広告 */
.center-ad{
  border:1px solid var(--line);
  border-radius:16px;
  padding:10px;
  margin-bottom:12px;
  background:rgba(0,0,0,.18);
}
.center-ad img{
  width:100%;
  border-radius:12px;
  display:block;
}

/* ④ Xアカウント */
.account-grid{
  display:grid;
  grid-template-columns: repeat(2, 1fr);
  gap:16px;
}
@media (max-width: 980px){
  .account-grid{ grid-template-columns:1fr; }
}
/* ===== 中央① 案内テキストを大きく ===== */
.center-intro{
  text-align:center;
  padding:16px;
}

.center-intro p{
  margin:0;
  font-size:18px;        /* ← 大きく */
  font-weight:700;       /* ← 見出し感 */
  color:var(--text);
  letter-spacing:0.04em;
}

/* スマホは少しだけ小さく */
@media (max-width: 980px){
  .center-intro p{
    font-size:16px;
  }
}

/* ===== LINE 登録エリア ===== */

.line-qr{
  margin:14px 0 12px;
  display:flex;
  justify-content:center;
}

.line-qr img{
  width:180px;
  height:180px;
  border-radius:16px;
  background:#fff;
  padding:10px;
}

/* LINE登録ボタン */
.line-btn{
  display:inline-block;
  margin-top:6px;
  padding:14px 22px;
  border-radius:999px;
  background:#06c755;            /* LINEグリーン */
  color:#fff;
  font-weight:700;
  font-size:16px;
  text-decoration:none;
  box-shadow:0 8px 20px rgba(6,199,85,.35);
}

.line-btn:hover{
  opacity:.9;
}

/* スマホ微調整 */
@media (max-width: 980px){
  .line-qr img{
    width:160px;
    height:160px;
  }
  .line-btn{
    width:100%;
    text-align:center;
  }
}

/* ===== LINE 登録エリア 中央揃え ===== */

.center-head{
  text-align:center;   /* ← 見出しも中身も全部中央 */
}

.center-head h1{
  margin:0 0 12px;
  text-align:center;
}

/* QR */
.line-qr{
  display:flex;
  justify-content:center;
  margin:14px 0 12px;
}

/* ボタン */
.line-btn{
  display:inline-block;
  margin:10px auto 0;   /* ← 中央固定 */
}