/* ==========================================================================
   WordPress化に伴う最小限の補正（現行CSSの後に読み込み）
   現行デザインを変えないことが前提。ここに書くのは
   ・WordPressで新たに必要になった要素（パンくず・ページ送り・フォーム等）
   ・下層ページの暫定レイアウト（現行ソース受領後に見直し）
   のみ。
   ========================================================================== */

.sp-sr-only {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* 管理バー表示中（ログイン時のみ）に固定ヘッダーが重ならないように */
.admin-bar .header,
.admin-bar .hamburger_bar { top: 32px; }
@media (max-width: 782px) {
	.admin-bar .header,
	.admin-bar .hamburger_bar { top: 46px; }
}

/* ---- WordPress化で追加した要素だけの補正 ---- */

/* 本文中の表。現行は table.des に定義があるので、それに合わせる。
   （取り込み済みの本文が table-profile / map-embed の場合にも同じ見た目になるようにする） */
#main_contents table.table-profile {
	border-collapse: collapse;
	border-spacing: 0;
	margin: 10px auto 30px;
	width: 95%;
}
#main_contents table.table-profile th,
#main_contents table.table-profile td {
	border: 1px solid #d0d0d0;
	padding: 10px;
	text-align: left;
}
#main_contents table.table-profile th { background: #f6f6f6; }
@media screen and (max-width: 767px) {
	#main_contents table.table-profile th,
	#main_contents table.table-profile td { display: block; width: 100%; }
}
.map-embed { margin: 10px auto 5px; }
.map-embed iframe { width: 100%; max-width: 600px; aspect-ratio: 4 / 3; height: auto; border: 0; }
.frame_out.googlemap_set iframe { max-width: 100%; }

.sp-date { margin-bottom: 1em; }
.sp-back { margin-top: 48px; }
.sp-notice { padding: 10px 14px; background: #fff4e3; }

.sp-pagination .nav-links { display: flex; justify-content: center; gap: 8px; margin-top: 40px; }
.sp-pagination .page-numbers { display: inline-block; min-width: 40px; padding: 8px 12px; text-align: center; border: 1px solid #ddd; }
.sp-pagination .page-numbers.current { background: #333; color: #fff; border-color: #333; }

/* ---- お問い合わせフォーム（現行と同じ表形式） ---- */
.sp-form { width: 100%; border-collapse: collapse; }
.sp-form th,
.sp-form td { padding: 14px 16px; border: 1px solid #ddd; vertical-align: top; }
.sp-form th { width: 30%; background: #f5f5f5; font-weight: normal; }
.sp-form .req { color: #c00; font-size: 0.9em; margin-left: 0.3em; }
.sp-form input[type="text"],
.sp-form input[type="email"],
.sp-form input[type="tel"],
.sp-form textarea { width: 100%; padding: 6px 8px; border: 1px solid #bbb; }
.sp-form .wpcf7-list-item { margin-right: 1.2em; }
.sp-form-note { font-size: 0.9em; color: #666; }
.sp-form-privacy { margin: 24px 0; }
.sp-form-submit { text-align: center; }
.sp-form-submit input[type="submit"] { min-width: 200px; padding: 10px 24px; cursor: pointer; }
@media (max-width: 767px) {
	.sp-form th,
	.sp-form td { display: block; width: 100%; }
	.sp-form td { border-top: 0; }
}

/* ---- 製品一覧の絞り込み ---- */
.sp-filter {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 32px;
}
.sp-filter__button {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	min-height: 42px;
	padding: 8px 18px;
	border: 1px solid #ddd;
	border-radius: 999px;
	background: #fff;
	color: inherit;
	font: inherit;
	font-size: 14px;
	line-height: 1.3;
	cursor: pointer;
	transition: background-color 0.15s, color 0.15s, border-color 0.15s;
}
.sp-filter__button:hover { border-color: #999; }
.sp-filter__button.is-current { background: #333; border-color: #333; color: #fff; }
.sp-filter__button--child { font-size: 13px; padding-left: 14px; padding-right: 14px; }
.sp-filter__button--child::before { content: "└"; opacity: 0.5; }
.sp-filter__count { font-size: 12px; opacity: 0.65; }
.sp-filter__empty { margin: 24px 0; color: #666; }

/* ---- 製品カード ---- */
.sp-product__model {
	display: inline-block;
	font-size: 12px;
	letter-spacing: 0.04em;
	color: #666;
}
.sp-product__lead {
	display: block;
	margin-top: 6px;
	font-size: 13px;
	font-weight: normal;
	line-height: 1.7;
	color: #666;
}
.sp-product__model--detail { margin-bottom: 8px; font-size: 14px; }

/* ---- 仕様表 ---- */
.sp-specs { padding-top: 0; }
.sp-specs__title { margin-bottom: 16px; }
.sp-specs__table { width: 100%; border-collapse: collapse; margin-bottom: 32px; }
.sp-specs__table th,
.sp-specs__table td { padding: 12px 16px; border: 1px solid #ddd; text-align: left; vertical-align: top; }
.sp-specs__table th { width: 30%; background: #f5f5f5; font-weight: normal; white-space: nowrap; }
.sp-specs__actions { display: flex; flex-wrap: wrap; gap: 12px; }
.sp-specs__actions .button { margin: 0; }
@media (max-width: 599px) {
	.sp-specs__table th,
	.sp-specs__table td { display: block; width: 100%; }
	.sp-specs__table td { border-top: 0; }
}

/* ---- 下層ページの見出し ----
   現行は詳細ページの見出しが h2（36px）。SEO上は h1 が適切なので h1 に変えたうえで、
   現行と同じ大きさに揃えて見た目を変えないようにする。 */
h1.tboxt,
h1.module_title { font-size: 36px; }

/* 製品カテゴリ一覧の画像を枠内に収める */
.about_container .col-lg-2 img { width: 100%; height: auto; }

/* 関連製品・仕様の間隔 */
.sp-related .service p,
.works_grid .service p { margin-top: 8px; }
