/* ================================================================== */
/* === Table Responsive styles ====================================== */
/* ================================================================== */


/* TABLE [DESKTOP] 直式 */
.table_mo{display: none;}
.tableStraight{ border-radius: 10px 10px 0 0; font-size: 15px; overflow: hidden; overflow: visible \9; /* for ie 9*/}
.tableStraight a {color: #000; }
.tableStraight table{width: 100%; border-collapse: collapse;}
.tableStraight table th{ background-color: #006290;	height: 44px; color: #fff;}
.tableStraight tr:nth-of-type(1) { background-color: #006290;}
.tableStraight td{ border-top: 3px solid #fff; border-right: 3px solid #fff; vertical-align: middle; height: 44px;}
.tableStraight td:nth-of-type(odd){background-color: #efefef;}
.tableStraight td:nth-of-type(even){background-color: #f9f9f9;}
.tableStraight tr td:last-child{border-right: 0;}
.left15{padding-left:15px; }
.left34 {padding-left: 34px;}
.left55 {padding-left: 55px;}

/* TABLE 限店優惠 [DESKTOP] 直式 */
.tableOffersCont { overflow: hidden; overflow: visible \9; /* for ie 9*/ }
.tableOffersCont table{width: 100%; border-collapse: collapse;}
.tableOffersCont table td:nth-of-type(1), .tableOffersCont table td:nth-of-type(3) { width: 30%; }
.tableOffersCont table td:nth-of-type(2) { width: 35%;}

/** -- 會員專區-訂購記錄 -- **/
.order_history_table table a{ color: #006290; text-decoration: underline;}
.order_history_table table a:hover{	color: #e31736; text-decoration: none;}

/** -- 會員專區-紅利優惠劵 -- **/
.bonus_table .tblbr {display: none;}

/* TABLE [DESKTOP] 等比利縮放*/
.tableRatio{ border-radius: 10px 10px 0 0; font-size: 15px; overflow: hidden;}
.tableRatio table{width: 100%; border-collapse: collapse;}
.tableRatio table th{ background-color: #006290; height: 44px; color: #fff;}
.tableRatio tr:nth-of-type(1) { background-color: #006290;}
.tableRatio td{ border-top: 3px solid #fff; border-right: 3px solid #fff; vertical-align: middle; height: 44px;}
.tableRatio td:nth-of-type(odd){background-color: #efefef;}
.tableRatio td:nth-of-type(even){background-color: #f9f9f9;}
.tableRatio tr td:last-child{border-right: 0; padding-left: 5px;}
.orderinfo_table{ width: 100%;}
.orderinfo_table ul{ margin: 0; padding: 0;}
.orderinfo_table ul li{	list-style: none; border: none; padding: 0; margin: 0 0 0 5px; list-style-image: url();}
.orderinfo_table ul li:before{
	content: '';
	vertical-align: middle;
    display: inline-block;
    padding-right: 5px;
    height: 6px;
    width: 6px;
    background-image: url(../images/shop-images/yellowsq.svg);
    background-repeat: no-repeat;
}
.notviewtable{display:none;}

/* -- 人才招募 joinus resume -- */
.basic_form tr:nth-of-type(13)>td:nth-of-type(2){ vertical-align:middle;}
.tableVertical{ border-radius: 10px 10px 0 0; font-size: 15px; overflow: hidden; overflow: visible \9; /* for ie 9*/}
.tableVertical a {color: #000; }
.tableVertical table{width: 100%; border-collapse: collapse;}
.tableVertical table th{ background-color: #006290;	height: 44px; color: #fff;}
.tableVertical thead tr:nth-of-type(1) td:nth-of-type(1){ background-color: #028AC2;}
.tableVertical td{ border-top: 3px solid #fff; border-right: 3px solid #fff; vertical-align: middle; height: 44px;}
.tableVertical td:nth-of-type(odd){background-color: #efefef;}
.tableVertical td:nth-of-type(even){background-color: #f9f9f9;}
.tableVertical tr td:last-child{border-right: 0;}
.exp_title{ color:#ffffff; font-size:20px; font-weight: bold; }
.degree_table{padding-top:20px;}
.Exp_table{padding-top:20px;}

/* TABLE [MOBILE] 直式 */
@media (max-width: 1000px){
	.table_mo{ display: inline; margin-left: 5px;}
	.tableStraight{ border-radius: 10px; }
	.tableStraight table, .tableStraight thead, .tableStraight tbody, .tableStraight th, .tableStraight td, .tableStraight tr { display: block; float: left \9; /* for ie 9*/ width: 100% \9; /* for ie 9*/}
	.tableStraight thead tr { position: absolute; top: -9999px; left: -9999px;}
	.tableStraight table tr td { border: none; position: relative; height: auto; padding: 10px 0 14px; vertical-align: middle;}

	/* -- MOBILE TABLE 單欄 -- */
	.tblOneColumn table tr td { padding: 10px 0 14px; text-align: center; }
	/* -- MOBILE TABLE 雙欄 -- */
	.tblTwoColumn table tr td { padding: 10px 0 14px 50%; text-align: left; }
	.tblThreeColumn table tr td { padding: 10px 0 14px 50%; text-align: left; }
	.tableStraight tr { border-radius: 10px; border: 1px solid #ccc; margin-bottom: 20px; overflow: hidden; }
	/* -- MOBILE TABLE 雙欄的第一列內容置中 -- */
	.tblTwoColumn table tr .tbl1stRowCtr { padding: 10px 0 14px; text-align: center; }
	.tblThreeColumn table tr .tbl1stRowCtr { padding: 10px 0 14px; text-align: center; }
	.tableStraight tr:nth-of-type(1){background-color: rgba(255, 0, 0, 0);}
	.tableStraight td:before { 	position: absolute; left: 0; width: 38%; width: 30% \9; /* for ie 9*/ padding-right: 10px; white-space: nowrap; text-align: right;}

	
/* 0623整段拿掉 */
	/* -- 會員專區-訂購記錄 -- */
	/*.order_history_table > .tableStraight tbody td:nth-of-type(5), .order_history_table > .tableStraight tbody td:nth-of-type(6), .order_history_table > .tableStraight tbody td:nth-of-type(7) { position: absolute; top: -9999px; left: -9999px;}*/
/* 0623整段拿掉 END */
	
	/* -- 會員專區-常用地址管理 -- */
	.add_table .tableStraight td:nth-of-type(2n+1){background-color: #f9f9f9;}
	.add_table .tableStraight td:nth-of-type(2n+2){background-color: #efefef;}
	.add_table .tableStraight td:nth-of-type(1){display: none;}
	/* -- 會員專區-常用門市管理 -- */
	.store_table .tableStraight td:nth-of-type(2n+1){background-color: #f9f9f9;}
	.store_table .tableStraight td:nth-of-type(2n+2){background-color: #efefef;}
	.store_table .tableStraight td:nth-of-type(1){display: none;}
	/* -- 紅利|優惠劵 -- */
	.bonus_table > .tblTwoColumn td:nth-of-type(2):before { content: "獲得日期"; }
	.bonus_table > .tblTwoColumn td:nth-of-type(3):before { content: "使用日期"; }
	.bonus_table > .tblTwoColumn td:nth-of-type(4):before { content: "獲得紅利"; }
	/* -- 兌換歷史 -- */
	.bonus_history_table > .tblTwoColumn td:nth-of-type(1):before { content: "點數 | 優惠券"; }
	.bonus_history_table > .tblTwoColumn td:nth-of-type(2):before { content: "獲得日期"; }
	.bonus_history_table > .tblTwoColumn td:nth-of-type(3):before { content: "使用日期"; }
	.bonus_history_table > .tblTwoColumn td:nth-of-type(4):before { content: "使用訂單"; }

/*--0623 新增--*/
	/* -- 訂購紀錄 -- */
	.order_history_table > .tblTwoColumn td:nth-of-type(1):before { content: "訂單編號"; }
	.order_history_table > .tblTwoColumn td:nth-of-type(2):before { content: "訂購時間"; }
	.order_history_table > .tblTwoColumn td:nth-of-type(3):before { content: "訂單狀態"; }
	.order_history_table > .tblTwoColumn td:nth-of-type(4):before { content: "訂購金額"; }
	.order_history_table > .tblTwoColumn td:nth-of-type(5):before { content: "付款方式"; }
	.order_history_table > .tblTwoColumn td:nth-of-type(6):before { content: "訂單資訊"; }
	.order_history_table > .tblTwoColumn td:nth-of-type(7):before { content: "快速訂購"; }	
		
	.order_history_table > .tblThreeColumn td:nth-of-type(1):before { content: "訂單編號"; }
	.order_history_table > .tblThreeColumn td:nth-of-type(2):before { content: "訂購時間"; }
	.order_history_table > .tblThreeColumn td:nth-of-type(3):before { content: "訂購金額"; }
	.order_history_table > .tblThreeColumn td:nth-of-type(4):before { content: "付款方式"; }
	.order_history_table > .tblThreeColumn td:nth-of-type(5):before { content: "訂單資訊"; }
	.order_history_table > .tblThreeColumn td:nth-of-type(6):before { content: "快速訂購"; }
	
	/* -- 人才招募 joinus -- */
	.joinus_table > .tblTwoColumn td:nth-of-type(1):before { content: "職務種類"; }
	.joinus_table > .tblTwoColumn td:nth-of-type(2):before { content: "日期"; }
	.joinus_table > .tblTwoColumn td:nth-of-type(3):before { content: "職務名稱"; }
	.joinus_table > .tblTwoColumn td:nth-of-type(4):before { content: "詳細內容"; }
	.joinus_table > .tblTwoColumn td:nth-of-type(5):before { content: "線上應徵"; }
	
	/* -- 人才招募 joinus detail-- */
	/* -- 人才招募 joinus resume -- */

	.basic_form td:nth-of-type(1){ display: none;}
	.basic_form td:nth-of-type(2):before { display: block; padding-bottom:5px; padding-top:15px;}
	.basic_form tr:nth-of-type(13)>td:nth-of-type(2){ vertical-align:top;}
	.basic_form tr:nth-of-type(1)>td:nth-of-type(2):before { content: "姓名：";}
	.basic_form tr:nth-of-type(2)>td:nth-of-type(2):before { content: "身份證字號："; }
	.basic_form tr:nth-of-type(3)>td:nth-of-type(2):before { content: "出生日期："; }
	.basic_form tr:nth-of-type(4)>td:nth-of-type(2):before { content: "婚姻狀況：";}
	.basic_form tr:nth-of-type(5)>td:nth-of-type(2):before { content: "戶藉地址：";}
	.basic_form tr:nth-of-type(7)>td:nth-of-type(2):before { content: "現居地址：";}
	.basic_form tr:nth-of-type(9)>td:nth-of-type(2):before { content: "聯絡電話：";}
	.basic_form tr:nth-of-type(10)>td:nth-of-type(2):before { content: "手機號碼：";}
	.basic_form tr:nth-of-type(11)>td:nth-of-type(2):before { content: "電子郵件：";}
	.basic_form tr:nth-of-type(12)>td:nth-of-type(2):before { content: "目前身份：";}
	.basic_form tr:nth-of-type(13)>td:nth-of-type(2):before { content: "有無足以影響工作之疾病/肢體傷害：";}
	.basic_form tr:nth-of-type(14)>td:nth-of-type(2):before { content: "兵役狀況：";}
	
	.edu_form td:nth-of-type(1){ display: none;}
	.edu_form td:nth-of-type(2):before { display: block; padding-bottom:5px; padding-top:15px;}
	.edu_form tr:nth-of-type(1)>td:nth-of-type(2):before { content: "學歷：";}
	
	.work_form td:nth-of-type(1){ display: none;}
	.work_form td:nth-of-type(2):before { display: block; padding-bottom:5px; padding-top:15px;}
	.work_form tr:nth-of-type(1)>td:nth-of-type(2):before { content: "工作經歷：";}
	
	.car_form td:nth-of-type(1){ display: none;}
	.car_form td:nth-of-type(2):before { display: block; padding-bottom:5px; padding-top:15px;}
	.car_form tr:nth-of-type(1)>td:nth-of-type(2):before { content: "駕照種類：";}
	.car_form tr:nth-of-type(2)>td:nth-of-type(2):before { content: "其它證照：";}
	
	.tableVertical{ border-radius: 10px; }
	.tableVertical table, .tableVertical thead, .tableVertical tbody, .tableVertical th, .tableVertical td, .tableVertical tr { display: block; float: left \9; /* for ie 9*/ width: 100% \9; /* for ie 9*/}
	.tableVertical thead tr:nth-of-type(2) { position: absolute; top: -9999px; left: -9999px;}
	.tableVertical table tr td { border: none; position: relative; height: auto; padding: 10px 0 14px 40%; vertical-align: middle;}
	.tableVertical tr:nth-of-type(1){background-color: rgba(255, 0, 0, 0);}
	.tableVertical td:before { 	position: absolute; left: 0; width: 38%; width: 30% \9; /* for ie 9*/ padding-right: 10px; white-space: nowrap; text-align: right;}
	
	.degree_table tbody tr:nth-of-type(1)>td:nth-of-type(1):before { content: "學校名稱：";}
	.degree_table tr:nth-of-type(1)>td:nth-of-type(2):before { content: "科系：";}
	.degree_table tr:nth-of-type(1)>td:nth-of-type(3):before { content: "地點：";}
	.degree_table tr:nth-of-type(1)>td:nth-of-type(4):before { content: "就學期間：";}
	.degree_table tr:nth-of-type(1)>td:nth-of-type(5):before { content: "修業狀況：";}
	
	.Exp_table tbody td:nth-of-type(1):before { content: "公司名稱：";}
	.Exp_table tbody tr:nth-of-type(n+2) td:nth-of-type(1){ border-top:10px solid #ffffff;}
	.Exp_table td:nth-of-type(2):before { content: "擔任職務：";}
	.Exp_table td:nth-of-type(3):before { content: "任職期間：";}
	.Exp_table td:nth-of-type(4):before { content: "薪資：";}
	.Exp_table td:nth-of-type(5):before { content: "離職原因：";}
	
	.Exp_table tr:nth-of-type(odd) td{background-color: #efefef;}
    .Exp_table tr:nth-of-type(even) td{background-color: #f9f9f9;}
	

}

@media (max-width: 950px){
/* TABLE 限店優惠 [DESKTOP] 直式 */
	.tableOffersCont table, .tableOffersCont thead, .tableOffersCont tbody, .tableOffersCont th, .tableOffersCont td, .tableOffersCont tr { display: block; float: left \9; /* for ie 9*/ width: 100% \9; /* for ie 9*/}
	.tableOffersCont table td:nth-of-type(1), .tableOffersCont table td:nth-of-type(2), .tableOffersCont table td:nth-of-type(3) { width: 100%; }

}

/*--0623 新增 END--*/

@media (max-width: 640px){
	.notviewmobile{display:none;}
	.tableRatio td:nth-of-type(odd){background-color: #efefef;}
	.tableRatio td:nth-of-type(even){background-color: #f9f9f9;}
	.notviewtable{display:block;}
	.blue_table .tableRatio{font-size: 12px;}
	.orderinfo_table .tableRatio{font-size: 12px;}
	.fontsize18{font-size:14px;}
	.fontsize15{font-size:14px;}
	.fontsize26{font-size:20px;}
	.tableRatio tr td:last-child{padding-left: 0px;}
}

@media (max-width: 500px){
	/* -- 會員專區-紅利兌換 -- */
	.bonus_table .tblbr {display: block;}
	.bonus_table .tableStraight .left15 {padding-left: 0px;}
}

@media (max-width: 480px){
	.tableRatio {border-radius: 5px 5px 0 0;}
	.orderinfo_table .tableRatio {font-size: 10px;}
	.blue_table .tableRatio{font-size: 10px;}
 	.left15{padding-left:5px; }
 	.left15_mobile{padding-left:5px; }
	
	/* -- 人才招募 joinus resume -- */
	.tableVertical table tr td { padding: 10px 0 14px 37%; }
	.tableVertical td:before {width: 33%;}
	
}