/********************************************** 重要訊息 pop start *******************************************************/
.notice{
	display:none;
}
.overlayModal .overlayCT{
	max-width: 500px;
}
.overlayModal h4{
	font-size: 20px;
}
.overlayModal ul{
	list-style: disc;
	text-align: left;
	margin-top:1.5em;
	padding-left:1.5em;
}
.overlayModal .formBtn.light{
	background: #999;
	color:#FFF;
}
.overlayModal .formBtn.light:hover{
	background: #666;
}
/********************************************** 重要訊息 pop end *******************************************************/

.cartStep,
.cartCT,
.resultCT,
.total,
.stepBtn{
	margin:0 2.5%;
}


/********************************************** 步驟流程 start *******************************************************/
.mainContainer > section.cartStep {
	margin-top:10px;
}
.cartStep ul{
	text-align:center;
	font-size:15px;
	font-weight:bold;
	color:#999;
}
.cartStep ul li{
	position:relative;
	display:inline-block;
	margin-right:25px;
}
.cartStep ul li{
	padding-right:60px;
}
.cartStep ul li:before,
.cartStep ul li:after{
	position:absolute;
	content:"";
	display:block;
	right:0;
	width:16px;
	height:2px;
	background:#999;
}
.cartStep ul li:before{
	top:24px;
	transform-origin:left top;
	transform:rotate(45deg);
}
.cartStep ul li:after{
	top:45px;
	transform-origin:left bottom;
	transform:rotate(-45deg);
}
.cartStep ul li:last-child{
	margin-right:0;
	padding-right:0;
}
.cartStep ul li:last-child:before,
.cartStep ul li:last-child:after{
	display:none;
}
.cartStep ul li em{
	font-size:48px;
	font-style:normal;
	font-family:Arial;
	display:inline-block;
	margin-right:10px;
	color:#CCC;
}
.cartStep ul li span{
	position:relative;
	display:inline-block;
	top:-4px;
}
.cartStep ul li.now em{
	color:#999;
}
.cartStep ul li.now span{
	color:#333;
}
/********************************************** 步驟流程 end *******************************************************/


/********************************************** 步驟內容 start *******************************************************/
.cartCT{
}

