/*---------section-header----------------*/
.section-header { width: 100%; display: block; padding: .5em 0px; margin-bottom: 30px; color: #4c4948; font-size: 1.5em; font-weight: bold; border-bottom: solid 2px #bcc5ca; text-align: center; }
.section-header h3 { width: 100%; padding-left: 1em; display: block; font-size: .9em; text-align: left; }
.section-header span { font-size: .7em; }
/*----------pay-----------------*/
.pay { width: 100%; height: auto; display: block; margin: 0px auto; }
.pay ul { width: 90%; margin: 2% auto; display: block; text-align: left; }
.pay ul li { width:45%; margin: 10px auto; padding: 0px 10px; display: inline-block;  vertical-align: top; line-height: 2em; }
.pay ul li span { width: 100%; display: block; font-size: 1.1em; text-align: center; }
.pay li em.vremark { width: 100%; padding: 0px; display: block; line-height: 18px; font-size: 13px; color: #9c9c9c; vertical-align: middle; }
/*--setup1-------------*/
.cart-list { width: 100%; display: block; margin: 2% auto 5% auto; }
.cart-list a { color: #76898f; }
.cart-list ul { display: block; width: 100%; margin: 1% auto;}
.cart-list ul li { display: block;   }

.order_list { width: 100%; margin: 2% auto 5% auto; display: flex; flex-direction: column; }
.order_list ul { display: block; width: 100%; padding: 1% 0 1% 0; display: flex; }
.order_list ul.field { display: flex; background: #f8f8f8;}
.order_list ul.item { width: 100%; display: flex; border-top: solid 2px #aeb8bd; border-bottom: none; line-height: 2em; }
.order_list ul li.pimg { width: 20%; margin: 10px auto; display:none; vertical-align:top; }
.order_list ul li.amount { width: 50%; display: block; margin: auto;}
.order_list ul li.subtotal { width: 65%; display: inline-block; margin: auto; }


ul.field { display: none; }
ul.item { width: 100%; display: block; border-bottom: solid 2px #aeb8bd; border-top: none; line-height: 2em; }
ul.field li { display: inline-block; height: auto; margin: 10px auto; vertical-align: top; text-align: center; font-size: 1.2em; color: #4c4948; font-weight: bold; }
ul.item li { display: inline-block; height: auto; margin:0px auto; vertical-align: middle; text-align: center; font-size: 1.2em; color: #7e9096; font-weight: 400; }
ul.item:last-of-type{border-bottom:none; }
ul li.pimg { width: 20%; margin: 10px auto; display:inline-block; vertical-align:top; }
ul li.pimg a { display: block; width: 90px; height: 90px; margin: 10px auto; text-align: center; }
ul li.pimg a img { display: block; width: 90px; height: 90px; }
ul li.name { width: 70%; padding: 0 0 0 20px; display:inline-block;}
ul li.name span { width: 100%; margin: 10px 0 3px 0; display: inline-block; text-align: left; color: #666666; font-size: 15px; }
ul li.name span strong { display: inline-block; height: 20px; width: auto; font-size: 12px; background-color: #C9163A; border-radius: 3px; text-align: center; color: #FFF; margin-right: 10px; padding: 0 10px }
ul li.name span:nth-child(2) { color: #4c4948; line-height: 26px; margin: 0 }
ul li.name span:nth-child(3) { font-size: 14px; color: #f5a623; margin: 0px; }
ul li.spec {display:inline-block; padding: 0 0 0 20px; margin-left:20%; }


ul li.unit { width: 15%; display: none; }
ul li.amount { width: 50%; display: block; margin: auto; text-align: left; }
ul li.amount select, ul li.amount input{ width: 100%; min-height: 2em; }
ul li.discount { width: 70%; }
ul li.subtotal { width: 65%; display: inline-block; margin: 2% auto; }
ul li.number{  }
ul li.number, ul li.order-number, ul li.payment, ul li.order-amount ,ul li.delivery-date, ul li.view , ul li.status, ul li.information { width:100%; display:block; text-align: center; }
ul li.information{border-bottom:none;}
.cart-list li span.item-mobile { width:30%; display: inline-block;  text-align: left; color: #4c4948;background: #e3f3ff; margin: 0 1px 3px 0; }
.cart-list li span.item-single {  width:68%; display: inline-block;  text-align: left; color: #4c4948;  }
 span.item-single a{ color: #c7263a; text-decoration: underline; }

.cart-list ul.submit-btn li{ width: 33%!important; display:inline-block; margin:1%; }





/**---promo-zone---**/
.promotions{width:100%;  margin:30px auto;   border:3px solid #bcc5ca;}
.promotions ul li span.price-mobile{width:24%; margin:1% 1% 1% 0px; display: inline-block; text-align: center; color:rgba(237,90,90,1);  background:rgba(237,90,90,.2);}
ul li.promo-name, ul li.promo-type, ul li.promo-amount, ul li.promo-zone{width:98%; padding-left:2%;text-align: left; display: block; font-weight:400; color: #4c4948;}
ul li.promo-zone span{width:73%; display: inline-block;}
ul li.promo-zone span.zone{width:70%; }
ul li.promo-zone span.zone span.price-red{display: inline-block;}
.promo-detail ul{margin:0px auto; }
.promo-detail ul.field { display: none; background:rgba(76,158,217,.2);  border-bottom: solid 1px #fff; }
.promo-detail ul.item{ margin:0px auto; padding:0px; background:rgba(76,158,217,.1); border-bottom: dashed 1px rgba(76,158,217,.2);}
.promo-detail ul li span.price-mobile{width:25%; display: inline-block; color: #4c4948; border: none; background:none;}
 .price-red{color:#f64c5f;}
.price-arrow{ padding-right:20px;  background: url(../images/icons/arrow-down.png) no-repeat right 5px; background-size:12px;  text-decoration: underline; color:#4c9ed9; }
.price-mobile { display: block; text-align: left; font-weight:700; }
.total-mobile { display: inline-block; color: #4c4948; vertical-align: top; }
.single-total { display: inline-block; color:#f64c5f;}
ul li.dele { width:30%; display: inline-block;  text-align: center; margin-top: 1%; }
ul li.dele a {display: inline-block; width:35px;  height: 35px;margin:0px auto; background: url(../images/icons/delete.png) no-repeat center 10px; text-indent: -9999px; }
ul li.dele a:hover { background-position: center  -65px; }

ul li.dele2 { width:100%; display: inline-block;  text-align: center; margin-left: 1.5px; }
ul li.dele2 a { display: inline-block;  width:35px;  height: 35px;margin:0px auto; background: url(../images/icons/delete.png) no-repeat center 10px; text-indent: -9999px; }
ul li.dele2 a:hover { background-position: center  -65px; }

/*ul li.dele span:first-child { width: 100%;  display: block; font-size: 13px; color: #C1042B; line-height: 26px; text-align: center; margin: 0; }
ul li.dele span:first-child+span { width: 100%; font-size: 13px; color: #333; line-height: 26px; margin: 0px; } */


ul.shipment { width: 100%; min-height: 5em; margin: 2% auto; padding: 10px; display: block; border: 3px solid #f9f9f9; background: #f9f9f9; }
ul.shipment li { width: auto; padding: 5px 20px; display: block; font-size: 1em; color: #666; text-align: left; vertical-align: top; }
ul.shipment li.coupons select { margin: 0 auto 0 auto; width: auto; text-align: center; line-height: 90px; }
ul.shipment li.radio-s { width: 30%; margin: 3% auto; padding: 0px; display: inline-block; text-align: left; }
ul.shipping { width: 98%; display: block; margin: 1% auto; border-bottom: none; }
ul.shipping li { display: inline-block; vertical-align: top; }
ul.shipping li:first-child { width: 100px; display: inline-block; line-height: 70px; background: url(../images/icons/shipping.png) no-repeat center center; text-indent: -9999px; }
ul.shipping li:nth-child(2) { width: 56%; display: inline-block; height: auto; font-size: 14px; color: #666; line-height: 1.8em; }
ul.shipping li:nth-child(2) span { width: 100%; display: block; color: #666; }
ul.shipping li:nth-child(2) span strong.mem-gift { display: inline-block; height: 20px; width: 80px; font-size: 12px; line-height: 20px; background-color: #f64c5f; border-radius: 3px; text-align: center; color: #FFF; margin-right: 10px; }
ul.shipping li:first-child + li span:first-child+span { font-size: 1em; color: #666; line-height: 1.8em; text-align: left; margin: 2% auto; }
.shipping-price { width:50%; display: inline-block; margin: auto;padding-top: 1%; color: #f64c5f; font-size: 1.2em; text-align:center; }

ul.sum,.ul.total{ width: 100%; margin:0px auto; display: block; border: none; text-align: right;  }
ul.sum li { min-height: 70px; padding: 0; line-height: 70px; display: inline-block; }
ul.sum li:first-child { width: 40%; text-align: right; }
ul.sum li:nth-child(2) { width: 6%; font-size: 16px; text-align: right; }
ul.sum li:nth-child(3) { width: 40%; padding-left:5%;  color: #f64c5f; font-size: 24px; text-align: left; }

ul.total li{ min-height: 30px; padding: 0; line-height: 2em; text-align: right; display:block;  }
ul.total li span{ display:inline-block;}
ul.total li span:first-child{ width: 40% !important;  }
ul.total li span:nth-child(2) { width: 6%; font-size: 16px;  }
ul.total li span:nth-child(3) { width: 40%; padding-left:5%; color: #f64c5f; font-size: 1.3em; text-align:left; }


.summary-list {  width:100%;  display: block;  margin:30px auto; border:3px solid #bcc5ca;}
ul.summary {   width:98%;   margin:auto; display: block;   -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; text-align: center;   }
ul.summary li {  width:100%;   display:block;  padding:0; margin:0;  border-bottom: solid 1px  rgba(126,144,150,.2);   }
ul.summary li span { padding:2%; display: inline-block;  }
ul.summary li span.field { width:50%;   text-align:right; color:#4c4948;}
ul.summary li span.item { width:40%; padding-right:5%;  text-align:right;   color:#f64c5f; }
ul.summary li span:first-child+span+span { width: 60%; text-align:left; }


/*---setup2----*/
.info-form { width: 100%; margin: 2% auto; display: block; }
.info-form ul { display: block; width: 100%; margin: 2% auto; vertical-align: top; }
.info-form ul li { width: 100%; margin:5px auto; padding: 0px 10px; display: block; line-height: 1.5em; }
.info-form ul li.remark span { width: 100%; display: block; color: #f64c5f; font-weight:700;}
.info-form ul li.remark ul { width: 100%; display: block; }
.info-form ul li.title { margin-bottom:20px;  padding-bottom:5px; font-size:1.2em; text-align: left; font-weight:500; color:#3a3935;border-bottom: solid 2px #bcc5ca; }
.info-form ul li.title::after { display: none; }
.info-form ul li.remark-red { font-size: 13px; color: #f64c5f; padding-top: 5px; }
.info-form ul li.remark-store { font-size: 13px; color: #666; padding: 5px; margin: 1% 2%; }
.info-form select { width: 100%; min-height: 40px; line-height: 40px; color: #afbabf; }
.info-form .select-store select option { line-height: 40px; }
.info-form ul li span a { padding: 2px 5px; text-decoration: underline; color:#3a3935; }
.info-form ul li span.field{width: 20%; padding-top:10px; display: inline-block; vertical-align:top; color: #3a3935; font-weight:500;}
.info-form ul li span.lab-gender{width:100%; display: block; }
.info-form ul li input, .info-form ul li textarea { width: 100%; font-size: .9em; line-height: 2em; padding: 5px; margin: 5px 0px; }
.info-form ul li input.remark-note{ min-height:100px;}

.info-form ul li input{ width: 100%; border: 1px solid #dddddd; color:#959595;  -webkit-border-radius:3px; -moz-border-radius: 3px; border-radius:3px; }
.info-form ul li select:focus { color: #959595; }
.info-form ul li select:focus option { color: #959595; padding: 5px 0px; }
.info-form ul li textarea:focus, .info-form  ul li input:focus { border: solid 1px #f9be14; color: #000; background: #f9f9f9; }



/*---setup3----*/
.confirm-list { width: 98%; display: block; margin: 40px auto 0 auto; }
.confirm-list ul, .confirm-list ul.ps { width: 100%; display: block; vertical-align: top; }
.confirm-list ul li { vertical-align: top; padding: 10px 5px; }
.confirm-list ul li.title { text-align: left; font-weight: bold; color:#3a3935; background: #fff; border-bottom: solid 2px #afbabf; }
.confirm-list ul li.title::after { display: none; }
.confirm-list ul li span { display: inline-block; padding: 2px 0px; vertical-align: top; text-align: left; }
.confirm-list ul li span:first-child { width: 30%; color: #959595; font-weight: bold;}
.confirm-list ul li span:nth-child(2) { width: 68%; color: #35404b; font-weight: bold; }
/*---setup4----*/
.center-info { width: 80%; margin: 0 auto; display: block; text-align: center; }
.center-info h2 { font-size: 26px; display: block; width: 100%; margin: 30px 0; text-align: center; font-weight: bold }
.center-info p { font-size: 15px; display: block; text-align: center; width: 100%; margin: 30px 0; line-height: 26px; }
.center-info p.info-more { font-size: 14px; display: block; text-align: center; width: 100%; margin: 30px 0; line-height: 26px; }
.center-info p strong { font-weight: bold; color: #C9163A; margin: 0 0 0 10px; }

/**----member order-history-list -----------**/
.order-history-list { width: 100%; display: block; margin: 2% auto 5% auto; }
.order-history-list ul {  display: block; width: 100%; margin: 1% auto;  }
.order-history-list ul.field { display: none; background:#fff;border-bottom: solid 2px #959595;}
.order-history-list ul li { display: block; }  
.order-history-list ul.item {   display: block; border-bottom: dashed 1px #a28d5b; line-height: 2em; }
.order-history-list ul.field li { display: inline-block; height: auto; margin: 10px auto; vertical-align: top; text-align: center; font-size: 1em; color: #3a3935; font-weight: bold;}
.order-history-list ul.item li {display: inline-block; width: 100%;height: auto; margin: 10px auto; vertical-align: middle; text-align: center; font-size: 1em; color: #7e9096; font-weight:400; }
.order-history-list ul.item li span:first-child { display: inline-block; width:30%; text-align: right; color:#4c4948;}
.order-history-list ul.item li span:first-child+span { display: inline-block; width:60%; margin-left:5%; text-align: left;}
ul li.status span em{  color:#f5a623;}

 /**----member order-history-list  detail-pay  -----------**/
ul.detail-pay {   width:98%;   margin:20px auto; display: block;   -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; text-align: center;  border:1px solid rgba(242,241,246,1); background:rgba(199,222,229,.1);  }
ul.detail-pay li {  width:100%;   display:block;  padding:0; margin:0;  border-bottom: solid 1px  rgba(126,144,150,1);   }
ul.detail-pay li span { padding:1% 2%; display: inline-block;  }
ul.detail-pay li span:first-child { width:20%; margin-left:0;  background:#e8eef4; text-align:left; color:#3a3935;}
ul.detail-pay li span:first-child+span { width:80%;text-align:left; background:#f9f9f9; color:#3a3935; }
ul.detail-pay li span:first-child+span+span { width: 60%; text-align:left; }


/* button --- */
.button { display: inline-block; zoom: 1; vertical-align: baseline; border: none; margin: 0 auto; outline: none; cursor: pointer; text-align: center; text-decoration: none; padding: .5em 1em; width: 100%; }
.button:hover { text-decoration: none; }
.button:active { position: relative; top: 1px; }
.red { color: #fff; border: solid 1px #AAB3BB; background: #AAB3BB; line-height: 2em; }
.red:hover { background: #767d84; }
.red:active { color: #cfb17e; background: #4c4948; }
.orange { background-color: #f64c5f; color: #FFF; line-height: 2em; }
.orange a { color: #FFF !important; }
.orange a:hover { color: #425b71!important; }
.orange:hover, .orange:focus, .orange:active { background: none repeat scroll 0 0 #EB4848 !important; border-color: #E83131 !important; }




@media (min-width:640px) {
.pay ul li { width: 32%; padding: 0px 5px; display: inline-block; }
ul.shipment li.radio-s { width: 30%; margin: auto 1%; padding: 5px 20px; display: inline-block; }
.shipping-price { width: auto; display: inline-block; }
ul.sum, ul.total{ width: 60%; display:block; margin: auto; }
}

@media (min-width:800px) {
.pay ul li { width: 32%; }
.pay li em.vremark { width: 46%; display: inline-block; }
ul.field li, ul.item li {  display: inline-block; margin: 10px auto;}
.order-history-list ul.field li { width: 100%;  font-weight: 700; }
.order-history-list ul.item li { font-size:.85em;  }
ul li.status span em{ display:block;}
ul.field{background:#f8f8f8; }
ul.field, ul.item{ width: 100%; margin: 0 auto; display: block;  border-bottom:1px solid #e8eef4; }
ul li.pimg{ width: 10%;}
ul li.name{ width: 20%;}
ul li.spec{ width: 15%;}
ul li.unit{ width: 10%;}
ul li.amount{ width:10%; text-align: center;  }
ul li.discount{ width:10%; }
ul li.subtotal{ width: 10%; display: inline-block; margin: 10px auto; }
ul li.number{ width:5%; text-align: center; }
ul li.order-number { width:12%; }
ul li.payment { width:10%; }
ul li.order-amount { width:10%; }
ul li.view { width:8%; }
ul li.delivery-date{ width:15%; }
ul li.status { width:15%; }
ul li.dele { width: 10%; }
ul li.dele2 { width:10%; display: inline-block;  text-align: center; margin-top: 1%; }
ul li.information { width: 10%;}
.order_list ul.field, ul.item { display: flex;}
.price-mobile, .item-mobile { display: none !important; }
.cart-list li span.item-single { width:100%;  text-align: center;    }
.total-mobile { display: none; }
.single-total { display: inline-block; text-align: center; vertical-align: top; }
ul.shipment { width: 90%; }
ul.shipment li { width: auto; display: inline-block; }
ul.shipment li.radio-s { width: 25%; display: inline-block; margin: auto 1%; }
ul.shipping li span { display: inline-block; }
ul.cart-remark { width: 80%; }
.info-form ul, .confirm-list ul { display: inline-block; width: 45%; margin: 2% auto; vertical-align:top; }
.info-form ul:nth-child(2n), .confirm-list ul:nth-child(2n) { margin-left: 8%; }
.info-form ul li ul{width: 100%;}
.info-form select { width: 50%; }
.info-form ul li span.lab-gender{width:78%; display: inline-block; }
.info-form ul li span{}
.info-form ul li span.field{ width: 20%; display: inline-block;   }
.info-form ul li span.item { width: 70%;  display: inline-block; margin: 0px!important; padding-left:0px !important; text-align:left;  }
.info-form ul li span.item span{ display:  block; }
.confirm-list ul li span:first-child { width: 20%; }
.confirm-list ul li span:nth-child(2) { width: 70%; }

.lab-gender{ width: 100%; }
.cart-list ul.submit-btn { width: 90%!important; }

/**order-history-list**/
.order-history-list ul.field, .order-history-list ul.item { display: block; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; }
.order-history-list ul.item li, .order-history-list ul.field li {display: inline-block; text-align: center; }
.order-history-list ul.item li span:first-child { display: none;}
.order-history-list ul.item li span:first-child+span { width:100%;text-align: center; }
ul li.dele span:first-child+span { width:10%;  }
ul li.dele a { width:100%;}
ul.summary {   width:50%;  }
/**-shopping cart--**/
.promo-detail ul.field { display: inline-block; background:rgba(76,158,217,.2);  border-bottom: solid 1px #fff; }
ul li.promo-name{width: 25%; padding-left:5%;}
ul li.promo-type{width: 15%; }
ul li.promo-amount{width:8%;}
ul li.promo-zone{width: 50%;}
ul li.promo-zone span{width:32%; display: inline-block;}
ul li.promo-zone span.zone{width:64%!important;}
}
