/* ジャーナル（一覧・テーマ別・記事）— 2026-10-04
   style.css の後に読む。色・角丸は style.css のトークン（--ink / --brass / --paper / --line・2px）に揃える */

/* ================= 一覧 ================= */
.j-sec{padding-top:56px;padding-bottom:0;}
.j-sec.j-list{padding-bottom:96px;}
.j-sec .section-head{margin-bottom:28px;}
.j-sec .section-head h2{font-size:22px;letter-spacing:.1em;}
.j-count{font-size:12px;color:var(--sub);letter-spacing:.08em;}

.journal-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;}
.jcard{height:100%;}
.jcard a{display:block;height:100%;}
.jcard-thumb img{aspect-ratio:16/9;object-fit:cover;width:100%;border-bottom:1px solid var(--line);}
.jcard-meta{font-size:11px;}
.jcard-body h2{font-size:16px;line-height:1.65;}
.jcard-ex{font-size:12.5px;color:var(--sub);line-height:1.8;margin-top:8px;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}

/* テーマから探す */
.j-themes{display:grid;grid-template-columns:repeat(5,1fr);border-top:1px solid var(--ink);border-bottom:1px solid var(--line);}
.j-theme{padding:22px 20px 22px 0;display:flex;flex-direction:column;}
.j-theme + .j-theme{padding-left:20px;border-left:1px solid var(--line);}
.j-theme h3{font-size:17px;letter-spacing:.08em;font-weight:600;}
.j-theme h3 a:hover{color:var(--brass);}
.j-theme-desc{font-size:12px;color:var(--sub);line-height:1.75;margin:6px 0 14px;}
.j-theme ul{list-style:none;margin-bottom:16px;}
.j-theme li{font-size:12.5px;line-height:1.65;padding:9px 0;border-top:1px solid var(--line);}
.j-theme li a:hover{color:var(--brass);}
.j-theme-more{margin-top:auto;font-size:12px;letter-spacing:.06em;color:var(--brass);font-weight:700;}
.j-theme-more:hover{text-decoration:underline;}

@media (max-width:1100px){
  .journal-grid{grid-template-columns:repeat(2,1fr);gap:24px;}
  .j-themes{grid-template-columns:repeat(2,1fr);border-bottom:none;}
  .j-theme,.j-theme + .j-theme{padding:20px 18px 20px 0;border-left:none;border-bottom:1px solid var(--line);}
  .j-theme:nth-child(even){padding-left:18px;padding-right:0;border-left:1px solid var(--line);}
}
@media (max-width:600px){
  .j-sec{padding-top:44px;}
  .j-sec.j-list{padding-bottom:72px;}
  .j-sec .section-head h2{font-size:19px;}
  .journal-grid{grid-template-columns:1fr;gap:14px;}
  .j-themes{grid-template-columns:1fr;}
  .j-theme,.j-theme + .j-theme,.j-theme:nth-child(even){padding:18px 0;border-left:none;}
  /* 新着・関連は横並びの小さなカード（一覧の縦の長さを抑える）。「まず読む」は大きいまま */
  .journal-grid:not(.j-feature) .jcard a{display:grid;grid-template-columns:128px 1fr;align-items:stretch;}
  .journal-grid:not(.j-feature) .jcard-thumb img{aspect-ratio:1/1;height:100%;border-bottom:none;border-right:1px solid var(--line);}
  .journal-grid:not(.j-feature) .jcard-body{padding:12px 14px;}
  .journal-grid:not(.j-feature) .jcard-body h2{font-size:14px;line-height:1.6;}
  .journal-grid:not(.j-feature) .jcard-ex{display:none;}
  .journal-grid:not(.j-feature) .jcard-meta{margin-bottom:4px;gap:10px;}
  .pagination{flex-wrap:wrap;margin-top:40px;}
}

/* ================= 記事 ================= */
.crumbs{font-size:11.5px;color:var(--sub);letter-spacing:.06em;display:flex;flex-wrap:wrap;gap:8px;}
.crumbs a:hover{color:var(--brass);}
.article-head h1{margin-top:18px;}
.article-meta{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:12px;color:var(--sub);letter-spacing:.06em;margin-top:16px;}