/********************** Step1 之 頁籤按鈕 start *************************/
.cartCT .tabBtnBlock ul{
	text-align:left;
}
.cartCT .tabBtnBlock ul li a{
	padding-top:0.6em;
	padding-bottom:0.9em;
	text-align:center;
}
.cartCT .tabBtnBlock ul li a:before{
	content:"";
	display:inline-block;
	width:19px;
	height:17px;
	background:url(../images/cartTableIcon.svg) no-repeat;
	margin-right:8px;
	vertical-align:bottom;
	transition:background-position 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
.cartCT .tabBtnBlock ul li:nth-child(1) a:before{
	background-position:0 top;
}
.cartCT .tabBtnBlock ul li:nth-child(1) a:hover:before,
.cartCT .tabBtnBlock ul li.now:nth-child(1) a:before{
	background-position:0 bottom;
}
.cartCT .tabBtnBlock ul li:nth-child(2) a:before{
	background-position:-19px top;
}
.cartCT .tabBtnBlock ul li:nth-child(2) a:hover:before,
.cartCT .tabBtnBlock ul li.now:nth-child(2) a:before{
	background-position:-19px bottom;
}
/********************** Step1 之 頁籤按鈕 end *************************/

/********************** 商品內容表格 start *************************/
.cartCT .table{
	margin-top:10px;
}
.cartCT .table th:first-child{
	width:110px;
}
.cartCT .table th:last-child{
	text-align:right;
}

.cartCT .table td{
	padding:0;
}
.cartCT .table td:nth-child(2){
	max-width:250px;
}
.table td .tdCT{
	padding:20px;
	line-height:1.5em;
}
.table td.thumbnail a{
	display:block;
	border:1px solid #FFF;
	padding:1px;
}
.table td.thumbnail img{
	display:block;
	width:70px;
	height:70px;
}
.table td .name,
.table td .price{
	display:block;
	color:#333;
}
.table td a:hover .name{
	text-decoration:underline;
}
.table td .price{
	font-weight:normal;
}
.table td .price.promo{
	color:#C33;
}
.table td .number,
.table td del{
	display:block;
	color:#999;
	font-style:normal;
	font-size:12px;
}
.table td .att{
	display:block;
	font-size:12px;
}
.table td .att.status{
	font-size:14px;
}
.table td.package .tdCT:before,
.table td .moveToFav,
.table td .moveToCart,
.table td .delete{
	background:url(../images/cartTableIcon.svg) no-repeat;
	transition:background-position 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
.table td.package .tdCT:before{
	content:"";
	display:inline-block;
	width:17px;
	height:19px;
	background-position:-38px 0;
	margin-right:5px;
	position:relative;
	top:3px;
}
.table td:last-child .tdCT{
	text-align:right;
}
.table td .moveToFav,
.table td .moveToCart,
.table td .delete{
	cursor:pointer;
	display:inline-block;
	white-space:nowrap;
	text-indent:100%;
	overflow:hidden;
}
.table td .moveToFav,
.table td .moveToCart{
	width:19px;
	height:17px;
	margin-right:20px;
}
.table td .moveToFav{ background-position:-19px 0;}
.table td .moveToFav:hover{ background-position:-19px bottom;}
.table td .moveToCart{ background-position:0 0;}
.table td .moveToCart:hover{ background-position:0 bottom;}
.table td .delete{
	width:15px;
	height:17px;
	background-position:right 0;
}
.table td .delete:hover{ background-position:right bottom;}

/************ 包裝示意 start **************/
.table .giftWrap{
	text-decoration: underline;
	margin-left:28px;
	font-size: 12px;
}
/************ 包裝示意 end **************/

/************ 組合商品 start **************/
.table tr.combineTitle,
.table tr.combineItem + tr:not(.combineItem){
	border-top:2px solid #EEE;
}
.table tr.combineTitle{
	border-bottom:none;
}
.table tr.combineTitle td{
	background:#F9F9F9;
}
.table tr.combineTitle td .tdCT{
	padding:1em;
	text-align:left;
}
/************ 組合商品 end **************/

.table tr.benefit td{
	background:#F4F4F4;
	padding:20px 12%;
	font-size:12px;
	color:#333;
	line-height:2em;
}
.table tr.benefit td ol,
.table tr.benefit td ul{
	padding-left:20px;
}
.table tr.benefit td ol{
	list-style:decimal;
}
.table tr.benefit td ul{
	list-style:disc;
}
.table tr.benefit td ul li a{
	text-decoration:underline;
}
.table tr.benefit td em{
	color:#C33;
	font-style:normal;
}
.table tr.benefit td .input{
	border:none;
	border-radius:4px;
	padding:5px 8px;
	font-size:12px;
	width:120px;
}
.table tr.benefit td label{
	cursor:pointer;
}
.table tr.benefit td label+label{
	margin-left:5px;
}
.table tr.benefit td label input[type="radio"]{
	position:relative;
	top:2px;
}
.table tr.benefit td .formBtn{
	padding:0.5em 1.2em;
	font-size:12px;
}

.table tr.benefit td .error{
	color:#C33;
}

/********** 使用購物金 start ************/
.useCoupon{
	display:flex;
}
.useCoupon dt{
	white-space:nowrap;
}
.useCoupon dd{
}
.useCoupon dd a{
	text-decoration:underline;
}
.couponList{
	width:34em;
	overflow:hidden;
}
.couponList .selectAll{
	background:#CCC;
	border-radius:3px;
	margin-top:0.6em;
	transition:background 0.2s;
}
.couponList .selectAll:hover{
	background:#DDD;
}
.couponList .selectAll label{
	display:block;
	padding:0.2em;
}
.couponList input[type="checkbox"]{
	position:relative;
	top:2px;
	cursor:pointer;
}
.table tr.benefit td .couponList ul{
	list-style:none;
	padding:0;
}
.couponList ul{
	margin:0.6em 0.5em 0 0.2em;
}
.couponList ul span{
	margin-left:0.4em;
}
.couponList .formBtn{
	float:right;
	margin-top:1em;
}
/********** 使用購物金 end ************/

/********** 使用折扣碼 start ************/
.useCode{
	margin-top:0.5em;
	display:flex;
}
.useCode dt{
	white-space:nowrap;
}
.useCode .before .formBtn{
	margin-left:0.25em;
}
/********** 使用折扣碼 end ************/

.cartCT .ps{
	margin-top:15px;
}
/********************** 商品內容表格 end *************************/

/********************** Step1 之 總結 start ***************************/
.total{
	overflow:hidden;
}
.total dl{
	float:right;
	margin-right:12%;
	width:30%;
}
.total dl .row{
	overflow:hidden;
	padding:8px 0;
}
.total dl .row:last-child{
	border-top:1px solid #F4F4F4;
	font-weight:bold;
	color:#333;
}
.total dl .row dt{
	float:left;
}
.total dl .row dt a{
	font-size: 0.9em;
}
.total dl .row dd{
	float:right;
	color:#333;
}
.total dl .row dd.benefit{
	color:#C33;
}
/********************** Step1 之 總結 end ***************************/

/********************** Step2 start ***************************/
fieldset .pay{
	margin-left:1.5em;
}
fieldset .pay label{
	cursor:pointer;
}
fieldset .pay .inputWrapper{
	margin-left:5px;
}
fieldset .pay .inputWrapper.cardType{ width:15%;}
fieldset .pay .inputWrapper.cardPayMonth{ width:10%;}
fieldset .pay .inputWrapper.cardBank{ width:15%;}
.statement.payAtt > div{
	display:none;
}
fieldset .pay .bankInfo{
	position:relative;
	display:inline-block;
	margin-left:5px;
	color:#FFF;
}
fieldset .pay .bankInfo.hide{
	display:none;
}
fieldset .pay .bankInfo strong{
	display:inline-block;
	background:#666;
	text-align:center;
	padding:0.2em;
	width:20px;
	height:20px;
	line-height:1em;
	border-radius:50%;
	cursor:pointer;
}
fieldset .pay .bankInfo span{
	position:absolute;
	left:50%;
	top:35px;
	transform:translateX(-50%);
	padding:10px;
	background:#666;
	white-space:nowrap;
	font-size:12px;
	border-radius:3px;
	display:none;
}
fieldset .pay .bankInfo span:before{
	position:absolute;
	content:"";
	display:block;
	left:50%;
	top:-10px;
	transform:translateX(-50%);
	border:10px solid transparent;
	border-top:none;
	border-bottom-color:#666;
}

fieldset .inputWrapper.name,
fieldset .inputWrapper.email,
fieldset .inputWrapper.mobile,
fieldset .inputWrapper.tel{
	width:30%;
}
fieldset .inputWrapper.ext{
	width:6.8%;
}
fieldset .inputWrapper.addressPre,
fieldset .inputWrapper.receiveTime{
	width:14.8%;
}
fieldset .inputWrapper.addressPre+.inputWrapper.addressPre{
	width:calc(14.8% - 2em);
}
fieldset .inputWrapper.addressDetail{
	width:40%;
}
fieldset .inputWrapper.gender label,
fieldset .ct .item.collectSend .inputWrapper label{
	margin-left:1em;
	cursor:pointer;
}

fieldset .inputWrapper.hide{
	display:none;
}

fieldset .ct .item.collectSend > label{
	width:auto;
}

fieldset .ct .item.receiptAddress > label{
	width:9em;
}

fieldset .receipt{
	margin-left:1.5em;
}
fieldset .receipt label{
	cursor:pointer;
}
fieldset .receipt label *{
	vertical-align:top;
}
fieldset .receipt .inputWrapper{
	width:15%;
	vertical-align: top;
	display:none;
}
fieldset .receipt .hintTxt{
	display: none;
}
fieldset .receipt.active .inputWrapper,
fieldset .receipt.active .hintTxt{
	display:inline-block;
}

fieldset .receiptAddress .addressGroup,
fieldset .receiptAddress .hintTxt{
	display:block;
	margin:10px 0 0 135px;
}

fieldset .receiptTypeCT{
	display: none;
}
fieldset .receiptTypeCT.active{
	display: block;
}
fieldset .receiptAddress .btnSameAsReceiver{
	cursor: pointer;
}
fieldset .ct .item.mobileBarcode > label{
	width:9.5em;
}
fieldset .ct .item.mobileBarcode .inputWrapper{
	vertical-align: top;
}
fieldset .ct .item > label.btnAgreeRecordMobileBarcode{
	width:auto;
	font-weight: bold;
	cursor: pointer;
}

fieldset label.refund{
	margin-left:1.5em;
	font-weight:bold;
	cursor:pointer;
}
fieldset label.refund label.error{
	margin-left:3.5em;
}
fieldset label.refund .info{
	display: block;
	margin-left:3.2em;
}

fieldset .inputWrapper.ps{
	width:80%;
}
fieldset .inputWrapper.ps textarea{
	height:8em;
	resize:vertical;
}
/********************** Step2 end ***************************/

/********************** Step3 start ***************************/
fieldset .ct.confirm .item > label {
	width:auto;
}
fieldset .ct.confirm .hintTxt {
	display:inline-block;
}
/********************** Step3 end ***************************/

/********************** 結果頁 start ***************************/
.resultCT{
	text-align:center;
	color:#333;
}
.resultCT .icon{
	margin:0 auto;
	width:87px;
	height:60px;
	background:url(../images/cartResult.png) no-repeat;
	opacity:0;
	transform:scale(0);
	animation:showResultIcon 1.5s cubic-bezier(0.82, 0.29, 0.29, 1.5) 0s forwards;
}
.resultCT .icon.success{ background-position:center top;}
.resultCT .icon.fail{ background-position:center bottom;}
@keyframes showResultIcon{
	to{
		opacity:1;
		transform:scale(1);
	}
}

.resultCT p{
	line-height:1.6em;
}
.resultCT .title{
	font-weight:bold;
	font-size:16px;
}
.resultCT .title+p+p{
	width:24em;
	margin-left:auto;
	margin-right:auto;
	text-align: left;
}
.resultCT .ps{
	color:#999;
}
.resultBtn{
	text-align:center;
}
.resultBtn .formBtn{
	width:10em;
}

.nordic15{
	text-align:center;
	margin:2em auto !important;
}
.nordic15 a{
	display:inline-block;
	padding:0.3em 1em;
	background:#e5e5e5;
	color:#666;
	font-weight:bold;
	font-size:24px;
	text-align:center;
	letter-spacing:0.2em;
	border-radius:8px;
	box-shadow:8px 8px 10px 1px rgba(0, 0, 0, 0.25);
	transition-duration:0.2s;
	transition-property:background, color;
}
.nordic15 a:hover{
	background:#666;
	color:#FFF;
}

.nordic15_aurora{
	text-align:center;
	margin:2em auto !important;
}
.nordic15_aurora a{
	transition:opacity 0.2s;
}
.nordic15_aurora a:hover{
	opacity:0.8;
}
.nordic15_aurora a img{
	border:none;
}
/********************** 結果頁 end ***************************/
/********************************************** 步驟內容 end *******************************************************/


/********************************************** 前後步驟按鈕 start *******************************************************/
.stepBtn{
	overflow:hidden;
}
.stepBtn .formBtnGroup{
	float:right;
	margin-right:12%;
	width:30%;
	overflow:hidden;
}
.stepBtn .formBtnGroup .formBtn{
	float:left;
}
.stepBtn .formBtnGroup .formBtn.light{
	width:30%;
}
.stepBtn .formBtnGroup .formBtn.cta{
	width:calc(70% - 5px);
	margin-left:5px;
	
}
/********************************************** 前後步驟按鈕 end *******************************************************/


.andBuy{
}


@media screen and (max-width:1023px){
	
	.cartStep,
	.cartCT,
	.resultCT,
	.total,
	.stepBtn{
		margin:0 10px;
	}
	
	/********************** 步驟流程 start ************************/
	.cartStep ul{
		font-size:13px;
	}
	.cartStep ul li{
		margin-right:2px;
	}
	.cartStep ul li{
		padding-right:20px;
	}
	.cartStep ul li:before,
	.cartStep ul li:after{
		width:12px;
		height:2px;
	}
	.cartStep ul li:before{
		top:30px;
	}
	.cartStep ul li:after{
		top:46px;
	}
	.cartStep ul li em{
		display:block;
		text-align:center;
		margin-left:10px;
	}
	.cartStep ul li span{
		top:0;
	}
	/********************** 步驟流程 end ************************/
	
	/********************** 步驟內容 start *************************/	
	/************ Step1 之 頁籤按鈕 start *************/
	.cartCT .tabBtnBlock ul{
		text-align:center;
	}
	.cartCT .tabBtnBlock ul li{
		width:49%;
	}
	/*********** Step1 之 頁籤按鈕 end **************/
	
	/************ Step1 之 總結 start *************/
	.total dl{
		margin-right:5%;
		width:40%;
	}
	/*********** Step1 之 總結 end *************/
	
	/************ Step2 start **************/
	fieldset .inputWrapper.receiveTime{
		width:30%;
	}
	/*********** Step2 end **************/
	/********************* 步驟內容 end *************************/
	
	/********************* 前後步驟按鈕 start ***************************/
	.stepBtn .formBtnGroup{
		margin-right:5%;
		width:40%;
	}
	/********************* 前後步驟按鈕 end ***************************/

}


@media screen and (max-width:767px){
	
	/******************** 步驟內容 start *************************/
	/*********** 商品內容表格 start *************/
	.cartCT .table tr:not(:first-child):not(.benefit){
		position:relative;
		min-height:135px;
	}
	.cartCT .table td:nth-child(2){
		max-width:none;
	}
	.table td .tdCT{
		padding:0;
	}
	.cartCT .table tr:not(.benefit) td:nth-child(1){
		float:left;
	}
	.cartCT .table tr:not(.benefit) td:nth-child(2){
		min-height:45px;
	}
	.cartCT .table tr:not(.benefit) td:nth-child(3){
		min-height:25px;
	}
	.table.cartList tr:not(.benefit) td:not(:first-child):not(:nth-child(8)),
	.table.cartFav td:not(:first-child):not(:last-child){
		width:calc(100% - 94px);
		margin-left:94px;
	}
	.table.cartList tr:not(.benefit) td:not(:first-child):not(:nth-child(8)):nth-child(4),
	.table.cartList tr:not(.benefit) td:not(:first-child):not(:nth-child(8)):nth-child(5){
		display:inline-block;
		width:auto;
	}
	.table.cartList tr:not(.benefit) td:not(:first-child):not(:nth-child(8)):nth-child(5){
		margin-left:1em;
	}
	.table.cartList td:not(:nth-child(-n+2)):not(:nth-child(8)),
	.table.cartFav td:not(:nth-child(-n+2)):not(:last-child){
		margin-top:5px;
	}
	.table td .price,
	.table td del{
		display:inline;
	}
	.table td del{
		margin-left:1em;
	}
	.table td .moveToFav,
	.table td .moveToCart{
		margin-right:10px;
	}
	.table.cartList td:nth-child(3),
	.table.cartList td:nth-child(4),
	.table.cartList td:nth-child(5),
	.table.cartList td:nth-child(6),
	.table.cartList td:nth-child(7),
	.table.cartFav td:nth-child(3),
	.table.cartFav td:nth-child(4){
		font-size:12px;
	}
	.table tr.benefit{
		padding:0;
	}
	.table tr.benefit td{
		padding:10px;
	}
	.table.cartList tr:not(.benefit) td:nth-child(8),
	.table.cartFav td:last-child{
		position:absolute;
		left:15px;
		top:100px;
	}
	.table td:last-child .tdCT{
		text-align:left;
	}
	
	/************ 包裝示意 start **************/
	.table .package br{
		display:none;
	}
	.table .package .giftWrap{
		margin-left:0;
	}
	/************ 包裝示意 end **************/
	
	/************ 組合商品 start **************/
	.table:not(.orderData):not(.orderList) tr.combineTitle{
		padding:0;
	}
	.table tr.combineTitle:not(.benefit) td:nth-child(1){
		float:none;
	}
	.table tr.combineTitle:not(:first-child):not(.benefit),
	.table tr.combineItem:not(:first-child):not(.benefit){
		min-height:0;
	}
	.table.cartList tr.combineItem:not(.benefit) td:nth-child(3),
	.table.cartList tr.combineItem:not(.benefit) td:not(:first-child):not(:nth-child(8)):nth-child(4) ~ *{
		display:none;
	}
	.table.cartList tr.combineItem:not(.benefit) td:not(:first-child):not(:nth-child(8)):nth-child(4){
		width:calc(100% - 94px);
	}
	/************ 組合商品 end **************/
	
	/******* 使用購物金 start *******/
	.useCoupon,
	.couponList time{
		display:block;
	}
	.couponList{
		width:auto;
	}
	.couponList time{
		margin-left:2em;
	}
	/******* 使用購物金 end *******/
	
	/******* 使用折扣碼 start *******/
	.useCode{
		display:block;
	}
	/******* 使用折扣碼 end *******/
	/*********** 商品內容表格 end *************/
	
	/************ Step1 之 總結 start *************/
	.total dl{
		float:none;
		margin-right:0;
		width:100%;
	}
	/************ Step1 之 總結 end *************/
	
	/************ Step2 start **************/
	fieldset .pay{
		margin-left:0;
		display:block;
	}
	fieldset .pay+.pay{
		margin-top:5px;
	}
	fieldset .pay .inputWrapper{
		margin-top:5px;
	}
	fieldset .pay .inputWrapper.cardType,
	fieldset .pay .inputWrapper.cardPayMonth,
	fieldset .pay .inputWrapper.cardBank{ width:100%;}
	fieldset .pay .bankInfo{
		display:block;
		margin-top:5px;
	}
	fieldset .pay .bankInfo strong{
		display:none;
	}
	fieldset .pay .bankInfo span{
		position:static;
		transform:none;
		padding:0;
		background:none;
		color:#666;
		white-space:normal;
		line-height:1.6em;
		border-radius:0;
		display:inline-block !important;
	}
	fieldset .pay .bankInfo span:before{
		display:none;
	}
	fieldset .inputWrapper.name,
	fieldset .inputWrapper.email{
		width:100%;
	}
	fieldset .inputWrapper.mobile,
	fieldset .inputWrapper.tel{
		width:35%;
	}
	fieldset .inputWrapper.ext{
		width:15%;
	}
	fieldset .inputWrapper.addressPre,
	fieldset .inputWrapper.addressPre+.inputWrapper.addressPre{
		width:calc(50% - 1.2em);
	}
	fieldset .inputWrapper.addressDetail{
		width:100%;
		margin-top:5px;
	}
	fieldset .inputWrapper.gender label{
		margin-left:0.2em;
	}
	fieldset .inputWrapper.receiveTime{
		width:100%;
	}
	fieldset .receipt{
		margin-left:0;
		display:block;
	}
	fieldset .receipt+.receipt{
		margin-top:5px;
	}
	fieldset .receipt .inputWrapper{
		width:100%;
		margin-top:5px;
	}
	
	fieldset .receiptAddress .addressGroup,
	fieldset .receiptAddress .hintTxt{
		margin:5px 0 0 0;
	}
	fieldset .ct .item.receiptAddress > label,
	fieldset .ct .item.mobileBarcode > label{
		width:auto;
	}
	fieldset .ct .item.mobileBarcode .inputWrapper{
		width:calc(100% - 1em);
	}
	
	fieldset label.refund,
	fieldset label.refund label.error{
		margin-left:0;
	}
	fieldset label.refund .info{
		display: inline;
		margin-left:0;
	}
	
	fieldset .inputWrapper.ps{
		width:100%;
	}
	fieldset .inputWrapper.ps textarea{
		height:6em;
	}
	/*********** Step2 end **************/
	/******************** 步驟內容 end **************************/	
	
	/********************* 前後步驟按鈕 start ***************************/
	.stepBtn .formBtnGroup{
		float:none;
		margin-right:0;
		width:100%;
	}
	/********************* 前後步驟按鈕 end ***************************/
	
}