@charset "UTF-8";
/* パートナー検索結果ページ — Figma PC `201:13320` / SP `207:14191`
   絞り込み（.filter-row / .filter-pill）と横長 CTA（.btn--wide）は base.css。 */

/* --------------------------------------------------------------------------
   MV
   -------------------------------------------------------------------------- */

.search-mv {
	/* PC: 帯 136–386 / 中身 206–315 */
	padding-block: 70px;
}

.search-mv__title {
	font-family: var(--font-display);
	font-size: 50px;
	font-weight: 700;
	line-height: 1.2;
	color: #fff;
	font-feature-settings: "palt" 1;
}

.search-mv__lead {
	margin-top: 22px;
	font-size: var(--fs-lead);
	line-height: 1.7;
	color: #fff;
	opacity: 0.6;
}

/* --------------------------------------------------------------------------
   結果エリア（絞り込み → 件数 → カード → ページャ → 注記）
   -------------------------------------------------------------------------- */

.search-results {
	/* PC: グレー帯 386–2748 / 絞り込み 442 / 注記下端 2708 */
	padding-top: 56px;
	padding-bottom: 40px;
}

.search-filters {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.search-filters__cta {
	display: flex;
	justify-content: center;
	/* 絞り込み下端 614 → ボタン 653 */
	margin-top: 39px;
}

.search-filters__clear {
	display: flex;
	justify-content: center;
	margin-top: 16px;
}

/* 絞り込みと結果を分ける罫線（Figma `201:14061` は 2px の角丸ライン） */
.search-results__rule {
	height: 2px;
	/* ボタン下端 710 → 罫線 750 */
	margin: 40px 0 0;
	background: var(--c-border);
	border: 0;
	border-radius: 1px;
}

.search-meta {
	display: flex;
	gap: 20px;
	align-items: center;
	justify-content: space-between;
	/* 罫線下端 752 → 件数 803 */
	margin-top: 51px;
}

.search-meta__count {
	font-size: 15px;
	font-weight: 500;
	line-height: 1.5;
	color: var(--c-text);
}

.search-sort {
	display: flex;
	align-items: center;
	font-size: 13px;
	line-height: 1.2;
	color: var(--c-text);
}

/* 区切りは Figma どおり「全角スペース + | + 全角スペース」 */
.search-sort__item + .search-sort__item::before {
	content: "　|　";
}

.search-sort__item a:hover {
	color: var(--c-primary);
}

/* 現在の並び順 */
.search-sort__item a[aria-current] {
	text-decoration: underline;
}

/* --------------------------------------------------------------------------
   カード一覧
   -------------------------------------------------------------------------- */

.partner-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(370px, 1fr));
	gap: 27px clamp(27px, 3vw, 45px);
	/* 件数行下端 825 → カード 887 */
	margin-top: 62px;
}

/* 絞り込み結果0件時のメッセージ（フィードバック No.36。「条件をクリア」は
   常設ボタンとして .search-filters__clear 側に置くため、ここはテキストのみ） */
.partner-empty {
	width: 100%;
	padding: 60px 20px;
	font-size: var(--fs-body);
	color: var(--c-text);
	text-align: center;
	grid-column: 1 / -1;
}

.partner-card {
	display: flex;
	flex-direction: column;
	min-height: 510px;
	background: #fff;
	border: 1px solid var(--c-border);
	border-radius: var(--radius-card);
}

/* 中身 25–400、罫線 428。下 28px は中身が短いカードでも空ける。 */
.partner-card__body {
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: 20px;
	align-items: flex-start;
	padding: 25px 24px 28px;
}

/* --- 属性バッジ --- */

