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

/* reset */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd,  fieldset, form, label, legend, caption{
	/*background: transparent;*/
	border: 0;
	font-size: 100%;
	margin: 0;
	outline: 0;
	padding: 0;
}
ol, ul {
	/*list-style: none;*/
	/*background: transparent;*/
	border: 0;
	font-size: 100%;
	outline: 0;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after, q:before, q:after {
	content: none;
}
:focus {
	outline: 0;
}
table {
	/*border-collapse: collapse;
	border-spacing: 0*/
}
 table, tbody, tfoot, thead, tr, th, td {
 	/*background: transparent;
	border: 0;*/
	font-size: 100%;
	outline: 0;
}
/* common 
-------------------------------------------------------------- */
/*body {
	margin: 0px;
	padding: 0px;
	color: #000;
	font-size: 14px;
	font-family: "微軟正黑體";
	background-color: #eaf0f0;
}
*/
body
{
	background: #fff;
	font-size: 13px;
	font-family: Helvetica, Arial, 'Lucida Grande',Verdana,sans-serif;
	padding: 0;
	margin: 0;
	color: #444;
	overflow-x: hidden;
}
.clear {
	zoom: 1;
	clear: both;
}
/*.clearfix{display:inline-block;}*/
.clearfix:after{clear:both;visibility:hidden;height:0;}


.left {
	float: left;
}
.right {
	float: right;
}

img {
	border: 0px;
}
.com_input {
	border: 1px solid #ccc;
	height: 20px;
	background-color: #f9f9f9
}
a {
    font-size: 15px;
}
a:hover{
	color: #00a877;
	text-decoration: none;
}
#outer {
	margin: 0;
	width:100%;
	height: auto;
	/*overflow: hidden;*/
}
/*#main{
	background: #fff;
	overflow: hidden;
}*/
.main {
	width: 100px;
	height: auto;
}
#Main_sider{
	/*background: #fff;
    padding: 4px 8px 0 8px;*/
    width: 100%;
    overflow: hidden;
}
.mainbody {
    width: 100%;
    margin-top: 0px;
}
#left_sider {
    padding: 0 0 20px 60px;
    width: 251px;
}
#right_sider{
	/*margin-left: 10px;*/
    float: left;
    width: 740px;
    padding: 4px 8px 4px 10px;
}
.layout-width {
    width: 1024px;
    margin:0 auto;
    position: relative;
}
.layout-width2 {
    width: 980px;
    margin:0 auto;
    
}
body #header_wrapper {
    width: 100%;
    height: 118px;
    margin: 0;
}
#top_menu_wrapper {
    width: 980px;
    height: 34px;
    margin: auto;
    color: #fff;
    font-size: 11px;
    margin: 0 auto;
}
.top_menu_right {
    width: 600px;
    float: right;
    text-align: right;
    margin-top: 23px;
    font-size: 16px;
    color: #618733;
}
#menu_wrapper a, #menu_wrapper a:hover, #menu_wrapper a:active {
    color: #618733;
}

#top_bg {
    width: 100%;
    height: 118px;
    position: relative;
    z-index: 999;
}
#top_bar {
    width: 1000px;
    height: 100px;
    margin: auto;
}
#menu_wrapper {
    padding: 0;
    /*width: 1000px;
    height: 100px;*/
}
div.logo {
    text-align: left;
    margin-left: 27px;
    float: left;
    margin: 22px 0px 12px 0px;
}

#menu_wrapper .nav ul, #menu_wrapper div .nav
{
	list-style: none;
	display: block;
	padding: 0 5px 0 0;
	margin: 0 30px 0 0px;
	float: right;
	font-size: 13px;
	font-weight: bold;
}

#menu_wrapper .nav ul li, #menu_wrapper div .nav li
{
	display: block;
	float :left;
	margin: 0 0 0 0;
}

#menu_wrapper .nav ul li a, #menu_wrapper div .nav li a
{
	display: block;
	padding: 0px 10px 0px 10px;
	height: 40px;
	margin: 0;
	color: #7f7f7f;
}

#menu_wrapper .nav ul li a span, #menu_wrapper div .nav li a span
{
	display:block;
	font-size: 11px;
	color :#96A1A6;
	font-weight: normal;
	text-transform: lowercase;
}

#menu_wrapper .nav ul li a.hover, #menu_wrapper .nav ul li a:hover, #menu_wrapper div .nav li a.hover, #menu_wrapper div .nav li a:hover
{
	/*background: transparent url('img/menu_hover.png') repeat-x top center;*/
	color: #444;
}
.nav a { width:114px; height:70px;}

