@charset "UTF-8";

.footer_site {background-color:var(--colorWhite);border-top:1px solid var(--colorGray10)}
.footer_site .container {display:flex;border-left:1px solid var(--colorGray10);border-right:1px solid var(--colorGray10)}
.footer_site .drop {flex:1;border-right:1px solid var(--colorGray10);position:relative}
.footer_site .drop:last-child {border-right:0}
.footer_site .drop .btn_drop {display:flex;align-items:center;height:56px;padding:0 24px;color:var(--colorGray90);position:relative}
.footer_site .drop .btn_drop::before, 
.footer_site .drop .btn_drop::after {content:'';background-color:var(--colorGray90);position:absolute;top:50%;transform:translateY(-50%);transform-origin:50% 50%;transform-box:fill-box}
.footer_site .drop .btn_drop::before {width:1px;height:15px;right:31px}
.footer_site .drop .btn_drop::after {width:15px;height:1px;right:24px}
.footer_site .drop .btn_drop .text {display:block;width:calc(100% - 45px);font-weight:500}
.footer_site .drop .drop_list {display:none;width:100%;max-height:250px;background-color:var(--colorGray90);position:absolute;left:0;bottom:57px;z-index:10;overflow-y:auto}
.footer_site .drop .drop_list .site {border-bottom:1px solid rgba(255,255,255,0.2)}
.footer_site .drop .drop_list .site .link {display:flex;column-gap:5px;padding:10px 24px;color:var(--colorWhite)}
.footer_site .drop .drop_list .site .link:hover, 
.footer_site .drop .drop_list .site .link:focus {background-color:var(--colorBlack)}
.footer_site .drop .drop_list .site .link::before {display:inline-block;font-family:'xeicon';content:'\e980';opacity:0.7}

.footer_site .drop.current {}
.footer_site .drop.current .btn_drop {color:var(--colorWhite);background-color:var(--colorGray90)}
.footer_site .drop.current .btn_drop::before {animation:dropHover 0.5s 1 forwards;background-color:var(--colorWhite)}
.footer_site .drop.current .btn_drop::after {animation:dropHover2 0.5s 1 forwards;background-color:var(--colorWhite)}
.footer_site .drop.current .drop_list {}
/*.footer_site .drop .btn_drop:not(.current):hover, 
.footer_site .drop .btn_drop:not(.current):focus {color:var(--colorBlue)}
.footer_site .drop .btn_drop:not(.current):hover::before, 
.footer_site .drop .btn_drop:not(.current):focus::before, 
.footer_site .drop .btn_drop:not(.current):hover::after, 
.footer_site .drop .btn_drop:not(.current):focus::after {background-color:var(--colorBlue)}*/

@keyframes dropHover{
	0% {transform:translateY(-50%) rotate(0deg)}
	100% {transform:translateY(-50%) rotate(270deg)}
}
@keyframes dropHover2{
	0% {transform:translateY(-50%) rotate(0deg)}
	100% {transform:translateY(-50%) rotate(180deg)}
}

#footer {padding:45px 0 55px 0;background-color:#F9FAFC;border-top:1px solid var(--colorGray10)}
#footer a {}
#footer .container {}
#footer .f_top {display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}
#footer .f_logo {font-size:0;line-height:0}
#footer .f_logo img {}
#footer .f_mid {}
#footer .f_mid .info {margin-bottom:3px}
#footer .f_mid .info:last-child {margin-bottom:0}
#footer .f_mid .info .info_txt {display:inline-block;margin-right:7px;padding-right:12px;position:relative}
#footer .f_mid .info .info_txt::after {width:1px;height:15px;content:'';background-color:#B1B8BE;position:absolute;right:0;top:50%;transform:translateY(-50%);opacity:0.2}
#footer .f_mid .info .info_txt:last-child {margin-right:0;padding-right:0}
#footer .f_mid .info .info_txt:last-child::after {display:none}
#footer .btn_group {display:flex;column-gap:24px;align-items:center}
#footer .sns_list {display:inline-block}
#footer .sns_list .sns {display:inline-block;margin-right:5px;vertical-align:bottom;transition:0.3s}
#footer .sns_list .sns:last-child {margin-right:0}
#footer .sns_list .btn {display:flex;align-items:center;max-width:48px;height:48px;border-radius:48px;background-color:#E5E9F0;border:1px solid #E5E9F0;overflow:hidden;transition:0.6s}
#footer .sns_list .btn .icon {display:inline-flex;align-items:center;justify-content:center;width:48px;height:100%}
#footer .sns_list .btn .text {display:inline-block;max-width:0;font-size:14px;font-weight:700;white-space:nowrap;overflow:hidden;transition:0.6s}
#footer .sns_list .btn:hover, 
#footer .sns_list .btn:focus {background-color:#fff;border-color:var(--colorGray90)}
/*#footer .sns_list .btn:hover.youtube, 
#footer .sns_list .btn:focus.youtube {color:#fb1126;border-color:#fb1126}
#footer .sns_list .btn:hover.facebook, 
#footer .sns_list .btn:focus.facebook {color:#1e7cf2;border-color:#1e7cf2}
#footer .sns_list .btn:hover.insta, 
#footer .sns_list .btn:focus.insta {color:#fe08a1;border-color:#fe08a1}
#footer .sns_list .btn:hover.twitter, 
#footer .sns_list .btn:focus.twitter {color:#080808;border-color:#080808}
#footer .sns_list .btn:hover.kakaoch, 
#footer .sns_list .btn:focus.kakaoch {color:#3c2814;border-color:#3c2814}*/

@media screen and (min-width:1280px){
	#footer .sns_list .btn:hover, 
	#footer .sns_list .btn:focus {max-width:220px;padding-left:5px}
	#footer .sns_list .btn:hover .text, 
	#footer .sns_list .btn:focus .text {max-width:220px;padding-right:20px}
}

#footer .btn_top {display:flex;align-items:center;justify-content:center;width:48px;height:48px;font-size:20px;border-radius:10px;box-shadow:0 0 20px rgba(0, 0, 0, 0.2)}
#footer .btn_top:hover, 
#footer .btn_top:focus {color:var(--colorWhite);background-color:var(--colorBlue)}
#footer .f_bottom {display:flex;align-items:center;justify-content:space-between;margin-top:20px;padding-top:22px;border-top:1px solid rgba(255, 255, 255, 0.1)}
#footer .f_bottom .list_txt_group {margin-bottom:0;padding-bottom:0}
#footer .f_bottom .list_txt_group .list_txt {display:inline-block;margin:0 22px 0 0}
#footer .f_bottom .list_txt_group .list_txt:last-child {margin-right:0}
#footer .f_bottom .list_txt_group .list_txt .link {display:block;position:relative}
#footer .f_bottom .list_txt_group .list_txt .link::after {width:0;height:1px;content:'';background-color:var(--colorGray80);position:absolute;left:0;bottom:0;transition:width 0.3s}
#footer .f_bottom .list_txt_group .list_txt .link.c_main::after {background-color:var(--colorMain)}
#footer .f_bottom .list_txt_group .list_txt .link:hover::after,
#footer .f_bottom .list_txt_group .list_txt .link:focus::after {width:100%}
#footer .f_bottom .copy {}