@charset "utf-8";
@import 'reset.css';

body {text-align: center;color: #585858;background: #EEEEEE url(../images/index_bg.jpg) repeat-x 0px 0px;font-family: Arial, Helvetica, sans-serif;}
h1, h2, h3, h4, h5, h6 {font-family: "微軟正黑體";}
#container {width: 100%;padding: 0px;background: 0px;margin: 0px auto;}
#header {height: 308px;width: 1000px;position: relative;background: url(../images/banner_images.jpg) repeat-x 0px 0px;left: 0px;top: 0px;z-index: 99;margin: 0px auto;}
#logo {position: absolute;height: 60px;width: 256px;left: 32px;top: 28px;z-index: 5;background: url(../images/logo.png);}
#logo a {float: left;height: 60px;width: 256px;text-indent: -9999px;display: block;}
#header h1 {position: absolute;left: 144px;top: 75px;}

#language {width: 200px;position: absolute;right: 0px;top: 20px;color: #fff;}
#language a{padding: 10px; text-decoration: none;color: #fff; font-size: 14px;}
#language a:hover{ color:#ccc;}

#menu {
	position: absolute;
	height: 56px;
	width: 1000px;
	bottom: -24px;
	background: url(../images/menu_bottom.png) no-repeat center bottom;
	padding-bottom: 24px;
	left: 0px;
}
#menu ul {
	float: left;
	background: url(../images/menu_bg.jpg) repeat-x 0px 0px;
	height: 56px;
	width: 828px;
	padding: 0px 30px 0px 142px;
	overflow: hidden;
}
#menu ul li {float: left;background: url(../images/menu_li.gif) no-repeat left 28px;height: 56px;}
#menu ul li>a {
	text-decoration: none;
	float: left;
	display: inline-block;
	height: 46px;
	color: #FFFFFF;
	font: 15px/46px "微軟正黑體", Arial, Helvetica, sans-serif;
	width: 138px;
	padding-top: 10px;
}
#menu ul li>a:hover {
	text-decoration: none;
	display: inline-block;
	color: #333333;
	background: url(../images/menu_hover.png) no-repeat center 10px;
}
#menu a.location {
	color: #333333;
	font-size: 15px;
	line-height: 46px;
	text-decoration: none;
	display: inline-block;
	float: right;
	background: url(../images/menu_hover.png) no-repeat center 10px;
}

#main {
	width: 1000px;
	margin-right: auto;
	margin-left: auto;
	position: relative;
	overflow: hidden;
	background: #FFFFFF;
	text-align: left;
	padding: 34px 0px 0px;
}

