/* mv
---------------------------*/
.mv {
	position: relative;
}
.mv__bgimg img {
	aspect-ratio: 1480 / 337;
	object-fit: cover;
	width: 100%;
	height: 100%;
}

.mv__copy--ttl {
	color: #fff;
	position: absolute;
	top: 45%;
	left: 50%;
	transform: translateX(-50%);
	width: 100%;
}

@media (min-width: 768px) {
	.mv__bgimg {
		height: 340px;
	}
}
@media (max-width: 767px) {
	.mv__bgimg img {
		aspect-ratio: 1 / 1;
	}
	.mv__copy--ttl img {
		max-width: 520px;
		width: 90%;
	}
}


/* top-news
---------------------------*/
.top-news__txt {
	overflow: hidden;
	display: -webkit-box;
	line-clamp: 1;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;
}

@media (max-width: 767px) {
	.top-news__txt {
		font-size: .875rem;
		line-clamp: 2;
		-webkit-line-clamp: 2;
	}
}
.top-news {
	.s_eirItem {
		padding: 1.5rem 1rem;
	}
	.top-news__wrap {
		padding: 1.5rem 1rem;
		border-color: #ccc;
		span {
			line-height: 17px;
		}
	}
}

/* top-metalworking
---------------------------*/
/* .top-metalworking__box {
	max-width: 354px;
	width: 100%;
	margin: auto;
}

.top-metalworking__arrow {
	transition: .3s;
}

.top-metalworking__arrow--hover {
	display: none;
	transition: .3s;
}

.top-metalworking__link {
	&:hover {
		.top-metalworking__photo {
			background: var(--green);
			border: 1px solid var(--green);
			border-radius: 28px;
		}

		.top-metalworking__arrow {
			display: none;
		}

		.top-metalworking__arrow--hover {
			display: block;
		}
	}
}

.top-metalworking__photo {
	border: 1px solid var(--black);
	border-radius: 4px;
	padding: 4px;
	transition: .3s;
	display: inline-flex;
} */

/* top-products
---------------------------*/
/* .top-products__slider .prev-arrow,
.next-arrow {
	background: none;
	border: none;
	width: 40px;
	height: 40px;
}

.top-products__slider .prev-arrow {
	background-image: url('../../images/icons/icon-arrow_l-white.webp');
	background-size: contain;
	background-repeat: no-repeat;

	&:hover {
		background-image: url('../../images/icons/icon-arrow_l-green.webp');
	}
}

.top-products__slider .next-arrow {
	background-image: url('../../images/icons/icon-arrow_r-white.webp');
	background-size: contain;
	background-repeat: no-repeat;

	&:hover {
		background-image: url('../../images/icons/icon-arrow_r-green.webp');
	}
} */

/* カスタマイズ */
/* .top-products__slider {
	.slick-track {
		display: flex;
	}

	.slick-slide {
		height: auto !important;
	}
}

.top-products__slider .slick-arrow {
	position: absolute;
	top: 0;
	bottom: auto;
	margin: auto;
	transition: .3s;
	cursor: pointer;
	width: 40px;
	height: 40px;
}

.top-products__slider .prev-arrow {
	left: -160px;
}

.top-products__slider .next-arrow {
	left: -110px;
}

.top-products__slider--box {
	position: relative;
}

.top-products__slider--wrap {
	width: 1160px;
	position: absolute;
	top: 0;
	left: calc(50% - 440px);
}

@media (min-width: 1441px) {
	.top-products__slider--wrap {
		width: 80.5vw;
	}
}

@media (min-width:1024px) {
	.top-products__slider--box {
		height: 340px;
	}
}

@media (max-width: 1200px) {
	.top-products {
		overflow: hidden;
	}

	.top-products__slider--wrap {
		width: 83%;
		position: static;
	}
}

@media (max-width: 1023px) {
	.top-products__slider--wrap {
		width: 100%;
	}

	.top-products__slider .slick-arrow {
		top: auto;
		bottom: -58px;
		transform: initial;
		width: 32px;
		height: 32px;
	}

	.top-products__slider .prev-arrow {
		left: auto !important;
		right: 64px !important;
	}

	.top-products__slider .next-arrow {
		left: auto !important;
		right: 24px !important;
	}
}

.top-products__slider--tag {
	font-size: .75rem;
	color: var(--green);
	border: 1px solid var(--green);
	border-radius: 2px;
	background: white;
	padding: 2px 7px;
}

.top-products__slider--img img {
	aspect-ratio: 1/1;
	object-fit: cover;
	overflow: hidden;
	width: 240px;
	height: 100%;
} */

/* top-ma
---------------------------*/

.top-ma {
	width: 94.5vw;
	margin: auto;
	background: rgb(51, 134, 98);
	background: linear-gradient(135deg, rgba(51, 134, 98, 1) 0%, rgba(4, 95, 56, 1) 100%);
	border-radius: 40px;

	@media (max-width: 767px) {
		width: 100vw;
		border-radius: 16px;
	}
}

.top-ma__wrap {
	width: calc(100% - 136px);

	@media (max-width: 1023px) {
		width: 100%;
	}
}