#menu_wrapper .nav ul li a#button01_o, #menu_wrapper div .nav li a#button01_o{	background: transparent url('img/button01.jpg') no-repeat; width:141px;}
#menu_wrapper .nav ul li a#button02_o, #menu_wrapper div .nav li a#button02_o{	background: transparent url('img/button02.jpg') no-repeat; width:110px;}
#menu_wrapper .nav ul li a#button03_o, #menu_wrapper div .nav li a#button03_o{	background: transparent url('img/button03.jpg') no-repeat; width:112px;}
#menu_wrapper .nav ul li a#button04_o, #menu_wrapper div .nav li a#button04_o{	background: transparent url('img/button04.jpg') no-repeat; width:108px;}
#menu_wrapper .nav ul li a#button05_o, #menu_wrapper div .nav li a#button05_o{	background: transparent url('img/button05.jpg') no-repeat; width:106px;}
#menu_wrapper .nav ul li a#button06_o, #menu_wrapper div .nav li a#button06_o{	background: transparent url('img/button06.jpg') no-repeat; width:106px;}

#menu_wrapper .nav ul li ul, #menu_wrapper div .nav li ul
{
	display: none;
	list-style: none;
	background: #fff;
	position:absolute;
	float: none;
 	padding: 0;
 	width: 180px;
 	z-index: 1000;
 	margin-top: 1px;
 	padding-top: 5px;
 	padding-bottom: 5px;
	font-size: 12px;
 	-webkit-border-bottom-right-radius: 5px;
	-webkit-border-bottom-left-radius: 5px;
	-moz-border-radius-bottomright: 5px;
	-moz-border-radius-bottomleft: 5px;
	border-bottom-right-radius: 5px;
	border-bottom-left-radius: 5px;
	z-index: 9999;
 	border: 1px solid #ccc;
 	border-top: 0;
}

#menu_wrapper .nav ul li:hover ul, #menu_wrapper div .nav li:hover ul
{
	display: block;
}

#menu_wrapper .nav ul li ul li a.hover, #menu_wrapper .nav ul li ul li a:hover, #menu_wrapper div .nav li ul li a.hover, #menu_wrapper div .nav li ul li a:hover
{
	background: none;
}

#menu_wrapper .nav ul li ul li ul, #menu_wrapper div .nav li ul li ul
{
	margin-left: 170px;
	margin-top: -40px;
	-webkit-border-bottom-right-radius: 5px;
	-moz-border-radius-bottomright: 5px;
	-webkit-border-bottom-left-radius: 0;
	-moz-border-radius-bottomleft: 5px;
	border-bottom-right-radius: 5px;
	border-bottom-left-radius: 0;
	border: 0;
}

#menu_wrapper .nav ul li ul li, #menu_wrapper div .nav li ul li
{
	clear: both;
	min-width: 180px;
	width: 100%;
	padding: 0;
	margin: 3px 0 3px 0;
	border-bottom: 1px solid #ebebeb;
	padding-left: 10px;
}

#menu_wrapper .nav ul li ul li:last-child, #menu_wrapper div .nav li ul li:last-child
{
	border-bottom: 0;
}

#menu_wrapper div .nav li ul li a, #menu_wrapper div .nav li.current-menu-item ul li a, #menu_wrapper div .nav li ul li.current-menu-item a,#menu_wrapper .nav ul li ul li a, #menu_wrapper .nav ul li.current-menu-item ul li a, #menu_wrapper .nav ul li ul li.current-menu-item a
{
	color: #96A1A6;
	display: block;
	width: 100%;
	border: 0;
	margin-top:-10px;
	background: transparent;
	height:auto;
	font-weight: normal;
	padding: 15px 20px 8px 10px;
}

#menu_wrapper .nav ul li ul li a, #menu_wrapper div .nav li ul li a
{
	/*width: 130px;*/
	display: block;
	color: #999;
}

#menu_wrapper .nav ul li ul li a:hover, #menu_wrapper .nav ul li ul li a:hover, #menu_wrapper div .nav li ul li a:hover, #menu_wrapper div .nav li ul li a:hover
{
	color: #444;
	background: transparent;
	border: 0;
}


#menu_left{padding: 0; margin: 0;list-style: none;}
#menu_left > li{ background-image:url(../images/menu04.jpg); height:24px; line-height:24px; padding-left:5px; text-align: left; text-indent: 27px;}
#menu_left li a{ color:#808080; font-size:13px; font-family:Arial, Helvetica, sans-serif;text-decoration:none;letter-spacing:1px;}
#menu_left li a:hover{ color:#808080; font-size:13px; font-family:Arial, Helvetica, sans-serif;text-decoration: underline;font-weight: bold;}
.flyoutLink {
    height: 24px;
    width: 191px;
    padding: 0px;
    text-indent: 27px;
    color: #808080;
    border: 0;
    font-size: 13px;
    cursor: hand;
    background-image: url(../images/menu04.jpg);
    background-repeat: no-repeat;
}

.algin_img{
	display:table-cell;
	vertical-align: middle;
}
.img-responsive {
    display: block;
    width: 100%;
    height: auto;
}

