/**
 * 業者一覧ページスタイル
 * Figmaデザイン準拠
 */

/* ========================================
 * SWELLスタイルリセット（archive-factor限定）
 * ======================================== */
html.archive-factor,
body.archive-factor {
    margin: 0 !important;
    padding: 0 !important;
}

body.archive-factor #body_wrap,
body.archive-factor #content,
body.archive-factor .l-content,
body.archive-factor .l-container,
body.archive-factor .l-mainContent,
body.archive-factor .l-article,
body.archive-factor .post_content,
body.archive-factor main,
body.archive-factor article,
body.archive-factor .l-scrollObserver,
body.archive-factor .l-fixHeader,
body.archive-factor .c-mvBtn,
body.archive-factor #wrapper,
body.archive-factor .l-header + * {
    margin: 0 !important;
    padding: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

body.archive-factor .l-mainContent__inner,
body.archive-factor .l-mainContent > *,
body.archive-factor #main_content,
body.archive-factor .l-header__inner,
body.archive-factor .c-mvBtn__btn {
    margin: 0 !important;
    padding: 0 !important;
}

body.archive-factor .l-header {
    margin-bottom: 0 !important;
}

body.archive-factor .l-header + .factor-archive,
body.archive-factor .l-header + main,
body.archive-factor .p-breadcrumb + .factor-archive {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* パンくずリストの余白を削除 */
body.archive-factor .p-breadcrumb {
    margin: 0 !important;
    padding: 0 !important;
}

/* パンくず下のSWELLコンテナ余白対策 */
body.archive-factor #content.l-content.l-container {
    display: none !important;
    margin: 0 !important;
    padding: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
}

body.archive-factor .p-breadcrumb {
    margin: 0 !important;
    padding: 0 !important;
}

body.archive-factor #content.l-content.l-container {
    display: none !important;
    margin: 0 !important;
    padding: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
}

body.archive-factor .factor-archive {
    margin: 0 !important;
    padding: 0 !important;
}

body.archive-factor .l-footer,
body.archive-factor #footer,
body.archive-factor .p-footer {
    display: none !important;
}

body.archive-factor .p-toc,
body.archive-factor .swell-toc,
body.archive-factor .wp-block-swell-toc,
body.archive-factor [class*="p-toc"] {
    display: none !important;
}

body.archive-factor > *:first-child,
body.archive-factor #wrapper,
body.archive-factor #body_wrap > *:first-child {
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
}

/* ========================================
 * 変数（factor-single.css と共通）
 * ======================================== */
:root {
    --fa-primary: #006dff;
    --fa-primary-bg: #f1f5f9;
    --fa-orange: #ff8a00;
    --fa-text: #1f2937;
    --fa-text-secondary: #374151;
    --fa-text-gray: #6b7280;
    --fa-border: #e6e6e6;
    --fa-bg-gray: #f3f4f6;
    --fa-bg-body: #f1f5f9;
    --fa-bg-hero: #e0f0ff;
    --fa-white: #ffffff;
    --fa-star-color: #ffc107;
    --fa-content-width: 80.0625rem; /* 1281px */
    --fa-main-width: 59.5rem;       /* 952px */
    --fa-sidebar-width: 18.6875rem; /* 299px */
    --fa-column-gap: 1.875rem;      /* 30px */
}

/* ========================================
 * メインコンテンツ
 * ======================================== */
.factor-archive {
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding: 0;
    background-color: var(--fa-white);
}

/* ========================================
 * ヒーローエリア（Figma: bg #e0f0ff, px 79.5 py 48, gap 30）
 * ======================================== */
.factor-archive__hero {
    width: 100%;
    background-color: var(--fa-bg-hero);
    padding: 3rem 1.25rem; /* py 48px, px = bodyと同じ */
}

.factor-archive__hero-inner {
    max-width: var(--fa-content-width); /* containerと同じ幅で左端を揃える */
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1.875rem; /* 30px */
}