.partner-card__badges {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.partner-badge {
	display: inline-flex;
	gap: 4px;
	align-items: center;
	justify-content: center;
	/* 高さは Figma 実測の 23px。縦 padding にすると枠線ぶん 25px になる。 */
	min-height: 23px;
	padding-inline: 8px;
	font-family: var(--font-mono);
	font-size: 10px;
	font-weight: 700;
	line-height: 1.5;
	border: 1px solid transparent;
	border-radius: 5px;
}

.partner-badge--category {
	color: var(--c-tag-text);
	background: var(--c-bg-pale);
}

.partner-badge--region {
	color: var(--c-muted);
	background: var(--c-bg-gray);
	border-color: var(--c-border);
}

.partner-badge--sample {
	color: #316e89;
	background: var(--c-bg-pale);
}

.partner-badge img {
	flex: none;
	width: 5px;
	height: 5px;
}

/* --- 社名・活用例 --- */

.partner-card__main {
	display: flex;
	flex-direction: column;
	gap: 10px;
	width: 100%;
}

.partner-card__head {
	display: flex;
	gap: 13px;
	align-items: center;
}

.partner-card__logo {
	flex: none;
	width: 134px;
	height: 70px;
	object-fit: contain;
}

/* ロゴ画像が未支給のあいだは Figma のプレースホルダをそのまま出す */
.partner-card__logo--empty {
	display: grid;
	place-items: center;
	font-family: var(--font-display);
	font-size: 20px;
	font-weight: 700;
	line-height: 1.3;
	color: #000;
	background: var(--c-placeholder);
}

.partner-card__name {
	font-family: var(--font-display);
	font-size: 20px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--c-heading);
	font-feature-settings: "palt" 1;
}

.partner-card__label {
	font-family: var(--font-display);
	font-size: 14px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--c-muted);
	text-transform: uppercase;
	font-feature-settings: "palt" 1;
}

.partner-card__text {
	font-size: 14px;
	line-height: 1.7;
	color: var(--c-text);
	/* フィードバック No.19: カードのUse case本文は最大3行、以降は省略（詳細ページで全文表示） */
	display: -webkit-box;
	overflow: hidden;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
}

/* --- 実績の 2 カラム --- */

.partner-card__stats {
	display: grid;
	/* 2 列目は Figma だと常に x=157 から始まる（Figma の 2 列目は 121px 固定だが、
	   固定にするとこのボックスの最小幅がカード幅を押し広げてしまうので 1fr） */
	grid-template-columns: 157px 1fr;
	width: 100%;
	min-height: 89px;
	padding: 18px 22px 17px;
	background: var(--c-bg-gray);
	border-radius: var(--radius-card);
	column-gap: 20px;
}

.partner-stat {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.partner-stat__value {
	font-family: var(--font-display);
	/* フィードバック No.7: 社名（.partner-card__name 20px）と揃うか1ポイント小さくする */
	font-size: 19px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--c-heading);
}

/* 後半の和文だけ小さくアクセント色にする（Figma 実測） */
.partner-stat__unit {
	font-size: 15px;
	color: var(--c-tag-text);
}

.partner-stat__label {
	font-size: 12px;
	line-height: 1.3;
	color: var(--c-text);
}

/* --- キーワード --- */

