﻿/*-----------------------------------------------
Web Style
Name:     基本3欄(上header+menw、中main、下footer) ver2.0
Designer: Tina
URL:      http://blog.pixnet.net/tina1231
Date:     2008-08-04
----------------------------------------------- */

body {
	margin:0;
	font-family: Tahoma;
	font-size: 12px;
	color:#737373;
	line-height:19pt;
	background: url(../images/bg_page.gif) repeat-x top;
}
a {    color:#4ed000;text-decoration:none;}
a:hover {    color:#EF7E18;	text-decoration:underline;}
img{ border:none}
p,form,ul,li{ margin:0; padding:0}
ul{ list-style:none}




/* 主架構，用來定義最大範圍
-----------------------------------------*/
#outer-wrapper{
  width:995px;
  margin:0 auto; /* 上 左右 下 */
  background:url(../images/headerbg_page.gif) no-repeat 0 78px;
}
#insider-wrapper{
  width:855px;
  margin:0 auto; /* 上 左右 下 */
}

#header-wrapper{  height:242px;}

#menu-wrapper{ position:absolute; z-index:1; top:10px;}
#menu-wrapper ul.sub-nav li{
	float:right;
	display:inline;
	font-size: 12px;
	margin-left: 5px;
	color: #999;
	background-image: url(../images/Menu/Menu_Line2.gif);
	background-repeat: no-repeat;
	background-position: left center;
	padding-left: 16px;
}

#menu-wrapper ul.sub-nav li a{
	color: #999;
}

#menu-wrapper ul.sub-nav li a:hover{
	color: #8CC53E;
}
#menu-wrapper ul li{ float:left; display:inline;}

#content-wrapper {
width:855px;
}

#main-wrapper {
  width:855px;
  /* height: 210px; 暫時 */
  word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
  overflow: hidden;     /* fix for long non-text content breaking IE sidebar float */
  }
  
#link-wrapper {
  height:27px; /* 暫時 */
  clear:both;
  font-size: 12px; 
  line-height:10pt;
  background:url(../images/link_bg.gif) no-repeat -3px 0px;
  color:#81B551/*background:#f2f8e6;*/
}  
#link-wrapper a{ font-size: 12px;color:#87C659}  
#link-wrapper a:hover{ color:#EF7E18}  
/*#link-wrapper p{ padding:6px 25px}  */
 
#footer-wrapper {
  height:50px; /* 暫時 */
  clear:both;
  font-size: 8pt; 
  line-height:10pt;
  /*background:url(../images/copyright_bg.gif) no-repeat top center;*/
}   
#footer-wrapper p { padding:10px 25px 0; }  


