@charset "utf-8";
#introduction {
	width: 100%;
	height: auto;
	padding: calc((60 / var(--vw)) * 100vw) 0 calc((100 / var(--vw)) * 100vw);
	position: relative;
	overflow: hidden;
}
	.introduction__object {
		height: auto;
		position: absolute;
		z-index: -1;
	}
	.introduction__object._01 {
		width: calc((302 / var(--vw)) * 100vw);
		top: calc((64 / var(--vw)) * 100vw);
		left: calc((-260 / var(--vw)) * 100vw);
		transform: rotate(-90deg);
	}
	.introduction__object._02 {
		width: calc((423 / var(--vw)) * 100vw);
		top: calc((410 / var(--vw)) * 100vw);
		right: calc((-300 / var(--vw)) * 100vw);
		transform: rotate(90deg);
	}
	.introduction__object._03 {
		width: calc((423 / var(--vw)) * 100vw);
		top: calc((1151 / var(--vw)) * 100vw);
		left: calc((-139 / var(--vw)) * 100vw);
		transform: rotate(180deg);
	}
	.introduction__object._04 {
		width: calc((423 / var(--vw)) * 100vw);
		bottom: calc((239 / var(--vw)) * 100vw);
		right: calc((-300 / var(--vw)) * 100vw);
		transform: rotate(90deg);
	}
	.introduction__object._05 {
		width: calc((368 / var(--vw)) * 100vw);
		bottom: calc((-114 / var(--vw)) * 100vw);
		left: calc((-245 / var(--vw)) * 100vw);
		transform: rotate(-90deg);
	}
	.introduction__inner {
		width: calc((1200 / var(--vw)) * 100vw);
		height: auto;
		margin: 0 auto;
	}
		.introduction__anker_list {
			display: flex;
			justify-content: space-between;
			align-items: center;
			width: calc((800 / 1200) * 100%);
			height: auto;
			margin: 0 auto calc((50 / var(--vw)) * 100vw);
		}
			.introduction__anker_btn {
				display: flex;
				justify-content: center;
				align-items: center;
				width: calc((390 / 800) * 100%);
				height: calc((60 / var(--vw)) * 100vw);
				padding-right: calc((3 / var(--vw)) * 100vw);
				border-radius: calc((6 / var(--vw)) * 100vw);
				background-color: var(--color--black);
				font-size: calc((18 / var(--vw)) * 100vw);
				font-weight: 700;
				line-height: 1.4;
				letter-spacing: 0em;
				color: var(--color--white);
				position: relative;
				cursor: pointer;
			}
				.introduction__anker_btn__text {
					display: block;
					width: fit-content;
					height: auto;
				}
				.introduction__anker_btn__arrow {
					display: block;
					width: calc((12 / var(--vw)) * 100vw);
					height: calc((12 / var(--vw)) * 100vw);
					background-color: var(--color--white);
					mask-image: url(../image/arrow_bottom.svg);
					mask-size: contain;
					mask-position: center;
					mask-repeat: no-repeat;
					position: absolute;
					top: 50%;
					right: calc((25 / var(--vw)) * 100vw);
					transform: translate(0%,-50%);
				}
		@media (any-hover: hover) {
			.introduction__anker_btn {
				transition: var(--transition--bg);
			}
			.introduction__anker_btn:hover {
				background-color: var(--color--red);
			}
				.introduction__anker_btn__arrow {
					transition: var(--transition--transform);
				}
				.introduction__anker_btn:hover .introduction__anker_btn__arrow {
					transform: translate(0%,calc(-50% + ((4 / var(--vw)) * 100vw)));
				}
		}
		.introduction__contents {
			width: 100%;
			height: auto;
		}
			.introduction__contents__item {
				width: 100%;
				height: auto;
				padding: calc((50 / var(--vw)) * 100vw);
				border-radius: calc((20 / var(--vw)) * 100vw);
				box-shadow: 0 calc((3 / var(--vw)) * 100vw) calc((10 / var(--vw)) * 100vw) rgba(0, 0, 0, 0.06);
			}
			.introduction__contents__item._domestic {
				margin-bottom: calc((40 / var(--vw)) * 100vw);
			}
				.introduction__contents__item__heading {
					width: 100%;
					height: auto;
					margin: 0 auto calc((30 / var(--vw)) * 100vw);
				}
					.introduction__contents__item__heading__main_text {
						width: 100%;
						height: auto;
						font-size: calc((26 / var(--vw)) * 100vw);
						font-weight: 700;
						line-height: 1.4;
						letter-spacing: 0em;
					}
					._domestic .introduction__contents__item__heading__main_text {
						color: var(--color--black);
					}
					._international .introduction__contents__item__heading__main_text {
						color: var(--color--white);
					}
					.introduction__contents__item__heading__sub_text {
						width: 100%;
						height: auto;
						font-size: calc((12 / var(--vw)) * 100vw);
						font-weight: 700;
						line-height: 1.9;
						letter-spacing: 0.03em;
						color: var(--color--red);
						text-transform: uppercase;
					}
				.introduction__list {
					display: grid;
					grid-template-columns: repeat(2, 1fr);
					gap: calc((20 / var(--vw)) * 100vw);
					width: 100%;
					height: auto;
				}
					.introduction__list__item {
						width: 100%;
						height: auto;
						padding: 0 calc((30 / var(--vw)) * 100vw) calc((26 / var(--vw)) * 100vw);
						background-color: var(--color--white);
						border-radius: calc((6 / var(--vw)) * 100vw);
					}
						.introduction__list__item__top {
							width: 100%;
							height: calc((100 / var(--vw)) * 100vw);
							position: relative;
						}
							.introduction__list__item__logo {
								height: auto;
								position: absolute;
								left: 0;
							}
							._kushitanaka .introduction__list__item__logo {
								width: calc((55 / var(--vw)) * 100vw);
								top: calc((24 / var(--vw)) * 100vw);
							}
							._pisola .introduction__list__item__logo {
								width: calc((100 / var(--vw)) * 100vw);
								top: calc((35 / var(--vw)) * 100vw);
							}
							._tennomeshi .introduction__list__item__logo {
								width: calc((195 / var(--vw)) * 100vw);
								top: calc((35 / var(--vw)) * 100vw);
							}
							._kuruton .introduction__list__item__logo {
								width: calc((176 / var(--vw)) * 100vw);
								top: calc((43 / var(--vw)) * 100vw);
							}
							._tominojo .introduction__list__item__logo {
								width: calc((57 / var(--vw)) * 100vw);
								top: calc((37 / var(--vw)) * 100vw);
							}
							._atsuton .introduction__list__item__logo {
								width: calc((100 / var(--vw)) * 100vw);
								top: calc((35 / var(--vw)) * 100vw);
							}
							._the_menchi .introduction__list__item__logo {
								width: calc((139 / var(--vw)) * 100vw);
								top: calc((33 / var(--vw)) * 100vw);
							}
							._tsukurioki .introduction__list__item__logo {
								width: calc((79 / var(--vw)) * 100vw);
								top: calc((22 / var(--vw)) * 100vw);
							}
							._tanaka .introduction__list__item__logo {
								width: calc((54 / var(--vw)) * 100vw);
								top: calc((23 / var(--vw)) * 100vw);
							}
							._tonkatsu_tennomeshi .introduction__list__item__logo {
								width: calc((53 / var(--vw)) * 100vw);
								top: calc((35 / var(--vw)) * 100vw);
							}
							.introduction__list__item__en_name {
								width: fit-content;
								height: auto;
								font-size: calc((10 / var(--vw)) * 100vw);
								font-weight: 400;
								line-height: 1;
								letter-spacing: 0.1em;
								color: var(--color--gray);
								position: absolute;
								top: calc((13 / var(--vw)) * 100vw);
								right: calc((-14 / var(--vw)) * 100vw);
								z-index: 1;
							}
						.introduction__list__item__main {
							display: flex;
							justify-content: space-between;
							align-items: flex-start;
							flex-wrap: wrap;
							gap: calc((30 / var(--vw)) * 100vw) calc((26 / var(--vw)) * 100vw);
							width: 100%;
							height: auto;
						}
							.introduction__list__item__image {
								width: calc((194 / 480) * 100%);
								height: auto;
							}
							.introduction__list__item__details {
								width: calc((260 / 480) * 100%);
								height: auto;
							}
								.introduction__list__item__name {
									width: 100%;
									height: auto;
									margin: calc((-6 / var(--vw)) * 100vw) 0 calc((10 / var(--vw)) * 100vw);
									font-size: calc((16 / var(--vw)) * 100vw);
									font-weight: 700;
									line-height: 1.4;
									letter-spacing: 0.1em;
								}
									.introduction__list__item__name small {
										font-size: calc((10 / var(--vw)) * 100vw);
										letter-spacing: 0.05em;
									}
								.introduction__list__item__text {
									width: 100%;
									height: auto;
									margin: 0 auto calc((16 / var(--vw)) * 100vw);
									font-size: calc((12 / var(--vw)) * 100vw);
									font-weight: 500;
									line-height: 1.8;
									letter-spacing: 0.03em;
								}
								.introduction__list__item__recommend {
									width: 100%;
									height: auto;
									border-radius: calc((4 / var(--vw)) * 100vw);
									border: solid calc((1 / var(--vw)) * 100vw) var(--color--gray);
								}
									.introduction__list__item__recommend dt {
										width: 100%;
										height: auto;
										padding: calc((4 / var(--vw)) * 100vw) calc((8 / var(--vw)) * 100vw) calc((3 / var(--vw)) * 100vw);
										border-bottom: solid calc((1 / var(--vw)) * 100vw) var(--color--gray);
										font-size: calc((12 / var(--vw)) * 100vw);
										font-weight: 700;
										line-height: 1.6;
										letter-spacing: 0.1em;
										color: var(--color--red);
									}
									.introduction__list__item__recommend dd {
										width: 100%;
										height: auto;
										padding: calc((5 / var(--vw)) * 100vw) calc((8 / var(--vw)) * 100vw);
										font-size: calc((12 / var(--vw)) * 100vw);
										font-weight: 500;
										line-height: 1.5;
										letter-spacing: 0.03em;
										color: var(--color--black);
									}
										.introduction__list__item__recommend dd ._red_text {
											color: var(--color--red);
										}
							.introduction__list__item__btn_area {
								display: flex;
								justify-content: space-between;
								align-items: center;
								width: 100%;
								height: auto;
							}
								.introduction__list__item__btn_area__left {
									display: flex;
									justify-content: flex-start;
									align-items: center;
									gap: calc((10 / var(--vw)) * 100vw);
									width: fit-content;
									height: auto;
								}
								.introduction__list__item__btn_area__right {
									width: fit-content;
									height: auto;
								}
									.introduction__list__item__btn_wrap {
										height: calc((35 / var(--vw)) * 100vw);
									}
									._interview.introduction__list__item__btn_wrap {
										width: calc((100 / var(--vw)) * 100vw);
									}
									._brand_site.introduction__list__item__btn_wrap {
										width: calc((110 / var(--vw)) * 100vw);
									}
									._recruitment.introduction__list__item__btn_wrap {
										width: calc((114 / var(--vw)) * 100vw);
									}
										.introduction__list__item__btn {
											display: flex;
											justify-content: flex-start;
											align-items: center;
											width: 100%;
											height: 100%;
											padding-left: calc((9 / var(--vw)) * 100vw);
											border-radius: 9999px;
											font-size: calc((10 / var(--vw)) * 100vw);
											font-weight: 700;
											line-height: 1.8;
											letter-spacing: 0.03em;
											color: var(--color--white);
											position: relative;
										}
										._recruitment .introduction__list__item__btn {
											padding-left: calc((24 / var(--vw)) * 100vw);
											font-size: calc((12 / var(--vw)) * 100vw);
										}
										.introduction__list__item__btn._black {
											background-color: var(--color--black);
											border: solid calc((1 / var(--vw)) * 100vw) var(--color--black);
										}
										.introduction__list__item__btn._red {
											background-color: var(--color--red);
											border: solid calc((1 / var(--vw)) * 100vw) var(--color--red);
										}
											.introduction__list__item__btn__text {
												display: block;
												width: fit-content;
												height: auto;
											}
											.introduction__list__item__btn__arrow {
												display: block;
												width: calc((10 / var(--vw)) * 100vw);
												height: calc((10 / var(--vw)) * 100vw);
												background-color: var(--color--white);
												mask-image: url(../image/arrow@sp.svg);
												mask-size: contain;
												mask-position: center;
												mask-repeat: no-repeat;
												position: absolute;
												top: 50%;
												right: calc((7 / var(--vw)) * 100vw);
												transform: translate(0%,-50%);
											}
											.introduction__list__item__btn__icon {
												display: block;
												width: calc((10 / var(--vw)) * 100vw);
												height: calc((10 / var(--vw)) * 100vw);
												background-color: var(--color--white);
												mask-image: url(../image/icon-external_link@sp.svg);
												mask-size: contain;
												mask-position: center;
												mask-repeat: no-repeat;
												position: absolute;
												top: 50%;
												right: calc((10 / var(--vw)) * 100vw);
												transform: translate(0%,-50%);
											}
								@media (any-hover: hover) {
										.introduction__list__item__btn {
											transition: var(--transition--bg), var(--transition--text);
										}
										.introduction__list__item__btn:hover {
											background-color: var(--color--white);
										}
										.introduction__list__item__btn._black:hover {
											color: var(--color--black);
										}
										.introduction__list__item__btn._red:hover {
											color: var(--color--red);
										}
										.introduction__list__item__btn__icon {
											transition: var(--transition--bg);
										}
										.introduction__list__item__btn._black:hover .introduction__list__item__btn__arrow {
											background-color: var(--color--black);
										}
										.introduction__list__item__btn._red:hover .introduction__list__item__btn__arrow {
											background-color: var(--color--red);
										}
										.introduction__list__item__btn:hover .introduction__list__item__btn__icon {
											background-color: var(--color--black);
										}
								}

