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

div.header{ width:100%; max-width:1052px; margin:0 auto; background:#FFF; padding:20px 0;}
div.header a.logo{ background:url(../images/all/logo.png) no-repeat; display:block; width:309px; height:46px; float:left; text-indent:-9999px; position:absolute;}
div.header a.MenuBt{ background:url(../images/all/menuBt.png) no-repeat; display:block; width:50px; height:50px; position:fixed; z-index:3333; right:10px; display:none;}
div.header a.fb{ background:url(../images/all/fb.png) no-repeat center; width:20px; height:20px; display:block; float:right; margin:0 5px; text-indent:-9999px; border:2px solid #CCC; border-radius:1000px; padding:5px; transition: all 0.4s;}
div.header a.fb:hover{ background:url(../images/all/fb_hover.png) no-repeat center #283480; transition: all 0.4s; border:2px solid #283480;}
div.header a.google{ background:url(../images/all/google.png) no-repeat center; width:20px; height:20px; display:block; float:right; margin:0 5px; text-indent:-9999px; border:2px solid #CCC; border-radius:1000px; padding:5px;}
div.header a.google:hover{ background:url(../images/all/google_hover.png) no-repeat center #283480; transition: all 0.4s; border:2px solid #283480;}

div.header div.nav{ clear:both;}
div.header li.links{ min-height:20px;}
div.header div.nav li.menu{ clear:both; padding:40px 0 20px 0;}
div.header div.nav li.menu a{ color:#0091b0; font-size:15px; text-decoration:none; font-family:Arial,"微軟正黑體"; margin:0 15px; position: relative;}
div.header div.nav li.menu ul li.news_color a{
	color:#e60012 !important;}
div.header div.nav li.menu a span{ display:none;}

ul.navigation li { position: relative; float: left;}

/****************************************************** 選單 li 裡面連結之樣式 ******************************************************/
ul.navigation li a{ display: block;}

/* 特定在第一層 > 第二層或以後下拉部分之樣式 */
ul.navigation ul{
	display: none;
	float: left;
	position: absolute;			
	left: -12px;	
	margin: 0;
	z-index:33;
}
/* 當第一層選單被觸發時，指定第二層顯示 */
ul.navigation li.hover:hover > ul{ display: block;}
/*ul.navigation li.hover:hover > ul{display: block; }	*/
/* 第二層或以後選單 li 之樣式 */
ul.navigation ul a {
	width: 120px;
	padding: 10px 12px;			
	background: #FFF;
	color:#FFF;			
}
ul.navigation ul a:hover { background: #0091b0; color:#FFF !important;}
/****************************************************** 選單 li 裡面連結之樣式_END ******************************************************/

/*滑線CSS*/
div.header div.nav li.menu a:after{
  display: block;
  position: absolute;
  left: 0;
  top: -8px;
  width: 0;
  height: 1px;
  background-color: #0018a8;
  content: "";
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;}

div.header div.nav li.menu a:hover{ color:#0018a8; transition: all 0.4s;}
div.header div.nav li.menu a:hover:after{ width: 100%;}

ul.navigation ul li a:after{ height: 0 !important;}

/*滑線CSS_END*/

@media screen and (max-width: 900px){
    div.header{ padding:15px 0; position:fixed; z-index:3;}
	
	div.header div.nav{ width:300px; position:fixed; z-index:1; right:-300px; background: url(../images/all/menuBg.png) repeat-y; height:100%; padding-left:48px; box-sizing:border-box; top:0;}
	div.header div.nav ul{ overflow:auto; height:100%;}
	
	div.header a.logo{ margin-bottom:inherit; background:url(../images/all/logoSm.png) no-repeat left center; width:230px; height:50px; position:inherit;margin-left: 8px;}
	div.header a.MenuBt{ display:block;}
	
	div.header div.nav li.links{ float: inherit; margin-top:30px; width:90px; min-height:inherit;}
	ul.navigation li{width:100%;}
	ul.navigation ul{ float:none; position: relative; z-index:1; padding-top:0; left:0;}
	ul.navigation ul li{ background: #0091b0; overflow:hidden; border-top:1px solid #FFF;}
	ul.navigation ul li a{ width:100%; background:none;}
	ul.navigation ul li a:hover { background:none;}
	div.header div.nav li.menu{ padding:10px 0;}
	div.header div.nav li.menu a span{ display:block; margin-top:10px;}
	div.header div.nav li.menu li.ExpertSays ul li a{ color:#FFF;}
	div.header div.nav li.menu a{ display:block; margin:15px;}
	div.header div.nav li.menu a:after{
	  display: inherit;
	  position: inherit;
	  left: inherit;
	  top: inherit;
	  width: inherit;
	  height: inherit;
	  background-color: inherit;
	  content: inherit;
	  -webkit-transition: inherit;
	  -moz-transition: inherit;
	  -o-transition: inherit;
	  transition: inherit;}
	div.header div.nav li.menu a:hover:after{ width: inherit;}
	
}