/* Chubby 採用ブログ */
:root {
	--b-orange: #F7931E;
	--b-orange-d: #E07B00;
	--b-navy: #2B3A4E;
	--b-base: #FFF8ED;
	--b-text: #333;
	--b-muted: #7a6f63;
	--b-line: #F1E3CC;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
	margin: 0;
	background: var(--b-base);
	color: var(--b-text);
	font-family: "Noto Sans JP", sans-serif;
	font-size: 16px;
	line-height: 1.9;
	letter-spacing: 0.03em;
}
img { max-width: 100%; height: auto; display: block; }
a { color: var(--b-orange-d); }
.en { font-family: "Montserrat", sans-serif; }

/* ヘッダー */
.b_header {
	position: sticky;
	top: 0;
	z-index: 10;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 12px 24px;
	background: #fff;
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
}
.b_logo { display: flex; align-items: center; gap: 12px; color: var(--b-navy); text-decoration: none; }
.b_logo img { width: 120px; }
.b_logo span { font-family: "Montserrat", sans-serif; font-weight: 800; font-style: italic; font-size: 14px; letter-spacing: 0.1em; }
.b_nav { display: flex; align-items: center; gap: 8px; }
.b_nav a {
	padding: 8px 14px;
	color: var(--b-navy);
	font-size: 14px;
	font-weight: 700;
	text-decoration: none;
	white-space: nowrap;
}
.b_nav a.-entry { background: var(--b-navy); color: #fff; border-radius: 40px; padding-inline: 22px; }

/* パンくず */
.b_crumb { max-width: 880px; margin: 24px auto 0; padding: 0 20px; font-size: 13px; color: var(--b-muted); }
.b_crumb ol { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; }
.b_crumb li + li::before { content: "›"; margin-right: 6px; }
.b_crumb a { color: var(--b-muted); }

/* 記事 */
.b_article { max-width: 880px; margin: 16px auto 80px; padding: 0 20px; }
.b_card { background: #fff; border-radius: 20px; padding: 56px 64px; box-shadow: 0 6px 24px rgba(0, 0, 0, 0.05); }
.b_meta { display: flex; flex-wrap: wrap; gap: 8px 16px; align-items: center; font-size: 13px; color: var(--b-muted); }
.b_cat { display: inline-block; padding: 2px 12px; background: var(--b-orange); color: #fff; border-radius: 40px; font-weight: 700; }
.b_title { margin: 16px 0 24px; color: var(--b-navy); font-size: 30px; line-height: 1.5; letter-spacing: 0.04em; }
.b_lead { padding: 20px 24px; background: var(--b-base); border-left: 5px solid var(--b-orange); border-radius: 0 12px 12px 0; }
.b_lead p { margin: 0; }
.b_lead p + p { margin-top: 0.8em; }

/* 目次 */
.b_toc { margin: 40px 0; padding: 24px 28px; border: 2px solid var(--b-line); border-radius: 14px; }
.b_toc_ttl { margin: 0 0 8px; font-weight: 700; color: var(--b-navy); }
.b_toc ol { margin: 0; padding-left: 1.4em; }
.b_toc a { color: var(--b-text); text-decoration: none; }
.b_toc a:hover { color: var(--b-orange-d); text-decoration: underline; }

.b_body h2 {
	position: relative;
	margin: 64px 0 24px;
	padding: 14px 20px 14px 24px;
	background: var(--b-navy);
	color: #fff;
	font-size: 22px;
	line-height: 1.5;
	border-radius: 10px;
}
.b_body h2::before {
	content: "";
	position: absolute;
	left: 0;
	top: 12px;
	bottom: 12px;
	width: 6px;
	background: var(--b-orange);
	border-radius: 0 4px 4px 0;
}
.b_body h3 {
	margin: 40px 0 16px;
	padding-bottom: 8px;
	border-bottom: 3px solid var(--b-orange);
	color: var(--b-navy);
	font-size: 19px;
	line-height: 1.5;
}
.b_body p { margin: 0 0 1.2em; }
.b_body strong { background: linear-gradient(transparent 62%, #FFE1B3 62%); }
.b_body ul, .b_body ol { margin: 0 0 1.4em; padding-left: 1.4em; }
.b_body li + li { margin-top: 0.3em; }

/* 表 */
.b_table { width: 100%; margin: 0 0 1.6em; border-collapse: collapse; font-size: 15px; }
.b_table th, .b_table td { padding: 12px 14px; border: 1px solid var(--b-line); text-align: left; vertical-align: top; }
.b_table th { width: 30%; background: var(--b-base); color: var(--b-navy); white-space: nowrap; }

/* 数字ボックス */
.b_nums { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin: 0 0 1.6em; padding: 0; list-style: none; }
.b_nums li { margin: 0 !important; padding: 18px 12px; background: var(--b-base); border-radius: 14px; text-align: center; font-size: 13px; line-height: 1.5; }
.b_nums b { display: block; color: var(--b-orange-d); font-size: 28px; line-height: 1.3; }
.b_nums b small { font-size: 14px; }

/* フロー */
.b_flow { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 0 0 1.4em; padding: 0; list-style: none; }
.b_flow li { margin: 0 !important; padding: 10px 16px; background: #fff; border: 2px solid var(--b-orange); border-radius: 40px; font-weight: 700; font-size: 14px; color: var(--b-navy); }
.b_flow li + li::before { content: "→"; margin: 0 10px 0 -2px; color: var(--b-orange); }
.b_flow li + li { border: 0; padding-left: 0; background: none; }

/* FAQ */
.b_faq dt { position: relative; margin-top: 20px; padding: 14px 16px 14px 52px; background: var(--b-base); border-radius: 12px; font-weight: 700; color: var(--b-navy); }
.b_faq dt::before, .b_faq dd::before {
	position: absolute;
	left: 14px;
	top: 12px;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	color: #fff;
	font-family: "Montserrat", sans-serif;
	font-weight: 800;
	font-size: 14px;
	line-height: 28px;
	text-align: center;
}
.b_faq dt::before { content: "Q"; background: var(--b-orange); }
.b_faq dd { position: relative; margin: 0; padding: 14px 16px 6px 52px; }
.b_faq dd::before { content: "A"; background: var(--b-navy); }

/* CTA */
.b_cta { margin-top: 56px; padding: 40px 32px; background: linear-gradient(135deg, #FDC056, #F7931E); border-radius: 18px; text-align: center; color: #fff; }
.b_cta p { margin: 0 0 20px; font-size: 20px; font-weight: 700; line-height: 1.6; }
.b_cta .btns { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; }
.b_btn { display: inline-block; padding: 14px 36px; border-radius: 50px; font-weight: 700; text-decoration: none; }
.b_btn.-main { background: var(--b-navy); color: #fff; }
.b_btn.-sub { background: #fff; color: var(--b-orange-d); }

.b_note { font-size: 13px; color: var(--b-muted); }

/* 一覧 */
.b_list_head { max-width: 1080px; margin: 48px auto 0; padding: 0 20px; }
.b_list_head .en { margin: 0; font-size: 56px; font-weight: 800; font-style: italic; color: var(--b-navy); line-height: 1.1; }
.b_list_head h1 { margin: 8px 0 0; font-size: 18px; color: var(--b-navy); }
.b_list_head p { margin: 16px 0 0; color: var(--b-muted); font-size: 15px; }
.b_list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; max-width: 1080px; margin: 40px auto 96px; padding: 0 20px; list-style: none; }
.b_item a { display: block; height: 100%; background: #fff; border-radius: 16px; overflow: hidden; color: var(--b-text); text-decoration: none; box-shadow: 0 6px 20px rgba(0, 0, 0, 0.06); transition: transform 0.2s, box-shadow 0.2s; }
.b_item a:hover { transform: translateY(-4px); box-shadow: 0 10px 28px rgba(0, 0, 0, 0.1); }
.b_item img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.b_item_txt { padding: 18px 20px 22px; }
.b_item_ttl { margin: 10px 0 0; color: var(--b-navy); font-size: 16px; line-height: 1.6; font-weight: 700; }

/* アイキャッチ */
.b_eye { margin: 0 0 32px; border-radius: 14px; overflow: hidden; }
.b_eye img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }

.b_footer { padding: 32px 20px; background: var(--b-navy); color: #fff; text-align: center; font-size: 13px; }
.b_footer a { color: #fff; }

@media (max-width: 743px) {
	body { font-size: 15px; line-height: 1.85; }
	.b_header { padding: 10px 16px; }
	.b_logo img { width: 96px; }
	.b_logo span { display: none; }
	.b_nav a { padding: 6px 8px; font-size: 12px; }
	.b_nav a.-entry { padding-inline: 14px; }
	.b_nav a.-top { display: none; }
	.b_crumb { margin-top: 16px; padding: 0 16px; font-size: 12px; }
	.b_article { padding: 0 12px; margin-bottom: 56px; }
	.b_card { padding: 32px 20px; border-radius: 14px; }
	.b_title { font-size: 22px; }
	.b_lead { padding: 16px 18px; }
	.b_toc { padding: 18px 20px; }
	.b_body h2 { margin-top: 48px; font-size: 18px; padding: 12px 14px 12px 20px; }
	.b_body h3 { font-size: 17px; }
	.b_table { font-size: 14px; }
	.b_table th, .b_table td { display: block; width: 100%; border-top: 0; }
	.b_table tr:first-child th { border-top: 1px solid var(--b-line); }
	.b_table th { white-space: normal; }
	.b_nums { grid-template-columns: 1fr 1fr; }
	.b_nums b { font-size: 24px; }
	.b_flow { flex-direction: column; align-items: flex-start; }
	.b_flow li + li::before { content: "↓"; display: block; margin: 0 0 4px 12px; }
	.b_flow li + li { padding: 0 16px; }
	.b_cta { padding: 32px 20px; }
	.b_cta p { font-size: 17px; }
	.b_list_head .en { font-size: 40px; }
	.b_list { grid-template-columns: 1fr; gap: 16px; }
}

/* 2026-10-20 記事内の引用・写真・リンク一覧（会社の取り組み記事で追加） */
.b_quote { margin: 24px 0; padding: 20px 24px; background: var(--b-base); border-left: 4px solid var(--b-orange); border-radius: 0 10px 10px 0; }
.b_quote p { margin: 0; font-weight: 700; line-height: 1.8; }
.b_quote cite { display: block; margin-top: 10px; font-size: 13px; font-style: normal; color: var(--b-muted); }
.b_figs { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin: 24px 0; }
.b_fig { margin: 0; }
.b_fig img { display: block; width: 100%; height: auto; border-radius: 12px; }
.b_fig figcaption { margin-top: 8px; font-size: 13px; color: var(--b-muted); text-align: center; }
.b_links { padding-left: 1.2em; }
.b_links li + li { margin-top: 8px; }
.b_links a { color: var(--b-orange-d); word-break: break-all; }
@media (max-width: 743px) {
	.b_figs { gap: 10px; }
	.b_quote { padding: 16px 18px; }
}

/* 2026-10-20 要点ボックス・関連記事・求人ページの表 */
.b_point { margin: 28px 0; padding: 20px 24px; background: #fff; border: 2px solid var(--b-orange); border-radius: 14px; }
.b_point_ttl { margin: 0 0 10px; color: var(--b-orange-d); font-weight: 700; }
.b_point ul { margin: 0; padding-left: 1.2em; }
.b_point li + li { margin-top: 6px; }
.b_point dl { display: grid; grid-template-columns: 7em 1fr; gap: 8px 16px; margin: 0; }
.b_point dt { font-weight: 700; color: var(--b-navy); }
.b_point dd { margin: 0; }
.b_related { margin-top: 40px; padding: 20px 24px; background: var(--b-base); border-radius: 14px; }
.b_related_ttl { margin: 0 0 8px; font-weight: 700; color: var(--b-navy); }
.b_job td p { margin: 0 0 .6em; }
.b_job td p:last-child { margin-bottom: 0; }
@media (max-width: 743px) {
	.b_point { padding: 16px 18px; }
	.b_point dl { grid-template-columns: 5.5em 1fr; gap: 6px 12px; }
	.b_related { padding: 16px 18px; }
}
/* 2026-10-20 紺→Chubbyのオレンジ（採用サイトTOPとそろえる） */
.b_nav a.-entry { background: #E8622E; }
.b_footer { background: #F7931E; }

/* 2026-10-20 記事内の動画・縦長写真 */
.b_video { margin: 24px auto; max-width: 420px; }
.b_video video { display: block; width: 100%; height: auto; border-radius: 12px; background: #000; }
.b_video figcaption, .b_fig.-tall figcaption { margin-top: 8px; font-size: 13px; color: var(--b-muted); text-align: center; }
.b_fig.-tall { max-width: 420px; margin: 24px auto; }
.b_body > .b_fig { margin: 24px 0; }
.b_video.-wide { max-width: 100%; }