@charset "utf-8";
/* *******************************************************
 * filename : main.css
 * description : 메인 레이아웃 및 컨텐츠 CSS
 * date : 2022-08-08
******************************************************** */
.main-wrap.active #headerTopCon.header-on,
.main-wrap.active #header.header-on{transform: translateY(-48px);}

.main-wrap #header {position: fixed; opacity: 0; top: calc(-1 * calc(var(--header-height) / 1.5)); /* transition-property:top, opacity, transform; */}
.main-wrap .nav-open-btn {top: calc(-1 * calc(var(--header-height) / 1.5))}
.main-wrap.active #header {opacity: 1; top:var(--header-top); }
.main-wrap.active #header.top-fixed {top: 10px;}
.main-wrap.active .nav-open-btn {top:calc(var(--header-top) + 24px);}

.main-wrap #headerTopCon{transform: translateY(-48px);}
.main-wrap.active #headerTopCon{transform: translateY(0);}
/* .main-wrap.active #header.scroll-down {top: calc(-1 * (var(--header-height) + var(--header-top))) !important;} */

.ms-preloader {width: 100%; height: 100%;position: fixed;z-index: 9999999; top: 0;left: 0; opacity: 1; visibility: visible; background-color: #000;}
.intro-wrap{width: 100%; height: 100%; display: flex; flex-wrap:wrap; flex-direction: column; align-items: center; justify-content: center;}

.main-loading-logo{display: block; height: 2.4rem;}
.main-loading-logo img{height: 100%;}

.main-loading-container {margin-top: 2.5rem;}
.main-loading-container .loading-bar {position: relative; width: 30rem; height: 1px; background: rgba(255,255,255,.3);}
.main-loading-container .loading-bar:before {animation: progress1 1.6s ease-in-out forwards; transform-origin: 0 0; content: ""; display: block; width: 30rem; height: 100%; background-color: var(--main-color);}

@keyframes progress1 {
	0% {
		transform: scalex(0);
		opacity: .5;
	}
	100% {
		transform: scalex(1);
		opacity: 1;
	}
}

@keyframes progress2 {
	0% {
		transform: scale(.3,.8) translatez(0);
		opacity: 0;
	}
	100% {
		transform: scale(1,1) translatex(30rem) translatez(0);
		opacity: 1;
	}
}


/* ******************  메인 레이아웃(Fullpage) ********************** */
@media all and ( min-width: 1281px ) {
	.main-slide-con{height:100vh;}
}
@media all and ( min-width: 1281px ) and (max-height: 750px) {
	#fullpage .section:not(#mainFooter){min-height:750px;}
	#fullpage .section .fp-tableCell{height:100% !important;}
}

/* ******************  메인 비주얼 ********************** */
#mainVisual{overflow:hidden; width:100%; height:100vh; /* height:calc(100vh - var(--header-height)); */ position:relative; background-color:#fff }
.main-slide-con .slick-track,
.main-slide-con .slick-list {
	-webkit-perspective: 2000;
	-webkit-backface-visibility: hidden;
}
.main-slide-con, 
.main-slide-con .slick-list,  
.main-slide-con .slick-track, 
.main-visual-item{
	height:100%;
}
.main-slide-con{position: relative; z-index:1; overflow:hidden; background: #000; /* height:auto !important; */}
/* 메인 비주얼 :: 이미지 */
.main-visual-item{position:relative;}
.main-visual-item .main-visual-img{
	width:100%;
	height:100%;
	background-size:cover !important;
	transform: scale(1.0,1.0);
}
.main-visual-item .main-visual-m-img{display:none;}
.main-visual-item.slick-active .main-visual-img{animation: image-zoom-in 8s 0s forwards;}

/* 메인 비주얼 :: 제품 */
.main-visual-prd-img {position: absolute; left:0; top:0; width:100%; height:100%; overflow: hidden;}
.main-visual-prd-img:after {position: absolute; content: ''; left: 0; top: 0; width: 100%; height: 50%; background: linear-gradient(-180deg, rgba(0,0,0,0.5), transparent); z-index: 2;}
.main-visual-prd-img:before {position: absolute; content: ''; left: 0; bottom: 0; width: 100%; height: 40%;  background: linear-gradient(0deg, #000, transparent); z-index: 2;}
.main-visual-prd-img .main-visual-prd {position: absolute; top: 0; left: 0; width:100%; height:100%; /* transition: transform 0.3s linear; */}
.main-visual-prd-img .main-visual-prd-cover{position: absolute; top: 0; left: 0; width:100%; height:100%; display: block; background: url("../images/main/main_visual_cover.png") center/cover no-repeat;}
.main-visual-prd-img .main-visual-prd .prd{position: absolute; top: 75%; left: 40%; transform: translate(-50%,-50%); opacity: 0.82; animation: tilt 10s ease-in-out infinite alternate;}
.main-visual-prd-img .main-visual-prd2 {position: absolute; top: 0; left: 0; width:100%; height:100%; /* transition: transform 0.3s linear; */}
.main-visual-prd-img .main-visual-prd2 .prd{position: absolute; top: 84%; left: 57%; transform: translate(-50%,-50%); opacity: 0.82; animation: tilt 10s ease-in-out infinite alternate;}
.main-visual-prd-img .main-visual-prd2 .light{position: absolute; top: 75%; left: 62%; margin-left: -1228px; margin-top: -1520px; width: 2695px; height: 2567px; opacity: 0.2; transform: rotate(0deg) scale(1.5);}
.slick-active .main-visual-prd-img .main-visual-prd {animation: prdAni 8s 0s forwards; animation-delay: 1.6s;}
.slick-active .main-visual-prd-img .main-visual-prd2 {animation: prdAni 8s 0s forwards; animation-delay: 1.6s;}
.slick-active .main-visual-prd-img .main-visual-prd2 .light{animation: light_ani01 4s ease-in both; animation-delay: 2s;}

@keyframes light_ani01 {
    0% {
        opacity: 0.2;
        transform: rotate(0deg) scale(1.5);
    }

    20% {
        opacity: 0.8;
    }

    70% {
        opacity: 0.5;
    }

    100% {
        transform: rotate(180deg) scale(0);
        opacity: 0;
    }
}

@keyframes tilt {
  0% {
    transform: translate(-50%,-50%) rotate3d(0, 0, 0, 0) ;
  }
  100% {
    transform: translate(-49%,-50%) rotate3d(0, 1, 1, -4deg) ;
  }
}

@keyframes prdAni {
  0% {
    transform: scale(1.08,1.08);
  }
  100% {
	transform: scale(1.00,1.00);
  }
}

/* 메인 비주얼 :: 텍스트 */
.main-visual-txt-con{
	position:absolute; 
	left:0px; top:0;
	width:100%; 
	height:100%;
	z-index:10;
}
.main-visual-txt-box{
	display:flex;
	align-items:end;
	height:100%;
}
.main-visual-txt-inner{padding-bottom: 16rem; box-sizing:border-box;}
.main-visual-txt-box .main-visual-txt1{font-size:2.2rem; font-weight:400; color:#fff; margin-bottom: 3rem;}
.main-visual-txt-box .main-visual-txt2{font-size:7.4rem; letter-spacing:-0.02em; color:#fff; font-weight: 500;}
.main-visual-txt-box .main-txt-effect > div > .margin-spell:first-child{margin-left: 0;}

/* 메인 비주얼 :: Animation */
@keyframes image-zoom-in {
	from {
		transform: scale(1.0,1.0)
	}
	to {
		transform: scale(1.2,1.2)
	}
}
@keyframes image-zoom-out {
	from {
		transform: scale(1.08,1.08)
	}
	to {
		transform: scale(1.0,1.0)
	}
}
@keyframes text-active-animation {
	from {
		opacity:0;filter:Alpha(opacity=0);
		transform:scale(0.95)
	}
	to {
		opacity:1.0;filter:Alpha(opacity=100);
		transform:scale(1)
	}
}
@keyframes text-fade-out {
	from {
		opacity:1.0;filter:Alpha(opacity=100);
	}
	to {
		opacity:0;filter:Alpha(opacity=0);
	}
}

.main-page .swiper-slide.main-visual-slide{box-sizing:border-box; height:100vh !important;}
.main-visual-con{width:100%; height:100%;}

.main-slide-container,
.main-slide-wrapper{
    width: 100%;
    height: 100%;
    position: relative
}
.main-visual-item,
.main-visual-item-inner{
    width: 100%;
    height: 100%;
    overflow: hidden
}

.main-slide-controls {position: absolute; width: 100%; height: 5rem; z-index: 99; bottom: 7.5rem;}
.main-slide-controls .inner {display: flex; align-items: center;}
.main-slide-controls .inner .pagin-box {width: calc(100% - 10rem); height: 2px; position: relative;}
.main-slide-controls .inner .pagin-box .swiper-pagination {position: absolute; top: 0; left: 0; width: 100%; height:2px; top:auto; bottom: -1px; left: 0; background:rgba(255,255,255,0.05); overflow: hidden;}
.main-slide-controls .inner .pagin-box .swiper-pagination span {position: absolute; top: 0; left: 0; display: block; background: #fff; width: 20%; height: 2px; transition: var(--transition-custom2);}
.main-slide-controls .inner .btn-box {position: relative; width: 5rem; height: 5rem; margin-left: 5rem;}
.main-slide-controls .inner .btn-box button {position: absolute; top: 0; left: 0; display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; border-radius: var(--border-radius); border: 2px solid #fff; box-sizing: border-box;}
.main-slide-controls .inner .btn-box button.swiper-button-disabled{visibility: hidden;}
.main-slide-controls .inner .btn-box button i,
.main-slide-controls .inner .btn-box button img{transform: rotate(180deg); font-size: 2.4rem; color: #fff; transition: var(--transition-custom); transition-property: transform;}
.main-slide-controls.on .inner .btn-box button i,
.main-slide-controls.on .inner .btn-box button img{transform: rotate(0deg);}

/* 메인 비주얼 :: 컨트롤 박스 */
.main-visual-control-box{position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; z-index: 5; visibility: hidden;}
.main-visual-control-box button{display: block; width: 50%; height: 100%; border: 0; outline: none; cursor: auto;}
.main-visual-control-box button.slick-hidden{display: block;}

/* ****************** 
	* Mouse Pointer
********************** */
.mouse-pointer{position:fixed; top:0px; left:0px; z-index:9999999; pointer-events:none; mix-blend-mode: difference;}
.mouse-pointer-txt{position:fixed; top:0px; left:0px; z-index:9999999; pointer-events:none;}	
.is-mobile .mouse-pointer{visibility: hidden; opacity: 0;}
.is-mobile .mouse-pointer-txt{visibility: hidden; opacity: 0;}
/* circle */
.mouse-pointer .pointer-circle{position:absolute; top:50%; left:50%; width:0; height:0; transform:translate(-50%,-50%) scale(0); opacity:0; transition:var(--transition-custom); background:#fff; border-radius:50%;}
.mouse-pointer.active .pointer-circle{transform:translate(-50%,-50%) scale(1); opacity:1;}
.mouse-pointer.hover .pointer-circle{width:12rem; height:12rem;}
/* text */
.mouse-pointer-txt .pointer-txt{position:absolute; left:50%; top:50%; display:flex; align-items:center; justify-content:center; width:100%; height:100%; font-size: 1.8rem; color:#fff; font-weight:500; letter-spacing: -0.01em; transition:var(--transition-custom); opacity:0; transform:translate(-50%,-50%);  mix-blend-mode:difference; visibility: hidden; }
/* circle+text :: prev,next */
.mouse-pointer-txt.next .pointer-txt.txt02,
.mouse-pointer-txt.prev .pointer-txt.txt01{visibility: visible; opacity: 1;}
.mouse-pointer-txt.next .pointer-txt.txt01,
.mouse-pointer-txt.prev .pointer-txt.txt02{visibility: hidden; opacity: 0;}

@media all and ( max-width: 800px ){
	.mouse-pointer  {display: none !important;}
}

/* ******************  메인 컨텐츠 ********************** */
/* -------- 메인 컨텐츠 :: 공통 -------- */
/* 공통 :: 타이틀 */
.main-tit-box{}
.main-tit-box .main-tit{font-size:7.4rem; letter-spacing:-0.02em; color:#fff; font-weight: 500;}
.main-tit-box .main-sub-tit {font-size:2.2rem; font-weight:400; color:#fff; margin-bottom: 3rem;}

.main-txt-effect {position: relative; line-height: 1.26; vertical-align: top; display: flex; flex-wrap: wrap; align-items: center; letter-spacing: -0.015em; }
.main-txt-effect > div{display:inline-block; vertical-align:top; overflow:hidden; padding: 0 0.25em 0 0.1em; font-weight: inherit;}
.main-txt-effect p{position: relative; display: inline-block; vertical-align: top; letter-spacing: -0.25em; font-weight: inherit; transform: translate3d(0,0%,0); opacity: 0; }
.main-txt-effect p.margin-spell {margin-left: 1.7rem;}
.main-sub-tit.main-txt-effect p.margin-spell {margin-left: 0.6rem;}
.main-visual-txt1.main-txt-effect p.margin-spell {margin-left: 0.6rem;}
.main-txt-effect p span{display: block; vertical-align: top; line-height: 1.26; padding-top: 0.4rem; font-weight: inherit;}
.main-txt-effect p span + span{position: absolute;top: -100%;left: 0;}

@media all and ( min-width: 1281px ){
	.active-slide .main-txt-effect {animation: scrollEffectDiv 1.5s ease-in-out forwards;}
	.active-slide .main-txt-effect p{animation: scrollEffectP 1.5s ease-in-out forwards;}
	.active-slide .main-txt-effect p:nth-child(4n-3){animation-delay:0.3s;}
	.active-slide .main-txt-effect p:nth-child(4n-2){animation-delay:0.4s;}
	.active-slide .main-txt-effect p:nth-child(4n-1){animation-delay:0.5s;}
	.active-slide .main-txt-effect p:nth-child(4n){animation-delay:0.6s;}

	.main-visual-slide.active-slide .main-txt-effect p:nth-child(4n-3){animation-delay:1.9s;}
	.main-visual-slide.active-slide .main-txt-effect p:nth-child(4n-2){animation-delay:2s;}
	.main-visual-slide.active-slide .main-txt-effect p:nth-child(4n-1){animation-delay:2.1s;}
	.main-visual-slide.active-slide .main-txt-effect p:nth-child(4n){animation-delay:2.2s;}
}


@keyframes scrollEffectDiv {
	0% {
	
	}
	100% {
		opacity:1;  transform:translate3d(0,0px,0);
	}
}
@keyframes scrollEffectP {
	0% {
		transform: translate3d(0,0%,0); opacity: 0;
	}
	70% {
		transform: translate3d(0,100%,0); opacity:1;
	}
	100% {
		transform: translate3d(0,100%,0); opacity:1;
	}
}	

.main-slide-bg {position: absolute; top: 0; left: 0; width: 100%; height: 100%; transform: scale(1.08,1.08);}
.animated .main-slide-bg {animation: image-zoom-out 8s 0s forwards;}

.main-brand-con-wrap {position: relative; width: 100%; height: 100%; }
.main-brand-con .inner {width: 100%; display: flex; justify-content: space-between; padding-bottom: 16rem; padding-right: 10rem; -webkit-box-sizing: border-box;
-moz-box-sizing: border-box; box-sizing: border-box;}
.main-brand-con .inner .main-tit-box {width: 50%;}
.main-brand-con .inner .main-brand-txt-con {position: relative; width: 50%;display: flex; align-items: end; justify-content: end;}
.main-brand-txt-con dl {padding-left: 5.5rem; text-align: right;}
.main-brand-txt-con dl + dl {margin-top: 4rem;}
.main-brand-txt-con dl dt {font-size: 10rem; font-weight: 500; letter-spacing: -2px; color: #fff;}
.main-brand-txt-con dl dd {font-size: 2rem; font-weight: 500; letter-spacing: -0.4px; color: #fff; line-height: 1.7; padding-top: 3rem;}
/* -------- 메인 컨텐츠 :: 컨텐츠1(Dentium Product) -------- */
.main-prd-con-wrap {width: 100%; height: 100%; -webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
.main-prd-con {width: 100%; height: 100%; display: flex; align-items: center;}
.main-prd-left {width: 42.2%;}
.main-prd-right {position: relative; width: 57.7%; } 
.main-prd-list {display: flex; margin: 0 -0.85rem;}
.main-prd-list li {opacity: 0; transform: translateX(50px); width: calc(33.33% - 1.7rem); margin: 0 0.85rem; transition: var(--transition-custom2);}
.main-prd-list li:first-child {transition-delay: 0.2s;}
.main-prd-list li:nth-child(2) {transition-delay: 0.4s;}
.main-prd-list li:nth-child(3) {transition-delay: 0.6s;}
.main-prd-list li a {position: relative; display: block; width: 100%; padding: 1rem 1rem 4rem; border-radius:2rem; background: rgba(255,255,255,0.07); backdrop-filter: blur(10px); -webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box; text-align: center;}
.main-prd-list li a .bg-box {position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; border-radius:2rem; overflow: hidden;}
.main-prd-list li a .bg-box .cm-fill {position: absolute;display: block;width: 0px; height: 0px; transform: translate(-50%, -50%);border-radius: 50%;  opacity: 0.5; background: var(--main-color); transition: width 0.7s, height 0.7s;}
.main-prd-list li a .img {position: relative; z-index: 1; width: 100%; height: 0; padding-top: 100%;}
.main-prd-list li a .img img {position: absolute; width: 100%; height: 100%; top: 0; left: 0;}
.main-prd-list li a .tit {position: relative; z-index: 1; display: block; font-size: 3rem; font-weight: 700; letter-spacing: -0.6px; color: #fff; line-height: 1.33em; margin-top: 3rem; transition: all 0.4s;}

@media all and ( min-width: 1281px ){
	.active-slide .main-prd-list li {opacity: 1; transform: translateX(0); }
}
@media all and ( min-width: 801px ){
	.main-prd-list li a:hover .cm-fill {width: 100rem; height: 100rem;}
}


/* -------- 메인 컨텐츠 :: 컨텐츠2(Overseas Forum) -------- */
.main-banner-wrap {position: relative; width: 100%; height: 100%; max-width: 1520px; margin: 0 auto; display: flex; align-items: center;}
.main-banner-con {width: 100%; height: 53.2rem; display: flex; flex-wrap: wrap; margin: 0 -1.5rem; padding-right: 7rem;box-sizing: border-box;}
.main-banner-con .main-banner-box {height: 100%;}
.main-banner-con .main-banner-box:not(.box03) {width: calc(((100% - 41.6rem)/2) - 3rem); margin: 0 1.5rem;}
.main-banner-con .main-banner-box.box03 {width: 38.6rem; margin: 0 1.5rem;}
.main-banner-con .main-banner-box .inner-box {position: relative; display: block; width: 100%; height: 100%; border-radius:2rem ; overflow: hidden;}
.main-banner-con .main-banner-box.box03 .inner-box {padding:2.8rem 3rem 2rem; background: rgba(255,255,255,0.1); backdrop-filter: blur(30px); box-sizing: border-box;}
.main-banner-con .main-banner-box .bg {position: absolute; width: 100%; height: 100%; top: 0; left: 0; transition:var(--transition-custom)}
.main-banner-con .main-banner-box a:hover .bg {transform: scale(1.08); }
.main-banner-con .main-banner-box.box01 {opacity: 0; transform: translateX(50px); transition: var(--transition-custom2); }
.main-banner-con .main-banner-box.box02 {opacity: 0; transform: translateX(50px); transition: var(--transition-custom2); transition-delay: 0.3s;}
.main-banner-con .main-banner-box.box03 {opacity: 0; transform: translateX(50px); transition: var(--transition-custom2); transition-delay: 0.6s;}
.main-banner-con .main-banner-box.box01 .bg {background: url(/images/main/main_forum_bg.jpg)no-repeat center/cover;} 
.main-banner-con .main-banner-box.box02 .bg {background: url(/images/main/main_seminar_bg.jpg)no-repeat center/cover;} 

.main-banner-con .main-banner-box .inner {position: relative; width: 100%; height: 100%; z-index: 1; display: flex; flex-direction: column; justify-content: space-between; padding: 5.5rem 5rem 5rem; -webkit-box-sizing: border-box;-moz-box-sizing: border-box; box-sizing: border-box;}
.main-banner-con .main-banner-box .inner .box-tit {font-size: 1.6rem; font-weight: 500; letter-spacing: -0.32px; color: #fff; line-height: 1.1em; padding: 2rem 0;}
.main-banner-con .main-banner-box .inner dl dt {font-size: 2.6rem; font-weight: 700; letter-spacing: -0.6px; color: #fff; line-height: 1.33em;}
.main-banner-con .main-banner-box .inner dl dd {font-size: 1.6rem; font-weight: 400; letter-spacing: -0.36px; color: rgba(255,255,255,0.84); line-height: 1.55em; padding-top: 1rem;}

.main-schedule-top {display: flex; justify-content: space-between; height: 5.5rem;}
.main-schedule-top .current-month strong {font-size: 3rem; font-weight: 500; line-height: 1.1; color: #fff;}
.main-schedule-top .more-btn {width: 2.4rem; height: 2.4rem; border: 2px solid #fff; border-radius: 0.4rem; box-sizing: border-box; display: flex; align-items: center; justify-content: center; margin-top: 0.5rem;}
.main-schedule-top .more-btn i {font-size: 2.4rem; color: #fff;}
.main-schedule-list {height: calc(100% - 5.5rem); width: 100%; border-radius: 1.5rem; backdrop-filter: blur(10px); padding: 4rem 1.5rem 0 3rem; -webkit-box-sizing: border-box;-moz-box-sizing: border-box; box-sizing: border-box; /* overflow-x: hidden; overflow-y: auto; */}
.main-schedule-list .inner-list {height: 100%; padding-right: 3rem; overflow-x: hidden; overflow-y: auto;}
.main-schedule-list .inner-list::-webkit-scrollbar {width: 5px; height: 34.7rem !important;}
.main-schedule-list .inner-list::-webkit-scrollbar-track {background-color: rgba(255,255,255,0.2);border-radius: 20px}
.main-schedule-list .inner-list::-webkit-scrollbar-thumb {background-color: #fff;border-radius: 20px}
.main-schedule-list .inner-list li {border-bottom: 1px solid rgba(255,255,255,0.1); transition: all 0.4s;}
.main-schedule-list .inner-list li.hide {opacity: 0.2;}
.main-schedule-list .inner-list li:last-child {border-bottom: 0;}
.main-schedule-list .inner-list li:first-child a {padding-top: 0;}
.main-schedule-list .inner-list li a {display: block; width: 100%; padding: 2rem 1rem;  box-sizing: border-box;}
.main-schedule-list .inner-list li a .state-box {display: flex; align-items: center; margin-bottom: 1rem;}
.main-schedule-list .inner-list li a .state-box span {display: inline-block; text-align: center; width: 6rem; height: 3rem; line-height: 3rem; border-radius: 2rem; font-size: 1.4rem; font-weight: 600; letter-spacing: -0.01em; color: #fff;}
.main-schedule-list .inner-list li a .state-box span.domestic {background: var(--main-color);}
.main-schedule-list .inner-list li a .state-box span.overseas {    background: #0857C3;}
.main-schedule-list .inner-list li a .state-box .date {padding-left: 1rem; font-size: 1.4rem; font-weight: 600; letter-spacing: -0.01em; color: rgba(255,255,255,0.5);}
.main-schedule-list .inner-list li a .tit-box .tit {font-size: 1.8rem; font-weight: 600; letter-spacing: -0.023em; color: #fff; line-height: 1.1; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}

.active-slide .main-banner-con .main-banner-box.box01,
.active-slide .main-banner-con .main-banner-box.box02,
.active-slide .main-banner-con .main-banner-box.box03 {opacity: 1; transform: translateX(0); }

/* .main-banner-con .main-banner-box {position: relative; width: calc(33.33% - 3.5rem); height: 100%; margin: 0 1.75rem;}
.main-banner-con .main-banner-box a {position: relative; display: block; width: 100%; height: 100%; border-radius:2rem ; overflow: hidden;}
.main-banner-con .main-banner-box .bg {position: absolute; width: 100%; height: 100%; top: 0; left: 0;}
.main-banner-con .main-banner-box.box01 {opacity: 0; transform: translateX(50px); transition: var(--transition-custom2); }
.main-banner-con .main-banner-box.box02 {opacity: 0; transform: translateX(50px); transition: var(--transition-custom2); transition-delay: 0.3s;}
.main-banner-con .main-banner-box.box01 .bg {background: url(/images/main/main_forum_bg.jpg)no-repeat center/cover;} 
.main-banner-con .main-banner-box.box02 .bg {background: url(/images/main/main_seminar_bg.jpg)no-repeat center/cover;} 
.main-banner-con .main-banner-box.box03 {display: flex;  flex-direction: column; justify-content: space-between;}
.main-banner-con .main-banner-box .box04 {opacity: 0; transform: translateX(50px); transition: var(--transition-custom2); height: 60.83%; transition-delay: 0.6s;}
.main-banner-con .main-banner-box .box05 {opacity: 0; transform: translateX(50px); transition: var(--transition-custom2); height: 33.33%; transition-delay: 0.9s;}
.main-banner-con .main-banner-box .box04 .bg {background: url(/images/main/main_guide_bg.jpg)no-repeat center/cover;} 
.main-banner-con .main-banner-box .box04 .bg:before {position: absolute; content: ''; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.09);}
.main-banner-con .main-banner-box .box05 .bg {background: url(/images/main/main_download_bg.jpg)no-repeat center/cover;} 
.main-banner-con .main-banner-box .inner {position: relative; width: 100%; height: 100%; z-index: 1; display: flex; flex-direction: column; justify-content: space-between; padding: 5.5rem 5rem 5rem; -webkit-box-sizing: border-box;-moz-box-sizing: border-box; box-sizing: border-box;}
.main-banner-con .main-banner-box .inner .box-tit {font-size: 1.6rem; font-weight: 500; letter-spacing: -0.32px; color: #fff; line-height: 1.1em; padding: 2rem 0;}
.main-banner-con .main-banner-box .box04 .inner .box-tit {padding-bottom: 0;}
.main-banner-con .main-banner-box .inner dl dt {font-size: 2.6rem; font-weight: 700; letter-spacing: -0.6px; color: #fff; line-height: 1.33em;}
.main-banner-con .main-banner-box .inner dl dd {font-size: 1.6rem; font-weight: 400; letter-spacing: -0.36px; color: rgba(255,255,255,0.84); line-height: 1.55em; padding-top: 1rem;}
.main-banner-con .main-banner-box .box05 .inner {justify-content: center; text-align: center;}
.active-slide .main-banner-con .main-banner-box.box01,
.active-slide .main-banner-con .main-banner-box.box02,
.active-slide .main-banner-con .main-banner-box .box04,
.active-slide .main-banner-con .main-banner-box .box05 {opacity: 1; transform: translateX(0); } */

/* -------- 메인 컨텐츠 :: 컨텐츠3(Dentium Newsroom) -------- */
.main-news-wrap {position: relative; width: 100%; height: 100%; display: flex; align-items: center; max-width: 1520px; margin: 0 auto;}
.main-news-con {width: 100%;}
.main-news-con .main-tit-box .main-sub-tit {margin-bottom: 1rem;}
.main-news-con-top {display: flex; align-items: end; justify-content: space-between; margin-bottom: 2rem;}
.main-news-con-top .main-view-btn {position: relative; display: block; width: 20rem; height: 5rem; line-height: 4.6rem; border-radius: 5rem; border: 0.2rem solid #fff; text-align: center; font-size: 1.6rem; font-weight: 500; letter-spacing: 0.8px; color: #fff; -webkit-box-sizing: border-box;-moz-box-sizing: border-box; box-sizing: border-box; margin-bottom: 2rem; transition: all 0.4s;}
.main-news-con-top .main-view-btn em {position: relative; z-index: 1; font-weight: 500;}
.main-news-con-top .main-view-btn .btn-bg-box {position: absolute; top: -2px; left: -2px; right: -2px; bottom: -2px; border-radius: 5rem; overflow: hidden;}
.main-news-con-top .main-view-btn .btn-bg-box .cm-fill { position: absolute;display: block;  width: 0px;   height: 0px;  transform: translate(-50%, -50%);  border-radius: 50%; opacity: 0.95; background: #fff;  transition: width 0.7s, height 0.7s;}
/* .main-news-list .slick-list {margin: 0 -1.35rem;}
.main-news-list .slick-slide {margin: 0 1.35rem;} */
.main-news-list li a {display: flex; flex-wrap: wrap; align-items: center; width: 100%; padding: 4rem; background: rgba(255,255,255,0.07); backdrop-filter: blur(10px); -webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box; border-radius: 2rem;}
.main-news-list li a .bg-box {position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; border-radius:2rem; overflow: hidden;}
.main-news-list li a .bg-box .cm-fill {position: absolute;display: block;width: 0px; height: 0px; transform: translate(-50%, -50%);border-radius: 50%;  opacity: 0.5; background: var(--main-color); transition: width 0.7s, height 0.7s;}
.main-news-list li a .txt-box {position: relative; z-index: 1; width: 46.1%; padding-right: 7rem; -webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
.main-news-list li a .txt-box .cate {display: block; font-size: 1.6rem; font-weight: 700; letter-spacing: -0.32p; line-height: 1.2em; color: var(--main-color); margin-bottom: 1rem;}
.main-news-list li a .txt-box .txt {font-size: 2.6rem; font-weight: 600; letter-spacing: -0.56px; color: #fff; line-height: 1.5em; height: 4.6em; overflow:hidden;display:block;display: -webkit-box;-webkit-line-clamp: 3; -webkit-box-orient: vertical; }
.main-news-list li a .txt-box .date {display: block; font-size: 1.6rem; font-weight: 500; letter-spacing: -0.032px; line-height: 1.4em; color: #fff; margin-top: 4rem;}
.main-news-list li a .img-box {width: 53.9%;; position: relative;}
.main-news-list li a .img-box .img {position: relative; display: block; width: 100%; height: 0; padding-top: 74.9%; border-radius: 1.8rem; overflow: hidden;}
.main-news-list li a .img-box .img img {position: absolute; top: 0; left: 0; max-width: 100%; transition: all 0.4s;}
@media all and ( min-width: 801px ){
	.main-news-list li a:hover .img-box .img img  {transform: scale(1.08) rotate(0.002deg);}
	.main-news-con-top .main-view-btn:hover {color: var(--main-color);}
	.main-news-con-top .main-view-btn:hover .btn-bg-box .cm-fill {width: 40rem; height: 40rem;}
	.main-news-list li a:hover .cm-fill {width: 200rem; height: 200rem;}
}

/* 마우스포인터 */
.news-mouse-pointer{position:fixed; top:0px; left:0px; z-index:10000; pointer-events:none; }
.news-mouse-pointer .news-pointer-circle {opacity: 0; position: absolute;top: 50%; left: 50%;  width: 13.4rem;height: 13.4rem; background-color: var(--main-color);border-radius: 50%;transform: translate(-50%, -50%) scale(0); box-sizing: border-box;  transition: var(--transition-custom); transition-property: transform, opacity;}
.news-mouse-pointer .news-pointer-inner {opacity: 0; position: absolute; left: 50%; top: 50%; width: 13.4rem;height: 13.4rem; transform: translate(-50%, -50%) scale(0);  transition: var(--transition-custom); display: flex; align-items: center; justify-content: center;}
.news-mouse-pointer .news-pointer-inner img {max-width: 100%;}

.news-mouse-pointer.drag .news-pointer-circle{opacity: 1; transform:translate(-50%,-50%) scale(1);}
.news-mouse-pointer.drag .news-pointer-inner{opacity: 1; transform:translate(-50%,-50%) scale(1);}

.is-mobile .news-mouse-pointer,
.is-mobile .news-pointer-circle,
.is-mobile .news-pointer-inner{visibility: hidden; opacity: 0;}

@media all and (max-width:800px){
	.news-mouse-pointer,
	.news-pointer-circle,
	.news-pointer-inner {visibility: hidden; opacity: 0;}
}

/* -------- 메인 컨텐츠 :: 컨텐츠4(Global Networks) -------- */
.main-global-slide {background: #000;}
.main-global-con{-webkit-box-sizing: border-box;-moz-box-sizing: border-box; box-sizing: border-box;}

.main-global-bg-con{position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; background: url("../images/main/main_global_bg.png") center/auto no-repeat;}
.main-global-bg-con .container{position: relative; width: 738px; height: 738px; margin-top: 5px; margin-right: 5px;}
.main-global-bg-con .container:before{position: absolute; top: 50%; left: 50%; width: 550px; height: 550px; border-radius: 100%; box-shadow: 0 0 40px rgba(1,57,116,0.4); transform: translate(-50%,-50%); content: '';}
.main-global-bg-con .canvas {width: 100%; height: 100%; position: absolute; top: 0px; left: 0px; width: 738px; height: 738px;}

.main-global-bg-con .region-label{padding: 15px 20px; font-size: 1rem; font-weight: 700; color: #1428a0; border-radius: 25px; box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.16); background-color: #fff; visibility: visible; opacity: 1; transition: all 0.2s ease-in-out; transition-property: visibility, opacity; pointer-events: all;}
@media screen and (max-width: 768px) {
	.main-global-bg-con .region-label{padding: 10px 15px;}
}

 .main-global-bg-con .region-label:hover{cursor: pointer;}
 .main-global-bg-con .region-label.invisible{visibility: hidden;opacity: 0;}
 .main-global-bg-con .city-label{width: 8px; height: 8px; border-radius: 50%; background-color: #1428a0; z-index: 0 !important; visibility: visible; opacity: 1; transition: all 0.2s ease-in-out; transition-property: visibility, opacity;}
 .main-global-bg-con .city-label.invisible{visibility: hidden;opacity: 0;}
 .main-global-bg-con .city-label:after{content: attr(data-name); position: absolute; font-size: 0px; font-weight: 700; text-transform: uppercase; bottom: -15px; left: 50%; transform: translateX(-50%);}

.main-global-bg-con#globeViz{background: none; position: relative;}
.svgMarker{position: relative;}
.svgMarker.svg1,
.svgMarker.svg2,
.svgMarker.svg3,
.svgMarker.svg4,
.svgMarker.svg5{cursor: auto; pointer-events: none;}
.svgMarker.svg1 .marker-svg-txt,
.svgMarker.svg2 .marker-svg-txt,
.svgMarker.svg3 .marker-svg-txt,
.svgMarker.svg4 .marker-svg-txt,
.svgMarker.svg5 .marker-svg-txt{display: block; white-space: nowrap; width: 140px; margin-left: -70px; font-size: 18px; line-height: 1; /* pointer-events: none; */}
.continent-hover-area{z-index: 100; pointer-events: auto; user-select: none;/* z-index: 99 !important; */ }
.continent-hover-area.hover{z-index: 0 !important; pointer-events: none !important;}

.continent-hover-marker {position: absolute; top: 0; left: 0; padding: 1.1rem 2rem; width: auto; height: auto; border-radius: 3rem; background: rgba(255,255,255,0); display: flex; align-items: center; justify-content: center; pointer-events: auto; cursor: pointer; border: 1px solid rgba(255,255,255, 1); opacity: 1; transition: border 0.3s ease, opacity 0.3s ease;}
.continent-hover-marker .marker-label {font-family: 'Oswald', sans-serif; font-size: 1.5rem; line-height: 1; color: #fff; pointer-events: none; text-align: center; white-space: nowrap;}

.continent-balloon {border: 2px solid #fff; border-radius: 1rem; padding: 1rem 2rem; text-align: center; /* pointer-events: none; */ white-space: nowrap; position: relative;}
.continent-balloon:before{position: absolute; bottom: -20px; left: 50%; width: 1px; height: 20px; background-color: #fff; content: '';}
.balloon-content {color: #fff; font-size: 1.4rem;}
.continent-name {font-size: 1.6rem; font-weight: 700; margin-bottom: 0.5rem;}
.continents01.continent-balloon:before{}
.continents02.continent-balloon:before{transform: rotate(-15deg);}
.continents03.continent-balloon:before{bottom: auto; top: -20px;}
.continents04.continent-balloon:before{}
.continents05.continent-balloon:before{bottom: auto; top: -20px; transform: rotate(-15deg);}
.continents06.continent-balloon:before{bottom: auto; top: -20px;}
.continents07.continent-balloon:before{}

@media all and ( min-width: 801px ){
	.main-global-txt-con{position: relative;}
}
.main-global-txt-con.main-brand-con {width: auto; height: auto;}
.main-global-txt-con.main-brand-con .inner {width: auto; padding-bottom: 0; padding-right: 0;/* padding-bottom: 16rem; padding-right: 10rem; */}
.main-global-txt-con.main-brand-con .inner .main-tit-box {position: absolute; left: 0; bottom: 16rem; width: auto; /* width: 50%; */}
.main-global-txt-con.main-brand-con .inner .main-brand-txt-con {position: absolute; right: 0; bottom: 16rem;width: auto;  /*  width: 50%;  */display: flex; flex-direction: column; align-items: end; justify-content: end;}

/* -------- 메인 컨텐츠 :: 푸터 -------- */
.main-footer-box {position: fixed; left: 0; bottom: 0; width: 100%; z-index: 99; transform: translateY(100%); transition: transform 0.6s;}
.main-footer-box.on {transform: translateY(0);}