﻿
img{ width:100%}
html,body{
     overflow-x: hidden;
}
 .more_jt::after {
     border-bottom:0.0625rem dashed #fff !important;
}
 .mobile{
     display:none;
}
 .tc{
     text-align:center;
}
 .t1{
     font-size: 3.625rem;
     line-height: 2.125rem;
     line-height: 0.75;
     color:#FF7630;
     padding-top:10rem;
     font-family: youshe;
}
 .t2{
     font-size:1rem;
     color:#7D7D7D;
     padding-top: 0.875rem;
     margin-bottom:3.8125rem;
     line-height: 1.5;
}
 .step2 .context {
     margin-bottom:8.75rem;
     display: flex;
}
 .step2 .context .right .txt2 {
     position: absolute;
     top: 50%;
     transform: translateY(-50%);
     margin-left: 2.0625rem;
     font-size: 1.5rem;
     color: #fff;
}
 .step2 .context .right .txt1 {
     position: absolute;
     top: 45%;
     transform: translateY(-50%);
     margin-left: 2.0625rem;
     font-size: 4rem;
     color: #FFFFFF;
     opacity: 0.2;
}
 .step2 .context .left .txt1 {
     position: absolute;
     bottom: 5%;
     transform: translateX(-50%);
     font-size: 4rem;
     color: #FFFFFF;
     opacity: 0.2;
     top:unset;
     left:35%;
}
 .step2 .context .left .txt2 {
     position: absolute;
     bottom: 10%;
     transform: translateX(-50%);
     left: 50%;
     width: 100%;
     font-size: 1.5rem;
     color: #fff;
     top:unset;
}
 .step2 .context .left {
     position:relative;
     width: 31.5%;
     float: left;
}
 .step2 .context .right{
     float:left;
     width: 67.5%;
}
 .step2 .context .right .r-item {
     position:relative;
     width: calc(50% - 2.0625rem);
     float:left;
     margin-left:2.0625rem;
     margin-bottom:2.0625rem;
}
 .step2 .context .right .r-item:nth-child(3),.step2 .context .right .r-item:nth-child(4){
     margin-bottom:0 
}
 .step3 .context{
     margin-top: 6.375rem;
     display: flex;
     flex-wrap: wrap;
     justify-content: center;
     align-items: center;
     justify-items: center;
     align-content: center;
}
 .step3 .context .item{
     position:relative;
     align-items: center;
     justify-content: center;
     display: flex;
     width:calc(33% - 2.0625rem);
     margin-left:2.0625rem;
     background:#fff;
     height:8.125rem;
     margin-bottom:5.875rem;
     padding:  0 0.9375rem;
}

 .step3 .context .item:hover{
     box-shadow: 0.5625rem 0.5625rem 1.6875rem 0rem rgba(45,47,52,0.16);
     transition: all 0.5s;
}
 .step3 .context .item:nth-child(1),.step3 .context .item:nth-child(4){
     margin-left: 0;
}
 .step3 .context .item1:after{
     content: '';
     position: absolute;
     background: url(/2020_new/images/oemagent/1726.png);
     top: -2.5rem;
     height: 5rem;
     width: 5rem;
     background-repeat: no-repeat;
     background-size: 100%;
     left: 50%;
     transform: translateX(-50%);
}
 .step3 .context .item2:after{
     content: '';
     position: absolute;
     background: url(/2020_new/images/oemagent/1727.png);
     top: -2.5rem;
     height: 5rem;
     width: 5rem;
     background-repeat: no-repeat;
     background-size: 100%;
     left: 50%;
     transform: translateX(-50%);
}
 .step3 .context .item3:after{
     content: '';
     position: absolute;
     background: url(/2020_new/images/oemagent/1728.png);
     top: -2.5rem;
     height: 5rem;
     width: 5rem;
     background-repeat: no-repeat;
     background-size: 100%;
     left: 50%;
     transform: translateX(-50%);
}
 .step3 .context .item4:after{
     content: '';
     position: absolute;
     background: url(/2020_new/images/oemagent/1729.png);
     top: -2.5rem;
     height: 5rem;
     width: 5rem;
     background-repeat: no-repeat;
     background-size: 100%;
     left: 50%;
     transform: translateX(-50%);
}
 .step3 .context .item5:after{
     content: '';
     position: absolute;
     background: url(/2020_new/images/oemagent/1730.png);
     top: -2.5rem;
     height: 5rem;
     width: 5rem;
     background-repeat: no-repeat;
     background-size: 100%;
     left: 50%;
     transform: translateX(-50%);
}
 .step3 .context .item6:after{
     content: '';
     position: absolute;
     background: url(/2020_new/images/oemagent/1731.png);
     top: -2.5rem;
     height: 5rem;
     width: 5rem;
     background-repeat: no-repeat;
     background-size: 100%;
     left: 50%;
     transform: translateX(-50%);
}
 .step4 .context {
     display: flex;
     justify-content: space-between;
     align-items: center;
     margin-bottom:10rem;
}
 .step4 .context .item{
     position:relative;

     background-repeat: no-repeat;
}
 .step4 .fh{
     font-size:2rem;
     color:#FF7630;
     margin: 0 2.5%;
}
 .step4 .item1{
     /*padding-left: 1.8125rem;
     padding-right: 4.5rem;*/
          min-width:197px;
     background-image:url("/2020_new/images/oemagent/sr-01.jpg");
}
 .step4 .item2{
    /* padding-left: 1.8125rem;
     padding-right: 4.5rem;*/
          min-width:197px;
     background-image:url("/2020_new/images/oemagent/sr-02.jpg");
}
 .step4 .item3{
    /* padding-left: 1.8125rem;
     padding-right: 4.5rem;*/
          min-width:197px;
     background-image:url("/2020_new/images/oemagent/sr-03.jpg");
}
 .step4 .item4{
   /*  padding-left: 1.8125rem;
     padding-right: 4.5rem;*/
          min-width:197px;
     background-image:url("/2020_new/images/oemagent/sr-04.jpg");
}
 .step4 .item5{
    /* padding-left: 1.8125rem;
     padding-right: 4.5rem;*/
          min-width:197px;
     background-image:url("/2020_new/images/oemagent/sr-05.jpg");
}
 .step4 .ico img{
     width:auto;
     padding-top: 2.5rem;
     padding-bottom: 1.4375rem;
}
 .step4 .ico3 img{
     padding-bottom:2.25rem;
     width: 4.375rem;
}
 .step4 .txt{
     padding-bottom:1.4375rem;
}
 .step4 .txt{
     color:#FFFFFF;
}
 .step4 .item1 .txt{
     color:#313540;
}
 .step4 .txt-1{
     font-size:1.5rem;
     font-weight:bold;
}
 .step4 .txt-2{
     font-size:1.5rem;
}
 .step5{
     position:relative;
}
 .step5-c{
     position: absolute;
     left: 50%;
     transform: translateX(-50%);
     width: 100%;
}
 .step5-bg-line{
     display:flex;
     flex-flow: wrap;
}
 .step5-bg-line1 .item{
     padding-top: 17.5rem;
}
 .step5-bg-line .item{
     flex-wrap: wrap;
     display: flex;
     justify-content: center;
     align-items: center;
     border-left:0.0625rem solid #eee;
     width:25%;
}
 .step5-bg-line .item:nth-child(4),.step5-bg-line .item:nth-child(8){
     border-right:0.0625rem solid #eee;
}
 .step5-bg-line .item img{
     width:4.6875rem;
     height:3.75rem;
     margin-top: 3.125rem;
}
 .step5-bg-line .item .txt-1{
     width:100%;
     margin-top:1.5rem;
     margin-bottom:1.8125rem;
     font-size:1.25rem;
     font-weight:bold;
     color:#313540;
}
 .step5-bg-line .item .txt-2{
     margin-bottom:3.375rem;
     padding: 0 2.875rem;
     color:#7D7D7D;
     font-size:1rem;
     line-height: 1.5rem;
     overflow : hidden;
     text-overflow: ellipsis;
     display: -webkit-box;
     -webkit-box-orient: vertical;
      min-height:120px;
}
 .step5-bg-line2 .item:hover{
     box-shadow: 0.5625rem 0.5625rem 1.6875rem 0rem rgba(45,47,52,0.12);
     background: #fff;
}
 .step6{
     padding-bottom: 6.25rem;
     background-size: 100%;
     background: url(/2020_new/images/oemagent/bg.jpg) 
}
 .step6 .t1{
     padding-top: 6.25rem;
     color:#FF7630;
}
 .step6 .t2{
     color:#fff;
}
 .step6 .c-1{
     text-align:left;
     display: flex;
     justify-content: center;
     align-items: center;
}
 .step6 .c-txt{
     padding-left:1.25rem;
     position:relative;
     font-size:1.25rem;
     color:#7E8F9A;
     margin-bottom: 0.625rem;
}
 .step6 .c-txt:before {
     left: 0;
     content: '';
     position: absolute;
     width: 0.625rem;
     height: 0.625rem;
     border-radius: 50%;
     top: 50%;
     background-color: #7E8F9A;
     transform: translateY(-50%);
     box-shadow: 0rem 0rem 0rem 0.3125rem rgba(126,143,154,0.2);
}
 .step6 .c-line {
     border-bottom: 0.0625rem dashed #7E8F9A;
     width: 5%;
     margin: 0 0.625rem;
     margin-top:-0.625rem;
}
 .step6 .swiper-container{
     overflow:unset;
     margin-top: 5rem;
     text-align:center;
     height: 37.5rem;
}
 .step6 .swiper-slide{
     background: rgba(255,255,255,0.95);
   transition: all 0.5s;
}
.step6 .swiper-button-prev, .step6 .swiper-button-next {
    width: 65px;
    height: 65px;
    background: #fff;
    border-radius: 65px;
}
.step6 .swiper-button-prev {
    transform: rotate(90deg);
    left: -110px;
}

