.cart-inner { float: none; position: relative; display: inline-block; width: 902px;}
.cart-header { padding-bottom: 10px; padding-top: 68px; clear: both; float: left; position: relative; width: 100%;}
.cart-title {margin-bottom: 10px; text-align: left; clear: both; float: left; position: relative; border-bottom-color: #cccccc; border-bottom-style: solid; border-bottom-width: 1px; color: #8b9094; height: 40px; line-height: 40px; font-size: 20px; width: 100%;}
.cart-content { position: relative; float: left; clear: both; width: 100%;}

/*   */
.show100 {
	top: 50%;
	height: auto;
	z-index: 999999;
	position: relative;
	
	-ms-transform: scale(1);
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
}
.show0 {
	top: 200px;
	z-index: 0;
	position: absolute;
	-ms-transform: scale(0);
    -webkit-transform: scale(0);
    transform: scale(0);
    opacity: 0;
}

/* step */
.step-frame {text-align: center; float: left; position: relative; width: 100%;}
.step {width: 100%; display: inline-block; float: none; position: relative; padding-bottom: 15px;}
.step-child {float: left; position: relative; width: calc(100% / 4);}
.step-child .active {background-color: #9f3224; color: white;}
.step-dot { font-weight: bold; font-family: sans-serif; line-height: 24px; font-size: 13px; text-align: center; color: white; z-index: 2; left: 50%; margin-left: -12px; border-color: #b3b3b3; border-style: solid; border-width: 2px; background-color: #b3b3b3; position: relative; float: left; display: inline-block; height: 24px; width: 24px; border-radius: 20px;}
.step-name { margin-top: 5px; color: #212121; font-size: 13px; text-align: center; float: left; position: relative; width: 100%;}
.step-line {z-index: 1; top: 8px; background-color: #b3b3b3; height: 8px; float: left; position: absolute;}

.step-line {width: calc(100% - (100% / 8) * 2); margin-right: calc(100% / 8); margin-left: calc(100% / 8);}

.step-value {left: 0px; top: 50%; margin-top: -2px; height: 4px; background-color: #9f3224; width:calc(100% / 6); float: left; position: absolute;}



.cart-name { margin-bottom: 20px; border-color: transparent; border-width: 1px; border-style: solid; clear: both; position: relative; float: left; width: 100%;}
.cart-name ul { float: left; position: relative;}
.cart-name ul li { position: relative;}

.cart-list { padding-top: 15px; margin-bottom: 30px; background-color: #f6f6f6; border-color: #cccccc; border-width: 1px; border-style: solid; clear: both; position: relative; float: left; width: 100%;}
.cart-list ul {padding-bottom: 15px; float: left; position: relative;}
.cart-list ul li { position: relative;}

.cart-total { padding-top: 15px; margin-bottom: 30px; background-color: #f6f6f6; border-color: #cccccc; border-width: 1px; border-style: solid; clear: both; position: relative; float: left; width: 100%;}
.cart-total ul {padding-bottom: 15px; float: left; position: relative;}
.cart-total ul li { position: relative;}

.cart-control { margin-bottom: 30px; clear: both; position: relative; float: left; width: 100%;}
.cart-control ul {text-align: left; float: left; position: relative;}
.cart-control ul li { float: left; position: relative;}

.uleft {width: 60%;}
.uright {width: 40%;}



.cart-note {margin-bottom: 20px; border-color: #cccccc; border-style: solid; border-width: 1px; clear: both; float: left; position: relative; height: auto; background-color: #f6f6f6; padding: 20px; width: 100%;}
.cart-note h3 {margin-bottom: 10px; color: #4e5456; line-height: 24px; font-size: 16px; clear: both; float: left; position: relative; width: 100%;}
.cart-note p {display: inline-block; clear: both; float: none; position: relative; width: 650px; text-align: left; line-height: 20px; font-size: 14px; color: #4e5456;}



.count-frame { width: 92px; height: 32px; float: none; position: relative;}
.count-frame .countbtn {font-family: sans-serif; line-height: 30px; font-size: 18px; border-color: #8b9094; border-width: 1px; border-style: solid; color: white; background-color: #bbaa98; text-align: center; float: left; position: relative; height: 30px; width: 30px;}
.count-frame .count-value { font-style: normal; font-weight: normal; color: #212121; font-size: 18px; border-bottom-width: 1px; border-top-width: 1px; border-bottom-color: #8b9094; border-top-color: #8b9094; border-left-style: none; border-bottom-style: solid; border-right-style: none; border-top-style: solid; text-align: center; width: 30px; height: 30px; float: left; position: relative;}


.l110 {position: relative; float: left; padding-left: 15px; text-align: left; width: 150px;}
.l110 img {position: relative; float: right;}
.auto {padding-left: 15px; float: left; width: auto;}
.checkbox { margin-left: 10px; float: left; position: relative;}
.itemname { text-align: left; color: #4e5456; line-height: 24px; font-size: 18px;}
.itemno {padding-left: 2px; text-align: left; color: #8b9094; font-size: 14px;}
.ileft { text-align: right; width: 52px; margin-left: 20px; float: left; position: relative;}
.imiddle { text-align: center; width: 122px; padding-right: 15px; padding-left: 15px; float: left; position: relative;}
.iright { padding-right: 20px; text-align: right; width: 120px; float: right; position: relative;}
.ilm { padding-right: 15px; text-align: right; width: 174px; margin-left: 20px; float: left; position: relative;}
.tlabel { display: inline-block; margin-top: 11px; float: none; position: relative; height: 14px; line-height: 14px; font-size: 14px;}
.label { margin-top: 11px; float: left; position: relative; height: 14px; line-height: 14px; font-size: 14px;}
.ilabel { padding-left: 3px; margin-top: 11px; float: left; position: relative; height: 14px; line-height: 14px; font-size: 14px;}
.tcount {padding-right: 2px; padding-left: 2px; float: left; position: relative; height: 32px; line-height: 32px; font-size: 18px;}
.price {float: left; position: relative; height: 32px; line-height: 32px; font-size: 18px;}
.iprice {float: right; position: relative; height: 32px; line-height: 32px; font-size: 18px;}
.tprice {float: right; position: relative; height: 32px; line-height: 32px; font-size: 18px;}
.checkbox {margin-top: 11px; float: left; position: relative;}
.delete-btn { margin-left: 20px; color: white; background-color: #d95c00; padding-right: 15px; padding-left: 15px; float: left; position: relative; height: 32px; line-height: 32px; font-size: 14px; border-radius: 2px;}
.buy-btn {float: right; position: relative; padding-right: 48px; padding-left: 48px; color: white; background-color: #bbaa98; line-height: 48px; font-size: 18px; height: 48px;}

/* payment-method */

.payment-method { padding-top: 10px; border-color: #8b9094; border-style: solid; border-width: 1px; background-color: white; margin-left: -150px; margin-top: -65px; z-index: 9999; left: 50%; top: 50%; float: left; position: fixed; height: auto; width: 300px; border-radius: 5px; overflow: hidden;}
.select-note {margin-top: 10px; clear: both; float: left; position: relative; padding-right: 15px; padding-left: 15px; width: 100%; text-align: center; line-height: 20px; font-size: 14px;}

.payment-btn {margin-top: 15px; margin-right: 10px; margin-left: 10px; margin-bottom: -4px; float: none; position: relative; display: inline-block; text-align: center; font-size: 14px; line-height: 36px; color: white; background-color: #bbaa98; height: 36px; width: 120px; border-radius: 2px;}
.payment-status {margin-top: 30px; color: #4e5456; background-color: #e6e6e6; text-align: center; height: 48px; line-height: 48px; font-size: 14px; width: 100%; float: left; position: relative;}

.payment-close {z-index: 2; right: 8px; bottom: 8px; float: left; position: absolute; height: 30px; width: 30px;}
.payment-close span {background-color: white; float: left; position: absolute; left: 50%; top: 50%; margin-left: -10px; margin-top: -1px; height: 2px; width: 20px;}
.payment-close .l-line {
	-ms-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
}
.payment-close .r-line {
	-ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}



/* member-data */
.member-data {margin-bottom: -4px; display: inline-block; float: none; width: 50%;}

.same-frame {padding-right: 20px; right: 0px; top: 0px; float: left; position: absolute; width: auto;}
.same-frame .same {margin-top: 10px; float: left; position: relative; cursor: pointer;}
.same-frame label {padding-left: 3px; height: 32px; float: left; position: relative; line-height: 32px; font-size: 14px; cursor: pointer;}





/* order-list */
.order-form { position: relative; height: auto; z-index: 1; margin-bottom: 48px; border-left-color: #cccccc; border-right-color: #cccccc; border-top-color: #cccccc; border-left-style: solid; border-right-style: solid; border-top-style: solid; border-left-width: 1px; border-right-width: 1px; border-top-width: 1px; float: left; width: 100%;}
.order-title {border-bottom-color: #8b9094; border-bottom-style: solid; border-bottom-width: 1px; padding-left: 20px; width: 100%; clear: both; float: left; position: relative; text-align: left; padding-bottom: 20px; padding-top: 20px; font-size: 20px;}

.order-area {padding: 20px; border-bottom-color: #cccccc; border-bottom-style: solid; border-bottom-width: 1px; clear: both; float: left; position: relative; width: 100%;}
.area-title {padding-bottom: 3px; text-align: left; clear: both; float: left; position: relative; width: 100%; font-size: 16px;}

.order-list {border-top-color: #cccccc; border-top-style: dotted; border-top-width: 1px; float: left; position: relative; width: 100%;}
.order-list .item-child {padding-bottom: 10px; padding-top: 10px; float: left; position: relative; width: 50%;}
.order-list .item-child li {text-align: left; color: #4e5456; font-size: 14px; float: left; position: relative;}
.order-list .price-child { float: right; position: relative; width: auto; padding-bottom: 10px; padding-top: 10px;}
.order-list .price-child li {padding-left: 20px; height: 32px; line-height: 32px; text-align: left; color: #4e5456; font-size: 18px; float: left; position: relative;}

.order-list .data-child {border-bottom-color: #cccccc; border-bottom-style: dotted; border-bottom-width: 1px; padding-bottom: 5px; padding-top: 5px; float: left; position: relative; width: 100%;}
.order-list .data-child li { text-align: left; width: 50%; color: #4e5456; float: left; position: relative;}
.order-list .data-child li label { color: #999999; line-height: 32px; font-size: 16px; padding-right: 20px;}
.order-list .data-child li span { color: #4e5456; line-height: 32px; font-size: 16px; padding-right: 20px;}

.order-total {border-top-color: #cccccc; border-top-style: solid; border-top-width: 1px; width: 100%; float: left; position: relative;}
.order-total .iright {padding-right: 0px;}
.order-btn { z-index: 2; right: 20px; top: 16px; border-style: none; width: 200px; color: white; float: left; text-align: center; position: absolute; background-color: #2ade73; font-size: 15px; height: 36px; border-radius: 2px; cursor: pointer;}


.pay-form {text-align: center; display: none; position: relative; height: auto; float: left; margin-bottom: 48px; background-color: white; border-color: #cccccc; border-style: solid; border-width: 1px; width: 100%; z-index: 3;}
.pay-list { display: inline-block; float: none; position: relative; padding: 20px; width: 50%;}
.pay-list h3 {margin-bottom: 20px; border-bottom-color: #cccccc; border-bottom-style: solid; border-bottom-width: 1px; height: 32px; line-height: 32px; clear: both; float: left; position: relative; width: 100%; color: #d95c00; font-size: 18px;}
.pay-info { width: 100%; clear: both; float: left; position: relative; color: #4e5456; text-align: left; line-height: 20px; font-size: 14px;}


.online-pay { display: inline-block; padding-bottom: 15px; padding-top: 15px; padding-right: 20px; padding-left: 20px; margin-bottom: 30px; margin-top: 30px; z-index: 0; border-style: none; width: auto; color: white; float: none; text-align: center; position: relative; background-color: #2ade73; font-size: 15px; height: auto; border-radius: 2px;}


.nan-login {padding-bottom: 10px; padding-right: 10px; padding-left: 10px; float: left; position: relative; width: 100%;}
.nan-login h3 {margin-top: 10px; text-align: center; color: #4e5456; font-size: 18px; clear: both; float: left; position: relative; width: 100%;}
.nan-login p {margin-bottom: 10px; text-align: center; color: #8b9094; font-size: 14px; clear: both; float: left; position: relative; width: 100%;}

/* shoppingcart */
.no-item {float: left; position: relative; height: 240px; width: 100%;}
.gotoshop { color: rgba(255,255,255,0); margin-left: -84px; margin-top: -84px; left: 50%; z-index: 2; height: 168px; line-height: 168px; width: 168px; top: 50%; float: left; position: absolute; font-size: 20px; border-radius: 180px; background-color: rgba(217,92,0,0,0);}
.gotoshop:hover {color: rgba(255,255,255,1); background-color: rgba(217,92,0,0.9);}
.scale {
	-ms-transform: scale(2);
    -webkit-transform: scale(2);
    transform: scale(2);
}
.shoppingcart-btn { z-index: 1; top: 50%; margin-top: -20px; margin-left: -20px; left: 50%; float: left; position: relative; line-height: 40px; font-size: 13px; height: 48px; width: 48px;}
.shoppingcart-btn:after { content: " ";}
.shoppingcart-btn .basket-enter {
	background-color: #54595d;
	height: 4px;
	left: 0px; z-index: 0; top: 22%; 
	float: left; position: relative; width: 97%; border-radius: 5px; 
}
.shoppingcart-btn .basket-bar { 
	background-color: #54595d; 
	height: 4px; 
	right: -6%; top: 0px; position: absolute; width: 23%;
	border-radius: 6px;
}
.shoppingcart-btn .basket-box { background-color: #54595d; height: 4px; left: 19%; bottom: 30%; position: absolute; width: 45%; box-sizing: border-box; border-radius: 6px;}
.shoppingcart-btn .basket-box-left {
	background-color: #54595d;
	top: 20%;
	left: 8%; position: absolute; height: 52%; width: 4px;
	transform:rotate(-27deg);
	-ms-transform:rotate(-27deg);
	-webkit-transform:rotate(-27deg);
	border-radius: 6px;
}
.shoppingcart-btn .basket-box-right {
	background-color: #54595d;
	top: 0px;
	right: 22%; position: absolute; height: 73%; width: 4px;
	transform:rotate(25deg);
	-ms-transform:rotate(25deg);
	-webkit-transform:rotate(25deg);
	border-radius: 6px;
}
.shoppingcart-btn .basket-wheel-left {background-color: #54595d; left: 5%; bottom: 0px; z-index: 2; position: absolute; height: 20%; width: 20%; border-radius: 50%}
.shoppingcart-btn .basket-wheel-right { background-color: #54595d; height: 20%; width: 20%; bottom: 0px; right: 23%; position: absolute; z-index: 2; border-radius: 50%}

.shoppingcart-btn:active .basket-enter, 
.shoppingcart-btn:active .basket-bar,
.shoppingcart-btn:active .basket-box,
.shoppingcart-btn:active .basket-box-left,
.shoppingcart-btn:active .basket-box-right,
.shoppingcart-btn:active .basket-wheel-left,
.shoppingcart-btn:active .basket-wheel-right
{background-color: white;}


.loader {display: none; text-align: center; background-color: white; z-index: 999; right: 0px; left: 0px; bottom: 0px; top: 0px; position: absolute;}
.loader p { margin-top: -9px; height: 18px; color: #d95c00; line-height: 18px; font-size: 18px; text-align: center; right: 0px; left: 0px; top: 50%; float: left; position: absolute;}

@media screen and (max-width: 1000px) {
	.cart-inner {padding-right: 10px; padding-left: 10px; width: 100%;}
}

@media screen and (max-width: 800px) {
	
	.cart-header {padding-top: 30px;}
	
	
	.member-data {width: 100%; clear: both;}
	.uright { padding-top: 15px; border-top-color: #cccccc; border-top-style: solid; border-top-width: 1px;}
	.cart-name ul {display: none;}
	.cart-list ul { clear: both; width: 100%;}
	.cart-total ul { width: 100%; clear: both;}
	
	
	.order-list .item-child {width: 100%;}
	.order-list .data-child {padding-bottom: 0px; padding-top: 0px; border-bottom-style: solid; border-bottom-width: 0px;}
	.order-list .data-child li {border-bottom-color: #cccccc; border-bottom-style: dotted; border-bottom-width: 1px; width: 100%;}
	
	.order-list .data-child li span {text-align: left; float: right; position: relative; padding-right: 0px;}

}

@media screen and (max-width: 680px) {
	.cart-note {margin-bottom: 10px;}
	.cart-note p { text-indent : -1.05em; text-align: justify; padding-right: 15px; padding-left: 15px; width: 100%;}
}
@media screen and (max-width: 480px) {
	.l110 {text-align: center; width: 100%;}
	.l110 input {left: 20px; top: 0px; float: left; position: absolute;}
	.l110 img {margin-left: -40px; left: 50%; float: left; position: relative;}
	.auto { padding-right: 5px; padding-left: 5px;}
	.itemname {text-align: center;}
	.itemno {text-align: center;}
	.ileft {margin-left: 10px;}
	.iright {width: auto;}
}

