@charset "UTF-8";


	
	
/* breadcrumbs
--------------------- */
#breadcrumbs.c-white {
	position: relative;
	z-index: 2;
}
	#breadcrumbs.c-white a {
		color: #fff;
	}


	
	
/* pagetitle
--------------------- */
#pagetitle.message {
	background: url("../img/message/mainpht.webp") no-repeat center top / cover;
	margin-top: calc(-40 * var(--vw-ratio));
	padding-top: calc(40 * var(--vw-ratio));
	padding-bottom: calc(200 * var(--vw-ratio));
	position: relative;
	z-index: 0;
}
#pagetitle.message:before {
	content: "";
	width: -webkit-calc(100% - 100px);
	width: calc(100% - 100px);
	height: calc(100 * var(--vw-ratio));
	background: #fff;
	position: absolute;
	bottom: 0;
	left: calc(50 * var(--vw-ratio));
}
	#pagetitle.message .content {
		width: 50%;
		padding-top: calc(100 * var(--vw-ratio));
	}
		#pagetitle.message .content .gesture01 {
			width: calc(220 * var(--vw-ratio));
			position: absolute;
			top: calc(60 * var(--vw-ratio));
			right: calc(20 * var(--vw-ratio));
		}
		#pagetitle.message .content h2 {
			font-size: calc(40 * var(--vw-ratio));
			font-weight: 700;
			line-height: 1.4em;
			margin-bottom: calc(40 * var(--vw-ratio));
		}

		#pagetitle.message .content .txt-16 {
			margin-bottom: calc(30 * var(--vw-ratio));
			font-weight: 500;
		}
		#pagetitle.message .content .txt-16:nth-last-child(1) {
			margin-bottom: 0;
		}

#pagetitle.vision {
	background: url("../img/vision/pagetitle_pht.webp") no-repeat center top / cover;
	margin-top: calc(-40 * var(--vw-ratio));
	padding-top: calc(40 * var(--vw-ratio));
	padding-bottom: calc(200 * var(--vw-ratio));
	position: relative;
	z-index: 0;
}
#pagetitle.vision:before {
	content: "";
	width: -webkit-calc(100% - 100px);
	width: calc(100% - 100px);
	height: calc(100 * var(--vw-ratio));
	background: #fff;
	position: absolute;
	bottom: 0;
	left: calc(50 * var(--vw-ratio));
}


#pagetitle.business {
	width: 100%;
	position: relative;
}
	#pagetitle.business .document {
		text-align: center;
		margin-top: calc(80 * var(--vw-ratio));
	}
		#pagetitle.business .document .en {
			line-height: 1.3em;
			margin-bottom: calc(10 * var(--vw-ratio));
		}

		#pagetitle.business .document h2 {
			font-size: calc(30 * var(--vw-ratio));
			line-height: 1.4em;
			margin-bottom: calc(25 * var(--vw-ratio));
		}

		#pagetitle.business .document .circle {
			width: calc(560 * var(--vw-ratio));
			margin: calc(50 * var(--vw-ratio)) auto 0 auto;
		}

	#pagetitle.business .gallery-wrap {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
	}
		#pagetitle.business .gallery {
			width: 100%;
			position: sticky;
			top: calc(70 * var(--vw-ratio));
		}
			#pagetitle.business .gallery ul {
				width: 100%;
				height: calc(500 * var(--vw-ratio));
				position: relative;
			}
				#pagetitle.business .gallery ul li {
					position: absolute;
				}
				#pagetitle.business .gallery ul li.pht01 {
					width: calc(180 * var(--vw-ratio));
					top: calc(30 * var(--vw-ratio));
					left: calc(100 * var(--vw-ratio));
				}
				#pagetitle.business .gallery ul li.pht02 {
					width: calc(200 * var(--vw-ratio));
					top: calc(110 * var(--vw-ratio));
					right: calc(120 * var(--vw-ratio));
				}
				#pagetitle.business .gallery ul li.pht03 {
					width: calc(370 * var(--vw-ratio));
					top: calc(330 * var(--vw-ratio));
					left: calc(0 * var(--vw-ratio));
				}


#pagetitle.global {
	width: 100%;
}
	#pagetitle.global .content {
		width: 58%;
		padding-top: calc(80 * var(--vw-ratio));
	}
		#pagetitle.global .content .ttl {
			margin-bottom: calc(70 * var(--vw-ratio));
			position: relative;
		}
			#pagetitle.global .content .ttl h1 {
				font-size: calc(23 * var(--vw-ratio));
				font-weight: 700;
				line-height: 1.5em;
				position: absolute;
				top: calc(15 * var(--vw-ratio));
				right: calc(10 * var(--vw-ratio));
			}
				#pagetitle.global .content .ttl h1 span {
					display: inline-block;
					font-size: calc(30 * var(--vw-ratio));
					position: relative;
				}
				#pagetitle.global .content .ttl h1 span:before {
					content: "";
					width: calc(230 * var(--vw-ratio));
					height: calc(26 * var(--vw-ratio));
					background: url("../img/global/gesture01.svg") no-repeat center top / 100%;
					position: absolute;
					top: calc(22 * var(--vw-ratio));
					left: calc(-5 * var(--vw-ratio));
					z-index: -1;
				}

			#pagetitle.global .content .ttl .en {
				font-size: calc(110 * var(--vw-ratio));
				font-weight: 600;
				line-height: 0.9em;
				letter-spacing: 0.04em;
			}

		#pagetitle.global .content .read {
			margin-bottom: calc(60 * var(--vw-ratio));
		}
			#pagetitle.global .content .read h2 {
				font-size: calc(30 * var(--vw-ratio));
				font-weight: 700;
				line-height: 1.3em;
				margin-bottom: calc(15 * var(--vw-ratio));
			}

		#pagetitle.global .content .row {
			margin-bottom: calc(45 * var(--vw-ratio));
			padding-bottom: calc(35 * var(--vw-ratio));
			border-bottom: dashed 1px #ddd;
		}
		#pagetitle.global .content .row:nth-last-child(1) {
			margin-bottom: 0;
			padding-bottom: 0;
			border-bottom: none;
		}
			#pagetitle.global .content .row .head {
				display: flex;
				justify-content: flex-start;
				align-items: center;
				margin-bottom: calc(12 * var(--vw-ratio));
			}
				#pagetitle.global .content .row .head .number {
					width: calc(36 * var(--vw-ratio));
					height: calc(36 * var(--vw-ratio));
					text-align: center;
					line-height: calc(36 * var(--vw-ratio));
					margin-right: calc(12 * var(--vw-ratio));
				}
				#pagetitle.global .content .row .head h3 {
					font-size: calc(24 * var(--vw-ratio));
					font-weight: 700;
					line-height: 1.3em;
				}

	#pagetitle.global .flowting {
		width: 35%;
		margin-top: calc(-40 * var(--vw-ratio));
		margin-right: calc(-50 * var(--vw-ratio));
	}
		#pagetitle.global .flowting .pht {
			height: calc(500 * var(--vw-ratio));
			position: sticky;
			top: calc(60 * var(--vw-ratio));
			right: 0;
		}
			#pagetitle.global .flowting .pht img {
				width: 100%;
				height: 100%;
				object-fit: cover;
			}