.step6 .swiper-button-next {
    transform: rotate(270deg);
    right: -110px;
}
 .step6 .swiper-slide .ico{
     position: absolute;
     top: 0;
     left: 50%;
     transform: translate(-50%,-50%);
}
 .step6 .txt-1{
     color:#424758;
     font-size:2rem;
     margin-top:5.625rem;
}
 .step6 .txt-2 {
     color:#7E8F9A ;
     font-size:1rem;
     margin-top:1rem;
     margin-bottom:1.8125rem;
}
 .step6 .txt-d{
     text-align:left;
     padding: 0 1.5rem;
}
 .step6 .line{
     border-top:0.0625rem dashed #7E8F9A;
     padding:0.625rem 0 
}
 .step6 .lastline{
     border-bottom:0.0625rem dashed #7E8F9A;
}
 .step6 .txt-d-t{
     font-size:0.875rem;
     color:#7E8F9A;
}
 .step6 .line .txt-d-d{
     margin-top: 0.8125rem;
     font-size:1rem;
     color:#7D7D7D;
}
 .step6 .line .txt-d-d img{
     width: 1.25rem;
     height: 1.25rem;
     margin-right: 0.5625rem;
     display:inline-block 
}
 .step6 .line .txt-d-2{
     width: calc(100% - 2.2rem);
     display:inline-block;
     vertical-align:top;
}
 .step7{
     position:relative;
}
 .step7 .context{
     display: flex;
     text-align: left;
}
 .step7 .context .left {
     width:50%;
}
 .step7 .context .right {
     width:60rem;
}
 .step7 .l-item{
     display: flex;
     justify-items: center;
     align-items: center;
     margin-bottom: 2.8125rem;
}
 .step7 .l-txt{
     width:100%;
     margin-left: 1.5rem;
}
 .step7 .l-txt-1{
     font-size:1.25rem;
     font-weight:bold;
     color:#313540;
}
 .step7 .l-txt-2{
     font-size:1rem;
     margin-top:1.25rem;
}
 .step7 .l-img{
     width:6rem;
     height:6.875rem;
}
 .step8{
     margin-bottom:9.4375rem !important;
}
 .step8 .context{
     display: flex;
     justify-content: center;
     align-items: center;
}
 .step8 .item-img
 {
   position:relative;    
 }
 .step8 .item-img img{
     width:6.25rem;
     height:6.25rem;
   
}
 .step8 .item-txt1{
     font-size: 1.25rem;
     color:#313540;
     font-weight:bold;
     margin-top: 1.1875rem;
}
 .step8 .item-txt2{
     margin-top: 1.25rem;
     font-size:1rem;
     color:#7D7D7D;
     height:40px;
}
 .step8 .context .item{
     width:25%;
     position:relative;
}
 .lines 
 {
     width: 65%;
     border-bottom: 0.0625rem dashed #7E8F9A;
     position: absolute;
     top: 50%;
     transform: translateY(-50%);
     left: 67%;
     
}
 .lines:after {
     content: '';
     position: absolute;
     width: 0.375rem;
     border-radius: 50%;
     height: 0.375rem;
     background: #7D7D7D;
     top: -0.1875rem;
     right: 0;
}
 .step9 .context{
     display: flex;
}
 .step9 .context .left{
     width:50% 
}
 .step9 .context .right {
     width:60rem;
}
 .step9 .context .title{
     font-size:3rem;
     color:#313540;
     margin-top:4rem;
     font-weight: bold;
}
 .step9 .context .detail{
     font-size:1.25rem;
     color:#7D7D7D;
     margin-top:1.75rem;
}
 .step9 .input {
     width:100%;
}
 .step9 .input label{
     margin-bottom:1.25rem;
}
 .step9 .input input{
     border: 1px solid #DEE0E7;
      padding-left:1.25rem;
     line-height:3.75rem;
     width: 100%;
     width: calc(100% - 1.25rem);
}
 .step9 .input input::placeholder{
     color:#ccc;
    
}
 .step9 .input label{
     color:#7E8F9A;
     font-size:1rem;
     display:block;
     margin-top:1.6875rem;
}
 .step9 .ib{
     width: 50%;
    
}

 .step9 .submit {
     background: #FF7630;
     width: 100%;
     border: none;
     line-height: 4rem;
     text-align: center;
     color: #fff;
     margin-top:1.75rem;
}
 .step6 .icon-down{
     font-size :2rem 
}
.step6  .swiper-button-next,  .step6  .swiper-button-prev
{
  top: 65%;
}