.article-body{font-size:16px;line-height:1.95;padding-bottom:72px;}
.article-body p{margin:0 0 1.5em;}
.article-body h2{font-size:22px;line-height:1.6;margin:56px 0 18px;padding:0 0 12px;border-bottom:1px solid var(--ink);
  font-family:"Yu Mincho","Hiragino Mincho ProN","Noto Serif JP",serif;letter-spacing:.06em;scroll-margin-top:84px;}
.article-body h3{font-size:17.5px;line-height:1.65;margin:36px 0 12px;padding-left:12px;border-left:2px solid var(--brass);}
.article-body ul,.article-body ol{margin:0 0 1.6em 1.3em;}
.article-body li{margin-bottom:.55em;}
.article-body li::marker{color:var(--brass);}
.article-body strong{font-weight:700;color:var(--ink);}
.article-body blockquote{border-left:2px solid var(--brass);background:var(--paper-deep);padding:16px 20px;margin:0 0 1.6em;}
.article-body blockquote p:last-child{margin-bottom:0;}
.article-body figure{margin:28px 0;}
.article-body figcaption{font-size:12.5px!important;color:var(--sub)!important;text-align:center;margin-top:10px;line-height:1.7;}
.article-body img{border-radius:2px!important;}
.article-body .wp-block-spacer{display:none;}
.article-body hr{border:none;border-top:1px solid var(--line);margin:40px 0;}

