@charset "UTF-8";

/* common */
.hidden {
    height:100%; 
    min-height:100%; 
    overflow:hidden !important; 
    touch-action:none;
}

/* 레이아웃 */
#wrap {    
    width:100.0000vw;
    min-height:100%;
    margin:0 auto;
    overflow-x:hidden;
}

#header {
    display:none;
}

#header.sticky {
    z-index:9999;
    display:block;
    position:fixed; 
    top:0;
    left:0;
    width:100.0000vw;
    height:16.6667vw;
    background-color:#FFFFFF;
}

#header .hd_wrap .cont {
    display:flex;
    align-items:center;
    justify-content:space-between;
    width:61.1111vw;
    height:6.9444vw;
    margin:6.9444vw 0 0 9.7222vw;
}

#header .hd_wrap .cont .logo {
    width:41.1111vw;
    height:6.9444vw;
}

#header.sticky .menu_wrap.active {
    display:block;
}
.hm_btn {display:block; width:6.6667vw; height:6.6667vw;}
.close_btn {display:none; width:6.6667vw; height:6.6667vw;}

.menu_wrap {
    z-index:12; 
    display:none; 
    position:absolute; 
    top:0; 
    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 .head {
    display:flex;
    justify-content:space-between;
    align-items:center;
    position:relative;
    width:59.7222vw; 
    height:6.9444vw;
    margin:4.4444vw 0 4.4444vw 11.1111vw;
}

.menu_wrap .logo {
    width:41.1111vw;
    height:6.9444vw;
}

.menu_wrap .logo .img {width:41.1111vw; height:6.9444vw;}
.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;}
.menu_wrap.active {display:block;}
.close_btn.active {display:block;}
.hm_btn.active {display:none;}

/* top_banner 동영상 영역 */
.top_banner {
    z-index:10;
    position:fixed;
    top:0; 
    left:0;
    width:100%; 
    height:100vh; 
    overflow:hidden;
}

.banner_cnt {
    position:relative;
    width:100%;
    height:100vh;
    overflow:hidden;
}

.banner_cnt.active .hd_wrap {
    z-index:12;
    position:relative;
    width:100%;
    height:100vh;
}

.top_banner .hd_wrap {
    z-index:11;
    position:absolute;
    top:0;
    left:0;
    width:100%; 
    height:6.9444vw; 
    background-color:transparent;
}

.top_banner .hd_wrap.active {
    background-color:#FFFFFF;
}

.top_banner .hd_wrap .cont {
    display:flex;
    align-items:center; 
    justify-content:space-between; 
    width:61.1111vw; 
    height:6.9444vw;
    margin:6.9444vw 0 0 9.7222vw;
}

.top_banner .hd_wrap .logo {
    width:41.1111vw;
    height:6.9444vw;
}

.top_banner .hm_btn.active {

}

.top_banner .hd_wrap .menu {
    display:flex;
    align-items:center;
}

