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

#mode{ display:none; width:100px;}/*很重要_不可刪除_此DIV為JS判別讀取PC或是MOBILE CSS的依據_此DIV放置在header.html*/
.logo{ background:url(../../images/new/all/logo.png) no-repeat; width:174px; height:122px; position:absolute; z-index:2; margin-left:17px;}

/*主MENU*/
.mainMenu{ height:50px; background:url(../../images/new/all/mainMenu.png); line-height:50px;}
.mainMenu ul.centerMenu{ list-style:none; width:100%; max-width:980px; margin:0 auto; text-align: center;}
.mainMenu ul.centerMenu li{ display:inline-table; margin:0 15px;}
.mainMenu ul.centerMenu li a{ text-decoration:none; font:16px Arial, "微軟正黑體"; color:#FFF; padding-left:30px; transition:all 0.4s; height:25px; display:block;}
.mainMenu ul.centerMenu li a.home{ background:url(../../images/new/all/home.png) no-repeat left center;}
.mainMenu ul.centerMenu li a.active{ background:url(../../images/new/all/active.png) no-repeat left center;}
.mainMenu ul.centerMenu li a.live{ background:url(../../images/new/all/live.png) no-repeat left center;}
.mainMenu ul.centerMenu li a.writings{ background:url(../../images/new/all/writings.png) no-repeat left center;}
.mainMenu ul.centerMenu li a:hover{ color:#26bec9; transition:all 0.4s;}

.mainMenu .Submenu{ position: absolute; z-index:3; right:0; top:9px;}
.mainMenu .Submenu a{ text-decoration:none; color:#FFF; display:inline-table; font:13px Arial, "微軟正黑體"; border:1px solid #656d71; transition:all 0.4s; padding:6px 18px; border-radius:3px; vertical-align:top;}
.mainMenu .Submenu a:hover{ color:#26bec9; border:1px solid #26bec9; transition:all 0.4s;}
.mainMenu .Submenu a.language{ border:0; cursor:pointer; background:url(../../images/new/all/language.png) left top; width:108px; height:32px; padding:0; margin-bottom: 9px;}
.mainMenu .Submenu a.language:hover{ border:0; background:url(../../images/new/all/language.png) left bottom;}

/*語系選單*/
.mainMenu .Submenu ul.navigation{display: inline-table; vertical-align:top;}
.mainMenu .Submenu ul.navigation li {
	position: relative;
	float: left;
	line-height: normal;
}
.mainMenu .Submenu ul.navigation ul{
	display: none;
	float: left;
	position: absolute;			
	left: 0;	
	margin: 0;
}
.mainMenu .Submenu ul.navigation li:hover > ul{ display: block;}			
.mainMenu .Submenu ul.navigation ul li:last-child { border-bottom: none;}
.mainMenu .Submenu ul.navigation ul a {
	width: 108px;
	color: #FFF;
	box-sizing:border-box;		
	background: url(../../images/new/all/mainMenu.png);
	border:0;
	border-bottom:1px solid #FFF;
	border-radius:0;
	text-align:center;	
	transition:none;	
}
.mainMenu .Submenu ul.navigation ul a:hover { background: #26bec9;}

/*搜尋BAR*/
.searchBar{ background:url(../../images/new/all/searchBar.png) repeat left top; text-align: center; padding: 5px 0; display:block;}

.searchBar ul li{ display: inline-table; font-size:15px; vertical-align:top;}
.searchBar ul li select{ border:1px solid #26bec9; font-size:15px; height:35px; background:#FFF;}
.searchKeyword{ border:1px solid #26bec9; font-size:15px; height:35px; padding: 5px 5px 5px 40px; box-sizing: border-box; background:url(../../images/new/all/searchKeyword.png) no-repeat left center #FFF; width:150px;}
.searchBar li.submit a{ font-weight:900; color:#FFF; text-decoration:none; background:#26bec9; border-radius:4px; display:table; height:35px; line-height:35px; padding:0 10px; transition:all 0.4s; box-sizing: border-box;}
.searchBar li.submit a:hover{ background:#ff5454; transition:all 0.4s;}
li.test{ position:relative;}
.searchBar .people{ border:1px solid #26bec9; font-size:15px; height:35px; line-height:35px; background: url(../../images/new/all/select.png) no-repeat right center #FFF; padding:0 40px 0 5px; box-sizing: border-box;}
.searchBar .peopleDiv{border:1px solid #26bec9; position:absolute; z-index:1; text-align:left; background:#FFF; padding:5px; min-width:190px; margin-top: 2px; display:none;}
.searchBar .peopleDiv .iten{ height:37px; line-height:37px; margin-bottom:2px;}
.searchBar .peopleDiv .iten p{ display:inline-table; height:35px; line-height:35px; margin: 0 10px 0 5px;}
.searchBar .peopleDiv .iten div{ display:inline-table; height:35px; line-height:35px; width:35px; border:1px solid #CCC; text-align:center;}
.searchBar .peopleDiv .iten a{ display:inline-table; height:35px; line-height:35px; width:35px; background:#999; text-align:center; color:#FFF; text-decoration:none; margin:0 2px; border:1px solid #999; transition:all 0.4s;}
.searchBar .peopleDiv .iten a:hover{ background:#ff5454; border:1px solid #ff5454; transition:all 0.4s;}


@media screen and (max-width: 1200px){
  .searchBar ul{ width:100%; padding-left:184px; box-sizing: border-box;}
}

@media screen and (max-width: 1100px){
  .mainMenu ul{ float:left;}
  .mainMenu .Submenu ul.navigation{ float:none;}
}


@media screen and (max-width: 1090px){
	/*搜尋BAR*/
	.searchBar{ text-align:left;}
	.searchBar ul li{ width:24%; padding:2px; box-sizing:border-box;}
	.searchBar ul li select{ width:100%;}
	.searchBar .people{ width:100%;}
	.searchKeyword{ width:100%;}
}

@media screen and (max-width: 1024px){
  #mode{ width:20px;}/*很重要_不可刪除_此DIV為JS判別讀取PC或是MOBILE CSS的依據_此DIV放置在header.html*/
  
  .mainMenu{ position:fixed; z-index:2; right:-245px; height:100%; width:245px; overflow-x:hidden; overflow-y:auto; box-sizing: border-box;}
  
  .mainMenu ul.centerMenu{ float:none; text-align:left;box-sizing:border-box;}
  .mainMenu ul.centerMenu li{ display:block; margin:0; border-bottom:1px solid #414141; overflow: hidden;}
  .mainMenu ul.centerMenu li a{ padding: 13px 10px 13px 41px; display: block; height:auto; background-position:9px 9px !important;}
  .mainMenu ul.centerMenu li a:hover{ color:#FFF; transition:all 0.4s;}
  .mainMenu ul.centerMenu li a.home:hover{ background:url(../../images/new/all/home.png) no-repeat #26bec9;}
  .mainMenu ul.centerMenu li a.active:hover{ background:url(../../images/new/all/active.png) no-repeat #26bec9;}
  .mainMenu ul.centerMenu li a.live:hover{ background:url(../../images/new/all/live.png) no-repeat #26bec9;}
  .mainMenu ul.centerMenu li a.writings:hover{ background:url(../../images/new/all/writings.png) no-repeat #26bec9;}
  
  .mainMenu .Submenu{ position:relative; z-index:1; padding: 0px 10px; overflow:hidden; top: 0; margin:10px 0;}
  .mainMenu .Submenu a{ width:100%; box-sizing:border-box; float:left; margin:2px 0; text-align:center; padding: 13px 18px;}
  .mainMenu .Submenu a.language{ margin:10px 0 0 0; width: 84px;}
  .mainMenu .Submenu a.language:hover{ background-position: left top}
  .mainMenu .Submenu ul.navigation ul{ display:block; position:relative;}
  .mainMenu .Submenu ul.navigation ul a{ width:50px; height:33px; padding:0; border:0; text-indent:-9999px; margin:1px; transition:all 0.4s;}
  .mainMenu .Submenu ul.navigation ul a.tw{ background:url(../../images/new/all/flag_taiwan.png) left top;}
  .mainMenu .Submenu ul.navigation ul a.tw:hover{ background:url(../../images/new/all/flag_taiwan.png) left bottom;}
  .mainMenu .Submenu ul.navigation ul a.en{ background:url(../../images/new/all/flag_america.png) left top;}
  .mainMenu .Submenu ul.navigation ul a.en:hover{ background:url(../../images/new/all/flag_america.png) left bottom;}
  .mainMenu .Submenu ul.navigation ul a.jp{ background:url(../../images/new/all/flag_japan.png) left top;}
  .mainMenu .Submenu ul.navigation ul a.jp:hover{ background:url(../../images/new/all/flag_japan.png) left bottom;}
  .mainMenu .Submenu ul.navigation ul a.cn{ background:url(../../images/new/all/flag_china.png) left top;}
  .mainMenu .Submenu ul.navigation ul a.cn:hover{ background:url(../../images/new/all/flag_china.png) left bottom;}
  
  /*搜尋BAR*/
  .searchBar{ position:absolute; z-index:1; top:50px; display:none;}

}


@media screen and (max-width: 700px){
	.logo{background:url(../../images/new/all/logoSm.png) no-repeat; width:59px; height:50px; margin-left:0;}
	.searchBar ul{ padding:5px;}
}

@media screen and (max-width: 600px){
	.searchBar ul{ font-size:0;}
	.searchBar ul li{ width:50%;}
	.searchBar ul li.submit{ width:100%;}
	.searchBar li.submit a{ width:100%; display:block; text-align:center; background:#26be8b;}
	.searchBar ul li.dateSearch{ width:100%;}
}