/* 2026-11 news 模組手機版（列表 + 內文頁）
   全站原本沒有 <meta name="viewport">、版面寬度寫死(#pagebody 1200px、內文表格/圖片 960px)，
   手機上只能整頁縮小看。只有 layout/header.php 在 news 模組時才載入這份檔案、加 viewport，
   規則全部限定 body.mod-news 並包在 max-width:767px 裡，桌機版畫面不變。
   做法跟 register_new_mobile.css 一樣：所有元素最多跟父層一樣寬 + 主要容器改流動寬度 + 側欄隱藏 */
@media (max-width:767px){
	html, body.mod-news{ min-width:0 !important; overflow-x:hidden; }
	.mod-news #wrapper *{ max-width:100%; box-sizing:border-box; }
	.mod-news #wrapper img{ height:auto !important; }

	/* 主要容器：寫死的 px 寬度改成跟著螢幕 */
	.mod-news #wrapper,
	.mod-news #pagebody.container,
	.mod-news #footer.container,
	.mod-news #box_center{
		width:auto !important;
		min-width:0 !important;
		float:none !important;
		display:block;
	}
	.mod-news #pagebody.container{ padding-left:10px !important; padding-right:10px !important; margin-left:0; margin-right:0; }
	.mod-news #footer.container{ margin-left:10px !important; margin-right:10px !important; }
	.mod-news #box_center{ padding:14px !important; }
	.mod-news aside{ display:none; }

	.mod-news #my_title h3{ font-size:20px; line-height:1.4; }

	/* 內文(後台編輯器內容)：表格塞不下時讓內文區左右捲動，不撐破版面 */
	.mod-news .edtor{ overflow-x:auto; -webkit-overflow-scrolling:touch; margin:0 !important; padding:0 !important; }
	.mod-news .edtor table{ width:100% !important; height:auto !important; }
	.mod-news .edtor td, .mod-news .edtor th{ width:auto !important; height:auto !important; }
	.mod-news .edtor [style*="justify"]{ text-align:left !important; }
	.mod-news .edtor iframe, .mod-news .edtor video{ max-width:100%; }
	/* 從 Word 貼上的「圖片 + 說明」表格：img 帶 width="1539" 這類原始尺寸，自動排版的表格會被圖片撐到
	   兩三千 px（max-width:100% 在 auto 表格裡擋不住）。有圖片的表格在手機上改成每格上下堆疊、佔滿寬度 */
	.mod-news .edtor table:has(img), .mod-news .edtor table:has(img) tbody,
	.mod-news .edtor table:has(img) tr, .mod-news .edtor table:has(img) td,
	.mod-news .edtor table:has(img) th{ display:block; width:100% !important; }
	.mod-news .edtor table:has(img) td + td{ border-top:none !important; }

	/* 導覽列：選項塞不下，藥丸裡改成可以左右滑動，LOGO 縮小 */
	.mod-news header .container{ padding:6px 10px !important; }
	.mod-news header h3{ margin-right:8px !important; }
	.mod-news header h3 img{ height:34px; }
	.mod-news header nav{ overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:none; }
	.mod-news header nav::-webkit-scrollbar{ display:none; }
}