.xtiper_icon{
top:50% !important;
   transform: translateY(-50%); 
}

.xtiper_btnbor{
display: none !important;
}

.xtiper_main{
height: auto !important;
border-radius: 4px;
/* overflow: hidden; */
}

.xtiper_btn li button{
background-color: #FA6E07 !important;
color: #fff !important;
}

.xtiper_btn li.xactive button{
background-color: #fff !important;
color: #222 !important;
}

/* 购物车列表 */
.cartLists {
width: 100%;
}

.cartList {
width: 100%;
padding: 20px 30px;
background-color: #FAFAFA;
border: 1px solid #EDF1F2;
border-radius: 10px;
margin-top: 10px;
box-sizing: border-box;
padding-left: 25px;
}

.cartList .cartTit {
font-size: 24px;
font-weight: 700;
display: flex;
align-items: center;
justify-content: space-between;
color: #333;
}

.cartList .cartPic {
font-size: 28px;
color: #FA6E07;
}


.cartList .goodsBox {
width: 100%;
margin-top: 10px;
display: flex;
}

.cartList .goodsBox:nth-child(1) {
margin-top: 0;
}

.keyChk,.keyChkAdd {
width: 20px;
height: 20px;
border: 1px solid #dcdfe6;
border-radius: 2px;
flex-shrink: 0;
margin-right: 15px;
cursor: pointer;
background-color: #fff;
}


.keyChk:hover,.keyChkAdd:hover{
border-color: #FA6E07;
}

.keyChk-active, .keyChkAdd-active{
border-color: #FA6E07;
}

.keyChk-active::before, .keyChkAdd-active::before{
content: "";
width: 100%;
height: 100%;
display: block;
background-image: url('data:image/svg+xml,%3Csvg%20t%3D%2217399931906688%22%20class%3D%22icon%22%20viewBox%3D%220%200%201024%201024%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20p-id%3D%228296%22%20width%3D%22200%22%20height%3D%22200%22%3E%3Cpath%20d%3D%22M1024%200v1024H0V0h1024z%20m-119.648%20206.848a66.88%2066.88%200%200%200-92.48%208.192L424.384%20668%20212.16%20419.84a66.88%2066.88%200%200%200-92.512-8.192%2062.88%2062.88%200%200%200-8.416%2090.112l262.72%20307.2c26.24%2030.72%2074.656%2030.72%20100.928%200l437.888-512a62.88%2062.88%200%200%200-8.416-90.112z%22%20p-id%3D%228297%22%20fill%3D%22%23FA6E07%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E');
background-size: 100%;
}


.keyChk-not, .keyChkAdd-not{
border-color: transparent !important;
background-color: transparent !important;
}

.keyChk-not::before, .keyChkAdd-not::before{
display: none !important;
}

.cartList .goodsBox .goodsImgBox {
/* width: 48%; */
width: 230px;
max-width: 320px;
margin-right: 30px;
flex-shrink: 0;
display: flex;
align-items: center;
}

.cartList .goodsBox .goodsImg {
width: 100%;
aspect-ratio: 1 / 1;
display: flex;
background-color: #fff;
border-radius: 10px;
overflow: hidden;
position: relative;
}

.cartList .goodsBox .goodsImg img {
width: 100%;
height: auto;
position: absolute;
top: 50%;
left: 0;
transform: translateY(-50%);
}

.cartList .goodsBox .goodsImg .soldBox{
width: 100%;
height: 100%;
background-color: #ffffff9f;
display: flex;
align-items: center;
justify-content: center;
position: absolute;
top: 0;
left: 0;
z-index: 2;
}

.cartList .goodsBox .goodsImg .sold{
width: 70px;
height: 70px;
border-radius: 35px;
background-color: #00000095;
display: flex;
flex-wrap: wrap;
align-content: center;
justify-content: center;
font-size: 13px;
color: #fff;
}

.cartList .goodsBox .goodsImg .sold span{
width: 100%;
display: block;
text-align: center;
}

.cartList .goodsBox .conTion span:nth-child(1){
word-break: break-all;
margin-right: 10px;
}


.cartList .goodsBox .chaBox {
display: flex;
justify-content: flex-end;
/* margin-bottom: 30px; */
}

.cartList .goodsBox .chaBox .icoBox {
width: 26px;
display: flex;
cursor: pointer;
}

.cartList .goodsBox .chaBox .icoBox svg {
width: 100%;
height: auto;
fill: #0000004D;
}

.cartList .goodsBox .chaBox .icoBox:hover svg {
fill: #E26A62;
}

