/*
Theme Name: AIの時短ワザ
Theme URI: https://jitan-waza.com
Author: Accord-M
Author URI: https://accord-m.co.jp
Description: ビジネスパーソン向けAI時短メディアテーマ。モバイルファースト・アドセンス対応。
Version: 1.0.0
License: GNU General Public License v2 or later
Text Domain: jitan-waza
*/

/* ========== CSS変数 ========== */
:root {
  --bg:         #f5f6f8;
  --white:      #ffffff;
  --navy-deep:  #0d1b3e;
  --navy:       #2451a3;
  --navy-light: #3b6fd4;
  --navy-pale:  #e8eef9;
  --red:        #d42020;
  --red-pale:   #fdeaea;
  --text-h:     #0f1923;
  --text-body:  #2d3748;
  --text-sub:   #637085;
  --text-muted: #9aa3b2;
  --border:     #dde1ea;
  --ad-bg:      #f0f2f6;
}

/* ========== リセット ========== */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; -webkit-tap-highlight-color:transparent; }
body { background:var(--bg); color:var(--text-body); font-family:'Noto Sans JP',sans-serif; font-size:15px; line-height:1.85; overflow-x:hidden; }
a { text-decoration:none; color:inherit; }
img { max-width:100%; height:auto; display:block; }

