@charset "utf-8";

.consulting {}

/**순서 */
.consulting .setpIcon {width:100%;  margin:0 auto;}
.consulting .setpIcon ul.stepUl {display:flex; flex-wrap:wrap; justify-content: space-between; }
.consulting .setpIcon ul.stepUl li {position:relative; width:calc(25% - 30px); }
.consulting .setpIcon ul.stepUl li::after {content:""; position:absolute; top:50%; right:-35px; transform:translateY(-50%); width:30px; height:30px; background-image:url('./step_arrow.svg'); background-position:center; background-size:contain; background-repeat:no-repeat ; }

.consulting .setpIcon ul.stepUl li:last-child::after {display:none;}
  /**아이콘 */
  .consulting .setpIcon ul.stepUl li .stepCont {width:200px; height:200px; border-radius:50%; border:1px solid #dedede; margin:0 auto;}
  .consulting .setpIcon ul.stepUl li .topIcon {position:relative; margin:0 auto; text-align:center; width:120px; height:120px; line-height:145px; border-radius:50%; z-index:0;}
  .consulting .setpIcon ul.stepUl li .topIcon img {position:relative; height:6em; z-index:1;}

  .consulting ul.rowUl {border-top:2px solid #b8b8b8; border-bottom:2px solid #b8b8b8; padding:10px 0;}
  .consulting ul.rowUl li.row {display:flex; flex-wrap:wrap;  padding:20px 10px;}
  .consulting ul.rowUl li.row .coltit {width:200px; }
  .consulting ul.rowUl li.row .colcont {width:calc(100% - 200px);}
  .consulting ul.rowUl li.row .colcont .bullet {position:relative; padding:3px 0 3px 15px; color:#555;}
  .consulting ul.rowUl li.row .colcont .bullet::before {content:""; position:absolute; top:12px; left:0; width:4px; height:4px; background-color:#555;}
  
  @media screen and (max-width:1200px){
    .consulting .setpIcon ul.stepUl li .stepCont {width:120px; height:120px; }
    .consulting .setpIcon ul.stepUl li .topIcon {text-align:center; width:70px; height:70px; line-height:75px; }
    .consulting .setpIcon ul.stepUl li .topIcon img {height:4em;} 
    .consulting .setpIcon ul.stepUl li::after { width: 20px; height: 20px; right:-40px;}
  }
  @media screen and (max-width:768px){
    .consulting .setpIcon ul.stepUl li { width:calc(33.333% - 30px); margin-bottom:20px; }
    .consulting ul.rowUl li.row .coltit {width:130px; }
    .consulting ul.rowUl li.row .colcont {width:calc(100% - 130px);}
  }

  @media screen and (max-width:560px){
    .consulting .setpIcon ul.stepUl li { width:calc(50% - 30px); }
  }

  @media screen and (max-width:480px){
    .consulting ul.rowUl li.row .coltit {width:100%; }
    .consulting ul.rowUl li.row .colcont {width:100%;}
  }