/*  
365建站器让建站和seo变得简单！
siteurl：http://soft.365jz.com
*/

/* 98a.com 風格配色方案 */
:root {
    --primary-color: #1a365d;          /* 深藍色主色調 */
    --primary-dark: #0f2027;           /* 更深藍色 */
    --primary-light: #2d3748;          /* 中等藍色 */
    --accent-color: #f6ad55;           /* 金色強調色 */
    --accent-hover: #ed8936;           /* 橙色懸停色 */
    --accent-light: #fbd38d;           /* 淺金色 */
    --text-primary: #ffffff;           /* 主要文字白色 */
    --text-secondary: #e2e8f0;         /* 次要文字淺灰 */
    --text-muted: #a0aec0;             /* 靜音文字灰色 */
    --background-primary: #0f2027;     /* 主背景深藍黑 */
    --background-secondary: #1a365d;   /* 次背景深藍 */
    --background-tertiary: #2d3748;    /* 第三背景藍灰 */
    --border-color: #4a5568;           /* 邊框顏色 */
    --shadow-color: rgba(15, 32, 39, 0.3); /* 陰影顏色 */
    --gradient-primary: linear-gradient(135deg, #1a365d 0%, #0f2027 100%);
    --gradient-accent: linear-gradient(135deg, #f6ad55 0%, #ed8936 100%);
    --gradient-button: linear-gradient(135deg, #3182ce 0%, #1a365d 100%);
}

body { 
    padding:0; 
    margin:0;
    overflow-x:hidden; 
    font-family:"微软雅黑", "宋体", "Trebuchet MS", Tahoma, Arial, sans-serif; 
    color: var(--text-primary); 
    font-size: 12px; 
    line-height: 20px; 
    background: var(--gradient-primary);
}
* { padding:0; margin:0;}
div, h1, h2, h3, h4, p, form, ul, label, input, textarea, img, span, dl, dt, dd { margin:0; padding:0;}
table {border-collapse:collapse;}
a { text-decoration: none; color: var(--text-secondary);}
a:hover {text-decoration: none; color: var(--accent-color);}
ul { padding:0; margin:0;}
li { list-style-type: none;}
img { border: none;}
.clear { clear: both;}
.clear::after {
    content: "";
    display: block;
    clear: both;
}
.font14{font-size:14px;}
.padding-tb30{padding:30px 0;}
/*  
header
*/
.zca371header{
	height:80px;
    background: var(--gradient-primary);
    box-shadow: 0 4px 20px var(--shadow-color);
}
.zca371main {
    position: relative;
    width: 100%;
    height: 100%;
}
.zca371header .logo {
    position: absolute;
    left: 20px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 1001;
}
.zca371header .logo h1{
    font-size:28px;
    line-height: 80px;
    margin: 0;
    color: var(--accent-color);
}
.zca371header .logo img{
    max-height:60px;
    padding:0;
    vertical-align: middle;
}
.zca371navmenu {
    position: absolute;
    left: 200px;
    top: 50%;
    transform: translateY(-50%);
}
.zca371navmenu .zca371nav{
    background-color: transparent;
}
.zca371navmenu ul li:hover {color: var(--accent-color);}
.zca371navmenu .zca371nav-item a,.zca371navmenu .zca371nav-itemed>a{
    color: var(--text-secondary)!important;
    line-height: 80px;
    padding: 0 20px;
    display: block;
    transition: all 0.3s ease;
}
.zca371navmenu .zca371nav-itemed>.zca371nav-child {background-color: var(--background-tertiary)!important;}
.zca371navmenu .zca371nav .zca371nav-child a:hover{background: rgba(246, 173, 85, 0.1); color: var(--accent-color);}
/* ========================================
   登入註冊按鈕樣式 - 統一電腦端和手機端
   ========================================
   設計原則：
   1. 登入按鈕：透明背景 + 藍色邊框 + 藍色文字
   2. 註冊按鈕：藍色漸變背景 + 白色文字
   3. 懸停效果：上移 + 陰影 + 顏色變化
   4. 圓角設計：25px 圓角，現代化外觀
   5. 響應式：在不同螢幕尺寸下保持視覺一致性
   ======================================== */
.auth-buttons {
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    gap: 15px;
    z-index: 1001;
}

.btn-login {
    background: transparent;
    color: var(--accent-color);
    padding: 8px 16px;
    border-radius: 25px;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    border: 2px solid var(--accent-color);
    transition: all 0.3s ease;
}

.btn-login:hover {
    background: var(--accent-color);
    color: var(--text-primary);
    transform: translateY(-2px);
    box-shadow: 0 4px 15px rgba(246, 173, 85, 0.3);
}

.btn-register {
    background: var(--gradient-button);
    color: var(--text-primary);
    padding: 8px 16px;
    border-radius: 25px;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    border: 2px solid var(--accent-color);
    transition: all 0.3s ease;
}

.btn-register:hover {
    background: linear-gradient(135deg, #0056b3 0%, #004085 100%);
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(0, 123, 255, 0.4);
}

/*  
banner
*/
    .swiper-container {
      width: 100%;
    }
	.swiper-container img{max-width:100%;}
    .swiper-slide {
      text-align: center;
      font-size: 18px;
      background: #fff;
      display: -webkit-box;
      display: -ms-flexbox;
      display: -webkit-flex;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      -webkit-justify-content: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
    }
	.swiper-text{position: absolute;left:0;top:0;z-index:2;text-align:center;color:#FFF;width:100%;HEIGHT: 100%;display: flex;flex-direction: column;justify-content: center;}
	.swiper-text .banner-text-wrap {
         width: 100%;height: 100%;
    }
	.swiper-text .top-banner-text {
    	max-width: 1180px;
    	height: 100%;
    	margin: 0 auto;
    	overflow: hidden;
    	display: flex;
    	flex-direction: column;
    	justify-content: center;
	    padding-left: 20px;
		
	}
	
	.swiper-text .banner1 {
    background: transparent url(../images/banner1.png) no-repeat right 55%/64% auto;
}
	.swiper-text .banner2 {
   	    background: transparent url(../images/top_banner_con.png) no-repeat right bottom/60% auto;
	}
	.swiper-text .top-banner-text .banner1 h2 {
        color: #fff;
        font-size: 36px;
    }
    .swiper-text .top-banner-text .banner1 p {
        color: #fff;
        opacity: .8;
        font-size: 18px;
        line-height: 1.7;
    }
	.swiper-text h3 {
        font-size: 24px;
        text-align: center;
        margin-bottom: 3%;
		color: #FFF;
		line-height: 24px;
    }
	.swiper-text p {
        font-size: 16px;
        text-align: center;
        margin-bottom: 3%;
		color: #FFF;
		line-height: 24px;
    }
	.swiper-text .top-banner-text h2,.swiper-text .top-banner-text p{
		text-align: left;
		margin-bottom: 0;
		line-height: 1.7;
	}
	.swiper-text .swiperbtn {
		display: block;
        background: var(--primary-color);
        background-image: -webkit-gradient(linear,right top, left top,color-stop(0, #1dab7d),to(#47de9d));
        background-image: linear-gradient(270deg,#1dab7d 0,#47de9d 100%);
        width: 120px;
        height: 40px;
        line-height: 40px;
        color: var(--text-primary);
        text-align: center;
        border-radius: 20px;
		margin:0 auto;
		font-size: 14px;
    }
	.swiper-text .swiperbtn:hover {
        -webkit-box-shadow: 0 1px 5px 0 rgb(34 178 129 / 50%);
        box-shadow: 0 1px 5px 0 rgb(34 178 129 / 50%);
        -webkit-transform: translateY(-5px);
        transform: translateY(-5px);
	}
/* 布局 */
.grid-demo {
    padding: 10px;
    line-height: 50px;
    text-align: center;
    background-color: #79C48C;
    color: #fff;
}
/* container */
.zca371sub-menu {
    background: var(--background-secondary);
    -webkit-box-shadow: 0px 0px 10px 0px var(--shadow-color);
    box-shadow: 0px 0px 10px 0px var(--shadow-color);
}
.zca371sub-menu ul {
    text-align: center;
    font-size: 0;
}
.centerArea {
    max-width: 1200px;
    width: calc(100% - 32px);
    margin: 0 auto;
}
.zca371sub-menu ul li {
    float: left;
    position: relative;
}
.zca371sub-menu ul li a {
    font-size: 16px;
    font-weight: 400;
    color: var(--text-secondary);
    line-height: 24px;
    position: relative;
    padding: 18px 0;
    display: inline-block;
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
}
.zca371sub-menu ul li.selected a {
    color: var(--accent-color);
}
.zca371sub-menu ul li:hover a {
    color: var(--accent-color);
}
.zca371sub-menu ul li.selected a::after {
    width: 100%;
}
.zca371sub-menu ul li:hover a::after {
    width: 100%;
}
.zca371sub-menu ul li a::after {
    content: "";
    width: 0;
    height: 4px;
    background: var(--accent-color);
    position: absolute;
    bottom: 0;
    left: 0;
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
}

@font-face{font-family:'HelveticaNeueLTPro';src:url('../images/HelveticaNeueLTPro-ThEx.ttf?v=20208131600'),url('HelveticaNeueLTPro-ThEx.ttf?v=201808131600') format('embedded-opentype')}
.zca371row .zca371rowtitle{
    text-align: center;padding: 30px 0 20px 0;
}
.zca371row .zca371rowtitle h1{
    font-size: 28px;
    line-height: 30px;
    text-align: center;
    color: var(--accent-color);
}
.zca371row .zca371rowtitle p{
	font-size: 16px;line-height: 30px;
    color: var(--text-secondary);
    font-family: Arial;
}
.zca371row .lead {
    font-size: 16px;
    line-height: 30px;
    text-align: center;
}
.zca371row .wow {
    background: var(--background-tertiary);
    -webkit-transition: .7s;
    -moz-transition: .7s;
    -o-transition: .7s;
    transition: .7s;
    padding: 4px;
    border: 1px solid var(--border-color);
}
.zca371row .wow:hover {
    background: var(--accent-color);
    transform: translateY(-2px);
    box-shadow: 0 8px 25px var(--shadow-color);
}
.zca371row .wow dt img {
    width: 100%;
}
.zca371row .wow dd {
    padding: 15px;
}
.zca371row .wow dd h1 {
    font-size: 24px;
    text-align: center;
    color: var(--text-primary);
}
.zca371row .wow dd p {
    color: var(--text-secondary);
    font-size: 14px;
    text-align: left;
    line-height: 24px;
    margin-top: 10px;
}
.zca371row .wow:hover dd h1, .zca371row .wow:hover dd p {
    color: #fff;
}
.zca371row .perProduct {
    position: relative;
    background: var(--background-tertiary);
    border: 1px solid var(--border-color);
    height: 200px;
	box-shadow: 0 0 15px 0 var(--shadow-color);
    border-radius: 6px;
}
.zca371row .perProduct .left {
    float: left;
    width: 40%;
    height: 100%;
    box-sizing: border-box;
}
.zca371row .perProduct .left img{
    top: 50%;
    -webkit-transform: translate(0px, 50%);
    transform: translate(0px, 50%);
    position: relative;
    max-width: 90%;
	margin: 0 auto;
    display: block;
}
.zca371row .perProduct .right {
    float: left;
    width: 60%;
    font-family: MicrosoftYaHei;
}
.zca371row .perProduct .right p {
    padding: 24px 0 16px;
    font-family: MicrosoftYaHei-Bold;
    font-size: 16px;
    color: var(--text-primary);
    letter-spacing: 1px;
    line-height: 28px;
}
.zca371row .perProduct .right .p {
    font-size: 14px;
    line-height: 28px;
	padding-right:5px;
}
.zca371row .perProduct .right .look {
    position: absolute;
    bottom: 16px;
    right: 15px;
    background: var(--gradient-button);
    min-width: 80px;
	padding:0 10px;
    height: 40px;
    font-size: 14px;
    color: var(--text-primary);
    letter-spacing: 0.88px;
    text-align: center;
    line-height: 40px;
    cursor: pointer;
    transition: all .4s;
    text-decoration: none;
	box-shadow: 0 0 15px 0 var(--shadow-color);
    border-radius: 6px;
}
.zca371row .perProduct .right .look:hover {
    background: var(--gradient-accent);
    transform: translateY(-2px);
    box-shadow: 0 8px 25px var(--shadow-color);
}

.zca371row .featured-image{text-align: center;}
.zca371row .featured-image img{width:70%;}
.zca371row .description {
	padding-top:20px;
}
.zca371row .description h2 {
    font-size: 24px;
    line-height: 30px;
	padding: 10px;
    color: var(--accent-color);
}
.zca371row .description p {
    font-size: 16px;
    line-height: 30px;
	padding: 4px;
    color: var(--text-secondary);
}
 a.site-down {
    position: relative;
    padding: 0 30px 0 30px;
	margin:15px 0 0 6px;
    height: 36px;
    line-height: 36px;
	background: var(--gradient-button);
    font-size: 24px;
    color: var(--text-primary);
    transition: all .5s;
    -webkit-transition: all .5s;
}
 a.site-down:hover {
    color: var(--text-primary);
    border-radius: 30px;
    transform: translateY(-2px);
    box-shadow: 0 8px 25px var(--shadow-color);
}

.news_content {
    box-shadow: 0 0 15px 0 var(--shadow-color);
    border-radius: 6px;
    overflow: hidden;
    background: var(--background-tertiary);
    border: 1px solid var(--border-color);
	-webkit-transition: .7s;
    -moz-transition: .7s;
    -o-transition: .7s;
    transition: .7s;
}
.news_content:hover{
    background: var(--accent-color);
    transform: translateY(-2px);
    box-shadow: 0 8px 25px var(--shadow-color);
}
.news_img {
    width: 100%;
    height: 180px;
	display: inline-block;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 50%;
}
.news_info {
    padding: 15px;
    width: 100%;
    box-sizing: border-box;
    overflow: hidden;
	min-height: 165px;
}
.article_title {
    font-size: 16px;
    color: var(--text-primary);
    text-decoration: none;
    overflow: hidden;
}
.news_summary {
    line-height: 26px;
    color: var(--text-secondary);
    margin-top: 14px;
    font-size: 14px;
    overflow: hidden;
}
/* 列表 */
.zca371news_list_wrap{max-width:1140px;margin:0 auto;}
.news_list_item_line {
    padding: 30px;
	position: relative;
	-webkit-transition: all 0.5s;
    transition: all 0.5s;
	opacity: 1;
    filter: alpha(opacity=100);
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
}
.news_list_item_line:hover {
	-webkit-box-shadow: var(--shadow-color) 0 0 22px;
    -moz-box-shadow: var(--shadow-color) 0 0 22px;
    box-shadow: var(--shadow-color) 0 0 22px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    background: var(--accent-color);
    color: var(--text-primary);
    transform: translateY(-2px);
}
.news_list_item_line:hover a{
	color: var(--text-primary);
}
.news_list_item_header{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-webkit-justify-content:space-between;-moz-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:start;-webkit-align-items:flex-start;-moz-box-align:start;-ms-flex-align:start;align-items:flex-start;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;margin-top:0}
.news_list_item_date {
    font-size: 14px;
    color: var(--text-muted);
    line-height: 24px;
}
.news_list_item_title {
    font-size: 16px;
    font-weight: 400;
    color: var(--text-primary);
    line-height: 24px;
}
.news_list_item_link {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}
.news_list_item_summery {
    margin-top: 18px;
    font-size: 14px;
    color: var(--text-secondary);
    line-height: 1.7;
}
.news_list_item_group a{
    display: inline-block;
    position: relative;
    height: 26px;
    line-height: 26px;
    max-width: 100%;
    padding: 0 8px;
    border: 1px solid var(--border-color);
    margin-top: 12px;
    margin-right: 15px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    color: var(--text-muted);
    font-size: 12px;
    word-break: keep-all;
    overflow: hidden;
    z-index: 2;
    transition: all 0.3s ease;
}
.news_list_parting_line {
    height: 0;
    border-bottom: 1px solid var(--border-color);
    margin: 0 1.6666%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
/* 分页 */
.zzpages ul{
	float:left;
	padding:12px 0px 12px 16px;
}
.zzpages ul li{
	display: inline-block;
    height: 35px;
    line-height: 35px;
    background: var(--background-tertiary);
    border: 1px solid var(--border-color);
    overflow: hidden;
    vertical-align: top;
    transition: all 0.3s ease;
}
.zzpages li.thisclass {
    background: var(--accent-color);
    border: 1px solid var(--accent-color);
    color: var(--text-primary);
}
.zzpages ul li:hover{
    border: 1px solid var(--accent-color);
    background: var(--accent-color);
    color: var(--text-primary);
    transform: translateY(-1px);
}
.zzpages ul li a,.zzpages ul li .pageinfo{
	color: var(--text-primary);
    padding: 8px 12px;
}
.zzpages li.thisclass a{
	color: var(--text-primary);
}
.zzpages .pageinfo strong{
	color: var(--text-secondary);
	font-weight:normal;
	margin:0px 2px;
}
/* 内容 */
.zca371place{min-height: 56px;background-color: var(--background-tertiary);line-height: 56px;font-size: 16px;padding:0 20px;margin:20px 0;border: 1px solid var(--border-color);}
.zca371body{width:100%;overflow-x: hidden;font-size:16px;line-height:28px;padding-bottom:30px;}
.zca371body h2{font-size:20px;line-height:50px;text-align:left;color: var(--accent-color);}
.zca371body .info{padding-bottom:15px;font-family: HelveticaNeueLTPro, 微软雅黑;}
.zca371body .info small{padding:0 1px;}
.zca371body p{padding-bottom: 20px;}
.zca371body img{max-width:98%;height:auto;}
.zca371meta-tags{padding: 20px 0;}
.zca371meta-tags .zca371tagitem {
    position: relative;
    display: inline-block;
    height: 30px;
    padding: 0 12px;
    font-size: 14px;
    line-height: 30px;
    vertical-align: top;
    border-radius: 100px;
    background: var(--background-tertiary);
    border: 1px solid var(--border-color);
    margin-bottom: 20px;
    transition: all 0.3s ease;
}
.zca371meta-tags .zca371tagitem:hover {
    background-color: var(--accent-color);
    color: var(--text-primary);
    transform: translateY(-1px);
    box-shadow: 0 4px 15px var(--shadow-color);
}
.zca371meta-tags .zca371tagitem:not(:last-child) {
    margin-right: 10px;
}
.zca371context{line-height: 30px;}
/* 自定义内容 */
.zca371content{width:100%;font-size:16px;line-height:28px;padding-bottom:30px;}
.zca371content p{padding-bottom: 20px;}

.zca371content .contain {
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    padding: 36px 40px;
    background: var(--background-tertiary);
    border: 1px solid var(--border-color);
	box-shadow: 0 0 15px 0 var(--shadow-color);
    border-radius: 6px;
	-webkit-transition: .7s;
    -moz-transition: .7s;
    -o-transition: .7s;
    transition: .7s;
}
.zca371content .contain:hover {
    background: var(--accent-color);
    transform: translateY(-2px);
    box-shadow: 0 8px 25px var(--shadow-color);
}
.zca371content .contain .ch-title {
    font-size: 24px;
    font-weight: 600;
    color: var(--accent-color);
    line-height: 32px;
    margin-bottom: 6px;
}
.zca371content .contain .en-title {
    font-size: 16px;
    font-family: HelveticaNeueLTPro;
    color: var(--text-secondary);
    line-height: 32px;
    padding-bottom: 8px;
}
.zca371content .contain .line {
    width: 48px;
    height: 4px;
    background: var(--accent-color);
    display: inline-block;
    margin-bottom: 24px;
}
.zca371content .contain p {
    font-size: 16px;
    font-weight: 400;
    color: var(--text-secondary);
    line-height: 24px;
    text-align: justify;
}
/* 时间线 */
.twtimeline{
    position: relative;
    min-height: 454px;
}
.twtimeline::before {
    content: "";
    position: absolute;
    height: 100%;
    width: 2px;
    left: 50%;
    top: 0;
    border-left: 2px dashed #ccc7c0;
}
.twtimeline .image{position: relative;}
.twtimeline .img-contain {
    overflow: hidden;
    max-width: 384px;
    display: inline-block;
}
.twtimeline .img-contain img {
    max-width: 384px;
    -webkit-transition: ease-in-out 0.5s;
    transition: ease-in-out 0.5s;
}
.twtimeline .img-contain img:hover {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
}
.twtimeline .image img {
    max-width: 100%;
}
.twtimeline .image .img-bg {
    background: #eeeeee;
    position: absolute;
    z-index: -1;
    left: 34px;
    top: 34px;
	height: 216px;
    width: 384px;
}
.twtimeline .text .date {
    display: block;
    text-align: left;
    padding-left: 45px;
    background: url(/images/time_icon.png) no-repeat left;
    -webkit-transform: translate(-11px, -11px);
    transform: translate(-11px, -11px);
	font-family: HelveticaNeueLTPro, 微软雅黑;
	font-size: 32px;
	font-weight: bold;
	margin-bottom: 28px;
}
.twtimeline .desc {
    font-size: 16px;
    font-weight: 400;
    color: #333333;
    line-height: 24px;
    position: relative;
	padding-bottom: 28px;
}
.twtimeline .desc ul {
    padding-left: 54px;
}
.twtimeline .desc ul li{
    position: relative;
    margin-bottom: 10px;
}
.twtimeline .desc ul li::before {
    content: "";
    position: absolute;
    height: 5px;
    width: 5px;
    border-radius: 50%;
    left: -16px;
    top: 8px;
    background: #85725a;
}
.twtimeline .text:nth-child(odd){
	padding:0 40px 0 48px;
}
.twtimeline .zda315col-md6:nth-child(odd) .date{
    text-align: right;
	background-position-x: right;
	padding-left: 0;
	padding-right: 45px;
	-webkit-transform: translate(54px, 0px);
    transform: translate(54px, 0px);
}
.twtimeline .image:nth-child(odd){
    top: 50%;
    -webkit-transform: translate(0px, 50%);
    transform: translate(0px, 50%);
    position: relative;
}
.twtimeline .image:nth-child(even){
    text-align: right;
    padding-right: 32px;
    position: relative;
    top: 50%;
    -webkit-transform: translate(0px, 50%);
    transform: translate(0px, 50%);
}
.twtimeline .image:nth-child(even) .img-bg{
    background: #eeeeee;
    position: absolute;
    z-index: -1;
	left: auto;
    right: 70px;
    top: 34px;
}
/* footer */
.zca371footer{margin:0 auto; color:var(--text-muted); background: var(--background-primary);border-top: 1px solid var(--border-color); text-align:center;position: relative;}
.zca371footer a{color:var(--text-muted);}
.zca371footer a:hover{color:var(--accent-color);}
.zca371footer .zca371flink{padding-bottom:20px;}
.zca371footer .zca371flink li{display: inline-block;margin-left: 10px;}
.zca371footer .footerserver{padding:30px 0 20px 0;text-align:left;}
.zca371footer dl{margin:0 0 10px 50px;}
.zca371footer dt {
    position: relative;
    font-size: 16px;
    color: var(--text-primary);
    line-height: 20px;
    margin-bottom: 10px;
}
.zca371footer dd {
    
    line-height: 30px;
}

.footerc {
    background: var(--background-primary);
    color: var(--text-muted);
	padding:30px 0;
	line-height:22px;
    border-top: 1px solid var(--border-color);
}
/* diy */
.jz-numberBar {
    position: relative;
    margin: 25px auto;
    z-index: 2;
    background: var(--background-tertiary);
    color: var(--text-primary);
    border-radius: 0 0 5px 5px;
    border: 1px solid var(--border-color);
}
.jz-numberBar .f-num {
    font-size: 40px;
    line-height: 1;
    vertical-align: middle;
    font-family: HelveticaNeueLTPro, 微软雅黑;
}
.f-numberItem-safeRun .text-day {
    margin-left: 13px;
    vertical-align: middle;
    line-height: 45px;
    font-size: 18px;
    color: var(--accent-color);
}
.jz-numberBar .f-numberDesc {
    width: auto;
    font-size: 18px;
    color: var(--text-secondary);
    vertical-align: middle;
    line-height: 45px;
    margin-left: 14px;
}
.f-numWrap{
	text-align:center;
}
.jz-numberBar .zca371col-md3{
	display: flex;
    padding: 20px 0;
    justify-content: space-around;
    align-items: center;}
.jz-numberBar .flag {
    color: #fff;
    display: flex;
    align-items: center;
    cursor: default;
    transition: all .3s ease-in-out;
}
.jz-numberBar .flag img {
    max-height: 40px;
    margin-right: 15px;
}
.jz-numberBar .flag h3 {
    font-size: 22px;
    color: var(--text-primary);
    opacity: .85;
}
.jz-numberBar .flag p {
    font-size: 14px;
    opacity: .8;
    color: var(--text-secondary);
}
.zca371nav-child {line-height: 45px;}
/* mobile */
@media only screen and (max-width: 1140px) {
	.zca371header .logo {
		left: 20px;
		top: 50%;
		transform: translateY(-50%);
	}
	
	/* 中等螢幕導航菜單隱藏 */
	.zca371navmenu {
		display: none;
	}
}
@media only screen and (max-width: 600px) {
	.swiper-container {min-height: 120px;}
	.swiper-container img{width: 100%;max-width:100%;min-height: 100%;}
	.swiper-text h3,.swiper-text h2 {font-size: 16px;}.swiper-text p {font-size: 12px;}
	.swiper-text .top-banner-text h2, .swiper-text .top-banner-text p {text-align: center;}
	.zca371row .description{text-align:center;} .zca371row .description p{text-align:left;}
	.twtimeline .image{display:none;}
	.twtimeline::before{left:0;}.twtimeline .text:nth-child(odd){padding:0;}.twtimeline .zda315col-md6:nth-child(odd) .date{text-align: left;background-position-x: left;padding-left: 45px;-webkit-transform: translate(-11px, -11px);transform: translate(-11px, -11px);}
}

/* 桌面版手機菜單樣式 - 預設隱藏 */
.mobile-menu-toggle {
	display: none;
}

.mobile-nav-overlay {
	display: none;
}

/* 手機版頭部樣式 - 參考98a設計 */
@media only screen and (max-width: 768px) {
	/* 頭部容器 - 使用最高優先級覆蓋所有樣式 */
	body .zca371header,
	html body .zca371header,
	body.zca371body .zca371header,
	.zca371header.zca371header.zca371header {
		background: var(--gradient-primary) !important;
		box-shadow: 0 4px 20px var(--shadow-color) !important;
		position: fixed !important;
		top: 0 !important;
		left: 0 !important;
		right: 0 !important;
		z-index: 9999 !important;
		padding: 10px 0 !important;
		width: 100% !important;
		height: auto !important;
		margin: 0 !important;
		border: 0 !important;
	}
	
	.zca371header .zca371main {
		display: flex !important;
		justify-content: space-between !important;
		align-items: center !important;
		padding: 0 12px !important;
		height: 60px !important;
		max-width: 100vw !important;
		overflow: visible !important;
		position: relative !important;
		gap: 10px !important;
	}
	
	/* Logo區域 - 固定位置 */
	.zca371header .logo {
		flex: 1 1 auto !important;
		z-index: 1001 !important;
		position: relative !important;
		left: auto !important;
		top: auto !important;
		transform: none !important;
		max-width: calc(100vw - 180px) !important;
		overflow: hidden !important;
		min-width: 0 !important;
		display: flex !important;
		align-items: center !important;
	}
	
	.zca371header .logo h1 {
		margin: 0 !important;
		line-height: 1 !important;
		font-size: 24px !important;
	}
	
	.zca371header .logo img {
		max-height: 40px !important;
		width: auto !important;
	}
	
	/* 隱藏桌面導航菜單 */
	.zca371header .zca371navmenu {
		display: none !important;
	}
	
	/* 手機版按鈕組 - 確保正確位置 */
	.zca371header .header-right {
		display: flex !important;
		align-items: center !important;
		gap: 8px !important;
		flex: 0 0 auto !important;
		z-index: 1001 !important;
		position: relative !important;
		margin-left: auto !important;
		padding-right: 10px !important;
		max-width: calc(100vw - 200px) !important;
	}
	
	.zca371header .auth-buttons {
		display: flex !important;
		flex: 0 0 auto !important;
		gap: 6px !important;
		align-items: center !important;
		z-index: 1001 !important;
		position: relative !important;
		right: auto !important;
		top: auto !important;
		transform: none !important;
		background: transparent !important;
		backdrop-filter: none !important;
		border-radius: 0 !important;
		padding: 0 !important;
		box-shadow: none !important;
		border: none !important;
		margin-right: 5px !important;
		max-width: 130px !important;
		justify-content: flex-end !important;
		flex-shrink: 1 !important;
	}
	
	.zca371header .auth-buttons .btn-login,
	.zca371header .auth-buttons .btn-register {
		font-size: 11px !important;
		padding: 5px 10px !important;
		border-radius: 20px !important;
		font-weight: 600 !important;
		text-decoration: none !important;
		transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
		min-width: auto !important;
		height: auto !important;
		margin: 0 !important;
		display: inline-flex !important;
		align-items: center !important;
		justify-content: center !important;
		text-align: center !important;
		line-height: 1 !important;
		white-space: nowrap !important;
		letter-spacing: 0.3px !important;
		cursor: pointer !important;
		border: 2px solid transparent !important;
		flex-shrink: 1 !important;
		max-width: 60px !important;
		min-width: 45px !important;
	}
	
	/* 登入按鈕 - 透明風格 */
	.zca371header .auth-buttons .btn-login {
		background: transparent !important;
		color: var(--accent-color) !important;
		border-color: var(--accent-color) !important;
		box-shadow: none !important;
	}
	
	.zca371header .auth-buttons .btn-login:hover {
		background: var(--accent-color) !important;
		color: var(--text-primary) !important;
		transform: translateY(-2px) !important;
		box-shadow: 0 6px 20px rgba(246, 173, 85, 0.4) !important;
	}
	
	/* 註冊按鈕 - 實心風格 */
	.zca371header .auth-buttons .btn-register {
		background: var(--gradient-button) !important;
		color: var(--text-primary) !important;
		border-color: var(--accent-color) !important;
		box-shadow: 0 4px 15px rgba(0, 123, 255, 0.3) !important;
	}
	
	.zca371header .auth-buttons .btn-register:hover {
		background: linear-gradient(135deg, #0056b3 0%, #004085 100%) !important;
		transform: translateY(-2px) !important;
		box-shadow: 0 8px 25px rgba(0, 123, 255, 0.5) !important;
	}
	
	/* 手機端菜單按鈕樣式 - 強制顯示 */
	.mobile-menu-toggle {
		display: flex !important;
		flex-direction: column !important;
		justify-content: center !important;
		align-items: center !important;
		width: 32px !important;
		height: 32px !important;
		cursor: pointer !important;
		z-index: 10001 !important;
		transition: all 0.3s ease !important;
		background: rgba(246, 173, 85, 0.1) !important;
		border-radius: 6px !important;
		margin-left: 8px !important;
		position: relative !important;
		flex-shrink: 0 !important;
		margin-right: 0 !important;
	}
	
	.hamburger-line {
		display: block !important;
		width: 22px !important;
		height: 3px !important;
		background: var(--accent-color) !important;
		margin: 2px 0 !important;
		transition: all 0.3s ease !important;
		border-radius: 2px !important;
		box-shadow: 0 0 2px rgba(246, 173, 85, 0.3) !important;
	}
	
	/* 菜單開啟狀態的動畫 */
	.mobile-menu-toggle.active .hamburger-line:nth-child(1) {
		transform: rotate(45deg) translate(5px, 5px) !important;
	}
	
	.mobile-menu-toggle.active .hamburger-line:nth-child(2) {
		opacity: 0 !important;
	}
	
	.mobile-menu-toggle.active .hamburger-line:nth-child(3) {
		transform: rotate(-45deg) translate(7px, -6px) !important;
	}
	
	/* 手機端滑出式選單樣式 - 確保可見性 */
	.mobile-nav-overlay {
		position: fixed !important;
		top: 0 !important;
		left: 0 !important;
		width: 100vw !important;
		height: 100vh !important;
		background: rgba(0, 0, 0, 0.5) !important;
		z-index: 10000 !important;
		opacity: 0 !important;
		visibility: hidden !important;
		transition: all 0.3s ease !important;
		display: block !important;
		overflow: hidden !important;
		pointer-events: none !important;
	}
	
	.mobile-nav-overlay.active {
		opacity: 1 !important;
		visibility: visible !important;
		pointer-events: auto !important;
	}
	
	.mobile-nav-overlay.active {
		opacity: 1 !important;
		visibility: visible !important;
	}
	
	.mobile-nav-content {
		position: fixed !important;
		top: 0 !important;
		right: 0 !important;
		width: min(280px, 80vw) !important;
		height: 100vh !important;
		background: #fff !important;
		transform: translateX(100%) !important;
		transition: transform 0.3s ease !important;
		overflow-y: auto !important;
		box-shadow: -2px 0 10px rgba(0, 0, 0, 0.1) !important;
		display: block !important;
		z-index: 10001 !important;
		max-width: calc(100vw - 20px) !important;
		pointer-events: auto !important;
		margin-right: 0 !important;
		border: none !important;
	}
	
	.mobile-nav-overlay.active .mobile-nav-content {
		transform: translateX(0) !important;
		right: 0 !important;
		left: auto !important;
	}
	
	/* 確保選單在小螢幕上正確顯示 */
	@media (max-width: 480px) {
		.mobile-nav-content {
			width: min(260px, 85vw) !important;
			max-width: calc(100vw - 15px) !important;
		}
	}
	
	@media (max-width: 360px) {
		.mobile-nav-content {
			width: min(240px, 90vw) !important;
			max-width: calc(100vw - 10px) !important;
		}
	}
	
	/* 手機選單頭部 */
	.mobile-nav-header {
		display: flex !important;
		justify-content: space-between !important;
		align-items: center !important;
		padding: 15px 20px !important;
		border-bottom: 1px solid #eee !important;
		background: linear-gradient(135deg, #007bff 0%, #0056b3 100%) !important;
		color: white !important;
	}
	
	.mobile-logo img {
		max-height: 35px !important;
		width: auto !important;
	}
	
	.mobile-close-btn {
		width: 30px !important;
		height: 30px !important;
		position: relative !important;
		cursor: pointer !important;
		padding: 5px !important;
	}
	
	.mobile-close-btn span {
		position: absolute !important;
		width: 20px !important;
		height: 2px !important;
		background: white !important;
		top: 50% !important;
		left: 50% !important;
		transition: all 0.3s ease !important;
	}
	
	.mobile-close-btn span:nth-child(1) {
		transform: translate(-50%, -50%) rotate(45deg) !important;
	}
	
	.mobile-close-btn span:nth-child(2) {
		transform: translate(-50%, -50%) rotate(-45deg) !important;
	}
	
	/* 手機選單列表 */
	.mobile-nav-menu {
		list-style: none !important;
		padding: 0 !important;
		margin: 0 !important;
		display: block !important;
	}
	
	.mobile-nav-menu li {
		border-bottom: 1px solid #f5f5f5 !important;
		display: block !important;
	}
	
	.mobile-nav-menu li:last-child {
		border-bottom: none !important;
	}
	
	.mobile-nav-menu a {
		display: flex !important;
		align-items: center !important;
		padding: 15px 20px !important;
		color: #333 !important;
		text-decoration: none !important;
		font-size: 16px !important;
		transition: all 0.3s ease !important;
	}
	
	.mobile-nav-menu a:hover,
	.mobile-nav-menu .current-menu a {
		background: #f8f9fa !important;
		color: #007bff !important;
		padding-left: 25px !important;
	}
	
	.nav-icon {
		margin-right: 12px !important;
		font-size: 18px !important;
		width: 20px !important;
		text-align: center !important;
	}
	
	/* 手機選單底部按鈕 */
	.mobile-nav-actions {
		padding: 20px !important;
		border-top: 1px solid #eee !important;
		background: #f8f9fa !important;
		display: block !important;
	}
	
	/* 手機選單按鈕 - 與電腦端保持一致 */
	.mobile-btn {
		display: block !important;
		width: 100% !important;
		padding: 12px 20px !important;
		margin: 8px 0 !important;
		text-align: center !important;
		text-decoration: none !important;
		border-radius: 25px !important;
		font-weight: 500 !important;
		transition: all 0.3s ease !important;
		border: 2px solid transparent !important;
	}
	
	.mobile-btn-login {
		background: transparent !important;
		color: #007bff !important;
		border-color: #007bff !important;
	}
	
	.mobile-btn-login:hover {
		background: #007bff !important;
		color: white !important;
		transform: translateY(-2px) !important;
		box-shadow: 0 4px 15px rgba(0, 123, 255, 0.3) !important;
	}
	
	.mobile-btn-register {
		background: linear-gradient(135deg, #007bff 0%, #0056b3 100%) !important;
		color: white !important;
		border-color: #007bff !important;
	}
	
	.mobile-btn-register:hover {
		background: linear-gradient(135deg, #0056b3 0%, #004085 100%) !important;
		transform: translateY(-2px) !important;
		box-shadow: 0 6px 20px rgba(0, 123, 255, 0.4) !important;
	}
	
	/* 原有菜單按鈕隱藏 - 強制隱藏所有舊選單元素 */
	.icon_menu,
	.i_menu,
	.i_close,
	.bg_hover {
		display: none !important;
		visibility: hidden !important;
		opacity: 0 !important;
		pointer-events: none !important;
		position: absolute !important;
		left: -9999px !important;
		top: -9999px !important;
		z-index: -1 !important;
	}
	
	/* 強制覆蓋所有可能的頭部樣式 - 超高優先級 */
	html [class*="zca371header"],
	body [class*="zca371header"],
	div.zca371header,
	header.zca371header,
	*[class="zca371header"] {
		position: fixed !important;
		top: 0 !important;
		left: 0 !important;
		right: 0 !important;
		z-index: 99999 !important;
		background: var(--gradient-primary) !important;
		width: 100% !important;
		box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1) !important;
		padding: 8px 0 !important;
		margin: 0 !important;
		border: 0 !important;
	}
}

/* 超小螢幕優化 */
@media only screen and (max-width: 480px) {
	.zca371header .zca371main {
		padding: 0 8px;
		height: 45px;
	}
	
	.zca371header .logo {
		max-width: calc(100vw - 160px) !important;
	}
	
	.zca371header .logo img {
		max-height: 30px;
	}
	
	.zca371header .header-right {
		gap: 6px !important;
		padding-right: 8px !important;
		max-width: calc(100vw - 160px) !important;
	}
	
	.zca371header .auth-buttons {
		gap: 4px !important;
		max-width: 115px !important;
	}
	
	/* 保持按鈕樣式一致性 */
	.zca371header .auth-buttons .btn-login,
	.zca371header .auth-buttons .btn-register {
		font-size: 11px !important;
		padding: 5px 10px !important;
		border-radius: 20px !important;
		border-width: 2px !important;
		font-weight: 500 !important;
		max-width: 55px !important;
	}
	
	/* 手機選單按鈕也保持一致性 */
	.mobile-btn {
		font-size: 14px !important;
		padding: 10px 16px !important;
		border-radius: 20px !important;
		border-width: 2px !important;
	}
	
	/* 手機選單內容寬度調整 */
	.mobile-nav-content {
		width: 260px;
	}
	
	/* 手機選單按鈕尺寸調整 */
	.mobile-menu-toggle {
		width: 28px;
		height: 28px;
	}
	
	.hamburger-line {
		width: 20px;
		height: 3px;
		background: var(--accent-color);
		box-shadow: 0 0 2px rgba(246, 173, 85, 0.3);
	}
}

/* 極小螢幕優化 */
@media only screen and (max-width: 360px) {
	.zca371header .zca371main {
		padding: 0 8px !important;
		gap: 6px !important;
	}
	
	.zca371header .logo {
		max-width: calc(100vw - 140px) !important;
	}
	
	.zca371header .header-right {
		gap: 5px !important;
		padding-right: 3px !important;
		max-width: calc(100vw - 140px) !important;
	}
	
	.zca371header .auth-buttons {
		gap: 3px !important;
		max-width: 100px !important;
	}
	
	/* 保持按鈕樣式一致性 */
	.zca371header .auth-buttons .btn-login,
	.zca371header .auth-buttons .btn-register {
		font-size: 10px !important;
		padding: 4px 8px !important;
		border-radius: 18px !important;
		border-width: 2px !important;
		font-weight: 500 !important;
		max-width: 50px !important;
	}
	
	/* 極小螢幕手機選單優化 */
	.mobile-nav-content {
		width: min(240px, 90vw) !important;
		right: 0 !important;
		left: auto !important;
	}
	
	.mobile-menu-toggle {
		width: 26px;
		height: 26px;
	}
	
	.hamburger-line {
		width: 18px;
		height: 3px;
		background: var(--accent-color);
		box-shadow: 0 0 2px rgba(246, 173, 85, 0.3);
	}
	
	.mobile-nav-menu a {
		padding: 12px 15px;
		font-size: 15px;
	}
	
	.mobile-nav-actions {
		padding: 15px;
	}
	
	.mobile-btn {
		padding: 10px 15px;
		font-size: 14px;
	}
}

/* 為固定頭部添加頁面內容頂部邊距 */
@media only screen and (max-width: 768px) {
	body,
	html body,
	body.zca371body {
		padding-top: 66px !important; /* 頭部高度 + 內邊距 */
		margin-top: 0 !important;
	}
	
	/* 確保內容區域不被頭部遮擋 */
	body > div:not(.zca371header),
	.zca371body > *,
	main,
	.container,
	.content {
		margin-top: 66px !important;
	}
	
	/* 確保第一個內容區塊不被遮擋 */
	.zca371main:first-child,
	.zca371row:first-child,
	.swiper-container:first-child {
		margin-top: 0;
	}
}
/* Updated: 2024-12-19 手機版按鈕樣式優化 - v3.0 固定位置改善 */

/* 強制隱藏所有舊選單元素 - 最高優先級 */
.icon_menu,
.i_menu,
.i_close,
.bg_hover,
[class*="icon_menu"],
[class*="i_menu"],
[class*="i_close"],
[class*="bg_hover"] {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    position: absolute !important;
    left: -9999px !important;
    top: -9999px !important;
    z-index: -9999 !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: transparent !important;
    font-size: 0 !important;
    line-height: 0 !important;
}