/* ========== 広告ユニット ========== */
.ad-unit { background:var(--ad-bg); border:1px dashed #c0c8d8; border-radius:6px; display:flex; align-items:center; justify-content:center; flex-direction:column; gap:4px; color:var(--text-muted); font-size:10px; position:relative; }
.ad-unit::before { content:'広告'; position:absolute; top:4px; left:6px; font-size:9px; color:var(--text-muted); background:rgba(0,0,0,0.06); padding:1px 5px; border-radius:3px; }
.ad-sp-banner { width:100%; height:60px; max-width:320px; margin:0 auto; }
.ad-rect      { width:100%; height:280px; max-width:336px; margin:0 auto; }
.ad-pc-banner { width:100%; height:90px; display:none; }
@media(min-width:768px){ .ad-pc-banner{display:flex;} .ad-sp-banner{display:none;} }

/* ========== HEADER ========== */
#site-header { background:var(--white); border-bottom:3px solid var(--navy-deep); position:sticky; top:0; z-index:200; box-shadow:0 2px 8px rgba(0,0,0,0.08); }
.header-inner { display:flex; align-items:center; justify-content:space-between; padding:0 16px; height:56px; max-width:1140px; margin:0 auto; }
.site-logo { display:flex; align-items:center; gap:9px; }
.logo-mark { width:38px; height:38px; background:var(--navy-deep); border-radius:8px; display:flex; align-items:center; justify-content:center; font-size:18px; flex-shrink:0; position:relative; }
.logo-mark::after { content:''; position:absolute; bottom:-2px; right:-2px; width:11px; height:11px; background:var(--red); border-radius:3px; border:2px solid #fff; }
.logo-text { line-height:1.1; }
.logo-en { font-family:'Rajdhani',sans-serif; font-size:9px; font-weight:600; letter-spacing:2px; color:var(--navy-light); text-transform:uppercase; display:block; }
.logo-ja { font-size:17px; font-weight:900; color:var(--navy-deep); display:block; }
.logo-ja em { font-style:normal; color:var(--red); }
.hamburger { width:40px; height:40px; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:5px; cursor:pointer; border-radius:6px; background:var(--bg); border:1px solid var(--border); }
.hamburger span { display:block; width:20px; height:2px; background:var(--navy-deep); border-radius:2px; }
.pc-nav { display:none; align-items:center; gap:2px; }
.pc-nav a { color:var(--text-sub); font-size:13px; font-weight:700; padding:8px 12px; border-radius:6px; transition:all 0.15s; white-space:nowrap; }
.pc-nav a:hover, .pc-nav a.current-menu-item { color:var(--navy); background:var(--navy-pale); }
.pc-nav .nav-cta { background:var(--red); color:#fff !important; margin-left:8px; padding:8px 16px !important; border-radius:6px; }

/* ドロワー */
.drawer { position:fixed; top:0; right:-100%; width:80%; max-width:300px; height:100vh; background:var(--white); z-index:300; box-shadow:-4px 0 20px rgba(0,0,0,0.15); transition:right 0.3s ease; overflow-y:auto; }
.drawer.open { right:0; }
.drawer-overlay { display:none; position:fixed; inset:0; background:rgba(0,0,0,0.4); z-index:299; }
.drawer-overlay.open { display:block; }
.drawer-head { display:flex; align-items:center; justify-content:space-between; padding:16px; border-bottom:1px solid var(--border); }
.drawer-close { width:36px; height:36px; display:flex; align-items:center; justify-content:center; font-size:20px; cursor:pointer; color:var(--text-sub); background:none; border:none; }
.drawer-nav a { display:flex; align-items:center; gap:10px; padding:14px 20px; font-size:14px; font-weight:700; color:var(--text-h); border-bottom:1px solid var(--bg); }
.drawer-nav .menu-icon { font-size:18px; width:24px; text-align:center; }
.drawer-cta { margin:16px; display:block; background:var(--red); color:#fff; font-size:14px; font-weight:700; text-align:center; padding:13px; border-radius:8px; }



/* AD bar */
.ad-bar { background:var(--white); border-bottom:1px solid var(--border); padding:10px 16px; display:flex; justify-content:center; }

/* ========== BREADCRUMB ========== */
.breadcrumb { background:var(--white); border-bottom:1px solid var(--border); padding:10px 16px; font-size:11px; color:var(--text-muted); overflow-x:auto; white-space:nowrap; }
.breadcrumb a { color:var(--navy-light); }
.breadcrumb span { margin:0 6px; }

/* ========== HERO ========== */
.hero { background:linear-gradient(135deg,var(--navy-deep) 0%,#1a3060 100%); padding:28px 16px; position:relative; overflow:hidden; }
.hero::before { content:'99'; position:absolute; right:-10px; bottom:-20px; font-family:'Rajdhani',sans-serif; font-size:130px; font-weight:700; color:rgba(255,255,255,0.05); line-height:1; pointer-events:none; }
.hero-inner { max-width:1140px; margin:0 auto; }
.hero-badge { display:inline-flex; align-items:center; gap:5px; background:var(--red); color:#fff; font-size:10px; font-weight:700; letter-spacing:1px; padding:3px 10px; border-radius:4px; margin-bottom:10px; }
.hero h1 { font-size:21px; font-weight:900; color:#fff; line-height:1.5; margin-bottom:8px; }
.hero h1 .accent { color:#ff8888; }
.hero-desc { font-size:12px; color:rgba(255,255,255,0.6); line-height:1.8; margin-bottom:16px; }
.hero-stats { display:flex; gap:12px; flex-wrap:wrap; }
.hero-stat { display:inline-flex; align-items:baseline; gap:5px; background:rgba(255,255,255,0.1); border:1px solid rgba(255,255,255,0.2); border-radius:8px; padding:7px 14px; }
.hero-stat .num { font-family:'Rajdhani',sans-serif; font-size:32px; font-weight:700; color:#fff; line-height:1; }
.hero-stat .label { font-size:11px; color:rgba(255,255,255,0.6); }

/* ========== LAYOUT ========== */
.wrap { max-width:1140px; margin:0 auto; }
.section { padding:20px 16px; }
.page-wrap { max-width:1140px; margin:0 auto; padding:20px 16px; }
.sec-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }
.sec-title { display:flex; align-items:center; gap:8px; font-size:15px; font-weight:900; color:var(--text-h); }
.sec-bar { display:inline-block; width:4px; height:18px; background:var(--navy); border-radius:2px; flex-shrink:0; }
.sec-bar.red { background:var(--red); }
.sec-more { font-size:12px; font-weight:700; color:var(--navy-light); }
.divider { height:8px; background:var(--bg); border-top:1px solid var(--border); border-bottom:1px solid var(--border); }

/* ========== FEATURED（横スクロール） ========== */
.featured-scroll { overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:none; margin:0 -16px; padding:0 16px; }
.featured-scroll::-webkit-scrollbar { display:none; }
.featured-track { display:flex; gap:12px; width:max-content; padding-bottom:4px; padding-right:16px; }
.feat-card { width:260px; background:var(--white); border:1px solid var(--border); border-radius:10px; overflow:hidden; box-shadow:0 2px 8px rgba(0,0,0,0.07); flex-shrink:0; display:block; }
.feat-card:active { opacity:0.9; }
.feat-thumb { height:140px; background:linear-gradient(135deg,var(--navy-deep),var(--navy)); display:flex; align-items:center; justify-content:center; font-size:48px; position:relative; }
.feat-thumb-label { position:absolute; bottom:8px; left:8px; background:var(--red); color:#fff; font-size:10px; font-weight:700; padding:3px 8px; border-radius:4px; }
.feat-body { padding:14px; }
.feat-tags { display:flex; gap:5px; margin-bottom:7px; flex-wrap:wrap; }
.tag { font-size:10px; font-weight:700; padding:2px 7px; border-radius:3px; white-space:nowrap; }
.tag-navy { background:var(--navy-pale); color:var(--navy); }
.tag-red  { background:var(--red-pale);  color:var(--red); }
.feat-title { font-size:13px; font-weight:700; color:var(--text-h); line-height:1.6; margin-bottom:10px; }
.feat-meta { display:flex; align-items:center; gap:8px; font-size:11px; color:var(--text-muted); flex-wrap:wrap; }
.save-badge { display:inline-flex; align-items:center; gap:3px; background:var(--red-pale); color:var(--red); font-size:10px; font-weight:700; padding:2px 7px; border-radius:4px; white-space:nowrap; }

/* ========== ARTICLE LIST ========== */
.article-list { display:flex; flex-direction:column; gap:8px; }
.art-card { background:var(--white); border:1px solid var(--border); border-radius:10px; padding:14px 16px; display:flex; gap:12px; align-items:flex-start; box-shadow:0 1px 4px rgba(0,0,0,0.05); cursor:pointer; }
.art-card:active { background:#f0f3f8; }
.art-num { font-family:'Rajdhani',sans-serif; font-size:22px; font-weight:700; color:var(--border); line-height:1; min-width:28px; padding-top:1px; flex-shrink:0; }
.art-body-inner { flex:1; min-width:0; }
.art-title { font-size:13px; font-weight:700; color:var(--text-h); line-height:1.65; margin-bottom:8px; }
.art-meta { display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.art-date { font-size:10px; color:var(--text-muted); }

/* 記事間AD */
.ad-inline { background:var(--white); border-top:1px solid var(--border); border-bottom:1px solid var(--border); padding:12px 16px; display:flex; justify-content:center; margin:4px 0; }

/* ========== PAGINATION ========== */
.pagination { display:flex; justify-content:center; gap:6px; padding:16px 16px 24px; }
.page-btn { width:38px; height:38px; display:flex; align-items:center; justify-content:center; border:1px solid var(--border); border-radius:6px; font-size:13px; font-weight:700; color:var(--text-sub); background:var(--white); cursor:pointer; }
.page-btn.active, .page-numbers.current { background:var(--navy); color:#fff; border-color:var(--navy); }
.page-numbers { width:38px; height:38px; display:flex; align-items:center; justify-content:center; border:1px solid var(--border); border-radius:6px; font-size:13px; font-weight:700; color:var(--text-sub); background:var(--white); }

/* ========== CTA BANNER ========== */
.cta-wrap { padding:0 16px; }
.cta-banner { background:linear-gradient(135deg,var(--navy-deep),#1a3060); border-radius:12px; padding:22px 20px; text-align:center; }
.cta-icon { font-size:32px; display:block; margin-bottom:8px; }
.cta-title { font-size:15px; font-weight:900; color:#fff; margin-bottom:6px; }
.cta-desc { font-size:11px; color:rgba(255,255,255,0.6); line-height:1.8; margin-bottom:14px; }
.cta-btn { display:block; background:var(--red); color:#fff; font-size:14px; font-weight:700; padding:13px; border-radius:8px; letter-spacing:0.5px; }

/* ========== RANKING ========== */
.rank-list { display:flex; flex-direction:column; gap:8px; }
.rank-item { display:flex; gap:12px; padding:13px 16px; background:var(--white); border:1px solid var(--border); border-radius:8px; align-items:flex-start; cursor:pointer; }
.rank-item:active { background:#f0f3f8; }
.rank-no { font-family:'Rajdhani',sans-serif; font-size:22px; font-weight:700; line-height:1; min-width:24px; color:var(--border); flex-shrink:0; padding-top:1px; }
.rank-item:nth-child(1) .rank-no { color:#d42020; }
.rank-item:nth-child(2) .rank-no { color:#e07030; }
.rank-item:nth-child(3) .rank-no { color:#c8a820; }
.rank-title { font-size:13px; font-weight:500; color:var(--text-h); line-height:1.65; }

/* ========== CATEGORY GRID ========== */
.cat-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:8px; }
.cat-card { background:var(--white); border:1px solid var(--border); border-radius:8px; padding:14px 12px; display:flex; align-items:center; gap:10px; cursor:pointer; }
.cat-card:active { background:var(--navy-pale); border-color:var(--navy-light); }
.cat-icon { font-size:22px; flex-shrink:0; }
.cat-name { font-size:12px; font-weight:700; color:var(--text-h); }
.cat-count { font-size:10px; color:var(--text-muted); }

/* ========== NEW ARTICLES ========== */
.new-list { display:flex; flex-direction:column; gap:8px; }
.new-item { background:var(--white); border:1px solid var(--border); border-radius:8px; padding:12px 14px; display:flex; align-items:flex-start; gap:10px; }
.new-date { font-size:10px; color:var(--text-muted); white-space:nowrap; padding-top:2px; min-width:48px; }
.new-title { font-size:12px; font-weight:500; color:var(--text-h); line-height:1.65; }

/* ========== 自動アイキャッチ ========== */
.eyecatch-auto { width:100%; aspect-ratio:16/9; border-radius:10px; overflow:hidden; position:relative; display:flex; flex-direction:column; justify-content:flex-end; padding:20px 22px; box-shadow:0 4px 24px rgba(0,0,0,0.2); margin:16px 0 20px; }
.ec-chatgpt { background:linear-gradient(135deg,#0a3d62 0%,#1a5276 55%,#2471a3 100%); }
.ec-claude  { background:linear-gradient(135deg,#1a0533 0%,#4a1570 55%,#7d3cad 100%); }
.ec-jidoka  { background:linear-gradient(135deg,#0d3b2e 0%,#1a6644 55%,#28b463 100%); }
.ec-shiryo  { background:linear-gradient(135deg,#1a2550 0%,#2c3e7a 55%,#3b6fd4 100%); }
.ec-mail    { background:linear-gradient(135deg,#3d1a00 0%,#7d3500 55%,#c0392b 100%); }
.ec-gazou   { background:linear-gradient(135deg,#2d1b00 0%,#7d5200 55%,#d4a017 100%); }
.ec-coding  { background:linear-gradient(135deg,#0d2137 0%,#0e4b6e 55%,#0097a7 100%); }
.ec-prompt  { background:linear-gradient(135deg,#1a1a2e 0%,#2d2d6e 55%,#5050c8 100%); }
.ec-default { background:linear-gradient(135deg,#0d1b3e 0%,#1a3060 55%,#2451a3 100%); }
.eyecatch-auto::before { content:attr(data-icon); position:absolute; right:-8px; top:-8px; font-size:130px; line-height:1; opacity:0.07; pointer-events:none; }
.eyecatch-auto::after { content:''; position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,0.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,0.03) 1px,transparent 1px); background-size:28px 28px; pointer-events:none; }
.ec-inner { position:relative; z-index:1; }
.ec-cat-badge { display:inline-flex; align-items:center; gap:5px; background:rgba(255,255,255,0.15); border:1px solid rgba(255,255,255,0.25); color:#fff; font-size:10px; font-weight:700; letter-spacing:1px; padding:3px 10px; border-radius:4px; margin-bottom:10px; backdrop-filter:blur(4px); }
.ec-title { font-size:16px; font-weight:900; color:#fff; line-height:1.5; text-shadow:0 1px 6px rgba(0,0,0,0.4); margin-bottom:12px; }
.ec-footer { display:flex; align-items:center; justify-content:space-between; }
.ec-logo { font-size:11px; font-weight:900; color:rgba(255,255,255,0.55); }
.ec-logo em { font-style:normal; color:rgba(255,110,110,0.9); }
.ec-save { display:inline-flex; align-items:center; gap:3px; background:var(--red); color:#fff; font-size:10px; font-weight:700; padding:3px 9px; border-radius:4px; }

/* ========== ARTICLE BODY ========== */
.art-header-meta { margin-bottom:20px; }
.art-cats { display:flex; gap:6px; flex-wrap:wrap; margin-bottom:10px; }
.art-title-h1 { font-size:20px; font-weight:900; color:var(--text-h); line-height:1.5; margin-bottom:14px; border-left:4px solid var(--navy); padding-left:12px; }
.art-meta-row { display:flex; align-items:center; gap:12px; flex-wrap:wrap; font-size:12px; color:var(--text-muted); padding-bottom:16px; border-bottom:1px solid var(--border); }
.entry-content { font-size:15px; line-height:1.9; color:var(--text-body); }
.entry-content p { margin-bottom:16px; }
.entry-content strong { color:var(--text-h); font-weight:700; }
.entry-content em { font-style:normal; color:var(--red); font-weight:700; }
.entry-content h2 { font-size:18px; font-weight:900; color:var(--text-h); margin:36px 0 14px; padding:12px 16px; background:var(--navy-pale); border-left:4px solid var(--navy); border-radius:0 6px 6px 0; line-height:1.5; }
.entry-content h3 { font-size:16px; font-weight:700; color:var(--text-h); margin:28px 0 10px; padding-bottom:6px; border-bottom:2px solid var(--border); display:flex; align-items:center; gap:6px; }
.entry-content h3::before { content:''; display:inline-block; width:4px; height:16px; background:var(--red); border-radius:2px; flex-shrink:0; }
.entry-content ul, .entry-content ol { padding-left:0; margin-bottom:20px; list-style:none; }
.entry-content ul li, .entry-content ol li { padding:6px 0 6px 24px; position:relative; border-bottom:1px solid var(--bg); font-size:14px; line-height:1.7; }
.entry-content ul li::before { content:''; position:absolute; left:6px; top:14px; width:7px; height:7px; background:var(--navy-light); border-radius:50%; }
.entry-content ol { counter-reset:ol-counter; }
.entry-content ol li { counter-increment:ol-counter; }
.entry-content ol li::before { content:counter(ol-counter); position:absolute; left:0; top:6px; width:18px; height:18px; background:var(--navy); color:#fff; font-size:10px; font-weight:700; border-radius:50%; display:flex; align-items:center; justify-content:center; }
.entry-content pre { background:#1a2030; border-radius:8px; padding:16px; overflow-x:auto; margin-bottom:20px; font-size:13px; line-height:1.6; color:#e8eaf0; border-left:3px solid var(--navy-light); }
.entry-content code { font-family:'Courier New',monospace; background:var(--navy-pale); color:var(--navy); padding:2px 6px; border-radius:4px; font-size:13px; }
.entry-content pre code { background:none; color:#e8eaf0; padding:0; }
.entry-content blockquote { background:var(--bg); border-left:4px solid var(--navy-light); padding:14px 16px; margin:20px 0; border-radius:0 8px 8px 0; font-size:14px; color:var(--text-sub); }
.entry-content table { width:100%; border-collapse:collapse; margin-bottom:20px; font-size:13px; }
.entry-content table th { background:var(--navy-deep); color:#fff; padding:10px 12px; text-align:left; font-weight:700; }
.entry-content table td { padding:10px 12px; border-bottom:1px solid var(--border); }
.entry-content table tr:nth-child(even) td { background:var(--bg); }
.entry-content .wp-block-image { margin:20px 0; }
.entry-content .wp-block-image img { border-radius:8px; }

/* TOC */
.toc { background:var(--navy-pale); border:1px solid rgba(36,81,163,0.2); border-left:4px solid var(--navy); border-radius:0 8px 8px 0; padding:16px 18px; margin:20px 0; }
.toc-title { font-size:13px; font-weight:900; color:var(--navy); margin-bottom:10px; }
.toc ol { counter-reset:toc-counter; list-style:none; padding:0; margin:0; }
.toc ol li { counter-increment:toc-counter; padding:4px 0; border-bottom:none; }
.toc ol li::before { content:counter(toc-counter)'.'; background:none; color:var(--navy-light); font-size:12px; font-weight:700; width:auto; height:auto; border-radius:0; position:static; display:inline; margin-right:6px; }
.toc ol li a { font-size:13px; color:var(--navy); line-height:1.5; }
.toc ol li a:hover { text-decoration:underline; }
.toc ol li ol { padding-left:20px; }
.toc ol li ol li::before { color:var(--text-muted); }
.toc ol li ol li a { font-size:12px; color:var(--text-sub); }

/* 記事中AD */
.ad-in-article { margin:28px -16px; padding:16px; display:flex; justify-content:center; border-top:1px solid var(--border); border-bottom:1px solid var(--border); background:var(--white); }

/* シェア */
.share-bar { background:var(--white); border:1px solid var(--border); border-radius:10px; padding:16px; margin:28px 0; text-align:center; }
.share-title { font-size:12px; font-weight:700; color:var(--text-sub); margin-bottom:12px; }
.share-btns { display:flex; gap:8px; justify-content:center; flex-wrap:wrap; }
.share-btn { display:flex; align-items:center; gap:6px; padding:9px 16px; border-radius:6px; font-size:12px; font-weight:700; cursor:pointer; border:none; }
.share-x    { background:#000; color:#fff; }
.share-line { background:#06c755; color:#fff; }
.share-copy { background:var(--bg); color:var(--text-h); border:1px solid var(--border) !important; }

/* 著者 */
.author-box { background:var(--white); border:1px solid var(--border); border-radius:10px; padding:18px; margin:24px 0; display:flex; gap:14px; align-items:flex-start; }
.author-avatar { width:52px; height:52px; background:linear-gradient(135deg,var(--navy-deep),var(--navy)); border-radius:50%; flex-shrink:0; display:flex; align-items:center; justify-content:center; font-size:22px; overflow:hidden; }
.author-avatar img { width:100%; height:100%; object-fit:cover; }
.author-name { font-size:14px; font-weight:700; color:var(--text-h); margin-bottom:3px; }
.author-role { font-size:11px; color:var(--text-muted); margin-bottom:6px; }
.author-bio  { font-size:12px; color:var(--text-sub); line-height:1.7; }

/* 前後記事 */
.prev-next { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:24px 0; }
.prev-next a { background:var(--white); border:1px solid var(--border); border-radius:8px; padding:12px 14px; }
.prev-next a:active { background:#f0f3f8; }
.pn-label { font-size:10px; color:var(--text-muted); margin-bottom:4px; display:block; }
.pn-title { font-size:12px; font-weight:700; color:var(--text-h); line-height:1.5; }
.next-art { text-align:right; }

/* 関連記事 */
.related-list { display:flex; flex-direction:column; gap:8px; }
.related-item { background:var(--white); border:1px solid var(--border); border-radius:8px; padding:13px 16px; display:flex; gap:12px; align-items:flex-start; }
.related-item:active { background:#f0f3f8; }
.related-thumb { width:64px; height:44px; border-radius:6px; overflow:hidden; flex-shrink:0; }
.related-thumb img { width:100%; height:100%; object-fit:cover; }
.related-body { flex:1; min-width:0; }
.related-title { font-size:13px; font-weight:700; color:var(--text-h); line-height:1.6; margin-bottom:4px; }
.related-meta  { font-size:11px; color:var(--text-muted); display:flex; gap:8px; flex-wrap:wrap; }

/* ========== SIDEBAR ========== */
.sidebar-pc { display:none; }
.sidebar-sticky { position:sticky; top:76px; }
.sidebar-widget { background:var(--white); border:1px solid var(--border); border-radius:10px; overflow:hidden; margin-bottom:20px; box-shadow:0 1px 4px rgba(0,0,0,0.05); }
.widget-head { padding:12px 16px; border-bottom:1px solid var(--border); font-size:13px; font-weight:900; color:var(--text-h); display:flex; align-items:center; gap:8px; }
.w-bar { display:inline-block; width:3px; height:16px; background:var(--navy); border-radius:2px; }
.w-bar.red { background:var(--red); }
.widget-body { padding:12px 16px; }
.cta-mini { background:linear-gradient(135deg,var(--navy-deep),#1a3060); border-radius:10px; padding:20px; text-align:center; margin-bottom:20px; }
.cta-mini .cta-mini-icon { font-size:28px; display:block; margin-bottom:8px; }
.cta-mini .cta-mini-title { font-size:14px; font-weight:900; color:#fff; margin-bottom:6px; }
.cta-mini .cta-mini-desc  { font-size:11px; color:rgba(255,255,255,0.6); line-height:1.7; margin-bottom:12px; }
.cta-mini .cta-mini-btn   { display:block; background:var(--red); color:#fff; font-size:13px; font-weight:700; padding:11px; border-radius:6px; }
.sidebar-rank-item { display:flex; gap:10px; align-items:flex-start; padding:8px 0; border-bottom:1px solid var(--bg); }
.sidebar-rank-item:last-child { border-bottom:none; }
.sidebar-rank-no { font-family:'Rajdhani',sans-serif; font-size:20px; font-weight:700; min-width:20px; line-height:1.2; }
.sidebar-rank-title { font-size:12px; color:var(--text-h); line-height:1.6; font-weight:500; }

/* ========== FOOTER ========== */
#site-footer { background:var(--navy-deep); padding:28px 16px 40px; margin-top:12px; }
.footer-inner { max-width:1140px; margin:0 auto; }
.footer-logo { font-size:18px; font-weight:900; color:#fff; margin-bottom:6px; }
.footer-logo em { font-style:normal; color:#ff8888; }
.footer-desc { font-size:11px; color:rgba(255,255,255,0.45); line-height:1.8; margin-bottom:20px; }
.footer-links { display:grid; grid-template-columns:repeat(2,1fr); gap:6px 16px; margin-bottom:20px; }
.footer-links a { font-size:12px; color:rgba(255,255,255,0.5); padding:3px 0; }
.footer-links a:hover { color:#fff; }
.footer-copy { font-size:10px; color:rgba(255,255,255,0.25); text-align:center; padding-top:16px; border-top:1px solid rgba(255,255,255,0.08); }

/* ========== 会員ゲート ========== */
.member-gate { position:relative; margin:0 0 28px; }
.member-gate-blur { height:160px; background:linear-gradient(to bottom,transparent 0%,var(--bg) 85%); pointer-events:none; }
.member-gate-box { background:var(--white); border:2px solid var(--navy); border-radius:14px; padding:30px 24px; text-align:center; box-shadow:0 4px 24px rgba(36,81,163,0.12); }
.member-gate-icon { font-size:38px; display:block; margin-bottom:12px; }
.member-gate-title { font-size:18px; font-weight:900; color:var(--text-h); margin-bottom:10px; }
.member-gate-desc { font-size:13px; color:var(--text-sub); line-height:1.9; margin-bottom:22px; }
.member-gate-btns { display:flex; flex-direction:column; gap:10px; margin-bottom:14px; }
.member-gate-btn-main { display:block; background:var(--red); color:#fff; font-size:15px; font-weight:700; padding:14px; border-radius:8px; letter-spacing:0.5px; transition:opacity .15s; }
.member-gate-btn-main:hover { opacity:.88; }
.member-gate-btn-sub { display:block; background:var(--white); color:var(--navy); font-size:13px; font-weight:700; padding:11px; border-radius:8px; border:2px solid var(--navy); transition:background .15s; }
.member-gate-btn-sub:hover { background:var(--navy-pale); }
.member-gate-note { font-size:11px; color:var(--text-muted); }

/* ========== 認証ページ ========== */
.auth-wrap { max-width:480px; margin:32px auto; padding:0 16px 48px; }
.auth-tabs { display:flex; border:1px solid var(--border); border-radius:8px 8px 0 0; overflow:hidden; }
.auth-tab { flex:1; padding:13px; text-align:center; font-size:14px; font-weight:700; color:var(--text-sub); background:var(--bg); border-bottom:1px solid var(--border); text-decoration:none; display:block; transition:color .15s; }
.auth-tab.active { background:var(--white); color:var(--navy); border-bottom:1px solid var(--white); }
.auth-panel { background:var(--white); border:1px solid var(--border); border-top:none; border-radius:0 0 10px 10px; padding:28px 24px; }
.auth-title { font-size:17px; font-weight:900; color:var(--text-h); margin-bottom:22px; text-align:center; }
.auth-field { margin-bottom:16px; }
.auth-field label { display:block; font-size:12px; font-weight:700; color:var(--text-sub); margin-bottom:6px; }
.auth-field input[type="text"],
.auth-field input[type="email"],
.auth-field input[type="password"] { width:100%; padding:11px 14px; border:1px solid var(--border); border-radius:6px; font-size:14px; color:var(--text-h); background:var(--bg); font-family:inherit; }
.auth-field input:focus { outline:none; border-color:var(--navy-light); background:var(--white); }
.auth-submit { width:100%; padding:13px; background:var(--navy); color:#fff; font-size:15px; font-weight:700; border:none; border-radius:8px; cursor:pointer; letter-spacing:0.5px; font-family:inherit; transition:background .15s; }
.auth-submit:hover { background:var(--navy-light); }
.auth-errors { background:var(--red-pale); border:1px solid var(--red); border-radius:6px; padding:12px 14px; margin-bottom:16px; list-style:none; }
.auth-errors li { font-size:12px; color:var(--red); padding:2px 0; }
.auth-errors li::before { content:'✗ '; }
.auth-note { font-size:11px; color:var(--text-muted); text-align:center; margin-top:16px; line-height:1.8; }
.auth-note a { color:var(--navy-light); }
/* wp_login_form override */
.auth-panel #loginform p { margin-bottom:14px; }
.auth-panel #loginform label { display:block; font-size:12px; font-weight:700; color:var(--text-sub); margin-bottom:6px; }
.auth-panel #loginform input[type="text"],
.auth-panel #loginform input[type="password"] { width:100%; padding:11px 14px; border:1px solid var(--border); border-radius:6px; font-size:14px; color:var(--text-h); background:var(--bg); font-family:inherit; box-sizing:border-box; }
.auth-panel #loginform input[type="submit"] { width:100%; padding:13px; background:var(--navy); color:#fff; font-size:15px; font-weight:700; border:none; border-radius:8px; cursor:pointer; font-family:inherit; }
.auth-panel .login-remember label { font-size:12px; color:var(--text-muted); font-weight:400; }

/* ========== PC対応 ========== */
@media(min-width:768px){
  .hamburger { display:none; }
  .pc-nav { display:flex; }
  .header-inner { height:64px; }
  .cat-nav-inner { padding:0 24px; width:auto; }
  .hero { padding:48px 24px; }
  .hero h1 { font-size:32px; }
  .hero::before { font-size:200px; right:40px; bottom:-30px; }
  .wrap { padding:0 24px; }
  .section { padding:24px 0; }
  .cta-wrap { padding:0; }
  .ad-bar { padding:10px 24px; }
  .breadcrumb { padding:10px 24px; }
  /* PC2カラム */
  .pc-2col { display:grid; grid-template-columns:1fr 300px; gap:32px; align-items:start; }
  .sidebar-pc { display:block; }
  /* PC記事ページ */
  .page-wrap { padding:28px 24px; display:grid; grid-template-columns:1fr 300px; gap:36px; align-items:start; }
  .main-col { min-width:0; }
  .art-title-h1 { font-size:24px; }
  .ec-title { font-size:18px; }
  .ad-in-article { margin-left:0; margin-right:0; border-radius:8px; }
  /* PC Featured Grid */
  .featured-scroll { overflow:visible; margin:0; padding:0; }
  .featured-track { display:grid; grid-template-columns:1.5fr 1fr 1fr; width:auto; padding:0; gap:16px; }
  .feat-card { width:auto; }
  .cat-grid { grid-template-columns:repeat(4,1fr); }
  .footer-links { grid-template-columns:repeat(4,1fr); }
}
