@charset "utf-8";

@media all and (width < 750px) {
	.vi-level2 {
		background: url(../img/bak_vi01_sp.jpg) no-repeat center / cover;
	}
}
@media all and (width >= 750px) {
	.vi-level2 {
		background: url(../img/bak_vi01_pc.jpg) no-repeat center / cover;
	}
}

.contents .mod-h3::before {
	border-color: #024f81;
}
.contents .cap {
	margin-top: .5em;
	font-weight: 500;
	line-height: 1.3;
}

.fig {
	overflow: inherit;
}
.fig-inner {
	width: auto;
	justify-content: center;
	column-gap: 3%;
}
.fig-inner p {
	width: fit-content;
}
.fig-inner p span.small {
	font-size: smaller;
}
.fig .pageLink { flex: 1;}

@media all and (width < 750px) {
	.fig-inner {
		flex-direction: column;
		row-gap: 20px;
		align-items: flex-start;
	}
	.fig .pageLink { text-align: left; }
}


/*	exsx
-------------------------------------------------- */

@media all and (width < 750px) {
	.ezsx .img {
		width: 40%;
		margin-right: 15px;
		margin-bottom: 15px;
		float: left;
		text-align: center;
	}
}
@media all and (width >= 750px) {
	.ezsx-inner {
		display: flex;
		justify-content: space-between;
	}
	.ezsx .img {
		width: 332px;
		text-align: center;
	}
	.ezsx-box {
		width: 808px;
	}
}


/*	assessment
-------------------------------------------------- */
.assessment {
	display: flex;
	flex-wrap: wrap;
	width: fit-content;
	max-width: 1140px;
	margin: 25px auto 0;
	column-gap: 10px;
	row-gap: 10px;
}
.assessment li {
	width: 50%;
	max-width: 196px;
	text-align: center;
}
.assessment li .cap {
	font-size: 1.1rem;
}

@media all and (width >= 750px) {
	.assessment {
		margin-top: 35px;
		column-gap: 27.5px;
	}
	.assessment li {
		width: 196px;
	}
	.assessment li .cap {
		font-size: 1.3rem;
	}
}

/*	movie
-------------------------------------------------- */
.movie table {
	font-weight: 700;
	margin-top: 15px;
}
.movie table td {
	text-align: left;
}

@media all and (width >= 750px) {
	.movie-inner {
		display: flex;
		justify-content: space-between;
	}
	.movie-box { width: 488px; }
	.movie table {
		width: 607px;
		margin-top: 0;
	}
}

/*	predict
-------------------------------------------------- */
.predict-inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	margin: 2em auto;
	text-align: center;
}
.predict-inner .predict-box:first-child { width: 230px; }
.predict-inner .predict-box:nth-child(2) { width: 279px; }
.predict-inner .predict-box:last-child { width: 316px; }
.predict .cap {	font-size: 1.3rem; }
@media all and (width < 750px) {
	.predict .arrow {
		padding: 0 10px;
	}
}
@media all and (width >= 750px) {
	.predict {
		width: 1020px;
		margin: 0 auto;
	}
	.predict-inner { flex-wrap: nowrap;}
	.predict .arrow {
		width: 8%;
		text-align: center;
	}
	.predict .cap {
		font-size: 1.4rem;
	}
}

/*	relation
-------------------------------------------------- */
.relation {
	margin-top: 3em;
	padding: 2em 15px 3em;
	background-color: #fcfcfc;
	border: solid 2px #f4f3f3;
}
.relation-inner li { margin-top: 2em; }
.relation-inner dt {
	margin-bottom: 5px;
	font-weight: 700;
}
.relation-inner dd {
	line-height: 1.8;
}
.relation-inner dd + dd { margin-top: 1em;}

@media all and (width < 750px) {
	.relation-inner li:after {
		display: block;
		clear: both;
		content: '';
	}
	.relation-inner li .img {
		float: left;
		margin-right: 1em;
		margin-bottom: 1em;
	}
	.rel01 .relation-inner li .img {
		width: 23%;
	}
	.rel02 .relation-inner li .img {
		width: 35%;
	}
}
@media all and (width >= 750px) {
	.relation {
		padding: 2em 40px 3em;
		border-width: 4px;
	}
	.relation-inner li {
		display: flex;
		column-gap: 35px;
		width: 100%;
	}

	.rel01 .relation-inner li .img {
		width: 174px;
	}
	.rel02 .relation-inner li .img {
		width: 218px;
	}
	.relation-inner dl { flex: 1;}
	.relation-inner dd {
		line-height: 2;
	}
}