/* 聯絡我們樣式
-----------------------------------------*/
div.erea{ float:left; margin:0 0 30px 10px; padding:0 35px 0 5px;border-left:#EEEEEE 1px dashed;}
#contact{ border-top:#CEE2A3 2px solid; clear:both;margin:5px 15px}
#contact td{ border-top:#EEEEEE 1px solid; padding:5px 5px}
#contact input,textarea,select{ color:#333;background-color:#F5F8ED;border:none;font-family: Tahoma;font-size:8pt; line-height:8pt; }


/* 最新消息樣式
-----------------------------------------*/

/*最新消息圖文區第一筆*/
#news-top{ margin:5px 15px; height:170px; float:left; overflow:hidden}
.news-top-pict{
	float:left;
	margin-right: 10px;
}/*最新消息圖片*/
.news-top-word{ float:left; font-size:12px ; line-height:20px; color:#828282;  width:500px ;}/*最新消息內文*/
.news-top-word p.title{  border-bottom:#DEE8CA 1px dashed; padding:0 0 3px 20px; margin:10px -5px; background:url(../images/icon_02.gif) no-repeat 0 2px; }
.news-top-word p.title a{ font-size:13px;}

/*最新消息圖文區列表*/
#news-list{
	float:left;
	border-right:#DEE8CA 1px dashed;
	margin-top: 10px;
	margin-right: 5px;
	margin-bottom: 50px;
	margin-left: 20px;
	padding-top: 0;
	padding-right: 20px;
	padding-bottom: 0;
	padding-left: 0;
	width: 315px;
	position: relative;
	height: 100px;
}
.news-list-pict{ float:left; width:75px }/*最新消息圖片*/
.news-list-word{ float:left; font-size:11px ; line-height:17px; color:#828282;  width:240px ;}/*最新消息內文*/
.news-list-word p.title{ }
.news-list-word p.title a{  color:#336633;font-size:9pt;}

/*設計作品圖文區列表*/
#designwork-list{
	float:left;
	border-right:#DEE8CA 1px dashed;
	margin-top: 10px;
	margin-right: 5px;
	margin-bottom: 50px;
	margin-left: 20px;
	padding-top: 0;
	padding-right: 20px;
	padding-bottom: 0;
	padding-left: 0;
	width: 315px;
	position: relative;
	height: 100px;
}
.designwork-list-pict{
	float:left;
	width:110px;
	border: 1px solid #CCC;
}/*設計作品圖片*/
.designwork-list-word{
	float:right;
	font-size:12px;
	line-height:17px;
	color:#828282;
	width:190px;
}/*設計作品簡介*/
.designwork-list-word p.title{ }
.designwork-list-word p.title a{  color:#336633;font-size:9pt;}
.designwork_color_gray{color:#00F}



/*最新息消內頁*/
#news-view{ margin:5px 5px;word-wrap: break-word; }
.news-view-word{
	line-height:150%;
	font-size: 12px;
	letter-spacing: 2px;
}/*最新消息內文*/
.news-view-word ul{list-style:disc; margin:5px 20px }
.news-view-word ol{ margin:5px 20px }
.news-view-word p.title{  border-bottom:#DEE8CA 1px dashed; padding:0 0 5px 20px; margin:10px -5px; background:url(../images/icon_02.gif) no-repeat 0 2px;color:#4ed000;; font-size:16px }

/*最新消息分頁*/
#but-page{ clear:both ; margin:5px 20px 15px}
.bg{ background:url(../images/but_page_bg.gif) repeat-x; height:17px}
#but-page a{color:#666666}
.select{color:#336633; background-color:#FFFFFF; border:#C5E98D 1px solid; padding:2px}


/* 設計作品樣式
-----------------------------------------*/
#por-list{ margin:10px 5px 10px; padding:0 5px;  border-left:#DEE8CA 1px dashed;overflow:hidden; clear:both}
#por-list span{ float:left;  margin:0 10px  }
.por-list-word{ font-size:11px ; line-height:16pt; color:#828282;}/*作品簡介內文*/
.por-list-word p.title{ }
.por-list-word p.title a{  color:#336633;font-size:9pt;}



/* 製作流程樣式
-----------------------------------------*/
/*#flow{ border:#EFF4EA 1px dashed; padding:20px 0; height:100%; }
#flow-sub{ float:left; }
#flow p.line{border-bottom:#EEEEEE 1px dashed;margin:10px 0 5px; padding:10px 0 10px 80px;  clear:both}*/

.flow-con{ clear:both; border-top:#EEEEEE 1px dashed; _height: 1%;　overflow: hidden;　_overflow: none; margin:10px 0 0;
background:url(../images/icon_04.gif) no-repeat 75px bottom }
.flow-con span{ float:left;display: inline ;} 


#flow-word{ float:left;display: inline; padding:0 0 8px; width:560px;}
#flow-word ul{padding:8px 0 0;}
#flow-word li{background:url(../images/icon_05.gif) no-repeat 7px 0; padding:0 10px 10px 25px; line-height:18px; color:#888888;}




/* 留言版樣式
-----------------------------------------*/
#board{border-top:#cee9b3 1px solid; margin:8px 5px; clear:both; height:100%}

/*問題*/
#board-q{ margin:0; padding:3px 5px; float:left; width:60%}
#board-q ul{}
#board-q li{ background:url(../images/icon_board-q.gif) no-repeat 2px 2px; padding:5px 10px 3px 25px; font-size:11px; line-height:18px; color:#888888;}
#board li.board-w{
	background:none;
	padding:5px 10px 3px 25px;
	border-top:#EBEBEB 1px dotted;
	font-size: 12px;
}

/*回覆*/
#board-re{ background-color:#fafbf9; margin:0 5px 10px 30px; padding:3px; float:right;width:30%;  }
#board-re ul{}
#board-re li{ background:url(../images/icon_board-re.gif) no-repeat 2px 5px; padding:5px 10px 3px 30px; color:#007d01; line-height:20px}
#board li.board-rew{ background:none;padding:5px 30px 3px; border-top:#EBEBEB 1px dotted;}



/* 常見問題樣式
-----------------------------------------*/
#qa-list{}
#qa-list div.q{ background:url(../images/icon_q.gif) no-repeat ; border:#ECF3D3 1px dashed; padding:0 30px 0}
#qa-list ul{ margin:5px 0; padding:0}
#qa-list li.a{ background:url(../images/icon_a.gif) no-repeat; padding:0 30px 0; margin:3px 25px;color:#ef8d00; line-height:20px}
#qa-list　td{ padding:3px 5px}



/* 客戶登錄樣式
-----------------------------------------*/
#member{}
#member ul{ margin:15px 0}
#member li{ background:url(../images/icon_01.gif) no-repeat 0 10px; border-bottom:#ECF3D3 1px dashed; padding:3px 15px 2px; color:#A1A1A1}

#member-list{}
#member-list ul{ margin:15px 0;}
#member-list li{ float:left; display:inline;background:url(../images/icon_01.gif) no-repeat 0 10px; border-bottom:#ECF3D3 1px dashed; padding:3px 15px 2px; color:#A1A1A1}
#member-list table{ clear:both; border:#DFEECA 1px solid; }
#member-list td{ padding:6px 5px; border-top:#EEEEEE 1px solid; border-left:#EEEEEE 1px solid; line-height:17px}



/* 網站導覽樣式
-----------------------------------------*/
#sitemap{}
#sitemap span{ float:left}

.sitemap-sclass{ float:left; border-bottom:1px dashed #EEEEEE;/*background:url(../images/sitemap_sub-bg.gif) no-repeat 135px 0; */width:720px; height:56px}
.sitemap-sclass ul{ padding:15px 15px 0 }
.sitemap-sclass li{ background:url(../images/icon_03.gif) no-repeat 5px 10px; padding:0px 18px 0; margin:0 0px 0;float:left; display:inline}

.sitemap-sclass a{ color:#666666}
.sitemap-sclass a:hover{ color:#00CC00}


/* 其他樣式
-----------------------------------------*/
h1{ background:url(../images/page_titlebg.gif) no-repeat right; height:47px;margin:0 }/*內頁標題*/
h2{ font-size:11px; line-height:12px; color:#52d800; font-weight:normal; text-align:right;margin:0 20px; padding:0}/*內頁上方網頁位置標題*/
h2 a{ color:#888888;}
h4{ font-size:15px; color:#60b100; margin:5px 0; padding:0}

#main-p{
	padding:5px 65px 20px;
	line-height: 150%;
	letter-spacing: 1px;
}/*內容間距*/
/*#main-p h3{ background:url(../images/page_titlebg.gif) no-repeat right; height:47px;margin:0;font-size:13px; line-height:22px; color:#52d800; }內頁標題*/
/*#main-p p{ clear:both}內容間距*/

.club{ border:#D1D1D1 1px solid; background-color:#F6F6F6; padding:5px}/*框*/
.club01{ border:#f2f5ef 1px solid; padding:3px}/*框*/

.icon{ clear:both; padding:10px 5px}
.icon a{ margin:0 2px}
.word-pa{ padding:0px 25px}

/* 表單樣式
-----------------------------------------*/
.button{
color:#999999;
background-color:#FFF;
border:#CCCCCC 1px solid;
font-family: Tahoma;
font-size:12px;
}
.keyin{
color:#999999;
background-color:#FFF;
border:#CCCCCC 1px solid;
font-family: Tahoma;
font-size:12px;
}

/* 基本顏色樣式
-----------------------------------------*/
.color_black{color:#000; font-size:12px}
.color_white{color:#FFF}
.color_gray{color:#A4A4A4; font-size:11px}
.color_red{color:#BB0404}
.color_orange{color:#F54D00}
.color_yellow{color:#F5BB00}
.color_green{color:#8CC53E}
.color_green01{color:#3bc000}
.color_blue{color:#3780B9}