@media screen and (max-width: 767px) {
	#pagetitle.message {
		background: url("../img/message/mainpht_sp.webp") no-repeat center bottom / cover;
		margin-top: calc(-40 * var(--vw-ratio));
		padding-top: calc(40 * var(--vw-ratio));
		padding-bottom: calc(400 * var(--vw-ratio));
	}
	#pagetitle.message:before {
		width: -webkit-calc(100% - 20px);
		width: calc(100% - 20px);
		height: calc(50 * var(--vw-ratio));
		left: calc(10 * var(--vw-ratio));
	}
		#pagetitle.message .content {
			width: 100%;
			padding-top: calc(40 * var(--vw-ratio));
		}
			#pagetitle.message .content .gesture01 {
				width: calc(120 * var(--vw-ratio));
				position: absolute;
				top: calc(30 * var(--vw-ratio));
				right: calc(10 * var(--vw-ratio));
			}
			#pagetitle.message .content h2 {
				font-size: calc(30 * var(--vw-ratio));
				margin-bottom: calc(20 * var(--vw-ratio));
			}

			#pagetitle.message .content .txt-16 {
				margin-bottom: calc(15 * var(--vw-ratio));
			}
			#pagetitle.message .content .txt-16:nth-last-child(1) {
				margin-bottom: 0;
			}

	#pagetitle.vision {
		background: url("../img/vision/pagetitle_pht.webp") no-repeat center top / cover;
		margin-top: calc(-40 * var(--vw-ratio));
		padding-top: calc(40 * var(--vw-ratio));
		padding-bottom: calc(100 * var(--vw-ratio));
	}
	#pagetitle.vision:before {
		width: -webkit-calc(100% - 20px);
		width: calc(100% - 20px);
		height: calc(50 * var(--vw-ratio));
		left: calc(10 * var(--vw-ratio));
	}

	#pagetitle.business .document {
		margin-top: calc(50 * var(--vw-ratio));
	}
		#pagetitle.business .document .en {
			margin-bottom: calc(8 * var(--vw-ratio));
		}

		#pagetitle.business .document h2 {
			font-size: calc(24 * var(--vw-ratio));
			margin-bottom: calc(20 * var(--vw-ratio));
		}

		#pagetitle.business .document .circle {
			width: 100%;
			margin: calc(30 * var(--vw-ratio)) auto 0 auto;
		}

	#pagetitle.business .gallery {
		position: absolute;
		top: 0;
	}
		#pagetitle.business .gallery ul {
			height: calc(500 * var(--vw-ratio));
		}
			#pagetitle.business .gallery ul li.pht01 {
				width: calc(80 * var(--vw-ratio));
				top: calc(20 * var(--vw-ratio));
				left: 0;
			}
			#pagetitle.business .gallery ul li.pht02 {
				width: calc(80 * var(--vw-ratio));
				top: calc(60 * var(--vw-ratio));
				right: 0
			}
			#pagetitle.business .gallery ul li.pht03 {
				width: calc(110 * var(--vw-ratio));
				top: calc(530 * var(--vw-ratio));
				left: calc(0 * var(--vw-ratio));
			}


	#pagetitle.global .content {
		width: 100%;
		padding-top: calc(30 * var(--vw-ratio));
		padding-right: calc(15 * var(--vw-ratio));
		padding-left: calc(15 * var(--vw-ratio));
	}
		#pagetitle.global .content .ttl {
			margin-bottom: calc(40 * var(--vw-ratio));
		}
			#pagetitle.global .content .ttl h1 {
				font-size: calc(16 * var(--vw-ratio));
				position: static;
				margin-top: calc(15 * var(--vw-ratio));
			}
				#pagetitle.global .content .ttl h1 br {
					display: none;
				}
				#pagetitle.global .content .ttl h1 span {
					font-size: calc(16 * var(--vw-ratio));
				}
				#pagetitle.global .content .ttl h1 span:before {
					width: calc(130 * var(--vw-ratio));
					height: calc(16 * var(--vw-ratio));
					top: calc(18 * var(--vw-ratio));
				}

			#pagetitle.global .content .ttl .en {
				font-size: calc(74 * var(--vw-ratio));
			}
	
		#pagetitle.global .content .pht {
			margin-left: calc(-25 * var(--vw-ratio));
			margin-bottom: calc(40 * var(--vw-ratio));
		}

		#pagetitle.global .content .read {
			margin-bottom: calc(40 * var(--vw-ratio));
		}
			#pagetitle.global .content .read h2 {
				font-size: calc(26 * var(--vw-ratio));
			}

		#pagetitle.global .content .row {
			margin-bottom: calc(35 * var(--vw-ratio));
			padding-bottom: calc(30 * var(--vw-ratio));
		}
			#pagetitle.global .content .row .head .number {
				width: calc(32 * var(--vw-ratio));
				height: calc(32 * var(--vw-ratio));
				line-height: calc(35 * var(--vw-ratio));
			}
			#pagetitle.global .content .row .head h3 {
				font-size: calc(22 * var(--vw-ratio));
			}

	#pagetitle.global .flowting {
		display: none;
	}
		#pagetitle.global .flowting .pht {
			position: static;
		}
}


	
	
