@charset "UTF-8";
/* ==========================================================
   製品紹介ページ共通（/web/ /ksn/ /ksnp/ /webr/ /ksnr/ /abm/ など）
   ========================================================== */

/* パンくず */
.ms-crumb {
	padding: 14px 0;
	font-size: 13px;
	border-bottom: 1px solid #ececec;
	background: #fff;
}

.ms-crumb a {
	color: #666;
}

.ms-crumb span {
	margin: 0 6px;
	color: #aaa;
}

/* ヒーロー */
.pd-hero {
	position: relative;
	padding: 70px 0 76px;
	background: linear-gradient(120deg, #f4f7f8 0%, #e6eef1 100%);
	overflow: hidden;
}

.pd-hero::before {
	content: "";
	position: absolute;
	top: -120px;
	right: -120px;
	width: 420px;
	height: 420px;
	border-radius: 50%;
	background: rgba(0,188,212,.08);
}

.pd-hero::after {
	content: "";
	position: absolute;
	bottom: -160px;
	left: 30%;
	width: 360px;
	height: 360px;
	border-radius: 50%;
	background: rgba(0,188,212,.05);
}

.pd-hero__inner {
	position: relative;
	z-index: 1;
	display: flex;
	align-items: center;
	gap: 50px;
}

.pd-hero__text {
	flex: 1;
	text-align: left;
}

.pd-hero__label {
	display: inline-block;
	margin: 0;
	padding: 4px 14px;
	font-size: 13px;
	font-weight: 700;
	color: #fff;
	background: #00a5bb;
	border-radius: 20px;
}

.pd-hero__title {
	margin-top: 16px;
	font-size: 38px;
	font-weight: 700;
	line-height: 1.35;
	color: #222;
	text-transform: none;
}

.pd-hero__product {
	margin-top: 6px;
	font-size: 18px;
	color: #555;
}

.pd-hero__product strong {
	color: #00a5bb;
}

.pd-hero__lead {
	margin-top: 20px;
	font-size: 16px;
	line-height: 1.95;
	color: #333;
}

.pd-hero__btns {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 30px;
}

.pd-hero__btns .button {
	margin: 0;
	min-width: 200px;
}

.pd-hero__logo {
	flex: 0 0 360px;
	padding: 50px 30px;
	text-align: center;
	background: #fff;
	border-radius: 12px;
	box-shadow: 0 10px 30px rgba(0,50,60,.1);
}

.pd-hero__logo img {
	display: block;
	width: auto;
	max-width: 100%;
	height: auto;
	margin: 0 auto;
}

/* 主な機能 */
.pd-feats {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 28px;
	margin-top: 40px;
	text-align: left;
}

.pd-feat {
	display: flex;
	flex-direction: column;
	padding: 30px 28px 24px;
	color: #333;
	background: #fff;
	border: 1px solid #e3e8ea;
	border-radius: 10px;
	transition: transform .2s, box-shadow .2s, border-color .2s;
}

a.pd-feat, a.pd-feat:link, a.pd-feat:visited, a.pd-feat:hover, a.pd-feat:focus, .pd-feat * { text-decoration: none; }
.pd-feat:hover,
.pd-feat:focus {
	color: #333;
	border-color: #bfe3e9;
	transform: translateY(-4px);
	box-shadow: 0 12px 28px rgba(0,60,70,.12);
}

.pd-feat__icon {
	display: block;
	width: 64px;
	height: 64px;
	border-radius: 14px;
}

.pd-feat__title {
	margin-top: 18px;
	font-size: 18px;
	font-weight: 700;
	line-height: 1.45;
	color: #222;
	text-transform: none;
}

.pd-feat__text {
	flex: 1;
	margin-top: 10px;
	font-size: 14px;
	line-height: 1.85;
	color: #555;
}

.pd-feat__more {
	display: block;
	margin-top: 16px;
	padding-top: 14px;
	font-size: 14px;
	font-weight: 700;
	color: #00a5bb;
	text-align: right;
	border-top: 1px solid #eef1f2;
}

.pd-feat__more::after {
	content: " \203A";
}

/* 機能一覧 */
.pd-listsec {
	padding-top: 0;
}

.pd-list {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 12px;
	margin: 36px 0 0;
	padding: 0;
	list-style: none;
	text-align: left;
}

.pd-list li {
	margin: 0;
}

.pd-list a {
	position: relative;
	display: flex;
	align-items: center;
	height: 100%;
	min-height: 54px;
	padding: 10px 34px 10px 16px;
	font-size: 14px;
	line-height: 1.5;
	color: #333;
	background: #f6f8f9;
	border: 1px solid #e6eaec;
	border-radius: 8px;
	text-decoration: none;
	transition: background .2s, color .2s, border-color .2s;
}

.pd-list a::after {
	content: "";
	position: absolute;
	right: 16px;
	top: 50%;
	width: 7px;
	height: 7px;
	border-top: 2px solid #9aa6ab;
	border-right: 2px solid #9aa6ab;
	transform: translateY(-50%) rotate(45deg);
}

.pd-list a:hover,
.pd-list a:focus {
	color: #fff;
	background: #00a5bb;
	border-color: #00a5bb;
	text-decoration: none;
}

.pd-list a:hover::after,
.pd-list a:focus::after {
	border-color: #fff;
}

/* 製品比較：表示中の製品 */
.cmp-card.is-current {
	position: relative;
	border: 2px solid #3d4449;
	box-shadow: 0 10px 26px rgba(0,0,0,.14);
}

.cmp-card.is-current .cmp-head::after {
	content: "表示中の製品";
	position: absolute;
	top: 14px;
	right: 14px;
	padding: 2px 10px;
	font-size: 11px;
	font-weight: 700;
	color: #3d4449;
	background: #fff;
	border-radius: 3px;
}

@media (max-width: 1199px) {
	.pd-hero__logo {
		flex-basis: 300px;
	}

	.pd-list {
		grid-template-columns: repeat(3, 1fr);
	}

}

@media (max-width: 991px) {
	.pd-hero {
		padding: 50px 0 56px;
	}

	.pd-hero__inner {
		flex-direction: column-reverse;
		gap: 30px;
	}

	.pd-hero__logo {
		flex-basis: auto;
		width: 100%;
		max-width: 420px;
		padding: 30px;
	}

	.pd-hero__title {
		font-size: 30px;
	}

	.pd-feats {
		grid-template-columns: repeat(2, 1fr);
		gap: 20px;
	}

	.pd-list {
		grid-template-columns: repeat(2, 1fr);
	}

}

@media (max-width: 575px) {
	.pd-hero__title {
		font-size: 25px;
	}

	.pd-hero__lead {
		font-size: 15px;
	}

	.pd-hero__lead br {
		display: none;
	}

	.pd-hero__btns .button {
		flex: 1 1 100%;
	}

	.pd-feats {
		grid-template-columns: 1fr;
	}

	.pd-list {
		grid-template-columns: 1fr;
	}

}

/* ==========================================================
   機能詳細ページ（/web/web-01.html など）
   ========================================================== */
.pd-pagehead {
	padding: 46px 0 50px;
	background: linear-gradient(120deg, #f4f7f8 0%, #e6eef1 100%);
}

.pd-pagehead__label {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 14px;
	margin: 0;
	font-size: 13px;
	font-weight: 700;
}

.pd-pagehead__badge,
.pd-pagehead__badge:link,
.pd-pagehead__badge:visited {
	display: inline-block;
	padding: 4px 14px;
	color: #fff;
	background: #00a5bb;
	border-radius: 20px;
	text-decoration: none;
	transition: background .2s;
}

.pd-pagehead__badge:hover,
.pd-pagehead__badge:focus {
	color: #fff;
	background: #00838f;
	text-decoration: none;
}

.pd-pagehead__product,
.pd-pagehead__product:link,
.pd-pagehead__product:visited {
	color: #00a5bb;
	text-decoration: none;
}

.pd-pagehead__product:hover {
	color: #00a5bb;
	text-decoration: underline;
}

.pd-pagehead__title {
	margin-top: 10px;
	font-size: 34px;
	font-weight: 700;
	line-height: 1.4;
	color: #222;
	text-transform: none;
}

.pd-layout {
	display: flex;
	align-items: flex-start;
	gap: 50px;
}

.pd-main {
	flex: 1;
	min-width: 0;
}

.pd-side {
	flex: 0 0 280px;
	position: sticky;
	top: 110px;
	max-height: calc(100vh - 130px);
	overflow-y: auto;
}

.pd-side__inner {
	padding: 20px 18px;
	background: #f6f8f9;
	border: 1px solid #e6eaec;
	border-radius: 10px;
}

.pd-side__logo {
	display: block;
	padding: 6px 0 14px;
	border-bottom: 1px solid #e1e6e8;
}

.pd-side__logo img {
	display: block;
	width: auto;
	max-width: 100%;
	height: auto;
	margin: 0 auto;
}

.pd-side__title {
	margin: 14px 0 8px;
	font-size: 13px;
	font-weight: 700;
	color: #777;
}

.pd-side__list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.pd-side__list li {
	margin: 0;
}

.pd-side__list li + li {
	margin-top: 6px;
}

.pd-side__list a {
	display: block;
	padding: 7px 12px;
	font-size: 14px;
	line-height: 1.5;
	color: #333;
	background: #fff;
	border: 1px solid #dfe5e8;
	border-radius: 6px;
	text-decoration: none;
	transition: background .15s, color .15s, border-color .15s;
}

.pd-side__list a:hover,
.pd-side__list a:focus {
	color: #00838f;
	background: #fff;
	border-color: #00a5bb;
	text-decoration: none;
}

.pd-side__list .is-current a {
	font-weight: 700;
	color: #fff;
	background: #00a5bb;
	border-color: #00a5bb;
}

.pd-sec + .pd-sec {
	margin-top: 64px;
}

.pd-sec__title {
	position: relative;
	margin: 0 0 24px;
	padding: 0 0 14px 18px;
	font-size: 24px;
	font-weight: 700;
	line-height: 1.45;
	color: #222;
	text-transform: none;
	border-bottom: 1px solid #e3e8ea;
}

.pd-sec__title::before {
	content: "";
	position: absolute;
	left: 0;
	top: .2em;
	bottom: 14px;
	width: 5px;
	background: #00a5bb;
	border-radius: 3px;
}

.pd-text p,
.pd-row__text p {
	margin: 0;
	font-size: 15px;
	line-height: 1.95;
	color: #333;
}

.pd-text p + p,
.pd-row__text p + p {
	margin-top: 1em;
}

.pd-text + *,
.pd-row + *,
.pd-fig + *,
.pd-figs + *,
.pd-links + *,
.pd-case + * {
	margin-top: 26px;
}

.pd-sub {
	margin: 0 0 8px;
	font-size: 17px;
	font-weight: 700;
	color: #00838f;
	text-transform: none;
}

.pd-case {
	margin: 0;
	padding: 10px 16px;
	font-size: 15px;
	font-weight: 700;
	color: #fff;
	background: #3d4449;
	border-radius: 6px;
}

.pd-row {
	display: flex;
	align-items: flex-start;
	gap: 34px;
}

.pd-row__text {
	flex: 1;
	min-width: 0;
}

.pd-row__fig {
	flex: 0 0 auto;
	max-width: 46%;
}

.pd-fig {
	margin: 0;
}

.pd-fig img {
	display: block;
	width: auto;
	max-width: 100%;
	height: auto;
	border: 1px solid #e3e8ea;
	border-radius: 6px;
	background: #fff;
}

.pd-fig--center img {
	margin: 0 auto;
}

.pd-figs {
	display: grid;
	gap: 20px;
	align-items: start;
}

.pd-figs--2 {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.pd-figs--lead {
	align-items: start;
}

.pd-figs--lead > .pd-fig:first-child {
	grid-row: span 3;
}

.pd-figs .pd-fig img {
	margin: 0 auto;
}

.pd-zoom {
	position: relative;
	display: inline-block;
	max-width: 100%;
	vertical-align: top;
	cursor: zoom-in;
}

.pd-fig--center .pd-zoom,
.pd-figs .pd-zoom {
	display: block;
	width: fit-content;
	margin: 0 auto;
}

.pd-zoom::after {
	content: "";
	position: absolute;
	right: 10px;
	bottom: 10px;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background: rgba(0,0,0,.55) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23fff' stroke-width='2'%3E%3Ccircle cx='7' cy='7' r='5'/%3E%3Cpath d='M11 11l4 4M7 5v4M5 7h4'/%3E%3C/svg%3E") center / 16px no-repeat;
	transition: background-color .2s;
}

.pd-zoom:hover::after {
	background-color: #00a5bb;
}

.pd-zoom:hover img {
	opacity: .9;
}

.pd-links {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}

.pd-link {
	position: relative;
	display: inline-block;
	padding: 10px 36px 10px 18px;
	font-size: 14px;
	font-weight: 700;
	color: #00838f;
	background: #fff;
	border: 1px solid #00a5bb;
	border-radius: 30px;
	text-decoration: none;
	transition: background .2s, color .2s;
}

.pd-link::after {
	content: "";
	position: absolute;
	right: 16px;
	top: 50%;
	width: 7px;
	height: 7px;
	border-top: 2px solid currentColor;
	border-right: 2px solid currentColor;
	transform: translateY(-50%) rotate(45deg);
}

.pd-link:hover,
.pd-link:focus {
	color: #fff;
	background: #00a5bb;
	text-decoration: none;
}

.pd-table-wrap {
	overflow-x: auto;
}

.pd-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 14px;
	line-height: 1.75;
}

.pd-table th,
.pd-table td {
	padding: 12px 14px;
	text-align: left;
	vertical-align: top;
	border: 1px solid #dfe5e8;
}

.pd-table th[scope="col"] {
	color: #fff;
	background: #3d4449;
}

.pd-table th[scope="row"] {
	width: 28%;
	font-weight: 700;
	background: #f4f6f7;
}

.pd-inline-icon {
	display: inline-block;
	width: auto;
	height: auto;
	vertical-align: -4px;
}

.pd-lb {
	position: fixed;
	inset: 0;
	z-index: 10000;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 40px 20px;
	background: rgba(15,20,22,.88);
	opacity: 0;
	transition: opacity .2s;
}

.pd-lb.is-open {
	opacity: 1;
}

.pd-lb img {
	display: block;
	max-width: 100%;
	max-height: 100%;
	width: auto;
	height: auto;
	border-radius: 4px;
	box-shadow: 0 10px 40px rgba(0,0,0,.4);
	background: #fff;
}

.pd-lb__close {
	position: absolute;
	top: 14px;
	right: 16px;
	width: 44px;
	height: 44px;
	padding: 0;
	font-size: 30px;
	line-height: 44px;
	color: #fff;
	background: none;
	border: 0;
	cursor: pointer;
}

@media (max-width: 991px) {
	.pd-layout {
		flex-direction: column;
		gap: 50px;
	}

	.pd-side {
		position: static;
		max-height: none;
		overflow: visible;
		flex-basis: auto;
		width: 100%;
	}

	.pd-side__list li + li {
		margin-top: 0;
	}

	.pd-side__list {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 6px 10px;
	}

	.pd-pagehead__title {
		font-size: 28px;
	}

}

@media (max-width: 767px) {
	.pd-row {
		flex-direction: column;
		gap: 18px;
	}

	.pd-row__fig {
		max-width: 100%;
	}

	.pd-figs--2 {
		grid-template-columns: 1fr;
	}

	.pd-figs--lead > .pd-fig:first-child {
		grid-row: auto;
	}

}

@media (max-width: 575px) {
	.pd-pagehead {
		padding: 32px 0 34px;
	}

	.pd-pagehead__title {
		font-size: 24px;
	}

	.pd-sec__title {
		font-size: 20px;
	}

	.pd-side__list {
		grid-template-columns: 1fr;
	}

	.pd-table th[scope="row"] {
		width: 36%;
	}

}


/* ==========================================================
   システム運用サポート（/support/ /kaikaku/ /sfa/ 共通）
   ※ /kaikaku/ のページ内スタイルをここへ移動
   ========================================================== */

/* フォント・見出し */
body, h1, h2, h3, h4, h5, h6, .button {
	font-family: "メイリオ", Meiryo, sans-serif;
}

.heading-decorated {
	text-transform: none;
}

.sp-hero {
	padding: 54px 0;
	background: linear-gradient(120deg, #f4f7f8 0%, #e6eef1 100%);
}

.sp-hero__inner {
	display: flex;
	align-items: center;
	gap: 48px;
}

.sp-hero__text {
	flex: 0 0 38%;
}

.sp-hero__label {
	display: inline-block;
	margin: 0;
	padding: 4px 14px;
	font-size: 13px;
	font-weight: 700;
	color: #fff;
	background: #00a5bb;
	border-radius: 20px;
}

.sp-hero__title {
	margin-top: 16px;
	font-size: 34px;
	font-weight: 700;
	line-height: 1.4;
	color: #222;
	text-transform: none;
}

.sp-hero__eng {
	margin-top: 8px;
	font-size: 15px;
	letter-spacing: .08em;
	color: #00a5bb;
}

.sp-hero__img {
	flex: 1;
	min-width: 0;
}

.sp-hero__img img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 12px;
	box-shadow: 0 12px 30px rgba(0,40,50,.15);
}

.sp-tabs {
	background: #fff;
	border-bottom: 1px solid #e3e8ea;
}

.sp-tabs ul {
	display: flex;
	flex-wrap: wrap;
	gap: 0;
	margin: 0;
	padding: 0;
	list-style: none;
}

.sp-tabs li {
	flex: 1 1 auto;
	margin: 0;
}

.sp-tabs a {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
	min-height: 58px;
	padding: 10px 8px;
	font-size: 13.5px;
	font-weight: 700;
	line-height: 1.4;
	color: #555;
	text-align: center;
	border-bottom: 3px solid transparent;
	text-decoration: none;
	transition: color .2s, border-color .2s, background .2s;
}

.sp-tabs a:hover, .sp-tabs a:focus {
	color: #00838f;
	background: #f4f8f9;
	text-decoration: none;
}

.sp-tabs ul {
	flex-wrap: nowrap;
}

.sp-tabs a {
	white-space: nowrap;
}

@media (min-width: 992px) and (max-width: 1199px) {
	.sp-tabs a {
		padding: 10px 4px;
		font-size: 12.5px;
		letter-spacing: -.02em;
	}
}

.sp-tabs .is-current a {
	color: #00838f;
	border-bottom-color: #00a5bb;
}

.sp-lead {
	max-width: 980px;
	margin: 0 auto;
}

.sp-lead p {
	margin: 0;
	font-size: 16px;
	line-height: 2;
	color: #333;
}

.sp-lead p + p {
	margin-top: 1em;
}

.sp-figure {
	max-width: 980px;
	margin: 40px auto 0;
	padding: 24px;
	background: #fff;
	border: 1px solid #e3e8ea;
	border-radius: 12px;
}

.sp-figure img {
	display: block;
	width: auto;
	max-width: 100%;
	height: auto;
	margin: 0 auto;
}

.sp-items {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 28px;
}

.sp-items--single {
	grid-template-columns: 1fr;
	max-width: 980px;
	margin: 0 auto;
}

.sp-items > .sp-item:last-child:nth-child(odd) {
	grid-column: 1 / -1;
}

.sp-item {
	display: flex;
	flex-direction: column;
	padding: 32px 32px 28px;
	background: #fff;
	border: 1px solid #e3e8ea;
	border-top: 4px solid #00a5bb;
	border-radius: 10px;
}

.sp-item__title {
	display: flex;
	align-items: center;
	gap: 14px;
	margin: 0 0 18px;
	font-size: 21px;
	font-weight: 700;
	line-height: 1.45;
	color: #222;
	text-transform: none;
}

.sp-item__no {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	font-size: 16px;
	font-weight: 700;
	color: #fff;
	background: #00a5bb;
	border-radius: 50%;
}

.sp-item__body {
	flex: 1;
	display: flex;
	flex-direction: column;
}

.sp-item__body > p {
	margin: 0;
	font-size: 15px;
	line-height: 1.95;
	color: #333;
}

.sp-item__body > p + p {
	margin-top: 1em;
}

.sp-more {
	margin-top: auto !important;
	padding-top: 22px;
	text-align: right;
}

.sp-link {
	position: relative;
	display: inline-block;
	padding: 10px 38px 10px 20px;
	font-size: 14px;
	font-weight: 700;
	color: #00838f;
	background: #fff;
	border: 1px solid #00a5bb;
	border-radius: 30px;
	text-decoration: none;
	transition: background .2s, color .2s;
}

.sp-link::after {
	content: "";
	position: absolute;
	right: 18px;
	top: 50%;
	width: 7px;
	height: 7px;
	border-top: 2px solid currentColor;
	border-right: 2px solid currentColor;
	transform: translateY(-50%) rotate(45deg);
}

.sp-link:hover, .sp-link:focus {
	color: #fff;
	background: #00a5bb;
	text-decoration: none;
}

.sp-subs {
	display: grid;
	gap: 12px;
	margin: 20px 0 0;
	padding: 0;
	list-style: none;
}

.sp-subs li {
	margin: 0;
	padding: 16px 18px;
	background: #f4f8f9;
	border-radius: 8px;
}

.sp-subs__title {
	position: relative;
	display: inline-block;
	padding-left: 24px;
	font-size: 15px;
	font-weight: 700;
	color: #00838f;
	text-decoration: none;
}

.sp-subs__title::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	width: 16px;
	height: 16px;
	margin-top: -8px;
	border-radius: 50%;
	background: #00a5bb;
}

.sp-subs__title::after {
	content: "";
	position: absolute;
	left: 5px;
	top: 50%;
	width: 5px;
	height: 8px;
	margin-top: -6px;
	border-right: 2px solid #fff;
	border-bottom: 2px solid #fff;
	transform: rotate(45deg);
}

.sp-subs__title:hover {
	text-decoration: underline;
}

.sp-subs p {
	margin: 6px 0 0;
	font-size: 14px;
	line-height: 1.8;
	color: #444;
}

@media (max-width: 991px) {
	.sp-hero__inner {
		flex-direction: column;
		align-items: stretch;
		gap: 26px;
	}

	.sp-hero__text {
		flex-basis: auto;
	}

	.sp-hero__title {
		font-size: 28px;
	}

	.sp-items {
		grid-template-columns: 1fr;
	}

	.sp-tabs .container {
		position: relative;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: thin;
	}

	.sp-tabs li {
		flex: 0 0 auto;
	}

	.sp-tabs a {
		padding: 10px 16px;
	}
}

@media (max-width: 575px) {
	.sp-hero {
		padding: 36px 0;
	}

	.sp-hero__title {
		font-size: 23px;
	}

	.sp-tabs a {
		min-height: 50px;
		font-size: 13px;
	}

	.sp-lead p {
		font-size: 15px;
	}

	.sp-figure {
		padding: 12px;
	}

	.sp-item {
		padding: 24px 20px 22px;
	}

	.sp-item__title {
		font-size: 18px;
	}
}

.sp-hero--noimg .sp-hero__text {
	flex-basis: auto;
}

.sp-hero__img--sm {
	flex: 0 0 auto;
	margin-left: auto;
}

.sp-hero__img--sm img {
	width: auto;
	max-width: 100%;
}

.sp-hero__img--half {
	flex: 0 1 31%;
	margin-left: auto;
}

@media (max-width: 991px) {
	.sp-hero__img--half {
		flex-basis: auto;
		width: 100%;
		max-width: 380px;
		margin: 0 auto;
	}
}

.ks-sec-title {
	margin: 0 0 14px;
	font-size: 28px;
	font-weight: 700;
	color: #222;
	text-align: center;
	text-transform: none;
}

.ks-sec-lead {
	margin: 0 0 40px;
	font-size: 15px;
	color: #555;
	text-align: center;
}

.ks-road {
	position: relative;
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	gap: 10px;
	margin: 0;
	padding: 0;
	list-style: none;
	counter-reset: none;
}

.ks-road::before {
	content: "";
	position: absolute;
	left: 7%;
	right: 7%;
	top: 34px;
	height: 4px;
	background: linear-gradient(90deg, #7fd3de, #00a5bb, #00707e);
	border-radius: 2px;
}

.ks-road li {
	position: relative;
	margin: 0;
}

.ks-road a {
	display: flex;
	flex-direction: column;
	align-items: center;
	color: #333;
	text-align: center;
	text-decoration: none;
}

.ks-road__no {
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: 72px;
	height: 72px;
	color: #fff;
	line-height: 1;
	background: #00a5bb;
	border: 4px solid #fff;
	border-radius: 50%;
	box-shadow: 0 6px 16px rgba(0,100,115,.25);
	transition: transform .2s, background .2s;
}

.ks-road li:nth-child(n+3) .ks-road__no {
	background: #0098ab;
}

.ks-road li:nth-child(n+5) .ks-road__no {
	background: #00879a;
}

.ks-road li:nth-child(n+7) .ks-road__no {
	background: #00707e;
}

.ks-road__no small {
	font-size: 10px;
	letter-spacing: .1em;
}

.ks-road__no b {
	margin-top: 3px;
	font-size: 22px;
}

.ks-road__label {
	margin-top: 14px;
	padding: 0 2px;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.55;
}

.ks-road a:hover .ks-road__no, .ks-road a:focus .ks-road__no {
	transform: translateY(-4px);
	background: #00707e;
}

.ks-road a:hover .ks-road__label {
	color: #00838f;
}

.ks-steps {
	position: relative;
}

.ks-step {
	position: relative;
	display: grid;
	grid-template-columns: 120px minmax(0, 1fr);
	gap: 0 36px;
	scroll-margin-top: 110px;
}

.ks-step + .ks-step {
	margin-top: 48px;
}

.ks-step__rail {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.ks-step__badge {
	position: sticky;
	top: 110px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: 110px;
	height: 110px;
	color: #fff;
	line-height: 1;
	background: linear-gradient(140deg, #00b4c8 0%, #00707e 100%);
	border-radius: 50%;
	box-shadow: 0 10px 26px rgba(0,90,105,.3);
}

.ks-step__badge small {
	font-size: 12px;
	letter-spacing: .14em;
}

.ks-step__badge b {
	margin-top: 4px;
	font-size: 40px;
	font-weight: 700;
}

.ks-step:not(:last-child) .ks-step__rail::after {
	content: "";
	position: absolute;
	top: 120px;
	bottom: -48px;
	left: 50%;
	width: 2px;
	margin-left: -1px;
	background: repeating-linear-gradient(#9fd9e1 0 6px, transparent 6px 12px);
}

.ks-step__card {
	padding: 34px 38px 34px;
	background: #fff;
	border: 1px solid #e3e8ea;
	border-radius: 14px;
	box-shadow: 0 6px 20px rgba(0,40,50,.05);
}

.ks-step__title {
	margin: 0 0 18px;
	padding-bottom: 16px;
	font-size: 25px;
	font-weight: 700;
	line-height: 1.45;
	color: #222;
	border-bottom: 2px solid #e6f4f6;
	text-transform: none;
}

.ks-step__card p {
	margin: 0;
	font-size: 15px;
	line-height: 1.95;
	color: #333;
}

.ks-step__card p + p {
	margin-top: .9em;
}

.ks-sub {
	margin: 28px 0 12px;
	padding-left: 14px;
	font-size: 18px;
	font-weight: 700;
	line-height: 1.5;
	color: #00838f;
	border-left: 4px solid #00a5bb;
	text-transform: none;
}

.ks-list {
	display: grid;
	gap: 8px;
	margin: 14px 0;
	padding: 0;
	list-style: none;
}

.ks-list li {
	position: relative;
	margin: 0;
	padding: 10px 14px 10px 40px;
	font-size: 15px;
	line-height: 1.8;
	background: #f4f8f9;
	border-radius: 8px;
}

.ks-list li::before {
	content: "";
	position: absolute;
	left: 14px;
	top: 15px;
	width: 16px;
	height: 16px;
	border-radius: 50%;
	background: #00a5bb;
}

.ks-list li::after {
	content: "";
	position: absolute;
	left: 19px;
	top: 18px;
	width: 5px;
	height: 8px;
	border-right: 2px solid #fff;
	border-bottom: 2px solid #fff;
	transform: rotate(45deg);
}

.ks-box {
	margin: 26px 0 0;
	padding: 24px 26px;
	background: linear-gradient(135deg, #effafb 0%, #e3f3f6 100%);
	border: 1px solid #c4e7ec;
	border-radius: 12px;
}

.ks-box__title {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 12px;
	font-size: 17px;
	font-weight: 700;
	color: #00707e;
}

.ks-box__title::before {
	content: "POINT";
	padding: 3px 10px;
	font-size: 11px;
	letter-spacing: .1em;
	color: #fff;
	background: #00a5bb;
	border-radius: 3px;
}

.ks-box .ks-list li {
	background: #fff;
}

.ks-callout {
	margin: 16px 0 0;
	padding: 16px 20px;
	font-size: 17px;
	font-weight: 700;
	line-height: 1.6;
	color: #cc0032;
	text-align: center;
	background: #fff5f7;
	border: 2px dashed #f3a6b8;
	border-radius: 10px;
}

.ks-note {
	padding: 12px 16px;
	font-size: 14px !important;
	color: #555 !important;
	background: #f7f7f7;
	border-radius: 8px;
}

.ks-table-wrap {
	margin-top: 18px;
	overflow-x: auto;
}

.ks-table {
	width: 100%;
	min-width: 520px;
	border-collapse: separate;
	border-spacing: 0;
	font-size: 14px;
	line-height: 1.7;
	border: 1px solid #dfe5e8;
	border-radius: 10px;
	overflow: hidden;
}

.ks-table th, .ks-table td {
	padding: 12px 16px;
	text-align: left;
	vertical-align: top;
	border-bottom: 1px solid #e6eaec;
}

.ks-table tr:last-child th, .ks-table tr:last-child td {
	border-bottom: 0;
}

.ks-table thead th {
	color: #fff;
	background: #3d4449;
}

.ks-table thead th:nth-child(2) {
	background: #00838f;
}

.ks-table thead th:nth-child(3) {
	background: #00a5bb;
}

.ks-table tbody th {
	width: 28%;
	font-weight: 700;
	background: #f4f6f7;
}

.ks-fig {
	margin: 14px 0 0;
}

.ks-fig img {
	display: block;
	width: auto;
	max-width: 100%;
	height: auto;
}

.ks-curriculum {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 10px;
	margin: 14px 0 0;
	padding: 0;
	list-style: none;
}

.ks-curriculum li {
	margin: 0;
	padding: 16px 12px;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.6;
	text-align: center;
	color: #00707e;
	background: #f4f8f9;
	border: 1px solid #d5ecef;
	border-radius: 10px;
}

.ks-top {
	margin-top: 22px !important;
	text-align: right;
}

.ks-top a {
	font-size: 13px;
	color: #00a5bb;
}

.ks-reasons {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 28px;
}

.ks-reason {
	padding: 32px 32px 30px;
	background: #fff;
	border: 1px solid #e3e8ea;
	border-top: 4px solid #00a5bb;
	border-radius: 12px;
}

.ks-reason__no {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	font-size: 20px;
	font-weight: 700;
	color: #fff;
	background: #00a5bb;
	border-radius: 50%;
}

.ks-reason__title {
	margin: 14px 0 14px;
	font-size: 21px;
	font-weight: 700;
	line-height: 1.5;
	color: #222;
	text-transform: none;
}

.ks-reason p {
	margin: 0;
	font-size: 15px;
	line-height: 1.95;
	color: #333;
}

.ks-reason p + p {
	margin-top: .9em;
}

.ks-vs {
	display: grid;
	gap: 8px;
	margin: 14px 0;
}

.ks-vs span {
	display: block;
	padding: 10px 14px;
	font-size: 14px;
	font-weight: 700;
	border-radius: 8px;
}

.ks-vs .is-good {
	color: #cc0032;
	background: #fff3f5;
	border-left: 4px solid #cc0032;
}

.ks-vs .is-bad {
	color: #1655a3;
	background: #f1f5fb;
	border-left: 4px solid #1655a3;
}

.ks-wide-fig {
	max-width: 760px;
	margin: 40px auto 0;
	padding: 20px;
	background: #fff;
	border: 1px solid #e3e8ea;
	border-radius: 12px;
}

.ks-wide-fig img {
	display: block;
	width: auto;
	max-width: 100%;
	height: auto;
	margin: 0 auto;
}

.ks-supports {
	display: grid;
	gap: 28px;
}

.ks-support {
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
	gap: 34px;
	align-items: center;
	padding: 30px 32px;
	background: #fff;
	border: 1px solid #e3e8ea;
	border-radius: 14px;
}

.ks-support__fig img {
	display: block;
	width: 100%;
	height: auto;
}

.ks-support__label {
	display: inline-block;
	margin: 0;
	padding: 3px 12px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .08em;
	color: #fff;
	background: #00a5bb;
	border-radius: 3px;
}

.ks-support__title {
	margin: 12px 0 14px;
	font-size: 22px;
	font-weight: 700;
	line-height: 1.45;
	color: #222;
	text-transform: none;
}

.ks-support__name {
	margin: 0 0 8px !important;
	font-size: 15px !important;
	font-weight: 700;
	color: #00838f !important;
}

.ks-support p {
	margin: 0;
	font-size: 15px;
	line-height: 1.95;
	color: #333;
}

.ks-support p + p {
	margin-top: .6em;
}

.ks-follow {
	max-width: 980px;
	margin: 0 auto;
	padding: 34px 40px;
	text-align: left;
	background: linear-gradient(135deg, #00808f 0%, #00a7ba 100%);
	border-radius: 14px;
	color: #fff;
}

.ks-follow h3 {
	margin: 0 0 12px;
	font-size: 24px;
	font-weight: 700;
	color: #fff;
	text-transform: none;
}

.ks-follow p {
	margin: 0;
	font-size: 15px;
	line-height: 1.95;
	color: #fff;
}

@media (max-width: 1199px) {
	.ks-road__label {
		font-size: 13px;
	}
}

@media (max-width: 991px) {
	.ks-road {
		grid-template-columns: 1fr;
		gap: 12px;
		max-width: 520px;
		margin: 0 auto;
	}

	.ks-road::before {
		left: 33px;
		right: auto;
		top: 20px;
		bottom: 20px;
		width: 4px;
		height: auto;
		background: linear-gradient(180deg, #7fd3de, #00a5bb, #00707e);
	}

	.ks-road a {
		flex-direction: row;
		gap: 16px;
		text-align: left;
	}

	.ks-road__no {
		flex: 0 0 auto;
		width: 66px;
		height: 66px;
	}

	.ks-road__label {
		margin-top: 0;
		font-size: 15px;
	}

	.ks-step {
		grid-template-columns: 1fr;
		gap: 0;
	}

	.ks-step__rail {
		align-items: flex-start;
		margin-bottom: -40px;
		padding-left: 24px;
		z-index: 1;
	}

	.ks-step__badge {
		position: static;
		width: 80px;
		height: 80px;
	}

	.ks-step__badge b {
		font-size: 30px;
	}

	.ks-step:not(:last-child) .ks-step__rail::after {
		display: none;
	}

	.ks-step__card {
		padding-top: 54px;
	}

	.ks-curriculum {
		grid-template-columns: repeat(2, 1fr);
	}

	.ks-reasons {
		grid-template-columns: 1fr;
	}

	.ks-support {
		grid-template-columns: 1fr;
		gap: 20px;
	}
}

@media (max-width: 575px) {
	.ks-sec-title {
		font-size: 22px;
	}

	.ks-step__card {
		padding: 50px 20px 24px;
	}

	.ks-step__title {
		font-size: 20px;
	}

	.ks-sub {
		font-size: 16px;
	}

	.ks-reason, .ks-support {
		padding: 24px 20px;
	}

	.ks-follow {
		padding: 26px 22px;
	}

	.ks-callout {
		font-size: 15px;
	}
}


/* ==========================================================
   リアル秘書 VS 電子秘書（/vs/）
   ========================================================== */

.sp-hero__img--vs {
	flex: 0 1 50%;
	margin-left: auto;
}

.vs-hero__lead {
	margin: 18px 0 0;
	font-size: 14px;
	line-height: 1.9;
	color: #444;
}

.vs-toc {
	position: relative;
	max-width: 1080px;
	margin: 44px auto 0;
	padding: 34px 36px 36px;
	overflow: hidden;
	color: #fff;
	background: linear-gradient(135deg, #3a8296 0%, #4f9aac 100%);
	border-radius: 18px;
}

.vs-toc__head {
	margin: 0 0 26px;
	text-align: center;
}

.vs-toc__title {
	margin: 0;
	font-size: 24px;
	font-weight: 700;
	line-height: 1.4;
	color: #fff;
}

.vs-toc__vs {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 14px;
	margin: 12px 0 0;
	font-size: 14px;
	font-weight: 700;
}

.vs-toc__vs span {
	padding: 4px 14px;
	border-radius: 20px;
}

.vs-toc__vs span:first-child {
	color: #fff;
	background: #d46a7e;
}

.vs-toc__vs span:last-child {
	color: #fff;
	background: #3aaed0;
}

.vs-toc__vs b {
	font-size: 22px;
	font-style: italic;
	letter-spacing: .04em;
	color: #ffe08a;
}

.vs-toc ul {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 10px;
	margin: 0;
	padding: 0;
	list-style: none;
	counter-reset: none;
}

.vs-toc li {
	margin: 0;
}

.vs-toc a {
	position: relative;
	display: flex;
	align-items: center;
	gap: 12px;
	height: 100%;
	min-height: 58px;
	padding: 10px 30px 10px 10px;
	font-size: 13.5px;
	font-weight: 700;
	line-height: 1.45;
	color: #24525f;
	background: #f2f7f8;
	border: 0;
	border-radius: 8px;
	text-decoration: none;
	transition: background .2s, color .2s;
}

.vs-toc a::after {
	content: "";
	position: absolute;
	right: 14px;
	top: 50%;
	width: 7px;
	height: 7px;
	margin-top: -4px;
	border-right: 2px solid #9bbcc5;
	border-bottom: 2px solid #9bbcc5;
	transform: rotate(45deg);
	transition: border-color .2s;
}

.vs-toc__no {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	font-size: 15px;
	font-weight: 700;
	color: #fff;
	background: #5d8f9c;
	border-radius: 6px;
}

.vs-toc a:hover, .vs-toc a:focus {
	color: #1d4752;
	background: #fff;
	text-decoration: none;
}

.vs-toc a:hover::after, .vs-toc a:focus::after {
	border-color: #5d8f9c;
}

.vs-rounds {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 28px;
}

.vs-round {
	display: flex;
	flex-direction: column;
	padding: 0 0 24px;
	overflow: hidden;
	background: #fff;
	border: 1px solid #e3e8ea;
	border-radius: 14px;
	box-shadow: 0 8px 24px rgba(0,40,50,.07);
	scroll-margin-top: 110px;
}

.vs-round__head {
	display: flex;
	align-items: stretch;
	margin: 0 0 20px;
	background: #f4f7f8;
	border-bottom: 1px solid #e3e8ea;
}

.vs-round__no {
	flex: 0 0 auto;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: 78px;
	margin: 0;
	padding: 12px 0;
	color: #fff;
	line-height: 1;
	background: #5d8f9c;
}

.vs-round__no small {
	font-size: 10px;
	font-weight: 700;
	letter-spacing: .16em;
	color: #e3eef1;
}

.vs-round__no b {
	margin-top: 4px;
	font-size: 28px;
	font-weight: 700;
}

.vs-round__title {
	display: flex;
	align-items: center;
	margin: 0;
	padding: 14px 20px;
	font-size: 20px;
	font-weight: 700;
	line-height: 1.45;
	color: #1f2d33;
	text-transform: none;
}

.vs-round__fig, .vs-round__body, .vs-more {
	margin-left: 28px !important;
	margin-right: 28px !important;
}

.vs-round__fig {
	margin-top: 0;
	margin-bottom: 16px;
}

.vs-round__fig img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 8px;
}

.vs-round__body p {
	margin: 0;
	font-size: 15px;
	line-height: 1.95;
	color: #333;
}

.vs-round__body p + p {
	margin-top: .8em;
}

.vs-more {
	margin-top: auto !important;
	padding-top: 16px;
	font-size: 14px;
	line-height: 1.8;
	text-align: right;
	color: #555;
}

.vs-more a {
	font-weight: 700;
	color: #00838f;
}

.vs-movie {
	display: flex;
	align-items: center;
	gap: 40px;
	max-width: 980px;
	margin: 0 auto;
	padding: 32px 36px;
	background: #fff;
	border: 1px solid #e3e8ea;
	border-radius: 14px;
}

.vs-movie__text {
	flex: 1;
	min-width: 0;
}

.vs-movie__text p {
	margin: 0;
	font-size: 15px;
	line-height: 1.95;
	color: #333;
}

.vs-movie__thumb {
	flex: 0 0 auto;
}

.vs-movie__thumb img {
	display: block;
	max-width: 100%;
	height: auto;
	border-radius: 8px;
	box-shadow: 0 8px 22px rgba(0,40,50,.15);
	transition: opacity .2s;
}

.vs-movie__thumb:hover img {
	opacity: .8;
}

@media (max-width: 1199px) {
	.vs-toc ul {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (max-width: 991px) {
	.sp-hero__img--vs {
		flex-basis: auto;
		width: 100%;
		max-width: 560px;
		margin: 0 auto;
	}

	.vs-toc ul {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.vs-rounds {
		grid-template-columns: 1fr;
	}

	.vs-movie {
		flex-direction: column;
		align-items: stretch;
		gap: 22px;
	}

	.vs-movie__thumb {
		align-self: center;
	}
}

@media (max-width: 575px) {
	.vs-toc {
		padding: 28px 16px 20px;
		border-radius: 14px;
	}

	.vs-toc__title {
		font-size: 20px;
	}

	.vs-toc ul {
		grid-template-columns: 1fr;
		gap: 8px;
	}

	.vs-toc a {
		min-height: 52px;
	}

	.vs-round__no {
		width: 64px;
	}

	.vs-round__no b {
		font-size: 24px;
	}

	.vs-round__title {
		padding: 12px 16px;
		font-size: 17px;
	}

	.vs-round__fig, .vs-round__body, .vs-more {
		margin-left: 18px !important;
		margin-right: 18px !important;
	}

	.vs-movie {
		padding: 24px 20px;
	}
}


/* ==========================================================
   経営の見える化（/mieruka/）
   ========================================================== */

.mz-lead {
	max-width: 980px;
	margin: 0 auto;
	padding: 36px 40px;
	background: #fff;
	border: 1px solid #e3e8ea;
	border-radius: 14px;
}

.mz-lead p {
	margin: 0;
	font-size: 16px;
	line-height: 2;
	color: #333;
}

.mz-lead p + p {
	margin-top: 1em;
}

.mz-lead a {
	font-weight: 700;
	color: #00838f;
}

.mz-em {
	color: #cc0032;
}

.mz-ms {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 28px;
	max-width: 1080px;
	margin: 0 auto;
	padding: 34px 36px;
	background: #fff;
	border: 1px solid #e3e8ea;
	border-radius: 14px;
}

.mz-ms__fig {
	display: block;
	width: 100%;
	max-width: 680px;
	margin: 0 auto;
}

.mz-ms__fig img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 8px;
	transition: opacity .2s;
}

.mz-ms__fig:hover img {
	opacity: .85;
}

.mz-ms .mz-ms__label {
	display: inline-block;
	margin: 0;
	padding: 4px 14px;
	font-size: 13px;
	font-weight: 700;
	line-height: 1.6;
	letter-spacing: .08em;
	color: #fff;
	background: #5d8f9c;
	border-radius: 3px;
}

.mz-ms .mz-ms__title {
	margin: 12px 0 14px;
	font-size: 22px;
	font-weight: 700;
	line-height: 1.45;
	color: #222;
	text-transform: none;
}

.mz-ms p {
	margin: 0;
	font-size: 15px;
	line-height: 1.95;
	color: #333;
}

.mz-ms p + p {
	margin-top: .8em;
}

.mz-ms a {
	font-weight: 700;
	color: #00838f;
}

.mz-sec2 {
	margin-top: 72px;
}

.mz-point {
	max-width: 1080px;
	margin: 28px auto 0;
}

.mz-point p {
	margin: 0;
	font-size: 15px;
	font-weight: 700;
	line-height: 1.95;
	color: #24525f;
}

.mz-point a {
	color: #00838f;
}

@media (max-width: 991px) {
	.mz-ms {
		gap: 22px;
	}

	.mz-sec2 {
		margin-top: 52px;
	}
}

@media (max-width: 575px) {
	.mz-lead {
		padding: 24px 20px;
	}

	.mz-lead p {
		font-size: 15px;
	}

	.mz-ms {
		padding: 24px 20px;
	}

	.mz-ms .mz-ms__title {
		font-size: 19px;
	}
}

/* ==========================================================
   ゲーミフィケーション（/gamification/）
   ========================================================== */

.gm-top-lead {
	max-width: 900px;
	margin: 0 auto 48px;
	font-size: 16px;
	line-height: 2;
	color: #333;
	text-align: center;
}

.gm-catch {
	margin: 0 0 18px;
	font-size: 20px;
	font-weight: 700;
	line-height: 1.6;
	color: #cc0032;
}

.gm-catch--end {
	margin: 24px 0 0;
	text-align: center;
}

.gm-intro {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 180px;
	gap: 36px;
	align-items: start;
	max-width: 1000px;
	margin: 0 auto;
}

.gm-intro p {
	margin: 0;
	font-size: 16px;
	line-height: 2;
	color: #333;
}

.gm-intro p + p {
	margin-top: .8em;
}

.gm-intro__fig {
	text-align: center;
	padding-top: 8px;
}

.gm-intro__fig img, .gm-closing__fig img {
	max-width: 100%;
	height: auto;
}

.gm-voices {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
	margin: 22px 0;
	padding: 0;
	list-style: none;
}

.gm-voices li {
	position: relative;
	margin: 0;
	padding: 14px 18px;
	font-size: 15px;
	line-height: 1.75;
	color: #444;
	background: #f4f7f8;
	border-radius: 10px;
}

.gm-voices li::after {
	content: "";
	position: absolute;
	left: 22px;
	bottom: -8px;
	border: 8px solid transparent;
	border-bottom: 0;
	border-top-color: #f4f7f8;
}

.gm-card {
	max-width: 1000px;
	margin: 0 auto;
	padding: 34px 38px;
	background: #fff;
	border: 1px solid #e3e8ea;
	border-radius: 14px;
}

.gm-card p {
	margin: 0;
	font-size: 16px;
	line-height: 2;
	color: #333;
}

.gm-card p + p, .gm-card .gm-flow + p {
	margin-top: 1em;
}

.gm-card a {
	font-weight: 700;
	color: #00838f;
}

.gm-card--end {
	margin-top: 40px;
}

.gm-def {
	position: relative;
	margin: 22px 0;
	padding: 34px 40px 30px;
	font-size: 19px;
	font-weight: 700;
	line-height: 1.9;
	color: #1d4f5c;
	text-align: center;
	background: linear-gradient(135deg, #f2fafb 0%, #e2f2f5 100%);
	border: 1px solid #c4e7ec;
	border-radius: 14px;
}

.gm-def::before, .gm-def::after {
	position: absolute;
	font-family: Georgia, serif;
	font-size: 72px;
	font-weight: 400;
	line-height: 1;
	color: #9fd3db;
}

.gm-def::before {
	content: "\201C";
	top: 8px;
	left: 20px;
}

.gm-def::after {
	content: "\201D";
	right: 20px;
	bottom: -22px;
}

.gm-def__label {
	display: inline-block;
	margin: 0 0 12px;
	padding: 3px 14px;
	font-size: 13px;
	letter-spacing: .08em;
	color: #fff;
	background: #00838f;
	border-radius: 999px;
}

.gm-def__text {
	display: block;
}

.gm-effects {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 44px minmax(0, 1fr);
	align-items: stretch;
	max-width: 1000px;
	margin: 36px auto 0;
}

.gm-effects__col {
	overflow: hidden;
	background: #fff;
	border: 1px solid #e3e8ea;
	border-radius: 12px;
}

.gm-effects__head {
	position: relative;
	margin: 0;
	padding: 16px 22px 16px 54px;
	font-size: 15px;
	font-weight: 700;
	line-height: 1.7;
	color: #3f5f68;
	background: #eef3f4;
}

.gm-effects__head::before {
	content: "GAME";
	position: absolute;
	top: 50%;
	left: 14px;
	width: 32px;
	height: 32px;
	margin-top: -16px;
	font-size: 9px;
	font-weight: 700;
	line-height: 32px;
	letter-spacing: .02em;
	color: #fff;
	text-align: center;
	background: #8aa9b2;
	border-radius: 50%;
}

.gm-effects__col--work .gm-effects__head {
	color: #fff;
	background: #00838f;
}

.gm-effects__col--work .gm-effects__head::before {
	content: "WORK";
	color: #00838f;
	background: #fff;
}

.gm-effects__col .gm-check {
	padding: 10px 22px 18px;
}

.gm-effects__arrow {
	position: relative;
}

.gm-effects__arrow::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 0;
	height: 0;
	margin: -12px 0 0 -6px;
	border: 12px solid transparent;
	border-right: 0;
	border-left: 14px solid #00838f;
}

.gm-check {
	margin: 0;
	padding: 0;
	list-style: none;
}

.gm-check li {
	position: relative;
	margin: 0;
	padding: 9px 0 9px 28px;
	font-size: 15px;
	line-height: 1.75;
	color: #333;
	border-top: 1px dashed #dde4e6;
}

.gm-check li:first-child {
	border-top: 0;
}

.gm-check li::before {
	content: "";
	position: absolute;
	left: 4px;
	top: 16px;
	width: 12px;
	height: 7px;
	border-left: 3px solid #00838f;
	border-bottom: 3px solid #00838f;
	transform: rotate(-45deg);
}

.gm-closing {
	display: flex;
	align-items: center;
	gap: 28px;
	max-width: 1000px;
	margin: 36px auto 0;
}

.gm-closing__body {
	flex: 1 1 auto;
}

.gm-closing__body p {
	margin: 0;
	font-size: 16px;
	line-height: 2;
	color: #333;
}

.gm-closing__body p + p {
	margin-top: .8em;
}

.gm-closing__fig {
	flex: 0 0 auto;
}

.gm-label {
	margin: 0 0 18px;
	font-size: 16px;
	font-weight: 700;
	color: #24525f;
	text-align: center;
}

.gm-conds {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 18px;
	max-width: 1140px;
	margin: 0 auto;
}

.gm-cond {
	display: flex;
	flex-direction: column;
	padding: 26px 22px 22px;
	background: #fff;
	border: 1px solid #e3e8ea;
	border-radius: 12px;
	box-shadow: 0 2px 10px rgba(0, 0, 0, .04);
}

.gm-cond__no {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	font-size: 20px;
	font-weight: 700;
	color: #fff;
	background: #00838f;
	border-radius: 50%;
}

.gm-cond__title {
	flex: 1 1 auto;
	margin: 14px 0 16px;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.75;
	color: #222;
}

.gm-cond__to {
	margin: 0;
	padding: 12px 14px;
	list-style: none;
	background: #effafb;
	border-radius: 8px;
}

.gm-cond__to li {
	position: relative;
	margin: 0;
	padding-left: 1.4em;
	font-size: 14px;
	line-height: 1.75;
	color: #24525f;
}

.gm-cond__to li + li {
	margin-top: 4px;
}

.gm-cond__to li::before {
	content: "⇒";
	position: absolute;
	left: 0;
	color: #00838f;
}

.gm-sub {
	margin: 64px 0 22px;
	font-size: 22px;
	font-weight: 700;
	color: #222;
	text-align: center;
	text-transform: none;
}

.gm-flow {
	margin: 22px 0;
	padding: 0;
	list-style: none;
}

.gm-flow li {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	margin: 0;
	border: 1px solid #e3e8ea;
	border-radius: 10px;
	overflow: hidden;
}

.gm-flow li + li {
	margin-top: 10px;
}

.gm-flow__via {
	position: relative;
	padding: 14px 34px 14px 18px;
	font-size: 15px;
	line-height: 1.75;
	color: #444;
	background: #f4f7f8;
}

.gm-flow__via::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 12px;
	margin-top: -8px;
	border: 8px solid transparent;
	border-right: 0;
	border-left: 10px solid #8aa9b2;
}

.gm-flow__to {
	padding: 14px 18px;
	font-size: 15px;
	font-weight: 700;
	line-height: 1.75;
	color: #24525f;
	background: #effafb;
}

.gm-points {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
	max-width: 1080px;
	margin: 0 auto;
	padding: 0;
	list-style: none;
}

.gm-point {
	display: grid;
	grid-template-columns: 52px minmax(0, 1fr);
	grid-template-rows: auto auto;
	column-gap: 14px;
	align-items: center;
	margin: 0;
	padding: 18px 20px;
	background: #fff;
	border: 1px solid #e3e8ea;
	border-radius: 12px;
}

.gm-point__no {
	grid-row: 1 / 3;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 52px;
	height: 52px;
	font-size: 18px;
	font-weight: 700;
	color: #00838f;
	background: #e3f3f6;
	border-radius: 10px;
}

.gm-point__name {
	font-size: 16px;
	font-weight: 700;
	line-height: 1.5;
	color: #222;
}

.gm-point__sub {
	font-size: 13px;
	line-height: 1.6;
	color: #666;
}

.gm-play {
	display: grid;
	grid-template-columns: 340px minmax(0, 1fr);
	gap: 48px;
	align-items: start;
	max-width: 1000px;
	margin: 0 auto;
}

.gm-game {
	padding: 26px 24px;
	text-align: center;
	background: #fff8e6;
	border: 1px solid #f1dfb0;
	border-radius: 16px;
}

.gm-game img {
	display: block;
	max-width: 100%;
	height: auto;
	margin: 0 auto;
}

.gm-game__btns {
	display: flex;
	justify-content: center;
	gap: 12px;
	margin: 14px 0 6px;
}

.gm-game__btns button {
	padding: 0;
	background: none;
	border: 0;
	cursor: pointer;
	transition: transform .15s;
}

.gm-game__btns button:hover {
	transform: translateY(-2px);
}

.gm-game__btns button:active {
	transform: translateY(1px);
}

.gm-game__msg {
	min-height: 1.6em;
	margin: 6px 0 0;
	font-size: 15px;
	font-weight: 700;
	line-height: 1.6;
}

.gm-game__msg.is-win {
	color: #cc0032;
}

.gm-game__msg.is-lose {
	color: #5d6b70;
}

.gm-game__msg a {
	color: #cc0032;
	text-decoration: underline;
}

.gm-game__hint {
	margin: 8px 0 6px;
	font-size: 14px;
	color: #555;
}

.gm-side__title {
	margin: 0 0 12px;
	padding-bottom: 8px;
	font-size: 18px;
	font-weight: 700;
	color: #222;
	border-bottom: 2px solid #00838f;
}

.gm-side__links {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 10px;
	margin: 0 0 32px;
	padding: 0;
	list-style: none;
}

.gm-side__links li {
	margin: 0;
}

.gm-side__links a {
	position: relative;
	display: block;
	padding: 12px 30px 12px 16px;
	font-size: 15px;
	font-weight: 700;
	color: #24525f;
	text-decoration: none;
	background: #f4f7f8;
	border: 1px solid #e3e8ea;
	border-radius: 8px;
	transition: background .2s, border-color .2s;
}

.gm-side__links a::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 14px;
	width: 8px;
	height: 8px;
	margin-top: -4px;
	border-top: 2px solid #00838f;
	border-right: 2px solid #00838f;
	transform: rotate(45deg);
}

.gm-side__links a:hover {
	background: #e3f3f6;
	border-color: #c4e7ec;
}

.gm-camp {
	max-width: 960px;
	margin: 0 auto;
	text-align: center;
}

.gm-camp__title {
	margin: 0;
	text-transform: none;
}

.gm-camp__title img, .gm-camp__pdf img {
	display: block;
	max-width: 100%;
	height: auto;
	margin: 0 auto;
}

.gm-camp__lead {
	margin: 30px 0;
	font-size: 17px;
	font-weight: 700;
	line-height: 2;
	color: #333;
}

.gm-camp__pdf {
	display: block;
	transition: opacity .2s;
}

.gm-camp__pdf:hover {
	opacity: .85;
}

.gm-camp__note {
	max-width: 814px;
	margin: 22px auto 0;
	font-size: 13px;
	line-height: 1.9;
	color: #666;
	text-align: left;
}

.gm-camp__note a, .gm-camp__back a {
	color: #00838f;
	text-decoration: underline;
}

.gm-camp__back {
	margin: 30px 0 0;
	font-size: 15px;
	font-weight: 700;
}

@media (max-width: 991px) {
	.gm-conds {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.gm-points {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.gm-play {
		grid-template-columns: minmax(0, 1fr);
		gap: 36px;
	}

	.gm-game {
		max-width: 360px;
		width: 100%;
		margin: 0 auto;
	}
}

@media (max-width: 767px) {
	.gm-intro {
		grid-template-columns: minmax(0, 1fr);
		gap: 20px;
	}

	.gm-intro__fig {
		order: -1;
	}

	.gm-voices {
		grid-template-columns: minmax(0, 1fr);
	}

	.gm-effects {
		grid-template-columns: minmax(0, 1fr);
		grid-template-rows: auto 40px auto;
	}

	.gm-effects__arrow::before {
		margin: -6px 0 0 -12px;
		border: 12px solid transparent;
		border-bottom: 0;
		border-top: 14px solid #00838f;
	}

	.gm-flow li {
		grid-template-columns: minmax(0, 1fr);
	}

	.gm-flow__via {
		padding: 12px 16px;
	}

	.gm-flow__via::after {
		display: none;
	}

	.gm-flow__to {
		padding: 12px 16px;
	}
}

@media (max-width: 575px) {
	.gm-top-lead {
		font-size: 15px;
		text-align: left;
	}

	.gm-catch {
		font-size: 18px;
	}

	.gm-card {
		padding: 24px 20px;
	}

	.gm-card p, .gm-intro p, .gm-closing__body p {
		font-size: 15px;
	}

	.gm-def {
		padding: 30px 22px 26px;
		font-size: 16px;
	}

	.gm-def::before, .gm-def::after {
		font-size: 52px;
	}

	.gm-def::before {
		top: 4px;
		left: 10px;
	}

	.gm-def::after {
		right: 10px;
		bottom: -16px;
	}

	.gm-closing {
		flex-direction: column;
		gap: 16px;
	}

	.gm-conds {
		grid-template-columns: minmax(0, 1fr);
	}

	.gm-points {
		grid-template-columns: minmax(0, 1fr);
	}

	.gm-side__links {
		grid-template-columns: minmax(0, 1fr);
	}

	.gm-camp__lead {
		font-size: 15px;
		text-align: left;
	}
}

/* ==========================================================
   孫子に学ぶ売るためのIT化（/suntzu/）
   ========================================================== */

.sz-intro {
	display: grid;
	grid-template-columns: 150px minmax(0, 1fr);
	gap: 36px;
	align-items: start;
	max-width: 1000px;
	margin: 0 auto;
}

.sz-intro__fig {
	display: block;
	max-width: 100%;
	height: auto;
}

.sz-intro__body p {
	margin: 0;
	font-size: 16px;
	line-height: 2;
	color: #333;
}

.sz-intro__body p + p {
	margin-top: 1em;
}

.sz-toc {
	max-width: 1000px;
	margin: 48px auto 0;
	padding: 28px 30px;
	background: #f6f3ec;
	border: 1px solid #e6dcc6;
	border-radius: 14px;
}

.sz-toc__head {
	margin: 0 0 16px;
	font-size: 17px;
	font-weight: 700;
	color: #5a4524;
	text-align: center;
}

.sz-toc__list {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 8px 18px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.sz-toc__list li {
	margin: 0;
}

.sz-toc__list a {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	height: 100%;
	padding: 10px 14px;
	text-decoration: none;
	background: #fff;
	border: 1px solid #ece4d2;
	border-radius: 8px;
	transition: border-color .2s, background .2s;
}

.sz-toc__list a:hover {
	background: #fffaf0;
	border-color: #c9ad74;
}

.sz-toc__no {
	flex: 0 0 auto;
	min-width: 54px;
	padding: 2px 0;
	font-size: 12px;
	font-weight: 700;
	line-height: 1.6;
	color: #fff;
	text-align: center;
	background: #8a6a35;
	border-radius: 4px;
}

.sz-toc__label {
	font-size: 14px;
	font-weight: 700;
	line-height: 1.6;
	color: #333;
}

.sz-title {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 14px;
	margin: 0 0 30px;
	font-size: 26px;
	font-weight: 700;
	color: #222;
	text-transform: none;
}

.sz-title__no {
	display: inline-block;
	padding: 4px 16px;
	font-size: 18px;
	line-height: 1.5;
	color: #fff;
	background: #8a6a35;
	border-radius: 6px;
}

.sz-item {
	max-width: 1080px;
	margin: 0 auto;
}

.sz-text {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 20px;
}

.sz-quote {
	position: relative;
	padding: 26px 28px;
	background: #fbf8f1;
	border: 1px solid #e6dcc6;
	border-radius: 12px;
}

.sz-quote__label, .sz-trans__label {
	display: inline-block;
	margin: 0 0 12px;
	padding: 2px 12px;
	font-size: 13px;
	font-weight: 700;
	line-height: 1.7;
	letter-spacing: .06em;
	border-radius: 3px;
}

.sz-quote__label {
	color: #fff;
	background: #8a6a35;
}

.sz-quote__text {
	margin: 0;
	font-family: "Hiragino Mincho ProN", "Yu Mincho", YuMincho, "MS PMincho", serif;
	font-size: 17px;
	font-weight: 600;
	line-height: 2;
	color: #3c2f1a;
}

.sz-trans {
	padding: 26px 28px;
	background: #fff;
	border: 1px solid #e3e8ea;
	border-radius: 12px;
}

.sz-trans__label {
	color: #5a4524;
	background: #efe6d3;
}

.sz-trans p:last-child {
	margin: 0;
	font-size: 15px;
	line-height: 1.95;
	color: #444;
}

.sz-interp {
	margin-top: 20px;
	overflow: hidden;
	background: #fff;
	border: 1px solid #cfe6ea;
	border-radius: 14px;
	box-shadow: 0 4px 16px rgba(0, 85, 95, .06);
}

.sz-interp__head {
	padding: 22px 32px 20px;
	background: linear-gradient(135deg, #f0f9fa 0%, #dff1f4 100%);
	border-bottom: 1px solid #cfe6ea;
}

.sz-interp .sz-interp__label {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 0 0 10px;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.6;
	letter-spacing: .1em;
	color: #00838f;
}

.sz-interp .sz-interp__label::before {
	content: "";
	width: 30px;
	height: 2px;
	background: #00838f;
}

.sz-interp .sz-interp__title {
	margin: 0;
	font-size: 20px;
	font-weight: 700;
	line-height: 1.6;
	color: #222;
	text-transform: none;
}

.sz-interp__body {
	padding: 26px 32px 30px;
}

.sz-interp__body p {
	margin: 0;
	font-size: 15px;
	line-height: 2;
	color: #333;
}

.sz-interp__body p + p {
	margin-top: .8em;
}

.sz-interp__body a {
	color: #00838f;
	font-weight: 700;
}

.sz-figs {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 340px));
	justify-content: center;
	gap: 24px;
	margin-top: 26px;
}

.sz-figs--one {
	grid-template-columns: minmax(0, 560px);
}

.sz-interp__body .sz-fig {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	font-weight: 400;
	text-decoration: none;
}

.sz-fig__img {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	padding: 12px;
	background: #f4f7f8;
	border: 1px solid #e3e8ea;
	border-radius: 10px;
	transition: border-color .2s;
}

.sz-fig__img img {
	display: block;
	max-width: 100%;
	height: auto;
}

.sz-fig:hover .sz-fig__img {
	border-color: #8fcdd4;
}

.sz-fig__cap {
	font-size: 14px;
	font-weight: 700;
	color: #00838f;
	text-decoration: underline;
}

.sz-books {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 22px;
	max-width: 900px;
	margin: 0 auto;
	padding: 0;
	list-style: none;
}

.sz-book {
	margin: 0;
	padding: 26px 22px;
	text-align: center;
	background: #fff;
	border: 1px solid #e3e8ea;
	border-radius: 12px;
}

.sz-book__img {
	display: block;
	margin-bottom: 16px;
}

.sz-book__img img {
	display: block;
	max-width: 100%;
	height: auto;
	margin: 0 auto;
	box-shadow: 0 4px 12px rgba(0, 0, 0, .12);
}

.sz-book__title {
	margin: 0 0 8px;
	font-size: 15px;
	font-weight: 700;
	line-height: 1.7;
}

.sz-book__title a {
	color: #222;
	text-decoration: none;
}

.sz-book__title a:hover {
	color: #00838f;
}

.sz-book__author {
	margin: 0;
	font-size: 13px;
	line-height: 1.7;
	color: #666;
}

.sz-present {
	max-width: 760px;
	margin: 0 auto;
	text-align: center;
}

.sz-present p {
	margin: 0 0 22px;
	font-size: 16px;
	line-height: 2;
	color: #333;
}

.sz-present__bnr {
	display: inline-block;
	transition: opacity .2s;
}

.sz-present__bnr:hover {
	opacity: .85;
}

.sz-present__bnr img {
	display: block;
	max-width: 100%;
	height: auto;
}

.sz-links {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 14px;
	max-width: 900px;
	margin: 0 auto;
	padding: 0;
	list-style: none;
}

.sz-links li {
	margin: 0;
}

.sz-links a {
	position: relative;
	display: block;
	padding: 18px 44px 18px 22px;
	font-size: 15px;
	font-weight: 700;
	color: #24525f;
	text-decoration: none;
	background: #fff;
	border: 1px solid #e3e8ea;
	border-left: 5px solid #8a6a35;
	border-radius: 10px;
	transition: background .2s;
}

.sz-links a::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 20px;
	width: 8px;
	height: 8px;
	margin-top: -4px;
	border-top: 2px solid #8a6a35;
	border-right: 2px solid #8a6a35;
	transform: rotate(45deg);
}

.sz-links a:hover {
	background: #fbf8f1;
}

@media (max-width: 991px) {
	.sz-text {
		grid-template-columns: minmax(0, 1fr);
	}

	.sz-books {
		gap: 16px;
	}
}

@media (max-width: 767px) {
	.sz-intro {
		grid-template-columns: minmax(0, 1fr);
		gap: 18px;
	}

	.sz-intro__fig {
		width: 120px;
		margin: 0 auto;
	}

	.sz-toc__list {
		grid-template-columns: minmax(0, 1fr);
	}

	.sz-figs {
		grid-template-columns: minmax(0, 1fr);
	}

	.sz-books {
		grid-template-columns: minmax(0, 1fr);
		max-width: 360px;
	}

	.sz-links {
		grid-template-columns: minmax(0, 1fr);
	}
}

@media (max-width: 575px) {
	.sz-intro__body p {
		font-size: 15px;
	}

	.sz-toc {
		padding: 22px 16px;
	}

	.sz-title {
		flex-direction: column;
		gap: 8px;
		font-size: 20px;
	}

	.sz-title__no {
		font-size: 15px;
	}

	.sz-quote, .sz-trans {
		padding: 20px 18px;
	}

	.sz-quote__text {
		font-size: 16px;
	}

	.sz-interp__head {
		padding: 18px 18px 16px;
	}

	.sz-interp__body {
		padding: 20px 18px 24px;
	}

	.sz-interp .sz-interp__title {
		font-size: 17px;
	}
}

/* ==========================================================
   よくある質問集（/faq/）
   ========================================================== */

.fq-nav {
	max-width: 960px;
	margin: 0 auto;
}

.fq-nav ul {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 14px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.fq-nav li {
	margin: 0;
}

.fq-nav a {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 4px;
	height: 100%;
	padding: 18px 12px 26px;
	text-align: center;
	text-decoration: none;
	background: #fff;
	border: 1px solid #d8e6e9;
	border-radius: 12px;
	transition: background .2s, border-color .2s;
}

.fq-nav a::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: 11px;
	width: 8px;
	height: 8px;
	margin-left: -4px;
	border-right: 2px solid #00838f;
	border-bottom: 2px solid #00838f;
	transform: rotate(45deg);
}

.fq-nav a:hover {
	background: #effafb;
	border-color: #9fd3db;
}

.fq-nav__t {
	font-size: 15px;
	font-weight: 700;
	line-height: 1.5;
	color: #222;
}

.fq-nav__n {
	font-size: 12px;
	font-weight: 700;
	color: #00838f;
	letter-spacing: .04em;
}

.fq-cat {
	margin: 0 0 26px;
	font-size: 24px;
	font-weight: 700;
	color: #222;
	text-align: center;
	text-transform: none;
}

.fq-cat__q {
	margin: 0 6px;
	font-family: Georgia, serif;
	font-size: 30px;
	color: #00838f;
}

.fq-list {
	max-width: 960px;
	margin: 0 auto;
}

.fq-item {
	margin: 0;
	background: #fff;
	border: 1px solid #e3e8ea;
	border-radius: 12px;
}

.fq-item + .fq-item {
	margin-top: 12px;
}

.fq-item[open] {
	border-color: #9fd3db;
	box-shadow: 0 4px 14px rgba(0, 85, 95, .07);
}

.fq-q {
	display: flex;
	align-items: center;
	gap: 16px;
	padding: 18px 22px;
	cursor: pointer;
	list-style: none;
}

.fq-q::-webkit-details-marker {
	display: none;
}

.fq-q__no {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	font-size: 15px;
	font-weight: 700;
	color: #fff;
	background: #00838f;
	border-radius: 50%;
}

.fq-q__text {
	flex: 1 1 auto;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.65;
	color: #222;
}

.fq-q__icon {
	position: relative;
	flex: 0 0 auto;
	width: 28px;
	height: 28px;
	background: #effafb;
	border-radius: 50%;
}

.fq-q__icon::before, .fq-q__icon::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 12px;
	height: 2px;
	margin: -1px 0 0 -6px;
	background: #00838f;
	transition: transform .2s;
}

.fq-q__icon::after {
	transform: rotate(90deg);
}

.fq-item[open] .fq-q__icon::after {
	transform: rotate(0deg);
}

.fq-q:hover .fq-q__text {
	color: #00838f;
}

.fq-a {
	display: flex;
	gap: 16px;
	margin: 0 22px;
	padding: 20px 0 24px;
	border-top: 1px dashed #d8e6e9;
}

.fq-a__no {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	font-size: 18px;
	font-weight: 700;
	color: #cc5a00;
	background: #fff3e6;
	border-radius: 50%;
}

.fq-a__body {
	flex: 1 1 auto;
	padding-top: 8px;
}

.fq-a__body p {
	margin: 0;
	font-size: 15px;
	line-height: 1.95;
	color: #333;
}

.fq-a__body p + p {
	margin-top: .8em;
}

.fq-a__body a {
	font-weight: 700;
	color: #00838f;
}

.fq-pt {
	color: #00838f;
}

.fq-a__body .fq-btn {
	margin-top: 18px;
}

.fq-a__body .fq-btn a {
	display: inline-block;
	padding: 11px 28px;
	font-size: 14px;
	font-weight: 700;
	color: #fff;
	text-decoration: none;
	background: #00838f;
	border-radius: 999px;
	transition: background .2s;
}

.fq-a__body .fq-btn a:hover {
	background: #006b75;
}

@media (max-width: 767px) {
	.fq-nav ul {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 10px;
	}
}

@media (max-width: 575px) {
	.fq-cat {
		font-size: 20px;
	}

	.fq-q {
		gap: 12px;
		padding: 14px 14px;
	}

	.fq-q__no, .fq-a__no {
		width: 38px;
		height: 38px;
		font-size: 14px;
	}

	.fq-q__text {
		font-size: 15px;
	}

	.fq-a {
		gap: 12px;
		margin: 0 14px;
		padding: 16px 0 20px;
	}

	.fq-a__body {
		padding-top: 5px;
	}
}

/* ==========================================================
   業務改善支援システム ABM（/abm/）
   ========================================================== */

.ab-top {
	max-width: 970px;
	margin: 0 auto 56px;
}

.ab-top img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 12px;
}

.ab-cards {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
	max-width: 1100px;
	margin: 36px auto 0;
}

.ab-card {
	display: flex;
	flex-direction: column;
	overflow: hidden;
	color: #333;
	text-decoration: none;
	background: #fff;
	border: 1px solid #e3e8ea;
	border-radius: 14px;
	box-shadow: 0 2px 10px rgba(0, 0, 0, .04);
	transition: transform .2s, box-shadow .2s, border-color .2s;
}

.ab-card:hover {
	color: #333;
	text-decoration: none;
	border-color: #9fd3db;
	box-shadow: 0 10px 24px rgba(0, 85, 95, .1);
	transform: translateY(-3px);
}

.ab-card__img {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 150px;
	padding: 16px;
	background: #f4f7f8;
	border-bottom: 1px solid #e3e8ea;
}

.ab-card__img img {
	display: block;
	max-width: 100%;
	height: auto;
}

.ab-card__body {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	padding: 22px 24px 22px;
}

.ab-card__no {
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .1em;
	color: #00838f;
}

.ab-card__title {
	margin-top: 4px;
	font-size: 19px;
	font-weight: 700;
	line-height: 1.5;
	color: #222;
}

.ab-card__sub {
	margin-top: 2px;
	font-size: 13px;
	font-weight: 700;
	color: #5d6b70;
}

.ab-card__text {
	flex: 1 1 auto;
	margin-top: 12px;
	font-size: 14px;
	line-height: 1.85;
	color: #444;
}

.ab-card__more {
	position: relative;
	align-self: flex-start;
	margin-top: 16px;
	padding-right: 18px;
	font-size: 14px;
	font-weight: 700;
	color: #00838f;
}

.ab-card__more::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 2px;
	width: 7px;
	height: 7px;
	margin-top: -2px;
	border-right: 2px solid #00838f;
	border-bottom: 2px solid #00838f;
	transform: rotate(45deg);
}

.ab-sec__title {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	margin: 0 0 30px;
	text-align: center;
	text-transform: none;
}

.ab-sec__no {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	font-size: 17px;
	font-weight: 700;
	color: #fff;
	background: #00838f;
	border-radius: 50%;
}

.ab-sec__name {
	font-size: 28px;
	font-weight: 700;
	line-height: 1.45;
	color: #222;
}

.ab-sec__sub {
	display: block;
	margin-top: 4px;
	font-size: 17px;
	color: #5d6b70;
}

.ab-text {
	max-width: 960px;
	margin: 0 auto;
	padding: 32px 36px;
	background: #fff;
	border: 1px solid #e3e8ea;
	border-radius: 14px;
}

.ab-text p {
	margin: 0;
	font-size: 16px;
	line-height: 2;
	color: #333;
}

.ab-text p + p, .ab-text p + .ab-formula, .ab-text .ab-formula + p {
	margin-top: 1em;
}

.ab-text a {
	font-weight: 700;
	color: #00838f;
}

.ab-text .ab-note {
	font-size: 14px;
	color: #666;
}

.ab-text .ab-point {
	padding: 16px 20px;
	font-weight: 700;
	color: #24525f;
	background: #effafb;
	border-radius: 10px;
}

.ab-formula {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 12px 18px;
	padding: 18px 20px;
	background: #effafb;
	border: 1px solid #c4e7ec;
	border-radius: 10px;
}

.ab-formula__label {
	padding: 3px 14px;
	font-size: 13px;
	font-weight: 700;
	color: #fff;
	background: #00838f;
	border-radius: 999px;
}

.ab-formula__exp {
	font-size: 18px;
	font-weight: 700;
	color: #1d4f5c;
}

.ab-fig {
	max-width: 960px;
	margin: 32px auto 0;
	text-align: center;
}

.ab-fig img {
	display: block;
	max-width: 100%;
	height: auto;
	margin: 0 auto;
}

.ab-fig figcaption {
	margin-top: 14px;
	font-size: 15px;
	font-weight: 700;
	line-height: 1.8;
	color: #24525f;
}

@media (max-width: 991px) {
	.ab-cards {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 575px) {
	.ab-top {
		margin-bottom: 40px;
	}

	.ab-cards {
		grid-template-columns: minmax(0, 1fr);
		gap: 16px;
	}

	.ab-sec__name {
		font-size: 22px;
	}

	.ab-sec__sub {
		font-size: 14px;
	}

	.ab-text {
		padding: 22px 18px;
	}

	.ab-text p {
		font-size: 15px;
	}

	.ab-formula__exp {
		font-size: 15px;
	}
}

/* ==========================================================
   顧客深耕AO（/ao/）
   ========================================================== */

.ao-lead {
	max-width: 860px;
	margin: 18px auto 30px;
	font-size: 15px;
	line-height: 2;
	color: #444;
}

.ao-crm {
	max-width: 860px;
	margin: 48px auto 0;
	padding: 26px 30px;
	text-align: left;
	background: #f4f7f8;
	border: 1px solid #e3e8ea;
	border-radius: 12px;
}

.ao-crm .ao-crm__title {
	margin: 0 0 10px;
	font-size: 18px;
	font-weight: 700;
	color: #00838f;
	text-transform: none;
}

.ao-crm p {
	margin: 0;
	font-size: 15px;
	line-height: 1.95;
	color: #333;
}

.ao-list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.ao-list li {
	position: relative;
	margin: 0;
	padding: 8px 0 8px 22px;
	font-size: 15px;
	line-height: 1.8;
	color: #333;
	border-bottom: 1px dashed #dde4e6;
}

.ao-list li::before {
	content: "";
	position: absolute;
	left: 4px;
	top: 18px;
	width: 8px;
	height: 8px;
	background: #00a5bb;
	border-radius: 50%;
}

@media (max-width: 575px) {
	.ao-lead {
		text-align: left;
	}

	.ao-crm {
		padding: 20px 18px;
	}
}

/* ==========================================================
   案件スコアリング（/scoring/）
   ========================================================== */

.sc-points {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 20px;
	max-width: 1080px;
	margin: 0 auto;
}

.sc-point {
	display: flex;
	flex-direction: column;
	gap: 12px;
	padding: 24px 24px 22px;
	background: #fff;
	border: 1px solid #e3e8ea;
	border-top: 4px solid #00a5bb;
	border-radius: 12px;
}

.sc-point__no {
	font-size: 22px;
	font-weight: 700;
	line-height: 1;
	color: #00a5bb;
}

.sc-point p {
	margin: 0;
	font-size: 15px;
	line-height: 1.9;
	color: #333;
}

.sc-point strong {
	color: #00838f;
}

.sc-fig {
	max-width: 960px;
	margin: 40px auto 0;
}

.sc-fig img {
	display: block;
	width: 100%;
	height: auto;
	border: 1px solid #e3e8ea;
	border-radius: 10px;
	background: #fff;
}

.sc-note {
	max-width: 960px;
	margin: 14px auto 0;
	font-size: 14px;
	line-height: 1.8;
	color: #666;
}

.sc-details {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 18px;
	max-width: 1080px;
	margin: 30px auto 0;
}

.sc-detail {
	padding: 22px 24px;
	background: #fff;
	border: 1px solid #e3e8ea;
	border-radius: 12px;
}

.sc-detail p {
	margin: 0;
	font-size: 15px;
	line-height: 1.9;
	color: #333;
}

.sc-detail .sc-detail__title {
	display: inline-block;
	margin: 0 0 10px;
	padding: 3px 14px;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.6;
	color: #fff;
	background: #00838f;
	border-radius: 999px;
}

.sc-prods {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
	max-width: 1100px;
	margin: 0 auto;
}

.sc-prod {
	display: flex;
	flex-direction: column;
	overflow: hidden;
	color: #333;
	text-decoration: none;
	background: #fff;
	border: 1px solid #e3e8ea;
	border-radius: 14px;
	box-shadow: 0 2px 10px rgba(0, 0, 0, .04);
	transition: transform .2s, box-shadow .2s, border-color .2s;
}

.sc-prod:hover {
	color: #333;
	text-decoration: none;
	border-color: #9fd3db;
	box-shadow: 0 10px 24px rgba(0, 85, 95, .1);
	transform: translateY(-3px);
}

.sc-prod__img {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 16px;
	background: #f4f7f8;
	border-bottom: 1px solid #e3e8ea;
}

.sc-prod__img img {
	display: block;
	max-width: 100%;
	height: auto;
}

.sc-prod__body {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	padding: 20px 22px 22px;
}

.sc-prod__title {
	font-size: 17px;
	font-weight: 700;
	line-height: 1.5;
	color: #222;
}

.sc-prod__text {
	flex: 1 1 auto;
	margin-top: 10px;
	font-size: 14px;
	line-height: 1.85;
	color: #444;
}

.sc-prod__more {
	position: relative;
	align-self: flex-start;
	margin-top: 14px;
	padding-right: 16px;
	font-size: 14px;
	font-weight: 700;
	color: #00838f;
}

.sc-prod__more::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 2px;
	width: 7px;
	height: 7px;
	margin-top: -4px;
	border-top: 2px solid #00838f;
	border-right: 2px solid #00838f;
	transform: rotate(45deg);
}

@media (max-width: 991px) {
	.sc-points {
		grid-template-columns: minmax(0, 1fr);
	}

	.sc-prods {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 767px) {
	.sc-details {
		grid-template-columns: minmax(0, 1fr);
	}
}

@media (max-width: 575px) {
	.sc-prods {
		grid-template-columns: minmax(0, 1fr);
		gap: 16px;
	}

	.sc-fig {
		margin-top: 28px;
	}
}

/* ==========================================================
   レポート機能（/report/）※/scoring/ の sc- クラスも使用
   ========================================================== */

.rp-targets {
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: 14px;
	max-width: 1100px;
	margin: 0 auto;
	padding: 0;
	list-style: none;
}

.rp-targets li {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 4px;
	margin: 0;
	padding: 18px 12px;
	text-align: center;
	background: #fff;
	border: 1px solid #e3e8ea;
	border-top: 4px solid #00a5bb;
	border-radius: 12px;
}

.rp-target__name {
	font-size: 15px;
	font-weight: 700;
	line-height: 1.5;
	color: #222;
}

.rp-target__desc {
	font-size: 13px;
	line-height: 1.6;
	color: #5d6b70;
}

.rp-player {
	max-width: 980px;
	margin: 36px auto 0;
	text-align: center;
}

.rp-player > * {
	max-width: 100%;
}

.rp-details {
	margin-top: 36px;
}

.rp-details .sc-detail p + p {
	margin-top: .6em;
}

@media (max-width: 991px) {
	.rp-targets {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (max-width: 575px) {
	.rp-targets {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 10px;
	}
}

/* ==========================================================
   無料スマホアプリ Sales Force Assistant Personal
   ========================================================== */

.ps-hero {
	position: relative;
	overflow: hidden;
	padding: 56px 0 60px;
	background: linear-gradient(135deg, #eaf4fb 0%, #dcecf7 55%, #f3f9fc 100%);
}

.ps-hero__inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr);
	gap: 40px;
	align-items: center;
}

.ps-hero__label {
	display: inline-block;
	margin: 0 0 14px;
	padding: 4px 16px;
	font-size: 14px;
	font-weight: 700;
	color: #fff;
	background: #356bb3;
	border-radius: 999px;
}

.ps-hero__title {
	margin: 0;
	font-size: 40px;
	font-weight: 700;
	line-height: 1.25;
	color: #1d3557;
	text-transform: none;
}

.ps-hero__title span {
	display: block;
	color: #356bb3;
}

.ps-hero__tags {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin: 24px 0 26px;
	padding: 0;
	list-style: none;
}

.ps-hero__tags li {
	margin: 0;
	padding: 12px 18px;
	font-size: 15px;
	font-weight: 700;
	line-height: 1.6;
	color: #356bb3;
	background: #fff;
	border: 1px solid #c8dcef;
	border-radius: 10px;
}

.ps-gp {
	display: inline-block;
	transition: opacity .2s;
}

.ps-gp:hover {
	opacity: .85;
}

.ps-gp img {
	display: block;
	max-width: 100%;
	height: auto;
}

.ps-hero__visual img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 12px;
}

.ps-imgtitle {
	margin: 0 0 26px;
	text-align: center;
	text-transform: none;
}

.ps-imgtitle img {
	display: inline-block;
	max-width: 100%;
	height: auto;
}

.ps-title {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6px;
	margin: 0 0 28px;
	text-align: center;
	text-transform: none;
}

.ps-title__main {
	font-size: 32px;
	font-weight: 700;
	line-height: 1.35;
	color: #1d3557;
}

.ps-title__main small {
	margin-left: 4px;
	font-size: 20px;
	font-weight: 700;
	color: #1d3557;
}

.ps-title__kana {
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .12em;
	color: #356bb3;
}

.ps-lead {
	max-width: 900px;
	margin: 0 auto;
	font-size: 16px;
	line-height: 2;
	color: #333;
}

.ps-visual2 {
	max-width: 960px;
	margin: 40px auto 0;
}

.ps-visual2 img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 12px;
}

.ps-kinos {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
	max-width: 960px;
	margin: 40px auto 0;
	padding: 0;
	list-style: none;
}

.ps-kinos li {
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0;
}

.ps-kinos img {
	display: block;
	max-width: 100%;
	height: auto;
}

.ps-feat {
	max-width: 1080px;
	margin: 0 auto;
	padding: 34px 36px;
	background: #fff;
	border: 1px solid #e3e8ea;
	border-radius: 16px;
}

.ps-feat + .ps-feat {
	margin-top: 28px;
}

.ps-feat__head {
	display: flex;
	align-items: center;
	gap: 14px;
	margin-bottom: 16px;
}

.ps-feat__no {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	font-size: 16px;
	font-weight: 700;
	color: #fff;
	background: #356bb3;
	border-radius: 50%;
}

.ps-feat .ps-feat__title {
	margin: 0;
	font-size: 24px;
	font-weight: 700;
	color: #1d3557;
	text-transform: none;
}

.ps-feat__lead p {
	margin: 0;
	font-size: 15px;
	line-height: 1.95;
	color: #333;
}

.ps-feat__lead .ps-feat__catch {
	margin-bottom: 6px;
	font-size: 17px;
	font-weight: 700;
	color: #356bb3;
}

.ps-shots {
	display: flex;
	gap: 16px;
	margin: 24px 0 0;
	padding: 4px 2px 14px;
	overflow-x: auto;
	list-style: none;
	scroll-snap-type: x mandatory;
	-webkit-overflow-scrolling: touch;
}

.ps-shots li {
	flex: 0 0 auto;
	margin: 0;
	scroll-snap-align: start;
}

.ps-shots img {
	display: block;
	width: auto;
	max-width: none;
	height: 360px;
	border: 1px solid #e3e8ea;
	border-radius: 12px;
	background: #fff;
}

.ps-points {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 16px;
	margin-top: 20px;
}

.ps-point {
	padding: 18px 20px;
	background: #f3f8fc;
	border: 1px solid #d8e6f2;
	border-radius: 12px;
}

.ps-point p {
	margin: 0;
	font-size: 14px;
	line-height: 1.85;
	color: #333;
}

.ps-point .ps-point__title {
	margin: 6px 0 6px;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.5;
	color: #1d3557;
}

.ps-point__no {
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .1em;
	color: #356bb3;
}

.ps-dl {
	display: flex;
	flex-direction: column;
	align-items: center;
	max-width: 960px;
	margin: 0 auto;
}

.ps-dl > * {
	max-width: 100%;
}

.ps-dl .ps-gp, .ps-dl__img {
	display: block;
	max-width: 100%;
	height: auto;
}

.ps-more {
	margin: 36px 0 0;
	text-align: center;
}

.ps-more a {
	display: inline-block;
	transition: opacity .2s;
}

.ps-more a:hover {
	opacity: .85;
}

.ps-more img {
	display: block;
	max-width: 100%;
	height: auto;
}

@media (max-width: 991px) {
	.ps-hero__inner {
		grid-template-columns: minmax(0, 1fr);
	}

	.ps-hero__title {
		font-size: 32px;
	}
}

@media (max-width: 575px) {
	.ps-hero {
		padding: 40px 0 44px;
	}

	.ps-hero__title {
		font-size: 26px;
	}

	.ps-lead {
		font-size: 15px;
	}

	.ps-title__main {
		font-size: 22px;
	}

	.ps-title__main small {
		font-size: 16px;
	}

	.ps-title__kana {
		font-size: 11px;
		letter-spacing: .06em;
	}

	.ps-kinos {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 10px;
	}

	.ps-feat {
		padding: 24px 18px;
	}

	.ps-feat .ps-feat__title {
		font-size: 20px;
	}

	.ps-shots img {
		height: 300px;
	}
}

/* ==========================================================
   サイトマップ（/sitemap/）
   ========================================================== */

.sm-grid {
	max-width: 1100px;
	margin: 0 auto;
	column-count: 3;
	column-gap: 24px;
}

.sm-card {
	display: inline-block;
	width: 100%;
	margin: 0 0 24px;
	overflow: hidden;
	background: #fff;
	border: 1px solid #dbe6e9;
	border-radius: 14px;
	box-shadow: 0 4px 14px rgba(0, 70, 80, .06);
	break-inside: avoid;
}

.sm-card .sm-card__title {
	position: relative;
	margin: 0;
	padding: 16px 22px 15px 38px;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.6;
	color: #1d4f5c;
	text-transform: none;
	background: linear-gradient(135deg, #f0f9fa 0%, #e2f2f5 100%);
	border-bottom: 1px solid #d3e9ed;
}

.sm-card .sm-card__title::before {
	content: "";
	position: absolute;
	left: 20px;
	top: 50%;
	width: 8px;
	height: 8px;
	margin-top: -4px;
	background: #00a5bb;
	border-radius: 50%;
	box-shadow: 0 0 0 4px rgba(0, 165, 187, .18);
}

.sm-card .sm-list {
	padding: 8px 22px 14px;
}

.sm-card__title a {
	color: #1d4f5c;
	text-decoration: none;
}

.sm-card__title a:hover {
	color: #00838f;
}

.sm-list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.sm-list li {
	position: relative;
	margin: 0;
	padding: 7px 0 7px 16px;
	font-size: 14px;
	line-height: 1.7;
	border-top: 1px dashed #e3e8ea;
}

.sm-list li:first-child {
	border-top: 0;
}

.sm-list li::before {
	content: "";
	position: absolute;
	left: 2px;
	top: 15px;
	width: 6px;
	height: 6px;
	border-top: 2px solid #00a5bb;
	border-right: 2px solid #00a5bb;
	transform: rotate(45deg);
}

.sm-list a {
	color: #333;
	text-decoration: none;
}

.sm-list a:hover {
	color: #00838f;
	text-decoration: underline;
}

.sm-sub {
	display: block;
	font-size: 12px;
	color: #777;
}

@media (max-width: 991px) {
	.sm-grid {
		column-count: 2;
	}
}

@media (max-width: 575px) {
	.sm-grid {
		column-count: 1;
	}
}

/* ==========================================================
   クロス集計機能（/cross/）
   ========================================================== */

.cr-fig {
	max-width: 1000px;
	margin-top: 0;
}

.cr-subtitle {
	margin: 56px 0 24px;
	font-size: 22px;
	font-weight: 700;
	line-height: 1.5;
	color: #222;
	text-align: center;
	text-transform: none;
}

.cr-feats {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
	max-width: 1000px;
	margin: 0 auto;
	padding: 0;
	list-style: none;
	counter-reset: none;
}

.cr-feats li {
	display: flex;
	align-items: flex-start;
	gap: 14px;
	margin: 0;
	padding: 20px 18px;
	text-align: left;
	background: #fff;
	border: 1px solid #e3e8ea;
	border-radius: 12px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, .04);
}

.cr-feat__num {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	font-size: 15px;
	font-weight: 700;
	color: #fff;
	background: #00a5bb;
	border-radius: 50%;
}

.cr-feat__text {
	font-size: 15px;
	line-height: 1.8;
	color: #333;
}

@media (max-width: 991px) {
	.cr-feats {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 575px) {
	.cr-feats {
		grid-template-columns: 1fr;
	}

	.cr-subtitle {
		margin-top: 40px;
		font-size: 19px;
	}
}