/* PC ================================================== */
@media all and (min-width: 769px){

}

/* Tablet ================================================== */
@media all and (max-width: 768px){
#introduction {
	padding: calc((60 / var(--vw)) * 100vw) 0 0;
}
	.introduction__object {
		display: none;
	}
	.introduction__inner {
		width: 100%;
	}
		.introduction__anker_list {
			width: calc((330 / var(--vw)) * 100%);
			margin: 0 auto calc((40 / var(--vw)) * 100vw);
		}
			.introduction__anker_btn {
				justify-content: flex-start;
				width: calc((160 / 330) * 100%);
				height: calc((50 / var(--vw)) * 100vw);
				padding-right: 0;
				padding-left: calc((19 / var(--vw)) * 100vw);
				border-radius: calc((3 / var(--vw)) * 100vw);
				font-size: calc((14 / var(--vw)) * 100vw);
			}
				.introduction__anker_btn__arrow {
					right: calc((14 / var(--vw)) * 100vw);
				}
			.introduction__contents__item {
				padding: calc((30 / var(--vw)) * 100vw) calc((22 / var(--vw)) * 100vw) calc((50 / var(--vw)) * 100vw);
				border-radius: calc((10 / var(--vw)) * 100vw);
			}
			.introduction__contents__item._domestic {
				margin-bottom: 0;
			}
				.introduction__contents__item__heading {
					width: calc((288 / 330) * 100%);
					margin: 0 auto calc((30 / var(--vw)) * 100vw);
				}
					.introduction__contents__item__heading__main_text {
						margin-bottom: calc((1 / var(--vw)) * 100vw);
						font-size: calc((24 / var(--vw)) * 100vw);
					}
					.introduction__contents__item__heading__sub_text {
						font-size: calc((10 / var(--vw)) * 100vw);
						line-height: 2;
					}
				.introduction__list {
					grid-template-columns: repeat(1, 1fr);
					gap: calc((30 / var(--vw)) * 100vw);
				}
					.introduction__list__item {
						padding: 0 calc((23 / var(--vw)) * 100vw) calc((35 / var(--vw)) * 100vw);
					}
						._kushitanaka .introduction__list__item__top {
							height: calc((96 / var(--vw)) * 100vw);
						}
						._pisola .introduction__list__item__top {
							height: calc((76 / var(--vw)) * 100vw);
						}
						._tennomeshi .introduction__list__item__top {
							height: calc((71 / var(--vw)) * 100vw);
						}
						._kuruton .introduction__list__item__top {
							height: calc((60 / var(--vw)) * 100vw);
						}
						._tominojo .introduction__list__item__top {
							height: calc((72 / var(--vw)) * 100vw);
						}
						._atsuton .introduction__list__item__top {
							height: calc((62 / var(--vw)) * 100vw);
						}
						._the_menchi .introduction__list__item__top {
							height: calc((64 / var(--vw)) * 100vw);
						}
						._tsukurioki .introduction__list__item__top {
							height: calc((64 / var(--vw)) * 100vw);
						}
						._tanaka .introduction__list__item__top {
							height: calc((68 / var(--vw)) * 100vw);
						}
						._tonkatsu_tennomeshi .introduction__list__item__top {
							height: calc((70 / var(--vw)) * 100vw);
						}
							.introduction__list__item__logo {
								left: calc((13 / var(--vw)) * 100vw);
							}
							._kushitanaka .introduction__list__item__logo {
								top: calc((20 / var(--vw)) * 100vw);
							}
							._pisola .introduction__list__item__logo {
								top: calc((20 / var(--vw)) * 100vw);
							}
							._tennomeshi .introduction__list__item__logo {
								top: calc((21 / var(--vw)) * 100vw);
							}
							._kuruton .introduction__list__item__logo {
								width: calc((156 / var(--vw)) * 100vw);
								top: calc((20 / var(--vw)) * 100vw);
							}
							._tominojo .introduction__list__item__logo {
								width: calc((44 / var(--vw)) * 100vw);
								top: calc((20 / var(--vw)) * 100vw);
							}
							._atsuton .introduction__list__item__logo {
								width: calc((72 / var(--vw)) * 100vw);
								top: calc((20 / var(--vw)) * 100vw);
							}
							._the_menchi .introduction__list__item__logo {
								width: calc((100 / var(--vw)) * 100vw);
								top: calc((20 / var(--vw)) * 100vw);
							}
							._tsukurioki .introduction__list__item__logo {
								width: calc((50 / var(--vw)) * 100vw);
								top: calc((10 / var(--vw)) * 100vw);
							}
							._tanaka .introduction__list__item__logo {
								top: calc((20 / var(--vw)) * 100vw);
							}
							._tonkatsu_tennomeshi .introduction__list__item__logo {
								top: calc((21 / var(--vw)) * 100vw);
							}
							.introduction__list__item__en_name {
								top: calc((20 / var(--vw)) * 100vw);
								right: calc((-7 / var(--vw)) * 100vw);
							}
						.introduction__list__item__main {
							flex-direction: column;
							justify-content: flex-start;
							align-items: stretch;
							gap: 0;
							width: 100%;
						}
							.introduction__list__item__image {
								width: calc((258 / 284) * 100%);
								margin: 0 auto calc((10 / var(--vw)) * 100vw);
							}
							.introduction__list__item__details {
								width: calc((258 / 284) * 100%);
								margin: 0 auto;
							}
								.introduction__list__item__name {
									margin: 0 auto;
									line-height: 2;
								}
								.introduction__list__item__text {
									margin: 0 auto calc((15 / var(--vw)) * 100vw);
								}
							.introduction__list__item__btn_area {
								align-items: stretch;
								margin: calc((20 / var(--vw)) * 100vw) auto 0;
							}
								.introduction__list__item__btn_area__left {
									flex-direction: column;
									gap: calc((5 / var(--vw)) * 100vw);
									width: calc((175 / 284) * 100%);
								}
								.introduction__list__item__btn_area__right {
									width: calc((104 / 284) * 100%);
								}
									._interview.introduction__list__item__btn_wrap {
										width: 100%;
									}
									._brand_site.introduction__list__item__btn_wrap {
										width: 100%;
									}
									._recruitment.introduction__list__item__btn_wrap {
										width: 100%;
										height: 100%;
									}
										.introduction__list__item__btn {
											justify-content: flex-start;
											border-radius: calc((5 / var(--vw)) * 100vw);
											font-size: calc((12 / var(--vw)) * 100vw);
										}
										._recruitment .introduction__list__item__btn {
											justify-content: center;
											padding-left: 0;
											padding-right: calc((6 / var(--vw)) * 100vw);
										}
										.introduction__list__item__btn._black {
											padding-left: calc((15 / var(--vw)) * 100vw);
										}
											.introduction__list__item__btn__text {
												display: block;
												width: fit-content;
												height: auto;
											}
											.introduction__list__item__btn__arrow {
												display: block;
												width: calc((10 / var(--vw)) * 100vw);
												height: calc((10 / var(--vw)) * 100vw);
												background-color: var(--color--white);
												mask-image: url(../image/arrow@sp.svg);
												mask-size: contain;
												mask-position: center;
												mask-repeat: no-repeat;
												position: absolute;
												top: 50%;
												right: calc((7 / var(--vw)) * 100vw);
												transform: translate(0%,-50%);
											}
											.introduction__list__item__btn__icon {
												display: block;
												width: calc((10 / var(--vw)) * 100vw);
												height: calc((10 / var(--vw)) * 100vw);
												background-color: var(--color--white);
												mask-image: url(../image/icon-external_link@sp.svg);
												mask-size: contain;
												mask-position: center;
												mask-repeat: no-repeat;
												position: absolute;
												top: 50%;
												right: calc((10 / var(--vw)) * 100vw);
												transform: translate(0%,-50%);
											}
								@media (any-hover: hover) {
										.introduction__list__item__btn {
											transition: var(--transition--bg), var(--transition--text);
										}
										.introduction__list__item__btn:hover {
											background-color: var(--color--white);
										}
										.introduction__list__item__btn._black:hover {
											color: var(--color--black);
										}
										.introduction__list__item__btn._red:hover {
											color: var(--color--red);
										}
										.introduction__list__item__btn__icon {
											transition: var(--transition--bg);
										}
										.introduction__list__item__btn._black:hover .introduction__list__item__btn__arrow {
											background-color: var(--color--black);
										}
										.introduction__list__item__btn._red:hover .introduction__list__item__btn__arrow {
											background-color: var(--color--red);
										}
										.introduction__list__item__btn:hover .introduction__list__item__btn__icon {
											background-color: var(--color--black);
										}
								}

}

/* SP ================================================== */
@media all and (max-width: 575px){

}