@charset "utf-8";
@import url("reset.css");
@import url("loading.css");
/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------------------------------->>> Main <<<------------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

html { height:100% }
body { margin-left: 0px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; -webkit-text-size-adjust:none; font-size:12px; overflow-y:scroll }
body, td, th { font-size:12px; font-family: Arial, "文泉驛正黑", "WenQuanYi Zen Hei", "儷黑 Pro", "Microsoft JhengHei", "新細明體", "PMingLiU", sans-serif; }
.iframe_ch { display:none }
.width100{ width:100%;}
.clear{ clear:both;}
input:focus,textarea:focus{outline: 0;}

/*a { text-decoration:none; color:#231815;}
a:hover { color:#666;}*/

/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> Index <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

#wrapper{position:relative; width:100%; margin:0 auto; max-width:1400px;}
#wrapper .bigtitle{font-size:16px; font-weight:bold; letter-spacing:1px; color:#666}

/*首頁上方*/
#top{ background:url(../../images/top_bg.jpg) repeat-x; height:65px;}
#top ul{margin:0; padding:0; list-style:none; position:absolute; right:0; top:25px;}
#top ul li{ position:relative; float:left; padding-right:20px; display:inline-block; height:40px;}
#top ul li a{font-weight:bold; font-size:14px; color:#FFF; text-decoration:none;}
#top ul li a:hover{ text-decoration:underline;}
#top ul li .div123{position:absolute; top:39px; min-width:250px; overflow:hidden; z-index:999; display:none;}
#top ul li .subDiv123{background:#CCC; color:#666; letter-spacing:1px; overflow:hidden; min-height:40px; line-height:40px; font-family:'微軟正黑體'; font-size:14px; font-weight:bold; padding-left:15px; cursor:hand; cursor:pointer; margin-bottom:1px;}
#top ul li .subDiv123:hover{background:#666; color:#fff;}


#mainMenu{width:100%; right:0; position:absolute; background:#FFF; z-index:99999;}
#mainMenu .menu{ background:#DCF5FA; color:#0FA8EE; border-bottom:1px dotted #3AB5D4; height:44px; line-height:44px; font-family:'微軟正黑體'; font-size:14px; color:#0FA8EE; font-weight:bold; padding-left:15px; cursor:hand; cursor:pointer;}
#mainMenu .menu:hover{background:#47BDD9; color:#fff; border-bottom:1px dotted #3AB5D4; height:44px; line-height:44px; font-family:'微軟正黑體'; font-size:14px; font-weight:bold; padding-left:15px; cursor:hand; cursor:pointer; margin-bottom:1px;}
#mainMenu .subMenu1{background:#333; color:#fff; letter-spacing:1px; height:44px; line-height:44px; font-family:'微軟正黑體'; font-size:14px; font-weight:bold; padding-left:15px; cursor:hand; cursor:pointer; margin-bottom:1px;}
#mainMenu .subMenu1:hover{background:#666;}
#mainMenu .subMenu2{background:#EBEBEB; color:#333; height:44px; line-height:44px; font-family:'微軟正黑體'; font-size:14px; font-weight:bold; padding-left:15px; cursor:hand; cursor:pointer; margin-bottom:1px;}
#mainMenu .subMenu2:hover{ background:#FFF;}

#container{ }
#container .wrap{}
#container .title{display:inline-block; font-size:24px; font-weight:bold; color:#FFF;}
#container .content{ margin-bottom:20px; color:#EBEBEB; font-size:14px; letter-spacing:1px; line-height:30px;}
#container .about{font-size:24px; color:#646464; padding:20px 0; box-sizing: border-box;  letter-spacing:3px;}

#logo_design{background:#222222; min-height:100px;}

#history .title{font-size:24px; color:#646464; padding:80px 0; box-sizing: border-box;  letter-spacing:3px; text-align:center;}
#history .content{ color:#646464; font-size:15px; letter-spacing:1px; line-height:50px; margin-bottom:20px;}

/*首頁下方*/
#footer{ background:#000000; min-height:231px; overflow:hidden;}

#footer_left{ color:#9c9c9c; line-height:20px; letter-spacing:1px; float:left;width: 45%; padding: 0% 0% 1% 0%; box-sizing: border-box; margin-top:20px; overflow:hidden;}
#footer_left span{ display:inline-block; width:80px;}
#footer_right{float:left; width:55%; padding:0% 2%; box-sizing: border-box; line-height:30px; letter-spacing:1px; margin-top:20px;}
#footer_menu1 .bigTitle{ color:#D7D7D7; font-weight:bold; font-size:17px;}
#footer_menu1 a{color:#9c9c9c; text-decoration:none;}
#footer_menu1 a:hover{text-decoration:underline;}
#footer_menu2 { color:#FFFFFD; font-weight:bold; font-size:17px;}
#footer_menu2 a{ color:#D7D7D7; font-weight:bold; font-size:17px; text-decoration:none;}
#copyright{background:#575556; color:#a3a3a3; min-height:30px; padding-top:20px; text-align:left; color:#A4A4A4; letter-spacing:1px;}
#copyright a{ color:#a3a3a3;}

