@charset "utf-8";
/* CSS Document */

/*Title:   Main Template Css File
Author:  http://themeforest.net/user/lorthemes // Bogdan Laurentiu  */
@import url(http://fonts.googleapis.com/earlyaccess/notosanstc.css); /* font-family: 'Noto Sans TC', sans-serif; */

/* Reset CSS */


/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}


body {
	font-family: 'Open Sans', 'Noto Sans TC', '微軟正黑體', sans-serif;
	font-size: 15px;
	line-height: 1.7;
	color: #333;
	font-weight:400;
	letter-spacing: 1px;
	background-color: #FFFFFF;
}

::selection {
	background-color: #00622B;
	color: #fff;
}



/* Typography */
a {
	transition:all 0.2s;
	color: #444;	
}
a:hover {
	text-decoration: none;
	color: #009441;
}
a:hover img {
filter:alpha(opacity=80);       /* IE */
-moz-Chroma:0.8;              /* Moz + FF */
          /* opacity: 0.8;  支持CSS3的瀏覽器（FF 1.5也支持）*/

}
h1, h2, h3, h4, h5, h6 {margin-bottom: 20px;}
p {
	color: #333;
	margin-bottom: 15px;
}

/* Lists */
ul, ol {margin-top: 0; margin-bottom: 10px; list-style-type: disc; padding-left: 40px; }
ol {list-style-type: decimal;}
.reset-list,
.reset-list ul,
.reset-list ol {margin:0; padding:0; list-style: none; }
.reset-list2,
.reset-list2 ul,
.reset-list2 ol {list-style: none; }

