@charset "UTF-8";
/* common */
.hidden {
    height:100%; 
    min-height:100%; 
    overflow:hidden !important; 
    touch-action:none;
}

.red {
    color:#F02316 !important;  
}
  
#wrap {
    width:100.0000vw;
    margin:0 auto;
    overflow-x:hidden;
}
  
#header {
    z-index:9999;
    position:fixed;
    top:0;
    left:0;
    width:100.0000vw;
    height:15.5556vw;
    padding:0 9.7222vw;
}

#header.active {
    background-color:#FFFFFF;
}

#header.sticky {
    z-index:9999;
    background-color:#FFFFFF;
}

#header.sticky .hm_btn {
    display:none;
}

#header.sticky .hm_btn_sticky {
    display:block;
}

#header .hd_wrap {
    width:100%;
    height:15.5556vw;
}

#header .hd_wrap .cont {
    display:flex;
    align-items:center;
    height:15.5556vw;
}

#header .hd_wrap .logo {
    width:25.2778vw;
    height:9.4444vw;
    text-align:center;
    margin:0 auto;
}

#footer {
    position:relative; 
    width:100.0000vw; 
    height:97.7778vw; 
    margin:0 auto; 
    box-sizing:border-box; 
    background-color:#F0F0F0;
}

.footer_wrap {
    display:flex; 
    justify-content:space-between; 
    width:83.8889vw; 
    margin:0 auto; 
    padding:13.3333vw 0 11.6667vw; 
    box-sizing:border-box; 
    overflow:hidden;
}

.footer_wrap .footer_copy {
    font-size:3.3333vw; 
    line-height:3.8889vw; 
    color:#C5C5C5;
}

.footer_wrap .footer_copy h2 {
    font-family: 'Pretendard-SemiBold', sans-serif; 
    color:#5C5C5C; 
    font-size:5.5556vw; 
    line-height:6.6667vw; 
    font-weight:600;
}

.footer_wrap .footer_copy h2 + p {margin-top:20.2778vw;}
.footer_wrap .footer_copy p {margin-top:1.3889vw;}
.footer_wrap .footer_copy .divide {}
.footer_wrap .footer_copy .divide p {
    position:relative; 
    display:inline-block;
}
.footer_wrap .footer_copy .divide p + p {margin-left:3.8889vw;}
.footer_wrap .footer_copy .divide p + p:after {
    content:''; 
    position:absolute; 
    top:50%; 
    left:0; 
    transform:translateY(-50%); 
    width:0.2778vw; 
    height:2.7778vw; 
    margin-left:-1.9444vw; 
    background-color:#C5C5C5;
}
.footer_wrap .sms {
    position:absolute; 
    top:13.3333vw; 
    right:8.0556vw; 
    width:28.6111vw; 
    height:11.1111vw; 
    overflow:hidden;
}

.footer_wrap .sms li {
    position:relative; 
    float:left; 
    width:11.1111vw; 
    height:11.1111vw; 
    border-radius:50%; 
    background-color:#BDBDBD; 
    text-align:center;
}

.footer_wrap .sms li + li {margin-left:6.3889vw;}
.footer_wrap .sms a {
    position:absolute; 
    top:0; 
    left:0; 
    width:100%; 
    height:100%;
}

.footer_wrap .sms li .instagram {
    display:block; 
    width:6.1111vw; 
    height:6.1111vw; 
    margin:2.2222vw auto;
}

.footer_wrap .sms li .kakao {
    display:block; 
    width:6.6667vw; 
    height:6.6667vw; 
    margin:2.2222vw auto;
}

.close_btn {
    display:none; 
    width:6.6667vw; 
    height:6.6667vw;
}

.menu_wrap {
    z-index:2; 
    display:none;
    position:absolute; 
    top:15.5556vw; 
    left:0; 
    width:100%; 
    height:100vh; 
    background-color:#FFFFFF;
}

.menu_wrap:before {
    content:''; 
    position:absolute; 
    top:0; 
    right:0; 
    width:15.5556vw; 
    height:100vh; 
    background-color:rgba(0,0,0, 0.2);
}

.menu_wrap ul {
    position:relative; 
    width:85.0000vw;
}

.menu_wrap ul li {
    height:11.1111vw; 
    margin:1.1111vw 1.9444vw; 
    line-height:11.1111vw; 
    box-sizing:border-box;
}

