@charset "utf-8";

/* 다국어 지원 */
html[lang="zh"] body {font-family: 'Noto Sans SC', sans-serif;} /* 중국어 (zh) */
html[lang="ja"] body {font-family: 'Noto Sans JP', sans-serif;} /* 일본어 (ja) */
html[lang="vi"] body {font-family: 'Noto Sans', sans-serif; /* 베트남어 (vi) */}
html[lang="id"] body {font-family: 'Noto Sans', sans-serif; /* 인도네시아어 (id) */}

/* Common */
*, *::before, *::after {box-sizing: border-box;}

html{overflow-x: hidden; width: 100%;}
.title {font-size:2.6em; font-weight:900;  margin-bottom:20px; display:block; line-height:1.2em;}
.exp {opacity:.7; font-size:1.5em; font-weight:100; line-height:1.3em;}
.layout_xs {max-width:1420px; margin:0 auto; height: 100%;}

body {font-family: 'Pretendard', sans-serif; background: #0A0A0A; overflow-x: hidden; width: 100%;}
#fp-nav ul li a span, .fp-slidesNav ul li a span {background: #fff;}
:target {scroll-margin-top: 50px;}

img { height: auto; display: block;}

.section [data-aos] {will-change: transform, opacity;backface-visibility: hidden;}
[data-aos] {opacity: 0; transition-property: transform, opacity;}
[data-aos].aos-animate {opacity: 1;}
.layout_fix, .layout_xs {width: 100%; padding: 0 20px; max-width: 1520px; box-sizing: border-box; }




/* Header */
header {position:fixed; left:0; top:0; width:100%; z-index:9;  height: auto; }
header .layout_fix {position:relative;  display: flex; align-items: center; justify-content: space-between;}
header h1 {display:inline-block; padding: 15px 0; box-sizing: border-box;}
header h1 a {background:url(../img/DT_logo.png) left top no-repeat; width:44px; height: 44px; }
header .menu {display:inline-block; text-align:center;  width: 100%;   flex: 1; }
header .menu ul {margin: 0 0 0 30px}
header .menu ul li {display:inline-block;}

header .menu ul li a {color:#fff;  padding:10px 30px; font-size: 1.1em;}
header .menu ul li a:hover {color:#24AAE0}

header .layout_fix {display: flex; align-items: center; justify-content: space-between; max-width: 1420px; margin: 8px auto;}
header .right_util {display: flex; align-items: center; gap: 10px; padding: 0px 40px 0 0; flex-direction: row; overflow: visible;}

header .Launch_wrap{width: auto; background: #26FEFE; height: 40px; border-radius:20px;  align-items: center; padding: 0 20px; display: flex; cursor: pointer; margin:0rem 0 0 0;}
header .Launch{position: relative;   height: auto;  align-items: center;  border: none; background: transparent; color: #073032; display: inline-block; }
header .Launch_icon {width: 16px; height: 16px; background:url(../img/launch_icon.png) center center no-repeat; background-size: contain; margin-right: 8px;
}
header .family_text{display: inline-block; text-align: center; color: #073032;  font-size: 16px; white-space: nowrap;  }
/*header .lang{display: flex; padding: 0px 10px 0 0;}*/

/* 한영 전환 */
header .lang-wrapper{position: relative; overflow:visible; z-index:10000;}
header .lang-toggle {position: relative; display: inline-block; background:none; z-index:9999;}
header .lang-btn {position: relative; padding: 0rem 2rem 0rem 0.8rem; color: #fff; cursor: pointer;   background-color: transparent !important;}
header .lang-btn::after {content: ""; position: absolute;; width: 1.2rem; aspect-ratio: 12/8; background-image: url("../img/arrow_wt_b.svg"); background-position: center; background-size: contain; background-repeat: no-repeat; top:0.2rem;  right:0;}
header .lang-options {opacity: 0; visibility: hidden; height: 0; pointer-events: none; transition: opacity 0.25s ease, transform 0.25s ease; transform: translateX(-50%) translateY(-10px); position: absolute; top: 100%; left: 50%;
  background: #fff; z-index: 9999; box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}
header .lang-options button {display: block; width: 100%; padding: 1rem 1.5rem; color: var(--col-bk); transition: var(--trans-25); color: #000;  }
header .lang-options button + button {border-top: 1px solid var(--col-bd-gray);}
header .lang-toggle.active .lang-options {opacity: 1; visibility: visible; height: auto;}
header .lang-toggle:hover .lang-options { opacity: 1; visibility: visible; height: auto; pointer-events: auto; transform: translateX(-50%) translateY(0); }


#sideNav {
    position: fixed; top: 0; right: 0; max-width: 400px; height: 100vh; background-color: #0A0A0A; transform: translateX(100%); transition: transform 0.3s ease-in-out; z-index: 9999; display: block;!important;}
#sideNav.open {transform: translateX(0);}





/* 사이드 닫기 버튼 */
#sideNav .x_wrap{height: 60px;}
#sideNav .sideCloseBtn {position: absolute; top: 18px; right: 20px; background: none; color: #fff; font-size: 24px; border: none; cursor: pointer;}



#sideNav .side_mwnu{color: #fff; padding: 30px;}
#sideNav .side_menu_wrap{display: flex; margin: 20px 0 0px;}
#sideNav a .side_icon{}
#sideNav a .side_icon img{max-width:41px; height: 41px;}
#sideNav a .side_box{ padding: 0 0 0 10px;}
#sideNav a .side_box dt{font-size: 16px; font-weight: 700; color: #fff}
#sideNav a .side_box dd{font-size: 12px; font-weight: lighter; color: rgba(255,255,255,0.6);}


/* 모바일메뉴 */
.m_menu {display:none; position: fixed; top: -12px; right: 0; height: 100%; max-width: 0; transition: 0.5s ease; z-index: 1; overflow: hidden; }
.m_menu > div {width:280px; padding: 60px 30px 30px; background-color: #010101; height: 100%;}
.m_menu > div a {text-transform:uppercase; color:#fff;}
.lang button {background: none; border: 1px solid #fff; color: #fff; margin: 0 5px; padding: 2px 8px 4px; border-radius: 5px; display: flex; }
.lang a {font-size: 1.3em; font-weight: 100; margin-right: 15px;}
.lang a:last-child {margin-right:0; position:relative; }
.lang a:last-child:before {content:''; width:1px; height:13px; display:inline-block; background-color:rgba(255,255,255,.5); position:absolute; left:-8px; top:4px;}
.lang-options{}
.m_menu > div ul li a {font-size: 1.2em; padding: 11px 0;}
.burger-icon { display:none!important; position: absolute; top: 50%; right: 15px; transform: translateY(-50%); z-index: 2; padding: 8px 0; user-select: none; width: auto; margin: 0; cursor: pointer;}
.burger-icon .burger-sticks { background: #fff; display: block; height: 3px; position: relative; transition: background .2s ease-out; width: 26px; }
.burger-icon .burger-sticks:before,
.burger-icon .burger-sticks:after { background: #fff; content: ''; display: block; height: 100%; position: absolute; transition: all .2s ease-out; width: 100%; }
.burger-icon .burger-sticks:before { top: 8px; }
.burger-icon .burger-sticks:after { top: -8px; }
.burger-check { display: none !important; }
.burger-check:checked~.m_menu { max-width: 280px; height:100vh;}
.burger-check:checked~.burger-icon .burger-sticks { background: transparent; }
.burger-check:checked~.burger-icon .burger-sticks:before { transform: rotate(-45deg); }
.burger-check:checked~.burger-icon .burger-sticks:after { transform: rotate(45deg); }
.burger-check:checked~.burger-icon:not(.steps) .burger-sticks:before,
.burger-check:checked~.burger-icon:not(.steps) .burger-sticks:after { top: 0; }
.side_mwnu{color: #fff; padding: 20px 0 30px 0; }
.side_menu_wrap{display: flex;}
.side_menu_wrap + .side_menu_wrap {margin-top: 20px;}
.side_icon{}
.side_icon img{max-width:41px; height: 41px;}
.side_box{ padding: 0 0 0 10px;}
.side_box dt{font-size: 16px; font-weight: 700;}
.side_box dd{margin-top: 3px; font-size: 11px; font-weight: lighter; color: rgba(255,255,255,0.6); line-height: 1.5;}





/*============================================================*/
/* 섹션1 = home */
/*============================================================*/
#particles-js {position: absolute; top: 0; bottom: 0; left: 0; right: 0; width: 100%; height: 100vh; z-index: 1; overflow: hidden;}

.visual {position: relative; background:url(../img/home_bg.png) center center no-repeat; overflow: hidden;}
.visual_bg{padding: 0 50px; display: flex; justify-content: center; align-items: center;  max-width: 100%;  overflow-x: hidden; box-sizing: border-box;}
.visual_bg img{display: block;   margin: 0px auto 0 auto;  padding: 0 20px;  max-width: 60%;  margin: -10px 0px 0 -25px; aspect-ratio:1380/923; }
.visual_bg_m{display: none;}
.title{font-size:40px; text-align: center; color: #fff; padding: 100px 0 0 0; margin: 0 0px 0 0px;}
.title_gr {
 background: linear-gradient(90deg, #59B0FE, #26FEFE); font-size: 46px; vertical-align: top; color: transparent; display: inline-block;
	-webkit-background-clip: text;
  -webkit-text-fill-color: transparent; font-weight:bolder;}

.jiju_title{font-size: 32px; font-weight: bold; color: #fff; text-align: center; margin: -50px 0 0 0;}


/*============================================================*/
/* 섹션2 = Business Overview */
/*============================================================*/
.business .box_wrapper{display: flex; flex-wrap: wrap; gap: 20px;  justify-content: center; margin: 0 0 20px 0;}
.business .title{margin: 30px 0;}
.b_box_wrap{display: flex; flex-wrap: wrap; gap: 20px;  justify-content: center; height: auto;}
.dt_box{width: 100%; max-width: 340px; border: 1px solid #4B5879; height: auto; padding: 0 20px 20px; border-radius: 20px; margin: 0 0 0 0; flex: 1 1 300px; height: auto;}
.dt_title{font-size:21px; padding: 20px 0 10px; background: linear-gradient(90deg, #59B0FE, #26FEFE);  vertical-align: top; color: transparent; display: inline-block; font-weight: bold;
	-webkit-background-clip: text;
    -webkit-text-fill-color: transparent;}
.dt_box dd{ color: #fff; line-height: 24px; font-weight: lighter; font-size: 14px; padding-bottom: 20px;}
.graph_wrap{ width: auto; height: auto; margin: 50px auto; max-width: 100%;}
.graph_img{max-width: 80%; margin: 10px auto;  display: block;  height: auto; }

.graph_wrap_m{display: none;}

/* solution */
.solution{background:#0A0A0A url(../img/s_back.png) center bottom no-repeat;}
.solution .layout_fix{ text-align: center; }
.solution .s_box_wrap{display: flex; flex-wrap: wrap; gap: 20px;  justify-content: center; margin: 70px 0 0 0}
.solution .s_box{width: calc(100% - 40px); max-width: 360px; border: 1px solid #333948; background:  linear-gradient(-166deg, rgba(18,18,18,0.1), rgba(33,60,112,0.1)); border-radius: 30px; height: 100%; padding: 50px 20px; box-sizing: border-box; margin: 10px 0;}
.solution .icon{ padding: 20px 0; margin: 0 auto; width: 100%; display: flex; justify-content: center; align-items: center;}
.solution .s_b_title{background: linear-gradient(90deg, #59B0FE, #26FEFE); font-size: 32px; vertical-align: top; color: transparent; display: inline-block; font-weight: bold; line-height: 42px;
	-webkit-background-clip: text;
  -webkit-text-fill-color: transparent;}
.solution .s_txt{color: #fff; padding: 20px 0; font-size: 16px; line-height: 24px;}

/* token */
.token{background:#0A0A0A url(../img/t_back.png) center center no-repeat;}
.token .t_wrapper{display: flex; flex-wrap: wrap; gap: 35px;  justify-content: center; margin: 80px 0 0 0;}



/* partners */
.partners{background:#0A0A0A url(../img/p_back.png) center no-repeat;}
.partners .layout_fix{ text-align: center; }
.partners .p_wrapper{display: flex; flex-wrap: wrap; justify-content: center; margin: 40px 0 0 0; gap: 20px; }
.partners .partner_box{width: 100%; max-width: 340px; height: auto; border: 1px solid #333948; border-radius: 20px; justify-content: center; align-items: center; display: flex; padding: 20px 0; box-sizing: border-box;}

.partners-col {display: flex; gap: 20px; margin-top: 50px;}
.partners-col .title {padding: 0; line-height: 1;}
.partners-col .partner_box {max-width: 190px;}
.partners-col .left,
.partners-col .right {flex: 0 0 auto; width: 25%;}
.partners-col .left .title,
.partners-col .right .title {margin: 0; font-size: 30px;}
.partners-col .left .partner_box,
.partners-col .right .partner_box {max-width: 240px; aspect-ratio: 240/146;}
/*.partners-col .partner_box {max-width: 80px;}*/
.partners-col .partner_box .logo_img {max-width: 80%;}



/* roadmap */

.roadmap{background:#0A0A0A url(/img/s_back.png) center no-repeat; height: auto !important; padding: 50px 0;}
.roadmap .layout_fix{padding: 0 40px;}
.roadmap .title{padding: 40px 0;}
.roadmap.fp-auto-height {
  overflow-y: auto;
  height: auto !important;
}
.roadmap .road_title{color: #fff; width: 100%; border-bottom: 1px solid #fff; font-size: 32px; font-weight: normal; padding: 20px 0 40px; margin: 30px 0 0 0; line-height: 1.125;}
.roadmap .road_wrap{display: flex; flex-wrap: wrap; justify-content: space-between; margin: 50px 0 0 0px; gap: 20px; width: 100%;  padding: 0 20px; box-sizing: border-box; }
.roadmap .road_box{width: 100%; max-width: 50%; box-sizing: border-box; padding: 0 10px;  flex: 1 1 calc(50% - 20px);}
.roadmap .road_w{ }
.roadmap .road_w dt{font-size: 28px; font-weight: 700; color: #fff; padding: 20px 0; position: relative;}
.roadmap .road_w dt::after{content: ""; display: block; width: 16px; height: 16px; border-radius: 50%; background: linear-gradient(90deg, #59B0FE, #26FEFE); position: absolute; top: calc(50% - 8px); left: -30px;}
.roadmap .road_w dd{color: #fff; font-size: 16px; padding: 5px 0; font-weight: lighter; position: relative;}
.roadmap .road_w dd::before{content: ""; display: block; width: 4px; height: 4px; border-radius: 50%; background:#fff; position: absolute; top: calc(50% - 2px); left: -20px;}








/*============================================================*/
/* 푸터 */
/*============================================================*/
footer {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0 30px;
  box-sizing: border-box;
}

footer .layout_xs {
  width: 100%;
  max-width: 1420px;
  box-sizing: border-box;
  padding: 30px 40px 20px;
  margin-bottom: 20px;
  border-radius: 20px;
  border: 1px solid #333948;
  background: linear-gradient(-166deg, rgba(18,18,18,0.1), rgba(33,60,112,0.1));

  display: flex;
  justify-content: space-between;
  align-items: center;
}

.footer_wrap {
  display: flex;
  align-items: center;
  gap: 16px;
}

.footer-left img {
  height: 40px;
}

footer .lower-box {
  color: #9CA3AF;
  font-size: 14px;
  font-weight: lighter;
}

footer .white_paper_down {
  width: 180px;
  height: 46px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-image: linear-gradient(90deg, #59B0FE, #26FEFE);
  border-radius: 999px;
  margin-left: auto;
  flex-shrink: 0;
}

footer .white_paper_down a {
  color: #111;
  text-align: center;
  text-decoration: none;
  font-weight: bold;
  font-size: 14px;
  white-space: nowrap;
  width: 100%;
}






/*============================================================*/
/* 반응형 */
/*============================================================*/
@media all and (max-width:1440px) {
	header .menu {display:none;}
	.m_menu,.burger-icon {display:block !important;}
	header {padding:0px 0; background: rgba(255, 255, 255, 0.3);}
	header h1 {left:0; position: relative;}
	.visual_bg img{display: block;   margin: 20px auto 0 auto;  transform: translateX(0%); padding: 0 20px;}
}
@media all and (max-width:1420px) {
	.layout_fix,.layout_xs {width:100%; padding: 0 20px; }
	header .Launch_wrap {display:none;}
    .visual_bg img{ max-width: 100%;  margin: 0 0px 0 0px;}
}
@media (max-width: 1280px) {
    .partners-col .partner_box {max-width: 130px;}
}
@media (max-width: 1024px) {
	.fullpage {margin-top: 0px; overflow:hidden;}
	.section{ height: auto !important;  overflow: visible;}
    .title{font-size:46px; text-align: center; color: #fff; padding: 80px 0 0 0; margin: 0 0px 0 0px;}
    .visual_bg img{ max-width: 100%;  margin: 0 0px 0 0px;}

    .partners-col {flex-direction: column; align-items: center; gap: 80px; padding-top: 80px;}
    .partners-col .left,
    .partners-col .right {width: 100%;}
    .partners-col .left .title,
    .partners-col .right .title {font-size: 46px;}
    .partners-col .mid {order: 1;}
    .partners-col .left {order: 2;}
    .partners-col .right {order: 3;}
}

@media all and (max-width:767px) {
  .layout_fix,
  .layout_xs {padding: 0 15px; width: 100%;  }
   header .lang {display: flex; }
   header .right_util {flex-direction: column; align-items: flex-end; gap: 4px; margin: -11px -4px 0 0; box-sizing: border-box;}

	/*섹션1 = 비주얼 */
	#particles-js {display: none;}

	.visual {height: auto; padding: 20px 10px 50px;}
	.visual_bg {padding: 0 15px; overflow-x: hidden;}
	.visual_bg img {display: none; padding: 0;}
	.visual_bg_m {display: block; text-align: center;}
	.visual_bg_m img {display: inline-block;}


	/*섹션2 = 비즈니스*/
    .business .box_wrapper{display: flex; flex-wrap: wrap; gap: 20px;  justify-content: center; margin: 0 0 20px 0; overflow: hidden;}
    .graph_wrap {display: none !important;}
    .graph_wrap_m {display: block !important; text-align: center; margin: 50px 0; width: 100%; overflow: hidden;}
    .graph_wrap_m img {width: 100%; height: auto; max-width: 100%;}
    .dt_box {box-sizing: border-box; width: 100%; padding: 0 15px 20px; min-height: auto;}
    .solution .s_box_wrap {padding: 0 10px; overflow: hidden; gap: 0px 0px;}
    .solution .s_box {width: 100%; max-width: 100%; padding: 0px 20px; box-sizing: border-box; margin: 10px 20px;}
    .solution .icon img {max-width: 100%; height: auto;}

    .roadmap .road_box {flex: 1 1 100%; max-width: 100%;}
}

/* roadmap */
@media all and (max-width:670px) {
    .roadmap .road_wrap{display: flex; flex-wrap: wrap; justify-content: space-between; margin: 50px 0 0 0px; gap: 20px; width: 100%; padding: 0 10px;}
    .roadmap .road_box{width: 100%; max-width: 100%; box-sizing: border-box; padding: 0 10px;  flex: 1 1 calc(50% - 0px);}
}

@media all and (max-width: 640px) {
    .partners-col .partner_box {max-width: 147px; aspect-ratio: 160/142;}

    footer {justify-content: center; padding: 0 20px;}
    footer .layout_xs {flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 20px;}
    footer .footer_wrap {flex-direction: column; align-items: center;}
    footer .white_paper_down {margin: 15px auto 0; width: 100%; max-width: 220px; justify-content: center; }
    footer .white_paper_down a {text-align: center;}


}