@charset "utf-8";

.finput-list , .tbset{color:#595757; font-size:0.9em;}
.tbset thead td{ font-size:0.9em;} /*二級縮減*/

/*---------------------*/

.backendpage{}

/*---------------------*/

.backend-headline{ color:#000000; font-weight:600;margin:15px 0; }
.backend-headline .title{position:relative; padding-left:25px;}
.backend-headline .title:before{
	position:absolute;
	top:50%;
	left:0;
	width:16px;
	height:16px;
	margin-top:-8px;
	content:"";
	background:#333333 url(../images/backend-arrow.png) no-repeat center;
	background-size:12px 12px;
	/*border-radius:0 3px 3px 3px;*/
	
	/*background:linear-gradient(-45deg , #999999 , #999999 50% , #CCC 50% );
	background:-moz-linear-gradient(-45deg , #999999 , #999999 50% , #CCC 50% );
	background:-webkit-linear-gradient(-45deg , #999999 , #999999 50% , #CCC 50% );
	background:-o-linear-gradient(-45deg , #999999 , #999999 50% , #CCC 50% );
	background:-ms-linear-gradient(-45deg , #999999 , #999999 50% , #CCC 50% );*/
}
.backend-arrow3 .title:before{
	background:#333333 url(../images/backend-arrow3.png) no-repeat center;
	background-size:12px 12px;
}

.backend-headline .subtitle{ margin-left:5px; font-size:0.7em;}

/*---------------------*/

.backend-box{}

/*---------------------*/

.border-pd{border:1px solid #e5e5e5; padding:30px;}
.border-pd > .backend-headline{ margin-top:0px; margin-right:0px;}




/* <<=== cart 購物車 =====================================================================================>> */

/*購物流程*/
.shopping-process-wrap{margin:30px 0 60px 0; text-align:center;}
.shopping-process-list li{
	position:relative;
	display:inline-block;
	margin:0 10px;
	text-align:center;
	color:#cccccc;
}
.shopping-process-list .pic , .shopping-process-list .tilte-box{
	display:inline-block;
	vertical-align:middle;
	margin:0px 3px;
	text-align:left;
}
.shopping-process-list .pic{ width:30px;}
.shopping-process-list .pic img{ display:block; width:100%; height:auto;}
.shopping-process-list .tilte-box .title , .shopping-process-list .tilte-box .subtitle{
	display:block; 
	width:100px; 
	line-height:1.4;
}
.shopping-process-list .tilte-box .subtitle{ font-size:0.9em;}
.shopping-process-list li:before{
	position:absolute;
	top:50%;
	right:-10px;
	width:14px;
	height:14px;
	margin-top:-7px;
	content:"";
	background:url(../images/icon-step-arrow.png) no-repeat center;
	background-size:cover;
}
.shopping-process-list li:last-child:before{ display:none;}

.shopping-process-list li.active .tilte-box .title , .shopping-process-list li.active .tilte-box .subtitle{ 
	color:#7b0000;
}
.shopping-process-list li.active:before{ 
	background:url(../images/icon-step-arrow-hover.png) no-repeat center;
	background-size:cover;
}

/*---------------------*/

.cartpage-area{ max-width:960px; margin-left:auto; margin-right:auto;}

/*---------------------*/

/*付款方式*/
.payment-list{ font-size:0.9em;}
.payment-list li{ border-top:1px solid #e5e5e5;}
.payment-list li:last-child{ border-bottom:1px solid #e5e5e5;}

.payment-choose , .payment-title , .payment-txt { 
	display:inline-block; 
	vertical-align:middle; 
	padding:10px 0;
}
.payment-choose{ width:50px; text-align:center; background:#f4f4f4;}
.payment-title{ min-width:90px; padding:0 5px; border-right:1px solid #cccccc; }
.payment-txt { padding:0 10px;}

/*---------------------*/

.tb-cart tr{ border-bottom: 1px solid #e5e5e5;}

.tb-cart .td-pic{ width:80px;}
.tb-cart .cart-pic{ display:inline-block;}
.tb-cart .cart-pic{ 
	display:inline-block; 
	position: relative;
	width: 50px;
	height: 50px;
	overflow: hidden;
}
.tb-cart .cart-pic img {
	max-width: 100%;
	max-height: 100%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.tb-cart .td-name{ text-align:left;}

.tb-cart .td-num{ width:150px;}
.cart-qty-box:before, .cart-qty-box:after{ display:table; content:" " }
.cart-qty-box:after{ clear:both }
.cart-qty-box , .cart-refresh-btn{ display:inline-block; vertical-align:middle;}
.cart-qty-box .num-txt , .cart-qty-box .qtyminus{
	float:left;
	border:1px solid #cccccc;
	background:transparent;
	height:25px;
	text-align:center;
}
.cart-qty-box .num-txt{ 
	border-left-width:0px; 
	border-right-width:0px;
	padding:0 10px; 
	width:35px; 
	font-size:0.9em;
}
.cart-qty-box .qtyminus{ width:25px; cursor:pointer; color:#999}
.cart-qty-box .qtyminus:hover{ color:#000;}
.cart-refresh-btn{
	border:1px solid #cccccc;
	background:transparent;
	height:25px;
	padding:0 5px;
	cursor:pointer;
	color:#666666;
}
.cart-refresh-btn:hover{ border-color:#770000; background:#770000; color:#ffffff;}

.tb-cart .td-dollar{ width:80px;}

.tb-cart .td-price{ width:100px; text-align:right;}

.tb-cart .td-delete{ width: 50px;}
.delete-btn{display:inline-block; height:35px; width:35px;}
.delete-btn:before , .delete-btn:after{
	height: 3px;
	margin-top: 4px;
	margin-left: -7px;
	width: 15px;
}
.delete-btn:hover:before , .delete-btn:hover:after{background:#770000;}

/*---------------------*/

.total-area{ 
	position:relative; 
	font-size:0.9em; 
	text-align:right; 
	padding-right:55px;
	margin:10px 0;
 }
.total-list{ display:inline-block;}
.total-list li{ margin-bottom:5px;}
.total-list .price{ display:inline-block; width:100px;}
.total-list .redtxt{ color:red;}
.total-list .endtotal{ border-top:1px solid #cccccc; }
.total-list .endtotal .price{ font-size:1em; font-weight:600;}

.cart-axplain{ position:absolute; top:0; left:0; max-width:450px; text-align:left;}
.cart-axplain .title{ 
	display:inline-block; 
	background:#333; 
	color:#ffffff; 
	padding:1px 5px;
	line-height:1.4;
}



/* <<=== cart-confirm 購物車確認 ============================================================================>> */
/*.cart-cf-set .payment-title , .cart-cf-set .payment-txt { padding-top:15px; padding-bottom:15px;}*/
.cart-confirm-set.total-area{padding-right:5px;}
.cart-confirm-set .payment-title{ font-weight:600;}


/* <<=== checkout 填寫配送資料 ============================================================================>> */
.fm-checkout{ max-width:700px;}

.chk-area{ font-size:0.8em; color:#666; display:inline-block; margin-left:25px;}
.chk-area .chkbtn , .chk-area .lab{ color:#333; vertical-align:middle;}


/* <<=== login 登入  =====================================================================================>> */
.fm-login{ max-width:350px;}

.fm-login .finput { padding-left:55px;}

.login-help-wrap{ text-align:center;}
.help-box{
	display:inline-block; 
	margin:0 10px 20px 10px;
	text-align:center;
	vertical-align:middle;  
}
.help-box .help-btn{
	background:transparent;
	border:1px solid #666666;
	color:#666666;
	display:inline-block;
	font-size:0.9em;
	padding:0em 1em;
	width:120px;
}
.help-box .help-info{ color:#999999; display:block; font-size:0.7em; margin-top:1px;}
.help-box:hover .help-btn{ border-color:#b79678; color:#b79678; }


/* <<=== register 註冊 ===================================================================================>> */
.fm-register{ max-width:700px;}

.agree-area{text-align:center;}
.agree-area , .agree-area a{ /*color:#666666;*/}
.agree-area a{ font-weight:600; /*text-decoration:underline;*/}
.agree-area a:hover{ color:#810000;}

/*.register-rule iframe{ border:1px solid #cccccc; height:150px;}*/


/* <<=== forgot_password 修改密碼 =========================================================================>> */
.fm-forg-pwd{ max-width:400px; text-align:center;}


/* <<=== center 會員中心 ==================================================================================>> */
.center-list{width:60%; margin-left:auto; margin-right:auto;}
.center-list:before, .center-list:after{ display:table; content:" " }
.center-list:after{ clear:both }
.center-list li{ 
	float:left;
	margin:0px 0 20px 0; 
	padding:20px; 
	text-align:center;
	width:33.333333%; 
}
.center-item .pic{ background:#666666; margin:0px;}
.center-item:hover .pic{ background:#b79678;}
.center-item .title{ font-size:0.9em; }


/* <<=== order 訂單查詢 ===================================================================================>> */
.orderpage-area{ max-width:960px; margin-left:auto; margin-right:auto;}
.orderpage-box{ padding-top:15px; padding-bottom:5px;}

.order-time-search .fline{ display:inline-block; margin-right:30px;}

.order-note{ font-size:0.7em; margin:30px 0 5px 0; color:#666; }

.tb-order a{ color:#000000; font-weight:600;}
.tb-order a:hover{color:#810000;}
.tb-order{ font-size:0.9em;}
.tb-order tr{ border-bottom: 1px solid #e5e5e5;}
.tb-order thead td{ font-size:0.9em;}

.tb-coupon a{ color:#000000; font-weight:600;}
.tb-coupon a:hover{color:#810000;}
.tb-coupon{ font-size:0.9em;}
.tb-coupon tr{ border-bottom: 1px solid #e5e5e5;}
.tb-coupon thead td{ font-size:0.9em;}
/*---------------------*/

.fm-order-rpt{ max-width:350px; }

/*---------------------*/
.order-viewpage-area{max-width:960px; margin-left:auto; margin-right:auto;}
.order-ok-note{font-size:1em;color:#AD0506;margin:30px 0;}


/* <<=== revise 會員資料修改 ===============================================================================>> */
.fm-revise{ max-width:500px; }


/* <<=== change_password 修改密碼 =========================================================================>> */
.fm-change-pwd{ max-width:400px; }



.writetxt-tips{ color:#999; font-size:0.9em; }






/* <<====================================================================>> */
/* <<====================================================================>> */

@media (max-width:960px) {
	.border-pd{padding:15px;}
	
	/*---------------------*/
	
	.payment-title{ border-right-color: transparent;}
	.payment-txt { display:block; padding:5px 0 5px 60px;}
	
	.cart-confirm-set .payment-txt { padding-left:5px;}
	
	/*---------------------*/
	
	.cart-axplain{ position:relative; margin-top:20px; width:auto;}
	
	/*---------------------*/
	
	.agree-area{ text-align:center;}
}


@media (max-width:768px) {
	.shopping-process li .icon , .shopping-process li .tilte-box{display:inline-block;}
	.shopping-process li .tilte-box{width:100px; text-align:left;}
	
	.cart-process li:nth-child(3) , .cart-process li:nth-child(4) , 
	.cart-confirm-process li:nth-child(1) , .cart-confirm-process li:nth-child(4) ,
	.checkout-process li:nth-child(1) , .checkout-process li:nth-child(2){ 
		display:none;
	}
	
	.cart-process li:nth-child(2):before , 
	.cart-confirm-process li:nth-child(3):before , 
	.checkout-process li:nth-child(4):before{ 
		display:none;
	}
	
	/*---------------------*/
	
	.center-list{ width:90%;}
	
	
}


@media (max-width:640px) {
	.border-pd{border-color:transparent; padding:0px;}
	
	/*---------------------*/
	
	.tb-cart tr:nth-child(1){ border-top: 1px solid #e5e5e5;}
	
	.tb-cart .td-pic{ display:none;} /*購物車圖片欄位拿掉*/
	
	.tb-cart .td-num{ width:100px;}
	.tb-cart .cart-refresh-btn{display:inline-block; margin-top:10px; width:85px;}
	
	.tb-cart .td-price{ width:65px; text-align:center;}
	
	.total-area{ padding-right:5px;}
	
	/*---------------------*/
	
	.center-list{ width:100%;}
	.center-list li{ width:100%; padding:10px 0;}
	.center-item{ position:relative; text-align:left; border:1px solid #999;}	
	.center-item .pic { 
		position:absolute; 
		top:5px; 
		left:5px; 
		width:50px; 
		height:50px; 
		background:#666666;
	}
	.center-item .title{ line-height:60px; padding-left:65px;}
	.center-item .title a{ display:block; }
	
	
	/*================================================================================*/
	
	/*響應式表格*/
	/* Force table to not be like tables anymore */
	.res-tb , .res-tb thead , .res-tb tbody , .res-tb th , .res-tb td , .res-tb tr {display: block;}
	
	/* 隱藏 table headers (but not display: none;, for accessibility) */
	.res-tb thead tr {position: absolute; top: -9999px; left: -9999px;}
	
	.res-tb thead , .res-tb tr{border:0px solid transparent;}
	
	/*讓每列表格全寬100%*/
	.res-tb td{
		border:0px solid transparent;
		border: 1px solid #cccccc;
		border-bottom:0px solid transparent;
		position: relative;
		padding:7px 10px 7px 120px;
		text-align:left;
		width:100%;
	}
	
	.res-tb td:last-child{border-bottom:1px solid #E6E6E6;}
	
	/*每個項目*/
	.res-tb tr{margin-bottom:15px;}
	
	.res-tb tr:nth-of-type(even) td{background:rgba(209,209,209, 0.2); }
	
	/*螢幕縮小後的標題*/
	.res-tb td:after {
		position: absolute;
		top:50%;
		left: 6px;
		font-size:1em;
		line-height:2;
		margin-top:-16px;
		vertical-align:middle;
		white-space: nowrap;
		width: 80px;
	}
	
	/*訂單查詢*/
	.tb-order td:nth-of-type(1):after { content: "訂單編號"; }
	.tb-order td:nth-of-type(2):after { content: "訂購日期"; }
	.tb-order td:nth-of-type(3):after { content: "付款方式"; }
	.tb-order td:nth-of-type(4):after { content: "出貨方式"; }
	.tb-order td:nth-of-type(5):after { content: "訂單總額"; }
	.tb-order td:nth-of-type(6):after { content: "處理進度"; }
	.tb-order td:nth-of-type(7):after { content: "付款回報"; }
	
	
	/*優惠卷*/
	.tb-coupon td:nth-of-type(1):after { content: "優惠卷"; }
	.tb-coupon td:nth-of-type(2):after { content: "截止日期"; }
	.tb-coupon td:nth-of-type(3):after { content: "優惠類型"; }
	.tb-coupon td:nth-of-type(4):after { content: "結帳條件"; }
	/*================================================================================*/
	/*================================================================================*/
	
	
}


@media (max-width:480px) {
	
	.backend-headline .subtitle{ display:none;}
	
	.shopping-process-wrap{ display:none; }
	
	.tb-cart .td-dollar{display:none;} /*購物車單價欄位拿掉*/
	
	.chk-area{ display:block; margin-left:0px; margin-top:10px;}
}
