@charset "utf-8";

#quickList{position:fixed;right:20px;top:50%;z-index:1000;transform:translateY(-50%);padding:9px 8px;border-radius:10px;background:#222}
#quickList ul{font-size:14px;color:#aaa;cursor:pointer;box-shadow:0 2px 17px 0 rgba(0, 0, 0, 0.3);font-family:'notokr-medium'}
#quickList ul li+li{margin-top:12px}
#quickList ul li a{position:relative;display:block;width:50px;height:50px;border-radius:5px;color:#fff;line-height:50px;text-align:center}
#quickList ul li a span{opacity:0;position:absolute;right:calc(100% + 19px);top:50%;transform:scale(0);transform-origin:center left;height:40px;padding:0px 12px;margin-top:-20px;border-radius:5px;font-size:14px;line-height:40px;white-space:nowrap;background:#444;transition:.15s ease}
#quickList ul li a span:before{display:block;content:"";position:absolute;right:-5px;top:50%;transform:translatey(-50%) rotate(45deg);width:12px;height:12px;border-radius:3px;background-color:#444}
#quickList ul li.inq img{width:26px}
#quickList ul li.map img{width:28px}
#quickList ul li.tel img{width:23px}
#quickList ul li a img{width:26px}
#quickList ul li.kakao a{background:#fae100}
#quickList ul li.kakao span,#quickList ul li.kakao a span:before{color:#222;background:#fae100}
#quickList ul li.naver a{background:#3fc73c}
#quickList ul li.naver span,#quickList ul li.naver a span:before{color:#fff;background:#3fc73c}
#quickList ul li.youtube a{background:#ff0033}
#quickList ul li.youtube span,#quickList ul li.youtube a span:before{color:#fff;background:#ff0033}
#quickList button{opacity:.75;width:100%;margin:10px 0 5px;border:none;font-size:12px;line-height:1.2;color:#fff;background:none;transition:all .2s;font-family:'notokr-bold'}
#quickList button i{font-size:14px}


/* 모바일 호버 X */
@media (hover: hover) {
#quickList ul li a:hover{background:#444}
#quickList ul li a:hover span{transform:scale(1);opacity:1}
#quickList button:hover{opacity:1}
}

@media (max-width:768px){
#quickList{top:auto;bottom:0;right:0;transform:none;display:flex;align-items:center;width:100%;border-radius:0}
#quickList ul{display:flex;align-items:center;gap:5px;width:calc(100%/5 * 4)}
#quickList ul li+li{margin-top:0}
#quickList button{width:calc(100%/5);margin:0}
#quickList ul li{width:100%}
#quickList ul li a{width:100%;height:35px;line-height:35px}
#quickList ul li a img{width:20px !important}
#quickList ul li a span{display:none}
}
@media (max-width:480px){
#quickList ul li a{height:30px;line-height:30px}
#quickList ul li a img{width:16px}
#quickList button{font-size:10px}
}
/* 반응형 [e] */