@import url("reset.css"); /*重置*/
@import url("page.css"); /*頁碼*/


/*body 共用*/
html{scrollbar-3dlight-color:#ccc; scrollbar-highlight-color:#fff; scrollbar-arrow-color:#999; scrollbar-base-color:#ddd;scrollbar-darkshadow-color:#fff; scrollbar-shadow-color:#999; scrollbar-face-color:#ddd; scrollbar-track-color:#eee; }
body,p,form {
	margin: 0px;
	padding: 0px;
}
body,td {font-family: "微軟正黑體",Arial, Helvetica, sans-serif;font-size: 16px;line-height: 30px;color: #333;}
a {color: #333;text-decoration: none;}
a:hover{color: #c3210b; -o-transition: color .5s linear;-webkit-transition: color .5s linear; 
		-moz-transition: color .5s linear;transition:  color .5s linear; }

hr { border-bottom:1px dashed #ccc; }

/*png 圖片透明(共用)*/
.img {behavior: url("iepngfix.html"); }
.banner img { width: 100%; box-shadow: 0px 4px 8px #B3B1B1;}
.r_content img {max-width: 100%; max-height: 100%;}
.imgg img { margin: 1em 0; max-width: 100%; max-height: 100%;}
.img_left {  float: left;  padding: 0em 1em 1em 0;  width: 50%;}
.img_right{  float: right; padding: 0em 0 1em 1em;  width: 50%;}

/*元件(共用)*/
.clearfix { clear: both;}
.input1{color: #000;background-color: #FFF;border: 1px solid #ccc;  font-size: 15px;  padding: 6px;}
input{color: #000;border: 1px solid #ccc; font-size: 15px;  padding: 6px;}
.textarea{color: #000;background-color: #FFF;border: 1px solid #ccc;}
.select{color: #000;background-color: #FFF;border: 1px solid #ccc;}

/*文字(共用)style*/
.white {color: #fff;}
.blue {color: #0c63b0;}
.red {color: #c3210b;}
.green {color: #6daf1a;}
.orange {color: #FF6600;}
.yellow {color: #FFFF00;}

b,strong{ font-weight:bold;}
.font20{ font-size:20px;}
h2{ font-size:24px; font-weight:bold; color:#000; margin: 10px 0 15px;}
/*h4{ font-size:15px; background:#2ca7e0; color:#fff; display: inline-block; padding: 0px 6px;}*/

.tx01 { margin: 0 0 1em 0; }
.tx02 { margin: 1em 0 1.5em 0; }

/*通用排版用*/
.center { text-align:center; }
.right{ text-align:right;}
.flt { float:left; }
.flr { float:right; }
.w35{ width: 35%;   float: left;}
.w45{ width: 45%;   float: left;}
.w55{ width: 55%;   float: left;}
.w65{ width: 65%;   float: left;}


/* CSS3 style  陰影圓角範例，可自行增減使用 */
.css-radius {-webkit-border-radius: 10px;-moz-border-radius: 10px;border-radius: 10px;} 
.css-shadow {-webkit-box-shadow: 1px 1px 4px rgba(0, 0, 0, .4);	-moz-box-shadow: 1px 1px 4px rgba(0, 0, 0, .4);	box-shadow: 1px 1px 4px rgba(0, 0, 0, .4);}

/*超連結-透明度*/
a.logo:hover,.footer a:hover,.productBg img:hover,.l_mail:hover,.sidebar ul li:hover{filter: alpha(opacity=80);opacity: 0.8;-moz-opacity: 0.8;}
.sidebar ul li.active:hover{filter: alpha(opacity=100);opacity: 1;-moz-opacity: 1;}

/*wrapper 主要框架(共用)*/
#wrapper{width: 100%;margin:0 auto;}
.index_container{width: 1000px;margin:0 auto;overflow:hidden;}

/*頁首 選單(共用)*/
.header{ width: 1000px; height:90px; margin: 0 auto;}
.logo { float: left; width: 219px; height: 56px; margin: 15px 0 0;}
.menu { float: left; width: 650px; margin: 17px 20px 0 0px;  font-size: 18px;  font-weight: bold;  text-align: center;}
.menu a {  margin: 15px 10px; width: 100px;  display: inline-block; }
.menu a:hover { border-bottom: 2px solid #c3210b;  padding-bottom: 5px;}
.iconlink { float: right; width: 91px; text-align: right; margin: 15px 10px; }
.iconlink a { background: #d5d5d5;  width: 34px; height: 34px; display: block; float: left;  margin: 13px 5px 0;
			  -webkit-border-radius: 99px;-moz-border-radius: 99px;border-radius: 99px;}	
.iconlink a:hover { background-color: #c3210b; }
.iconlink a.home { background-image: url(../images/all/home.png); }	
.iconlink a.mail { background-image: url(../images/all/mail.png); }	

/*footer 頁尾(共用)*/
.topup{ position: absolute; left: 50%; top: -10px;}
.footer_bg{ position:relative; height:161px; background: url(../images/all/f_bg.jpg) repeat-x; color:#fff; font-size:14px;}
.footer{ width: 1000px; height: 135px; margin: 0 auto; padding-top: 26px;}
.footer a{ color: #fff;}
.footer .leftbox a:hover{ text-decoration: underline;}
.footer .rightbox { padding: 14px 0;}
.footer .rightbox a { float: left;  width: 145px;  display: block;  margin-right: 30px;}
.footer .rightbox span{ font-size: 13px;  color: #93b8d8;}
.copyright{ color: #0D75D2;  font-size: 12px; text-align: right;  height: 36px; line-height: 36px; clear: both; padding:10px 10px 0;}
.copyright a{color:#0D75D2;}

/*=======================首頁================================*/
.about_info{ height: 290px;  margin-top: 20px; background:url(../images/index/about.png) right bottom no-repeat;}
.infotxt{ width: 535px; padding-top: 55px;}
.brands_bg { height: 135px; background: #e6e6e6;}
.brands {  margin-top: 30px; }

/*=======================內頁================================*/
/*page 主要內容(共用)*/
.container{width: 1000px;margin:25px auto 5em;overflow:hidden;}
.brands .title,.nav{ width: 1000px; margin: 0 auto;}
.right_main { float:right; width: 740px;}

/*路徑(目前所在位置)(共用)*/
.nav_bg{ background:#edeeef; color:#7b7b7b; text-align: right; font-size: 13px; padding: 5px 0;}
.nav:last-child {  color: #0F73D3;  font-weight: bold;}
.nav a:hover { color: #c3210b;}


/*左側選單(共用)*/
.sidebar{float: left;width: 260px;background:url(../images/page/left_line.jpg) right top no-repeat; min-height:525px;}
.sidebar .title{ margin-bottom:15px;}
.sidebar ul{ width: 232px; text-align:center;}
.sidebar ul li{ background:url(../images/page/left_navbg.jpg) no-repeat;height: 46px; line-height:46px; margin: 1px 0; overflow: hidden;}
.sidebar ul li.active { background:url(../images/page/left_navbgh.jpg) no-repeat; }
.sidebar ul li a{color:#fff;font-size:17px; font-weight:bold;display: block;}
.s_title { margin-bottom: 25px;}
.l_mail{ display: block;  text-align: center;   width: 230px;  margin: 5em 0 3em;}
.l_txt{ display: block; width: 200px; margin: 2em 0 3em; padding: 10px 15px;  font-weight: bold;
background: rgb(242,242,242); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(242,242,242,1) 0%, rgba(247,247,247,1) 50%, rgba(229,229,229,1) 100%); 
background: -webkit-linear-gradient(top,  rgba(242,242,242,1) 0%,rgba(247,247,247,1) 50%,rgba(229,229,229,1) 100%); 
background: linear-gradient(to bottom,  rgba(242,242,242,1) 0%,rgba(247,247,247,1) 50%,rgba(229,229,229,1) 100%); 
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f2f2', endColorstr='#e5e5e5',GradientType=0 ); 
}


/*標題(共用)*/
.main_title { font-size:20px; background:url(../images/page/title_line.jpg) left bottom no-repeat; margin-left: 10px; padding-bottom:15px;}

	
/*返回上頁*/	
.btn_back { text-align:center; padding-top:15px;}


/*內頁 頁碼(共用)*/
.pageBox{ text-align: center;  clear: both;  padding-top: 60px; }
.pageBox a { width: 36px; height: 36px; display: inline-block;  border: 1px solid #999; border-radius: 5px; line-height: 36px; margin: 0px 5px 67px 5px;}
.pageBox a:hover,.pageBox a.on{ background: #999; color: #fff;}


/*form 表單(共用)*/
.page_form {overflow: hidden; border-bottom-width: 1px;border-bottom-style: dotted;border-bottom-color: #666;}
.page_form .name{float: left;width: 100px;text-align: right;padding: 5px;}
.page_form .text{overflow: hidden; padding: 5px;}


/*線(共用)*/
.line1{border-bottom-width: 1px;border-bottom-style: dotted;border-bottom-color: #666;}


/*內頁 p1*/
.aboutbox { width: 90%; min-height: 310px;  margin: 35px auto;  background: url(../images/p1/map.jpg) 155px top no-repeat;}
.aboutbox .w55 {  margin-top: 50px; }
.brandbox { clear: both;  padding-top: 40px; text-align: center;}
.brandbox a {  width: 150px; border: 1px solid #E0E0E0; display: inline-block; margin: 20px 5px 2px;}
.brandbox a:hover{  border: 1px solid #9CCAF3; box-shadow: 0 0 8px #93C9E2;}
.brlink { width: 87%; margin: 0 auto; text-align: left;}


/*內頁 p2*/
.newsbox th { color:#fff; font-size:18px; font-weight:bold; height: 40px; line-height: 40px; padding: 0 10px;}
.newsbox th:first-child {background: url(../images/p2/1.jpg) no-repeat;border-right: 2px solid #2187B7;}
.newsbox th:nth-child(2) {background: url(../images/p2/2.jpg) repeat-x;}
.newsbox th:last-child {background: url(../images/p2/3.jpg) right center  no-repeat;border-left: 2px solid #2187B7;}
.newsbox td {  padding: 8px 5px;  text-align: center;  font-size: 13px; color: #666; border-bottom: 1px dashed #ccc;}
.newsbox td:nth-child(2) { text-align: left;}
.newsbox tr:nth-child(odd) {background: #F5F5F5;}
.newsbox td a{ font-size:16px; color:#333;width: 540px; display: block; text-decoration: none; white-space: nowrap; text-overflow: ellipsis;
  			   -o-text-overflow: ellipsis;  overflow: hidden;}
.newsbox tr:hover a{ color:#c3210b;}
.page_date { text-align: right;  font-size: 13px;  color: #666;}


/*內頁 p3-產品介紹*/
.r_content { margin: 20px;}
ul.r_content li { list-style: none; float: left; width: 25%; text-align: center; }
.productBg { height: 125px;  text-align: center;   font-size: 0;}
.productBg:before { content: "";  height: 100%;  display: inline-block;  vertical-align: middle;}
.productBg img { max-width: 135px;  max-height: 123px; display: inline-block;  vertical-align: middle; }
.p_title { height: 50px; margin: 6px 5px 22px; line-height: 23px; overflow: hidden; font-size: 15px;}

/*p3-產品介紹 美工頁*/
.itembox { margin:30px 0;}
.listbox { float: left; width: 65%;  margin: 30px 0;}
ul.r_content ul.listbox li { float: left;  width: 30%; margin: 6px 6px; text-align: left;  list-style: initial;}
ul.r_content ul.p5download li { float: none;  width: 90%; margin: 6px 6%; text-align: left; list-style: initial;}


/*底層頁 p3-產品介紹*/
.showimg{ width:352px; float:left;}
.showarea { height: 318px; text-align: center;  border:1px solid #e0e0e0;}
.showarea:before,.psimg:before { content: ""; height: 100%; display: inline-block;  vertical-align: middle;}
.showarea img{display: inline-block; vertical-align: middle;max-width: 350px;max-height: 318px;}
.psimg {  float: left; margin: 5px 3px;display: block; width: 80px; height: 73px; border: 1px solid #e0e0e0; }
.psimg img { max-width: 100%;  max-height: 100%;  vertical-align: middle;}

.pr_txt { float: right;   width: 315px;}
.pr_txt p { margin-bottom: 25px; font-size: 15px; min-height: 140px;}
.linkbox a{ margin:0 5px;}

.download { text-align: right;  margin-bottom: 30px;  color: #888; font-size: 14px;}
.download a {background: url(../images/p3/dicon.png) 6px center no-repeat #0D9BDD; color: #fff; padding: 5px 10px 5px 27px; margin: 0 5px;
-webkit-border-radius: 10px;-moz-border-radius: 10px;border-radius: 10px;  }
.download a:hover{ background-color: #6D6D6D;}


/*產品底層頁-頁籤*/
.abgne_tab {clear: left;width: 100%;margin: 30px auto 0px;}
div.tab_container {clear: left;width: 100%;border-top: none;	}
div.tab_container .tab_content {padding: 20px 0;}
#DFtabs ul.tabs {width: 100%;height: 43px;border-bottom: 1px solid #DCDCDC;}
#DFtabs ul.tabs li {float: left;line-height: 31px;overflow: hidden;position: relative;margin-bottom: -1px; border-left: none;	background: #fff;}
#DFtabs ul.tabs li a { display: block; padding: 5px 30px; color: #585858; font-size: 18px; font-weight: bold; }
#DFtabs ul.tabs li a:hover {color: #C3210B;}
#DFtabs ul.tabs li.active {	height:50px; background:url(../images/p3/dtab.jpg) center bottom no-repeat; }
#DFtabs ul.tabs li.active a {background: #f1f1f1; border-bottom:5px solid #0297DB; }
#DFtabs ul.tabs li.active a:hover {	color: #C3210B; }




/*內頁 p4*/
.focus { text-align: right; border-top: 1px solid #D6D6D6;  margin-top: 10px;}
.contactbox { margin:0 auto; border: 1px solid #EAEAEA;}
.contactbox td {  padding: 10px 8px 10px 6px;  color: #666;   border-bottom: 1px dashed #DEDEDE;}
.td_line2 table td {  border: none;  padding: 0 6px 0 0; }
.td_line2 {  padding-left: 20px!important; }
.contactbox tr:nth-child(odd) { background: #F5F5F5; }
.contactbox tr td:nth-child(2) {  border-right: 1px solid #E4E4E4; color: #000; font-weight: bold;}
.contactbox table tr:nth-child(odd),.contactbox table tr td:nth-child(2) { background:none!important; border:none;}
