@charset "utf-8";
/* CSS Document */
 @import url(btn.css);
 @import url(form.css);
 @import url(pages.css);
/*全局*/
body {  margin: 0px; padding: 0px; font-family: Arial, Helvetica, sans-serif, '微軟正黑體', '新細明體'; font-size: 13px; color: #666666; letter-spacing: 1px; line-height: 22px; text-align: justify; text-justify: inter-ideograph; min-width: 1440px;}
/***common*********************************************************/
p { margin: 0px; padding: 0px; }
img { border: 0px; }
.clear { zoom: 1; clear: both; }
.clear:after { content: ''; display: block; clear: both; visibility: hidden; height: 0; }
.bold { font-weight: bold; }
/***logo*********************************************************/
#logo { position: absolute; z-index: 999; left: 220px; top: 5px; }
/***left_info*********************************************************/
#left_info { width: 100%; height: auto; margin: 5px 0; float: left;  display: none;}
#left_info .icon_member {cursor: pointer;width:222px;height:82px; display:block;   margin-top: 10px;  background:url(../data/wrapper/common.png) -19px -366px no-repeat; }
#left_info .icon_member:hover {background:url(../data/wrapper/common.png) -19px -545px no-repeat;}
#left_info .icon_contact { cursor: pointer;width:222px; height:82px;display:block; margin-top: 10px;background:url(../data/wrapper/common.png) -19px -452px no-repeat; }
#left_info .icon_contact:hover {background:url(../data/wrapper/common.png) -19px -631px no-repeat;}

/***share*********************************************************/
#share-box { position: absolute; z-index: 1px; top: 12px; right: 105px; width: auto; height: auto; float: left; }
#share-box .google { margin-right: 5px; float: left; width: 28px; height: 28px; }
#share-box .google a { background: url(../data/wrapper/share.png) 0 0 no-repeat; width: 28px; height: 28px; display: block; -webkit-transition: background-image 300ms linear; -moz-transition: background-image 300ms linear; -o-transition: background-image 300ms linear; transition: background-image 300ms linear; }
#share-box .google a:hover { background: url(../data/wrapper/share-.png 0 0 no-repeat); }
#share-box .fb { margin-right: 5px; float: left; width: 28px; height: 28px; display: block; }
#share-box .fb a { background: url(../data/wrapper/share.png) -35px 0 no-repeat; width: 28px; height: 28px; display: block; -webkit-transition: background-image 300ms linear; -moz-transition: background-image 300ms linear; -o-transition: background-image 300ms linear; transition: background-image 300ms linear; }
#share-box .fb a:hover { background: url(../data/wrapper/share-.png) -35px 0 no-repeat; }
#share-box .tweter { margin-right: 5px; float: left; width: 28px; height: 28px; display: block; }
#share-box .tweter a { background: url(../data/wrapper/share.png) -71px 0 no-repeat; width: 28px; height: 28px; display: block; -webkit-transition: background-image 300ms linear; -moz-transition: background-image 300ms linear; -o-transition: background-image 300ms linear; transition: background-image 300ms linear; }
#share-box .tweter a:hover { background: url(../data/wrapper/share-.png) -71px 0 no-repeat; }
#share-box .favore { float: left; width: 28px; height: 28px; display: block; }
#share-box .favore a { background: url(../data/wrapper/share.png) -106px 0 no-repeat; width: 28px; height: 28px; display: block; -webkit-transition: background-image 300ms linear; -moz-transition: background-image 300ms linear; -o-transition: background-image 300ms linear; transition: background-image 300ms linear; }
#share-box .favore a:hover { background: url(../data/wrapper/share-.png) -106px 0 no-repeat; }
/*menu-box***********/
#menu-box { width: 560px; height: 54px; background: url(../data/wrapper/menu_bg.png); position: absolute; z-index: 1; top: 56px; right: 220px; }
.menu { width: 560px; margin: auto; }
#top_but { width: 560px; height: 54px; }/*外層框*/
#top_but ul { list-style-type: none; margin: 0px; padding: 0px; }/*UL設定不要有列表項目符號，並且不要有間距*/
#top_but li { height: 54px; float: left; }/*可橫向排列，直立式按鈕及不需要float標籤*/
#top_but li a { height: 54px; display: block; -webkit-transition: background-image 500ms linear; -moz-transition: background-image 500ms linear; -o-transition: background-image 500ms linear; transition: background-image 500ms linear; }/*li內容有做連結時的設定，設定與圖片長寬相同並隱藏文字*/
#top_but li.top_but01 a { width: 115px; background: url(../data/wrapper/menu.png) 0 0 no-repeat; }/*按鈕1第一章圖*/
#top_but li.top_but01 a:hover { background: url(../data/wrapper/menu-.png) 0 0 no-repeat; }/*按鈕1第二張圖*/
#top_but li.top_but02 a { width: 115px; background: url(../data/wrapper/menu.png) -115px 0 no-repeat; }/*按鈕2第一章圖*/
#top_but li.top_but02 a:hover { background: url(../data/wrapper/menu-.png) -115px 0 no-repeat; }/*按鈕2第二張圖*/
#top_but li.top_but03 a { width: 115px; background: url(../data/wrapper/menu.png) -230px 0 no-repeat; }/*按鈕3第一章圖*/
#top_but li.top_but03 a:hover { background: url(../data/wrapper/menu-.png) -230px 0 no-repeat; }/*按鈕3第二張圖*/
#top_but li.top_but04 a { width: 115px; background: url(../data/wrapper/menu.png) -345px 0 no-repeat; }/*按鈕4第一章圖*/
#top_but li.top_but04 a:hover { background: url(../data/wrapper/menu-.png) -345px 0 no-repeat; }/*按鈕4第二張圖*/
#top_but li.top_but05 a { width: 100px; background: url(../data/wrapper/menu.png) -460px 0 no-repeat; }/*按鈕4第一章圖*/
#top_but li.top_but05 a:hover { background: url(../data/wrapper/menu-.png) -460px 0 no-repeat; }/*按鈕4第二張圖*/
/***language*********************************************************/
.top_btn { position: absolute; z-index: 1; right: 274px; top: 3px; ; width: auto; color: #878787; }
.top_btn a { color: #878787; text-decoration: none; }
.top_btn a:hover { color: #878787; text-decoration: underline; }
.top_btn ul { list-style-type: none; padding: 0px; margin: auto; margin: 0; padding: 0; display: inline-block; }
.top_btn li { float: left; width: auto; height: 25px; list-style-type: none; text-align: center; }
.top_btn li+li:before { content: "|"; display: inline-block; padding: 0 10px ; }

/*search-box***********/
#search-box { width: 187px; height: 31px; position: absolute; z-index: 1; right: 68px; top: 12px; background: url(../data/wrapper/send_bg.png); }
#search-box .input { height: auto; width: 130px; float: left; margin: 2px 0 0 0px; }
#search-box .style { width: 100%; height: 28px; padding: 0px 0px 0px 5px; margin: 0 0 0 30px; border: 0px; font-size: 12px; color: #888888; background-color: transparent; outline: none; }

#search-box .btn { height: 21px; width: 40px; margin: 6px 10px 0 0; float: right; background: url(../data/wrapper/send_search.png); display: block; -webkit-transition: background-image 300ms linear; -moz-transition: background-image 300ms linear; -o-transition: background-image 300ms linear; transition: background-image 300ms linear; }
#search-box .btn:hover { background: url(../data/wrapper/send_search.png); }

/***header********************************************************/
#header-box { width: 100%; height: auto; background:url(../data/wrapper/header_bg.png) top left repeat-x; }
.header { width: 1440px; height: 110px; position: relative; margin: auto; background:url(../data/wrapper/header_bg.png) top left repeat-x;}
/***ad-box******************************************************/
#ad-box-in { width: 100%; height: auto; margin: 0 auto; background: url(../data/wrapper/banner.jpg) top center no-repeat; }
#ad-box-in .banner { width: 1440px; height: auto; margin: 0 auto; position: relative; margin-bottom:5px; }
/***main_box********************************************************/
#main-box { width: 100%; height: auto; margin: 0 auto; background:url(../data/wrapper/main_bg.png) bottom repeat-x; }
.main { width: 1440px; height: auto; position: relative; margin: 0 auto; }
.main:after { content: ' '; display: block; clear: both; }
#leftside { width: 260px; height: auto; margin: 0px 0px 20px 200px; float: left; }
.left-title { width: 100%; height: auto; margin: 0px 0px 0px 0px; float: left; }
#rightside { width: 840px; height: auto; margin: 0px 100px 50px 0px; float: right; }
#title span{
	font-size:16px;
	padding-left:20px;
	color:#AE2279;
	display: none;
}
#title { font-size:20px; font-weight:bold;width: 100%; height: auto; float: left; background: url(../data/wrapper/title_dot.png) 20px 12px no-repeat,#E0EDF5; padding: 10px 0 10px 50px; margin-top: 20px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; }
#container { color: #535353; width: 820px; height: auto; float: left; margin: 20px 10px 0 10px; letter-spacing: 1px; line-height: 25px; }
/***sub-title*********************************************************/
#sub-title { font-size: 12px; float: left; margin-bottom:20px; color: #936C58; width: 100%; height: auto; letter-spacing: 1px; padding: 5px 10px; text-align: left; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; background: #F7EEDD; }
#sub-title span { color: #936C58; }
/***breadcrumbs*********************************************************/
#breadcrumbs { text-align: right; color: #555555; font-size: 12px; font-weight: normal; position: absolute; right: 114px; top: 31px; z-index: 1; width: auto; letter-spacing: 2px; }
#breadcrumbs span { color: #999999; }
#breadcrumbs img { padding: 0px 2px 0 0; }
#breadcrumbs a { color: #555555; text-decoration: none; -webkit-transition: color 200ms linear; -moz-transition: color 200ms linear; -o-transition: color 200ms linear; transition: color 200ms linear; }
#breadcrumbs a:hover { color: #900; text-decoration: none; }
/***footer_box*********************************************************/
#footer-box { width: 100%; height: auto; margin: 0 auto;line-height: 22px; letter-spacing: 1px; background:url(../data/wrapper/footer_bg.png) center repeat-x; }
.footer { position: relative; width: 1100px; height: 141px; padding: 0px 0px 0px 0px; margin: 0 auto; }
.footer .gotop { position: absolute; z-index: 1px; top: 62px; left: 1055px; width: 42px; height: 42px; text-align: left; color: #FFF; }
.footer .gotop a { width: 42px; height: 42px; background: url(../data/wrapper/gotop.png); display: block; -webkit-transition: background-image 300ms linear; -moz-transition: background-image 300ms linear; -o-transition: background-image 300ms linear; transition: background-image 300ms linear; }
.footer .gotop a:hover { background-image: url(../data/wrapper/gotop-.png) }
.footer .menu { width: auto; height: 35px; float: left; padding-top: 17px; background: url(../data/wrapper/footer_dot.png) 0px 21px no-repeat,url(../data/wrapper/footer_dot.png) right 21px no-repeat;  }
.footer .menu a { color: #999999; TEXT-DECORATION: none; -webkit-transition: color 120ms linear; -moz-transition: color 120ms linear; -o-transition: color 120ms linear; transition: color 120ms linear; }
.footer .menu a:hover { COLOR: #999999; TEXT-DECORATION: underline; }
.footer .btn { width: auto; height: 35px; text-align: center; float: left; vertical-align: middle;font-size: 15px; padding: 0 20px;}
.footer .btn+.btn { content: ""; vertical-align: middle; padding: 0 20px;background: url(../data/wrapper/footer_dot.png) 2px 5px no-repeat; }
.footer .logo { position: absolute; z-index: 1px; top: 60px; left: 0px; width: 83px; height: auto; text-align: left; color: #FFF; }
.footer span { COLOR: #777E8E; }
.footer .info { width: 100%; height: auto; float: right; padding: 0px; text-align: center; color: #666666; margin-top:15px; }
.footer .info_2 { width: 100%; height: auto; float: left; color: #AAAAAA; font-size: 12px; margin-top: 5px; text-align: center; }
.footer .copyright { width: 455px; height: auto; color: #AAAAAA; }
.footer .copyright a { color: #AAAAAA; TEXT-DECORATION: none; -webkit-transition: color 120ms linear; -moz-transition: color 120ms linear; -o-transition: color 120ms linear; transition: color 120ms linear; }
.footer .copyright a:hover { COLOR: #AAAAAA; TEXT-DECORATION: underline; }