﻿@import url("basic.css");
/* CSS Document */
html, body { 
height: 100%; 
}
#box{ margin:0 auto; width:877px;  border-left:1px solid #000;  border-right:1px solid #000; }
#logo,#nav,#banner,#content,#foot{display:block;width:100%;}

#content,#foot{background:url(../img/cont-bg.jpg) top repeat-x #F7F6E4;width:877px;  padding:0 40px; text-align:left;}

#logo{ height:117px;font-size:12px;background:url(../img/logo1.jpg) no-repeat; color:#fff;}
#logo a{ color:#fff;}
#logo span{ float:right; margin-right:10px; margin-top:20px;}

#nav{height:38px; overflow:hidden;background:url(../img/nav_bg1.jpg) repeat-x;}
#nav a{ float:left; width:146px; height:38px; background:url(../img/nav_bg3.jpg) right no-repeat; line-height:38px; text-align:center; font-weight:bold; font-size:16px;}
#nav a:hover,#nav a#last:hover{ background:url(../img/nav_bg2.jpg) repeat-x; text-decoration:none; color:#fff;}
#nav a#last{ width:147px; background:none;}
#nav a#default{background:url(../img/nav_bg2.jpg) repeat-x; color:#fff;}

#content{padding-bottom:20px;font-size:12px; margin-top:5px; height:auto!important; min-height:320px; height:320px;}
#intro{ display:block; width:760px; position:relative; line-height:25px;}
#wel{ display:block;line-height:50px; font-size:22px; width:100%; font-family: Verdana, Arial, Helvetica, sans-serif;}
#intro img{ float:left; margin-right:20px;}
#more{ position:absolute; left:240px; bottom:12px;}


#links{ float:left; clear:left; width:225px; margin-right:18px; overflow:hidden; background:url(../img/tzh.jpg) 116px bottom no-repeat; height:auto!important; min-height:200px; height:200px;}
#news{ float:left; width:540px; overflow:hidden;}

#content h2{ color:#4c8109; background:url(../img/title.jpg) left 4px no-repeat; padding-left:30px;}

#content ul{ float:left; clear:left; width:100%;}
#content ul li{ list-style:none; float:left; width:100%; line-height:25px; position:relative;}
#content ul li a{ padding:3px;}
#content ul li a:hover{ background:#3a6900; text-decoration:none; color:#fff; padding:3px;}

#foot img{ float:left; margin-top:5px; margin-right:20px;}
#foot p{line-height:20px;}


h3,h4{ font-size:14px;}


/*--------about--------*/
ul#left{ float:left; clear:left; margin-top:18px; padding-top:20px; width:230px;}
ul#left li{ display:block;list-style:none; margin:2px 0; }
ul#left li a{ display:block; width:202px; height:43px; line-height:43px; background:url(../img/menu2.jpg) no-repeat; text-align:center; font-weight:bold; font-size:16px;}
ul#left li a:hover{background:url(../img/menu.jpg) no-repeat;}

#right{ float:left; margin-top:30px; padding-left:30px; padding-right:0; width:530px; border-left:1px solid #aaa; height:auto!important; min-height:200px; height:200px;}
#right .cont{ display:none; width:100%;}
#right .cont h3{height:30px; line-height:30px; margin-bottom:20px; width:530px;}
.cont img{ display:block; padding:2px; border:5px solid #86a262; background:#fff; width:auto!important; max-width:540px;}
.cont a:hover img,.cont img:hover{border:5px solid #96c45b;}
.cont h4{  height:40px; line-height:40px;}

#right .cont h3 img{ border:none; padding:0;width:540px; height:30px;}


img.about{ float:right; margin:0; margin-left:20px;}

img.make{ width:500px; height:350px; display:block; padding:2px; border:2px solid #86a262; margin:0 auto;}
img.make:hover{border-color:#96c45b;}
/*----product-----*/
#left li li a{ background:url(../img/icon.jpg) left no-repeat; height:30px; line-height:30px;text-align:left; overflow:hidden; padding-left:20px;}
#left li li a:hover{background:url(../img/icon2.jpg) left no-repeat;color:#006600; }

ul.product{display:block; width:500px; overflow:hidden;}
#content ul.product li{ float:left; display:inline; width:130px; overflow:hidden;margin:25px;}
ul.product li img{ display:block; border:1px solid #86a262; padding:2px; vertical-align:middle; width:120px; height:100px; margin-right:20px; overflow:hidden;}
ul.product li img:hover{border-color:#96c45b;}
ul.product li p{ height:20px; line-height:20px;}



/*newsinfo*/
#newsinfo{ line-height:22px; text-align:justify;}
#newsinfo h3{ text-align:center; color:#006600; line-height:45px;}



/*treemenu*/
/*CNLTreeMenu Start*/
.CNLTreeMenu img.s {cursor:pointer;vertical-align:middle;}
.CNLTreeMenu ul {padding:0;}
.CNLTreeMenu li {list-style:none; padding:0!important; padding:3px 0;}
.Closed ul {display:none;}
.Child img.s {background:none;cursor:default;}

.Default{font-size:12px;vertical-align:middle;}
.大標題20{font-size:16px;vertical-align:middle;}
.反白標題{font-size:12px;vertical-align:text-bottom;color="white"}
.Af_title{COLOR: #0060A0; FONT-SIZE: 12px; TEXT-DECORATION: none; LETTER-SPACING: 0px; LINE-HEIGHT: 15px}

#CNLTreeMenu1{float:left; clear:left; margin-top:40px; width:200px; height:350px; overflow:hidden;}
#CNLTreeMenu1 h4{ line-height:50px;}
#CNLTreeMenu1 ul {margin:0 0 0 16px!important;margin:0 0 0 8px}
#CNLTreeMenu1 img.s {width:20px;height:15px;}
#CNLTreeMenu1 .Opened img.s {background:url(../img/opened1.gif) no-repeat 0 0;}
#CNLTreeMenu1 .Closed img.s {background:url(../img/closed1.gif) no-repeat 0 0;}
#CNLTreeMenu1 .Child img.s {background:url(../img/child1.gif) no-repeat 3px 5px;}
/*CNLTreeMenu End*/
/*Temp CSS for View Demo*/



/*----design------*/
ul#button li{margin-top:10px; background:url(../img/btn.jpg) no-repeat;}
ul#button li a{ float:left;}

ul#button li img,ul#button li a:hover,ul#button li a{ border:0; padding:0; display:block;}

ul#medie{ display:block;width:780px; margin-top:10px;}
ul#medie li{border-bottom:1px dashed #ccc; background:url(../img/icon3.gif) left no-repeat; padding-left:20px;}