﻿.news_class_bt {
    font-size: 36px;
    color: #543f6e;
    line-height: 1.4;
    border-bottom: 2px solid #543f6e;
    text-align: center;
    padding-bottom: 10px;
    margin-bottom: 20px;
}


.news_class_list_box {
    overflow: hidden;
    padding-bottom: 20px;
}


.news_class_list_box .list_box {
    width: 33.33%;
    float: left;
    margin-bottom: 50px;
    padding: 0 5px;
}

.news_class_list_box .news_class_list {
    position: relative;
}

.news_class_list_box .news_class_list .img_box {
    position: relative;
}

.news_class_list_box .news_class_list .img_box .date{
    position: absolute;
    bottom: 0;
    z-index: 2;
    padding: 10px 16px;
    background: rgba(0, 0, 0, 0.45);
    color: #fff;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    width: 100%;
    text-align: right;
}


.news_class_list_box .news_class_list .class_describe {
    padding-top: 0px;
    border-bottom: 4px solid #f3f3f3;
    padding-bottom: 5px;
}

.news_class_list_box .news_class_list .class_describe a {
    display: block;
}


.news_class_list_box .news_class_list .class_describe h5 {
    min-height: 21px;
    font-size: 18px;
    color: #525252;
    line-height: 1.8;
    margin-bottom: 6px;
    overflow: hidden;
    text-align: center;
    font-weight: 700;
    background: #e5e5e5;
}

.news_class_box {
    padding: 40px 0;
}


@media (max-width: 992px) {
    .news_class_bt, .news_class_contant, .news_bt, .news_content_title {
        margin-top: 20px;
    }
}
@media (max-width: 640px) {
    
.news_class_list_box .list_box {
        width: 50%;
    }
}


@media (max-width: 480px) {
    .news_class_list_box .list_box {
        width: 100%;
    }
}

/* .class_box .submenu_wrap 那段 sidebar style 已砍
 * news / exhibition view 直接用 .product_box container class,
 * 吃 reset-1.css L963-1055 的 .product_box .submenu_wrap 全套 + style-1.211.css L787-802 箭頭 */

.video_info ul li {
    width: 100% !important;
}
/* ============================================================
 * 浮動 Leave a Message form (footer_fixed_form) bottom 補償
 * 老站原生 bottom:-357px 是配合原 form 含圖形驗證碼 (imgVerifyCode) 的高度算的;
 * matila 改用 reCAPTCHA v3 砍了 captcha div (~65px 高含 margin),form 變短,bottom 要往上補
 * 讓收合狀態剛好露 66px 的 form_fixed_button
 * ============================================================ */
.footer_fixed_form { bottom: -310px; }

/* ============================================================
 * Header nav Products 分類 dropdown (matila brand,獨立樣式,非語系選單樣式)
 * 桌機 hover 展開;手機 static 排列在 products 底下
 * ============================================================ */
.nav_list .dropdown.has_sub { position: relative; }

.nav_list .dropdown.has_sub > .nav_sub_menu {
	position: absolute;
	top: 100%;
	left: 50%;
	transform: translateX(-50%) translateY(-8px);
	min-width: 240px;
	background: #fff;
	border-top: 3px solid #543f6e;
	box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12);
	padding: 8px 0;
	margin: 0;
	list-style: none;
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.2s ease, transform 0.2s ease;
	z-index: 100;
}

.nav_list .dropdown.has_sub:hover > .nav_sub_menu {
	opacity: 1;
	transform: translateX(-50%) translateY(0);
	pointer-events: auto;
}

.nav_list .dropdown.has_sub > .nav_sub_menu li { display: block; margin: 0; padding: 0; text-align: left; }

.nav_list .dropdown.has_sub > .nav_sub_menu li a {
	display: block;
	padding: 10px 24px;
	color: #333;
	font-size: 14px;
	line-height: 1.5;
	white-space: nowrap;
	transition: background 0.15s, color 0.15s;
}

.nav_list .dropdown.has_sub > .nav_sub_menu li a:hover {
	background: #f5f0fa;
	color: #543f6e;
}

/* 手機版:直接展開 sub li,不 hover */
.m_nav_list .dropdown.has_sub > .nav_sub_menu {
	display: block;
	list-style: none;
	padding: 0;
	margin: 0;
	background: #f9f9f9;
}

.m_nav_list .dropdown.has_sub > .nav_sub_menu li a {
	display: block;
	padding: 10px 32px;
	color: #666;
	font-size: 14px;
	border-top: 1px solid #eee;
}

