:root{--navy:#183d73;--blue:#5574b8;--green:#68a47b;--gold:#eab844;--ink:#232833;--muted:#667085;--bg:#f4f7fb;--line:#dce4ef}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;line-height:1.85;background:#fff}
a{color:inherit}
.container{width:min(1120px,calc(100% - 40px));margin:auto}
.site-header{height:100px;border-bottom:1px solid #e5e7eb;background:#fff}
.header-inner{width:min(1280px,calc(100% - 40px));height:100%;margin:auto;display:flex;align-items:center;justify-content:space-between}
.brand{display:flex;align-items:center;gap:14px;text-decoration:none;font-weight:800}
.brand img{width:275px}
.brand span{font-size:14px}
.global-nav{display:flex;gap:28px;font-weight:700}
.global-nav a{text-decoration:none}
.menu-toggle{display:none}
.breadcrumb{padding:14px 0;border-bottom:1px solid #e5e7eb;font-size:14px;color:#667085}
.breadcrumb a{color:#4f68aa}
.hero{background:linear-gradient(130deg,#f5f8fe 0,#fff 58%,#edf7f0 100%);padding:54px 0 60px}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:56px}
.eyebrow{margin:0 0 10px;color:#5574b8;font-size:13px;font-weight:900;letter-spacing:.18em}
.hero h1{margin:0;font-size:clamp(36px,3.45vw,44px);line-height:1.32;letter-spacing:-.035em}
.hero h1 em{font-style:normal;color:#4e70b7}
.lead{font-size:18px;font-weight:600;line-height:2}
.hero img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:26px;box-shadow:0 24px 60px rgba(28,53,91,.15)}
.chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
.chip{padding:8px 15px;border:1px solid #ccd8e9;border-radius:999px;background:#fff;color:#3f5e97;font-size:14px;font-weight:800}
.section{padding:72px 0}
.section.alt{background:var(--bg)}
.section-head{margin-bottom:30px}
.section-head span{color:#5574b8;font-size:13px;font-weight:900;letter-spacing:.15em}
.section-head h2{margin:6px 0 10px;font-size:clamp(28px,3vw,42px);line-height:1.4}
.section-head p{margin:0;color:var(--muted);font-size:17px}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.card{display:flex;flex-direction:column;padding:28px;border:1px solid var(--line);border-radius:20px;background:#fff;text-decoration:none;box-shadow:0 9px 30px rgba(30,53,88,.06)}
.card .label{color:#5574b8;font-size:12px;font-weight:900;letter-spacing:.12em}
.card h3{margin:10px 0 8px;font-size:22px;line-height:1.5}
.card p{margin:0;color:#667085}
.card .arrow{margin-top:auto;padding-top:20px;color:#4e70b7;font-weight:900}
.card.disabled{opacity:.62}
.notice{padding:22px 26px;border-left:5px solid var(--gold);border-radius:8px;background:#fff8e8}
.entry-list{display:grid;gap:16px}
.entry{padding:25px 28px;border:1px solid var(--line);border-radius:18px;background:#fff}
.entry h3{margin:0 0 8px;font-size:22px}
.entry h3 a{color:#244f8e;text-decoration:none}
.entry p{margin:6px 0}
.meta{color:#667085;font-size:14px}
.tag{display:inline-block;margin-right:8px;padding:4px 10px;border-radius:999px;background:#edf3fb;color:#355a91;font-size:12px;font-weight:800}
.cta{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:34px;border-radius:22px;background:linear-gradient(110deg,#183d73,#68a47b);color:#fff}
.cta h2{margin:0;font-size:28px}
.cta p{margin:8px 0 0}
.button{display:inline-block;padding:14px 24px;border-radius:999px;background:#fff;color:#244f8e;text-decoration:none;font-weight:900;white-space:nowrap}
.footer{padding:48px 0;background:#172f56;color:#fff}
.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:30px}
.footer img{width:230px;filter:brightness(0) invert(1)}
.footer-links{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:12px 20px}
.footer-links a{color:#fff;text-decoration:none;font-size:14px}
.footer small{display:block;margin-top:18px;text-align:right}

/* 趣味×交流会ハブ：読み物・比較・FAQ */
.narrow{max-width:920px}.sp-only{display:none}.hobby-story-section{padding-top:66px}.hobby-story{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(380px,.88fr);align-items:start;gap:42px}.hobby-story-copy p{margin:0 0 20px;font-size:16px;line-height:2}.hobby-story-copy strong{background:linear-gradient(transparent 63%,#fff0bc 63%);color:#1d355b}.hobby-caution{margin-top:28px!important;padding:20px 22px;border-left:5px solid var(--gold);border-radius:8px;background:#fff9eb;color:#48556a}.hobby-comparison{overflow:hidden;border:1px solid var(--line);border-radius:18px;background:#fff;box-shadow:0 13px 34px rgba(30,53,88,.07)}.hobby-comparison>div{display:grid;grid-template-columns:120px 1fr 1fr}.hobby-comparison span,.hobby-comparison strong,.hobby-comparison b{padding:15px 14px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);font-size:13px;line-height:1.55}.hobby-comparison>div>*:last-child{border-right:0}.hobby-comparison>div:last-child>*{border-bottom:0}.hobby-comparison-head{background:#edf3fb;color:#254d86}.hobby-comparison span{color:#52627a;font-weight:900}.hobby-comparison b{font-weight:700}.hobby-categories{background:var(--bg)}.hobby-selection-section{background:linear-gradient(135deg,#fff,#f5f8fd 55%,#eff7f1)}.hobby-selection-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.hobby-selection-grid article{position:relative;padding:28px 25px;border:1px solid var(--line);border-radius:19px;background:#fff;box-shadow:0 10px 28px rgba(30,53,88,.06)}.hobby-selection-grid article>span{display:grid;width:42px;height:42px;place-items:center;border-radius:50%;background:var(--navy);color:#fff;font-size:12px;font-weight:900}.hobby-selection-grid h3{margin:16px 0 9px;font-size:20px;line-height:1.55}.hobby-selection-grid p{margin:0;color:#596579;font-size:15px;line-height:1.85}.hobby-selection-grid a{color:#4264a5;font-weight:900;text-underline-offset:3px}.hobby-selection-note{margin:22px 0 0;padding:18px 21px;border-left:5px solid var(--green);border-radius:8px;background:#fff;color:#4e5c6f;font-size:15px;line-height:1.8}.matching-section{padding-bottom:52px}.hobby-faq-section{padding-top:36px;background:#f7f9fc}.hobby-faq{display:grid;gap:12px}.hobby-faq details{overflow:hidden;border:1px solid var(--line);border-radius:14px;background:#fff}.hobby-faq summary{position:relative;padding:20px 54px 20px 24px;color:#243650;font-size:17px;font-weight:900;line-height:1.65;cursor:pointer;list-style:none}.hobby-faq summary::-webkit-details-marker{display:none}.hobby-faq summary:after{position:absolute;right:22px;top:50%;content:"＋";transform:translateY(-50%);color:var(--blue);font-size:23px}.hobby-faq details[open] summary:after{content:"−"}.hobby-faq details p{margin:0;padding:0 24px 22px;color:#596579;font-size:16px;line-height:1.9}.hobby-faq details a{color:#4264a5;font-weight:900;text-underline-offset:3px}

@media(max-width:900px){.hobby-story{grid-template-columns:1fr;gap:28px}}
@media(max-width:760px){.site-header{height:78px}
.header-inner{width:calc(100% - 28px)}
.brand img{width:190px}
.brand span,.global-nav{display:none}
.menu-toggle{display:block;width:42px;height:32px;border:0;border-top:2px solid #333;border-bottom:2px solid #333;background:none}
.hero{padding:34px 0 42px}
.hero-grid{grid-template-columns:1fr;gap:28px}
.hero h1{font-size:32px;line-height:1.38}
.lead{font-size:16px}
.section{padding:50px 0}
.grid{grid-template-columns:1fr}
.cta{display:block;padding:26px}
.button{margin-top:18px;white-space:normal;text-align:center}
.footer-inner{display:block}
.footer-links{justify-content:flex-start;margin-top:25px}
.footer small{text-align:left}
.container{width:min(100% - 28px,1120px)}.sp-only{display:block}.hobby-story-section{padding-top:48px}.hobby-story-copy p{font-size:16px;line-height:1.9}.hobby-caution{padding:17px 18px}.hobby-comparison{overflow-x:auto}.hobby-comparison>div{min-width:610px;grid-template-columns:110px 1fr 1fr}.hobby-comparison span,.hobby-comparison strong,.hobby-comparison b{padding:13px 11px;font-size:12px}.hobby-selection-grid{grid-template-columns:1fr;gap:13px}.hobby-selection-grid article{padding:22px 20px}.hobby-selection-grid h3{font-size:19px}.hobby-selection-note{padding:16px 17px}.matching-section{padding-bottom:34px}.hobby-faq-section{padding-top:28px}.hobby-faq summary{padding:18px 48px 18px 19px;font-size:16px}.hobby-faq summary:after{right:18px}.hobby-faq details p{padding:0 19px 19px;font-size:15px}
}