@charset "utf-8";
/* CSS Document */
body{ margin:0; padding:0; font-size:13px; color:#333; line-height:22px; font-family: "微軟正黑體" ;}
.addgray_bg{ background:url(../images/front/index/gray_bg.png); }
.indx_all_container{ background:url(../images/front/index/gray_bg.png); position:relative; }
.index_main_container{ width:1000px; margin:0 auto; padding:0; position:relative; height:600px;}
.index_header{ background:url(../images/front/index/blue_bg.png) repeat-x; height:26px;position: fixed; top:0; right: 0;left: 0; z-index:1000;}
.index_header .header_container{width:1000px; margin:0 auto; padding:0; position:relative;}
.index_version{ float:right; background:url(../images/front/index/blue_light01.png) center no-repeat; width:130px;}
.index_version a{ width:60px; display:block; height:26px; float:left; text-align:center; color:#FFF; text-decoration:none;}
.index_version a:hover{ background:url(../images/front/index/blue_light_hover.png) center no-repeat;}
.index_cover{ position: absolute; top:0; left:0;}
.index_skip{ position:absolute; left:470px; width:100px; height:50px; top:400px; }
.index_skip a{ color:#F00; text-decoration:none; font-size:20px;}
.index_slogan{ background:url(../images/front/index/slogan.png) no-repeat; width:474px; height:470px; position:absolute; left:263px; top:70px;}
.index_slogan h2, .index_slogan ul{ display:none;}
.animateCircle{ position:absolute; left:160px; top:-3px;}

.index_products{ background:url(../images/front/index/introduce.png) no-repeat; width:247px; height:249px; position:absolute; left:750px; top:320px; z-index:999;}
.index_products h3, .index_products p{ display:none;}
.cover_left{ background:url(../images/front/index/gray_cover_left.png) no-repeat; background-size:auto 100%; width:201px; height:600px; position:absolute; left:0; top:0; z-index:1000;}
.cover_right{ background:url(../images/front/index/gray_cover_right.png) no-repeat; background-size:auto 100%; width:201px; height:600px; position:absolute; left:799px; top:0;z-index:1000;}

.index_footer{ height:88px; background:url(../images/front/index/footer_gray_bg.png);}
.index_footer .footer_container{width:1000px; margin:0 auto; padding:0;  background:url(../images/front/index/footer_bg.png); height:88px; position:relative;}
.index_footer .footer_container img{ margin-top:25px;}

.hide{ display:none;}
.add_margin01{ margin:10px 0;}
.index_footer .footer_container .google_map{ width:20px; height:20px; display:block;  position:absolute; left:125px; top:40px;}
.index_footer .footer_container .email{ width:20px; height:20px; display:block;  position:absolute; left:800px; top:40px;}
.slide_container{ width:100%;}
.flexslider li img{
	/*-webkit-filter: grayscale(0.5);
	filter: grayscale(0.5);*/
	-webkit-filter: brightness(1.2);
  	filter: brightness(1.2);
	}
.all_container{ width:920px; margin:0 auto; padding:0;}

.header_container{ height:131px; margin-bottom:3px; position:relative; z-index:9999;}
.header_container .logo{ background:url(../images/front/header/logo.gif) no-repeat; width:340px; height:40px; position:absolute; top:27px; left:0; text-indent:-9999px;}
.header_container .links{ position:absolute; right:0; top:3px; color:#767676;}
.header_container .links a{ text-decoration:none; color:#009cff; background: url(../images/front/icons/icon_black_arrow02.png) left center no-repeat; padding-left:12px; }
.header_container .links a:hover{ color:#F00;}
.header_container .links .ver_tw,.header_container .links .ver_en{ color:#c7c7c7; }
.header_container .links .active{ color:#F00;}

.header_container .facebook{ background:url(../images/front/header/icon_facebook.png) center no-repeat; padding:10px; width:20px; height:20px; margin-left:5px;}
.header_container .navi{ background:url(../images/front/header/navi_bg.png) repeat-x; width:100%; height:49px; position:absolute; top:82px;}
.header_container .navi ul{ list-style:none; margin:0; padding:0;}
.header_container .navi ul ul ul{ list-style:none; margin:0 0 0 200px; padding:0;}
.header_container .navi ul li{ background:url(../images/front/header/navi_separate_line.png) left center no-repeat; float:left; height:49px; color:#FFF; text-decoration:none; line-height:49px; text-align:center; font-size:15px; cursor:pointer;}
.header_container .navi ul li li{ background:none; padding:0; height:25px; line-height:25px; text-align:left; font-size:13px; border-bottom:1px solid #b2b2b3; width:200px;}
.header_container .navi ul li:first-child{ background:none;}
.header_container .navi ul li a{padding: 0 15px; color:#FFF; text-decoration:none; line-height:49px; text-align:center; font-size:15px; display:block;}
.header_container .navi ul li a:hover{ color:#F00;}
.header_container .navi ul li li a{ color:#FFF; text-decoration:none; line-height:25px; text-align:left; font-size:13px; padding:0 0 0 15px}
.header_container .navi ul.flexnav .flexnav{ display:none;}


.footer_container{ background:url(../images/front/footer/gray_bg.png);  position:relative; width:100%; height:100px; margin-bottom:20px;}
.footer_container .logo{ background:url(../images/front/footer/logo.png) no-repeat; width:279px; height:32px; position:absolute; left:30px; top:35px;}
.footer_container .logo h5{ display:none;}
.footer_container .address{ background:url(../images/front/footer/address.png) no-repeat;  width:507px; height:53px; position:absolute; left:340px; top:27px;}

.footer_container .google_map{ width:20px; height:20px; display:block;  position:absolute; left:0px; top:15px; }
.footer_container .email{ width:20px; height:20px; display:block;  position:absolute; left:260px; top:35px; }

.home_content01{ height:386px; margin-bottom:15px;}
.home_content01:after {content:""; clear:both; display:block;}
.home_flash_banner{ float:left; overflow:hidden; width:920px; height:386px; background:url(../images/front/icons/loading01.gif) center no-repeat;}
.home_lastest_products{ float:right; width:300px; display:none;}
.home_lastest_products img:hover{opacity: 0.4; filter: alpha(opacity=40); /* For IE8 and earlier */}
.home_lastest_products:after{content:""; clear:both; display:block;}
.home_lastest_products .title{ background:url(../images/front/blue_title_bg01.png) repeat-x; height:31px; color:#FFF; font-size:15px; padding-left:10px; line-height:31px;}
.home_lastest_products .title a{ background: url(../images/front/icons/icon_gray_arrow01.png) left center no-repeat; width:65px; display:block; float: right; padding-left:15px; color:#F00; text-decoration:none; font-size:12px;  }
.home_lastest_products .title a:hover{ color:#FFF;}
.home_lastest_products .content{ border:1px solid #e0e0e0; border-top:none; padding:7px; }
.home_lastest_products .content:after{content:""; clear:both; display:block;}
.home_lastest_products .content .item{border:1px solid #e0e0e0; padding:7px; font-size:13px; width:122px;float:left; height:323px; }
.home_lastest_products .content .item:first-child{ margin-right:7px; }
.home_lastest_products .content .item h3{ margin:0; padding:0; color:#F00;font-size:13px; }
.home_lastest_products .content .item h4{ margin:0; padding:0; color:#666;font-size:13px; }
.home_lastest_products .content .item p{ margin:0; padding:0; color:#0d62bc; line-height:22px;}

.home_content02{ height:350px; margin-bottom:30px;}
.home_content02:after {content:""; clear:both; display:block;}
.home_news{ float:left; width:359px; margin-right:10px;}
.home_news .title{ background:url(../images/front/gray_title_bg01.png) repeat-x; height:31px; color:#003eae;  font-size:15px; padding-left:10px; line-height:31px;-webkit-border-top-left-radius:5px; -webkit-border-top-right-radius:5px; -moz-border-radius-topleft:5px; -moz-border-radius-topright:5px; border-top-left-radius:5px; border-top-right-radius:5px;}
.home_news .title a{ background: url(../images/front/icons/icon_gray_arrow01.png) left center no-repeat;  margin-right:10px;/*width:65px;*/  display:block; float: right; padding-left:15px; color:#F00; text-decoration:none; font-size:12px;  }
.home_news .content{border:1px solid #e0e0e0; border-top:none; padding:7px; height:319px }
.home_news .content ul{ margin:0; padding:0; list-style:none;}
.home_news .content ul li{position:relative; background:url(../images/front/icons/icon_red_dot01.png) 0px 13px no-repeat; border-top:#999 dotted 1px; padding:5px 0 5px 10px; height:45px; }
.home_news .content ul li a{ color:#333; text-decoration:none; }
.home_news .content ul li a:hover{ color:#F00;}
.home_news .content ul li span{ display:inline-block; position:absolute; right:0px; bottom:7px; color:#9c9c9c; font-size:11px;}
.home_news .content ul li:first-child{ border:none;  }
.home_test{float:left;  width:303px;}
.home_test .title{ background:url(../images/front/gray_title_bg01.png) repeat-x; height:31px; color:#003eae;  font-size:15px; padding-left:10px; line-height:31px; -webkit-border-top-left-radius:5px; -webkit-border-top-right-radius:5px; -moz-border-radius-topleft:5px; -moz-border-radius-topright:5px; border-top-left-radius:5px; border-top-right-radius:5px;}
.home_test  .title a{ background: url(../images/front/icons/icon_gray_arrow01.png) left center no-repeat; margin-right:10px;/*width:65px;*/  display:block; float: right; padding-left:15px; color:#F00; text-decoration:none; font-size:12px;  }
.home_test .content{border:1px solid #e0e0e0; border-top:none; padding:7px; height:319px }
.home_test .content img{ float:left; margin:0 10px 10px 0; border:1px #dfdfdf solid;}
.home_test .content img:hover{filter:alpha(Opacity=50, Style=0);/*for ie*/ 	-moz-opacity:0.5;/* Moz + FF */ 	opacity: 0.5;/* CSS3的標準語法，FOR支援CSS3的瀏覽器（FF 1.5）*/}
.home_test .content div{ margin-bottom:10px;}
.home_test .content div:after {content:""; clear:both; display:block;}
.home_video{ float:right; width:242px;}
.home_video .title{ background:url(../images/front/gray_title_bg01.png) repeat-x; height:31px; color:#003eae;  font-size:15px; padding-left:10px; line-height:31px; -webkit-border-top-left-radius:5px; -webkit-border-top-right-radius:5px; -moz-border-radius-topleft:5px; -moz-border-radius-topright:5px; border-top-left-radius:5px; border-top-right-radius:5px;}
.home_video .title a{ background: url(../images/front/icons/icon_gray_arrow01.png) left center no-repeat;  margin-right:10px;/*width:65px;*/ display:block; float: right; padding-left:15px; color:#F00; text-decoration:none; font-size:12px;  }
.home_video .content{border:1px solid #e0e0e0; border-top:none; padding:7px; height:319px }
.home_video .content h3{ margin:0; padding:0; font-size:12px; font-weight:400;}
.home_video .content .item{ margin-bottom:10px; overflow: hidden;}
.home_content03{ margin-bottom:15px;}
.service .title{ background:url(../images/front/blue_title_bg01.png) repeat-x; height:31px; color:#FFF; font-size:15px; padding-left:10px; line-height:31px; -webkit-border-top-left-radius:5px; -webkit-border-top-right-radius:5px; -moz-border-radius-topleft:5px; -moz-border-radius-topright:5px; border-top-left-radius:5px; border-top-right-radius:5px;}
.service .content{border:1px solid #e0e0e0; border-top:none; padding:7px 20px;  }
.service .content:after {content:""; clear:both; display:block;}
.service .content ul{ margin:0; padding:0; list-style:none;}
.service .content ul li{ width:200px; float:left; background:url(../images/front/icons/icon_black_arrow02.png) 0  5px no-repeat; padding-left:12px; }
.service .content ul li ul{ margin-left:15px;}
.service .content ul li ul:after {    content:"";    clear:both;    display:block;}
.service .content ul li:nth-child(5n) { clear:left;}
.service .content ul li h3{ margin:0 0 5px 0; padding:0; color:#333;}
.service .content ul li li{ width:100%; display:block; background:no-repeat; padding-left:0px;}
.service .content ul li li a{ color:#0d62bc; text-decoration:none; background:url(../images/front/icons/icon_gray_dot01.png) left center no-repeat; padding-left:10px;}
.service .content ul li li a:hover{ color:#F00;}

.detail_content ul.project_ul{ margin-left:0;}
.project_ul{ margin:0; padding:0; list-style:none;}
.project_ul li{ width:22%; float:left; background:url(../images/front/icons/icon_black_arrow02.png) 0  5px no-repeat; padding-left:12px; }
.project_ul li:nth-child(5n) { clear:left;}
.project_ul:after {    content:"";    clear:both;    display:block;}
.project_ul li li{ width:100%; display:block; background:no-repeat; }
.project_ul a{ color:#0d62bc; text-decoration:none; background:url(../images/front/icons/icon_gray_dot01.png) left center no-repeat; padding-left:10px;}
.project_ul a:hover{ color:#F00;}

.lazy{
    background-color:#dfdfdf;
    background-image:url(../images/front/loader.gif);
    background-repeat:no-repeat;
    background-position:center;
}

.marquee_slide{ position:relative;}
.owl-carousel{ height:115px;}
.owl-carousel .owl-stage-outer{ height:115px;}
.owl-carousel img{ height:115px; width:auto !important;}
.dynamic_title_div{ z-index:999;display: none; position:absolute; top:0; left:0; background:rgba(7,38,70,0.6); color:#FFF; font-size:18px;  width:100%;}
.dynamic_title_div b{padding:10px; font-weight:400; display:block; }
.detail_path{ background:url(../images/front/icons/icon_black_next_arrow01.png) left center no-repeat ; padding-left:18px;}
.detail_path a{ color:#F00; text-decoration:none; }
.detail_path a:hover{ color:#0b59aa; text-decoration:none; }
.detail_title{ background:url(../images/front/blue_title_bg02.png) repeat-x; height:40px; color:#FFF; /*-webkit-border-top-left-radius:8px; -webkit-border-top-right-radius:8px; -moz-border-radius-topleft:8px; -moz-border-radius-topright:8px; border-top-left-radius:8px; border-top-right-radius:8px;*/ padding:10px 0 0 10px; font-size:18px; font-weight:800;     line-height: 30px;}
.detail_content{border:1px solid #e0e0e0; border-top:none; padding:10px; margin-bottom:20px; min-height:200px;}
.detail_content:after {content:""; clear:both; display:block;}
.detail_content h3{ margin:20px 0 5px 0; padding:0 0 0 15px; color:#0b59aa; font-size:16px; line-height:24px; background:url(../images/front/icons/icon_red_arrow01.png) left center no-repeat; border-bottom:1px dashed #CCC;  }
.detail_content h3:nth-of-type(1){ margin:0 0 5px 0;}
.detail_content p{ margin:0 0 10px 0px; padding:0; font-size:15px;}
.detail_content p a{/* background:url(../images/front/icons/icon_more01.gif) center no-repeat; margin-left:10px; width:45px; height:11px; display:inline-block;*/}
.detail_content p img{-webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;}
.detail_content ul{ margin-left:-3px;}
.detail_content img{ max-width:100%;}

ul.sub_navi_ul{ margin:20px 20px 0 20px; padding:0; list-style:none; font-size:14px;}
ul.sub_navi_ul ul{ display:block; margin:0;}
ul.sub_navi_ul li{ width:33%;  line-height:24px; margin:0;display: inline-block; padding-bottom:20px; vertical-align:top; }
ul.sub_navi_ul li a{ color:#333; text-decoration:none; background:url(../images/front/icons/icon_gray_dot01.png) left center no-repeat; padding-left:10px;}
ul.sub_navi_ul li li a{color:#0d62bc;}
ul.sub_navi_ul li a:hover{ color:#F00;}
ul.sub_navi_ul li ul{ margin-left:15px;}
ul.sub_navi_ul li ul:after {    content:"";    clear:both;    display:block;}
ul.sub_navi_ul li:nth-child(5n) { clear:left;}
ul.sub_navi_ul li h3{ margin:0 0 5px 0; padding:0; color:#333;}
ul.sub_navi_ul li li{ width:100%; display:block; background:no-repeat; padding-left:0px; padding-bottom:0px;}
ul.sub_navi_ul li li a{ color:#0d62bc; text-decoration:none; background:url(../images/front/icons/icon_gray_dot01.png) left center no-repeat; padding-left:10px;}
ul.sub_navi_ul li li a:hover{ color:#F00;}
.sub_navi_div{ background:#f4f4f4; padding:5px 15px; margin-bottom:10px;}
.sub_navi_div ul:after{ display:block; content:''; clear:both; }

.set_width{ width:620px; float:left;}

.detail_youtube{ width:250px; padding:5px; float:right; margin-top:0px;  margin-left:15px; }
.detail_youtube iframe{ margin-bottom:10px; border:1px solid #e0e0e0;padding:5px; }

.detail_project{}
.detail_project ul{ margin:0; padding:0; list-style:none;}
.detail_project li{ width:33%; float:left; text-align:center;}
.detail_project li img{-webkit-border-radius: 3px;-moz-border-radius: 3px; border-radius: 3px; width:180px;  height:135px;  border:none;}
.detail_project li img:hover{filter:alpha(Opacity=50, Style=0);/*for ie*/ 	-moz-opacity:0.5;/* Moz + FF */ 	opacity: 0.5;/* CSS3的標準語法，FOR支援CSS3的瀏覽器（FF 1.5）*/}
.detail_project:after {content:""; clear:both; display:block;}

.add_margin_left{ margin-left:15px;}


.project_list{}
.project_list ul{ margin:0; padding:0; list-style:none;}
.project_list li{ width:25%; display:inline-block; text-align:center; vertical-align:top; margin-bottom:10px;}
.project_list li a{ display:inline-block; width:180px; height:135px; -webkit-border-radius: 3px;-moz-border-radius: 3px; border-radius: 3px;}
.project_list li img{-webkit-border-radius: 3px;-moz-border-radius: 3px; border-radius: 3px; width:180px; height:135px; border:none;}
.project_list li img:hover{filter:alpha(Opacity=50, Style=0);/*for ie*/ 	-moz-opacity:0.5;/* Moz + FF */ 	opacity: 0.5;/* CSS3的標準語法，FOR支援CSS3的瀏覽器（FF 1.5）*/}
.project_list:after {content:""; clear:both; display:block;}
 
 
.color01{color:#F00;}
.color02{color:#0b59aa;}
.color03{color:#000080;}
.font16{ font-size:16px; line-height:24px;}
.floatL{ display:block;  float:left; margin-right: 25px;}
.floatR{ display:block; float:right; margin-left:25px;}

.marquee_slide{ margin-bottom:0px; min-height:80px;}
ul.slide{margin:0; padding:0; height:150px; list-style-type:none;}
ul.slide li{float:left; list-style-type:none;} 
ul.slide img{border: none; height:115px;}



.product_list{ list-style:none; margin:0; padding:0;}
.product_list li{ float:left; width:257px;-webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; border:1px solid #8fbae6; padding:10px; margin:10px; background:#f7f5f5; min-height:280px; }
.product_list li h4{ color:#00458b; margin:0 0 10px 0; padding:0;}
.product_list:after {content:""; clear:both; display:block;}
.product_list li img:hover{opacity: 0.4; filter: alpha(opacity=40); /* For IE8 and earlier */}

.news_list{ list-style:none; margin:0; padding:0;}
.news_list li{ border-bottom:1px dashed #d1d1d1;background: url(../images/front/icons/icon_red_dot01.png) 0px 13px no-repeat; padding:5px 10px; font-size:16px;}
.news_list li a{ color:#333; text-decoration:none;}
.news_list li a:hover{ color:#F00;}
.news_list li span{ float:right; font-size:12px;}

.video_list{ list-style:none; margin:0; padding:0;}
.video_list li{ float:left; width:257px;-webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; border:1px solid #8fbae6; padding:10px; margin:10px; background:#f7f5f5; min-height:180px; }
.video_list li h4{ color:#00458b; margin:0 0 10px 0; padding:0;}
.video_list:after {content:""; clear:both; display:block;}

.pdf_list ul{   margin:0 0 10px 25px; padding:0;}
.pdf_list li{ float:left; width:50%; background:url(../images/front/icons/icon_pdf01.png) left center no-repeat; }
.pdf_list li a{padding-left:20px; text-decoration:none; color:#333; }
.pdf_list li a:hover{ color:#F00;}
.pdf_list,.pdf_list ul:after {content:""; clear:both; display:block;}

.sidemap{ }
.sidemap li{ width:25%; float:left; margin-bottom:20px;}
.sidemap li a{ color:#0d62bc; text-decoration:none;}
.sidemap li a:hover{ color:#F00;}
.sidemap li:nth-child(5n) { clear:left;}
.sidemap li ul{ }
.sidemap li ul:after {   content:"";    clear:both;    display:block;}
.sidemap li li{ width:100%;margin-bottom:0; }
.sidemap li li a{ color:#0d62bc; text-decoration:none; font-size:13px; }
.sidemap li li a:hover{ color:#F00;}
.siteMapTitle{ font-size:16px; }

.txtWid01{ width:200px;}
.txtWid02{ width:400px;}
.txtWid03{ width:600px;}

.textArea01{width:400px; height:100px;}
.textArea02{width:600px; height:200px;}
.error{ color:#F00;}
.contact_div{ padding:10px 0 0 150px;}

.scroll-img {
  width: 920px;
  height: 150px;
  overflow: hidden;
  font-size: 0;
}
.scroll-img ul {
  width: 3000px;
  height: 150px;
  margin: 0;
}
.scroll-img ul li {
  display: inline-block;
  margin: 0px;
}
.scroll-img ul li img{ width:230px; height:140px;}
.sub_navi_list{border: 1px solid #e0e0e0;  border-bottom:none; padding-top:15px;}
.sub_navi_list:before,.sub_navi_list:after,.sub_navi_list ul:after{ content:"";    clear:both;    display:block;}
.sub_navi_list ul{ margin:0 20px; padding:0 0 15px 0; list-style:none; /*border-bottom:1px dashed #ececec;*/}
.sub_navi_list li{ float:left; width:30%; background:url(../images/front/icons/icon_black_arrow01.png) left center no-repeat; padding-left:22px;}
.sub_navi_list li a{ text-decoration:none; font-size:16px; line-height:30px; color:#0082d5;}
.sub_navi_list li a:hover{ color:#F00;}

.send_button_div{ display:none;}
.show_verification_code{ border:1px solid #999; padding:1px; 3px; cursor:pointer;}
.verification_input{ display:none;}

.contextMenu {
	position: absolute;
	width: 120px;
	z-index: 99999;
	border: solid 1px #CCC;
	background: #EEE;
	padding: 0px;
	margin: 0px;
	display: none;
}

.contextMenu li {
	list-style: none;
	padding: 0px;
	margin: 0px;
}