.factor-archive__hero-title {
    font-family: "Yu Gothic", "YuGothic", sans-serif;
    font-size: 2.5rem; /* 40px */
    font-weight: bold;
    color: #000000;
    margin: 0;
    line-height: 1;
}

/* SearchWrap */
.factor-archive__hero-search-wrap {
    display: flex;
    flex-direction: column;
    gap: 1.25rem; /* 20px */
    align-items: flex-start;
}

.factor-archive__hero-count {
    font-family: "Yu Gothic", "YuGothic", sans-serif;
    font-size: 1.5rem; /* 24px */
    font-weight: bold;
    color: #2b2b2b;
    margin: 0;
    line-height: 1;
}

/* SearchBox（Figma: white bg, rounded 8px, p 20px） */
.factor-archive__hero-search-box {
    background-color: var(--fa-white);
    border-radius: 0.5rem; /* 8px */
    padding: 1.25rem; /* 20px */
}

.factor-archive__hero-search-label {
    font-family: "Yu Gothic", "YuGothic", sans-serif;
    font-size: 1rem; /* 16px */
    font-weight: 500;
    color: #2b2b2b;
    margin: 0.375rem 0; /* 6px top and bottom */
    line-height: 1;
}

.factor-archive__hero-search-text {
    font-family: "Yu Gothic", "YuGothic", sans-serif;
    font-size: 1rem; /* 16px */
    font-weight: 500;
    color: #2b2b2b;
    margin: 0;
    line-height: 1.7;
}

/* ========================================
 * 2カラムレイアウト
 * ======================================== */
.factor-archive__body {
    width: 100%;
    background-color: var(--fa-bg-body);
    padding: 2.5rem 1.25rem;
}

.factor-archive__container {
    max-width: var(--fa-content-width);
    margin: 0 auto;
    display: flex;
    gap: var(--fa-column-gap);
    align-items: flex-start;
}

.factor-archive__main {
    flex: 1;
    min-width: 0;
    max-width: var(--fa-main-width);
}

.factor-archive__sidebar {
    flex-shrink: 0;
    width: var(--fa-sidebar-width);
}

/* ========================================
 * 並べ替え（Figma: 右寄せ、h 30px）
 * ======================================== */

/* 件数（PC非表示・SP表示） */
.factor-archive__sort-count {
    display: none;
}

.factor-archive__sort {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
    height: 1.875rem; /* 30px */
    margin-bottom: 1.875rem; /* 30px gap to cards */
}

.factor-archive__sort-label {
    font-family: "Yu Gothic", "YuGothic", sans-serif;
    font-size: 0.875rem; /* 14px */
    font-weight: 500;
    color: var(--fa-text-gray);
}

.factor-archive__sort-select {
    font-family: "Yu Gothic", "YuGothic", sans-serif;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--fa-text);
    padding: 0.1875rem 2rem 0.1875rem 1.25rem;
    border: 1px solid var(--fa-border);
    border-radius: 0.5rem;
    background-color: var(--fa-white);
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%236b7280' stroke-width='2' fill='none'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.75rem center;
    cursor: pointer;
    height: 1.875rem; /* 30px */
}

/* ========================================
 * カードリスト（Figma: gap 30px）
 * ======================================== */
.factor-archive__cards {
    display: flex;
    flex-direction: column;
    gap: 1.875rem; /* 30px */
}

.factor-archive__empty {
    text-align: center;
    padding: 2.5rem;
    color: var(--fa-text-gray);
    font-size: 1rem;
}

/* ========================================
 * 業者カード（Figma: white, rounded 10px, px 50 py 10）
 * ======================================== */
.factor-archive-card {
    background-color: var(--fa-white);
    border-radius: 0.625rem; /* 10px */
    overflow: hidden;
}

