/* AI値上げウォッチ /ai-price  2026-10-05
   このファイルと aiprice.js / aiprice-data.js を消せば、ページは元の表示に戻る。
   ★色・角丸・影・ヘッダーの作りは他のナビ（/ai-ryokin・/ai-kumiawase・/ai-tools）と同じ値にそろえてある。
     手本は本番の assets/css/airyokin.css と kumiawase.css。片方だけ変えない。
   ★色の決まり：上がった＝赤（--up）／下がった＝緑（--down）／為替と編集部の確認＝グレー（--fxc）。
     色で種類が分かるようにする。それ以外はモノクロ＋水色1色。
   ★クラス名は ap- で閉じてある（qs・none・n・ttl は共通のCSS・JSに横取りされるので使わない）。
   ★ボタンに当てるものは必ず .ap-root を前に付ける（下のリセットの詳細度 0,1,1 に負けるため）。 */

.ap-root{
  --sky:#1AC2F1; --sky-d:#0E9BC4; --ink:#0D1B2A; --ink2:#1C3549;
  --bg:#f5f7f9; --card:#fff; --txt:#12212e; --sub:#61707d; --line:#e6ebef;
  --soft:#eef3f7; --soft2:#e0e9f0;
  --up:#c8372d; --up-bg:#fbeae7; --down:#157a4c; --down-bg:#e6f4ee; --fxc:#66788a; --fx-bg:#eef1f4;
  --r:10px; --r2:6px; --rp:999px;
  --sh:0 1px 2px rgba(13,27,42,.05),0 6px 16px rgba(13,27,42,.06);
  --font:"Zen Kaku Gothic New","Hiragino Sans","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;
  background:var(--bg);color:var(--txt);font-family:var(--font);font-size:15px;line-height:1.75;
  letter-spacing:.01em;-webkit-font-smoothing:antialiased;
}
body.ai-aiprice-page{background:#f5f7f9}
/* ★ヘッダーはページ側のフォントを継がない。/ai-tools でロゴが太って枠からはみ出した（2026-09-14） */
body.ai-aiprice-page .ai-hd{font-family:var(--ai-jp,"Hiragino Sans",Meiryo,sans-serif);letter-spacing:0}
.ap-root *{box-sizing:border-box}
.ap-root .ap-wrap{max-width:1200px;margin:0 auto;padding:0 18px}
.ap-root button{cursor:pointer;border:0;background:none;font:inherit;color:inherit;font-family:inherit}
.ap-root input,.ap-root select{font:inherit;color:inherit}
/* リンクは押せると分かる見た目にする（色＋下線） */
.ap-root a{color:var(--sky-d);text-decoration:underline;text-underline-offset:2px}
.ap-root a:hover{color:#0a7a9c}
.ap-root h2{font-size:18px;font-weight:800;margin:0 0 10px;line-height:1.5;padding:0;background:none;border:0;color:var(--txt)}
.ap-root h3{font-size:14px;font-weight:800;margin:0 0 4px;line-height:1.55;padding:0;background:none;border:0;color:var(--txt)}
.ap-root .ap-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.ap-root .ap-up{color:var(--up)}
.ap-root .ap-down{color:var(--down)}
.ap-root .ap-fxc{color:var(--fxc)}
.ap-root .ap-flat{color:var(--txt)}

/* ===== ヘッダー（他のナビと同じ） ===== */
.ap-root .ap-hd{background:#fff;color:var(--txt);padding:24px 0 18px;position:relative;overflow:hidden}
.ap-root .ap-hd .ap-wrap{position:relative;z-index:2}
.ap-root .ap-hdtop{display:flex;align-items:flex-end;justify-content:space-between;gap:16px 36px;flex-wrap:wrap}
.ap-root .ap-hdl{min-width:0}
.ap-root .ap-hdfx{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:1}
.ap-root .ap-hdfx span{position:absolute;border-radius:50%;filter:blur(58px)}
.ap-root .ap-hdfx span:nth-child(1){width:420px;height:420px;left:-90px;top:-230px;background:#7aa8ff;opacity:.20;animation:apw1 19s ease-in-out infinite alternate}
.ap-root .ap-hdfx span:nth-child(2){width:360px;height:360px;right:2%;top:-200px;background:#2fd0f0;opacity:.20;animation:apw2 23s ease-in-out infinite alternate}
.ap-root .ap-hdfx span:nth-child(3){width:260px;height:260px;left:52%;bottom:-190px;background:#b78cff;opacity:.14;animation:apw1 27s ease-in-out infinite alternate-reverse}
@keyframes apw1{to{transform:translate(64px,30px) scale(1.14)}}
@keyframes apw2{to{transform:translate(-54px,22px) scale(1.1)}}
.ap-root .ap-ttl{font-size:46px;line-height:1.14;letter-spacing:-.01em;font-weight:900;margin:0 0 10px;padding:0;background:none;border:0}
.ap-root .ap-ttl .ap-tw{display:inline-block;transform:skewX(-9deg);transform-origin:left bottom;padding-right:.14em;
  background:linear-gradient(100deg,#2f5fe0 0%,#12c2e9 22%,#8b5be0 44%,#12c2e9 66%,#2f5fe0 88%,#12c2e9 100%);
  background-size:320% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:apflow 14s linear infinite}
@keyframes apflow{from{background-position:0 0}to{background-position:-320% 0}}
.ap-root .ap-lead{margin:0 0 6px;font-size:14px;color:var(--sub);max-width:760px;line-height:1.8}
.ap-root .ap-src{margin:0;font-size:12px;color:var(--sub)}
.ap-root .ap-src b{color:var(--txt);font-weight:700}
.ap-root .ap-kpi{display:flex;gap:12px;flex:none;padding-bottom:3px}
.ap-root .ap-kp{background:#fff;border:1px solid var(--line);border-radius:12px;padding:13px 18px;box-shadow:var(--sh);text-align:center;min-width:128px}
.ap-root .ap-kp .ap-n{display:block;font-size:30px;font-weight:900;line-height:1.1;color:var(--sky-d);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.ap-root .ap-kp .ap-n em{font-style:normal;font-size:13px;margin-left:2px}
.ap-root .ap-kp small{display:block;font-size:11px;color:var(--sub);margin-top:3px;line-height:1.5}

/* ===== よくある組み合わせ（他のナビの「よくある条件」と同じ帯） ===== */
.ap-root .ap-quick{background:#fff;box-shadow:0 1px 0 var(--line);position:sticky;top:0;z-index:40}
.ap-root .ap-quick .ap-wrap{display:flex;align-items:center;gap:12px;padding-top:10px;padding-bottom:10px;position:relative}
.ap-root .ap-quick .ap-wrap::after{content:"";position:absolute;right:18px;top:0;bottom:0;width:40px;pointer-events:none;background:linear-gradient(90deg,transparent,#fff)}
.ap-root .ap-ql{font-size:12px;color:var(--sub);white-space:nowrap;font-weight:700;flex:none}
.ap-root .ap-qlist{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding:1px 40px 1px 0;min-height:37px}
.ap-root .ap-qlist::-webkit-scrollbar{display:none}
.ap-root .ap-qp{background:var(--soft);color:#33475a;font-size:13px;padding:7px 14px;border-radius:var(--rp);white-space:nowrap;font-weight:500;transition:background .15s;flex:none}
.ap-root .ap-qp:hover{background:var(--soft2)}
.ap-root .ap-qp.ap-on{background:linear-gradient(96deg,#12b9e8,#3f8ae0);color:#fff;font-weight:700}

.ap-root .ap-body{padding:22px 18px 70px}

/* ===== 入力 ===== */
.ap-root .ap-in{background:var(--card);border-radius:12px;box-shadow:var(--sh);padding:18px 20px 20px}
.ap-root .ap-in__row{padding:14px 0;border-top:1px solid var(--line)}
.ap-root .ap-in__row:first-child{padding-top:0;border-top:0}
.ap-root .ap-in__row:last-child{padding-bottom:0}
.ap-root .ap-lb{display:flex;align-items:center;gap:8px;font-size:13.5px;font-weight:700;margin-bottom:10px;line-height:1.4}
.ap-root .ap-n1{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;flex:none;background:var(--ink);color:#fff;font-size:11.5px;font-weight:700;border-radius:3px}
.ap-root .ap-lbn{font-weight:500;color:var(--sub);font-size:11.5px}
/* 定番のタイル。開いた直後に ChatGPT・Gemini・Claude が目に入る位置に置く */
.ap-root .ap-tiles{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
.ap-root .ap-tile{display:flex;flex-direction:column;align-items:flex-start;gap:5px;text-align:left;background:#f4f7fa;border:1px solid transparent;
  border-radius:var(--r);padding:11px 12px 10px;position:relative;transition:background .12s,border-color .12s;min-height:74px}
.ap-root .ap-tile:hover{background:#eaf1f6}
.ap-root .ap-th{display:flex;align-items:center;gap:8px;min-width:0;width:100%}
.ap-root .ap-th b{font-size:14px;font-weight:800;line-height:1.3;min-width:0;overflow-wrap:break-word}
.ap-root .ap-lg{width:30px;height:30px;border-radius:7px;background:#fff;flex:none;object-fit:contain;display:inline-block}
.ap-root .ap-lgt{display:inline-flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;color:var(--sub);border:1px solid var(--line)}
.ap-root .ap-tp{font-size:11.5px;color:var(--sub);font-weight:700;line-height:1.4;font-variant-numeric:tabular-nums}
.ap-root .ap-tile.ap-on{background:#e8f8fe;border-color:var(--sky-d);box-shadow:inset 0 0 0 1px var(--sky-d)}
.ap-root .ap-tile.ap-on .ap-tp{color:#0a6c8a}
/* 選んだ印。右上の四角に ✓（入っていることを示す印） */
/* ★印は右下に置く。右上だと長い名前に重なる（スマホで Midjourney が2行に割れた・2026-10-05 実測） */
.ap-root .ap-tile::after{content:"";position:absolute;right:9px;bottom:9px;width:16px;height:16px;border-radius:3px;border:1px solid #c8d3dc;background:#fff}
.ap-root .ap-tile.ap-on::after{content:"✓";border-color:var(--sky-d);background:var(--sky-d);color:#fff;font-size:11px;font-weight:900;line-height:14px;text-align:center}
.ap-root .ap-tile .ap-tp{padding-right:22px}
/* 探す */
.ap-root .ap-find{position:relative;margin-top:12px;max-width:520px}
.ap-root .ap-find input{width:100%;padding:10px 14px;border:1px solid #dde4ea;background:#fff;border-radius:var(--r2);font-size:14px;line-height:1.5;-webkit-appearance:none;appearance:none}
.ap-root .ap-find input:focus{outline:2px solid var(--sky-d);outline-offset:-1px;border-color:var(--sky-d)}
.ap-root .ap-sug{position:absolute;left:0;right:0;top:calc(100% + 4px);background:#fff;border:1px solid #dde4ea;border-radius:var(--r2);box-shadow:0 10px 28px rgba(13,27,42,.14);z-index:30;overflow:hidden}
.ap-root .ap-sug-i{display:flex;align-items:center;gap:9px;width:100%;padding:9px 12px;text-align:left;font-size:13.5px;border-top:1px solid var(--line)}
.ap-root .ap-sug-i:first-child{border-top:0}
.ap-root .ap-sug-i:hover,.ap-root .ap-sug-i:focus{background:#f2f8fb}
.ap-root .ap-sug-i .ap-lg{width:22px;height:22px;border-radius:5px}
.ap-root .ap-sug-i span{font-weight:700;flex:1;min-width:0}
.ap-root .ap-sug-i em{font-style:normal;font-size:11px;color:var(--sub)}
.ap-root .ap-sug-no{margin:0;padding:11px 12px;font-size:12.5px;color:var(--sub)}
.ap-root .ap-picked{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:10px}
.ap-root .ap-pk-l{font-size:11.5px;color:var(--sub);font-weight:700;margin-right:2px}
.ap-root .ap-pk{background:#e8f8fe;border:1px solid var(--sky-d);border-radius:6px;font-size:12.5px;font-weight:700;padding:5px 9px;line-height:1.4}
.ap-root .ap-pk i{font-style:normal;margin-left:6px;color:#0a6c8a}
/* 人数 */
.ap-root .ap-pplbox{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.ap-root .ap-num{width:92px;padding:8px 11px;border:1px solid #dde4ea;background:#fff;border-radius:var(--r2);font-size:18px;font-weight:800;text-align:right;font-variant-numeric:tabular-nums}
.ap-root .ap-num:focus{outline:2px solid var(--sky-d);outline-offset:-1px;border-color:var(--sky-d)}
.ap-root .ap-unit{font-size:13px;font-weight:700;margin-right:6px}
.ap-root .ap-pplq{display:flex;gap:6px;flex-wrap:wrap}
.ap-root .ap-pplq button{background:#fff;color:var(--txt);font-size:12.5px;padding:7px 12px;border:1px solid #dde4ea;border-radius:6px;line-height:1.4;white-space:nowrap;font-weight:500;min-width:62px;text-align:center;transition:.12s}
.ap-root .ap-pplq button:hover{border-color:#b9c7d3;background:#f7fafc}
.ap-root .ap-pplq button.ap-on{border-color:var(--sky-d);background:#e8f8fe;font-weight:700;box-shadow:inset 0 0 0 1px var(--sky-d)}

/* ===== 答え ===== */
.ap-root .ap-res{margin-top:18px;min-height:120px}
/* URLに組み合わせが入った状態で開いたときは、先に高さを取って下の一覧を画面の外へ出しておく（ずれを数えさせない） */
.ap-root .ap-res--boot{min-height:100vh}
.ap-root .ap-empty{background:var(--card);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);padding:56px 24px;margin:0;text-align:center;color:var(--sub);font-size:13px}
/* 3つの数字。1pxの線で区切ったひとつながりの帯（/ai-ryokin の4つの案と同じ作り） */
.ap-root .ap-sum{display:grid;grid-template-columns:1.1fr 1fr 1.15fr;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.ap-root .ap-card{background:var(--card);padding:16px 18px 15px;position:relative;display:flex;flex-direction:column}
.ap-root .ap-card-main{background:linear-gradient(160deg,#eefaff,#f6fdff)}
.ap-root .ap-card-main::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(96deg,#12b9e8,#3f8ae0)}
.ap-root .ap-card__t{display:block;font-size:11.5px;color:var(--sub);font-weight:700;margin:0 0 5px}
.ap-root .ap-card-main .ap-card__t{color:var(--sky-d)}
.ap-root .ap-card__y{display:block;font-size:27px;font-weight:900;line-height:1.25;letter-spacing:-.025em;font-variant-numeric:tabular-nums}
.ap-root .ap-card__y small{font-size:13px;font-weight:800;margin-left:2px;letter-spacing:0}
.ap-root .ap-card__na{font-size:15px;letter-spacing:0;color:var(--sub);font-weight:800;line-height:1.6}
.ap-root .ap-card__m{display:block;font-size:11px;color:var(--sub);margin:5px 0 0;line-height:1.55}
.ap-root .ap-why{display:flex;align-items:baseline;justify-content:space-between;gap:10px;padding:5px 0;border-top:1px solid var(--line);font-size:13px}
.ap-root .ap-why:first-of-type{border-top:0;padding-top:1px}
.ap-root .ap-why__l{display:inline-flex;align-items:center;gap:7px;font-weight:700}
.ap-root .ap-why b{font-size:17px;font-weight:900;font-variant-numeric:tabular-nums;white-space:nowrap}
/* 種類を示す色の点 */
.ap-root .ap-dot{display:inline-block;width:9px;height:9px;border-radius:2px;flex:none;background:var(--fxc)}
.ap-root .ap-dot-up{background:var(--up)}
.ap-root .ap-dot-down{background:var(--down)}
.ap-root .ap-dot-fx{background:#9aa9b6}
.ap-root .ap-dot-flat{background:#c9d3db}
.ap-root .ap-dot-obs{background:var(--ink);border-radius:50%}

/* 内訳 */
.ap-root .ap-det,.ap-root .ap-moves,.ap-root .ap-alt,.ap-root .ap-next{background:var(--card);border-radius:12px;box-shadow:var(--sh);margin-top:12px;padding:18px 20px 20px}
.ap-root .ap-det__hd{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:8px}
.ap-root .ap-det__hd h2{margin:0}
.ap-root .ap-det__sum{font-size:12.5px;color:var(--sub)}
/* ★position:relative を外さない。中にある読み上げ用の文字（.ap-sr＝絶対配置）が器の外へ出て、
   スマホでページ全体が横にはみ出した（2026-10-05 実測・895px/390px） */
.ap-root .ap-tw2{overflow-x:auto;-webkit-overflow-scrolling:touch;position:relative}
.ap-root .ap-tb{width:100%;border-collapse:collapse;font-size:13.5px;min-width:640px;margin:0;border:0}
.ap-root .ap-tb th,.ap-root .ap-tb td{padding:9px 12px;text-align:left;vertical-align:top;border:0;background:none}
.ap-root .ap-tb thead th{background:var(--soft);font-size:12.5px;font-weight:700;color:#33475a;white-space:nowrap}
.ap-root .ap-tb tbody tr{background:var(--card);border-top:1px solid var(--line)}
.ap-root .ap-tb tbody th{font-weight:800}
.ap-root .ap-tb .ap-r{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.ap-root .ap-tb tfoot th,.ap-root .ap-tb tfoot td{background:var(--soft);font-weight:900;font-size:14px;border-top:1px solid var(--line)}
.ap-root .ap-how{color:var(--sub);font-size:11.5px;line-height:1.65}
.ap-root .ap-calc{font-size:11px;color:#6b7c8a;font-variant-numeric:tabular-nums;line-height:1.65;white-space:normal;display:inline-block}
.ap-root .ap-tb-det{min-width:820px}
.ap-root .ap-rowt{display:flex;align-items:center;gap:8px}
.ap-root .ap-rowt .ap-lg{width:26px;height:26px;border-radius:6px}
.ap-root .ap-sel{max-width:270px;min-width:210px;width:100%;padding:7px 28px 7px 10px;border:1px solid #dde4ea;border-radius:var(--r2);background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%2361707d' stroke-width='1.6'/%3E%3C/svg%3E") no-repeat right 10px center;font-size:12.5px;line-height:1.4;-webkit-appearance:none;appearance:none}
.ap-root .ap-sel:focus{outline:2px solid var(--sky-d);outline-offset:-1px}
.ap-root .ap-x{width:34px;text-align:center}
.ap-root .ap-del{width:26px;height:26px;border-radius:4px;color:var(--sub);font-size:16px;line-height:24px;border:1px solid #dde4ea;background:#fff}
.ap-root .ap-del:hover{background:var(--soft);color:var(--txt)}
/* 印（他のナビと同じ大きさ） */
.ap-root .ap-mk{display:inline-block;background:var(--soft);color:#3c5468;font-size:11px;font-weight:700;padding:4px 9px;border-radius:4px;margin-left:5px;white-space:nowrap;line-height:1.5;vertical-align:middle}
.ap-root .ap-mk-w,.ap-root .ap-mk-up{background:var(--up-bg);color:#b03a28}
.ap-root .ap-mk-down{background:var(--down-bg);color:#0f7a52}
.ap-root .ap-mk-fx,.ap-root .ap-mk-flat,.ap-root .ap-mk-none,.ap-root .ap-mk-free{background:var(--fx-bg);color:#4d5f70}
.ap-root .ap-mv{font-weight:800;white-space:nowrap}
.ap-root .ap-note{font-size:11.5px;color:var(--sub);margin:12px 0 0;line-height:1.75}
.ap-root .ap-swipe{display:none;font-size:11px;color:var(--sub);margin:6px 0 0}

/* 上がったもの・下がったもの */
.ap-root .ap-lead2{font-size:12.5px;color:var(--sub);margin:0 0 12px;line-height:1.8}
.ap-root .ap-lg-i{display:inline-flex;align-items:center;gap:5px;margin-left:12px;white-space:nowrap}
.ap-root .ap-mvc{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,400px);gap:8px 24px;align-items:center;padding:16px 0;border-top:1px solid var(--line)}
.ap-root .ap-mvc:first-of-type{border-top:0;padding-top:2px}
.ap-root .ap-mvc__hd{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-bottom:6px}
.ap-root .ap-mvc__hd h3{margin:0;font-size:15.5px}
.ap-root .ap-mvc__hd h3 span{font-size:12.5px;font-weight:700;color:var(--sub);margin-left:7px}
.ap-root .ap-mvc__hd .ap-mk{margin-left:0}
.ap-root .ap-mvc__v{margin:0;font-size:18px;font-weight:900;font-variant-numeric:tabular-nums;line-height:1.5}
.ap-root .ap-mvc__v b{margin-left:10px;font-size:18px}
.ap-root .ap-arw{color:var(--sub);font-weight:700}
.ap-root .ap-mvc__s{margin:2px 0 0;font-size:12px;color:var(--sub);line-height:1.7}
.ap-root .ap-mvc__e{margin:8px 0 0;padding:0;list-style:none;font-size:13px;line-height:1.75}
.ap-root .ap-mvc__e li{position:relative;padding-left:15px;list-style:none}
.ap-root .ap-mvc__e li::before{content:"";position:absolute;left:0;top:.62em;width:8px;height:8px;border-radius:2px;background:currentColor}
.ap-root .ap-mvc__p{margin:8px 0 0;font-size:12.5px;line-height:1.7;background:var(--fx-bg);border-radius:6px;padding:8px 11px;color:#3d4d59}
.ap-root .ap-mvc__f{margin:8px 0 0;font-size:12.5px;line-height:1.75}
.ap-root .ap-mvc__f .ap-mk{margin:0 7px 0 0}
.ap-root .ap-mvc__a{margin:8px 0 0;font-size:12.5px}
.ap-root .ap-rec{margin-top:9px;font-size:12.5px}
.ap-root .ap-rec summary{cursor:pointer;color:var(--sky-d);font-weight:700;text-decoration:underline;text-underline-offset:2px;list-style:none}
.ap-root .ap-rec summary::-webkit-details-marker{display:none}
.ap-root .ap-rec summary::after{content:" ▼";font-size:9px}
.ap-root .ap-rec[open] summary::after{content:" ▲"}
.ap-root .ap-tb-rec{min-width:0;font-size:12.5px;margin-top:8px}
.ap-root .ap-tb-rec th,.ap-root .ap-tb-rec td{padding:6px 10px}
/* 折れ線 */
.ap-root .ap-ch{display:block;width:100%;height:auto;max-width:400px;margin-left:auto}
.ap-root .ap-ch-base{stroke:var(--line);stroke-width:1}
.ap-root .ap-ch-ln{stroke-width:2;stroke-linecap:round;fill:none}
.ap-root .ap-ch-fx{stroke:#9aa9b6}
.ap-root .ap-ch-same{stroke:#33475a}
.ap-root .ap-ch-ln.ap-ch-up{stroke:var(--up)}
.ap-root .ap-ch-ln.ap-ch-down{stroke:var(--down)}
.ap-root polygon.ap-ch-up{fill:var(--up)}
.ap-root polygon.ap-ch-down{fill:var(--down)}
.ap-root .ap-ch-obs{fill:var(--ink)}
.ap-root .ap-ch-fxd{fill:#fff;stroke:#9aa9b6;stroke-width:1.6}
.ap-root .ap-ch-v{font-size:12px;font-weight:800;fill:var(--txt);font-family:var(--font)}
.ap-root .ap-ch-d{font-size:10.5px;fill:var(--sub);font-family:var(--font)}
.ap-root .ap-ch-end{text-anchor:end}
.ap-root .ap-ch-mid{text-anchor:middle}

/* 無料枠で代われるもの・次に動きそうなもの */
.ap-root .ap-altg{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.ap-root .ap-box{position:relative;background:#f7fafc;border-radius:var(--r);padding:14px 16px 12px}
.ap-root .ap-box h3{margin-bottom:6px}
.ap-root .ap-box h3 span{font-size:11.5px;font-weight:700;color:var(--sub);margin-left:8px}
.ap-root .ap-list{margin:0;padding:0;list-style:none;font-size:13px}
.ap-root .ap-list li{padding:8px 0;border-top:1px solid var(--line);line-height:1.7;list-style:none}
.ap-root .ap-list li:first-child{border-top:0;padding-top:0}
.ap-root .ap-list b{font-weight:800;margin-right:6px}
.ap-root .ap-list span{color:var(--sub);font-size:11.5px}
.ap-root .ap-list .ap-mk{color:#0f7a52;font-size:11px}

/* URLをコピー */
.ap-root .ap-share{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:16px}
.ap-root .ap-btn{background:var(--ink);color:#fff;padding:9px 17px;border-radius:var(--r2);font-size:12.5px;font-weight:700;transition:.15s}
.ap-root .ap-btn:hover{background:var(--ink2)}
.ap-root .ap-btn.ap-done{background:var(--sky-d)}
.ap-root .ap-sharen{font-size:11.5px;color:var(--sub)}

/* ===== 静的な一覧・よくある質問・作り方 ===== */
.ap-root .ap-st,.ap-root .ap-faq,.ap-root .ap-about{background:var(--card);border-radius:12px;box-shadow:var(--sh);padding:20px 20px 22px;margin-top:22px}
.ap-root .ap-st + .ap-st{margin-top:12px}
.ap-root .ap-stlead,.ap-root .ap-stnote{font-size:13px;color:var(--sub);margin:0 0 12px;line-height:1.8}
.ap-root .ap-stnote{margin:12px 0 0}
.ap-root .ap-nodata{font-size:13.5px;margin:0;color:#3d4d59}
.ap-root .ap-evs{margin:0;padding:0;list-style:none}
.ap-root .ap-evs li{padding:11px 0;border-top:1px solid var(--line);font-size:13.5px;line-height:1.75;list-style:none}
.ap-root .ap-evs li:first-child{border-top:0;padding-top:2px}
.ap-root .ap-evs .ap-mk{margin:0 8px 0 0}
.ap-root .ap-evs b{font-weight:800;margin-right:8px}
.ap-root .ap-evw{color:#3d4d59}
.ap-root .ap-evd{color:var(--sub);font-size:11.5px;margin-left:8px;white-space:nowrap}
.ap-root .ap-st-fix summary{cursor:pointer;font-size:14px;font-weight:800;list-style:none}
.ap-root .ap-st-fix summary::-webkit-details-marker{display:none}
.ap-root .ap-st-fix summary::after{content:" ▼";font-size:10px;color:var(--sub)}
.ap-root .ap-st-fix details[open] summary::after{content:" ▲"}
.ap-root .ap-st-fix details[open] summary{margin-bottom:10px}
.ap-root .ap-evs-fix li{font-size:12.5px}
.ap-root .ap-qa{padding:14px 0;border-top:1px solid var(--line)}
.ap-root .ap-qa:first-of-type{padding-top:0;border-top:0}
.ap-root .ap-qa h3{font-size:14px;font-weight:800}
.ap-root .ap-qa p{margin:0;font-size:13.5px;color:#3d4d59;line-height:1.85}
.ap-root .ap-rules{margin:8px 0 12px;padding-left:1.3em;font-size:13.5px;color:#3d4d59;list-style:disc;line-height:1.85}
.ap-root .ap-rules li{margin:4px 0;list-style:disc}
.ap-root .ap-cite{font-size:12px;color:var(--sub);margin:0;line-height:1.75}
.ap-root .ap-about p{font-size:13.5px;color:#3d4d59;margin:0 0 10px;line-height:1.85}

/* 章の頭へ飛んだとき、上に貼りつく「よくある組み合わせ」の帯に隠れないようにする */
.ap-root .ap-res,.ap-root .ap-st,.ap-root .ap-faq,.ap-root .ap-about{scroll-margin-top:70px}
/* スマホの下の帯（選ぶと合計が出て、押すと答えへ動く）。PCでは出さない */
.ap-root .ap-fab{display:none}
@media (max-width:760px){
  .ap-root .ap-fab{position:fixed;left:0;right:0;bottom:0;z-index:60;display:flex;align-items:center;gap:10px;background:#fff;
    box-shadow:0 -1px 0 var(--line),0 -6px 18px rgba(13,27,42,.10);padding:10px 14px calc(10px + env(safe-area-inset-bottom,0px))}
  .ap-root .ap-fab[hidden]{display:none}
  .ap-root .ap-fab__t{flex:1;min-width:0;font-size:14px;font-weight:800;font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .ap-root .ap-fab__t b{font-size:12px;color:var(--sub);font-weight:700}
  .ap-root .ap-fab__t i{font-style:normal;margin-left:8px;font-size:13px}
  .ap-root .ap-fab__b{flex:none;background:linear-gradient(96deg,#12b9e8,#3f8ae0);color:#fff;font-size:14px;font-weight:800;padding:11px 22px;border-radius:var(--rp)}
}

/* 料金の相場（下に残したレポート）。数字は地の上に大きく置き、棒は濃紺とうすいグレーだけ */
.ap-root .ap-sbk{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;margin:4px 0 6px}
.ap-root .ap-sbk>div{background:#fff;padding:14px 16px 13px}
.ap-root .ap-sbk b{display:block;font-size:26px;font-weight:900;line-height:1.2;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.ap-root .ap-sbk b i{font-style:normal;font-size:13px;margin-left:2px;letter-spacing:0}
.ap-root .ap-sbk span{display:block;font-size:11.5px;color:var(--sub);margin-top:4px;line-height:1.55}
.ap-root .ap-sbh{font-size:14.5px;margin:22px 0 10px}
.ap-root .ap-bars{display:grid;gap:9px}
.ap-root .ap-bar{display:grid;grid-template-columns:130px minmax(0,1fr) 92px;gap:14px;align-items:center;font-size:13px}
.ap-root .ap-bar__l{color:#33475a}
.ap-root .ap-bar__t{display:block;height:15px;background:var(--soft);border-radius:2px;overflow:hidden}
.ap-root .ap-bar__t i{display:block;height:100%;background:#5a7186}
.ap-root .ap-bar-top .ap-bar__t i{background:var(--ink)}
.ap-root .ap-bar__v{text-align:right;font-weight:800;font-variant-numeric:tabular-nums;white-space:nowrap}
.ap-root .ap-bar__v em{font-style:normal;font-weight:500;color:var(--sub);font-size:11.5px;margin-left:6px}
.ap-root .ap-tb-s{min-width:480px}

/* ===== 幅ごとの直し ===== */
@media (max-width:1000px){
  .ap-root .ap-tiles{grid-template-columns:repeat(4,minmax(0,1fr))}
  .ap-root .ap-sum{grid-template-columns:1fr 1fr}
  .ap-root .ap-card-why{grid-column:1/-1}
  .ap-root .ap-altg{grid-template-columns:1fr}
  .ap-root .ap-mvc{grid-template-columns:minmax(0,1fr) minmax(220px,320px)}
}
/* 内訳の表は、幅が足りないときは1本ずつ積む（横スクロールだと「いまの額」と「動いた額」が画面の外に出る） */
@media (max-width:900px){
  .ap-root .ap-tb-det{min-width:0;display:block}
  .ap-root .ap-tb-det thead{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
  .ap-root .ap-tb-det tbody,.ap-root .ap-tb-det tfoot{display:block}
  .ap-root .ap-tb-det tr{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 10px;padding:14px 0}
  .ap-root .ap-tb-det tbody tr:first-child{border-top:0;padding-top:4px}
  .ap-root .ap-tb-det th,.ap-root .ap-tb-det td{display:block;padding:0;text-align:left}
  .ap-root .ap-tb-det tbody th{grid-column:1;grid-row:1;align-self:center}
  .ap-root .ap-tb-det td.ap-x{grid-column:2;grid-row:1;width:auto}
  .ap-root .ap-tb-det tbody td{grid-column:1/-1}
  .ap-root .ap-tb-det .ap-sel{max-width:none}
  .ap-root .ap-tb-det td[data-l]{display:flex;align-items:baseline;justify-content:space-between;gap:0 12px;text-align:right;white-space:normal}
  .ap-root .ap-tb-det td[data-l]::before{content:attr(data-l);flex:none;font-size:11.5px;font-weight:700;color:var(--sub);text-align:left}
  .ap-root .ap-tb-det td[data-l] br{display:none}
  .ap-root .ap-tb-det td[data-l] .ap-calc{display:block;margin-top:2px}
  .ap-root .ap-tb-det td[data-l]>b{margin-left:auto}
  .ap-root .ap-tb-det td.ap-r[data-l]{flex-wrap:wrap;justify-content:flex-end}
  .ap-root .ap-tb-det td.ap-r[data-l]::before{margin-right:auto}
  .ap-root .ap-tb-det td.ap-r[data-l] .ap-calc{flex-basis:100%;text-align:right}
  .ap-root .ap-tb-det tfoot tr{grid-template-columns:1fr;background:var(--soft);padding:12px 12px;border-radius:6px;gap:4px}
  .ap-root .ap-tb-det tfoot th,.ap-root .ap-tb-det tfoot td{background:none;border:0}
  .ap-root .ap-tb-det tfoot td:last-child{display:none}
}
@media (max-width:760px){
  .ap-root .ap-mvc{grid-template-columns:1fr}
  .ap-root .ap-ch{margin:4px 0 0;max-width:420px}
  .ap-root .ap-swipe{display:block}
}
@media (max-width:600px){
  .ap-root .ap-hd{padding:20px 0 16px}
  .ap-root .ap-ttl{font-size:33px}
  .ap-root .ap-lead{font-size:13.5px}
  .ap-root .ap-kpi{width:100%;padding-bottom:0}
  .ap-root .ap-kp{flex:1;min-width:0;padding:11px 10px}
  .ap-root .ap-kp .ap-n{font-size:24px}
  .ap-root .ap-body{padding:16px 14px 56px}
  .ap-root .ap-wrap{padding:0 14px}
  .ap-root .ap-quick .ap-wrap::after{right:14px}
  .ap-root .ap-in{padding:14px 14px 16px}
  .ap-root .ap-tiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
  .ap-root .ap-tile{padding:10px 10px 9px;min-height:70px}
  .ap-root .ap-th b{font-size:13.5px}
  .ap-root .ap-sum{grid-template-columns:1fr}
  .ap-root .ap-card__y{font-size:24px}
  .ap-root .ap-st,.ap-root .ap-faq,.ap-root .ap-about,.ap-root .ap-det,.ap-root .ap-moves,.ap-root .ap-alt,.ap-root .ap-next{padding:16px 14px 18px}
  .ap-root .ap-lg-i{margin:0 12px 0 0}
  .ap-root .ap-mvc__v{font-size:16.5px}
  .ap-root .ap-mvc__v b{display:inline-block;margin-left:8px;font-size:16.5px}
  .ap-root .ap-evd{display:block;margin:2px 0 0}
  .ap-root .ap-find{max-width:none}
  /* スマホは頭を短くして、定番のタイルが開いた直後の画面に入るようにする */
  .ap-root .ap-lead .ap-pc{display:none}
  .ap-root .ap-sbk{grid-template-columns:1fr}
  .ap-root .ap-bar{grid-template-columns:104px minmax(0,1fr) 78px;gap:9px;font-size:12px}
}
@media (prefers-reduced-motion:reduce){
  .ap-root .ap-hdfx span,.ap-root .ap-ttl .ap-tw{animation:none}
}
@media print{
  body.ai-aiprice-page .ai-hd,body.ai-aiprice-page .ai-ft,body.ai-aiprice-page .ai-drawer,body.ai-aiprice-page .ai-cb,
  body.ai-aiprice-page .ai-strip,body.ai-aiprice-page .ai-nmq,.ap-root .ap-quick,.ap-root .ap-hdfx,.ap-root .ap-find,.ap-root .ap-fab,
  .ap-root .ap-share,.ap-root .ap-del,.ap-root .ap-tile:not(.ap-on){display:none!important}
  .ap-root,.ap-root .ap-body,.ap-root .ap-hd{background:#fff}
  .ap-root .ap-ttl .ap-tw{transform:none;background:none;-webkit-text-fill-color:#12212e;color:#12212e;animation:none}
  .ap-root .ap-in,.ap-root .ap-det,.ap-root .ap-moves,.ap-root .ap-alt,.ap-root .ap-next,.ap-root .ap-st,.ap-root .ap-about{box-shadow:none;border:1px solid #d6dde3;break-inside:avoid}
}