/**
 * レスポンシブ用スタイル
 * ブレークポイントごとの上書き
 */

/* 769px以上：ロゴとメニューを1行で表示（改行なし） */
@media (min-width: 769px) {
	.site-header__inner {
		flex-wrap: nowrap;
	}

	.site-header__menu-list {
		flex-wrap: nowrap;
	}
}

/* 1024px以下：ヘッダー画像をグローバルメニューの下から表示・TOPICSはFV画像の下・キャッチコピーはFV中央下より */
@media (max-width: 1024px) {

	.front-page,
	.page-company,
	.page-business,
	.page-equipment,
	.page-blog,
	.page-contact,
	.page-privacy,
	main.single-post,
	.page-recruit {
		margin-top: 0;
	}

	/* TOPICSをファーストビュー画像の直下に表示（キャッチコピーと重ならないよう余白を確保） */
	.top-topics {
		margin-top: 0;
		padding-top: 64px;
	}

	/* キャッチコピー：FV画像の下より（top: 90%）に配置 */
	.fv__overlay::before {
		left: 50%;
		top: 90%;
		transform: translate(-50%, -50%);
		width: min(85%, 560px);
		height: min(70%, 380px);
		background: radial-gradient(29.6% 84.45% at 50% 50%,
				#ffffff 0%,
				rgba(255, 255, 255, 0.5) 100%);
	}

	.fv__copy {
		left: 50%;
		top: 90%;
		transform: translate(-50%, -50%);
		width: min(90%, 693px);
		max-width: 693px;
		height: auto;
		max-height: 70%;
		align-items: center;
		justify-content: center;
		text-align: center;
		padding: 24px 20px;
	}

	.fv__copy-line {
		margin: 16px auto;
	}

	/* 採用ページ：キャッチコピーをトップ同様に画像の下中央付近に配置 */
	.recruit-header__overlay::before {
		left: 50%;
		top: 90%;
		transform: translate(-50%, -50%);
		width: min(85%, 560px);
		height: min(50%, 280px);
	}

	.recruit-header__copy {
		left: 50%;
		top: 90%;
		transform: translate(-50%, -50%);
		max-width: 90%;
		text-align: center;
	}

	.recruit-header__copy-main {
		text-align: center;
	}

	.recruit-header__copy-sub {
		text-align: center;
	}

	.recruit-header__copy-line {
		margin-left: auto;
		margin-right: auto;
	}

	.site-header__logo img {
		width: 220px;
	}

	.site-header__menu-list {
		gap: 16px;
	}

	/* 事業内容詳細（プリント基板実装・電子機器組立・検査評価）：1024px以下で縦並び・横幅を収める */
	.business-detail__inner {
		max-width: 100%;
		padding-left: 0;
		padding-right: 0;
		box-sizing: border-box;
	}

	.business-detail__block {
		grid-template-columns: 1fr;
		gap: 32px 0;
		max-width: 100%;
		box-sizing: border-box;
	}

	.business-detail__content {
		min-width: 0;
		padding: 24px 16px;
	}

	.business-detail__image-wrap {
		min-width: 0;
	}

	.business-detail__image {
		max-width: 100%;
	}

	/* タグが2行目にいったときの行間を開ける */
	.business-detail__keywords {
		gap: 12px 8px;
	}

	/* 採用：働く環境セクションをテキストと画像で縦並びに（上下余白を詰める） */
	.recruit-environment {
		padding-top: 48px;
		padding-bottom: 48px;
	}

	.recruit-environment__lead {
		width: 100%;
	}

	.recruit-environment__content {
		min-height: 0;
		display: flex;
		flex-direction: column;
	}

	.recruit-environment__cards {
		width: 100%;
		order: 1;
		margin-bottom: 16px;
	}

	.recruit-environment__slider {
		position: relative;
		top: auto;
		right: auto;
		width: 100%;
		height: auto;
		aspect-ratio: 913 / 621;
		order: 2;
		clip-path: none;
		margin: 0;
	}

	.recruit-environment__track {
		height: 100%;
	}

	.recruit-environment__slide {
		flex: 0 0 100%;
		height: 100%;
		display: flex;
		justify-content: center;
		align-items: flex-start;
	}

	/* 2枚とも同じ比率の枠内で全体表示し、見えている高さを揃える */
	.recruit-environment__slide img {
		width: 100%;
		height: 100%;
		display: block;
		object-fit: contain;
		object-position: top center;
	}

	/* ドットは画像の下に配置 */
	.recruit-environment__dots {
		position: relative;
		top: auto;
		right: auto;
		width: 100%;
		order: 3;
		margin-top: 12px;
		margin-bottom: 0;
		padding-bottom: 0;
	}
}

