@charset "utf-8";
._purple {
	color: var(--color--black);
	transition: color 1s cubic-bezier(0.16, 1, 0.3, 1);
	transition-delay: 1.4s;
}
.run ._purple {
	color: var(--color--purple);
}

#unisia {
	width: 100%;
	height: auto;
	padding: 0 0 230px;
}
	.unisia__inner {
		width: 92%;
		max-width: 1020px;
		height: auto;
		margin: 0 auto;
	}
		.unisia__items {
			width: 100%;
			height: auto;
		}
		.unisia__items._mission {
			margin: 0 auto 190px;
		}
		.unisia__items._vision {
			margin: 0 auto 262px;
		}
			.unisia__items .section_heading {
				max-width: 900px;
				margin: 0 auto 20px;
			}
			.unisia__items__sub_heading {
				width: 100%;
				max-width: 900px;
				height: auto;
				margin: 0 auto;
				font-size: 20px;
				font-weight: 700;
				line-height: 1.5;
				letter-spacing: 0.05em;
				color: var(--color--black);
				overflow: hidden;
			}
				.unisia__items__sub_heading span {
					display: inline-block;
					transform: translateY(100%);
					transition: transform 1s cubic-bezier(0.85, 0, 0.15, 1);
					transition-delay: .4s;
					will-change: transform;
				}
				.run .unisia__items__sub_heading span {
					transform: translateY(0);
				}
			/* Mission */
			.unisia__mission_contents {
				width: 100%;
				max-width: 900px;
				height: auto;
				margin: 80px auto 0;
			}
				.unisia__mission_contents__details {
					width: 100%;
					height: auto;
				}
					.unisia__mission_contents__details__ttl {
						width: 100%;
						height: auto;
						margin: 0 auto 68px;
						font-size: 46px;
						font-weight: 700;
						line-height: 1.3;
						letter-spacing: 0.05em;
						text-align: center;
						color: var(--color--black);
					}
						.unisia__mission_contents__details__ttl__row {
							display: block;
							width: fit-content;
							padding: 0 16px;
							margin: 0 auto;
							overflow: hidden;
							position: relative;
						}
							.unisia__mission_contents__details__ttl__row::after {
								content: '';
								display: block;
								width: 100%;
								height: 100%;
								background-color: var(--color--white);
								position: absolute;
								top: 0;
								left: 0;
								z-index: -1;
								transform: scaleY(0);
								transform-origin: bottom;
								transition: transform 1s cubic-bezier(0.16, 1, 0.3, 1);
								transition-delay: 1.4s;
								will-change: transform;
							}
							.run .unisia__mission_contents__details__ttl__row::after {
								transform: scaleY(100%);
							}
						.unisia__mission_contents__details__ttl__row + .unisia__mission_contents__details__ttl__row {
							margin-top: 23px;
						}
							.unisia__mission_contents__details__ttl__row__item {
								display: inline-block;
								transform: translateY(100%);
								transition: transform 1s cubic-bezier(0.85, 0, 0.15, 1);
								transition-delay: .4s;
								will-change: transform;
							}
							.run .unisia__mission_contents__details__ttl__row__item {
								transform: translateY(0);
							}
					.unisia__mission_contents__details__txt {
						width: 100%;
						height: auto;
						font-size: 18px;
						font-weight: 700;
						line-height: 2;
						letter-spacing: 0.05em;
						text-align: center;
						color: var(--color--black);
						opacity: 0;
						transition: opacity 1s ease;
						transition-delay: 1.4s;
					}
					.run .unisia__mission_contents__details__txt {
						opacity: 1;
					}
			/* Vision */
			.unisia__vision_contents {
				width: 100%;
				max-width: 900px;
				height: auto;
				margin: 56px auto 0;
				position: relative;
				z-index: 2;
			}
				.unisia__vision_contents__details {
					width: 405px;
					height: auto;
					margin: 0 auto 0 0;
				}
					.unisia__vision_contents__details__ttl {
						width: 100%;
						height: auto;
						margin: 0 auto 32px;
						font-size: 30px;
						font-weight: 700;
						line-height: 1.4;
						letter-spacing: -0.04em;
						color: var(--color--black);
					}
						.unisia__vision_contents__details__ttl__row {
							display: block;
							width: fit-content;
							padding: 0 8px;
							overflow: hidden;
							position: relative;
						}
						.unisia__vision_contents__details__ttl__row + .unisia__vision_contents__details__ttl__row {
							margin-top: 10px;
						}
							.unisia__vision_contents__details__ttl__row::after {
								content: '';
								display: block;
								width: 100%;
								height: 100%;
								background-color: var(--color--white);
								position: absolute;
								top: 0;
								left: 0;
								z-index: -1;
								transform: scaleY(0);
								transform-origin: bottom;
								transition: transform 1s cubic-bezier(0.16, 1, 0.3, 1);
								transition-delay: 1.4s;
								will-change: transform;
							}
							.run .unisia__vision_contents__details__ttl__row::after {
								transform: scaleY(100%);
							}
							.unisia__vision_contents__details__ttl__row__item {
								display: inline-block;
								transform: translateY(100%);
								transition: transform 1s cubic-bezier(0.85, 0, 0.15, 1);
								transition-delay: .4s;
								will-change: transform;
							}
							.run .unisia__vision_contents__details__ttl__row__item {
								transform: translateY(0);
							}
					.unisia__vision_contents__details__txt {
						width: 100%;
						height: auto;
						font-size: 18px;
						font-weight: 700;
						line-height: 2;
						letter-spacing: 0.05em;
						color: var(--color--black);
						opacity: 0;
						transition: opacity 1s ease;
						transition-delay: 1.4s;
						will-change: opacity;
					}
					.run .unisia__vision_contents__details__txt {
						opacity: 1;
					}
				.unisia__vision_contents__logo {
					width: calc((435 / 900) * 100%);
					max-width: 435px;
					height: auto;
					position: absolute;
					right: -47px;
					bottom: -15px;
					z-index: -1;
				}
					.unisia__vision_contents__logo_mark {
						width: 100%;
						height: auto;
						opacity: 0;
						transition: opacity 1s ease;
						transition-delay: 1.4s;
						will-change: opacity;
					}
					.run .unisia__vision_contents__logo_mark {
						opacity: 1;
					}
						.unisia__vision_contents__logo_mark__wrap {
							width: 100%;
							height: auto;
							aspect-ratio: 470 / 517;
							position: relative;
						}
							.unisia__vision_contents__logo_mark__wrap__item {
								width: 100%;
								height: 100%;
								background-color: var(--color--base_white);
								mask-size: 100% 100%;
								mask-position: center;
								mask-repeat: no-repeat;
								-webkit-mask-size: 100% 100%;
								-webkit-mask-position: center;
								-webkit-mask-repeat: no-repeat;
								position: absolute;
								top: 0;
								left: 0;
							}
							.unisia__vision_contents__logo_mark__wrap__item._01 {
								mask-image: url(../image/index/hero-logo_mark_mask_01.webp);
								-webkit-mask-image: url(../image/index/hero-logo_mark_mask_01.webp);
							}
							.unisia__vision_contents__logo_mark__wrap__item._02 {
								mask-image: url(../image/index/hero-logo_mark_mask_02.webp);
								-webkit-mask-image: url(../image/index/hero-logo_mark_mask_02.webp);
							}
							.unisia__vision_contents__logo_mark__wrap__item._03 {
								mask-image: url(../image/index/hero-logo_mark_mask_03.webp);
								-webkit-mask-image: url(../image/index/hero-logo_mark_mask_03.webp);
							}
							.unisia__vision_contents__logo_mark__wrap__item._04 {
								mask-image: url(../image/index/hero-logo_mark_mask_04.webp);
								-webkit-mask-image: url(../image/index/hero-logo_mark_mask_04.webp);
							}
								.unisia__vision_contents__logo_mark__wrap__item__image_wrap {
									height: auto;
									position: absolute;
								}
								._01 .unisia__vision_contents__logo_mark__wrap__item__image_wrap {
									width: calc((143 / 470) * 100%);
									aspect-ratio: 143 / 233;
									top: 0;
									left: 0;
								}
								._02 .unisia__vision_contents__logo_mark__wrap__item__image_wrap {
									width: calc((301 / 470) * 100%);
									aspect-ratio: 301 / 259;
									bottom: 0;
									left: 0;
								}
								._03 .unisia__vision_contents__logo_mark__wrap__item__image_wrap {
									width: calc((186 / 470) * 100%);
									aspect-ratio: 186 / 324;
									bottom: calc((28 / 516) * 100%);
									right: 0;
								}
								._04 .unisia__vision_contents__logo_mark__wrap__item__image_wrap {
									width: calc((143 / 470) * 100%);
									aspect-ratio: 143 / 141;
									top: 0; 
									right: 0;
								}
									.unisia__vision_contents__logo_mark__wrap__item__image_wrap__mask {
										width: 100%;
										height: 100%;
										position: absolute;
										top: 0;
										left: 0;
										z-index: 10;
									}
									.unisia__vision_contents__logo_mark__wrap__item__image {
										width: 100%;
										height: auto;
										position: absolute;
										top: 0;
										left: 0;
										opacity: 0;
										transition: opacity 2s ease;
									}
									.unisia__vision_contents__logo_mark__wrap__item__image._first {
										opacity: 1;
									}
										.unisia__vision_contents__logo_mark__wrap__item__image_wrap img {
											width: 100%;
											height: auto;
										}
			/* Value */
			.unisia__value_contents {
				width: 100%;
				height: auto;
				margin: 26px auto 0;
			}
				.unisia__value_contents__txt {
					width: 100%;
					max-width: 900px;
					height: auto;
					margin: 0 auto 70px;
					font-size: 30px;
					font-weight: 700;
					line-height: 1.4;
					letter-spacing: 0.05em;
					color: var(--color--black);
				}
					.unisia__value_contents__txt__row {
						display: block;
						width: fit-content;
						padding: 0 8px;
						overflow: hidden;
						position: relative;
					}
						.unisia__value_contents__txt__row::after {
							content: '';
							display: block;
							width: 100%;
							height: 100%;
							background-color: var(--color--white);
							position: absolute;
							top: 0;
							left: 0;
							z-index: -1;
							transform: scaleY(0);
							transform-origin: bottom;
							transition: transform 1s cubic-bezier(0.16, 1, 0.3, 1);
							transition-delay: 1.4s;
							will-change: transform;
						}
						.run .unisia__value_contents__txt__row::after {
							transform: scaleY(100%);
						}
						.unisia__value_contents__txt__row__item {
							display: inline-block;
							transform: translateY(100%);
							transition: transform 1s cubic-bezier(0.85, 0, 0.15, 1);
							transition-delay: .4s;
							will-change: transform;
						}
						.run .unisia__value_contents__txt__row__item {
							transform: translateY(0);
						}
				.unisia__value_contents__list {
					display: grid;
					grid-template-columns: repeat(3, 1fr);
					gap: 16px;
					width: 100%;
					height: auto;
				}
					.unisia__value_contents__list__item {
						width: 100%;
						height: auto;
						padding: 40px 0 min(90px, calc((90 / 326) * 100%));
						background-color: var(--color--white);
						position: relative;
						overflow: hidden;
						opacity: 0;
						transform: translate(-3%, 20%) rotate(-5deg);
						transition: 1s cubic-bezier(0.16, 1, 0.3, 1);
						transition-delay: .4s;
						will-change: transform;
					}
					.unisia__value_contents__list__item:nth-of-type(2) {
						transition-delay: .45s;
					}
					.unisia__value_contents__list__item:nth-of-type(3) {
						transition-delay: .5s;
					}
					.unisia__value_contents__list__item:nth-of-type(4) {
						transition-delay: .55s;
					}
					.unisia__value_contents__list__item:nth-of-type(5) {
						transition-delay: .6s;
					}
					.unisia__value_contents__list__item:nth-of-type(6) {
						transition-delay: .65s;
					}
					.run .unisia__value_contents__list__item {
						opacity: 1;
						transform: translateY(0) rotate(0);
					}
						.unisia__value_contents__list__item__label {
							display: flex;
							justify-content: center;
							align-items: center;
							width: 34px;
							height: 62px;
							padding: 0 0 1px;
							border-radius: 0 0 17px 17px;
							background-color: var(--color--black);
							position: absolute;
							top: 0;
							left: 20px;
							transform: translateY(-100%);
							transition: transform 1s cubic-bezier(0.16, 1, 0.3, 1);
							transition-delay: 1.2s;
							will-change: transform;
						}
						.run .unisia__value_contents__list__item__label {
							transform: translateY(0);
						}
							.unisia__value_contents__list__item__label__txt {
								font-size: 14px;
								font-weight: 700;
								line-height: 1;
								letter-spacing: 0.2em;
								color: var(--color--white);
								-webkit-writing-mode: vertical-rl;
								-moz-writing-mode: vertical-rl;
								-ms-writing-mode: tb-rl;
								-ms-writing-mode: vertical-rl;
								writing-mode: vertical-rl;
							}
						.unisia__value_contents__list__item__image {
							width: 90px;
							height: auto;
							margin: 0 auto 16px;
							overflow: hidden;
						}
							.unisia__value_contents__list__item__image img {
								width: 100%;
								height: auto;
								opacity: 0;
								transition: opacity 1s ease;
								transition-delay: 1.2s;
								will-change: transform;
							}
							.run .unisia__value_contents__list__item__image img {
								opacity: 1;
							}
						.unisia__value_contents__list__item__details {
							width: 87%;
							max-width: 245px;
							height: auto;
							margin: 0 auto;
							opacity: 0;
							transition: opacity 1s ease;
							transition-delay: 1.2s;
							will-change: opacity;
						}
						.run .unisia__value_contents__list__item__details {
							opacity: 1;
						}
							.unisia__value_contents__list__item__details dt {
								width: 100%;
								height: auto;
								margin: 0 auto 24px;
								font-size: 22px;
								font-weight: 700;
								line-height: 1.8;
								letter-spacing: 0.05em;
								text-align: center;
								color: var(--color--black);
							}
							.unisia__value_contents__list__item__details dd {
								width: 100%;
								height: auto;
								font-size: 14px;
								font-weight: 700;
								line-height: 2;
								letter-spacing: 0.05em;
								color: var(--color--black);
							}
						.unisia__value_contents__list__item__en_txt {
							width: fit-content;
							height: auto;
							font-size: 12px;
							font-weight: 700;
							line-height: 1.5;
							letter-spacing: 0.02em;
							color: var(--color--lightgray);
							position: absolute;
							bottom: 10px;
							left: 14px;
							opacity: 0;
							transition: opacity 1s ease;
							transition-delay: 1.2s;
							will-change: opacity;
						}
						.run .unisia__value_contents__list__item__en_txt {
							opacity: 1;
						}

