@charset "UTF-8";



/* vip */

.banner-vip{ background-image: url(../images/banner_vip.jpg);}

.vip{ position: relative;}

.vip-head{ position: relative; margin-bottom: .15rem; line-height: 1;}

.vip-head ul{ display: flex; justify-content: center;}

.vip-head ul li{ padding: 0 .6rem;}

.vip-head ul li a{ position: relative; display: block; font-weight: bold; font-size: var(--font-28); color: #323232; padding: .4rem 0;}

.vip-head ul li.active a{ color: #ec5a3e;}

.vip-head ul li.active a::after{ content: ''; position: absolute; left: 0; right: 0; bottom: .15rem; margin: 0 auto; background: #ec5a3e; width: 1.1rem; height: .06rem; border-radius: .03rem;}

.vip-main{ position: relative;}



/* authority */

.authority dl{ position: relative; background: url(../images/vip_authority_bg.png) right -.1rem bottom -.1rem no-repeat, linear-gradient( to top, #fff3eb, #fff); border-radius: .2rem; box-shadow: rgba(3, 3, 3, .06); margin-bottom: .3rem; padding: .25rem .25rem .15rem; line-height: 1;}

.authority dl dt{ position: relative; border-bottom: 1px dashed #e5e5e5; padding: 0 1.35rem .25rem .05rem; margin-bottom: .3rem;}

.authority dl dt h3{ display: flex; align-items: center; margin-bottom: .2rem;}

.authority dl dt h3 span{ padding-left: .4rem; background-position: left center; background-repeat: no-repeat; background-size: contain; line-height: .3rem; font-size: var(--font-28); color: #323232; margin-right: .3rem;}

.authority dl dt h3 strong{ color: #fe5200; font-size: var(--font-18); font-weight: normal;}

.authority dl dt h3 strong i{ font-size: var(--font-22); font-style: normal;}

.authority dl dt h3 strong b{ font-size: var(--font-46); font-weight: bold;}

.authority dl dt p{ font-size: var(--font-20); color: #a19e9e; line-height: 1.5 ;}

.authority dl dt .btn-orange{ position: absolute; right: 0; top: .03rem; display: block; width: 1.25rem; height: .8rem; line-height: 1.2; padding: .08rem .25rem; border-radius: .26rem; font-size: var(--font-26);}

.authority dl dd{ position: relative;}

.authority dl dd h4{ font-size: var(--font-22); color: #323232; margin-bottom: .3rem;}

.authority dl dd ul{ height: 1.72rem; display: flex; flex-wrap: wrap; flex-direction: column; overflow: hidden;}

.authority dl dd ul li{ width: 50%; height: 25%; }

.authority dl dd ul li span{ display: block; background: url(../images/icon_true_circle.png) .05rem center no-repeat; background-size:contain; padding-left: .3rem; font-size: var(--font-18); color: #666;}

.authority dl.item1{ background: #000;}

.authority dl.item1 dt{ border-color: rgba(255, 255, 255, .4);}

.authority dl.item1 dt h3 span{ background-image: url(../images/icon_vip_authority1.png); color: #fff;}

.authority dl.item1 dt h3 strong{ color: #fff;}

.authority dl.item1 dt p{ color: rgba(255, 255, 255, .7);}

.authority dl.item1 dt .btn-orange{ color: #161616; background: linear-gradient( to top, #e8b487, #f3d4b3);}

.authority dl.item1 dt .btn-orange:hover{ background: linear-gradient( to bottom, #e8b487, #f3d4b3);}

.authority dl.item1 dd h4{ color: #fff;}

.authority dl.item1 dd ul li span{ color: #c4c3c3; background-image: url(../images/icon_true_circle_light.png);}

.authority dl.item2 dt h3 span{ background-image: url(../images/icon_vip_authority2.png);}

.authority dl.item3 dt h3 span{ background-image: url(../images/icon_vip_authority3.png);}

.authority dl.item4 dt h3 span{ background-image: url(../images/icon_vip_authority4.png);}

.authority dl.item5 dt h3 span{ background-image: url(../images/icon_vip_authority5.png);}

.authority dl.item6 dt h3 span{ background-image: url(../images/icon_vip_authority6.png);}



/* service */

.service{ position: relative;}

.service-main{ position: relative; display: flex; background: #fff; border: 1px solid #bfbfbf; border-radius: .1rem; margin-bottom: .3rem;}

.service dl{ display: flex; flex-direction: column; flex-shrink: 0; width: 1.8rem; text-align: center; font-size: var(--font-28); color: #323232; line-height: 1;}

.service dl dt{ height: 2rem; display: flex; flex-direction: column; justify-content: center; align-items: center; border-bottom: 1px solid #d6d6d6;}

.service dl dt h3{ font-weight: bold; font-size: var(--font-24); color: #323232; margin-bottom: .2rem;}

.service dl dt .price{ color: #fe5200; font-size: .13rem; margin-bottom: .2rem; height: .34rem; line-height: .34rem;}

.service dl dt .price i{ font-size: .17rem;}

.service dl dt .price strong{ font-size: var(--font-34);}

.service dl dt .price span{ font-size: var(--font-24); color: #555e6a; font-weight: bold;}

.service dl dt .btn{ font-size: var(--font-16); width: 1.4rem; line-height: .4rem; border-radius: .2rem; border: 1px solid #fe5200; color: #fe5200; transition-duration: .25s;}

.service dl dt .btn:hover{ background: #fe5200; color: #fff;}

.service dl dd{ background: #fff; border-left: 1px solid #d6d6d6;}

.service dl dd ul{ position: relative;}

.service dl dd ul li{ display: flex; flex-direction: column; justify-content: space-around; align-items: center; margin: .5rem 0; min-height: .44rem;}

.service dl dd ul li b, .service dl dd ul li i{ width: .43rem; height: .43rem; background-position: center; background-repeat: no-repeat; background-size: cover;}

.service dl dd ul li b{ background-image: url(../images/icon_vip_right.png);}

.service dl dd ul li i{ background-image: url(../images/icon_vip_wrong.png);}

.service dl dd ul li.biz{ height: 3rem;}

.service dl dd ul li.biz strong{ display: block; font-weight: normal;}

.service dl dd ul li.biz span{ display: block; font-size: var(--font-26); color: #807e7e;}

.service dl.item1{ width: 1.7rem;}

.service dl.item1 dd{ border-left: none;}

.service dl.item2 dt{ background: #141415;}

.service dl.item2 dt h3{ color: #f5f5f5;}

.service dl.item2 dt .price{ color: #f9f6f6;}

.service dl.item2 dt .btn{ background: linear-gradient( to top, #e8b487, #f3d4b3); border:none; color: #161616;}

.service dl.item2 dt .btn:hover{ background: linear-gradient( to bottom, #e8b487, #f3d4b3);}

.service dl.item3 dt{ background: #f58f5e;}

.service dl.item3 dt h3{ color: #f5f5f5;}

.service dl.item3 dt .price{ color: #f9f6f6;}

.service dl.item3 dt .btn{ border-color: #fff; color: #fff;}

.service dl.item3 dt .btn:hover{ background: #fff; color: #fe5200;}

.service dl.item4 dt{ background: #f3af8f;}

.service dl.item5 dt{ background: #f7cbb6;}

.service dl.item6 dt{ background: #fff;}

.service dl.item7 dt{ background: linear-gradient( to top, #e8f5ff, rgba(232, 245, 255, 0));}



/* media */

@media (max-width: 640px){

}



@media (max-width: 576px){

}



@media (max-width: 480px){

}



@media (max-width: 375px){

    .authority dl dd ul li span{ padding-left: .4rem;}

}