.appointment .banner .text{position:absolute;left:0;top:0;background-color:rgba(15, 157, 101, 0.5);width:100%;height:100%;display:flex;align-items:center;justify-content:center;flex-direction:column}
.appointment .banner .text h2{font-size:.36rem;color:#fff;font-weight:bold;margin-bottom:.15rem}
.appointment .banner .text p{font-size:.18rem;color:#fff;border-top:1px solid #fff;border-bottom:1px solid #fff;padding:0 .1rem;line-height:1.75}
.appointment .banner .text p.button{border:none;border-radius:.3rem;color:var(--main);background:#fff;margin-top:.3rem;line-height:2.5;padding:0 .5rem;font-weight:bold}
.appointment .content{display:flex;padding-top:.2rem;max-width:1360px;flex-wrap:wrap}
.appointment .content .l{width:calc(100% - 359px - 13px);margin-right:13px;background:#fff;border-radius:.1rem;box-shadow:0 0 4px 0 rgb(0 0 0 / 0.25);padding:.25rem;box-sizing:border-box}
.appointment .content .l h1{font-size:.24rem;color:var(--main);text-align:center;font-weight:bold;border-bottom:1px solid #dcdcdc;line-height:1;padding-bottom:.15rem;margin-bottom:.15rem}
.appointment .content .l .form-list{margin:.2rem 12.5%;width:75%}
.appointment .content .l .form-list .list{background:none;display:flex;margin-bottom:.15rem}
.appointment .content .l .form-list .list .input{flex:1;display:flex;flex-direction:column}
.appointment .content .l .form-list .list .input:last-child{margin-left:5%}
.appointment .content .l .form-list .list .input label{padding-left:6px;position:relative;font-size:.2rem;color:var(--color);font-weight:bold;margin-bottom:.1rem}
.appointment .content .l .form-list .list .input label:before{content:"";position:absolute;left:0;top:15%;width:3px;height:70%;background:var(--color)}
.appointment .content .l .form-list .list .input input,
.appointment .content .l .form-list .list .input select,
.appointment .content .l .form-list .list .input textarea
{width:100%;height:.4rem;line-height:.4rem;outline:none;padding:0 .1rem;box-sizing:border-box;border-radius:5px;background:#f5f5f5;border:1px solid #C4C3C3;font-size:.2rem;resize:none}
.appointment .content .l .form-list .list .input textarea{height:.42rem}
.appointment .content .l .form-list .list .input input:hover,.appointment .content .l .form-list .list .input input:focus{border-color:var(--main)}
.appointment .content .l .form-list .list .input select:hover,.appointment .content .l .form-list .list .input select:focus{border-color:var(--main)}
.appointment .content .l .form-list .list .input textarea:hover,.appointment .content .l .form-list .list .input textarea:focus{border-color:var(--main)}
.appointment .content .l .form-list .list .input.tel{flex-wrap:wrap;flex-direction:row}
.appointment .content .l .form-list .list .input.tel label{width:100%}
.appointment .content .l .form-list .list .input.tel select{width:27.5%;margin-right:2.5%}
.appointment .content .l .form-list .list .input.tel input{width:70%}
.appointment .content .l .form-list .list .input.remark{margin-left:0}
.appointment .content .l .tip{text-align:center;font-size:.18rem;color:#ff0a0a;margin-top:1rem}
.appointment .content .l .submit{width:60%;margin:.1rem 20%;text-align:center;background:var(--main);border-radius:.1rem;color:#fff;font-size:.2rem;line-height:2.25;cursor:pointer}
.appointment .content .l .submit:hover{background:#0a7a4d}
.appointment .content .l .que{text-align:center}
.appointment .content .l .que a{color:#9b9898;font-size:.18rem}
.appointment .content .r{width:359px;background:#fff;border-radius:.1rem;box-shadow:0 0 4px 0 rgb(0 0 0 / 0.25);padding:.25rem;box-sizing:border-box}
.appointment .content .r h3{font-size:.24rem;color:var(--main);text-align:center;font-weight:bold;border-bottom:1px solid #dcdcdc;line-height:1;padding-bottom:.15rem;margin-bottom:.15rem}
.appointment .content .r p{font-size:.18rem;color:var(--color);line-height:1.35}
.appointment .content .r .doc{display:flex;margin:.1rem 0;align-items:center}
.appointment .content .r .doc p{font-size:.14rem}
.appointment .content .r .doc .img{max-width:80px}
.appointment .content .r .doc .text{margin:0 .15rem}
.appointment .content .r .doc .text h2{font-size:.2rem;color:var(--main);line-height:1.5;font-weight:bold}
.appointment .content .r .doc .text p{font-size:.14rem;color:var(--color)}
.appointment .content .r .doc .medal{text-align:center}
.appointment .content .r .doc .medal img{max-width:47px}
.appointment .content .r .doc .medal p{font-size:.12rem;color:#949191;margin-top:2px}
.appointment .content .r .desc{background-color:rgba(15, 157, 101, 0.1);border-radius:.1rem;padding:.1rem;box-sizing:border-box}
.appointment .content .r .desc p{font-size:.18rem;color:var(--color);line-height:1.5}
.appointment .content .r .desc p.last{text-overflow:-o-ellipsis-lastline;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical}
.appointment .content .r .button{margin:.1rem 0}
.appointment .content .r .button a{display:block;width:100%;border-radius:.3rem;background:var(--main);color:#fff;font-size:.24rem;line-height:2;text-align:center}
.appointment .content .r .button a:hover{background-color:#0a7a4d}
.appointment .content .r .info{text-align:center;color:var(--main);font-size:.18rem}
.appointment .content .route{width:100%;margin-top:.2rem;flex-wrap:wrap}
.appointment .content .route .left{width:10%}
.appointment .content .route .left .list{background:#d9d9d9;border-radius:.1rem;margin-bottom:.1rem;padding:.15rem;box-sizing:border-box;cursor:pointer}
.appointment .content .route .left .list p{font-size:.2rem;color:#fff;line-height:1;text-align:center;font-weight:bold;z-index:2;position:relative}
.appointment .content .route .left .list .img{margin-left:.1rem;display:none}
.appointment .content .route .left .list .img p{text-align:left;font-weight:400}
.appointment .content .route .left .list .img img{width:.56rem;margin-top:-.2rem;margin-left:.2rem}
.appointment .content .route .left .list.cur .img{display:block}
.appointment .content .route .left .list.cur{box-shadow:0 0 4px 0 rgb(0 0 0 / 0.25);background:var(--main)}
.appointment .content .route .left .list:last-child{background:var(--main);position:relative;transform:translate(0)}
.appointment .content .route .left .list:last-child::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;border-radius:.1rem;background-color:rgba(15,157,102,.5);z-index:1;animation:autoRipple 1.5s infinite ease-out}
.appointment .content .route .right{width:89%;margin-left:1%}
.appointment .content .route .right .map{width:100%}
.appointment .content .route .right .map .swiper-slide{display:flex}
.appointment .content .route .right .map .swiper-slide .sleft{border:1px solid var(--main);border-radius:.1rem;width:29.5%;position:relative;padding:.2rem}
.appointment .content .route .right .map .dot{width:7px;height:7px;border-radius:50%;position:absolute}
.appointment .content .route .right .map .dot.dot-green{background:#0f9d66}
.appointment .content .route .right .map .dot.dot-blue{background:#009dff}
.appointment .content .route .right .map .dot.dot-orange{background:#ffa601}
.appointment .content .route .right .map .callout,.appointment .content .route .right .map .step-tag{position:absolute;opacity:0;transform:translateY(8px);transition:opacity 0.4s cubic-bezier(.22,.61,.36, 1),transform 0.4s cubic-bezier(.22,.61,.36, 1);pointer-events:auto;width:31%}
.appointment .content .route .right .map .callout.visible,.appointment .content .route .right .map .step-tag.visible{opacity:1;transform:translateY(0)}
.appointment .content .route .right .map .callout .callout-text{position:absolute}
.appointment .content .route .right .map .callout .callout-text-title{font-weight:bold;font-size:.18rem;line-height:1.5;color:#0f9d66;text-align:center;left:0;top:10%;width:100%}
.appointment .content .route .right .map .callout .callout-text-title.red{color:#e2352f}
.appointment .content .route .right .map .callout .callout-text-sub,
.appointment .content .route .right .map .callout .callout-text-sub a{font-weight:400;font-size:.16rem;line-height:1.15;text-align:center;left:0;top:35%;width:100%}
.appointment .content .route .right .map .callout .callout-text-sub a{cursor:pointer}
.appointment .content .route .right .map .callout .callout-text-sub.gray,
.appointment .content .route .right .map .callout .callout-text-sub.gray a{color:#8a7076}
.appointment .content .route .right .map .callout .callout-text-sub.blue,
.appointment .content .route .right .map .callout .callout-text-sub.blue a{color:#009dff;text-decoration:underline}
.appointment .content .route .right .map .callout .callout-text-sub.orange,
.appointment .content .route .right .map .callout .callout-text-sub.orange a{color:#ffa601}
.appointment .content .route .right .map .callout .callout-text-sub.dark,
.appointment .content .route .right .map .callout .callout-text-sub.dark a{color:#545454}
.appointment .content .route .right .map .callout .callout-text-sub.green,
.appointment .content .route .right .map .callout .callout-text-sub.green a{color:#0f9d66}
.appointment .content .route .right .map .step-tag{background:rgba(255,255,255,0.92);border:1px solid #0f9d66;border-radius:.1rem;font-weight:bold;font-size:.18rem;line-height:1.75;color:#000;white-space:nowrap;box-shadow:0 1px 3px rgba(15,157,102,0.12);text-align:center;z-index:4;width:auto;padding:0 7px}
.appointment .content .route .right .map .swiper-slide .sright{width:69%;margin-left:1.5%}
.appointment .content .route .right .map .swiper-slide .sright .list{display:flex;width:100%;background:#fff;border-radius:.2rem;display:flex;padding:.19rem;box-sizing:border-box;align-items:center;margin-bottom:.2rem;box-shadow:0 0 2px 0 rgb(0 0 0 / 0.25);
opacity:0;transform:translateY(8px);transition:opacity 0.4s cubic-bezier(.22,.61,.36, 1),transform 0.4s cubic-bezier(.22,.61,.36, 1)}
.appointment .content .route .right .map .swiper-slide .sright .list.visible{opacity:1;transform:translateY(0)}
.appointment .content .route .right .map .swiper-slide .sright .list:last-child{margin-bottom:0}
.appointment .content .route .right .map .swiper-slide .sright .cir{width:.18rem;height:.18rem;background:#fff;border-radius:50%;border:1px solid var(--main);margin-right:5px;position:relative}
.appointment .content .route .right .map .swiper-slide .sright .cir:before{content:"";width:.12rem;height:.12rem;background:var(--main);border-radius:50%;position:absolute;left:2px;top:2px}
.appointment .content .route .right .map .swiper-slide .sright .cir.yellow{border-color:#ffc849}
.appointment .content .route .right .map .swiper-slide .sright .cir.yellow:before{background:#ffc849}
.appointment .content .route .right .map .swiper-slide .sright .cir.blue{border-color:#009dff}
.appointment .content .route .right .map .swiper-slide .sright .cir.blue:before{background:#009dff}
.appointment .content .route .right .map .swiper-slide .sright h3{font-size:.24rem;font-weight:bold}
.appointment .content .route .right .map .swiper-slide .sright h3 span{color:var(--main)}
.appointment .content .route .right .map .swiper-slide .sright h3 span.color1{color:#8a7076}
.appointment .content .route .right .map .swiper-slide .sright h3 span.color2{color:#e2352f}
.appointment .content .route .right .map .swiper-slide .sright .tip{display:flex;margin-left:auto}
.appointment .content .route .right .map .swiper-slide .sright .tip p{background:rgba(15,157,101,.1);border-radius:.3rem;padding:.1rem .2rem;box-sizing:border-box;margin-left:.15rem;font-size:.18rem;color:var(--main);display:flex;align-items:center;line-height:1}
.appointment .content .route .right .map .swiper-slide .sright .tip p img{width:.24rem;margin-right:3px}
.appointment .content .route .tips{text-align:center;margin-top:.2rem;width:100%;font-weight:bold;color:#949191;font-size:.18rem}
.appointment .content .route .tips a{color:var(--main);text-decoration:underline;text-underline-offset:3px}
@media screen and (max-width:1500px){
    .appointment .content .l .form-list{width:90%;margin:.2rem 5%}
}
@media screen and (max-width:997px){
    .appointment .banner .text h2{font-size:.42rem}
    .appointment .banner .text p{font-size:.32rem}
    .appointment .banner .text p.button{border-radius:.5rem}
    .appointment .content{display:block}
    .appointment .content .l{width:100%;margin-bottom:.3rem;text-align:center}
    .appointment .content .l h1{font-size:.4rem}
    .appointment .content .l .form-list{margin:.2rem 0;width:100%}
    .appointment .content .l .form-list .list{flex-wrap:wrap;margin-bottom:0}
    .appointment .content .l .form-list .list .input{width:100%;flex:auto;margin-bottom:.25rem}
    .appointment .content .l .form-list .list .input:last-child{margin-left:0}
    .appointment .content .l .form-list .list .input label{font-size:.32rem;text-align:left}
    .appointment .content .l .form-list .list .input input,.appointment .content .l .form-list .list .input select{height:.6rem;line-height:.6rem;font-size:.32rem}
    .appointment .content .l .form-list .list .input textarea{height:1.6rem;font-size:.32rem}
    .appointment .content .l .form-list .list .input.tel select{width:21.5%}
    .appointment .content .l .form-list .list .input.tel input{width:76%}
    .appointment .content .l .tip{font-size:.28rem;margin-top:0;text-align:left}
    .appointment .content .l .submit{width:auto;font-size:.32rem;padding:0 .5rem;margin:.1rem 0;display:inline-block}
    .appointment .content .l .que{display:none}
    .appointment .content .c{width:100%;margin-bottom:.3rem}
    .appointment .content .c h3{font-size:.4rem;color:var(--main);text-align:center;font-weight:bold;line-height:1}
    .appointment .content .c h6{font-size:.26rem;color:var(--main);text-align:center;font-weight:400;line-height:2}
    .appointment .content .c .map{width:100%;border:1px solid var(--main);border-radius:.1rem;box-shadow:0 0 4px 0 rgb(0 0 0 / 0.25);margin:.15rem 0 .3rem;position:relative}
    .appointment .content .c .map .dot{width:7px;height:7px;border-radius:50%;position:absolute}
    .appointment .content .c .map .dot.dot-green{background:#0f9d66}
    .appointment .content .c .map .dot.dot-blue{background:#009dff}
    .appointment .content .c .map .dot.dot-orange{background:#ffa601}
    .appointment .content .c .map .callout,.appointment .content .c .map .step-tag{position:absolute;opacity:0;transform:translateY(8px);transition:opacity 0.4s cubic-bezier(0.22, 0.61, 0.36, 1),transform 0.4s cubic-bezier(0.22, 0.61, 0.36, 1);pointer-events:auto;width:28%}
    .appointment .content .c .map .callout.visible,.appointment .content .c .map .step-tag.visible{opacity:1;transform:translateY(0)}
    .appointment .content .c .map .callout .callout-text{position:absolute}
    .appointment .content .c .map .callout .callout-text-title{font-weight:bold;font-size:.3rem;line-height:1.5;color:#0f9d66;text-align:center;left:0;top:10%;width:100%}
    .appointment .content .c .map .callout .callout-text-title.red{color:#e2352f}
    .appointment .content .c .map .callout .callout-text-sub,
    .appointment .content .c .map .callout .callout-text-sub a{font-weight:400;font-size:.24rem;line-height:1.15;text-align:center;left:0;top:35%;width:100%}
    .appointment .content .c .map .callout .callout-text-sub a{cursor:pointer}
    .appointment .content .c .map .callout .callout-text-sub.gray,
    .appointment .content .c .map .callout .callout-text-sub.gray a{color:#8a7076}
    .appointment .content .c .map .callout .callout-text-sub.blue,
    .appointment .content .c .map .callout .callout-text-sub.blue a{color:#009dff;text-decoration:underline}
    .appointment .content .c .map .callout .callout-text-sub.orange,
    .appointment .content .c .map .callout .callout-text-sub.orange a{color:#ffa601}
    .appointment .content .c .map .callout .callout-text-sub.dark,
    .appointment .content .c .map .callout .callout-text-sub.dark a{color:#545454}
    .appointment .content .c .map .callout .callout-text-sub.green,
    .appointment .content .c .map .callout .callout-text-sub.green a{color:#0f9d66}
    .appointment .content .c .map .step-tag{background:rgba(255,255,255,0.92);border:1px solid #0f9d66;border-radius:.1rem;font-weight:bold;font-size:.24rem;line-height:1.75;color:#000;white-space:nowrap;box-shadow:0 1px 3px rgba(15,157,102,0.12);text-align:center;z-index:4;width:auto;padding:0 7px}
    .appointment .content .c .map-li{display:flex}
    .appointment .content .c .map-li .li{flex:1;margin-right:2%;text-align:center;background:#d9d9d9;line-height:2.75;border-radius:.1rem;font-size:.26rem;color:#fff;box-shadow:0 0 4px 0 rgb(0 0 0 / 0.25)}
    .appointment .content .c .map-li .li{font}
    .appointment .content .c .map-li .li:last-child{margin-right:0}
    .appointment .content .c .map-li .li.cur{background:var(--main)}
    .appointment .content .r{width:100%}
    .appointment .content .r h3{font-size:.4rem}
    .appointment .content .r p{font-size:.32rem;line-height:1.5}
    .appointment .content .r .doc .img img{width:1.6rem}
    .appointment .content .r .doc .text{margin-left:.3rem}
    .appointment .content .r .doc .text h2{font-size:.36rem}
    .appointment .content .r .doc .text p{font-size:.28rem}
    .appointment .content .r .doc .medal{margin-left:auto}
    .appointment .content .r .doc .medal img{width:.6rem}
    .appointment .content .r .doc .medal p{font-size:.22rem}
    .appointment .content .r .desc p{font-size:.32rem}
    .appointment .content .r .button a{font-size:.36rem}
    .appointment .content .r .info{font-size:.32rem}
}
@keyframes autoRipple {
    0% {
        transform:scale(1);
        opacity:1;
    }
    100% {
        transform:scale(1.3);
        opacity:0;
    }
}