<body id="shop_body">
  
    <main role="main" id="shop_main">
    <div class="shop_container">
      
      <div class="brand_wrap shop_border">
        <ul class="brand_lists">
          <li><img src="https://via.placeholder.com/64"></li>
          <li><img src="https://via.placeholder.com/64"></li>
          <li><img src="https://via.placeholder.com/64"></li>
          <li><img src="https://via.placeholder.com/64"></li>
          <li><img src="https://via.placeholder.com/64"></li>
          <li><img src="https://via.placeholder.com/64"></li>
          <li><img src="https://via.placeholder.com/64"></li>
          <li><img src="https://via.placeholder.com/64"></li>
          <li><img src="https://via.placeholder.com/64"></li>
        </ul>
      </div>

    </div>  
  </main>
  
  <footer id="shop_footer">
    <div class="shop_container">
    
      <div class="policy_wrap">
        <span>네이버 이용약관</span>
        <span>네이버 이용약관</span>
        <span>네이버 이용약관</span>
        <span>네이버 이용약관</span>
        <span>네이버 이용약관</span>
        <span>네이버 이용약관</span>
        <span>네이버 이용약관</span>
        <span>네이버 이용약관</span>
        <span>네이버 이용약관</span>
        <span>네이버 이용약관</span>
      </div>

      <p>네이버는 통신판매 당사자가 아닙니다. 거래에 관한 의무와 책임은 판매자에게 있습니다.</p>
    </div>  
  </footer>
* {
  margin: 0;
  padding: 0;

  box-sizing: border-box;
}

ol, ul {
  list-style: none;
}

a {
  text-decoration: none;
  color: #000000;
}

img {
  vertical-align: middle;
}

main {
  overflow: hidden; 
  padding-top: 20px;
}



/* shop - main  */
#shop_body {
  background-color: #e9ecef;
}

.shop_container {
  width: 1290px;
  margin: 0 auto;
}

.w-100 {
  width: 100%;
}

.h-100 {
  height: 100%;
}

.shop_border {
  border: solid 1px #ced2d7;
}

#shop_main .brand_wrap {
  background-color: #fff;
}

#shop_main .brand_wrap .brand_lists {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;

  padding: 18px 18px;
}

#shop_main .brand_wrap .brand_lists li {
  width: 64px;
  height: 64px;
}

#shop_main .brand_wrap .brand_lists li img {
  width: 100%;
  height: 100%;
}



/* shop - footer  */
#shop_footer {
  padding-bottom: 80px;

  text-align: center;
}

#shop_footer .policy_wrap {
  border-top: solid 2px #5d5d5d;
  padding-top: 50px;
  margin: 30px auto 11px;

  font-size: 12px;
}

#shop_footer .policy_wrap span:before {
  content: "";
  display: inline-block;
  width: 1px;
  height: 11px;
  margin: 0 8px;
  background-color: #d7d7d7;
  vertical-align: -1;
}

#shop_footer .policy_wrap span:first-child:before {
  content: initial;
}

#shop_footer p {
  font-size: 12px;
  color: #888;
  margin-bottom: 11px;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.