@charset "utf-8";

/* reset */
*{box-sizing: border-box; -webkit-tap-highlight-color: transparent; word-break: keep-all}
html, body{
    -webkit-text-size-adjust: none;  /* 크롬, 사파리, 오페라 신버전 */
    -ms-text-size-adjust: none;  /* IE */
    -moz-text-size-adjust: none;  /* 파이어폭스 */
    -o-text-size-adjust: none;  /* 오페라 구버전 */
}
html{font-size: 8.5px;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,textarea,p,blockquote,th,td,input,select,textarea,button{margin: 0; padding: 0}
body {
    color: #151515;
    overflow-x: hidden;
    font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;
    font-size: 1.8rem;
    line-height: 1.6;
}
fieldset,img{border: 0 none; vertical-align: middle}
img{max-width: 100%}
svg{overflow: visible}
dl,ul,ol,li{list-style: none}
blockquote, q{quotes: none}
blockquote::before, blockquote::after,q::before, q::after{content: ''; content: none}
input,select,textarea,button{font-size: inherit; font-family: inherit; vertical-align: middle}
input{-webkit-appearance: none; -webkit-border-radius: 0; outline: none; border: none}
input[type="text"]::placeholder{color: inherit}
input[type='checkbox'], input[type='radio']{clip: rect(0, 0, 0, 0); height: 1px; margin: -1px; overflow: hidden; position: absolute; width: 1px}
textarea{-webkit-appearance: none; -webkit-border-radius: 0; resize: vertical; width: 100%; outline: none; font-family: inherit}
button{border: 0 none;background: none;cursor: pointer}
input::placeholder { opacity: 0.5; color:#555;}
table{border-collapse: collapse; border-spacing: 0}
a{color: inherit; text-decoration: none}
a:active, a:hover{text-decoration: none}
address,caption,cite,code,dfn,em,var{font-style: normal; font-weight: normal}
caption{overflow: hidden; position: absolute; clip: rect(0, 0, 0, 0); width: 1px; height: 1px; margin: -1px}
legend{overflow: hidden; position: absolute; clip: rect(0, 0, 0, 0); width: 1px; height: 1px; margin: -1px}
h1, h2, h3, h4, h5, h6{font-weight: 400}
pre{font-family: inherit;}


.quick_wrap { position: fixed; right: 6rem; bottom: 6rem; z-index: 100; transition: opacity 0.5s; }
.quick_wrap.remove { opacity: 0; pointer-events: none; }

.quick_top { position: relative; display: flex; align-items: center; justify-content: center; flex-direction: column; margin-bottom: 1em; font-size: 0.6vw; color: var(--purp); font-weight: 700; font-family: var(--pop); cursor: pointer; transform: translateY(150%); transition: transform 0.6s; }
.quick_top:before { content: ''; position: absolute; left: 50%; top: 46%; width: 2vw; height: 2vw; background-color: #fff; border-radius: 0.2vw; transform: translate(-50%, -50%); opacity: 0; transition: opacity 0.6s; }
.quick_wrap.active .quick_top { transform: unset; }
.quick_wrap.active .quick_top:before { opacity: 1; }
.quick_top .ico { position: relative; width: 1em; height: 1em; background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 512" fill="%23FF5E10"><path d="M209 50.2l-17-17-17 17L21.4 203.8l-17 17 33.9 33.9 17-17L168 125.1 168 456l0 24 48 0 0-24 0-330.8L328.6 237.8l17 17 33.9-33.9-17-17L209 50.2z"/></svg>')center/contain no-repeat; transition: transform 0.3s; z-index: 5; }
.quick_top .txt { position: relative; z-index: 5; }
.quick_top:hover .ico { transform: translateY(-0.3em); }

.quick_inquiry { position: relative; display: flex; align-items: center; justify-content: center; width: 8vw; height: 8vw; box-shadow: 0 0 20px 0 rgba(21,21,21,0.2); background-color: #fff; border-radius: 100%; font-family: 'Pretendard', sans-serif !important; }
.quick_inquiry .hover_box:before {content: "";width: calc(100% - 1px);height: calc(100%  - 1px);position: absolute;left: -1px;top: -1px;border: 2px solid #fff;border-radius: 50%;z-index: 3; transition: 0.5s}
.quick_inquiry .hover_box { position: absolute; left: 50%; top: 50%; width: 105%; height: 105%; background-color: var(--purp); color: #fff; border-radius: 100%; font-size: 0.8vw; font-weight: 700; letter-spacing: 0.1vw; z-index: 10; text-align: center; opacity: 0; transform: translate(-50%, -50%) scale(0); transition: transform 0.5s, opacity 0.3s; overflow: hidden; }
.quick_inquiry:hover .hover_box { opacity: 1; transform: translate(-50%, -50%) scale(1); }
.quick_inquiry .hover_box .txt_box { position: absolute; left: 50%; top: 50%; width: 80%; transform: translate(-50%, -45%); }
.quick_inquiry .hover_box .txt_box .txt { opacity: 0; transform: translateX(100%); transition: transform 0s, opacity 0s; transition-delay: 0.2s; }
.quick_inquiry:hover .hover_box .txt_box .txt { opacity: 1; transform: unset; transition: transform 0.5s ease-in-out, opacity 0.5s; }
.quick_inquiry .hover_box .ico { display: flex; align-items: center; justify-content: center; width: 100%; height: 1em; margin-top: 0.3vw; font-size: 1.2em; background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" fill="%23fff"><path d="M495 273l17-17-17-17L359 103l-17-17L308.1 120l17 17 95 95L24 232 0 232l0 48 24 0 396.1 0-95 95-17 17 33.9 33.9 17-17L495 273z"/></svg>')center/contain no-repeat; }
.quick_inquiry .spin_txt { position: absolute; top: 0; left: 0; animation: spin 20s infinite linear; }
.quick_inquiry .baby { position: absolute; top: 50%; left: 50%; width: 52%; height: 52%; transform: translate(-50%, -50%); transform-origin: center; }
.quick_inquiry .baby img { width: 100%; height: 100%; object-fit: contain; }
.quick_inquiry:hover .hover_box:before { border-color: var(--purp)}


@keyframes quickSwing {
    0% { transform: rotate(0deg); }
    50% { transform: rotate(-15deg); }
    100% { transform: rotate(0deg); }
}


@media screen and (min-width: 3400px){
    html, body { font-size: 14px; }
}

/*@media screen and (max-width: 1024px){
    html, body { font-size: 11px; }
}*/