.index_box {
	float: left;
	width: 930px;
	padding: 10px 35px 30px;
	background: url(../images/index_content_bg.jpg) no-repeat right bottom;
}
.index_box h2 {
	font: 16px/16px "微軟正黑體", Arial, Helvetica, sans-serif;
	color: #333333;
	height: 16px;
	width: 100%;
	padding-bottom: 16px;
}
.index_left_box {float: left;width: 570px;}
.index_right_box {float: right;width: 360px;}
.index_box .box01, .box02 {float: left;width: 570px;}
.index_box .box03 {float: left;width: 360px;}
.index_box .box01 ul {float: left;padding-bottom: 30px;}
.index_box .box01 li {float: left;width: 250px;background: url(../images/box01_bg.png) no-repeat center bottom;padding-bottom: 13px;margin-right: 24px;}
.index_box .pic_box {float: left;height: 158px;width: 248px;border: 1px solid #5C7EA3;}
.index_box .text_box {background: #5C7EA3;text-align: center;float: left;height: 30px;width: 250px;border-top: 2px solid #DA7351;font-size: 15px;line-height: 30px;color: #FFFFFF;}
.index_box .box02 {	background: url(../images/box02_bg.png) no-repeat 0px 0px;padding-top: 18px;}
.index_box .box02 ul {float: left;padding: 0px 0px 10px 26px;}
.index_box .box02 li {float: left;width: 230px;margin-right: 14px;}
.index_box .box02 .frist {background: url(../images/line01.gif) no-repeat right center;	padding-right: 14px;}
.index_box .box02 .date {color: #777777;font: bold x-small Verdana, Geneva, sans-serif;float: left;width: 100%;padding-bottom: 2px;}
.index_box .box02 h2 {
	background: url(../images/box02_h2.png) no-repeat 0px 0px;
	float: left;
	line-height: 30px;
	color: #FFFFFF;
	height: 37px;
	padding: 0px 0px 0px 14px;
	margin-bottom: 16px;
}
.index_box .box02 p {font-size: 12px;line-height: 158%;color: #878787;float: left;width: 100%;}
.index_right_box p {
	font-size: 12px;
	line-height: 158%;
	color: #878787;
	float: left;
	width: 100%;
	margin-top: 30px;
}
.index_box a {color: #878787;text-decoration: none;display: block;}
.index_box a:hover {color: #333333;}
.index_box a.more {
	background: url(../images/iocn01.gif) no-repeat right center;
	display: inline-block;
	float: right;
	padding-right: 10px;
	font-size: 12px;
	line-height: 12px;
	color: #777777;
	margin-top: 18px;
	text-decoration: none;
}
.index_box a.more:hover {background: url(../images/iocn01_hover.gif) no-repeat right center;color: #DA7351;}

#sidebar {background: url(../images/sidebar_subject_bg.jpg) no-repeat 0px 0px;width: 222px;text-align: left;position: relative;left: 30px;top: 20px;float: left;padding-bottom: 30px;}
.subject01, .subject02, .subject03 {font: 16px/40px "微軟正黑體";color: #FFFFFF;float: left;height: 67px;width: 222px;}
#sidebar .subject01 {background: url(../images/subject01.png) no-repeat 12px center;}
#sidebar .subject02 {background: url(../images/subject02.png) no-repeat 12px center;}
#sidebar .subject03 {background: url(../images/subject03.png) no-repeat 12px center;}
#sidebar ul {width: 222px;float:}
#sidebar ul li {line-height: 30px;float: left;width: 222px;border-bottom: 1px dotted #DDDDDD;}
#sidebar ul li a {font-size: 12px;line-height: 30px;color: #686868;float: left;width: 170px;padding-right: 12px;padding-left: 40px;text-decoration: none;display: block;background: url(../images/icon04.gif) no-repeat 22px center;height: 30px;}
#sidebar ul li a:hover {color: #3399FF;}
#sidebar img {float: left;padding-top: 60px;}

#content {width: 678px;position: relative;top: 20px;right: 0px;float: right;padding-bottom: 20px;}
#content a {text-decoration: none;color: #848484;}

#nav {height: 30px;width: 648px;background: url(../images/line02.gif) no-repeat left bottom;float: left;padding-right: 30px;}
#nav span {font: 12px/30px "Times New Roman", Times, serif;color: #777777;}
#nav ul {
	float: right;
	height: 30px;
	font-family: Arial, Helvetica, sans-serif;
}
#nav ul li {float: left;}
#nav a {float: left;background: url(../images/icon03.gif) no-repeat left center;text-align: left;display: inline-block;font-size: 12px;line-height: 30px;color: #888888;text-decoration: none;padding: 0px 16px 0px 12px;}
#nav a:hover {color: #E0751D;}
#nav a.location {
	font-size: 12px;
	line-height: 30px;
	color: #777777;
	background: url(../images/icon02.gif) no-repeat left center;
	padding-right: 10px;
}

#about {
	float: left;
	width: 666px;
	background: url(../images/about_pic05.jpg) no-repeat right bottom;
	padding: 56px 0px 70px 12px;
}
#about .text_box01 {
	float: left;
	width: 348px;
	padding-right: 318px;
	background: url(../images/about_pic01.jpg) no-repeat 270px 30px;
}
#about .text_box01 h2 {
	background: url(../images/about_h2.png) no-repeat 0px 0px;
	text-indent: -9999px;
	float: left;
	height: 26px;
	width: 100%;
	margin-bottom: 20px;
}
#about .text_box02 {float: left;width: 648px;margin-bottom: 80px;}
#about .text_box02 img {float: left;padding-top: 10px;padding-right: 10px;}
#about .text_box03 {float: left;width: 648px;}
#about .text_box03 h2 {font-size: 15px;color: #444444;float: left;width: 100%;margin-bottom: 20px;}
#about p {font-size: 13px;line-height: 176%;color: #848484;margin-bottom: 30px;}

#news {float: left;width: 638px;padding: 56px 30px 40px 0px;}
#news .title {background: url(../images/news_title.jpg);float: left;height: 31px;width: 638px;}
#news ul {float: left;}
#news li {line-height: 30px;float: left;width: 638px;border-bottom: 1px dotted #CCCCCC;overflow: hidden;}
#news ul a {text-decoration: none;color: #868686;font-size: 12px;display: block;}
#news ul a:hover {color:#333333;}
#news .date {font-size: x-small;color: #000000;float: left;width: 52px;font-weight: bold;padding: 0px 34px 0px 22px;}
#news .text {float: left;width: 490px;height: 30px;padding: 0px 25px;overflow: hidden;}

#product {float: left;width: 638px;padding: 56px 30px 40px 0px;}
#product h2 {font-size: 16px;color: #212121;float: left;width: 100%;padding-bottom: 20px;}
#product h3 {
	font-size: 13px;
	color: #686868;
	float: left;
	width: 100%;
	padding-bottom: 10px;
	font-weight: bold;
}
#product h4 {
	color: #5C7DA5;
	font-size: 13px;
	line-height: 32px;
	text-align: center;
	float: left;
	height: 32px;
	width: 182px;
}
#product p {
	font-size: 13px;
	line-height: 168%;
	color: #787878;
	float: left;
	width: 100%;
	padding-bottom: 20px;
}
#product ul.p_box {
	float: left;
	width: 678px;
	padding: 20px 0px 40px;
}
#product ul.p_box li {
	float: left;
	width: 182px;
	min-height: 128px;
	text-align: left;
	vertical-align: middle;
	color: #5C7DA5;
	margin: 0px 40px 40px 0px;
	font-size: 13px;
}
#product ul.p_box li img {
	float: left;
	width: 180px;
	border-top: 1px solid #dddddd;
	border-right: 1px solid #dddddd;
	border-bottom: 2px solid #446A93;
	border-left: 1px solid #dddddd;
}
#product ul.p_box li span {float: left;line-height: 140%;padding: 40px 10px 0px;}
#product .box02 {background: url(../images/p_pic06.jpg) no-repeat 0px 0px;float: left;width: 300px;padding-left: 348px;height: 200px;}
#product .box02 h2 {padding-top: 16px;}
#product .box03 table {width: 100%;border: 2px solid #efefef}
#product .box03 td {padding: 5px;border-right: 1px solid #efefef;border-bottom: 1px solid #efefef}

