/*零工服务解决方案样式*/

.service-solution-header{
    background: url("../images/serviceSolution/serviceSolution.png") no-repeat;
    background-size: 19.20rem 7.98rem;
    width: 19.20rem;
    height: 7.98rem;
}
.header-center{
    width: 12rem;
    min-width: 8rem;
    margin:0 auto;
    display: flex;
    position: relative;
}
.header-left{
    padding-top: 2.88rem;
    box-sizing: border-box;
    color: #FFFEFE;
    margin-left:-0.03rem;
    width:50%;
}
@keyframes moveDown {
    from {
        transform: translateY(-0.07rem);
    }

    to {
        transform: translateY(0.07rem);
    }
}
.header-left .header-left-title{
    font-weight: 500;
    font-size: 0.48rem;
    -webkit-animation:fadeInLeft 1s .2s ease both;
    -moz-animation:fadeInLeft 1s .2s ease both; 
}
.header-left .header-left-con{
    font-weight: 500;
    font-size: 0.18rem;
    width: 100%;
    margin-top: 0.06rem;
    -webkit-animation:fadeInLeft 1s .5s ease both;
    -moz-animation:fadeInLeft 1s .5s ease both; 
}
.header-left .header-left-btn{
    width: 2.4rem;
    height: 0.72rem;
    background: #446EF6;
    border-radius: 0.08rem;
    line-height: 0.72rem;
    text-align: center;
    /*font-weight: bold;*/
    color:#fff;
    font-size: 0.28rem;
    margin-top: 0.36rem;
    cursor: pointer;
    -webkit-animation:fadeInLeft 1s .7s ease both;
    -moz-animation:fadeInLeft 1s .7s ease both; 
}
.header-rigth{
    background: url("../images/serviceSolution/serviceSolutionHeaderPhone.png") no-repeat;
    background-size: 7.42rem 5.72rem;
    height: 5.72rem;
    width: 5.42rem;
    margin-top: 1.56rem;
}
.application-value{
    width: 100%;
    position: relative;
    margin-bottom:1.38rem;
}
.application-value::before{
    content: '';
    position: absolute;
    background: url("../images/serviceSolution/applicationValueBgLeft.png") no-repeat;
    background-size: 100% 4.39rem;
    width: 4rem;
    height: 4.39rem;
    bottom: 0.6rem;
    left:-2rem;
}
.application-value::after{
    content: '';
    position: absolute;
    background: url("../images/serviceSolution/applicationValueBgRigth.png") no-repeat;
    background-size:100% 6.15rem;
    width: 5rem;
    height: 6.15rem;
    top: 0;
}
.application-value-title{
    width: 5.5rem;
    font-size: 0.44rem;
    text-align:center;
    color: #1f2026;
    margin: 0 auto;
    margin-top:1.38rem;
    margin-bottom:.8rem;
    box-sizing: border-box;
}
.application-value-con{
    width: 15rem;
    margin:0 auto;
    display: flex;
    justify-content:center;
}
.application-value-con-left{
    background:url("../images/serviceSolution/serviceSolutionIcon.png") no-repeat;
    background-size: 7.11rem 4.94rem;
    width: 7.11rem;
    height: 4.94rem;
}
.application-value-rigth{
    width: 6.64rem;
    padding-top: 0.66rem;
    box-sizing: border-box;
    margin-left: 0.34rem;
}
.application-value-rigth div p{
    margin-left: 0.2rem;
    color: #356FFF;
    font-weight: bold;
    font-size: 0.28rem;
}
.application-value-rigth div:nth-child(1) p:nth-child(1){
    position: relative;
    padding-left: 0.3rem;
    width: 6rem;
    font-size: 0.28rem;
}
.application-value-rigth div:nth-child(1) p:nth-child(1)::before{
    content: '';
    background: url("../images/serviceSolution/riskAssessmentIcon.png") no-repeat;
    background-size: 0.24rem 0.28rem;
    width: 0.24rem;
    height: 0.28rem;
    position: absolute;
    left: -0.16rem;
    top:0.06rem
}
.application-value-rigth div:nth-child(3) p:nth-child(1){
    position: relative;
    padding-left: 0.3rem;
    width: 6rem;
    font-size: 0.28rem;
}
.application-value-rigth div:nth-child(3) p:nth-child(1)::before{
    content: '';
    background: url("../images/serviceSolution/shieldIcon.png") no-repeat;
    background-size: 0.22rem 0.26rem;
    width: 0.22rem;
    height: 0.26rem;
    position: absolute;
    left: -0.16rem;
    top:0.06rem
}
.application-value-rigth div:nth-child(3) p:nth-child(2),.application-value-rigth div:nth-child(1) p:nth-child(2){
    font-weight: 500;
    font-size: 0.2rem;
    color: #707070;
    margin-top: 0.29rem;
    width: 5.72rem;
}
.line{
    width: 6.64rem;
    height: 0.02rem;
    background: #B4C8EE;
    margin: 0.49rem 0 0.59rem 0;
    position: relative;
}
.line::after{
    position: absolute;
    content: '';
    width: 0.1rem;
    height: 0.1rem;
    background: #367DF7;
    opacity: 0.28;
    right: -0.4rem;
    top: -0.4rem;
}
.service-model{
    width: 100%;
    height: 9.98rem;
    background:url("../images/serviceSolution/serviceModel.png") no-repeat center;
    background-size: 100% 9.98rem;
    position: relative;
}
.service-model-title{
    width: 4.35rem;
    box-sizing: border-box;
    margin:0 auto;
    padding-top: 1.38rem;
    font-size: 0.44rem;
    text-align:center;
    color: #1f2026;
}
.service-model-ent{
    margin-top: 3.2rem;
    margin-left: 3.5rem;
    text-align: center;
    width: 1.16rem;
}
.service-model-ent p:nth-child(1){
    font-size:0.2rem;
    color: #356FFF;
    /*margin-bottom: 0.16rem;*/
}
.service-model-ent p:nth-child(2){
    font-size: 0.16rem;
    color: #525A68;
    line-height: 0.25rem;
}
.service-model-agreement{
    position: absolute;
    top: 2.8rem;
    left: 6.3rem;
    font-size: 0.16rem;
    color: #231815;
    opacity: 0.7;
}
.service-model-blue-gif{
    width: 1.69rem;
    height: 0.18rem;
    position: absolute;
    top: 3.4rem;
    left: 6.2rem;
    overflow: hidden;
}
.service-model-blue-gif img{
    width: 1.69rem;
    height: 0.18rem;
    animation: scrollLeft 2s linear infinite;
}

