@charset "UTF-8";
/* =====================================================================
   sitev2/css/about.css ── /about/（資格について）。about-mock の CSS を移植
   ===================================================================== */
body{line-height:1.85}
.page-about{--maxw:920px}
.page-about header.site,.page-about footer.site{--maxw:1080px}
section{padding-block:52px}
h2{color:var(--navy);font-weight:900;font-size:clamp(20px,3vw,25px);text-wrap:balance;border-left:6px solid var(--yellow);padding-left:14px}
p.body{margin-top:14px;max-width:760px}
@media(max-width:480px){.hero .spbr{display:inline}}
@media(max-width:820px){.gcard .spbr{display:inline}}
@media(max-width:640px){.feewrap .spbr{display:inline}}

/* ページヒーロー */
.hero{background:var(--navy);color:#fff;padding-block:46px;text-align:center}
.hero .bc{font-size:11.5px;color:#9FB0CC}
.hero .bc a:hover{text-decoration:underline}
.hero h1{font-size:clamp(23px,4vw,32px);font-weight:900;margin-top:10px}

/* 目次 */
.toc{background:var(--paper);padding-block:22px;border-bottom:1px solid var(--line)}
.toc ul{display:grid;grid-template-columns:repeat(6,1fr);gap:10px 16px;list-style:none;max-width:1080px;margin:0 auto;padding-inline:20px;font-size:13px;font-weight:700;text-align:center}
.toc li{display:flex;justify-content:center;align-items:center}
.toc a{color:var(--navy);border-bottom:2px solid var(--yellow);padding-bottom:1px}
@media(max-width:820px){.toc ul{grid-template-columns:repeat(3,1fr)}}
@media(max-width:560px){.toc ul{grid-template-columns:repeat(2,1fr)}}

/* 概要 */
.lead-wrap{display:grid;grid-template-columns:1fr 300px;gap:30px;align-items:start;margin-top:20px}
.lead-wrap.noimg{grid-template-columns:1fr}
.lead-wrap .pic img,.text-wrap .pic img{display:block;width:100%;height:auto;border-radius:8px}
@media(max-width:640px){.lead-wrap .pic img{max-width:70%;margin-inline:auto}}
@media(max-width:820px){.lead-wrap{grid-template-columns:1fr}}

.bg-sec{background:var(--paper)}

/* 運営体制図 */
.orgchart{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:26px}
.oc{border:2px solid var(--navy);border-radius:10px;padding:20px 16px;text-align:center;background:var(--white)}
.oc .role{display:inline-block;background:var(--navy);color:var(--yellow);font-size:11px;font-weight:900;border-radius:999px;padding:3px 14px}
.oc .nm{font-weight:900;color:var(--navy);font-size:14.5px;margin-top:12px;line-height:1.5}
.oc .ds{font-size:12px;color:var(--sub);margin-top:8px}
/* 3社ロゴ（Figma 1837:44 / 1839:37）: 枠=Figma実寸（--lw×--lh）・画像は2倍解像度を縮小して枠内に収める（歪ませない） */
.oc .logo{width:var(--lw);max-width:100%;height:var(--lh);margin:10px auto 0;display:flex;align-items:center;justify-content:center}
.oc .logo img{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain}
.oc .logo + .ds{margin-top:10px}
@media(max-width:820px){.orgchart{grid-template-columns:1fr}}

/* 制度の詳細 */
.grades{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:24px}
.gcard{border:2px solid var(--navy);border-radius:12px;overflow:hidden;background:var(--white)}
.gcard .gh{background:var(--navy);color:#fff;padding:12px 18px;font-weight:900;display:flex;justify-content:space-between;align-items:baseline}
.gcard .gh small{font-weight:500;font-size:11.5px;color:#C9D2E4}
.gcard dl{padding:6px 18px 16px;font-size:13.5px}
.gcard dt{font-weight:900;color:var(--navy);margin-top:12px;font-size:12.5px}
.gcard dd{margin-top:2px}
@media(max-width:820px){.grades{grid-template-columns:1fr}}
.feewrap{margin-top:18px;border:1px solid var(--line);border-radius:10px;overflow:hidden;overflow-x:auto;-webkit-overflow-scrolling:touch}
.feewrap table{width:100%;border-collapse:collapse;font-size:13.5px;min-width:560px}
.feewrap th,.feewrap td{border-top:1px solid var(--line);padding:11px 14px;text-align:left}
.feewrap thead th{background:var(--navy);color:#fff;border-top:0;font-size:12.5px}
.feewrap td.n{font-variant-numeric:tabular-nums;font-weight:700;color:var(--navy)}
/* 費用セル（Figma about 1838:42 / 1840:41）: PC=1行「税別　税込」（全角スペース区切り）/ SP=税別で改行して税込 */
.feewrap th,.feewrap td{line-height:20px;vertical-align:top}
.feewrap td.n .fee-ex{font-size:17px}
.feewrap td.n .fee-tax{font-size:13.5px}
.feewrap td.n .fee-in{font-size:11px}
@media(max-width:640px){
  .feewrap table{min-width:0;table-layout:fixed;font-size:11.5px}
  .feewrap th,.feewrap td{padding:10px;line-height:17px}
  .feewrap thead th{font-size:11.5px;text-align:center}
  .feewrap td.n .fee-ex{font-size:13px}
  .feewrap td.n .fee-tax{font-size:10px}
  .feewrap td.n .fee-sep{display:none}
  .feewrap td.n .fee-in{display:block;font-size:9px}
}
/* 1級の試験内容（Figma 1838:25 / 1840:24）。<一次><二次> は山括弧ごと表示 */
.gcard dd.exam1{font-size:13px;line-height:21px}
/* PC/SP の出し分け（制度カードが縦積みになる 820px 以下を SP 扱い）*/
.sp-only{display:none}
@media(max-width:820px){
  .pc-only{display:none}
  .sp-only{display:inline}
  .oc .pcbr{display:none}
}
.nt{font-size:12px;color:var(--sub);margin-top:10px}
.nt a{text-decoration:underline;font-weight:700}

/* 出題範囲・学習内容 */
.text-wrap{display:grid;grid-template-columns:300px 1fr;gap:30px;align-items:start;margin-top:20px}
.text-wrap.noimg{grid-template-columns:1fr}
@media(max-width:820px){.text-wrap{grid-template-columns:1fr}}
.pdfs{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
.pdfs a{display:inline-flex;align-items:center;gap:8px;border:2px solid var(--navy);color:var(--navy);font-weight:700;font-size:13px;border-radius:999px;padding:9px 20px}
.houjin-note{margin-top:24px;background:#FFF6D6;border:1.5px solid #E5C988;border-radius:10px;padding:14px 18px;font-size:13.5px}
.houjin-note b{color:var(--navy)}
.houjin-note a{color:var(--navy);text-decoration:underline;font-weight:700}

/* メリット */
.merits{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:24px}
.mt{background:var(--white);border:1px solid var(--line);border-top:5px solid var(--yellow);border-radius:10px;padding:20px 18px}
.mt b{display:block;color:var(--navy);font-size:14.5px;line-height:1.55}
.mt p{font-size:12.5px;color:var(--sub);margin-top:10px}
.mt img{display:block;width:100%;height:auto;margin-top:12px;border-radius:8px}
@media(max-width:820px){.merits{grid-template-columns:1fr}}

/* よくある質問（抜粋）*/
.faqx details{border:1px solid var(--line);border-radius:10px;margin-top:10px;background:var(--white)}
.faqx summary{list-style:none;cursor:pointer;padding:14px 18px;font-weight:700;color:var(--navy);font-size:14px}
.faqx summary::-webkit-details-marker{display:none}
.faqx summary::before{content:"Q. "}
.faqx .a{padding:0 18px 16px;font-size:13.5px;border-top:1px dashed var(--line);padding-top:12px}
.faqx .more{display:inline-block;margin-top:18px;color:var(--navy);font-weight:700;border-bottom:2px solid var(--yellow);font-size:14px}

/* CTA */
.cta-sec{background:var(--paper);text-align:center}
.cta-sec h2{border:0;padding:0;text-align:center}
.cta-sec .btns{display:flex;justify-content:center;gap:14px;flex-wrap:wrap;margin-top:24px}
.cta-sec .btns a{display:inline-block;border-radius:999px;padding:14px 38px;font-weight:700;font-size:15px}
.cta-g{background:var(--white);border:2px solid var(--navy);color:var(--navy)}
.cta-a{background:var(--red);color:#fff;box-shadow:0 3px 10px rgba(181,24,9,.3)}