.factor-archive-card__inner {
    padding: 0.625rem 3.125rem; /* py 10px, px 50px */
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* カード上部（Figma: gap 50px, h 216px, w 852px） */
.factor-archive-card__top {
    display: flex;
    gap: 3.125rem; /* 50px */
    align-items: center;
    justify-content: center;
    width: 53.25rem; /* 852px */
    height: 13.5rem; /* 216px */
}

/* ロゴ（Figma: 200x200 container） */
.factor-archive-card__logo {
    flex-shrink: 0;
    width: 12.5rem; /* 200px */
    height: 12.5rem; /* 200px */
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    margin: 0;
}

.factor-archive-card__logo-img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.factor-archive-card__logo-placeholder {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--fa-bg-gray);
    color: var(--fa-text-gray);
    font-size: 0.875rem;
    border-radius: 0.5rem;
}

/* カード情報部（Figma: flex-1, flex-col, items-start, justify-center） */
.factor-archive-card__info {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 13.5rem; /* 216px */
}

/* サービス名（Figma: 32px Bold, black, pt 20px） */
.factor-archive-card__name {
    font-family: "Yu Gothic", "YuGothic", sans-serif;
    font-size: 2rem !important; /* 32px — SWELLのh2上書き対策 */
    font-weight: bold;
    color: #000000;
    margin: 0;
    padding-top: 1.25rem; /* 20px */
    line-height: 1;
}

.factor-archive-card__name a {
    color: inherit;
    text-decoration: none;
}

.factor-archive-card__name a:hover {
    color: var(--fa-primary);
}

/* 評価行（Figma: gap 20px, py 5px） */
.factor-archive-card__rating {
    display: flex;
    align-items: center;
    gap: 1.25rem; /* 20px */
    padding: 0.3125rem 0; /* py 5px */
}

/* 星（Figma: gap 5px, 20x20 each） */
.factor-archive-card__stars {
    display: flex;
    align-items: center;
    gap: 0.3125rem; /* 5px */
}

.factor-archive-card__star {
    font-size: 1.25rem; /* 20px */
    line-height: 1;
}

.factor-archive-card__star--filled {
    color: var(--fa-star-color);
}

.factor-archive-card__star--empty {
    color: #ddd;
}

/* 評価値（Figma: 14px Bold, #ef4444） */
.factor-archive-card__rating-value {
    font-family: "Yu Gothic", "YuGothic", sans-serif;
    font-weight: bold;
    font-size: 0.875rem; /* 14px */
    color: #ef4444;
}

/* 口コミ数（Figma: gap 5px） */
.factor-archive-card__review-count {
    display: flex;
    align-items: center;
    gap: 0.3125rem; /* 5px */
}

.factor-archive-card__review-count svg {
    flex-shrink: 0;
}

/* 口コミリンク（Figma: 14px Bold, #2563eb, underline） */
.factor-archive-card__review-link {
    font-family: "Yu Gothic", "YuGothic", sans-serif;
    font-weight: bold;
    font-size: 0.875rem; /* 14px */
    color: #2563eb;
    text-decoration: underline;
}

.factor-archive-card__review-link:hover {
    text-decoration: none;
}

/* 4指標行（Figma: gap 20px, py 10px, w-full） */
.factor-archive-card__metrics {
    display: flex;
    align-items: center;
    gap: 1.25rem; /* 20px */
    padding: 0.625rem 0; /* py 10px */
    width: 100%;
}

/* 各指標（Figma: py 16px, gap 2px） */
.factor-archive-card__metric {
    display: flex;
    flex-direction: column;
    gap: 0.125rem; /* 2px */
    padding: 1rem 0; /* py 16px */
}

/* ラベル（Figma: 14px Medium, #050505） */
.factor-archive-card__metric-label {
    font-family: "Yu Gothic", "YuGothic", sans-serif;
    font-size: 0.875rem; /* 14px */
    font-weight: 500;
    color: #050505;
}

/* 値（Figma: 20px Bold, black） */
.factor-archive-card__metric-value {
    font-family: "Yu Gothic", "YuGothic", sans-serif;
    font-size: 1.25rem; /* 20px */
    font-weight: bold;
    color: #000000;
}

/* 区切り線（Figma: h 50px） */
.factor-archive-card__metric-divider {
    width: 1px;
    height: 3.125rem; /* 50px */
    background-color: var(--fa-border);
    flex-shrink: 0;
}

