@charset "UTF-8";
/* コラム記事ページ（single.php）専用スタイル。.p-column-article にスコープ */

.p-column-article{
  --ink:#14110f;--ink-soft:#3a3632;--paper:#f7f3ee;--cream:#efe9e1;--cream2:#e8e0d5;
  --accent:#1a3a52;--accent-light:#2a5a7a;--gold:#e8d9b8;--gold-dark:#c4a870;--muted:#8a847c;
  --serif:'Noto Serif JP',serif;--sans:'Noto Sans JP',sans-serif;--mono:'Space Mono',monospace;
  --radius:10px;
  font-family:var(--serif);background:var(--paper);color:var(--ink);line-height:1.8;-webkit-font-smoothing:antialiased;overflow-x:hidden;
}
.p-column-article *,.p-column-article *::before,.p-column-article *::after{margin:0;padding:0;box-sizing:border-box}
.p-column-article a{color:inherit;text-decoration:none}

/* S1: Article Header */
.p-column-article .art-header{background:#2a2724;color:var(--paper);padding:100px 40px 60px;position:relative;overflow:hidden}
.p-column-article .art-header-inner{max-width:720px;margin:0 auto;position:relative;z-index:1}
.p-column-article .breadcrumb{font-family:var(--sans);font-size:11px;color:var(--muted);margin-bottom:24px;line-height:1.6}
.p-column-article .breadcrumb a{color:var(--gold);transition:color .2s}
.p-column-article .breadcrumb a:hover{color:#f0e4c8}
.p-column-article .art-meta{display:flex;align-items:center;gap:10px;margin-bottom:16px;flex-wrap:wrap}
.p-column-article .cat-badge{display:inline-block;padding:3px 10px;border-radius:4px;font-family:var(--sans);font-size:10px;font-weight:600;color:#fff;line-height:1.4}
.p-column-article .art-time,.p-column-article .art-date{font-family:var(--mono);font-size:10px;color:var(--muted)}
.p-column-article .art-header h1{font-family:var(--serif);font-size:clamp(24px,4vw,36px);font-weight:700;line-height:1.4;margin-bottom:16px}
.p-column-article .art-lead{font-family:var(--sans);font-size:14px;color:rgba(247,243,238,.6);line-height:2;max-width:600px}

/* S2: Article body */
.p-column-article .art-body{padding:60px 40px 80px;background:var(--paper)}
.p-column-article .art-body-inner{max-width:720px;margin:0 auto}
.p-column-article .art-body-inner p{font-family:var(--serif);font-size:16px;line-height:2;color:var(--ink);margin-bottom:28px}
.p-column-article .art-body-inner h2{font-family:var(--serif);font-size:22px;font-weight:700;margin-top:56px;margin-bottom:20px;padding-left:16px;border-left:3px solid var(--accent);line-height:1.5}
.p-column-article .art-body-inner h3{font-family:var(--serif);font-size:18px;font-weight:700;margin-top:40px;margin-bottom:14px;line-height:1.5}
.p-column-article .art-body-inner blockquote{border-left:3px solid var(--gold);padding-left:20px;margin:28px 0;font-style:italic;color:var(--ink-soft);line-height:2}
.p-column-article .art-body-inner blockquote p{font-size:15px;margin-bottom:8px}
.p-column-article .art-body-inner ul,.p-column-article .art-body-inner ol{font-family:var(--sans);font-size:15px;padding-left:24px;margin-bottom:28px;line-height:2}
.p-column-article .art-body-inner li{margin-bottom:4px}
.p-column-article .art-body-inner li::marker{color:var(--accent)}
.p-column-article .art-body-inner strong{font-weight:700}
.p-column-article .art-body-inner a{color:var(--accent);text-decoration:underline}
.p-column-article .art-body-inner img{max-width:100%;height:auto;border-radius:var(--radius)}
.p-column-article .art-body-inner figure{max-width:520px;width:100%;margin:40px auto;display:block}
.p-column-article .art-body-inner figure img{width:100%;border-radius:var(--radius);display:block}
.p-column-article .art-body-inner figcaption{font-family:var(--sans);font-size:11px;color:var(--muted);text-align:center;margin-top:8px}
.p-column-article .article-box{background:var(--cream);border-radius:var(--radius);padding:24px;margin:32px 0;font-family:var(--sans);font-size:14px;line-height:1.9;color:var(--ink-soft)}
.p-column-article .article-box p{font-family:var(--sans);font-size:14px;margin-bottom:10px;line-height:1.9}
.p-column-article .article-box p:last-child{margin-bottom:0}
.p-column-article .article-box strong{color:var(--ink)}

/* S3: Author */
.p-column-article .author{padding:0 40px 60px;background:var(--paper)}
.p-column-article .author-inner{max-width:720px;margin:0 auto;padding-top:40px;border-top:1px solid var(--cream2);display:flex;gap:20px;align-items:flex-start}
.p-column-article .author-photo{width:64px;height:64px;border-radius:50%;border:2px solid var(--cream2);background:var(--cream);flex-shrink:0;display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:9px;color:var(--muted);overflow:hidden}
.p-column-article .author-photo img{width:100%;height:100%;object-fit:cover}
.p-column-article .author-name{font-family:var(--serif);font-size:16px;font-weight:700;margin-bottom:2px}
.p-column-article .author-title{font-family:var(--sans);font-size:12px;color:var(--muted);margin-bottom:8px;line-height:1.5}
.p-column-article .author-desc{font-family:var(--sans);font-size:13px;color:var(--ink-soft);line-height:1.8;margin-bottom:10px}
.p-column-article .author-link{font-family:var(--sans);font-size:13px;color:var(--accent);text-decoration:underline}

/* S4: CTA band */
.p-column-article .cta-band{padding:48px 40px;background:var(--cream);text-align:center}
.p-column-article .cta-band-inner{max-width:600px;margin:0 auto}
.p-column-article .cta-band h2{font-family:var(--serif);font-size:clamp(18px,2.5vw,22px);font-weight:700;margin-bottom:20px}
.p-column-article .cta-band-btn{display:inline-flex;align-items:center;gap:8px;padding:14px 36px;border-radius:40px;font-size:14px;font-weight:600;font-family:var(--sans);background:var(--accent);color:#fff;transition:all .3s ease}
.p-column-article .cta-band-btn:hover{background:var(--accent-light);transform:translateY(-2px)}
.p-column-article .cta-band-links{margin-top:16px;font-family:var(--sans);font-size:12px;color:var(--muted);line-height:2}
.p-column-article .cta-band-links a{color:var(--accent);text-decoration:underline}

/* S5: Related */
.p-column-article .related{padding:60px 40px 80px;background:var(--paper)}
.p-column-article .related-inner{max-width:1060px;margin:0 auto}
.p-column-article .related-label{font-family:var(--sans);font-size:14px;color:var(--muted);margin-bottom:20px}
.p-column-article .related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.p-column-article .rel-card{border:1px solid var(--cream2);border-radius:var(--radius);overflow:hidden;background:#fff;transition:all .35s ease;display:flex;flex-direction:column}
.p-column-article .rel-card:hover{border-color:var(--accent);transform:translateY(-3px);box-shadow:0 8px 24px rgba(0,0,0,.06)}
.p-column-article .rel-card-img{aspect-ratio:3/2;background:var(--cream);display:flex;align-items:center;justify-content:center;overflow:hidden}
.p-column-article .rel-card-img img{width:100%;height:100%;object-fit:cover}
.p-column-article .img-fallback-text{font-family:var(--sans);font-size:12px;font-weight:600;letter-spacing:.05em;color:rgba(255,255,255,.85)}
.p-column-article .rel-card-body{padding:20px 18px;display:flex;flex-direction:column;flex:1}
.p-column-article .rel-card-meta{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.p-column-article .rel-card h3{font-family:var(--serif);font-size:15px;font-weight:600;line-height:1.5;margin-bottom:8px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.p-column-article .rel-card-lead{font-family:var(--sans);font-size:13px;color:var(--ink-soft);line-height:1.7;margin-bottom:12px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;flex:1}
.p-column-article .rel-card-footer{font-family:var(--mono);font-size:11px;color:var(--muted)}
.p-column-article .related-back{display:block;text-align:center;margin-top:32px;font-family:var(--sans);font-size:13px;color:var(--accent);text-decoration:underline}

@media(max-width:768px){
  .p-column-article .art-header{padding:80px 24px 48px}
  .p-column-article .art-body{padding:40px 24px 60px}
  .p-column-article .author{padding:0 24px 40px}
  .p-column-article .author-inner{flex-direction:column;align-items:center;text-align:center}
  .p-column-article .cta-band{padding:36px 24px}
  .p-column-article .related{padding:40px 24px 60px}
  .p-column-article .related-grid{grid-template-columns:1fr}
}