.working-process-one{
display:flex;
align-items:center;
gap:110px;
margin-bottom:40px
}

@media only screen and (max-width:575px){
.working-process-one{
gap:10px;
flex-direction:column;
align-items:start
}}

.working-process-one:last-child{
margin-bottom:0
}

.working-process-one .left{
position:relative;
z-index:5
}

/* BASE DO BLOCO */

.working-process-one .left .icon{
display:flex;
align-items:center;
justify-content:center;
background:#3e484e;
position:relative;
overflow:hidden
}

/* TAMANHO PADRÃO PARA ÍCONE */

.working-process-one .left .icon.icon-font{
height:110px;
width:110px
}

@media only screen and (max-width:575px){
.working-process-one .left .icon.icon-font{
height:90px;
width:90px
}}

/* TAMANHO MAIOR PARA IMAGEM */

.working-process-one .left .icon.icon-image{
height:150px;
width:150px
}

@media only screen and (max-width:575px){
.working-process-one .left .icon.icon-image{
height:120px;
width:120px
}}

/* IMAGEM AJUSTADA */

.working-process-one .left .icon.icon-image img{
width:100%;
height:100%;
object-fit:cover;
display:block
}

.working-process-one .left .icon svg{
width:52px;
height:52px
}

.working-process-one .left .icon svg path{
fill:var(--e-global-color-white)
}

.working-process-one .left .icon i{
font-size:45px
}

.working-process-one .left .icon::after{
position:absolute;
content:"";
background:#fff;
height:19px;
border-radius:30px;
width:19px;
right:-8px;
top:50%;
transform:translateY(-50%);
border:5px solid #3e484e
}

@media only screen and (max-width:575px){
.working-process-one .left .icon::after{
display:none
}}

.working-process-one .inner-content{
padding:40px 50px;
background:#3e484e;
position:relative;
z-index:1
}

@media only screen and (max-width:479px){
.working-process-one .inner-content{
padding:30px 10px 30px 50px
}}

.working-process-one .inner-content .number-main{
position:absolute;
top:50%;
left:0;
transform:translateY(-50%)
}

.working-process-one .inner-content .number-main::after{
content:"";
position:absolute;
height:50px;
width:50px;
left:50%;
top:50%;
transform:translate(-50%,-50%);
background:#3e484e;
z-index:-2;
border-radius:50%
}

@media only screen and (max-width:575px){
.working-process-one .inner-content .number-main::after{
display:none
}}

.working-process-one .inner-content .number-main::before{
content:"";
position:absolute;
width:150px;
border:1px dashed #474e52;
left:-150px;
z-index:-2
}

@media only screen and (max-width:479px){
.working-process-one .inner-content .number-main::before{
display:none
}}

.working-process-one .inner-content .number{
color:var(--e-global-color-white);
width:32px;
height:32px;
border-radius:500%;
background:var(--e-global-color-primary);
display:flex;
align-items:center;
justify-content:center;
font-size:14px;
font-weight:600;
left:-16px;
z-index:-1;
position:absolute;
top:50%;
transform:translateY(-16px)
}

@media only screen and (max-width:575px){
.working-process-one .inner-content .number{
left:10px
}}

.working-process-one .inner-content .title{
color:var(--e-global-color-white);
font-size:20px;
margin-bottom:15px
}

.working-process-one .inner-content .des{
color:#c9c9c9;
margin:0
}

.working-process-one.icon_top{
flex-direction:column;
gap:95px;
align-items:center
}

@media only screen and (max-width:479px){
.working-process-one.icon_top .inner-content{
padding:30px 20px
}}

.working-process-one.icon_top .number-main{
position:absolute;
top:0;
left:50%;
transform:translateX(-51%)
}

.working-process-one.icon_top .number-main::before{
content:"";
position:absolute;
width:120px;
border:1px dashed #474e52;
left:-60px;
z-index:-2;
top:-50px;
transform:rotate(90deg)
}

@media only screen and (max-width:575px){
.working-process-one.icon_top .number-main::before{
display:inline
}}

.working-process-one.icon_top .number-main::after{
left:50%;
top:50%;
transform:translate(-50%,-50%)
}

@media only screen and (max-width:575px){
.working-process-one.icon_top .number-main::after{
display:inline
}}

@media only screen and (max-width:575px){
.working-process-one.icon_top .number-main .number{
left:-15px
}}

.working-process-one.icon_top .left .icon::after{
left:50%;
top:inherit;
bottom:-4px;
transform:translateX(-50%)
}

/* STYLE 2 */

.working-process-two{
display:flex;
flex-direction:column;
align-items:center
}

.working-process-two .inner{
width:192px;
height:192px;
border:2px dashed rgba(32,40,45,.18);
display:flex;
align-items:center;
justify-content:center;
border-radius:50%;
margin-bottom:33px;
transition:.3s;
position:relative
}

.working-process-two .inner .number{
display:inline-block;
position:absolute;
right:5px;
top:7px;
width:40px;
height:40px;
line-height:40px;
text-align:center;
border-radius:50%;
background:var(--e-global-color-primary);
color:var(--e-global-color-white);
transform:scale(0);
transition:.3s
}

.working-process-two .inner .icon{
display:flex;
align-items:center;
justify-content:center;
background:var(--e-global-color-white);
border-radius:50%
}

/* ÍCONE NORMAL */

.working-process-two .inner .icon.icon-font{
height:144px;
width:144px
}

/* IMAGEM MAIOR */

.working-process-two .inner .icon.icon-image{
height:170px;
width:170px
}

.working-process-two .inner .icon.icon-image img{
width:100%;
height:100%;
object-fit:cover
}

.working-process-two .inner .icon svg{
width:45px;
height:45px
}

.working-process-two .inner .icon i{
font-size:45px
}

.working-process-two .inner.scale{
width:245px;
height:245px
}

.working-process-two .inner.scale .icon{
width:193px;
height:193px
}

.working-process-two .inner.scale .icon svg{
width:65px;
height:65px
}

.working-process-two .inner.scale .icon i{
font-size:65px
}

.working-process-two .content{
text-align:center
}

.working-process-two .content .title{
font-size:18px;
line-height:1.2;
margin-bottom:10px
}

.working-process-two .content .des{
margin:0;
padding:0 30px
}

.working-process-two:hover .inner{
border:2px dashed var(--e-global-color-primary)
}

.working-process-two:hover .inner .number{
transform:scale(1)
}