.step6 .swiper-button-prev:hover::before, .step6 .swiper-button-next:hover::before {
    transition: all 0.5s;
    top: 65%;
}
.step6 .icon-down::after {
    content: '';
    border-bottom: 1px dashed #FF991E;
    position: absolute;
    width: 0%;
    transform: rotate(270deg);
    left: 35%;
    bottom: 66%;
}
.step6 .swiper-button-prev:hover::after, .step6 .swiper-button-next:hover::after {
    bottom: 50%;
    width: 30%;
}

.step6 .icon-down:before {
    font-size: 19px;
    transform: translate(-50%, -50%);
    top: 50%;
    position: absolute;
}
 .step6 .act{
     color:#FF7630 
}
 .hidden{
     display:none;
}
 .submit_btn_vertify_box{
     display:none;
}
 .o-w-73{
     margin:0;
     margin-left:26%;
}

@media screen and (max-width:1680px) {
   .step9 .submit{ line-height:2rem;}
   .step9 .input input{ line-height:2rem;}
}

@media screen and (max-width:1600px) 
{
 
   /*.step8 .item-txt2{ width:70%;}*/
   .step9 .submit{ line-height:2rem;}
   .step9 .input input{ line-height:2rem;}
   .step7 .l-item{ margin-bottom:2rem;}
   /*.ico3{padding-right: 4.5rem;}*/
   .step4 .item1, .step4 .item2,.step4 .item3,.step4 .item4,.step4 .item5{ padding-right:0}
   .step6 .swiper-button-next{    right:-6.5%}
   .step6 .swiper-button-prev{    left: -6.5%;}
   .step7 .l-txt-2{    padding-right: 1.25em;}
    .step9 .input label{    margin-top: 1rem;}
    .step9 .context .title{ margin-top:6rem}
}
@media screen and (max-width:1440px) 
{
    .step8 .item-txt2{/*width: 65%;*/
    margin: 0 auto;
    margin-top: 20px; }
     .step4 .item1, .step4 .item2,.step4 .item3,.step4 .item4,.step4 .item5{ min-width:180px; }
}
 
 @media screen and (max-width: 1367px) 
 {
          .step4 .item1, .step4 .item2,.step4 .item3,.step4 .item4,.step4 .item5{ min-width:170px; }
     .step7 .l-txt-2{
         margin-top: 0.785rem;
         width:80%;
    }
.step8 .item-txt2{/*width: 65%;*/
    margin: 0 auto;
    margin-top: 20px; }
     .step9 .input input{
         line-height: 2rem;
    }
     .step9 .input input{
         line-height: 2rem;
    }
     .step9 .input label{
         margin-bottom: 0.625rem;
         margin-top: 0.9375rem;
    }
     .step9 .submit{
         line-height: 2rem;
    }
     .step8 .context .item:before{
         left: 46%;
         width: 45%;
    }
     .step7 .l-item{
         margin-bottom:1rem;
    }
     .step7 .l-img{
         height:auto;
    }
    /* .step8 .item-txt2{
         width:75% 
    }*/
     .lines{
            width: 55%;
            left: 71%;
    }
     .step9 .context .w-73{
         width:75%;
    }
     .step9 .context .left{
         width: 50%;
    }
     .step9 .context .right,.step7 .context .right{
         width: 50%;
         float: right;
    }
     .step9 .context .title{
         margin-top:2rem;
    }
}
 @media screen and (max-width: 1280px) {
     .step2,.step4,.step5,.step7{
         display:none;
    }
     .step3 .context{
         margin-top: 3.1875rem;
    }
     .step3 .context .item{
         margin-bottom: 3.25rem;
         width: calc(50% - 0.9375rem);
         margin-left: 0.9375rem;
    }

     .step3 .context .item1:after, .step3 .context .item2:after, .step3 .context .item3:after, .step3 .context .item4:after, .step3 .context .item5:after, .step3 .context .item6:after{
            top: -2.8rem;
            height: 5rem;
            width: 5rem;
            left: 50%;
    }
     .step3 .context .item:nth-child(3),.step3 .context .item:nth-child(5){
         margin-left:0rem;
    }
     .step3 .context .item:nth-child(4){
         margin-left:0.9375rem;
    }
     .step6 .line .txt-d-2{
         width: calc(100% - 3rem);
    }
     .step6 .t1{
         padding-top: 2.25rem;
    }
     .step6 .c-1{
         flex-wrap: wrap;
    }
     .step6 .c-txt{
         font-size:0.875rem;
    }
     .step8{
         margin-bottom:0rem !important;
    }
     .step8 .context{
         margin-bottom: 3.375rem;
         text-align: center;
    }
     .step8 .item-img{
         margin: 0 auto;
         margin-bottom: 1rem;
    }
     .step8 .context .item{
         width: 50%;
         margin-bottom: 2rem;
         padding-right:0;
         margin-left: 0;
    }
     .step8 .context .item:before{
         border-bottom:unset;
    }
     .step9 .context{
         flex-wrap: wrap;
    }
     .step9 .input input{
         line-height:2rem;
    }
     .step9 .submit{
         line-height:2rem;
    }
     .step9 .context .w-73{
         width:75%;
    }
     .step9 .context .left{
         width: 50%;
    }
     .step9 .context .right{
         width: 50%;
         float: right;
    }
     .step9 .context .detail{
         margin-top:0.625rem;
    }
     .step9 .context .title{
         margin-top: 3.5rem;
    }
     .step9 .submit{
         margin-top: 0.625rem;
    }

}
@media screen and (max-width:1100px) 
{
    .step9 .context .title{margin-top: 1rem;}
    .step6 .swiper-button-prev,.step6 .swiper-button-next{display:none;}
      .step8 .context .item{
         width: 50%;
         margin-bottom: 2rem;
         padding-right:0;
         position:unset;
         margin-left: 0;
    }
    
     .step8 .context{
         margin-bottom: 3.375rem;
         text-align: center;
        flex-flow: wrap;
    }
   .step8 .lines{ display:none;}
   .step8 .item-txt2{ width:100%;    padding: 0 5px;}
} 

 @media screen and (max-width:787px) 
 {
     .t1{    padding-top: 3.75rem;    font-size: 2.75rem;}
     .step9 .context .title {
    margin-top: 3.5rem;
}
.pc{ display:none;}
     .mobile{ display:block}
   
     .w-73{
         width:100% !important;
         /*padding: 0 0.7125rem 0 0.625rem;*/
    }
     .step6 .swiper-slide-active{
         height: auto !important;
         min-height : 32.5rem;
        /*这个根据自身的情况，可加可不加*/
    }
     .step9 .context .left, .step9 .context .right{
         width:100%;
    }
     .step9 .context .left{
             margin-bottom: 3.5rem;
    }
     .step9 .context .right{
         display:none;
    }
    .step6 .swiper-button-prev,.step6 .swiper-button-next{ display:none;}
     .step6 .swiper-slide{  margin-left:20px;    width: 80%; height:auto; }
}
 