@charset "UTF-8";
:root {
	--color-font: #05174c;
	--color-base: #f6f9fe;
	--color-base2: #edf2fc;
	--color-accent: #034dc1;
	--color-accent2: #624eff;
	--color-blue1: #497fe2;
	--color-blue2: #dce3f7;
	--color-gray: #ccc;
	--color-gradation: linear-gradient(to bottom,#0343ab 0%, #033085 100%);
	--font-serif: "Noto Serif JP", serif;
}
/*----------------------------
	background
-----------------------------*/
.bg--white { background-color: #fff; }
.bg--base { background-color: var(--color-base2); }

/*----------------------------
	text
-----------------------------*/
.c--white { color: #fff; }
.c--accent { color: var(--color-accent); }

.fs--large	{ font-size: 2.5rem; }
.fs--middle	{ font-size: 1.25rem; }
.fs--small	{ font-size: .875rem; }

.bold { font-weight: bold; }

.align--l { text-align: left; }
.align--c { text-align: center; }
.align--r { text-align: right; }

/*----------------------------
	box
-----------------------------*/
.mt--10 { margin-top: 10px; }
.mr--10 { margin-right: 10px; }
.mb--10 { margin-bottom: 10px; }
.ml--10 { margin-left: 10px; }

.pt--10 { padding-top: 10px; }
.pr--10 { padding-right: 10px; }
.pb--10 { padding-bottom: 10px; }
.pl--10 { padding-left: 10px; }

/*----------------------------
	display
-----------------------------*/
.block		{ display: block; }
.inblock	{ display: inline-block; }
.flex		{ display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: flex; }

.sp {
	display: none;
}

.pst--rel { position: relative; }
.pst--abs { position: absolute; }
.pst--fix { position: fixed; }

.w--half { width: 50%; }

/*----------------------------
	list
-----------------------------*/
.list__item {
	position: relative;
	padding-left: 2rem;
}
.list__item::before {
	content: "";
	position: absolute;
	width: 1rem;
	height: .1875rem;
	background: var(--color-accent);
	top: .75rem;
	left: 0;
}
.list__item + .list__item {
	margin-top: 1.125rem;
}
/* 3カラム */
.list--3column {
	display: flex;
	gap: 1.25rem;
}
.list--3column__item {
	width: calc((100% - 2.5rem)/3);
	border-radius: 5px;
	padding: 2rem;
	background: #fff;
}
.list--3column__item .title {
	font-size: 1.5rem;
	margin-bottom: 1rem;
	font-weight: 600;
}
/* ３カラムボーダーあり */
.bd .list--3column__item {
	border: 1px solid var(--color-gray);
}
.bd .list--3column__item img {
	margin: 0 auto 1rem;
}
.bd .list--3column__item .title {
	text-align: center;
}
/* ３カラムアイコンあり */
.list--3column__item.icon {
	padding: 0 0 0 7.5rem;
}
.list--3column__item.icon::before {
	width: 6.25rem;
	height: 6.25rem;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 2;
}
.list--3column__item.icon::after {
	content: "";
	position: absolute;
	width: 6.25rem;
	height: 6.25rem;
	background: var(--color-base2);
	border-radius: 50%;
	left: 0;
	top: 0;
	z-index: 1;
}
/* １カラムアイコンあり */
.list--icon__item {
	padding-left: 5rem;
}
.list--icon__item .title {
	font-size: 1.5rem;
	margin-bottom: .625rem;
	font-weight: 600;
}
.list--icon__item + .list--icon__item {
	margin-top: 1rem;
}
.list--icon__item.icon::before {
	width: 2.5rem;
	height: 2.5rem;
	position: absolute;
	left: .625rem;
	top: .625rem;
	z-index: 2;
}
.list--icon__item.icon::after {
	content: "";
	width: 3.75rem;
	height: 3.75rem;
	border: .5rem solid #fff;
	background: var(--color-base2);
	border-radius: 50%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
}
/* 1カラムボーダーあり */
.list--bd__item {
	background: #fff;
	border: solid 1px var(--color-gray);
	padding: 1rem 2.875rem;
	border-radius: 5px;
	position: relative;
}
.list--bd__item + .list--bd__item {
	margin-top: 1rem;
}
.line .list--bd__item::before,
.check .list--bd__item::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
}
.line .list--bd__item::before {
	width: 1rem;
	height: .1875rem;
	background: var(--color-accent);
	top: 1.6875rem;
	left: 1.125rem;
}
.check .list--bd__item::before {
	width: 1rem;
	height: .625rem;
	border-left: .1875rem solid var(--color-accent);
	border-bottom: .1875rem solid var(--color-accent);
	transform: rotate(-45deg);
	top: 1.375rem;
	left: 1.125rem;
}
/* チェックだけ */
.list--check__item {
	padding-left: 2rem;
	position: relative;
}
.list--check__item + .list--check__item {
	margin-top: .625rem;
}
.list--check__item::before {
	content: "";
	position: absolute;
	width: 1rem;
	height: .625rem;
	border-left: .1875rem solid var(--color-accent);
	border-bottom: .1875rem solid var(--color-accent);
	transform: rotate(-45deg);
	top: .375rem;
	left: 0;
}
/*----------------------------
	icon
-----------------------------*/
.icon {
	position: relative;
}
.icon::before {
	content: "";
	display: block;
	background-color: var(--color-accent2);
	mask-size: contain;
	mask-repeat: no-repeat;
	mask-position: center;
}
.icon--mail::before {
	background-color: #fff;
	aspect-ratio: 1;
	height: max-content;
	mask-image: url(../img/icon_mail.png);
    -webkit-mask-image: url(../img/icon_mail.png);
}
.icon--teibunshi::before {
	mask-image: url(../img/icon_teibunshi.png);
    -webkit-mask-image: url(../img/icon_teibunshi.png);
}
.icon--AI_brain::before {
	mask-image: url(../img/icon_AI_brain.png);
    -webkit-mask-image: url(../img/icon_AI_brain.png);
}
.icon--AI_brain_auto::before {
	mask-image: url(../img/icon_AI_brain_auto.png);
    -webkit-mask-image: url(../img/icon_AI_brain_auto.png);
}
.icon--network::before {
	mask-image: url(../img/icon_network.png);
    -webkit-mask-image: url(../img/icon_network.png);
}
.icon--beaker::before {
	mask-image: url(../img/icon_beaker.png);
    -webkit-mask-image: url(../img/icon_beaker.png);
}
.icon--hands::before {
	mask-image: url(../img/icon_hands.png);
    -webkit-mask-image: url(../img/icon_hands.png);
}
.icon--time::before {
	mask-image: url(../img/icon_time.png);
    -webkit-mask-image: url(../img/icon_time.png);
}
.icon--graph::before {
	mask-image: url(../img/icon_graph.png);
    -webkit-mask-image: url(../img/icon_graph.png);
}
.icon--cost::before {
	mask-image: url(../img/icon_cost.png);
    -webkit-mask-image: url(../img/icon_cost.png);
}
.icon--target::before {
	mask-image: url(../img/icon_target.png);
    -webkit-mask-image: url(../img/icon_target.png);
}
.icon--qa::before {
	mask-image: url(../img/icon_qa.png);
    -webkit-mask-image: url(../img/icon_qa.png);
}
/*----------------------------
	media query
-----------------------------*/
@media screen and (max-width: 960px){
	.list--3column__item.icon {
		padding: 0 0 0 4.375rem;
	}
	.list--3column__item.icon::before {
		width: 3.7525rem;
		height: 3.7525rem;
	}
	.list--3column__item.icon::after {
		width: 3.75rem;
		height: 3.75rem;
	}
}
@media screen and (max-width: 768px){
	.pc {
		display: none;
	}
	.sp {
		display: block;
	}
	.flex {
		flex-direction: column;
	}
	.w--half {
		width: 100%;
	}
	/*----------------------------
		list
	-----------------------------*/
	.list__item {
		padding-left: 1.5rem;
	}
	.list__item::before {
		width: .75rem;
		top: .625rem;
	}
	.list--3column {
		flex-direction: column;
	}
	.list--3column__item {
		width: 100%;
		padding: 1rem;
	}
	.list--3column__item .title {
		font-size: 1.125rem;
		margin-bottom: .625rem;
	}
	.bd .list--3column__item img {
		width: 5rem;
	}
	.list--bd__item {
		padding: .75rem 2.5rem;
	}
	.line .list--bd__item::before {
		width: .75rem;
		top: 1.375rem;
		left: 1.125rem;
	}
	.check .list--bd__item::before {
		width: .75rem;
		height: .5rem;
		top: 1.0625rem;
	}
	.list--check__item {
		padding-left: 1.25rem;
	}
	.list--check__item::before {
        width: .75rem;
        height: .5rem;
		top: .3125rem;
    }
	.list--icon__item {
		padding-left: 3.75rem;
	}
	.list--icon__item + .list--icon__item {
		margin-top: 2rem;
	}
	.list--icon__item.icon::before {
		width: 2.1875rem;
		height: 2.1875rem;
		left: .5rem;
		top: .5rem;
	}
	.list--icon__item.icon::after {
		width: 3.125rem;
		height: 3.125rem;
		border-width: .375rem;
	}
	.list--icon__item .title {
		font-size: 1.125rem;
	}
}