/* message
--------------------- */
#message .area {
	position: relative;
}
	#message .gesture {
		position: absolute;
	}
	#message .gesture02 {
		width: calc(90 * var(--vw-ratio));
		top: calc(120 * var(--vw-ratio));
		left: calc(-50 * var(--vw-ratio));
	}
	#message .gesture03 {
		width: calc(145 * var(--vw-ratio));
		bottom: calc(-15 * var(--vw-ratio));
		right: calc(250 * var(--vw-ratio));
	}

	#message .cont {
		padding-bottom: calc(100 * var(--vw-ratio));
	}
		#message .cont .text {
			width: 55%;
		}
		#message .cont:nth-child(2) .text {
			order: 2;
		}
			#message .cont .text .txt-16 {
				margin-bottom: calc(30 * var(--vw-ratio));
			}

		#message .cont .pht {
			width: 40%;
		}
		#message .cont:nth-child(2) .pht {
			order: 1;
		}
@media screen and (max-width: 767px) {
	#message .gesture02 {
		width: calc(40 * var(--vw-ratio));
		top: calc(100 * var(--vw-ratio));
		left: calc(-25 * var(--vw-ratio));
	}
	#message .gesture03 {
		width: calc(100 * var(--vw-ratio));
		bottom: calc(-15 * var(--vw-ratio));
		right: calc(100 * var(--vw-ratio));
	}

	#message .cont {
		display: block;
		padding-left: calc(10 * var(--vw-ratio));
		padding-right: calc(10 * var(--vw-ratio));
		padding-bottom: calc(50 * var(--vw-ratio));
	}
		#message .cont .text {
			width: 100%;
		}
			#message .cont .text .txt-16 {
				margin-bottom: calc(15 * var(--vw-ratio));
			}

		#message .cont .pht {
			width: 100%;
			margin-top: calc(25 * var(--vw-ratio));
		}
}


	
	
/* business
--------------------- */
.business .titlebox {
	margin-bottom: calc(80 * var(--vw-ratio));
}
	.business .titlebox .text {
		width: 60%;
		position: relative;
	}
	#printing.business .titlebox .text,
	#commercial.business .titlebox .text {
		order: 2;
	}
		.business .titlebox .text .gesture {
			position: absolute;
		}
		.business .titlebox .text .gesture01 {
			width: calc(240 * var(--vw-ratio));
			top: calc(-50 * var(--vw-ratio));
			right: calc(-120 * var(--vw-ratio));
		}
		.business .titlebox .text .gesture02 {
			width: calc(130 * var(--vw-ratio));
			top: calc(20 * var(--vw-ratio));
			right: calc(70 * var(--vw-ratio));
		}
		.business .titlebox .text .gesture03 {
			width: calc(160 * var(--vw-ratio));
			top: calc(-10 * var(--vw-ratio));
			right: calc(100 * var(--vw-ratio));
		}

		.business .titlebox .text .en {
			line-height: 1;
			margin-bottom: calc(12 * var(--vw-ratio));
		}

		.business .titlebox .text h2 {
			font-size: calc(34 * var(--vw-ratio));
			line-height: 1.4em;
			margin-bottom: calc(35 * var(--vw-ratio));
			padding-bottom: calc(35 * var(--vw-ratio));
			border-bottom: dashed 1px #ddd;
		}

		.business .titlebox .text h3 {
			font-size: calc(26 * var(--vw-ratio));
			line-height: 1.5em;
			margin-bottom: calc(15 * var(--vw-ratio));
		}

	.business .titlebox .pht {
		width: 45%;
	}
	#printing.business .titlebox .pht,
	#commercial.business .titlebox .pht {
		margin-left: calc(-150 * var(--vw-ratio));
		order: 1;
	}
	#business.business .titlebox .pht {
		margin-right: calc(-150 * var(--vw-ratio));
	}

.business .topics {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	column-gap: calc(60 * var(--vw-ratio));
	row-gap: calc(40 * var(--vw-ratio));
}
	.business .topics .box {
		position: relative;
	}
		.business .topics .box .en {
			display: inline-block;
			width: calc(20 * var(--vw-ratio));
			-ms-writing-mode: tb-rl;
			writing-mode: vertical-rl;
			padding: calc(8 * var(--vw-ratio)) 0;
			line-height: calc(20 * var(--vw-ratio));
			position: absolute;
			top: 0;
			left: calc(-20 * var(--vw-ratio));
		}

		.business .topics .box .text {
			width: 68%;
			padding: calc(25 * var(--vw-ratio));
		}
			.business .topics .box .text h4 {
				font-weight: 700;
				line-height: 1.4em;
				margin-bottom: calc(10 * var(--vw-ratio));
			}

		.business .topics .box .pht {
			width: 32%;
			overflow: hidden;
		}
			.business .topics .box .pht img {
				width: 100%;
				height: 100%;
				object-fit: cover;
			}

.business a.interview {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	width: calc(450 * var(--vw-ratio));
	border: solid 1px #ddd;
	margin: 0 auto;
	transition: 0.3s;
	-webkit-transition: 0.3s;
}
.business a.interview.blue {
	background: url("../../common/img/icon_arrow_blue.svg") no-repeat right calc(20 * var(--vw-ratio)) center / calc(26 * var(--vw-ratio));
}
.business a.interview.blue:hover {
	background: #F7F7F7 url("../../common/img/icon_arrow_blue.svg") no-repeat right calc(20 * var(--vw-ratio)) center / calc(26 * var(--vw-ratio));
}
.business a.interview.orange {
	background: url("../../common/img/icon_arrow_orange.svg") no-repeat right calc(20 * var(--vw-ratio)) center / calc(26 * var(--vw-ratio));
}
.business a.interview.orange:hover {
	background: #F7F7F7 url("../../common/img/icon_arrow_orange.svg") no-repeat right calc(20 * var(--vw-ratio)) center / calc(26 * var(--vw-ratio));
}
.business a.interview.purple {
	background: url("../../common/img/icon_arrow_purple.svg") no-repeat right calc(20 * var(--vw-ratio)) center / calc(26 * var(--vw-ratio));
}
.business a.interview.purple:hover {
	background: #F7F7F7 url("../../common/img/icon_arrow_purple.svg") no-repeat right calc(20 * var(--vw-ratio)) center / calc(26 * var(--vw-ratio));
}
	.business a.interview .pht {
		width: 17%;
	}
	.business a.interview .txt-18 {
		width: 83%;
		font-weight: 500;
		line-height: 1.3em;
		padding-left: calc(20 * var(--vw-ratio));
	}