.menu_wrap ul li a {
    font-family:'Pretendard-Bold', sans-serif; 
    display:block; 
    padding-left:2.5000vw; 
    color:#5C5C5C; 
    font-size:3.3333vw; 
    height:11.1111vw; 
    line-height:11.1111vw; 
    box-sizing:border-box;
}

.menu_wrap ul li a:hover {
    border:0.2778vw solid #FFEDE4; 
    border-radius:1.1111vw; 
    color:#EB5E16; 
    background-color:#FFEDE4;
}

.menu_wrap ul li + li {
    margin-top:2.2222vw;
}

.hm_btn, .hm_btn_sticky {
    display:block;
    width:6.6667vw; 
    height:6.6667vw;
}

.hm_btn_sticky {display:none;}
.menu_wrap.active {display:block;}
.close_btn.active {display:block;}
.hm_btn.active {display:none;}

#main #intro {
    position: relative;
    width:100.0000vw;
    height:100vh;
    background: url("../../img/app/m_banner.png") no-repeat 0 0;
    background-size:cover;
    overflow:hidden;
}

#intro .text_wrap {
    position:absolute;
    top:73.8889vw;
    left:50%;
    transform:translateX(-50%);
    width:49.4444vw;
    height:46.1111vw;
    color:#FFFFFF;
    font-size:8.8889vw;
    text-align:center;
}

#intro .text_wrap .semiBold {
    font-family: 'Pretendard-SemiBold', sans-serif;
}

#intro .text_wrap .extraBold {
    font-family: 'Pretendard-ExtraBold', sans-serif;
    margin-top:2.7778vw;
}

#intro #download_app {
    font-family: 'Pretendard-SemiBold', sans-serif;
    position:absolute;
    top:131.1111vw;
    left:50%;
    transform:translateX(-50%);
    width:46.1111vw;
    height:13.3333vw;
    border-radius:1.9444vw;
    color:#FFFFFF;
    font-size:5.0000vw;
    line-height:13.3333vw;
    text-align:center;
    background-color:#060836;
}

#intro #down_arrow {
    position:absolute;
    bottom:17.7778vw;
    left:50%;
    transform:translateX(-50%);
    width:20.0000vw;
    height:20.0000vw;
}

#main_wrap {

}

#intro_mockup {
    width:100.0000vw;
    height:233.0556vw;
    margin:0 auto;
    text-align:center;
    background-color:#FFFFFF;
}

#intro_mockup .text_wrap {
    margin-top:22.2222vw;
}

#intro_mockup .text_wrap .first {
    font-family: 'Pretendard-ExtraBold', sans-serif;
    font-size:8.8889vw;
}

#intro_mockup .text_wrap .second {
    font-family: 'Pretendard-SemiBold', sans-serif;
    margin-top:6.9444vw;
}

#intro_mockup .text_wrap img {
    display:block;
    margin-top:6.9444vw;
    width:104.4444vw;
    height:159.4444vw;
}

#recipe_sec {
    width:100.0000vw;
    height:624.4444vw;
    margin-top:-37.5000vw;
    background-color:#F5F5F5;
}

#recipe_sec .cont {
    width:74.1667vw;
    margin:0 auto;
    padding-top:37.5000vw;
}

#recipe_sec .text_wrap p {
    font-family: 'Pretendard-ExtraBold', sans-serif;
}

#recipe_sec .text_wrap .tit {
    font-size:5.5556vw;
}

#recipe_sec .text_wrap .sub_txt {
    margin-top:8.3333vw;
    font-size:8.8889vw;
    line-height:1.4;
}

#recipe_sec .text_wrap2 {
    margin-top:18.0556vw;
}

#recipe_sec .text_wrap2 p {
    font-size:4.4444vw;
    line-height:1.8;
}

#recipe_sec .text_wrap2 p + p {
    margin-top:6.1111vw;
}

#recipe_sec .rank_rp {
    width:65.5556vw;
    margin:18.0556vw auto 0;
}

#recipe_sec .rank_rp .img_wrap {
    width:65.5556vw;
    height:145.8333vw;
}

#recipe_sec .rank_rp .bg_w {
    position:relative;
    width:65.5556vw;
    margin-top:12.7778vw;
    border-radius:2.7778vw;
    padding:5.5556vw 3.8889vw 4.4444vw 4.4444vw;
    background-color:#FFFFFF;
}