.top_banner .hd_wrap .menu li {
    font-family: 'Pretendard-Bold',sans-serif; 
    font-size:5.0000vw; 
    font-weight:700;
}
.top_banner .hd_wrap .menu li + li {margin-left:15.5556vw;}
.top_banner .hd_wrap .menu li.on a {color:#EB5E16;}
.top_banner .hd_wrap .menu li:hover a {color:#EB5E16;}
.top_banner .hd_wrap .menu li a {color:#FFFFFF;}

#main {
    position:relative;
    top:0; 
    left:0; 
    width:100.0000vw; 
    box-sizing:border-box;
}

#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;
}

/* color */
.light_bule {color:#7FFEEF !important;}
.deep_bule {color:#4E73BA !important;}
.orange {color:#F06110 !important;}
.green {color:#9EE459 !important;}
.purple {color:#6874F2 !important;}

/* common */
.tag {
    font-family: 'Pretendard-ExtraBold', sans-serif;  
    font-size:3.8889vw; 
    line-height:4.7222vw; 
    font-weight:800;
}

/* home */
/***** 온전하게 세상을 바꾸다  ******/
.video_wrap {position:relative; width:100.0000vw; height:100vh; overflow:hidden;}
.video_wrap .video {
    z-index:2; 
    width:100%; 
    height:100vh; 
    object-fit:cover; 
    border:none; 
    outline:none;
}

.video_wrap .txt {
    font-family: 'Pretendard-ExtraBold',sans-serif; 
    position:absolute; 
    left:50%; 
    bottom:43.3333vw; 
    transform:translateX(-50%); 
    width:58.6111vw; 
    color:#FFFFFF; 
    font-size:10.0000vw; 
    font-weight:800; 
    text-align:center;
}

.video_wrap .scroll {
    position:absolute;
    left:0; 
    right:0; 
    bottom:12.2222vw; 
    width:20.0000vw; 
    height:20.0000vw; 
    margin:0 auto; 
    display:block; 
    cursor:pointer;
}

.scroll .btm_arr {display:block; animation:pulse 2s infinite;}
@keyframes pulse{
    0% {
        -webkit-transform:translate(0, 0);
        -ms-transform:translate(0, 0);
        transform:translate(0, 0); 
    }
    50% {
        -webkit-transform:translate(0, 2.7778vw);
        -ms-transform:translate(0, 2.7778vw);
        transform:translate(0, 2.7778vw);
    }
    100% {
        -webkit-transform:translate(0, 0);
        -ms-transform:translate(0, 0);
        transform:translate(0, 0); 
    } 
}

/***** 온전히 소개  ******/
.bm_wrap {
    width:100.0000vw; 
    margin:0 auto;
    padding:33.3333vw 0;
    text-align:center;
}

.bm_wrap p {
    font-family: 'Pretendard-SemiBold', sans-serif;
    font-size:3.3333vw; 
    line-height:5.2778vw; 
    font-weight:600;
}

.bm_wrap p + p {margin-top:4.4444vw;}

/***** 모두의생활 즐겁게  ******/
.bg_wrap {width:100%; height:61.6667vw; padding:20.0000vw 0; text-align:center; background:url("../../img/home/sec_bg.png") center no-repeat; background-size:auto 61.6667vw;}
.bg_wrap p {font-family: 'Pretendard-Black',sans-serif; color:#FFFFFF; font-size:4.4444vw; line-height:5.2778vw; font-weight:900;}
.bg_wrap p + p {margin-top:10.8333vw;}

/***** ohbab  ******/
.app_wrap {position:relative; width:100%; height:220.2778vw; box-sizing:border-box; background-color:#02062C;}
.app_wrap .cont {width:76.6667vw; height:181.9444vw; margin:0 auto; padding:19.4444vw 0 18.8889vw;}
.app_wrap .cont .txt_wrap {width:76.6667vw; height:91.3889vw; box-sizing:border-box;}
.app_wrap .cont .txt_wrap .sub_tit {font-family: 'Pretendard-ExtraBold',sans-serif; color:#FE9D7F; line-height:4.7222vw; font-weight:800;}
.app_wrap .cont .txt_wrap .tit {font-family: 'Pretendard-ExtraBold',sans-serif; margin-top:0.8333vw; color:#FFFFFF; font-size:6.6667vw; line-height:8.0556vw; font-weight:800;}
.app_wrap .cont .txt_wrap .sub_txt {margin-top:10.8333vw; width:66.3889vw; color:#FFFFFF; box-sizing:border-box;}
.app_wrap .cont .txt_wrap .sub_txt p + p {margin-top:3.8889vw;}
.app_wrap .cont .link {font-family: 'Pretendard-Black',sans-serif; display:block; margin-top:10.8333vw; color:#FFFFFF; line-height:4.7222vw; font-weight:900;}
.app_wrap .cont .txt_wrap .download {display:flex; justify-content:space-between; align-items:center; width:76.6667vw; height:13.8889vw; margin-top:10.0000vw;}
.app_wrap .cont .txt_wrap .download  a {display:block;}
.app_wrap .cont .txt_wrap .download .dwn_google {width:36.3889vw; height:13.8889vw;}
.app_wrap .cont .txt_wrap .download .dwn_apple {width:35.5556vw; height:10.8333vw;}
.app_wrap .cont .detail_wrap {}
.app_wrap .cont .card_wrap { width:76.6667vw; height:76.6667vw; margin-top:15.2778vw;}
.app_wrap .cont .card_wrap .swiper {display:flex;}
.app_wrap .cont .card_wrap .swiper .swiper-slide {position:relative; width:76.6667vw; height:76.6667vw; padding:9.1667vw; border-radius:6.9444vw; box-sizing:border-box;}
.app_wrap .cont .card_wrap .swiper .swiper-slide .tit_wrap {font-size:5.5556vw; color:#FFFFFF;}
.app_wrap .cont .card_wrap .swiper .swiper-slide .tit_wrap strong {font-size:6.6667vw;}
.app_wrap .cont .card_wrap .swiper .swiper-slide .img_wrap {position:absolute; bottom:6.6667vw; right:9.7222vw;}
.app_wrap .cont .card_wrap .swiper .swiper-slide img {width:27.7778vw; height:27.7778vw;}
.app_wrap .cont .card_wrap .swiper .swiper-slide.recipe {background-color:#60DDC6;}
.app_wrap .cont .card_wrap .swiper .swiper-slide.nft {background-color:#A9DB58;}
.app_wrap .cont .card_wrap .swiper .swiper-slide.nanum {background-color:#A9ACFF;}
.app_wrap .cont .card_wrap .chk_wrap {position:absolute; bottom:6.6667vw;}
.app_wrap .cont .card_wrap .chk_wrap > li {font-family: 'Pretendard-SemiBold', sans-serif; position:relative; padding-left:4.7222vw; color:#FFFFFF; line-height:4.7222vw; font-weight:600;}
.app_wrap .cont .card_wrap .chk_wrap > li:before {content:''; position:absolute; top:50%; left:0; transform:translateY(-50%); width:3.6111vw; height:3.6111vw; background:url("../../img/home/check_26.png") 0 0 no-repeat; background-size:3.6111vw;}
.app_wrap .cont .card_wrap .chk_wrap > li  + li {margin-top:1.1111vw;}

/*****  new  ******/
.new_wrap {
    position:relative; 
    width:76.6667vw; 
    margin:16.9444vw auto 18.8889vw; 
    box-sizing:border-box; 
    background-color:#FFFFFF;
}

.new_wrap > p {
    font-family: 'Pretendard-SemiBold',sans-serif; 
    font-size:5.5556vw; 
    line-height:6.6667vw; 
    font-weight:600;
}

.news_list {margin-top:15.2778vw;}
.news_list ul {display:flex;}
.news_list ul li {
    position:relative; 
    width:81.9444vw; 
    height:94.4444vw; 
    border:0.2778vw solid #E6E6E6; 
    border-radius:2.7778vw; 
    box-sizing:border-box;
}

.news_list ul li .img_wrap {
    position:relative; 
    width:81.9444vw; 
    height:51.9444vw; 
    border-radius:2.7778vw 2.7778vw 0 0; 
    overflow:hidden;
}

.news_list ul li .img_wrap img {
    z-index:-1;
    position:absolute;
    top:0;
    left:0;
    width:100%;
}

.news_list ul li .txt_wrap {
    width:81.9444vw; 
    height:42.5000vw; 
    padding:6.3889vw 4.4444vw 5.2778vw 6.9444vw; 
    border-top:0.2778vw solid #E6E6E6; 
    border-radius:0 0 2.7778vw 2.7778vw; 
    box-sizing:border-box; 
    overflow:hidden;
}

.news_list ul li .txt_wrap .tit {
    font-family: 'Pretendard-SemiBold',sans-serif; 
    display:inline-block; 
    width:67.7778vw; 
    height:5.2778vw; 
    white-space:nowrap; 
    text-overflow:ellipsis; 
    line-height:5.2778vw; 
    font-weight:600; 
    overflow:hidden;
}

.news_list ul li .txt_wrap .txt {
    display:-webkit-box; 
    -webkit-line-clamp:3; 
    -webkit-box-orient:vertical; 
    width:71.9444vw; 
    height:11.9444vw; 
    margin-top:5.0000vw; 
    word-break:break-all; 
    text-overflow:ellipsis; 
    font-size:3.3333vw; 
    overflow:hidden;
}

.news_list ul li .news_tag {
    margin-top:2.7778vw; 
    color:#B0B0B0; 
    font-size:3.3333vw; 
    line-height:3.8889vw;
}

.news_list ul li .more {
    position:absolute; 
    top:0; 
    left:0; 
    width:100%; 
    height:100%; 
    font-size:0;
}

/*****  notice  ******/
.notice_wrap {width:100%; height:83.6111vw; padding:25.2778vw 0 21.1111vw; box-sizing:border-box; text-align:center; background-color:#F0F8FF;}
.notice_wrap .txt_wrap {}
.notice_wrap .txt_wrap p {font-family: 'Pretendard-SemiBold',sans-serif; line-height:5.2778vw; font-weight:600;}
.notice_wrap .txt_wrap .txt_big {font-family: 'Pretendard-SemiBold',sans-serif; margin-top:2.5000vw; font-size:5.0000vw; line-height:5.8333vw; font-weight:600;}
.notice_wrap .contact {font-family: 'Pretendard-Bold', sans-serif; display:block; width:65.2778vw; height:13.8889vw; margin:9.7222vw auto 0; border-radius:1.1111vw; font-size:5.5556vw; line-height:13.8889vw; font-weight:700; color:#fff; background-color:#02062C;}
