@charset "UTF-8";
/* 共通CSS: 以前は各ページの<style>に直書き（4ページで共通） */

/* ---- style ---- */

  :root{
    --navy:#00265a;
    --blue:#0068c9;
    --blue2:#43a3e8;
    --orange:#f08300;
    --line:#d9e3ef;
    --text:#14213d;
    --muted:#536274;
    --bg:#f7fbff;
  }
  *{box-sizing:border-box}
  body{
    margin:0;
    font-family:"Yu Gothic","YuGothic","Hiragino Kaku Gothic ProN","Meiryo",sans-serif;
    color:var(--text);
    background:#fff;
    line-height:1.7;
  
    padding-top:78px;
  }
  a{text-decoration:none;color:inherit}
  .page{
    max-width:1040px;
    margin:0 auto;
    padding:32px 20px 60px;
  }
  .breadcrumb{
    font-size:13px;
    font-weight:700;
    color:#0053a8;
    margin-bottom:18px;
  }
  .breadcrumb span{color:#93a3b5;margin:0 8px}
  .breadcrumb a:hover{text-decoration:underline}
  h1{
    margin:0;
    text-align:center;
    font-size:28px;
    letter-spacing:.04em;
    color:var(--navy);
  }
  .accent{
    width:52px;
    height:3px;
    margin:14px auto 22px;
    border-radius:999px;
    background:var(--orange);
  }
  .lead{
    text-align:center;
    margin:0 auto 30px;
    max-width:640px;
    color:#26364b;
    font-size:14px;
  }
  .back-link{
    display:inline-flex;
    align-items:center;
    gap:6px;
    font-size:13px;
    font-weight:700;
    color:#0053a8;
    margin-bottom:26px;
  }
  .back-link:hover{text-decoration:underline}

  .filter-row{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    justify-content:center;
    margin:0 0 34px;
  }
  .filter-row button{
    border:1.5px solid var(--line);
    background:#fff;
    color:var(--muted);
    font-size:13px;
    font-weight:700;
    padding:8px 18px;
    border-radius:999px;
    cursor:pointer;
  }
  .filter-row button.active{
    border-color:var(--blue);
    color:#fff;
    background:linear-gradient(135deg,#0073d9,#004fae);
  }

  .store-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:22px;
  }
  .store-card{
    border:1px solid var(--line);
    border-radius:10px;
    padding:24px;
    background:#fff;
    transition:.2s ease;
  }
  .store-card:hover{
    transform:translateY(-2px);
    box-shadow:0 12px 26px rgba(20,40,70,.08);
  }
  .store-card .area-tag{
    display:inline-block;
    font-size:11px;
    font-weight:800;
    color:var(--blue);
    background:#eaf4ff;
    padding:3px 10px;
    border-radius:999px;
    margin-bottom:10px;
  }
  .store-card h2{
    margin:0 0 10px;
    font-size:18px;
    color:var(--navy);
  }
  .store-card .addr{
    font-size:13px;
    color:var(--muted);
    margin:0 0 4px;
  }
  .store-card .tel{
    font-size:13px;
    color:var(--muted);
    margin:0 0 14px;
  }
  .store-card .tel b{color:var(--text)}
  .store-card .tags{
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin-bottom:16px;
  }
  .store-card .tags span{
    font-size:11px;
    color:#546476;
    background:#f2f6fa;
    border-radius:6px;
    padding:3px 9px;
  }
  .store-card .tags span.tag-mutenka{
    color:#3f6b10;
    background:#e3f4c4;
  }
  .store-card .detail-btn{
    display:inline-block;
    font-size:13px;
    font-weight:800;
    color:#fff;
    background:linear-gradient(135deg,#0073d9,#004fae);
    padding:9px 20px;
    border-radius:999px;
  }

  .empty-note{
    max-width:640px;
    margin:0 auto 40px;
    padding:16px 22px;
    border-radius:10px;
    background:#f7fbff;
    border:1px solid var(--line);
    font-size:13px;
    color:var(--muted);
    text-align:center;
  }

  .footer-cta{
    background:#002a5c;
    color:#fff;
    text-align:center;
    padding:28px 20px;
    margin-top:56px;
  }
  .footer-cta strong{
    font-size:18px;
    letter-spacing:.04em;
  }
  .footer-cta span{
    display:inline-block;
    margin:10px 16px 0;
    font-weight:700;
  }

  @media(max-width:700px){
    .store-grid{grid-template-columns:1fr}
  }

/* ===== 共通サイトヘッダー ===== */
  .site-header {
    background: rgba(255,255,255,0.96);
    backdrop-filter: blur(8px);
    border-bottom: 1px solid #dbeafe;
    position: fixed;
    top: 0; left: 0; right: 0;
    z-index: 200;
    font-family: "Zen Kaku Gothic New","Hiragino Kaku Gothic ProN",sans-serif;
  }
  .site-header .container { max-width: 1180px; margin: 0 auto; padding: 0 32px; }
  .site-header-inner { display: flex; justify-content: space-between; align-items: center; min-height: 72px; padding: 10px 0; flex-wrap: nowrap; }
  .site-logo { display: flex; align-items: center; gap: 12px; text-decoration: none; color: #0d3454; flex-shrink: 0; }
  .site-logo .mark { width: 32px; height: 32px; flex-shrink: 0; }
  .site-logo .mark img { width: 100%; height: 100%; object-fit: contain; display: block; }
  .site-logo .word { font-family: "Zen Old Mincho","Hiragino Mincho ProN",serif; font-size: 1.05rem; font-weight: 700; letter-spacing: 0.04em; line-height: 1.2; }
  .site-logo .word span { display: block; font-family: "JetBrains Mono",monospace; font-size: 0.62rem; letter-spacing: 0.18em; color: #c97a2e; font-weight: 400; }

  .site-nav ul { display: flex; list-style: none; gap: 18px; align-items: center; flex-wrap: nowrap; margin:0; padding:0; }
  .site-nav > ul > li { position: relative; }
  .site-nav a { text-decoration: none; color: #0d3454; font-weight: 500; font-size: 0.84rem; position: relative; padding-bottom: 4px; white-space: nowrap; }
  .site-nav > ul > li > a::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: #f0a154; transform: scaleX(0); transition: transform 0.25s ease; }
  .site-nav > ul > li > a:hover::after { transform: scaleX(1); }
  .site-nav .nav-cta {
    background: #073b6b;
    color: #fff !important;
    padding: 9px 14px;
    border-radius: 999px;
    font-size: 0.78rem;
    line-height: 1.2;
    white-space: nowrap;
    text-align: center;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  .site-nav .nav-cta::after { display: none; }
  .site-nav .nav-cta:hover { background: #0077b6; }

  .site-nav .has-dropdown > a { display: inline-flex; align-items: center; gap: 5px; }
  .site-nav .has-dropdown > a .caret { width: 9px; height: 9px; transition: transform 0.2s; }
  .site-nav .has-dropdown:hover > a .caret { transform: rotate(180deg); }
  .site-nav .site-dropdown { position: absolute; top: calc(100% + 14px); left: -22px; width: 280px; background: #f7fbff; border: 1px solid #dbeafe; box-shadow: 0 18px 40px rgba(15,76,124,0.14); padding: 10px; opacity: 0; visibility: hidden; transform: translateY(6px); transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s; z-index: 50; }
  .site-nav .has-dropdown:hover .site-dropdown, .site-nav .has-dropdown:focus-within .site-dropdown { opacity: 1; visibility: visible; transform: translateY(0); }
  .site-nav .site-dropdown a.dd-item { display: flex; align-items: baseline; gap: 10px; padding: 11px 12px; border-radius: 2px; font-size: 0.85rem; color: #0d3454; }
  .site-nav .site-dropdown a.dd-item::after { display: none; }
  .site-nav .site-dropdown a.dd-item:hover { background: #e8f8ff; }
  .site-nav .site-dropdown a.dd-item .dd-tag { font-family: "JetBrains Mono",monospace; font-size: 0.62rem; color: #00a88e; letter-spacing: 0.04em; white-space: nowrap; flex-shrink: 0; }
  .site-nav .site-dropdown hr { border: none; border-top: 1px solid #dbeafe; margin: 6px 4px; }
  .buy-dropdown .site-dropdown { left: auto; right: 0; }

  .site-hamburger {
    display: none;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 5px;
    width: 44px; height: 44px;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    z-index: 300;
  }
  .site-hamburger span {
    display: block;
    width: 24px; height: 2px;
    background: #0d3454;
    border-radius: 2px;
    transition: transform 0.3s ease, opacity 0.3s ease;
  }
  .site-hamburger.is-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .site-hamburger.is-open span:nth-child(2) { opacity: 0; }
  .site-hamburger.is-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

  .site-mobile-menu {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(7,59,107,0.98);
    z-index: 150;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 0;
    opacity: 0;
    transition: opacity 0.3s ease;
  }
  .site-mobile-menu.is-open { opacity: 1; }
  .site-mobile-menu a {
    display: block;
    color: #fff;
    text-decoration: none;
    font-family: "Zen Old Mincho","Hiragino Mincho ProN",serif;
    font-size: 1.3rem;
    padding: 16px 0;
    border-bottom: 1px solid rgba(255,255,255,0.12);
    width: 260px;
    text-align: center;
    font-weight: 700;
    letter-spacing: 0.06em;
  }
  .site-mobile-menu a:first-child { border-top: 1px solid rgba(255,255,255,0.12); }

  @media (max-width: 1320px) {
    .site-nav ul { gap: 12px; }
    .site-nav a { font-size: 0.76rem; }
    .site-nav .nav-cta { font-size: 0.7rem; padding: 8px 11px; }
  }
  @media (max-width: 768px) {
    .site-nav ul, .site-nav .nav-cta { display: none; }
    .site-hamburger { display: flex; }
  }