@import "../css/normalize.css";
@import "../css/grid_12.css";
@import "../css/superfish.css";
@import url(http://fonts.googleapis.com/css?family=Ubuntu:400,400italic);
article,aside,audio,canvas,command,datalist,details,embed,figcaption,figure,footer,header,hgroup,keygen,meter,nav,output,progress,section,source,video
{
	display: block;
}
mark,rp,rt,ruby,summary,time
{
	display: inline;
}
html
{
	width: 100%;
}
body
{
	/*background: url(../images/body_bg.jpg) 50% 0 no-repeat #efefef fixed;*/

background: rgb(255,255,255);
background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(240,240,240,1) 44%, rgba(236,236,236,1) 100%);
background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(240,240,240,1) 44%,rgba(236,236,236,1) 100%);
background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(240,240,240,1) 44%,rgba(236,236,236,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ececec',GradientType=0 );


	color: #7b7b7b;
	font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif, "微軟正黑體";
	font-size: 13px;
	line-height: 22px;
	min-width: 1080px;
	padding-bottom: 50px;
}
.qa_title{color: #7AAB18; font-size:15px;}
.fl{float:left;}
.fr{float:right;}
.all{text-align:left;}
.alr{text-align:right;}
.alc{text-align:center;}
.justify{ text-align:justify; text-justify:inter-ideograph;}
.green{ color: #50a361;}

.main
{
	margin: 0 auto;
	padding: 0;
	width: 1055px;
}
.main1
{
	margin: 0 0 0 12px;
	padding: 0;
	width: 1027px;
}
.white_block
{
	background: #FFF;
	border-radius: 10px;
	box-shadow: 0 4px 5px rgba(0,0,0,0.30);
	padding: 0 0 0 0;
}
.p_top
{
	padding-top: 21px!important;
}
p
{
	margin-bottom: 23px;
	font-size: 14px;
	line-height: 180%;

}
.p2
{
	margin-bottom: 22px;
}
.p3
{
}
.p4
{
}
.p5
{
}
.p6
{
}
.reg
{
	text-transform: uppercase;
}
.f_left
{
	float: left;
}
.f_right
{
	float: right;
}
.align_right
{
	text-align: right;
}
.align_center
{
	text-align: center;
}
.italic
{
	font-style: italic;
}
.letter
{
	letter-spacing: -1px;
}
.m_bottom_zero
{
	margin-bottom: 0!important;
}
.m_left_zero
{
	margin-left: 0!important;
}
.p_bottom_zero
{
	padding-bottom: 0!important;
}
.p_left_zero
{
	padding-left: 0!important;
}
.clear
{
	clear: both;
	font-size: 0;
	line-height: 0;
	width: 100%;
}
.wrapper
{
	overflow: hidden;
	width: 100%;
}
.extra_wrapper
{
	overflow: hidden;
}
.container
{
	width: 100%;
}
.extra_last,.last
{
	margin-bottom: 0!important;
	padding-bottom: 0!important;
}
.extra_last
{
	background: none!important;
	border: none!important;
}
a
{
	color: #7b7b7b;
	cursor: pointer;
	outline: none;
	text-decoration: none;
}
.search_box a:hover,.privacy a:hover,a:hover
{
	color: #cc3333;
	text-decoration: none;
}
.button
{
	color: #;
	display: inline-block;
	font-size: px;
	line-height: px;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
}
.button:hover
{
}
.jcarousel-skin-tango .jcarousel-item>a
{
	moz-transition: all 0.3s ease;
	o-transition: all 0.3s ease;
	transition: all 0.3s ease;
	webkit-transition: all 0.3s ease;
}
.block
{
	display: block;
}
.inline-block
{
	display: inline-block;
}
header
{   position: relative;
	overflow: hidden;
	padding: 12px 38px 8px 43px;
}
header h1
{
	float: left;
	padding: 6px 0 0 0;
	width: 265px;
	margin: 0;
}
footer h1 a
{
	background: url(../images/logo2.png) 0 0 no-repeat;
	display: block;
	height: 70px;
	text-decoration: none;
	text-indent: -9999px;
	width: 265px;
}
header h1 a
{
	background: url(../images/logo.png) 0 0 no-repeat;
	display: block;
	height: 70px;
	text-decoration: none;
	text-indent: -9999px;
	width: 265px;
}
.search_box
{
	background: url(../images/box_shadow.png) repeat;
	border: 1px solid #b2b2b2;
	border-radius: 13px;
	box-shadow: inset 1px 1px 2px rgba(0,0,0,0.16);
	color: #3a3a3a;
	float: right;
	font-size: 11px;
	height: 40px;
	overflow: hidden;
	width: 260px;
	margin-top: 5px;

}
.search_box a
{
	color: #3a3a3a;
	font-size: 11px;
	line-height: 16px;
}
.search_box .f_left
{
	padding: 8px 0 0 20px;
}
.search_box .f_left span
{
	display: inline-block;
	margin: -3px 3px 0 3px;
}
.search_box .f_right
{
	overflow: hidden;
	padding: 7px 11px 0 0;
}
.search_box .f_right input
{
	background: url(../images/search_left.png) no-repeat;
	    border: 1px solid #CCC;
	float: left;
	margin: 0 0 0 0;
	padding: 4px;
	width: 140px;
}
.search_box .f_right a
{
	background: url(../images/search_right.png)  6px -3px no-repeat;
	display: block;
	float: left;
	height: 35px;
	width: 32px;
}
.search_box .f_right a:hover
{
	background-position: 6px -3px;
}
#content
{
	padding: 31px 0px 88px 7px;
}
.cont_pad
{
	padding: 30px 0 88px 7px!important;
}
.list1
{
}
.list1 li
{
	background: url(../images/marker1.png) 2px 8px no-repeat;
	padding-left: 27px;
}
.list1 a
{
}
.list2
{
}
.list2 li
{
	background: url(../images/marker2.png) 0 7px no-repeat;
	padding-left: 20px;
}
.list2 a
{
}
.list3
{
}
.list3 li
{
	background: url(../images/marker3.png) 0 7px no-repeat;
	padding-left: 20px;
}
.list3 a
{
}
h2,h3,h4
{
	font-weight: normal;
}
h2
{
	color: #0f0f0f;
	font-size: 26px;
	font-style: normal;
	letter-spacing: -1px;
	line-height: 31px;
	margin: 10px 0px;
}
h2.ind
{
	margin-bottom: 21px;
}
h2.ind1
{
	margin-bottom: 19px;
}
h2.ind2
{
	margin-bottom: 25px;
}
h3
{
	color: #171717;
	font-size: 16px;
	line-height: 19px;
	margin-bottom: 15px;
}
h3.ind
{
	margin-bottom: 19px;
}
h3.ind2
{
	margin-bottom: px;
}
h3.ind3
{
	margin-bottom: px;
}
.offers,.sf-menu li a,h2,.industrial
{
	font-family: '微軟正黑體',sans-serif;
}
.extra_container
{
	overflow: hidden;
}
.extra_container>div
{
	float: right;
}
.extra_container>figure
{
	float: left;
}
.project
{
}
.project
{
}
.project>div
{
	margin: 6px 10px 0 0;
	width: 290px;
}
.title
{
	color: #171717;
	font-size: 16px;
	line-height: 19px;
	margin-bottom: 15px;
}
.read_more
{
	color: #171717;
	display: inline-block;
	font-weight: bold;
	margin: 15px 0 0 0;
	text-decoration: underline;
}
.read_more:hover
{
	text-decoration: none;
}
.offers
{
	background: url(../images/banner.jpg) no-repeat;
	display: block;
	height: 296px;
	margin: 45px 0 0 -1px;
	overflow: hidden;
	position: relative;
	width: 276px;
}
.offers>span
{
	background: url(../images/banner_span.png) repeat;
	border-radius: 0 0 5px 5px;
	color: #FFFFFF;
	display: block;
	font-size: 12px;
	min-height: 55px;
	padding: 14px 0 10px 20px;
	position: absolute;
	top: 213px;
	width: 256px;
}
.offers>span .title1
{
	color: #fff;
	display: block;
	font-size: 18px;
	font-style: italic;
	line-height: 24px;
	margin-bottom: 1px;
}
.special
{
	margin-bottom: 36px;
}
.minerals
{
	line-height: 24px;
	margin: 42px 0 0 0;
}
.technology
{
	margin: 0 0 45px 0;
}
.l_height23
{
	line-height: 24px;
}
.steps
{
	margin: 0 0 35px 0;
}
.steps .f_left
{
	width: 235px;
}
.steps .f_right
{
	margin: 0 54px 0 0;
	width: 235px;
}
.step figure
{
}
.step>div
{
	margin-top: -1px;
	width: 175px;
}
.color1
{
	color: #3b3b3b;
}
.link_p
{
	color: #f25c5c;
}
.link_p:hover
{
	color: #666;
}
#contact-form
{
	padding: 0px 80px 0 0;
}
#contact-form .success
{
	margin-bottom: 20px;
	padding: 10px;
	position: absolute;
	width: 246px;
}
#contact-form textarea,#contact-form input
{
	background: #fff;
	border: 1px solid #e1e1e1;
	color: #7b7b7b;
	font-family: '微軟正黑體';
	font-size: 13px;
	margin: 0;
	outline: none;
	padding: 7px 8px 10px;
	position: relative;
}
#contact-form input
{
	float: left;
	width: 202px;
}
#contact-form textarea
{
	float: left;
	height: 248px;
	margin: 0 0 0 0;
	overflow: auto;
	resize: vertical;
	width: 442px;
}
#contact-form label
{
	display: block;
	min-height: 54px;
	overflow: hidden;
}
#contact-form label.message
{
	display: block;
	padding-bottom: 0;
}
#contact-form .error,#contact-form .empty,#contact-form .success
{
	display: none;
}
#contact-form .error,#contact-form .empty
{
	color: red;
	float: left;
	font-size: 11px;
	padding-top: 5px;
	text-align: left;
}
#contact-form .buttons2
{
	clear: both;
	overflow: hidden;
	padding-right: 3px;
	padding-top: 25px;
	position: relative;
	text-align: right;
}
#contact-form .buttons2 a
{
	cursor: pointer;
	margin-left: 18px;
	margin-top: 0;
	text-align: center;
}
#contact-form span
{
	display: block;
	margin: 0px 0 0 5px;
}
.map_wrapper
{
	display: inline-block;
	margin-bottom: 23px;
	overflow: hidden;
}
#map_canvas
{
	height: 305px;
	width: 352px;
}
.adress
{
}
.adress span
{
	display: inline-block;
	width: 74px;
}
.adress dt
{
}
.adress a,.adress .email
{
	color: #f05959;
}
.adress a:hover
{
	text-decoration: underline;
}
.adress dt strong
{
	color: #393939;
}
footer
{
	/*background: url(../images/footer.jpg) 38px 0 no-repeat;
	color: #9c9c9c;
	line-height: 20px;
	margin: 0 0px 0 0px;
	min-height: 210px;
	padding: 60px 0 26px;*/
	background:#333;
	color: #CCC;
	text-align:center;
	margin: 0;
	padding: 15px 0px;



-webkit-border-bottom-right-radius: 10px;
-webkit-border-bottom-left-radius: 10px;
-moz-border-radius-bottomright: 10px;
-moz-border-radius-bottomleft: 10px;
border-bottom-right-radius: 10px;
border-bottom-left-radius: 10px;
}
footer p
{
	line-height: 200%;
	margin: 0;text-align: left;
}
footer .p2
{
	margin-bottom: 11px;
}
footer .social
{
}
footer .social a
{
	color: #4e4e4e;
	display: block;
	margin-bottom: 10px;
	overflow: hidden;
	width: 90px;
}
footer .social .wrapper
{
	padding: 6px 0 0 0;
}
footer .social img
{
	margin: 0 7px 0 0;
}
footer .f_right
{
	width: 115px;
}
#easyTooltip
{
	background: #fff;
	border: 1px solid #000;
	font-size: 12px;
	padding: 3px 5px;
}
.privacy
{
	color: #9c9c9c;
}
.privacy a
{
	color: #282828;
	font-weight: bold;
}
.industrial
{
	color: #000;
	display: inline-block;
	font-size: 22px;
	font-style: italic;
	line-height: 26px;
	margin: 5px 0 0 -3px;
}
.customer
{
	color: #222222;
}
footer a:hover,.contact
{
	color: #F29200;
}
.number
{
	color: #CCC;
}









/*PLUS*/


.index_product_inf{ width: 940px; height: 271px; background: none; padding-bottom: 30px;}

.index_product_inf dl{ 
float: left; 
width: 219px;
margin: 0px 16px 0px 0px;
}

.index_product_inf dl a{
padding: 10px 0px;
background: #ededed;
display: block;

-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}

.index_product_inf dl a:hover{
background:#cc3333;
}

.index_product_inf dl a dd{margin: 0 auto;text-align: center;}

.index_product_inf dl a dt{margin: 0 auto;text-align: center;color: #333;}
.index_product_inf dl a:hover dt{color: #CCC;}
 
.index_product_inf dl a dt strong{font-size: 18px;color: #333;}
.index_product_inf dl a:hover dt strong{color: #FFF;}



 


#brandMenu {float:left;width:120px;line-height:30px;font-size:15px;margin-left:0px;}

#brandMenu>h3 {padding:0px;color:#6B09CC;margin:30px 0 10px 5px;line-height: 30px;}
#brandMenu>h3 a{padding:0px;color:#6B09CC;margin:30px 0 10px 5px;line-height: 30px;}
#brandMenu>h3 a:hover {color:#48117e;}

#brandMenu>ul {list-style: none;padding-left:0px;color:#333;margin: 0;}
#brandMenu>ul li a {color:#333;display: block;}
#brandMenu>ul li a:hover {background:url(../images/circle-right-light.png);background-repeat: no-repeat;background-position: right; text-decoration: underline;}
#brandMenu>ul>li>ul{padding-left: 10px;}


#brandList { /*float: right;width:728px;min-height: 600px;padding-right:30px;*/ }
#brandList>ul {border:1px solid #EEE;padding: 0;list-style: none;}
#brandList>ul li {border:1px solid #EEE;width:200px;height:315px;float:left;padding:20px;}
#brandList>ul li a {display: block;}
#brandList>ul li img {width:200px;height:200px;}
#brandList>ul li .title {font-size:16px;color:#000;margin-top:20px;line-height:25px;font-weight: bold; text-align: left;}
#brandList>ul li .content {font-size:13px;color:#333;line-height:20px;margin-top:10px;text-align: left;height:60px;overflow: hidden;}
#brandList>ul li:hover {border:3px solid #09F;padding:18px;}




/* Just for the example. Fee free to delete these three lines */

.pikachoose {width: 520px; margin: 0 auto;}

/* Style the thumbnails */
.pika-thumbs{ padding: 0 16px; height: 75px; }
    .pika-thumbs li{ width: 144px; height:74px; margin: 10px 0 0 17px; padding: 0; overflow: hidden;
        float: left; list-style-type: none;padding: 3px; margin: 0 5px; background: #fafafa; border: 1px solid #e5e5e5; cursor: pointer;}
    .pika-thumbs li .clip {position:relative;height:100%;text-align: center; vertical-align: middle; overflow: hidden;}
    
/* The stage is the wrapper. The image fills 100% the height of the stage */
.pika-stage, .pika-textnav {width: 600px;}
.pika-stage {position: relative; background: #fafafa; border: 1px solid #e5e5e5; padding: 10px 10px 40px 10px; text-align:center; height:450px;width: 590px; overflow:hidden;}
.pika-stage img{height:100%;}
.pika-stage .caption {position: absolute; background: #000; background: rgba(0,0,0,0.75);  border: 1px solid #141414; font-size: 11px; 
            color: #fafafa; padding: 10px; text-align: right; bottom: 50px; right: 10px;}
    .pika-stage .caption p {padding: 0; margin: 0; line-height: 14px;}

/* Ths play, pause, prev and next buttons */
.pika-imgnav a {position: absolute; text-indent: -5000px; display: block;z-index:3;}
    .pika-imgnav a.previous {background: url(prev.png) no-repeat left 45%; height: 100%; width: 50px; top: 10px; left: 10px;cursor:pointer;}
    .pika-imgnav a.next {background: url(next.png) no-repeat right 45%; height: 100%; width: 50px; top: 10px; right: 20px;cursor:pointer;}
    .pika-imgnav a.play {background: url(play.png) no-repeat 0% 50%; height: 100px; width: 44px;top:0;left:50%;display: none;cursor:pointer;}
    .pika-imgnav a.pause {background: url(pause.png) no-repeat 0% 50%; height: 100px; width: 44px;top:0;left:50%;display:none;cursor:pointer;}

/* The previous and next textual buttons */
.pika-textnav {overflow: hidden; margin: 10px 0 0 0;bottom:10px; position:absolute;}
.pika-textnav a {font-size: 12px; text-decoration: none; color: #333; padding: 4px;}
    .pika-textnav a.previous {float: left; width: auto; display: block;}
    .pika-textnav a.next {float: right; width: auto; display: block;padding-right: 15px;}

/*for the tool tips*/
.pika-tooltip{font-size:12px;position:absolute;color:white;padding:3px; background-color: rgba(0,0,0,0.7);border:3px solid black;}
.pika-counter{position: absolute;bottom: 45px;left:15px;color:white;background:rgba(0,0,0,0.7);font-size:11px;padding:3px;-moz-border-radius: 5px;border-radius:5px;}

/* If using user thumbnails there's a pause well the new large image loads. This is the loader for that */      
.pika-loader{ background:url(loading.gif) 3px 3px no-repeat #000; background-color:rgba(0,0,0,0.9); color:white; width:60px; font-size:11px; padding:5px 3px; 
    text-align:right; position:absolute; top:15px; right:15px; }




 /*if you just want to adjust the size of the stage and the thumbnails, you can do so by editing the following lines: */
.pika-thumbs li{width: 90px; height:55px;}
.pikachoose{width:720px; position:relative;}
#pikame{width: 125px;}
.pika-thumbs {margin: 10px 0 0 17px; width:250px;position: absolute;top: 10px;right: 30px;}
    .pika-thumbs li { margin: 5px 5px;}

/* jCarousel Styles */
/*if you're not using the carousel you can delete everything below this */
.jcarousel-skin-pika{position:absolute;top:-10px;right:-30px;}
.jcarousel-skin-pika .jcarousel-container-vertical { width: 125px;height: 450px; overflow:hidden;}
.jcarousel-skin-pika .jcarousel-clip-vertical { width:  125px; height: 450px;}
.jcarousel-skin-pika .jcarousel-item-vertical { margin-top: 10px;}   












#brandList>#sp>ul.menu { padding: 0; clear: both; }
#brandList>#sp>ul.menu>li { display: inline; }
#brandList>#sp>ul.menu>li a { background: #CCC; padding: 10px 30px; float:left; border-right: 1px solid #ccf; border-bottom: none; text-decoration: none; color: #000; font-weight: bold;}
#brandList>#sp>ul.menu>li.active a { background: #FFF; }
#brandList>#sp>div.content { float: left; clear: both; border: 1px solid #ccf; border-top: none; border-left: none; background: #FFF; padding: 10px 20px 20px; width: 680px; }











#news {}
#news #news_list {float: right;width:250px;margin-right:0px;padding: 0px 15px;border-left:1px dotted #CCC;}
#news #news_list h1 {background:url(../images/h1_bg2.gif) 7px 2px no-repeat;;font-size: 16px;color: #666;margin: 0;padding-left: 20px;border: none;}
#news #news_list ul {padding:5px; list-style-type: none;}
#news #news_list ul li {padding:10px 0px 10px 15px;background: url(../images/nl_marker.png) 0px 16px no-repeat;}
#news #news_list ul li>a{font-size: 14px;color: #67a512;}
#news #news_list ul li>a:hover{font-size: 14px;color: #8dc63f;}

#news #news_detail {float:left;width:630px;}
#news #news_detail h1 {}
#news #news_detail p + h1 {margin-top:20px;}
#news #news_detail p {margin-top:15px;font-size:16px;line-height: 280%;}
#news #news_detail nav {padding-left:20px;line-height: 40px;background:url(../images/nav.png) 0 9px no-repeat;}
/*.goog-te-gadget{ width:185px; height:30px; overflow:hidden}
.goog-logo-link{ position:absolute; right:0; top:5px}
.goog-te-gadget .goog-te-combo{ float:right}*/


#solve {}
#solve #solve_list {float: left;width:229px;margin-right:0px;}
#solve #solve_list h1 {background:url(../images/h1_bg2.gif) 7px 2px no-repeat;;font-size: 16px;color: #666;margin: 0;padding-left: 20px;border: none;}
#solve #solve_list ul {padding:0 5px; list-style-type: none;}
#solve #solve_list ul li {
    padding: 0 0 0 12px;
    line-height: 26px;
    background: url(../images/nl_marker.png) 0px 9px no-repeat;
    }
#solve #solve_list ul li ul li a{ font-size:14px; font-weight:100; color: #646464;}
#solve #solve_list ul li>a{font-size: 15px;color: #67a512;font-weight: 600;}
#solve #solve_list ul li>a:hover{color: #8dc63f;}

#solve #solve_detail {float:right;width:730px;padding: 0px 15px;border-left:1px dotted #CCC;}
#solve #solve_detail h1 {}
#solve #solve_detail h2{}
#solve #solve_detail p + h1 {margin-top:20px;}
#solve #solve_detail p {margin-top:15px;font-size:16px;line-height: 280%;}
#solve #solve_detail nav {padding-left:20px;line-height: 40px;background:url(../images/nav.png) 0 9px no-repeat;}
.btn{position: absolute;right: 40px;top:65px;color: #ccc;}
.btn2{padding:10px 20px; background:#666;color: #ccc;}
.main .main1 .white_block #content .container_12 .wrapper .grid_12 #solve #solve_detail b{text-align: right;display: block;margin: 15px; width: 530px;}
.main .main1 .white_block #content .container_12 .wrapper .grid_12 #solve #solve_detail h4{ font-size:17px;}
.main .main1 .white_block #content .container_12 .wrapper .grid_12 #solve #solve_detail b input{ width:360px; height:20px; padding:0 10px;}
#content .container_12 .wrapper .grid_12 #solve #solve_detail a{}