/* 新Cloudflare版だけで使用する共通CSS。旧WordPress版には読み込まない。 */
.hpa-site {
  --hpa-action:#2f6f62; --hpa-action-dark:#255a4f; --hpa-text:#2b3033; --hpa-sub:#596264;
  --hpa-line:#e4e1da; --hpa-soft:#f7f6f3; --hpa-cream:#fbf8f2; --hpa-accent:#eef5f2;
  --hpa-yellow:#fff5d6; --hpa-sky:#e6f0f8; --hpa-coral:#fce9e2; --hpa-green:#e5f2ea;
  --hpa-radius:18px; --hpa-gutter:clamp(20px,3vw,40px); --hpa-section-space:clamp(64px,8vw,112px);
  --hpa-ease:cubic-bezier(.22,1,.36,1); --hpa-reveal-distance:12px; --hpa-motion:.6s;
  margin:0; background:#fff; color:var(--hpa-text); font-family:"Hiragino Sans","Yu Gothic",Meiryo,sans-serif;
  font-size:16px; line-height:1.85; -webkit-text-size-adjust:100%; line-break:strict;
}
.hpa-site *, .hpa-site *::before, .hpa-site *::after { box-sizing:border-box; }
.hpa-site :where(h1,h2,h3,h4,p,ul,ol,dl,dt,dd,figure) { margin:0; padding:0; }
.hpa-site :where(ul,ol) { list-style:none; }
.hpa-site :where(a) { color:var(--hpa-action); text-underline-offset:5px; }
.hpa-site :where(img) { display:block; max-width:100%; height:auto; }
.hpa-site :where(button,input,select) { font:inherit; }
.hpa-site :where(button,a,input,select):focus-visible { outline:3px solid #203d36; outline-offset:4px; }
.hpa-site :where(button) { cursor:pointer; }
.hpa-site :where(h1,h2,h3,h4) { line-height:1.45; letter-spacing:.015em; word-break:normal; overflow-wrap:anywhere; text-wrap:balance; }
.hpa-site h1 { font-size:clamp(30px,3.8vw,52px); font-weight:750; margin-block:20px 22px; }
.hpa-title-phrase { display:inline-block; max-width:100%; }
.hpa-site h2 { font-size:clamp(25px,2.7vw,36px); font-weight:700; }
.hpa-site h3 { font-size:20px; }
.hpa-site h4 { font-size:17px; }
.hpa-site p { overflow-wrap:anywhere; text-wrap:pretty; }
@supports (word-break:auto-phrase) { .hpa-site :where(p,h2,h3,h4) { word-break:auto-phrase; } }
.hpa-container { width:100%; max-width:1280px; margin-inline:auto; padding-inline:var(--hpa-gutter); }
.hpa-section { padding-block:var(--hpa-section-space); scroll-margin-top:140px; }
.hpa-soft,.hpa-top-hero,.hpa-detail-hero { background:var(--hpa-soft); }
.hpa-cream { background:var(--hpa-cream); }
.hpa-cta { background:var(--hpa-accent); }
.hpa-section-head { max-width:760px; margin-bottom:36px; }
.hpa-section-head h2 { margin-block:10px 18px; }
.hpa-eyebrow { color:var(--hpa-action); font-size:14px; font-weight:700; letter-spacing:.055em; }
.hpa-lead { font-size:clamp(16px,1.5vw,18px); color:var(--hpa-sub); max-width:42em; }
.hpa-note { font-size:14px; line-height:1.8; color:var(--hpa-sub); }
.hpa-notice,.hpa-evidence { background:#fff; border:1px solid var(--hpa-line); border-radius:12px; padding:22px; margin-top:28px; }
.hpa-notice { border-left:3px solid var(--hpa-action); }
.hpa-notice p { margin-top:8px; }
.hpa-chip { display:inline-block; font-size:12px; line-height:1.6; padding:6px 12px; border:1px solid #b2cfc2; border-radius:999px; background:var(--hpa-green); color:#214f44; font-weight:700; }
.hpa-chip-muted { background:var(--hpa-soft); border-color:var(--hpa-line); color:var(--hpa-sub); }
.hpa-skip { position:fixed; top:0; left:12px; transform:translateY(-150%); background:#fff; padding:12px; z-index:100; }
.hpa-skip:focus { transform:none; }
.hpa-sr { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
.hpa-site-header { background:rgba(255,255,255,.97); border-bottom:1px solid var(--hpa-line); position:sticky; top:0; z-index:20; }
.hpa-header-inner { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px 28px; padding-block:12px; }
.hpa-brand { display:flex; align-items:center; gap:10px; font-size:17px; font-weight:750; text-decoration:none; color:var(--hpa-text); white-space:nowrap; }
.hpa-header-inner .hpa-brand { min-width:197px; min-height:36px; }
.hpa-brand-logo { width:auto; height:44px; max-width:100%; object-fit:contain; }
.hpa-header-inner nav { display:flex; flex-wrap:wrap; align-items:center; gap:4px 18px; font-size:13px; }
.hpa-header-inner nav a { display:flex; align-items:center; min-height:44px; text-decoration:none; font-weight:700; }
.hpa-header-contact { border-bottom:1px solid var(--hpa-action); }
.hpa-site-footer { background:var(--hpa-soft); padding-block:48px; border-top:1px solid var(--hpa-line); }
.hpa-site-footer p { font-size:14px; color:var(--hpa-sub); margin-top:10px; }
.hpa-site-footer nav { display:flex; flex-wrap:wrap; gap:4px 24px; margin-block:22px; font-size:14px; }
.hpa-site-footer nav a { display:flex; align-items:center; min-height:44px; }
.hpa-site-footer small { color:var(--hpa-sub); }
.hpa-breadcrumb { display:flex; flex-wrap:wrap; gap:6px 12px; font-size:12px; color:var(--hpa-sub); margin-bottom:20px; }
.hpa-back { display:inline-flex; align-items:center; min-height:44px; font-size:14px; margin-bottom:28px; text-decoration:none; }
.hpa-detail-hero { padding-top:28px; }
.hpa-hero-grid { display:grid; gap:40px; align-items:center; }
.hpa-hero-grid>* { min-width:0; }
.hpa-hero-grid .hpa-note { margin-top:20px; max-width:38em; }
.hpa-hero-caption { margin-top:22px; font-size:14px; color:var(--hpa-sub); }
.hpa-actions { display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin-top:28px; }
.hpa-btn { display:inline-flex; align-items:center; justify-content:center; gap:12px; min-height:48px; padding:12px 22px; border:1px solid var(--hpa-action); border-radius:999px; background:var(--hpa-action); color:#fff; font-weight:700; font-size:15px; line-height:1.65; text-align:center; text-decoration:none; transition:transform .2s var(--hpa-ease); }
.hpa-btn-outline { background:transparent; color:var(--hpa-action); }
.hpa-btn:disabled { opacity:.6; cursor:default; }
.hpa-top-art { background:#fff; border-radius:48% 48% 38% 45%; }
.hpa-hero-preview { max-width:560px; width:100%; margin-inline:auto; }
.hpa-industry-art { width:260px; margin-inline:auto; margin-bottom:-12px; position:relative; z-index:1; }
.hpa-preview-window { background:#fff; border:1px solid var(--hpa-line); border-radius:var(--hpa-radius); padding:22px; box-shadow:0 14px 40px rgba(45,60,49,.06); }
.hpa-window-bar { display:flex; justify-content:space-between; gap:12px; color:#6a7274; font-size:11px; border-bottom:1px solid var(--hpa-line); padding-bottom:14px; margin-bottom:20px; }
.hpa-window-bar>span:first-child { letter-spacing:4px; color:#aac5b8; }
.hpa-preview-window h2 { font-size:20px; }
.hpa-metrics { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-block:18px; }
.hpa-metrics>div { min-width:0; padding:14px 12px; background:var(--hpa-accent); border-radius:10px; }
.hpa-metrics dt { font-size:12px; color:var(--hpa-sub); }
.hpa-metrics dd { font-size:26px; font-weight:750; line-height:1.5; overflow-wrap:anywhere; }
.hpa-preview-window .hpa-metrics { grid-template-columns:repeat(3,minmax(0,1fr)); }
.hpa-preview-window .hpa-metrics dd { font-size:clamp(18px,2vw,26px); }
.hpa-evidence { display:grid; gap:12px; }
.hpa-evidence .hpa-chip { justify-self:start; }
.hpa-evidence p { font-size:14px; }
.hpa-info-grid { display:grid; gap:20px; }
.hpa-info-card { background:#fff; border:1px solid var(--hpa-line); border-radius:var(--hpa-radius); padding:28px; position:relative; min-width:0; }
.hpa-step-number { color:var(--hpa-action); font-size:14px; font-weight:700; }
.hpa-info-card h3 { margin-block:16px 12px; }
.hpa-info-card p { color:var(--hpa-sub); }
.hpa-card-accent { position:absolute; bottom:0; left:28px; right:28px; height:3px; background:var(--hpa-green); }
.hpa-flow { display:grid; gap:24px; }
.hpa-flow li { background:var(--hpa-soft); border:1px solid var(--hpa-line); border-radius:12px; padding:22px; position:relative; min-width:0; }
.hpa-flow li:not(:last-child)::after { content:'↓'; position:absolute; bottom:-28px; left:50%; transform:translateX(-50%); font-size:18px; color:var(--hpa-action); }
.hpa-flow h3 { font-size:17px; margin-block:14px 10px; }
.hpa-flow p { font-size:14px; color:var(--hpa-sub); }
.hpa-actor { background:var(--hpa-green); border-radius:6px; padding:4px 10px; font-size:12px; font-weight:700; color:#214f44; }
.hpa-actor-plan { background:var(--hpa-yellow); color:#65491a; }
.hpa-demo { padding:24px; background:#fff; border:1px solid var(--hpa-line); border-radius:var(--hpa-radius); max-width:960px; margin-inline:auto; box-shadow:0 10px 30px rgba(45,60,49,.04); }
.hpa-demo-head { display:flex; flex-wrap:wrap; gap:12px; align-items:center; margin-bottom:18px; }
.hpa-demo-head p { font-size:13px; color:var(--hpa-sub); }
.hpa-demo>h3 { margin-bottom:12px; font-size:clamp(20px,2vw,26px); }
.hpa-demo-form { display:grid; gap:16px; margin-top:24px; }
.hpa-demo-form label { display:grid; gap:8px; font-size:14px; font-weight:700; min-width:0; }
.hpa-demo-form :where(input:not([type=checkbox]),select) { width:100%; min-width:0; min-height:48px; background:#fff; color:var(--hpa-text); border:1px solid #9aaca6; border-radius:8px; padding:10px 12px; font-size:16px; line-height:1.5; }
.hpa-demo-form input[type=checkbox] { width:20px; height:20px; accent-color:var(--hpa-action); }
.hpa-demo[data-demo=clinic] input[type=checkbox] { flex-shrink:0; }
.hpa-demo-form label:has(input[type=checkbox]) { display:flex; align-items:center; gap:12px; min-height:44px; }
.hpa-demo-form .hpa-actions { margin-top:0; }
.hpa-demo-form .hpa-btn { justify-self:start; max-width:100%; }
.hpa-field-grid { display:grid; gap:16px; }
.hpa-demo-result { margin-top:24px; border:1px solid #c6dbd0; border-radius:12px; background:#f4f9f6; padding:22px; scroll-margin-top:140px; }
.hpa-demo-result p+p { margin-top:8px; }
.hpa-demo-result h4 { margin-top:20px; margin-bottom:10px; }
.hpa-result-label { color:var(--hpa-action); font-weight:700; }
.hpa-error { color:#8a3b28; font-weight:700; }
.hpa-success { color:#255a4f; font-weight:700; }
.hpa-photo-list { margin-top:20px; }
.hpa-photo-card { padding:14px; background:#fff; border:1px solid var(--hpa-line); border-radius:12px; min-width:0; }
.hpa-photo-card img { width:100%; border-radius:8px; }
.hpa-photo-card figcaption { margin-top:12px; }
.hpa-clinic-conditions { display:grid; gap:8px 24px; }
.hpa-message-preview { background:#fff; border:1px solid var(--hpa-line); border-radius:12px; padding:18px; }
/* 新規4事例の短い文字を、最小幅でも一行で表示する。製造業の数値カードは維持。 */
@media (max-width:374px) { .hpa-text-preview .hpa-metrics>div { padding-inline:6px; } }
@media (min-width:600px) { .hpa-clinic-conditions { grid-template-columns:repeat(2,minmax(0,1fr)); } }
.hpa-correction { border-top:1px solid var(--hpa-line); padding-top:24px; }
.hpa-shots { display:grid; gap:48px; margin-top:64px; }
.hpa-shot { min-width:0; display:grid; gap:22px; }
.hpa-shot h3 { margin-block:12px; }
.hpa-shot figcaption p { color:var(--hpa-sub); font-size:15px; }
.hpa-screen-link { display:block; border:1px solid var(--hpa-line); border-radius:12px; padding:12px; background:#fff; text-decoration:none; }
.hpa-screen-link img { width:100%; height:auto; object-fit:contain; }
.hpa-screen-link>span { display:flex; align-items:center; justify-content:flex-end; min-height:44px; gap:8px; font-size:13px; margin-top:8px; }
.hpa-tech { display:grid; gap:12px; }
.hpa-tech>div { padding:22px; border:1px solid var(--hpa-line); border-radius:12px; display:grid; gap:10px; }
.hpa-tech dt { font-weight:700; }
.hpa-tech dd { color:var(--hpa-sub); }
.hpa-cta-inner { max-width:960px; }
.hpa-cta .hpa-section-head { max-width:760px; }
.hpa-cta .hpa-btn { margin-bottom:24px; }
.hpa-detail-line-consult { margin-bottom:28px; }
.hpa-cta .hpa-detail-line-consult .hpa-btn { margin-bottom:12px; }
@media (max-width:599px) { .hpa-detail-line-consult .hpa-btn, .hpa-detail-line-consult + .hpa-btn { width:100%; } }
.hpa-return-links { display:flex; flex-wrap:wrap; gap:8px 24px; margin-top:8px; }
.hpa-return-links a { display:flex; align-items:center; min-height:44px; font-size:14px; }
.hpa-related { margin-top:44px; padding-top:28px; border-top:1px solid #ccddd3; }
.hpa-related p { font-size:14px; font-weight:700; margin-bottom:12px; }
.hpa-related>div { display:flex; flex-wrap:wrap; gap:10px; }
.hpa-related a { background:#fff; border:1px solid #ccddd3; border-radius:999px; padding:8px 18px; min-height:44px; text-decoration:none; font-size:14px; }
.hpa-case-disclosure { margin-bottom:28px; font-size:14px; color:var(--hpa-sub); max-width:60em; }
.hpa-case-grid { display:grid; gap:24px; }
.hpa-case-card { overflow:hidden; border:1px solid var(--hpa-line); border-radius:var(--hpa-radius); background:#fff; display:flex; flex-direction:column; transition:transform .25s var(--hpa-ease); min-width:0; }
.hpa-case-visual { display:flex; justify-content:center; height:160px; background:var(--hpa-yellow); }
.hpa-case-visual img { height:100%; width:auto; }
.hpa-tint-sky .hpa-case-visual { background:var(--hpa-sky); }
.hpa-tint-coral .hpa-case-visual { background:var(--hpa-coral); }
.hpa-tint-green .hpa-case-visual { background:var(--hpa-green); }
.hpa-case-body { padding:28px; display:flex; flex-direction:column; align-items:flex-start; flex:1; gap:18px; }
.hpa-case-body h3 { font-size:23px; }
.hpa-case-body>p:not(.hpa-eyebrow) { color:var(--hpa-sub); }
.hpa-case-link { display:flex; align-items:center; justify-content:space-between; gap:12px; width:100%; margin-top:auto; padding-top:20px; min-height:48px; border-top:1px solid var(--hpa-line); font-size:15px; font-weight:700; text-decoration:none; }
.hpa-image-dialog { width:min(96vw,1400px); max-width:96vw; max-height:92dvh; padding:24px; border:1px solid var(--hpa-line); border-radius:16px; color:var(--hpa-text); }
.hpa-image-dialog::backdrop { background:rgba(30,40,36,.72); }
.hpa-dialog-bar { display:flex; flex-wrap:wrap; gap:12px; justify-content:space-between; align-items:center; margin-bottom:12px; }
.hpa-dialog-bar h2 { font-size:20px; }
.hpa-dialog-bar>div { display:flex; gap:10px; }
.hpa-dialog-bar .hpa-btn { font-size:13px; padding:8px 16px; }
.hpa-image-scroll { max-height:65dvh; overflow:auto; margin-top:20px; border:1px solid var(--hpa-line); }
.hpa-image-scroll img { width:100%; }
.hpa-original-size .hpa-image-scroll img { max-width:none; width:auto; }
[data-reveal] { transition:opacity var(--hpa-motion) var(--hpa-ease) var(--hpa-delay,0ms), transform var(--hpa-motion) var(--hpa-ease) var(--hpa-delay,0ms); }
.hpa-await-reveal { opacity:0; transform:translateY(var(--hpa-reveal-distance)); }
@media (hover:hover) and (prefers-reduced-motion:no-preference) { .hpa-case-card:hover { transform:translateY(-4px); } .hpa-btn:hover { transform:translateY(-2px); } }
@media (max-width:374px) { .hpa-header-inner nav { gap:4px 12px; font-size:12px; } .hpa-btn { padding-inline:18px; } .hpa-demo { padding:18px; } .hpa-demo-result { padding:18px; } .hpa-metrics dd { font-size:22px; } }
@media (min-width:600px) { .hpa-field-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .hpa-tech>div { grid-template-columns:minmax(180px,1fr) 2fr; gap:24px; } .hpa-demo { padding:36px; } }
@media (min-width:768px) { .hpa-info-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } .hpa-case-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .hpa-metrics { grid-template-columns:repeat(4,minmax(0,1fr)); } .hpa-shot { grid-template-columns:1fr 1.6fr; align-items:start; } .hpa-evidence { grid-template-columns:max-content 1fr; align-items:start; } }
@media (min-width:960px) { .hpa-hero-grid { grid-template-columns:1fr 1fr; gap:64px; } .hpa-site { --hpa-reveal-distance:16px; } .hpa-section { scroll-margin-top:100px; } }
@media (min-width:1100px) { .hpa-flow { grid-template-columns:repeat(5,minmax(0,1fr)); gap:18px; } .hpa-flow li:not(:last-child)::after { content:'→'; left:auto; right:-17px; top:50%; bottom:auto; transform:translateY(-50%); } }
@media (prefers-reduced-motion:reduce) { .hpa-site *, .hpa-site *::before, .hpa-site *::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; } .hpa-await-reveal { opacity:1; transform:none; } }
@media (prefers-reduced-motion:no-preference) { html:has(.hpa-site) { scroll-behavior:smooth; } }