#ft {background: #3c3c3c; position: relative}
#ft .footer_head {display: flex; justify-content: space-between; align-items: center; padding-bottom: 25px; border-bottom: 1px solid var(--font)}
#ft .footer_head .footer_menu {display: flex; align-items: center; gap: 0 30px}
#ft .footer_head .footer_menu li {position: relative}
#ft .footer_head .footer_menu li + li::before {content: ''; display: block; width: 2px; height: 15px; background: var(--white); position: absolute; left: -15px; top: 3px}
#ft .footer_head .footer_menu li a {color: var(--white); transition: all .2s}
#ft .footer_head .footer_menu li a:hover {color: var(--mid-blue)}
#ft .footer_head .footer_link_wrap {display: flex; gap: 0 10px; align-items: center}
#ft .footer_head .footer_link_wrap > ul {display: flex; gap: 0 10px}
#ft .footer_head .footer_link_wrap > ul li a img {width: 29px}

.family_site_wrap {display: inline-block; position: relative}
.family_site_wrap::after {content: ''; display: block; width: 7px; height: 11px; background: var(--white); position: absolute; right: 15px; top: 10px; transform: rotate(90deg)}
.footer-menu-button {color: #fff; border: none; padding: 5px 35px 5px 15px; cursor: pointer; background: transparent; border: 1px solid var(--white); transition: all .2s}
.family_site_wrap.down::after {transform: rotate(270deg)}
  
.footer-menu-button:hover,
.footer-menu-button:focus {background: #555}
.footer-menu-list{display:none;position:absolute;top:100%;left:0;background:#fff;border:1px solid #ccc;list-style:none;padding:0;margin:0;width:130px;z-index:10; max-height: 150px; overflow-y: auto}
.footer-menu-list[aria-hidden=false]{display:block}
.footer-menu-list li{border-bottom:1px solid #eee}
.footer-menu-list li:last-child{border-bottom:none}
.footer-menu-list a{display:block;padding:10px;font-size:14px;color:#333;text-decoration:none}
.footer-menu-list a:focus,.footer-menu-list a:hover{background:#f0f0f0;color:#000;outline:0}

#ft .footer_info {padding-top: 25px}
#ft .footer_info > ul li,
#ft .footer_info p {text-align: left}
#ft .footer_info > ul li {position: relative}
#ft .footer_info > ul li::before {content: ''}
#ft .footer_info > ul {display: flex; gap: 0 30px}
#ft .footer_info > ul li,
#ft .footer_info > ul li a,
#ft .footer_info p {color: rgba(255,255,255,0.4)}
#ft .footer_info > ul li + li::before {content: ''; width: 2px; height: 15px; background: rgba(255,255,255,0.4); position: absolute; left: -15px; top: 3px}
#ft .footer_info p {padding-top: 2px}

/*quick menu*/
.quick_menu {position: fixed; right: 0; top: 181px; z-index: 999; width: 70px; margin-left: auto; transition: all .4s}
.quick_menu.sub {top: 253px}
.quick_menu.scroll {margin-top: -40px;}
.quick_menu.sub.scroll {top: 181px}
.quick_menu.bottom {position: absolute; top:-427px}
.quick_menu.sub.bottom {top:-427px; right: 0!important}
.quick_menu ul {background: #3b3b3b}
.quick_menu ul li {width: 100%; height: 74px; border-bottom: 3px solid var(--black)}
.quick_menu ul li a {width: 100%; height: 100%; display: block; text-align: center; color: var(--white); display: flex; flex-direction: column; justify-content: center; gap: 10px 0; transition: all .2s}
.quick_menu ul li a::before {content: ''; display: block; background: var(--white); margin: 0 auto}
.quick_menu ul li:hover a {background: rgba(255, 255, 255, .1)}
.quick_menu ul li.reservation {height: 130px}
.quick_menu ul li.reservation a::before {width: 60px; height:60px; background: url(../img/common/illu_character.png) no-repeat center / cover}
.quick_menu ul li.blog a::before {width: 30px; height: 24px; -webkit-mask-image:url(../img/common/quick_icon01.png)}
.quick_menu ul li.facebook a::before {width: 23px; height: 23px; -webkit-mask-image:url(../img/common/quick_icon02.png)}
.quick_menu ul li.youtube a::before {width: 23px; height: 23px; -webkit-mask-image:url(../img/common/quick_icon03.png)}
.quick_menu ul li.location a::before {width: 18px; height: 24px; -webkit-mask-image:url(../img/common/quick_icon04.png)}
.quick_menu ul li.top a::before { width: 25px; height: 14px; -webkit-mask-image:url(../img/common/top_icon.png)}
.quick_menu ul li.top {background: var(--key-color2); height: 65px; border-bottom: none} 


/****************** Media Query ******************/

/* laptop ~ table */

@media (max-width: 1279px) {
    
}

/* table ~ mobile */

@media (max-width: 1024px) {
    .quick_menu {display: none;}
}

/* mobile only */

@media (max-width: 768px) {
    
}