.container-fluid{
	padding: 0;
}
.nivoSlider {
	position: relative;
	width: 449px;
	height: 500px;
	margin: auto;
	/*background: #000 url('../images/ajax-loader.gif') no-repeat 50% 50%;*/
	background: url('../images/ajax-loader.gif') no-repeat 50% 50%;
}
.nivoSlider img {
	position: absolute;
	top: 0px;
	left: 0px;
	display: none;
}
/* If an image is wrapped in a link */
.nivoSlider a.nivo-imageLink {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	border: 0;
	padding: 0;
	margin: 0;
	z-index: 60;
	display: none;
}
/* The slices in the Slider */
.nivo-slice {
	display: block;
	position: absolute;
	z-index: 50;
	height: 100%;
}
.nivo-box {
	display: block;
	position: absolute;
	z-index: 5;
}
/* Caption styles */
.nivo-caption {
	position: absolute;
	right: -10px;
	bottom: -10px;
	padding: 10px;
	width: 449px;
	height: auto;
	z-index: 89;
	background: transparent;
	display: none;
	z-index: 9999;
	text-align: right;
}
.nivo-caption.right {
	right: 0;
}
.nivo-caption h4 {
	color: #fff;
	font-size: 13px;
	letter-spacing: 2px;
}
.nivo-caption p {
	padding: 10px 15px 10px 15px;
	margin: 0;
}
.nivo-caption a.button {
	text-shadow: -1px 0 1px #000;
}
.nivo-caption a {
	display: inline !important;
}
.nivo-html-caption {
	display: block;
}
/* Direction nav styles (e.g. Next & Prev) */
.nivo-directionNav {
	display: none;
}
.nivo-directionNav a {
	position: relative;
	top: 120px;
	z-index: 99;
	cursor: pointer;
	width: 40px;
	height: 80px;
	display: block;
}
.nivo-directionNav a.nivo-prevNav {
	background: transparent url('../images/left_slide_nav.png') no-repeat center 15px;
	text-indent: -9999px;
	left: 0px;
}
.nivo-directionNav a.nivo-nextNav {
	background: transparent url('../images/right_slide_nav.png') no-repeat center 15px;
	text-indent: -9999px;
	left: 895px;
	top: 42px;
}
.nivo-prevNav:active {
	background: transparent url('../images/left_slide_nav_dark.png') no-repeat center 15px;
}
.nivo-nextNav:active {
	background: transparent url('../images/right_slide_nav_dark.png') no-repeat center 15px;
}
/* Control nav styles (e.g. 1,2,3...) */
.nivo-controlNav {
	/*display: none;*/
	background: transparent;
	z-index: 99;
	float: none;
	margin: auto;
	padding: 13px 0 0 10px;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	width: auto;
	top: 280px;
	left: 5px;
}
#slider_wrapper .nivo-controlNav {
	width: 445px;
}
.nivoslide .nivo-controlNav {
	top: 0;
	width: auto;
	left: 0;
}
.nivo-controlNav a {
	position: relative;
	z-index: 99;
	cursor: pointer;
	width: 14px;
	height: 14px;
	background: transparent url('../images/bullet_nav_bg.png') no-repeat top;
	display: block;
	float: left;
	text-indent: -9999px;
	margin: 0 7px 0 0;
	opacity: 1;
}
.nivo-controlNav a:hover, .nivo-controlNav a.active {
	background: transparent url('../images/bullet_nav_bg_active.png') no-repeat top;
	opacity: 1;
}
.nivo-controlNav {
	position: absolute;
	bottom: 0px; /* Put the nav below the slider */
	position: absolute;
}
.nivo-controlNav img {
	display: inline; /* Unhide the thumbnails */
	position: relative;
	margin-right: 10px;
}
.nivo-html-caption {
	display: none;
}
#static_slider {
	margin: 0;
	height: 340px;
	overflow: hidden;
}
.slider_nav {
	float: left;
	width: 180px;
	display: none;
}
.slider_desc h1 {
	color: #fff;
}
.slider_desc {
	width: 930px;
	height: 90px;
	padding: 28px 0 32px 32px;
	font-size: 12px;
	color: #999999;
	margin: auto;
}
.slider_desc p, .slider_desc_center p {
	margin: 0 0 0 2px;
	width: 600px;
	font-size: 13px;
	float: left;
}
.slider_desc_center {
	width: 650px;
	margin: auto;
	text-align: left;
	padding: 16px 0 0 0;
}
.page_caption {
	width: 100%;
	background: transparent url('../images/content_top_shadow.png') repeat-x top;
	padding-top: 32px;
	padding-bottom: 20px;
	margin: auto;
	margin-top: -22px;
	font-size: 16px;
	color: #999;
	margin-bottom: 8px;
	float: left;
}
.caption_inner {
	width: 980px;
	margin: auto;
}
.page_caption h1 {
	color: #444;
	margin: -15px 30px 0 0;
}
.page_caption p {
	display: block;
	float: left;
	margin: 13px 0 0 0;
}
.caption_header {
	float: left;
}
.caption_header h1 {
	font-size: 28px;
}
.caption_desc {
	float: left;
	margin-top: 0px;
	font-size: 12px;
	color: #999;
}
#outer {
	margin: 0 auto;
}
a.special-link:link {
	color: #3e64b2;
	text-decoration: none;
	font-weight: normal;
}
a.special-link:visited {
	color: #3e64b2;
	text-decoration: none;
	font-weight: normal;
}
a.special-link:hover {
	color: #990033;
	text-decoration: underline;
	font-weight: normal
}

a.special-link {
	font-size: 12px;
}