.service-model-invoice{
    position: absolute;
    top: 3.6rem;
    left: 32.5%;
    font-size: 0.16rem;
    color: #231815;
    opacity: 0.7;
}
.service-model-trade{
    position: absolute;
    top: 4.16rem;
    left: 31%;
    font-size: 0.16rem;
    color: #231815;
    opacity: 0.7;
    text-align: center;
}
.service-model-trade-orange-gif{
    position: absolute;
    top: 4.7rem;
    left: 32%;
    overflow: hidden;
}
.service-model-trade-orange-gif img{
    width: 1.69rem;
    height: 0.18rem;
    animation: scrolRight 2s linear infinite;
}
.service-model-sign{
    position: absolute;
    top: 5.5rem;
    left: 32.2%;
    font-size: 0.16rem;
    color: #231815;
    opacity: 0.7;
    text-align: center;
}
.service-model-business{
    position: absolute;
    top: 6.3rem;
    left: 33%;
    font-size: 0.16rem;
    color: #231815;
    opacity: 0.7;
    text-align: center;
}
.service-model-business-blue-gif{
    width: 1.69rem;
    height: 0.18rem;
    position: absolute;
    top: 6.1rem;
    left: 6.2rem;
    overflow: hidden;
}
.service-model-business-blue-gif img{
    width: 1.69rem;
    height: 0.18rem;
    animation: scrollLeft 2s linear infinite;
}
.service-model-p{
    position: absolute;
    top: 5.25rem;
    left: 50%;
    transform: translateX(-50%);
    font-size: 0.2rem;
    color: #231815;
    text-align: center;
}
.service-model-r{
    position: absolute;
    top: 4rem;
    right: 32.6%;
    font-size: 0.16rem;
    color: #231815;
    opacity: 0.7;
    text-align: center;
}
.service-model-r-orange-gif{
    position: absolute;
    top: 4.8rem;
    right: 32.1%;
    overflow: hidden;
}
.service-model-r-orange-gif img{
    width: 1.69rem;
    height: 0.18rem;
    animation: scrolRight 2s linear infinite;
}
.service-model-payment{
    position: absolute;
    top: 5rem;
    right: 34.3%;
    font-size: 0.16rem;
    color: #231815;
    opacity: 0.7;
    text-align: center;
}
.service-model-employers{
    position: absolute;
    top: 5.15rem;
    right: 18.4%;
    font-size: 0.16rem;
    color: #231815;
    text-align: center;
}
.service-model-employers p:nth-child(1){
    font-size: 0.2rem;
    color: #356FFF;
    margin-bottom: 0.16rem;
}
.service-model-employers p:nth-child(2){
    font-size: 0.16rem;
    color: #525A68;
}
.service-model-city{
    position: absolute;
    top: 7rem;
    left: 50%;
    transform: translateX(-50%);
    font-size: 0.18rem;
    color: #356FFF;
    text-align: center;
}
.service-model-explain{
    position: absolute;
    bottom: 3rem;
    left: 19%;
    font-size: 0.24rem;
    color: #356FFF;
}
.service-model-explain-con{
    position: absolute;
    bottom: 1.5rem;
    left: 19%;
    font-size: 0.16rem;
    color: #356FFF;
}
.service-model-explain-con p span:nth-child(1){
    display: inline-block;
    width: 0.14rem;
    height: 0.14rem;
    background: #356FFF;
    border-radius: 50%;
    color: #fff;
    line-height: 0.14rem;
    text-align: center;
    font-size: 0.12rem;
    font-weight: bold;
}
.service-model-explain-con p span:nth-child(2){
    color: #605F5F;
}
.service-model-flow{
    position: absolute;
    bottom: 1.54rem;
    right: 20.5%;
    font-size: 0.16rem;
    color: #525A68;
}
.service-model-flow p{
    margin-top: 0.17rem;
}
.solution{
    position: relative;
    margin-bottom:1.38rem;
    width: 100%;
}

