@charset "utf-8";
body{
	font-family: "微軟正黑體", "Arial Unicode MS";
	font-size: 15px;
	color: #000;
	word-wrap: break-word;
	word-break: break-all; 
	}
a{color:#535353;}
a:hover{color:#336699; text-decoration: none}

/*==反選的底色==========================================*/	
::selection {text-shadow: none;background: #362e2b;	color:#eee;}
img::selection {background: 0 0}
/*============================================================*/
.title{font-family: 'cwTeXYen','微軟正黑體', Arial; font-size: 36px; color: #362e2b; text-align: center}/*英文標題*/
.title-textsyle1{ color: #992621; text-align: left;margin: 1% 0 2%; padding: 0 0 3px 15px;border-bottom: 1px solid #a0a0a0; width: 100%; }
.title-textsyle2{color: #336699; text-align: left;margin: 1% 0 2%; padding: 0 0 3px 15px;border-bottom: 1px solid #a0a0a0; width: 100%;}
.title-textsyle3{color: #006633; text-align: left;margin: 1% 0 2%; padding: 0 0 3px 15px;border-bottom: 1px solid #a0a0a0; width: 100%;}
.container-padding{padding: 1% 15px; min-height: 70vh}
/*欄位設定*/
.col-bottom{ margin-bottom: 5px;}
@media (max-width:767px){
.col-bottom{ margin-bottom: 10px;}	
}
.img-box{position: relative; overflow: hidden;;box-sizing: border-box;background-color: #fff; box-shadow: 0 0 5px #d2d2d2}
.col-bottom img.img-borderstyle2:hover{opacity: .6}
/*img設定*/
.img-borderstyle1{transition: all 0.5s; padding: 5px;}
.img-borderstyle1:hover{opacity: 0.6; transform: scale(1.1);}
.img-borderstyle2{border: 1px solid #a2c571;transition: all 0.5s;}


/*scroll-up-top*/
.scroll-up{ width: 50px; height: 50px;background-color: #00561f; border: 1px solid #fff;border-radius: 50%;position: fixed;
    bottom: 65px;right: 20px;z-index: 100;cursor: pointer; text-align: center; line-height: 50px; display: none;color: #fff}
.scroll-up::before{content: "\f106";  font-family: FontAwesome; ; color:#fff;  position: absolute;top: -15px;width: 50px;
    left: 0px;}
.scroll-up:hover{ background-color: #00561f;color: #c9e294 }

/*==navbar_padding==========================================*/	
.navbar_padding{padding-top:100px; }
@media  (max-width : 768px) {
.navbar_padding{padding-top:60px }	
}
/*首頁banner尺寸*/
header{ position:relative;}
.banner-title{ position:absolute; top:42%; width:100%; z-index:999 }
.banner-title h1{ color: #00561f;
    text-shadow: 0px 0px 8px #FFF;
    text-align: center;
    font-weight: 800;
    font-size: 48px;}
.banner-title h2{color: #333;
    text-shadow: 0px 0px 5px #FFF;
    text-align: center;
    font-weight: 600;
    font-size: 36px; }			
.imgbox { 
	background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
	height: calc(100vh - 85px);width: 100%; }
@media  (max-width : 768px) {
	.banner-title h1{ font-size: 30px;}
	.banner-title h2{font-size: 24px;
}
}
/*btn 向下*/
.btndown {
    position: absolute;
    bottom: 80px;
    width: 200px;
    margin: auto;
    display: block;
    cursor: pointer;
    padding-bottom: 40px;
    left: 0;
    right: 0;
	text-align:center;
    text-transform: uppercase;
	color:#fff;
	z-index:999;
}
@media  (max-width : 768px) {
.btndown{ display:none;}
}

.btndown .icondownsytle {
    margin-top: 20px;
    display: block;
    animation: down_ef 2s infinite;
    color: #fff;
	z-index:999;
}
@keyframes down_ef{
  0% {
    -webkit-transform: translate(0, 0);
            transform: translate(0, 0); }
  50% {
    -webkit-transform: translate(0, 10px);
            transform: translate(0, 10px); }
  100% {
    -webkit-transform: translate(0, 0);
            transform: translate(0, 0); } 
	}
/*==index-aboutus==========================================*/
.index-aboutus{ font-size:18px; line-height:2.0; border:5px solid #b7aa00;border-radius: 60px 20px; padding:5%; background-color:rgba(255,255,255,0.7)}

/*====index-link===========*/
.index-link{ box-sizing: border-box}
.index-link ul{ margin:0; padding-left:20px}
.index-link > ul > li{ list-style: none;line-height:1.3; border-bottom:1px #626262 dashed; padding:0; width:100%; float:left; box-sizing:border-box; margin:1% 3% 1.5% 0; font-size: 14px;}
.index-link > ul > li::before{ content: "\f0da";  font-family: FontAwesome; padding-right: 5px}
.index-link > ul > li a:hover{ color:#362e2b}
@media (max-width: 767px) {
.index-link > ul > li{width:100%}
}
/*====index-link2===========*/
.index-link2{background-image: url(../images/symbol/slideimg_bg.jpg);background-repeat: no-repeat;  background-position: center center; padding: 30px 15px; background-size: cover}
.index-link2 .col-bottom2{ margin-bottom: 30px;}
@media (max-width:767px){
.index-link2.col-bottom2{ margin-bottom: 10px;}	
}
.index-link2 a h4 {position:absolute; bottom:0; background-color:#03004c; color:#fff; text-align:center; margin:0; padding:10px 15px; width:100%; box-sizing:border-box}
.index-link2 a:hover h4 {background-color:#03004c;}
@media (max-width:767px){
.index-link2 a h4 {padding:5px; font-size: 15px}	
}
.slide{}
@keyframes move_ef{
  0% {
    -webkit-transform: translate(0, 0);
            transform: translate(0, 0); }
  50% {
    -webkit-transform: translate(0, 10px);
            transform: translate(0, 10px); }
  100% {
    -webkit-transform: translate(0, 0);
            transform: translate(0, 0); } 
	}
.slide a h5 {text-align:center;font-size: 20px; letter-spacing:1px;font-weight: 600;color:#F26101;text-shadow: 0px 0px 2px #fff;}
.slide a:hover h5,.slide a:hover img{color:#712e02;animation: move_ef 1.5s infinite;}

/*========indexnews============*/
.indexnews{}
.index-title-1 h3{font-family:'微軟正黑體', Arial; color: #638c0b; text-align: center;display:flex;
align-items: center; margin:1% 0 2.5%; position:relative}/*標題*/
.index-title-1 h3:after,.index-title-1 h3:before {
        content: "";
        flex: 1;/*幾等份*/
        border: none;
        margin: 0 5px;
        border-top: 3px solid #638c0b;
}
.newtime{font-size: 14px;color: #676767;float: right;padding-top: 25px}
.indexnews ul{ margin:0; padding:0; width: 100%;display:flex;flex-wrap:wrap;}
.indexnews ul li{list-style:none;}
.indexnews .news-box{background-color:#fff; box-sizing: border-box; box-shadow: 0 0 5px #d2d2d2; overflow: hidden; transition:all .5s; padding-bottom: 10px;}
.indexnews .news-box .news-img-box,.indexnews .news-box .mv{position: relative;max-height: 180px; overflow: hidden;box-sizing: border-box;background-color: #fff;}
.img-bg2{position: relative;background-size: cover; height:190px;background-position: center;transition: all 0.5s;width: 99.99%}
.img-bg2:hover{opacity: 0.6; transform: scale(1.1);}
.news-box h4{padding: 0 10px; line-height: 1.3}
.indexnews ul li h4 a{font-size: 17px; color:#fff;letter-spacing:1px;  }
.indexnews ul li h4 a:hover{color: #fff;text-decoration: none;}
/*=====news==========================================*/
.news{box-shadow: 0 0 5px #d2d2d2; margin: 1% 0;background-color: rgba(255,255,255,.8);transition: all 0.5s;padding-bottom: 10px;}
.news:hover{ background-color:#03004c;}
.news:hover a span.date{color:#c9c9c9;}
.news h4{padding: 0 2%;}
.news:hover  h4{color:#fff;}
.news .news-img-box,.news .mv{height: 190px; overflow: hidden;background-color: #fff;}
.img-bg{position: relative;background-size: cover; height:190px;background-position: center;transition: all 0.5s;width: 99.99%}
.img-bg:hover{opacity: 0.6; transform: scale(1.1);}
.img-bg-height{height:auto;}
.img-bg h5{ position:absolute; background-color:rgba(0,0,0,0.7); color:#fff; left:0; bottom:0;width:100%; box-sizing:border-box; padding:5%; margin:0}
.news a span.date,.indexnews span.date{color: #898989; border-radius: 20px;padding: 1px 10px;font-size: 13px; letter-spacing: 0.5px}
.news a span.date::before,.indexnews span.date::before,.news-text span.date::before{content: "\f073";  font-family: FontAwesome; padding-right:5px;}
/*====news-text===========*/
.news-text{border-bottom: 1px dashed #333; padding: 2px 5px; transition:all 0.5s}
.news-text:hover h4{color: #336699} 
.news-text a h4 { color: #000; font-size: 15px;}
.news-text a h4::before{
	content: "\f101";
    font-family: FontAwesome;
    padding-right: 5px;
	} 
.news-text span.date{color: #fff;
	font-size: 13px;
    background-color: #959595;
    padding: 5px 10px;
    border-radius: 10px;
    letter-spacing: 0.5px;
	margin-left:1%}
/*==news_detail==========================================*/	
.news_detail{}
.news_detail > h2{ font-size:24px; font-weight: bold;}
.news_detail_img{ text-align:center; width:auto;height: auto;max-width: 90%; margin-bottom:10px;}
.news_detail img{ max-width:100% !important; height:auto !important}
.share{}
.share ul{}
@media (max-width:420px){
.share ul{margin-left: 20%}	
}
.share ul li{list-style: none;float: left;margin-right: 3% }
.share ul li a{color: #fff;  }
.share ul li.share-fb{background-color:#3b5998;color: #fff;padding: 5px 10px;box-sizing: border-box;}
.share ul li.share-fb::before{content: "\f09a";font-family: FontAwesome; padding-right: 5px }
.share ul li.share-line{background-color:#01b901;color: #fff;padding: 5px 10px 5px 30px;box-sizing: border-box;position: relative;}
.share ul li.share-line::before{content: "";background-image: url(../images/symbol/line_icon.svg);width: 30px;height: 30px;
position: absolute;left: 0;top: 0;background-repeat: no-repeat;}
.share ul li.share-wechat{background-color:#01b901;color: #fff;padding: 5px 10px 5px 30px;box-sizing: border-box;position: relative;}
.share ul li.share-wechat::before{content: "";background-image: url(../images/symbol/wechat_icon.svg);width: 25px;height: 25px;position: absolute;left: 5px;top: 3px;background-repeat: no-repeat;}

.share ul li.share-fb a,.share ul li.share-line a,.share ul li.share-wechat a{display: inline-block}
/*==bannerimg==========================================*/	
.bannerimg{ background-repeat: no-repeat;background-size: cover; width: 100%; height: 550px; background-position: center bottom;}
@media (max-width:1681px){
.bannerimg{height: 450px;}	
}
@media (max-width:420px){
.bannerimg{height: 250px;}	
}
/*====MemoSpec===========*/
.memoSpec { font-size:16px; color: #000;}
.memoSpec a{ color:#333}
.memoSpec a:hover{ text-decoration:none; color:#003567; font-weight:bold;}
.memoSpec p{font-size: 16px;letter-spacing: 1px;line-height:1.7;}
.memoSpec h1{font-family: 'Kaushan Script',"微軟正黑體", Arial; font-size: 48px;color: #362e2b;}/*英文標題*/
.memoSpec img{ max-width:100% !important; height: auto !important;}
.memoSpec table.noborder{ borer:0;}
.memoSpec table.noborder tr td{ text-align: center}
.memoSpec  table tr th{ background-color:#969696; color:#333; text-align:center;}
.table_style1{}
.table_style1 tr.block{ background-color:#262626; color:#fff;}
.table_style1 tr td{ padding:3% 0 2% 3%;}
/*==coll_info==========================================*/
.coll_info{color: #535353;font-size:14px;}
.coll_info h3{ color:#362e2b; text-align:center; line-height:1.5; font-size:16px;margin:15px 0 10px;}
/*===========bottom-comp-info===========*/
.comp-info{
	background:#cacaca;
	padding: 1% 0 0;
	color: #313131;
	line-height:1.5;
	letter-spacing:0.5px;
	font-size: 15px;
	}
.comp-info  a{color: #000}
.comp-info h4{ padding:0; margin-bottom:10px; letter-spacing:1px; }
.comp-info h5{font-weight:bold;font-size: 15px}
@media (max-width:767px) {
	.comp-info h4{ margin: 5% 0}	
}
.comp-info h2{ width: 50%; margin: 15px auto;color: #fff; text-align: center;}
.comp-time-title{ color:#fff;background-color: #982A2B; letter-spacing:2px; text-align:center; padding:2%; margin-bottom:1%}
.comp-time{ color:#fff;background-color: #B80608; letter-spacing:2px;padding:2% ;margin-bottom:1%}
.info-item{padding-bottom: 1%}
@media (max-width:767px) {
	.comp-info h2{ width: 100%;} 
}
/*====bottom-icon===========*/
.bottom-icon{ height: 40px;margin-top:2%;}
.bottom-icon ul {margin: 0; padding: 0;}
.bottom-icon ul li{ list-style: none;float: left; margin-right: 3%;}

/*====footer===========*/
footer {padding: 0.5% 0;text-align: center;font-size:13px;background-color:rgba(17, 21, 35, 0.96);color:#ffffff85;}
footer a{ color:#456c7b}
footer a:hover{ color:#43b7e9}
/*==============================公司網頁內文==============================*/
/*關於我們*/
.about{}
.about p{ line-height: 2.0}
/*==首頁最新消息===================================================================*/
.indexnews2{padding:3% 2%; border: 1px solid #eee;}
.indexnews2 ul{ margin:0; padding-left:10px;}
.indexnews2 ul li{font-size: 15px; display:block;  border-bottom:1px #ccc dashed; width:100%}
.indexnews2 ul li::before{content: "\f101";  font-family: FontAwesome; padding-right: 5px;}
.indexnews2 ul li a{color: #333;line-height:1.8; letter-spacing:1px; }
.indexnews2 ul li a:hover{color: #304269;}
.news-more-link {
    font-size: 15px;
    float: right;
    display: inline;
    padding-right: 10px;
    padding-top: 5px;
}
/*==首頁活動剪影===================================================================*/
.index-title-3 h3{font-family:'微軟正黑體', Arial; color: #fff; text-align: center;display:flex;
align-items: center; margin:1% 0 2.5%; position:relative}/*標題*/
.index-title-3 h3:after,.index-title-3 h3:before {
        content: "";
        flex: 1;/*幾等份*/
        border: none;
        margin: 0 1.5rem;
        border-top: 3px solid #fff;
}

.index-title-2 h3{font-family:'微軟正黑體', Arial; color: #a84200; text-align: center;display:flex;
align-items: center; margin:1% 0 2.5%; position:relative}/*標題*/
.index-title-2 h3:after,.index-title-2 h3:before {
        content: "";
        flex: 1;/*幾等份*/
        border: none;
        margin: 0 1.5rem;
        border-top: 3px solid #a84200;
}
.activity-photo{}
.activity-photo h5 a{ color:#000; letter-spacing:1px}
.activity-photo h5 a:hover{ color:#555}

.box-height{ width: 100%;height: 0;padding-top: 100%}/*圖片的高度，自動等比縮放padding-top: 80%-矩形*/
.box-height2{ width: 100%;height: 100%;}
.box-height .img-bg{ position: absolute;top: 0;bottom: 0;left: 0;right: 0;max-width: 100%; max-height: 100%;margin: auto}

/*==產品介紹===================================================================*/
.prod-box{ padding-bottom:10px; padding-top:10px;display: flex;flex-wrap:wrap;}
.prod-box h2,.prod-box h3{ width:100%; margin-top: 10px;margin-bottom: 10px;}
.prod{ position:relative; margin-bottom:10px;}
.prod-box .line1{border-bottom:1px solid #939393; margin: 5px 0}
.prod > .prod-text{width:100%; text-align:center; padding:2%;color:#000;font-weight:600; letter-spacing:1px;}
.prod-box h4{ display:block; width:100%; margin-top:3%; font-weight:600}

.download-pdf{text-align:center; width: 98%; padding:2% 1%; background-color: #4B4B4B; color: #fff;border-radius: 3px; margin-bottom: 20px}
.download-pdf:hover{background-color: #111111;}
.download-pdf a{color: #fff}

.download-pdf-comp{text-align:center; width: 10%; padding:1% 0.5%; background-color: #e60012; color: #fff;border-radius: 10px; margin-bottom: 20px; float: right;font-weight: 600;font-size: 18px;box-sizing: border-box}
.download-pdf-comp a{color: #fff;display: block}
.download-pdf-comp:hover {background-color: #eee;color: #e60012}
.download-pdf-comp:hover a{color: #e60012}
.download-pdf-comp a:hover{color: #e60012}
@media (max-width:767px){
	.download-pdf-comp{width: 100%;padding:3% 0.5%;	}
	
}



/*==leftemenu===================================================================*/
#menu{
	margin:0px; padding:0px;
	}
#menu h4{
	padding-bottom: 5px;
	color:#fff; font-size:16px; font-weight:bold;letter-spacing:1px;
	padding: 10px 5px;
	cursor: pointer;
	background-color: #143a7b;
	margin-bottom: 5px; margin-top:10px;}
#menu ul{ margin: 0; padding: 0;}
#menu li{list-style-type: none;}
#menu li i{color: #143a7b; margin-right: 5px;}	
#menu li a{
	color: #000; letter-spacing:0.5px;font-size:15px; padding: 3px 0px 3px 5px; display: block;position: relative;
	border-bottom: 1px dashed #555;}
#menu li a:hover{
	color: #143a7b;
	}
#menu li .active,#menu li .active:hover{
	background-color: rgba(83,165,248,0.3);
	color: #000;
	}
#menu li .active::before{
	left:1px;
	position: absolute;
    color: #fff;
	}
.menu_style{
	display:none;
	}
.menu_style li{
	list-style-type: none;
	}
/*側邊選單*/
.side-nav{ position: fixed; top:105px; right:25px; z-index:9999;}
.side-nav ul{ margin:0; padding:0}
.side-nav ul li{ list-style-type:none;margin-bottom:10px;text-align:center; vertical-align:middle;}
.side-nav ul li a{ display:block;color:#fff;  }

@media (max-width: 480px){
	.side-nav{top:230px; }
	
}
/*首頁link*/
.index-link-slide{ background-image:url(../images/symbol/bg1.jpg); background-position:center center; background-repeat:no-repeat; background-size:cover; width:100%; padding:2% 0;}
.link-box{margin-bottom: 10px;box-shadow:0 0 10px #7d7d7d;}
.linkbox-height{ position: relative;overflow: hidden; box-sizing: border-box;width: 100%;height: 0;padding-top: 100%}/*圖片的高度，自動等比縮放*/
.linkimg{ position: absolute;top: 0;bottom: 0;left: 0;right: 0;max-width: 100%; max-height: 100%;margin: auto;width:100%; height:100%; background-position:center center; background-repeat:no-repeat;background-color: #fff;background-size: contain;}
.linkimg:hover{opacity: 0.9}
.link-box a h4 {background-color:rgba(0,71,157,1.0); color:#fff; text-align:center; margin:0; padding:10px 15px; width:100%;font-size: 16.5px}
.link-box a:hover h4 {background-color:rgba(0,71,157,0.7);}