@media screen and (max-width: 767px) {
	.business .titlebox .text .gesture01 {
		width: calc(120 * var(--vw-ratio));
		top: calc(-80 * var(--vw-ratio));
		right: calc(10 * var(--vw-ratio));
	}
	.business .titlebox .text .gesture02 {
		width: calc(70 * var(--vw-ratio));
		top: calc(-20 * var(--vw-ratio));
		right: calc(140 * var(--vw-ratio));
	}
	.business .titlebox .text .gesture03 {
		width: calc(80 * var(--vw-ratio));
		top: calc(-10 * var(--vw-ratio));
		right: calc(20 * var(--vw-ratio));
	}
	
	.business .titlebox {
		display: block;
		margin-bottom: calc(40 * var(--vw-ratio));
	}
		.business .titlebox .text {
			width: 100%;
			margin-bottom: calc(25 * var(--vw-ratio));
		}
			.business .titlebox .text .en {
				margin-bottom: calc(10 * var(--vw-ratio));
			}

			.business .titlebox .text h2 {
				font-size: calc(26 * var(--vw-ratio));
				margin-bottom: calc(25 * var(--vw-ratio));
				padding-bottom: calc(25 * var(--vw-ratio));
			}

			.business .titlebox .text h3 {
				font-size: calc(22 * var(--vw-ratio));
				line-height: 1.5em;
				margin-bottom: calc(15 * var(--vw-ratio));
			}

		.business .titlebox .pht {
			width: 100%;
		}
		#printing.business .titlebox .pht,
		#commercial.business .titlebox .pht {
			width: -webkit-calc(100% + calc(35 * var(--vw-ratio)));
			width: calc(100% + calc(35 * var(--vw-ratio)));
			margin-left: calc(-35 * var(--vw-ratio));
		}
		#business.business .titlebox .pht {
			width: -webkit-calc(100% + calc(25 * var(--vw-ratio)));
			width: calc(100% + calc(25 * var(--vw-ratio)));
			margin-right: calc(-25 * var(--vw-ratio));
		}

	.business .topics {
		display: block;
	}
		.business .topics .box {
			display: block;
			margin-bottom: calc(20 * var(--vw-ratio));
		}
			.business .topics .box .text {
				width: 100%;
			}

			.business .topics .box .pht {
				width: 100%;
			}

	.business a.interview {
		width: 80%;
		margin: 0 auto;
	}
	.business a.interview.blue {
		background: url("../../common/img/icon_arrow_blue.svg") no-repeat right calc(15 * var(--vw-ratio)) center / calc(20 * var(--vw-ratio));
	}
	.business a.interview.blue:hover {
		background: #F7F7F7 url("../../common/img/icon_arrow_blue.svg") no-repeat right calc(15 * var(--vw-ratio)) center / calc(20 * var(--vw-ratio));
	}
	.business a.interview.orange {
		background: url("../../common/img/icon_arrow_orange.svg") no-repeat right calc(15 * var(--vw-ratio)) center / calc(20 * var(--vw-ratio));
	}
	.business a.interview.orange:hover {
		background: #F7F7F7 url("../../common/img/icon_arrow_orange.svg") no-repeat right calc(15 * var(--vw-ratio)) center / calc(20 * var(--vw-ratio));
	}
	.business a.interview.purple {
		background: url("../../common/img/icon_arrow_purple.svg") no-repeat right calc(15 * var(--vw-ratio)) center / calc(20 * var(--vw-ratio));
	}
	.business a.interview.purple:hover {
		background: #F7F7F7 url("../../common/img/icon_arrow_purple.svg") no-repeat right calc(15 * var(--vw-ratio)) center / calc(20 * var(--vw-ratio));
	}
		.business a.interview .pht {
			width: 20%;
		}
		.business a.interview .txt-18 {
			width: 80%;
			font-size: calc(14 * var(--vw-ratio));
			padding-left: calc(15 * var(--vw-ratio));
		}
}


	
	
/* global
--------------------- */
#global .area {
	position: relative;
}
	#global .gesture {
		width: calc(160 * var(--vw-ratio));
		position: absolute;
		top: calc(-40 * var(--vw-ratio));
		left: calc(300 * var(--vw-ratio));
	}

	#global .ttl {
		margin-bottom: calc(20 * var(--vw-ratio));
	}
		#global .ttl .head {
			font-size: calc(26 * var(--vw-ratio));
			line-height: 1;
			font-weight: 700;
		}
			#global .ttl .head .en {
				font-size: calc(42 * var(--vw-ratio));
				font-weight: 600;
				padding: 0 calc(5 * var(--vw-ratio));
			}

		#global .ttl .slash {
			padding: 0 calc(10 * var(--vw-ratio)) 0 calc(15 * var(--vw-ratio));
			font-size: calc(50 * var(--vw-ratio));
			line-height: 1;
			font-weight: 400;
			color: #DEDEDE;
		}
@media screen and (max-width: 767px) {
	#global .gesture {
		width: calc(100 * var(--vw-ratio));
		top: calc(-40 * var(--vw-ratio));
		left: calc(-20 * var(--vw-ratio));
	}

	#global .ttl {
		margin-bottom: calc(10 * var(--vw-ratio));
	}
		#global .ttl .head {
			font-size: calc(20 * var(--vw-ratio));
		}
			#global .ttl .head .en {
				font-size: calc(38 * var(--vw-ratio));
			}

		#global .ttl .slash {
			font-size: calc(40 * var(--vw-ratio));
		}
}


	
	