/* 概要文（Figma: px 20, py 10, rounded 12, 16px Medium #374151） */
.factor-archive-card__overview {
    font-family: "Yu Gothic", "YuGothic", sans-serif;
    font-size: 1rem; /* 16px */
    font-weight: 500;
    line-height: 1.6;
    color: var(--fa-text-secondary);
    margin: 0;
    padding: 0.625rem 1.25rem; /* py 10px, px 20px */
    border-radius: 0.75rem; /* 12px */
    width: 100%;
    box-sizing: border-box;
}

/* PC: SP用を非表示 */
.factor-archive-card__overview--sp {
    display: none;
}

/* 特徴タグ（PC: 5列グリッド / ノンリコース契約に合わせた均等幅） */
.factor-archive-card__tags {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0.3125rem; /* 5px */
    padding: 0.3125rem 1.25rem; /* py 5px, px 20px */
    width: 100%;
    box-sizing: border-box;
}

/* 各タグ（Figma: h 30px, rounded 10px, 16px Medium） */
.factor-archive-card__tag {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 1.875rem; /* 30px */
    padding: 0 0.625rem; /* 10px - 5列グリッド幅でノンリコース契約が収まるよう調整 */
    border-radius: 0.625rem; /* 10px */
    font-family: "Yu Gothic", "YuGothic", sans-serif;
    font-size: 1rem; /* 16px */
    font-weight: 500;
    box-sizing: border-box;
    white-space: nowrap;
    text-align: center;
    overflow: hidden;
}

/* アクティブタグ（Figma: bg #f1f5f9, border #006dff, text #006dff） */
.factor-archive-card__tag--active {
    background-color: var(--fa-primary-bg);
    border: 1px solid var(--fa-primary);
    color: var(--fa-primary);
}

/* 非アクティブタグ（Figma: bg #f3f4f6, border #e6e6e6, text #6b7280） */
.factor-archive-card__tag--inactive {
    background-color: var(--fa-bg-gray);
    border: 1px solid var(--fa-border);
    color: var(--fa-text-gray);
}

/* CTAボタン行（Figma: gap 16px, pb 20, pt 10） */
.factor-archive-card__actions {
    display: flex;
    justify-content: center;
    gap: 1rem; /* 16px */
    padding-top: 0.625rem; /* 10px */
    padding-bottom: 1.25rem; /* 20px */
}

/* ボタン共通（Figma: px 32 py 16, rounded 8px, 20px） */
.factor-archive-card__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 1rem 2rem; /* py 16px, px 32px */
    border-radius: 0.5rem; /* 8px */
    font-family: "Yu Gothic", "YuGothic", sans-serif;
    font-size: 1.25rem; /* 20px */
    text-decoration: none;
    cursor: pointer;
    transition: opacity 0.2s ease;
    white-space: nowrap;
}

.factor-archive-card__btn:hover {
    opacity: 0.85;
}

/* リストに追加（Figma: white bg, border #006dff, 20px Medium） */
.factor-archive-card__btn--list {
    background-color: var(--fa-white);
    color: var(--fa-primary);
    border: 1px solid var(--fa-primary);
    font-weight: 500;
    display: none; /* TODO: リスト機能実装後に削除 */
}

/* 無料見積もりをする（Figma: bg #ff8a00, 20px Bold, white） */
.factor-archive-card__btn--cta {
    background-color: var(--fa-orange);
    color: var(--fa-white);
    border: none;
    font-weight: bold;
}

/* ========================================
 * ページネーション
 * ======================================== */
.factor-archive__pagination {
    margin-top: 2rem;
    display: flex;
    justify-content: center;
}

.factor-archive__pagination .page-numbers {
    list-style: none;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
    padding: 0;
}

.factor-archive__pagination .page-numbers li {
    margin: 0;
}

.factor-archive__pagination .page-numbers a,
.factor-archive__pagination .page-numbers span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.5rem;
    height: 2.5rem;
    padding: 0 0.75rem;
    border-radius: 0.5rem;
    font-family: "Yu Gothic", "YuGothic", sans-serif;
    font-size: 0.875rem;
    font-weight: 500;
    text-decoration: none;
    transition: all 0.2s ease;
}