.solution::before{
    content: '';
    position: absolute;
    background: url("../images/serviceSolution/solutionBgLeftIcon.png") no-repeat;
    background-size: 4.36rem 4.37rem;
    width: 4.36rem;
    height: 4.37rem;
    top:1.26rem;
    left: 1.84rem;
}
.solution::after{
    content: ' ';
    position: absolute;
    background: url("../images/serviceSolution/solutionBgRigthIcon.png") no-repeat;
    background-size: 5.19rem 6.15rem;
    width: 5.19rem;
    height: 6.15rem;
    bottom: -0.3rem;
    right: 0;
}
.solution-title{
    padding-top: 1.38rem;
    margin:0 auto;
    padding-bottom:0.8rem;
    width: 2rem;
    font-size: 0.44rem;
    text-align:center;
    color: #1f2026;
}
.solution-con{
    display: flex;
    width: 13.4rem;
    margin:0 auto;
}
.righ-icon {
    width:.24rem;
    height:0.24rem;
    margin-top:0.065rem;
    margin-right:0.1rem;
}
.solution-con .solution-con-box{
    background: url("../images/serviceSolution/solutionFloatingFrameBg.png") no-repeat center;
    width: 5.78rem;
    height: 6.17rem;
    background-size: 6.05rem 6.17rem;
}
.solution-con-box-right{
    background: url("../images/serviceSolution/solutionRight.png") no-repeat center;
    width: 7.62rem;
    height: 6.17rem;
    background-size: 7.42rem 4.85rem;
    background-position-x:0.2rem;
    background-position-y:0.64rem;
}
.solution-con-box:hover .solution-con-btn{
    display: block;
}
.solution-con .solution-con-box p:nth-child(1){
    font-weight: 500;
    font-size: 0.32rem;
    color: #FFFFFF;
    text-align: center;
    line-height: 1.3rem;
}
.solution-con .solution-con-box p:nth-child(2){
    margin-top: 0.5rem;
}
.solution-con-lable{
    color: #356FFF;
    font-weight: bold;
    font-size: 0.24rem;
    margin-left: 0.74rem;
    margin-top: 0.27rem;
    display: flex;
    align-items:flex-start;
}
.solution-con-lable span{
    display: inline-block;
    width: 2.5rem;
    font-size:0.22rem;
    color: #898989;
    font-weight: normal;
    line-height: 0.38rem;

}
.solution-con-btn{
    width: 3.8rem;
    height: 0.75rem;
    background: #5373F5;
    border-radius: 0.12rem;
    font-weight: 500;
    font-size: 0.24rem;
    color: #FFFFFF;
    margin:0.28rem auto;
    text-align: center;
    line-height: 0.75rem;
    cursor: pointer;
    display: none;
}
.business-model{
    width: 100%;
    background: url("../images/serviceSolution/businessModelBg.png") no-repeat center;
    background-size: 100% 100%;
    padding-bottom:1.38rem;
}
.business-model-title{
    width: 2rem;
    font-size: 0.44rem;
    color: #1f2026;
    margin: 0 auto;
    box-sizing: border-box;
    text-align:center;
    padding-top:1.38rem;
}
.business-model-tip{
    width: 12.7rem;
    margin: 0 auto;
}
.business-model-tip label{
    width: 3.52rem;
    font-weight: bold;
    font-size: 0.36rem;
    color: #356FFF;
}
.business-model-tip span{
    width: 5.91rem;
    height: 0.24rem;
    font-weight: 500;
    font-size: 0.24rem;
    color: #231815;
}
.business-model-ul{
    width: 12.7rem;
    margin: 0.3rem auto;
    font-weight: 500;
    font-size: 0.24rem;
    color: #231815;
}
.business-model-ul li{
    display: flex;
    align-items: center;
    padding-left: 0.2rem;
    box-sizing: border-box;
    text-indent: 0.2rem;
}
.business-model-ul li:before{
    content: '';
    width: 0.06rem;
    height: 0.06rem;
    background: #000000;
    border-radius: 50%;
    margin-left: -0.2rem;
}
.business-model-agreement-bg{
    width: 12.7rem;
    margin: 0.58rem auto;
    display: flex;
}
.business-model-agreement-bg-left{
    background: url("../images/serviceSolution/detailedList.png") no-repeat center;
    background-size: 8.17rem 5.69rem;
    width: 8.17rem;
    height: 5.69rem;
    position: relative;
    font-size: 0.2rem;
    line-height: 0.28rem;
    text-align: center;
    position: relative;
}
.business-model-agreement-bg-rigth{
    background: url("../images/serviceSolution/agreement.png") no-repeat center;
    background-size: 4.37rem 5.67rem;
    background-position-x:0.1rem;
    width: 4.57rem;
    height: 5.67rem;
    position: relative;
    font-size: 0.2rem;
    line-height: 0.28rem;
    text-align: center;
    position: relative;
    
}
.business-span{
 margin: 0 auto;
 display:block;
 color: #525A68;
 margin-top: 6rem;
}
.application-scenarios{
    /*height: 9.4rem;*/
}
.application-scenarios-title{
    margin:0 auto;
    box-sizing: border-box;
    width: 2.9rem;
    font-size: 0.44rem;
    color: #1f2026;
    text-align:center;
    margin-top:1.38rem;
}
.application-scenarios-con{
    width: 14.2rem;
    height:6rem;
    margin:0.8rem auto;
    display: flex;
    position: relative;
}
.application-scenarios-con-left{
    background: url("../images/serviceSolution/scene.png") no-repeat center;
    background-size: 5.74rem 5.32rem;
    width: 5.74rem;
    height: 5.32rem;
    z-index: 9;
    position: absolute;
}
.application-scenarios-con-center{
    background: url("../images/serviceSolution/industry.png") no-repeat center;
    background-size: 3.24rem 5.33rem;
    width: 3.24rem;
    height: 5.33rem;
    position: absolute;
    left: 4.6rem;
    z-index: 8;
}
.application-scenarios-con-center p:nth-child(1){
    margin-top: 0.44rem;
}
.application-scenarios-con-center p{
    font-weight: 500;
    font-size: 0.2rem;
    color: #605F5F;
	margin-left: 1.0rem;	
	border-bottom: 1px #c5c5c5 dashed;
	width: 1.4rem;
	text-align:center;
	padding: 0 0.1rem 0 0.1rem;
	line-height: 0.62rem;
	height:0.62rem;
}
.application-scenarios-con-center p:last-child{
   border-bottom: 0;
}
.application-scenarios-con-rigth{
    background: url("../images/serviceSolution/industryCon.png") no-repeat center;
    background-size: 8.84rem 5.08rem;
    width: 8.84rem;
    height: 5.08rem;
    margin-top: 0.12rem;
    position: absolute;
    right: 0;
}
.application-scenarios-con-rigth p:nth-child(1){
    margin-top: 0.3rem;
}
.application-scenarios-con-rigth p:last-child{
    border-bottom:none;
}
.application-scenarios-con-rigth p{
    font-size: 0.2rem;
    color: #FFFFFF;
    margin-left: 2.6rem;
    border-bottom: 1px #fff dashed;
    height: 0.62rem;
    line-height: 0.62rem;
    width: 5.27rem;
}
.advantage{
    background: url("../images/serviceSolution/advantageBg.png") no-repeat center;
    background-size: 110% 9.42rem;
    width: 100%;
    padding:1.38rem 0 1.38rem 0;
}
.advantage-title{
    width: 2rem;
    font-size: 0.44rem;
    text-align:center;
    color: #1f2026;
    margin:0 auto;
    margin-bottom:0.8rem;
    box-sizing: border-box;
}
.advantage-con{
    width: 13rem;
    margin:0 auto;
    display: flex;
    flex-wrap: wrap;
    justify-content:center;
}
.advantage-con div:nth-child(1){
    background: url("../images/serviceSolution/advantageCon1.png") no-repeat center;
    background-size: 6.36rem 2.12rem;
    margin-right: 0.02rem;
    margin-left:0.02rem;
    transition: transform 0.3s ease;
}
.advantage-con div:nth-child(2){
    background: url("../images/serviceSolution/advantageCon2.png") no-repeat center;
    background-size: 6.36rem 2.12rem;
    transition: transform 0.3s ease;
    margin-right: 0.02rem;
    margin-left:0.02rem;
}
.advantage-con div:nth-child(3){
    background: url("../images/serviceSolution/advantageCon.png") no-repeat center;
    background-size: 6.36rem 2.12rem;
    margin-right: 0.04rem;
    transition: transform 0.3s ease;
    margin-right: 0.02rem;
    margin-left:0.02rem;
}
.advantage-con div:nth-child(4){
    background: url("../images/serviceSolution/advantageCon4.png") no-repeat center;
    background-size: 6.36rem 2.12rem;
    transition: transform 0.3s ease;
    margin-right: 0.02rem;
    margin-left:0.02rem;
}
.advantage-con div:nth-child(1):hover{
    transform: scale(1.01);
}
.advantage-con div:nth-child(2):hover{
    transform: scale(1.01);
}
.advantage-con div:nth-child(3):hover{
    transform: scale(1.01);
}
.advantage-con div:nth-child(4):hover{
    transform: scale(1.01);
}
.advantage-con-box:hover{
    transform: scale(1.01);
}
.advantage-con-box{
    padding-left: 2.25rem;
    padding-top: 0.5rem;
    box-sizing: border-box;
    width: 6.36rem;
    height: 2.12rem;
    transition: transform 0.3s ease;
    display: block;
}
.advantage-con-box p:nth-child(1){
    font-size: 0.3rem;
    color: #FFFFFF;
    margin-bottom: 0.08rem;
	font-family: "FZLTZHUNHJWB";
}
.advantage-con-box p:nth-child(2){
    width: 3.6rem;
    height: 0.42rem;
    font-weight: 400;
    font-size: 0.18rem;
    color: #DEE8FF;
    text-align: justify;
}
.more-industries{
    width: 100%;
    height: 11.45rem;
}
.more-industries-top{
    display: flex;
    width: 14.8rem;
    margin:0 auto;
    padding-top: 1.38rem;
    box-sizing: border-box;
}
.more-industries-top-left{
    width: 4.5rem;
    height: 1.03rem;
    /* font-weight: bold; */
    font-size: 0.48rem;
    color: #494949;
    position: relative;
    line-height: 0.54rem;
}
.more-industries-top-left::before{
    content: '';
    width: 0.84rem;
    height: 0.11rem;
    background: #446EF6;
    position: absolute;
    top:1.60rem;
}
.more-industries-top-right{
    background: url("../images/serviceSolution/moreIndustriesTopRigthBg.png") no-repeat center;
    background-size: 8.24rem 4.24rem;
    background-position:0 0;
    width: 8.24rem;
    height: 4.24rem;
    margin-left: 2.2rem;
    position: relative;
    font-weight: 500;
    font-size: 0.24rem;
    color: #FFFFFF;
}
.more-industries-top-right::before{
    content: '探索更广阔的行业蓝海';
    position: absolute;
    top: 0.1rem;
    left: 0.27rem;
}
.more-industries-top-right::after{
    content: '更多行业';
    position: absolute;
    top: 1.47rem;
    right: 0.35rem;
}
.more-industries-bottom{
    display: flex;
	width:14rem;
    flex-wrap: wrap;
    margin-left: 2.6rem;
    margin-top: -0.2rem;
}
.more-industries-bottom li{
    width: 1.4rem;
    height: 1rem;
    box-sizing: border-box;
    text-align: center;
    margin-bottom: 0.85rem;
    font-size: 0.2rem;
}
.more-industries-bottom li{
	width:20%;
	height: .89rem;
	margin-bottom: .8rem;
}
.more-industries-bottom li img{
    width: 0.89rem;
    margin: 0 auto;
	margin-bottom: 0.1rem;

}
.exclusive{
    width: 100%;
    height: 4.34rem;
    background: url("../images/serviceSolution/exclusive.png") no-repeat center;
    background-size: 100% 4.34rem;
    position: relative;
}
.exclusive-btn{
    position: absolute;
    bottom:0.96rem;
    left: 52%;
    transform: translateX(-45%);
    width: 1.69rem;
    height: 0.6rem;
    background: transparent;
    cursor: pointer;

}
.animation-phone {
    animation-name: fadeInUp, jump;
    animation-duration: .5s, 1.8s;
    animation-delay: 0s, 1s;
    animation-iteration-count: 1, infinite;
    animation-fill-mode: forwards;
    animation-timing-function: linear;
}
@keyframes jump {
    0%, 100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-0.08rem);
    }
}
@-webkit-keyframes fadeInUp {
    0% {
        opacity: 0;
        -webkit-transform: translateY(0.4rem);
    }

    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
    }
}
@-moz-keyframes fadeInUp {
    0% {
        opacity: 0;
        -moz-transform: translateY(0.4rem);
    }

    100% {
        opacity: 1;
        -moz-transform: translateY(0);
    }
}
@-webkit-keyframes fadeInLeft {
    0% {
        opacity: 0;
        -webkit-transform: translateX(-0.2rem);
    }

    100% {
        opacity: 1;
        -webkit-transform: translateX(0);
    }
}
@-moz-keyframes fadeInLeft {
    0% {
        opacity: 0;
        -moz-transform: translateX(-0.2rem);
    }

    100% {
        opacity: 1;
        -moz-transform: translateX(0);
    }
}

@-webkit-keyframes fadeIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}
@-moz-keyframes fadeIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}
@-webkit-keyframes tada {
    0% {
        -webkit-transform: scale(1);
        opacity: 1;
    }

    50% {
        -webkit-transform: scale(1.1);
        opacity: 0.5;
    }

    100% {
        -webkit-transform: scale(1);
        opacity: 1;
    }
}
@-moz-keyframes tada {
    0% {
        -moz-transform: scale(1);
        opacity: 1;
    }

    50% {
        -moz-transform: scale(1.1);
        opacity: 0.5;
    }

    100% {
        -moz-transform: scale(1);
        opacity: 1;
    }
}
@keyframes scrolRight {
    0% {
        transform: translateX(-1.69rem);
    }

    100% {
        transform: translateX(1.69rem);
    }
}
@keyframes scrollLeft {
    0% {
        transform: translateX(1.69rem);
    }

    100% {
        transform: translateX(-1.69rem);
    }
}