.partner-card__keywords {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.partner-keyword {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 23px;
	padding-inline: 8px;
	font-family: var(--font-mono);
	font-size: 10px;
	line-height: 1.5;
	color: var(--c-muted);
	background: #fff;
	border: 1px solid var(--c-border);
	border-radius: 5px;
}

/* --- ボタン --- */

.partner-card__actions {
	display: flex;
	gap: 22px;
	margin-top: auto;
	/* 罫線 428 → ボタン 445–491 → カード下端 510 */
	padding: 16px 24px 19px;
	border-top: 1px solid var(--c-border);
}

.partner-card__detail,
.partner-card__site {
	display: inline-flex;
	flex: 1;
	gap: 10px;
	align-items: center;
	justify-content: center;
	min-height: 46px;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.4;
	border: 1px solid transparent;
	border-radius: 5px;
	transition: background-color 0.2s ease, border-color 0.2s ease;
}

.partner-card__detail {
	color: #fff;
	background: var(--c-primary);
}

.partner-card__detail:hover {
	background: var(--c-primary-dark);
}

.partner-card__site {
	color: var(--c-heading);
	background: #fff;
	border-color: var(--c-border);
}

.partner-card__site:hover {
	border-color: var(--c-heading);
}

.partner-card__site img {
	flex: none;
	width: 19px;
	height: 19px;
}

/* --------------------------------------------------------------------------
   ページャ
   -------------------------------------------------------------------------- */

.pager {
	/* カード下端 2471 → ページャ 2556 */
	margin-top: 85px;
}

.pager__list {
	display: flex;
	gap: 12px;
	align-items: center;
	justify-content: center;
}

.pager__item {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 45px;
	font-family: var(--font-num);
	font-size: 16px;
	font-weight: 500;
	line-height: 1.2;
	color: var(--c-primary);
	background: #fff;
	border: 1px solid var(--c-primary);
	transition: color 0.2s ease, background-color 0.2s ease;
}

a.pager__item:hover {
	color: #fff;
	background: var(--c-primary);
}

/* 現在ページは枠も背景も無し */
.pager__item--current {
	background: none;
	border-color: transparent;
}

/* 省略記号（…）はクリック不可、枠も背景も無し */
.pager__item--ellipsis {
	background: none;
	border-color: transparent;
	color: var(--c-text);
}

.pager__item--next,
.pager__item--prev {
	background: var(--c-primary);
}

/* 元アセットは左向き。次ページなので反転させる。前ページはそのままの向きで使う。 */
.pager__item--next img,
.pager__item--prev img {
	width: 12px;
	height: 14px;
}

.pager__item--next img {
	transform: rotate(180deg);
}

/* --------------------------------------------------------------------------
   注記
   -------------------------------------------------------------------------- */

.search-note {
	/* ページャ下端 2601 → 注記 2666 */
	margin-top: 65px;
	font-size: 14px;
	line-height: 1.5;
	color: var(--c-text);
}

.search-note a {
	color: var(--c-tag-text);
	text-decoration: underline;
}

/* --------------------------------------------------------------------------
   SP
   -------------------------------------------------------------------------- */

@media (max-width: 767px) {
	.search-mv {
		/* SP: 帯 100–274 / 中身 138–242 */
		padding-top: 38px;
		padding-bottom: 32px;
	}

	.search-mv__title {
		font-size: 30px;
	}

	.search-mv__lead {
		margin-top: 22px;
		font-size: 14px;
	}

	.search-results {
		/* SP: グレー帯 274–5094 / 絞り込み 294 */
		padding-top: 20px;
		padding-bottom: 60px;
	}

	.search-filters {
		gap: 17px;
	}

	.search-filters__cta {
		/* 絞り込み下端 667 → ボタン 689 */
		margin-top: 22px;
	}

	.search-filters__clear {
		margin-top: 12px;
	}

	/* SP に罫線は無い */
	.search-results__rule {
		display: none;
	}

	/* SP は並び替えが上、件数が下でどちらも中央寄せ */
	.search-meta {
		flex-direction: column-reverse;
		gap: 20px;
		align-items: center;
		/* ボタン下端 741 → 並び替え 770 */
		margin-top: 29px;
	}

	.partner-grid {
		grid-template-columns: 1fr;
		gap: 25px;
		/* 件数行下端 828 → カード 859 */
		margin-top: 31px;
	}

	.partner-card {
		min-height: 425px;
	}

	.partner-card__body {
		gap: 10px;
		/* 中身 17–332、罫線 354 */
		padding: 17px 12px 22px;
	}

	.partner-card__main {
		gap: 6px;
	}

	.partner-card__head {
		gap: 10px;
	}

	.partner-card__logo {
		width: 125px;
		height: 65px;
	}

	.partner-card__name {
		font-size: 18px;
	}

	.partner-card__stats {
		min-height: 72px;
		/* 中身 278px が枠の中央に来る */
		padding: 12px 16px;
	}

	.partner-stat {
		gap: 4px;
	}

	.partner-card__actions {
		/* 罫線 354 → ボタン 367–411 → カード下端 425 */
		padding: 12px 12px 14px;
	}

	.partner-card__detail,
	.partner-card__site {
		min-height: 44px;
	}

	.pager {
		/* カード下端 4884 → ページャ 4943 */
		margin-top: 59px;
	}

	.search-note {
		margin-top: 40px;
	}
}