@import url('https://cdn.jsdelivr.net/gh/fonts-archive/Paperlogy/Paperlogy.css');
@import url("../../fonts/GmarketSans/GmarketSans.css");
@import url("../../fonts/Inter/Inter.css");

:root{
    --layout-max-width: 800px;
    --container-bg-color: #008AFF;

    --main-color: #566EFF;
    --accent-color: var(--main-color);
    --point-color: #FF4546;
    --font-color: #393939;

    /* input */
    --input-height: 12rem;
    --input-font-size: 3.8rem;
    --input-border-radius: 1.5rem;
    --input-border-color: #B6B6B6;
    --input-bg-color: #FFFFFF;
    --input-color: #393939;
    --input-box-shadow: .7rem .7rem .5rem rgba(0,0,0,0.05);
    --focus-border-color: var(--main-color);

    /* result button */
    --result-btn-height: 13rem;
    --result-btn-font-size: 6.8rem;
    --result-btn-border-radius: 15rem;
    --result-btn-color: #fff;
    --result-btn-bg-color:#FF4546;
    --result-btn-margin: auto 0 0 0;

    --slogun-font-size: 6.2rem;
    --slogun-font-weight:900;
    --slogun-color: #222;

    /* progress */
    --progress-bar-height: 6.8rem;
    --progress-bar-bg-color: #FFFFFF;
    --progress-fill-bg:linear-gradient(180deg, #FFD6D6 0%, #FF8F8F 100%);

    --c-blue: #566EFF;
    
}

.m_color{color: var(--point-color) !important;}
.c-blue{color: var(--c-blue) !important;}
#landing_container{position: relative;}
.container_wrap{background:url('./images/bg.jpg') no-repeat center top;}
.landing-header-slogun{font-family: 'Paperlogy'; line-height: 1.2;letter-spacing: -0.02em; -webkit-text-stroke: .2rem #fff; 
  text-shadow: -.1rem -.1rem 0 #fff,.1rem -.1rem 0 #fff,-.1rem .1rem 0 #fff,.1rem .1rem 0 #fff,-.2rem 0 0 #fff,.2rem 0 0 #fff,0 -.2rem 0 #fff,0 .2rem 0 #fff;}
.progress-bar{padding: .4rem .5rem;}
.progress-text{-webkit-text-stroke: .7rem #fff; text-stroke:.7rem #fff;paint-order: stroke fill;}
.container {position: relative;}
.content{position: relative;}
.intro_btn_wrap{position: relative;}

/* 콘텐츠 높이 값 고정 */
.puple_bg{display: flex;flex-direction: column;/*height: 118rem*/}

.input_wrap {margin-bottom:6rem;}
.question {margin-bottom: 5.5rem;display: flex;align-items: center;gap: 4rem;font-weight: 700;}
.qnum {font-family: 'Inter';font-style: normal;font-weight: 200;font-size: 12rem;color:  var(--main-color);line-height: 1;}
.qtext {word-break: keep-all;}
input[type='text']::placeholder, input[type='number']::placeholder {color:#888}
.section .check_list {display: flex;gap: 2.8rem 0;flex-direction: row;margin: 0 auto;flex-wrap: wrap;justify-content: center;}
.section .check_list li {width: 100%;height: var( --input-height);background:  var( --input-bg-color);border: 1px solid var(--input-border-color);box-shadow: var(--input-box-shadow);border-radius: var(--input-border-radius);display: block;cursor: pointer;}
.section .check_list li.on{border-color: var(--accent-color)}
.check_list li label {display: flex;justify-content: flex-start;align-items: center;gap: 2rem;height: 100%;padding-inline: 3.6rem;cursor: pointer;}
.privacy_wrap{margin:0 0 6rem;}

.result_btn{font-family: 'Gmarket Sans', sans-serif;padding-top:.2em; background: var(--result-btn-bg-color);}
.next_btn{font-family: 'SUIT', sans-serif;width:100%;background: var(--point-color); color: #fff; font-size: 7rem; letter-spacing: -0.02em; font-weight: 700;height: 14.6rem;}
.next_btn .icon_arrow::after{content: ''; display: inline-block; width: 0; height: 0; border-top: 2.7rem solid transparent; border-bottom: 2.7rem solid transparent; border-left: 3.5rem solid #fff; margin-left: 2rem;}
.blink_btn_01 {
    animation: blinkAnimation01 1s steps(1) infinite;
}


@keyframes blinkAnimation01 {
    50% { 
        background: #566EFF;
    }
}