/* ---- 基礎排版 ---- */
body, html
{
	height: 100%;
}
.w3-bar .w3-button
{
	padding: 16px;
}
h1 { font-size: 20px; }
h2 { font-size: 18px; }
h3 { font-size: 16px; }
h4 { font-size: 14px; }
h5 { font-size: 12px; }
h6 { font-size: 10px; }

@media (max-width: 480px) {
	h1 { font-size: 20px; }
	h2 { font-size: 18px; }
	h3 { font-size: 16px; }
	h4 { font-size: 14px; }
	h5 { font-size: 12px; }
	h6 { font-size: 10px; }
}

/* ---- 橫向捲動選單 (scrollmenu) ---- */
div.scrollmenu
{
	background-color: #333;
	overflow: auto;
	white-space: nowrap;
	scrollbar-width: none;
}
div.scrollmenu a
{
	display: inline-block;
	color: white;
	text-align: center;
	padding: 10px;
	text-decoration: none;
}
div.scrollmenu a:hover
{
	background-color: #777;
}
div.scrollmenu {
	background-color: #00773e; font-size: 16px;
}

/* ---- 回到頂端按鈕 ---- */
#goTopBtn
{
	display: none;
	position: fixed;
	bottom: 50vh;
	left: 21px;
	z-index: 25; /* 高於內容/頁首(20)、低於手機選單(30)、全螢幕影像(32)與所有 modal/lightbox */
	border: none;
	background: none;
	cursor: pointer;
	outline: none;
	padding: 0;
}
#goTopBtn img
{
	width: 42px;
	height: 42px;
	border-radius: 50%;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.18);
	transition: box-shadow 0.2s;
	background: white;
}
#goTopBtn:hover img
{
	box-shadow: 0 6px 16px rgba(0, 0, 0, 0.25);
}

/* ---- 資訊／條款頁面 (關於本站、免責聲明、隱私權政策) ---- */
.info-page
{
	max-width: 820px;
	margin: 0 auto;
	padding: 36px 32px 44px;
	background: #ffffff;
	border: 1px solid #e8e8e8;
	border-radius: 12px;
	box-shadow: 0 8px 28px rgba(0, 0, 0, 0.07);
	color: #333;
}
.info-page .info-title
{
	text-align: center;
	margin: 0;
	color: #1f2d1f;
}
.info-page .info-title::after
{
	content: "";
	display: block;
	width: 56px;
	height: 4px;
	margin: 14px auto 0;
	background: #98bf11;
	border-radius: 2px;
}
.info-page .info-date
{
	text-align: center;
	font-size: 14px;
	color: #999;
	margin: 16px 0 4px;
}
.info-page h2
{
	margin: 30px 0 10px;
	padding-left: 12px;
	border-left: 4px solid #00773e;
	color: #00773e;
	line-height: 1.5;
}
.info-page p
{
	margin: 10px 0;
	text-align: justify;
}
.info-page ul
{
	padding-left: 22px;
}
.info-page li
{
	margin: 6px 0;
}
.info-page li::marker
{
	color: #00773e;
}
.info-page a
{
	color: #00773e;
	text-decoration: none;
}
.info-page a:hover
{
	text-decoration: underline;
}
@media (max-width: 600px)
{
	.info-page
	{
		padding: 24px 18px 32px;
		border-radius: 8px;
	}
}

/* ---- 首頁 (即時影像連結網格) ---- */
.home-page .w3-row
{
	background: #ffffff;
	border: 1px solid #e8e8e8;
	border-radius: 12px;
	box-shadow: 0 6px 20px rgba(0, 0, 0, 0.06);
	padding: 18px 20px 22px;
	margin-bottom: 24px;
}
.home-page .w3-padding
{
	padding: 0 !important;
}
.home-page h2
{
	margin: 0 0 16px;
	padding-left: 12px;
	border-left: 4px solid #00773e;
	color: #00773e;
	text-align: left;
}
/* 圖示按鈕 (國道、快速公路) */
.home-page .w3-button
{
	border-radius: 10px;
	padding: 10px !important;
	margin: 6px !important;
	vertical-align: top;
	transition: background 0.15s, transform 0.15s, box-shadow 0.15s;
}
.home-page .w3-button:hover
{
	background: #f2f7e3 !important;
	transform: translateY(-3px);
	box-shadow: 0 6px 14px rgba(0, 0, 0, 0.12);
}
.home-page .w3-button img
{
	border-radius: 8px;
}
.home-page .w3-button p
{
	margin: 6px 0 0;
	font-size: 14px;
	font-weight: bold;
	color: #333;
}
/* 文字按鈕 (服務區、塞車、省道) */
.home-page .w3-btn
{
	transition: transform 0.15s, box-shadow 0.15s;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12);
}
.home-page .w3-btn:hover
{
	transform: translateY(-2px);
	box-shadow: 0 5px 12px rgba(0, 0, 0, 0.18);
}

/* ---- 內容頁區塊標題綠直桿（通用：wrapper 加上 .std-page 即套用全站標準） ---- */
.std-page h2
{
	padding-left: 12px;
	border-left: 4px solid #00773e;
	color: #00773e;
	line-height: 1.5;
}