/* 目次 */
.toc{background:#fff;border:1px solid var(--line);border-radius:2px;padding:22px 26px;margin:8px 0 8px;max-width:520px;}
.toc-title{font-size:11px!important;font-weight:700;letter-spacing:.18em;color:var(--brass)!important;margin:0 0 10px!important;}
.toc ol{margin:0 0 0 1.3em;font-size:14px;line-height:1.7;}
.toc li{margin-bottom:.5em;}
.toc li:last-child{margin-bottom:0;}
.article-body .toc a{color:var(--ink);border-bottom:none;}
.article-body .toc a:hover{color:var(--brass);}

/* 要点・結論ボックス */
.pa-keys,.pa-take{background:#fff;border:1px solid var(--line);border-top:2px solid var(--ink);border-radius:2px;padding:22px 26px;margin:0 0 28px;}
.pa-keys .lbl,.pa-take .lbl{display:block;font-size:11px;font-weight:700;letter-spacing:.18em;color:var(--brass);margin-bottom:10px;}
.pa-keys ul{margin:0 0 0 1.2em;font-size:15px;line-height:1.85;}
.pa-keys li:last-child,.pa-take p:last-child{margin-bottom:0;}
.pa-take{background:var(--paper-deep);}
.article-body figure + .pa-keys,.article-body p + .pa-keys{margin-top:28px;}
.pa-take p{font-size:15px;}

/* 表 */
.article-body table{font-size:14px;line-height:1.7;min-width:100%;}
.article-body .wp-block-table{margin:0 0 28px;overflow-x:auto;}
.article-body .wp-block-table table{display:table;}
.article-body th{background:var(--paper-deep);white-space:nowrap;}
.article-body thead th{background:var(--ink);color:var(--paper);border-color:var(--ink);font-weight:600;}
.article-body td{background:#fff;}
.article-body tbody td:first-child{font-weight:700;white-space:nowrap;}

/* 流れ図・診断（本文に埋め込まれた図） */
.hnt-flow{background:#fff;border:1px solid var(--line);border-radius:2px;padding:24px 22px;margin:0 0 28px;text-align:center;}
.hnt-flow .ttl{font-size:13px;font-weight:700;letter-spacing:.1em;margin:0 0 14px;}
.hnt-flow .node{display:inline-block;border:1px solid var(--ink);border-radius:2px;padding:9px 18px;font-size:14px;min-width:240px;}
.hnt-flow .node.n1{background:var(--ink);color:var(--paper);}
.hnt-flow .arw{width:1px;height:16px;background:var(--ink);margin:0 auto;}
.hnt-flow .note{font-size:12.5px;color:var(--sub);margin:14px 0 0;}
.hnt-diag{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:0 0 28px;}
.hnt-diag .col{background:#fff;border:1px solid var(--line);border-radius:2px;padding:18px 14px;text-align:center;}
.hnt-diag .q{font-size:13.5px;line-height:1.7;margin:0 0 10px;}
.hnt-diag .arw{width:1px;height:14px;background:var(--ink);margin:0 auto 10px;}
.hnt-diag .ans{font-weight:700;font-size:15px;border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);padding:8px 0;}
.hnt-diag .sub{font-size:12px;color:var(--sub);margin:8px 0 0;}

/* 記事内リンクの箱 */
.j-next{border-top:1px solid var(--ink);border-bottom:1px solid var(--line);padding:18px 0 6px;margin:40px 0 0;}
.j-next .lbl{display:block;font-size:11px;font-weight:700;letter-spacing:.18em;color:var(--brass);margin-bottom:8px;}
.j-next ul{list-style:none;margin:0;}
.j-next li{padding:8px 0;border-top:1px solid var(--line);font-size:15px;margin:0;}
.j-next li:first-child{border-top:none;}

/* 旧ブロックのボタン（橙のグラデーション）をテーマのボタンに揃える */
.article-body .wp-block-buttons{margin:0 0 28px;font-size:inherit!important;}
.article-body .wp-block-button{width:auto!important;}
.article-body .wp-block-button__link{display:inline-block;background:var(--ink)!important;color:var(--paper)!important;
  border:1px solid var(--ink);border-radius:2px!important;padding:14px 34px;font-size:13.5px;letter-spacing:.1em;border-bottom:1px solid var(--ink);}
.article-body .wp-block-button__link strong{color:inherit;font-weight:400;}
.article-body .wp-block-button__link:hover{opacity:.82;}

/* 記事中の作品カード */
.j-works{margin:48px 0;padding:26px 0 22px;border-top:1px solid var(--ink);border-bottom:1px solid var(--line);}
.j-works-head{margin-bottom:18px;}
.article-body .j-works-title{font-size:18px;letter-spacing:.08em;font-weight:600;margin:8px 0 0;color:var(--ink);}
.j-works-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.article-body .j-works a{color:inherit;border-bottom:none;}
.article-body .j-works .card .thumb{padding:10px 10px 0;}
.article-body .j-works .card-body{padding:12px 12px 14px;line-height:1.6;}
.article-body .j-works .card-body h3{font-size:14.5px;margin:6px 0 2px;padding:0;border:none;line-height:1.5;}
.article-body .j-works .card-body p{margin:0;font-size:12px;}
.article-body .j-works .card-foot{margin-top:10px;padding-top:10px;}
.article-body .j-works .price{font-size:14px;}
.article-body .j-works .card-link{display:none;}
.article-body .j-works-more{margin:18px 0 0;font-size:13px;text-align:right;}
.article-body .j-works-more a{color:var(--brass);font-weight:700;letter-spacing:.06em;}
.article-body .j-works-more a:hover{text-decoration:underline;}

/* 書き手 */
.j-author{margin-top:64px;padding:24px 26px;background:#fff;border:1px solid var(--line);border-radius:2px;max-width:560px;}
.article-body .j-author-name{font-size:16px;font-weight:600;letter-spacing:.08em;margin:0 0 8px;color:var(--ink);}
.article-body .j-author p{font-size:13.5px;line-height:1.85;margin:0 0 10px;}
.article-body .j-author-links{display:flex;gap:20px;margin:0!important;}

/* 記事末の相談帯 */
.article-cta-lede a{color:var(--brass);border-bottom:1px solid currentColor;margin-left:6px;}

@media (max-width:600px){
  .article-body{font-size:15.5px;padding-bottom:56px;}
  .article-body h2{font-size:19.5px;margin-top:46px;}
  .article-body h3{font-size:16.5px;}
  .toc,.pa-keys,.pa-take{padding:18px 18px;}
  .hnt-diag{grid-template-columns:1fr;}
  .hnt-flow .node{min-width:0;width:100%;}
  .article-body th,.article-body tbody td:first-child{white-space:normal;}
  /* 作品カードは横に送る */
  .j-works-grid{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;margin:0 -22px;padding:0 22px 6px;-webkit-overflow-scrolling:touch;}
  .j-works-grid .card{flex:0 0 62%;scroll-snap-align:start;}
  .j-author{padding:20px 18px;}
  .article-cta-inner .btn{width:100%;text-align:center;}
}
