/**************************************************************
										Tab 選單
**************************************************************/
.tab-menu > ul {
	position: relative;
    text-align: center;
    opacity: 1;
    width: 100%;
	padding: 0px 40px;
    float: left;
    display: block;
}
.tab-menu > ul > li {/*次選單項目*/
    display: block;
    position: relative;
    width: 16.667%;
    float: left;
    padding: 5px 0;
}
.tab-menu > ul > li > a {
	display: block!important;
    padding: 0!important;
}

/*次選單文字*/
.tab-menu > ul > li > a b {
	color: #000;
    font-size: 15px;
    line-height: 50px;
    width: calc(100% - 45px);
    float: left;
    position: relative;
	z-index: 1;
	white-space: nowrap;
}

/****** 平行四邊形 - 藍邊 ******/
.tab-menu > ul > li > a b:before {
	content: '';
    position: absolute;
    top: 0;
    left: 0;
    background: #e5ecf4;
    border: solid 1px #00408e;
	transform: skew(-15deg); 
    width: 155px;
    height: 50px;
	-o-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
	z-index: -1;
}

/*平行四邊形 - 黃邊 ( 第一行 )*/
.tab-menu > ul.pattern-1 > li:nth-of-type(2n-1) > a b:before{border: solid 1px #f5a900;}

/*平行四邊形 - 黃邊 ( 第二行 )*/
.tab-menu > ul.pattern-2 > li:nth-of-type(2n) > a b:before{border: solid 1px #f5a900;}

/*最左*/
.tab-menu > ul > li:nth-of-type(6n-5) > a b:before {transform: none;}


/****** 滑過 & Active ******/

/*滑過文字*/
.tab-menu > ul > li > a b:hover,
.tab-menu > ul > li.active > a b {color: #fff;}

/*滑過特效 - 藍底*/
.tab-menu > ul > li > a:hover b:before,
.tab-menu > ul > li.active > a b:before {background: #00408e;}

/*滑過特效 - 黃底 ( 第一行 )*/
.tab-menu > ul.pattern-1 > li:nth-of-type(2n-1) > a:hover b:before,
.tab-menu > ul.pattern-1 > li.active:nth-of-type(2n-1) > a b:before {background: #f5a900;}

/*滑過特效 - 黃底 ( 第二行 )*/
.tab-menu > ul.pattern-2 > li:nth-of-type(2n) > a:hover b:before,
.tab-menu > ul.pattern-2 > li.active:nth-of-type(2n) > a b:before {background: #f5a900;}


/************ 小箭頭 - 藍 ************/
.tab-menu > ul > li > a b:after {
	position: absolute;
    content: "▽";
    font-size: 24px;
    left: 100%;
    color: #00408e;
    background: #fff;
    border: solid 1px #00408e;
    width: 35px;
    height: 50px;
    transform: skew(-15deg);
}

/*小箭頭 - 黃 ( 第一行 )*/
.tab-menu > ul.pattern-1 > li:nth-of-type(2n-1) > a b:after{color: #f5a900; border: solid 1px #f5a900;}

/*小箭頭 - 黃 ( 第二行 )*/
.tab-menu > ul.pattern-2 > li:nth-of-type(2n) > a b:after{color: #f5a900; border: solid 1px #f5a900;}

/*小箭頭 - 最右*/
.tab-menu > ul > li:nth-of-type(6n) > a b:after {transform: none;}

.hidden {
  display: none;
}

/*------------------------------------------------------
Media Queries 
--------------------------------------------------------*/
@media (max-width:991px){
	.tab-menu > ul {padding: 0px 15px;}
	
	/*次選單項目*/
	.tab-menu > ul > li {width: 33%; padding: 5px;}
	
	/*次選單文字*/
	.tab-menu > ul > li > a b {width: 100%;}
	
	/*平行四邊形*/
	.tab-menu > ul > li > a b:before {width: 100%;}
	
	/*最左*/
	.tab-menu > ul > li:nth-of-type(6n-5) > a b:before {transform: skew(-15deg);}
	
	/*小箭頭 - 掰*/
	.tab-menu > ul > li > a b:after {display: none;}
}