ul.styled-list li:before { content: "\f105"; font-family: 'icomoon'; color: #DCCA61; font-size: 11px; margin-right: 5px;}
ul.styled-list li ul li:before { content: "\f105"; font-family: 'icomoon'; color: #DCCA61; font-size: 11px; margin-right: 5px;}
ul.styled-list li ul li { list-style: none;}
ul.styled-list { list-style: none;}
ol.styled-list { list-style: none;}

/* Tooltip */
.tooltip-test + .tooltip > .tooltip-inner {background-color: #DCCA61; border-radius: 0; padding: 6px 10px;}
.tooltip.top .tooltip-arrow {border-top-color: #DCCA61; }


h1.section-title {
	font-weight: 400;
	color: #DCCA61;
	font-size: 22px;
	line-height: 30px;
	margin: 0;
}
h2.section-title {
	font-weight: 300;
	color: #BDA351;
	font-size: 24px;
	line-height: 35px;
	margin-bottom: 15px;
	
}
h2.section-title2 {font-weight: 300; color: #fff; font-size: 30px; line-height: 35px; margin-bottom: 10px;}
h2.section-title3 {font-weight: 300; color: #161616; font-size: 26px; line-height: 30px;}
h4.section-subtitle {color: #a1a1a1; font-size: 16px; line-height: 20px;}
h2.shop-title { font-size: 70px; font-weight: 300; color: #3d3d3d; line-height: 70px;}
h3.shop-title {font-size: 45px; font-weight: 300; color: #3d3d3d; line-height: 50px; }
h3.section-title {font-weight: 300; color: #161616; font-size: 26px; line-height: 30px;}

.feature-title { font-size: 45px; line-height: 50px;}


/* Padding/Margin/Colors */
.tcolor {
	color: #003399 !important;
}
.gray { color: #a1a1a1;}
.black { color: #161616 !important;}
.white { color: #fff;}
.center { text-align: center;}
.left { text-align: left;}
.right { text-align: right;}
.fleft { float: left;}
.fright { float: right;}
.inline-block { display: inline-block;}
.block { display: block;}
.italic { font-style: italic;}
.rounded { border-radius: 50%;}
.width100 { width: 100%;}
.thin-shadow { box-shadow: 0 1px 1px rgba(0,0,0,0.15);}
.relative { position: relative !important;}

.weight300 { font-weight: 300;}

.size17 { font-size: 17px !important; line-height: 22px !important;}
.size18 { font-size: 18px !important;}
.size20 { font-size: 20px !important;}

.l30 { line-height: 30px;}

.bg-white { background-color: #fff !important;}

.ptop5 { padding-top: 5px;}
.ptop10 { padding-top: 10px;}
.ptop15 { padding-top: 15px;}
.ptop20 { padding-top: 20px;}
.ptop30 { padding-top: 30px;}
.ptop50 { padding-top: 50px;}
.ptop60 { padding-top: 60px;}
.ptop100 { padding-top: 100px;}
.pbottom5 { padding-bottom: 5px;}
.pbottom10 { padding-bottom: 10px;}
.pbottom15 { padding-bottom: 15px;}
.pbottom20 { padding-bottom: 20px;}
.pbottom30 { padding-bottom: 30px;}
.pbottom50 { padding-bottom: 50px;}
.pbottom70 { padding-bottom: 70px;}
.pbottom80 { padding-bottom: 80px;}
.pright0 { padding-right: 0;}
.pright15 { padding-right: 15px;}
.pright30 { padding-right: 30px;}
.pleft0 { padding-left: 0;}
.pleft15 { padding-left: 15px;}
.pleft30 { padding-left: 30px;}

.mauto { margin: 0 auto;}
.m0 { margin: 0 !important;}
.mtop5 { margin-top: 5px;}
.mtop10 { margin-top: 10px;}
.mtop20 { margin-top: 20px;}
.mtop25 { margin-top: 25px;}
.mtop30 { margin-top: 30px;}
.mtop40 { margin-top: 40px;}
.mtop50 { margin-top: 50px;}
.mtop70 { margin-top: 70px;}
.mtop100 { margin-top: 100px !important;}
.mtop106 { margin-top: 106px !important;}
.mtop130 { margin-top: 130px !important;}
.mbottom0 { margin-bottom: 0 !important;}
.mbottom5 { margin-bottom: 5px !important;}
.mbottom10 { margin-bottom: 10px !important;}
.mbottom15 { margin-bottom: 15px !important;}
.mbottom20 { margin-bottom: 20px !important;}
.mbottom25 { margin-bottom: 25px !important;}
.mbottom30 { margin-bottom: 30px !important;}
.mbottom35 { margin-bottom: 35px !important;}
.mbottom40 { margin-bottom: 40px !important;}
.mbottom50 { margin-bottom: 50px !important;}
.mbottom60 { margin-bottom: 60px !important;}
.mbottom70 { margin-bottom: 70px !important;}
.mbottom80 { margin-bottom: 80px !important;}
.mbottom90 { margin-bottom: 90px !important;}
.mbottom100 { margin-bottom: 100px !important;}
.mleft5 { margin-left: 5px;}
.mleft10 { margin-left: 10px;}
.mleft15 { margin-left: 15px;}
.mleft20 { margin-left: 20px;}
.mleft30 { margin-left: 30px;}
.mleft50 { margin-left: 50px;}
.mleft60 { margin-left: 60px;}
.mleft65 { margin-left: 65px;}
.mleft80 { margin-left: 80px;}
.mleft85 { margin-left: 85px;}
.mleft90 { margin-left: 90px;}
.mleft160 { margin-left: 160px;}
.mleft230 { margin-left: 230px;}
.mleft240 { margin-left: 240px;}

.mright5 { margin-right: 5px;}
.mright10 { margin-right: 10px;}
.mright15 { margin-right: 15px;}
.mright20 { margin-right: 20px;}
.mright25 { margin-right: 25px;}
.mright30 { margin-right: 30px;}



.line {display: inline-block; width: 50px; border: solid 1px #DCCA61; margin-bottom: 50px;}


.radius50 { border-radius: 50%;}

.animation {-webkit-transition: all 0.2s ease-out;
-moz-transition: all 0.2s ease-out;
-o-transition: all 0.2s ease-out;
transition: all 0.2s ease-out;}

.spin {
  -webkit-animation: spin 2s infinite linear;
  -moz-animation: spin 2s infinite linear;
  -o-animation: spin 2s infinite linear;
  animation: spin 2s infinite linear;
}

.separator {
	display: block;
	border: 1px dotted #CCCCCC;
}

#page-wrapper {
	background-color: #000;
}
/* GLOBAL STYLES
-------------------------------------------------- */
/* Padding below the footer and lighter body text */

/* 主選項 CUSTOMIZE THE NAVBAR
-------------------------------------------------- */

/* Special class on .container surrounding .navbar, used for positioning it into place. */
.navbar-wrapper {
  position:fixed;
  top: 0;
  right: 0;
  left: 0;
  z-index: 200;

}



/* Flip around the padding for proper display in narrow viewports */
.navbar-wrapper > .container {
	position:relative;
    padding-right: 0;
  	padding-left: 0;
}

.container > .navbar-header{
	margin-right: 0;
}

.navbar-wrapper .navbar {
  padding-right: 0px;
  padding-left: 0px;
}
.navbar-wrapper .navbar .container {
  width: auto;
}


/* 主圖輪播CUSTOMIZE THE CAROUSEL
-------------------------------------------------- */
/* Callback example */


.indexswf{
	max-height: 641px;
	margin-bottom: 30px;
}

.events {
  list-style: none;
  }

.callbacks_container {
	position: relative;
	float: left;
	width: 100%;
  }

.callbacks {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  padding: 0;
  margin: 0;
  }

.callbacks li {
  position: absolute;
  width: 100%;
  left: 0;
  top: 0;
  }

.callbacks img {
  display: block;
  position: relative;
  z-index: 1;
  height: auto;
  width: 100%;
  border: 0;
  }

.callbacks .caption {
  display: block;
  position: absolute;
  z-index: 2;
  font-size: 20px;
  text-shadow: none;
  color: #fff;
  background: #000;
  background: rgba(0,0,0, .8);
  left: 0;
  right: 0;
  bottom: 0;
  padding: 10px 20px;
  margin: 0;
  max-width: none;
  }

.callbacks_nav {
	position: absolute;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	left:15px;
	opacity: 0.7;
	z-index: 3;
	text-indent: -9999px;
	overflow: hidden;
	text-decoration: none;
	height: 61px;
	width: 38px;
	margin-top: -45px;
	background-color: transparent;
	background-image: url(../themes.gif);
	background-repeat: no-repeat;
	background-position: left top;
  }

@media (min-width: 1200px) {
	.callbacks_nav { top: 55%; }
}

@media (min-width: 992px) and (max-width: 1199px) {
	.callbacks_nav { top: 60%; }
}

@media (min-width: 768px) and (max-width: 991px) {
	.callbacks_nav { top: 60%; }
}

@media (min-width: 480px) and (max-width: 767px) {
	.callbacks_nav { top: 65%; }
}

@media screen and (max-width: 479px) {
  .callbacks_nav { top: 75%; left:0; }
}

.callbacks_nav:active {
  opacity: 1.0;
  }

.callbacks_nav.next {
  left: auto;
  background-position: right top;
  right:15px;
}
@media screen and (max-width: 479px) {
.callbacks_nav.next {
  right:0;
}
}

#slider3-pager a {
  display: inline-block;
}

#slider3-pager img {
  float: left;
}

#slider3-pager .rslides_here a {
  background: transparent;
  box-shadow: 0 0 0 2px #666;
}

#slider3-pager a {
  padding: 0;
}



.rslides {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  padding: 0;
  
}
  
@media (min-width:992px) {
.rslides {
	margin:130px 0 0;
}
}

@media (min-width:768px) and (max-width:991px){
.rslides {
	margin:125px 0 0;
}
}

@media (max-width:767px){
.rslides {
	margin:110px 0 0;
}
}




.rslides li {
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
  width: 100%;
  left: 0;
  top: 0;

  }

.rslides li:first-child {
  position: relative;
  display: block;
  float: left;
  }

.rslides img {
  display: block;
  height: auto;
  float: left;
  width: 100%;
  border: 0;
  }




/* FOOTER */
footer{
	color: #0e0e0e;
	background:url(../bg03.jpg);
	padding:60px 0 30px 0;
}

@media (max-width:767px){
footer{
	text-align: center;	
	padding:30px 15px 10px 0;
}
	
footer h4{
	color: #263745;
	text-align: center;	
}

footer p{
	color: #0e0e0e;
	margin-bottom: 10px;
	text-align: center;	
}

}


footer h4{
}

footer p{
	color: #0e0e0e;
	margin-bottom: 10px;
}

footer a{
	color: #0e0e0e;
}

footer dl {
    width: calc(100%/5);
    float: left;
    padding: 0 10px;
    box-sizing: border-box;
}
footer dl:nth-of-type(5n+1) {
   clear: left;
}

@media (max-width:767px){
   footer dl {
      width: calc(100%/3);
   }
   footer dl:nth-of-type(3n+1) {
      clear: left;
   }
   footer dl:nth-of-type(5n+1) {
      clear: none;
   }
}

footer dl dt {
	width: 100%;
    font-weight: 500;
	margin-bottom: 25px;
	
}

footer dl dt a{
   color: #1aa93a;
}

footer dl dd {
	width: 100%;
	margin-bottom: 10px;
	font-weight: 400;
}

footer dl dd a{
   color: #666;
}


.copyright{
	color:#fff;
	font-size:12px;
	text-align:center;
	padding:20px 15px;
	margin:0;
	background: #59a13c;
}
.copyright a:link, .copyright a:visited {
	color:#fff;
}
.copyright a:hover {
	color:#BEE0BC;
}





























/* Header */
#header {
	background-color: #000;
	min-height: 100px;
	position: fixed;
	top: 0;
	transition: top 0.2s ease-in-out;
	width: 100%;
	z-index: 100;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
	background-image: url(../nav_bg.jpg);
	background-repeat: no-repeat;
	background-position: center top;
}


#header.nav-up  { top: -200px; }
#header.nav-up.sticky { top: 0;}


/* 回頂端top button */
#back-top { position: fixed; bottom: 30px; right: 15px; background: #DCCA61; border-radius: 4px; 
border-bottom: solid 2px #958213; }
#back-top a { color: #fff; padding: 5px 13px; line-height: 30px;}
#back-top:active { border-bottom: none;}


/*最新消息 */
.indexnews{	}
.indexnews dl{

	float: left;
	width: 100%;
	margin-bottom: 10px;
	padding-bottom: 10px;
}
.indexnews dt{
	float: left;
	overflow: hidden;
	clear: left;
	text-align: right;
	text-overflow: ellipsis;
	white-space: nowrap;
	color: #FFF;
	background-color: #666;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	padding-top: 3px;
	padding-right: 15px;
	padding-bottom: 3px;
	padding-left: 15px;
	margin-right: 20px;
	line-height: 20px;

}
.indexnews dd{ float: left;
	 }




/* News & download */
.newsbox {
	float: left;
	width: 100%;
	visibility: visible;
	margin-bottom: 25px;
	text-decoration: none;
	background: url(../profile_08-2.png) , #f7f7f7;
	border-top: 2px solid #3EA338;
	border-bottom: 1px solid #f2f2f2;
	border-radius: 2px 2px 0 0;
}
.news-d2 {
	line-height: 17px;
	font-weight: bold;
	color: #777777;
	text-align: center;
	float: left;
	width: 14%;
	visibility: visible;
	background-image: url(../line15.gif);
	background-repeat: repeat-y;
	background-position: right;
	padding: 13px 0 11px 0;
	
}
.news-t2 {
	line-height: 17px;
	font-weight: bold;
	color: #777;
	text-align: center;
	float: left;
	width: 86%;
	visibility: visible;
	padding: 13px 0 11px 0;
}
.newslist dl{
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #CCC;
	float: left;
	width: 100%;
	margin-bottom: 20px;

		padding: 0 5px 10px 5px;
	box-sizing: border-box;
	
}
.newslist dt{
	float: left;
	overflow: hidden;
	clear: left;
	text-align: right;
	text-overflow: ellipsis;
	white-space: nowrap;
	color: #FFF;
	font-weight: 400;
	background-color:#696969;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
    padding: 5px 42px;
	margin: 0 20px 10px 0;
	line-height: 20px;

}
.newslist dd{ 
float: left;
padding-top: 4px;
margin-bottom: 10px;
}

.newslist a{
}
.newslist3 {
	padding: 0px;
	float: left;
	width: 100%;
	margin: 0px;
	background: url(../profile_08-2.png);
}
.newslist3 dl {
	width: 100%;
	margin: 0px;
	float: left;
	padding: 20px 20px;
	box-sizing: border-box;
}
.newslist3 dt {
	float: left;
    clear: left;
    color: rgb(255, 255, 255);
    font-weight: 400;
    background-color: rgb(105, 105, 105);
    line-height: 20px;
    overflow: hidden;
    border-radius: 5px;
    padding: 3px 43px;
    margin: 0px 20px 20px 0px;
}

.newslist3 dd {
	float: left;
	margin: 0;
	font-size: 16px;
	line-height: 26px;
	font-weight: 400;
	color: #000;
	width: 100%;
}
.newscontent {
	clear: both;
	margin-left: 0;
	width: 100%;
	display: block;
	padding-top: 35px;
	padding-bottom: 35px;
	border-bottom:1px solid #BBBBBB;
}
.newscontent p {
	margin: 0px;
	padding-top: 12px;
}




.downloadbox {
	float: left;
	width: 100%;
	visibility: visible;
	margin-bottom: 25px;
	text-decoration: none;
	background-image: url(../newstitlebg.png);
	background-repeat: repeat;
	border-top: 2px solid #3EA338;
	border-bottom: 1px solid #f2f2f2;
	border-radius: 2px 2px 0 0;
}
.download-d2 {
	line-height: 17px;
	font-weight: bold;
	color: #777777;
	text-align: center;
	float: left;
	width: 14%;
	visibility: visible;
	background-image: url(../line15.gif);
	background-repeat: repeat-y;
	background-position: left;
	padding: 13px 0 11px 0;
	
}
.download-t2 {
	line-height: 17px;
	font-weight: bold;
	color: #777;
	text-align: center;
	float: left;
	width: 86%;
	visibility: visible;
	padding: 13px 0 11px 0;
}

.downloadlist dl {
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #CCC;
	float: left;
	width: 100%;
	margin-bottom: 20px;
	padding: 0 5px 10px 5px;
	box-sizing: border-box;
}
.downloadlist dt {
	float: left;
	clear: left;
	text-align: left;
	color: #444;
	font-weight: 400;
	padding: 10px 0 10px 0;    
	margin-right: 15px;
	line-height: 25px;
}

.downloadlist dd{ 
color:#fff;
float: right;
padding: 4px 0 10px 0;
}


.btn-dl  {
	font-size:14px;
	font-family: 'Raleway', '微軟正黑體', sans-serif;
	font-weight:normal;
	border-radius:5px;
	border:1px solid #F2B11C;
	padding:5px 20px;
	background-color:#F2B11C;
	color:#fff;
	display:inline-block;
	width: 100%;
	box-sizing: border-box;
	text-align: center;
	text-transform: uppercase;
}
.btn-dl:hover {
	color:#fff;
	background-color:#FF9E00
}
.btn-dl:active {
	color:#fff;
	background-color:#FF9E00
}




@media screen and (max-width: 1200px) {
.newsbox, .downloadbox {
	display: none;
}
}


/*產品內頁 */
.productpicbig {
	width: 100%;
	float: left;
	display: table-cell;
	text-align: center;
	vertical-align: middle;
}
.productpicbig img{
	
}
/* IE6 hack */
.productpicbig span{
	height:100%; 
	display:inline-block;
	}
 
/* 讓table-cell下的所有元素都居中 */
.productpicbig *{ vertical-align:middle;}


.spic{
	float: left;
	border: 1px solid #CCC;
	padding: 1px;
	height: 90px;
	width: 150px;
	display: table-cell;
	text-align: center;
	vertical-align: middle;
	margin-top: 7px;
	margin-bottom: 7px;
	margin-left: 18px;

}
/* IE6 hack */
.spic span{
	height:100%; 
	display:inline-block;
	}
 
/* 讓table-cell下的所有元素都居中 */
.spic *{ vertical-align:middle;}
.spic img{
	width: 140px;
	height: auto;
}
.productdetail{
	width: 100%;
	float: left;
	margin-top: 10px;
}
.productdetail h2{
	
	border-bottom: 1px dashed #999;
	font-size: 20px;
	font-weight: bold;
	color: #039;
	margin-bottom: 10px;
	line-height: 30px;
}
.productdetail .content{
	margin-left: 15px;
	float: left;
	margin-right: 15px;
	margin-bottom: 15px;
}