.factor-archive__pagination .page-numbers a {
    background-color: var(--fa-white);
    color: var(--fa-text);
    border: 1px solid var(--fa-border);
}

.factor-archive__pagination .page-numbers a:hover {
    background-color: var(--fa-primary-bg);
    border-color: var(--fa-primary);
    color: var(--fa-primary);
}

.factor-archive__pagination .page-numbers span.current {
    background-color: var(--fa-primary);
    color: var(--fa-white);
    border: 1px solid var(--fa-primary);
}

.factor-archive__pagination .page-numbers .prev,
.factor-archive__pagination .page-numbers .next {
    font-size: 0.875rem;
    font-weight: 500;
}

.factor-archive__pagination .page-numbers .dots {
    background: none;
    border: none;
    color: var(--fa-text-gray);
}

/* ========================================
 * サイドバー検索パネル
 * Figma: title外出し、白ボックス内にフォーム、ボタン横並び
 * ======================================== */
.factor-search {
    display: flex;
    flex-direction: column;
}

/* タイトル（Figma: 白ボックスの外、36px text） */
.factor-search__title {
    font-family: "Yu Gothic", "YuGothic", sans-serif;
    font-size: 1.5rem; /* 24px */
    font-weight: bold;
    color: var(--fa-text);
    margin: 0 0 1.5625rem; /* 25px gap to box */
    line-height: 1.5; /* → 36px */
}

/* 白ボックス（Figma: white bg, rounded, p 20px） */
.factor-search__box {
    background-color: var(--fa-white);
    border-radius: 0.625rem;
    padding: 1.25rem; /* 20px */
}

.factor-search__form {
    display: flex;
    flex-direction: column;
    gap: 1.5rem; /* セクション間のgap */
}

.factor-search__section {
    border: none;
    margin: 0;
    padding: 0;
}

/* セクションタイトル（Figma: 30px height → ~20px text + margin） */
.factor-search__section-title {
    font-family: "Yu Gothic", "YuGothic", sans-serif;
    font-size: 0.875rem;
    font-weight: bold;
    color: var(--fa-text);
    margin-bottom: 0.75rem; /* 12px gap */
    padding: 0;
}

/* チェックボックス（Figma: checkbox 22x22, gap 30px in list, gap 36px vertical） */
.factor-search__checkboxes {
    display: flex;
    flex-direction: column;
    gap: 0.75rem; /* 12px */
}

/* 詳細条件セクション: PC は1列（SP は3列に上書き） */
.factor-search__checkboxes--wrap {
    flex-direction: column;
    gap: 0.75rem;
}

.factor-search__checkbox-label {
    display: flex;
    align-items: center;
    gap: 0.5rem; /* 8px */
    cursor: pointer;
}

.factor-search__checkbox-input {
    width: 1.375rem; /* 22px */
    height: 1.375rem; /* 22px */
    accent-color: var(--fa-primary);
    flex-shrink: 0;
    cursor: pointer;
}

.factor-search__checkbox-text {
    font-family: "Yu Gothic", "YuGothic", sans-serif;
    font-size: 0.875rem; /* 14px → Figmaのcheckbox textは~16pxだが、299px幅で収まるよう14px */
    font-weight: 500;
    color: var(--fa-text);
}

/* セレクトボックス（Figma: h 48px, p 12px, rounded） */
.factor-search__select {
    width: auto;
    font-family: "Yu Gothic", "YuGothic", sans-serif;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--fa-text);
    padding: 0.75rem 2.5rem 0.75rem 0.75rem;
    border: 1px solid var(--fa-border);
    border-radius: 0.5rem;
    background-color: var(--fa-white);
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%236b7280' stroke-width='2' fill='none'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.75rem center;
    cursor: pointer;
    height: 3rem; /* 48px */
}

/* ボタン行（Figma: 横並び, gap 16px） */
.factor-search__actions {
    display: flex;
    flex-direction: row;
    gap: 1rem; /* 16px */
    margin-top: 1.25rem; /* 20px */
}