/* number
--------------------- */
#number {
	position: relative;
}
	#number .gesture {
		position: absolute;
		width: calc(140 * var(--vw-ratio));
		bottom: calc(80 * var(--vw-ratio));
		left: 45%;
		z-index: 2;
	}

	#number .area .box {
		width: 33.3333333%;
		border-right: solid 1px #ddd;
		text-align: center;
		padding: calc(45 * var(--vw-ratio)) 0;
	}
	#number .area .box:nth-child(3),
	#number .area .box:nth-child(5) {
		border-right: none;
	}
	#number .area .box:nth-child(4),
	#number .area .box:nth-child(5) {
		width: 50%;
		border-top: solid 1px #ddd;
	}
		#number .area .box .graph {
			width: calc(340 * var(--vw-ratio));
			margin: 0 auto;
		}

		#number .area .box h3 {
			font-soze: calc(22 * var(--vw-ratio));
			margin-bottom: calc(25 * var(--vw-ratio));
		}
			#number .area .box h3 span {
				padding: 0 calc(10 * var(--vw-ratio));
				background:linear-gradient(transparent 60%, #F4F4F4 60%);
			}

		#number .area .box .text .jp {
			font-size: calc(50 * var(--vw-ratio));
			font-weight: 700;
			line-height: 1;
		}
			#number .area .box .text .en {
				font-size: calc(120 * var(--vw-ratio));
				font-weight: 500;
				line-height: 1;
			}

		#number .area .box .txt-12 {
			margin-top: calc(30 * var(--vw-ratio));
			line-height: 1;
		}
@media screen and (max-width: 767px) {
	#number .gesture {
		width: calc(80 * var(--vw-ratio));
		bottom: calc(280 * var(--vw-ratio));
		left: 7%;
	}

	#number .area .box {
		width: 100%;
		border-right: none;
		border-bottom: solid 1px #ddd;
		padding: calc(30 * var(--vw-ratio)) 0 calc(35 * var(--vw-ratio)) 0;
	}
	#number .area .box:nth-child(4),
	#number .area .box:nth-child(5) {
		width: 100%;
		border-top: none;
	}
	#number .area .box:nth-last-child(1) {
		border-bottom: none;
	}
		#number .area .box .graph {
			width: 70%;
		}

		#number .area .box h3 {
			font-soze: calc(22 * var(--vw-ratio));
			margin-bottom: calc(20 * var(--vw-ratio));
		}

		#number .area .box .text .jp {
			font-size: calc(40 * var(--vw-ratio));
		}
			#number .area .box .text .en {
				font-size: calc(80 * var(--vw-ratio));
			}

		#number .area .box .txt-12 {
			margin-top: calc(20 * var(--vw-ratio));
			line-height: 1;
		}
}


	
	
/* related
--------------------- */
#related .list {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	column-gap: calc(40 * var(--vw-ratio));
	row-gap: calc(40 * var(--vw-ratio));
}
	#related .list a.linkbox {
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
		#related .list a.linkbox .pht {
			width: 35%;
		}

		#related .list a.linkbox .text {
			width: 65%;
			padding: calc(30 * var(--vw-ratio));
			transition: 0.3s;
			-webkit-transition: 0.3s;
		}
		#related .list a.linkbox:hover .text {
			opacity: 0.7;
		}
			#related .list a.linkbox .text h3 {
				background: url("../../common/img/icon_arrow_yellow.svg") no-repeat left top calc(4 * var(--vw-ratio)) / calc(24 * var(--vw-ratio));
				font-size: calc(22 * var(--vw-ratio));
				font-weight: 700;
				line-height: 1.3em;
				padding-left: calc(30 * var(--vw-ratio));
				margin-bottom: calc(12 * var(--vw-ratio));
			}
@media screen and (max-width: 767px) {
	#related .list {
		column-gap: calc(20 * var(--vw-ratio));
		row-gap: calc(20 * var(--vw-ratio));
	}
		#related .list a.linkbox {
			display: block;
		}
			#related .list a.linkbox .pht {
				width: 100%;
			}

			#related .list a.linkbox .text {
				width: 100%;
				padding: calc(20 * var(--vw-ratio));
				background: url("../../common/img/icon_arrow_yellow.svg") no-repeat right calc(8 * var(--vw-ratio)) bottom calc(8 * var(--vw-ratio)) / calc(20 * var(--vw-ratio));
			}
				#related .list a.linkbox .text h3 {
					background: none;
					font-size: calc(17 * var(--vw-ratio));
					margin-bottom: calc(10 * var(--vw-ratio));
					padding-left: 0;
				}

				#related .list a.linkbox .text .txt-14 {
					line-height: 1.5em;
				}
}


	
	
/* partner
--------------------- */
#partner .txt-16 {
	text-align: center;
}

#partner .zu {
	width: calc(700 * var(--vw-ratio));
	margin: 0 auto;
}
@media screen and (max-width: 767px) {
	#partner .txt-16 {
		text-align: left;
	}

	#partner .zu {
		width: 100%;
	}
}


	
	
