@charset "UTF-8";
/*
 * 採用サイト: 職種ごとの色（2026-10-24。求人をカスタム投稿タイプにしたときに、職種ごとの指定を共通の指定にまとめた）
 *
 * 色はプラグイン engawa-jobs が、募集中の職種の並び順で虹色（紫 → 赤 → 黄 → 緑 → 青）に割り当て、
 * 各要素の style 属性で CSS の変数として渡す。
 *   --job-color          職種の色
 *   --job-color-light    グラデーションの明るい側
 *   --job-color-overlay  画像に重ねる半透明の色
 *   --job-color-next     次の職種の色（メニューの帯のグラデーション）
 *   --jobs-gradient      全職種の色を並べたグラデーション（ページ上端の帯。header の style 属性）
 * 募集していない職種（一覧に出ない）は灰色。
 */

/* ページ上端の帯 */
header:after {
	background: var(--jobs-gradient, rgb(255,85,85));
}

/* メニュー（職種一覧） */
header nav ul#gnav > li > ul li.engawa-job:after {
	background: linear-gradient(to bottom, var(--job-color) 0%, var(--job-color-next) 100%);
}
header nav ul#gnav > li > ul li.engawa-job a:hover {
	color: var(--job-color);
}

/* トップの職種の一覧 */
body#home #job article.engawa-job .img .overwrap {
	background: var(--job-color-overlay);
}
body#home #job article.engawa-job .text:after {
	background: linear-gradient(to right, var(--job-color) 0%, var(--job-color-light) 100%);
}
body#home #job article.engawa-job .text h3 {
	color: var(--job-color);
}

/* 職種のページ */
body.engawa-job #contents h1 {
	color: var(--job-color);
	border-bottom: 4px solid var(--job-color);
}
body.engawa-job #contents #detail h2 {
	color: var(--job-color);
}
body.engawa-job #contents #detail h4 {
	color: var(--job-color);
	border-left: 2px solid var(--job-color);
}

/* 各ページ下の「募集職種」 */
body.page #job ul li.engawa-job a {
	color: var(--job-color);
}
body.page #job ul li.engawa-job a:after {
	background-color: var(--job-color);
}