@charset "utf-8";

/*메인 비주얼*/
.dcMainVisualWrap{}
.dcMainVisualWrap .MainVisual{width: 100%;height:calc(100vh - 85px);}
.dcMainVisualWrap .MainVisual .swiper-slide{background-position: center;background-size: cover;  background-repeat: no-repeat;position: relative;}
.dcMainVisualWrap .MainVisual .swiper-slide::after {  content: "";  position: absolute;  top: 0; left: 0;  width: 100%; height: 100%;  background: linear-gradient(to right, rgba(0,0,0,0.5), rgba(0,0,0,0));  pointer-events: none;z-index: 2;}
.dcMainVisualWrap .MainVisual .caption-box {position: absolute;top:20%;left:calc(50% - 710px);z-index: 3;color: #fff;line-height: 1.3;}
.dcMainVisualWrap .MainVisual .caption-box h2{font-size:3.2em;margin-bottom:20px;font-family:'WellnessSans_R'}
.dcMainVisualWrap .MainVisual .time_box_wrap {position: absolute;left:calc(50% - 450px);bottom: 80px;z-index: 3;color: #fff;background: rgba(0, 0, 0, 0.3);padding: 20px 30px;border-radius: 5px;width:970px;font-size: 1.1em;backdrop-filter: blur(4px);}
.dcMainVisualWrap .MainVisual .time_box_wrap p{float:left;width:40%;}
.dcMainVisualWrap .MainVisual .time_box_wrap .countdown-container{width:60%;display: flex;align-items: center;gap: 30px;}
/*.dcMainVisualWrap .MainVisual .time_box_wrap .countdown-text span {color: #999;display: block;margin-top: 5px;}*/
.dcMainVisualWrap .MainVisual .time_box_wrap .countdown-container .timer {display: flex;gap: 10px;}
.dcMainVisualWrap .MainVisual .time_box_wrap .countdown-container .timer span{margin-top:15px;}
.dcMainVisualWrap .MainVisual .time_box_wrap .countdown-container .timer .time-box {background: rgba(29, 29, 31, 9);border-radius: 8px;padding: 5px 8px;width: 70px;text-align: center;border:1px solid #38383a;}
.dcMainVisualWrap .MainVisual .time_box_wrap .countdown-container .timer .time-box .time-value {font-size: 1.2em;font-weight: 700;color: #fff;}
.dcMainVisualWrap .MainVisual .time_box_wrap .countdown-container .timer .time-box .time-label {font-size: 0.6em;color: #888;margin-top: 5px;}
.dcMainVisualWrap .MainVisual .time_box_wrap .countdown-container .prod_link{width:150px;margin-left:50px;font-size:0.8em;text-align:center;background:#000;padding:10px;border-radius:5px;margin-top:2px;cursor: pointer;}



/*인스타 및 PR뉴스*/
.dcArticle01{padding:80px 0;}
.dcArticle01 .active {color: #8be2cf;}
.dcArticle01 .basicWrapCenter h2 {text-align: center;padding: 40px 0 40px;}
.dcArticle01 .basicWrapCenter h2 span {margin: 0 20px;cursor: pointer;transition: color 0.3s;}
.dcArticle01 .basicWrapCenter h2 span:hover {color: #8be2cf;}

.dcArticle01 .basicWrapCenter ul {display: none;justify-content: center;align-items: flex-start;padding: 0;list-style: none;gap: 20px;}
.dcArticle01 .basicWrapCenter ul.active {display: flex;}
.dcArticle01 .basicWrapCenter ul li {flex: 1;display: flex;justify-content: center;}
.dcArticle01 .basicWrapCenter ul li img{border-radius:10px;}
.dcArticle01 .basicWrapCenter ul li div {display: flex;flex-direction: column;justify-content: flex-start;align-items: center;background: #4c4c4c;border-radius: 15px;text-align: center;overflow: hidden;padding: 15px;}
.dcArticle01 .basicWrapCenter ul li div img {width: 100%;height: auto;border-radius: 5px;display: block;margin-bottom: 10px;}
.dcArticle01 .basicWrapCenter ul li div p {width: 100%;font-size: 14px;color: #fff;line-height: 1.3em;margin: 0;height:60px;}
.dcArticle01 .basicWrapCenter ul li div p span {display: block;margin-top: 8px;font-size: 12px;color: #bbb;}

/*토탈 웰니스 솔루션*/
.dcArticle02{padding:80px 0;}
.dcArticle02 h2{text-align:center;padding: 40px 0;font-size:3em}
.dcArticle02 p{text-align:center;margin-bottom:40px;}
.dcArticle02 img{}

.dcArticle02 .iconWrap {display: flex;  justify-content: center;  align-items: center;  gap: 60px;  background: #000;  padding: 100px 0;margin-top: 40px;}
.dcArticle02 .iconWrap .iconBox {  display: flex;  flex-direction: column;  align-items: center;  color: #9ef0d0;font-size: 14px;cursor: pointer;}
.dcArticle02 .iconWrap .iconBox img{margin-bottom: 10px;border-radius:0px;}

/*나무엑스 브랜드 소개 */
.dcArticle03 {
	background-image: url('/modules/user/img/skin01/main/BG_brand_namuhx.jpg');background-repeat: no-repeat;background-position: center center; background-size: cover; 
	background-attachment: fixed;width: 100%;min-height: 100vh;display: flex;align-items: center;justify-content: center;position: relative;overflow: hidden;
}
.dcArticle03::before{content: "";position: absolute;inset: 0;background: rgba(0,0,0,0.1); pointer-events: none;font-family:'WellnessSans_B';}
.dcArticle03 .center{position: relative;text-align: center;color: #fff;padding: 1.5rem;box-sizing: border-box;text-shadow: 0 2px 10px rgba(0,0,0,0.6);}
.dcArticle03 .center .word {display: flex;gap: 10px;font-size: 6em;font-weight: 900;position: relative;width:375px;margin:-50px auto 0;}
.dcArticle03 .center .word span {display: inline-block;transition: transform 1.5s ease-in-out;}
/* 자리 이동 정의: 각 글자가 새로운 위치로 이동 */
.animate span:nth-child(1) { transform: translateX(300px); }
.animate span:nth-child(2) { transform: translateX(155px); }
.animate span:nth-child(3) { transform: translateX(0px); }
.animate span:nth-child(4) { transform: translateX(-155px); }
.animate span:nth-child(5) { transform: translateX(-300px); }
.dcArticle03 .center .word img {width: 40px;height: 80px;opacity: 0;transition: opacity 2s ease-in-out;margin-left: -20px;}
.dcArticle03 .center .show-logo img {opacity: 1;}
.dcArticle03 .center .GO_brand{display: inline-grid;border-radius:5px; background: rgba(255, 255, 255, 0.1);backdrop-filter: blur(6px);-webkit-backdrop-filter: blur(6px);padding: 8px 20px;margin-top:40px;border: 1px solid rgba(255, 255, 255, 0.2);









/*
.dcArticle01{padding: 280px 0;height: 950px;background: top center repeat-x;background-image: url(/modules/user/img/skin01/main/product_funtion_bg_pc.png);background-size: cover;animation: moveBg 20s linear infinite;}
.dcArticle01 .function_title {margin-bottom: 60px;font-size: 32px;text-align: center;font-family:'WellnessSans_B';}
.dcArticle01 .function_product {font-size: 20px;}
.dcArticle01 .function_product strong {display: block;margin-top: 16px;font-size: 144px;line-height: 130px;}
.dcArticle01 .function_list {display: grid;grid-template-columns: repeat(5, 1fr);gap: 40px;width: 1345px;margin: 0 auto;}
.dcArticle01 .function_list li {padding-top: 16px;border-top: 1px solid #38383A;list-style: none;}
.dcArticle01 .function_list .function_icon {width: 40px;margin-bottom: 24px;}
.dcArticle01 .function_list .function_icon img{width:100%}
.dcArticle01 .function_list .function_desc {display: flex;flex-direction: column;justify-content: flex-end;font-size: 16px;line-height: 1.6;color: #8D8D8D;letter-spacing: -0.01em;}
.dcArticle01 .function_list .function_name {position: relative;display: block;width: 110%;margin-top: 8px;font-size: 24px;color: #fff;font-family:'WellnessSans_B';}
@keyframes moveBg {
  from { background-position: 0 0; }
  to { background-position: 1000px 0; }
}
.dcArticle01_S{padding:50px 0;}
.dcArticle01_S .basicWrapCenter{position: relative;text-align:center} 
.dcArticle01_S .basicWrapCenter .sensor_title{position: absolute;top:0;width: 100%;margin-top:80px;}
.dcArticle01_S .basicWrapCenter .sensor_title p {text-align:center;}
.dcArticle01_S .basicWrapCenter .sensor_title p img {width: 40px;margin: -55px 10px 0 10px;}

.dcArticle01_S .basicWrapCenter .sensor_title p:nth-child(1){color:#8be2d1;font-size:1.7em;}
.dcArticle01_S .basicWrapCenter .sensor_title p:nth-child(2){font-size:4.5em;font-weight: 900;}
.dcArticle01_S .basicWrapCenter .sensor_title p:nth-child(3){font-size:1.7em}


.dcArticle02{background: top center repeat-x;background-size: 100% 100%;background-image: url(/modules/user/img/skin01/main/product_overview_01.jpg);background-size: cover;border-top:1px dashed #8ce3d2}
.dcArticle02 .basicWrapCenter{padding:300px 0}
.dcArticle02 .basicWrapCenter p{font-size:5em;text-align:center;font-weight: 900;}
.fade-up {opacity: 0;transform: translateY(40px);transition: opacity 1s ease, transform 1s ease;}
.fade-up.show {opacity: 1;transform: translateY(0);}
*/
/*메인 비주얼 슬라이드
.dcMainVisualWrap .MainVisual{}

.dcMainVisualWrap .MainVisual .swiper {width: 100%;height: 100%;margin:50px 0;--swiper-theme-color:#fff;--swiper-pagination-bullet-border-radius:5px;--swiper-pagination-bullet-width:8px;--swiper-pagination-bullet-inactive-color:#fff;--swiper-pagination-bullet-inactive-opacity:0.5}
.dcMainVisualWrap .swiper-pagination-bullet-active{width: 40px;transition: all 0.3s ease;}
.dcMainVisualWrap .swiper-pagination{padding:15px 0;background:#444; opacity: 0.7;width:200px !important;left:calc(50% - 100px) !important;border-radius:50px;--swiper-pagination-bottom:0px}
.dcMainVisualWrap .swiper-slide {position: relative;text-align: center;font-size: 18px;background: #444;display: flex;justify-content: center;align-items: center;width:1920px;margin-bottom:100px;overflow:hidden}
.dcMainVisualWrap .swiper-slide img {display: block;width: 100%;height: 100%;object-fit: cover;}
.dcMainVisualWrap .swiper-slide video{width:100%}
.dcMainVisualWrap .swiper-slide p{position: absolute;width:400px;bottom:30px;right:30px;padding:30px;background:rgba(0,0,0,0.5);border-radius:20px;font-size:0.9em;color:#cdcdcd;font-family:'Pretendard';opacity: 0; animation: fadeIn 1.5s ease forwards;}
@keyframes fadeIn {  from { opacity: 0; }  to { opacity: 1; } }

*/




/*핵심기능 슬라이드
.dcArticle03, .dcArticle05{background:#1d1d1f;padding:80px 0 40px;}
.dcArticle03 h2, .dcArticle05 h2{color:#5b5a5f;font-size:2em}
.dcArticle03 .mySwiper {width: 100%;height: 100%;margin:50px 0;--swiper-theme-color:#fff;--swiper-pagination-bullet-border-radius:5px;--swiper-pagination-bullet-width:8px;--swiper-pagination-bullet-inactive-color:#fff;--swiper-pagination-bullet-inactive-opacity:0.5}
.dcArticle03 .swiper-pagination-bullet-active{width: 40px;transition: all 0.3s ease;}
.dcArticle03 .swiper-pagination{padding:15px 0;background:#444; opacity: 0.7;width:200px !important;left:calc(50% - 100px) !important;border-radius:50px;--swiper-pagination-bottom:0px}
.dcArticle03 .swiper-slide {position: relative;text-align: center;font-size: 18px;background: #444;display: flex;justify-content: center;align-items: center;height:580px;width:1190px;border-radius:40px;margin-bottom:100px;overflow:hidden}
.dcArticle03 .swiper-slide img {display: block;width: 100%;height: 100%;object-fit: cover;}
.dcArticle03 .swiper-slide video{width:100%}
.dcArticle03 .swiper-slide p{position: absolute;width:400px;bottom:30px;right:30px;padding:30px;background:rgba(0,0,0,0.5);border-radius:20px;font-size:0.9em;color:#cdcdcd;font-family:'Pretendard';opacity: 0;animation: fadeIn 1.5s ease forwards;}
@keyframes fadeIn {  from { opacity: 0; }  to { opacity: 1; } }
*/
.dcArticle04 {  padding: 50px;height: 3000px;position: relative;  background: center center no-repeat;background-image: url(/modules/user/img/skin01/main/product_overview_00_pc.png);  background-size: 800px auto;background-attachment: fixed;transition: background-size 0.05s linear;}
.dcArticle04 .basicWrapCenter {position: sticky;top: 50%;transform: translateY(-50%);text-align: center;}
.dcArticle04 .basicWrapCenter p {font-size: 4em;margin: 0.2em 0;opacity: 0;transition: opacity 0.5s ease;position: absolute;width: 100%;left: 0;text-align:center;}
.dcArticle04 .basicWrapCenter p.active {opacity: 1;position: relative;}