#recipe_sec .rank_rp .bg_w .tit {
    font-family: 'Pretendard-SemiBold', sans-serif;
    font-size:4.4444vw;
}

#recipe_sec .rank_rp .bg_w .icon {
    position:absolute;
    top:3.6111vw;
    right:3.8889vw;
    width:13.6111vw;
    height:13.6111vw;
}

#recipe_sec .rank_rp .bg_w p {
    margin-top:8.0556vw;
    color:#A4A4A4;
}

#recipe_sec .rank_rp .bg_w .red {
    font-size:3.3333vw;
    display:block;
    margin-top:5.2778vw;
}

#recipe_sec .ing_rp {
    margin-top:13.0556vw;
}

#recipe_sec .ing_rp .img_wrap {
    width:68.6111vw;
    height:152.7778vw;
    margin:0 auto;
}

#recipe_sec .ing_rp .bg_w {
    position:relative;
    width:69.1667vw;
    margin-top:17.2222vw;
    padding:10.0000vw 4.1667vw 4.4444vw 4.4444vw;
    border-radius:2.7778vw;
    background-color:#FFFFFF;
}

#recipe_sec .ing_rp .bg_w .tit {
    font-family: 'Pretendard-SemiBold', sans-serif;
    font-size:4.4444vw;
}

#recipe_sec .ing_rp .bg_w p {
    margin-top:8.8889vw;
    color:#A4A4A4;
}

#recipe_sec .ing_rp .icon {
    position:absolute;
    top:3.8889vw;
    right:3.8889vw;
    width:14.4444vw;
    height:14.4444vw;
}

#nft_sec {
    width:100.0000vw;
    height:734.7222vw;
    margin:22.2222vw 0;
    background-color:#FFFFFF;
}

#nft_sec .cont {
    width:78.0556vw;
    margin:0 auto;
}

#nft_sec .text_wrap .tit {
    font-family: 'Pretendard-ExtraBold', sans-serif;
    font-size:5.5556vw;
}

#nft_sec .text_wrap .sub_txt {
    font-family: 'Pretendard-ExtraBold', sans-serif;
    margin-top:8.3333vw;
    font-size:8.8889vw;
    line-height:1.4;
}

#nft_sec .sm_txt_wrap {
    margin-top:18.0556vw;
}

#nft_sec .sm_txt_wrap p {
    font-size:4.4444vw;
    line-height:1.8;
}

#nft_sec .sm_txt_wrap p + p {
    margin-top:6.1111vw;
}

#nft_sec .num_sec {
    margin-top:22.2222vw;
}

#nft_sec .num_slide li {
    display:flex;
    height:52.5000vw;
}
  
#nft_sec .num_slide li.active {

}

#nft_sec .num_slide li.active .num {
    color:#FFFFFF;
    border:1px solid #F16328;
    background-color:#F16328;
}
  
#nft_sec .num_slide li.active .txt_wrap .tit {
color:#F16328;
}

#nft_sec .num_slide li.active .line {
background-color:#F16328;
}

#nft_sec .num_slide .num_wrap {
    position:relative;
    margin-right:11.9444vw;
}

#nft_sec .num_slide .num_wrap .num {
    font-family: 'Pretendard-SemiBold', sans-serif;
    width:11.3889vw;
    height:11.3889vw;
    border:0.2778vw solid #CDCDCD;
    border-radius:50%;
    text-align:center;
    color:#CDCDCD;
    font-size:6.6667vw;
    line-height:11.3889vw;
    background-color:#FFFFFF;
}

#nft_sec .num_slide .num_wrap .line {
    position:absolute;
    top:11.1111vw;
    left:5.5556vw;
    width:0.2778vw;
    height:52.5000vw;
    background-color:#CDCDCD;
}

#nft_sec .num_slide .txt_wrap p { 
    color:#A4A4A4;
    font-size:4.4444vw;
}

#nft_sec .num_slide .txt_wrap .tit { 
    font-family: 'Pretendard-SemiBold', sans-serif;
    color:#000000;
    font-size:5.5556vw;
    line-height:10.2778vw;
}

#nft_sec .img_wrap {
    width:68.6111vw;
    height:152.7778vw;
    margin:20.0000vw auto 0;
}

