@charset "UTF-8";

/* ### UNIVERSAL ### */
body {
	padding:0;
	margin:0; /*font-family:Tahoma;*/
	font-size:12px;
	color:#333333;
	font-family: Arial, Helvetica, sans-serif;
}
a img, a img:hover {border:none}
ul, ol, li {margin:0; padding:0; list-style:none;}
a {color:#333333;text-decoration:none;}
a:hover {text-decoration:underline;}

/* ### CONTAINER ### */
#container {margin:0 auto; padding:0; width:950px;}

/* ### HEADER ### */
#pro_header { clear:both; background-image:url(../img/headerBG.gif); background-repeat:no-repeat; height:45px;}
#pro_header .logo { width:165px; height:45px; float:left;}
#pro_header .chName { width:720px; float:right;}
#pro_header .chName img{ float:left;}
#pro_header .chName .links { text-align:right; float:right; padding:13px 10px 0 0; color:#ffffff;}
#pro_header .chName .links a { color:#ffffff; margin:0 3px;}

/* ### MENU ### */
#pro_menu { height:22px; clear:both; margin-bottom:15px;}
#pro_menu .menu { width:630px; height:22px; float:left; padding-left:5px;}
#pro_menu .line { margin:0 15px 0 10px;}

/* ### TOOLS ### */
#pro_tools {height:22px; margin:10px 0 7px 0;width:950px;/* background:#f8f8f8;*/}
#pro_tools .login {	color: #333333;	float:right;margin-right:15px;line-height:22px;	width:600px;}
#pro_tools .login .ACT { width:40px; float:right;}
#pro_tools .login .ACT2 { width:70px; float:right;}
#pro_tools .login .txt {width:400px;float:right;text-align: right;margin-right: 5px;}
#pro_tools .ser { color: #333333; float:right; line-height:22px; width:200px; padding-right:10px;}
#pro_tools .ser input { width:150px; height:14px; font-size:12px; line-height:19px; color:#999999; float:left; margin-right:3px;}


/* ### NAV ### */
#pro_nav { text-align:right; padding-right:10px;/* margin-bottom:10px;*/ clear:both;}
#pro_nav a { margin:0 4px;}

/* ### CONTENT ### */
#pro_content { clear:both; float:left; width:950px; margin-bottom:10px;}

/* ### MAIN ### */
#main { float:left; width:630px;}
#sideBox { width:300px; float:right;}
#pageMain {float:right; width:775px;}
#pageSideBox { float:left; width:155px;}
#pageMain .Area { padding-left:15px;}

/*### FOOTER ###*/
#footer { float:left; clear: both; width: 950px; color: #999999; margin-top:10px;}
#footer a{color: #999999;}
#footer img{ border:none;}
#footer .footerL1 { height:48px; clear:both;}
#footer .footerL1 .Flogos { width:212px; float:left; clear:left; margin:0px 30px 0px 100px;_margin:0px 30px 0px 60px;}
#footer .footerL1 .Flinks { height:48px; padding-top:10px;}
#footer .footerL2 { height:96px; clear:both; background-image:url(../img/footerBg.jpg); background-repeat:repeat-x;}
#footer .footerL2 .Flogos2 { width:64px; float:left; clear:left; margin:0px 30px 0px 220px;_margin:0px 30px 0px 92px;}
#footer .footerL2 .txt { padding-top:15px;}

/* ### ACT BUTTON ###*/
.actbtn { 
    background:url(../img/btn_right.gif) right top no-repeat;
	display:block; float:left; 
	line-height:19px; height:19px; 
	color:#333333; padding:0 5px 0 0;
	}
.actbtn em{ background:url(../img/btn_left.gif) left top no-repeat; width:5px; height:19px; float:left;}

/* #### BOX ###*/
.clear { clear:both;}
.clearB { clear:both; margin-bottom:10px;}
.clear2 {
	float: left;
}
.pro_BOX { border:1px solid #d6d6d6;  padding:1px; clear:both; margin-bottom:10px;}
.pro_BOX .top { background:#e5e5e5; height:22px; padding:5px 10px 0 10px; clear:both;}
.pro_BOX .topTag { background-color:#e5e5e5; background:url(../img/tagBg2.gif);  padding:0 10px; clear:both; }
.pro_BOX .topTag .tags { line-height:27px; height:27px;margin:0;}
.pro_BOX .topTag .tags a{ font-weight:bold; margin:0 15px; float:left;}
.pro_BOX .topTag .tags .On { display:block; float:left; font-weight:bold; background:url(../img/tagBg.gif) right no-repeat; padding:0 25px 0 0; height:27px; color:#ee3125;}
.pro_BOX .topTag .tags .On em{ float:left; background: url(../img/tagLeft.gif) left no-repeat; width:5px; height:27px; margin-right:10px;}
.pro_BOX .topTag .tags span { float:left; margin:0 5px;}
.pro_BOX .top .title{ float:left;}
.pro_BOX .topTag .title{ float:left; margin:5px 15px 0 0;}
.pro_BOX .top .more{ float:right; margin-top:4px;}
.pro_BOX .boxMain { clear:both; padding:10px; background:url(../img/box_bg.gif) top repeat-x;}
.pro_BOX .boxMainW { clear:both; padding:10px;}
.pro_BOX .boxMain .ad_100_75 { float:left; margin-right:10px;}
.pro_BOX .boxMain .ad_100_75_S { float:left; margin-right:5px;}
.pro_BOX .boxMain .col {}
.pro_BOX .boxMain .col2 {/*三欄198_右分隔線*/ 
    background:url(../img/line_dash.gif) right repeat-y; 
	width:198px; float:left; 
	padding-right:3px; margin-right:5px;}
.pro_BOX .boxMain .col3 {/*三欄195_無分隔線_無margin*/width:195px; float:left; }
.pro_BOX .boxMain .col4 {/*二欄295_無分隔線_無margin*/width:295px; float:left; }
.pro_BOX .boxMain .group { font-size:13px; font-weight:bold; color:#c01e25;}
.pro_BOX .boxMain .group img{ margin-left:3px;}
.pro_BOX .boxMain .links { color:#000000; clear:both;}
.pro_BOX .boxMain .links a{ color:#000000; }
.pro_BOX .boxMain .links ul li{ margin-bottom:5px; background:url(../img/tip2.gif) 5px 6px no-repeat; padding-left:12px;}
.pro_BOX .boxMain .col4 .links{ color:#000000;}
.pro_BOX .boxMain .col4 .links a { color:#000000;}
.pro_BOX .boxMain .col4 .links ul li{ margin-bottom:5px;}
.pro_BOX .boxMain .title { color:#333333; font-weight:bold; margin-bottom:5px;}
.pro_BOX .boxMain .title_S { color:#333333; font-weight:bold; margin-bottom:3px;}
.pro_BOX .boxMain .title a{ color:#333333; }
.pro_BOX .boxMain .title_S a{ color:#333333;}
.pro_BOX .boxMain .txt { line-height:18px;overflow:hidden;word-break:break-all;}
.pro_BOX .boxMain .txt_S { color:#999999; line-height:15px; margin-bottom:3px;overflow:hidden;word-break:break-all;}
.pro_BOX .boxMain .txt_S a{ color:#999999;}
.pro_BOX .boxMain .txtlist { line-height:21px;}
.pro_BOX .boxMain .txtlist .date { margin-right:7px;}
.pro_BOX .boxMain .more { color:red; clear:both; padding-left:240px;}
.pro_BOX .boxMain .more a{ color:red;}
.pro_BOX .boxMain .bottomLine { background:url(../img/line_dash.gif) 5px repeat-x; height:15px; clear:both;}
.pro_BOX .boxMainW .bottomLine { background:url(../img/line_dash.gif) 5px repeat-x; height:15px; clear:both;}
.pro_BOX .boxMain .line { background:url(../img/line_dash.gif) 2px repeat-y; width:10px; /*height:158px;*/ float:left;}
.L158 { height:158px;}
.L75 { height:75px;}
.pro_BOX .CFlist { clear:both; margin:15px 10px ;}
.pro_BOX .CFlist .col1 a,.pro_BOX .CFlist .col2 a { display:block; clear:both; background:url(../img/tip.jpg) 5px 8px no-repeat; text-indent:15px;height:23px;}
.pro_BOX .CFlist .col1 { width:235px; float:left; line-height:23px; margin:0;}
.pro_BOX .CFlist .col2 { width:235px; float:left; border-left:1px solid #d6d6d6; padding-left:10px; line-height:23px; margin:0;}
.w756{ width:756px;}
/*### subMenu ###*/
#subMenu { margin-bottom:10px;}
#subMenu ul li {background:url(../img/subMenu_bg.gif) no-repeat; /*padding-left:25px;*/ text-indent:25px; color:#ee3125; font-size:13px; font-weight:bold; line-height:28px; margin-bottom:6px;}
#subMenu ul ul li { background:url(../img/line_dash_red.gif) bottom repeat-x;/* margin-left:-25px;*/ margin-top:6px; line-height:20px; color:red; font-weight:100; font-size:12px;}
#subMenu ul ul li a{color:#666666;}



/*#### AD ####*/
.ADcol.clear { clear:both;}

.ADcol .ad_100_75 { float:left; margin-right:10px;}
.ADcol { width:278px; font-size:12px;}
.ADcol img{ border:none;}
.ADcol .title { color:#333333; font-weight:bold; margin-bottom:5px;}
.ADcol .title a{ color:#333333;text-decoration:none; }
.ADcol .title a:hover{text-decoration: underline; }
.ADcol .txt { color:#333333; line-height:18px;overflow:hidden;word-break:break-all;}
.ADcol .txt a{ color:#333333;text-decoration:none; }
.ADcol .txt a:hover{text-decoration: underline; }
.ADcol .more { color:red; clear:both; padding-left:240px;}
.ADcol .more a{ color:red;text-decoration:none;}
.ADcol .more a:hover{ color:red;text-decoration: underline;}
.ADcol .bottomLine { background:url(../img/line_dash.gif) 5px repeat-x; height:15px; clear:both;}
.ADcol .line { background:url(../img/line_dash.gif) 2px repeat-y; width:10px; /*height:158px;*/ float:left;}
.AD300 { width:300px; margin-bottom:10px; clear:both;}
.top630 { width:630px; height:200px; clear:both; margin-bottom:10px;}
.AD155_50 {width:155px; margin-bottom:10px; clear:both;}

/*### GOPAGE ###*/
.PageGo { color:#666666; margin:10px 0 10px 350px;}

.PageNum{ color:#666666; margin:10px 0 0 150px;  }
.PageNum a,.PageGo a{ color:#666666;}
.goBtn{ 
    background:url(../img/btn_goR.gif) right top no-repeat;
	display:block; float:left; 
	line-height:21px; height:21px; 
	color:#666666; padding:0 5px 0 0;
	}
.goBtn em{ background:url(../img/btn_goL.gif) left top no-repeat; width:5px; height:21px; float:left;}
.PageNum .num {width:250px; float:left; margin:0; text-align:center; padding-top:5px;}
.PageNum .num .on { font-weight:bold; color:#FF0000; margin:0 5px;}
.PageNum .num a { margin:0 5px; text-decoration:underline;}
.PageNum .num a:hover { color:#FF0000;}
.PageNum .num .all { margin:0 10px;}
.PageNum .jump { float:left; margin:0 10px;}
.PageNum .jump input { width:30px; height:14px;}
.goTop { float:right; background:url(../img/arr_goTop.gif) 0 3px no-repeat; padding-left:10px; width:30px; font-size:11px; color:#999999; margin:5px 0;}
.goTop a {color:#999999;}
/*### PAGE ###*/
.pageTitle { background:url(../img/arr_title.gif) 0 1px no-repeat; padding-left:15px; color:#ee3125; font-size:15px; font-weight:bold; margin-bottom:20px;}
#pageMain .Area .txt { margin-bottom:10px; line-height:25px;}
#pageMain .Area .txt .title{ font-weight:bold; display:block; float:left;}
#pageMain .Area .txt .txtBox { padding-left:68px;line-height:20px; margin-top:2px;}
#pageMain .Area .Awards { color:#ee3125; font-weight:bold; float:left; line-height:20px; margin-top:2px;}
#pageMain .Area .Awards a{color:#ee3125;}
.newsBox { border:1px solid #dbdbdb; clear:both;}
.newsBox .top { background: url(../img/tableTop_bg.gif) repeat-x; height:27px; font-size:13px; font-weight:bold; line-height:27px; padding:0 10px;}
.newsBox .main {}
.newsBox .date { width:100px; float:left;}
.newsBox .name { float:left;}
.rolG { background: #f1f1f1; clear:both; line-height:27px; height:27px; padding:0 10px;}
.rolW { background: #ffffff; clear:both; line-height:27px;height:27px; padding:0 10px;}
.newsBox .col_100 { float:left; width:100px; margin-right:10px;}
.newsBox .col_170 { float:left; width:170px; margin-right:10px;}
#pageMain .Area .bottomLine { background:url(../img/line_dash.gif) 5px repeat-x; height:15px; clear:both; margin:10px 0;}

.eventBox { clear:both; border-bottom:1px solid #d6d6d6; margin-bottom:10px; padding-bottom:10px;width:730px}
.eventBox .col { padding-left:115px;}
.eventBox .ad_100_75 { float:left; width:100px; }
.eventBox .title { font-weight:bold; margin-bottom:5px;}
.eventBox .more{ color:red; float:right; font-size:11px;}

.eventBox .eventInfo {line-height:18px; color:#666666; background-color:#fff;}
.eventBox .eventInfo a{ color:#666666;}
.eventBox .more a {color:red;}

/*#### CODEBOX ###*/
#pageMain .Area .codeBox { width:735px; background-image:url(../img/code_boxBg.jpg);clear:both; float:left;}
#pageMain .Area .codeBox .top { height:13px; background:url(../img/code_boxTop.jpg) no-repeat;clear:both;}
#pageMain .Area .codeBox .main { width:735px;clear:both; background:url(../img/code_boxBG2.jpg) top no-repeat; float:left;}
#pageMain .Area .codeBox .bottom { height:13px; background: url(../img/code_boxFoot.jpg) no-repeat; clear:both;}

#pageMain .Area .codeBox .main .rol { clear:both;}
#pageMain .Area .codeBox .main .rol2 { clear:both; width:715px; margin-left:10px; padding:10px 0; border-top:1px solid #d6d6d6; float:left; }
#pageMain .Area .codeBox .main .picBox { background:url(../img/code_picBg.jpg) no-repeat; width:190px; height:113px; float:left; margin:0 10px; }
#pageMain .Area .codeBox .main .picBox img { margin:10px;}
#pageMain .Area .codeBox .main .col { width:510px; float:left; color:#3333333; margin-bottom:10px;}
#pageMain .Area .codeBox .main .title { color:#ee3125; font-size:15px; font-weight:bold; margin:5px 0; clear:both;}
#pageMain .Area .codeBox .main .next { color:#666666; margin:10px 0;}
#pageMain .Area .codeBox .main .noteBoxT { width:500px; height:7px; clear:both; background:url(../img/code_GboxTop.jpg) no-repeat;}
#pageMain .Area .codeBox .main .noteBoxM { width:480px; padding:5px 10px; clear:both; background:#e8e8e8; color:#666666; line-height:17px;}
#pageMain .Area .codeBox .main .noteBoxM ul { list-style:decimal; margin-left:25px;}
#pageMain .Area .codeBox .main .noteBoxM li { list-style:decimal; padding-left:0px;}

#pageMain .Area .codeBox .main .noteBoxB { width:500px; height:7px; clear:both; background:url(../img/code_GboxFoot.jpg) no-repeat;}
#pageMain .Area .codeBox .main .rol2 .way1 { width:325px; background:url(../img/line_dash.gif) right repeat-y; float:left; padding:0 10px;}
#pageMain .Area .codeBox .main .rol2 .way1 p,#pageMain .Area .codeBox .main .rol2 .way2 p { margin:5px 0; clear:both;}
#pageMain .Area .codeBox .main .rol2 .way2 { width:360px; float:right;}
#pageMain .Area .codeBox .main .rol2 .way2 input{ width:130px; height:13px; float:left; margin-right:5px; margin-bottom:5px;}
#pageMain .Area .codeBox .main .rol2 .way2 .ent{ color:#999999; margin:20px 0 5px 0; display:block;}
#pageMain .Area .codeBox .main .rol2 .way1 p img { margin-right:10px; margin-top:15px;}
#pageMain .Area .codeBox .main .rol2 .way2 .pic { float:right; margin-top:-25px; margin-right:5px; border:1px solid #cccccc;}

/*### AD ###*/
#pageMain .Area .topMv { width:760px; clear:both; float:left;margin-bottom:10px;}
#pageMain .Area .topMv .mv1 { width:250px; float:left;}
#pageMain .Area .topMv .mv2 { width:250px; float:left; background:url(../img/mvBoxLine.jpg) top left no-repeat;}
#pageMain .Area .topMv .mv2 .mvBox { width:168px; height:175px; margin:0 40px; background:url(../img/mvBoxBg.jpg) no-repeat;}
#pageMain .Area .topMv .mv1 .mvBox { width:168px; height:175px; margin:0 40px 0 40px; background:url(../img/mvBoxBg.jpg) no-repeat;}
#pageMain .Area .topMv .mvBox img { margin:39px 0 0 5px;}
.mvLink { color:#336699; clear:both; margin:10px 0; text-align:center;}
.mvLink a{ color:#336699; text-decoration:underline;}


/*quick style*/
.w608 { width:608px; clear:both;}
.fll { float:left;}
.m5 { margin-bottom:5px;}
.ttH { height:28px;}
.H80 { height:85px;}


/************for ipad**********/
@media screen and (-webkit-min-device-pixel-ratio:0)
{
body {font-size:13px;}
.pro_BOX .boxMain {padding:10px 5px;}
.pro_BOX .boxMain .col3 {width:200px;}
.pro_BOX .boxMain .line { width:8px;}
#subMenu ul ul li { padding-bottom:5px;}
#pro_tools .ser input { width:140px;}
.eventBox .more{font-size:13px;}
.rolG { line-height:30px; height:30px; }
.rolW { line-height:30px; height:30px; }
#subMenu ul ul li { font-size:13px;}
#footer .footerL1 .Flogos { margin:0px 30px 0px 30px;}

}