:root{--bg:#fff;--text:#111;--muted:#666;--line:#e8e8e8;--brand:#0f62fe;}
*{box-sizing:border-box}html,body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial}
a{color:inherit;text-decoration:none}
.link{color:var(--brand)}
.muted{color:var(--muted)}
.primary{background:var(--brand);color:#fff;border:0;border-radius:10px;padding:.65rem 1rem;cursor:pointer}
.section{padding:32px 20px;max-width:1200px;margin:0 auto}
.grid{display:grid;gap:16px}
.grid.cards{grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
.grid.cats{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
.grid.plans{grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
.grid.thumbs{grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}
.card{border:1px solid var(--line);border-radius:14px;padding:16px;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.03)}
.thumb{position:relative;border-radius:12px;border:1px solid var(--line);background:#fafafa;height:160px;display:flex;align-items:center;justify-content:center}
.badge{position:absolute;right:8px;bottom:8px;background:rgba(0,0,0,.7);color:#fff;padding:4px 8px;border-radius:999px;font-size:12px}
.hero{background:linear-gradient(180deg,#f6f7fb,#fff);border-bottom:1px solid var(--line)}
.hero-inner{max-width:1200px;margin:0 auto;padding:48px 20px}
.searchbar{display:flex;gap:8px;align-items:center}
.searchbar select,.searchbar input{padding:.6rem .75rem;border:1px solid var(--line);border-radius:10px;flex:1}
.searchbar select{max-width:220px;flex:0 0 220px}
.header{position:sticky;top:0;background:#fff;border-bottom:1px solid var(--line);z-index:99}
.header-inner{display:flex;align-items:center;justify-content:space-between;max-width:1200px;margin:0 auto;padding:10px 16px;gap:16px}
.logo{font-weight:700}
.nav{display:flex;gap:14px;align-items:center}
.lang{display:flex;gap:10px;align-items:center}
.tab{display:flex;gap:8px;margin-bottom:16px}
.tab-btn{border:1px solid var(--line);background:#fff;border-radius:999px;padding:.5rem .9rem;cursor:pointer}
.tab-btn.active{background:var(--brand);color:#fff;border-color:var(--brand)}
.faq-list details{border:1px solid var(--line);border-radius:10px;margin-bottom:8px;padding:10px 12px}

/* ここから修正・追加した箇所 */
.image-view{
  display: flex;
  flex-direction: column;
  gap: 24px;
  max-width: 1200px;
  margin: 0 auto;
  align-items: center;
}

.image-box{
  max-width: 100%;
  border:1px dashed var(--line);
  border-radius:12px;
  background:#fafafa;
  display:flex;
  align-items:center;
  justify-content:center;
  aspect-ratio:4/3;
}

.image-box img {
  max-width: 100%;
  max-height: 100%;
  display: block;
  object-fit: contain;
}
/* ここまで修正・追加した箇所 */

.ph{color:#aaa}
footer{border-top:1px solid var(--line);background:#fff}
.footer-inner{max-width:1200px;margin:0 auto;padding:24px 16px;display:grid;gap:14px;color:var(--muted)}
.chat-opener{position:fixed;right:20px;bottom:20px;border-radius:999px;padding:.8rem 1rem;background:var(--brand);color:#fff;border:0;box-shadow:0 6px 20px rgba(0,0,0,.15);z-index:100}
.chat-modal{position:fixed;inset:0;background:rgba(0,0,0,.35);display:flex;align-items:center;justify-content:center;z-index:101}
.chat-card{background:#fff;width:min(420px,90vw);border-radius:14px;padding:16px;box-shadow:0 12px 40px rgba(0,0,0,.2)}
.chat-card .close{float:right;background:transparent;border:0;font-size:22px;cursor:pointer}
.chat-gate{padding:20px;border:1px dashed var(--line);border-radius:10px}

/* Ensure hidden chat modal stays hidden */
.chat-modal[hidden]{display:none !important}