@import url("../css/normalize.css");
@import url(//fonts.googleapis.com/css?family=Open+Sans+Condensed:700|Open+Sans:400,700);

html{height:100%;}
html, button, input, select, textarea {color:#333;}
body{font-size:16px; color:#333; font-weight:400;
	font-family:'Open Sans', Arial, "Microsoft JhengHei", "微軟正黑體", Meiryo,"LiHei Pro", Helvetica;
	font-smooth:always;
	font-smoothing: antialiased;
	-moz-font-smoothing: antialiased;
	-webkit-font-smoothing: antialiased;
	-webkit-font-smoothing: subpixel-antialiased;
	-moz-osx-font-smoothing: grayscale;
	height:auto!important;min-height:100%;height:100%; 
	/*overflow-x:hidden;*/
	background-color:#fff;
}

::-moz-selection{background:#dfdfdf; color:#333; text-shadow:none;}
::selection {background:#dfdfdf; color:#333; text-shadow:none;}

::-webkit-input-placeholder{color:#aaa;}
:-moz-placeholder{color:#aaa;}
.placeholder{color:#aaa;}

hr{display:block; height:1px; border:0; border-top:1px solid #ccc; margin:1em 0; padding:0;}
img{vertical-align:middle;}
fieldset{border:0; margin:0; padding:0;}
textarea{resize:vertical;}

a{color:#06C; text-decoration:none;}
a:hover, a:active, a:focus{outline:0; color:#09F;}

.wrapper{width:1250px; min-width:1250px; margin:0 auto; box-sizing:border-box; position:relative;}

/*-------------------------------------------
Header
-------------------------------------------*/
#header-container{
	position:relative; 
	height:245px; 
	background:url(../images/top-bg.png) repeat-x #c1c940;
}
#header-container header{
	position:relative;
	height:190px;
	background:url(../images/top-bg-center.png) center 0 no-repeat #c1c940;
}
#header-container #logo{
	margin:0;
	background:url(../images/tade-title.png) no-repeat;
	width:538px; height:80px;
	position:absolute; top:28px; left:25px; 
	text-indent:-99999em;
}
/*-------------------------------------------
Top Links
-------------------------------------------*/
.top-links{
	position:absolute; top:10px; right:20px; 
	text-align:right; font-size:13px;
}
.top-links ul{margin:0; padding:0; list-style:none;}
.top-links ul li{float:left;}
.top-links em{font-size:12px; font-style:normal; font-family:"新細明體"; color:#ccc; margin:0 8px; display:none;}
.top-links a{
	display:inline-block;*display:inline;zoom:1;
	padding:50px 15px 5px;
	color:#111;
	border-left:1px solid #c1c940;
}
.top-links .name{color:#000;}
.top-links .search{background:url(../images/top-icon-search.png) 50% 10px no-repeat;}
.top-links .home{background:url(../images/top-icon-home.png) 50% 10px no-repeat;}
.top-links .member{background:url(../images/top-icon-member.png) 50% 10px no-repeat;}
.top-links .contact{background:url(../images/top-icon-contact.png) 50% 10px no-repeat;}
.top-links .global{background:url(../images/top-icon-global.png) 50% 10px no-repeat;}
.top-links .logout{color:#09F; font-weight:700;}
	/* hover */
	.top-links a:hover{color:#17902f; background-color:#f4f4f4;}
	/* Google Search */
	#google-search{
		position:absolute; top:79px;
		width:100%;
		text-align:left;
		display:none;
	}
	.input-google{
		box-sizing:border-box;
		width:96%;
		border:1px solid #bbb !important;
		background-position:8px 50% !important;
		padding:5px 8px !important;
	}
	.input-google:focus, .input-google:active{
		background:none !important;
	}
	.btn-google{
		background:url(../images/icon-google-search.png) 50% 50% no-repeat;
		background-color:transparent !important;
		width:24px; height:24px;
		box-shadow:none !important;
		position:absolute; top:4px; right:15px;
		text-indent:-99999em;
	}

/*-------------------------------------------
Nav
-------------------------------------------*/
#header-container nav{
	border-top:1px solid #bbc43e;
	width:1200px;
	margin:0 auto;
	position:absolute; top:127px; left:50%; margin-left:-600px;
}
#menu *{box-sizing:border-box;-webkit-box-sizing:border-box;}
#menu a.active{text-decoration:none;}

.sf-menu {margin:0 auto; padding:0; list-style:none;}
.sf-menu *{margin:0; padding:0; list-style:none;}
.sf-menu{height:45px;}
.sf-menu li{position:relative; }
.sf-menu li.first{margin:0;}
.sf-menu li:hover, .sf-menu li.sfHover{-webkit-transition:none; transition:none;}
.sf-menu li a:hover{color:#111;}
.sf-menu > li{float:left;}
.sf-menu li:hover > ul, .sf-menu li.sfHover > ul{display:block;}
.sf-menu a{display:block; box-sizing:border-box; text-decoration:none; position:relative;}
.sf-menu li .menulink{
	font-size:16px; color:#111; line-height:45px; font-weight:700;
	text-align:center; 
	padding:0 24px;
	margin:0;
	background:url(../images/nav-line.png) 100% 50% no-repeat;
	position:relative;
}
.sf-menu li .menulink.publications{
	background:url(../images/nav-products.png) 20px 50% no-repeat;
	padding-left:54px;
}
.sf-menu li .menulink:hover{
	background-color:#f4f4f4;
	color:#17902f;
}
.sf-menu li:last-child .menulink{border-right:0;}
	/* Level 2 */
	.sf-menu ul{
		display:none;
		position:absolute; top:100%; margin-top:0px; left:0; z-index:1000;  
		width:100%; 
		background-color:#17902f;
		box-shadow:0 2px 3px rgba(0,0,0,.3);
		-moz-box-shadow:0 2px 3px rgba(0,0,0,.3);
		-webkit-box-shadow:0 2px 3px rgba(0,0,0,.3);
	}
	.sf-menu ul a{
		zoom:1; 
		color:#fff; font-size:15px; line-height:18px; text-align:left;
		padding:10px 8px;
		border-bottom:1px solid rgba(0,0,0,.2);
	}
	.sf-menu ul a:hover{
		background-color:#e70012; 
		color:#fff;
	}
	.sf-menu ul li{float:none;}
	/* Level 3 */
	.sf-menu ul ul{top:-1px; left:100%;}
	.sf-menu ul ul li{float:none;}
	.sf-menu .sub, .sf-menu .sub:hover{
		background-image:url(../images/nav-sub-arr.png);
		background-position:96% 50%;
		background-repeat:no-repeat;
	}
	/* safari */
	#menu.safari li .menulink{
		padding:0 21.5px;
	}
	#menu.safari li .menulink.publications{
	background:url(../images/nav-products.png) 20px 50% no-repeat;
	padding-left:58px;
}


/*-------------------------------------------
Container
-------------------------------------------*/
#content-container{
	height:auto!important;min-height:400px;height:400px;
	box-sizing:border-box;
	padding-top:20px;
}
#content-container *{
	box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;
}
#content-container .wrapper{
	padding:15px 22px 30px;
}
/*-------------------------------------------
Sub Menu
-------------------------------------------*/
#sub-menu{
	float:left;
	width:190px;
	position:relative;
}
.sub-title{
	margin:0;
	font-size:40px; color:#fff; font-weight:500;
	position:absolute; top:-81px; left:10px;
}
.sub-list{
	margin:0; padding:0; list-style:none;
	overflow:hidden;
	border-radius:5px;
}
.sub-list li.separated{
	border-top:2px solid #c1c940;
}
.sub-list li a{
	display:block; 
	background-color:#eee;
	color:#000; font-weight:700; font-size:15px;
	padding:12px 15px;
	margin-bottom:1px;
	transition:all .2s;-webkit-transition:all .2s;
}
.sub-list li a:hover, .sub-list li .active{
	background-color:#c1c940;
	color:#fff;
}
/*-------------------------------------------
banner
-------------------------------------------*/
div.leftBlock{
	float:left;
	width:190px;
	ooverflow:hidden;
}
div.leftBlock img{margin:50px 0 10px;}
/*-------------------------------------------
Tabs
-------------------------------------------*/
#tabs ul{
	margin:0; padding:0; list-style:none;
	position:absolute; top:25px; right:20px; z-index:10;
}
#tabs ul li{
	float:left;
}
#tabs ul li a{
	border-bottom:1px solid #ddd;
	padding:4px 15px;
	color:#777;
}
#tabs ul li a:hover{
	color:#09F;
}
#tabs ul li.active a{
	border:2px solid #c1c940; border-bottom:2px solid #fff;
	color:#000; font-weight:700;
}
#tabs ul li a:hover strong{
	color:#e70012;
}
/*-------------------------------------------
Content
-------------------------------------------*/
#content{
	float:right;
	width:960px;
	height:auto!important;min-height:420px;height:420px;
}
#content.no-submenu{
	width:100%;
	float:none;
}
	/*-------------------------------------------
	Breadcrumb
	-------------------------------------------*/
	#breadcrumb{
		position:relative;
		color:#555a07; font-size:13px; line-height:18px;
	}
	#breadcrumb ul{
		position:absolute; top:-60px; right:0px;
		margin:0; padding:0; list-style:none; 
		text-align:right;
	}
	#breadcrumb ul li{float:left;}
	#breadcrumb ul li em{
		font-style:normal; 
		margin:0 8px; 
		color:#959b34;
	}
	#breadcrumb a{
		color:#555a07;
		background:url(../images/icon-home.png) 0 50% no-repeat;
		padding-left:24px;
	}
	/*-------------------------------------------
	Page Title
	-------------------------------------------*/
	#page-title{
		margin:0;
		padding:0;
		position:relative;
		color:#111; font-size:30px; line-height:1.5; font-weight:500;
		font-family:Arial, "Microsoft JhengHei", "微軟正黑體", "LiHei Pro", Helvetica;
		border-bottom:5px solid #c1c940;
	}
	/*-------------------------------------------
	Article 
	-------------------------------------------*/
	#content article{
		margin-top:20px;
		padding-bottom:25px;
		line-height:180%; 
		height:auto!important;min-height:400px;height:400px;
		position:relative;
		transition:all .2s;-webkit-transition:all .2s;
	}
	.part-title{
		margin:10px 0 0;
		padding:5px 0;
		font-size:18px; color:#000; font-weight:700;
		border-bottom:2px solid #ddd;
		position:relative;
	}	
	.group-title{
		margin:10px 0 0; 
		padding:5px 0; 
		font-size:18px; color:#000; font-weight:700;
		border-bottom:2px solid #c1c940;
	}