/*響應裝置設定*/
@media screen and (max-width: 1600px) {
	#container .wrap{ background:none;}
	#container .title{ min-height:0;}
	#container .content{ width:100%; margin-top:0px;}
}
/*20170390 st 邊距*/
@media screen and (max-width: 1445px) {
	#content { margin-left:10px; margin-right:5px;}
	#wrapper {padding-left: 10px;box-sizing: border-box;padding-right: 5px;}
	#content .content{ margin-right:5px;}
	#wrapper .content{ margin-right:5px;}
}
@media screen and (max-width: 1400px) {
	#footer_right{ display:none;}
	#footer_left{ width:100%;}
}
@media screen and (min-width: 1200px) {
	#wrapper .menu3{ display:none;}
	.subMenu1, .subMenu2{ display:none;}
}
@media screen and (max-width: 1200px) {
	#wrapper .menu1{ display:none;}
	
}
@media screen and (max-width: 900px) {
	#history .content{ line-height:50px;}
}
@media screen and (max-width: 750px) {
	#history .content{ line-height:45px;}
}
@media screen and (max-width: 480px) {
	#history .content{ line-height:35px;}
	#history .title {padding:30px 0; }
}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> Tubing List <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/


#container_inner{ width: 100%; }
#container_inner .title{display:inline-block; padding-top:100px; font-size:24px; font-weight:bold; color:#00A53C;}
#container_inner .title a{color:#00A53C; text-decoration:none;}
#container_inner .line{height:1px; border-bottom:1px solid #D6D6D6;}
#container_inner .box{/* float:left; */display: inline-block;width: 30%;margin: 50px 1.5%;}
#container_inner .box a{color:#656565; font-size:18px; letter-spacing:1px; text-decoration:none;}
#container_inner .more{ max-width:220px; height:35px; line-height:35px; letter-spacing:1px; font-size:14px; text-align:center; background:#000; color:#FFF; }
#container_inner .more a{ font-size:14px; color:#FFF;}
#container_inner .more a:hover{ text-decoration:underline;}

@media screen and (max-width: 750px) {
	#container_inner .box{width:45%;margin: 50px 2.2%;}
}
@media screen and (max-width: 480px) {
	#container_inner .box{ width:100%; margin:10px 0;}
}


/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> Contact <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/


#contact{ width: 100%; }
#contact .title{display:inline-block; padding-top:100px; font-size:24px; font-weight:bold; color:#00A53C; width:auto;}
#contact .line{height:1px; border-bottom:1px solid #D6D6D6;}
#contact .item{color:#333; font-size:18px;  font-weight:bold; padding:30px 0;}
#contact span{display:inline-block; height:40px; font-size:14px; letter-spacing:1px;  width:150px;}
#contact .ctitle{ font-size:14px; color:#8c8b8b; letter-spacing:1px; height:50px; width:150px;}
#contact .input1{ max-width:560px; width:100%; height:25px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; border:1px solid #d8d4d4; padding-left:10px; color:#666; }
#contact .input2{ max-width:260px; width:100%; height:25px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; border:1px solid #d8d4d4; padding-left:10px; color:#666; }
#contact .textarea{ max-width:560px; width:100%; height:200px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; border:1px solid #d8d4d4; padding:10px; color:#666; }
#contact #cancel_btn{ cursor:pointer; cursor:hand; }

@media screen and (max-width: 900px) {
	#contact span{ width:auto;}
	#contact_table{ width:100%;}
}
@media screen and (max-width: 480px) {
	#contact span{ height:30px;}
	#cancel_btn{ display:none;}
	#contact .ctitle{ width:90px;}
}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> distributors <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

#distributors{ width: 100%; }
#distributors .title{display:inline-block; padding-top:100px; font-size:24px; font-weight:bold; color:#00A53C; width:auto;}
#distributors .line{height:1px; border-bottom:1px solid #D6D6D6;}
#distributors .select_text{display:inline-block; padding:0 10px;color:#8B8B8B; font-size:14px; letter-spacing:1px;}
#distributors .table_title{ background:#000000; vertical-align:middle; color:#FFF; letter-spacing:1px; border-right:1px solid #bfbfbf; font-size:14px;}
#distributors .table_content{ border-bottom:1px solid #bfbfbf; text-align:center; color:#646464; height:40px; line-height:20px; font-size:14px;}


@media screen and (max-width: 900px) {
	#div_addr1{ display:none;}
	#div_addr2{ display:none;}	
}
@media screen and (max-width: 750px) {
	#div_fax1{ display:none;}
	#div_fax2{ display:none;}	
}
@media screen and (max-width: 480px) {
	#div_tel1{ display:none;}
	#div_tel2{ display:none;}
}


/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> Product_detail <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

