﻿/*base*/
*{ margin:0; padding:0; word-break:break-all;}
body{ color:#333; font-family: "PingFang SC",Helvetica,Arial,"Hiragino Sans GB","Microsoft Yahei"; background:#fff; overflow-x:hidden;}
table{ border-collapse:collapse; border-spacing:0;}
h1, h2, h3, h4, h5, h6, b{ font-size:100%; }
ul, ol, dl, dt, dd, li{ list-style:none;}
em, i{font-style:normal;}
select { outline:none;}
mark{ background:none;}
input,textarea,select{ outline:none;}
input{-webkit-appearance: none; border-radius: 0;}
textarea {resize:none;}
a img{ border:0;}
a{ color:#333; text-decoration:none; }
a:active{ color:#333;}
.clearfix{ clear:both;}
.clearfix:after{ display:block; content:''; clear:both; visibility:hidden;}
header, nav, section, footer, article{ display:block;}
.left{ float:left;}
.right{ float:right;}
.f700{ font-weight:700;}
.f100{ font-weight:100;}
#tlbstoolbar,#_ta_qaz_wrap,#_dfghjkiutytyute{ display: none!important;}
.hide{display: none;}
.db{ display: block; text-indent: -999em;}
.aside-menu { display: none; }
aside.cover { display: none; }
.pr{position: relative;}
.pa{position: absolute;}
.cover{position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
hr{width: 100%; height: 10px; background-color: #f6f6f6; border: 0;}

/* header */
#header{width: 100%;background: #fff;}
.logo{position: relative;z-index: 100;height: 44px;padding-left: 10px;background: #492c1f;overflow: hidden;display: flex; align-items: center;}
.logo.clearfix::after{display: none;}
.logo_box{width: 80px;margin-right:7px;}
.logo_box a{display: flex;align-items: center;height: 100%;}
.logo_box img{width: 100%}
.header-breadcrumb{ flex: 1; height: 44px;line-height: 44px;font-size: 10px;color: #fff;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}
.header-breadcrumb em{display: inline-block;}
.header-breadcrumb span,.header-breadcrumb a{display: inline-block;padding: 0 2px;color: #fff;}
.logo-btn{height: 44px;font-size: 0; display: flex; align-items: center;}
.logo-btn .search-btn{float: left;width: 67px;height: 22px;line-height: 22px;background: #fff;border-radius: 5px;text-align: center;}
.logo-btn .search-btn span{display: inline-block;padding-left: 20px;font-size: 11px;color: #999;background: url(../../images/m-jewelry/index-icon.png) 0 -80px no-repeat;background-size: 50px 100px}
.logo-btn .menu-btn{float: right;width: 40px;height: 44px;background: url(../../images/m-jewelry/index-icon.png) 12px 15px no-repeat;background-size: 50px 100px;}
/* 搜索条自适应 */
.logo-adapt .header-breadcrumb{max-width: 155px;}
.logo-adapt .logo-btn .search-btn{min-width: 70px;width: auto;}

.nav{position: relative;width: 100%;height: 40px;background-color: #fff;     border-bottom: 1px solid #e5e5e5;}
.nav-bg {position: absolute;top: 0;left: 0;width: 100%;height: 100%;-webkit-box-sizing: border-box;box-sizing: border-box;border-bottom: 1px solid #ccc}
.nav-list{  position: absolute;top: 0;left: 0;width: 100%;height: 40px;overflow-x: scroll;overflow-y: hidden;}
.nav-list::-webkit-scrollbar {display:none}
.nav ul{padding: 0 7px;    width: fit-content; box-sizing: border-box; position: relative;white-space: nowrap;height: 40px;z-index: 0; display: flex;}
.nav ul li{height: 40px;min-width: 60px;line-height: 40px;text-align: center;}
.nav ul li a{display:block;position: relative;font-size: 15px;color: #000;}
.nav ul li.act a{font-size: 20px; font-weight: bold;}
.nav ul li.act a:after{content: '';position: absolute;width: 10px; bottom: 0;left: calc(50% - 5px);height: 3px;background: #733821}

/*footer*/
.foot_breadcrumb{background: url(../../images/m-jewelry/foot_bg.jpg) 0 0 repeat;color: #fff;}
.foot_breadcrumb .breadcrumb{background: url(../../images/m-jewelry/foot_bg.jpg) 0 0 repeat;color: #fff; border-color: #666;}
.foot_breadcrumb a{color: #fff;}
.foot_breadcrumb span { color: #999; }
#footer{ background:url(../../images/m-jewelry/foot_bg.jpg) 0 0 repeat-x; overflow:hidden;}
.foot{ max-width:330px; margin: 22px auto 0; padding-bottom:35px;}
.foot_link { display:block; font-size:14px; color:#b5b5b5; text-align:center;}
.foot_link a { display:inline-block; margin:0 10px;color:#b5b5b5; font-size:14px; vertical-align:middle;}
.foot_link a.act { color:#fff;}
.copyright {height: 15px; line-height: 15px; color:#b5b5b5; font-size:9px; text-align:center; font-family:Verdana, Geneva, sans-serif; letter-spacing:-1px;margin-top: 10px;}
/*rightcopy*/
.rightcopy{height: 73px; padding-top: 15px; background: url(../../images/m-jewelry/copyright-bg.png) repeat-x 0 0; background-size: 1px 104px;}
.skippc-wrap{width: 100%; height: 30px; line-height: 30px; text-align: center;}
.skippc{text-indent: 20px; display: inline-block; vertical-align: middle; color: #fff; font-size: 13px; background: url(../../images/m-jewelry/pc-icon.png) no-repeat 0 7px; background-size: 15px 13px;}
.rightcopy span{display: block; height: 25px; line-height: 25px; text-align: center; font-size: 11px; color: #fff;}

/*深色的导航 || 底部导航*/
.nav-deep .nav-bg{background-color: #2e2e2e; border-bottom: 1px solid #dcdcdc;}
.nav-deep .nav-list ul li a{color: #ffffff;}
/*深色的遮罩*/
.nav-deep .nav-shade-left{position: absolute; left: 0; top: 0; width: 30px; height: 40px;background:-webkit-linear-gradient(left, #2e2e2e 0%, rgba(0,0,0,0) 100%);background:-o-linear-gradient(left, #2e2e2e 0%, rgba(0,0,0,0) 100%);/*background:linear-gradient(to right, #2e2e2e 0%, rgba(0,0,0,0) 100%);*/}
.nav-deep .nav-shade-right{position: absolute; right: 0; top: 0; width: 30px; height: 40px;background:-webkit-linear-gradient(left, rgba(0,0,0,0) 0%, #2e2e2e 100%);background:-o-linear-gradient(left, rgba(0,0,0,0) 0%, #2e2e2e 100%);/*background:linear-gradient(to right, #2e2e2e 0%, rgba(0,0,0,0) 100%);*/}

/* -*- 分享 -*- */
.share{}
.layer_comm_bg_share{display: none;}
.share-inner{width: 100%; position: fixed; left: 0; bottom: -500px; z-index: 1002;}
.share-inner em{display: block; height: 42px; line-height: 42px; text-align: center; background-color: #eee; color: #313131; font-size: 18px; border-bottom: 1px solid #e5e5e5}
.share-inner ul{display: block; padding: 37px 20px; background-color: #eeeeee; border-top: 1px solid #fff;}
.share-inner ul li{float: left; width: 24.99%;}
.share-inner ul li span{position: relative; display: block; padding-left: 11px; padding-right: 11px;}
.share-inner ul li span a{display: block; position: absolute; left: 0; top: 0; z-index: 500; width: 100%; height: 100%;}
.share-inner ul li span img{vertical-align: top; width: 100%;}
.share-inner ul li span i{display: block; text-align: center; margin-top: 15px; font-size: 9px; color: #7d7d7d;}
.share-exit{clear: both; display: block; height: 47px; line-height: 47px; text-align: center; background-color: #dcdcdc; color: #ae7654; font-size: 18px;}
.share-tip{display: none; z-index: 9999; position: fixed; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.9);}
.tip-inner{position: absolute; left: 50%; top: 70px; margin-left: -173px; }
.share-wx{display: none; z-index: 9999; position: fixed; left: 0; top: 0; width: 100%; height: 100%;background:rgba(0,0,0,0.9) url(https://www.xbiao.com/images/wap3.0/tip-wx.png) no-repeat right top; background-size:290px 80px}


.appdowntop {position: fixed; left: 0; bottom: 0; z-index: 1001; width: 100%; height:55px; background: rgba(0,0,0,.8);display:none;}
.appdown-container{position: relative;width: 100%;height: 100%;}
.watch-appdown, .jew-appdown{width: calc(100% - 76px);height: 100%;padding-left: 76px;}
.watch-appdown{background:url(https://www.xbiao.com/images/wap3.0/watch-appdown.png) 26px 8px no-repeat; background-size:40px 40px; overflow: hidden;}
.jew-appdown{background:url(https://www.xbiao.com/images/wap3.0/jew-appdown.png) 26px 8px no-repeat; background-size:40px 40px;}
/*.linkappdown { position:absolute; top: 16px; right: 10px; height:23px; line-height:23px; border-radius: 3px; padding:0 5px; color:#010101; font-size:11px; z-index:2;background: #fff;}*/
.linkappdown { position: absolute; top:15px; right: 10px; height:22px; line-height: 22px; overflow:hidden;color:black;font-size:12px;background:white;border-radius:2px;padding:2px 4px;border:none;text-align: center;}
.appdowntop .box_h { display: none; -webkit-tap-highlight-color:rgba(255,0,0,0);}
.appdowntop em { display:block; line-height: 1.6; padding-top: 18px; font-size: 12px;color:#fff; float: left;}
.appdownclose { display:block; position:absolute; left:0; top:13px; width:26px; height:26px; background:url(https://www.xbiao.com/images/wap3.0/icoclosedown.png) center center no-repeat; background-size:7px 7px; z-index:3;-webkit-tap-highlight-color:rgba(255,0,0,0);} 
.appdown-pagination{position: absolute;left: 0;bottom: 6px;width: 100%;height: 5px;text-align: center;font-size: 0;}
.appdown-pagination span{display: inline-block;width: 5px;height: 5px;background: #b5b5b5;margin: 0 3px;border-radius: 50%;}
.appdown-pagination span.act{background: #fff;}



/* 品牌logo、名称、 简介 */
.brand-title{height: 49px;padding: 0 12.5px;line-height: 49px;border-bottom: 1px solid #dcdcdc;overflow: hidden;}
.brand-title em{display: inline-block;height: 49px;margin-right: 10px;}
.brand-title em a{display: block;position: relative;height: 49px;}
.brand-title em a img{position: relative;top: 50%;height: 90%;-webkit-transform: translateY(-50%);transform: translateY(-50%);}
.brand-title span{max-width: 175px;height: 49px;font-size: 14px;color: #000;overflow: hidden;}
.brand-title a.brand-show{display: block;height: 20px;padding: 0 5px;margin-top: 14.5px;line-height: 20px;border: 1px solid #ccc;font-size: 11px;border-radius: 5px;}

/* 侧面弹出框 */
.aside-box{}
.aside-box-bg{position: fixed;top: 0;left: 0;z-index: 99;;width: 100%;height: 100%;background: rgba(0,0,0,.6);display: none;}
.aside-container{position: fixed;top: 44px;right: 0;z-index: 999;width: 75%;height: 100%;background: #fff;padding: 0 5%;-webkit-box-sizing: border-box;box-sizing: border-box;-webkit-transform: translateX(100%);transform: translateX(100%);-webkit-transition: all .3s linear;transition: all .3s linear}
.aside-header{padding: 22.5px 0 25px 0;border-bottom: 1px solid #e5e5e5;}
.aside-header .unlogin{}
.aside-header .unlogin em{display: block;width: 58px;height: 58px;margin: 0 auto;background: url(../../images/m-jewelry/unlogin-logo.png) 0 0 no-repeat;background-size: 58px 58px;}
.aside-header .unlogin a{display: block;width: 160px;height: 37.5px;margin: 22.5px auto 0;line-height: 37.5px;text-align: center;font-size: 15px;color: #fff;background: #74381e;border-radius: 5px;}
.aside-header .login{display: none;}
.aside-header .login dt{width: 58px;height: 58px;border-radius: 50%;overflow: hidden;margin: 0 auto;}
.aside-header .login dt img{width: 100%;}
.aside-header .login .user-name{height: 20px;line-height: 20px;margin-top: 10px;line-height: 15px;color: #010101;text-align: center;}
.aside-header .login .user-level{margin-top: 5px;height: 12px;line-height: 12px;text-align: center;}
.aside-header .login .user-level span{display: inline-block;padding-left: 15px;background: url(../../images/m-jewelry/i_v.png) 0 0 no-repeat;background-size: 12px 10px;}
.aside-header .login .user-level span a{display: block;height: 10px;line-height: 10px;border: 1px solid #e5e5e5;border-radius: 3px;font-size: 9px;color: #959595;}
.aside-header .login .user-msg{height: 12px;margin-top: 10px;line-height: 12px;text-align: center;}
.aside-header .login .user-msg a{font-size: 9px;color: #010101;background: #f3f3f3;border-radius: 3px;padding: 0 5px;}
.aside-header .login .user-msg a em{color: #f00;}
.aside-content{padding: 20px 0;border-bottom: 1px solid #e5e5e5;}
.aside-content ul{margin-top: -20px;}
.aside-content ul li{float: left;width: 33%;height: 25px;margin-top: 20px;line-height: 25px;text-align: center;font-size: 15px;}
.aside-content ul li a{display: block;color: #010101;}
.aside-footer{display: -webkit-box;display: -webkit-flex;display: flex;justify-content: center;padding-top: 20px}
.applink{position: relative;width: 40%;padding: 5%;overflow: hidden}
.applink img{display: block;width: 70%;margin: 0 auto;}
.applink span{display: block;margin-top: 10px;line-height: 18px;font-size: 9px;color: #959595;text-align: center;}
.jew-link{display: none;}
.aside-box.act .aside-container{-webkit-transform: translateX(0);transform: translateX(0)}


 /* 2026底部打开app */
.foot_open_app { visibility: visible; position: fixed; bottom: 75px; width: 185px; height: 40px; left:50%; margin-left: -92.5px;box-shadow:0 0 5px 3px rgba(0,0,0,0.3);border-radius: 40px; z-index: 100;}
.foot_open_app_visible{ visibility: visible;}
.foot_open_link{ display: flex; width: 100%; height: 100%; background-color: #9a5d2c; color: #fff; line-height: 40px; font-size: 14px; text-align: center; border-radius: 40px; justify-content: space-evenly; align-items: center;}
.foot_open_link:active{ color: #fff;}
.foot_open_link::before{ content: ""; width: 85px; height: 29px; vertical-align: top; border-radius: 29px; display: inline-block; background: url(https://static.xbiao.com/images/wap3.0/app_launch_logo.png) white no-repeat center 5px; background-size: 65px auto;}




/* 小屏处理 */
@media screen and (max-width: 320px){
	.header-breadcrumb,.logo-adapt .header-breadcrumb{right: 115px;}
	.logo-btn .search-btn,.logo-adapt .search-btn{width: 70px;}
	.aside-header{padding: 12px 0;}
	.aside-content{padding: 10px 0;}
	.aside-content ul{margin-top: -10px;}
	.aside-content ul li{margin-top: 10px;}
	.aside-footer{padding-top: 10px;}
}

.pic-artcle-mix dd:after,.pic-artcle-mix .one:after{content: '';position: absolute; left: 0; bottom: 0;width: 100%; height: 1px;background:-webkit-linear-gradient(left, #fff 0%, #f5f5f5 10%,#f5f5f5 90%, #fff 100%);background:-o-linear-gradient(left, #fff 0%, #f5f5f5 10%,#f5f5f5 90%, #fff 100%);background:linear-gradient(to right, #fff 0%, #f5f5f5 10%,#f5f5f5 90%, #fff 100%)}
.border_bottom:after{content: '';position: absolute; left: 0; bottom: 0;width: 100%; height: 1px;background:-webkit-linear-gradient(left, #fff 0%, #f5f5f5 10%,#f5f5f5 90%, #fff 100%);background:-o-linear-gradient(left, #fff 0%, #f5f5f5 10%,#f5f5f5 90%, #fff 100%);background:linear-gradient(to right, #fff 0%, #f5f5f5 10%,#f5f5f5 90%, #fff 100%)}

/*fixed*/
.fixed{display: none; position: fixed; right: 12px; bottom: 100px; z-index: 999;}
.fixed ul{}
.fixed ul li{width: 35px; height: 35px; background-image: url(https://static.xbiao.com/images/wap3.0/float_top.png); background-size: 35px 35px;}
/*如果按钮*/
.fixed ul li.fixed-all{border-radius: 4px;}
/*如果多个按钮 上下两个分别*/
.fixed ul li.fixed-top{border-radius: 4px;}
.fixed ul li.fixed-bottom{border-radius: 0 0 4px 4px;}
/*返回顶部*/
.fixed ul li.fixed-go{background-position: 0 0;}
.fixed ul li.fixed-fav{background-position: 0 -42px;}
.fixed ul li.fixed-fav-act{background-position: 0 -84px;}
