@charset "UTF-8";
/* =========================================================
   suzukisangyo（スズキ産業）ブース専用スタイル
   2026-11-08 新規
   index.cgi はブース直下に koma_style.css があれば自動で読み込む。
   配布元の style.css は触らない（全ブースへの配布が必要になるため）。
   ---------------------------------------------------------
   製品ページの本文は、旧サイトから持ち込んだ
   <td width="500"> のような固定幅テーブル組みでできている。
   そのためスマホでは写真が画面幅を超え、表の中を横に送らないと
   全体が見えなかった。

   スマホ幅のときだけ、
     ・画像の入っているテーブルを「幅なり」にする
     ・そのセルを縦に積む
     ・中の画像を幅100%にする
   ことで、横スクロールなしで写真が左右いっぱいに出るようにする。

   `:has(img)` で画像入りのテーブルだけに絞ってあるので、
   品名・型式などの仕様表は従来どおり（横スクロール）のまま。
   PC・タブレットには一切影響しない（600px以下だけの指定）。
   ========================================================= */

@media screen and (max-width: 600px) {

	/* 画像が入っているテーブルは固定幅をやめる */
	.extra-info table:has(img) {
		width: auto !important;
		max-width: 100% !important;
	}

	/* セルを縦に積んで、1枚ずつ横幅いっぱいに使えるようにする */
	.extra-info table:has(img) td,
	.extra-info table:has(img) th {
		display: block !important;
		width: auto !important;
		height: auto !important;
	}

	/* 画像は左右100% */
	.extra-info table:has(img) img {
		width: 100% !important;
		max-width: 100% !important;
		height: auto !important;
	}
}
