.footer {background-color: #221f20;color: #fff;padding: 3rem 0;}
.footer .footer_wrap {display: flex;justify-content: space-between;align-items: flex-start;align-items: center;}
.footer .footer_wrap .terms_list {display: flex;}
.footer .footer_wrap .terms_list li {position: relative;padding-right: 1.25rem;margin-right: 1.25rem;}
.footer .footer_wrap .terms_list li:after {content: "";display: block;width: 1px;height: 19px;background: rgba(255, 255, 255, 0.28);position: absolute;right: 0;top: 50%;transform: translateY(-50%);}
.footer .footer_wrap .terms_list li:last-child {margin-right: 0;padding-right: 0;}
.footer .footer_wrap .terms_list li:last-child:after {display: none;}
.footer .family_site {background: #000;color: #fff;border-radius: 14px;position: relative;}
.footer .copyright{color: var(--gray-400);font-size: .875rem;margin-top: .875rem;}
.footer .family_site button {font-size: 1rem;width: 18.125rem;text-align: left;padding: 1.25rem 2.1875rem;position: relative;}
.footer .family_site button:after {content: '';display: block;background: url(../../img/fs_button.png) no-repeat center;width: 1.5rem;height: 1.5rem;position: absolute;right: 1.375rem;top: 50%;transform: translateY(-50%);transition: all 0.5s;}
.footer .family_site.active button:after{transform: rotate(180deg) translateY(50%);transition: all 0.5s;}
.footer .family_site .family_list {position: absolute;bottom: 110%;left: 0;background: #fff;border: 1px solid #ccc;width: 100%;overflow: hidden;max-height: 0;opacity: 0;visibility: hidden;transform: translateY(10px);transition: all 0.3s ease;border-radius: 14px;z-index: 55;}
.footer .family_site .family_list li a {display: block;;color: #333;text-decoration: none;padding: 1rem 2.1875rem;font-size: .9375rem;}
.footer .family_site.active .family_list {opacity: 1;visibility: visible;transform: translateY(0);max-height: max-content;}
.footer .family_site .family_list li a:hover {background:#f5f5f5}

/* ------ 반응형 시작 */
@media screen and (max-width:640px){
  .footer .footer_wrap{flex-direction: column-reverse;align-items: flex-start;gap: 20px;}
  .footer .family_site{width:100%}
  .footer .family_site button{width: 100%;}
}