.cartList .goodsBox .totEdBox {
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
position: absolute;
bottom: 20px;
left: 0;
}

.cartList .goodsBox .totBox {
color: #333;
font-size: 18px;
display: flex;
align-items: center;
}

.cartList .goodsBox .totBox span {
margin: 0 15px;
}

.cartList .goodsBox .totBox .arBut {
width: 28px;
height: 28px;
background-color: #fff;
color: #979797;
border-radius: 2px;
display: flex;
align-items: center;
justify-content: center;
box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.1);
cursor: pointer;
font-size: 26px;
}



.cartList .goodsBox .editBox {
width: 24px;
display: flex;
cursor: pointer;
margin-right: 20px;
}

.cartList .goodsBox .editBox svg {
width: 100%;
height: auto;
fill: #999999;
}

.cartList .goodsBox .editBox-active svg {
fill: #0862E4;
}


/* 老花镜加号 */
.cartList .goodsBox .goodsAdd {
width: 70px;
height: 70px;
margin: 0 auto;
border-radius: 50%;
font-size: 50px;
color: #FA6E05;
border: 1px solid #FFD4B3;
background-color: #fff;
box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.1);
box-sizing: border-box;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
}

/* 光学镜处方部分 */
.vimo {
color: #FA6E05;
display: flex;
align-items: center;
cursor: pointer;
margin-top: 6px;
}

.vimo .jtBox {
width: 10px;
display: flex;
margin-left: 2px;
}

.vimo .jtBox svg {
width: 100%;
height: auto;
}

.vimo-active .jtBox {
transform: rotate(180deg);
}

.vimoBox {
width: 100%;
display: none;
}

.preBox {
width: 100%;
border: 1px solid #E6E6E6;
background-color: #fff;
border-radius: 2px;
box-sizing: border-box;
display: flex;
font-size: 12px;
color: #333;
margin-top: 4px;
}

.preBox .pre-bg {
background-color:#F4F4F4 ;
}

.preBox .pre-b {
font-weight: 700;
}

.preBox .presc {
flex: 1;
display: flex;
flex-wrap: wrap;
}

.preBox .prism {
width: 45%;
box-sizing: border-box;
border-left: 1px solid #E6E6E6;
flex-shrink: 0;
display: flex;
flex-wrap: wrap;
}


.preBox .preTr {
width: 100%;
display: flex;
border-top: 1px solid #E6E6E6;
box-sizing: border-box;
}

.preBox .preTr:nth-child(1) {
border-top: none;
}

.preBox .preTd {
flex: 1;
box-sizing: border-box;
display: flex;
flex-wrap: wrap;
border-left: 1px solid #E6E6E6;
}

.preBox .preTd:nth-child(1){
border-left: none;
}

.preBox .preTdChd{
width: 100%;
height: 30px;
display: flex;
align-items: center;
justify-content: center;
border-top: 1px solid #E6E6E6;
text-align: center;
box-sizing: border-box;
}

.preBox .preTdChd:nth-child(1){
border-top: none;
}

.preBox .pre-item{
cursor: pointer;
position: relative;
}

.preBox .pre-item-active{
color: #0862E4;
text-decoration: underline;
}

.preBox .pre-item .xlkBox{
width: 62px;
max-height: 175px;
overflow: auto;
box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.2);
border-radius: 2px;
position: absolute;
top: 25px;
left: 50%;
transform: translateX(-50%);
display: none;
background-color: #fff;
z-index: 2;
}

.preBox .pre-item .xlkBox-active{
display: block;
}

.preBox .pre-item .xlkBox li{
width: 100%;
height: 25px;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
font-weight: 500;
font-size: 14px;
color: #666666;
cursor: pointer;
}

.preBox .pre-item .xlkBox li:hover{
background-color: #E4EFFF;
}

.preBox .pre-item .xlkBox .active{
background-color: #E4EFFF;
}


/* 购物车缺省页 */
.cart-not{
width: 100%;
height: 400px;
display: flex;
flex-wrap: wrap;
align-items: center;
align-content: center;
justify-content: center;
}

.cart-not img{
width: 28%;
height: auto;
}

/* 下方配饰推荐列表 */
.acceBox{
width: 100%;
margin-top: 20px;
padding: 0 45px;
box-sizing: border-box;
position: relative;
}

.acceBox .goodsImg{
overflow: hidden;
}

.acceBox .goodsImg img{
transition: 0.35s;
}

.acceBox .goodsImg img:hover{

transform: scale(1.05);
}

/* 轮播图左右滑动按钮 */
.goods-swiper .swiper-but {
width: 30px;
height: 30px;
border-radius: 50%;
background-color: #000000CC;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
z-index: 2;
}

