/* sc-top.css  便768（本質プランD-1 トップの引き算）
   index.php の中にあった <style> 12個を、出てくる順のままここへ移した。中身は変えていない。
   HTMLを軽くし、2回目からはブラウザのキャッシュで読む。 スクールコンパス編集部 */
/* ---- from index.php (no id) ---- */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
:root{
  --navy:#1a2a4a;--navy-light:#2d4a7a;
  --warm-white:#faf8f5;--warm-gray:#f0ece6;
  --text:#2c2c2c;--text-light:#666;
  --accent-green:#3a8c6e;--accent-orange:#d4853a;--accent-blue:#4a7fb5;
  --accent-purple:#7a6aad;--accent-teal:#3a8a9a;--accent-pink:#c4687a;--accent-gold:#c9a227;
  --shadow-sm:0 1px 3px rgba(0,0,0,0.08);--shadow-md:0 4px 12px rgba(0,0,0,0.08);--shadow-lg:0 8px 30px rgba(0,0,0,0.1);
  --radius:12px
}
body{font-family:'Noto Sans JP',sans-serif;color:var(--text);background:var(--warm-white);line-height:1.8;font-size:15px;-webkit-font-smoothing:antialiased}

/* HEADER */
.site-header{background:#fff;border-bottom:1px solid #e8e4de;position:sticky;top:0;z-index:100}
.header-inner{max-width:1100px;margin:0 auto;padding:12px 20px;display:flex;align-items:center;justify-content:space-between}
@media (min-width:769px){.header-inner{padding-right:140px}}
.site-logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--navy)}
.logo-img{width:40px;height:40px;border-radius:50%;object-fit:cover}
.logo-text{font-family:'Zen Maru Gothic',sans-serif;font-weight:700;font-size:20px}
.logo-sub{font-size:10px;color:var(--text-light);font-weight:400;display:block;margin-top:-2px}


.breadcrumb{max-width:1100px;margin:0 auto;padding:8px 20px;font-size:12px;color:var(--text-light)}
.breadcrumb a{color:var(--text-light);text-decoration:none}

