@charset "utf-8";
/* 
font-family:"Pretendard Variable"
font-family: 'Noto Sans KR';
*/
.shopby-header > div {border-bottom: 0 !important;}
body > .main{width:100%;margin:0;padding:0;padding-bottom: 57px;}/* 메인 */


/* ―――――――――――――― MAIN SLIDER ―――――――――――――― */
.main_slider_template {min-height: 560px;}
.main_banner_box {overflow: hidden; display: flex; align-items: center; justify-content: center;}
.main-slider-banner {min-width: 1920px;}

.main-slider-banner .swiper-prev,
.main-slider-banner .swiper-next {opacity: 0; position: absolute; top: var(--swiper-navigation-top-offset,50%); width: calc(var(--swiper-navigation-size)/ 44 * 27); height: var(--swiper-navigation-size); margin-top: calc(0px - (var(--swiper-navigation-size)/ 2)); z-index: 10; cursor: pointer; display: flex; align-items: center; justify-content: center; color: var(--swiper-navigation-color,var(--swiper-theme-color))}
.main-slider-banner:hover .swiper-prev,
.main-slider-banner:hover .swiper-next {opacity: 1;}
.main-slider-banner .swiper-prev:after,
.main-slider-banner .swiper-next:after {display: none !important;}

.main-slider-banner .swiper-prev {left: 94px;}
.main-slider-banner .swiper-next {right: 94px;}

