/*reset css*/
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, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol,ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {margin:0;padding:0;border:0; /*vertical-align: baseline;*/}

a,input {outline: medium none; text-decoration:none;}

body{
	font-family: '微軟正黑體', "Open Sans", "Helvetica Neue", "HelveticaNeue", Helvetica, Arial, 'Lucida Grande', 'LiHei Pro', 'Microsoft JhengHei', 'Microsoft YaHei', '微軟雅黑體', sans-serif;
	background:url(../images/bg.gif) repeat-x;
}

html, body {height: 100%;}
.wrap { 
	min-height: 100%;
	width: 980px;
	margin:0 auto;
	background:url(../images/bg_wrap.png) repeat-x;
}
/*Opera Fix*/
body:before {
	content:"";
	height:100%;
	float:left;
	width:0;
	margin-top:-32767px;
}
/*clear float*/
.clear::before, .clear::after {
    content: "";
    display: table;
}
.clear::after {
    clear: both;
}
.clear {
    zoom:1; /*IE6, IE7*/
}


/*header set*/
.header{
	height: 98px;
	background:url(../images/bg_header.gif);
	margin-bottom: 2px;
}

/*menu set*/
.menu{
	width:960px; 
	height:60px; 
	background:url(../images/bg_menu.png);
	padding: 0 10px;
}
.menu ul{
	display:block; 
	width:960px; 
	height:48px; 
	background-image:url(../images/menu.jpg);
	list-style: none;
}
.menu li{
	display:block; 
	width:80px; 
	float:left; 
	position:relative;
}
.menu li a{
	display:block; 
	height:48px;
}
.menu li a:hover{ 
	background-image:url(../images/menu.jpg); 
}
.menu ul ul{ 
	position:absolute; 
	left:0; 
	top:48px; 
	width:150px;
	height:auto;
	display:none;
	background: #fff;
}
.menu li li a{ 
	display:block; 
	width:130px;
	height:30px; 
	color:white; 
	line-height:30px;
	font-size:13px; 
	text-decoration:none;
	text-align: center;
	margin-bottom: 1px;
	padding: 0 10px;
	background:#0063b9;
}
.menu li li a:hover{ 
	background:#004e96; 
}


/*content set*/
.main{ 
	/*overflow:auto;*/
	padding-bottom: 90px; /* must be same height as the footer */
	padding-right: 6px;
	padding-left: 6px;
}
.title{
	height: 60px;
	background: url(../images/bg_title.gif) repeat-x;
	padding: 0 20px;
	line-height: 60px;
}
.title h3{
	color: #009a9d; 
	font-size: 22px; 
	font-weight: bold;
	letter-spacing: 2px;
}
.title p{
	text-align: right;
	color: #999999;
	font-size: 13px;
}
.title p a{
	color: #999999;
	text-decoration: underline;
}
.title p a:hover{
	color: #000;
	text-decoration: none;
}

.content{
	padding-top: 20px;
}
.content h3{ 
	font-size: 20px;
	font-weight:bold;
	color: #363636;
	padding: 0 80px 20px 80px;
	border-bottom: solid 1px #ececec;
}
.content h5{
	font-size: 10px;
	color: #f37c12;
	font-weight: bold;
	line-height: 2;
}
.content .innerBox{
	padding: 0 80px;
	margin: 20px 0;
}
.content .innerBox p{
	font-size: 15px;
	margin: 20px 0;
	line-height: 1.6;
}

.content .innerBox .myFoto{
	width: 808px;
	padding: 10px;
	text-align:center; 
	vertical-align:middle;
}
.content .innerBox .myFoto img{
	max-width: 808px;
}
.content .innerBox .myFoto span{height:100%; display:inline-block;}/* IE6 hack */
.content .innerBox .myFoto *{ vertical-align:middle;}/* 讓foto下的所有元素都居中 */


