@charset "utf-8";
/* CSS Document */

@import url("reset.css");

body{ background: url(../images/bg.jpg) repeat-x; font-family:Arial, Helvetica, sans-serif; font-size:13px; color:#7d7d7d; line-height:1.6;}
a{ text-decoration:none;}

body.About #Wrapper #Header .container ul#topnav li.About a{background-position:0px -45px;}
body.Products #Wrapper #Header .container ul#topnav li.Products a{background-position: -112px -45px;}
body.References #Wrapper #Header .container ul#topnav li.References a{background-position:-224px -45px;}
body.Message #Wrapper #Header .container ul#topnav li.Message a{background-position:-336px -45px;}
body.Contact #Wrapper #Header .container ul#topnav li.Contact a{background-position:-448px -45px;}
body.Hino #Wrapper #Header .container ul#topnav li.Hino a{background-position:-560px -45px;}

/*=======================================================================================================*/
#WrapperBG{ width:1050px; margin:0 auto; background:url(../images/bgbg.jpg);}
#Flash{ width:1050px; margin:0 auto; position:relative; z-index:1;}
#Wrapper{ width:1050px; margin:0 auto; position:absolute; z-index:10;}



/*=======================================================================================================*/
#Header{ background:url(../images/header_bg.png) no-repeat; height:120px;}
#Header .logo{ float:left; width:260px; height:120px; text-align:center;}
#Header .container {float:left; width:560px; height:45px; margin:29px 0 0 53px;}

ul#topnav { /*width:560px;*/width:672px; margin:0 auto; position:relative;}
ul#topnav li { float:left;}
ul#topnav li a { display:block; width:112px; height:45px; background-image:url(../images/menu.png); text-indent:-9999px;}
ul#topnav li.About a {background-position:0px 0;}
ul#topnav li.Products a {background-position:-112px 0;}
ul#topnav li.References a {background-position:-224px 0;}
ul#topnav li.Message a {background-position:-336px 0;}
ul#topnav li.Contact a {background-position:-448px 0;}
ul#topnav li.Hino a {background-position:-560px 0;}

ul#topnav li.About a:hover {background-position:0px -45px;}
ul#topnav li.Products a:hover {background-position:-112px -45px;}
ul#topnav li.References a:hover {background-position:-224px -45px;}
ul#topnav li.Message a:hover {background-position:-336px -45px;}
ul#topnav li.Contact a:hover {background-position:-448px -45px;}
ul#topnav li.Hino a:hover {background-position:-560px -45px;}

ul#topnav li span {
	float: left; position: absolute; display: none;
	left: 0px; top:45px; height:28px; width: 530px; padding:0 15px;
	background:url(../images/menu_little.png); color: #c4c4c4; font-size:11px;line-height:25px;}
ul#topnav li:hover span { display: block; }
ul#topnav li span a {display:inline;background:url(../images/spacer.gif); font-size:12px; color:#c4c4c4; text-decoration:none; margin:0 5px;}
ul#topnav li span a:hover { background:url(../images/spacer.gif); color:#92dfff; text-decoration:none; }

#Header .Little{float:left; width:170px; height:30px; /*margin:29px 0 0 0;*/ padding:15px 0 0 0; text-align:center; font-size:11px; color:#999; background:url(../images/top_box.png);}
#Header .Little a{ color:#999; text-decoration:none;}
#Header .Little a:hover{ color:#496bcc; text-decoration:none;}



/*=======================================================================================================*/
#Contain{ clear:both;}
#Contain .Center_index_line{ background:url(../images/index_box.jpg); height:12px; margin:420px 0 1px 0;}
#Contain .Center_index{ display:none; background:url(../images/index_box.jpg); height:168px; margin:340px 0 15px 0; padding:20px 50px 23px 50px;}
#Contain .Center_index .Index_News{ float:left; width:280px; display:none;}
#Contain .Center_index .Index_News .More{ margin:0 0 3px 120px;}
/*
#Contain .Center_index .Index_Hot{ float:left; width:360px; height:140px; margin:0 20px; padding:28px 5px 0 5px; background:url(../images/area_hot.png);}
#Contain .Center_index .Index_Hot h4{ display:block; background:#039; padding:2px 10px; color:#fff; font-size:10px; line-height:13px; width:130px; margin:0 0 0 180px;}
#Contain .Center_index .Index_Hot h5{ color:#333; font-size:15px; margin-bottom:8px;}
#Contain .Center_index .Index_Hot .link{display:block; text-align:right; margin-bottom:10px; }
#Contain .Center_index .Index_Hot .link a{ padding:0 3px; font-size:9px; line-height:10px; background:#ecebea; color:#999; margin-right:3px; border:1px solid #d6d6d6;}
#Contain .Center_index .Index_Hot .link a:hover{color:#206ac2;}
#Contain .Center_index .Index_Hot .link a.stay{color:#206ac2;}
#Contain .Center_index .Index_Hot p{ color:#999; font-size:12px; line-height:1.3;}
#Contain .Center_index .Index_Hot .Btn_right{ float:right; margin-top:40px;}
#Contain .Center_index .Index_Hot .Btn_left{ float:left; margin-top:40px;}
#Contain .Center_index .Index_Hot .PIC{ float:left;}
*/
#Contain .Center_index .Index_Btn{float:left; width:260px;}
#Contain .Center_index .Index_Btn ul{}
#Contain .Center_index .Index_Btn li a{display:block; width:257px; background:url(../images/area_button.png);}
#Contain .Center_index .Index_Btn li.QA a{ height:82px; background-position:0 0;}
#Contain .Center_index .Index_Btn li.PP a{ height:86px; background-position:0 -82px;}
#Contain .Center_index .Index_Btn li.QA a:hover{ background-position:-257px 0;}
#Contain .Center_index .Index_Btn li.PP a:hover{ background-position:-257px -82px;}

/* Index_Hot */
	.Index_Hot { display:block; float:left; width:660px; height:140px; margin:0 20px 0 0; padding:28px 5px 0 5px; background:url(../images/area_hot.png);
	/*position:relative; z-index:0;*/ /*width:360px;  margin:0 20px;*/}
	.hot_product{ /*width:360px;*/ width:660px; height:140px; position:relative;}

	/* Slideshow style */
	#slides { position:absolute; z-index:100;}
	.slides_container{ /*width:360px;*/ width:660px; height:140px; overflow:hidden; position:relative; display:none;}
	#slides .slide { /*float:left; width:320px;*/ width:660px; height:140px; display:block; }

	/* Next/prev buttons */
	#slides .next { position:absolute; top:45px; left:645px;/*left:342px;*/ width:17px; height:34px; display:block; z-index:101;}
	#slides .prev { position:absolute; top:45px; width:18px; height:34px; display:block; z-index:101;}

	/* Pagination */
	.pagination { display:none; margin:26px auto 0; width:100px;}

	.slide .img{ float:left; width:164px; padding:0 10px 0 20px;}
	.slide .text{float:left; width:440px;/*width:140px;*/}
	.slide .text h4{ display:block; background:#039; padding:2px 10px; color:#fff; font-size:10px; line-height:13px;}
	.slide .text h5{ color:#333; font-size:15px; margin-bottom:8px;}
	.slide .text p{ color:#999; font-size:12px; line-height:1.3;}





#Contain .Left{ float:left; width:282px; margin:175px 0 0 0;}
#Contain .Left .Title{ background:url(../images/left_bg.png) 0 0; height:120px;}
#Contain .Left .Title h1{ display:block; width:220px; height:30px; margin:0 32px 0 30px; text-indent:-9999px; background:url(../images/h1.png);}
#Contain .Left .Title h1.About{ background-position:0 0;}
#Contain .Left .Title h1.Products{ background-position:0 -30px;}
#Contain .Left .Title h1.References{ background-position:0 -60px;}
#Contain .Left .Title h1.Message{ background-position:0 -90px;}
#Contain .Left .Title h1.Contact{ background-position:0 -120px;}
#Contain .Left .Title h1.Sitemap{ background-position:0 -150px;}
#Contain .Left .Title h1.Search{ background-position:0 -180px;}
#Contain .Left .Title h1.News{ background-position:0 -210px;}
#Contain .Left .Title h1.Hino{ background-position:0 -240px;}
#Contain .Left .Menu{ background:url(../images/left_bg.png) 0 -120px;}
#Contain .Left .Menu ul{ margin:0 32px 0 30px;}
#Contain .Left .Menu li{ font-size:13px; line-height:28px;}
#Contain .Left .Menu li a{ display:block; background:url(../images/left_menu.png); color:#a1d4e2; padding:0 0 0 55px;}
#Contain .Left .Menu li a:hover{ background:url(../images/left_menu.png) bottom; color:#fefefe; font-weight:bold;}
#Contain .Left .Menu li a.stay{ background:url(../images/left_menu.png) bottom; color:#fefefe; font-weight:bold;}
#Contain .Left .Menu_Down{ background:url(../images/left_bg.png) bottom; height:85px;}
#Contain .Left .Center{ display:block; width:205px; margin:0 0 0 46px; background:url(../images/left_box.png) no-repeat;}
#Contain .Left .Center .Link { padding:120px 0 30px 5px;}
#Contain .Left .Center .Link .Btn_Service01{ width:62px; height:82px; border:0;background:url(../images/left_button.png) 0 0;}
#Contain .Left .Center .Link .Btn_Idea01{ width:62px; height:82px; border:0;background:url(../images/left_button.png) -62px 0;}
#Contain .Left .Center .Link .Btn_Online01{ width:62px; height:82px; border:0;background:url(../images/left_button.png) -124px 0;}
#Contain .Left .Center .Link .Btn_Service02{ width:62px; height:82px; border:0;background:url(../images/left_button.png) 0 -82px;}
#Contain .Left .Center .Link .Btn_Idea02{ width:62px; height:82px; border:0;background:url(../images/left_button.png) -62px -82px;}
#Contain .Left .Center .Link .Btn_Online02{ width:62px; height:82px; border:0;background:url(../images/left_button.png) -124px -82px;}



#Contain .Main{ float:left; width:680px;/* height:720px;*/ margin:175px 0 0 0; padding:0 68px 0 20px; background:url(../images/main_bg.png) no-repeat; text-align:justify;}
#Contain .Main h1{ display:block; width:100%; height:60px; background:url(../images/shadow.png) bottom no-repeat; padding:25px 0 0 0; color:#2a2a2a; font-size:25px; line-height:30px;}
#Contain .Main h2{}
#Contain .Main h3{ display:block; color:#000; font-size:15px; padding-left:20px; margin:10px 0 5px 0px; background:url(../images/icon_title-blue.png) no-repeat;}
#Contain .Main h4{ display:block; width:100%; line-height:35px; text-align:right; font-size:11px; color:#fff;}
#Contain .Main p.Edit{display:block; padding:0 18px 20px 340px; text-align:justify;}
#Contain .Main img.PhotoLeft{ float:left; position:relative; z-index:1;}
#Contain .Main img.PhotoRight{ float:right;position:relative; z-index:5;}

#Product_Box{}
#Product_Box ul{}
#Product_Box li{ float:left; margin:0 10px 15px 0;width:200px; text-align:center; }
#Product_Box li img{  width:200px; height:120px; padding:1px; border:1px solid #069; }
#Product_Box li a{ color:#555;}
#Product_Box li a:hover{ color:#63C;}



/*=======================================================================================================*/

	#Fade_Pic_index { position:relative; width:1050px; height:660px; background:url(../images/slides/slide_index.jpg);}
		#Fade_Pic_index a.ad { position:absolute;}
		#Fade_Pic_index .control  { display:none; position:absolute; right:10px; bottom:10px;}
		#Fade_Pic_index .control a{ display:inline-block; padding:2px; margin:0 3px; width:12px; color:#fff; background:#024b8f; font-size:10px; text-align:center;}
		#Fade_Pic_index .control a.on{ font-weight:bold; color:#fff; background:#01a88e;}


	#Fade_Pic_top { position:relative; width:1050px; height:330px; background:url(../images/slides/slide_top.jpg);}
		#Fade_Pic_top a.ad { position:absolute;}
		#Fade_Pic_top .control  { display:none; position:absolute; right:10px; bottom:7px;}
		#Fade_Pic_top .control a{ display:inline-block; padding:2px; margin:0 3px; width:12px; color:#fff; background:#024b8f; font-size:10px; text-align:center;}
		#Fade_Pic_top .control a.on{ font-weight:bold; color:#fff; background:#01a88e;}




/*=======================================================================================================*/
#Fooder{ clear:both; background:url(../images/fooder_bg.jpg); height:120px; color:#868686;}
#Fooder .Link{ width:695px; height:25px; margin:0 65px 0 290px; text-align:center; font-weight:bold; font-size:13px; line-height:26px;}
#Fooder .Link a{ color:#868686; padding:0 8px;}
#Fooder .Link a:hover{ color:#0b80da;}
#Fooder .Logo{ float:left; width:280px; height:80px; text-align:center; margin:0 0 0 0; padding:5px 0 0 0;}
#Fooder .Edit{ float:left; width:570px; margin:15px 0 0 0; font-size:11px; line-height:17px; }
#Fooder .Edit a{color:#868686;}
#Fooder .Edit a:hover{ color:#2981c7;}
#Fooder .MB{ float:left; width:150px; text-align:right; margin:22px 0 0 0; font-size:10px; line-height:20px;}


/*============================================================================================================*/
br.CLEAR{ clear:both; height:0px; line-height:0px; font-size:1px;}



/*===== 按鈕區 ===============================================================================================*/
.Btn_Box{ width:100%; text-align:center;}
.Btn_Backhom01{width:61px; height:21px; border:0; background:url(../images/btn_seat.png) 0px -42px; margin:0 1px 0 0;}
.Btn_Backhom02{width:61px; height:21px; border:0; background:url(../images/btn_seat.png) -61px -42px;}
.Btn_Next01{width:61px; height:21px; border:0; background:url(../images/btn_seat.png) 0px -21px; margin:0 1px 0 0;}
.Btn_Next02{width:61px; height:21px; border:0; background:url(../images/btn_seat.png) -61px -21px;}
.Btn_Previous01{width:61px; height:21px; border:0; background:url(../images/btn_seat.png) 0px 0px; margin:0 1px 0 0;}
.Btn_Previous02{width:61px; height:21px; border:0; background:url(../images/btn_seat.png)  -61px 0px;}
.Btn_Send01{width:90px; height:21px; border:0; background:url(../images/btn_form.png) 0px 0; margin:0 1px 0 0;}
.Btn_Send02{width:90px; height:21px; border:0; background:url(../images/btn_form.png) 0px -21px;}
.Btn_Delete01{width:90px; height:21px; border:0; background:url(../images/btn_form.png) -90px 0; margin:0 1px 0 0;}
.Btn_Delete02{width:90px; height:21px; border:0; background:url(../images/btn_form.png) -90px -21px;}

#btn_NO{ width:40%; margin:0 auto;}
#btn_NO ul{}
#btn_NO li {float:left; display:block; }
#btn_NO li.text a{ line-height:21px; color:#666; font-size:11px; padding:0 5px; border-right:1px solid #CCC; text-decoration:none;}
#btn_NO li.text a:hover{ color:#039; text-decoration:none;}
#btn_NO li.next1{ height:21px; width:25px; background:url(../images/btn_pagenumber.png) 75px 0; }
#btn_NO li.next2{ height:21px; width:25px; background:url(../images/btn_pagenumber.png) 50px 0;}
#btn_NO li.prv1{ height:21px; width:25px; background:url(../images/btn_pagenumber.png) 0 0;}
#btn_NO li.prv2{ height:21px; width:25px; background:url(../images/btn_pagenumber.png) 25px 0;}
#btn_NO li.next1 a:hover{ height:21px; width:25px; background:url(../images/btn_pagenumber.png) 75px -21px; }
#btn_NO li.next2 a:hover{ height:21px; width:25px; background:url(../images/btn_pagenumber.png) 50px -21px;}
#btn_NO li.prv1 a:hover{ height:21px; width:25px; background:url(../images/btn_pagenumber.png) 0 -21px;}
#btn_NO li.prv2 a:hover{ height:21px; width:25px; background:url(../images/btn_pagenumber.png) 25px -21px;}



/*===== 文字區 ===============================================================================================*/
.font_11blue{ color:#426cbd; font-size:11px; font-weight:bold;}
.font_12gray{ display:block; color:#727272; padding:0 10px; margin:-20px 0 0 250px; border-left:1px solid #999; font-size:12px; font-weight:normal; line-height:15px;}
.link-no:hover ,.link-no:visited ,.link-no:link
{font-size: 9px; height:10px; color:#686868; padding:0 5px;text-decoration: none;}
.link-no:hover
{font-size: 9px; height:10px; color:#1c1c1c; padding:0 5px; font-weight:bold; text-decoration: none;}



/*===== Area ===============================================================================================*/
#Fillet_ODD{ margin:2px 0;}
#Fillet_ODD .RightDottom{ background:url(../images/FilletFrame_odd.gif) bottom right; padding-right:8px}
#Fillet_ODD .LeftDottom{ background:url(../images/FilletFrame_odd.gif) bottom left; padding-bottom:2px;}
#Fillet_ODD .LeftTop{ background:url(../images/FilletFrame_odd.gif) top left; padding-left:8px;}
#Fillet_ODD .RightTop{ background:url(../images/FilletFrame_odd.gif) top right; padding:8px 0; margin-right:-8px;}

#Fillet_EVEN{ margin:2px 0;}
#Fillet_EVEN .RightDottom{ background:url(../images/frame_fillet_even.gif) bottom right; padding-right:20px}
#Fillet_EVEN .LeftDottom{ background:url(../images/frame_fillet_even.gif) bottom left; padding-bottom:20px;}
#Fillet_EVEN .LeftTop{ background:url(../images/frame_fillet_even.gif) top left; padding-left:20px;}
#Fillet_EVEN .RightTop{ background:url(../images/frame_fillet_even.gif) top right; padding:20px 0; margin-right:-20px;}

#Bar_Gray{ width:450px; font-size:13px; color:#666; line-height:32px;}
#Bar_Gray .Right{ background:url(../images/bar_gray.gif) right; padding-right:20px;}
#Bar_Gray .Left{ background:url(../images/bar_gray.png) left; padding-left:20px;}

#Bar_Title{width:100%; font-size:15px; color:#036; font-weight:bold; line-height:33px;}
#Bar_Title .bar_Right{ background:url(../images/bar_title.gif) right; padding-right:20px;}
#Bar_Title .bar_Left{ background:url(../images/bar_title.gif) left; padding-left:20px;}



/*===== 表格區 ===============================================================================================*/
#NEWS_index_form{}
#NEWS_index_form table{width:100%;}
#NEWS_index_form td{ border-bottom:1px dashed #fefefe; line-height:24px; color:#fefefe;}
#NEWS_index_form td.Title{ width:75%; background:url(../images/icon_dot.gif) no-repeat; padding:0 0 0 15px;}
#NEWS_index_form td.Title a{ color:#fefefe;}
#NEWS_index_form td.Title a:hover{ color:#8edbff;}
#NEWS_index_form td.Date{ width:25%;}
#NEWS_index_form td.Date p{ display:block; width:80px; font-size:11px; line-height:13px; border-left:1px solid #a3a7b0; text-align:center;}

#Data_form{width:60%;}
#Data_form taber{ width:100%;}
#Data_form tr.line01{ background:url(../images/line_blue01.png) repeat-y;}
#Data_form tr.line02{ background:url(../images/line_blue02.png) repeat-y;}
#Data_form td{ border-bottom:1px solid #fefefe; line-height:24px; color:#7d7d7d;}
#Data_form td.title{width:20%; padding:0 0 0 12px; background:url(../images/icon_dot-blue.gif) no-repeat; color:#333;}
#Data_form td.edit{width:80%;}
#Data_form td.edit a{ color:#7d7d7d;}
#Data_form td.edit a:hover{ color:#004ec2;}
#Data_form td.title01{width:20%; padding:0 0 0 12px; background:url(../images/icon_dot-blue.gif) no-repeat; color:#333;}
#Data_form td.edit01{width:45%;}
#Data_form td.title02{width:20%; padding:0 0 0 12px; background:url(../images/icon_dot-blue.gif) no-repeat; color:#333;}
#Data_form td.edit02{width:15%;}

#News_form{}
#News_form taber{ width:100%;}
#News_form tr.line01{ background:url(../images/line_blue01.png) center repeat-y;}
#News_form tr.line02{ background:url(../images/line_blue02.png) center repeat-y;}
#News_form td{border-bottom:1px solid #fefefe; line-height:24px; color:#7d7d7d; text-align:center;}
#News_form td.Link{width:64%; padding:0 0 0 5px; text-align:left;}
#News_form td.Type{width:18%; color:#069;}
#News_form td.Time{width:18%;}
#News_form td.Company{width:25%;color:#333; padding:0 0 0 5px; text-align:left;}
#News_form td.Add{width:25%; text-align:left;}
#News_form td.Kind{width:30%;}
#News_form td.Volume{width:10%;}
#News_form td.Number{width:10%;}
#News_form td a{color:#555;}
#News_form td a:hover{color:#63C;}
#News_form td img.PIC{ margin:5px; padding:1px; border:1px solid #999;}


#BBS_form{ margin:0 15px 0 0;}
#BBS_form table{width:100%;}
#BBS_form td{line-height:26px; }
#BBS_form td.Name{ width:20%; text-align:center;}
#BBS_form td.EDIT{ width:80%;}
#BBS_form td.EDIT a{ color:#999; text-decoration:underline;}
#BBS_form td.EDIT a:hover{ color:#099; text-decoration:underline;}
#BBS_form td.Name1{ border-top:1px dashed #ccc; border-bottom:2px solid #069; text-align:center;}
#BBS_form td.EDIT1{ border-top:1px dashed #ccc; border-bottom:2px solid #069;}

#EDITPIC_form{ margin:0 20px 0 0;}
#EDITPIC_form table{ width:100%;}
#EDITPIC_form td{ line-height:30px;}
#EDITPIC_form td.PIC{ width:30%;}
#EDITPIC_form td.ICON{width:5%; text-align:center; border-bottom:1px dashed #CCC;}
#EDITPIC_form td.TITLE{width:15%; color:#4d4d4d; font-weight:bold; border-bottom:1px dashed #CCC;}
#EDITPIC_form td.EDIT{width:50%; border-bottom:1px dashed #CCC;}
#EDITPIC_form td.EDIT a{ color:#728d99; text-decoration:none;}
#EDITPIC_form td.EDIT a:hover{ color:#4d9dc0; text-decoration:underline;}

#Sitemap_form{}
#Sitemap_form table{width:100%;}
#Sitemap_form td{line-height:26px;}
#Sitemap_form td.List{ width:25%;}
#Sitemap_form td.List h4{ display:block; width:159px; text-align:center; color:#1b4b80; font-weight:bold; font-size:15px; line-height:30px; background:url(../images/line_blue01.png) repeat-y center;}
#Sitemap_form td.List a{ display:block; color:#4d4d4d; background:url(../images/arrow_blue2.gif) no-repeat; padding-left:20px; border-bottom:1px dashed #ccc; margin:0 10px 0 0;}
#Sitemap_form td.List a:hover{ color:#4d9dc0; text-decoration:none;}




/*----- text_bar --------------------------------------------------------------------------------------*/
.from_EDIT1{width:100px; height:15px; padding:0 5px; border: 1px solid #c3c3c3; 
            color: #787878; font-size: 11px; line-height:15px; letter-spacing:1.2px; margin:2px 0;}	

	

.from_EDIT2{width: 150px; height:18px; padding:0 5px; border: 1px solid #c3c3c3; 
            color: #787878; font-size: 11px; line-height:18px; letter-spacing:1.2px;}		
	
.from_EDIT3{width: 300px; height:50px; padding:0 5px; border: 1px solid #c3c3c3; 
            color: #787878; font-size: 11px; line-height:18px; letter-spacing:1.2px; margin:3px 0;}	

.from_EDIT4{width: 300px; height:18px; padding:0 5px; border: 1px solid #c3c3c3; 
            color: #787878; font-size: 11px; line-height:18px; letter-spacing:1.2px;}	





