/* 色定義 */
:root {
--color-main: #141B4D;
--color-accent: #AF272F;
--color-bg: #e8e8ed;
--color-bg-pickup: #e8e8ed;
--color-text-low: #222;
--color-text-high: #fff;
--color-btn: #141B4D;
--color-btn-text: #fff;
}

/*
ブログ設定の「カラー設定」をカスタムプロパティとして指定しています。
必要に応じ、適宜変更してください。
↓カラー設定の名称→カスタムプロパティ名↓
メイン→　--color-main
アクセント→　--color-accent
ボックス背景→　--color-bg
ピックアップ背景→　--color-bg-pickup
テキスト（基本）→　--color-text-low
テキスト（反転）→　--color-text-high
ボタン→　--color-btn
ボタンテキスト→　--color-btn-text
*/

/* 全体共通 */
body {
	color: var(--color-text-low);
	background-color: #fff;
}

/* メインタイトル下線 */
.service-title {
	border-image: linear-gradient(to right, var(--color-main), 70%, var(--color-accent)) 1;
}

/* 著者情報背景（1カラム時） */
.usecase {
	background-color: #e8e8ed;
}
/* 著者情報、一覧カード背景 */
.usecase .usecase-card .usecase-card-link {
	background-color: #fff;
}
/* 著者情報タイトル背景 */
.usecase .usecase-card .usecase-card-headline {
	color: var(--color-text-high);
	background: -webkit-gradient(linear, left top, right top, from(var(--color-main)), to(var(--color-accent)));
	background: linear-gradient(to right, var(--color-main), 70%, var(--color-accent))
}

/* 本文エリア背景 */
.feature {
	background-color: #fff
}

/* CTAエリア背景 */
.contact {
	background: #e8e8ed;
}
/* CTAエリアテキスト */
.contact .contact-message {
	color: var(--color-main);
}
/* CTAエリアボタン */
.btn-inquiry {
	background-color: var(--color-btn);
	color: var(--color-btn-text);
}
/* ピックアップエリア背景 */
.col-sub .subcontents-inner {
	background-color: var(--color-bg-pickup);
}
/* カテゴリタグ */
.entry-category span {
	background-color: var(--color-main);
	color: var(--color-text-high);
}
/* カテゴリメニュー */
.catmenu {
	background-color: var(--color-bg-pickup);
}
.catmenu .entry-category span {
	color: var(--color-main);
	background-color: var(--color-text-high);
	border-color: var(--color-main);
}
.catmenu .entry-category span:hover {
	background-color: var(--color-bg-pickup);
}
/* 2column調整用 */
.col-2 .usecase {
	background-color: #fff;
}
.col-2 .usecase .usecase-card .usecase-card-link {
	background-color: #e8e8ed;
}