#application {float: left;width: 970px;padding: 20px 0px 40px 30px;}
#application .content {float: left;padding: 56px 0px 0px 28px;width: 896px;}
#application .title_box {float: left;height: 46px;width: 896px;margin-bottom:46px;background: url(../images/title_box_bg.gif) repeat-x 0px 0px;}
#application h2 {color: #FFFFFF;font: 15px/40px "Microsoft JhengHei";padding-left: 32px;background: url(../images/icon05.gif) no-repeat 16px center;}
#application .list_box {float:left;width:896px;padding-bottom:70px;}
#application .pic_box {float: left;width: 238px;padding-right: 30px;}
#application .pic_box h4 {display: block;width: 100%;font: bold 18px/168% "Microsoft JhengHei", Arial, Helvetica, sans-serif;}
#application .pic_box p {display:block;width:100%;}
#application .txt_box {display: block;padding:15px;border-top: 1px solid #efefef;border-bottom: 1px solid #efefef;overflow: hidden}
#application .txt_box p.set01 {display:inline-block;line-height:150%}
#application .info_box {float:right;width:620px;}
#application .info_box h3, h4 {float: left;}
#application .info_box h3 {color: #333333;font-weight: bold;}
#application .info_box h5 {font-size: 13px;color: #666666;line-height: 150%;}
#application .info_box span {padding-left: 38px;background: url(../images/line03.gif) no-repeat 14px center;float: left;}
#application .info_box th {line-height: 34px;height: 34px;width: 620px;border-bottom: 1px solid #444444;}
#application .info_box td {line-height: 38px;background: url(../images/line04.gif) no-repeat left bottom;width: 290px;vertical-align: middle;}
#application .tablebox table {width: 100%;border: 2px solid #efefef;margin-bottom: 20px}
#application .tablebox td {padding: 5px;border-right: 1px solid #efefef;border-bottom: 1px solid #efefef}
#application .tablebox td.style01 {width:60px;color: #585858;font-size: 1em}
#application .tablebox td.style02 {width:70px;}
#application .tablebox td.style03 {width: 112px;}
#application .tablebox td.style04 {width:95px;}
#application .tablebox h4 {display: block;width: 100%;font: bold 18px/168% "Microsoft JhengHei", Arial, Helvetica, sans-serif;}
#application .style01 {font-size: 20px;color: #D8A292;}
#application .style02 {padding-right: 40px;}
#application .item {background: url(../images/line02.gif) no-repeat left bottom;height: 38px;width: 290px;float: left;line-height: 38px;font-size: 15px;color: #333333;}
#application .exp {float: left;height: 60px;width: 290px;font-size: 13px;line-height: 150%;color: #686868;padding-top: 16px;}
.owl-carousel {float: left;height:250px}
.owl-carousel .owl-item img {height:auto}
.owl-carousel .item {width:100%!important;height:auto!important}
.owl-theme .owl-dots, .owl-theme .owl-nav, .owl-theme .owl-nav {display:none}

