body{
	background: rgba(242, 242, 242, 1.0);
}
/* clearfix */
.clearfix:after{ visibility:hidden; display:block; font-size:0; content:" "; clear:both; height:0;}
*html .clearfix{ zoom:1;}

.cardType{ margin-top:30px; padding: 0 0px; }
.cardType ul{
	display: flex; justify-content: space-between;
}
.cardType ul li{ display: flex; justify-content: center; position: relative; width: 25%;}
.cardType ul li i{ font-size:42px; font-weight: 500; }
.cardType ul li dd{ margin-right:20px; text-align: center; color: #cbcbce;}
.cardType ul li dd.gre{ color: #0abb75;}
.cardType ul li dd.blue{ color: #17528e;}
.cardType ul li dd h4{ font-size: 16px; font-weight: 500;}
.cardType ul li .right{ position:absolute; right:0; font-size: 30px; top: 10px; color: #e4d7ce; }

.cardList{ padding:0 0px; margin-top: 30px; min-height: 500px;}
.cardList .proLists{ background: #fff; padding: 20px;}
.proLists table input.select,.proLists table input.selectAll{ cursor: pointer; width:20px; height:20px; margin-right:10px; }
.proLists .shopname{ display:flex; margin-top:20px; }
.proLists .shopname input{ width:20px; height:20px; margin-right:10px; }
.proLists .shopname h4{ font-size:18px; font-weight:600; }
.proLists .listsc{ background:#f8f8f8; border-radius:10px; margin-top:10px; }
.cardList .list{ background:#fff; border-radius:6px; padding:20px; }
.proLists table tr{ border-bottom: 1px solid #e4e5ea; font-size: 16px; padding: 10px 0px;}
.proLists table tr:last-child{ border-bottom:none; }
.proLists table tr th{ padding:10px 0px; text-align: center; }
.proLists table tr td{ padding:10px 10px; }
.proLists .title{ display:flex; flex-wrap: wrap; padding:20px 20px 20px 20px; }
.proLists .title dd{ width:60px; margin-right:10px; }
.proLists .title dd img{ width:100%;}
.proLists .title dd:nth-child(2){ flex: 1;}
.proLists .title p{ display: block;}
.proLists .title p:nth-child(1){ height: 46px; line-height: 23px;}
.proLists .title p:nth-child(2){ font-size: 14px; color: #999;}
.proLists .price{ font-size:16px; font-weight:bold; text-align: center;}
.proLists .tax{ font-size:16px; font-weight:bold; text-align: center; }
.proLists .total{ font-size:16px; font-weight:bold; color:#f03b28; text-align: center; }
.proLists .quantity{}
.proLists .quantity input{ float: left; height: 40px; line-height:40px; width:50px; background: #f8f8f8; text-align:center; padding:0; border:none;  }
.proLists .quantity i{ float: left; cursor: pointer; background:#f3f4f9; font-size:24px; width:40px; height:40px; line-height: 40px; display: block; text-align: center; border-radius:30px; }
.proLists .del i{ cursor: pointer; text-align: center; line-height: 40px; background:#d8f5fd; display: block; font-size:18px; 
	width:40px!important; height:40px!important; border-radius:30px; color:#0 1abec; }
.total1{ font-size: 14px;}
.total1 span{ font-size: 16px; color:#f03b28; font-weight: bold;}
.total2{ font-size: 14px;}
.total2 span{ font-size: 18px; color:#f03b28; font-weight: bold;}
.proLists .remark{border-right: 1px solid #e4e5ea;}
.proLists .remark textarea{height: 100%; width: 100%; border-radius: 5px; border: none; padding:10px;}
.proLists select{ font-size: 14px;}


.coupon{ border: 2px dashed #17528e; margin-left: 20px; position: relative; padding: 5px 0px; width: 300px;}
.coupon select{ border: none; background: none; width: 100%;}

.subtotal { margin-top: 30px;}
.subtotal dl{ display:flex; justify-content: space-between; margin-bottom: 20px; }
.subtotal dl p{ color: #898989; font-size: 16px;}
.subtotal dl dd{ font-size: 24px; font-weight: bold;}
.subtotal dl a{ color:#17528e!important; font-size: 16px; margin-top: 30px;}
.subtotal dl a i{ margin-right: 5px;}
.subtotal dl button{ color:#fff!important; background: #17528e; line-height: 30px; padding: 10px 30px; border-radius:5px; border: none;}
.subtotal dl button:disabled{ background:#666; }
.subtotal dd{ margin-bottom: 20px;}
.subtotal dd span{ color: #17528e;}
.subtotal dd input{ margin-right: 5px;}
 
.shipping{ padding:0 100px; min-height: 500px; margin-top: 30px;}
.shipping h3{ font-size: 16px; font-weight: 400; margin-bottom: 10px; color: #666;}
.shipping h4{ font-size: 16px; font-weight: 600; margin-bottom: 10px; color: #333; display: flex; justify-content: space-between; margin-bottom: 10px;}
.shipping h4 a{ font-size: 14px; font-weight: 400;}

.shipping .shoppingInfo{ background:#fff; border-radius:6px; padding:20px;} 

.address{ border-bottom: 1px solid #ddd; padding-bottom: 20px;}
.address .layui-form-radio:hover *, .layui-form-radioed, .layui-form-radioed>i {color: #17528e!important;}

.address ul{ display:  flex; flex-wrap: wrap; justify-content: space-between;}
.address input{ width:20px; height:20px; margin-top:8px; margin-right:10px; }
.address ul li{ border: 1px solid #f3f4f9; margin-bottom: 10px; border-radius: 6px; width:100%; padding: 0px 20px; display: flex;}
.address ul li dd{ line-height: 35px;}
.address ul li dd span{ margin-left:30px; color:#17528e; }
.address ul li.click,.address ul li:hover{ border: #17528e 2px solid; cursor: pointer;}
.address ul li dl{ display: flex; line-height: 30px; font-size: 16px;} 
.address ul li .layui-form-radio {
    display: inline-block;
    vertical-align: middle;
    line-height: 28px;
    margin: 6px 0px 0 0;
    padding-right: 10px;
    cursor: pointer;
    font-size: 0;
} 
.address ul li dl label{ color: #ccc; margin-right: 10px;}



.proinfo {margin-top: 20px; border-bottom: 1px solid #ddd; padding-bottom: 20px;}
.proinfo .proLists th{ font-weight: 500;}

.invoice{ margin-top: 20px; border-bottom: 1px solid #ddd; padding-bottom: 20px;}
.invoice h4{ justify-content: left;}
.invoice h4 p{ font-size: 12px; font-weight: 500; line-height: 23px; margin-left: 10px; color:#17528e ;}
.invoice dd{ font-size: 14px; padding: 10px 20px; }
.invoice dd span{ margin-right: 20px;}
.invoice dd a{color: #0075ff;}

.orderTotal table{ width: 100%; margin-top: 20px;}
.orderTotal table td{ padding: 0px 10px; text-align: right; display: flex; justify-content: right; width: 100%;}
.orderTotal table td span{  line-height: 30px; color:#f03b28; font-weight: bold; display: block; width: 100px;}
.orderTotal .total{ line-height: 30px;}
.orderTotal .total span{ font-size: 24px;}


.pay{ padding:0 0px; min-height: 500px; margin-top: 30px; display: flex; }
.pay .paylist{flex: 1; margin-right: 20px; }
.pay .paylist .list{ background:#fff; border-radius:6px; padding:20px 0px; min-height: 300px; }
.pay .paylist h4{ font-size: 16px; font-weight: 500; border-bottom: 1px solid #ebedf2; line-height: 40px; padding: 0 20px;}
.pay .paylist ul{ display:  flex; justify-content: center; margin-top: 30px; padding: 0 20px;}
.pay .paylist ul li{ border: 1px solid #ebedf2; border-radius: 6px; padding: 20px 20px; margin-right: 20px;}
.pay .paylist ul li.click,.pay .paylist ul li:hover{ cursor: pointer; border: #17528e 2px solid;}
.pay .paylist ul li p{ text-align: center; font-size: 16px; line-height: 30px; font-weight: 500;}
.pay .paylist ul li img{ border-radius: 6px;}
.pay .paylist .xian{
	text-align: center; margin-top: 30px; margin-bottom: 50px; position: relative; font-size: 16px;
	padding: 0 20px;
}
.pay .paylist .xian::before{ content: ''; position: absolute; height: 1px; width: calc(50% - 20px); 
background: #ebedf2; top: 10px; left: 0;}
.pay .paylist .xian::after{ content: ''; position: absolute; height: 1px; width: calc(50% - 20px); 
background: #ebedf2; top: 10px; right: 0;}
.pay .paylist .balance{ text-align: center; font-size: 16px; color: #aaa;}
.pay .paylist .balance span{ font-weight: bold; color: #000;}
.pay .paylist .balance button{ margin-top: 20px; height: 40px; border-radius: 5px; background: #9fa5aa; color: #fff;
border: 0; padding: 0 20px;}
 
.pay .prolist{ width: 430px; background:#fff; border-radius:6px; padding:20px 0px; }
.pay .prolist h4{ font-size: 16px; font-weight: 500; border-bottom: 1px solid #ebedf2; line-height: 40px; 
padding: 0 20px; display: flex; justify-content: space-between;}
.pay .prolist h4 a{ font-size: 12px; background: #17528e; line-height: 20px; height: 20px; display: block;
	 width: 50px; text-align: center; color: #fff;border-radius: 5px; margin-top: 10px;
}
.pay .prolist .list{ padding: 10px 20px 0px 20px; margin-top: 10px;}
.pay .prolist .list dl{ border-top: 1px solid #ebedf2; display: flex; justify-content: space-between; line-height: 23px; padding: 10px;}
.pay .prolist .list dl.title{  border-bottom: 1px solid #ebedf2; line-height: 30px; font-weight: bold;}
.pay .prolist .list dl dd:nth-child(1){ margin-right: 20px;}
.pay .prolist .list dl span{ margin-left: 10px; font-weight: bold;}
 
.pay .prolist .total{ padding: 10px 20px;}
.pay .prolist .total dl{ border-top: 1px solid #ebedf2; display: flex; justify-content: space-between; line-height: 23px; padding: 10px;}
.pay .prolist .total dl dd:nth-child(1){ margin-right: 20px; font-weight: bold;}
.pay .prolist .total dl dd:nth-child(2){ font-weight: bold;}
.pay .prolist .coupon{ padding: 10px 20px; display: flex;}
.pay .prolist .coupon input{ border: 1px solid #ebedf2; width: calc(100% - 80px); padding: 0 10px; height: 40px; line-height: 40px; border-radius: 5px 0px 0px 5px;}
.pay .prolist .coupon button{ border: none; background: #17528e; border-radius: 0px 5px 5px 0px; width: 80px; color: #fff; font-size: 16px;}

.success{ background:#fff; min-height:300px; margin-top:30px; padding:50px 50px; text-align:center;}
.success dd{ text-align:left;}
.success dd i{ color:#0abb75; font-size:70px; margin-right: 10px; }
.success h4{  margin-bottom:10px; font-size: 16px; margin-top: 10px; }
.success a{ margin-right:20px; color:#17528e; margin-top:30px; }
.success .order{ display: flex; justify-content: space-between;}
.success .order dd{ display: flex;}
.success .order dd:nth-child(2){ line-height: 30px;}
.success .order dd:nth-child(2) span{ font-size: 24px; font-weight: bold; padding: 0 5px; color:#f03b28;}
.success .paytype{ display: flex; flex-wrap: wrap; margin-top: 50px; justify-content: center;}
.success .paytype dd{ width: 200px; height: 80px; margin-right: 20px; border-radius: 5px; display: flex; padding: 10px; border: 1px solid #ddd; cursor: pointer;}
.success .paytype dd:last-child{ margin-right:0; }
.success .paytype dd img{ height: 60px; margin-right: 20px;}
.success .paytype dd b{ font-size: 20px; line-height: 60px;}
.success .paytype dd:hover{ border: 2px solid #f03b28; background: url('../icon/active1.png') right bottom no-repeat; background-size: 25px 25px;}
.success .paytype dd.active{ border: 2px solid #f03b28; background: url('../icon/active1.png') right bottom no-repeat; background-size: 25px 25px;}


.wxpay{display: none;}
.payCon{display: flex; justify-content: center; text-align: center; align-items: self-start; margin: 50px auto;}
.payCon h1{ font-size: 26px; font-weight: bold; color:#F03B28; margin-top: 10px;}
.payCon .payQr{ width: 180px; margin-right: 100px;}
.payCon .payQr>div{ border: 3px solid #ccc ; padding: 10px; margin-top: 10px;}
.payCon .payQr dd{ display: flex; justify-content: center; margin-top: 10px;}
.payCon .payQr dd img{ width: 30px; height: 30px; margin-right: 10px; margin-top: 5px;}
.wxpaySuccess{ color:#fff!important; background: #F03B28; line-height: 30px; padding: 10px 30px; border-radius:5px; border: none;}
.wxpaySuccess:disabled{ background:#666; }

.balancepay{ margin-top:50px; line-height:35px; margin-bottom:50px; display:none; }
.balancepay .paypass input{ border-radius:5px; width: 200px; height:35px; padding: 0 10px; line-height:35px; border:#ccc 1px solid; }

.account{ display: none; padding:0 200px 50px 200px; margin-top:50px; border-bottom:1px solid #f1f1f1; }
.account p.tips{ background:#ff0; padding:10px 20px; line-height:25px; color:#f00; }
.account h5{ font-size:16px; margin-top:40px; margin-bottom:40px; }
.account div{ display:flex; width:100%; flex-wrap:wrap; margin-bottom:20px; font-size:15px; }
.account span.amount{ font-size: 24px; color: #F03B28;}
.account div label{ width:150px; color:#333; text-align:right; margin-right:20px; }
.account div p{ color:#999; font-size:14px; }
.account div span{ margin-bottom:5px; display:block; }
.account span.acc{ font-size:32px; font-weight:bold; }