/* home
-------------------------------------------------------------- */
#top { background: url(../images/top_bg.jpg) repeat-x; }
#logo { margin:31px 0 0 19px;}

#top_box {margin:7px 20px 0 0; height:87px;}
.top_lang { text-align:right; font-size: 15px; font-family: "微軟正黑體";}
.lang_wrap a.jp_link,.lang_wrap a.en_link, .lang_wrap a.tw_link{
	color:#0fc9f0 !important;
}

.search_box { margin-top:35px;}
#search_keyword { width:131px;height:17px; line-height:17px; border:1px solid #d2d2d2;}
.menu {
	height:43px; 
	line-height:30px;
	width:100%;
	text-align:center;
	margin:0px auto;
	color: #fff;
	font-size: 20px;
	clear: both;
}

#top_space, .space { height:6px;}


.lang_wrap li {
	list-style: none;
	width: 60px;
	padding: 0;
	height: 15px;
	float: left;
	text-align:left;
}
.lang_wrap li.lang_item_last {
	background-image: none;
}
a.lang_item {
	height: 15px;
	line-height: 15px;
	width: 60px;
	text-align: center;
	color: #666;
	font-size: 12px;
	font-weight: bold;
	text-decoration: none;
	display: inline-block;
}
a.lang_item:hover{
	color: #0fc9f0;
}
a.lang_home {
	height: 15px;
	line-height: 15px;
	width: 60px;
	text-align: center;
	color: #d55b5d;
	font-size: 12px;
	font-weight: bold;
	text-decoration: none;
	display: inline-block;
}
a.lang_home img {
	vertical-align: baseline;
}

/* menu
-------------------------------------------------------------- */
.bw_menu {/*針對menu下的css*/
	height: 42px;
	overflow: hidden;
	position: relative;
	cursor: pointer;
}
.bw_menu img {
	position: absolute;
	top: 0;
	left: 0;
	border: 0;
}
/* 選單 li 之樣式 */
ul.top_nav {
	list-style: none;
}
ul.top_nav { text-align:center; width:1000px; margin:0 auto;}
ul.top_nav > li {
	position: relative;
	float: left;
	font-family: "微軟正黑體";
	z-index: 99;
}
ul.top_nav li span {
    display: none;
}
/* 選單 li 裡面連結之樣式 */
ul.top_nav li a {
	font-size: 20px;
	font-weight: bold;
	height: 42px;
	/*line-height:42px;*/
	display: block;
	color: #FFF;
	
	text-align: center;
	text-decoration: none;
}
ul.top_nav li.ct a {

	font-size: 20px;
	font-weight: bold;
	height: 38px;
	line-height:38px;
	display: block;
	padding: 0 10px 0 10px;
	color: #FFF;
	
	text-align: center;
	text-decoration: none;
}
ul.top_nav > li.ct > a:hover {
	color: #fff;
}
/* 特定在第一層，以左邊灰線分隔 */
ul.top_nav > li > a {
	border-bottom: 0px solid #CCC;
	border-left: 0px solid #CCC;
}
ul.top_nav > li > a:hover {
	color: #fff;

}
/* 特定在第一層 > 第二層或以後下拉部分之樣式 */
ul.top_nav ul {
	display: none;
	float: left;
	position: absolute;
	top:42px;
	left: 0;
	margin: 0;
	z-index: 99999;
}
/* 當第一層選單被觸發時，指定第二層顯示 */
ul.top_nav li:hover > ul {
	display: block;
}
/* 特定在第二層或以後下拉部分 li 之樣式 */
ul.top_nav ul li {
	border-bottom: 0px solid #DDD;
}
/* 特定在第二層或以後下拉部分 li （最後一項不要底線）之樣式 */
ul.top_nav ul li:last-child {
	border-bottom: none;
}
/* 第二層或以後選單 li 之樣式 */
ul.top_nav ul a {
	width: 155px;
	height: 30px;
	line-height:30px;
	border:1px solid #000;
	border-top:0px solid #000;
	text-align-last: center;
	color: #fff;
	font-size: 18px;
	text-decoration: none;
	font-weight: normal;
	background: #333;
	
	text-align: center;
}
ul.top_nav ul a:hover {
	background: #00ada9;
	color:#000;
	
}


.menu {
	height:42px; 
	/*line-height:30px;*/
	width:100%;
	padding: 0;
	text-align:center;
	margin:0px auto;
	color: #fff;
	font-size: 20px;
	clear: both;
	
}

ul.top_nav { text-align:center; width:1000px; margin:0 auto; padding: 0;}
ul.top_nav li {
	position: relative;
	float: left;
	font-family: "微軟正黑體";
	z-index: 99;
	height: 42px;
	width:118px;
}
ul.top_nav li:first-child{
	width: 141px;
}
ul.top_nav li:last-child{
	width:150px;
}
ol, ul {
  /*list-style: none;*/
}
ul.top_nav ul {
	display: none;
	float: left;
	position: absolute;
	left: 0;
	margin: 0;
	padding: 0;
	z-index: 9999;
	border: 1px solid #e8e8e8;
	
}
ul.top_nav ul li {
    color: #fff;
    background-color: #00ada9;
    letter-spacing: 1px;
    padding: 0;
    width: 100%;
    height: auto;
}

