#footer {
    padding:0;
    background-color:#393939;
    position: absolute;
    display: none;
    width:100%;
    color: #fff
  }


@media (max-width: 1100px) {
    #footer {display: block}
}

  #footer p {
    color: rgba(255, 255, 255, 0.6);
    padding: 0;
  }

  #footer .site_list {display: flex;flex-grow: 0;margin:0;background-color: #272727;}
  #footer .site_item {display:flex;position: relative;}

  #footer .site_item .site_open {
      width:100%;

    border-right: 1px solid #393939;
    border-radius: 0;
    color:#fff;
    position: relative;
    display:flex;
    align-items: center;
    padding: 10px;
    font-size: 10px;
    text-align:left;
  }

  #footer .site_item:last-child .site_open {border:0}


  #footer .site_item .site_open:before {
    position: absolute;
    content:url(../images/footer_arrow_up.png);
      right:10px;
      top:50%;
      transform: translateY(-50%);
}

#footer .site_item .site_open.active:before {
  position: absolute;
  content:url(../images/footer_arrow_down.png);
}


  #footer .site_item .site_link ul li {padding: 4px;padding-right:0;padding-bottom:0;position: relative;}
  /* #footer .site_item .site_link ul li:before {position:absolute;content:'';width:4px;height:4px;border-radius:100%;background-color:#393939;top:23px;left:10px;} */
  #footer .site_item .site_link ul li span {font-weight: 700}
  /* #footer .site_item .site_link ul li ul li:before {width:5px;height:2px;border-radius: 0} */


  #footer .site_item .site_panel {display: none;height:0;opacity:0;transition: all .2s ease;background:#fff;  position: absolute; width:100%;
    bottom: 100%;   /* 버튼 위에 붙이기 */
    left: 0;
    color:#393939;
    border:solid 1px #393939;
    z-index: 10;    /* 다른 요소 위로 */}
  #footer .site_item .site_panel.active {display: block;height:310px;opacity:1;overflow: auto;}
  #footer .site_item .site_panel * {font-size: 10px}
  #footer .footer_nav {
    padding:0;
    line-height:1;
    padding-bottom:30px
  }

  #footer .footer_nav ul {
    margin:0;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    margin-bottom: 8px
  }



  #footer .footer_nav a {
    color: #adadad;
    font-weight: 400;
    text-align: center;
    font-size: 11px
  }

  #footer .footer_nav .privacy a {
    color: #5289ec;
    font-weight: 600;
  }

  #footer .footer_nav li {position: relative;padding-right:20px}
  #footer .footer_nav li:before {
      position: absolute;
      content: '·';
    top:50%;
    right:8px;
    transform: translateY(-50%);
    color: #8f8f8f;
  }
  #footer .footer_nav li:last-child {padding-right:0}
  #footer .footer_nav li:last-child:before {display: none}

  #footer .footer_info {
    font-size: 10px;
    padding: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;

  }
  #footer .footer_info ul li:not(:last-child) {    margin-bottom:4px}

  @media (min-width: 481px) {  #footer .site_item {flex-grow: 1; flex-shrink: 1};}
  @media (max-width: 480px) {
    #footer .site_list {flex-wrap: wrap;}
    #footer .site_item {width:33.3333%;}
    #footer .site_item:nth-of-type(1),#footer .site_item:nth-of-type(2),#footer .site_item:nth-of-type(3) {border-bottom: solid 1px #393939}
    #footer .site_item:last-child{border-right:solid 1px #393939}
    #footer .site_item .site_open {text-align: center; justify-content: center}
  }
  @media (max-width: 390px) {
    #footer .site_list {flex-wrap: wrap;}
    #footer .site_item {width:50%;}
    #footer .site_item:nth-of-type(4) {border-bottom: solid 1px #393939}
  }