@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 a:hover{background:#444}
#quickList ul li a:hover span{transform:scale(1);opacity:1}
#quickList ul li.kakao a{background:#fae100}
#quickList ul li.write a{background:var(--primary)}
#quickList ul li.tel a{background:#0271ff}
#quickList ul li a img{width:22px}
#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}
#quickList button:hover{opacity:1}

/* 반응형 [s] */
@media (max-width:1024px){
#quickList{top:auto;bottom:30px;transform:none}
}
@media (max-width:768px){
#quickList{display:flex;align-items:center;bottom:10px;right:auto;left:50%;transform:translateX(-50%);width:calc(100% - 20px);padding:8px}
#quickList ul{display:flex;width:100%;gap:5px}
#quickList ul li{width:100%}
#quickList ul li+li{margin:0}
#quickList ul li a{width:100%;height:40px;line-height:40px}
#quickList ul li a img{width:auto;height:20px}
#quickList button{width:60px;margin:0}
}
@media (max-width:480px){
#quickList ul li a{height:35px;line-height:35px}
#quickList ul li a img{height:18px}
}
@media (max-width:380px){}
/* 반응형 [e] */