#message {
	width: 100%;
	height: auto;
	scroll-margin-top: 114px;
}
	.message__inner {
		display: flex;
		justify-content: space-between;
		align-items: stretch;
		width: 100%;
		height: auto;
		background-color: var(--color--white);
	}
		.message__image {
			width: 50%;
			height: auto;
			position: relative;
			opacity: 0;
			transition: opacity 1s ease;
			transition-delay: .4s;
			will-change: opacity;
		}
		.run .message__image {
			opacity: 1;
		}
			.message__image img {
				width: 100%;
				height: 100%;
				object-fit: cover;
				object-position: 50% 20%;
				position: absolute;
			}
		.message__contents {
			width: 50%;
			height: auto;
			padding: 163px 0 133px;
			position: relative;
		}
			#message .message__contents > .section_heading {
				position: absolute;
				top: 20px;
				left: 24px;
			}
			.message__details {
				width: calc((420 / 720) * 100%);
				min-width: 420px;
				height: auto;
				margin: 0 auto 40px;
			}
				.message__details__ttl {
					width: 100%;
					height: auto;
					margin: 0 auto 60px;
					font-size: 30px;
					font-weight: 700;
					line-height: 1.8;
					letter-spacing: 0.05em;
					color: var(--color--black);
				}
					.message__details__ttl__row {
						display: block;
						width: fit-content;
						overflow: hidden;
						position: relative;
					}
						.message__details__ttl__row__item {
							display: inline-block;
							transform: translateY(100%);
							transition: transform 1s cubic-bezier(0.16, 1, 0.3, 1);
							transition-delay: .4s;
							will-change: transform;
						}
						.run .message__details__ttl__row__item {
							transform: translateY(0);
						}
				.message__details__txt {
					width: 100%;
					height: auto;
					font-size: 14px;
					font-weight: 700;
					line-height: 2;
					letter-spacing: 0.05em;
					color: var(--color--black);
					opacity: 0;
					transition: opacity 1s ease;
					transition-delay: 1s;
					will-change: opacity;
				}
				.run .message__details__txt {
					opacity: 1;
				}
			.message__ceo {
				width: calc((580 / 720) * 100%);
				height: auto;
				margin: 0 auto;
				font-size: 14px;
				font-weight: 700;
				line-height: 2;
				letter-spacing: 0.05em;
				color: var(--color--black);
				text-align: right;
				opacity: 0;
				transition: opacity 1s ease;
				transition-delay: 1s;
				will-change: opacity;
			}
			.run .message__ceo {
				opacity: 1;
			}

