﻿@charset "utf-8";
/* CSS Document */
html{font-size:100%; max-width:100%; margin:0 auto; }
/* 全局样式 ------------------------------------------------------------------*/
body ,div, h1, h2, h3, h4,h5, p, dl, dd, ol, ul, li,em,font,span, form, fieldset, input, button, textarea,a{ margin:0; padding:0; box-sizing:border-box; color:#101010; font-family:"PingFang-Regular";}
th, td{ margin:0; padding:0;}
body{
    overflow-x:hidden;
}
html{   background: #F0F0F0;-webkit-text-size-adjust:none; word-wrap:break-word; margin:0; padding:0;}
h1, h2, h3, h4{ font-size:100%; font-weight:normal;}
ol, ul{ list-style:none;}
fieldset, img{ border:0;}
img{ border:none; -ms-interpolation-mode:bicubic; -o-object-fit:cover; object-fit:cover;}
cite, em, s, i, b{ font-style:normal;}
input, button, textarea, select{ font-size:100%;}
body, input, button, textarea, select, option{ font-size:normal;}
a, a:link, input, textarea{ text-decoration:none; outline:0; font-weight:normal;}
li, img, label, input{ vertical-align:middle;}
body{ font-size:.26rem; font-family:helvetica,arial; width:100%; max-width:8.1rem; margin:0 auto; overflow-x:hidden; min-height:100%; background:#F0F0F0; line-height:1.5;}
input:focus,select:focus{ outline:none;}

input::-webkit-input-placeholder,textarea::-webkit-input-placeholder{ color:#828282;}
input::-moz-placeholder,textarea::-moz-placeholder{ color:#828282;}
input:-moz-placeholder,textarea:-moz-placeholder{ color:#828282;}
input:-ms-input-placeholder,textarea:-ms-input-placeholder{ color:#828282;}
input[type=button],input[type=submit],input[type=file],button{ -webkit-appearance:none;}

/*公用样式*/
.left{ float:left;}
.right{ float:right;}
.clear{ clear:both;}
.clear0{ clear:both; font-size:0; height:0; overflow:hidden;}
img{ border:none; -ms-interpolation-mode:bicubic; -o-object-fit:cover; object-fit:cover;}
.hidden{ display:none;}
.comflex{ display:flex; flex-wrap:wrap; justify-content:space-between;}
.comflex1{ display:flex; flex-wrap:wrap;}
.comflex2{ display:flex; flex-wrap:wrap; justify-content:center; align-items:center;}
.comflex3{ display:flex; flex-wrap:wrap; align-items:center;}
.comflex5{ display:flex; flex-wrap:wrap; justify-content:center;}
.comflex4{ display:-webkit-flex; -webkit-flex-flow:row-reverse wrap; display:flex; flex-flow:row-reverse wrap; justify-content:space-between;}
.container{
    width: 94%;margin: 0 auto;
}
header{
    height: .8rem;
}
.head{
    background: #E82424;
    height: .8rem;padding: 0 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: fixed;left: 0;right: 0;top: 0;z-index: 99;
}
.head a{
    display: inline-block;width: 20px;
}
.head a img{
    display: block;width: 100%;
}
.head h1{
    font-size: .3rem;color: #ffffff;
}
.banner{ width:100%;}
.banner .swiper-slide{ overflow:hidden;}
.banner a,.banner img{ display:block; width:100%;}
.banner .swiper-pagination{ bottom:5%;}
.banner .swiper-pagination-bullet{ width:12px; height:12px; background:#cccccc; opacity:1; margin:0 5px!important; border-radius:50%; transition:all 0.6s;}
.banner .swiper-pagination-bullet-active{ opacity:1; background:#ffffff;}

.nav{
    display: flex;
    justify-content: space-between;
    align-items: center;background: #ffffff;border-radius: 5px;margin-top: 15px;
    padding: 10px 15px;
}
.nav .col{
    text-align: center;
}
.nav .col .img{
    height:.6rem;
}
.nav .col .img img{
    height: 100%;width: auto;
}
.nav .col .title{
    margin-top: .1rem;font-size: .3rem;
}
.tab{
    margin-top: .15rem;
    display: flex;
}
.tab .col{
    position: relative;
    margin-right: 20px;font-size: .35rem;padding-bottom: .1rem;
}
.tab .col.on{
    color: #E82424 ;
}
.tab .col.on::after{
    content: '';
    height: 2px;
    background:#E82424; 
    position: absolute;
    left: 0;right: 0;bottom: 0;
}

.tab2{
    margin-top: .45rem;
    display: flex;justify-content: space-between;
}
.tab2 .col{
    position: relative;
    margin-right: 20px;font-size: .35rem;padding-bottom: .1rem;
}
.tab2 .col.on{
    color: #1684FC
}
.tab2 .col.on::after{
    content: '';
    height: 2px;
    background:#1684FC; 
    position: absolute;
    left: 0;right: 0;bottom: 0;
}



.peolist .list{
    background: #ffffff;
    border-radius: 10px;
    box-shadow:0px 0px 10px 0px #cccccc;
    padding: .25rem;margin-top: .25rem;
}
.peolist .list .left{
    width: calc((100% - 30px)/2);
    float: left;
}
.peolist .list .right{
    width: calc((100% - 30px)/2);
    float: right;
}
.peolist .list .img{
    width: 100%;
    height: 1.8rem;
    border-radius: 5px;
    position: relative;overflow: hidden;  display: flex;align-items: center;
  justify-content: center;
}
.peolist .list .img img{
    object-fit: fill;
     
		width:100%;height:100%
}
.peolist .list .img .id{
    position: absolute;
    left: 0;right: 0;bottom: 0;
    background: rgba(0, 0, 0, .5);
    padding: 3px 10px;color: #ffffff;font-size: 12px;
}
.peolist .list .row{
    display: flex;
    align-items: center;margin-top: .2rem;
}
.peolist .list .row span{
    display: inline-block;
    width: 1rem;color: #909090;
    font-size: .32rem;font-weight: 600;
}
.peolist .list .row div{
    font-size: .32rem;white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
    font-weight: 600;
}

.peolist .list .desc{
    margin-top: 10px;font-size: .25rem;
}
.peolist .list .btn{
 display: flex;
 align-items: center;
 justify-content: space-between;
 padding: 0 .8rem;margin-top: .5rem;
}
.peolist .list .btn a:nth-child(1){
    border: 1px solid #fe5485;
    padding: .1rem .5rem;
    background: #ffedf2;color: #fe5485;font-size: .3rem;
    border-radius: 100px;
}
.peolist .list .btn a:nth-child(2){
    border: 1px solid #fe5485;
    padding: .1rem .5rem;
    background: #fe5485;color: #ffffff;font-size: .3rem;
    border-radius: 100px;
}
.regbox {
    padding:  1rem .5rem;
}
.regbox .title{
    font-size: .4rem;
}
.regbox .title2{
    font-size: .3rem;
    margin-top: .4rem;
}

.seleSex{
    display: flex;
    justify-content: space-between;
    margin-top: 1rem;
    padding:  0 .5rem;
}
.seleSex .input{
    display: flex;align-items: center;justify-content: center;
    margin-top: .3rem;
}
.seleSex .input span{
    margin-left: .1rem;
}
.seleSex .img{
	width:2rem;height:2rem;overflow:hidden;border-radius:50%
}
.seleSex .img img{
	width:100%;height:100%
}
.submit{
    width: 96%;
    left: 2%;
    position: fixed;
    bottom: .0rem;
}
.submit a{
    display: block;
    background: #E82424;
    color: #ffffff;
    padding: .2rem 0;
    width: 100%;
    text-align: center;font-size: .35rem;
}

.submit2{
  
    margin-top: 50px;
    padding: 0 30%;
}
.submit2 a{
    display: block;
    background: #E82424;
    color: #ffffff;
    padding: .2rem 0;
    width: 100%;
    text-align: center;font-size: .35rem;
    border-radius: 10px;
}


.tc{
    position: fixed;
    left: 0;right: 0;top: 0;bottom: 0;z-index: 999;
    background: rgba(0, 0, 0, .5);
   display:none
}
.tc.on{
	 display: flex;
    align-items: center;
    justify-content: center;
}
.tc .box{
    background: #ffffff;
    width: 95%;border-radius: 5px;
    padding: .5rem;
}
.tc .box .img{
    text-align: center;color: #ffffff;
}
.tc .box .img p{
    margin-top: 5px;display: block;text-align: center;
}
.tc .box .desc{
    font-size: .25rem;line-height: 1.5;
    padding: .3rem 0;text-indent: 20px;
}
.tc .box  .xy{
    font-size: 12px;display:flex;align-items: center;
}
.tc .box .tit{
    text-align: center;font-size: .35rem;color: #000;
}
.tc .box .tit2{
    text-align: center;font-size: .3rem;color: #828282;
    margin-top: .35rem;
}
.tc .btnarr{
    border-top: 1px solid #f2f2f2;
    margin-top: .3rem;
    height: 1rem;
    display: flex;
    align-items: center;
}
.tc .btnarr a{
    height: 100%;
    display: block;
    width: 50%;text-align: center;
    line-height: 1rem; font-size: .3rem;
}
.tc .btnarr a:nth-child(2){
    color: red;
}

.kh_detail{ width:100%;}
.kh_detail ul{ padding:0 .25rem; background:#fff; border-top:.5rem solid #f0f0f0;}
.kh_detail ul:nth-child(1){ border-top:none;}
.kh_detail ul li{ border-bottom:.02rem solid #e8e8e8; padding:.32rem 0rem;}
.kh_detail ul li:last-child{ border-bottom:none;}
.kh_detail ul li .t2{ font-size:.3rem;}
.kh_detail ul li .t2 em{ min-width:1.28rem; text-align:justify; text-justify:distribute-all-lines; text-align-last:justify; -moz-text-align-last:justify; -webkit-text-align-last:justify;font-size:.35rem}
.k_intxt{ border:1px solid #cccccc; font-size:.35rem; width:100%;
border-radius: 5px;width: 100%;height: .6rem;
}
.kh_detail ul li .w1{/* width:calc(100% - 1.6rem);*/ flex-grow:1; padding-left:.08rem; position:relative;}
.dt_sel{
border:1px solid #cccccc; font-size:.28rem; width:100%;
border-radius: 5px;width: 100%;height: .6rem;
}
.dt_sel2{
    border:1px solid #cccccc; font-size:.28rem;
    border-radius: 5px;height: .6rem;
}

.rzlist .col{
    float: left;
    width: calc((100% - 0.6rem)/4);
    margin-right: 0.2rem;
    background: #ffffff;
    border-radius: 5px;
    text-align: center;
    padding: .1rem;
    margin-top: .2rem;
}
.rzlist .col:nth-child(4n){
    margin-right: 0;
}
.rzlist .col img{
    width: 50%;
}
.rzlist .col  .tit{
    font-size: .25rem;
    margin-top: .1rem;
}
.conbox{
    background: #ffffff;
    overflow: hidden;
    margin-bottom: .2rem;padding-bottom: .5rem;
}
.conbox .titles{
    padding: .2rem .2rem;
}
.conbox .titles2{
    padding: .2rem .2rem;
}
.conbox .titles2 span{
    display: inline-block;margin-right: .2rem;
}
.conbox .titles2 span b{
    color: #E82424;
}

.conbox .titles3{
    text-align: center;color: #E82424;
    padding: .2rem;
}
.conbox .desc{
    padding: .2rem;line-height: 1.8;
}


.vtitle{
    font-size: .28rem;
    padding: .15rem 0;
}
.vtitle span{
    background-color: rgba(232,36,36,1);
    display: inline-block;color: #ffffff;
    padding: .01rem .2rem;border-radius: .1rem;
}
.vipdh{
    margin-top: .2rem;
    padding: .5rem 0;
    border-top: 1px solid #f1f1f1;padding-bottom: .8rem;
}
.vipdh span{

    padding-bottom: .1rem;
    margin-right: .9rem;font-size: .35rem;
    float: left;
    display: inline-block;
    position: relative;
}
.vipdh span.on{
    color:  rgba(232,36,36,1);
}
.vipdh span.on::after{
    content: '';
    position: absolute;
    height: 2px;
    right: 0;
    left: 0;bottom: 0; background-color: rgba(232,36,36,1);
}
.conbox .tit{
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #f1f1f1;
    height: 1rem;padding: 0 .3rem;
}
.jblist{
    overflow: hidden;
}
.jblist span{
    display: inline-block;
    float: left;
    border: 1px solid #cccccc;
    padding: .05rem .3rem;border-radius: 100px;
    margin-top: .2rem;
    margin-right: .2rem;
}
.infrow{
    display: flex;
    align-items: center;
    justify-content: space-between;margin-top: .2rem;
   
}
.infrow span{
    width: 1.5rem;display: inline-block;
    text-align:justify; text-justify:distribute-all-lines; text-align-last:justify; -moz-text-align-last:justify; -webkit-text-align-last:justify;
}

.hdlist{
    background: #ffffff;
    border-radius: 5px;
    margin-top: .2rem;padding-bottom: .1rem;

}
.hdlist .img img{
    display: block;width: 100%;
}
.hdlist .title{
    padding: .1rem .2rem;margin-top: .1rem;
}
.hdlist .date{
    padding: .1rem .2rem;
}
.hdlist .btn{
    padding: .1rem .2rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.hdlist .btn span b{
    color: #E82424;
}
.hdlist .btn a{
    border-radius: 4px;
    background-color: rgba(232,36,36,1);
    padding: .1rem .2rem;color: #ffffff;
}
.gldLogo{
    display: flex;
    align-items: center;
}
.gldLogo img{
    width: 1rem;
}
.gldLogo  p{
    margin-left: .3rem;font-size: .3rem;
}
.tongji  span{
   font-size: .3rem;
}

.tongji{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: .5rem;
}

.gldnav1{
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: .2rem;
}
.gldnav1 .col{
    display: flex;
    align-items: center;
    background: #ffffff;
    justify-content: center;
    width: calc((100% - .2rem)/2);
    height: 2rem;
}
.gldnav1 .col .con{
    display: flex;
    align-items: center;
    justify-content: space-between;  
}
.gldnav1 .col .box{
    margin-left: .3rem;
}
.gldnav1 .col .box p em{
    color: #E82424;
}
.gldnav1 .col .box p:nth-child(2){
    margin-top: .1rem;
}
.gldnav1 .col p{
    font-size: .3rem;
}
.gldnav2{
    overflow: hidden;margin-top: .3rem;
}
.gldnav2 .col{
    float: left;
    width: calc((100% - 0.6rem)/4);
    margin-right: .2rem;
    background: #ffffff;
    text-align: center;
    margin-top: .2rem;
    padding: .2rem 0;

}
.gldnav2 .col:nth-child(4n){
    margin-right: 0;
}
.gldnav2 .col p{
    font-size: .3rem;
}
.bgb{
    background: #ffffff;overflow: hidden;margin-bottom: .2rem;
}
.bgb .titmax{
    border-bottom: 1px solid #f2f2f2;
    padding: .2rem .25rem;font-size: .35rem;
}
.xingque{
    padding: .3rem .25rem;
}
.xingque label{
    display: inline-block;
    margin-right: .3rem;
}

.txt{
    border: 1px solid #f2f2f2;
    height: 2rem;
    width: 100%;
}

.headimg{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: .2rem 0;
}
.headimg .img{
    width: 1rem;height: 1rem;
    border-radius: 50%;overflow: hidden;
}
.headimg .img img{
    width: 100%;height: 100%;
}
.headimg .desc{
    width: calc(100% - 1.2rem);font-size: .3rem;
}
.headimg .desc .top{
    display: flex;
}
.headimg .desc .bottom{
    margin-top: .2rem;
    
}
.rz2{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: .2rem;margin-top: .2rem;
}

.rz2 .col{
    background: #DDEBF9;
    width: calc((100% - .2rem)/2);
    padding: .5rem 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.rz2 .col:nth-child(2){
    background: #F9E1E1 ;
}
.rz2 .col .box .title{
    display: flex;align-items: center;font-size: .3rem;
}
.rz2 .col .box .title2{
    margin-top: .2rem;font-size: .3rem;
}
.rz2 .col .box .title img{
    margin-left: .1rem;
}
.vipbg{
    background: #333333;
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: .2rem .2rem;
}
.vipbg a{
    border-radius: 4px;
background-color: rgba(255,196,82,1);
color: rgba(90,70,40,1);
padding: .05rem .1rem;font-size: .2rem;
}

.vipbg p{
    color: rgba(255,196,82,1);
    font-size: .3rem;
}

.menu{
    background: #ffffff;
    padding: .1rem .2rem;
    margin-top: .2rem;
}
.menu li a{
    display: flex;
    align-items: center;
    justify-content: space-between;width: 100%;font-size: .35rem;
}
.menu li a p{
    width: calc(100% - 70px);
}
.menu li{
    height: 1rem;
    border-bottom: 1px solid #D6D6D6;
    display: flex;align-items: center
}
.menu li:nth-last-child(1){
    border: 0;
}


.kh_infor{
    background:#E82424;height: 2.4rem;
}
.kh_infor_t{position:fixed;left: 0;right: 0; background:#E82424;padding-top: .5rem;padding-left: 2%;padding-right: 2%;}
.kh_infor_t .search{ width:100%; padding-bottom:.2rem;}
.kh_infor_t .s_intxt{ flex-grow:1; margin-right:.1rem; border:none; border-radius:.14rem; background:#fff; font-size:.28rem; padding:0 .24rem; line-height:.8rem;}
.kh_infor_t .s_inbut{ width:1.3rem; height:.8rem; border:none; border-radius:.14rem;  overflow:hidden; cursor:pointer;background: none;color: #ffffff;}
.kh_sort{ padding:0 .06rem;}
.kh_sort li{ width:1.8rem; position:relative;}
.kh_sort li .t1{ line-height:.88rem; color:#fff; font-size:.28rem; background:url(../images/point1.png) right center no-repeat; background-size:.24rem .14rem;}
.kh_sort li .txts{ position:absolute; left:0; top:90%; border-radius:.08rem; line-height:.66rem; padding:.05rem .2rem; font-size:.28rem; background:#fff; width:2.5rem; box-shadow:0 .01rem .03rem rgba(0,0,0,.1); display:none;
max-height: 10rem;overflow-y: auto;
}
.kh_sort li .txts.cur{ display:block;}

.gl_list {
    margin-top: .2rem;background: #ffffff;
    padding: .2rem;padding-bottom: 0;
}
.gl_list .top{
    display: flex;
   
    justify-content: space-between;
}
.gl_list .top .img{
    width: 1.3rem;
    height: 1.3rem;
    overflow: hidden;
    border-radius: 50%;
}
.gl_list .top .img img{
    width: 100%;height: 100%;
}

.gl_list .top .box{
    width: calc(100% - 1.7rem);
}
.gl_list .top .box p{
    margin-bottom: .15rem;
}
.gl_list .bottom{
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-top: 1px solid #cccccc;
    height: 1rem;margin-top: .2rem;
}
.gl_list  .bottom a{
    display: inline-block;
    border-radius: 5px;
    padding: .05rem .15rem;color: #ffffff;
}
.gl_list  .bottom a.b1{
    background: #E82424 ;
}
.gl_list  .bottom a.b2{
    background: #1684FC
}
.gl_list  .bottom a.b3{
    background:#E8A524
}
.gl_list  .bottom a.b4{
    background: #09AD5E 
}
.gl_list  .bottom a.b5{
    background: #4B24E8 
}
.gl_list  .bottom a.b6{
    background: #E8248E 
}
.gl_list  .bottom a.ok{
    background: #cccccc;
    
}



        .layer-custom-btn .layui-layer-btn0 {
            background-color: #ffffff !important;
            border: none !important;
            border-radius: 0px !important;
            color: #07C160 !important;
            font-weight: bold !important;width:calc(50% - 1px)!important;margin: 0!important;padding: 0!important;
            height: 50px!important;line-height: 50px!important;border-right: 1px solid #f1f1f1!important;
        }
        
        .layer-custom-btn .layui-layer-btn1 {
            background-color: none !important;
            border: none !important;
            border-radius: 0px !important;
            color: #cccccc !important;
            font-weight: bold !important;width: 50%!important;margin: 0!important;padding: 0!important;
               height: 50px!important;line-height: 50px!important;
        }
        
        
      .layer-custom-btn .layui-layer-btn {
    padding: 0 !important; /* 去除内边距 */
    margin: 0 !important;  /* 去除外边距 */
    text-align: center;
    border-top: 1px solid #eee;
}

      .layer-custom-btn .layui-layer-btn a {
    margin: 0 !important; /* 去除按钮外边距 */
    border-radius: 0 !important; /* 可选：去除圆角 */
    flex: 1; /* 让按钮平均分配宽度 */
}   
       
      .layer-custom-btn {
            border-radius: 8px !important;
            overflow: hidden !important;
        }
        
      .layer-custom-btn .layui-layer-title {
            border-radius: 8px 8px 0 0 !important;
           
        
            border-bottom: none !important;
        }
        
      .layer-custom-btn .layui-layer-content {
            border-radius: 0 0 8px 8px !important;
        }
        

.dt_bot{ height:1.58rem; position:relative; left:0; top:0; right:0; z-index:99;}
.dt_bot-fixed{ width:8.1rem; position:fixed; left:50%; bottom:0; margin-left:-4.05rem; height:1.58rem; border-top:.02rem solid #bbb; background:#fff; padding:.48rem .32rem;}
.dt_but{ border:none; cursor:pointer; color:#fff; background:#1684fc; line-height:1rem; font-size:.33rem; border-radius:.08rem; width:1.36rem; text-align:center;}
.dt_but.del_but{ background:#e82424;}

a.add_but{
    line: height 1rem ;

    
}
.nodata{
    text-align: center;
    display: none;

}
.nodata.on{
    display: block;
}
.load{
    text-align: center;
}
.dibu{
    text-align: center;
    display: none;
}
.dibu.on{
    display: block;

}
.codebox{
    position: fixed;
    background: rgba(0, 0, 0, .5);
    left: 0;
    right: 0;top: 0;bottom: 0;
    z-index: 999999;
    display: none;
}
.codebox.on{
    display: block;
}
.codebox .box{
    width:5rem;
    position: fixed;
    transform:translate(-50%,-50%);
    -webkit-transform:translate(-50%,-50%);
    left: 50%;top: 50%;
    text-align: center;
}
.codebox .box .img{
    background: #ffffff;
    width: 100%;padding: .2rem;

    border-radius: .1rem;
}
.codebox .box .img img{
    width: 100%;
}
.codebox .box .close{
    color: #ffffff;
}


/*电话弹出*/
       .trigger-btn {
            background: white;
            color: #2575fc;
            border: none;
            padding: 15px 40px;
            font-size: 18px;
            border-radius: 50px;
            cursor: pointer;
            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
            transition: all 0.3s ease;
            font-weight: 600;
        }
        
        .trigger-btn:hover {
            transform: translateY(-3px);
            box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3);
        }
        
        .modal-overlay {
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background: rgba(0, 0, 0, 0.7);
            display: flex;
            justify-content: center;
            align-items: center;
            z-index: 1000;
            opacity: 1;
            visibility: visible;
            transition: all 0.3s ease;
        }
        
        .modal-overlay.active {
            opacity: 1;
            visibility: visible;
        }
        
        .modal-content {
            background: white;
            width: 90%;
            max-width: 400px;
            border-radius: 20px;
            padding: 30px;
            transform: scale(0.8);
            transition: transform 0.4s ease;
            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
        }
        
        .modal-overlay.active .modal-content {
            transform: scale(1);
        }
        
        .modal-header {
            margin-bottom: 25px;
        }
        
        .modal-title {
            font-size: 22px;
            color: #333;
            font-weight: 600;
        }
        
        .options-container {
            display: flex;
            flex-direction: column;
            gap: 20px;
        }
        
        .option-card {
            display: flex;
            align-items: center;
            padding: 20px;
            border-radius: 15px;
            cursor: pointer;
            transition: all 0.3s ease;
            border: 2px solid #f0f0f0;
        }
        
        .option-card:hover {
            transform: translateY(-5px);
            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
        }
        
        .wechat-option:hover {
            border-color: #07c160;
            background: rgba(7, 193, 96, 0.05);
        }
        
        .phone-option:hover {
            border-color: #2575fc;
            background: rgba(37, 117, 252, 0.05);
        }
        
        .option-icon {
            width: 50px;
            height: 50px;
            border-radius: 50%;
            display: flex;
            justify-content: center;
            align-items: center;
            margin-right: 15px;
            font-size: 24px;
            color: white;
        }
        
        .wechat-icon {
            background: #07c160;
        }
        
        .phone-icon {
            background: #2575fc;
        }
        
        .option-text {
            text-align: left;
            flex: 1;
        }
        
        .option-title {
            font-size: 18px;
            font-weight: 600;
            margin-bottom: 5px;
        }
        
        .option-desc {
            font-size: 14px;
            color: #666;
        }
        
        .close-btn {
            margin-top: 25px;
            background: #f0f0f0;
            border: none;
            padding: 12px 25px;
            border-radius: 50px;
            cursor: pointer;
            font-size: 16px;
            color: #555;
            transition: all 0.3s ease;
        }
        
        .close-btn:hover {
            background: #e0e0e0;
        }
        
        .wechat-modal {
      
            text-align: center;
        }
        
        .wechat-qr {
            width: 200px;
            height: 200px;
            background: #f5f5f5;
            margin: 20px auto;
            display: flex;
            justify-content: center;
            align-items: center;
            border-radius: 10px;
            color: #000;
            font-size:.35rem;
        }
        
        .phone-modal {
          
            text-align: center;
        }
        
        .phone-number {
            font-size: 24px;
            font-weight: 600;
            color: #2575fc;
            margin: 20px 0;
            letter-spacing: 1px;
        }
        
        .call-btn {
            background: #2575fc;
            color: white;
            border: none;
            padding: 12px 30px;
            border-radius: 50px;
            cursor: pointer;
            font-size: 16px;
            transition: all 0.3s ease;
            margin-top: 10px;
        }
        
        .call-btn:hover {
            background: #1c68e0;
        }
        
        .back-btn {
            background: transparent;
            border: none;
            color: #666;
            cursor: pointer;
            font-size: 14px;
            margin-top: 15px;
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 5px;
        }
        
        @media (max-width: 480px) {
            .modal-content {
                padding: 20px;
            }
            
            .option-card {
                padding: 15px;
            }
            
            .option-icon {
                width: 45px;
                height: 45px;
                font-size: 20px;
            }
        }