/*會員專區------------------------------------------------------------------------*/
/*選項*/
.member_item{
	width: 300px;
	margin: 0 auto;
}
.member_item ul{
	list-style: none;
}
.member_item ul li a{
	display: block;
	width: 300px;
	height: 90px;
	margin-bottom: 15px;
	text-align: center;
	background: url(../images/btn_member.png) left top;
	font-size: 26px;
	font-weight: bold;
	line-height: 90px;
	color: #7a7a7a;
}
.member_item ul li a:hover{
	color: #0063b9;
	background: url(../images/btn_member.png) left 180px;
}
.member_item ul li a:active{
	color: #053e85;
	background: url(../images/btn_member.png) left bottom;
}
/*登入*/
.member_login{
	width: 250px;
	height: 210px;
	margin: 0 auto;
	margin-bottom:30px;
	background: url(../images/bg_memberLogin.png);
	padding: 95px 55px 0 55px;
}
.member_login .inputset{
	width: 250px;
}
.member_login .inputset input{
	width: 230px;
	height: 40px;
	padding: 0 10px;
	margin-bottom: 10px;
	font-size: 15px;
}
.member_login .btn_login{}
.member_login .btn_login a{
	display: block;
	margin-top: 40px;
	width: 246px;
	height: 42px;
	background: url(../images/btn_login.png) left top;
	text-indent: -9999px;
}
.member_login .btn_login a:active{
	background: url(../images/btn_login.png) left bottom;
}

/*課程活動------------------------------------------------------------------------*/
.class_wrap{}
.class_wrap ul{ list-style: none;}
.class_wrap ul li{
	margin-bottom: 15px;
}

.class_wrap ul li a{
	display: block;
	width: 800px;
	height: 60px;
	background: url(../images/bg_classList.jpg) left top;
	color: #333;
}
.class_wrap ul li a:hover{background: url(../images/bg_classList.jpg) left 120px;}
.class_wrap ul li a:active{background: url(../images/bg_classList.jpg) left bottom;}

.content .innerBox .className{
	width: 670px;
	padding:10px 20px;
}
/*隱藏過長文字*/
.longWordsHide{
	overflow : hidden;
	text-overflow : ellipsis;
	white-space : nowrap;
}
.content .innerBox .className h5{
	font-size: 10px;
	color: #f37c12;
}
.content .innerBox .className p{
	line-height: normal;
	margin: 0;
	font-size: 15px;
}
.pagelist{
	font-size: 13px;
	height: 30px;
	margin-bottom: 10px;
	margin-right: 8px;
}
.pagelist a{
	display: block;
	width: 20px;
	height: 20px;
	background: #eeeeee;
	color: #000;
}
.pagelist a:hover{
	background: #18b6b9;
	color: #fff;
}
.pagelist a:active{
	background: #038f92;
}

.pagelist table tr td{
	padding: 5px;
	text-align: center;
}
.class_detail{
}
.class_detail table tr td{
	padding: 15px 0;
	border-bottom:solid 1px #e8e9ea;
}
.wordbold{
	font-weight: bold;
}
/*按鈕-我要報名*/
.btn_apply a{
	display: block;
	float: left;
	line-height: 35px;
	text-align: center;
	color: #fff;
	font-weight: bold;
	margin-right:10px;
	width: 96px;
	height: 35px;
	background: url(../images/btn_apply.png) left top;
}
.btn_apply a:hover{
	background: url(../images/btn_apply.png) left 70px;
}
.btn_apply a:active{
	background: url(../images/btn_apply.png) left bottom;
}
/*按鈕-back*/
.btn_back{
	height:35px;
	margin-bottom:30px;
}
.btn_back a{
	display: block;
	float: right;
	width: 70px;
	height: 35px;
	background: url(../images/btn_back.png) left top;
	font-size:14px;
	font-weight:bold;
	color: #fff;
	text-align: center;
	line-height: 35px;
}
.btn_back a:hover{background: url(../images/btn_back.png) left 70px;}
.btn_back a:active{background: url(../images/btn_back.png) left bottom;}

/*按鈕-登出*/
.btn_logout{
	height:35px;
}
.btn_logout a{
	display: block;
	float: right;
	width: 70px;
	height:35px;
	background: url(../images/btn_logout.png) left top;
	font-size:14px;
	font-weight:bold;
	color: #fff;
	text-align: center;
	line-height: 35px;
}
.btn_logout a:hover{background: url(../images/btn_logout.png) left 70px;}
.btn_logout a:active{background: url(../images/btn_logout.png) left bottom;}

