
.qlzf-banner-box{
    width: 100%;
    background-image: url('https://oss.xhsqy.com/web/image/all/202408/876d6f583ec74e0d9da8c9e8e2cd8134.png');
    background-repeat: no-repeat;
    background-size: 100% 100%;
    margin-top: 2.5rem;
    padding: 1.3rem 0 1.7rem;
}
.qlzf-logo,.qlzf-code{
    margin: auto;
}
.qlzf-logo{
    width: 40%;
}
.qlzf-code{
    width: 64%;
}
.qlzf-logo img,.qlzf-code img{
    width: 100%;
    vertical-align: middle;
}
.qlzf-banner-text{
    width: 85%;
    font-size: .65rem;
    color: #333;
    text-align: center;
    margin: .8rem auto 1rem;
    letter-spacing: 1px;
}
.qlzf-box{
    width: 100%;
    height: auto;
    margin: auto;
    background-color: #F5F5F5;
}
.title-box{
	width: 90%;
	padding: 2rem 0;
	text-align: center;
    margin: auto;
}
.title-box span{
	font-size: .875rem;
	font-weight: bold;
	color: #333;
	letter-spacing: 1px;
	position: relative;
}
.title-box span::before{
	content: '';
	width: 1.5rem;
	height: .12rem;
	background: #C7000A;
	position: absolute;
	bottom: -.3rem;
	left: 49%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	-o-transform: translateX(-50%);
}
.qlzf-text{
    width: 85%;
    line-height: .7rem;
    margin: 0 auto .8rem;
    font-size: .5rem;
    color: #333;
}
.qlzf-app{
    width: 75%;
    margin: auto;
}
.qlzf-app img{
    width: 100%;
    vertical-align: middle;
}
.qlzf-platform-box{
    width: 95%;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 0;
    margin: .5rem auto 0;
    padding-bottom: 1rem;
}
.qlzf-platform-01,.qlzf-platform-02{
    width: 100%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
}
.qlzf-platform-01{
    background-image: url(../img/qlzf-platform-01.png);
}
.qlzf-platform-02{
    background-image: url(../img/qlzf-platform-02.png);
}
.platform-title{
    font-size: .65rem;
    font-weight: bold;
    padding-bottom: .3rem;
}
.platform-text{
    line-height: .8rem;
    font-size: .5rem;
}
.qlzf-platform-01,.qlzf-platform-02,.qlzf-platform{
    height: 6.8rem;
    padding: .7rem;
    box-sizing: border-box;
}
.colorfff{
    color: #fff;
}
.line-right{
    border-top: 1px solid #DBDBDB;
    border-right: 1px solid #DBDBDB;
}
.line-left{
    border-left: 1px solid #DBDBDB;
}
.line-right-down{
    border-right: 1px solid #DBDBDB;
    border-bottom: 1px solid #DBDBDB;
}
.qlzf-server-box{
    width: 100%;
    height: auto;
    background-image: url('https://oss.xhsqy.com/web/image/all/202408/c33093214315439680705a0c308fc205.png');
    background-repeat: no-repeat;
    background-size: 100% 100%;
    display: flex;
    align-items: center;
    padding: 1.5rem 0;
}
.qlzf-info{
    width: 90%;
    margin: auto;
    display: flex;
    padding-left: 1rem;
    box-sizing: border-box;
}
.qlzf-server-left{
    width: 34%;
    padding-right: 6%;
}
.qlzf-server-text{
    height: 1.5rem;
    line-height: 1.5rem;
    font-size: .65rem;
    background: #fff;
    box-shadow: 0px 7px 9px 0px rgba(85,134,224,0.16);
    border-radius: 15px;
    border: 1px solid #DCECFF;
    margin: 1.3rem 0;
    padding-left: 1.3rem;
    box-sizing: border-box;
}
.icon-01,.icon-02,.icon-03{
    position: relative;
}
.icon-01::before,.icon-02::before,.icon-03::before{
    content: '';
    position: absolute;
    left: -1rem;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    background-repeat: no-repeat;
    background-size: 100%;
}
.icon-01::before{
    width: 2rem;
    height: 2.4rem;
    background-image: url(../img/qlzf-icon-01.png);
}
.icon-02::before{
    width: 1.8rem;
    height: 2rem;
    background-image: url(../img/qlzf-icon-02.png);
}
.icon-03::before{
    width: 2.25rem;
    height: 2.2rem;
    background-image: url(../img/qlzf-icon-03.png);
}
.qlzf-server-right{
    width: 60%;
    line-height: .9rem;
    font-size: .55rem;
    margin: auto;
    letter-spacing: 1px;
}
.service-box{
    width: 100%;
    height: auto;
    background-image: url('https://oss.xhsqy.com/web/image/all/202408/c23a2d84bf504cd5b46c504535cf75d7.png');
    background-repeat: no-repeat;
    background-size: 100% 100%;
}
.service-info-box{
    width: 85%;
    margin: auto;
    padding: 1.5rem 0 1.5rem 2rem;
    box-sizing: border-box;
}
.service-tip{
    line-height: .8rem;
    font-size: .55rem;
    color: #333;
    margin-bottom: 1rem;
}
.service-info{
    width: 100%;
    height: auto;
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0), #fff);
    border-radius: .2rem;
    -webkit-border-radius: .2rem;
    -moz-border-radius: .2rem;
    -ms-border-radius: .2rem;
    -o-border-radius: .2rem;
    display: flex;
    margin-bottom: .6rem;
    /* padding: 7px 0 12px; */
}
.service-title{
    width: 2rem;
    height: 2rem;
    line-height: 2rem;
    background: linear-gradient(90deg, #177AF8, #03C3F0);
    border-radius: 50%;
    opacity: 0.95;
    font-size: .6rem;
    color: #fff;
    text-align: center;
    letter-spacing: .08rem;
}
.service-text{
    width: calc(100% - 2rem);
    line-height: .7rem;
    font-size: .5rem;
    color: #333;
    padding: .35rem .3rem;
    box-sizing: border-box;
    display: flex;
    align-items: center;
}
.join-box{
    width: 100%;
    height: auto;
    background: linear-gradient(90deg, #177AF8, #03C3F0);
    opacity: 0.79;
    padding: 2rem 1.2rem;
    box-sizing: border-box;
}
.join-title{
    width: 90%;
    margin: auto;
    letter-spacing: .05rem;
}
.join-title p{
    font-size: .9rem;
    color: #fff;
    font-weight: bold;
    text-align: center;
}
.join-text{
    line-height: .8rem;
    font-size: .52rem;
    color: #fff;
    letter-spacing: 1px;
    margin: .65rem 0 1rem;
}
.join-num-box{
    width: 100%;
    height: auto;
    display: flex;
    justify-content: space-between;
}
.join-num{
    color: #fff;
    padding-left: .5rem;
    box-sizing: border-box;
    position: relative;
}
.join-num::before{
    content: '';
    width: .3rem;
    height: 86%;
    background: #fff;
    position: absolute;
    left: 0;
    top: 53%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
}
.num{
    font-size: .9rem;
    font-weight: bold;
}
.text{
    font-size: .6rem;
}