/*-------------------------------------------
Page
-------------------------------------------*/
.page{
	margin:0; 
	padding:10px 0;
	text-align:center; 
	clear:both;
	font-size:12px;
}
.page a, .page a:hover, .page .current, .page .disabled, .page select{
	padding:5px 6px; 
	margin:2px 0; 
	border-radius:5px;-moz-border-radius:5px;-border-radius:5px;
}
.page select{
	padding:1px !important; 
	margin:0 3px !important;
}
.page a{
	color:#333; 
	border:1px solid #ccc; 
	cursor:pointer; 
	text-decoration:none;
}
.page a:hover{
	color:#fff; 
	background:#3235aa; 
	border:1px solid #3235aa;
}
.page .current{
	color:#000; font-weight:700; 
	background:#fff; 
	border:none;
}
.page .disabled{color:#ddd; border:1px solid #ddd;}
.page .pageTo{padding:3px 3px; margin:2px; width:50px;}
.page select{box-sizing:border-box; padding:4px !important;}
/*-------------------------------------------
Footer Nav
-------------------------------------------*/
#footer-nav{
	width:100%;
    width:expression(document.body.clientWidth <= 1250? "1250px": "auto");
    min-width:1250px;
	background:url(../images/footer-bg-logo.png) 101% 190% no-repeat #c1c940;
	padding:30px 0;
	font-size:13px;
	box-shadow:inset 0 1px 5px rgba(0,0,0,.2);
}
#footer-nav strong{
	display:block;
	color:#333; font-size:15px;
	margin-bottom:15px;
}
.icon-mobile{
	display:inline-block;
	background:url(../images/footer-icon-mobile.png) 0 50% no-repeat;
	padding-left:20px;
}
#footer-nav ul{
	padding:0;
	list-style:none;
}
#footer-nav ul li{
	float:left;
	padding:0 35px;
}
#footer-nav ul li ul li{
	float:none;
	padding:2px 0;
}
#footer-nav ul li ul li a{
	color:#fff; font-size:13px;
}
#footer-nav .sub li{
	float:left;
	width:90px;
}
#footer-nav .sub li:nth-child(even){
	width:80px;
}
	/* hover */
	#footer-nav a:hover, #footer-nav a:hover strong{color:#09F;}
