@charset "UTF-8";

.site-wrap { background: #16191D; }
.site-wrap .container { display: flex; }
.site-wrap .container .family_site { flex: 1; }
.site-wrap .container .family_site {width:100%;position:relative}
.site-wrap .container .family_site .btn_site {width:100%;padding:16px;text-align:left;position:relative}
.site-wrap .container .family_site:first-child .btn_site {padding-left: 0; border-right: 1px solid rgba(255,255,255,0.2);}
.site-wrap .container .family_site:last-child .btn_site {padding-right: 0;}
.site-wrap .container .family_site .btn_site::after {font-family:'xeicon';content:'\e936';position:absolute;right:16px;top:50%;transform:translateY(-50%);transition:transform 0.3s; color: #fff;}
.site-wrap .container .family_site .btn_site .text {color: #fff;}
.site-wrap .container .family_site .btn_site.on {background-color:#222;}
.site-wrap .container .family_site .btn_site.on::after {transform:translateY(-50%) rotate(180deg)}
.site-wrap .container .family_site .site_list {display:none;width:100%;max-height:300px;background-color:#333;border:1px solid rgba(255,255,255,0.2);border-bottom:0;border-radius:8px 8px 0 0;position:absolute;left:0;bottom:50px;z-index:1;overflow-y:scroll;}
.site-wrap .container .family_site .site_list .bundle {border-bottom:1px solid rgba(255,255,255,0.2)}
.site-wrap .container .family_site .site_list .bundle:last-child {border-bottom:0}
.site-wrap .container .family_site .site_list .bundle a {display: block; padding:9px 16px;opacity:0.8;color: #fff;}
.site-wrap .container .family_site .site_list .bundle a:hover,
.site-wrap .container .family_site .site_list .bundle a:focus {background-color:rgba(0,0,0,0.4);opacity:1}

.footer {padding:60px 0 70px 0;color:#fff;background-color:var(--colorNavy)}
.footer a, 
.footer button {display:block;color:#fff}
.footer .grid {display:flex; gap: 30px;}
.footer .grid .col {flex: 1;}
.footer .grid .col.left {}
.footer .grid .col.right {}
.footer .logo {margin-bottom:25px}
.footer .dl_list {opacity:0.7}
.footer .dl_list .dl {}
.footer .dl_list .dl::after {background-color:rgba(255,255,255,0.2)}
.footer .dl_list .dl:first-child {display:block}
.footer .dl_list .dt {}
.footer .dl_list .dd {}
.footer .quick_page {display:grid;grid-template-columns:1fr 1fr;gap:8px}
.footer .quick_page .quick {}
.footer .quick_page .link {display:flex;align-items:center;justify-content:space-between;width:100%;padding:10px 15px;background-color:rgba(255,255,255,0.1);border-radius:4px}
.footer .quick_page .link:hover,
.footer .quick_page .link:focus {background-color:rgba(0,0,0,0.3)}
.footer .quick_page .link .text {}
.footer .quick_page .link .icon {}
.footer .quick_slide {position:relative}
.footer .quick_slide .bold_txt {margin-bottom:25px;font-size:24px}
.footer .quick_slide .slide_wrap {}
.footer .quick_slide .slide_obj { height: 166px; }
.footer .quick_slide .swiper-slide > a {display:flex !important;align-items:center;justify-content:center;height: 100%; padding:0 10px;text-align:center;border:1px solid rgba(255,255,255,0.3);border-radius:8px}
.footer .quick_slide .slide_box:hover,
.footer .quick_slide .slide_box:focus {background-color:rgba(0,0,0,0.3);border-color:#fff}
.footer .quick_slide .slide_box .text {font-size:17px;line-height:1.4}
.footer .quick_slide .slide_box .s_txt {margin-top:5px;line-height:1;font-weight:200}
.footer .quick_slide .slick-slide {}
.footer .quick_slide .slick-slide > div {display:flex;gap:12px;margin-bottom:12px}
.footer .quick_slide .slick-slide > div:last-child {margin-bottom:0}
.footer .quick_slide .slide_ctrl {display:flex;gap:10px;position:absolute;right:0;top:5px;z-index:0}
.footer .quick_slide .slide_ctrl .arrow {line-height:24px;text-align:center;font-size:22px;opacity:0.8}
.footer .quick_slide .slide_ctrl .arrow:hover, 
.footer .quick_slide .slide_ctrl .arrow:focus {color:var(--colorSub2);opacity:1}
.footer .quick_slide .slide_ctrl .paging {display:none}
.footer .f_bottom {display:flex;align-items:flex-end;justify-content:space-between;margin-top:25px;padding-top:25px;border-top:1px solid rgba(255,255,255,0.2)}
.footer .f_bottom .col {display:flex;align-items:center;column-gap:24px}
.footer .copy {font-weight:300}
.footer .sns_box {display:flex;gap:8px}
.footer .sns_box .sns {width:31px;height:31px;border-radius:100%;overflow:hidden}
.footer .sns_box .sns a {display:flex;align-items:center;justify-content:center;width:100%;height:100%;background-color:rgba(255,255,255,0.2)}
.footer .sns_box .sns a img {max-width:16px;max-height:15px}
.footer .sns_box .sns.youtube a:hover,
.footer .sns_box .sns.youtube a:focus {background-color:#fe080a}
.footer .sns_box .sns.facebook a:hover,
.footer .sns_box .sns.facebook a:focus {background-color:#1e7cf2}
.footer .sns_box .sns.insta a:hover,
.footer .sns_box .sns.insta a:focus {background:radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%)}


