/* company
---------------------------*/
.company-news__announcement {
	a:hover {
		.company-news__announcement--txt {
			color: var(--green);
		}

		.company-news__announcement--icon {
			color: var(--black);
		}
	}

	.company-news__announcement--icon-pdf {
		border: 1px solid var(--green);
	}

	@media (max-width: 767px) {
		.company-news__announcement--txt {
			font-size: .875rem;
		}
	}
}

.company__h2 {
	padding-bottom: 8px;
	margin-bottom: 1.43em;
	/* (40 / 28)=1.43 */
	position: relative;

	&:before {
		content: '';
		display: block;
		position: absolute;
		left: 0;
		bottom: 0;
		width: 100%;
		height: 1px;
		background: var(--gray-100);
	}

	&:after {
		content: '';
		display: block;
		position: absolute;
		left: 0;
		bottom: 0;
		width: 40px;
		height: 1px;
		background: var(--green);
	}
}

.company__border--green {
	padding-bottom: 8px;
	margin-bottom: 1.43em;
	/* (40 / 28)=1.43 */
	position: relative;

	&:after {
		content: '';
		display: block;
		position: absolute;
		left: 0;
		bottom: 0;
		width: 100%;
		height: 1px;
		background: var(--green);
	}
}


.company__border--gray {
	padding-bottom: 8px;
	margin-bottom: 1.43em;
	/* (40 / 28)=1.43 */
	position: relative;

	&:after {
		content: '';
		display: block;
		position: absolute;
		left: 0;
		bottom: 0;
		width: 100%;
		height: 1px;
		background: var(--gray-100);
	}
}



.company__h2--single {
	padding-bottom: 8px;
	margin-bottom: 1.43em;
	/* (40 / 28)=1.43 */
	position: relative;

	&:after {
		content: '';
		display: block;
		position: absolute;
		left: 0;
		bottom: 0;
		width: 40px;
		height: 1px;
		background: var(--green);
	}
}

.company_text--green {
	color: var(--green);
}

.company_bg--green {
	background-color: var(--green);
}

.company_input_bg--gray {
	background-color: #F5F5F5;
}

.company_border--green {
	border: 1px solid var(--green);
}

.company_border-top--green {
	border-top: 1px solid var(--green);
}

.company_border-top--gray {
	border-top: 1px solid var(--gray-100);
}