/*期刊目錄------------------------------------------------------------------------*/
.journals_wrap{
	width: 640px;
	margin: 0 auto;
}
.journals_wrap .project{
	float: left;
	margin:15px; 
	width: 290px;
	height: 150px;
}
.journals_wrap .project h3{
	padding: 0;
	line-height: normal;
	border: 0;
	color: #0063b9;
	font-size: 20px;
	line-height: 2;
}
.journals_wrap .project ul{
	list-style: none;
}
.journals_wrap .project ul li a{
	display: block;
	float: left;
	width: 140px;
	height: 50px;
	text-align: center;
	line-height: 50px;
	background: #f3f4f4;
	color: #4a4a4a;
	margin: 0 5px 5px 0;
}
.journals_wrap .project ul li a:hover{
	background: #519fd5;
	color: #fff;
}
.journals_wrap .project ul li a:active{
	background: #1371b2;
}

.submission{
	width:730px;
	margin: 30px; auto;
	border: solid 1px #b7b7b7;
	font-size: 15px;
}
.submission h5{
	color: #363636;
	font-size: 18px;
	background: #f5f5f5;
	padding: 10px 30px;
}
.submission ol{
	width: 600px;
	margin:25px auto;
}
.submission ol li{
	line-height: 1.6;
}
/*期刊下載*/
.download_wrap{}
.download_wrap ul{ list-style: none;}
.download_wrap ul li{
	margin-bottom: 15px;
}

.download_wrap ul li a{
	display: block;
	width: 800px;
	height: 60px;
	background: url(../images/bg_downloadList.jpg) left top;
	color: #333;
}
.download_wrap ul li a:hover{background: url(../images/bg_downloadList.jpg) left 120px;}
.download_wrap ul li a:active{background: url(../images/bg_downloadList.jpg) left bottom;}
.content .innerBox .download_wrap p{
	width: 670px;
	/*padding: 0 15px;
	line-height: 60px;*/
}
.content .innerBox .download_wrap h5{
	color: #0070b2;
}
/*購書專區------------------------------------------------------------------------*/
.shopWrap{width: 800px;}
.content .innerBox .shopWrap p{
	margin: 0;
	font-size: 14px;
	font-weight: bold;
	text-align: center;
}
.shopWrap ul{ list-style: none;}
.shopWrap ul li{}
.shopWrap ul li a{
	display: block;
	float:left;
	width: 125px;
	height: 220px;
	margin-right: 10px;
	margin-bottom: 20px;
	padding: 10px;
	color: #333;
}
.shopWrap ul li a:hover{
	color: #e75700;
	background: #f4f3f3;
}
.shopWrap .imgWrap{
	padding: 5px;
	background: #fff;
	border: solid 1px #dcdcdc;
	margin-bottom: 10px;
}
.shopWrap ul li img{
	width: 115px;
	height: 158px;
}
/*book info*/
.bookInfo{
	width: 800px;
}
.bookInfo img{
	width: 200px;
	height: 275px;
	padding: 5px;
	border: solid 1px #dcdcdc;
}
.bookInfo table tr td{
	padding: 5px 8px;
	font-size: 15px;
}
.bookInfo table tr td.bookName{
	color: #00a4a7;
	font-size: 22px;
	font-weight: bold;
}
.bookInfo table tr td.bookPrice{
	color: #cb0000;
	font-weight: bold;
}
/*按鈕-訂購此書*/
.btn_order{
	height:35px;
}
.btn_order a{
	display: block;
	float: right;
	width: 90px;
	height:35px;
	background: url(../images/btn_order.png) left top;
	font-size:14px;
	font-weight:bold;
	color: #fff;
	text-align: center;
	line-height: 35px;
}
.btn_order a:hover{background: url(../images/btn_order.png) left 70px;}
.btn_order a:active{background: url(../images/btn_order.png) left bottom;}