#detail{ width: 100%; }
#detail_content{padding:50px 0;}
#detail .title{display:inline-block; padding-top:100px; font-size:24px; font-weight:bold; color:#00A53C; width:auto;}
#detail .title a{ color:#00A53C; text-decoration:none;  }
#detail .line{height:1px; border-bottom:1px solid #D6D6D6;}
#detail .pbox{width:100%;}
#detail .pbox_left{float:left; width:65%;}
#detail .pbox_right{float:left; width:35%;}
#detail .table_title{ background:#000000; vertical-align:middle; color:#FFF; letter-spacing:1px; border-right:1px solid #bfbfbf; font-size:14px;}
#detail .table_content{ border-bottom:1px solid #bfbfbf; text-align:center; color:#646464; height:40px; line-height:20px; font-size:14px;}
#detail .intro_box{border:1px solid #CCC; max-width:325px; padding:20px;}
#detail .intro_title{color:#505050; font-size:26px; letter-spacing:1px;}
#detail .intro_content{color:#505050; letter-spacing:1px; line-height:25px;}

/*規格輪播*/
.list_carousel { background-color: #fff; margin:0 20px; width:100%; }
.list_carousel ul { margin: 0; padding:0 20px; list-style: none; display: block; }
.list_carousel li { font-size: 16px; color: #999; text-align: center;  width: 200px; height: 130px; padding: 0; margin: 10px; display: block; float: left; }

.prev { float: left; margin-left: -10px; margin-top :-100px; }
.next { float: right; margin-right: 10px; margin-top :-100px;}
.carousel_txt { color:#333; font-size:16px; letter-spacing:1px; height:30px; line-height:30px; }

@media screen and (min-width: 1800px) {
	#spec2{ display:none;}	
}
@media screen and (max-width: 1800px) {
	#spec1{ display:none;}	
}
@media screen and (min-width: 750px) {
	#detail .pbox_right{ width:50%; }
	#detail .pbox_left{width:50%;}	
	#detail .intro_box{ max-width:none; width:100%; }
}
@media screen and (max-width: 750px) {
	#detail .pbox_right{ width:100%; float:none;}
	#detail .pbox_left{width:100%;}	
	#detail .intro_box{ max-width:none; width:100%; }
}
@media screen and (max-width: 480px) {
	#detail_content{padding:0;}
}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> Loadaction <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

.Loadaction_Box { position: fixed; left: 0px; top:0px; background-image:url(/images/action_bg.png); z-index:100000000 }
.Loadaction { position: fixed; padding-top:5px; width: 220px; height: 45px; left: 42%; top: 42%; background-image:url(/images/action_bg.png); -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; }
.Actionupload_Text { font-size:13px; color:#FFFFFF; height:20px; }

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------------------------------->>> pagelink <<<--------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

.cssa { font-family:Verdana; letter-spacing:1px; font-size:12px; padding-right:10px; padding-left:10px }
.cssb { font-family:Verdana; letter-spacing:1px; font-size:12px; padding-right:5px; padding-left:5px }
.cssc { padding-bottom:3px; letter-spacing:1px; font-size:12px; padding-left:10px; padding-right:10px; height:40px }
.cssd { font-family:Verdana; font-size:12px; letter-spacing:2px; height:10px; border:1px solid #FFFFFF }
a.pagelink_no:link { color: #003399; text-decoration: none; font-family:Verdana; font-size:12px; letter-spacing:1px; }
a.pagelink_no:visited { color: #003399; text-decoration: none; font-family:Verdana; font-size:12px; letter-spacing:1px }
a.pagelink_no:active { color: #003399; text-decoration: none; font-family:Verdana; font-size:12px; letter-spacing:1px }
a.pagelink_no:hover { color: #003399; text-decoration: underline; font-family:Verdana; font-size:12px; letter-spacing:1px }
a.pagelink:link { color: #333333; text-decoration: none; font-family:Verdana; font-size:12px; letter-spacing:1px; }
a.pagelink:visited { color: #333333; text-decoration: none; font-family:Verdana; font-size:12px; letter-spacing:1px }
a.pagelink:active { color: #333333; text-decoration: none; font-family:Verdana; font-size:12px; letter-spacing:1px }
a.pagelink:hover { color: #333333; text-decoration: underline; font-family:Verdana; font-size:12px; letter-spacing:1px }
a.pagelink_ch:link { color: #cc3300; text-decoration: none; font-family:Verdana; font-size:12px; letter-spacing:1px; font-weight:bold }
a.pagelink_ch:visited { color: #cc3300; text-decoration: none; font-family:Verdana; font-size:12px; letter-spacing:1px; font-weight:bold }
a.pagelink_ch:active { color: #cc3300; text-decoration: none; font-family:Verdana; font-size:12px; letter-spacing:1px; font-weight:bold }
a.pagelink_ch:hover { color: #cc3300; text-decoration: underline; font-family:Verdana; font-size:12px; letter-spacing:1px; font-weight:bold }