/* BASIC css start */
#wib_Header{box-shadow:none}
.w1520{width:1600px;margin:0 auto;padding:0 40px;box-sizing:border-box;}
.m_tit{font-size:32px;color:#424242;font-weight:600;letter-spacing:0.03em;line-height:1}
.more_view,.btn_moreGray{position:relative;z-index: 1;}
.more_view:after,.btn_moreGray:before{position: absolute; content: ""; width: 100%; height: 0; top: -1px; left: 0; z-index: -1;  background-color: #7f7f7f; transition: all 0.3s ease;}
.more_view:hover:after,.btn_moreGray:hover:before{top: auto; bottom: -1px; height: calc(100% + 2px);}
.more_view:hover,
.btn_moreGray:hover{border-color:#7f7f7f !important}
.more_view2{position:relative;overflow:hidden;transition:all 0.3s}
.more_view2::before{content: ""; position: absolute; top: 0; left: 0;width: 100%; height: 100%; background: #7f7f7f;  transition: all 0.3s ease;  transform: translate3d(-102%, 0, 0); border-radius: 100px;z-index:-1}
.more_view2:hover::before{transform: translate3d(0%, 0, 0);}
.more_view2:hover{color:#fff !important;border-color:#7f7f7f !important;background:transparent !important}
@font-face {
    font-family: 'GmarketSansMedium';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
/*¸ÞÀκñÁê¾ó*/
#main_content ul li{position: relative;}
#main_content .txt_box{position: absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center}
#main_content .txt_box .ban_tit{font-size:40px;color:#fff;margin-top:20px;font-weight:500;line-height:1}
#main_content .txt_box .ban_tit.s{font-size:20px;color:#fff;margin-top:20px;font-weight:500;line-height:1}
/*#main_content .txt_box .ban_tit.ko{font-family: 'pretendard', sans-serif !important;letter-spacing:-0.03em;font-weight:400;}*/
#main_content .txt_box .ban_tit.ko{font-family: 'Noto Sans KR', sans-serif !important;letter-spacing:-0.05em;font-weight:bold}
#main_content .txt_box .ban_tit.eg{font-family: 'GmarketSansMedium',sans-serif !important; font-weight:600; letter-spacing:-0.02em; font-size:38px;}
#main_content .txt_box .more_view{display:block;width:160px;border:1px solid #fff;font-size:12px;text-align:center;color:#fff;line-height:40px;margin:55px auto 0;letter-spacing:-0.02em}
#main_content .txt_box .more_view img{vertical-align: middle;margin-left:7px}
#main_content ul li.swiper-slide-active .txt_box{animation:up 1s cubic-bezier(0.165, 0.840, 0.440, 1.000) forwards}
#main_content ul li > img,
#main_content ul li > a > img{width:100%}
#main_content .swiper-button-prev,
#main_content .swiper-button-next{width:19px;height:39px;}
#main_content .swiper-button-next{background:url('/design/happyprinc/wib/img/ban_arrow_next.svg')no-repeat center;right:20px}
#main_content .swiper-button-prev{background:url('/design/happyprinc/wib/img/ban_arrow_prev.svg')no-repeat center;left:20px}
@keyframes up{
    from {top:calc(50% + 300px);opacity: 0;}
    to{top:50%;opacity: 1;}
}
#main_content .swiper_paging_box::after{content: "";display: block;clear: both;}
#main_content .swiper_paging_box{position: absolute;bottom: 30px;display: inline-block;left: 50%;transform: translateX(-50%);z-index: 20;text-align: center;}
#main_content .swiper_paging_box > div{display: inline-block;font-size: 14px;}
#main_content .swiper_paging_box .curr{margin-right: 15px;font-weight: 500;color:#424242;}
#main_content .swiper_paging_box .max{margin-left: 15px;font-weight: 300;color:#fff}
#main_content .swiper_paging_box .swiper-pagination{position: static;width: 130px;}
#main_content .bar{position:absolute;left:0;top:-4px;width:130px; height:1px;margin:0 6px;display:inline-block;background: #FFFFFF;margin: 0;opacity: 1 !important;}
#main_content .bar span{position:absolute;top:0;left:0;z-index:100;width:0; height:1px;background: #424242;}
#main_content .bar.swiper-pagination-bullet-active span{animation:fill 4s cubic-bezier(0.165, 0.840, 0.440, 1.000) forwards}
@keyframes fill{
    from {width: 0;}
    to{width:100%}
}
#main_content .swiper_paging_box .swiper_btn_box{margin-left:15px}
#main_content .swiper_paging_box .swiper_btn_box .swiper-stop{display:inline-block;width:6px;height:11px;background:url('/design/happyprinc/wib/img/main_ban_stop.svg')no-repeat center;cursor:pointer;margin-right:7px}
#main_content .swiper_paging_box .swiper_btn_box .swiper-play{display:inline-block;width:11px;height:11px;background:url('/design/happyprinc/wib/img/main_ban_play.svg')no-repeat center;cursor:pointer}

/*ŸÀÓ¼¼ÀÏ*/
#time_sale_pd{margin-top:150px}
#time_sale_pd .m_tit{margin-bottom:55px}


/*5¿­ »óÇ° Æû*/
.type01 .item-cont > li{display:inline-block;width:calc(20% - 24px);margin-right:30px;margin-top:50px;}
.type01 .item-cont > li:nth-child(5n){margin-right:0}
.type01 .item-cont > li:nth-child(1),
.type01 .item-cont > li:nth-child(2),
.type01 .item-cont > li:nth-child(3),
.type01 .item-cont > li:nth-child(4),
.type01 .item-cont > li:nth-child(5){margin-top:0}

/*½Å»óÇ°*/
#new_pd{margin-top:150px}
#new_pd .m_tit{margin-bottom:55px}
#new_pd .item-cont{margin-top:80px;vertical-align:top;}
#new_pd .item-cont .item-list { vertical-align:top; }
#new_pd .item-cont:first-of-type{margin-top:0}
#new_pd .new_product_more{display:block;margin:0 auto;width:160px}
/* pc´õº¸±â ¹öÆ° Ãß°¡ ¿µ¿ª */
.product-wrap .more { text-align:center; margin: 60px 0px 0;}
.btn_moreGray {width:160px; height:42px; line-height: 40px; background-color:#fff; border:1px solid #7B7672;font-weight:400; display: block; margin: 0 auto;font-size:12px;}
.btn_moreGray img{}
.btn_moreGray span {color:#7B7672;}
.btn_moreGray span em {color:#f1191f;}
.btn_moreGray:hover{color:#fff}
.btn_moreGray:after{content:"";display:inline-block;width:6px;height:10px;background:url('/design/happyprinc/wib/img/pd_more_arrow.svg')no-repeat center;vertical-align: unset;margin-left:7px}
.btn_moreGray:hover:after{background:url('/design/happyprinc/wib/img/main_ban_arrow.svg')no-repeat center;}


/*½Å±Ôȸ¿ø¹è³Ê*/
#ban01{margin-top:164px;position: relative;}
#ban01 img{width:100%;}
#ban01 .swiper-button-prev,
#ban01 .swiper-button-next{width:19px;height:39px;}
#ban01 .swiper-button-next{background:url('/design/happyprinc/wib/img/ban_arrow_next.svg')no-repeat center;right:30px}
#ban01 .swiper-button-prev{background:url('/design/happyprinc/wib/img/ban_arrow_prev.svg')no-repeat center;left:30px}
#ban01 ul li a{transition:all 0.5s}
#ban01 ul li:hover a{opacity:.6}


/*À§Å°º£½ºÆ®*/
#best_pd{background:#f6f6f6;padding:120px 0 110px;margin-top:150px}
#best_pd .tit_box{margin-bottom:65px}
#best_pd .tit_box:after{content:"";display:block;clear:both}
#best_pd .tit_box .m_tit{display:inline-block}
#best_pd .tit_box .tabMenu{display:inline-block;float:right}
#best_pd .tit_box .tabMenu ul{font-size:0}
#best_pd .tit_box .tabMenu ul li{display:inline-block;width:auto;margin-left:20px}
#best_pd .tit_box .tabMenu ul li:first-child{margin-left:0}
#best_pd .tit_box .tabMenu ul li a{font-size:18px;color:#888888;letter-spacing:-0.03em;position: relative;cursor:pointer;transition:all 0.1s}
#best_pd .tit_box .tabMenu ul li.active a,#best_pd .tit_box .tabMenu ul li:hover a{color:#202323;font-weight:500}
#best_pd .tit_box .tabMenu ul li > a::before{content:"";display: block;width: 0%;height:1px;background-color: #202323;position: absolute;bottom:-2px;right:0;transition: all 0.3s;}
#best_pd .tit_box .tabMenu ul li:hover a::before,
#best_pd .tit_box .tabMenu ul li.active a::before{width: 100%; left: 0; right: auto;}
#best_pd .tit_box .tabMenu ul li:hover > a {color:#202323;font-weight:500; }

#best_pd .cont_box{font-size:0}
#best_pd .cont_box .cont_box_inner > div{display:inline-block;vertical-align: top;}
#best_pd .cont_box .cont_box_inner > div.ban_box{width:29.68vw;margin-right:50px;position: relative;}
#best_pd .cont_box .cont_box_inner > div.ban_box a{display:block;overflow:hidden}
#best_pd .cont_box .cont_box_inner > div.ban_box a:hover > img{transform:scale(1.1)}
#best_pd .cont_box .cont_box_inner > div.ban_box a > img{width:100%;transition:all 0.5s}
#best_pd .cont_box .cont_box_inner > div.ban_box .txt_box:after{content:"";display:block;clear:both}
#best_pd .cont_box .cont_box_inner > div.ban_box .txt_box{position: absolute;bottom:32px;left:0;width:100%;padding:0 30px;box-sizing:border-box}
#best_pd .cont_box .cont_box_inner > div.ban_box .txt_box p.txt1{font-size:32px;color:#fff;letter-spacing:-0.03em;font-weight:600;margin-bottom:10px}
#best_pd .cont_box .cont_box_inner > div.ban_box .txt_box p.txt2{font-size:16px;color:#fff;letter-spacing:-0.03em;font-weight:400}
#best_pd .cont_box .cont_box_inner > div.ban_box .txt_box p.txt2 span{display:inline-block;float:right;color:#fff;text-decoration: underline;}
#best_pd .cont_box .cont_box_inner > div.ban_box .txt_box p.txt2 span:after{content:"";display:inline-block;width:6px;height:10px;background:url('/design/happyprinc/wib/img/main_ban_arrow.svg')no-repeat center;vertical-align: unset;margin-left:7px}
#best_pd .cont_box .cont_box_inner{display:none}
#best_pd .cont_box .cont_box_inner:first-child{display:block}
#best_pd .cont_box .cont_box_inner > div.pd_box{width:calc(100% - 29.68vw - 50px)}
#best_pd .cont_box .cont_box_inner > div.pd_box .pd_list .item-cont > li{width:calc(33.33% - 20px);margin-right:30px;margin-top:55px}
#best_pd .cont_box .cont_box_inner > div.pd_box .pd_list .item-cont > li:nth-child(3n){margin-right:0}
#best_pd .cont_box .cont_box_inner > div.pd_box .pd_list .item-cont > li:nth-child(1),
#best_pd .cont_box .cont_box_inner > div.pd_box .pd_list .item-cont > li:nth-child(2),
#best_pd .cont_box .cont_box_inner > div.pd_box .pd_list .item-cont > li:nth-child(3){margin-top:0}

/*ÇÖÅ°¿öµå*/
#hot_pd{margin-top:150px}
#hot_pd{font-size:0}
#hot_pd .m_tit{margin-bottom:55px}
#hot_pd .tabMenu2{display:inline-block;width:16.14vw;vertical-align:top}
#hot_pd .tabMenu2 li{margin-bottom:21px;}
#hot_pd .tabMenu2 li.active{padding:5px 0 10px}
#hot_pd .tabMenu2 li:first-child.active{padding-top:0}
#hot_pd .tabMenu2 li a{font-size:18px;color:#888888;letter-spacing:-0.03em;position: relative;transition:all 0.3s}
#hot_pd .tabMenu2 li.active a{font-size:24px;color:#202323;font-weight:600}
#hot_pd .tabMenu2 li:hover > a {color:#202323;font-weight:600}
#hot_pd .tabMenu2 li > a::before{content:"";display: block;width: 0%;height:2px;background-color: #202323;position: absolute;bottom:0px;right:0;transition: all 0.3s;}
#hot_pd .tabMenu2 li:hover a::before,
#hot_pd .tabMenu2 li.active a::before{width: 100%; left: 0; right: auto;}
#hot_pd .tab_cont{display:inline-block;width:calc(100% - 16.14vw);vertical-align:top}
#hot_pd .tab_cont .pd_list{display:none}
#hot_pd .tab_cont .pd_list:first-child{display:block;}
#hot_pd .tab_cont .pd_list .item-cont > li{width:calc(25% - 23px);margin-right:30px;vertical-align:top}
#hot_pd .tab_cont .pd_list .item-cont > li:nth-child(4){margin-right:0}

/* Ä«Å×°í¸® ¾Ö´Ï¸ÞÀÌ¼Ç */
@keyframes bounce{
    0%{
        top: -30px;

        opacity:0
    }

    100%{
        top: 0px;

        opacity:1
    }
}  
/*»çÀÌÁî ¹è³Ê ¿µ¿ª*/
#ban02{margin-top:150px;position:relative}
#ban02 ul{font-size:0;padding-top:66px}
#ban02 ul li{display:inline-block;width:calc(50% - 40px);margin-right:80px;vertical-align: top;}
#ban02 ul li a{display:block;}
#ban02 ul li a >img{width:100%}
#ban02 ul li:last-child{margin-right:0;}
#ban02 ul li .txt{margin-top:40px;position:relative}
#ban02 ul li .txt .t1{font-size:32px;color:#424242;letter-spacing:0.03em;font-weight:600;line-height:1;margin-bottom:20px}
#ban02 ul li .txt .t2{font-size:18px;color:#7B7672;letter-spacing:-0.03em;font-weight:400;line-height:1.5}
#ban02 ul li .txt .more_view2{display:inline-block;border:1px solid #C9C9C9;border-radius:50px;width:122px;line-height:42px;height:42px;font-size:16px;color:#7B7672;letter-spacing:-0.03em;text-align:center;font-weight:600;position:absolute;bottom:0;right:0}

/*¿¥µðÇÈ*/
#md_pd{margin-top:300px;background:#f6f6f6;padding:113px 0 122px}
#md_pd .w1520{position:relative}
#md_pd .m_tit{position:absolute;top:0;left:40px;z-index:2}
#md_pd .swiper-container:before{content:"";display:block;width:1px;height:16px;background:#C9C9C9;position:absolute;bottom:3px;left:37px;z-index: 2;}
#md_pd .swiper-container ul li{font-size:0; }
#md_pd .swiper-container ul li>div{display:inline-block;vertical-align:bottom}
#md_pd .swiper-container ul li>div.left_box{width:23.02vw;margin-right:63px}
#md_pd .swiper-container ul li>div .txt_box{padding-bottom:122px;opacity:0}
#md_pd .swiper-container ul li>div .txt_box h4{font-size:28px;color:#202323;font-weight:500;line-height:1;margin-bottom:20px}
#md_pd .swiper-container ul li>div .txt_box .sub_txt{font-size:16px;color:#6e6e6e;font-weight:400;line-height:25px;letter-spacing: -0.03em;}
#md_pd .swiper-container ul li>div .price_box{margin-top:35px}
#md_pd .swiper-container ul li>div .price_box span.discount{font-size:22px;color:#424242;font-weight:500;}
#md_pd .swiper-container ul li>div .price_box span.price{font-size:20px;color:#C9C9C9;font-weight:300;margin-left:10px;text-decoration: line-through;}
#md_pd .swiper-container ul li>div .more_view2{display:inline-block;width:139px;height:42px;line-height:42px;border-radius:50px;border:1px solid #fff;font-size:16px;color:#6e6e6e;font-weight:600;letter-spacing:-0.03em;text-align:center;margin-top:122px;background:#fff}
#md_pd .swiper-container ul li>div.right_box{width:calc(100% - 23.02vw - 63px);font-size:0}
#md_pd .swiper-container ul li>div.right_box a{display:block;}
#md_pd .swiper-container ul li>div.right_box span{display:inline-block;width:calc(50% - 8px);margin-right:15px;overflow:hidden}
#md_pd .swiper-container ul li>div.right_box span:last-child{margin-right:0}
#md_pd .swiper-container ul li>div.right_box span img{width:100%;transition:all 1.5s;transform:scale(1.1);opacity:0}
#md_pd.on .swiper-container ul li>div.right_box span img{transform:scale(1);opacity:1}
#md_pd.on .swiper-container ul li>div.right_box span:last-child img{transition-delay:1s;}
#md_pd .swiper-button-prev,
#md_pd .swiper-button-next{width:12px;height:22px;bottom:0;top:auto;margin:0}
#md_pd .swiper-button-next{background:url('/design/happyprinc/wib/img/md_arrow_next.svg')no-repeat center;right:auto;left:63px}
#md_pd .swiper-button-prev{background:url('/design/happyprinc/wib/img/md_arrow_prev.svg')no-repeat center;left:0px}
#md_pd ul li.swiper-slide .right_box span img{width:100%;transition:all 1.5s ;transform:scale(1.1) !important;opacity:0 !important}
#md_pd ul li.swiper-slide-active .txt_box{animation:left_ani 1s cubic-bezier(0.165, 0.840, 0.440, 1.000) forwards;animation-delay: .5s;}
#md_pd ul li.swiper-slide-active .right_box span img{transform:scale(1) !important;opacity:1 !important;transition-delay:1s !important;}
#md_pd ul li.swiper-slide-active .right_box span:last-child img{transition-delay:1.5s !important}
@keyframes left_ani{
    from {transform:translateX(-100px);opacity:0}
    to{transform:translateX(0);opacity:1}
}
@keyframes down_ani{
    from {transform:translateY(-100px);opacity:0}
    to{transform:translateY(0);opacity:1}
}
/*Å©¸®¸¶ ¸®ºä*/
#review_wrap{margin-top:150px}
#review_wrap .m_tit{margin-bottom:50px}
#review_wrap .m_tit span{font-size:15px;color:#424242;letter-spacing:-0.03em;font-weight:400;margin-left:20px}
#review_wrap .m_tit span strong{font-size:15px;color:#444;letter-spacing:-0.03em;font-weight:700}

@media (max-width: 1600px) { 
    .w1520{width:100%}
}
/* BASIC css end */