/* 769px～1024px：ロゴ300px・メニューを隠れないようフォントと余白を調整 */
@media (min-width: 769px) and (max-width: 1024px) {
	.site-header__logo img {
		width: 300px;
		max-width: 300px;
	}

	.site-header__menu-list {
		gap: 8px;
	}

	.site-header__menu-list a {
		font-size: 14px;
		font-size: 0.875rem;
	}
}

/* 768px以下：ハンバーガーメニュー */
@media (max-width: 768px) {

	.site-header {
		min-height: 70px;
	}

	.site-header__inner {
		flex-direction: row;
		flex-wrap: wrap;
		align-items: center;
		justify-content: space-between;
		gap: 0;
		min-height: 70px;
	}

	.site-header__hamburger {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		gap: 6px;
		width: 44px;
		height: 44px;
		padding: 0;
		border: none;
		background: transparent;
		color: #ffffff;
		cursor: pointer;
		transition: opacity 0.2s ease;
	}

	.site-header__hamburger:hover,
	.site-header__hamburger:focus {
		opacity: 0.85;
	}

	.site-header__hamburger-bar {
		display: block;
		width: 24px;
		height: 3px;
		background-color: currentColor;
		border-radius: 2px;
		transition: transform 0.2s ease, opacity 0.2s ease;
	}

	.site-header__hamburger[aria-expanded="true"] .site-header__hamburger-bar:nth-child(1) {
		transform: translateY(9px) rotate(45deg);
	}

	.site-header__hamburger[aria-expanded="true"] .site-header__hamburger-bar:nth-child(2) {
		opacity: 0;
	}

	.site-header__hamburger[aria-expanded="true"] .site-header__hamburger-bar:nth-child(3) {
		transform: translateY(-9px) rotate(-45deg);
	}

	/* メニューは開いたときにヘッダー画像などの上に重ねて表示（かぶせてOK） */
	.site-header__nav {
		position: fixed;
		top: 70px;
		left: 0;
		right: 0;
		z-index: 99;
		width: 100%;
		display: none;
		padding: 16px 24px 24px;
		background: linear-gradient(180deg,
				rgba(74, 159, 212, 0.98) 0%,
				rgba(46, 139, 199, 0.98) 100%);
		box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
		border-top: 1px solid rgba(255, 255, 255, 0.25);
		box-sizing: border-box;
	}

	.site-header.is-menu-open .site-header__nav {
		display: block;
	}

	.site-header__menu-list {
		flex-direction: column;
		gap: 4px;
	}

	.site-header__menu-list a {
		display: block;
		padding: 12px 0;
		font-size: 18px;
		font-size: 1.125rem;
	}

	/* 768px以下：右端固定CTAを非表示（採用情報はこちら・エントリーする） */
	.fv__cta,
	.recruit-header__cta {
		display: none;
	}

	/* 採用ページ：スマホ時はヘッダー高さをスマホ用画像の高さに合わせる */
	.recruit-header {
		min-height: 0;
		height: auto;
	}

	.recruit-header__image-wrap {
		height: auto;
	}

	.recruit-header__image-wrap picture,
	.recruit-header__image-wrap .recruit-header__image {
		height: auto;
		object-fit: contain;
		object-position: center top;
	}

	/* 768px以下：トップ・採用以外のサブページヘッダー画像を250pxに（タイトル位置も調整） */
	.page-header,
	.page-header__image-wrap {
		min-height: 250px;
		height: 250px;
	}

	.page-header__overlay {
		padding: 12px 16px 12px 24px;
		margin-bottom: 16px;
		max-width: 100%;
	}

	.page-header__title-ja {
		font-size: 28px;
		font-size: 1.75rem;
	}

	.page-header__title-sep {
		font-size: 20px;
		font-size: 1.25rem;
	}

	.page-header__title-en {
		font-size: 16px;
		font-size: 1rem;
	}

	.fv {
		min-height: 400px;
	}

	.fv__overlay {
		padding-left: 16px;
		padding-right: 70px;
	}

	.top-topics {
		margin-top: 0;
		padding-top: 64px;
	}

	.top-topics__inner {
		max-width: none;
		padding: 20px 0;
	}

	.top-topics__title {
		font-size: 28px;
		font-size: 1.75rem;
	}

	.top-topics__item {
		display: block;
		gap: 0;
	}

	.top-topics__separator {
		display: none;
	}

	.top-topics__item time {
		display: block;
		margin-bottom: 4px;
		font-size: 14px;
		font-size: 0.875rem;
	}

	.top-topics__item a {
		font-size: 16px;
		font-size: 1rem;
	}

	.top-topics__link {
		font-size: 16px;
		font-size: 1rem;
	}

	/* お知らせ一覧：日付とタイトルを2行表示 */
	.blog-list__link {
		display: grid;
		grid-template-columns: 1fr auto;
		grid-template-rows: auto auto;
		align-items: center;
		column-gap: 12px;
		row-gap: 4px;
	}

	.blog-list__date {
		grid-column: 1;
		grid-row: 1;
		font-size: 14px;
		font-size: 0.875rem;
	}

	.blog-list__title {
		grid-column: 1;
		grid-row: 2;
		font-size: 16px;
		font-size: 1rem;
	}

	.blog-list__arrow {
		grid-column: 2;
		grid-row: 1 / 3;
		align-self: center;
	}

	.single-post__article {
		padding-left: 10px;
		padding-right: 10px;
	}

	.aboutus__inner {
		flex-direction: column;
		gap: 24px;
		padding: 1rem;
	}

	.aboutus__content {
		min-width: 0;
	}

	.aboutus__title {
		font-size: 28px;
		font-size: 1.75rem;
	}

	.aboutus__text {
		font-size: 15px;
		font-size: 0.9375rem;
		margin-bottom: 20px;
	}

	.aboutus__link {
		font-size: 16px;
		font-size: 1rem;
	}

	.aboutus__image-wrap {
		min-width: 0;
		order: -1;
	}

	.business {
		padding: 40px 16px 48px;
	}

	.section-title {
		font-size: 28px;
		font-size: 1.5rem;
		margin-bottom: 28px;
	}

	.business__list {
		gap: 20px;
		margin-bottom: 32px;
	}

	.business__item {
		flex: 1 1 100%;
		max-width: none;
	}

	.business__link {
		font-size: 16px;
		font-size: 1rem;
	}

	.youtube-section {
		padding: 40px 16px 48px;
	}

	.equipment__inner {
		flex-direction: column;
		padding-right: 0;
		padding: 1rem;
	}

	.equipment__image-wrap {
		order: -1;
		min-width: 0;
	}

	.equipment__content {
		padding-left: 16px;
		padding-right: 16px;
		min-width: 0;
	}

	.equipment__title {
		font-size: 24px;
		font-size: 1.5rem;
	}

	.equipment__headline {
		font-size: 18px;
		font-size: 1.125rem;
	}

	.equipment__text {
		font-size: 15px;
		font-size: 0.9375rem;
	}

	.equipment__link {
		font-size: 16px;
		font-size: 1rem;
	}

	.reason {
		padding: 40px 16px 48px;
	}

	.reason__list {
		gap: 20px;
	}

	.reason__item {
		flex: 1 1 100%;
		max-width: none;
	}

	.reason__card {
		padding: 24px 20px;
	}

	.reason__card-title {
		font-size: 18px;
		font-size: 1.125rem;
	}

	.reason__card-text {
		font-size: 13px;
		font-size: 0.8125rem;
	}

	.site-footer__upper {
		padding: 32px 16px 28px;
	}

	.site-footer__inner {
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 0;
	}

	.site-footer__brand {
		text-align: center;
	}

	.site-footer__logo {
		text-align: center;
	}

	.site-footer__logo img {
		display: block;
		width: 200px;
		max-width: 200px;
		margin: 0 auto;
	}

	.site-footer__address {
		text-align: center;
	}

	.site-footer__nav {
		display: none;
	}

	.site-footer__bottom {
		padding: 12px 16px;
	}

	.site-footer__copyright {
		font-size: 11px;
		font-size: 0.6875rem;
	}

	.company-profile {
		padding: 48px 20px 64px;
	}

	.company-profile__grid {
		grid-template-columns: 1fr;
		gap: 32px;
	}

	.company-profile__panel {
		padding: 32px 0;
	}

	.company-profile__grid .company-profile__panel--history:only-child {
		grid-column: 1;
	}

	/* 会社概要テーブル：768px以下は項目・内容を2行表示 */
	.company-profile__table-wrap table,
	.company-profile__table-wrap tbody,
	.company-profile__table-wrap tr {
		display: block;
	}

	.company-profile__table-wrap tbody tr {
		border-bottom: 1px solid #e5e9f0;
		padding: 12px 0;
	}

	.company-profile__table-wrap tbody tr:last-child {
		border-bottom: none;
	}

	.company-profile__table-wrap th,
	.company-profile__table-wrap td {
		display: block;
		width: 100%;
		padding: 4px 0 8px;
		text-align: left;
		border: none;
	}

	.company-profile__table-wrap th {
		padding-top: 0;
		padding-bottom: 4px;
		font-size: 14px;
		font-size: 0.875rem;
	}

	.company-profile__table-wrap td {
		padding-top: 0;
		padding-bottom: 0;
	}

	.company-profile__table-wrap tbody tr+tr th,
	.company-profile__table-wrap tbody tr+tr td {
		padding-top: 8px;
	}

	.company-links {
		padding: 48px 20px 64px;
	}

	.company-links__grid {
		grid-template-columns: 1fr;
	}

	.company-links__col {
		gap: 24px;
	}

	.company-links__header {
		padding: 16px 20px;
	}

	.company-links__title {
		font-size: 18px;
		font-size: 1.125rem;
	}

	.company-links__list {
		padding: 16px 20px 20px;
	}

	.business-flow__header {
		padding: 24px 20px 20px;
	}

	/* 一貫生産体制：スマホは縦並び・白カード・アイコン左テキスト右・オレンジ矢印 */
	.business-flow__title {
		text-align: center;
	}

	.business-flow__list {
		flex-direction: column;
		flex-wrap: wrap;
		padding: 24px 16px 28px;
		gap: 0;
		overflow: visible;
	}

	.business-flow__item {
		flex: none;
		width: 100%;
	}

	.business-flow__step--2,
	.business-flow__step--3,
	.business-flow__step--4,
	.business-flow__step--5 {
		margin-left: 0;
	}

	/* スマホ：五角形をやめて白い角丸カードに */
	.business-flow__step {
		flex-direction: row;
		align-items: center;
		justify-content: center;
		gap: 16px;
		min-width: 0;
		width: 100%;
		padding: 16px 20px 20px;
		clip-path: none;
		background: #ffffff;
		border-radius: 12px;
		box-shadow: 0 2px 16px rgba(15, 49, 147, 0.08);
	}

	/* アイコン左・テキスト右 */
	.business-flow__icon {
		flex-shrink: 0;
		width: 56px;
		height: 56px;
	}

	.business-flow__label {
		margin: 0;
		font-size: 16px;
		font-size: 1rem;
		font-weight: 700;
		color: #0f3193;
		line-height: 1.4;
		text-align: center;
	}

	/* 矢印を下向き・カード間の中央に・オレンジ（枠との隙間を多めに） */
	.business-flow__arrow {
		right: auto;
		left: 50%;
		top: auto;
		bottom: -28px;
		transform: translateX(-50%) rotate(90deg);
	}

	.business-flow__arrow svg {
		width: 24px;
		height: 24px;
	}

	.business-flow__arrow polyline {
		stroke: #ffbb5c;
	}

	/* カード間の余白（矢印＋枠との隙間分） */
	.business-flow__item+.business-flow__item {
		margin-top: 36px;
	}

	.business-detail {
		padding: 48px 20px 64px;
	}

	.business-detail__block {
		grid-template-columns: 1fr;
		gap: 24px;
		padding-bottom: 48px;
	}

	.business-strengths {
		padding: 48px 20px 64px;
	}

	.business-strengths__title {
		font-size: 24px;
		font-size: 1.5rem;
		margin-bottom: 32px;
	}

	.business-strengths__list {
		grid-template-columns: 1fr;
		gap: 24px;
	}

	/* 採用：ご応募セクション（recruit-waiting）を768px以下で縦並びに */
	.recruit-waiting__inner {
		flex-direction: column;
		gap: 24px;
	}

	.recruit-waiting__img-wrap {
		flex: none;
		max-width: 100%;
		width: 100%;
	}

	.recruit-waiting__body {
		margin-left: 0;
	}

	.recruit-contents__inner {
		padding-top: 70px;
	}

	/* 募集内容テーブル：768px以下は項目・内容を2行表示 */
	.recruit-contents__table-wrap table,
	.recruit-contents__table-wrap tbody,
	.recruit-contents__table-wrap tr {
		display: block;
	}

	.recruit-contents__table-wrap tbody tr {
		border-bottom: 1px solid #e5e9f0;
		padding: 12px 0;
	}

	.recruit-contents__table-wrap tbody tr:last-child {
		border-bottom: none;
	}

	.recruit-contents__table-wrap tbody td {
		display: block;
		width: 100%;
		padding: 4px 0 8px;
		border: none;
	}

	.recruit-contents__table-wrap tbody td:first-child {
		padding-top: 0;
		padding-bottom: 4px;
		padding-right: 0;
		font-size: 14px;
		font-size: 0.875rem;
		white-space: normal;
	}

	.recruit-contents__table-wrap tbody td:last-child {
		padding-top: 0;
		padding-bottom: 0;
	}

	.recruit-contents__table-wrap tbody tr + tr td {
		padding-top: 8px;
	}

	.company-access {
		padding: 48px 20px 64px;
	}

	.company-access__title {
		margin-bottom: 24px;
	}

	.company-access__visual {
		grid-template-columns: 1fr;
		gap: 24px;
		margin-bottom: 32px;
	}

	.company-access__info {
		grid-template-columns: 1fr;
		gap: 24px;
	}

	.company-access__directions {
		text-align: left;
	}

	/* 沿革：レスポンシブで年月と内容を2行表示 */
	.company-history__item {
		display: flex;
		flex-direction: column;
		gap: 4px;
	}

	.company-history__date {
		display: block;
		margin-right: 0;
	}

	.company-history__event {
		display: block;
	}

	/* 保有設備：ラインブロック */
	.equipment-nav {
		margin-bottom: 40px;
	}

	.equipment-nav__link {
		padding: 12px 8px;
		font-size: 13px;
		font-size: 0.8125rem;
	}

	.equipment-line__overview {
		flex-direction: column;
		gap: 16px;
		margin-bottom: 24px;
	}

	.equipment-line__overview-image-wrap {
		flex: none;
		width: 100%;
	}

	/* ライン3：モデル名とタグを2行に（横幅をはみ出さない） */
	.equipment-line__list--inline .equipment-line__list-item {
		flex-wrap: wrap;
	}

	.equipment-line__list--inline .equipment-line__model--inline {
		flex: 0 0 100%;
		width: 100%;
		min-width: 0;
		text-align: left;
	}

	/* ライン3：タグを1行にまとめて改行させない（ラッパーで制御） */
	.equipment-line__list--inline .equipment-line__inline-tags {
		flex-wrap: nowrap;
		width: 100%;
		min-width: 0;
	}

	.equipment-line__list--inline .equipment-line__inline-tags .content-tag {
		flex-shrink: 0;
		white-space: nowrap;
	}

	.equipment-line__list {
		flex-direction: column;
		gap: 20px;
	}

	.equipment-line__item {
		min-width: 0;
	}
}