#stepJoinEvent{padding:0 calc((100% - 1200px)/2) 20px}
#stepJoinEvent .title{text-align:center}
#stepJoinEvent .title h3{text-transform:uppercase;font-size:24px;padding:0 40px;height:50px;display:inline-block;color:#fff;position:relative;clip-path:polygon(0 0,100% 0,95% 100%,5% 100%);background:#000}
#stepJoinEvent .title h3 span{display:flex;align-items:center;height:100%}
#stepJoinEvent .content{display:flex;justify-content:space-between;padding-top:20px}
#stepJoinEvent .content>div{text-align:center;text-transform:uppercase;width:20%}
#stepJoinEvent .content>div>img{max-width:100%}
#stepJoinEvent .content>div>div{margin-top:20px}
#stepJoinEvent .content>div>div>strong{display:block;margin-bottom:10px}
@media screen and (max-width:1023px) and (min-width:769px){
    #stepJoinEvent{padding:0 20px 20px}
    #stepJoinEvent .title h3{font-size:14px}
    #stepJoinEvent .content{flex-wrap:wrap}
    #stepJoinEvent .content>div{width:50%;flex-basis:unset}
    #stepJoinEvent .content>div:nth-child(3),#stepJoinEvent .content>div:nth-child(4){margin-top:10px}
}
@media screen and (max-width:768px) {
    #stepJoinEvent{padding:0 10px 20px}
    #stepJoinEvent .title h3{font-size:14px}
    #stepJoinEvent .content{flex-wrap:wrap}
    #stepJoinEvent .content>div:first-child{margin-top:0}
    #stepJoinEvent .content>div{width:100%;background:#000;color:#fff;display:flex;border-radius:100px;margin-top:15px;text-align:left}
    #stepJoinEvent .content>div>img{background:#fff;border-radius:100px;width:100px;height:100%}
    #stepJoinEvent .content>div>div{display:flex;flex-direction:column;justify-content:center;width:calc(100% - 100px);font-size:14px;margin-top:0;padding:0 20px 0 10px}
    #stepJoinEvent .content>div>div>strong{margin-bottom:0}
}