/* PC ================================================== */
@media all and (min-width:1100px){
/* message */
		.message__inner > .section_heading {
			display: none;
		}
}

@media all and (max-width:1099px){
	.message__inner {
		flex-direction: column;
		justify-content: flex-start;
		padding: 40px 0 0;
	}
		.message__inner > .section_heading {
			display: block;
			width: 95%;
			margin: 0 auto 20px;
		}
		.message__image {
			width: 100%;
		}
			.message__image img {
				width: 100%;
				height: auto;
				object-fit: initial;
				object-position: initial;
				position: initial;
			}
		.message__contents {
			width: 100%;
			padding: 40px 0 60px;
		}
			#message .message__contents > .section_heading {
				display: none;
			}
			.message__details {
				width: calc((334 / 375) * 100%);
				min-width: initial;
				margin: 0 auto 24px;
			}
				.message__details__ttl {
					margin: 0 auto 30px;
				}
}

@media all and (max-width:920px){
							/* Value */
							.unisia__value_contents__list__item__details dt {
								margin: 0 auto 20px;
								font-size: 18px;
							}
}



/* Tablet ================================================== */
@media all and (max-width: 768px){
#unisia {
	padding: 0 0 80px;
}
	.unisia__inner {
		width: calc((334 / 375) * 100%);
	}
		.unisia__items._mission {
			margin: 0 auto 100px;
		}
		.unisia__items._vision {
			margin: 0 auto 100px;
		}
			.unisia__items .section_heading {
				max-width: initial;
				margin: 0 auto 10px;
			}
			.unisia__items__sub_heading {
				font-size: 16px;
			}
			/* Mission */
			.unisia__mission_contents {
				margin: 32px auto 0;
			}
					.unisia__mission_contents__details__ttl {
						margin: 0 auto 30px;
						font-size: 20px;
						line-height: 2;
						text-align: left;
						white-space: nowrap;
					}
						.unisia__mission_contents__details__ttl__row {
							padding: 0 10px;
						}
						.unisia__mission_contents__details__ttl__row + .unisia__mission_contents__details__ttl__row {
							margin-top: 4px;
						}
					.unisia__mission_contents__details__txt {
						font-size: 14px;
						text-align: left;
					}
			/* Vision */
			.unisia__vision_contents {
				display: flex;
				flex-direction: column-reverse;
				justify-content: flex-start;
				align-items: center;
				margin: 46px auto 0;
			}
				.unisia__vision_contents__details {
					width: 100%;
					margin: 50px auto 0;
				}
					.unisia__vision_contents__details__ttl {
						margin: 0 auto 30px;
						font-size: 20px;
						line-height: 2;
						letter-spacing: 0.05em;
					}
						.unisia__vision_contents__details__ttl__row {
							padding: 0 10px;
						}
						.unisia__vision_contents__details__ttl__row + .unisia__vision_contents__details__ttl__row {
							margin-top: 4px;
						}
					.unisia__vision_contents__details__txt {
						font-size: 14px;
						letter-spacing: 0em;
					}
				.unisia__vision_contents__logo {
					width: calc((195 / 334) * 100%);
					max-width: 435px;
					margin: 0 auto;
					position: initial;
				}
			/* Value */
			.unisia__value_contents {
				margin: 32px auto 0;
			}
				.unisia__value_contents__txt {
					margin: 0 auto 42px;
					font-size: 20px;
					line-height: 2;
				}
					.unisia__value_contents__txt__row {
						padding: 0 10px;
					}
				.unisia__value_contents__list {
					grid-template-columns: repeat(2, 1fr);
					gap: 8px;
				}
					.unisia__value_contents__list__item {
						padding: 20px 0 10px;
					}
						.unisia__value_contents__list__item__label {
							width: 23px;
							height: 42px;
							padding: 0;
							border-radius: 0 0 9999px 9999px;
							left: 13px;
						}
							.unisia__value_contents__list__item__label__txt {
								font-size: 10px;
								letter-spacing: 0.2em;
							}
						.unisia__value_contents__list__item__image {
							width: 70px;
							margin: 0 auto 15px;
						}
						.unisia__value_contents__list__item__details {
							width: calc((128 / 163) * 100%);
							max-width: initial;
							margin: 0 auto 9px;
						}
							.unisia__value_contents__list__item__details dt {
								margin: 0 auto 12px;
								font-size: 16px;
								line-height: 1.6;
							}
							.unisia__value_contents__list__item__details dd {
								font-size: 12px;
								line-height: 1.8;
								text-align: left;
							}
						.unisia__value_contents__list__item__en_txt {
							width: 100%;
							font-size: 12px;
							text-align: center;
							position: initial;
						}

/* message */
#message {
	scroll-margin-top: 78px;
}
	.message__inner {
		background-color: initial;
	}
		.message__inner > .section_heading {
			width: calc((334 / 375) * 100%);
			margin: 0 auto 40px;
		}
		.message__contents {
			width: 100%;
			padding: 30px 0 60px;
			background-color: var(--color--white);
		}
			.message__details {
				width: calc((334 / 375) * 100%);
				margin: 0 auto 22px;
			}
				.message__details__ttl {
					margin: 0 auto 30px;
					font-size: 20px;
				}
				.message__details__txt {
					font-weight: 500;
					line-height: 1.8;
				}
			.message__ceo {
				width: calc((334 / 375) * 100%);
			}
}