ul.top_nav ul li a, ul.top_nav li li a:link {
    color: #fff;
    background-color: #00ada9;
    text-decoration: none;
    height: 25px;
    line-height: 25px;
    font-size: 13px;
    border: 0px;
    padding-left: 20px;
    letter-spacing: 1px;
    /*width: 100% !important;*/
    
}
ul.top_nav ul li a{
	opacity: 1;
	padding: 0 !important;
}
ul.top_nav ul li a:visited {
	color: #fff;
	text-decoration: none;
	font-size: 13px;
	padding: 0;
	padding-left: 20px;
	letter-spacing: 1px;
}
ul.top_nav ul li a:hover {
    background-color: #666;
    color: #fff;
    opacity: 1;
}

/* category
-------------------------------------------------------------- */

.cat_title{
	height:60px;
	line-height:51px;
	font-size:18px;
	font-weight: bold;
	color: #2891d7;
	text-align:center;
	text-shadow:3px 3px 3px #999;
	background-color:#4C5C68;
	background: url(../images/tbar.jpg) no-repeat scroll 0 0 transparent;
	margin-bottom: 8px;
	/*border-top-left-radius:4px;
	-moz-border-top-left-radius:4px;
	-webkit-border-top-left-radius:4px;
	
	border-top-right-radius:4px;
	-moz-border-top-right-radius:4px;
	-webkit-border-top-right-radius:4px;*/
}
#cat_menu { margin: 0; }
#cat_menu_body {
	background-color:#fff;
	width:235px;	
	margin:0;
	padding:0;
	color:#857a7a;
	border:1px solid #ccc;
	
	/*border-bottom-left-radius:4px;
	-moz-border-bottom-left-radius:4px;
	-webkit-border-bottom-left-radius:4px;
	
	border-bottom-right-radius:4px;
	-moz-border-bottom-right-radius:4px;
	-webkit-border-bottom-right-radius:4px;*/
	
}
#accordion {
	margin: 0;
	text-align: left;	}  


#accordion ul {
	list-style-type: none;
	margin: 0px;
	padding: 0px;
}
#accordion  li {
	/*height:32px;*/
	line-height:32px;
}

#accordion h4 {display: block;}
.cat_tree {
	display: inline-block;
	width: 11px;
	height: 11px;
	line-height: 11px;
	vertical-align: top;
	margin-top: 10px;
  background: url(../images/sys/toggle.jpg) no-repeat scroll 0 0 transparent;
	float:right;
}
.active_close {
    background-position: -15px 0;
}
.active_open {
    background-position: -30px 0;
}



#accordion > li > h4 {
	padding: 4px 10px 4px 20px;
	/*height:31px;*/
	line-height:31px;
	border-bottom: 1px dashed #eee;
	background: url(../images/sys/cat_bg2.jpg) no-repeat 0 6px;
} 
ul#accordion > li > h4 > a {
	/*display: inline-block;*/
	color: #857a7a;
	text-decoration:none;
	font-size:14px;
}
#accordion > li > h4 > a:hover {
	color: #fec83c;
} 
ul#accordion > li > ul { margin: 0; padding: 0 0 0 10px;display: none;}  
#accordion ul li { margin: 0; padding: 0; clear: both;}  
#accordion ul li a { padding-left: 20px; font-size: 12px; font-weight: normal;} 
#accordion ul li a:hover {background-color:#D3C99C; color:#675C7C;}  
#accordion ul ul li a {color:silver; padding-left: 40px;}  
#accordion ul ul li a:hover { background-color:#D3CEB8; color:#675C7C;}  
#accordion span{float:right;}
/* 箭頭向下 */
.arrow-bottom {
    display: inline-block;
    margin-left: 5px;
    border-top: 4px solid #999;
    border-right: 4px solid transparent;    
    border-left: 4px solid transparent;        
    width: 1px;
    height: 1px;
}
/* 箭頭向右 */
.arrow-right {
    display: inline-block;
    margin-left: 12px;    
    border-top: 3px solid transparent;
    border-bottom: 3px solid transparent;
    border-left: 3px solid #666;        
    width: 1px;
    height: 1px;
		float:right;
		margin-top:12px;
}