.main-slider-banner .swiper-pagination {background: rgba(255,255,255,0.36) !important;width: fit-content !important;height: 1px !important;top: initial !important;bottom: 40px !important;left: 50% !important;transform: translateX(-50%) !important;transition: none !important;display: flex;align-items: center;}
.main-slider-banner .swiper-pagination .swiper-pagination-bullet {margin: 0 !important;width: 49px;height: 1px;background: transparent !important;padding: 0 !important;margin: 0 !important;opacity: 1 !important;border: 0 !important;transform: none !important;position: relative !important;border-radius: 0 !important;}
.main-slider-banner .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {background: #000 !important;}
.main-slider-banner .swiper-slide {display: flex; align-items: center; justify-content: center;}
.main-slider-banner .swiper-slide img {display: block; min-width: 1920px; margin: 0 auto; }


/* ―――――――――――――― CATE ICON SLIDER ―――――――――――――― */
.icon_cate_slider_box {min-height: 212px}
.icon_cate_slider {position: relative; display: block; width: 100%; max-width: 1300px; min-height: 169px; margin: 0 auto; box-sizing: border-box; font-size: 0; padding: 54px 20px 43px 20px;}
.icon_cate_slider * {box-sizing: border-box;}
.icon_cate_slider .swiper-container {position: relative; display: block;;}
.icon_cate_slider .swiper-slide {padding: 0 10px; width: 126px;}
.icon_cate_slider .swiper-slide a {width: 100%;display: block;text-align: center;}
.icon_cate_slider .swiper-slide a img {display: inline-block;max-width: 100%;margin: 0 auto;}
.icon_cate_slider .swiper-slide a span {display: block;text-align: center;line-height: 1;font-size: 14px;font-weight: 400;letter-spacing: -0.025em;color: #000;margin-top: 15px;}

.icon_cate_slider button.btn {padding: 0; margin: 0; position: absolute; top: 103px;}
.icon_cate_slider button.prev {left: 0;}
.icon_cate_slider button.next {right: 0;}


/* ―――――――――――――― TAB ITEMS ―――――――――――――― */

.best_prd {position: relative;display: block;width: 100%;height: auto; min-height: 596px; max-width: 1300px;margin: 45px auto 100px; font-size: 0;}
.best_prd__header {position: relative;display: flex;align-items: flex-start;justify-content: space-between;width: 100%;padding-bottom: 43px;}
.best_prd__header h3 {display: block; line-height: 1; width: fit-content; font-size: 34px; font-weight: 600; color: #000;}
.best_prd_tab__btn {position: relative; display: flex; align-items: center; flex-wrap: wrap; width: fit-content;}
.best_prd_tab__btn button.tab {display: flex; align-items: center; justify-content: center; width: 180px; height: 39px; border-radius: 20px; background: #fff; border: 1px solid #e6e6e6; padding: 0; margin: 0 10px; cursor: pointer; line-height: 1; font-size: 16px; font-weight: 500; color: #000; box-sizing: border-box;}
.best_prd_tab__btn button.tab:last-child {margin-right: 0 !important;}
.best_prd_tab__btn button.tab.on {background: #000; border-color: #000; color: #fff;}

.best_prd__body {position: relative;display: block;width: 100%;max-width: 1300px;margin: 0 auto;overflow: hidden;}
.best_prd_tab__con {position: relative;display: block;width: calc(100% + 20px);margin-left: -10px;height: 514px;}
.best_prd_tab__con > .tab {position: absolute;left: 0;top: 0;display: block;width: 100%;height: 514px;}
.main_tab_prd {}
.main_tab_prd .swiper-container {}
.main_tab_prd .swiper-container .swiper-slide {height: 514px; width: 100%; max-width: 330px;}
.main_tab_prd .swiper-container .swiper-slide .item_photo_box {background: #f1f1f1; min-height: 310px;}
.main_tab_prd .swiper-container .swiper-slide .item_photo_box img {border: 0;}


.main_tab_prd .progressbar {/* position: absolute; width: 100%; max-width: 1300px; height: 1px; left: 10px; bottom: -50px; z-index: 1; */}
.main_tab_prd .swiper-pagination-progressbar {top: initial !important; bottom: 0 !important;}
.main_tab_prd .swiper-pagination-progressbar {height: 1px !important;}
.main_tab_prd .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {background: #000 !important;}


/* ―――――――――――――― DAILY ROUTINE ―――――――――――――― */
.daily_routine {position: relative; display: flex; align-items: center; justify-content: center; width: 100%; height: 741px; background: #f7f4ef;}

.daily_routine__inner {position: relative; display: flex; align-items: center; justify-content: space-between; width: 100%; max-width: 1300px; height: auto;}
.daily_routine_video {position: relative; display: block; width: 840px; height: 540px;}
.daily_routine_video iframe {width: 100% !important; height: 100% !important; padding: 0; margin: 0;}
.daily_routine_video .btn_frame {position: absolute; left: 0; top: 0; display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; background-repeat: no-repeat; background-size: cover; background-position: left top; font-size: 0;}
.daily_routine_video .btn_frame button {padding: 0; margin: 0; border: 0; background: url(../../../assets/img/main/play.png)no-repeat center; display: block; width: 100px; height: 100px; font-size: 0;}

.daily_routine_prd {position: relative; display: block; width: 426px;}
.daily_routine_prd .tit {position: relative; display: block; width: 278px; margin: 0 auto; font-size: 0;}
.daily_routine_prd .tit h3 {position: relative; display: block; line-height: 1; font-size: 34px; font-weight: 600; color: #000;}
.daily_routine_prd .tit h3 a {position: absolute; right: -5px; top: 50%; margin-top: -16px;}
.daily_routine_prd .tit p {display: block; line-height: 1.4; font-size: 16px; font-weight: 400; color: #000; letter-spacing: -0.025em; margin-top: 15px;}

.daily_routine_prd .goods_list {position: relative; display: block; width: 278px; margin: 0 auto; margin-top: 32px;}
.daily_routine_prd .item_box .item_cont {padding-left: 0; padding-right: 0;}

.daily_routine_prd button.btn_item {position: absolute; top: 228px; box-sizing: border-box; padding: 0; margin: 0; width: 13px; height: 25px; font-size: 0;}
.daily_routine_prd button.btn_item.prev {left: 30px; background: url(../../../assets/img/main/left-arrow.png)no-repeat center / 100%;}
.daily_routine_prd button.btn_item.next {right: 30px; background: url(../../../assets/img/main/right-arrow.png)no-repeat center / 100%;}


/* ―――――――――――――― TAB PROPOSAL ―――――――――――――― */
.tab_proposal {position: relative; display: block; width: 100%; min-height: 727px; max-width: 1300px; margin: 0 auto; box-sizing: border-box; padding: 98px 0 63px 0;}
.tab_proposal__header {position: relative; display: block; width: 100%; margin-bottom: 32px;}
.tab_proposal__header h3 {display: block; line-height: 1; font-size: 34px; font-weight: 700; letter-spacing: -0.050em; color: #000;}
.tab_proposal__body {position: relative; display: flex; width: 100%; height: auto; justify-content: space-between;}
.tab_proposal__body .tab_btn {position: relative; display: block; width: 330px; min-width: 330px; box-sizing: border-box; padding-right: 15px; padding-top: 42px;}
.tab_proposal__body .tab_btn button {box-sizing: border-box; display: block; line-height: 1; overflow: hidden; text-overflow: ellipsis; -o-text-overflow: ellipsis; -ms-text-overflow: ellipsis; white-space: nowrap; max-width: 100%; width: fit-content; padding: 1px 15px 1px 0; font-size: 18px; font-weight: 400; color: #000; position: relative;}
.tab_proposal__body .tab_btn button + button {margin-top: 40px;}
.tab_proposal__body .tab_btn button.active {font-weight: 700; color: #357e6b;}
.tab_proposal__body .tab_btn button.active:after {content: ""; display: block; width: 6px; height: 6px; background: #357e6b; position: absolute; right: 0; top: 0; border-radius: 50%;}


.tab_proposal__body .content {position: relative; display: block; width: calc(100% - 330px); /* overflow: hidden; */}
.tab_proposal__body .content > .con {position: relative; width: 100%; height: auto;}
.tab_proposal__body .content > .con .goods_list {position: relative; display: block; width: calc(100% + 20px); margin-left: -10px;}

.tab_proposal__body .content > .con .goods_list .item_box {}
.tab_proposal__body .content > .con .goods_list .item_box > .swiper-wrapper {}
.tab_proposal__body .content > .con .goods_list .item_box > .swiper-wrapper > .swiper-slide {max-width: 330px; opacity: 0;}
.tab_proposal.show .tab_proposal__body .content > .con .goods_list .item_box > .swiper-wrapper > .swiper-slide {opacity: 1;}
.tab_proposal__body .content > .con .goods_list .item_box > .swiper-wrapper > .swiper-slide .item_cont {}

.tab_proposal__body .content .btn_box {position: absolute; right: 10px; top: -66px; display: flex; align-items: center; justify-content: space-between; width: 71px; height: 33px;}
/* .tab_proposal__body .content .show .btn_box {display: flex;} */
.tab_proposal__body .content .btn_box button {padding: 0; margin: 0; cursor: pointer; width: 33px; height: 33px; background-size: 100% 100%; background-repeat: no-repeat; background-position: center; font-size: 0;display: none;}
.tab_proposal__body .content .prev {background-image: url(../../../assets/img/main/prev2.png)}
.tab_proposal__body .content .next {background-image: url(../../../assets/img/main/next2.png)}



/* ―――――――――――――― BRAND STORY ―――――――――――――― */
.brand_story {position: relative;display: flex;align-items: center;justify-content: center;width: 100%;min-width: 1300px;margin: 0 auto;font-size: 0;overflow: hidden;height: 520px; background: #f1f1f1;}
.brand_story .banner,
.brand_story .banner img {display: block; width: 100%; height: auto; min-width: 1920px;}

.brand_story {}
.brand_story a {display: block; width: 100%;}
.brand_story .banner-parallax {position: absolute;display: flex;align-items: center;justify-content: center;width: 100%;background-position: center;background-repeat: no-repeat;background-size: 1920px auto !important;background-attachment: fixed;left: 0;top: 0;height: 100%;}

/* ―――――――――――――― BEST REVIEW ―――――――――――――― */
.best_review {box-sizing: border-box; position: relative; display: block; width: 100%; max-width: 1300px; margin: 73px auto 0; min-height: 488px;}
.best_review * {box-sizing: border-box;}
.best_review .tit {display: flex; align-items: center; justify-content: space-between; width: 100%; height: auto; line-height: 1;}
.best_review .tit h3 {font-size: 34px; font-weight: 700; color: #000;}
.best_review .tit a {display: block; width: 58px; height: 13px; line-height: 13px; font-size: 12px; font-weight: 300; letter-spacing: 0.030em; color: #000; background: url(../../../assets/img/main/arrow02.png)no-repeat center right / 8px;}

.best_review ul {position: relative; display: flex; flex-wrap: wrap; width: calc(100% + 20px); margin-left: -10px; margin-top: 36px;}
.best_review ul > li {position: relative; display: block; width: 25%; height: auto; padding: 0 10px;}

.review_con {position: relative; display: block; width: 100%; height: auto;}
.review_img {}
.review_img a {}
.review_img .img {position: relative; display: block; width: 100%; height: 0; padding-bottom: 100%;}
.review_img .img img  {position: absolute; left: 0; top: 0; display: block; width: 100%; height: 100%;}
.review_img .txt {position: relative; display: flex; align-items: center; width: 100%; height: 71px; border: 1px solid #e5e5e5; border-top: 0; background: #fff; padding: 0 13px;}
.review_img .txt span {position: relative; display: block; width: 100%; font-size: 13px; color: #333; font-weight: 400; line-height: 1.538; overflow:hidden; word-wrap: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}

.review_prd {position: relative; display: flex; align-items: center; width: 100%; height: 81px; border: 1px solid #e5e5e5; border-top: 0; padding: 0 13px;}
.review_prd a {position: relative; display: flex; align-items: center; flex-wrap: wrap; width: 100%;}
.review_item_img {position: relative; display: block; width: 45px; height: 45px; border: 1px solid #efefef; background: #fff;}
.review_item_img img {display: block; width: 100%; height: 100%; object-fit: cover;}

.review_item_nm {position: relative; display: block; width: calc(100% - 45px); padding-left: 13px;}
.review_item_nm .nm {line-height: 1; font-size: 13px; font-weight: 400; color: #000; overflow: hidden; text-overflow: ellipsis; -o-text-overflow: ellipsis; -ms-text-overflow: ellipsis; white-space: nowrap; max-width: 100%; display: block;}

.review_item_nm div {display: flex; align-items: center; line-height: 1; flex-wrap: wrap; font-size: 13px; font-weight: 400; color: #333; margin-top: 10px;}
.review_item_nm div b {font-weight: 600; margin-left: 4px;}
.review_item_nm div span {display: block; width: 1px; height: 7px; background: #c3c1c1; margin: 0 10px;}
