/* body {
  font-family: 'SUIT', sans-serif;
  font-size: 0;
}

h1,
h2 {
  font-size: large;
} */

/* 1. 맴버 서비스 - 가상 요소 선택자 이용 */
/* .member-service {
  display: inline-block;
  text-transform: uppercase;
  font-size: 1rem;

  .item {
    float: left;
    text-decoration: none;
    color: inherit;
  }

  .item::before {
    content: '|';
    margin: 8px;
  }
  .first::before {
    content: none;
    margin: 0px;
  }
} */

/* 2. 멤버 링크 - 리스트 이용 */
/* .member-link {
  display: inline-block;
  padding: 0;
  text-transform: uppercase;

  li {
    list-style: none;
    float: left;

    a {
      text-decoration: none;
      color: inherit;
      font-size: 1rem;
    }
    span {
      margin: 0 0.5rem;
      font-size: 1rem;
    }
  }
} */

/* 예시 코드 */
/* 스타일 초기화 */
body *,
body *::before,
body *::after {
  box-sizing: border-box;
}

a {
  text-decoration: none;
  color: inherit;
}

ul,
li {
  list-style: none;
  padding-left: 0;
}

body {
  font-family: 'SUIT', sans-serif;
}

/* 멤버 서비스 */
.member-service {
  background: yellow;
  display: flow-root;

  a {
    background-color: lime;
    float: left;
    text-transform: uppercase;
  }

  a:nth-child(n + 2)::before {
    background-color: red;
    content: '|';
    margin: 0 0.5em;
  }
}

/* 멤버 링크 */
.member-link {
  border: 1px solid red;
  display: flow-root;

  li {
    background: skyblue;
    float: left;

    span {
      background: pink;
      float: left;
      margin: 0 0.5em;
    }
    a {
      background: orange;
      float: left;
      text-transform: uppercase;
    }
  }
}