.gcan-top{ background: #fff;}
.gcan-top .swiper-slide img{ width: 100%; height: 6.6rem;}
.gcan-top>.swiper-pagination{ bottom: .2rem !important; }
.gcan-top .swiper-pagination-bullet{ opacity: 1; background: #fff; width: .2rem; height: .2rem; margin: 0 .15rem !important; border-radius: .1rem; opacity: 0.4; }
.gcan-top .swiper-pagination-bullet-active{ width:.4rem; opacity: 0.8;}

.gcan-fast{ padding-left:.6rem; overflow: hidden;}
.gcan-fast > div{ width: 50%; float: left; padding-right: .6rem; box-sizing: border-box; margin-bottom: .6rem; }
.gcan-fast a{ display:block; height:4.4rem; box-sizing: border-box; padding:0 .7rem .25rem .4rem;display: box; display: -webkit-box; -webkit-box-orient: vertical; -webkit-box-pack: center; display: flex; flex-direction: column;  justify-content: center; box-sizing:border-box; border-radius:.5rem; color:#666; font-size:.5rem;}
.gcan-fast a h4{ font-size:.75rem; color:#000; font-weight:bold;}
.gcan-fast .tag{ display:inline-block; width:1.5rem; text-align:center; line-height:.7rem; font-size:.5rem; border-radius:.1rem .5rem .5rem .4rem; margin-top:.2rem; color:#ff5133; border:1px solid #ff5133}
.bjmenu-col1 { background: url(../images/menu-bg1.png) center  no-repeat; background-size: 100% 100%;}
.bjmenu-col2 { background: url(../images/menu-bg2.png) center  no-repeat; background-size: 100% 100%;}

.gcan-nav>.swiper-pagination{ bottom: 0 !important; }
.gcan-nav .swiper-pagination-bullet{ opacity: 1; background: #1589f2; width: .2rem; height: .2rem; margin: 0 .15rem !important; border-radius: .1rem; opacity: .4; }
.gcan-nav { padding: 0 .6rem;}
.gcan-nav .nav-scrollbar { position: absolute; left: 50%; bottom: 1%; z-index: 50; width: 1rem; height: .2rem; border-radius: 10px; background: #eeeeee; margin-left: -.5rem;}
.gcan-nav .swiper-scrollbar-drag { background: #1589f2;}
.gcan-nav .swiper-pagination-bullet-active{ opacity: 1; }

.nav-row{ overflow:hidden;}
.nav-row a { display: inline-block; vertical-align: top; width: 100%; text-align:center; font-size: .6rem; color:#000; font-weight:bold; padding:.6rem 0;}
.nav-row a img{width: 1.75rem;height: 1.75rem;}

.gcan-div{ margin-left:.6rem; margin-right:.6rem; background:#fff; border-radius:.5rem; box-shadow:0 0 10px rgba(0,0,0,.07);}
.gcan-tit{ line-height:2.4rem; padding:0 .6rem; font-size:.8rem; color:#000; font-weight:bold; border-bottom:1px solid #f1f1f1;}
.gcan-tit a{ float:right; font-weight:normal; font-size:.65rem; color:#666;}
.gcan-tit a:after{ content:''; display:inline-block; width: 7px; height: 7px; border: solid #666; border-width: 1px 1px 0 0; -webkit-transform: rotate(45deg); transform: rotate(45deg); margin-left:.25rem;}

.gcan-sev > div{ float:left; width:50%; position:relative; box-sizing:border-box; height:3.6rem;display: box; display: -webkit-box; -webkit-box-orient: vertical; -webkit-box-pack: center; padding:0 .2rem 0 2.7rem; font-size:.55rem; color:#666; border-right:1px solid #f1f1f1; border-top:1px solid #f1f1f1;}
.gcan-sev > div img{ width:1.9rem; height:1.9rem; position:absolute; left:.5rem; top:50%; margin-top:-.95rem;}
.gcan-sev > div h4{ font-size:.75rem; color:#000; font-weight:bold; margin-bottom:.15rem;white-space: nowrap;overflow:hidden;text-overflow: ellipsis;}
.gcan-sev > div p{white-space: nowrap;overflow:hidden;text-overflow: ellipsis;}
.gcan-sev > div:nth-child(2n){ border-right:none;}
.gcan-sev > div:first-child, .gcan-sev > div:nth-child(2){ border-top:none;}
.new-sev > div img{width: 1.75rem;height: 1.75rem;margin-top: -0.9rem;}

.char-list li { position: relative; display: flex; align-items: center; padding: .8rem .7rem;}
.char-list li::after { content: ''; position: absolute; left: 5.9rem; bottom: 0; right: 0; height: 1px; background: #EEEEEE;}
.char-list li:last-child::after { display: none;}
.ch-key { width: 4.5rem; height: 3rem; margin-right:.6rem;}
.ch-key img{ width:100%; height:100%; border-radius:.3rem;}
.ch-info { flex: 1; font-size: .6rem; color:#999; line-height:1.2;}
.ch-info h4{ line-height: 1.2; margin-bottom: .4rem; font-size:.8rem; color:#000; font-weight:bold;}

.card-bot{ height:calc(2.4rem + constant(safe-area-inset-bottom));height:calc(2.4rem + env(safe-area-inset-bottom));}
.card-bot > div{ width:100%; height: 2.4rem; background:#fff; position:fixed; left:0; bottom: 0; z-index:80; box-shadow:0 0 10px rgba(0,0,0,.1); display:-webkit-box;padding-bottom: constant(safe-area-inset-bottom);padding-bottom: env(safe-area-inset-bottom);}
.card-bot > div a{ display:block; -webkit-box-flex:1; width:1px; text-align:center; font-size:.5rem; color:#666;display: box; display: -webkit-box; -webkit-box-orient: vertical; -webkit-box-pack: center;}
.card-bot > div a.curr{ color:#1380e9;}
.card-bot > div a .iconfont{ font-size:1rem; line-height:1.2;}
.card-bot > div a img{ width: 1.15rem;margin-top: 0.15rem;margin-bottom: 0.15rem;}

.mask{width: 100vw;min-height: 100vh;position: fixed;top: 0;background-color: rgba(0,0,0,0.5);left: 0;z-index: 99}

.pop-bjing-appoint { position: fixed; left: 50%; top: 50%; z-index: 100; width: 88%; background: linear-gradient(to bottom, #B9D6FF 0%,#fff 100%) no-repeat 0 0 #fff; background-size: 100% 2.75rem; border-radius: .5rem; padding: .5rem 0 0; transform: translate(-50%,-50%); box-sizing: border-box;}
.pop-bjing-appoint .appoint-tit { padding: .75rem 0; line-height: 1.1; text-align: center; font-size: .9rem; font-weight: bold; color: #000000;}
.pop-bjing-appoint .appoint-des { line-height: 1.6; padding: 0 1rem; margin-bottom: .65rem; font-size: .8rem; color: rgba(0, 0, 0, .8);}
.pop-bjing-appoint .appoint-phone { display: flex; align-items: center; background: #EFF5FF; border-radius: .5rem; padding: .8rem 1.1rem; margin: 0 1rem .75rem;}
.pop-bjing-appoint .appoint-phone .phone-ico { display: block; width: 1.85rem; height: 1.85rem; background: url('../images/ico-phone.png') no-repeat 0 0; background-size: 100% 100%; margin-right: .6rem;}
.pop-bjing-appoint .appoint-phone .phone-cont { flex: 1;}
.pop-bjing-appoint .appoint-phone .phone-cont .tit { line-height: 1.2; margin-bottom: .35rem; font-size: .75rem; color: #666666;}
.pop-bjing-appoint .appoint-phone .phone-cont .num { line-height: 1.1;  font-size: .9rem; font-weight: bold; font-family: 'D-DIN-B'; color: #000000;}
.pop-bjing-appoint .appoint-btn { height: 2.75rem; line-height: 2.75rem; text-align: center; border-top: 1px solid rgba(236, 236, 236, .8); font-size: .85rem; color: #1380E9;}

/* 个人中心 */
.user-bg{background: #fff url(../images/user/bg.png) no-repeat top center;background-size: 100% 7rem;}
.user-head{display: flex;padding: 1.25rem 0.6rem;font-size: 0.7rem;color: #ffffff;align-items: center;}
.user-photo{width: 3.25rem;height: 3.25rem;border-radius: 100%;border: 0.1rem solid #ffffff;margin-right: 0.55rem;}
.user-info{flex: 1;}
.user-info h3{font-size: 1rem;font-weight: bold;}
.edit-info{font-size: 0.7rem;color: #1380e9;background: #f4faff;border-radius: 0.85rem;padding: 0.25rem 0.6rem;}

.family-con{ background: #fff;border-radius: 0.8rem 0.8rem 0 0;overflow: hidden;}
.user-tit{font-size: 0.9rem;color: #000;font-weight: bold;background-image: linear-gradient(0deg, #ffffff 0%, #f4faff 100%);line-height: 2.3rem;padding: 0 0.6rem;}
.user-tit i{font-size: 0.7rem;color: #999999;font-weight: normal;}

.user-service { display: flex; justify-content: space-between; padding: 0 .5rem;}
.user-service .service-col { display: block; width: calc(50% - .25rem); height: 4.5rem; background-repeat: no-repeat; background-position: 0 0; background-size: 100% 100%; border-radius: .35rem; padding: 1.1rem 0 0 .95rem; font-size: .8rem; color: #000;}
.user-service .service-col:first-child { background-image: url('../images/user/gift1.png');}
.user-service .service-col:last-child { background-image: url('../images/user/gift2.png');}

/* 健康卡 */
.card-top{ background: #fff;}
.card-top .swiper-slide img{ width: 100%; height: 7.5rem;}
.card-top>.swiper-pagination{ bottom: 1.1rem !important; }
.card-top .swiper-pagination-bullet{ opacity: 1; background: #fff; width: .2rem; height: .2rem; margin: 0 .15rem !important; border-radius: .1rem; opacity: 1; }
.card-top .swiper-pagination-bullet-active{ width:.4rem; opacity: 1; }

.card-live{ height:3.5rem; position:relative; margin:0 .5rem; z-index:10;}
.card-live > div{ width:100%; height:4.3rem; position:absolute; left:0; bottom:0; background-image: linear-gradient(#f4faff 0%, #fff 2.3rem, #fff 100%); box-shadow:0 0 10px rgba(0,0,0,.1); border-radius:.5rem; display: box; display: -webkit-box; padding:0 .7rem 0 .5rem; box-sizing:border-box;}
.cl-img{ -webkit-box-flex:0; display: box; display: -webkit-box; -webkit-box-orient: vertical; -webkit-box-pack: center; margin-right:.6rem;}
.cl-img img{ width:2.4rem; height:2.4rem; border-radius:50%;}
.cl-info{ -webkit-box-flex:1; display: box; display: -webkit-box; -webkit-box-orient: vertical; -webkit-box-pack: center; color:#666; font-size:.55rem; line-height:1.2;}
.cl-info h4{ font-size:.75rem; font-weight:bold; color:#000; margin-bottom:.2rem;}
.cl-btn{ -webkit-box-flex:0; display: box; display: -webkit-box; -webkit-box-orient: vertical; -webkit-box-pack: center; margin-left: 1.4rem;}
.cl-btn a{ display:block; width:4.2rem; height:1.7rem; line-height:1.7rem; text-align:center; border-radius:1rem; background:#1380e9; font-size:.7rem; color:#fff;}
.livefixed > div{ position:fixed; height:3rem; z-index:10; top:0; bottom:auto; border-radius:0;}
.livefixed > div .cl-info p{ display:none;}
.livefixed > div .cl-img img{ width:2rem; height:2rem;}
.livefixed > div .cl-info h4{ margin-bottom:0;}

.new-card{ padding:0 .05rem 0 .5rem;display: flex;flex-wrap: wrap;}
.new-card li{ width:50%; float:left; box-sizing:border-box; padding-right:.45rem; margin-bottom:.45rem;}
.new-card li.upgrade-card>div{background: #fff7ea;border: 1px solid #ffffff;border-radius: 0.5rem;padding: 1.2rem 0.6rem 0.5rem;position: relative;}
.new-card h3{font-size: 0.8rem;color: #000;font-weight: bold;margin-bottom: 0.3rem;line-height: 1.3;white-space: nowrap;overflow:hidden;text-overflow: ellipsis;}
.new-card a{font-size: 0.6rem;color: #ffffff;background-color: #1380e9;border-radius: 0.5rem;display: inline-block;padding: 0.1rem 0.4rem;margin-bottom: 0.4rem;}
.new-card li img{width: 100%;border-radius: 0.2rem;}
.new-card li.s-card>div{border-radius: 0.5rem;padding: 0.5rem 0.6rem 0.6rem;border: 1px solid #fff;}
.card-pink>div{background: #ffefef;}
.card-org>div{background: #fff7ea;}
.card-green>div{background: #e0f1f2;}

.detail-img { vertical-align: top; width: 100%;}

/* 卡详情页 flex 布局（替代 position:fixed，兼容微信等 WebView） */
.detail-wrap { display: flex; flex-direction: column; height: 100vh; overflow: hidden; }
.detail-wrap .detail-scroll { flex: 1; overflow-y: auto; -webkit-overflow-scrolling: touch; }
.detail-wrap .detail-bot { flex-shrink: 0; }
.detail-wrap .detail-bot > div { position: static; }

.detail-bot { height: calc(3rem + constant(safe-area-inset-bottom)); height: calc(3rem + env(safe-area-inset-bottom));}
.detail-bot > div { width: 100%; height: calc(3rem + constant(safe-area-inset-bottom)); height: calc(3rem + env(safe-area-inset-bottom)); background: #fff; box-shadow: 0 0 10px rgba(0,0,0,.1); display: flex; align-items: center; padding: 0 .6rem; box-sizing: border-box; gap: .5rem; padding-bottom: constant(safe-area-inset-bottom); padding-bottom: env(safe-area-inset-bottom);}
.detail-bot .btn-activate { flex: 1; height: 2rem; line-height: 2rem; text-align: center; border-radius: 2rem; border: 1px solid #1380e9; font-size: .75rem; color: #1380e9; display: block;}
.detail-bot .btn-use { flex: 1; height: 2rem; line-height: 2rem; text-align: center; border-radius: 2rem; background: #1380e9; font-size: .75rem; color: #fff; display: block;}