/*最新消息------------------------------------------------------------------------*/
.NewsWrap{
	width: 800px;
	margin: 0 auto;
}
.smallpapa{padding: 0 80px;}/*控制最新消息內頁的日期內縮排*/
.NewsWrap .category{
	min-height: 45px;
}
.NewsWrap .category ul{
	list-style: none;
}
.NewsWrap .category ul li a{
	display: block;
	float: left;
	line-height: 40px;
	text-align: center;
	padding: 0 15px;
	color: #848484;
	font-size: 15px;
	font-weight: bold;
	background: #fff;
	border: solid 1px #c6c6c6;
	border-radius: 5px;
	margin: 0 10px 10px 0;
}
.NewsWrap .category ul li a:hover{
	background: #ececec;
}
.NewsWrap .category a.nowTab, .NewsWrap .category a:hover.nowTab{
	background: #848484;
	color: #fff;
}
.NewsWrap .newsList{
	font-size: 15px;
	margin: 10px 0 30px 0;
}
.NewsWrap .newsList table tr td{
	padding: 10px 8px;
}
.NewsWrap .newsList table thead{
	color: #fff;
	font-weight: bold;
}
.NewsWrap .newsList table tbody tr td{
	border-bottom: dotted 1px #b6b9ba;
}
.NewsWrap .newsList table tbody th{
	color: #f37c12;
	border-bottom: dotted 1px #b6b9ba;
}
.NewsWrap .newsList table tbody a{
	color: #767676;
}
.NewsWrap .newsList table tbody a:hover{
	color: #000;
}
/*最新消息-檔案下載*/
.NewsDownload{
	margin-bottom: 20px;
}
.NewsDownload h5{
	font-size: 18px;
	font-weight: bold;
	color: #444;
	padding-left: 30px;
}
.NewsDownload .downmylala{
	background: #f7f7f7;
	padding: 15px 30px;
	border-radius: 8px;
}
.NewsDownload .downmylala ul{
	padding: 0 30px;
	list-style-type: disc;
}
.NewsDownload .downmylala ul li a{
	color: #52b0fd;
	text-decoration: underline;
	font-size: 15px;
	line-height: 1.8;
}
.NewsDownload .downmylala ul li a:hover{
	text-decoration: none;
	color: #005eab;
	font-weight: bold;
}

/*活動報導------------------------------------------------------------------------*/
.actList{}
.actList .actItem{
	/*position: relative;*/
	width: 798px;
	height: 148px;
	margin-bottom: 15px;
	border: solid 1px #ddd;
}
.actList .actItem .actListFoto{
	float: left;
	width: 215px;
	height: 150px;
}
.actList .actItem .actListFoto img{
	width: 215px;
	height: 150px;
}
.actList .actItem .actdescribe{
	float: left;
	padding: 20px 30px;
	width: 523px;
}
.actList .actItem .actdescribe h3{
	border: 0;
	line-height: normal;
	padding: 0;
}
.actList .actItem .actdescribe p{
	margin: 10px 0;
}
/*.actList .actItem .btnGo{
	position: absolute;
	z-index: 1000;
	width: 30px;
	height: 30px;
	right: 0;
	bottom: 0;
	text-indent: -9999px;
}*/
.actList .actItem a{
	display: block;
	width: 798px;/*because border set*/
	height: 148px;/*because border set*/
	background: url(../images/bg_actGO.png) left top;
	color: #555;
}
.actList .actItem a:hover{background: url(../images/bg_actGO.png) left 296px;}
.actList .actItem a:active{background: url(../images/bg_actGO.png) left bottom;}

.actMaintitle{ 
	padding:0 80px 30px 80px;
	border-bottom: solid 1px #ececec;
}
.actMaintitle h3, .actMaintitle h5{
	padding: 0;
	border: 0;
}
.actMaintitle h5{}
.actMaintitle p{
	font-size: 15px;
	margin-top: 15px;
}
.fotowrap{
	margin: 0 auto;
	width: 640px;
}
.fotowrap .bigFoto{
	margin-bottom: 20px;
	position: relative;
	width: 640px;
	height: 425px;
	/**/
}
/*.fotowrap .bigFoto img{
	position: absolute;
	top: 0;
	width: 640px;
	height: 425px;
	display: none;
}
.fotowrap .bigFoto img #now{display: block;}*/


.fotowrap .bigFoto ul{ list-style: none;}
.fotowrap .bigFoto ul li{
	position: absolute;
	top: 0;
}
.fotowrap .bigFoto img{
	width: 640px;
	height: 425px;
	display: none;
}
.fotowrap .bigFoto img#BIG01{display: block;}

.fotowrap .tinyFoto{}
.fotowrap .tinyFoto ul{ list-style: none;}

