@charset "utf-8";
/***************************************
    copyright by MakeWeb.com.tw 
***************************************/

.tabs_simple_blue {
	overflow: hidden;
	/*width:722px;*/
	/*border:1px solid #00F;*/
}

.tabs_simple_blue .subject{
	padding:14px 0;
	/*border:1px solid #00F;/* 顯示外框(測試用) */
}

.tab_header_box{
	background:url(/mw/cufiles/images/web/layout/pd_tab_bg.png) 0px 0px no-repeat;
	background-size: 100% 86px;
}
/* root element for tabs  */
.tabs_simple_blue ul.tabs { 
	list-style:none; 
	display: table;
	margin:0 auto;
	padding: 20px;
	/*width: 1100px;*/
	height:46px;
	/*border-bottom:1px solid #54C3F1;*/
}

/* single tab */
.tabs_simple_blue ul.tabs li {
	overflow: hidden;
	float:left;	 
	width: 100px;
	padding:0;
	margin: 8px 30px;
	text-indent:0;
	font-size: 2rem;
	text-align:center;
	text-decoration:none;
	list-style-image:none !important;
}

/* link inside the tab. uses a background image */
.tabs_simple_blue ul.tabs a { 
	display:block;
	padding:0px 0px;
	/*margin:0 2px;	*/
	/*line-height:30px;*/
}

.tabs_simple_blue ul.tabs a:active {
	color:#272727;
	outline:none;	
}

/* when mouse enters the tab move the background image */
.tabs_simple_blue ul.tabs a:hover {
	color:#272727;
}

/* active tab uses a class name "current". it's highlight is also done by moving the background image. */
.tabs_simple_blue  ul.tabs .current, .tabs_simple_blue  ul.tabs .current:hover, .tabs_simple_blue  ul.tabs li.current a {
	background-position: -652px -62px;		
	cursor:default; 
	color: #FF0031;
	/*font-weight: bold;*/
}

/* Different widths for tabs: use a class name: w1, w2, w3 or w2 */


/* width 0 */
.tabs_simple_blue ul.tabs .w0 {  }
.tabs_simple_blue ul.tabs .w0:hover { 
	border-bottom:4px solid #272727; 
}
.tabs_simple_blue ul.tabs .w0.current { 
	color: #FF0031;
	border-bottom:4px solid #FF0031; 
}


/* initially all panes are hidden */ 
/*.panes .pane {
	display:none;
}*/

/* tab pane styling */
.tabs_simple_blue .panes {
	display:block;
	/*width:700px;*/
	padding:30px 10px;
	background-color:#fff;
}

/* tab pane 的內容 styling */
.tabs_simple_blue .panes .content {
	color:#999;
	line-height:20px;
	margin:10px 0;
}



/*-------------------------------------------- 
	Media Queries 
---------------------------------------------*/
/* Portrait and Landscape */
/*@media only screen and (min-device-width: 320px) and (max-device-width: 568px) and (-webkit-min-device-pixel-ratio: 2) {
}*/

/*iPad*/
@media screen and (max-width: 1023px) {
}


/*iPhoe*/
@media screen and (max-width: 767px) {
	
	.tabs_simple_blue ul.tabs li {
		width: auto;
		/*width: 100px;*/
		padding:0;
		margin: 8px 8px;
		/*margin: 8px 30px;*/
		font-size: 1.6rem;
	}
}