@import url("reset.css");
@import url("un-reset.css");

@charset "utf-8";
/* CSS Document */
#wrapper{}
#clear {clear:both; }
body{color:#000; font:normal 14px/1.5 Verdana, "微軟正黑體", sans-serif;}
.mv{ -webkit-transition:all 0.8s; -moz-transition:all 0.8s; -ms-transition:all 0.8s; o-transition:all 0.8s; transition:all 0.8s;}
a { color:inherit;}


/*====== HEADER ======*/
.topnav{max-width:1000px; margin:0px auto; overflow:hidden; clear:both;}
.topnav li{width:90px; color:#FFF; text-align:center; float:right;}
.topnav li.lan_en{background:#cc0000;}
.topnav li.lan_cht{background:#f18200}
.topnav li a{width:100%; height:100%; display:block; color:inherit;}
.topnav li a:hover{background:#6d6d6d;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;}

header{max-width:1000px; margin:10px auto 0px auto; overflow:hidden;}
.logo{width:260px; height:75px;  background:url(../images/logo.jpg) no-repeat center; float:left; }
.logo a {width:100%; height:100%; text-indent:-9999px; display:block; color:inherit;}


/*====== NAVIGATION ======*/
nav{width:70%; float:right; overflow:hidden;}
nav ul{position:absolute; z-index:9999; }
nav li.l1{background:url(../images/icon001.png) no-repeat center 10px;}
nav li.l2{background:url(../images/icon002.png) no-repeat center 10px;}
nav li.l3{background:url(../images/icon003.png) no-repeat center 10px;}
nav li.l4{background:url(../images/icon004.png) no-repeat center 10px;}
nav li.l5{background:url(../images/icon005.png) no-repeat center 10px;}
nav li.l6{background:url(../images/icon006.png) no-repeat center 10px;}
nav li.l7{background:url(../images/icon007.png) no-repeat center 10px;}

/*Create a horizontal list with spacing*/
nav li{display:inline-block; float:left;}
/*Style for menu links*/
nav li a{padding:45px 20px 10px; display:block; text-align:center; color:#000;}
nav li a:hover{background:url(../images/icon008.png) no-repeat center bottom;}
nav li a.l8{background:url(../images/icon008.png) no-repeat center bottom;}
/*Hover state for top level links*/
nav li:hover a{color:#cc0000; font-weight:bold;}
/*Style for dropdown links*/
nav li:hover ul a{background:#f18200; color:#fff; padding:10px 20px;}
/*Hover state for dropdown links*/
nav li:hover ul a:hover{background:#cc0000;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;}
/*Hide dropdown links until they are needed*/
nav li ul{display:none;}
/*Make dropdown links vertical*/
nav li ul li{display:block; float:none;}
/*Prevent text wrapping*/
nav li ul li a{width:100%; height:100%; display:block; color:inherit;}
/*Display the dropdown on hover*/
nav ul li a:hover + .hidden, .hidden:hover{display: block;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;}
/*Style 'show menu' label button and hide it by default*/
.show-menu {background:#f18200; color:#fff; text-align:center; padding:5px 0; display:none;}
/*Hide checkbox*/
input[type=checkbox]{display:none; -webkit-appearance:none;}
/*Show menu when invisible checkbox is checked*/
input[type=checkbox]:checked ~ #menu{display: block;}
/*third*/
nav li ul li{position:relative;}
nav li ul ul{width:100%; position:absolute; top:1px; left:99%; display:none;}
nav li:hover ul ul a{background:#ffad4c;}
nav li ul li:hover ul{display:block;}



/*====== BANNER ======*/
#banner{max-width:1000px; margin:0px auto; overflow:hidden; border-top:5px #f18200 solid;}
#banner img{width:100%;}
/*====== BANNER ======*/
#owl-demo{max-width:1000px; margin:0px auto; overflow:hidden; border-top:5px #f18200 solid; }
#owl-demo .item img{width:100%; height:auto; margin:0px auto; overflow:hidden; display:block;}
/* display none until init */
.owl-carousel{display: none;position: relative;width: 100%;-ms-touch-action: pan-y;}
.owl-carousel .owl-wrapper{display: none;position: relative;-webkit-transform: translate3d(0px, 0px, 0px);}
.owl-carousel .owl-wrapper-outer{overflow: hidden;position: relative;width: 100%;}	
.owl-carousel .owl-item{float: left;}
.owl-controls .owl-page,.owl-controls .owl-buttons div{ display:none;cursor:pointer;}
/* Styling Pagination*/
.owl-theme .owl-controls .owl-pagination{text-align:center;}
.owl-theme .owl-controls .owl-page{display:inline-block;zoom:1;*display:inline;/*IE7 life-saver */ }
.owl-theme .owl-controls .owl-page span{width:10px; height:10px;margin: 0px 5px;display:block;background:#cc0000;-webkit-border-radius:20px;-moz-border-radius:20px;border-radius:20px;	filter: Alpha(Opacity=50);/*IE7 fix*/opacity: 0.5;}
.owl-theme .owl-controls .owl-page.active span, .owl-theme .owl-controls.clickable .owl-page:hover span{filter: Alpha(Opacity=100);/*IE7 fix*/opacity: 1;}


/*====== CONTAINER ======*/
#container{max-width:1000px; margin:20px auto; overflow:hidden;}


/*====== SIDEBAR ======*/
.sidebar{float:left; width:22%;}
.sidebar li{color:#000; background:#CCC url(../images/sidebar.jpg) repeat-y 10px 0px; margin-bottom:3px;}
.sidebar li.on{color:#fff;
background:url(../images/sidebar.jpg) repeat-y 10px 0px,l inear-gradient(top,#f18200,#d00001);
background:url(../images/sidebar.jpg) repeat-y 10px 0px,-o-linear-gradient(top,#f18200,#d00001);
background:url(../images/sidebar.jpg) repeat-y 10px 0px,-ms-linear-gradient(top,#f18200,#d00001);
background:url(../images/sidebar.jpg) repeat-y 10px 0px,-moz-linear-gradient(top,#f18200,#d00001);
background:url(../images/sidebar.jpg) repeat-y 10px 0px,-webkit-linear-gradient(top,#f18200,#d00001)}
.sidebar li:hover{color:#fff;
background:url(../images/nav.jpg) repeat-x 0px 0px;}
.sidebar li.Sub_BG02:hover{color:#fff; background:#d00001;}
.sidebar li a{width:100%; height:100%; display:block; color:inherit; padding:10px 10px 10px 20px;}
.sidebar li.Sub_BG02{color:#fff; background:#f18200;}
.sidebar li.Sub_BG02 a{width:100%; height:100%; display:block; color:inherit;}

.sidebar li ul{display:none; top:100%;}
.sidebar li:hover ul{display:block; background:#FFF; right:0; left:0; top:100%; z-index:2;}

.tinynav{display:none }
.sidebar select{width:100%; padding:3px;border-radius:4px; box-shadow: 0 2px 0 #ccc, 0 -1px #fff inset;
background: #f8f8f8; color:#333; border:none; outline:none; display: inline-block;
-webkit-appearance:none; -moz-appearance:none; appearance:none; cursor:pointer;
background:linear-gradient(top,#fff,#f18200);
background:-o-linear-gradient(top,#fff,#f18200);
background:-ms-linear-gradient(top,#fff,#f18200);
background:-moz-linear-gradient(top,#fff,#f18200);
background:-webkit-linear-gradient(top,#fff,#f18200);
}
.sidebar select{display:none }
.sidebar label{position:relative}


/*====== CONTENT ======*/
.content01{float:right; width:77%;}
.content02{width:100%;}
.title02{font:bold 18px/1.5 Verdana, "微軟正黑體", sans-serif; color:#cc0000; background:url(../images/title.jpg) no-repeat center right; padding:6px 10px;}
.textarea{padding:2%;}
/*  history  */
.history{ overflow:hidden;}
.history .year{width:10%; min-height:80px; font:bold 16px/1.5 Verdana, "微軟正黑體", sans-serif; color:#cc0000; background:url(../images/year.png) no-repeat top right; float:left;}
.history img{width:15%; margin:0px 0px 0px 3%;}
.history .history_content{width:71%; float:right;}
/*  news  */
.news li{background:url(../images/news.png) no-repeat bottom; color:#000; padding-bottom:10px; overflow:hidden;}
.news li:hover .news_text span{color:#f18200;}
.news li a{color:inherit;}
.news li li{background:none;}
.news li li.news_img{width:15%;float:left;}
.news li li.news_img img{width:100%; height:auto;}
.news li li.news_text{width:83%; float:right;}
/*  location  */
.location{overflow:hidden;}
.location li{width:31.3%; margin:0px 1%; float:left;}
.location li a{font:bold 16px/1.5 Verdana, "微軟正黑體", sans-serif; color:#000;}
.location li a:hover{color:#f18200;}
.location li iframe{width:100%; height:300px; margin-top:10px;}
/*  product  */
.product{overflow:hidden;}
.product li{width:31.3%; margin:1%; background:url(../images/product.png) no-repeat bottom; padding-bottom:15px;  text-align:center; float:left;}
.product li img{width:100%; height:auto;}
.product li a{color:inherit;}
.product li a:hover{color:#f18200;}
/*  product_detail  */
.product_detail{overflow:hidden;}
.product_img{width:60%; float:left;}
.product_img img{width:100%; height:auto;}
.product_img span img{width:31.3%; height:auto; margin:1%; border:#CCC 1px solid;}
.product_text{width:38%; float:right;}
/*  faq  */
.faq{border-bottom:1px #ccc solid; padding-bottom:10px; margin-bottom:10px;}
.faq a{color:inherit;}
.faq .Q{color:#fff; background:#cc0000; padding:0px 3px;}
.faq .A{color:#fff; background:#f18200; padding:0px 3px;}
/*  carrer  */
.carrer li{border-bottom:1px #ccc solid; padding:5px 0px; overflow:hidden;}
.carrer li:hover{color:#cc0000;}
.carrer li.title{font:bold 16px/1 Verdana, "微軟正黑體", sans-serif; color:#f18200;}
.carrer li span{width:32%; padding:0px 0.6%; float:left;}
.carrer a{ color:inherit;}
/*  contact  */
.contact{display:table; width:100%;}
.contact_tr{display:table-row;}
.contact_td{display:table-cell; padding:2.5px 0px; margin-bottom:2px;vertical-align:top;}
.t1{width:50px;}
.t2{width:200px;}
.t3{width:864px;}
.contact input, .contact textarea{padding:2.5px 0px;}
.t2 input{width:90%;}
.t3 input, .t3 textarea{width:100%;}


/*== pagenum ==*/
.pagenum{width:100%; color:#ccc; margin-top:20px; float:right; clear:both;}
.pagenum table{width:50%}
.pagenum a{color:#666;}
.pagenum a:hover{color:#f18200}
.pagenum a.on{color:#f18200; font-weight:bold}
.pagenum .btnnum a{margin:0px 5px}
.pagenum .btnleft a{padding-left:0; width:20px; height:20px; background:url(../images/listbtn.png) -40px 0px; display:block; text-indent:-9999px}
.pagenum .btnleft a:hover{width:20px; height:20px; background:url(../images/listbtn.png) -40px -20px}
.pagenum .btnright a{padding-left:0;width:20px; height:20px;background:url(../images/listbtn.png) -60px 0px; display:block; text-indent:-9999px}
.pagenum .btnright a:hover{ width:20px; height:20px;background:url(../images/listbtn.png) -60px -20px}
.pagenum .btnleftpage a{padding-left:0; width:20px; height:20px;background:url(../images/listbtn.png) -0px -0px; display:block; text-indent:-9999px}
.pagenum .btnleftpage a:hover{ width:20px; height:20px;background:url(../images/listbtn.png) -0px -20px}
.pagenum .btnrightpage a{padding-left:0;width:20px; height:20px;background:url(../images/listbtn.png) -20px -0px; display:block; text-indent:-9999px}
.pagenum .btnrightpage a:hover{ width:20px; height:20px;background:url(../images/listbtn.png) -20px -20px;}
.pagenum .center a{background:none; padding-left:0;}


/*====== SITEMAP ======*/
#sitemap{background:#999; padding:10px 0px; color:#fff;}
.sitemap{max-width:1000px; margin:0px auto; overflow:hidden;}
.sitemap li.title{width:20%; padding:10px 1px; display:inline-block; *display:inline; zoom:1; vertical-align:top;}
.sitemap li.title ul{margin-top:10px;}
.sitemap a{color:inherit;}
.sitemap a:hover{}


/*====== FOOTER ======*/
footer{background:#585759 url(../images/footer.png) no-repeat right top; border-top:5px #f18200 solid; }
footer ul li{ margin:0px 1%; width:30%; display:inline-block; vertical-align:top;}
.footer{max-width:1000px; margin:0px auto;  color:#FFF; padding:10px 0px;  position:relative;}
.iware{color:#ccc; text-align:right; position:absolute; right:0px; bottom:10px;}
.iware a{color:#ccc; font-size:10px;}

.red{color:#cc0000;}
.red a{color:inherit;}
.orange{color:#f18200;}
.submit{width:100px; background:#f18200 ;border:none; color:#fff; cursor:pointer;}
.reset{width:100px; background:#717171 ;border:none; color:#fff; cursor:pointer;}
.submit:hover, .reset:hover{background:#cc0000;}
.back{ background:#f18200; border:none; color:#fff; float:right; cursor:pointer;}
.back a{width:100%; height:100%; display:block; padding:5px 20px; color:inherit;}
.back a:hover{background:#cc0000;}


@media only screen and (min-width: 660px) and (max-width: 1020px) {
/*====== NAVIGATION ======*/
/*Style for menu links*/
nav li a{padding:50px 9px 10px; display:block; text-align:center; color:#000;}
/*====== CONTENT ======*/
/*  history  */
.history .year{width:15%;}
.history img{width:15%;}
.history .history_content{width:66%;}
/*  contact  */
.t3{width:600px;}
/*====== SITEMAP ======*/
.sitemap li.title{width:19%;}
}
@media only screen and (max-width: 640px) {
/*====== NAVIGATION ======*/
/*Style for menu links*/
nav li a:hover{background:#f18200; color:#cc0000;}
/*====== HEADER ======*/
.logo{width:100%;}
/*====== NAVIGATION ======*/
nav{width:100%; float:none;}
/*Make dropdown links appear inline*/
nav ul {position:static; display:none; clear:both;}
/*Create vertical spacing*/
nav li {margin-bottom: 1px;}
/*Make all menu links full width*/
nav ul li, nav li a {width: 100%;}
/*Display 'show menu' link*/
.show-menu {display:block; cursor:pointer;}

nav li a{padding:10px 0px; text-align:center; color:#fff; background:#f18200;}
nav li.l1{background:none;}
nav li.l2{background:none;}
nav li.l3{background:none;}
nav li.l4{background:none;}
nav li.l5{background:none;}
nav li.l6{background:none;}
nav li.l7{background:none;}
nav li:hover ul a{background:#cc0000; color:#fff; padding:10px 20px;}
/*====== CONTAINER ======*/
/*  history  */
.history .year{width:15%;}
.history img{width:15%;}
.history .history_content{width:66%;}
/*  location  */
.location li{width:100%; float:none;}
/*  contact  */
.t3{width:600px;}
/*====== SIDEBAR ======*/
.sidebar{float:none; width:100%;padding-bottom:10px;}
#M-smenu{display:none;}
.sidebar select{display: block }
.tinynav {display:block;}
/*====== CONTENT ======*/
.content01{width:100%; float:none;}
}
/*Styles for screen 515px and lower*/
@media only screen and (max-width : 480px) {
/*====== SIDEBAR ======*/
#M-smenu{display:none;}
/*====== SIDEBAR ======*/
.sidebar{width:100%; float:none;}
/*====== CONTAINER ======*/
#container .news ul li p{width:60%;}
/*  news  */
.news li li.news_img{width:30%;float:left;}
.news li li.news_text{width:68%; float:right;}
/*  product  */
.product li{width:48%;}
/*  product_detail  */
.product_img{width:100%; float:none;}
.product_text{width:100%; float:none;}
/*  contact  */
.contact{display:table; width:100%;}
.contact_tr{display:block;}
.contact_td{display:block;}
.t1{width:100%;}
.t2{width:100%;}
.t3{width:100%;}
.t2 input{width:100%;}
.btn{text-align:center;}
/*== pagenum ==*/
.pagenum table{width:100%}
/*====== SITEMAP ======*/
.sitemap li.title{width:25%;}
/*====== FOOTER ======*/
footer ul li{width:95%;}
.iware{position:relative; display:block;}
}
/*Smartphone*/
@media only screen and (max-width : 330px) {
/*====== CONTAINER ======*/
#container .news ul li p{width:50%;}
}