/*	particle
-------------------------------------------------- */
.particle-box dt {
	position: relative;
	padding-left: 1em;
	font-weight: 700;
}
.particle-box dt::before {
	position: absolute;
	left: 0;
	top: .5em;
	display: block;
	width: .7em;
	height: .7em;
	border-radius: .4em;
	background-color: #333;
	content: '';
}
.particle-inner dd {
	margin-top: 10px;
}
@media all and (width >= 750px) {
	.particle-inner {
		display: flex;
		column-gap: 63px;
	}
	.particle-box { flex: 1;}
}

/*	tech
-------------------------------------------------- */
.tech-inner > .img {
	text-align: center;
}
.tech-box {
	margin-top: 1em;
	display: flex;
	column-gap: 10px;
}
.tech-box dl {
	flex:1;
	text-align: center;
}
.tech-box dt {
	margin-bottom: 15px;
	font-weight: 700;
}

@media all and (width >= 750px) {
	.tech-inner {
		display: flex;
		column-gap: 71px;
	}
	.tech-box {
		column-gap: 40px;
		margin-top: 0;
	}
	.tech-box dl {
		flex: auto;
	}
}

/*	chart
-------------------------------------------------- */
.chart > div + div { margin-top: 1.5em;}
.chart dt.cap {
	margin-top: 0;
	margin-bottom: .5em;
	text-align: center;
}
.chart.second { margin-top: 20px; }
.chart.second .img { text-align: center;}
.chart .leadtxt { margin-top: 5px;}

@media all and (width >= 750px) {
	.chart > div + div { margin-top: 0;}
	.chart {
		display: flex;
		column-gap: 66px;
	}
	.chart.second {
		margin-top: 2em;
	}
}

/*	know
-------------------------------------------------- */
.know-inner { margin-top: 10px;}
.know-inner > div + div { margin-top: 20px;}
.know-box p { text-align: center;}

@media all and (width >= 750px) {
	.know-inner {
		display: flex;
		column-gap: 32px;
		margin-top: 25px;
	}
	.know-inner > div + div { margin-top: 0;}
}

/*	tea
-------------------------------------------------- */
.tea-inner { margin-top: 10px; }
.tea-inner > div + div { margin-top: 20px;}
.tea-box p { text-align: center; }

@media all and (width >= 750px) {
	.tea-inner {
		display: flex;
		column-gap: 68px;
		margin-top: 25px;
	}
	.tea-inner > div + div { margin-top: 0;}
}

/*	bread
-------------------------------------------------- */
.bread-inner { margin-top: 15px;}
.bread-inner > div + div { margin-top: 20px;}
.bread-box p { text-align: center; }

.bread .leadimg {
	margin-top: 10px;
	width: fit-content;
	margin: 0 auto;
}
.bread .leadimg .cap { margin-top: 5px;}

@media all and (width >= 750px) {
	.bread-inner {
		display: flex;
		column-gap: 68px;
		width: fit-content;
		margin: 25px auto 0;
	}
	.bread-inner > div + div { margin-top: 0;}
	.bread-box .img {
		display: grid;
		place-content: center;
		height: 202px;
	}
	.bread-box .cap { margin-top: 15px; }

	.bread .leadimg { margin-top: 30px; }
	.bread .leadimg p { text-align: center;}
}

/*	ndi
-------------------------------------------------- */
.ndi .img { margin-top: 1em; }
.ndi-product {
	display: flex;
	column-gap: 15px;
	width: fit-content;
	margin: 2em auto 0;
}
.ndi-product > dl {
	flex: 1;
}
.ndi-product dt {
	display: grid;
	place-content: center;
	padding: .3em .5em;
	min-height: 4.9em;
	line-height: 1.3;
	text-align: center;
	background-color: #f2f8fb;
}
.ndi-product dd {
	margin-top: 10px;
	text-align: center;
}
.ndi-example-inner > figure { text-align: center;}
.ndi-example-inner > figure + figure { margin-top: 1.5em;}
.ndi-example-inner .note {
	font-weight: 400;
}

@media all and (width >= 750px) {
	.ndi {
		display: flex;
		column-gap: 55px;
	}
	.ndi .txt { flex: 1;}
	.ndi .img {
		margin-top: 0;
		width: 540px;
	}
	.ndi-example-inner {
		display: flex;
		column-gap: 60px;
	}
	.ndi-example-inner > figure + figure { margin-top: 0;}
}