/* 浮動次選單 */
ul.navigation {display:none;}
ul.navigation, ul.navigation li, ul.navigation ul, a{
    margin: 0;
    padding: 0;
    font-size: 13px;
    text-decoration: none;
		
}
ul.navigation,ul.navigation li {
    list-style: none;
}
/* 選單 li 之樣式 */
ul.navigation li {
    position: relative;
    float: left;
		width:100%;
		line-height: 1em;
}
/* 選單 li 裡面連結之樣式 */
ul.navigation li a{
    display:  block ;  /*inline-block;*/
    padding: 4px 20px;
    /*background: #888;*/
    color: #888;
}
/* 特定在第一層，以左邊灰線分隔 */
ul.navigation > li > a{
    border-bottom: 1px dotted #CCC;    
    /*border-left: 1px solid #CCC;*/
}
ul.navigation > li > a:hover{
    color: #666;
    background: #DDD
}
/* 特定在第一層 > 第二層之後下拉部分之樣式 */
ul.navigation li ul{
    display: none;
    float: left;
    position: absolute;
    left: 0;    
    margin: 0;
		z-index:9999;
}
/* 當第一層選單被觸發時，指定第二層顯示 */
ul.navigation li:hover > ul{
    display: block;
		left:194px; /*與第二層的距離*/
		top:0px;
}
/* 特定在第二層或之後下拉部分 li 之樣式 */
ul.navigation ul li {
    border-bottom: 1px solid #DDD;
		width:200px;
}
/* 特定在第二層或之後下拉部分 li （最後一項不要底線）之樣式 */
ul.navigation ul li:last-child {
    border-bottom: none;
}
/* 第二層或之後 選單 li 之樣式 */
ul.navigation ul a {
    /*width: 120px;*/
    padding: 4px 12px;    
    color: #666;        
    background: #EEE;
}
ul.navigation ul a:hover {        
    background: #CCC;    
}
/* 第三層之後，上一層的選單觸發則顯示出來（皆為橫向拓展） */
ul.navigation ul li:hover > ul{
    display: block;
    position: absolute;
    top: 0;    
    left: 100%;
}

ul#accordion > li > h4 > a.active_open_text {
    color: #fec83c;
}



/* footer
-------------------------------------------------------------- */
#footer {
	width:1000px;
	height:auto;
	margin: 8px auto;
}
.address {	
	width:100%;
	position: relative;
}
#ffg_logo{
	position: absolute;
	left: 62px;
	top:11px;
}
#ff_logo{
	position: absolute;
	left: 396px;
	top:11px;
}
#footer_sp{
	position: absolute;
	left: 368px;
	top:26px;
}
#copyright{
	position: absolute;
	left: 907px;
	top:52px;
}
#address_hd { 
	color:#000;
	font-size:10px;
	line-height: 13px;
	/*font-weight:700;*/
	/*letter-spacing: 3px;*/
	/*margin:0 0 0 62px; */
	width:auto; 
	text-align:left;
	position: absolute;
	left: 170px;
	top:11px;

}

#address_br { 
	color:#000;
	font-size:9px;
	line-height: 13px;
	/*font-weight:700;*/
	/*letter-spacing: 3px;*/
	/*margin:20px 0 0 40px;*/
	width:477px; 
	text-align:left;
	position: absolute;
	left: 552px;
	top:11px;
}
@media screen and (-webkit-min-device-pixel-ratio:0) {
    #address_hd{ left: 150px; }
    #address_br{ left: 502px; }
}
.small_font{
	font-size: 10px;
	font-family: "微軟正黑體";
	-webkit-transform:scale(0.83);
}
.en_font{
	font-family: Verdana;
	font-size: 9px;
	-webkit-transform:scale(0.83);
	line-height: 12px;
}


/* edm
-------------------------------------------------------------- */
#edm{
	
}
a img {
	border: none;
}
#slide_ad {
	position: relative;
	width: 1000px;
	height: 316px;
}
#slide_ad a.ad {
	position: absolute;
}
#slide_ad .control {
	position: absolute;
	right: 5px;
	bottom: 5px;
}
#slide_ad .control a {
	display: inline-block;
	padding: 0px 2px 0px 2px;
	margin: 0 2px;
	width: 15px;
	height: 15px;
	color: #fff;
	background: #888;
	text-align: center;
	font-size: 13px;
	text-decoration: none;
	font-family: Arial, Helvetica, sans-serif;
}
#slide_ad .control a.on {
	font-weight: bold;
	color: #fff;
	background: #7ec14a;
}




/* pro_list
-------------------------------------------------------------- */
.product_list { height:auto; overflow:hidden;}
.pro_list1 {
	width: 250px;
	height:280px;
	overflow:hidden;
	float: left;
	margin: 5px 4px 5px 0px;
	background:url(../images/pdt_bg1.jpg);
	text-align:center;
	padding:1px 1px 0 1px;
}
.pro_list2 {
	width: 250px;
	height:280px;
	overflow:hidden;
	float: left;
	margin: 5px 4px 5px 0px;
	background:url(../images/pdt_bg2.jpg);
	padding:1px 1px 0 1px;
}
.pro_list3 {
	width: 250px;
	height:280px;
	overflow:hidden;
	float: left;
	margin: 5px 0px 5px 0px;
	background:url(../images/pdt_bg3.jpg);
	padding:1px 1px 0 1px;
}

.pro_name {
	width: auto;
	color: #fff;
	font-size: 20px;
	font-family: "微軟正黑體";
	font-weight: bold;
	line-height: 32px;
}
.pro_name a {
	color: #fff;
	font-size: 20px;
	font-weight: bold;
	line-height: 32px;
	text-decoration: none;
}
.pro_name a:hover {
	color: #83572F;
	font-size: 20px;
	font-weight: bold;
	text-decoration: none;
}
.pro_desc {
	width: auto;
	color: #fff;
	font-size: 14px;
	font-family: "微軟正黑體";
	font-weight: bold;
	line-height: 20px;
	text-align:right;
	padding:4px;
}
.pro_desc a {
	color: #fff;
	font-size: 14px;
	font-weight: bold;
	line-height: 20px;
	text-decoration: none;
	text-align:right;
}

