@import url('https://webfontworld.github.io/pretendard/Pretendard.css');
@font-face {
    font-family: 'ImcreSoojin';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-04@2.3/ImcreSoojin.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'yg-jalnan';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_four@1.2/JalnanOTF00.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

#under_bar{
    font-family: 'Pretendard', sans-serif;
    background:#fefefe;
    border:2px solid #eb2d28;
    border-top-left-radius:20px;
    border-top-right-radius:20px;
    border-bottom:none;
    display:flex;
    justify-content:center;
    align-items:start;
    padding:30px 0 10px;
    gap:20px;
    position:fixed;
    bottom:0;
    left:0;
    right:0;
    transition:.5s;
    z-index:97;
}
#under_bar.close{
    transform:translateY(calc(100% - 2px));
}
#under_bar .under_tt{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:10px;
    margin-top:5px;
}
#under_bar .under_tt h2{
    font-family: 'ImcreSoojin';
    font-size:35px;
    letter-spacing:-0.005em;
    font-weight:500;
}
#under_bar .write{
    display:flex;
    gap:0 30px;
}
#under_bar .under_form_wrap{
    display:flex;
    justify-content:center;
    gap:50px;
}
#under_bar .under_form_wrap > div > label{
    font-size:23px;
    letter-spacing:-0.005em;
    color:#505050;
    margin-right:15px;
}
#under_bar .under_form_wrap input[type="text"]{
    width:240px;
    height:47px;
    padding:10px 20px;
    background:#ededed;
    border-radius:12px;
    border:none;
    font-size:16px;
}
#under_bar .last_step button{
    padding:10px 65px;
    background:#EB2D28;
    color:#fefefe;
    border-radius:12px;
    border:none;
    font-weight:600;
    font-size:23px;
    letter-spacing:-0.005em;
    margin-bottom:3px;
}
#under_bar .last_step .privacy{
    display:flex;
    flex-direction:row-reverse;
    justify-content:center;
    align-items:center;
    position:relative;
    gap:10px;
}
#under_bar .last_step .privacy label{
    font-size:15px;
    color:#505050;
}
#under_bar .last_step .privacy label br{
    display:none;
}
#under_bar .last_step .privacy input{
    position:absolute;
    top:3px;
    left:3px;
    opacity:0;
}
#under_bar .last_step .privacy .check{
    display:inline-block;
    width:18px;
    height:18px;
    background:#ededed;
    border-radius:4px;
    text-align:center;
    line-height:18px;
    color:#ebebeb;
}
#under_bar .last_step .privacy input:checked +.check{
    color:#000;
}
#under_bar .write .right{
    display:flex;
    gap:0 15px;
}
#under_bar .write a{
    display:inline-block;
    background:#333;
    color:#fefefe;
    padding:0 50px;
    border-radius:18px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    height:66px;
}
#under_bar .write a p:first-child{
    font-family: 'ImcreSoojin';
    font-size:28px;
    line-height:1;
}
#under_bar .write a p:last-child{
    font-size:22px;
    font-weight:600;
    letter-spacing:-0.07em;
    line-height:1;
}
#under_bar .fold_tag{
    font-family: 'ImcreSoojin';
    position:absolute;
    bottom:100%;
    left:170px;
    background:#EB2D28;
    padding:10px 30px;
    color:#fefefe;
    font-size:18px;
    border-top-left-radius:10px;
    border-top-right-radius:10px;
    text-align:center;
    display:none;
}
#under_bar i{
    font-size:16px;
}

/* -------------------------- RESPONSIVE --------------------------- */
@media (max-width:1750px){
    #under_bar .under_form_wrap{
        gap:20px;
    }
    #under_bar .under_form_wrap input[type="text"]{
        width:200px;
    }
    #under_bar .under_form_wrap > div > label{
        margin-right:5px;
    }
    #under_bar .last_step button{
        padding:10px 30px;
    }
    #under_bar .last_step .privacy label{
        font-size:13px;
    }
    #under_bar .last_step .privacy label br{
    display:block;
    }
    #under_bar .write a{
        padding:0 20px;
    }
}
@media (max-width:1400px){
    #under_bar{
        flex-direction:column;
    }
    #under_bar > *:not(.fold_tag){
        width:90%;
        margin:0 auto;
    }
    #under_bar .write{
        flex-direction:column;
        gap:30px 0;
    }
    #under_bar .write .right{
        justify-content:center;
    }
    #under_bar .last_step button{
        padding:10px 50px;
    }
    #under_bar .last_step .privacy label br{
        display:block;
        }
    #under_bar .write a{
        padding:0 50px;
    }
    #under_bar .last_step .privacy label br{
        display:none;
    }
    #under_bar .fold_tag{
        display:block;
    }
}
@media (max-width:1200px){
    #under_bar .fold_tag{
        left:115px;
    }
}
@media (max-width:1000px){
    #under_bar .under_form_wrap{
        flex-direction:column;
        align-items:center;
    }
    #under_bar .under_form_wrap > div{
        display:grid;
        grid-template-columns:100px 1fr;
        align-items:center;
    }
    #under_bar .fold_tag{
        left:20px;
    }
}
@media (max-width:500px){
    #under_bar .write .right{
        flex-direction:column;
        align-items:center;
        gap:15px 0;
    }
    #under_bar .write .right .last_step{
        width: 100%;
        display: flex;
        flex-direction: column-reverse;
        gap: 15px;
    }
    #under_bar .write a{
        width:100%;
    }
    #under_bar .last_step .privacy{
        margin-left:90px;
    }
    #under_bar .under_tt h2{
        font-size:28px;
    }
    #under_bar .write{
        gap:15px 0;
    }
    #under_bar .under_form_wrap{
        gap:10px;
    }
    #under_bar .under_form_wrap > div > label{
        font-size:20px;
    }
    #under_bar .under_form_wrap input[type="text"]{
        height:40px;
    }
}