.goods-swiper .swiper-but svg {
width: 14px;
height: auto;
}

.goods-swiper .swiper-but-prev {
position: absolute;
top: 50%;
left: 0px;
transform: translateY(-50%);
}

.goods-swiper .swiper-but-next {
position: absolute;
top: 50%;
right: 0px;
transform: translateY(-50%);
}



/* 购物车右方总结  Summary */
.sumBox {
width: 418px;
flex-shrink: 0;
padding: 20px 30px;
background-color: #FAFAFA;
border-radius: 0 0 10px 10px;
box-sizing: border-box;
position: sticky;
top: 100px;
margin-left: 20px;
}

/* Coupons输入框 */
.sumBox .couBox {
width: 100%;
height: 40px;
display: flex;
}

.sumBox .couBox .proBox {
flex: 1;
height: 100%;
background-color: #fff;
padding: 9px 12px;
border: 1px solid #979797;
/* border-right: none; */
box-sizing: border-box;
/* border-radius: 4px 0 0 4px; */
border-radius: 4px;

border-color: #333;
margin-right: 28px;
}


.sumBox .couBox-active .proBox{
border-color: #333;
}

.sumBox .couBox .proBox input {
width: 100%;
height: 100%;
color: #333;
font-size: 16px;
}

.sumBox .couBox .proBox input::placeholder {
color: #999;
}

.sumBox .couBox .apply {
padding: 0 12px;
width: auto;
height: 100%;
display: flex;
align-items: center;
flex-shrink: 0;
color: #fff;
background-color: #C1C1C1;
/* border-radius: 0 4px 4px 0; */
border-radius: 4px;
cursor: pointer;

/* background-color: #FA6E07; */
}

.sumBox .couBox-active .apply{
background-color: #FA6E07;
} 

.sumBox .couDBox .delTs{
font-size: 14px;
color: #fb2424;
margin-top: 6px;
}

.sumBox .supExpBox {
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
padding: 8px 0;
border: 1px solid #EFEFEF;
border-left: none;
border-right: none;
}

.sumBox .supExp {
display: flex;
align-items: center;
font-size: 12px;
color: #666;
}

.sumBox .supExp .icoBox {
width: 22px;
display: flex;
margin-right: 6px;
flex-shrink: 0;
}

.sumBox .supExp .icoBox img,
.sumBox .supExp .icoBox svg {
width: 100%;
height: auto;
}

.sumBox .supExpBox .xian {
width: 1px;
height: 20px;
max-height: 100%;
background-color: #CBCBCB;
margin: 0 15px;
}

.sumBox .disBox {
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
color: #333;
padding: 15px 0;
border-bottom: 1px solid #E7E7E7;
}

.sumBox .paypalBox {
width: 72px;
margin-right: 8px;
padding: 6px;
box-sizing: border-box;
flex-shrink: 0;
border: 1px solid #EDEDED;
border-radius: 4px;
overflow: hidden;
display: flex;
}

.sumBox .paypalBox img {
width: 100%;
height: auto;
}

.sumBox .actiBox {
width: 100%;
border-radius: 10px;
}

.sumBox .actiBox .acti {
width: 100%;
text-align: center;
padding: 10px 0;
color: #333;
margin-bottom: 15px;
background-color: #feeacf;
border-radius: 4px;
}

.sumBox .actiBox .acti .actiText{
color: #FA6E07;
}

.sumBox .actiBox .acti .actiBarBox{
width: 80%;
position: relative;
height: 4px;
background-color: #DDDFE7cc;
border-radius: 2px;
overflow: hidden;
}

.sumBox .actiBox .acti .actiBar{
width: 0%;
height: 4px;
background-color: #FA6F06;
border-radius: 2px;
transition: width .3s ease;
}

/* 下方加购更多链接 */
.moreUrl{
color: #979797;
cursor: pointer;
text-decoration: underline;
}

.moreUrl:hover{
color: #FA6E05;
}

/* 上方活动提示语 */
.buytsy{
width: 95%;
height: 30px;
border: 1px solid #FA6E05;
color: #FA6E05;
border-radius: 10px;
display: flex;
justify-content: center;
align-items: center;
}

.buytsy span{
font-size: 18px;
color: #E26A62;
margin-left: 5px;
}

/* 下方广告图 */
.operPos{
width: 100%;
border-radius: 4px;
margin-top: 15px;
overflow: hidden;
display: flex;
cursor: pointer;
}

.operPos img{
width: 100%;
height: auto;
}