.pro_price01 {
	color: #000;
	text-decoration: line-through;
	line-height: 20px;
}
.pro_price02 {
	color: #DE780B;
	line-height: 20px;
	font-size: 13px;
	position:relative;
	top:-5px;
	left:5px;
}
.pro_price03 {
	color: #DE780B;
	line-height: 20px;
	font-family: "Arial Black";
	font-size: 16px;
	position:relative;
	top:-5px;
	left:5px;
}

/* mobile 橫向
-------------------------------------------------------------- */
/*@media only screen and (max-width: 1000px) and (min-width: 1px) {*/
 @media only screen and (max-width: 768px) {
	.layout-width {
	    width: 100%;
	    margin:0 auto;
	}
	.layout-width2 {
	    width: 100%;
	    margin:0 auto;
	}
	.main {
		width: 100%;
		height: auto;
	}
	#logo a img{ max-width: 100%;}
	#top_box{
		height: auto !important;
		margin: 8px 0 !important;
	}
	.search_box{
		margin-top: 8px !important;
	}
	ul.top_nav li > a {
		/*display: none;*/
	}
	ul.top_nav li span {
	    display: inline-block;
	    font-size: 14px;
	    margin: 4px 8px;
	    height: 42px
	}
	ul.top_nav li span a{
		font-size: 14px;
	}
	ul.top_nav li img{
		display: none;
	}
	.menu {
		height:43px; 
		line-height:30px;
		width:100%;
		text-align:center;
		margin:0px auto;
		color: #fff;
		font-size: 20px;
		clear: both;
		background: #00ADA9 !important;
	}
	#slide_ad{
		width:100%;
		min-height: 284px;
		height: 100%;
	}
	#slide_ad img{
		width: 100%;
		height: 100%;
	}
	
	#footer {
		width:100% !important;
		height: 180px !important;
		background: none  !important;
		background-color: #ccc  !important;
	}
	.address{
		height: auto !important;
	}
	#ffg_logo{
		left:10px !important;
	}
	#address_hd{
		left: 170px !important;
	}
	#footer_sp{
		display: none;
	}
	
	#ff_logo{
		left: 10px !important;
		top: 90px !important;
	}
	#address_br{
		top: 90px !important;
		left : 150px !important;
	}
}
/* mobile 
-------------------------------------------------------------- */
/*@media (min-width: 320px) and (max-width: 480px) {*/
@media only screen and (max-width: 480px) {
	.layout-width {
	    width: 100%;
	    margin:0 auto;
	}
	.layout-width2 {
	    width: 100%;
	    margin:0 auto;
	}
	.main {
		width: 100%;
		height: auto;
	}
	#logo { margin:31px 0 0 0px !important;}
	#logo a img{ max-width: 100%;}
	#top_box{
		height: auto !important;
		margin: 8px 0 !important;
	}
	#lang_bar{
		position: absolute;
		top:0;
		right: 0;
	}
	.search_box{
		margin-top: 8px !important;
	}
	ul.top_nav li > a {
		/*display: none;*/
	}
	ul.top_nav li span {
	    display: inline-block;
	    font-size: 14px;
	    margin: 4px 5px;
	    height: 42px
	}
	ul.top_nav li span a{
		font-size: 14px;
	}
	ul.top_nav li img{
		display: none;
	}
	ul.top_nav li {
		width: auto;
	}
	ul.top_nav > li:first-child{
		width: 15px;
	}
	ul.top_nav > li:last-child{
		width:1px;
	}
	.menu {
		height:43px; 
		line-height:30px;
		width:100%;
		text-align:center;
		margin:0px auto;
		color: #fff;
		font-size: 20px;
		clear: both;
		background: #00ADA9 !important;
	}
	#slide_ad{
		width:100%;
		min-height: 126px;
		height: 100%;
	}
	#slide_ad img{
		width: 100%;
		height: 100%;
	}
	
	#footer {
		width:100% !important;
		height: 180px !important;
		background: none  !important;
		background-color: #ccc  !important;
	}
	.address{
		height: auto !important;
	}
	#ffg_logo{
		left:10px !important;
	}
	#address_hd{
		left: 170px !important;
	}
	#footer_sp{
		display: none;
	}
	
	#ff_logo{
		left: 10px !important;
		top: 90px !important;
	}
	#address_br{
		top: 90px !important;
		left : 150px !important;
	}
}