/* towards
--------------------- */
#towards {
	overflow: hidden;
}
	#towards .gesture {
		position: absolute;
	}
	#towards .gesture01 {
		width: calc(110 * var(--vw-ratio));
		top: calc(-70 * var(--vw-ratio));
		left: calc(350 * var(--vw-ratio));
	}
	#towards .gesture02 {
		width: calc(170 * var(--vw-ratio));
		bottom: calc(170 * var(--vw-ratio));
		right: calc(-85 * var(--vw-ratio));
	}

	#towards .txt-16 {
		text-align: center;
	}

	#towards .cont {
		margin-top: calc(70 * var(--vw-ratio));
	}
		#towards .cont h3 {
			background: #ffff;
			height: calc(50 * var(--vw-ratio));
			font-size: calc(22 * var(--vw-ratio));
			font-weight: 700;
			line-height: calc(48 * var(--vw-ratio));
			padding-left: calc(15 * var(--vw-ratio));
			margin-bottom: calc(25 * var(--vw-ratio));
		}
		#towards .cont h3.c-orange {
			border-left: solid 3px #F06400;
		}

		#towards .cont .flow {
			display: grid;
			grid-template-columns: repeat(4, 1fr);
			column-gap: calc(60 * var(--vw-ratio));
			row-gap: 0;
		}
			#towards .cont .flow .box {
				display: flex;
				justify-content: center;
				align-items: center;
				text-align: center;
				aspect-ratio: 1 / 1;
				border-radius: 50%;
				border: dashed 1px #BABABA;;
				position: relative;
			}
			#towards .cont .flow .box:before {
				content: "";
				width: calc(60 * var(--vw-ratio));
				height: 100%;
				background: url("../img/vision/icon_arrow_orange.svg") no-repeat center / calc(20 * var(--vw-ratio));
				position: absolute;
				top: 0;
				right: calc(-60 * var(--vw-ratio));
			}
			#towards .cont .flow .box:nth-last-child(1):before {
				display: none;
			}
				#towards .cont .flow .box .en {
					width: 100%;
					position: absolute;
					top: calc(35 * var(--vw-ratio));
					left: 0;
				}

		#towards .cont .professional {
			display: grid;
			grid-template-columns: repeat(2, 1fr);
			column-gap: calc(34 * var(--vw-ratio));
			row-gap: 0;
			position: relative;
		}
			#towards .cont .professional:before {
				content: "";
				width: 100%;
				height: calc(50 * var(--vw-ratio));
				background: url("../img/vision/icon_cross_orange.svg") no-repeat center / auto 100%;
				pointer-events: none;
				position: absolute;
				top: calc(-5 * var(--vw-ratio));
				left: 0;
			}
				#towards .cont .professional .row h4 {
					font-size: calc(28 * var(--vw-ratio));
					font-weight: 700;
					line-height: 1.3em;
					text-align: center;
					margin-bottom: calc(30 * var(--vw-ratio));
				}

				#towards .cont .professional .row .list {
					display: grid;
					grid-template-columns: repeat(2, 1fr);
					column-gap: calc(34 * var(--vw-ratio));
				}
					#towards .cont .professional .row .list .box {
						text-align: center;
						padding: calc(30 * var(--vw-ratio)) 0;
						position: relative;
					}
					#towards .cont .professional .row .list .box:before {
						content: "";
						width: calc(34 * var(--vw-ratio));
						height: 100%;
						background: url("../img/vision/icon_plus_orange.svg") no-repeat center / 100%;
						pointer-events: none;
						position: absolute;
						top: 0;
						right: calc(-34 * var(--vw-ratio));
					}
					#towards .cont .professional .row:nth-last-child(1) .list .box:nth-last-child(1):before {
						display: none;
					}
						#towards .cont .professional .row .list .box .en {
							font-weight: 500;
							line-height: 1.3em;
							margin-bottom: calc(5 * var(--vw-ratio));
						}

						#towards .cont .professional .row .list .box h5 {
							font-size: calc(22 * var(--vw-ratio));
							font-weight: 700;
							line-height: 1.3em;
							margin-bottom: calc(15 * var(--vw-ratio));
						}

						#towards .cont .professional .row .list .box .txt-16 {
							line-height: 1.4em;
						}
@media screen and (max-width: 767px) {
	#towards .gesture01 {
		width: calc(60 * var(--vw-ratio));
		top: calc(-30 * var(--vw-ratio));
		left: calc(30 * var(--vw-ratio));
	}
	#towards .gesture02 {
		width: calc(100 * var(--vw-ratio));
		bottom: calc(-50 * var(--vw-ratio));
		right: calc(-50 * var(--vw-ratio));
	}
	
	#towards .txt-16 {
		text-align: left;
	}

	#towards .cont {
		margin-top: calc(40 * var(--vw-ratio));
	}
		#towards .cont h3 {
			height: auto;
			padding-top: calc(8 * var(--vw-ratio));
			padding-bottom: calc(8 * var(--vw-ratio));
			font-size: calc(20 * var(--vw-ratio));
			line-height: 1.3em;
			margin-bottom: calc(20 * var(--vw-ratio));
		}

		#towards .cont .flow {
			display: grid;
			grid-template-columns: repeat(2, 1fr);
			column-gap: calc(20 * var(--vw-ratio));
			row-gap: calc(20 * var(--vw-ratio));
		}
			#towards .cont .flow .box {
				border-radius: 0;
				aspect-ratio: 4 / 3;
			}
			#towards .cont .flow .box:before {
				display: none;
			}
				#towards .cont .flow .box .en {
					top: calc(5 * var(--vw-ratio));
				}
				#towards .cont .flow .box .txt-20 {
					font-size: calc(18 * var(--vw-ratio));
					line-height: 1.3em;
					padding-top: calc(10 * var(--vw-ratio));
				}

		#towards .cont .professional {
			column-gap: calc(30 * var(--vw-ratio));
		}
			#towards .cont .professional:before {
				height: calc(40 * var(--vw-ratio));
				top: calc(4 * var(--vw-ratio));
			}
				#towards .cont .professional .row h4 {
					font-size: calc(18 * var(--vw-ratio));
					margin-bottom: calc(20 * var(--vw-ratio));
				}

				#towards .cont .professional .row .list {
					display: block;
				}
					#towards .cont .professional .row .list .box {
						padding: calc(20 * var(--vw-ratio)) 0;
						margin-bottom: calc(30 * var(--vw-ratio));
					}
					#towards .cont .professional .row .list .box:nth-last-child(1) {
						margin-bottom: 0;
					}
					#towards .cont .professional .row .list .box:before {
						width: 100%;
						height: calc(30 * var(--vw-ratio));
						background: url("../img/vision/icon_plus_orange.svg") no-repeat center / auto 100%;
						top: auto;
						bottom: calc(-30 * var(--vw-ratio));
						right: 0;
					}
					#towards .cont .professional .row .list .box:nth-last-child(1):before {
						display: none;
					}
					#towards .cont .professional .row:nth-child(1) .list .box:after {
						content: "";
						width: calc(30 * var(--vw-ratio));
						height: 100%;
						background: url("../img/vision/icon_plus_orange.svg") no-repeat center / 100%;
						pointer-events: none;
						position: absolute;
						top: 0;
						right: calc(-30 * var(--vw-ratio));
					}
						#towards .cont .professional .row .list .box .en {
							font-size: calc(12 * var(--vw-ratio));
						}

						#towards .cont .professional .row .list .box h5 {
							font-size: calc(18 * var(--vw-ratio));
							margin-bottom: calc(10 * var(--vw-ratio));
						}

						#towards .cont .professional .row .list .box .txt-16 {
							font-size: calc(14 * var(--vw-ratio));
							line-height: 1.4em;
							text-align: center;
						}
}


	
	