/* ========== HERO（白基調・相談UI主役） ========== */
.hero{background:linear-gradient(180deg,#ffffff 0%,#f7f3ed 100%);color:var(--navy);padding:44px 20px 44px;position:relative;border-bottom:1px solid #ece7df}
.hero-inner{max-width:940px;margin:0 auto;position:relative;z-index:1;text-align:center}
.hero-badge{display:inline-block;background:#eaf5ef;border:1px solid #bfe3d0;color:#2d7a5c;padding:5px 14px;border-radius:20px;font-size:12px;font-weight:700;margin-bottom:16px;letter-spacing:0.04em}
.hero h1{font-family:'Zen Maru Gothic',sans-serif;font-size:29px;font-weight:700;line-height:1.55;margin-bottom:12px;letter-spacing:-0.01em;color:var(--navy)}
.hero h1 em{font-style:normal;color:var(--accent-green)}
.hero-sub{font-size:14.5px;color:var(--text-light);line-height:1.95;margin-bottom:26px}
.hero-sub strong{color:var(--navy)}
.hero-sub-short{display:none}
.role-strip{display:flex;gap:10px;justify-content:center;max-width:800px;margin:22px auto 0;flex-wrap:wrap}
.role-card{flex:1;min-width:240px;display:flex;gap:10px;align-items:flex-start;background:#fff;border:1px solid #e5dfd5;border-radius:12px;padding:12px 14px;text-align:left;box-shadow:var(--shadow-sm)}
.role-card .rc-icon{font-size:20px;flex-shrink:0;line-height:1.4}
.role-card .rc-body{font-size:12px;color:var(--text-light);line-height:1.7}
.role-card .rc-body strong{display:block;font-size:13px;color:var(--navy);margin-bottom:1px}
.pick-resume{display:none;background:#eaf5ef;border:1px solid #bfe3d0;border-radius:8px;padding:8px 12px;font-size:12px;font-weight:700;color:#2d7a5c;margin:0 0 12px;line-height:1.6}

/* ===== わが家ブロック（再訪者向け） ===== */
.myblock-section{display:none;max-width:1100px;margin:26px auto 0;padding:0 20px}
.myblock-head{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:6px;margin-bottom:10px}
.myblock-head h2{font-family:'Zen Maru Gothic',sans-serif;font-size:17px;font-weight:700;color:var(--navy)}
.myblock-head a{font-size:12px;font-weight:700;color:var(--accent-green);text-decoration:none}
.myblock-head a:hover{text-decoration:underline}
.myblock-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:10px}
.mb-card{display:none;background:#fff;border:1px solid #e5dfd5;border-radius:12px;padding:13px 15px;box-shadow:var(--shadow-sm)}
.mb-card .mb-title{font-size:12px;font-weight:800;color:var(--text-light);letter-spacing:0.04em;margin:0 0 8px}
.mb-card ul{list-style:none;margin:0;padding:0}
.mb-card li{margin:0 0 7px;line-height:1.55}
.mb-card li:last-child{margin-bottom:0}
.mb-card a{font-size:13px;font-weight:700;color:var(--navy);text-decoration:none;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mb-card a:hover{color:var(--accent-green)}
.mb-card .mb-more{font-size:11.5px;color:var(--accent-green);font-weight:700}
.mb-card .mb-line{font-size:13px;color:var(--text);line-height:1.7}
.mb-card .mb-line strong{color:#c2410c}

/* ===== 学年×悩み 2タップ起動UI ===== */
.pick-wrap{max-width:720px;margin:0 auto;background:#fff;border:1px solid #e5dfd5;border-radius:16px;padding:22px 22px 18px;box-shadow:var(--shadow-md);text-align:left}
.pick-label{font-size:12.5px;font-weight:800;color:var(--navy);margin:0 0 8px;letter-spacing:0.02em}
.pick-label .pick-step{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;background:var(--accent-green);color:#fff;border-radius:50%;font-size:11px;font-weight:800;margin-right:7px}
.pick-row{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:16px}
.pick-chip{background:#faf8f5;border:1.5px solid #e0dad0;color:var(--text);padding:10px 16px;border-radius:22px;font-size:13.5px;font-weight:600;cursor:pointer;font-family:inherit;transition:all 0.15s;line-height:1.3}
.pick-chip:hover{border-color:var(--accent-green);color:var(--accent-green)}
.pick-chip.sel{background:var(--navy);color:#fff;border-color:var(--navy)}
.pick-go{display:block;width:100%;background:var(--accent-green);color:#fff;border:none;border-radius:10px;padding:15px;font-size:15px;font-weight:800;cursor:pointer;font-family:inherit;transition:background 0.15s;margin-top:2px}
.pick-go:disabled{background:#cfd6d1;cursor:not-allowed}
.pick-go:hover:not(:disabled){background:#2d7a5c}
.pick-hint{margin:10px 0 0;font-size:12px;color:var(--text-light);line-height:1.7;text-align:center}

.hero-or{margin:26px auto 12px;max-width:720px;font-size:12.5px;color:var(--text-light);font-weight:700;display:flex;align-items:center;gap:12px}
.hero-or::before,.hero-or::after{content:'';flex:1;height:1px;background:#e0dad0}

/* 相談入力ボックス（白背景版） */
.ask-box{margin:0 auto;max-width:720px;background:#fff;border-radius:14px;padding:7px;box-shadow:var(--shadow-md);border:1.5px solid #e0dad0;display:flex;gap:0}
.ask-input{flex:1;padding:15px 18px;border:none;outline:none;font-size:15px;font-family:'Noto Sans JP',sans-serif;background:transparent;color:var(--text);border-radius:10px}
.ask-input::placeholder{color:#aaa;font-size:14px}
.ask-btn{padding:15px 28px;background:var(--accent-green);color:#fff;border:none;border-radius:10px;font-size:15px;font-weight:700;cursor:pointer;font-family:'Noto Sans JP',sans-serif;transition:background 0.2s;white-space:nowrap;display:flex;align-items:center;gap:6px}
.ask-btn:hover{background:#2d7a5c}
.ask-notice{margin:12px auto 0;max-width:720px;font-size:12px;color:var(--text-light);line-height:1.7}

/* サンプルプロンプトチップ（白背景版） */
.prompt-chips{margin-top:18px;display:flex;flex-wrap:wrap;justify-content:center;gap:8px;max-width:800px;margin-left:auto;margin-right:auto;align-items:center}
.prompt-chip{display:inline-block;background:#fff;border:1px solid #d8d2c8;color:var(--navy);padding:8px 15px;border-radius:24px;font-size:13px;text-decoration:none;font-weight:600;transition:all 0.2s}
.prompt-chip:hover{border-color:var(--accent-green);color:var(--accent-green);transform:translateY(-1px)}
.prompt-chip-label{font-size:11.5px;color:var(--text-light);margin-right:2px;font-weight:700}

/* ===== 結果サンプルカード ===== */
.sample-section{max-width:1100px;margin:38px auto 0;padding:0 20px}
.sample-head{text-align:center;margin-bottom:16px}
.sample-head h2{font-family:'Zen Maru Gothic',sans-serif;font-size:19px;font-weight:700;color:var(--navy)}
.sample-head p{font-size:12.5px;color:var(--text-light);margin-top:4px}
.sample-card{max-width:760px;margin:0 auto;background:#fff;border:1px solid #e8e4de;border-radius:16px;box-shadow:var(--shadow-md);overflow:hidden;text-align:left}
.sample-bar{background:var(--navy);color:#fff;padding:12px 20px;font-size:12.5px;font-weight:700;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:6px}
.sample-bar .sb-note{font-size:11px;font-weight:500;color:rgba(255,255,255,0.7)}
.sample-body{padding:20px 22px 16px;display:grid;gap:13px}
.sample-row{display:flex;gap:12px;align-items:flex-start}
.sample-tag{flex-shrink:0;font-size:11.5px;font-weight:800;border-radius:6px;padding:4px 10px;white-space:nowrap;margin-top:2px}
.sample-tag.do{background:#eaf5ef;color:#2d7a5c}
.sample-tag.dont{background:#fdf0ee;color:#b4544a}
.sample-tag.axis{background:#eef4fb;color:#2d5f9e}
.sample-tag.due{background:#fdf6e7;color:#9a6b12}
.sample-row p{font-size:13.5px;line-height:1.9;margin:0;color:var(--text)}
.sample-links{border-top:1px dashed #e8e4de;padding:14px 22px 16px;font-size:12.5px;color:var(--text-light);line-height:2}
.sample-links a{color:var(--accent-green);font-weight:700;text-decoration:none;border-bottom:1px dotted var(--accent-green)}
.sample-cta{text-align:center;margin-top:18px}
.sample-cta a{display:inline-block;background:var(--navy);color:#fff;font-size:14px;font-weight:800;text-decoration:none;border-radius:10px;padding:13px 26px;transition:background 0.15s}
.sample-cta a:hover{background:var(--navy-light)}

/* ===== 今読まれています ===== */
.popular-section{max-width:1100px;margin:46px auto 0;padding:0 20px}
.popular-head{text-align:center;margin-bottom:16px}
.popular-head h2{font-family:'Zen Maru Gothic',sans-serif;font-size:19px;font-weight:700;color:var(--navy)}
.popular-head p{font-size:12.5px;color:var(--text-light);margin-top:4px}
.popular-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.popular-card{background:#fff;border:1px solid #e8e4de;border-radius:12px;padding:16px 16px 13px;box-shadow:var(--shadow-sm);display:flex;flex-direction:column;transition:transform 0.2s,box-shadow 0.2s}
.popular-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-md)}
.pc-main{text-decoration:none;color:var(--text);flex:1;display:block}
.pc-kicker{font-size:10.5px;font-weight:800;color:var(--accent-orange);letter-spacing:0.06em}
.pc-title{font-size:14.5px;font-weight:700;color:var(--navy);margin:5px 0 6px;line-height:1.55}
.pc-desc{font-size:12px;color:var(--text-light);line-height:1.75}
.pc-refine{margin-top:12px;font-size:12px;font-weight:700;color:var(--accent-green);text-decoration:none;border-top:1px dashed #eee8e0;padding-top:10px;display:block}
.pc-refine:hover{text-decoration:underline}
@media (max-width:800px){.popular-grid{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.popular-grid{grid-template-columns:1fr}}

/* ===== Passport・MyCompass導線 ===== */
.passport-section{max-width:1100px;margin:46px auto 0;padding:0 20px}
.passport-card{background:linear-gradient(135deg,#1a2a4a 0%,#2d4a7a 100%);border-radius:16px;color:#fff;padding:28px 30px;display:flex;gap:22px;align-items:center;flex-wrap:wrap}
.pp-icon{font-size:40px;flex-shrink:0}
.pp-text{flex:1;min-width:240px}
.pp-text h2{font-family:'Zen Maru Gothic',sans-serif;font-size:17px;font-weight:700;margin-bottom:6px}
.pp-text p{font-size:12.5px;color:rgba(255,255,255,0.85);line-height:1.9;margin:0}
.pp-scenes{display:flex;flex-wrap:wrap;gap:7px;margin-top:10px}
.pp-scenes a{display:inline-block;font-size:12px;font-weight:700;color:#fff;text-decoration:none;background:rgba(255,255,255,0.12);border:1px solid rgba(255,255,255,0.35);border-radius:18px;padding:7px 13px;transition:background 0.15s}
.pp-scenes a:hover{background:rgba(255,255,255,0.25)}
.pp-actions{display:flex;flex-direction:column;gap:8px;flex-shrink:0}
.pp-actions a{display:block;text-align:center;text-decoration:none;font-size:13.5px;font-weight:800;border-radius:10px;padding:12px 22px;background:#fff;color:var(--navy);transition:opacity 0.15s;white-space:nowrap}
.pp-actions a.pp-sub{background:rgba(255,255,255,0.12);color:#fff;border:1px solid rgba(255,255,255,0.35);font-weight:700}
.pp-actions a:hover{opacity:0.88}
@media (max-width:700px){.passport-card{flex-direction:column;text-align:center;padding:24px 20px}.pp-actions{width:100%}.pp-actions a{white-space:normal}}

/* ===== 解決カード下の相談誘導 ===== */
.solve-consult-line{text-align:center;margin-top:16px;font-size:13px}
.solve-consult-line a{color:var(--accent-green);font-weight:800;text-decoration:none}
.solve-consult-line a:hover{text-decoration:underline}

/* ===== サイト内検索ボックス ===== */
.search-box{margin:0 auto;max-width:640px;background:#fff;border-radius:14px;padding:8px;box-shadow:0 12px 40px rgba(0,0,0,0.25);display:flex;gap:0;position:relative}
.search-input{flex:1;border:none;outline:none;padding:14px 18px;font-size:15px;color:var(--text);background:transparent;font-family:inherit}
.search-input::placeholder{color:#999}
.search-btn{background:var(--accent-blue);color:#fff;border:none;padding:0 22px;border-radius:10px;font-size:14px;font-weight:700;cursor:pointer;display:flex;align-items:center;gap:6px;transition:background 0.15s;font-family:inherit}
.search-btn:hover{background:#1d5fb8}
.search-notice{margin:16px auto 4px;max-width:640px;font-size:11.5px;color:rgba(255,255,255,0.75);line-height:1.7;text-align:center}
.search-notice strong{color:#fde68a}

/* ===== 検索結果リスト（検索窓直下に展開） ===== */
.search-results-wrap{max-width:680px;margin:14px auto 0;background:#fff;border-radius:14px;box-shadow:0 12px 40px rgba(0,0,0,0.25);overflow:hidden;display:none}
.search-results-wrap.open{display:block}
.search-results-meta{background:#faf8f5;padding:10px 18px;border-bottom:1px solid #e8e4de;font-size:12px;color:var(--text-light);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px}
.search-results-count{font-weight:700;color:var(--navy)}
.search-results-filters{display:flex;gap:5px;flex-wrap:wrap}
.search-filter-chip{font-size:11px;background:#fff;border:1px solid #e8e4de;color:var(--text-light);padding:3px 10px;border-radius:10px;cursor:pointer;transition:all 0.15s;font-family:inherit}
.search-filter-chip:hover{border-color:var(--accent-blue);color:var(--accent-blue)}
.search-filter-chip.active{background:var(--accent-blue);color:#fff;border-color:var(--accent-blue)}
.search-results-list{max-height:420px;overflow-y:auto;text-align:left}
.search-result-item{display:block;padding:13px 18px;border-bottom:1px solid #f0ece6;text-decoration:none;color:var(--text);transition:background 0.12s}
.search-result-item:last-child{border-bottom:none}
.search-result-item:hover{background:#f9f6f1}
.search-result-name{font-size:14px;font-weight:700;color:var(--navy);display:flex;align-items:center;gap:8px;margin-bottom:3px}
.search-result-cat{background:#eff6ff;color:#1e40af;font-size:10.5px;font-weight:700;padding:1.5px 8px;border-radius:4px;flex-shrink:0}
.search-result-desc{font-size:12px;color:var(--text-light);line-height:1.55}
.search-result-tags{margin-top:4px;display:flex;gap:5px;flex-wrap:wrap}
.search-result-tag{font-size:10.5px;color:#666;background:#faf8f5;padding:1px 7px;border-radius:8px}
.search-empty{padding:30px 18px;text-align:center;color:var(--text-light);font-size:13px;line-height:1.85}
.search-empty strong{display:block;color:var(--navy);margin-bottom:6px}
.search-empty a{color:var(--accent-blue);text-decoration:none;font-weight:700}
.search-loading{padding:28px;text-align:center;color:var(--text-light);font-size:13px}

/* ===== カテゴリ早見ショートカット（検索タブの下） ===== */
.search-shortcuts{max-width:680px;margin:16px auto 0;display:flex;flex-wrap:wrap;justify-content:center;gap:7px}
.search-shortcut{display:inline-flex;align-items:center;gap:5px;background:rgba(255,255,255,0.1);border:1px solid rgba(255,255,255,0.22);color:#fff;padding:6px 13px;border-radius:18px;font-size:12px;text-decoration:none;font-weight:500;transition:all 0.15s;cursor:pointer}
.search-shortcut:hover{background:rgba(255,255,255,0.2);transform:translateY(-1px)}
.search-shortcut-icon{font-size:13px}

@media(max-width:600px){
  .search-results-wrap{max-width:100%;border-radius:10px}
  .search-results-list{max-height:380px}
}

@media (max-width:600px){
  .hero{padding:24px 16px 30px}
  .hero-badge{font-size:11px;margin-bottom:12px}
  .hero h1{font-size:22px;line-height:1.6}
  .hero-sub{font-size:13px;line-height:1.8;margin-bottom:18px}
  .hero-sub-detail{display:none}
  .hero-sub-short{display:inline}
  .pick-wrap{padding:16px 14px 14px}
  .pick-chip{font-size:13px;padding:12px 14px}
  .quiz-choice{padding:14px 8px}
  .ask-box{flex-direction:column;padding:6px}
  .ask-input{padding:13px 14px;font-size:14px}
  .ask-btn{justify-content:center;padding:13px;font-size:14px;width:100%}
  .prompt-chip{font-size:12px;padding:7px 12px}
}

/* ========== 5カテゴリカード ========== */
.solve-section{max-width:1100px;margin:36px auto 0;padding:0 20px;position:relative;z-index:10}
.solve-title{font-family:'Zen Maru Gothic',sans-serif;font-size:18px;font-weight:700;color:var(--navy);margin:0 0 14px;text-align:center}
.solve-title small{display:block;font-size:12px;color:var(--text-light);font-weight:400;margin-top:4px}
.solve-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.solve-card{background:#fff;border-radius:var(--radius);padding:20px 16px;text-decoration:none;color:var(--text);box-shadow:var(--shadow-md);transition:transform 0.2s,box-shadow 0.2s;display:block;border-top:4px solid;position:relative}
.solve-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}
.solve-card-1{border-top-color:var(--accent-orange)}
.solve-card-2{border-top-color:var(--accent-purple)}
.solve-card-3{border-top-color:var(--accent-blue)}
.solve-card-4{border-top-color:var(--accent-teal)}
.solve-card-5{border-top-color:var(--accent-gold)}
.solve-icon{font-size:28px;display:block;margin-bottom:10px}
.solve-card h3{font-size:14px;font-weight:700;color:var(--navy);margin-bottom:6px;line-height:1.5}
.solve-card p{font-size:11.5px;color:var(--text-light);line-height:1.7}
.solve-cta{display:inline-block;margin-top:10px;font-size:11px;color:var(--accent-green);font-weight:700}
@media (max-width:900px){.solve-grid{grid-template-columns:repeat(2,1fr)}.solve-card-5{grid-column:1/-1}}
@media (max-width:480px){.solve-grid{grid-template-columns:1fr}.solve-card-5{grid-column:auto}}

/* ========== セクション共通 ========== */
.section{max-width:1100px;margin:0 auto;padding:48px 20px}
.section-title{font-family:'Zen Maru Gothic',sans-serif;font-size:20px;font-weight:700;color:var(--navy);margin-bottom:6px}
.section-sub{font-size:13px;color:var(--text-light);margin-bottom:22px}

/* LLMO定義段落 */
.llmo-definition-section{background:var(--warm-gray);padding:48px 20px}
.llmo-definition-inner{max-width:900px;margin:0 auto}
.llmo-definition{background:#fff;border-radius:var(--radius);padding:28px 32px;box-shadow:var(--shadow-sm);font-size:15px;line-height:2;color:var(--text)}
.llmo-definition strong{color:var(--navy);font-weight:700}
@media (max-width:600px){.llmo-definition{padding:22px 20px;font-size:14px}}

/* 数字で見るスクールコンパス */
.stats-section{max-width:1100px;margin:0 auto;padding:0 20px}
.stats-bar{display:flex;justify-content:space-around;gap:24px;flex-wrap:wrap;background:var(--navy);border-radius:var(--radius);padding:28px 24px;color:#fff}
.stat-item{text-align:center;text-decoration:none;color:#fff;flex:1;min-width:120px}
.stat-num{font-size:30px;font-weight:900;color:#7ec8a0;display:block;line-height:1.1;font-family:'Zen Maru Gothic',sans-serif}
.stat-label{font-size:11px;color:rgba(255,255,255,0.65);display:block;margin-top:4px}

/* 信頼ブロック */
.trust-section{background:var(--warm-gray);padding:44px 20px;margin-top:48px}
.trust-inner{max-width:900px;margin:0 auto;text-align:center}
.trust-inner h2{font-family:'Zen Maru Gothic',sans-serif;font-size:20px;color:var(--navy);margin-bottom:16px}
.trust-inner p{font-size:14px;line-height:2;color:var(--text);max-width:720px;margin:0 auto 12px}
.trust-inner strong{color:var(--navy)}
.trust-cta{display:inline-block;margin-top:14px;color:var(--accent-green);font-size:13px;font-weight:700;text-decoration:none}
.trust-cta:hover{text-decoration:underline}

/* 週刊小学生しんぶん */
.shinbun-section{max-width:1100px;margin:0 auto;padding:40px 20px 20px}
.shinbun-card{background:linear-gradient(135deg,#fff7ed 0%,#fff 100%);border-radius:14px;padding:24px 28px;border:1px solid #fed7aa;display:flex;align-items:center;gap:20px}
.shinbun-icon{font-size:42px;flex-shrink:0}
.shinbun-text{flex:1}
.shinbun-text h3{font-family:'Zen Maru Gothic',sans-serif;font-size:16px;color:var(--navy);margin-bottom:4px}
.shinbun-text p{font-size:12.5px;color:var(--text-light);line-height:1.7}
.shinbun-links{display:flex;flex-direction:column;gap:6px;flex-shrink:0}
.shinbun-link{padding:7px 16px;background:#fff;border:1px solid #fed7aa;border-radius:6px;text-decoration:none;color:var(--accent-orange);font-size:12px;font-weight:700;white-space:nowrap;text-align:center}
.shinbun-link:hover{background:#fff7ed}
@media (max-width:700px){.shinbun-card{flex-direction:column;text-align:center}.shinbun-links{flex-direction:row;justify-content:center;flex-wrap:wrap}}
.hon-section{max-width:1100px;margin:0 auto;padding:20px 20px}
.hon-card{background:linear-gradient(135deg,#f0fdf4 0%,#fff 100%);border-radius:14px;padding:24px 28px;border:1px solid #bbf7d0;display:flex;align-items:center;gap:20px}
.hon-icon{font-size:42px;flex-shrink:0}
.hon-text{flex:1}
.hon-text h3{font-family:'Zen Maru Gothic',sans-serif;font-size:16px;color:var(--navy);margin-bottom:4px}
.hon-text p{font-size:12.5px;color:var(--text-light);line-height:1.7}
.hon-links{display:flex;flex-direction:column;gap:6px;flex-shrink:0}
.hon-link{padding:7px 16px;background:#fff;border:1px solid #bbf7d0;border-radius:6px;text-decoration:none;color:var(--accent-green);font-size:12px;font-weight:700;white-space:nowrap;text-align:center}
.hon-link:hover{background:#f0fdf4}
.hon-link-main{background:var(--accent-green);color:#fff;border-color:var(--accent-green)}
@media (max-width:700px){.hon-card{flex-direction:column;text-align:center}.hon-links{flex-direction:row;justify-content:center;flex-wrap:wrap}}

/* SEOテキスト */
.seo-section{max-width:1100px;margin:0 auto;padding:32px 20px 48px}
.seo-section h2{font-family:'Zen Maru Gothic',sans-serif;font-size:18px;color:var(--navy);margin-bottom:14px;border-bottom:2px solid var(--accent-green);padding-bottom:8px;display:inline-block}
.seo-section h3{font-family:'Zen Maru Gothic',sans-serif;font-size:15px;color:var(--navy);margin:24px 0 8px}
.seo-section p{font-size:13.5px;line-height:2;color:var(--text);margin-bottom:10px}
.seo-section a{color:var(--accent-green);text-decoration:none;border-bottom:1px dotted var(--accent-green);font-weight:500}
.seo-section a:hover{border-bottom-style:solid}
.seo-section strong{color:var(--navy);font-weight:700}

/* FAQ */
.faq-section{background:var(--warm-gray);padding:48px 20px}
.faq-inner{max-width:900px;margin:0 auto}
.faq-inner h2{font-family:'Zen Maru Gothic',sans-serif;font-size:20px;color:var(--navy);margin-bottom:18px}
.faq-item{background:#fff;border:1px solid #e8e4de;border-radius:var(--radius);padding:18px 22px;margin-bottom:12px}
.faq-question{font-size:14.5px;font-weight:700;color:var(--navy);line-height:1.6;margin-bottom:8px}
.faq-question::before{content:'Q. ';color:var(--accent-green);font-weight:900}
.faq-answer{font-size:13.5px;color:var(--text);line-height:2}
.faq-answer a{color:var(--accent-green);font-weight:600;text-decoration:none;border-bottom:1px dotted var(--accent-green)}

/* FOOTER */
.site-footer{background:var(--navy);color:rgba(255,255,255,0.8);padding:40px 20px 22px}
.footer-inner{max-width:1100px;margin:0 auto}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:32px;margin-bottom:24px}
.footer-brand .logo-text{color:#fff;display:block;margin-bottom:8px}
.footer-brand p{font-size:12px;line-height:1.9}
.footer-col h4{font-size:13px;color:#7ec8a0;margin-bottom:10px;font-weight:700}
.footer-col a{display:block;color:rgba(255,255,255,0.75);text-decoration:none;font-size:12.5px;padding:4px 0;transition:color 0.2s}
.footer-col a:hover{color:#7ec8a0}
.footer-bottom{border-top:1px solid rgba(255,255,255,0.1);padding-top:16px;font-size:11px;text-align:center;color:rgba(255,255,255,0.5)}
@media (max-width:700px){.footer-grid{grid-template-columns:1fr 1fr;gap:24px}.footer-brand{grid-column:1/-1}}

/* ===== ヘッダー検索ボタン＆検索モーダル ===== */
.hd-search-btn{background:var(--warm-gray);border:1px solid #e0dad0;border-radius:18px;padding:6px 14px;font-size:13px;font-weight:700;color:var(--navy);cursor:pointer;font-family:inherit;transition:all 0.15s;white-space:nowrap}
.hd-search-btn:hover{border-color:var(--accent-green);color:var(--accent-green)}
.search-modal-overlay{display:none;position:fixed;inset:0;background:rgba(20,28,48,0.55);z-index:300}
.search-modal-overlay.open{display:block}
.search-modal{display:none;position:fixed;top:7vh;left:50%;transform:translateX(-50%);width:min(740px,94vw);max-height:84vh;overflow-y:auto;background:#fff;border-radius:16px;z-index:301;padding:18px 18px 20px;box-shadow:0 20px 60px rgba(0,0,0,0.3)}
.search-modal.open{display:block}
.sm-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.sm-head span{font-size:15px;font-weight:800;color:var(--navy);font-family:'Zen Maru Gothic',sans-serif}
.sm-close{background:none;border:none;font-size:18px;cursor:pointer;color:var(--text-light);padding:4px 8px;font-family:inherit}
.search-modal .search-box{box-shadow:none;border:1.5px solid var(--navy);max-width:100%}
.search-modal .search-shortcuts{max-width:100%;justify-content:flex-start;margin-top:12px}
.search-modal .search-shortcut{background:#faf8f5;border:1px solid #e0dad0;color:var(--navy)}
.search-modal .search-shortcut:hover{background:#f0ece6}
.search-modal .search-results-wrap{max-width:100%;box-shadow:none;border:1px solid #e8e4de}
.search-modal .search-notice{color:var(--text-light);max-width:100%;text-align:left}
.search-modal .search-notice strong{color:var(--accent-orange)}

/* ===== 毎日更新：今日の1問・今日のW杯 ===== */
.today-section{max-width:1100px;margin:26px auto 0;padding:0 20px}
.today-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(255px,1fr));gap:12px}
@media (max-width:760px){.today-grid{grid-template-columns:1fr}}
.today-card{background:#fff;border:1px solid #e8e4de;border-radius:16px;box-shadow:var(--shadow-md);overflow:hidden;display:flex;flex-direction:column}
.tc-head{display:flex;justify-content:space-between;align-items:center;padding:10px 16px;font-size:12.5px;font-weight:800;color:#fff}
.tc-head .tc-badge{font-size:10px;font-weight:800;background:rgba(255,255,255,0.22);border-radius:10px;padding:2px 9px;letter-spacing:0.06em}
.quiz-card .tc-head{background:linear-gradient(135deg,#ea580c,#c2410c)}
.tquiz-card .tc-head{background:linear-gradient(135deg,#2d7a5c,#1e5c44)}
.tquiz-card .quiz-choice:hover{border-color:#2d7a5c;color:#2d7a5c}
.tquiz-card .quiz-links .ql-main{background:#2d7a5c}
.tquiz-card .quiz-links .ql-sub{color:#1e5c44;border-color:#8fc7ae}
.tquiz-card .quiz-links .ql-replay{border-color:#2d7a5c}
.tquiz-q-city{font-family:'Zen Maru Gothic',sans-serif;font-size:30px;font-weight:800;color:var(--navy);text-align:center;line-height:1.4;margin:8px 0 6px}
.wc-card .tc-head{background:linear-gradient(135deg,#1a2a4a,#2d4a7a)}
.sc30-card .tc-head{background:linear-gradient(135deg,#0f766e,#115e59)}
.oyako-card .tc-head{background:linear-gradient(135deg,#65a30d,#4d7c0f)}
.tc-body{padding:16px 18px 18px;flex:1;display:flex;flex-direction:column}
.quiz-q{font-size:14.5px;font-weight:800;color:var(--navy);margin:0 0 4px}
.quiz-flag{font-size:56px;line-height:1.2;text-align:center;margin:6px 0 10px}
.quiz-hint{font-size:11.5px;color:var(--text-light);text-align:center;margin:0 0 12px}
.quiz-choices{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.quiz-choice{display:block;text-align:center;background:#faf8f5;border:1.5px solid #e0dad0;border-radius:10px;padding:12px 8px;font-size:13.5px;font-weight:700;color:var(--navy);text-decoration:none;transition:all 0.15s}
.quiz-choice:hover{border-color:#ea580c;color:#ea580c}
.quiz-result{text-align:center;margin:2px 0 10px}
.quiz-result .qr-mark{font-size:40px;font-weight:900;display:block;line-height:1.3}
.quiz-result .qr-mark.ok{color:#16a34a}
.quiz-result .qr-mark.ng{color:#dc2626}
.quiz-result .qr-text{font-size:14px;font-weight:800;color:var(--navy)}
.quiz-answer-line{font-size:13px;color:var(--text);text-align:center;margin:0 0 12px;line-height:1.8}
.quiz-links{display:flex;flex-direction:column;gap:8px;margin-top:auto}
.quiz-links a{display:block;text-align:center;border-radius:10px;padding:11px 10px;font-size:13px;font-weight:800;text-decoration:none;transition:opacity 0.15s}
.quiz-links a:hover{opacity:0.85}
.quiz-links .ql-main{background:#ea580c;color:#fff}
.quiz-links .ql-sub{background:#fff;color:#c2410c;border:1.5px solid #fdba74}
.quiz-links .ql-replay{border:2px solid #ea580c;font-weight:800}
.quiz-note{font-size:11.5px;color:var(--text-light);text-align:center;margin:10px 0 0}
.quiz-streak{display:none;text-align:center;background:#fff7ed;border:1px solid #fdba74;border-radius:10px;padding:8px 12px;margin:0 0 12px;font-size:13px;font-weight:800;color:#c2410c;line-height:1.6}
.quiz-streak .qs-best{display:block;font-size:10.5px;font-weight:600;color:#9a6b12}
.quiz-streak-q{display:none;text-align:center;font-size:11.5px;font-weight:800;color:#c2410c;margin:0 0 10px}
.bird-strip{display:none;align-items:center;gap:12px;background:linear-gradient(135deg,#fff,#f2f8f5);border:1.5px solid #cfe6da;border-radius:14px;padding:12px 16px;margin-bottom:12px;box-shadow:var(--shadow-sm)}
.bird-emoji{font-size:38px;line-height:1;flex-shrink:0}
.bird-king::before{content:'👑';font-size:16px;position:relative;top:-14px;left:12px;display:block;height:0}
.bird-body{flex:1;min-width:0}
.bird-title{font-size:14px;font-weight:800;color:var(--navy);margin:0}
.bird-title .bird-lv{font-size:11px;font-weight:700;color:#2d7a5c;background:#eaf5ef;border-radius:8px;padding:1px 7px;margin-left:4px}
.bird-title .bird-rename{font-size:10.5px;color:var(--text-light);text-decoration:none;margin-left:6px}
.bird-msg{font-size:12px;color:var(--text);margin:3px 0 0;line-height:1.6}
.bird-side{text-align:right;flex-shrink:0}
.bird-next{font-size:10.5px;color:var(--text-light);margin:0 0 6px}
.bird-quest-btn{background:#fff;border:1px solid #d8d2c8;border-radius:14px;padding:6px 12px;font-size:11.5px;font-weight:800;color:var(--navy);cursor:pointer;font-family:inherit}
.bird-quest-btn:hover{border-color:var(--accent-green);color:var(--accent-green)}
@media (max-width:600px){.bird-strip{flex-wrap:wrap}.bird-side{width:100%;text-align:left;display:flex;align-items:center;justify-content:space-between}}
.quest-panel{display:none;background:#fff;border:1px solid #e8e4de;border-radius:12px;padding:12px 16px;margin-bottom:12px;box-shadow:var(--shadow-sm)}
.quest-panel .qp-head{font-size:11.5px;font-weight:800;color:var(--text-light);margin:0 0 8px}
.quest-panel .qp-row{font-size:13px;line-height:2;color:var(--text)}
.quest-panel .qp-done{color:#2d7a5c;font-weight:700}
.quest-panel .qp-prog{font-size:11px;color:var(--text-light)}
.quest-cleared{display:none;background:#eaf5ef;border:1px solid #bfe3d0;border-radius:10px;padding:9px 14px;font-size:12.5px;font-weight:800;color:#2d7a5c;margin:0 0 12px;line-height:1.7}
.quiz-kira{display:none;text-align:center;font-size:13px;font-weight:900;color:#b45309;background:linear-gradient(135deg,#fff7d6,#ffe9a8);border:1px solid #f5c542;border-radius:10px;padding:8px 10px;margin:0 0 10px;animation:kiraPulse 1.2s ease-in-out 2}
@keyframes kiraPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.04)}}
.cp-kira{position:relative;filter:drop-shadow(0 0 3px #f5c542)}
.cp-kira::after{content:'✨';font-size:9px;position:absolute;top:-4px;right:-6px}
.quiz-rate{display:none;text-align:center;font-size:11.5px;font-weight:800;color:#2d5f9e;background:#eef4fb;border-radius:8px;padding:6px 10px;margin:0 0 10px;line-height:1.6}
.quiz-hee{background:#fffbe7;border:1px solid #fde68a;border-radius:10px;padding:11px 14px;font-size:13px;color:#7c5a10;line-height:1.85;margin:0 0 12px}
.quiz-hee .qh-tag{font-weight:900;color:#b45309;margin-right:4px}
.quiz-tomorrow{text-align:center;font-size:12px;font-weight:800;color:#7c3aed;margin:10px 0 0}
.col-line{margin-top:12px;padding-top:10px;border-top:1px dashed #eee8e0;font-size:12px;font-weight:800;color:var(--text-light);cursor:pointer;text-align:center;display:none}
.col-line:hover{color:var(--navy)}
.col-panel{display:none;margin-top:8px;background:#faf8f5;border:1px solid #eee8e0;border-radius:10px;padding:10px;text-align:center;line-height:2;font-size:15px;max-height:150px;overflow-y:auto}
.col-panel .cp-item{display:inline-block;margin:1px}
.col-panel .cp-pref{font-size:10.5px;font-weight:700;background:#fff;border:1px solid #d8efe4;color:#2d7a5c;border-radius:8px;padding:2px 6px}
.col-panel .cp-miss{opacity:0.3;filter:grayscale(1)}
.quiz-links .ql-share{background:#1a2a4a;color:#fff}
/* キーボード操作時のフォーカス可視化 */
.pick-chip:focus-visible,.pick-go:focus-visible,.ask-btn:focus-visible,.ask-input:focus-visible,
.quiz-choice:focus-visible,.hd-search-btn:focus-visible,.sm-close:focus-visible,
.prompt-chip:focus-visible,a:focus-visible,button:focus-visible{outline:3px solid #2d5f9e;outline-offset:2px}
.wc-count{text-align:center;margin:4px 0 10px}
.wc-count .wcc-num{font-family:'Zen Maru Gothic',sans-serif;font-size:44px;font-weight:800;color:var(--navy);line-height:1.2}
.wc-count .wcc-label{font-size:12.5px;font-weight:800;color:var(--text-light)}
.wc-text{font-size:12.5px;color:var(--text);line-height:1.85;margin:0 0 14px;text-align:center}
.wc-links{display:flex;flex-direction:column;gap:8px;margin-top:auto}
.wc-links a{display:block;text-align:center;border-radius:10px;padding:11px 10px;font-size:13px;font-weight:800;text-decoration:none;transition:opacity 0.15s}
.wc-links a:hover{opacity:0.85}
.wc-links .wl-main{background:var(--navy);color:#fff}
.wc-links .wl-sub{background:#fff;color:var(--navy);border:1.5px solid #cfd8e6}

/* ---- from index.php id="cau-position-fix" ---- */
/* IDを発行ボタンは下部右に固定(ヘッダー・ハンバーガーを妨害しない)。旧キャッシュJS対策 */
#compass-auth-ui{position:fixed !important;top:auto !important;left:auto !important;bottom:16px !important;right:14px !important;z-index:9980 !important;}
#compass-auth-ui .cau-btn{background:#1e2a4a !important;color:#fff !important;border:2.5px solid #fff !important;border-radius:999px !important;box-shadow:0 4px 14px rgba(30,42,74,.45) !important;padding:11px 20px !important;font-size:14px !important;font-weight:700 !important;}
#compass-auth-ui .cau-menu{top:auto !important;bottom:calc(100% + 8px) !important;}
body:has(#csSaveBar) #compass-auth-ui{bottom:128px !important;}
@media (max-width:480px){#compass-auth-ui{bottom:14px !important;right:10px !important;}
body:has(#csSaveBar) #compass-auth-ui{bottom:126px !important;}}

/* ---- from index.php (no id) ---- */
#scRet{display:none;max-width:1080px;margin:12px auto 0;padding:0 16px;}
.sc-ret #scRet{display:block;}
.sc-ret .sc-kyou-band{display:none !important;}
.sc-ret #myBlock{display:none !important;}
.scr-h{font-size:13px;font-weight:800;color:#0f766e;margin:0 0 6px;}
.scr-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
@media(min-width:760px){.scr-grid{grid-template-columns:repeat(4,1fr);}}
.scr-t{display:block;background:#fff;border:1.5px solid #99f6e4;border-radius:12px;padding:10px 12px;text-decoration:none;color:#0f172a;min-height:74px;}
.scr-t:hover{border-color:#0f766e;}
.scr-t b{display:block;font-size:15px;font-weight:900;color:#0f766e;margin-bottom:2px;}
.scr-t span{display:block;font-size:12.5px;line-height:1.6;color:#334155;}
.scr-t.first{border-color:#0f766e;background:#f0fdfa;}

/* ---- from index.php id="sc-nayami-css" ---- */
.scny{max-width:1080px;margin:26px auto 0;padding:0 16px;}
.scny-box{background:#fff;border:2px solid #bfdbfe;border-radius:16px;padding:18px 20px;}
.scny-h{font-size:20px;font-weight:900;color:#1d4ed8;margin:0 0 4px;}
.scny-s{font-size:14px;color:#475569;margin:0 0 14px;}
.scny-week{display:block;background:linear-gradient(135deg,#eff6ff 0%,#dbeafe 100%);border:2px solid #93c5fd;border-radius:12px;padding:13px 16px;margin:0 0 14px;text-decoration:none;color:#1e3a8a;}
.scny-week b{display:block;font-size:16.5px;font-weight:900;margin-bottom:3px;}
.scny-week span{font-size:14px;color:#334155;}
.scny-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:9px;}
.scny-grid a{display:block;background:#f8fafc;border:1px solid #cbd5e1;border-radius:11px;padding:11px 14px;text-decoration:none;color:#0f172a;font-size:14.5px;font-weight:700;line-height:1.65;}
.scny-grid a em{display:block;font-style:normal;font-size:12.5px;color:#64748b;font-weight:500;margin-top:2px;}
.scny-grid a:hover{background:#eff6ff;border-color:#93c5fd;}
@media(max-width:520px){.scny-box{padding:15px 14px;}}

/* ---- from index.php (no id) ---- */
.sc-now{max-width:1080px;margin:22px auto 0;padding:0 20px}
.sc-now-box{background:#fff;border:1px solid #e5dfd5;border-radius:16px;padding:18px 18px 14px;box-shadow:0 1px 3px rgba(0,0,0,.06)}
.sc-now h2{font-family:'Zen Maru Gothic',sans-serif;font-size:18px;font-weight:700;color:#1a2a4a;margin:0 0 4px}
.sc-now .sc-now-lead{font-size:13px;color:#666;line-height:1.85;margin:0 0 14px}
.sc-now-steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px}
.sc-now-step{display:block;background:#faf8f5;border:1px solid #ece7df;border-radius:12px;padding:12px 13px;text-decoration:none;color:#2c2c2c}
.sc-now-step:hover{background:#fff;border-color:#3a8c6e}
.sc-now-no{display:inline-block;font-size:11px;font-weight:900;color:#3a8c6e;letter-spacing:.08em;margin-bottom:3px}
.sc-now-t{display:block;font-size:14.5px;font-weight:900;color:#1a2a4a;line-height:1.5;margin-bottom:3px}
.sc-now-d{display:block;font-size:12px;color:#666;line-height:1.7}
.sc-now-foot{margin:12px 0 0;font-size:12.5px;color:#666;line-height:1.85}
.sc-now-foot a{color:#2d7a5c;font-weight:700}

/* ---- from index.php (no id) ---- */
.scwd{max-width:1100px;margin:18px auto 0;padding:0 20px;}
.scwd-in{background:linear-gradient(135deg,#eff6ff 0%,#f0fdfa 100%);border:1px solid #bfdbfe;border-radius:16px;padding:16px 18px;}
.scwd-h{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px;margin:0 0 4px;}
.scwd-h h2{font-size:17px;font-weight:900;color:#1e3a8a;margin:0;}
.scwd-h .scwd-when{font-size:12.5px;color:#475569;font-weight:700;}
.scwd-lead{font-size:13.5px;line-height:1.85;color:#334155;margin:0 0 10px;}
.scwd-pick{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 12px;}
.scwd-pick button{border:1.5px solid #93c5fd;background:#fff;color:#1e40af;font-weight:800;font-size:13px;border-radius:999px;padding:5px 13px;cursor:pointer;}
.scwd-pick button[aria-pressed="true"]{background:#1d4ed8;border-color:#1d4ed8;color:#fff;}
.scwd-list{display:grid;gap:8px;grid-template-columns:1fr;}
@media(min-width:720px){.scwd-list{grid-template-columns:1fr 1fr;}}
.scwd-item{display:flex;gap:10px;align-items:flex-start;background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:11px 13px;text-decoration:none;}
.scwd-item:hover{border-color:#60a5fa;}
.scwd-no{flex:0 0 auto;width:22px;height:22px;border-radius:50%;background:#1d4ed8;color:#fff;font-size:12px;font-weight:900;display:flex;align-items:center;justify-content:center;margin-top:2px;}
.scwd-t{font-size:14.5px;font-weight:800;color:#0f172a;line-height:1.6;display:block;}
.scwd-d{font-size:12.5px;color:#475569;line-height:1.7;display:block;margin-top:2px;}
.scwd-foot{margin:11px 0 0;font-size:12.5px;color:#475569;line-height:1.8;}
.scwd-foot a{color:#1d4ed8;font-weight:700;}

/* ---- from index.php (no id) ---- */
.sc-today-block{max-width:1100px;margin:18px auto 0;padding:0 20px;}
.sc-today-inner{background:linear-gradient(135deg,#fff7ed,#fffbeb);border:1px solid #fed7aa;border-radius:16px;padding:16px 18px;}
.sc-today-head{display:flex;align-items:center;gap:8px;margin:0 0 10px;}
.sc-today-head h2{font-size:17px;font-weight:900;color:#9a3412;margin:0;}
.sc-today-head span{font-size:12.5px;color:#a16207;}
.sc-today-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:10px;}
.sc-today-card{display:block;background:#fff;border:1px solid #fed7aa;border-radius:12px;padding:12px 14px;text-decoration:none;color:#1f2937;}
.sc-today-card:hover{border-color:#f97316;}
.sc-today-card b{display:block;font-size:14.5px;font-weight:900;color:#9a3412;margin-bottom:4px;}
.sc-today-card small{display:block;font-size:12.5px;color:#57534e;line-height:1.65;}
.sc-today-sub{margin:10px 0 0;font-size:12.5px;color:#7c2d12;}
.sc-today-sub a{color:#9a3412;font-weight:700;}

/* ---- from index.php (no id) ---- */
/* / から移したCSS。#sc-compass で囲って既存に影響させない */
#sc-compass .section{ max-width: 1100px; margin: 0 auto; padding: 48px 20px; }
#sc-compass .section-title{ font-family: 'Zen Maru Gothic', sans-serif; font-size: 22px; font-weight: 700; color: var(--navy); margin-bottom: 6px; }
#sc-compass .section-sub{ font-size: 13px; color: var(--text-light); margin-bottom: 28px; }
#sc-compass .shindan-box{ max-width: 680px; margin: 0 auto; }
#sc-compass .shindan-progress{ display: flex; gap: 6px; margin-bottom: 28px; }
#sc-compass .shindan-progress .bar{ flex: 1; height: 5px; border-radius: 3px; background: #e5e7eb; transition: background 0.3s; }
#sc-compass .shindan-progress .bar.active{ background: var(--accent-orange); }
#sc-compass .shindan-q{ display: none; }
#sc-compass .shindan-q.active{ display: block; }
#sc-compass .shindan-q-label{ font-size: 12px; color: var(--accent-orange); font-weight: 700; margin-bottom: 6px; }
#sc-compass .shindan-q h3{ font-family: 'Zen Maru Gothic', sans-serif; font-size: 20px; font-weight: 700; color: var(--navy); margin-bottom: 18px; }
#sc-compass .shindan-options{ display: grid; gap: 10px; }
#sc-compass .shindan-opt{
  background: #fff; border: 2px solid #e5e7eb; border-radius: 10px;
  padding: 16px 20px; font-size: 15px; font-weight: 500;
  cursor: pointer; transition: border-color 0.2s, background 0.2s, transform 0.1s;
  text-align: left;
}
#sc-compass .shindan-opt:hover{ border-color: var(--accent-orange); background: #fffbeb; transform: translateX(4px); }
#sc-compass .shindan-result{ display: none; }
#sc-compass .shindan-result.active{ display: block; }
#sc-compass .result-header{ background: var(--navy); color: #fff; border-radius: var(--radius) var(--radius) 0 0; padding: 24px 28px; }
#sc-compass .result-header h3{ font-family: 'Zen Maru Gothic', sans-serif; font-size: 20px; margin-bottom: 4px; }
#sc-compass .result-header p{ font-size: 13px; color: rgba(255,255,255,0.75); }
#sc-compass .result-body{ background: #fff; border-radius: 0 0 var(--radius) var(--radius); padding: 28px; box-shadow: var(--shadow-md); }
#sc-compass .result-block{ margin-bottom: 20px; }
#sc-compass .result-block:last-child{ margin-bottom: 0; }
#sc-compass .result-block-title{ font-size: 13px; font-weight: 700; color: var(--accent-orange); margin-bottom: 8px; display: flex; align-items: center; gap: 6px; }
#sc-compass .result-articles{ display: grid; gap: 8px; }
#sc-compass .result-todo{ background: #fef2f2; border: 1px solid #fecaca; border-radius: 8px; padding: 14px 18px; font-size: 14px; font-weight: 500; color: #991b1b; }
#sc-compass .result-reason{ background: var(--warm-gray); border-radius: 8px; padding: 14px 18px; font-size: 13px; color: var(--text); line-height: 1.9; margin-top: 10px; }
#sc-compass .result-compare{ background: #fff; border: 1px solid #e8e4de; border-radius: 8px; padding: 16px 18px; font-size: 13px; line-height: 1.9; }
#sc-compass .result-compare-row{ display: flex; gap: 8px; padding: 6px 0; border-bottom: 1px solid #f0ece6; align-items: flex-start; }
#sc-compass .result-compare-row:last-child{ border-bottom: none; }
#sc-compass .result-compare-label{ font-weight: 700; color: var(--navy); white-space: nowrap; min-width: 90px; font-size: 12px; }
#sc-compass .result-compare-val{ color: var(--text-light); font-size: 13px; }
#sc-compass .result-judge{ background: #f0fdf4; border: 1px solid #bbf7d0; border-radius: 8px; padding: 14px 18px; font-size: 13px; line-height: 1.9; }
#sc-compass .result-judge strong{ color: #16a34a; }
#sc-compass .shindan-reset{ background: none; border: 1px solid #ccc; padding: 10px 20px; border-radius: 8px; font-size: 13px; cursor: pointer; margin-top: 16px; color: var(--text-light); }
#sc-compass .shindan-reset:hover{ background: var(--warm-gray); }
#sc-compass .grade-tab-section{ background: #fff; border-bottom: 1px solid #e8e4de; }
#sc-compass .grade-tabs{ display: flex; gap: 8px; margin-bottom: 24px; }
#sc-compass .grade-tab{
  flex: 1; padding: 14px 8px; border: 2px solid #e8e4de; border-radius: 10px;
  background: #fff; font-size: 14px; font-weight: 700; text-align: center;
  cursor: pointer; transition: all 0.2s; color: var(--text-light);
  font-family: 'Zen Maru Gothic', sans-serif;
}
#sc-compass .grade-tab:hover{ border-color: var(--navy-light); color: var(--navy); }
#sc-compass .grade-tab.active{ background: var(--navy); color: #fff; border-color: var(--navy); }
#sc-compass .grade-tab .tab-sub{ display: block; font-size: 11px; font-weight: 400; margin-top: 2px; opacity: 0.7; }
#sc-compass .grade-worry-panel{ display: none; }
#sc-compass .grade-worry-panel.active{ display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
#sc-compass .grade-worry-card{
  background: var(--warm-gray); border-radius: 10px; padding: 18px 20px;
  text-decoration: none; color: var(--text); transition: transform 0.2s, box-shadow 0.2s;
  display: block;
}
#sc-compass .grade-worry-card:hover{ transform: translateY(-2px); box-shadow: var(--shadow-md); }
#sc-compass .grade-worry-icon{ font-size: 22px; margin-bottom: 6px; display: block; }
#sc-compass .grade-worry-title{ font-size: 14px; font-weight: 700; margin-bottom: 4px; line-height: 1.5; }
#sc-compass .grade-worry-desc{ font-size: 12px; color: var(--text-light); line-height: 1.7; }
#sc-compass .grade-worry-status{ display: inline-block; font-size: 10px; font-weight: 700; margin-top: 6px; padding: 2px 8px; border-radius: 4px; }
#sc-compass .status-ready{ background: #dbeafe; color: #1e40af; }
#sc-compass .column-section .section-sub{ font-size: 13px; color: #666; margin-bottom: 20px; }
@media (max-width: 768px) {
#sc-compass .grade-worry-panel.active{ grid-template-columns: 1fr; }
#sc-compass .grade-tabs{ flex-wrap: wrap; }
#sc-compass .grade-tab{ font-size: 13px; padding: 10px 6px; }
}

/* ---- from index.php (no id) ---- */
.sc30-card .tc-body{display:flex;flex-direction:column;gap:10px}
      .sc30-row{display:flex;gap:8px;align-items:flex-start;font-size:13.5px;line-height:1.7}
      .sc30-tag{flex:0 0 auto;font-size:11px;font-weight:900;border-radius:999px;padding:2px 9px;margin-top:2px;white-space:nowrap}
      .sc30-tag.do{background:#eaf5ef;color:#2d7a5c;border:1px solid #bfe3d0}
      .sc30-tag.skip{background:#fdf1e7;color:#9a3412;border:1px solid #f3d5bd}
      .sc30-row a{color:inherit;text-decoration:underline;text-underline-offset:3px}
      .sc30-go{display:inline-block;margin-top:4px;font-size:12.5px;font-weight:800;color:#2d7a5c;text-decoration:none}
      .sc30-close{margin-top:auto;padding-top:10px;border-top:1px dashed #e8e4de;font-size:12.5px;color:#6b675f;display:flex;justify-content:space-between;align-items:center;gap:8px}
      .sc30-hee{flex:0 0 auto;font-size:11.5px;font-weight:800;background:#fff;border:1px solid #e8e4de;border-radius:999px;padding:4px 10px;cursor:pointer;color:#6b675f}
      .sc30-hee.done{background:#eaf5ef;border-color:#bfe3d0;color:#2d7a5c;cursor:default}
      .sc30-count{margin:6px 0 0;font-size:11.5px;color:#9b968c;text-align:right}

/* ---- from index.php (no id) ---- */
.oyk-emoji{font-size:34px;line-height:1;margin:2px 0 6px}
      .oyk-title{font-size:16.5px;font-weight:900;color:#1f4d3a;margin:0 0 2px}
      .oyk-sub{font-size:13px;color:#5c584e;margin:0 0 8px}
      .oyk-chips{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px}
      .oyk-chips span{background:#eaf5ef;border:1px solid #bfe3d0;color:#2d7a5c;border-radius:999px;padding:3px 10px;font-size:11.5px;font-weight:800}
      .oyk-main{display:inline-block;background:#2d7a5c;color:#fff;border-radius:999px;padding:9px 18px;font-size:13.5px;font-weight:900;text-decoration:none}
      .oyk-sublink{display:inline-block;margin-left:10px;font-size:12.5px;font-weight:800;color:#2d7a5c}
      .oyk-next{margin-top:10px;font-size:12px;color:#9b968c}

/* ---- from index.php (no id) ---- */
.tc-mod{max-width:1100px;margin:18px auto 0;padding:0 20px}
.tc{border-radius:18px;padding:20px 20px 18px;border:1px solid transparent}
.tc-kicker{font-size:11px;letter-spacing:.2em;font-weight:800;margin-bottom:2px}
.tc-title{font-size:17px;font-weight:900;margin-bottom:3px;line-height:1.6}
.tc-lead{font-size:13px;margin-bottom:12px}
.tc-main{display:block;text-decoration:none;border-radius:12px;padding:13px 18px;font-size:14.5px;font-weight:800;text-align:center;margin-bottom:10px}
.tc-chips{display:flex;flex-wrap:wrap;gap:8px}
.tc-chips a{font-size:12.5px;font-weight:700;border-radius:999px;padding:6px 13px;text-decoration:none;background:#fff}
.tc-one{font-size:11.5px;margin-top:9px}
.tc.asa{background:linear-gradient(150deg,#fefce8,#fef3c7);border-color:#fde68a}
.tc.asa .tc-kicker{color:#b45309}.tc.asa .tc-title{color:#78350f}.tc.asa .tc-lead{color:#92600e}
.tc.asa .tc-main{background:#d97706;color:#fff}
.tc.asa .tc-chips a{color:#b45309;border:1px solid #fcd34d}
.tc.asa .tc-one{color:#c9a44a}
.tc.hiru{background:linear-gradient(150deg,#f0f9ff,#e0f2fe);border-color:#bae6fd}
.tc.hiru .tc-kicker{color:#0369a1}.tc.hiru .tc-title{color:#0c4a6e}.tc.hiru .tc-lead{color:#0e7490}
.tc.hiru .tc-main{background:#0284c7;color:#fff}
.tc.hiru .tc-chips a{color:#0369a1;border:1px solid #7dd3fc}
.tc.hiru .tc-one{color:#7aa9c0}
.tc.yugata{background:linear-gradient(150deg,#fff7ed,#ffe4d5);border-color:#fdba74}
.tc.yugata .tc-kicker{color:#c2410c}.tc.yugata .tc-title{color:#7c2d12}.tc.yugata .tc-lead{color:#9a5a2b}
.tc.yugata .tc-main{background:#ea580c;color:#fff}
.tc.yugata .tc-chips a{color:#c2410c;border:1px solid #fdba74}
.tc.yugata .tc-one{color:#c9a08a}
.tc.yoru{background:#12151d;border-color:#2a3040}
.tc.yoru .tc-kicker{color:#8f96a8}.tc.yoru .tc-title{color:#f3efe6}.tc.yoru .tc-lead{color:#cfc9bc}
.tc.yoru .tc-main{background:#3d4a6b;color:#f3efe6}
.tc.yoru .tc-chips a{color:#a8c6b8;border:1px solid #2a3040;background:#1a1f2b}
.tc.yoru .tc-one{color:#5b6478}

/* ---- from index.php (no id) ---- */
.solve-answer{font-size:13.5px;line-height:1.85;color:#0f172a;background:#f8fafc;border-left:3px solid #94a3b8;padding:8px 10px;margin:6px 0 8px;border-radius:0 8px 8px 0;}
  .gw-wrap{max-width:960px;margin:26px auto 0;padding:20px 22px;background:#fff;border:1px solid #e2e8f0;border-radius:16px;}
  .gw-title{font-size:19px;margin:0 0 4px;color:#0f172a;}
  .gw-lead{font-size:13.5px;color:#64748b;margin:0 0 14px;}
  .gw-row{display:flex;align-items:center;gap:12px;padding:9px 0;border-bottom:1px dashed #e2e8f0;flex-wrap:wrap;}
  .gw-row:last-child{border-bottom:none;}
  .gw-label{font-weight:800;font-size:14.5px;min-width:230px;color:#0f172a;}
  .gw-links{display:flex;gap:8px;flex-wrap:wrap;}
  .gw-links a{display:inline-block;padding:5px 13px;border:1.5px solid #cbd5e1;border-radius:999px;font-size:13.5px;font-weight:700;color:#1d4ed8;text-decoration:none;background:#f8fafc;}
  .gw-links a:hover{border-color:#1d4ed8;background:#eff6ff;}
  .gw-all{margin:14px 0 0;font-size:14px;text-align:right;}
  @media(max-width:640px){.gw-label{min-width:100%;}}

/* 便892：共通ヘッダー（js/sc-header.js）が後から #sc-header に入り、下の全部が押し下がっていた。
   PageSpeed の実測（2026-08-30〜09-26）でトップのパソコン表示だけ CLS 0.24（不合格）。
   ヘッダーの高さぶんの場所を先に取っておく（高さは 2026-09-28 に画面幅ごとに測った値）。 */
#sc-header{min-height:67px;}
@media (min-width:981px){#sc-header{min-height:134px;}}
@media (min-width:1060px){#sc-header{min-height:96px;}}