:root{
      --ink:#2e1a24; --ink-soft:#6b5560; --ink-faint:#9a8a90; --line:#f0dde2;
      --grad:linear-gradient(135deg,#ff5a8c,#a05cff);
      --pink:#e23e5e;
    }
    *{ box-sizing:border-box; }
    html{ scroll-behavior:smooth; }
    body{ font-family:"Hiragino Kaku Gothic ProN","Noto Sans JP",system-ui,sans-serif; color:var(--ink); background:#fff; -webkit-font-smoothing:antialiased; line-height:1.9; }
    a{ color:inherit; text-decoration:none; }
    .wrap{ width:880px; max-width:90%; margin:0 auto; }

    .ghead{ position:sticky; top:0; z-index:50; background:rgba(255,255,255,.92); backdrop-filter:blur(8px); border-bottom:1px solid var(--line); }
    .ghead__in{ display:flex; align-items:center; height:66px; }
    .ghead__logo img{ height:30px; width:auto; display:block; }
    .ghead__back{ margin-left:auto; font-size:.82rem; font-weight:800; color:var(--ink-soft); }
    .ghead__back:hover{ color:var(--pink); }

    .ghero{ position:relative; color:#fff; padding:70px 0 58px; overflow:hidden; background:linear-gradient(155deg,#ff5a8c,#a05cff 60%,#7b2ff7); }
    .ghero::after{ content:""; position:absolute; right:-120px; top:-120px; width:420px; height:420px; border-radius:50%; background:rgba(255,255,255,.12); }
    .ghero__in{ position:relative; z-index:1; }
    .ghero__tag{ display:inline-flex; gap:10px; align-items:center; background:rgba(255,255,255,.18); border:1px solid rgba(255,255,255,.35); font-size:.72rem; font-weight:800; letter-spacing:.06em; padding:6px 14px; border-radius:999px; }
    .ghero__en{ display:block; margin-top:16px; font-size:.9rem; font-weight:800; letter-spacing:.18em; opacity:.85; }
    .ghero h1{ font-size:clamp(2rem,4.5vw,2.8rem); font-weight:900; line-height:1.15; margin:6px 0 10px; }
    .ghero__lead{ font-size:.95rem; max-width:620px; opacity:.95; }

    .pp{ padding:50px 0 64px; }
    .pp__intro{ color:var(--ink-soft); font-size:.95rem; margin:0 0 14px; }
    .pp__meta{ font-size:.8rem; color:var(--ink-faint); margin:0 0 30px; }

    /* デモ注記 */
    .pp__notice{ display:flex; gap:12px; background:#fff7f2; border:1px solid var(--line); border-radius:14px; padding:16px 20px; margin:0 0 36px; font-size:.84rem; color:var(--ink-soft); }
    .pp__notice b{ color:var(--pink); }

    /* 目次 */
    .pp__toc{ background:#faf8ff; border:1px solid var(--line); border-radius:16px; padding:22px 26px; margin:0 0 40px; }
    .pp__toc h2{ font-size:.78rem; font-weight:900; letter-spacing:.12em; color:var(--pink); margin:0 0 14px; }
    .pp__toc ol{ margin:0; padding:0; list-style:none; counter-reset:toc; columns:2; column-gap:32px; }
    .pp__toc li{ counter-increment:toc; font-size:.88rem; font-weight:700; margin-bottom:9px; break-inside:avoid; }
    .pp__toc li::before{ content:counter(toc) ". "; color:var(--pink); font-weight:900; }
    .pp__toc a:hover{ color:var(--pink); text-decoration:underline; }

    /* 本文セクション */
    .pp__sec{ scroll-margin-top:80px; margin:0 0 38px; }
    .pp__h{ display:flex; align-items:baseline; gap:12px; font-size:1.2rem; font-weight:900; margin:0 0 14px; padding-bottom:10px; border-bottom:2px solid var(--line); }
    .pp__h .n{ flex:0 0 auto; width:30px; height:30px; border-radius:9px; background:var(--grad); color:#fff; font-size:.9rem; display:inline-flex; align-items:center; justify-content:center; }
    .pp__sec p{ margin:0 0 12px; font-size:.92rem; }
    .pp__sec ul{ margin:0 0 14px; padding-left:0; list-style:none; }
    .pp__sec ul li{ position:relative; padding-left:20px; font-size:.9rem; margin-bottom:8px; color:var(--ink); }
    .pp__sec ul li::before{ content:""; position:absolute; left:4px; top:11px; width:6px; height:6px; border-radius:50%; background:var(--pink); }
    .pp__sec h3{ font-size:.98rem; font-weight:900; margin:20px 0 10px; }
    .pp__tag{ display:inline-block; font-size:.66rem; font-weight:800; color:var(--pink); background:#fff5f7; border:1px solid var(--line); border-radius:6px; padding:2px 9px; vertical-align:middle; }

    /* 取得情報テーブル */
    .pp__table{ width:100%; border-collapse:collapse; border:1px solid var(--line); border-radius:12px; overflow:hidden; margin:0 0 16px; font-size:.86rem; }
    .pp__table th,.pp__table td{ text-align:left; padding:13px 16px; border-bottom:1px solid var(--line); vertical-align:top; }
    .pp__table th{ width:230px; background:#fff7f2; font-weight:800; }
    .pp__table tr:last-child th,.pp__table tr:last-child td{ border-bottom:none; }

    /* 連絡先カード */
    .pp__contact{ background:#fff; border:1px solid var(--line); border-radius:14px; padding:22px 26px; box-shadow:0 12px 30px rgba(120,40,60,.06); font-size:.9rem; }
    .pp__contact b{ font-weight:900; }
    .pp__contact dl{ margin:12px 0 0; display:grid; grid-template-columns:90px 1fr; gap:8px 16px; }
    .pp__contact dt{ color:var(--ink-faint); font-weight:800; font-size:.82rem; }
    .pp__contact dd{ margin:0; }

    @media(max-width:640px){
      .pp__toc ol{ columns:1; }
      .pp__table th{ width:auto; display:block; }
      .pp__table td{ display:block; }
      .pp__contact dl{ grid-template-columns:1fr; gap:2px 0; }
      .pp__contact dt{ margin-top:8px; }
    }