/* company タブ切り替え
---------------------------*/
.company-news__tab {
	&.active {
		color: #fff;
		background: var(--green);
	}

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

.company-news__announcement {
	display: none;
}

.company-news__announcement.show {
	display: block;
}

/* company 共通レイアウト
---------------------------*/
.disclosure__box {
	&:not(:fcompanyst-child) {
		border-bottom: 1px solid var(--gray-100);
	}
}

/* company faq
---------------------------*/
.qa-box {
	margin-bottom: 16px;
	background-color: #f2f2f2;
	border-radius: 5px;
	font-size: .875rem;

	summary {
		display: flex;
		justify-content: space-between;
		align-items: center;
		position: relative;
		padding: 2em 3em 2em 5.5em;
		color: var(--black);
		background: #fff;
		border-radius: 4px;
		cursor: pointer;

		&::-webkit-details-marker {
			display: none;
		}

		&::before {
			content: '';
			display: block;
			position: absolute;
			top: 0;
			left: 32px;
			bottom: 0;
			margin: auto;
			width: 32px;
			height: 32px;
			background: url(../../images/icons/icon-q_green.webp) no-repeat center /contain;
			z-index: 10;
		}

		&::after {
			transform: translateY(-25%) rotate(45deg);
			width: 10px;
			height: 10px;
			margin-left: 10px;
			border-bottom: 2px solid var(--black);
			border-right: 2px solid var(--black);
			content: '';
			transition: transform .3s;
			position: absolute;
			right: 1em;
		}
	}

	p {
		transform: translateY(-10px);
		opacity: 0;
		margin: 0;
		padding: 2em 3em;
		color: var(--black);
		background: #fff;
		border-radius: 0 0 4px 4px;
		transition: transform .5s, opacity .5s;
	}

	&[open] {
		summary {
			color: #fff;
			background: var(--green);
			border-radius: 4px 4px 0 0;

			&::after {
				transform: rotate(225deg);
				border-color: #fff;
			}

			&::before {
				background: url(../../images/icons/icon-q_white.webp) no-repeat center /contain;
			}
		}

		p {
			transform: none;
			opacity: 1;
		}
	}

	@media (max-width: 767px) {
		summary {
			padding: 1em 3em 1em 3.5em;

			&::before {
				left: 16px;
				width: 24px;
				height: 24px;
			}
		}

		p {
			padding: 1em 2em;
		}
	}
}



.company-metalworking__photo {
	border: 1px solid var(--green);
	border-radius: 4px;
	padding: 4px;
	transition: .3s;
	display: inline-flex;
}






/* company factory table
---------------------------*/

.custom-table {
	width: 100%;
	border-collapse: collapse;
	border: 1px solid var(--gray-100);
}

.custom-thead {
	background-color: var(--green);
	color: white;
}

.custom-th,
.custom-td {
	border: 1px solid var(--gray-100);
	padding: 8px;
	text-align: left;
	font-weight: 400;
}

@media screen and (max-width: 540px ){
	.custom-th:nth-child(even),
    .custom-td:nth-child(even) {
		min-width: 58px;
	}
}

.custom-td {
	background-color: #ffffff;
}


.slider-for img {
	width: 100%;
	height: auto;
}

.slider-nav {
	margin-top: 10px;
}

.slider-nav .thumbnail {
	width: 100px;
	height: 100px;
	cursor: pointer;
	object-fit: cover;
}

.slider-nav .slick-slide {
	width: 100px !important;
	margin-left: 10px;
}

.page-template-page-company_yamada_factory-php .slider-nav .slick-slide {
	width: 60px !important;
}

/* 最初の要素の余白を0pxに設定 */
.slider-nav .slick-slide:first-child {
	margin-left: 0px !important;
}

.thumbnail-slide {
	width: 100px !important;
	margin-right: 10px;
}

.slick-current .thumbnail {
	border: 2px solid #000;
}

.slider-nav .slick-slide:last-child {
	margin-right: 0;
}

/* モバイル表示用の調整 (スマホ) */
@media (max-width: 767px) {
	.slider-nav .slick-slide {
		width: 60px !important;
		margin-left: 5px;
		/* マージンを小さく調整 */
	}

	.thumbnail-slide {
		width: 60px !important;
		/* サムネイルの幅を小さくする */
		margin-right: 5px;
	}

	.slider-nav {
		justify-content: flex-start;
		/* サムネイルを左揃えに */
	}
}

/* タブレット表示用の調整 */
@media (min-width: 768px) and (max-width: 1024px) {
	.slider-nav .slick-slide {
		width: 60px !important;
		margin-left: 8px;
		/* タブレット用に少し広げる */
	}

	.thumbnail-slide {
		width: 60px !important;
		/* サムネイルの幅をタブレット用に調整 */
		margin-right: 8px;
	}

	.slider-nav {
		justify-content: flex-start;
		/* タブレットでも左揃えに */
	}
}






/* 入力フィールドのスタイル */
.input-custom {
	width: 100%;
	padding: 15px;
	border-radius: 8px;
	background-color: #f5f5f5;
	border: 1px solid transparent;
	margin-top: 10px;
	font-size: 14px;
	box-sizing: border-box;
}

.input-custom:focus {
	outline: none;
	border-color: #045F38;
	/* 緑色のフォーカスボーダー */
}

/* ラベルのスタイル */
label {
	font-size: 16px;
	font-weight: 600;
	color: #4a5568;
	/* text-gray-700 相当 */
}

/* 必須のスタイル */
.bg-green-700 {
	background-color: #045F38;
}

.text-white {
	color: white;
}

/* 送信ボタンのスタイル */
.btn-submit {
	display: block;
	width: 100%;
	padding: 12px;
	background-color: #045F38;
	/* 緑色 */
	color: white;
	border: none;
	border-radius: 8px;
	font-size: 16px;
	font-weight: 600;
	cursor: pointer;
	transition: background-color 0.3s ease;
}

.btn-submit:hover {
	background-color: #045F38;
	/* ホバー時の色を濃く */
}

/* プライバシーポリシーリンク */
.text-green-700 {
	color: #045F38;
}

/* テキストエリアのスタイル */
.textarea-inquiry {
	margin-top: 10px;
	background-color: #f5f5f5;
	display: block;
	width: 100%;
	/* border: 1px solid #d1d5db; */
	border-radius: 0.375rem;
	padding: 16px;
	outline: none;
	transition: border-color 0.3s, box-shadow 0.3s;
}

/* セレクトフォーム */
.prefecture-select select {
	margin-top: 10px;
	background-color: #f5f5f5;
	/* 薄いグレー */
	display: block;
	width: 100%;
	border-radius: 0.375rem;
	/* 中くらいの角丸 */
	padding: 14px;
	/* パディング */
	outline: none;
	transition: border-color 0.3s, box-shadow 0.3s;
	/* フォーカス時のアニメーション */
}

.prefecture-select select:focus {
	border-color: #045F38;
	/* 緑色のボーダー */
}



.text-green-700:hover {
	color: #276749;
}

.wpcf7-response-output {
	/* display: none !important; */
	border: 0px solid #fff !important;
	font-size: 14px !important;
	text-align: center !important;
}

.wpcf7-spinner {
	display: none !important;
}

.wpcf7-not-valid {
	border: 1px solid #FF3A31 !important;
	background: #FFEAEA !important;
}

.wpcf7-checkbox {
	border: none !important;
	background: none !important;
}

.wpcf7-list-item {
	margin-left: 0px !important;
}

/* ラジオボタンリストのスタイル */
.wpcf7-list-item {
	display: block;
	margin-bottom: 8px;
	/* 各ラジオボタンの間に余白をつける */
}

.wpcf7-list-item-label {
	font-size: 14px;
	color: #1a202c;
	/* 濃いめのグレー */
}

/* ラジオボタン自体のスタイル */
.wpcf7-list-item input[type="radio"] {
	margin-right: 8px;
	/* ラジオボタンとテキストの間に余白をつける */
}


.group-link h2,
.group-link p {
	color: #090625 !important;
	transition: none !important;
}

.group-link:hover h2,
.group-link:hover p {
	color: #090625 !important;
}



.table-container {
	max-height: 400px;
	overflow-y: auto;
	position: relative;
}

table {
	width: 100%;
	border-collapse: collapse;
}

thead {
	position: sticky;
	/* 固定にする */
	top: 0;
	/* 上部に固定 */
	/* z-index: 1; */
}

th,
td {
	padding: 8px;
	text-align: left;
}

.table-wrapper {
	max-height: 240px;
	overflow-y: auto;
}

thead th {
	position: sticky;
	top: 0;
	/* z-index: 1; */
}

.custom-th,
.custom-td {
	padding: 8px;
}


.company-news__announcement {
	.top-metalworking__photo {
		width: 32px;
		height: 32px;
		display: flex;
		justify-content: center;
		align-items: center;
	}
}

@media (min-width: 768px) {
	.company-sec .top-pronity-btn__photo {
		padding: 11px 10.5px;
	}

	.company-sec .top-pronity-btn__wrap {
		width: calc(100% - 32px);
	}
}

.company-sec .top-pronity-btn::before {
	background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, .4) 100%);
}