#nft_sec .btm_sec {
    margin-top:17.7778vw;
}

#nft_sec .btm_sec li {
    width:62.2222vw;
    margin:0 auto;
    text-align:center;
}

#nft_sec .btm_sec li + li {
    margin-top:20.0000vw;
}

#nft_sec .btm_sec .img_wrap {
    width:30.2778vw;
    height:35.8333vw;
    margin:0 auto;
}

#nft_sec .btm_sec .tit {
    font-family: 'Pretendard-SemiBold', sans-serif;
    margin-top:5.0000vw;
    color:#E47D43;
    font-size:5.5556vw;
}

#nft_sec .btm_sec p {
    margin-top:5.5556vw;
    font-size:4.4444vw;
}

#nanum_sec {
    width:100.0000vw;
    height:493.8889vw;
    padding:22.2222vw 0;
    background-color:#F5F5F5;
}

#nanum_sec .text_wrap,
#nanum_sec .text_wrap2,
#nanum_sec .img_wrap {
    width:72.5000vw;
    margin:0 auto;
}

#nanum_sec .text_wrap {
    font-family: 'Pretendard-ExtraBold', sans-serif;
}

#nanum_sec .text_wrap .tit {
    font-size:5.5556vw;
}

#nanum_sec .text_wrap .sub_txt {
    margin-top:8.3333vw;
    font-size:8.8889vw;
    line-height:1.4;
}

#nanum_sec .text_wrap2 {
    margin-top:18.0556vw;
}

#nanum_sec .text_wrap2 p {
    width:58.3333vw;
    font-size:4.4444vw;
    line-height:1.8;
}

#nanum_sec .text_wrap2 .nanum_list {
    display:flex;
    align-items:center;
    margin-top:8.3333vw;
}

#nanum_sec .text_wrap2 .nanum_list p {
    font-family: 'Pretendard-SemiBold', sans-serif;
    color:#E16C3C;
    font-size:5.0000vw;
}

#nanum_sec .text_wrap2 .nanum_list p + p {
    position:relative;
    padding-left:10.0000vw;
}

#nanum_sec .text_wrap2 .nanum_list p + p:after {
    content:'';
    position:absolute;
    top:50%;
    left:0;
    transform:translateY(-50%);
    width:1.1111vw;
    height:5.8333vw;
    margin-left:4.4444vw;;
    background-color:#E16C3C;
}

#nanum_sec .img_wrap {
    width:104.4444vw;
    height:159.4444vw;
    margin:8.3333vw 0 0 -6.9444vw;
}

#nanum_sec .swiper {
    margin:15.2778vw 5.5556vw 0 11.1111vw;
}

#nanum_sec .swiper-slide {
    width:68.6111vw;
    height:151.9444vw;
}

#nanum_sec .swiper-slide img {
    width:100%;
    height:100%;
}

#store_sec {
    width:100.0000vw;
    height:516.6667vw;
    padding:22.2222vw 0 30.5556vw;
    background-color:#FFFFFF;
}

#store_sec .text_wrap,
#store_sec .left_txt {
    width:75.8333vw;
    margin:0 auto;
}

#store_sec .text_wrap {
    font-family: 'Pretendard-ExtraBold', sans-serif;
}

#store_sec .text_wrap .tit {
    font-size:5.5556vw;
}

#store_sec .text_wrap .sub_txt {
    margin-top:8.3333vw;
    font-size:8.8889vw;
    line-height:1.4;
}

#store_sec .left_txt {
    margin-top:18.0556vw;
    font-size:4.4444vw;
    line-height:1.6;
}

#store_sec .swiper {
    margin:15.2778vw 5.5556vw 0 11.1111vw;
}

#store_sec .swiper-slide {
    width:68.3333vw;
    height:50.5556vw;
}

#store_sec .swiper-slide img {
    width:100%;
    height:100%;
}

#store_sec .reply_wrap {
    width:77.2222vw;
    margin:33.3333vw auto 0;
}

#store_sec .reply_wrap p {
    font-family: 'Pretendard-ExtraBold', sans-serif;
    font-size:6.6667vw;
    line-height:1.8;
}

#store_sec .reply_wrap .img_wrap {
    margin-top:17.7778vw;
}

#store_sec .reply_wrap .img_wrap img + img {
    display:block;
    margin-top:5.5556vw;
}