/* よくあるご質問（/guide/qa/） — loaded after style / cases / company.css */
.pg-qa .qa-sec{scroll-margin-top:100px}

/* hero：見出し＋検索、下にカテゴリのタイル */
.qa-hero{padding-bottom:clamp(56px,7vw,96px)}
.qa-top{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:end;margin-top:44px;position:relative}
.qa-top .disp{font-size:clamp(64px,9vw,150px);color:#fff;margin-top:20px}
.qa-top h1{font-size:clamp(22px,2vw,30px);color:#fff;margin-top:20px}
.qa-top h1 small{display:block;font-size:13px;color:var(--mut);font-family:var(--ff);font-weight:500;margin-top:6px}
.qa-find{border:1px solid var(--line);border-radius:26px;background:var(--ink2);padding:26px 26px 22px}
.qa-find label{font-family:var(--ff-h);font-weight:700;font-size:15px;color:#fff}
.qa-find .in{display:flex;align-items:center;gap:10px;margin-top:12px;background:#fff;border-radius:999px;padding:6px 8px 6px 18px}
.qa-find .in svg{width:20px;height:20px;color:var(--mut-d);flex:0 0 20px}
.qa-find input{flex:1;min-width:0;border:0;outline:0;background:none;font:inherit;font-size:16px;color:var(--ink);padding:10px 0}
.qa-find input::-webkit-search-cancel-button{display:none}
.qa-find .in:focus-within{box-shadow:0 0 0 3px var(--amb)}
.qa-find #qaClr{border:0;background:var(--paper);color:var(--ink);font:inherit;font-size:12px;font-weight:700;padding:8px 14px;border-radius:999px;cursor:pointer}
.qa-find .hint{font-size:12.5px;color:var(--mut);margin-top:10px}
.qa-find .pop{font-size:12px;color:var(--mut);margin-top:12px;display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.qa-find .pop button{border:1px solid var(--line);background:var(--ink3);color:#e4e8e5;font:inherit;font-size:12px;font-weight:700;padding:4px 12px;border-radius:999px;cursor:pointer;transition:.2s}
.qa-find .pop button:hover{background:var(--amb);border-color:var(--amb);color:var(--ink)}
.qa-cats{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-top:48px}
.qa-cats a{position:relative;display:flex;flex-direction:column;gap:4px;padding:18px 18px 16px;border:1px solid var(--line);border-radius:18px;background:var(--ink2);transition:.25s}
.qa-cats .no{font-family:var(--ff-d);font-weight:800;font-size:13px;color:var(--amb)}
.qa-cats small{font-family:var(--ff-d);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--mut);margin-top:6px}
.qa-cats b{font-size:14.5px;color:#fff;line-height:1.45}
.qa-cats em{position:absolute;top:16px;right:16px;font-style:normal;font-size:11.5px;font-weight:700;color:var(--mut)}
.qa-cats a:hover{border-color:var(--amb);transform:translateY(-3px)}

/* 本文 */
.qa-g{display:grid;grid-template-columns:260px 1fr;gap:56px;align-items:start}
.qa-side{position:sticky;top:110px}
.qa-side .lb{font-family:var(--ff-d);font-weight:700;font-size:11px;letter-spacing:.22em;color:var(--grn)}
.qa-side ol{margin-top:12px;border-top:1px solid var(--line-d)}
.qa-side li a{display:grid;grid-template-columns:28px 1fr auto;gap:8px;align-items:center;padding:13px 4px;border-bottom:1px solid var(--line-d);font-size:13.5px;font-weight:700;color:var(--mut-d);transition:.2s}
.qa-side li a span{font-family:var(--ff-d);font-size:12px;color:var(--mut-d)}
.qa-side li a em{font-style:normal;font-family:var(--ff-d);font-size:11px;background:#fff;border:1px solid var(--line-d);border-radius:999px;padding:0 8px;color:var(--mut-d)}
.qa-side li a:hover,.qa-side li a.on{color:var(--ink)}
.qa-side li a.on span{color:var(--grn)}
.qa-side li a.on em{background:var(--ink);color:var(--amb);border-color:var(--ink)}
.qa-ask{margin-top:24px;background:var(--ink);border-radius:20px;padding:20px;color:#fff}
.qa-ask p{font-size:12.5px;color:var(--mut)}
.qa-ask .bt{margin-top:10px;width:100%;justify-content:space-between;padding:14px 18px}
.qa-ask .tl{display:block;margin-top:14px}
.qa-ask .tl b{display:block;font-family:var(--ff-d);font-size:22px;font-weight:800}
.qa-ask .tl span{font-size:11.5px;color:var(--mut)}

.qa-sec + .qa-sec{margin-top:64px}
.qa-sec .qh{display:flex;align-items:center;gap:16px;padding-bottom:18px;border-bottom:2px solid var(--ink)}
.qa-sec .qh .no{font-family:var(--ff-d);font-weight:800;font-stretch:115%;font-size:40px;line-height:1;color:var(--amb)}
.qa-sec .qh .en{font-family:var(--ff-d);font-weight:700;font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--grn)}
.qa-sec .qh h2{font-size:clamp(20px,1.8vw,26px);color:var(--ink);margin-top:2px}
.qa-sec .qh em{margin-left:auto;font-style:normal;font-size:12px;font-weight:700;color:var(--mut-d)}
.qa-list details{background:#fff;border:1px solid var(--line-d);border-radius:16px;margin-top:10px;transition:border-color .2s}
.qa-list details[open]{border-color:var(--ink)}
.qa-list summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:32px 1fr 28px;gap:12px;align-items:center;padding:18px 20px;font-family:var(--ff-h);font-weight:700;font-size:16px;line-height:1.55;color:var(--ink)}
.qa-list summary::-webkit-details-marker{display:none}
.qa-list summary::after{content:"";width:28px;height:28px;border-radius:50%;border:1px solid var(--line-d);background:linear-gradient(var(--ink),var(--ink)) center/11px 1.5px no-repeat,linear-gradient(var(--ink),var(--ink)) center/1.5px 11px no-repeat;transition:.3s var(--ease)}
.qa-list details[open] summary::after{transform:rotate(45deg);background-color:var(--amb);border-color:var(--amb)}
.qa-list .q{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--ink);color:var(--amb);font-family:var(--ff-d);font-weight:800;font-size:14px}
.qa-list .a{display:grid;grid-template-columns:32px 1fr;gap:12px;padding:0 20px 22px}
.qa-list .a .q{background:var(--amb);color:var(--ink)}
.qa-list .tx{font-size:14.5px;line-height:1.95;color:#3b4440}
.qa-list .tx p + p,.qa-list .tx p + ul,.qa-list .tx p + ol,.qa-list .tx ul + p,.qa-list .tx ol + p{margin-top:10px}
.qa-list .tx ul,.qa-list .tx ol{margin:8px 0 0;padding:14px 18px;background:var(--paper);border-radius:12px}
.qa-list .tx ul li{position:relative;padding-left:16px}
.qa-list .tx ul li::before{content:"";position:absolute;left:0;top:.85em;width:6px;height:6px;border-radius:50%;background:var(--grn)}
.qa-list .tx ol{counter-reset:o}
.qa-list .tx ol li{position:relative;padding-left:26px;counter-increment:o}
.qa-list .tx ol li + li{margin-top:6px}
.qa-list .tx ol li::before{content:counter(o);position:absolute;left:0;top:.3em;width:18px;height:18px;border-radius:50%;background:var(--ink);color:var(--amb);font-family:var(--ff-d);font-size:11px;font-weight:800;display:grid;place-items:center;line-height:1}
.qa-list .tx b{color:var(--ink);background:linear-gradient(transparent 62%,rgba(245,179,1,.35) 62%)}

.qa-none{margin-top:24px;background:#fff;border:1px dashed var(--line-d);border-radius:20px;padding:28px}
.qa-none .lb,.qa-help .lb{font-family:var(--ff-d);font-weight:700;font-size:11px;letter-spacing:.22em;color:var(--grn)}
.qa-none h3{font-size:20px;color:var(--ink);margin-top:6px}
.qa-none p:not(.lb){font-size:14px;color:var(--mut-d);margin:8px 0 18px}

.qa-help{margin-top:64px;background:var(--ink);color:#fff;border-radius:26px;padding:clamp(28px,4vw,44px)}
.qa-help .lb{color:var(--amb)}
.qa-help h3{font-size:clamp(20px,2vw,28px);margin-top:8px}
.qa-help > p:not(.lb){font-size:14px;color:#b9c2be;margin-top:12px;max-width:640px}
.qa-help .ways{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:24px}
.qa-help .ways a{display:flex;flex-direction:column;gap:4px;padding:18px;border:1px solid var(--line);border-radius:16px;background:var(--ink2);transition:.2s}
.qa-help .ways small{font-family:var(--ff-d);font-size:10.5px;letter-spacing:.18em;color:var(--mut)}
.qa-help .ways b{font-size:15px;color:#fff}
.qa-help .ways span{font-size:12px;color:var(--mut)}
.qa-help .ways a:hover{border-color:var(--amb)}
.qa-help .ways a.ln{background:#06c755;border-color:#06c755}
.qa-help .ways a.ln small,.qa-help .ways a.ln span{color:rgba(255,255,255,.85)}

@media (max-width:1180px){
  .qa-top{grid-template-columns:1fr;gap:32px}
  .qa-cats{grid-template-columns:repeat(3,1fr)}
  .qa-g{grid-template-columns:1fr;gap:0}
  .qa-side{display:none}
  .qa-help .ways{grid-template-columns:1fr 1fr}
}
@media (max-width:720px){
  .qa-cats{grid-template-columns:1fr 1fr}
  .qa-cats a:last-child{grid-column:1/3}
  .qa-list summary{grid-template-columns:28px 1fr 26px;gap:10px;padding:16px;font-size:15px}
  .qa-list .q{width:28px;height:28px;font-size:12px}
  .qa-list .a{grid-template-columns:28px 1fr;gap:10px;padding:0 16px 18px}
  .qa-sec .qh .no{font-size:32px}
  .qa-help .ways{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){ .qa-cats a{transition:none} .qa-cats a:hover{transform:none} }