/*-------------------------------------------
Footer
-------------------------------------------*/
footer{
	height:auto!important;min-height:78px;height:78px;
	color:#333; font-size:13px; line-height:1.8; 
	text-align:center;
	position:relative; z-index:0;
	padding:18px 0;
}
footer *{
	box-sizing:border-box;
}
footer address{
	font-style:normal;
}
footer .googlemap{
	display:inline-block;*display:inline;zoom:1;
	background:url(../images/footer-icon-location.png?20150814) 50% 50% no-repeat;
	width:12px; height:12px;
}

footer .googlemap:hover{
	background-image:url(../images/footer-icon-location-hover.png?20150814);
}
#recommand{
	color:#f00; font-size:13px;
	text-align:center;
}
#recommand .huaweb{color:#bbb !important;}
/*-------------------------------------------
ScrollUp
-------------------------------------------*/
.scrollup{
	display:none; 
	width:46px; height:46px;
	border-radius:5px;
	text-indent:-9999px; 
	position:fixed; bottom:45px; right:3%; z-index:4;
	background:url(../images/btn-top.png) no-repeat;
	background-color:#3235aa;
}
/*-------------------------------------------
Upgrade New Browser
-------------------------------------------*/	
#upgradeNewBrowser{padding:12px; background-color:#fdfad0; color:#F00; text-align:center;}
/*-------------------------------------------
Clearfix: contain floats
-------------------------------------------*/
.clearfix:before,
.clearfix:after {
    content: ""; /* 1 */
    display: table; /* 2 */
}
.clearfix:after{clear: both;}
/* For IE 6/7 only */
.clearfix{*zoom: 1;}
/*-------------------------------------------
Common
-------------------------------------------*/
.maxWidth { width:100%;}
.maxHeight { height:100%; margin:0 auto;}
.floatL{ float:left; }
.floatR{ float:right; }
.hidden{display:none !important; visibility:hidden;}
.explanation{color:#C60; font-weight:normal; font-size:13px; font-style:normal;}
.required{color:#f00 !important; font-weight:normal;}
.noneData{font-size:13px; color:#999; text-align:center; clear:both;}
form{display:inline;}
.fieldRequired{text-align:right; color:#666;}
.before{color:#aaa; margin-right:5px;}
.after{color:#c00; margin-right:5px;}
.important, .full{color:#f00 !important;}
.border-none{border:none !important;}
.dataUpdate h2{font-size:18px; color:#333;}
.border-radius-3px{border-radius:3px;-moz-border-radius:3px;-webkit-border-radius:3px;}
.td-padding-0{padding:0 !important;}
.border-0, .border-0 th, .border-0 td{border:none !important;}
.icon-app-video-16{display:inline-block;*display:inline;zoom:1; width:16px; height:16px; background:url(../images/app-logo-16x16.png) 50% 50% no-repeat;}
.icon-app-video-32{display:inline-block;*display:inline;zoom:1; width:16px; height:16px; background:url(../images/app-logo-32x32.png) 50% 50% no-repeat;}
.icon-app-video-128{display:inline-block;*display:inline;zoom:1; width:16px; height:16px; background:url(../images/app-logo-128x128.png) 50% 50% no-repeat;}
/*-------------------------------------------
UI
-------------------------------------------*/
#ui-datepicker-div{font-size:12px;}
.ui-datepicker-trigger{margin-left:3px;}
.ui-dialog{z-index:99; box-shadow:0 0 5px rgba(0,0,0,.2);}
.ui-datepicker .ui-datepicker-title select{padding:3px !important;}
.ui-datepicker .ui-datepicker-prev, 
.ui-datepicker .ui-datepicker-next{margin-top:3px !important;}

/*-------------------------------------------
Input, Select, Textarea
-------------------------------------------*/
input[type=radio], input[type=checkbox]{vertical-align:-1px; margin:0 3px;}
input[type=text], input[type=password], input[type=email], input[type=tel], input[type=date], textarea, select{
	box-sizing:border-box;
	font-size:13px;
	padding:7px 8px; 
	margin:1px; 
	background:#fff;
	border:1px solid #bbb; 
	box-shadow:inset 0 1px 2px rgba(0,0,0,.2);-moz-box-shadow:inset 0 1px 2px rgba(0,0,0,.2);-webkit-box-shadow:inset 0 1px 2px rgba(0,0,0,.2);
	border-radius:3px;-moz-border-radius:3px;-webkit-border-radius:3px;
}
select{padding:6px 5px;}
textarea{width:98%;}
input[type=radio], input[type=checkbox]{vertical-align:-2px; margin-right:5px;}
input[type=text]:focus, input[type=password]:focus, input[type=email]:focus, input[type=date]:focus, textarea:focus, select:focus{
	outline:0;
	background:#fff;
	border:1px solid #09F !important; 
}
	/* input[type=file] */
	.field-file{overflow:hidden; position:relative; 
		font-size:13px; color:#000!important; font-weight:400; 
		padding:5px 10px !important;}
	.field-file [type=file]{
		display:block;		
		min-height:100%; min-width:100%;
		filter:alpha(opacity=0);opacity:0;-moz-opacity:0;-webkit-opacity:0;
		position:absolute; right:0; text-align:right; top: 0;
		cursor:pointer;}
/*-------------------------------------------
Buttons
-------------------------------------------*/
input[type=submit], input[type=button], input[type=reset], a.btn, .field-file{
	-webkit-appearance:none; 
	box-sizing:border-box;
	display:inline-block; *display:inline; *zoom:1;
	text-align:center;
	text-decoration:none;
	color:#fff; font-size:15px;
	font-family: Arial, "Microsoft JhengHei", "微軟正黑體", Helvetica;
	background-color:#3235aa;
	border:none;
	padding:7px 13px;
	box-shadow:inset 0 -2px 0 rgba(0%,0%,0%,.2), 0 1px 3px rgba(0,0,0,.2);
	-moz-box-shadow:inset 0 -2px 0 rgba(0%,0%,0%,.2), 0 1px 3px rgba(0,0,0,.2);
	-webkit-box-shadow:inset 0 -2px 0 rgba(0%,0%,0%,.2), 0 1x 3px rgba(0,0,0,.2);
	border-radius:3px;-moz-border-radius:3px;-webkit-border-radius:3px;
	transition:all .1s linear;-moz-transition:all .1s linear;-webkit-transition:all .1s linear;
	cursor:pointer;
}
input[type=submit]:hover, input[type=button]:hover, input[type=reset]:hover, a.btn:hover, .field-file:hover{
	/*background:#09F;*/
	text-decoration:none;
	/*margin-top:1px;*/
	box-shadow:inset 0 5px 35px rgba(0,0,0,.5);
	-moz-box-shadow:inset 0 5px 35px rgba(0,0,0,.5);
	-webkit-box-shadow:inset 0 5px 35px rgba(0,0,0,.5);
}

.buttons{text-align:center; height:40px; margin:20px 0; position:relative;}
.buttons input[type=submit], .buttons input[type=button], .buttons input[type=reset], .buttons a.btn{
	padding:12px 35px; line-height:18px;  font-size:16px;
	margin-left:10px; margin-right:10px;
}
.btn-secondary{background:#aaa !important; border-color:#999!important;}
.btn-secondary:hover{}
/*-------------------------------------------
search-block
-------------------------------------------*/
#search-block{
	background-color:#f6f6f6;
	border-radius:3px;-moz-border-radius:3px;-webkit-border-radius:3px;
	padding:10px;
	position:relative;
}
#search-block ul{
	margin:0; padding:0; list-style:none;
}
#search-block ul li{
	float:left; 
	padding-right:25px;
	font-size:13px;
}
#search-block input{margin:3px; font-size:13px;}
#search-block select{margin:3px; font-size:13px;}
#search-block input[type=text]{}
#search-block .btn-search{
	position:absolute; bottom:10px; right:10px;
	font-weight:normal; font-size:15px; line-height:18px;
	padding:8px 20px;
}
#search-block input[type=submit]:hover, #search-block input[type=button]:hover{
	text-decoration:none;
}
#search-block input.date{width:100px;}
#search-block #twzipcode{display:inline-block;*display:inline;zoom:1;}
#search-block .ui-datepicker-trigger{vertical-align:-2px; cursor:pointer;}
/*-------------------------------------------
Data Fields
-------------------------------------------*/
/*
.data-fields{margin:0; padding:0; list-style:none; position:relative;}
.data-fields *{box-sizing:border-box;}
.data-fields li{
	border-bottom:1px solid #ddd; 
	box-sizing:border-box; padding:4px 5px; padding-left:165px; 
	position:relative; vertical-align:top; 
	display:inline-block;*display:inline;zoom:1;
	width:100%; height:auto!important;min-height:40px;height:40px;
	color:#333; line-height:32px;
}
.data-fields li.col-2{width:50%; float:left;}
.data-fields h5{
	display:inline-block;*display:inline;zoom:1; 
	position:absolute; left:0px; 
	margin:3px 0 0; padding:3px 5px;
	font-size:12px; color:#382777; line-height:18px; font-weight:700; 
	width:160px;
}
.data-fields h5:after{content:"：";}
.data-fields p{margin:0;}
.data-fields .col-after{float:right; text-align:left; width:50%; box-sizing:border-box;}
*/
.zipcode{width:70px;}

/*-------------------------------------------
Table List
-------------------------------------------*/
table.list thead th{background:#e9ead3; border-bottom:1px solid #c1c940; color:#111; padding:3px;}
table.list tbody th, table.list tbody td{padding:8px 5px; border-bottom:1px solid #ddd; line-height:1.5; font-size:15px;}
table.list tbody td{border-left:1px dotted #e3e3e3;}
table.list tbody td:nth-child(1){border-left:none;}
table.list tbody tr:nth-child(odd){}
table.list tbody tr:nth-child(even){background:#f7f7f7;}

/*-------------------------------------------
Table Content
-------------------------------------------*/
table.content{border-top:1px solid #ddd;}
table.content thead th{background:#e9ead3; border-bottom:1px solid #c1c940; color:#111; padding:3px;}
table.content tbody th, table.content tbody td{padding:8px 8px; border-bottom:1px solid #ddd; font-size:15px;}
table.content tbody th{background:#e9ead3; color:#000; border-bottom:1px solid #c1c940; text-align:left;}
table.content tbody td{}
table.content tbody td:nth-child(1){border-left:none;}
table.content table td{border-right:none;}
table.content table td{padding:3px 8px;}
	
/*-------------------------------------------
Social Share
-------------------------------------------*/
#social-share{text-align:center; padding:10px 5px; height:32px; clear:both;
	background:#f1f1f1; border-top:1px solid #ddd; border-bottom:1px solid #ddd;}
#social-share strong{display:inline-block;*display:inline;zoom:1; float:left; width:42px; line-height:32px;}
#social-share a{display:inline-block;*display:inline;zoom:1; width:32px; height:32px; 
	float:left; margin-left:7px; 
	background-image:url(../images/icons-social.png); background-repeat:no-repeat;
	text-indent:-9999em;
	overflow:hidden; border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px;}
#social-share .fb     {background-position:0 0;}
#social-share .gl     {background-position:0 -32px;}
#social-share .twitter{background-position:0 -64px;}
#social-share .plurk  {background-position:0 -96px;}

/*-------------------------------------------
Alert Information
-------------------------------------------*/
.alert{
	padding:10px 20px;
	margin:12px 0;
	text-align:center;
	color:#000; font-size:15px;
}
.alert-info{
	background:#fefcf0; 
	border:2px solid #f2d997;
}
.alert-info a{color:#09F;}
	/* error */
	.alert-error{
		background:#fdf1f1; 
		border:2px solid #e4b6b6;
	}

@media 
all and (min--moz-device-pixel-ratio: 1.5),
all and (-o-min-device-pixel-ratio: 3/2),
all and (-webkit-min-device-pixel-ratio: 1.5),
all and (min-device-pixel-ratio: 1.5),
all and (min-resolution: 1.5dppx) {
	#header-container #logo{
		background:url(../images/tade-title@2x.png?20150813) no-repeat;
		background-size:538px 80px;
	}
}