.top-ma__txt {
	overflow: hidden;
	display: -webkit-box;
	line-clamp: 2;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;

	@media (max-width: 767px) {
		font-size: .875rem;
		line-clamp: 3;
		-webkit-line-clamp: 3;
	}
}

/* top-pronity
---------------------------*/

.top-pronity-btn {
	position: relative;
	display: block;

	&:before {
		content: '';
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		margin: auto;
		width: 100%;
		height: 100%;
		z-index: var(--z-index-num);
		background: linear-gradient(180deg, rgba(9, 6, 37, 0) 0%, rgba(9, 6, 37, 0) 75%, rgba(9, 6, 37, 1) 100%);
		transition: .3s;
	}
}

.top-pronity-btn__wrap {
	position: absolute;
	bottom: 1rem;
	left: 1rem;
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	gap: 10px;
	width: calc(100% - 24px);
	z-index: var(--z-index-ttl);
}

.top-pronity-btn__txt {
	color: #fff;
	position: relative;
	white-space: nowrap;

	&::after {
		position: absolute;
		bottom: -1px;
		left: 0;
		transform: scaleX(0);
		transform-origin: center left;
		width: 100%;
		height: 1px;
		background-color: #fff;
		content: '';
		transition: transform .3s ease;
	}
}

.top-pronity-btn__photo {
	border: 1px solid #fff;
	border-radius: 4px;
	padding: 7px 6.5px;
	transition: .3s;
}

.top-pronity-btn__main--img {
	transition: .3s;
}

.top-pronity-btn {
	&:hover {
		&::before {
			scale: 1.05;
			background-image: linear-gradient(180deg, rgba(4, 95, 56, 0), rgba(4, 95, 56, 0.5));
		}

		.top-pronity-btn__photo {
			background: var(--green);
			border: 1px solid var(--green);
			border-radius: 28px;
		}

		.top-pronity-btn__main--img {
			scale: 1.05;
		}
	}
}

.top-pronity-btn__main--img img {
	/* max-width: 360px; */
	width: 100%;
}

/* top-recruit
---------------------------*/
.top-recruit {
	position: relative;
	overflow: hidden;
}

.top-recruit__gradient::before {
	content: '';
	display: block;
	position: absolute;
	top: -18%;
	left: -12%;
	width: 640px;
	height: 640px;
	filter: blur(100px);
	opacity: .8;
	z-index: -1;
	background: rgb(141, 203, 176);
	background: radial-gradient(circle, rgba(141, 203, 176, 1) 47%, rgba(255, 186, 0, 1) 100%);
}
.top-recruit {
	.btn-common__txt {
		border-color: var(--orange);
	}
	.btn-common__photo {
		border-color: var(--green);
	}
}

/* top採用スライダー
---------------------------*/

.top-recruit-slider__item {
	border-radius: 16px;
}

.top-recruit-slider-top,
.top-recruit-slider-down {
	.slick-slide:not(:first-child) {
		.top-recruit-slider__item {
			padding-right: 8px;
		}
	}
	.slick-slide div {
		vertical-align: bottom;
	}
}

.top-recruit-slider__item {
	img {
		border-radius: 16px;
		aspect-ratio: 4/3;
		object-fit: cover;
	}
}

.top-recruit-slider-down {
  direction: rtl;
}

@media (min-width: 1024px) {
	.top-recruit-slider {
		overflow: hidden;
		height: 233px;
	}

	/* .top-recruit-slider__item img {
		height: 233px;
		width: 310px;
	} */

	.top-recruit-slider .slick-slide {
		width: 310px !important;
	}
}
@media (min-width: 768px) {
	.top-recruit-slider {
		overflow: hidden;
		height: 210px;
	}

	/* .top-recruit-slider__item img {
		height: 210px;
		width: 280px;
	} */

	.top-recruit-slider .slick-slide {
		width: 280px !important;
	}
}

/* topーページボタン
---------------------------*/

.top-news,
.top-metalworking,
.top-ma,
.top-pronity,
.top-recruit,
.top-products {
	.btn-common__txt {
		font-size: 1.125rem;
	}

	.btn-common__photo {
		padding: 7px 6.5px;
	}

	@media (max-width: 767px) {
		.btn-common__txt {
			font-size: 1rem;
		}

		.btn-common__photo {
			padding: 6px 5.5px;
		}
	}
}

/* topページニュースタブ切り替え
---------------------------*/
.top-news__tab {
	border: transparent;

	&.active {
		width: 90%;
		color: #fff;
		background: var(--green);
	}

	@media (max-width: 767px) {
		font-size: .8125rem;
	}
}


/* .top-youtube {
	iframe {
		max-width: 600px;
		width: 100%;
		margin: auto;

		@media (max-width: 767px) {
			height: 300px;
		}
	}
} */

/* top-about
---------------------------*/

.top-about {
	.btn-lg {
		position: relative;
		a {
			&:hover {
				background-image: linear-gradient(transparent 0%, #045f3833);
				.btn-lg__photo {
					border-color: var(--green);
				}
			}
		}
		.btn-lg__photo {
			position: absolute;
			bottom: 1rem;
			right: 1rem;
		}
	}
}

/* top-group
---------------------------*/

.top-group__h2-ttl {
	font-size: 15px;
}

