@charset "utf-8";


:root {
    --mainSectPd: 12rem;
    --mainContMt: 10rem;
}

/* html {font-size: 10px}  */
.main{overflow-x: hidden;}
.main .in{width: var(--mainIn);}

.main_tit_box.center{text-align: center;}
.main_tit_box > *,
.tit_wrap .btn_box{opacity: 0; transform: translateY(5rem); transition: opacity 0.6s ease-in-out, transform 0.6s ease-in-out;}
.main_tit_box.active > *,
.tit_wrap .main_tit_box.active + .btn_box{opacity: 1; transform: unset;}
.main_tit_box .desc {font-size: var(--p3); font-weight: 500; line-height: 1; margin-bottom: 1.2rem;}
.main_tit_box .tit{font-size: var(--h5); font-weight: 700; transition-delay: 0.2s;}
.main_tit_box .txt{font-size: var(--p5); font-weight: 500; line-height: 1.5; margin-top: 1.2rem; transition-delay: 0.4s;}
.main_tit_box .btn_box {margin-top: 4rem; }
.tit_wrap .main_tit_box.active + .btn_box{transition-delay: 0.4s;}


/* KV */
.main .visual_sect .kv_basic10 .txt_box .tit.with_float{display: flex; flex-wrap: wrap;}
.main .visual_sect .kv_basic10 .txt_box .tit .float_txt {height: 1.3em; margin: 0 0.5em; display: flex; align-items: center;}
.main .visual_sect .kv_basic10 .txt_box .tit .float_txt .swiper-container {width:5.4em; height: 100%; text-align: center; height: 1.2em; }
.main .visual_sect .kv_basic10 .txt_box .tit .float_txt .swiper-slide {transition: opacity 0.4s ease-in-out;}
.main .visual_sect .kv_basic10 .txt_box .tit .float_txt .swiper-slide-prev {opacity: 0;}


/* Branding */
.main .branding_sect .main_tit_box .txt{font-size:var(--p1); font-weight: 600;}

/* MD’s PICK */
.main .pick_sect{ padding-bottom: var(--mainSectPd); margin-top: 5rem;}
.main .pick_sect .tit_wrap{display: flex; align-items: flex-end; justify-content: space-between; gap: 3rem;}

.main .pick_sect .main_basic_slide23{margin-top: calc(var(--mainContMt) - 3rem);}
.main .pick_sect .main_basic_slide23 .shop_list01 .shop_item:nth-of-type(n+3) {display: none;}
.main .main_basic_slide23 .pick_card .txt_box .tit{display: -webkit-box;-webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; text-overflow: ellipsis;}
.main .main_basic_slide23 .pick_card .txt_box .txt{display: none;}
.main .main_basic_slide23 .com_tag_box .tag:nth-of-type(n+4) {display: none;}

/* 랭킹 */
.main .ranking_sect .com_tab01 .tab_box{background-color: var(--pointBg);}



.main .ranking_sect .com_tab01 .btn{font-size: var(--p3); min-width: 24rem; font-weight: 600; line-height: 1.5; padding:0.75em 1em;}
/* .main .sub_text_motion01{padding-top: 5rem;} */
.main .sub_text_motion01 .move_track{font-size: 6rem;}
.main .sub_text_motion01{opacity: 1;}
.main .sub_text_motion01 .txt{color: var(--point01);}


/* 견적받기 */
.main .store_sect{padding-top: calc(var(--mainSectPd) + 5rem); padding-bottom:var(--mainSectPd);}