/* mobile 
-------------------------------------------------------------- */
@media only screen and (max-width: 401px) {
	.layout-width {
	    width: 100%;
	    margin:0 auto;
	}
	.layout-width2 {
	    width: 100%;
	    margin:0 auto;
	    padding: 0 !important;
	}
	.main {
		width: 100%;
		height: auto;
	}
	#logo { margin:31px 0 0 0px !important;}
	#logo a img{ max-width: 100%;}
	#page_inside img{
		max-width: 100%;
	}
	#top_box{
		height: auto !important;
		margin: 8px 0 !important;
	}
	.search_box{
		margin-top: 8px !important;
	}
	ul.top_nav li > a {
		/*display: none;*/
	}
	ul.top_nav li span {
	    display: inline-block;
	    font-size: 12px;
	    margin: 4px 5px;
	    height: 42px
	}
	ul.top_nav li span a{
		font-size: 14px;
	}
	ul.top_nav li img{
		display: none;
	}
	.menu {
		height:43px; 
		line-height:30px;
		width:100%;
		text-align:center;
		margin:0px auto;
		color: #fff;
		font-size: 20px;
		clear: both;
		background: #00ADA9 !important;
	}
	#slide_ad{
		width:100%;
		min-height: 155px;
		height: 100%;
	}
	#slide_ad img{
		width: 100%;
		height: 100%;
	}
	
	#footer {
		width:100% !important;
		height: 180px !important;
		background: none  !important;
		background-color: #ccc  !important;
	}
	#footer_warp > table{
		width:100%;
	}
	#footer_warp > table > tbody > tr:first-child td:first-child{
		display: none;
	}
	#footer_warp > table > tbody > tr:first-child td{
		display: block;
	}
	#footer_warp > table > tbody > tr:first-child td:last-child{
		display: none;
	}
	#footer_warp > table > tbody > tr:first-child{
		height: 55px;
    	background-image: url(/upload/ffg/images/footer_bar_bg.jpg);
	}
	.address{
		height: auto !important;
	}
	#ffg_logo{
		left:10px !important;
	}
	#address_hd{
		left: 170px !important;
	}
	#footer_sp{
		display: none;
	}
	
	#ff_logo{
		left: 10px !important;
		top: 90px !important;
	}
	#address_br{
		top: 90px !important;
		left : 150px !important;
	}
	
}


.open{
	display: block;
}
img.frame {
    -moz-box-shadow: 0 1px 10px #ccc;
    -webkit-box-shadow: 0 1px 10px #ccc;
    box-shadow: 0px 1px 10px #ccc;
}
.portfolio180_shadow {
    width: 180px;
    height: 133px;
    background: transparent url(../images/portfolio180_shadow.png) no-repeat;
    margin-top: 10px;
}
.submenu {
    list-style-image: url(../images/arrow_icon.png);
    font-size: 13px;
    color: #444;
    line-height: 32px;
    letter-spacing: 2px;
}

.breadcrumb {
    padding: 0 20px 0 0;    
    list-style: none;
    border-radius: 0px;
    color: #393939;
    font-size: 9pt;
    line-height: 14px;
    display: inline-flex;
    float: left;
    position: relative;
    z-index: 11;
}
/**
 * @media screen and (-webkit-min-device-pixel-ratio:0) {
 *     ::i-block-chrome, .breadcrumb {
 *         float:none;
 *         display: inline-block;
 *         width: 100%!important;
 *     }
 * }
 */
.breadcrumb > li {
    display: inline-block;
    margin-right: 10px;
}
.breadcrumb > .active {
    color: #333333;
}
.r-pipe:after {
    content: '';
    display: inline-block;
    width: 8px;
    height: 8px;
    margin-left: 2px;
    border-top: 1px solid #fff;
    border-right: 1px solid #fff;
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    vertical-align: 1px;
}
.breadcrumb li a.r-pipe:after {
    width: 6px;
    height: 6px;
    vertical-align: 2px;
    margin-left: 4px;
    border-top: 1px solid #a0a0a0;
    border-right: 1px solid #a0a0a0;
}
.breadcrumb a {
    display: inline-block;
    background: none;
    padding: 0 0px;
    position: relative;
    z-index: 2;
    color:#393939;
    font-size: 9pt;
    line-height: 14px;
    float: left;
}
.breadcrumb a:visited {
	color: #416898;	
}
.breadcrumb h3 {
    color: #416898;
}
.breadcrumb a.home {
    padding-left: 0;
}

.breadcrumb a:hover {
    color: #fe983d;
}


/* left menu */
#menu_left li.parent {
  position: relative;
}
#menu_left li.parent:before {
  content: "\f0da";
  font: normal normal normal 12px/1 FontAwesome;
  position: absolute;
  right: 15px;
  top: 7px;
  color: #ccc;
}
#menu_left li ul {
  position: absolute;
  min-width: 200px;
  border: 1px solid #eee;
  left: 100%;
  top: -1px;
  margin-left: -10px;
  z-index: 999;
  background-image: none ;
  background: #fff;
  display: none;
}
#menu_left > li:hover > ul.level0,
#menu_left > li > ul.level0 > li:hover ul.level1,
#menu_left > li > ul.level0 > li ul.level1 > li:hover ul.level2 {
  display: block;
}
#menu_left > li > ul.level0{
	padding: 0;
    list-style: none;
	
}
#menu_left li { padding: 0 10px;}
#menu_left > li.level0 { padding: 0;}
#menu_left li a {
  /*line-height: 36px;*/
  display: block;
  text-transform: capitalize;
   font-size: /*16*/14px;
}