#contact {float: left;width: 944px;padding: 20px 0px 40px 56px;}
#contact .left_area {float: left;width: 332px;}
#contact .right_area {float: right;width: 563px;}
#contact .map_box {
	float: left;
	height: 200px;
	width: 328px;
	border: 2px solid #7F99B7;
}
#contact .info_box {
	float: right;
	width: 563px;
	padding-top: 40px;
}
#contact .info_box h2 {
	font-size: 18px;
	color: #54789F;
	font-weight: normal;
	margin-bottom: 10px;
	float: left;
	width: 100%;
}
#contact .info_box p {
	font-size: 13px;
	color: #333333;
	float: left;
	width: 100%;
	padding-bottom: 5px;
}
#contact .info_box span {
	font-size: 12px;
	color: #777777;
	padding-bottom: 20px;
	float: left;
	width: 100%;
}
#contact .forms_box {float: left;padding: 24px 0px 0px 24px;}
#contact .forms_box ul {float: left;width: 563px;}
#contact .forms_box li {float: left;margin-bottom: 10px;}
#contact .forms_box .name {
	text-align: left;
	float: left;
	width: 156px;
	font-size: 12px;
	line-height: 30px;
	color: #666666;
	padding: 0px;
}
#contact .forms_box input {
	background: url(../images/input_bg.jpg) no-repeat 0px 0px;
	float: left;
	height: 26px;
	width: 290px;
	padding-right: 5px;
	padding-left: 5px;
	border: 1px solid #9EB3C9;
	font-size: 12px;
	color: #666666;
}
#contact .forms_box textarea {
	background: url(../images/input_bg.jpg) no-repeat left bottom;
	float: left;
	height: 86px;
	width: 290px;
	padding-right: 5px;
	padding-left: 5px;
	border: 1px solid #9EB3C9;
	font-size: 12px;
	line-height: 150%;
	color: #666666;
}
#contact .forms_box .btn_box {margin-top: 26px;padding-left: 260px;}
#contact .forms_box a.btn {
	background: #7F99B7;
	display: inline-block;
	height: 32px;
	width: 88px;
	font-size: 13px;
	line-height: 32px;
	color: #FFFFFF;
	text-align: center;
	float: right;
	margin-left: 10px;
	cursor: pointer;
	text-decoration: none;
}
#contact .forms_box a.btn:hover {background: #363636;}

#pagination {float: left;height: 32px;width: 100%;line-height: 32px;text-align: center;margin: 20px 0px 40px;}
#pagination .prve {height: 32px;display: inline-block;background: url(../images/icon_prve.png) no-repeat left center;padding-left: 24px;}
#pagination a {text-decoration: none;font-size: 12px;color: #828282;display: inline-block;padding: 0px 10px;}
#pagination a:hover {color: #333;}
#pagination a.location {color: #E37344;text-decoration: underline;}
#pagination .next {height: 32px;display: inline-block;background: url(../images/icon_next.png) no-repeat right center;padding-right: 24px;}

#footer {width: 940px;position: relative;background: url(../images/footer_bg.jpg) repeat-x 0px 0px;height: 74px;margin: 0px auto;padding: 14px 30px 0px;}
#footer .left_area {float: left;width: 470px;text-align: left;}
#footer .right_area {float: right;width: 470px;text-align: right;}
#footer span {font-size: 12px;line-height: 18px;color: #dddddd;float: left;width: 100%;}
#footer .company {font-size: 15px;font-family: "微軟正黑體";color: #efefef;padding-bottom: 5px;}
#footer .design {color: #999999;}
#footer .design a {color: #999999;text-decoration: none;}