.fotowrap .tinyFoto ul li{
	display: block;
	float: left;
	width: 120px;
	height: 80px;
	background: #222;
	margin: 0 8px 10px 0;
	cursor: pointer;
}
.fotowrap .tinyFoto img{
	width: 120px;
	height: 80px;
}
/*相關網站------------------------------------------------------------------------*/
.link_wrap{
	width: 800px;
	margin: 0 auto;
}
.link_wrap .project{
	width: 800px;
	margin-bottom: 40px;
}

.link_wrap .project h3{
	padding: 0;
	line-height: normal;
	border: 0;
	color: #0063b9;
	font-size: 20px;
	line-height: 2;
}
.link_wrap .project ul{
	list-style: none;
}
.link_wrap .project ul li a{
	display: block;
	float: left;
	/*width: 140px;*/
	height: 50px;
	text-align: center;
	line-height: 50px;
	padding: 0 30px;
	background: #f3f4f4;
	color: #4a4a4a;
	margin: 0 5px 5px 0;
}
.link_wrap .project ul li a:hover{
	background: #519fd5;
	color: #fff;
}
.link_wrap .project ul li a:active{
	background: #1371b2;
}
.link_wrap .project .area{
	margin-bottom: 10px;
}
.link_wrap .project .area h3{
	background: #17b5b8;
	color: #fff;
	font-size: 14px;
	font-weight:bold;
	text-align:center;
	border-radius: 8px;
	width: 50px;
	margin-bottom: 5px;
}
/*聯絡我們------------------------------------------------------------------------*/
.contact{
	width: 575px;
	height: 560px;
	margin: 0 auto;
	background: url(../images/bg_contact.jpg);
}
.contact .address{
	height: 75px;
	padding-left: 315px;
	padding-top: 35px;
}
.contact .address p{
	line-height: normal;
	margin: 0;
	font-size: 13px;
}
.contact .address p span{color: #007ce1; font-weight: bold;}

.contact .inputArea{
	height: 340px; 
	width: 460px; 
	padding-top: 40px; 
	margin: 0 auto;
}
.contact .inputArea table tr th, .contact .inputArea table tr td{
	padding: 5px 10px;
}
.contact .inputArea table tr th{
	text-align: right;
	color: #626262;
}
.contact .inputArea input, .contact .inputArea textarea{
	border: solid 1px #bbb;
	border-radius: 5px;
	font-size: 15px;
	padding:5px 8px; 
}
.contact .btnArea{
	/**/width:160px;
	margin:0 auto;
	height: 50px;
	padding:10px 0; 
}

/* CSS2.1 attribute-equals selector */
/* reset button */
.contact .btnArea input[type=reset], 
.contact .btnArea .btn_refill{
	width: 72px;
	height: 42px;
	background: url(../images/btn_refill.png) left top;
	border:0;
}
.contact .btnArea input[type=reset]:hover,
.contact .btnArea .btn_refill:hover{
	background: url(../images/btn_refill.png) left top;
	border:0;
}
.contact .btnArea input[type=reset]:active,
.contact .btnArea .btn_refill:active {
	background: url(../images/btn_refill.png) left bottom;
	border:0;
}
.contact .btnArea input[type=reset]:focus,
.contact .btnArea .btn_refill:focus{}


/* submit button */
.contact .btnArea input[type=submit], 
.contact .btnArea .btn_sent{
	width: 72px;
	height: 42px;
	background-image: url(../images/btn_sent.png);
	background-position:  left top;
	border:0;
}
.contact .btnArea input[type=submit]:hover,
.contact .btnArea .btn_sent:hover{
	background-position:  left top;
	border:0;
}
.contact .btnArea input[type=submit]:active,
.contact .btnArea .btn_sent:active {
	background-position: left bottom;
	border:0;
}
.contact .btnArea input[type=submit]:focus,
.contact .btnArea .btn_sent:focus{}




/*footer set------------------------------------------------------------------------*/
.footer {
	position: relative;
	margin-top: -90px; /* negative value of footer height */
	height: 90px;
	clear:both;
}
.footer .andfooteragain{
	width: 980px;
	margin: 0 auto;
	border-top: solid 4px #52b0fd;
	font-size: 13px;
	padding: 12px 0;
}
.footer .andfooteragain p{
	line-height: 1.6;
	padding: 0 15px;
}
.footer .andfooteragain p span{
	font-weight: bold;
	margin-right: 7px;
	color: #007ce1;
}