/**/
@charset "UTF-8";

@font-face {
    font-family: "Pretendard";
    font-style: normal;
    font-weight: normal;
    src: url("https://img.littlefox.co.kr/static/layout/ko_KR/guide/font/Pretendard-Regular.subset.woff2?20240510140341") format("woff2"), url("https://img.littlefox.co.kr/static/layout/ko_KR/guide/font/Pretendard-Regular.subset.woff?20240510140341") format("woff"),url("https://img.littlefox.co.kr/static/layout/ko_KR/guide/font/Pretendard-Regular.otf?20240510140341")
}

@font-face {
    font-family: "Pretendard";
    font-style: normal;
    font-weight: bold;
    src: url("https://img.littlefox.co.kr/static/layout/ko_KR/guide/font/Pretendard-Bold.subset.woff2?20240510140341") format("woff2"), url("https://img.littlefox.co.kr/static/layout/ko_KR/guide/font/Pretendard-Bold.subset.woff?20240510140341") format("woff"),url("https://img.littlefox.co.kr/static/layout/ko_KR/guide/font/Pretendard-Bold.otf?20240510140341")
}

.store *{
    font-family: 'Pretendard', '맑은 고딕', 'Malgun Gothic','돋움','Dotum','Apple SD Gothic Neo','Arial',  AppeGothic, sans-serif;
    box-sizing: border-box;
}


.store{
    display: flex;
    align-items: center;
    flex-direction: column;
    /*gap: calc((60/1920)*100vw);*/
    height:100vh;
    background:linear-gradient(to bottom, #7CF5C6 calc((533 / 1920)*100vw), #fff 150px);
    background-repeat:no-repeat;
    background-position: center 0;
}

.store img{
    width: 100%;
}

.store .bg-loading{
    width: calc((944 / 1920)*100vw);
}



.store .txt-loading{
    padding:calc((60 / 1920)* 100vw) 0;
    font-size:calc((51 / 1920)* 100vw);
    text-align: center;
}


.circle-loading span {
    height: calc((40 / 1920)*100vw);
    width: calc((40 / 1920)*100vw);
    border-radius:50%;
    transform: scale(0);
    background-color:red;
    animation: scaling 2.5s ease-in-out infinite;
    display: inline-block;
    margin:.5rem;
}
  
.circle-loading span:nth-child(0){
animation-delay:0s;
}
.circle-loading span:nth-child(1){
animation-delay:0.2s;
}
.circle-loading span:nth-child(2){
animation-delay:0.4s;
}
.circle-loading span:nth-child(3){
animation-delay:0.6s;
}
.circle-loading span:nth-child(4){
animation-delay:0.8s;
}
.circle-loading span:nth-child(5){
animation-delay:1s;
}

@keyframes scaling{
    0%, 100%{
        transform: scale(0.2);
        background-color: #30FFB7;
    }
    40%{
        transform: scale(1);
        background-color: #07DEFF;
    }
    50%{
        transform: scale(1);
        background-color: #0761FF;
    }
}
.tit-loading{
    width: calc((424 / 1920) * 100vw);
    padding-top:calc((64 / 1920) * 100vw);
}

.btn-wrap{
    width: 100%;
    text-align: center;
    padding-top:calc((84 / 1920) * 100vw)
}

.btn-wrap button{
    position: relative;
    width: calc((512 / 1920) * 100vw);
    height: calc((110 / 1920) * 100vw);
    color:#fff;
    font-size:calc((44 / 1920) * 100vw);
    background:#29C8E6;
    /*box-shadow: inset 0px 0 5px rgba(255, 255, 255, 0.3), 0 6px 0px #2860C4;*/
    border-radius:74px;
    font-weight: 600;
    border:0;
}

/*.btn-wrap button:after{
    content:"";
    position: absolute;
    top:calc((12 / 1920) * 100vw);
    left:calc((22 / 1920) * 100vw);
    width:calc((20 / 1920) * 100vw);
    height:calc((30 / 1920) * 100vw);
    background:#6098ff;
    opacity: .5;
    border-radius:60%;
    transform: rotate(58deg);
}*/

@media (max-width: 720px) {

    .store{
        /*gap: calc((40/720)*100vw);*/
        height:100vh;
        background:linear-gradient(to bottom, #7CF5C6 calc((433 / 720)*100vw), #fff 150px);
    }

    .store .bg-loading{
        width: 100%
    }
    
    .store .txt-loading{
        padding:calc((66 / 720)* 100vw) 0;
        font-size:calc((51 / 720)* 100vw);
    }
    .tit-loading{
        width:calc((424 / 720) * 100vw);
        padding-top:calc((112 / 720) * 100vw);
    }

    
    .circle-loading span {
        height: calc((30 / 720)*100vw);
        width: calc((30 / 720)*100vw);
    }

    .btn-wrap{
        padding-top:calc((127 / 720) * 100vw);
    }
    .btn-wrap button{
        width: calc((600 / 720) * 100vw);
        height: calc((110 / 720) * 100vw);
        font-size:calc((46 / 720) * 100vw);
    }

    .btn-wrap button::after{
        top:calc((12 / 720) * 100vw);
        left:calc((22 / 720) * 100vw);
        width:calc((20 / 720) * 100vw);
        height:calc((30 / 720) * 100vw);
    }
}