@charset "utf-8";
:root{
	--smooth-transform-transition : transform 0.8s cubic-bezier(0.165, 0.840, 0.440, 1.000);
	--smooth-clip-path-transition : clip-path 0.8s cubic-bezier(0.165, 0.840, 0.440, 1.000);
}
/*  메인 */
#wrap.main {position:relative; width:100%; height:100vh; min-height:100vh; overflow:hidden;}
#wrap.main.actived {height:auto; overflow:visible;}
#wrap.main.actived #dHead {top:0;}
#wrap.main.actived .main-visual .scroll-down {transform:translate(0% , 0%);}
#wrap.main #dHead {top:-120px; transition:top 0.4s cubic-bezier(0.165, 0.840, 0.440, 1.000);}
#dHead.scroll ~ .main .main-visual .scroll-down {transform:translate(0% , 110%) !important;}
#dHead.scroll ~ .main .main-visual .skip {transform:translate(0% , 0%);}

#dBody.main {position:relative; padding:0; z-index:150; max-width:100%; overflow:visible;}
#dBody.main #contents {position:relative; max-width:100%; margin:0 auto; padding:0 0 0 0; box-sizing:border-box; z-index:0; background:#e5eaf2;}

.main-group {position:relative; z-index:10;}
.main-group .inner {position:relative; max-width:1128px; margin:0 auto;}
.main-group .data-group {position:relative; z-index:5;}
.main-group .visual-group {position:absolute; top:0; left:0; width:100%; height:100%; overflow:hidden; z-index:0;}
.main-group .swiper-pagination-progressbar {width:100%; height:6px; margin-top:0; background:#fff; border-radius:3px;}
.main-group .swiper-pagination-progressbar .swiper-scrollbar-drag {background:#1e36be;}

.main-title {position:relative; font-size:52px; line-height:1.5; color:#333; font-weight:900; text-align:center; z-index:5;}

/* 메인 > 헤드라인 */
@keyframes circleRightMove { 0%{ transform:translate(0% , 0%) scale(1); opacity:1; } 100%{ transform:translate(200% , 0%) scale(1); opacity:0; }}
@keyframes circleLeftMove { 0%{ transform:translate(0% , 0%) scale(1); opacity:1; } 100%{ transform:translate(-200% , 0%) scale(1); opacity:0; }}
@keyframes circleTopMove { 0%{ transform:translate(0% , 0%) scale(1); opacity:1; } 100%{ transform:translate(0% , 200%) scale(1); opacity:0; }}
@keyframes rotate1 { 0%{ transform:rotate(0deg); } 100%{ transform:rotate(360deg); }}
@keyframes rotate2 { 0%{ transform:rotate(0deg); } 100%{ transform:rotate(-360deg); }}

.main-visual.actived .scene-1 .word-inner .word{transition:transform 0.5s 0s cubic-bezier(0.165, 0.840, 0.440, 1.000), opacity 0.5s 0s cubic-bezier(0.165, 0.840, 0.440, 1.000);}
.main-visual.actived .scene-1 .word-inner .word:nth-child(1) {transform:translate(0px , 0px); opacity:1; transition-delay:0.00s;}
.main-visual.actived .scene-1 .word-inner .word:nth-child(2) {transform:translate(0px , 0px); opacity:1; transition-delay:0.05s;}
.main-visual.actived .scene-1 .word-inner .word:nth-child(3) {transform:translate(0px , 0px); opacity:1; transition-delay:0.10s;}
.main-visual.actived .scene-1 .word-inner .word:nth-child(4) {transform:translate(0px , 0px); opacity:1; transition-delay:0.15s;}
.main-visual.actived .scene-1 .word-inner .word:nth-child(5) {transform:translate(0px , 0px); opacity:1; transition-delay:0.20s;}
.main-visual.actived .scene-1 .word-inner .word:nth-child(6) {transform:translate(0px , 0px); opacity:1; transition-delay:0.25s;}
.main-visual.actived .scene-1 .word-inner .word:nth-child(7) {transform:translate(0px , 0px); opacity:1; transition-delay:0.30s;}
.main-visual.actived .scene-1 .word-inner .word:nth-child(8) {transform:translate(0px , 0px); opacity:1; transition-delay:0.35s;}
.main-visual.actived .scene-1 .word-inner .word:nth-child(9) {transform:translate(0px , 0px); opacity:1; transition-delay:0.40s;}
.main-visual.actived .scene-1 .word-inner .word:nth-child(10) {transform:translate(0px , 0px); opacity:1; transition-delay:0.45s;}
.main-visual.actived .scene-1 .word-inner .word:nth-child(11) {transform:translate(0px , 0px); opacity:1; transition-delay:0.50s;}
.main-visual.actived .scene-1 .word-inner .word:nth-child(12) {transform:translate(0px , 0px); opacity:1; transition-delay:0.55s;}
.main-visual.actived .scene-1 .word-inner .word:nth-child(13) {transform:translate(0px , 0px); opacity:1; transition-delay:0.60s;}
.main-visual.actived .scene-1 .word-inner .word:nth-child(14) {transform:translate(0px , 0px); opacity:1; transition-delay:0.65s;}
.main-visual.actived .scene-1 .word-inner .word:nth-child(15) {transform:translate(0px , 0px); opacity:1; transition-delay:0.70s;}
.main-visual.actived .scene-1 .word-inner .word:nth-child(16) {transform:translate(0px , 0px); opacity:1; transition-delay:0.75s;}
.main-visual.actived .scene-1 .word-inner .word:nth-child(17) {transform:translate(0px , 0px); opacity:1; transition-delay:0.80s;}
.main-visual.actived .scene-1 .word-inner .word:nth-child(18) {transform:translate(0px , 0px); opacity:1; transition-delay:0.85s;}
.main-visual.actived .scene-1 .word-inner .word:nth-child(19) {transform:translate(0px , 0px); opacity:1; transition-delay:0.90s;}
.main-visual.actived .scene-1 .word-inner .word:nth-child(20) {transform:translate(0px , 0px); opacity:1; transition-delay:0.95s;}
.main-visual.actived .scene-1 .word-inner .word:nth-child(21) {transform:translate(0px , 0px); opacity:1; transition-delay:1.00s;}
.main-visual.actived .scene-1 .word-inner .word:nth-child(22) {transform:translate(0px , 0px); opacity:1; transition-delay:1.05s;}
.main-visual.actived .scene-1 .word-inner .word:nth-child(23) {transform:translate(0px , 0px); opacity:1; transition-delay:1.10s;}
.main-visual.actived .scene-1 .word-inner .word:nth-child(24) {transform:translate(0px , 0px); opacity:1; transition-delay:1.15s;}
.main-visual.actived .scene-1 .word-inner .word:nth-child(25) {transform:translate(0px , 0px); opacity:1; transition-delay:1.20s;}
.main-visual.actived .scene-1 .word-inner .word:nth-child(26) {transform:translate(0px , 0px); opacity:1; transition-delay:1.25s;}
.main-visual.actived .scene-1 .word-inner .word:nth-child(27) {transform:translate(0px , 0px); opacity:1; transition-delay:1.30s;}
.main-visual.actived .scene-1 .word-inner .word:nth-child(28) {transform:translate(0px , 0px); opacity:1; transition-delay:1.35s;}
.main-visual.actived .scene-1 .word-inner .word:nth-child(29) {transform:translate(0px , 0px); opacity:1; transition-delay:1.40s;}
.main-visual.actived .scene-1 .word-inner .word:nth-child(30) {transform:translate(0px , 0px); opacity:1; transition-delay:1.45s;}
.main-visual.actived .scene-1 .word-inner .word:nth-child(31) {transform:translate(0px , 0px); opacity:1; transition-delay:1.50s;}
.main-visual.actived .scene-1 .circle-1,
.main-visual.actived .scene-1 .circle-2 {opacity:1; transition-delay:1.00s;}

.main-visual {height:875vh;}
.main-visual .scroll-down {position:absolute; bottom:0; left:0; width:100%; padding-bottom:56px; text-align:center; transform:translate(0% , 110%); font-size:24px; font-weight:600; color:rgba(255,255,255,0.3); transition:transform 0.4s cubic-bezier(0.165, 0.840, 0.440, 1.000); z-index:800;}
.main-visual .scroll-down:after {content:''; display:block; width:40px; height:40px; margin:0 auto; background:url(../images/contents/main/icon-main-visual-scroll-arrow.png) center center no-repeat;}
.main-visual .skip {position:absolute; bottom:0; left:0; width:100%; padding-bottom:56px; text-align:center; transform:translate(0% , 110%); transition:transform 0.4s cubic-bezier(0.165, 0.840, 0.440, 1.000); z-index:800;}
.main-visual .skip .btn-main-skip {display:inline-flex; align-items:center; justify-content:center; text-align:center; font-size:16px; font-weight:500; color:#fff; padding-left:13px; width:95px; height:48px; box-sizing:border-box; border-radius:48px; border:1px solid rgba(201,201,201,0.3);}
.main-visual .skip .btn-main-skip:after {content:''; display:block; width:24px; height:24px;background:url(../images/contents/main/icon-main-visual-skip-arrow.png) center center no-repeat;}
.main-visual .sticky-scene {position:sticky; top:0;left:0;width:100%;height:100vh; background:#1b233b; overflow:hidden; z-index:150;}
.main-visual .scene-data {position:absolute; top:0; left:0; width:100%; height:100%; z-index:0; opacity:0; transition:opacity 0.1s ease; -webkit-backface-visibility: hidden; transform:translate(0px , 0px , 0px);}
.main-visual .visual-group {position:absolute; top:0; left:0; width:100%; height:100%; z-index:0;}
.main-visual .data-group {position:absolute; top:0; left:0; width:100%; height:100%; display:flex; align-items:center; justify-content:center; z-index:5;}
.main-visual .scene-data.actived {z-index:5; opacity:1;}

.main-visual .scene-1 { opacity:1;}
.main-visual .scene-1 .word-outer {position:relative; display:flex; width:100%; justify-content:center; z-index:5; transition:var(--smooth-transform-transition);}
.main-visual .scene-1 .word-paragraph {width:100%; display:flex; align-items:center; justify-content:center;}
.main-visual .scene-1 .word-inner {}
.main-visual .scene-1 .word-inner .word {transform:translate(50px , 0px); opacity:0; font-size:128px;color:#fff;font-weight:900;letter-spacing:-3.84px;}
.main-visual .scene-1 .circle-1,
.main-visual .scene-1 .circle-2 {opacity:0; transition:opacity 0.5s ease;}
.main-visual .scene-1 .circle-1 {position:absolute; top:-270px;left:-190px; width:820px;height:840px;z-index:0;}
.main-visual .scene-1 .circle-outer {position:absolute;top:0;left:0;width:100%;height:100%; transition:var(--smooth-transform-transition);}
.main-visual .scene-1 .circle-inner {position:absolute;top:0;left:0;width:100%;height:100%;}
.main-visual .scene-1 .circle-items {position:absolute;top:0;left:0;width:100%;height:100%;background-repeat:no-repeat;background-position:center center;}
.main-visual .scene-1 .circle-1-1 {background-image:url(../images/contents/main/circluer-1-1.png); animation-name:rotate1;animation-duration:4s;animation-delay:0s;animation-timing-function:linear;  animation-iteration-count: infinite; animation-direction: normal; animation-fill-mode: forwards}
.main-visual .scene-1 .circle-1-2 {background-image:url(../images/contents/main/circluer-1-2.png); animation-name:rotate2;animation-duration:20s;animation-delay:0s;animation-timing-function:linear;  animation-iteration-count: infinite; animation-direction: normal; animation-fill-mode: forwards}
.main-visual .scene-1 .circle-1-3 {background-image:url(../images/contents/main/circluer-1-3.png); animation-name:rotate1;animation-duration:15s;animation-delay:0s;animation-timing-function:linear;  animation-iteration-count: infinite; animation-direction: normal; animation-fill-mode: forwards}
.main-visual .scene-1 .circle-1-4 {background-image:url(../images/contents/main/circluer-1-4.png); animation-name:rotate2;animation-duration:10s;animation-delay:0s;animation-timing-function:linear;  animation-iteration-count: infinite; animation-direction: normal; animation-fill-mode: forwards}
.main-visual .scene-1 .circle-1-5 {background-image:url(../images/contents/main/circluer-1-5.png); animation-name:rotate1;animation-duration:8s;animation-delay:0s;animation-timing-function:linear;  animation-iteration-count: infinite; animation-direction: normal; animation-fill-mode: forwards}
.main-visual .scene-1 .circle-2 {position:absolute; bottom:-370px;right:-390px; width:1190px;height:1162px;z-index:0;}
.main-visual .scene-1 .circle-2-1 {background-image:url(../images/contents/main/circluer-2-1.png);}
.main-visual .scene-1 .circle-2-2 {background-image:url(../images/contents/main/circluer-2-2.png);}
.main-visual .scene-1 .circle-2-3 {background-image:url(../images/contents/main/circluer-2-3.png);}
.main-visual .scene-1 .circle-2-4 {background-image:url(../images/contents/main/circluer-2-4.png);}
.main-visual .scene-1 .circle-2-5 {background-image:url(../images/contents/main/circluer-2-5.png);}
.main-visual .scene-1 .circle-2-6 {background-image:url(../images/contents/main/circluer-2-6.png);}
.main-visual .scene-1 .circle-2-7 {background-image:url(../images/contents/main/circluer-2-7.png); animation-name:rotate1;animation-duration:20s;animation-delay:0s;animation-timing-function:linear;  animation-iteration-count: infinite; animation-direction: normal; animation-fill-mode: forwards}

.main-visual .scene-2 .word-outer {display:inline-flex; flex-wrap:nowrap; transition:var(--smooth-transform-transition);}
.main-visual .scene-2 .word-inner {display:inline-flex; flex-wrap:nowrap; align-items:center; transition:var(--smooth-transform-transition);}
.main-visual .scene-2 .word-inner .word {font-size:320px;color:#fff;font-weight:800;letter-spacing:0; transition:color 0.5s ease; white-space:nowrap; letter-spacing:0;}
.main-visual .scene-2 .word-inner .word.point {color:#fff !important; transition:var(--smooth-transform-transition);}
.main-visual .scene-2 .word-inner.hide .word {color:rgba(255,255,255,0);}
.main-visual .scene-2 .word-inner.hide .word.point {color:#fff;}
.main-visual .scene-2 .visual-group {opacity:0; transition:opacity 0.4s ease;}
.main-visual .scene-2 .visual-group.show {opacity:1;}
.main-visual .scene-2 .visual-group.hide {opacity:0;}
.main-visual .scene-2 .circle-particle .dot {position:absolute;top:50%;}
.main-visual .scene-2 .circle-particle .dot .obj {position:absolute; top:0;left:0; opacity:0.2;}
.main-visual .scene-2 .circle-particle .dot .obj .val {position:absolute; top:0;left:0; border-radius:50%; width:100%; height:100%;}
.main-visual .scene-2 .circle-particle .dot .obj .val:nth-child(1) {opacity:0.8; z-index:6;}
.main-visual .scene-2 .circle-particle .dot .obj .val:nth-child(2) {opacity:0.6; z-index:5;}
.main-visual .scene-2 .circle-particle .dot .obj .val:nth-child(3) {opacity:0.4; z-index:4;}
.main-visual .scene-2 .circle-particle .dot .obj .val:nth-child(4) {opacity:0.2; z-index:3;}
.main-visual .scene-2 .circle-particle .dot .obj .val:nth-child(5) {opacity:0.1; z-index:2;}
.main-visual .scene-2 .circle-particle .dot .obj .val:nth-child(6) {opacity:0.05; z-index:1;}


.main-visual .scene-2 .circle-particle .dot.right {left:0;}
.main-visual .scene-2 .circle-particle .dot.right .obj {left:0;right:auto;}
.main-visual .scene-2 .circle-particle .dot.right .obj .val:nth-child(1) {transform:translate(0% , 0%);}
.main-visual .scene-2 .circle-particle .dot.right .obj .val:nth-child(2) {transform:translate(50% , 0%);}
.main-visual .scene-2 .circle-particle .dot.right .obj .val:nth-child(3) {transform:translate(100% , 0%);}
.main-visual .scene-2 .circle-particle .dot.right .obj .val:nth-child(4) {transform:translate(150% , 0%);}
.main-visual .scene-2 .circle-particle .dot.right .obj .val:nth-child(5) {transform:translate(200% , 0%);}
.main-visual .scene-2 .circle-particle .dot.left {right:0;}
.main-visual .scene-2 .circle-particle .dot.left .obj {right:0;left:auto;}
.main-visual .scene-2 .circle-particle .dot.left .obj .val:nth-child(1) {transform:translate(0% , 0%);}
.main-visual .scene-2 .circle-particle .dot.left .obj .val:nth-child(2) {transform:translate(-50% , 0%);}
.main-visual .scene-2 .circle-particle .dot.left .obj .val:nth-child(3) {transform:translate(-100% , 0%);}
.main-visual .scene-2 .circle-particle .dot.left .obj .val:nth-child(4) {transform:translate(-150% , 0%);}
.main-visual .scene-2 .circle-particle .dot.left .obj .val:nth-child(5) {transform:translate(-200% , 0%);}


.main-visual .scene-3 {}
.main-visual .scene-3 .txt-group {display:flex;width:100%;height:100%;align-items:center;justify-content:center; position:relative; z-index:5;}
.main-visual .scene-3 .txt-inner {width:100%;text-align:center;}
.main-visual .scene-3 .txt-group .txt {font-size:100px;color:#1b172a;font-weight:900;line-height:120px;opacity:0; transform:scale(0.1); transition:var(--smooth-transform-transition);}
.main-visual .scene-3 .point {position:absolute; top:50%; left:50%; display:inline-flex; transform:translate(-50% , -50%); z-index:0;}
.main-visual .scene-3 .point .word {font-size:0;color:#fff;font-weight:800;letter-spacing:0; transition:var(--smooth-transform-transition); line-height:1;}
.main-visual .scene-3 .point .word .txt {position:relative;  transition:var(--smooth-transform-transition);}

.main-visual .scene-4 {opacity:1; transition:none; z-index:6; background:#171625; clip-path: circle(0% at 50% 50%); transition:var(--smooth-clip-path-transition);}
.main-visual .scene-4 .txt-group {display:flex;width:100%;height:100%;align-items:center;justify-content:center;position:relative;z-index:5;}
.main-visual .scene-4 .txt-inner {width:100%;text-align:center;}
.main-visual .scene-4 .txt {font-size:100px;color:#fff;font-weight:900;line-height:120px;}
.main-visual .scene-4 .visual-group {position:absolute;top:50%;left:50%;display:block;width:1920px;height:1911px;transform:translate(-50% , -50%);z-index:0;}
.main-visual .scene-4 .visual-group .obj {position:absolute;top:0;left:0;width:100%;height:100%; animation-name:rotate2;animation-duration:100s;animation-delay:0s;animation-timing-function:linear;  animation-iteration-count: infinite; animation-direction: normal; animation-fill-mode: forwards}
.main-visual .scene-4 .visual-group .obj img {position:absolute;top:0;left:0;width:100%;height:100%; object-fit:cover;}

.main-visual .scene-5 {opacity:1; transition:none; z-index:7; background:#24212c; clip-path: circle(0% at 50% 50%); transition:var(--smooth-clip-path-transition);}
.main-visual .scene-5 .txt-group {display:flex;width:100%;height:100%;align-items:center;justify-content:center;position:relative;z-index:5;}
.main-visual .scene-5 .txt-inner {width:100%;text-align:center;}
.main-visual .scene-5 .txt {font-size:100px;color:#fff;font-weight:900;line-height:120px;}
.main-visual .scene-5 .dot {position:absolute;top:0;left:0;}
.main-visual .scene-5 .dot .obj {position:absolute; top:0;left:0;}
.main-visual .scene-5 .dot .obj .val {position:absolute; top:0;left:0; border-radius:50%; width:100%; height:100%;}
.main-visual .scene-5 .dot .obj .val:nth-child(1) {z-index:10;}
.main-visual .scene-5 .dot .obj .val:nth-child(2) {z-index:9;}
.main-visual .scene-5 .dot .obj .val:nth-child(3) {z-index:8;}
.main-visual .scene-5 .dot .obj .val:nth-child(4) {z-index:7;}
.main-visual .scene-5 .dot .obj .val:nth-child(5) {z-index:6;}
.main-visual .scene-5 .dot .obj .val:nth-child(6) {z-index:5;}
.main-visual .scene-5 .dot .obj .val:nth-child(1) {opacity:0.8; z-index:10;}
.main-visual .scene-5 .dot .obj .val:nth-child(2) {opacity:0.6; z-index:9;}
.main-visual .scene-5 .dot .obj .val:nth-child(3) {opacity:0.4; z-index:8;}
.main-visual .scene-5 .dot .obj .val:nth-child(4) {opacity:0.2; z-index:7;}
.main-visual .scene-5 .dot .obj .val:nth-child(5) {opacity:0.1; z-index:6;}
.main-visual .scene-5 .dot .obj .val:nth-child(6) {opacity:0.05; z-index:5;}
.main-visual .scene-5 .dot .obj .val:nth-child(1) {transform:translate(0% , 0%);}
.main-visual .scene-5 .dot .obj .val:nth-child(2) {transform:translate(0% , 50%);}
.main-visual .scene-5 .dot .obj .val:nth-child(3) {transform:translate(0% , 100%);}
.main-visual .scene-5 .dot .obj .val:nth-child(4) {transform:translate(0% , 150%);}
.main-visual .scene-5 .dot .obj .val:nth-child(5) {transform:translate(0% , 200%);}
.main-visual .scene-5 .dot .obj .val:nth-child(6) {transform:translate(0% , 250%);}


.main-visual .scene-6 {opacity:1; transition:none; z-index:8; background:#1e1c25; clip-path: circle(0% at 50% 50%); transition:var(--smooth-clip-path-transition);}
.main-visual .scene-6 .txt-group {display:flex;width:100%;height:100%;align-items:center;justify-content:center;position:relative;z-index:5;}
.main-visual .scene-6 .txt-inner {width:100%;text-align:center;}
.main-visual .scene-6 .txt {font-size:100px;color:#fff;font-weight:900;line-height:120px;}
.main-visual .scene-6 .visual-group .item-1 {position:absolute;top:50%;left:50%;display:block;width:380px;height:380px;z-index:15;transform:translate(-50% , -50%);}
.main-visual .scene-6 .visual-group .item-2 {position:absolute;top:50%;left:50%;display:block;width:500px;height:500px;z-index:14;transform:translate(-50% , -50%);}
.main-visual .scene-6 .visual-group .item-3 {position:absolute;top:50%;left:50%;display:block;width:600px;height:600px;z-index:13;transform:translate(-50% , -50%);}
.main-visual .scene-6 .visual-group .item-4 {position:absolute;top:50%;left:50%;display:block;width:700px;height:700px;z-index:12;transform:translate(-50% , -50%);}
.main-visual .scene-6 .visual-group .item-5 {position:absolute;top:50%;left:50%;display:block;width:780px;height:780px;z-index:11;transform:translate(-50% , -50%);}
.main-visual .scene-6 .visual-group .item-6 {position:absolute;top:50%;left:50%;display:block;width:880px;height:880px;z-index:10;transform:translate(-50% , -50%);}
.main-visual .scene-6 .visual-group .item-7 {position:absolute;top:50%;left:50%;display:block;width:960px;height:960px;z-index:9;transform:translate(-50% , -50%);}
.main-visual .scene-6 .visual-group .item-1 .obj {background:#7668ff; opacity:1.0;}
.main-visual .scene-6 .visual-group .item-2 .obj {background:#7668ff; opacity:0.6;}
.main-visual .scene-6 .visual-group .item-3 .obj {background:#7668ff; opacity:0.25;}
.main-visual .scene-6 .visual-group .item-4 .obj {background:#7668ff; opacity:0.20;}
.main-visual .scene-6 .visual-group .item-5 .obj {background:#7668ff; opacity:0.15;}
.main-visual .scene-6 .visual-group .item-6 .obj {background:#5a49ff; opacity:0.1;}
.main-visual .scene-6 .visual-group .item-7 .obj {background:#5a49ff; opacity:0.05;}
.main-visual .scene-6 .visual-group .obj {position:absolute;top:0;left:0;width:100%;height:100%;border-radius:50%; transform:scale(0);}
.main-visual .scene-6 .visual-group .info {opacity:0;}
.main-visual .scene-6 .visual-group .info-1 {position:absolute;top:50%;left:50%;display:inline-block;margin:-319px 0 0 -497px; z-index:20;}
.main-visual .scene-6 .visual-group .info-2 {position:absolute;top:50%;left:50%;display:inline-block;margin:-341px 0 0 73px; z-index:20;}
.main-visual .scene-6 .visual-group .info-3 {position:absolute;top:50%;left:50%;display:inline-block;margin:-149px 0 0 -520px; z-index:20;}
.main-visual .scene-6 .visual-group .info-4 {position:absolute;top:50%;left:50%;display:inline-block;margin:-120px 0 0 380px; z-index:20;}
.main-visual .scene-6 .visual-group .info-5 {position:absolute;top:50%;left:50%;display:inline-block;margin:143px 0 0 256px; z-index:20;}
.main-visual .scene-6 .visual-group .info-6 {position:absolute;top:50%;left:50%;display:inline-block;margin:206px 0 0 -530px; z-index:20;}
.main-visual .scene-6 .visual-group .info-7 {position:absolute;top:50%;left:50%;display:inline-block;margin:347px 0 0 100px; z-index:20;}
.main-visual .scene-6 .visual-group .info-1 img {opacity:0.3;}
.main-visual .scene-6 .visual-group .info-2 img {opacity:0.8;}
.main-visual .scene-6 .visual-group .info-3 img {opacity:0.6;}
.main-visual .scene-6 .visual-group .info-4 img {opacity:0.2;}
.main-visual .scene-6 .visual-group .info-5 img {opacity:0.4;}
.main-visual .scene-6 .visual-group .info-6 img {opacity:0.6;}
.main-visual .scene-6 .visual-group .info-7 img {opacity:0.6;}



/*  메인 > 솔루션 */
.main-solution {background:#e6ecf9; z-index:15;}
.main-solution .data-group {padding:147px 0 190px 0; overflow:hidden;}
.main-solution .swiper-ui {margin-top:32px;}
.main-solution-tab {margin-top:65px;}
.main-solution-tab > ul {display:flex; margin:0 -12px;}
.main-solution-tab > ul > li {flex:1; padding:0 12px; box-sizing:border-box;}
.main-solution-tab .btn-nav {position:relative; display:flex; align-items:center; justify-content:center; width:100%; height:96px; font-size:18px; line-height:1.45; color:#666; background-color:#fff; border-radius:22px; transition:background 0.4s ease, color 0.4s ease; overflow:hidden;}
.main-solution-tab .btn-nav > em {position:relative;z-index:5;}
.main-solution-tab .btn-nav:before {content:''; position:absolute; top:0; right:0; display:block; width:100%; height:100%; /*background:url(../images/contents/main/main-solution-tab-bg.png) right center no-repeat; background-size:cover;*/ opacity:0; transition:opacity 0.4s ease;}
.main-solution-tab .actived .btn-nav,
.main-solution-tab .btn-nav:hover {background-color:#0039c0; color:#fff;}
.main-solution-tab .actived .btn-nav:before,
.main-solution-tab .btn-nav:hover:before {opacity:1;}
.main-solution-data {margin-top:140px;}
.main-solution-data .swiper-area {position:relative;}
.main-solution-data .btn-swiper-prev-white-small {margin-left:-64px;}
.main-solution-data .btn-swiper-next-white-small {margin-right:-64px;}
.main-solution-data .swiper-container {overflow:visible;}
.main-solution-data .swiper-slide.show {display:flex;}
.main-solution-data .swiper-slide.hide {display:none;}
.main-solution-data .swiper-slide {width:calc( 50% - 12px ); height:auto; display:flex;}
/*.main-solution-data .swiper-slide + .swiper-slide {margin-left:24px;}*/
.main-solution-data .swiper-slide.hide + .swiper-slide {margin-left:0;}
.main-solution-items {transform:translate(0px , 50px); opacity:0; transition:transform 0.4s cubic-bezier(0.165, 0.840, 0.440, 1.000), opacity 0.4s cubic-bezier(0.165, 0.840, 0.440, 1.000);}
.main-solution-items.actived {transform:translate(0px , 0px); opacity:1;}
.main-solution-items {flex:1; position:relative; min-height:520px; /*background:rgba(0,57,192,1);*/ box-shadow:0px 16px 48px rgba(0,0,0,0.2); border-radius:24px; overflow:hidden; text-align:left;} 
/* .main-solution-items:before {content:''; position:absolute; top:0; right:0; width:100%; height:100%; background-repeat:no-repeat; background-position:bottom right; background-size:auto 100%;}*/

.main-solution-items:hover .item-ui:before {opacity:0.5;}
.main-solution-items:hover .item-ui .item-btns {transform:translate(0% , 0%);}
.main-solution-items .item-outer {position:relative; height:100%; z-index:5;}
.main-solution-items .item-inner {padding:48px;}
.main-solution-items .item-name {margin-top:48px; font-size:40px; font-weight:700; color:#fff;}
.main-solution-items .item-desc {min-height:72px; padding-right:10%; font-size:24px; line-height:1.5; font-weight:600; color:#fff; letter-spacing:-0.5px;}
.main-solution-data .swiper-wrapper > .swiper-slide:nth-child(1) .main-solution-items .item-desc {padding:0;}
.main-solution-items .item-keywords {margin-top:48px;}
.main-solution-items .item-keywords h5 {font-size:16px; line-height:1.5; color:#fff; font-weight:600;}
.main-solution-items .item-keywords .txt {display:inline-flex; padding:0 24px; font-size:16px; line-height:40px; white-space:nowrap; color:rgba(255,255,255,0.7); border-radius:20px; background:rgba(0,0,0,0.1);}
.main-solution-items .item-keywords .keywords {margin-top:20px;}
.main-solution-items .item-keywords .keywords > ul {display:flex; margin:-4px -2px; flex-wrap:wrap; max-height:144px; overflow:hidden;}
.main-solution-items .item-keywords .keywords > ul > li {flex:0 0 auto; margin:4px 2px;}
/*
.main-solution-items .item-keywords .keywords > ul > li:nth-child(5) ~ li {display:none;}
*/
.main-solution-items .btn-item-view {position:absolute; top:48px; right:48px; display:inline-flex; padding:0 0 0 14px; align-items:center; font-size:16px; line-height:40px; color:#fff; font-weight:400; border-radius:10px; background:rgba(0,0,0,0); z-index:15;}
.main-solution-items .btn-item-view:after {content:''; display:block; width:24px; height:24px; margin-left:8px; background:url(../images/contents/main/icon-main-solution-more.png) center center no-repeat;}
.main-solution-items .item-ui {position:absolute; bottom:0; left:0; display:flex; align-items:flex-end; width:100%; height:100%; box-sizing:border-box; padding:40px 48px; z-index:15;}
.main-solution-items .item-ui:before {content:''; position:absolute; bottom:0; left:0; width:100%; height:100%; opacity:0; background:rgba(0,0,0, 20%); transition:opacity 0.4s ease;}
.main-solution-items .item-ui .item-btns {position:relative; display:flex; width:100%; z-index:5; transform:translate(0% , 200%); transition:transform 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940);}
.main-solution-items .item-ui .item-btns .btn-item-ui {margin:0 8px;}
.main-solution-items .item-ui .item-btns .btn-item-ui:first-child {margin-left:0px;}
.main-solution-items .item-ui .item-btns .btn-item-ui:last-child {margin-right:0px;}
.main-solution-items .btn-item-ui {display:flex; width:100%; height:64px; font-size:18px; color:#4d4d4d; font-weight:600; align-items:center; justify-content:center; background:#fff; border-radius:12px;}
.main-solution-items .item-visual {position:absolute; top:0; left:0; width:100%; height:100%;}
.main-solution-items .item-visual > img {width:100%; height:100%;}

.main-solution .headline {position:absolute; top:460px; left:50%; display:inline-flex; width:100vw; height:600px;  transition:transform 0.8s cubic-bezier(0.165, 0.840, 0.440, 1.000);}
.main-solution .headline .desc {position:absolute; top:0; left:0; width:100%; display:inline-block; font-size:288px; color:#fff; line-height:300px;font-weight:900; transform:translate(0px , 40px); opacity:0;}
.main-solution .headline .desc.actived {transform:translate(0px , 0px); opacity:1; transition:transform 0.6s cubic-bezier(0.165, 0.840, 0.440, 1.000), opacity 0.6s ease;}
.main-solution .headline .txt {opacity:0.6; white-space:nowrap;}
.main-solution .headline .txt + .txt {transform:translate(50% , 0%);}
.main-solution .headline .txt.stroke {color:transparent; -webkit-text-stroke:4px #fff; margin-left:10px;}
.main-solution .visual-group .dot-1 {position:absolute; top:0; left:50%; display:block; width:211px; height:211px; margin:-77px 0 0 605px;}
.main-solution .visual-group .dot-1:before {content:''; position:absolute; top:0; left:0; width:100%; height:100%;  background:url(../images/contents/main/main-solution-dot-1.png) center center no-repeat;}
.main-solution .visual-group .dot-2 {position:absolute; top:0; left:50%; display:block; width:128px; height:128px; margin:70px 0 0 563px; background:rgba(177,218,249,0.6); border-radius:50%; mix-blend-mode: color-burn;}
.main-solution .visual-group .dot-3 {position:absolute; top:0; left:50%; display:block; width:422px; height:422px; margin:940px 0 0 -844px;}
.main-solution .visual-group .dot-3:before {content:''; position:absolute; top:0; left:0; width:100%; height:100%; background:url(../images/contents/main/main-solution-dot-3.png) center center no-repeat;}

/*  메인 > 도입사례 */
.main-introduction {background:#e6ecf9; z-index:15;}
.main-introduction .data-group {padding:190px 0 180px 0; overflow:hidden;}
.main-introduction-tab {margin-top:65px;}
.main-introduction-tab > ul {display:flex; justify-content:center;}
.main-introduction-tab > ul > li {flex:0 0 auto; padding:0 4px; box-sizing:border-box;}
.main-introduction-tab .btn-nav {position:relative; display:inline-flex; align-items:center; justify-content:center; padding:0 38px; height:64px; font-size:20px; line-height:1.5; font-weight:600; color:#666; background-color:#fff; border-radius:32px; transition:background 0.4s ease, color 0.4s ease;}
.main-introduction-tab .btn-nav .icons {position:relative; display:block; width:24px; height:24px; margin-right:8px;}
.main-introduction-tab .btn-nav .icons:before,
.main-introduction-tab .btn-nav .icons:after {content:''; position:absolute; top:0; left:0; display:block; width:100%; height:100%; background-repeat:no-repeat; background-position:center center; transition:opacity 0.4s ease;}
.main-introduction-tab .btn-nav .icons:before {opacity:1;}
.main-introduction-tab .btn-nav .icons:after {opacity:0;}
.main-introduction-tab .btn-nav:hover {background:#0039c0; color:#fff;}
.main-introduction-tab .btn-nav:hover .icons:before {opacity:0;}
.main-introduction-tab .btn-nav:hover .icons:after {opacity:1;}
.main-introduction-tab .btn-nav.btn-nav-1 .icons:before {background-image:url(../images/contents/main/main-introduction-icon-1-off.png);}
.main-introduction-tab .btn-nav.btn-nav-1 .icons:after {background-image:url(../images/contents/main/main-introduction-icon-1-on.png);}
.main-introduction-tab .btn-nav.btn-nav-2 .icons:before {background-image:url(../images/contents/main/main-introduction-icon-2-off.png);}
.main-introduction-tab .btn-nav.btn-nav-2 .icons:after {background-image:url(../images/contents/main/main-introduction-icon-2-on.png);}
.main-introduction-tab .btn-nav.btn-nav-3 .icons:before {background-image:url(../images/contents/main/main-introduction-icon-3-off.png);}
.main-introduction-tab .btn-nav.btn-nav-3 .icons:after {background-image:url(../images/contents/main/main-introduction-icon-3-on.png);}
.main-introduction-tab .btn-nav.btn-nav-4 .icons:before {background-image:url(../images/contents/main/main-introduction-icon-4-off.png);}
.main-introduction-tab .btn-nav.btn-nav-4 .icons:after {background-image:url(../images/contents/main/main-introduction-icon-4-on.png);}
.main-introduction-tab .btn-nav.btn-nav-5 .icons:before {background-image:url(../images/contents/main/main-introduction-icon-5-off.png);}
.main-introduction-tab .btn-nav.btn-nav-5 .icons:after {background-image:url(../images/contents/main/main-introduction-icon-5-on.png);}
.main-introduction-data {position:relative; left:50%; width:100vw; margin-top:40px; margin-left:-50vw;}
.main-introduction-data .scroller-row + .scroller-row {margin-top:24px;}
.main-introduction-data .scroller-row:nth-child(2) {flex-direction:row-reverse;}
.main-introduction-data .scroller-row {display:flex;}
.main-introduction-data .scroller-row.effect-data {transform:translate(0px , 0px);}
.main-introduction-data .scroller-group {display:inline-flex; flex:0 0 auto;}
.main-introduction-items {flex:0 0 auto; position:relative; display:flex; align-items:center; justify-content:center; flex-direction:column; width:360px; height:220px; background:#fff; border-radius:24px; margin-left:16px; overflow:hidden;}
.main-introduction-items .item-inner {position:relative; display:block; z-index:5;}
.main-introduction-items .item-logo {position:relative; display:block; width:240px; height:148px; transform:translate(0px , 0px); transition:transform 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940);}
.main-introduction-items .item-logo:before {content:''; position:absolute; top:100%; left:50%; display:block; width:4px; height:36px; margin:-3px 0 0 -2px; border-radius:2px; background:#fff; transition:opacity 0.4s ease; opacity:0;}
.main-introduction-items .item-logo:after {content:''; position:absolute; top:100%; left:50%; display:block; width:36px; height:4px; margin:13px 0 0 -18px; border-radius:2px; background:#fff; transition:opacity 0.4s ease; opacity:0;}
.main-introduction-items .item-logo img {position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover; transition:opacity 0.4s ease;}
.main-introduction-items .item-logo .off {opacity:1;}
.main-introduction-items .item-logo .on {opacity:0;}
.main-introduction-items:before {content:''; position:absolute; top:0; left:0; width:100%; height:100%; z-index:0; transform:scale(1.1); opacity:0; background-size:cover; background-position:center center; background-repeat:no-repeat; transition:transform 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940), opacity 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940);}
.main-introduction-items.nav-1:before {background-image:url(../images/contents/main/main-introduction-visual-1.png);}
.main-introduction-items.nav-2:before {background-image:url(../images/contents/main/main-introduction-visual-2.png);}
.main-introduction-items.nav-3:before {background-image:url(../images/contents/main/main-introduction-visual-3.png);}
.main-introduction-items.nav-4:before {background-image:url(../images/contents/main/main-introduction-visual-4.png);}
.main-introduction-items.nav-5:before {background-image:url(../images/contents/main/main-introduction-visual-5.png);}
.main-introduction-items:hover:before {transform:scale(1); opacity:1;}
.main-introduction-items:hover .item-logo {transform:translate(0% , -30%);}
.main-introduction-items:hover .item-logo:before,
.main-introduction-items:hover .item-logo:after {opacity:1;}
.main-introduction-items:hover .item-logo .off {opacity:0;}
.main-introduction-items:hover .item-logo .on {opacity:1;}
.main-introduction-pop .pop-view-wrap {width:520px; background-color:rgba(255,255,255,1); backdrop-filter:blur(10px); text-align:left;}
.main-introduction-pop .pop-view-wrap .pop-view-body {padding:84px 48px 0 48px;}
.main-introduction-pop .pop-view-wrap .pop-view-footer {padding:40px 48px;}
.main-introduction-pop .title {font-size:24px; font-weight:600;}
.main-introduction-pop .desc {margin-top:16px; font-size:16px; color:#666;}
.main-introduction-pop .options {margin-top:32px;}
.main-introduction-pop .options .grid-layout {overflow:hidden;}
.main-introduction-pop .options .grid-layout-inner {margin:-2px;}
.main-introduction-pop .options .grid-layout-cell {padding:2px; flex:0 0 auto;}
.main-introduction-pop .options .label {height:40px; padding:0 24px; border-radius:100px; font-size:16px;}


/* 메인 > 브랜드 */
.main-brand {background-color:#000; z-index:5;}
.main-brand.actived {z-index:9;}
.main-brand.actived .visual-group {opacity:1;}
.main-brand .data-group {}
.main-brand .main-title { position:absolute; top:0; left:0; width:50%; height:100%; text-align:left;}
.main-brand .main-title > span {position:sticky; top:0; left:0; width:100%; padding:200px 0 180px 0; display:block; box-sizing:border-box;}
.main-brand .main-title > span > em {font-weight:700; color:#fff; display:block;}
.main-brand .visual-group {position:fixed; top:0; left:0; width:100%; height:100%; background:url(../images/contents/main/main-brand-visual-bg.png) center center no-repeat; background-position:center; background-size:cover; opacity:0;  transition:opacity 0.05s ease;}
.main-brand .visual-group .circle {position:absolute; top:0; left:50%; display:block; width:280px; height:280px; margin:-84px 0 0 -213px; filter: hue-rotate(-77deg); z-index:15;}
.main-brand .visual-group .circle:before {content:''; position:absolute; top:0; left:0; display:block; width:100%; height:100%; background:url(../images/contents/main/main-brand-circle.png) center center no-repeat;}
.main-brand .visual-group .wave-1 {position:absolute; top:0; left:50%; display:block; width:1920px; height:712px; margin:238px 0 0 -960px; z-index:5; mix-blend-mode: screen; opacity:0.6;}
.main-brand .visual-group .wave-1:before {content:''; position:absolute; top:0; left:0; display:block; width:100%; height:100%; background:url(../images/contents/main/main-brand-wave-1.png) center center no-repeat;}
.main-brand .visual-group .wave-2 {position:absolute; top:0; left:50%; display:block; width:1920px; height:591px; margin:545px 0 0 -960px;}
.main-brand .visual-group .wave-2:before {content:''; position:absolute; top:0; left:0; display:block; width:100%; height:100%; background:url(../images/contents/main/main-brand-wave-2.png) center center no-repeat;}
.main-brand .wave-particle {position:absolute;top:0;left:0;width:100%;height:100%;margin:0;padding:0; }
.main-brand .wave-particle:before {content:''; position:absolute; top:0; left:0; width:100%; height:100%; display:block; background:rgba(0,0,0,0.1); z-index:5;}
.main-brand .wave-particle canvas {position:absolute;top:0;left:0;width:110%;height:100%;margin:0;padding:0;}
.main-brand-data {padding:90px 96px 180px 96px;}
.main-brand-data .data-cell {display:flex; justify-content:flex-end;}
.main-brand-data .data-cell + .data-cell {margin-top:124px;}
.main-brand-data .data-cell:nth-child(2n) {padding-right:190px;}
.main-brand-items {position:relative; width:360px; height:470px;}
.main-brand-items .item-outer {position:absolute; top:0; left:0; width:100%; height:100%;}
.main-brand-items .item-visual {position:absolute; top:0; left:0; width:100%; height:100%; border-radius:22px; background:#000; transition:transform 0.8s cubic-bezier(0.165, 0.840, 0.440, 1.000); box-shadow:0px 22px 76px rgba(0,0,0,0.3); overflow:hidden;}
.main-brand-items .item-visual img {position:absolute; top:0; left:0; width:100%; height:calc( 100% + 100px ); object-fit:cover; transition:transform 0.8s cubic-bezier(0.165, 0.840, 0.440, 1.000);}
.main-brand-items .item-info {position:absolute; top:100%; left:0; display:block; width:100%; z-index:15; box-sizing:border-box; padding:0 53px; margin-top:-120px;  transition:transform 0.8s cubic-bezier(0.165, 0.840, 0.440, 1.000);}
.main-brand-items .item-info .item-label {display:inline-block; font-size:24px; line-height:60px; color:#fff; min-width:110px; padding:0 38px; white-space:nowrap; border:1px solid #fff; border-radius:20px; box-sizing:border-box;}
.main-brand-items .item-info .item-value {font-size:90px; color:#fff; font-weight:700; white-space:nowrap; line-height:1.5;}


/* 메인 > 서비스 */
.main-service {min-height:100vh; background:#e6ecf9; z-index:15;}
.main-service .data-group {padding:170px 0 215px 0; overflow:hidden;}
.main-service .swiper-ui {margin-top:32px;}

.main-service .btn-swiper-prev-white-middle {margin-left:24px;}
.main-service .btn-swiper-next-white-middle {margin-right:24px;}

.main-service-data {margin-top:70px;}
.main-service-data .item-inner {margin:-12px; display:flex; flex-wrap:wrap;}
.main-service-data .item-inner > .item-cell {width:33.33%; padding:12px; box-sizing:border-box;}
.main-service-data .item-inner > .item-cell:last-child {width:100%;}
.main-service-items {display:block; text-align:center; width:100%; height:360px; background:#fff; padding:47px 30px 0 30px; border-radius:20px; box-sizing:border-box;}
.main-service-items .title {font-size:24px; line-height:1.5; font-weight:700; color:#252525;}
.main-service-items .desc {margin-top:8px; font-size:18px; line-height:1.5; font-weight:500; color:#808080;}
.main-service-items .icons {margin-top:40px;}
.main-service-banner .swiper-area {border-radius:20px; overflow:hidden;}
.main-service-banner-items {position:relative; width:100%; height:320px; display:flex; align-items:center; justify-content:center; padding:0 120px; box-sizing:border-box;}
.main-service-banner-items .item-info {width:100%;}
.main-service-banner-items .title {font-size:24px; line-height:1.5; font-weight:600; color:#fff;}
.main-service-banner-items .desc {margin-top:4px;font-size:18px; line-height:1.5; font-weight:400; color:rgba(255,255,255,0.6);}
.main-service-banner-items .symbol-text-item {font-size:18px; color:rgba(255,255,255,0.7);}
.main-service-banner-items .symbol-text-item:before {background:#fff; margin:11px 10px 0 0;}
.main-service-banner-items .btns {margin-top:32px;}
.main-service-banner-items .btn-view {display:inline-flex; align-items:center; height:48px; padding:0 23px; font-size:16px; color:#fff; font-weight:500; border:1px solid rgba(255,255,255,0.4); border-radius:24px;}
.main-service-banner-items.banner-1 {background:#3361cd url(../images/contents/main/main-service-banner-bg-1.png) center right no-repeat;}
.main-service-banner-items.banner-2 {background:#3361cd url(../images/contents/main/main-service-banner-bg-2.png) center right no-repeat;}
.main-service-banner-items.banner-3 {background:#3361cd url(../images/contents/main/main-service-banner-bg-3.png) center right no-repeat;}

/* 메인 > 커뮤니티 */
.main-community {background-color:#000; z-index:6;}
.main-community.actived .visual-group {opacity:1;}
.main-community .data-group {padding:140px 0 196px 0; overflow:hidden;}
.main-community .visual-group {position:fixed; top:0; left:0; width:100%; height:100%; background:#1d172e; opacity:0; transition:opacity 0.05s ease;}
.main-community .visual-group .circle-1 {position:absolute; top:0; left:50%; display:block; width:1204px; height:1204px; margin:-580px 0 0 -1674px; z-index:5;}
.main-community .visual-group .circle-1:before {content:''; position:absolute; top:0; left:0; display:block; width:100%; height:100%; background:url(../images/contents/main/main-community-circle-1.png) center center no-repeat; animation-name:rotate2;animation-duration:30s;animation-delay:0s;animation-timing-function:linear;  animation-iteration-count: infinite; animation-direction: normal; animation-fill-mode: forwards;}
.main-community .visual-group .circle-2 {position:absolute; bottom:0; right:50%; display:block; width:2314px; height:2332px; margin:0 -2075px -1600px 0; z-index:5;}
.main-community .visual-group .circle-2:before {content:''; position:absolute; top:0; left:0; display:block; width:100%; height:100%; background:url(../images/contents/main/main-community-circle-2.png) center center no-repeat; animation-name:rotate2;animation-duration:60s;animation-delay:0s;animation-timing-function:linear;  animation-iteration-count: infinite; animation-direction: normal; animation-fill-mode: forwards;}

.main-community .main-title {color:#fff;}
/*
.main-community-data {position:relative; left:50%; width:100vw; margin-top:48px; margin-left:-50vw;}
.main-community-data .scroller-row + .scroller-row {margin-top:24px;}
.main-community-data .scroller-row:nth-child(2) {flex-direction:row-reverse;}
.main-community-data .scroller-row {display:flex;}
.main-community-data .scroller-row.effect-data {transform:translate(0px , 0px);}
.main-community-data .scroller-group {display:inline-flex; flex:0 0 auto;}
.main-community-items {flex:0 0 auto; position:relative; display:block; width:264px; height:247px; background:#fff; border-radius:24px; margin-left:16px; text-align:left; overflow:hidden;}
.main-community-items .item-inner {position:relative; display:flex; width:100%; height:100%; flex-direction:column; align-items:center; justify-content:flex-start; padding:40px 38px; box-sizing:border-box;}
.main-community-items .item-logo {position:relative; width:100%; z-index:5;}
.main-community-items .item-logo .obj {position:relative; width:100%; height:16px;}
.main-community-items .item-logo .obj img {position:absolute; top:0; left:0; height:16px; width:auto; transition:opacity 0.4s ease;}
.main-community-items .item-logo .obj img.off {opacity:1;}
.main-community-items .item-logo .obj img.on {opacity:0;}
.main-community-items .item-desc {position:relative; margin-top:24px; width:100%; font-size:18px; line-height:1.5; font-weight:500; color:#666;  display: -webkit-box; text-overflow: ellipsis; overflow: hidden; -webkit-box-orient: vertical; word-break: break-all; -webkit-line-clamp:2; z-index:5; transition:color 0.4s ease;}
.main-community-items .item-date {position:relative; margin-top:auto; width:100%; font-size:16px; line-height:1.5; font-weight:500; color:#a5a5a5; z-index:5; transition:color 0.4s ease;}
.main-community-items .item-visual {position:absolute; top:0; left:0; width:100%; height:100%; background:#3361cd; z-index:0; opacity:0; transition:opacity 0.4s ease;}
.main-community-items .item-visual:before {content:''; position:absolute; bottom:0; left:0; width:100%; height:100%; background:url(../images/contents/main/main-community-item-bg.png) center bottom no-repeat;}
.main-community-items:hover .item-logo .obj img.off {opacity:0;}
.main-community-items:hover .item-logo .obj img.on {opacity:1;}
.main-community-items:hover .item-desc {color:#fff;}
.main-community-items:hover .item-date {color:#fff;}
.main-community-items:hover .item-visual {opacity:1;}
.main-community .more {margin-top:56px; text-align:center;}
.main-community .more .btn-more {display:inline-flex; align-items:center; justify-content:center; padding:0 16px 0 28px; height:48px; font-size:16px; font-weight:600; color:#fff; box-sizing:border-box; border:1px solid rgba(255,255,255,0.5); border-radius:14px;}
.main-community .more .btn-more:after {content:''; display:block; width:24px; height:24px; background:url(../images/contents/main/icon-main-community-more.png) center center no-repeat; margin-left:6px;}
.main-community-tab {margin-top:80px;}
.main-community-tab > ul {display:flex; justify-content:center;}
.main-community-tab > ul > li {flex:0 0 auto; padding:0 4px; box-sizing:border-box;}
.main-community-tab .actived .btn-nav {background:#0039c0; color:#fff;}
.main-community-tab .actived .btn-nav:after {display:block;}
.main-community-tab .btn-nav {position:relative; display:inline-flex; align-items:center; justify-content:center; padding:0 32px; height:80px; font-size:18px; line-height:1.5; font-weight:600; color:#2e1d49; background-color:#fff; border-radius:40px; transition:background 0.4s ease, color 0.4s ease;}
.main-community-tab .btn-nav:after {content:''; display:none; width:24px; height:24px; background:url(../images/contents/main/icon-main-community-more.png) center center no-repeat; margin-left:6px;}
*/
.main-community .contents-tab-wrap {margin-top:80px;}
.main-community .contents-tab-button .contents-tab .content-cell .btn-tab-item {width:172px; height:80px; padding:0; color:#2e1d49; font-size:18px; font-weight:600; line-height:80px; border:none; border-radius:100px;}
.main-community .contents-tab-button .contents-tab .content-cell.actived .btn-tab-item {background:#0039c0; color:#fff; font-weight:600;}
.main-community .tab-data-group {margin-top:40px;}
.main-community .panel-tab-wrap .tab-data-group .tab-data {position:absolute; top:0; left:-999999px; visibility:hidden; display:block;}
.main-community .panel-tab-wrap .tab-data-group .tab-data.actived {position:relative; top:auto; left:auto; visibility:visible;}
.main-community-sort {display:flex; justify-content:center; flex-wrap:wrap;}
.main-community-sort .sort-cell {position:relative; padding:0 16px;}
.main-community-sort .sort-cell > a {font-size:18px; line-height:27px; white-space:nowrap; color:rgba(255,255,255,0.3); transition:color 0.2s ease;}
.main-community-sort .sort-cell > a:hover {color:rgba(178,221,255,1);}
.main-community-sort .sort-cell:before {content:''; position:absolute; top:50%; left:0; display:block; width:2px; height:16px; margin-top:-8px; background:rgba(255,255,255,0.2);}
.main-community-sort .sort-cell:first-child:before {display:none;}
.main-community-list {margin-top:40px;}
.main-community-list .list-cell + .list-cell {margin-top:8px;}
.main-community-items {position:relative; display:flex; align-items:center; overflow:hidden; width:100%; height:90px; padding:0 56px; background:#fff; border-radius:22px; box-sizing:border-box; transition:background 0.2s ease;}
.main-community-items .item-name {position:relative; z-index:5; flex:0 0 auto; width:150px; font-size:20px; font-weight:700; color:#252525; transition:color 0.2s ease;}
.main-community-items .item-subject {position:relative; z-index:5; flex:1; width:100%; font-size:18px; font-weight:400; color:#252525; transition:color 0.2s ease; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;}
.main-community-items .item-date {position:relative; z-index:5; flex:0 0 auto; margin-left:24px; width:auto; font-size:16px; font-weight:400; color:#808080; transition:color 0.2s ease;}
.main-community-items:hover {background-color:#3361cd;}
.main-community-items:hover .item-name {color:#fff;}
.main-community-items:hover .item-subject {color:#fff;}
.main-community-items:hover .item-date {color:#fff;}
.main-community-list .list-cell {transform:translate(0% , 50%); opacity:0;}
.tab-data.actived .main-community-list .list-cell {transform:translate(0% , 0%); opacity:1;}
.tab-data.actived .main-community-list .list-cell:nth-child(1) {transition:transform 0.4s 0.1s cubic-bezier(0.250, 0.460, 0.450, 0.940), opacity 0.4s 0.1s cubic-bezier(0.250, 0.460, 0.450, 0.940);}
.tab-data.actived .main-community-list .list-cell:nth-child(2) {transition:transform 0.4s 0.2s cubic-bezier(0.250, 0.460, 0.450, 0.940), opacity 0.4s 0.2s cubic-bezier(0.250, 0.460, 0.450, 0.940);}
.tab-data.actived .main-community-list .list-cell:nth-child(3) {transition:transform 0.4s 0.3s cubic-bezier(0.250, 0.460, 0.450, 0.940), opacity 0.4s 0.3s cubic-bezier(0.250, 0.460, 0.450, 0.940);}
.tab-data.actived .main-community-list .list-cell:nth-child(4) {transition:transform 0.4s 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940), opacity 0.4s 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940);}
.tab-data.actived .main-community-list .list-cell:nth-child(5) {transition:transform 0.4s 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940), opacity 0.4s 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940);}

/* 메인 > 뉴스 */
.main-news {background:#e6ecf9; z-index:15;}
.main-news .data-group {padding:190px 0 180px 0; overflow:hidden;}
.main-news .swiper-area {}
.main-news .swiper-container {overflow:hidden;}
.main-news .swiper-slide {width:calc( 33.33% - 16px); box-sizing:border-box;}
.main-news .swiper-ui {margin-top:32px;}
.main-news-data {margin-top:80px;}
.main-news-data .btn-swiper-prev-white-small {margin-left:-64px;}
.main-news-data .btn-swiper-next-white-small {margin-right:-64px;}
.main-news-items {display:block; border-radius:24px; overflow:hidden; background:#fff; text-align:left;}
.main-news-items:hover .item-visual img {transform:scale(1.1);}
.main-news-items .item-visual {position:relative; height:216px; background:#000; overflow:hidden;}
.main-news-items .item-visual img {position:absolute; top:0; left:0; width:100%; height:100%; opacity:0.7; object-fit:cover; transform:scale(1); transition:transform 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940);}
.main-news-items .item-info {min-height:184px; padding:32px 32px 0 32px; box-sizing:border-box;}
.main-news-items .item-subject {width:100%; font-size:22px; line-height:1.5; font-weight:500; color:#333;  display: -webkit-box; text-overflow: ellipsis; overflow: hidden; -webkit-box-orient: vertical; word-break: break-all; -webkit-line-clamp:2; z-index:5;}
.main-news-items .item-date {margin-top:14px; font-size:16px; line-height:1.5; color:#808080;}