/* ボタン共通（Figma: h 48px, rounded） */
.factor-search__btn {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 3rem; /* 48px */
    padding: 0 1.5rem;
    border-radius: 0.5rem;
    font-family: "Yu Gothic", "YuGothic", sans-serif;
    font-size: 0.875rem;
    font-weight: bold;
    cursor: pointer;
    transition: opacity 0.2s ease;
    white-space: nowrap;
}

.factor-search__btn:hover {
    opacity: 0.85;
}

.factor-search__btn--submit {
    background-color: var(--fa-primary);
    color: var(--fa-white);
    border: none;
}

.factor-search__btn--clear {
    background-color: var(--fa-white);
    color: var(--fa-primary);
    border: 1px solid var(--fa-primary);
}

/* ========================================
 * SP用「検索条件を変更」ボタン（PC非表示）
 * ======================================== */
.factor-archive__hero-count-row {
    display: flex;
    align-items: center;
}

.factor-archive__hero-filter-btn {
    display: none; /* PCでは非表示 */
}

/* ========================================
 * 検索モーダル（PC非表示）
 * ======================================== */
.factor-search-modal {
    display: none;
}

/* ========================================
 * SP レスポンシブ（max-width: 959px）
 * ======================================== */
@media (max-width: 959px) {

    /* --- ヒーロー（Figma SP準拠） --- */
    .factor-archive__hero {
        padding: 1.875rem 1.25rem; /* py 30px, px 20px */
    }

    .factor-archive__hero-inner {
        gap: 0.9375rem; /* 15px */
    }

    .factor-archive__hero-title {
        font-size: 1.75rem; /* 28px */
    }

    .factor-archive__hero-search-wrap {
        gap: 0.9375rem; /* 15px */
    }

    /* SP: 件数はヒーローに非表示（ソートバーへ移動） */
    .factor-archive__hero-count {
        display: none;
    }

    /* SP: ボタンのみ左端 */
    .factor-archive__hero-count-row {
        display: flex;
        align-items: center;
        justify-content: flex-start;
    }

    .factor-archive__hero-filter-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        gap: 0.1875rem; /* 3px */
        width: 10rem; /* 160px */
        height: 2.5rem; /* 40px */
        padding: 0.5rem 0.3125rem; /* py 8px, px 5px */
        background-color: var(--fa-primary);
        color: var(--fa-white);
        border: none;
        border-radius: 0.75rem; /* 12px */
        font-family: "Yu Gothic", "YuGothic", sans-serif;
        font-size: 0.75rem; /* 12px */
        font-weight: bold;
        cursor: pointer;
        white-space: nowrap;
    }

    /* SearchBox SP */
    .factor-archive__hero-search-box {
        padding: 0.625rem 1.25rem; /* py 10px, px 20px */
    }

    .factor-archive__hero-search-label {
        font-size: 0.875rem; /* 14px */
    }

    .factor-archive__hero-search-text {
        font-size: 0.875rem; /* 14px */
    }

    /* --- 2カラム → 1カラム --- */
    .factor-archive__body {
        padding: 0.625rem 1.25rem; /* py 10px, px 20px */
    }

    .factor-archive__container {
        flex-direction: column;
        gap: 0.625rem; /* 10px */
    }

    .factor-archive__main {
        max-width: 100%;
    }

    .factor-archive__sidebar {
        display: none;
    }

    /* --- カード SP --- */

    /* 件数をソートバー左端に表示 */
    .factor-archive__sort-count {
        display: block;
        font-family: "Yu Gothic", "YuGothic", sans-serif;
        font-size: 1rem; /* 16px */
        font-weight: bold;
        color: #2b2b2b;
        flex: 1;
    }

    .factor-archive__sort {
        justify-content: space-between;
        align-items: center;
        margin-bottom: 0.625rem; /* 10px — カードとの間隔 */
        height: auto;
    }

    .factor-archive__sort-label {
        display: none;
    }

    .factor-archive__sort-select {
        height: auto;
        min-height: 1.75rem;
        padding: 0.1875rem 1.75rem 0.1875rem 1.25rem; /* py 3px, pr 28px, pl 20px */
        border: 1px solid #000;
        border-radius: 0.625rem; /* 10px */
        background-color: #f1f5f9;
        font-size: 0.875rem; /* 14px */
        font-weight: 700;
        color: #000;
        background-size: 0.625rem 0.5rem;
        background-position: right 0.625rem center;
        line-height: 1;
    }

    .factor-archive__cards {
        gap: 1.25rem; /* 20px */
    }

    .factor-archive-card {
        border-radius: 0.75rem; /* 12px */
    }

    .factor-archive-card__inner {
        padding: 1.25rem 1.25rem; /* py 20px, px 20px */
        align-items: flex-start;
    }

    .factor-archive-card__top {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 0;
        width: 100%;
        height: auto;
    }

    .factor-archive-card__info {
        display: contents;
        height: auto;
    }

    .factor-archive-card__name {
        order: 1;
        font-size: 1.375rem !important; /* 22px — SWELLのh2上書き対策 */
        padding: 0.4375rem 0; /* py 7px */
        text-align: left;
        width: 100%;
    }

    .factor-archive-card__rating {
        order: 2;
        justify-content: flex-start;
        gap: 1.25rem; /* 20px */
        padding: 0.3125rem 0; /* py 5px */
        width: 100%;
    }

    .factor-archive-card__logo {
        order: 3;
        width: 100%;
        height: 6.25rem; /* 100px */
    }

    .factor-archive-card__logo-img {
        width: 12.4375rem; /* 199px */
        max-width: 100%;
        height: 5.8125rem; /* 93px */
        object-fit: contain;
    }

    /* Figma 183:9576: bg #f3f4f6, flex-wrap, gap 15px, px 20 py 10, rounded 10, 14px, line-height 100% */
    .factor-archive-card__metrics {
        order: 4;
        display: flex;
        flex-wrap: wrap;
        align-items: flex-start;
        align-content: flex-start;
        gap: 0.9375rem; /* 15px */
        width: 100%;
        padding: 0.625rem 1.25rem; /* py 10px, px 20px */
        background-color: #f3f4f6;
        border-radius: 0.625rem; /* 10px */
        box-sizing: border-box;
        font-size: 0.875rem; /* 14px */
        line-height: normal; /* Figma leading-normal */
        white-space: pre-wrap;
    }

    /* 各指標: 2列均等分割（gap 15pxを差し引いた50%） */
    .factor-archive-card__metric {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;
        width: calc(50% - 0.46875rem); /* (100% - 15px gap) / 2 */
        flex: 0 0 calc(50% - 0.46875rem);
        padding: 0;
        gap: 0.3125rem; /* 5px */
        overflow: hidden;
        border-radius: 0.3125rem; /* 5px */
    }

    /* ラベル・値共通: 14px, line-height 1, width 100%（左寄せ固定） */
    .factor-archive-card__metric-label,
    .factor-archive-card__metric-value {
        font-size: 0.875rem; /* 14px */
        line-height: 1; /* 100% */
        width: 100%;
        text-align: left;
    }

    /* ラベル: YuGothic Medium #6b7280 */
    .factor-archive-card__metric-label {
        color: #6b7280;
        font-weight: 500;
    }

    /* 値: YuGothic Bold black */
    .factor-archive-card__metric-value {
        color: #000;
        font-weight: 700;
    }

    .factor-archive-card__metric-divider {
        display: none;
    }

    .factor-archive-card__overview {
        font-size: 1rem; /* 16px */
        line-height: 1.6;
        padding: 1.25rem 0; /* py 20px */
        border-radius: 0.5rem; /* 8px */
        color: #000;
    }

    /* SP: PC用を非表示、SP用を表示 */
    .factor-archive-card__overview--pc {
        display: none;
    }

    .factor-archive-card__overview--sp {
        display: block;
    }

    .factor-archive-card__tags {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.1875rem 0.3125rem; /* row 3px, col 5px */
        padding: 0;
        width: 100%;
    }

    .factor-archive-card__tag {
        font-size: 0.875rem;
        line-height: 1;
        min-height: 1.5rem;
        padding: 0.1875rem 1rem; /* py 3px, px 16px */
        width: 100%;
    }

    .factor-archive-card__tag--active {
        background-color: #e0f0ff;
    }

    .factor-archive-card__actions {
        flex-direction: column;
        gap: 1rem; /* 16px */
        align-items: center;
        padding-top: 0.625rem; /* 10px */
        padding-bottom: 0;
        width: 100%;
    }

    .factor-archive-card__btn {
        height: 3.125rem; /* 50px */
        font-size: 1.25rem; /* 20px */
        line-height: 1;
        padding: 1rem 2rem; /* py 16px, px 32px */
        width: 100%;
        box-sizing: border-box;
    }

    .factor-archive-card__btn--cta {
        order: 1;
    }

    .factor-archive-card__btn--list {
        order: 2;
    }

    .factor-archive__pagination {
        margin-top: 0;
        padding: 1.5rem 0; /* py 24px */
    }

    .factor-archive__pagination .page-numbers {
        gap: 0.5rem; /* 8px */
    }

    .factor-archive__pagination .page-numbers a,
    .factor-archive__pagination .page-numbers span {
        min-width: 3.125rem; /* 50px */
        height: 2rem; /* 32px */
        padding: 0 0.5rem;
        border-radius: 0.375rem; /* 6px */
        font-size: 0.75rem; /* 12px */
        line-height: 1;
    }

    /* --- 検索モーダル --- */
    .factor-search-modal {
        display: none;
        position: fixed;
        inset: 0;
        z-index: 9999;
    }

    .factor-search-modal.is-open {
        display: flex;
        flex-direction: column;
    }

    .factor-search-modal__overlay {
        position: fixed;
        inset: 0;
        background-color: rgba(0, 0, 0, 0.5);
        z-index: -1;
    }

    .factor-search-modal__content {
        display: flex;
        flex-direction: column;
        width: 100%;
        height: 100%;
        background-color: var(--fa-white);
    }

    .factor-search-modal__header {
        display: flex;
        align-items: center;
        justify-content: center;
        position: relative;
        padding: 1rem;
        border-bottom: 1px solid var(--fa-border);
        flex-shrink: 0;
    }

    .factor-search-modal__title {
        font-family: "Yu Gothic", "YuGothic", sans-serif;
        font-size: 1.125rem;
        font-weight: bold;
        color: var(--fa-text);
        margin: 0;
    }

    .factor-search-modal__close {
        position: absolute;
        right: 1rem;
        top: 50%;
        transform: translateY(-50%);
        background: none;
        border: none;
        font-size: 1.5rem;
        color: var(--fa-text-gray);
        cursor: pointer;
        padding: 0.25rem;
        line-height: 1;
    }

    .factor-search-modal__body {
        flex: 1;
        overflow-y: auto;
        padding: 1.25rem;
        -webkit-overflow-scrolling: touch;
    }

    .factor-search-modal__footer {
        display: flex;
        gap: 1rem;
        padding: 1rem 1.25rem;
        border-top: 1px solid var(--fa-border);
        flex-shrink: 0;
        background-color: var(--fa-white);
    }

    .factor-search-modal__footer .factor-search__btn {
        flex: 1;
    }

    /* モーダル内selectを幅いっぱいに */
    .factor-search-modal .factor-search__select {
        width: 100%;
        box-sizing: border-box;
    }

    /* 詳細条件: SP 3列 */
    .factor-search__checkboxes--wrap {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 0.75rem;
    }

    .factor-search__checkboxes--wrap .factor-search__checkbox-label {
        width: calc(33.333% - 0.5rem);
    }

    /* 対応債権: SP 2列 */
    .factor-search__checkboxes--receivable {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 0.75rem;
    }

    .factor-search__checkboxes--receivable .factor-search__checkbox-label {
        width: calc(50% - 0.375rem);
    }
}