@charset "utf-8";

#rFix{display:flex;flex-flow:column;align-items:flex-end;gap:15px;position:fixed;right:20px;top:50%;z-index:5;transform:translateY(-50%)}

#quickForm{padding:15px 8px;border-radius:10px;font-size:13px;background-color:#fff;box-shadow:3px 5px 20px -2px rgb(0 0 0 / 15%);font-family:'notokr-regular'}
#quickForm .tit{margin-bottom:15px;font-size:15px;text-align:center;white-space:pre-line;font-family:'notokr-bold'}
#quickForm form ul li label{display:none}
#quickForm input{border:1px solid #e1e1e1;border-radius:3px;font-family:'notokr-regular'}
#quickForm form ul li+li{margin-top:3px}
#quickForm form ul li input{width:180px;height:35px;padding:0 10px}
#quickForm .prv{display:flex;align-items:center;justify-content:right;gap:3px;margin:8px 0;font-family:'notokr-medium'}
#quickForm .prv a{cursor:pointer;color:#888}
#quickForm .prv label{font-size:13px;color:#333;cursor:pointer}
#quickForm .send button{width:100%;height:35px;border:none;outline:none;color:#fff;background-color:#333}

#quickList{width:fit-content;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.kakao a{background:#fae100}
#quickList ul li.insta a{background:#833ab4;background:linear-gradient(to right,#833ab4,#fd1d1d,#fcb045)}
#quickList ul li.blog a{background:#32b44a}
#quickList ul li a img{width:26px}
#quickList ul li.kakao span,#quickList ul li.kakao a span:before{color:#222;background:#fae100}
#quickList ul li.blog span,#quickList ul li.blog a span:before{color:#fff;background:#32b44a}
#quickList ul li.insta span,#quickList ul li.insta a span:before{color:#fff;background:#833ab4}
#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}
}

/* 반응형 [s] */
@media (max-width:1024px){
#rFix{top:auto;bottom:240px;transform:none}
#quickForm{position:fixed;left:0;bottom:0;width:100%;border-radius:0}
#quickForm .tit{white-space:normal}
#quickForm form ul{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
#quickForm form ul li input{width:100%}
#quickForm form ul li+li{margin-top:0}
}
@media (max-width:768px){
#rFix{gap:0;left:0;bottom:0;width:100%}
#quickForm{position:initial;padding:10px}
#quickList{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){
#quickForm{padding:8px;font-size:12px}
#quickForm .tit{margin-bottom:10px;font-size:13px}
#quickForm form ul{gap:5px}
#quickForm form ul li input{height:30px}
#quickForm .prv label{font-size:12px}
#quickForm .send button{height:30px}
#quickList ul li a{height:30px;line-height:30px}
#quickList ul li a img{width:16px}
#quickList button{font-size:10px}
}
/* 반응형 [e] */
