/*
 * lp/ai-agent-document-processing.html、lp/bank.html、lp/care.html などのページ固有のスタイル（custom.css・site.css の後に読み込む）。
 * Tailwind のユーティリティクラス（px-4、lg:grid 等）は定義していないので、HTML に書いても効かない。
 * 新しい見た目が必要なときは、このファイルにクラスを追加して HTML から使うこと。
 *
 * ブレークポイント: sm 640px / md 768px / lg 1024px / xl 1280px / 2xl 1536px
 */

/* ================================================================ ページ全体（body） */
.lp-body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; background-color: #f8fafc; }

/* ================================================================ lp-hero（AI-OCR比較でわかる） */
.lp-hero-section { padding-bottom: 4rem; padding-top: 6rem; }
.lp-hero-container {
    width: 100%;
    position: relative;
    z-index: 10;
    margin-left: auto;
    margin-right: auto;
    padding-left: 1rem;
    padding-right: 1rem;
}
.lp-hero-layout {
    margin-left: auto;
    margin-right: auto;
    display: grid;
    max-width: 80rem;
    align-items: center;
    gap: 2rem;
}
.lp-hero-copy { order: 2; text-align: center; }
.lp-hero-pill-wrap { margin-bottom: 1.25rem; }
.lp-hero-eyebrow {
    margin-bottom: 1rem;
    font-size: 0.875rem;
    line-height: 1.25rem;
    font-weight: 600;
    letter-spacing: 0.14em;
    color: rgb(255 255 255 / 0.8);
}
.lp-hero-heading { margin-bottom: 1.25rem; color: #ffffff; }
.lp-hero-title-line { display: block; }
.lp-hero-lead {
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 2rem;
    max-width: 42rem;
    font-size: 1rem;
    line-height: 1.625;
    color: rgb(255 255 255 / 0.75);
}
.lp-hero-lead-emphasis { color: #ffffff; }
.lp-hero-chips {
    margin-bottom: 2rem;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.625rem;
}
.lp-hero-actions-wrap {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 0.75rem;
}
.lp-hero-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    border-radius: 1rem;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
    font-weight: 700;
}
.lp-hero-guide-note {
    margin-top: 1rem;
    font-size: 0.875rem;
    line-height: 1.625;
    color: rgb(255 255 255 / 0.75);
}
.lp-hero-guide-link {
    font-weight: 700;
    text-decoration-line: underline;
    text-underline-offset: 4px;
    color: #ffffff;
}
.lp-hero-media { order: 1; }
.lp-hero-actions {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 0.75rem;
}
.lp-hero-cta-icon { height: 1rem; width: 1rem; }
.lp-hero-centered {
    margin-left: auto;
    margin-right: auto;
    max-width: 72rem;
    text-align: center;
}
.lp-hero-links {
    margin-bottom: 1.5rem;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.75rem;
}
.lp-hero-link-button {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    border-radius: 9999px;
    padding-left: 1.25rem;
    padding-right: 1.25rem;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    font-size: 0.875rem;
    line-height: 1.25rem;
    font-weight: 700;
}
.lp-hero-centered-lead {
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 2rem;
    max-width: 48rem;
    font-size: 1rem;
    line-height: 1.625;
    color: rgb(255 255 255 / 0.75);
}
.lp-hero-centered-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.75rem;
}
.lp-hero-assess-copy { text-align: center; }
.lp-hero-assess-actions {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
}
.lp-hero-assess-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    border-radius: 1rem;
    padding-left: 1.75rem;
    padding-right: 1.75rem;
    padding-top: 0.875rem;
    padding-bottom: 0.875rem;
    font-weight: 700;
}
.lp-hero-cta-badge {
    border-radius: 9999px;
    background-color: rgb(255 255 255 / 0.25);
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    padding-top: 0.125rem;
    padding-bottom: 0.125rem;
    font-size: 0.75rem;
    line-height: 1rem;
    font-weight: 800;
}
.lp-hero-consult-link {
    font-size: 0.875rem;
    line-height: 1.25rem;
    font-weight: 600;
    text-decoration-line: underline;
    text-underline-offset: 4px;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
    color: rgb(255 255 255 / 0.75);
}
.lp-hero-consult-link:hover { color: #ffffff; }
.lp-hero-assess-note {
    margin-top: 0.75rem;
    text-align: center;
    font-size: 0.75rem;
    line-height: 1rem;
    color: rgb(255 255 255 / 0.6);
}
.lp-hero-visual-panel { padding: 1rem; }
.lp-hero-doc-row {
    margin-bottom: 1rem;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    gap: 0.5rem;
}
.lp-hero-doc-pdf {
    width: 5rem;
    border-radius: 0.5rem;
    background-color: rgb(255 255 255 / 0.95);
    padding: 0.5rem;
    transform: rotate(-3deg);
    box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
}
.lp-hero-doc-type-pdf {
    display: inline-block;
    border-radius: 0.25rem;
    padding-left: 0.25rem;
    padding-right: 0.25rem;
    padding-top: 0.125rem;
    padding-bottom: 0.125rem;
    font-size: 8px;
    font-weight: 800;
    background-color: #ef4444;
    color: #ffffff;
}
.lp-hero-doc-lines { margin-top: 0.375rem; }
.lp-hero-doc-lines > :not([hidden]) ~ :not([hidden]) { margin-top: 0.25rem; margin-bottom: 0; }
.lp-hero-doc-line { height: 0.25rem; border-radius: 0.25rem; background-color: #cbd5e1; }
.lp-hero-doc-line-long {
    height: 0.25rem;
    width: 80%;
    border-radius: 0.25rem;
    background-color: #e2e8f0;
}
.lp-hero-doc-line-short {
    height: 0.25rem;
    width: 60%;
    border-radius: 0.25rem;
    background-color: #e2e8f0;
}
.lp-hero-doc-name {
    margin-top: 0.375rem;
    font-size: 9px;
    font-weight: 700;
    color: #475569;
}
.lp-hero-doc-excel {
    width: 5rem;
    border-radius: 0.5rem;
    background-color: rgb(255 255 255 / 0.95);
    padding: 0.5rem;
    transform: translateY(0.25rem);
    box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
}
.lp-hero-doc-type-excel {
    display: inline-block;
    border-radius: 0.25rem;
    padding-left: 0.25rem;
    padding-right: 0.25rem;
    padding-top: 0.125rem;
    padding-bottom: 0.125rem;
    font-size: 8px;
    font-weight: 800;
    background-color: #16a34a;
    color: #ffffff;
}
.lp-hero-doc-line-medium {
    height: 0.25rem;
    width: 75%;
    border-radius: 0.25rem;
    background-color: #e2e8f0;
}
.lp-hero-doc-line-half {
    height: 0.25rem;
    width: 50%;
    border-radius: 0.25rem;
    background-color: #e2e8f0;
}
.lp-hero-doc-fax {
    width: 5rem;
    border-radius: 0.5rem;
    background-color: rgb(255 255 255 / 0.95);
    padding: 0.5rem;
    transform: rotate(3deg);
    box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
}
.lp-hero-doc-type-fax {
    display: inline-block;
    border-radius: 0.25rem;
    padding-left: 0.25rem;
    padding-right: 0.25rem;
    padding-top: 0.125rem;
    padding-bottom: 0.125rem;
    font-size: 8px;
    font-weight: 800;
    background-color: #64748b;
    color: #ffffff;
}
.lp-hero-doc-line-faded {
    height: 0.25rem;
    width: 83.333333%;
    border-radius: 0.25rem;
    background-color: rgb(203 213 225 / 0.7);
}
.lp-hero-doc-line-light {
    height: 0.25rem;
    width: 66.666667%;
    border-radius: 0.25rem;
    background-color: rgb(226 232 240 / 0.8);
}
.lp-hero-doc-line-soft {
    height: 0.25rem;
    width: 75%;
    border-radius: 0.25rem;
    background-color: rgb(203 213 225 / 0.6);
}
.lp-hero-arrow-row { margin-bottom: 1rem; display: flex; justify-content: center; }
.lp-hero-arrow-icon { height: 0.875rem; width: 0.875rem; }
.lp-hero-table-card {
    border-radius: 0.75rem;
    padding: 0.75rem;
    background-color: #ffffff;
    box-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25);
}
.lp-hero-table-caption {
    margin-bottom: 0.375rem;
    font-size: 10px;
    font-weight: 700;
    color: #64748b;
}
.lp-hero-compare-table { width: 100%; font-size: 10px; }
.lp-hero-table-head-row { border-bottom-width: 1px; border-color: #e2e8f0; color: #94a3b8; }
.lp-hero-table-item-head {
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
    text-align: left;
    font-weight: 700;
}
.lp-hero-table-vendor-head {
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
    text-align: right;
    font-weight: 700;
}
.lp-hero-table-body { font-weight: 600; color: #334155; }
.lp-hero-table-row { border-bottom-width: 1px; border-color: #f1f5f9; }
.lp-hero-table-item { padding-top: 0.375rem; padding-bottom: 0.375rem; }
.lp-hero-table-price { padding-left: 0.25rem; padding-right: 0.25rem; text-align: right; }
.lp-hero-table-price-lowest {
    border-radius: 0.25rem;
    padding-left: 0.25rem;
    padding-right: 0.25rem;
    text-align: right;
    font-weight: 800;
    background-color: #eff6ff;
    color: #0066ff;
}
.lp-hero-table-price-extra {
    padding-left: 0.25rem;
    padding-right: 0.25rem;
    text-align: right;
    font-weight: 800;
    color: #d97706;
}
.lp-hero-table-legend { margin-top: 0.5rem; font-size: 9px; color: #94a3b8; }
@media (min-width: 640px) {
    .lp-hero-container { max-width: 640px; padding-left: 1.5rem; padding-right: 1.5rem; }
    .lp-hero-eyebrow { font-size: 1rem; line-height: 1.5rem; }
    .lp-hero-lead { font-size: 1.125rem; line-height: 1.75rem; }
    .lp-hero-actions-wrap { flex-direction: row; flex-wrap: wrap; }
    .lp-hero-actions { flex-direction: row; }
    .lp-hero-centered-lead { font-size: 1.125rem; line-height: 1.75rem; }
    .lp-hero-assess-actions { flex-direction: row; flex-wrap: wrap; }
    .lp-hero-visual-panel { padding: 1.25rem; }
    .lp-hero-doc-row { gap: 0.75rem; }
    .lp-hero-doc-pdf { width: 6rem; }
    .lp-hero-doc-excel { width: 6rem; }
    .lp-hero-doc-fax { width: 6rem; }
    .lp-hero-table-card { padding: 1rem; }
    .lp-hero-table-caption { font-size: 0.75rem; line-height: 1rem; }
    .lp-hero-compare-table { font-size: 0.75rem; line-height: 1rem; }
}
@media (min-width: 768px) {
    .lp-hero-container { max-width: 768px; }
}
@media (min-width: 1024px) {
    .lp-hero-section { padding-bottom: 6rem; padding-top: 8rem; }
    .lp-hero-container { max-width: 1024px; padding-left: 2rem; padding-right: 2rem; }
    .lp-hero-layout { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 3.5rem; }
    .lp-hero-copy { order: 1; text-align: left; }
    .lp-hero-lead { margin-left: 0; margin-right: 0; }
    .lp-hero-chips { justify-content: flex-start; }
    .lp-hero-actions-wrap { justify-content: flex-start; }
    .lp-hero-media { order: 2; }
    .lp-hero-actions { justify-content: flex-start; }
    .lp-hero-assess-copy { text-align: left; }
    .lp-hero-assess-actions { justify-content: flex-start; }
    .lp-hero-assess-note { text-align: left; }
}
@media (min-width: 1280px) {
    .lp-hero-container { max-width: 1280px; }
}
@media (min-width: 1536px) {
    .lp-hero-container { max-width: 1536px; }
}

/* ================================================================ lp（AI-OCRを入れた、その後の現実） */
.lp-container {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding-left: 1rem;
    padding-right: 1rem;
}
.lp-content { margin-left: auto; margin-right: auto; max-width: 72rem; }
.lp-centered-lead {
    margin-left: auto;
    margin-right: auto;
    margin-top: 2rem;
    max-width: 48rem;
    text-align: center;
    line-height: 1.625;
    color: #475569;
}
.lp-video { margin-top: 3rem; }
.lp-video-head { text-align: center; }
.lp-video-title {
    font-size: 1.25rem;
    line-height: 1.75rem;
    font-weight: 700;
    color: #111827;
}
.lp-video-intro { margin-left: auto; margin-right: auto; }
.lp-video-button { margin-left: auto; margin-right: auto; max-width: 48rem; }
.lp-video-caption {
    margin-top: 0.75rem;
    text-align: center;
    font-size: 0.875rem;
    line-height: 1.25rem;
    color: #6b7280;
}
.lp-desktop-break { display: none; }
.lp-feature-grid { display: grid; gap: 1rem; }
.lp-icon-card-grid { display: grid; gap: 1rem; }
.lp-table-card { overflow-x: auto; }
.lp-comparison-note { margin-top: 1rem; text-align: center; }
.lp-guide-note {
    margin-top: 0.75rem;
    text-align: center;
    font-size: 0.875rem;
    line-height: 1.25rem;
    color: #475569;
}
.lp-inline-link { font-weight: 600; color: #1d4ed8; }
.lp-inline-link:hover { text-decoration-line: underline; }
.lp-two-column-grid { display: grid; gap: 1rem; }
.lp-doc-type-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.lp-doc-type-card { padding: 1rem; text-align: center; }
.lp-doc-type-icon {
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 0.5rem;
    display: flex;
    height: 2.5rem;
    width: 2.5rem;
    align-items: center;
    justify-content: center;
    border-radius: 0.5rem;
}
.lp-doc-type-icon-svg { height: 1.25rem; width: 1.25rem; }
.lp-doc-type-name {
    font-size: 0.875rem;
    line-height: 1.25rem;
    font-weight: 700;
    color: #334155;
}
.lp-step-description { font-size: 0.875rem; line-height: 1.25rem; color: #64748b; }
.lp-cta-actions { display: flex; flex-direction: column; gap: 0.75rem; }
.lp-cta-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    border-radius: 1rem;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
    font-weight: 700;
}
.lp-closing {
    margin-left: auto;
    margin-right: auto;
    max-width: 56rem;
    text-align: center;
}
.lp-closing-title { margin-bottom: 2rem; }
.lp-closing-text { margin-bottom: 2rem; line-height: 1.625; color: #475569; }
.lp-closing-actions {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 0.75rem;
}
.lp-problem-layout { display: grid; align-items: flex-start; gap: 1.5rem; }
.lp-before-after-card { overflow: hidden; padding: 0; }
.lp-feature-pair-grid { display: grid; gap: 1rem; }
.lp-cta-icon { height: 1rem; width: 1rem; }
.lp-verdict-grid {
    margin-left: auto;
    margin-right: auto;
    display: grid;
    max-width: 72rem;
    gap: 1rem;
}
.lp-section-pill { margin-bottom: 1rem; }
.lp-reason-grid { display: grid; gap: 1rem; }
.lp-tool-note { margin-top: 1rem; }
.lp-tool-list-note { margin-top: 1.25rem; }
.lp-tool-list-link { font-weight: 700; text-decoration-line: underline; }
.lp-logo-block { margin-top: 2rem; }
.lp-logo-caption {
    margin-bottom: 1.25rem;
    text-align: center;
    font-size: 0.875rem;
    line-height: 1.25rem;
    font-weight: 700;
    color: #64748b;
}
.lp-logo-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    column-gap: 2.5rem;
    row-gap: 1.5rem;
}
.lp-logo-image {
    height: 2.5rem;
    width: auto;
    opacity: 0.7;
    filter: grayscale(100%);
}
.lp-logo-image-tall {
    height: 3rem;
    width: auto;
    opacity: 0.7;
    filter: grayscale(100%);
}
.lp-case-link-wrap { margin-top: 1.25rem; text-align: center; }
.lp-case-link {
    font-size: 0.875rem;
    line-height: 1.25rem;
    font-weight: 700;
    color: #0066ff;
}
.lp-case-link:hover { text-decoration-line: underline; }
.lp-flow-grid { display: grid; gap: 1rem; }
.lp-flow-card { padding: 1.5rem; text-align: center; }
.lp-flow-icon {
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 1rem;
    display: flex;
    height: 3.5rem;
    width: 3.5rem;
    align-items: center;
    justify-content: center;
    border-radius: 0.75rem;
}
.lp-flow-icon-svg { height: 1.75rem; width: 1.75rem; }
.lp-flow-step-title { font-weight: 700; color: #334155; }
.lp-input-grid { display: grid; gap: 1rem; }
.lp-input-card { padding: 1.25rem; text-align: center; }
.lp-input-icon {
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 0.75rem;
    display: flex;
    height: 3rem;
    width: 3rem;
    align-items: center;
    justify-content: center;
    border-radius: 0.75rem;
}
.lp-input-icon-svg { height: 1.5rem; width: 1.5rem; }
.lp-doc-type-sublabel { font-size: 0.75rem; line-height: 1rem; color: #64748b; }
.lp-comparison-lead {
    margin-top: 1.25rem;
    font-size: 0.875rem;
    line-height: 1.25rem;
    color: #475569;
}
.lp-benefit-grid { display: grid; gap: 1rem; }
.lp-logo-cloud-wrap { margin-top: 1.5rem; }
.lp-knowledge-diagram {
    margin-left: auto;
    margin-right: auto;
    display: block;
    width: 100%;
    max-width: 32rem;
}
.lp-knowledge-caption {
    margin-top: 0.5rem;
    text-align: center;
    font-size: 0.875rem;
    line-height: 1.25rem;
    color: #6b7280;
}
.lp-dark-section { position: relative; overflow: hidden; }
.lp-dark-container {
    width: 100%;
    position: relative;
    z-index: 10;
    margin-left: auto;
    margin-right: auto;
    padding-left: 1rem;
    padding-right: 1rem;
}
.lp-dark-card-title { margin-bottom: 0.5rem; font-weight: 700; color: #ffffff; }
.lp-dark-card-text { font-size: 0.875rem; line-height: 1.625; color: rgb(255 255 255 / 0.8); }
.lp-dark-note {
    margin-top: 1.25rem;
    font-size: 0.75rem;
    line-height: 1rem;
    color: rgb(255 255 255 / 0.6);
}
.lp-text-link { text-decoration-line: underline; }
.lp-dark-proof-note {
    margin-top: 0.5rem;
    font-size: 0.75rem;
    line-height: 1rem;
    color: rgb(255 255 255 / 0.6);
}
.lp-dark-actions {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
}
.lp-section-cta-badge {
    border-radius: 9999px;
    background-color: rgb(255 255 255 / 0.25);
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    padding-top: 0.125rem;
    padding-bottom: 0.125rem;
    font-size: 0.75rem;
    line-height: 1rem;
    font-weight: 800;
}
.lp-dark-consult-link {
    font-size: 0.875rem;
    line-height: 1.25rem;
    font-weight: 600;
    text-decoration-line: underline;
    text-underline-offset: 4px;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
    color: rgb(255 255 255 / 0.8);
}
.lp-dark-consult-link:hover { color: #ffffff; }
@media (min-width: 640px) {
    .lp-container { max-width: 640px; padding-left: 1.5rem; padding-right: 1.5rem; }
    .lp-desktop-break { display: inline; }
    .lp-doc-type-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .lp-cta-actions { flex-direction: row; }
    .lp-closing-actions { flex-direction: row; }
    .lp-flow-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .lp-input-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .lp-dark-container { max-width: 640px; padding-left: 1.5rem; padding-right: 1.5rem; }
    .lp-dark-actions { flex-direction: row; }
}
@media (min-width: 768px) {
    .lp-container { max-width: 768px; }
    .lp-feature-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .lp-icon-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .lp-two-column-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .lp-doc-type-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
    .lp-reason-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .lp-dark-container { max-width: 768px; }
}
@media (min-width: 1024px) {
    .lp-container { max-width: 1024px; padding-left: 2rem; padding-right: 2rem; }
    .lp-video { margin-top: 4rem; }
    .lp-video-title { font-size: 1.5rem; line-height: 2rem; }
    .lp-feature-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.25rem; }
    .lp-icon-card-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; }
    .lp-two-column-grid { gap: 1.25rem; }
    .lp-problem-layout { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2.5rem; }
    .lp-feature-pair-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; }
    .lp-verdict-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; }
    .lp-reason-grid { gap: 1.25rem; }
    .lp-flow-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .lp-input-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
    .lp-benefit-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; }
    .lp-dark-container { max-width: 1024px; padding-left: 2rem; padding-right: 2rem; }
}
@media (min-width: 1280px) {
    .lp-container { max-width: 1280px; }
    .lp-dark-container { max-width: 1280px; }
}
@media (min-width: 1536px) {
    .lp-container { max-width: 1536px; }
    .lp-dark-container { max-width: 1536px; }
}

/* ================================================================ lp（AI-OCRが向いているケース） */
.lp-numbered-card-badge {
    margin-bottom: 1rem;
    display: flex;
    height: 3rem;
    width: 3rem;
    align-items: center;
    justify-content: center;
    border-radius: 0.75rem;
}
.lp-numbered-card-number { font-size: 1.5rem; line-height: 2rem; font-weight: 900; }
.lp-case-card-title { color: #334155; }
.lp-case-check-list { margin-top: 1rem; }
.lp-verdict-head {
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}
.lp-verdict-icon {
    display: flex;
    height: 2.5rem;
    width: 2.5rem;
    align-items: center;
    justify-content: center;
    border-radius: 0.5rem;
}
.lp-verdict-icon-muted-svg { height: 1.25rem; width: 1.25rem; color: #64748b; }
.lp-verdict-title-muted {
    font-size: 1.125rem;
    line-height: 1.75rem;
    font-weight: 700;
    color: #334155;
}
.lp-verdict-icon-svg { height: 1.25rem; width: 1.25rem; }
.lp-verdict-title { font-size: 1.125rem; line-height: 1.75rem; font-weight: 700; }

/* ================================================================ lp */
.lp-icon-card-svg { height: 1.5rem; width: 1.5rem; }
.lp-compare-label-muted {
    font-size: 0.75rem;
    line-height: 1rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
}
.lp-compare-label {
    font-size: 0.75rem;
    line-height: 1rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* ================================================================ lp-mobile-cta */
.lp-mobile-cta-icon { height: 1rem; width: 1rem; }
.lp-mobile-cta-badge {
    border-radius: 9999px;
    background-color: rgb(255 255 255 / 0.25);
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    padding-top: 0.125rem;
    padding-bottom: 0.125rem;
    font-size: 0.75rem;
    line-height: 1rem;
    font-weight: 800;
}
@media (min-width: 1024px) {
    .lp-mobile-cta { display: none; }
}

/* ================================================================ lp-tool-type-text */
.lp-tool-type-text { margin-bottom: 0.75rem; }

/* ================================================================ lp-diagnosis */
.lp-diagnosis-container {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding-left: 1rem;
    padding-right: 1rem;
}
.lp-diagnosis-content { margin-left: auto; margin-right: auto; max-width: 72rem; }
.lp-diagnosis-layout { display: grid; align-items: flex-start; gap: 2rem; }
.lp-diagnosis-note {
    margin-top: 1rem;
    text-align: center;
    font-size: 0.75rem;
    line-height: 1.625;
    color: #4b5563;
}
@media (min-width: 640px) {
    .lp-diagnosis-container { max-width: 640px; padding-left: 1.5rem; padding-right: 1.5rem; }
}
@media (min-width: 768px) {
    .lp-diagnosis-container { max-width: 768px; }
}
@media (min-width: 1024px) {
    .lp-diagnosis-container { max-width: 1024px; padding-left: 2rem; padding-right: 2rem; }
    .lp-diagnosis-layout { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 3rem; }
}
@media (min-width: 1280px) {
    .lp-diagnosis-container { max-width: 1280px; }
}
@media (min-width: 1536px) {
    .lp-diagnosis-container { max-width: 1536px; }
}

/* ================================================================ lp */
.lp-diagnosis-contact-form > :not([hidden]) ~ :not([hidden]) { margin-top: 1.25rem; margin-bottom: 0; }
.lp-diagnosis-contact-form { color: #111827; }
.lp-form-label {
    margin-bottom: 0.5rem;
    display: block;
    font-size: 0.875rem;
    line-height: 1.25rem;
    font-weight: 700;
    color: #111827;
}
.lp-form-required { color: #ef4444; }
.lp-form-input {
    width: 100%;
    border-radius: 0.75rem;
    border-width: 2px;
    padding-left: 1rem;
    padding-right: 1rem;
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
    font-size: 0.875rem;
    line-height: 1.25rem;
    transition-property: all;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
    border-color: #d1d5db;
}
.lp-form-input:focus { border-color: #0066ff; box-shadow: 0 0 0 2px #0066ff; }
.lp-form-select {
    width: 100%;
    border-radius: 0.75rem;
    border-width: 2px;
    padding-left: 1rem;
    padding-right: 1rem;
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
    font-size: 0.875rem;
    line-height: 1.25rem;
    transition-property: all;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
    border-color: #d1d5db;
    background-color: #ffffff;
}
.lp-form-select:focus { border-color: #0066ff; box-shadow: 0 0 0 2px #0066ff; }
.lp-form-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.lp-form-hint {
    margin-top: 0.25rem;
    font-size: 0.75rem;
    line-height: 1rem;
    color: #6b7280;
}
.lp-form-optional { font-weight: 500; color: #9ca3af; }
.lp-form-consent {
    border-radius: 0.75rem;
    border-width: 2px;
    padding: 1rem;
    border-color: #d1d5db;
    background-color: #f9fafb;
}
.lp-form-consent-label { display: flex; cursor: pointer; align-items: flex-start; }
.lp-form-checkbox {
    margin-top: 0.125rem;
    height: 1.25rem;
    width: 1.25rem;
    border-radius: 0.25rem;
    border-color: #d1d5db;
    color: #0066ff;
}
.lp-form-consent-text {
    margin-left: 0.75rem;
    font-size: 0.875rem;
    line-height: 1.625;
    color: #374151;
}
.lp-form-privacy-link { font-weight: 600; text-decoration-line: underline; color: #0066ff; }
.lp-form-privacy-link:hover { color: #0044cc; }
.lp-form-submit {
    width: 100%;
    border-radius: 1rem;
    padding-left: 2rem;
    padding-right: 2rem;
    padding-top: 1rem;
    padding-bottom: 1rem;
    font-size: 1.125rem;
    line-height: 1.75rem;
    font-weight: 700;
    transition-property: all;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
    color: #ffffff;
    box-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
}
.lp-form-submit:hover { box-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25); }

/* ================================================================ lp-stats */
.lp-stats-band {
    border-bottom-width: 1px;
    padding-top: 2rem;
    padding-bottom: 2rem;
    border-color: #f1f5f9;
    background-color: #ffffff;
}
.lp-stats-container {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding-left: 1rem;
    padding-right: 1rem;
}
.lp-stats-grid { margin-left: auto; margin-right: auto; max-width: 56rem; }
.lp-stats-unit { font-size: 1.5rem; line-height: 2rem; }
.lp-stats-note { margin-top: 1rem; text-align: center; }
@media (min-width: 640px) {
    .lp-stats-container { max-width: 640px; padding-left: 1.5rem; padding-right: 1.5rem; }
}
@media (min-width: 768px) {
    .lp-stats-container { max-width: 768px; }
}
@media (min-width: 1024px) {
    .lp-stats-band { padding-top: 2.5rem; padding-bottom: 2.5rem; }
    .lp-stats-container { max-width: 1024px; padding-left: 2rem; padding-right: 2rem; }
}
@media (min-width: 1280px) {
    .lp-stats-container { max-width: 1280px; }
}
@media (min-width: 1536px) {
    .lp-stats-container { max-width: 1536px; }
}

/* ================================================================ lp-flow-node-kicker */
.lp-flow-node-kicker { margin-bottom: 0; }