/* society
--------------------- */
#society .gesture {
	position: absolute;
}
#society .gesture03 {
	width: calc(140 * var(--vw-ratio));
	top: calc(-70 * var(--vw-ratio));
	right: calc(220 * var(--vw-ratio));
}
#society .gesture04 {
	width: calc(145 * var(--vw-ratio));
	bottom: calc(280 * var(--vw-ratio));
	left: calc(-50 * var(--vw-ratio));
}

#society .txt-16.center {
	text-align: center;
}

#society .row {
	margin-top: calc(70 * var(--vw-ratio));
}
	#society .row h3 {
		font-size: calc(28 * var(--vw-ratio));
		font-weight: 700;
		line-height: 1.3em;
		text-align: center;
		margin-bottom: calc(20 * var(--vw-ratio));
	}

	#society .row .perspective {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		column-gap: calc(40 * var(--vw-ratio));
		position: relative;
	}
	#society .row .perspective:before {
		content: "";
		width: 100%;
		height: 100%;
		background: url("../img/vision/icon_cross_green.svg") no-repeat center / calc(86 * var(--vw-ratio));
		position: absolute;
		top: 0;
		left: 0;
		pointer-events: none;
	}
		#society .row .perspective .box {
			border: dashed 2px #ddd;
			text-align: center;
			padding: calc(35 * var(--vw-ratio)) calc(20 * var(--vw-ratio)) calc(30 * var(--vw-ratio)) calc(20 * var(--vw-ratio));
		}
			#society .row .perspective .box h4 {
				font-size: calc(26 * var(--vw-ratio));
				font-weight: 700;
				line-height: 1.3em;
				margin-bottom: calc(5 * var(--vw-ratio));
			}

			#society .row .perspective .box .txt-16 {
				margin-bottom: calc(25 * var(--vw-ratio));
			}

			#society .row .perspective .box .txt-20 {
				width: calc(270 * var(--vw-ratio));
				height: calc(44 * var(--vw-ratio));
				border-radius: calc(22 * var(--vw-ratio));
				background: #F7F7F7;
				margin: 0 auto calc(15 * var(--vw-ratio)) auto;
				line-height: calc(44 * var(--vw-ratio));
				font-weight: 700;
				position: relative;
			}
			#society .row .perspective .box .txt-20:before {
				content: "";
				width: 100%;
				height: calc(25 * var(--vw-ratio));
				background: url("../img/vision/icon_arrow_green01.svg") no-repeat center / auto 100%;
				position: absolute;
				top: calc(-20 * var(--vw-ratio));
				left: 0;
			}

	#society .row .concept {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		column-gap: calc(25 * var(--vw-ratio));
		margin-top: calc(30 * var(--vw-ratio));
	}
		#society .row .concept .box {
			display: flex;
			justify-content: center;
			align-items: center;
			height: calc(190 * var(--vw-ratio));
			text-align: center;
			position: relative;
		}
				#society .row .concept .box .en {
					width: 100%;
					text-align: center;
					position: absolute;
					top: calc(20 * var(--vw-ratio));
					left: 0;
				}

				#society .row .concept .box h4 {
					line-height: 1.5em;
					padding-top: calc(10 * var(--vw-ratio));
				}
@media screen and (max-width: 767px) {
	#society .gesture03 {
		width: calc(80 * var(--vw-ratio));
		top: calc(-30 * var(--vw-ratio));
		right: 0;
	}
	#society .gesture04 {
		width: calc(50 * var(--vw-ratio));
		bottom: calc(-50 * var(--vw-ratio));
		left: calc(-25 * var(--vw-ratio));
	}
	
	#society .txt-16.center {
		text-align: left;
	}

	#society .row {
		margin-top: calc(40 * var(--vw-ratio));
	}
		#society .row h3 {
			font-size: calc(24 * var(--vw-ratio));
		}

		#society .row .perspective {
			column-gap: calc(20 * var(--vw-ratio));
		}
		#society .row .perspective:before {
			background: url("../img/vision/icon_cross_green.svg") no-repeat center / calc(44 * var(--vw-ratio));
		}
			#society .row .perspective .box {
				padding: calc(15 * var(--vw-ratio)) calc(10 * var(--vw-ratio)) calc(10 * var(--vw-ratio)) calc(10 * var(--vw-ratio));
			}
				#society .row .perspective .box h4 {
					font-size: calc(16 * var(--vw-ratio));
					font-weight: 700;
					line-height: 1.3em;
					margin-bottom: calc(8 * var(--vw-ratio));
				}

				#society .row .perspective .box .txt-16 {
					font-size: calc(14 * var(--vw-ratio));
					margin-bottom: calc(25 * var(--vw-ratio));
					line-height: 1.4em;
				}

				#society .row .perspective .box .txt-20 {
					width: 100%;
					height: calc(56 * var(--vw-ratio));
					border-radius: calc(5 * var(--vw-ratio));
					padding-top: calc(10 * var(--vw-ratio));
					margin: 0;
					font-size: calc(14 * var(--vw-ratio));
					line-height: 1.3em;
				}

		#society .row .concept {
			display: block;
			margin-top: calc(30 * var(--vw-ratio));
		}
			#society .row .concept .box {
				display: block;
				height: auto;
				padding: calc(25 * var(--vw-ratio)) 0;
				margin-bottom: calc(15 * var(--vw-ratio));
			}
			#society .row .concept .box:nth-last-child(1) {
				margin-bottom: 0;
			}
					#society .row .concept .box .en {
						position: static;
					}

					#society .row .concept .box h4 {
						font-size: calc(18 * var(--vw-ratio));
						line-height: 1.4em;
						padding-top: calc(5 * var(--vw-ratio));
					}
}


	
	
/* capability
--------------------- */
#capability .gesture {
	position: absolute;
}
#capability .gesture05 {
	width: calc(150 * var(--vw-ratio));
	top: calc(-70 * var(--vw-ratio));
	left: calc(200 * var(--vw-ratio));
}
#capability .gesture06 {
	width: calc(90 * var(--vw-ratio));
	bottom: calc(-50 * var(--vw-ratio));
	right: calc(90 * var(--vw-ratio));
}