/* ============================================================
 * Products detail 手機版 tab 恢復
 * 老站 style-1.211.css:1166 mobile 藏 .tab_sub 但 JS 切換邏輯仍在跑
 * → 手機只看得到 default tab (規格),選配 / 影片訪問不到
 * override 恢復 tab bar + 切換行為 (matila 紫色 accent)
 * ============================================================ */
@media (max-width: 992px) {
	.product_tab .tab_sub {
		display: block !important;
		margin-bottom: 12px;
	}
	.product_tab .tab_sub ul {
		display: flex;
		margin: 0;
		padding: 0;
		list-style: none;
		background: #f5f5f5;
		border-bottom: 2px solid #543f6e;
	}
	.product_tab .tab_sub li.tab_click {
		flex: 1;
		padding: 12px 8px;
		text-align: center;
		cursor: pointer;
		color: #666;
		font-size: 14px;
		line-height: 1.4;
		background: #f5f5f5;
		border-right: 1px solid #ddd;
		transition: background 0.15s, color 0.15s;
	}
	.product_tab .tab_sub li.tab_click:last-child { border-right: none; }
	.product_tab .tab_sub li.tab_click.on {
		background: #543f6e;
		color: #fff;
	}
	.product_tab .tab_switch .switch {
		display: none;
	}
	.product_tab .tab_switch .switch.on {
		display: block;
	}
}

/* ============================================================
 * SEO heading semantic override
 * 全站原 heading tag (h2/h3/h5) 改為 semantic class,只保留頁面主 h1
 * 樣式 mirror 原 tag selector,不動 reset-1.css / style-1.211.css 老站 blob
 * 未來要 revert 只砍以下 block
 * ============================================================ */

/* products_detail 型號 (原 h2, mirror .parameter_box h2 style-1.211.css:803) */
.parameter_box .products_model_tag {
	display: block;
	font-size: 36px;
	color: #543f6e;
	font-weight: bold;
	line-height: 1.4;
	margin-bottom: 5px;
}

/* exhibition_list 展會標題 (原 h3, mirror .new_info .line .info h3 style-1.211.css:724) */
.new_info .line .info .line_title {
	margin-bottom: 7px;
}
.new_info .line .info .line_title a {
	font-size: 24px;
	color: #363536;
	font-weight: bold;
	line-height: 1.1;
}

/* news_list card 標題 (原 h5, mirror polaris.css:58) */
.news_class_list_box .news_class_list .class_describe .news_card_title {
	display: block;
	min-height: 21px;
	font-size: 18px;
	color: #525252;
	line-height: 1.8;
	margin-bottom: 6px;
	overflow: hidden;
}

/* Sidebar 標題 (原 .submenu_wrap h2 mirror reset-1.css:967 / 2083 / 2339 / 2483) */
.product_box .submenu_wrap .submenu_title,
.news_box .submenu_wrap .submenu_title,
.download_box .submenu_wrap .submenu_title,
.faq_box .submenu_wrap .submenu_title {
	display: block;
	font-size: 24px;
	color: #fff;
	line-height: 65px;
	background: #543f6e;
	text-align: center;
	padding: 0 10px;
	position: relative;
	font-weight: normal;
	margin: 0;
}
.product_box .submenu_wrap .submenu_title span,
.news_box .submenu_wrap .submenu_title span,
.download_box .submenu_wrap .submenu_title span,
.faq_box .submenu_wrap .submenu_title span {
	position: absolute;
	width: 20px;
	height: 20px;
	right: 10px;
	top: 50%;
	margin-top: -10px;
	background: url("image/pro_click.png") no-repeat top center;
	display: none;
}
@media (max-width: 992px) {
	.product_box .submenu_wrap .submenu_title,
	.news_box .submenu_wrap .submenu_title,
	.download_box .submenu_wrap .submenu_title,
	.faq_box .submenu_wrap .submenu_title {
		height: 50px;
		line-height: 50px;
		text-align: left;
		font-weight: normal;
		padding-left: 20px;
		position: relative;
	}
	.product_box .submenu_wrap .submenu_title span,
	.news_box .submenu_wrap .submenu_title span,
	.download_box .submenu_wrap .submenu_title span,
	.faq_box .submenu_wrap .submenu_title span {
		display: block;
	}
	.product_box .submenu_wrap ul,
	.news_box .submenu_wrap ul,
	.download_box .submenu_wrap ul,
	.faq_box .submenu_wrap ul {
		display: none;
	}
}

/* 產品卡片標題 (原 h5, mirror reset-1.css:1164) */
.products_list_box .product_list .products_describe .product_card_title {
	display: block;
	height: 21px;
	font-size: 15px;
	color: #525252;
	line-height: 1.4;
	margin-bottom: 6px;
	overflow: hidden;
	text-align: center;
}
.products_list_box .product_list .products_describe .product_card_title:hover {
	color: #9979c1;
}

