
.header-nav-box{position: fixed;top: 0;left: 0; display: flex;justify-content: space-between;align-items: center;width: 100%;height: 1rem;padding: 0 .6rem;background-color: #fff;z-index: var(--header-nav-index);}
.header-nav{display: flex;justify-content: space-between;align-items: center;margin: 0 auto;width: 100%;max-width: 17.2rem;height: 100%;}
.header-nav .nav-tags{display: flex;justify-content: space-between;align-items: center;height: 100%;}
.header-nav .nav-tag{display: flex;align-items: center;line-height: 1.5;padding: 0 .06rem;height: 100%;}
.header-nav .nav-tag.active{box-shadow: 0 -.02rem 0 var(--theme-color) inset;}
.header-nav .nav-tags>li{height: 100%;}
.header-nav .nav-tags>li:nth-child(n+2){margin-left: .79rem;}
.header-nav .nav-search{position: relative;height: 1em;width: 3.478em;background-color: #f7f7f7;border-radius: .5em;display: flex;align-items: center;}
.header-nav .ipt-search{width: 100%;height: 100%;text-align: center;}
.header-nav .ipt-search:focus+div.search-placeholder{opacity: 0;}
.header-nav .search-placeholder{position: absolute;top: 0;left: 0;right: 0;bottom: 0;color: #888;display: flex;align-items: center;pointer-events: none;transition: .3s;}
.header-nav .icon-search{margin-right: .1rem;margin-left: .34rem;background-image: url("/static/home/images/icon/search.png");}
.icon-menu{background-image: url("/static/home/images/icon/menu.png");display: none;}
@media (max-width: 750px) {
    .header-nav .nav-tags{display: none;}
    .icon-menu{display: block;}
}

.banner-box{position: relative;padding-bottom: .2rem;}
.banner-bottom{position: absolute;bottom: 0;left: 0;width: 100%;}
.banner-content{position: absolute;bottom: 0;left: 0;width: 100%;height: 100%;display: flex;align-items: center;flex-direction: column; padding: .53rem;}
.PetJourney{height: 0.7rem;}
.banner-title{line-height: 1.2;color: #fff;margin: .076rem 0 .146rem;cursor: default;}
.banner-tag-box{display: inline-block;}
.banner-tag{line-height: 1.5;color: #fff;background-color: var(--theme-color);height: .48rem;padding: .05rem .35rem;border-radius: .24rem;display: flex;align-items: center;justify-content: center;cursor: default;}

.introduce-wrap{background-color: var(--bg-color);padding-top: 1rem;}
.card-title,.card-info{color: #222;line-height: 1.5;text-align: center;font-weight: normal;}
.introduce-card-list{display: flex;justify-content: space-between;margin: .45rem auto .68rem;width: 100%;max-width: 8.54rem;}
.introduce-card-list .introduce-card{display: flex;flex-direction: column; align-items: center;width: 3.87rem;border: solid 0.04rem var(--theme-varietal-color);box-shadow: 0rem 0.02rem 0.08rem 0rem rgba(111, 34, 47, 0.1);background-color: #fff;border-radius: .2rem;padding: .28rem 1rem .52rem;}
.introduce-card-list .introduce-card .card-icon{width: .6rem;height: 0.6rem;}
.introduce-card-list .card-title{margin: .215rem 0 .05rem;}
.introduce-card-list .card-info{color: #666;line-height: 1.9;}

.pic-group{position: relative;height: 7.33rem;width: 100%;}
.pic-group .pic-map,.pic-group .pic{position: absolute;top: 0;left: 0;width: 100%;}
.pic-group .pic{top: initial;bottom: 0;left: 50%;width: 87.03%; transform: translateX(-50%);}

.tag-box{display: flex;align-items: center; width: 100%;height: 2.2rem;background-color: #fff;border-radius: .2rem;padding: .2rem .6rem;transform: translateY(50%);box-shadow: 0rem 0.02rem 0.08rem 0rem rgba(122, 33, 48, 0.1);margin-bottom: 1.1rem;}
.tag-box .tag-list{display: flex;align-items: center;justify-content: space-between;margin: 0 auto;width: 100%;max-width: 8.54rem;}
.tag-box .tag-wrap{display: flex;align-items: center;justify-content: center;padding: 0.07rem; width: 1rem;height: 1rem;background-color: #ff4a674c;border-radius: 50%;}
.tag-box .tag-inner{width: 100%;height: 100%;padding: .19rem; background-color: #ff4a67;border-radius: 50%;}
.tag-box .tag-title{color: #333;line-height: 1.5;margin-top: .145rem;text-align: center;}
@media (max-width: 750px) {
    .introduce-card-list{flex-direction: column;}
    .introduce-card-list .introduce-card{width: 100%;}
    .introduce-card:nth-child(n+2){margin-top: .4rem;}
    .pic-group{height: 4.33rem;}
    .tag-title{font-size: .24rem;}
}

.methods-select-wrap{padding:1.07rem .6rem 1rem;}
.methods-select-list{width: 100%;margin-top: .45rem;}
.methods-title{color: #222;line-height: 1.5;}
.methods-info{color: #666;line-height: 1.5;margin-top: .245rem;}
.methods-item{display: flex;align-items: center;height: 4.95rem;width: 100%;box-shadow:0 0 0 0.08rem var(--theme-varietal-color) inset;border-radius: 0.24rem;cursor: pointer;}
.methods-item:nth-child(2n){flex-direction: row-reverse;}
.methods-item:nth-child(n+2){margin-top: .53rem;}
.methods-pic{width: 44%;height: 4.95rem;flex-shrink: 0; border: 0.08rem solid var(--theme-varietal-color);border-radius: 0.24rem;overflow: hidden;}
.methods-pic img{transition: .5s;}
.methods-content-box{flex: 1;padding: .6rem;}
.methods-content{margin: 0 auto;width: 100%;max-width: 4.1rem;}
.methods-item:hover .methods-pic img{transform: scale(1.05);}
@media (max-width: 750px) {
    .methods-item{flex-direction: column !important;height: auto;}
    .methods-pic{width: 100%;}
    .methods-pic img{width: 100%;}
}

.flow-list{--arr-width: 0.47rem;}
.flow-wrap{background-color: var(--bg-color);padding: 1.05rem 0 1.2rem;}
.flow-pic{margin: .33rem 0 .64rem;width: 100%; border: 0.08rem solid var(--theme-varietal-color);border-radius: 0.24rem;overflow: hidden;}
.flow-row{display: flex;}
.flow-row:nth-child(3n){flex-direction: row-reverse;justify-content: flex-start;}
.flow-row:nth-child(3n) .flow-arr::after{transform: rotate(180deg);}
.flow-item{display: flex;flex-direction: column; align-items: center;width: 1.65rem;}
.flow-icon{display: flex;align-items: center;width: 1.2rem;height: 1.2rem;border-radius: 50%;border: 0.03rem solid var(--theme-sub-color);padding: .3rem;}
.flow-index{display: flex;align-items: center;justify-content: center;margin: .16rem auto 0; width: 2em;height: 2em;border-radius: 50%;background-color: #ff8bb1;color: #fff;}
.flow-title{color: #333;line-height: 1.5; margin-top: .13rem;text-align:center;}
.flow-info{color: #666;line-height: 1.888;text-align:center;}
.flow-arr{display: inline-block;width: var(--arr-width);}
.flow-arr::after{content: "";display: block; width: 0.47rem;height: 1.2rem; margin: 0 auto; background: url("/static/home/images/icon/flow-arr.png") no-repeat center;background-size: contain;}
.flow-arr-down{display: flex;justify-content: center;align-items: center; width: 1.65rem;height: auto; margin-left: auto;}
.flow-arr-down:nth-child(4n){margin-left: 0;}
.flow-arr-down::after{transform: rotateZ(90deg);margin-top: auto;}
.flow-list>div:nth-of-type(even){flex-direction: row-reverse;}
.flow-list>div:nth-of-type(even) .flow-arr::after{transform: rotate(180deg);}

.advantage .methods-item{box-shadow: none;min-height: 4.5rem;box-shadow: 0rem 0rem 0.09rem 0.01rem rgba(255, 139, 177, 0.26);overflow: hidden;}
.advantage .methods-pic{width: 100%; max-width: 6rem;height: 100%; border: none;border-radius: 0;}
.advantage .methods-title{text-align: center;}
.advantage .methods-info{text-align: center;}
.advantage .methods-content{width: 2.4rem;}
.advantage .split-line{width: 0.4rem;height: 0.04rem;margin: .165rem auto .28rem; background-color: var(--theme-varietal-color);}
@media(max-width: 750px){
    .advantage .methods-pic{max-width: 100%;}
}

.note-wrap{padding: .6rem; background-color: var(--bg-color);}
.note{background-color: #fff;border-radius: .3rem;margin-top: .48rem;padding: .45rem .6rem .945rem;}
.note-title{line-height: 1.4;color: #333;}
.note-ul,.note-ol{line-height: 1.5;margin-top: .295rem;color: #666;}
.note-ul li::before{content: "";display: inline-block; height: 0.9em;width: 0.9em;margin-right: .11rem; background: url("/static/home/images/icon/star.png") no-repeat center;background-size: contain;}
.note-ul{margin-bottom: .675rem;}
.note-ul li:nth-child(n+2),.note-ol li:nth-child(n+2){margin-top: .15rem;}
.note-ol{list-style-type: decimal;}
.note-ol li{color: #fd8134;margin-left: 1em;}
.note-ol p{color: #666;}

.server{padding: 1rem 0;}
.server-cards{display: flex;justify-content: space-between;align-items: center;margin-top: .38rem;}
.server-card{width: 100%; }
.server-card:nth-child(n+2){margin-left: .35rem;}
.card-pic{border-radius: .16rem;overflow: hidden;min-height: 3.8rem;}
.card-pic img{transition: .3s;}
.server-card-title{color: #222;line-height: 1.46;margin-top: .345rem;}
.server-card:hover img{transform: scale(1.05);}
@media(max-width: 750px){
    .server .server-cards{flex-direction: column;}
    .server .server-card:nth-child(n+2){margin-top: .6rem;}
}

.example-wrap{padding-bottom: 1rem;}
.example-cards{display: flex;flex-wrap: wrap;justify-content: space-between;margin-top: .56rem;}
.example-card{position: relative; width: 3.33rem;margin-bottom: .7rem; border-radius: .16rem;overflow: hidden;}
.example-card-pic{height: 3.6rem; }
.example-card:nth-child(n+4){margin-top: .4rem;}
.example-card-content{position: absolute;bottom: 0;left: 0;width: 100%;background-color: #f9f9f7b2;padding: .2rem;}
.example-title{margin: 0 auto;width: 100%;max-width: 2.53rem; color: #876899;line-height: 1.5;}
.example-wrap .btn-box{display: flex;justify-content: center;}
.icon-right{background-image: url("/static/home/images/icon/more.png");}
@media (max-width: 750px) {
    .example-card{width: 48%;margin-top: 0 !important;}
}

.about-wrap{background: var(--bg-color);}
.about{padding: 1.2rem 0;}
.about-list{margin-top: .54rem;}
.about-item{display: flex;align-items: center; min-height: 4.35rem;overflow: hidden;}
.about-content{flex: 1;padding-right: .8rem;}
.about-pic{width: 50%;border-radius: .2rem; height: 100%;flex-shrink: 0;overflow: hidden;}
.about-title{line-height: 1.5;margin-bottom: 0.175rem;}
.about-info{line-height: 1.875;color: #666;}
.about-info p:nth-child(n+2){margin-top: .14rem;}
.about-wrap .btn-box{display: flex;justify-content: flex-start;}
.view-details{margin-top: .67rem;}
@media (max-width: 750px) {
    .about-item{flex-direction: column;}
    .about-content{flex: 1;padding-right: 0;}
    .about-pic{width: 100%;margin-top: .6rem;}
}

.partner{display: flex;align-items: flex-end; padding: .9rem 0;}
.partner-text{width: 29%;}
.partner-text .module-info{line-height: 1.428;}
.partner-list{flex: 1;margin-left: 1rem;width: 100%;overflow-x: auto;}
.partner-row{display: flex;justify-content: space-between;width: 100%;}
.partner-row:nth-child(n+2){margin-top: .26rem;}
.partner-item{display: flex;align-items: center;justify-content: center; height: 0.8rem;}
@media (max-width: 750px) {
    .partner{flex-direction: column;}
    .partner-text{width: 100%;}
}

.consult{display: none;}
@media (max-width: 750px) {
    .consult{position: fixed;left: 0;right: 0;bottom: 0;width: 100%;display: flex;align-items: center;justify-content: center; padding: .3rem .6rem; z-index: 50;background-color: var(--theme-color);color: #fff;}
}
.consult-dialog{z-index: 50;}
.consult-dialog .dialog-main{background-color: var(--bg-color);border-radius: .3rem;}
.consult-dialog .dialog-main{display: flex;align-items: center;justify-content: center; flex-direction: column; text-align: center;padding: .6rem;}
.consult-dialog .dialog-main{color: var(--theme-sub-color);line-height: 2;}

.footer-wrap{position: relative; background-color: #252525;padding: .72rem .72rem .77rem .72rem;}
.footer{display: flex;justify-content: space-between;padding-bottom: .8rem; margin: 0 auto;width: 100%;max-width: 15rem;}
.footer .logo{color: #fff;}
.logo-box{padding-bottom: .29rem; border-bottom: 0.01rem solid #e6e6e619;}
.footer-left{width: 3.5rem;}
.qr-code-box{display: flex;flex-direction: column; align-items: center;width: 100%; margin-top: .35rem;}
.qr-code{min-width: 1.35rem;}
.qr-code-tips{line-height: 2.571;color: rgba(255,255,255, .6);text-align: center;margin-top: .07rem;}
.footer-right{display: flex;margin-left: .6rem;}
.footer-list{color: #999;line-height: 1.5;}
.footer-title{margin-bottom: .315rem;color: #fff;}
.footer-list dd:nth-of-type(n+2){margin-top: .12rem;}
.footer-list:nth-child(n+2){margin-left: 1.47rem;}
.icon-phone{background-image: url("/static/home/images/icon/phone.png");}
.icon-email{background-image: url("/static/home/images/icon/email.png");}
.icon-location{background-image: url("/static/home/images/icon/location.png");}
.phone{color: #fff;align-items: center;}
.phone span{line-height: 1.1;}
.footer-list.contact{width: 2.44rem;}
.footer-list.contact dd{display: flex;}
.footer-list.contact dd i{flex-shrink: 0; width: 0.37rem;background-position: left center;}
.footer-list a{transition: .3s;}
.footer-list a:hover{color: #fff;}
.copyright-box{position: absolute;bottom: 0;left: 0;display: flex;align-items: center; width: 100%;min-height: 0.77rem;padding: 0 .6rem; border-top: 0.01rem solid rgba(255,255,255,.1);}
.copyright-inner{display: flex;align-items: center;justify-content: space-between;width: 100%; max-width: 15.2rem;margin: 0 auto;}
.copyright,.by{color: #fff;opacity: .5;line-height: 1.5;}
.by{opacity: .3s;}
@media (max-width: 750px) {
.footer{flex-direction: column;}
.footer-left{width: 100%;}
.footer-right{margin-left: 0;}
.footer-list{display: none;}
.footer-list.contact{display: block;width: 100%;margin: 0;}
.footer-list.contact dd i{width: .5rem;}
.copyright-inner{flex-direction: column;padding: .2rem 0;}
}
