@import url(../common.css);

/* 定义颜色变量 */
:root{
    --main-color : #b59e6a;
    --deep-color : #7f6427;
    --price-red  : #FF4C4C;
}

/* 头部模块 */
header{ filter:progid:DXImageTransform.Microsoft.gradient(enabled='true',startColorstr='#F2FFFFFF', endColorstr='#F2FFFFFF');background:rgba(255,255,255,0.95);overflow: hidden; position: relative;height:2.4rem; z-index:2; box-sizing: border-box; }

header.search{padding:0 0.85rem;}
header.search .posting .modePic{display:block; width:2rem; height:2rem; overflow: hidden; background:url(../../img/shop/modePic.png) no-repeat 50% 50%; background-size: 90%; margin-left: 0.5rem}
header.search .posting .modeList{display:block; width:2rem; height:2rem; overflow: hidden; background:url(../../img/shop/modeList.png) no-repeat 50% 50%; background-size: 90%; margin-left: 0.5rem}

header.fixedTop,
header.hideHeaderScrollShow{position: fixed; top:0; width: 100%; z-index: 999; }

header.base .left{position: absolute; left: 0.85rem;}
header.base .left .wModel{padding:0.2rem 0.5rem; border-radius: 10rem;border:1px solid #ddd; background: #fff}
header.base .left .wModel .miaoguan {display: block; width: 1rem; height: 0.85rem; background: url(../../img/common/miaoguan.png) no-repeat 50% 50%; background-size: 90%; margin-right: 0.2rem;}
header.base .left .wModel p{font-size: 0.6rem; line-height: 0.8rem; color:#333;}


header.base .left .arrowLeft{ display:block; width:1.2rem; height:1.2rem; overflow: hidden; background:url(../../img/common/arrowLeftBlack.png) no-repeat; background-position: 50% 50%; background-size: 75%}
header.base .left .leftClosed{ display:block; width:1.2rem; height:1.2rem; overflow: hidden; background:url(../../img/common/closeBlack.png) no-repeat; background-position: 50% 50%; background-size: 75%}
header.base .txt{margin:0 5rem; overflow: hidden; text-align: center; font-size:0.9rem; color:#000; line-height: 2.4rem; text-overflow: ellipsis; white-space: nowrap; word-break: break-all;}
header.base .right{position: absolute; right:0.85rem;}
header.base .right .rightText{font-size:0.65rem;line-height: 1rem; color:var(--main-color)}
header.base .right .rightWeChatSkip {font-size:0.65rem;line-height: 1rem; color: #666; padding-right: 0.5rem; border-right: solid 1px #DDD; box-shadow: 1px 0 0 rgba(255,255,255,0.5); margin-right: 0.5rem}
header.base .right .rightWeChatSkip.noBorder{padding-right:0; border-right: 0;margin-right: 0; box-shadow: none}
header.base .right .rightWeChatSkip i{display:inline-block; vertical-align: top; width:1rem; height:1rem; overflow: hidden; background-repeat: no-repeat; background-position: 50% 50%;}
header.base .right .rightWeChatSkip i.goBack{background-image:url(../../img/common/goBack.png); background-size: 75%;}
header.base .right .rightWeChatSkip i.gotoUser{background-image:url(../../img/common/gotoUser.png); background-size: 75%;}
header.base .right .rightWeChatSkip i.gotoOrders{background-image:url(../../img/common/gotoOrders.png); background-size: 75%;}

/* 微信头 */
header.wechatHeader{ position: relative;  }
header.wechatHeader .left{position: absolute; left: 0.85rem;padding:0.2rem 0.5rem; border-radius: 10rem;border:1px solid #ddd; background: #fff}
header.wechatHeader .left .miaoguan {display: block; width: 1rem; height: 0.85rem; background: url(../../img/common/miaoguan.png) no-repeat 50% 50%; background-size: 90%; margin-right: 0.2rem;}
header.wechatHeader .left p{font-size: 0.6rem; line-height: 0.8rem; color:#333;}
header.wechatHeader.showWeChatScrollHeader{position: fixed; top:0; width: 100%; z-index: 99; display: none;}

/* 微信中特殊显示 */
html .only-weixin {display:none!important;}
html.wechat .only-weixin{display:flex!important;}
/* html.wechat header.base{display:none;} */
html.wechat header {background-color: #f8f9fa;}
html.wechat .cModel,
html.wechat header .txt{display: none;}
html.wechat header.wechatHeader{display: flex;}

/*小程序中特殊显示*/
html .only-weixin {display:none!important;}
html.miniprogram header {background-color: #f8f9fa;}
/*html.miniprogram .cModel,*/
html.miniprogram header .txt{display: none;}
html.miniprogram header.wechatHeader{display: flex;}
html.miniprogram .miniprogram-hide{display: none!important}
html.miniprogram .miniprogram-show{display: block!important}
/* 搜索框模块 */
.searchBox {height:1.7rem; overflow: hidden; background:#f3f3f3;border-radius: 100px}
.searchBox .magnifier{display:block; width:0.9rem; height:0.9rem; overflow: hidden; background:url(../../img/common/search.png) no-repeat; background-position: 50% 50%; background-size:100%;margin:0 0.3rem 0 0.5rem;}
.searchBox .searchInp,
.searchBox .inputSearch{height:1.2rem; overflow: hidden; border:none; margin: 0; padding: 0; text-align: left; border-radius: 0; font-size:0.7rem; color:#333; line-height: 1.2rem; background:transparent; margin-right: 0.6rem;}
.searchBox .searchInp .placeholder{color: #CCC;}
.searchBox .clearInp{display: none; width: 0.85rem; height: 0.85rem; background: url(../../img/common/closeCircleBlack.png) no-repeat 50% 50%; background-size: 80%;}
.searchBox .inputSearch:valid + .clearInp {display: block;}
.searchBox .searchInp .value { display: inline-block; max-width: 10rem; text-overflow: ellipsis; white-space: nowrap; word-break: break-all; overflow: hidden; vertical-align: top; background-color: #999; padding-left: 0.4rem; color:#FFF; font-size: 0.7rem; line-height: 1.2rem; border-radius: 0.6rem; margin-right: 0.25rem;}
.searchBox .searchInp .value .clearInp { display: inline-block; vertical-align: top; width: 1.2rem; height: 1.2rem; background: url(../../img/common/closeWhite.png) no-repeat 50% 50%; background-size: 40%;} 

/*搜索页*/
.searchPage{position: fixed;left:0;right:0; top:0;bottom: 0; background:#fff; z-index:201;}
.searchPage .header{padding:0 0.85rem; height:2.4rem; overflow: hidden; border-bottom:1px solid #E9E9E9; box-sizing: border-box;}
.searchPage .header .cancel{font-size:0.8rem; color:#999;line-height: 1rem; margin-left: 0.45rem}
.searchPage .historyUl{padding:0 0.85rem;}
.searchPage .historyUl .items{border-bottom:1px solid #E9E9E9; padding:0.65rem; overflow: hidden;}
.searchPage .historyUl .items .history{display:block; width:0.65rem; height:0.65rem; overflow: hidden; margin-right: 0.5rem; background:url(../../img/shop/time.png) no-repeat; background-position: 50% 50%; background-size: cover}
.searchPage .historyUl .items .closed{display:block; width:0.5rem; height:0.5rem; overflow: hidden; margin-left: 0.5rem; background:url(../../img/common/close.png) no-repeat; background-position: 50% 50%; background-size: cover}
.searchPage .historyUl .items p{height:0.95rem; font-size:0.7rem; color:#333;line-height: 0.95rem;overflow: hidden; text-overflow: ellipsis; white-space: nowrap; word-break:break-all;}
.searchPage .trushHistory{ width:100%; height:3rem ;text-align:center; font-size:0.7rem; color:#999;line-height: 3rem;overflow: hidden; box-sizing: border-box; }


/* bar */
.toolsBar{height: 2.4rem; box-sizing: border-box; position: fixed; z-index: 1200; left: 0;right: 0; bottom: 0; background: rgba(255,255,255,0.95); border-top:1px solid #eee}
.toolsBar .item{height: 2.4rem}
.toolsBar .item p{font-size: 0.5rem; line-height: 0.7rem; color: #666; display: block; text-align: center; margin-top:0.15rem;}
.toolsBar .item i{display: block; width:1.2rem; height: 1.2rem; overflow:hidden; margin:0 auto; background-repeat: no-repeat; background-position: 50% 50%; background-size: cover}
.toolsBar .item i.gotoIndex{background-image:url(../../img/template_yhd/goods/bar/icon_shop1.png)}
.toolsBar .item i.gotoGoods{background-image:url(../../img/template_yhd/goods/bar/icon_shop2.png)}
.toolsBar .item i.gotoCart{background-image:url(../../img/template_yhd/goods/bar/icon_shop3.png)}
.toolsBar .item i.gotoOrder{background-image:url(../../img/template_yhd/goods/bar/icon_shop4.png)}
.toolsBar .item.checked i.gotoIndex{background-image:url(../../img/template_yhd/goods/bar/icon_shop1Checked.png)}
.toolsBar .item.checked i.gotoGoods{background-image:url(../../img/template_yhd/goods/bar/icon_shop2Checked.png)}
.toolsBar .item.checked i.gotoCart{background-image:url(../../img/template_yhd/goods/bar/icon_shop3Checked.png)}
.toolsBar .item.checked i.gotoOrder{background-image:url(../../img/template_yhd/goods/bar/icon_shop4Checked.png)}
.toolsBar .item.checked p{color:var(--main-color)}

/* 切换卡 */
.switchCard{padding: 0; background:rgba(255,255,255,1); border-bottom: 1px solid #eee;}
.switchCard ul {overflow:hidden; margin:0;}
.switchCard ul .item a {height:2.25rem; line-height: 2.25rem;font-size:0.7rem;color:#333;}
.switchCard ul .item a .arrow {display: inline-block; width:0.5rem; height:0.5rem; overflow: hidden; background: url(../../img/shop/default.png) no-repeat 50% 50%; background-size: cover; margin-left: 0.25rem}
.switchCard ul .item a .arrow.top{background: url(../../img/template_yhd/goods/default_top.png) no-repeat 50% 50%; background-size: cover;}
.switchCard ul .item a .arrow.down{background: url(../../img/template_yhd/goods/default_down.png) no-repeat 50% 50%; background-size: cover;}
.switchCard ul .item .line { display: none; width: 1.6rem; height: 0.1rem;  background: var(--main-color)}
.switchCard ul .item.checked .line { display: block;}

/* 暂无数据 */
.noData{position: fixed; left: 0;right: 0;top: 0;bottom: 0; background:#fff ;}
.noData p{display: block; margin:0 0.8rem; overflow: hidden;line-height: 1rem; font-size: 0.8rem; color: #ccc;}
.noData .noImg{display: block; width: 7rem; height: 7rem; overflow: hidden; margin-bottom: 0.5rem}
.noData .noImg.t1{background: url(../../img/common/noData.png) no-repeat; background-position: 50% 50%; background-size: cover}

/* 动画划入 */
.touchMask{position: fixed; left: 0; right: 0; top: 0; bottom: 0; z-index: 999;}
.touchMask .touchMaskBg{position: absolute; left: 0;right: 0; top: 0;bottom: 0; background:rgba(0,0,0,0.6);}
.touchMask .touchContent{display: block; position: absolute; top: 0; bottom: 0; left: 0; right: 0; background: #fff;z-index: 1001; }
.touchMask .touchZoomContent{position: absolute;top: 50%;left: 50%;background: #fff;box-shadow: -0.25rem 0 0.2rem rgba(0,0,0,0.2);border-radius: 0.3rem;}

.touchMask .bottomInCommon{border-radius: 0.25rem 0.25rem 0 0; top:auto;}
.bottomInCommon .close{position: absolute; width: 1rem; height: 1rem; background: url(../../img/common/closeCircleGrey.png) no-repeat; background-position: 50% 50%; background-size: cover; margin:0.4rem; top:0.2rem;right: 0rem}

.touchMask .bottomInSelect{border-radius: 0.25rem 0.25rem 0 0; top:auto; background-color: #F1F2F3}
.bottomInSelect .selectUl{ padding: 0.25rem 0 0; margin-bottom: 0.4rem; border-radius: 0.25rem 0.25rem 0 0; box-sizing: border-box; background-color: #FFF; overflow: hidden;}
.bottomInSelect .selectUl .item { padding: 0.625rem 0; overflow: hidden; position: relative; text-align: center; border-bottom: solid 1px #EEE; box-sizing: border-box;}
.bottomInSelect .selectUl .item p{ padding: 0; margin: 0; font-size:0.75rem; color:#333; line-height: 1rem; width:100%; height:1rem; overflow: hidden; text-overflow: ellipsis;white-space: nowrap; word-break:break-all;}
.bottomInSelect .selectUl .item p .sub-title{ display: block; margin-left:0.2rem; font-size: 0.55rem;}
.bottomInSelect .selectUl .item.checked p {color:#b59e6a;}
.bottomInSelect .selectBtn { background-color: #FFF; padding: 0.7rem 0; overflow: hidden;}
.bottomInSelect .selectBtn p.cancel { color:#666; font-size: 0.8rem; line-height: 1rem; height: 1rem; width: 100%; text-align: center;}


/* 加减组件 */
.number{display: -webkit-box; display: -webkit-flex; display: -ms-flex; display: flex; flex:1; -ms-flex:1; -webkit-box-flex:1;}
.number a{display: block; width: 1.3rem; height: 1.3rem; border: 1px solid #ccc;  box-sizing: border-box; border-top-left-radius: 100px; border-bottom-left-radius:100px}
.number a:nth-child(2){width: auto; border:none }
.number a:nth-child(3){ border-top-right-radius: 100px; border-bottom-right-radius:100px;border-top-left-radius: 0;border-bottom-left-radius: 0}
.number a em{ display: block; width: 100%; height: 100%; border-radius: 100%;}
.number a .points{ display:inherit;width: 1.8rem; height: 1.3rem; line-height: 1.3rem; border:1px solid #ccc; border-left: 0;border-right: 0; font-size: 0.7rem; color: #232326; text-align: center; box-sizing:border-box }
.number a.minus em{ background: url(../../img/common/value_minus.png) no-repeat; background-position: 50% 50%; background-size: 40% }
.number a.add em{ background: url(../../img/common/value_add.png) no-repeat; background-position: 50% 50%; background-size: 40% }
.number a em.unable{background-color: #F0F0F0; opacity: 0.3}


/* 点击图片划入 */
.cImg{position: absolute; top:2.4rem; left: 0; right: 0; bottom: 0; overflow: hidden; background: #000}
.cImg li{display: block; width: 100%; overflow: hidden;}
.cImg li img{width: 100%;}
.swipeClosed{position: absolute; top:0.6rem; right: 0.6rem; z-index: 999}
.swipeClosed i{display: block; width: 1rem; height: 1rem; background: url(../../img/common/closeCircleGrey.png) no-repeat; background-position: 50% 50%; background-size: cover;}
.swipeWrapIndex { position: absolute; z-index: 10; right: .8rem; bottom:0.6rem; width: 2rem; height: 1rem; text-align: center; border: 1px solid rgba(0,0,0,0.15); border-radius: 100px; box-sizing: border-box; background-color: rgba(255,255,255,0.90); font-family: "Arial"; font-size: 0.7rem; line-height: 0.95rem; color: #333}
.swipeWrapIndex .swipePaginationCurrent { font-size: 0.7rem; line-height: 0.95rem; color: #000;}
.swipeWrapIndex .swipePaginationTotal { font-size: 0.5rem; line-height: 0.95rem; color: #333;}

/* 幻灯插件 */
.commonSwipeModel{overflow: hidden;}
.commonSwipeModel .goodsDetailPic{display: block;height: auto; overflow: hidden;}
.commonSwipeModel .goodsDetailPic img{display: block; width: 100%;}


/* 下单进度条 */
.ordersTipsStep{background: #fff; border-bottom: 1px solid #eee;}
.ordersTipsStep .progress{display: block; width: 100%; height: 3.25rem; overflow: hidden;}
.ordersTipsStep .progress .item{position: relative;}
.ordersTipsStep .progress .item p{font-size: 0.7rem; line-height: 1rem;color: #999999; overflow:hidden;margin:0.55rem auto 0.55rem;}
.ordersTipsStep .progress .item em{display: block; width: 100%; height: 0.1rem; background: #ccc;position: relative;}
.ordersTipsStep .progress .item em i{display: block; width: 0.45rem; height: 0.45rem; overflow:hidden;border:0.1rem solid #fff; border-radius: 100%; position: absolute; left: 50%;top:50%; margin-left: -0.325rem; margin-top:-0.325rem; background: #ccc;box-sizing: content-box; z-index: 2;}
.ordersTipsStep .progress .item.checked p{color:var(--main-color)}
.ordersTipsStep .progress .item.checked em i{ background: var(--main-color);}
.ordersTipsStep .progress .item.checked em::before{content:""; width: 50%; height: 0.1rem; background: var(--main-color); display: block;}
.ordersTipsStep .progress .item.checked em::after{content:""; width: 100%; height: 0.1rem; background: var(--main-color); display: block; position: absolute; right: 50%; top:0;  }
.ordersTipsStep .progress .item:last-child.checked em::after{width: 150%; right: 0;}


/* 付款页显示信息 */
.payShowInfo{margin-top: 0.35rem; background: #fff;}
.payShowInfo .actPay{padding:1rem 0.85rem 0.75rem 0.85rem ; overflow: hidden; text-align: center;}
.payShowInfo .actPay dt{font-size: 0.8rem; color:#333; line-height: 1rem;}
.payShowInfo .actPay .price{margin: 1rem 0; font-size: 1.2rem; color:var(--price-red);}
.payShowInfo .actPay .price em{font-size: 1rem;}
.payShowInfo .actPay .orderNum{ font-size: 0.5rem; color:#999; line-height: 0.7rem;}
.payShowInfo .actPay .cuntdown{font-size: 0.6rem; color:var(--main-color); margin-top: 0.2rem;line-height: 0.7rem;}
.payShowInfo .actPay .cuntdown em{margin: 0 0.15rem;}

.payList{padding:0.45rem 0.85rem; overflow: hidden; background: #fff; margin-top: 0.35rem;}
.payList .payIcon{display: block; width: 1.8rem; height: 1.8rem; overflow:hidden; margin-right: 0.3rem}
.payList .payIcon.wx{background:url(../../img/common/zf2.png) no-repeat; background-size:cover; background-position:50% 50%; }
.payList h1{font-size: 0.7rem; color: #333; line-height: 1rem;overflow:hidden;}
.payList p{font-size: 0.55rem; color: #999; line-height: 0.7rem; margin-top:0.1rem;}
.payList .selectBox{display: block; width: 0.9rem; height: 0.9rem; overflow:hidden; background:url(../../img/template_yhd/checkbox.png) no-repeat; background-size:cover; background-position:50% 50%; margin-left: 0.6rem; }
.payList .selectBox.checked{background:url(../../img/template_yhd/checkboxCheck.png) no-repeat; background-size:cover; }

/* 一行按钮 */
.oneLineBtn{margin:1.25rem 0.85rem 0rem;overflow: hidden;height:2.2rem;line-height:2.2rem;text-align: center; font-size:0.9rem; background:#e8e8e8; color:#CCC;border-radius:100px;}
.oneLineBtn.ok{color:#fff;background:var(--main-color);}

/* 分享 */
.shareModel{padding:0.7rem 0.85rem; background: #f5f5f5;}
.shareModel .shareBtn{ height: 5rem; overflow: hidden; flex-basis: 25%;}
.shareModel .shareBtn .icon{ width: 2.7rem; height: 2.7rem; background: #fff; border-radius: 100%; margin: 0 auto 0.4rem;}
.shareModel .shareBtn .txt{font-size: 0.6rem; text-align: center; line-height: 1rem; color:#666}
.shareModel .shareBtn .icon .copy{display: block; width: 1.2rem; height: 1.2rem; background: url(../../img/common/share/copy.png) no-repeat 50% 50%; background-size: cover;}
.shareModel .shareBtn .icon .ewm{display: block; width: 1.2rem; height: 1.2rem; background: url(../../img/common/share/ewm.png) no-repeat 50% 50%; background-size: cover;}
.shareModel .shareBtn .icon .ysj{display: block; width: 1.2rem; height: 1.2rem; background: url(../../img/common/share/ysj.png) no-repeat 50% 50%; background-size: cover;}

.ewmModel{position: fixed; left: 0; right: 0; top:0;bottom:0;z-index: 999}
.ewmModel canvas{display: none;}
.placeholder{color: #c9c9c9!important;}