/* exhibition_list booth 資訊行 (原 h4, mirror .new_info .line .info h4 style-1.211.css:733) */
.new_info .line .info .line_booth {
	font-size: 18px;
	color: #543f6e;
	font-weight: bold;
	line-height: 1.4;
	margin-bottom: 7px;
}

/* 首頁 section 標題 (原 h3, mirror .index_box2 h3 / .index_box4 h3 style-1.211.css:411/508) */
.index_box2 .index_section_title,
.index_box4 .index_section_title {
	font-size: 48px;
	color: #525252;
	text-align: center;
	line-height: 1.2;
	margin-bottom: 30px;
	font-weight: normal;
}
.index_box4 .index_section_title {
	line-height: 1.4em;
	margin-bottom: 40px;
}
@media (max-width: 992px) {
	.index_box2 .index_section_title,
	.index_box4 .index_section_title {
		font-size: 30px;
	}
}

/* sitemap 頁 section 標題 (原 h2,無老站對照,自訂樣式 mirror 一般 h2 感) */
.site_map_box .sitemap_section_title {
	font-size: 24px;
	color: #543f6e;
	font-weight: bold;
	line-height: 1.4;
	margin: 24px 0 12px;
}

/* ============================================================
 * CMS content 內文 heading semantic override
 * DB 內 <h1-6> 全 REGEXP_REPLACE 成 <div class="hX_class">
 * 通用 hX_class = browser h1-h6 default;wrapper-specific override 對齊老站 CSS
 * ============================================================ */

/* Generic (browser h1-h6 default,某 wrapper 無 specific 時走這) */
.h1_class { display: block; font-size: 2em;    font-weight: bold; margin: 0.67em 0; }
.h2_class { display: block; font-size: 1.5em;  font-weight: bold; margin: 0.83em 0; }
.h3_class { display: block; font-size: 1.17em; font-weight: bold; margin: 1em 0; }
.h4_class { display: block; font-size: 1em;    font-weight: bold; margin: 1.33em 0; }
.h5_class { display: block; font-size: 0.83em; font-weight: bold; margin: 1.67em 0; }
.h6_class { display: block; font-size: 0.67em; font-weight: bold; margin: 2.33em 0; }

/* home.php Our Service (index_box3, mirror style-1.211.css:459 .index_box3 h3) */
.index_box3 .h3_class {
	font-size: 48px;
	color: #fff;
	text-align: center;
	margin-bottom: 40px;
	margin-top: 0;
	font-weight: normal;
}

/* home.php 4 卡片標題 (index_box3, mirror style-1.211.css:481 .index_box3 .line .info h4) */
.index_box3 .line .info .h4_class {
	font-size: 24px;
	color: #fff;
	font-weight: bold;
	line-height: 1;
	margin-top: 0;
	margin-bottom: 20px;
}

/* Mobile 首頁 hX 縮小 (mirror style-1.211.css:1086-1090) */
@media (max-width: 992px) {
	.index_box3 .h3_class { font-size: 30px; }
}

/* ============================================================
 * Contact form select2 wrapper 對齊老站 native select 樣式
 * 老站 .contact_info .form .input select = 42px / rounded 10px / border #ccc
 * select2 default 樣式沒對齊,補 override
 * ============================================================ */
.contact_info .form .input .select2-container {
	width: 100% !important;
}
.contact_info .form .input .select2-container--default .select2-selection--single {
	height: 42px;
	width: 100%;
	border: 1px solid #ccc;
	border-radius: 10px;
	padding: 0 12px;
	font-size: 16px;
	background: transparent;
	outline: none;
}
.contact_info .form .input .select2-container--default .select2-selection--single .select2-selection__rendered {
	line-height: 42px;
	padding: 0;
	color: #7d7373;
	font-size: 16px;
	font-weight: 500;
}
.contact_info .form .input .select2-container--default .select2-selection--single .select2-selection__arrow {
	height: 42px;
	top: 0;
	right: 6px;
}
.contact_info .form .input .select2-container--default.select2-container--focus .select2-selection--single {
	border-color: #999;
}

/* Footer 各 col 標題 (原 h2 × 3, mirror .fast_navigation h2 style-1.211.css:286) */
.fast_navigation .footer_col_title {
	font-size: 30px;
	color: #fff;
	letter-spacing: 0;
	line-height: 1.8em;
	padding-bottom: 20px;
	font-weight: normal;
	margin: 0;
}