#capability .txt-16.center {
	text-align: center;
}

#capability .list {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	column-gap: calc(25 * var(--vw-ratio));
	margin-top: calc(40 * var(--vw-ratio));
}
	#capability .list .box {
		display: flex;
		justify-content: center;
		align-items: center;
		height: calc(150 * var(--vw-ratio));
		text-align: center;
		position: relative;
	}
			#capability .list .box .en {
				width: 100%;
				text-align: center;
				position: absolute;
				top: calc(20 * var(--vw-ratio));
				left: 0;
			}

			#capability .list .box h4 {
				line-height: 1.5em;
				padding-top: calc(20 * var(--vw-ratio));
			}
@media screen and (max-width: 767px) {
	#capability .gesture05 {
		width: calc(60 * var(--vw-ratio));
		top: calc(-50 * var(--vw-ratio));
		left: calc(30 * var(--vw-ratio));
	}
	#capability .gesture06 {
		width: calc(80 * var(--vw-ratio));
		bottom: calc(-50 * var(--vw-ratio));
		right: calc(-0 * var(--vw-ratio));
	}
	
	#capability .txt-16.center {
		text-align: left;
	}

	#capability .list {
		grid-template-columns: repeat(2, 1fr);
		column-gap: calc(20 * var(--vw-ratio));
		row-gap: calc(20 * var(--vw-ratio));
		margin-top: calc(20 * var(--vw-ratio));
	}
		#capability .list .box {
			height: calc(120 * var(--vw-ratio));
			text-align: center;
			position: relative;
		}
				#capability .list .box .en {
					width: 100%;
					text-align: center;
					position: absolute;
					top: calc(20 * var(--vw-ratio));
					left: 0;
				}

				#capability .list .box h4 {
					font-size: calc(18 * var(--vw-ratio));
					padding-top: calc(30 * var(--vw-ratio));
				}
}


	
	
/* aaaa
--------------------- */
#interview-list .list {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	column-gap: calc(50 * var(--vw-ratio));
	row-gap: calc(50 * var(--vw-ratio));
	width: 50%;
	margin: 0 auto;
}
	#interview-list .list a.linkbox {
		display: block;
		background: url("../../common/img/icon_arrow_black.svg") no-repeat right bottom calc(18 * var(--vw-ratio)) / calc(18 * var(--vw-ratio));
		padding-bottom: calc(18 * var(--vw-ratio));
		border-bottom: solid 1px #ddd;
		position: relative;
		opacity: 1;
		transition: opacity 0.4s ease;
	}
	#interview-list .list .linkbox.hide {
		display: none;
	}
	#interview-list .list a.linkbox:before {
		content: "";
		width: 0;
		height: 1px;
		position: absolute;
		bottom: 0;
		left: 0;
	}
	#interview-list .list a.linkbox:hover:before {
		width: 100%;
		background: #282828;
	}
		#interview-list .list a.linkbox .text .label {
			width: calc(90 * var(--vw-ratio));
			height: calc(26 * var(--vw-ratio));
			border-radius: calc(13 * var(--vw-ratio));
			margin: calc(-13 * var(--vw-ratio)) auto 0 auto;
			border: solid 1px #282828;
			background: #fff;
			font-weight: 500;
			text-align: center;
			line-height: calc(24 * var(--vw-ratio));
			position: relative;
			z-index: 2;
		}
		#interview-list .list a.linkbox .text .txt-14 {
			margin-top: calc(15 * var(--vw-ratio));
			line-height: 1.6em;
		}
@media screen and (max-width: 767px) {
	#interview-list .list {
		grid-template-columns: repeat(2, 1fr);
		column-gap: calc(30 * var(--vw-ratio));
		row-gap: calc(40 * var(--vw-ratio));
		width: 100%;
	}
		#interview-list .list a.linkbox {
			background: url("../../common/img/icon_arrow_black.svg") no-repeat right bottom calc(16 * var(--vw-ratio)) / calc(16* var(--vw-ratio));
			padding-bottom: calc(16 * var(--vw-ratio));
		}
			#interview-list .list a.linkbox .text  {
				padding-right: calc(16 * var(--vw-ratio));
			}
				#interview-list .list a.linkbox .text .txt-14 {
					font-size: calc(12 * var(--vw-ratio));
				}
}


	
	
/* recommend
--------------------- */
#recommend {
	display: grid;
	padding: calc(10 * var(--vw-ratio));
	grid-template-columns: repeat(4, 1fr);
	column-gap: calc(10 * var(--vw-ratio));
	row-gap: calc(10 * var(--vw-ratio));
}
	#recommend a {
		display: block;
		overflow: hidden;
		position: relative;
		background: #000;
	}
	#recommend a.active {
		pointer-events: none;
	}
		#recommend a .pht {
			width: 100%;
			height: 100%;
			aspect-ratio: 1 / 1;
			opacity: 0.9;
			transition: 0.3s;
			-webkit-transition: 0.3s;
		}
		#recommend a:hover .pht {
			opacity: 0.6;
		}
		#recommend a.active .pht {
			opacity: 0.4;
		}
			#recommend a .pht img {
				width: 100%;
				height: 100%;
				object-fit: cover;
			}

		#recommend a .en {
			line-height: 1;
			position: absolute;
			top: calc(20 * var(--vw-ratio));
			left: calc(20 * var(--vw-ratio));
		}

		#recommend a h3 {
			font-size: calc(22 * var(--vw-ratio));
			font-weight: 700;
			line-height: 1.3em;
			position: absolute;
			bottom: calc(20 * var(--vw-ratio));
			left: calc(20 * var(--vw-ratio));
		}
@media screen and (max-width: 767px) {
	#recommend {
		grid-template-columns: repeat(2, 1fr);
	}
		#recommend a .en {
			font-size: calc(12 * var(--vw-ratio));
			top: calc(15 * var(--vw-ratio));
			left: calc(15 * var(--vw-ratio));
		}

		#recommend a h3 {
			font-size: calc(16 * var(--vw-ratio));
			bottom: calc(15 * var(--vw-ratio));
			left: calc(15 * var(--vw-ratio));
		}
}