.com_prd_cont .prd_btn_box{bottom: 1.2rem; right: 1.2rem;}
.com_prd_cont .prd_btn_box .btn svg{fill: #fff;}
/* .com_prd_cont .prd_btn_box .btn{width: max(2.8rem, 24px); height: max(2.8rem, 24px);}
.com_prd_cont .prd_btn_box .btn.cart{font-size:var(--p7); width: auto; background: var(--black); color: #fff; line-height: 1; padding: 0 0.6em 0 0.5em; font-weight: 600;}
.com_prd_cont .prd_btn_box .btn.cart svg{ width: 1.1em; height: 1.1em; margin-right: 0.3em; margin-top: -0.1em;} */

/* 배너 */
.main .banner_sect{padding-top: var(--mainSectPd);}
.main .banner_sect .cont_banner11_sect .banner_img{padding-top: 41.6%;}
.main .banner_sect .cont_banner11_sect .banner_img .txt_box{top: 0; left: 0; padding: 12rem; transform: unset;}
.main .banner_sect .cont_banner11_sect .banner_img .txt_box .tit{font-size: var(--h5);}
.main .banner_sect .link_btn{font-weight: 500; font-size: var(--p5);}

/* Community */
.main .community_sect{padding: var(--pd2) 0; overflow: hidden;}
.main .community_sect .tit_wrap{display: flex; align-items: flex-end; justify-content: space-between;}
.main .community_sect .tit_wrap .com_tab02{flex: 1;}
.main .community_sect .tit_wrap .com_tab02 .tab_box{justify-content: flex-end;}

.main .community_sect .bulletin_list_thum07{margin-top:7rem; width: 100%;}
.main .community_sect .bulletin_list_thum07 .list{gap: 0 2.2rem;}
.main .community_sect .bulletin_list_thum07.is-community-slider .news_list{overflow: visible; clip-path: inset(0 -100vw 0 0);}
.main .community_sect .bulletin_list_thum07 .list li .img{border-radius: 1.5rem; overflow: hidden;}
.main .community_sect .bulletin_list_thum07 .list li .txt_box{text-align: left;}
.main .community_sect .bulletin_list_thum07 .list li .txt_box .tit{font-size:var(--p3); line-height: 1.5;}

.main .community_sect .tab_cont{width: 100%;}
.main .community_sect .com_tab02 .tab_box{gap: 1rem;}
.main .community_sect .com_tab02 .tab_box .tab{min-width: 18rem; padding-bottom: 0.7em; font-size: var(--p3); color: var(--black); font-weight: 700; white-space: nowrap;}
.main .community_sect .com_tab02 .tab_box .tab::after{background-color: var(--black); height: 1px;}
.main .community_sect .com_tab02 .tab_box .tab.active{color: var(--point01);}
.main .community_sect .com_tab02 .tab_box .tab.active::after{background-color: var(--point01); }
.main .community_sect .tab_cont{display: none;}
.main .community_sect .tab_cont.active{display: block;}

.main .community_sect .tab_cont.youtube .bulletin_list_thum07 .list li .img{position: relative; padding-top: 56%;}
.main .community_sect .tab_cont.youtube .bulletin_list_thum07 .list li button{width: 100%;}
/* .main .community_sect .tab_cont.youtube .bulletin_list_thum07 .list li .img:hover img {transform: translate(-50%, -50%) scale(1);}
.main .community_sect .tab_cont.youtube .bulletin_list_thum07 .list li .img:before{content: ''; position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; background-color: rgba(0, 0, 0, 0.2); z-index: 2; transition:0.3s ease-in-out;}
.main .community_sect .tab_cont.youtube .bulletin_list_thum07 .list li .img:after{content:'';position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: 6rem; height: 100%; z-index: 3; opacity: 0; transition:0.3s ease-in-out;
    background: url('data:image/svg+xml,<svg width="50" height="50" viewBox="0 0 50 50" fill="none" xmlns="http://www.w3.org/2000/svg"><rect width="50" height="50" rx="25" fill="white"/><path d="M32.5 25L21.25 31.4952L21.25 18.5048L32.5 25Z" fill="%230D0D0D"/></svg>') no-repeat center/ contain} */

.main .community_sect .tab_cont.instagram .bulletin_list_thum07 .list li a .img{padding-top: 125%;}


.main .community_sect .btn_box{display: flex; justify-content: center; margin: 4rem auto 0;}
.main .community_sect .btn_box .link_btn{margin: 0 auto;}






/* Hover */
@media screen and (min-width: 1241px) {
    .link_btn.wh:hover{background-color: var(--point01);}

    .com_swiper_btn .swiper_btn:hover{background-color: var(--point01);}
    .com_swiper_btn .swiper_btn:hover .arr{background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="46" height="46" viewBox="0 0 46 46" fill="none"><path d="M37 23H13" stroke="white" stroke-width="3" stroke-linecap="square" stroke-linejoin="round"/><path d="M23 11L11 23L23 35" stroke="white" stroke-width="3" stroke-linecap="square"/></svg>') no-repeat center / cover;}
    .com_swiper_btn .swiper_btn.wh:hover{background-color: #fff;}
    .com_swiper_btn .swiper_btn.wh:hover .arr{background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="46" height="46" viewBox="0 0 46 46" fill="none"><path d="M37 23H13" stroke="%232F58E0" stroke-width="3" stroke-linecap="square" stroke-linejoin="round"/><path d="M23 11L11 23L23 35" stroke="%232F58E0" stroke-width="3" stroke-linecap="square"/></svg>') no-repeat center / cover;}

    .main .visual_sect .link_btn.plus:hover{background-color: var(--point01);}

    .main .community_sect .tab_cont.youtube .bulletin_list_thum07 .list li a:hover .img:before,
    .main .community_sect .tab_cont.youtube .bulletin_list_thum07 .list li a:hover .img:after{opacity: 1;}
    .main .community_sect .tab_cont.youtube .bulletin_list_thum07 .list li .img:hover img{ transform: translate(-50%, -50%) scale(1.05);}
}






@media screen and (max-width: 2000px) {
    :root {
        --mainContMt: 8rem;
    }

}


@media screen and (max-width: 1640px) {
    .main_tit_box .tit{font-size: var(--h3);}

    .com_swiper_btn .swiper_btn.prev{ left: calc(var(--inPd) + 2rem);}
    .com_swiper_btn .swiper_btn.next{ right: calc(var(--inPd) + 2rem);}

    /* .com_prd_cont .prd_btn_box .btn.cart{padding: 0.5em 0.6em 0.5em 0.5em;} */

}

@media screen and (max-width: 1440px) {
    




}


@media screen and (max-width: 1240px) {    
    .main .bulletin_list_thum07 .list{display: flex;}
    .main .bulletin_list_thum07 .list li{flex:1}

    .main .store_sect{padding-top: var(--mainSectPd);}

    .main .ranking_sect .com_tab01 .tab_box { width: auto; margin-left: 0; border-radius: 10em;}



}


@media screen and (max-width: 1024px) {
    :root{
        --mainContMt: 50px;
    }

    .main .community_sect .bulletin_list_thum07{margin-top:var(--mainContMt);}
    .main .community_sect .tit_wrap{display: block;}
    .main .community_sect .tit_wrap .com_tab02 .tab_box{justify-content: center; margin-top: var(--mainContMt); }
    .main .community_sect .com_tab02 .tab_box{min-width: 100%;}

    

}


@media screen and (max-width: 768px) {
    :root{
        --mainSectPd: 90px;
        --mainContMt: 40px;
    }
    

    .main_tit_box .txt{font-size: var(--p3);}
    .main .banner_sect .cont_banner11_sect .banner_img .txt_box{padding: 40px 30px;}

    .main .community_sect .tit_wrap{flex-direction: column; align-items: flex-start;}
    .main .community_sect .tit_wrap .com_tab02 .tab_box{margin-top: 3rem; }

    .main .community_sect .tab_cont .bulletin_list_thum07{width: calc(100% + var(--inPd) * 2); margin-left: calc(var(--inPd) * -1); }
    .main .community_sect .tab_cont .bulletin_list_thum07 .news_list {padding: 0 var(--inPd);}

}


@media screen and (max-width: 600px) {
    :root{
        --mainSectPd: 80px;
        --mainContMt: 30px;
    }

    
    .main_tit_box .desc{font-size: var(--p5); margin-bottom: 5px;}

    .main .branding_sect .sub_text_motion03 .main_tit_box .txt{font-size:16px;}
    
    .main .ranking_sect .com_tab01 .btn{min-width: 16rem; padding: 0.55em 0;}

    .main .pick_sect{margin-top: -60px;}
    .main .pick_sect .tit_wrap{flex-direction: column; align-items: center; justify-content: center; text-align: center;}
    .main .pick_sect .main_basic_slide23{margin-top: var(--mainContMt);}


    .main .sub_text_motion01{padding-top: 20px;}
    .main .sub_text_motion01 .move_track.no_dot{gap: 4rem;}
    .main .sub_text_motion01 .move_track{font-size: 4rem;}

    .main .community_sect .tit_wrap .com_tab02 .tab_box{justify-content: flex-start; width: calc(100% + var(--inPd) * 2);}
    .main .community_sect .com_tab02 .tab_box .tab{width: auto; padding: 0 1.5em 0.5em;}

    .main .store_sect{padding-bottom: 0;}
    .main .banner_sect{padding-top: 60px;}
    .main .banner_sect .cont_banner11_sect .banner_img{padding-top: max(104%,350px)}
    .main .banner_sect .cont_banner11_sect .btn_box{margin-top: 20px;}
    .main .banner_sect .cont_banner11_sect .banner_img .txt_box{padding: 35px 25px;}

}
    
