.subtop-wrap h1{opacity:0;}
.subtop-wrap > .inner-wrap > .threed-dwrap{position:absolute; top:0; left:50%; width:584px; transform-style: preserve-3d; transition: all 1.5s ease-in-out; transform: rotate3d(1,-1,0,60deg) translate(-50%,0); opacity:0;}
.subtop-wrap > .inner-wrap > .threed-dwrap > img{width:100%;}



.left-location { display: flex; flex-direction: column; align-items: center; justify-content: center; position: fixed; left: 20px; top: 200px; color: var(--color-point);  text-transform: uppercase; opacity: 0; transform: translateX(-50px); transition: all .5s;  width:0px;}
.left-location.on{opacity: 1; transform: translateX(0px);}
.left-location .tlt-wrap{transition:all .5s; overflow: hidden; position:relative;}
.left-location .tlt-wrap > .cover{transition:all .5s ease-in-out;}
.left-location .cover{position:absolute; z-index: 1; width:0%; height: 100%; background-color:#17171A; }
.left-location.move .cover{width:50px;}
.left-location .stlt-wrap{ overflow: hidden; text-align: center; position:relative;}
.left-location .stlt-wrap > .cover{transition:all .5s ease-in-out 0.2s;}
.left-location p.tlt { margin-bottom: 10px; writing-mode: vertical-rl; text-align: center; font-size: var(--font-size-large); line-height: 1.5; }
.left-location p.stlt{font-size: var(--font-size-large); font-weight:900; text-align: center;}
.left-location .line {width: 1px; height: 300px; background-color: var(--color-point); margin-top: 10px; transition:all .5s; }
.left-location.move .line{height: 0px;}



.section > .inner-wrap{width: calc(100% - var(--layout-about-margin)); max-width:1236px; margin:0 auto; display:flex; flex-wrap:wrap; justify-content: space-between;}
.section-overview{padding:var(--gap-140) 0;}
.section-overview .text-wrap{width:50%; max-width:527px; margin-top:30vh; z-index: 1; position:relative;}
.section-overview .text-wrap .stlt{font-size:var(--font-size-xxlarge); color:var(--color-point); font-weight: 600; text-transform: uppercase;}
.section-overview .text-wrap .tlt{font-size:var(--font-size-xhuge); color:#fff; font-weight: 900; text-transform: uppercase; line-height: 110%;}
.section-overview .text-wrap .cont{font-size:var(--font-size-large); color:#fff; font-weight: 400; margin-top:20px; line-height: 150%;}
.section-overview .image-wrap{position:relative; width:50%; perspective: 1000px;}
.section-overview .image-wrap .image-inner-wrap:nth-child(1){position:absolute; left:-24%; top:0; z-index:-2; width:81%; transform-style: preserve-3d; transition: all 1.5s ease-in-out; transform: rotate3d(1,-1,0,60deg); opacity:0;}
.section-overview .image-wrap .image-inner-wrap > .inner-wrap{width:100%; position:relative; background-size: auto calc(140%);  background-position: center; background-repeat: no-repeat;}
.section-overview .image-wrap .image-inner-wrap:nth-child(1) > .inner-wrap:after{content:""; display:block; clear:both; padding-top:127%;}
.section-overview .image-wrap .image-inner-wrap:nth-child(2){position:absolute; right:0; top:54%; width:59%; z-index:-1; transform-style: preserve-3d; transition: all 1.5s ease-in-out; transform: rotate3d(-1,1,0,60deg); opacity:0;}
.section-overview .image-wrap .image-inner-wrap:nth-child(2) > .inner-wrap:after{content:""; display:block; clear:both; padding-top:134%; }
.section-overview .image-wrap .image-inner-wrap > .inner-wrap > img{position:absolute; top:50%; left:50%; transform: translate(-50%,-50%); object-fit: cover; width:100%; height: 100%;}



.section-vision{padding:var(--gap-140) 0; margin-top:var(--gap-400);}
.section-vision .left-wrap{width:calc(50% - 20px); max-width:430px;}
.section-vision .left-wrap .stlt{font-size:var(--font-size-xxlarge); color:var(--color-point); font-weight: 600; text-transform: uppercase;}
.section-vision .left-wrap .tlt{font-size:var(--font-size-xhuge); color:#fff; font-weight: 900; text-transform: uppercase; line-height: 110%;}
.section-vision .left-wrap .tlt span:nth-child(-n+3){color:var(--color-point);}
.section-vision .left-wrap .cont{font-size:var(--font-size-large); color:#fff; font-weight: 400; margin-top:20px; line-height: 150%;}
.section-vision .right-wrap{width:calc(50% - 20px); max-width:330px;}
.section-vision .right-wrap > .inner-box{margin-bottom:var(--gap-40);}
.section-vision .right-wrap > .inner-box:last-child{margin-bottom:0;}
.section-vision .right-wrap > .inner-box > *{margin-bottom:10px;}
.section-vision .right-wrap > .inner-box > *:last-child{margin-bottom:0;}
.section-vision .right-wrap > .inner-box > div{margin-left:30px; width:calc(100% - 30px);}
.section-vision .right-wrap > .inner-box .tlt{color:#fff; font-weight: 900; font-size:var(--font-size-xxlarge);}
.section-vision .right-wrap > .inner-box .cont{color:var(--color-font); font-size:var(--font-size-normal);}




.section-team{padding:var(--gap-140) 0; margin-top:var(--gap-400);}
.section-team .left-wrap{width:calc(50% - 20px); max-width:460px;}
.section-team .left-wrap .stlt{font-size:var(--font-size-xxlarge); color:var(--color-point); font-weight: 600; text-transform: uppercase;}
.section-team .left-wrap .tlt{font-size:var(--font-size-xhuge); color:#fff; font-weight: 900; text-transform: uppercase; line-height: 110%;}
.section-team .left-wrap .cont{font-size:var(--font-size-large); color:#fff; font-weight: 400; margin-top:20px; line-height: 150%;}
.section-team .right-wrap {width:calc(50% - 20px); max-width:756px; display: flex; justify-content: center; align-items: center; perspective: 1000px; } 
.section-team .cube { position: relative; width: 100px; height: 100px; transform-style: preserve-3d; animation: rotateCube 10s infinite linear; } 
.section-team .cube .face { position: absolute; width: 100px; height: 100px; background-color: transparent; border: 2px solid var(--color-point); box-sizing: border-box; } 
.section-team .cube .front { transform: rotateY(0deg) translateZ(50px); background-color:var(--color-point); } 
.section-team .cube .back { transform: rotateY(180deg) translateZ(50px); } 
.section-team .cube .left { transform: rotateY(-90deg) translateZ(50px); } 
.section-team .cube .right { transform: rotateY(90deg) translateZ(50px); } 
.section-team .cube .top { transform: rotateX(90deg) translateZ(50px); } 
.section-team .cube .bottom { transform: rotateX(-90deg) translateZ(50px); } 
.section-team .bottom-wrap{width:100%; margin-top:var(--gap-80); display:flex; flex-wrap:wrap; justify-content: space-between;}
.section-team .bottom-wrap > .inner-box{width:calc(25% - 30px);}
.section-team .bottom-wrap > .inner-box > img{margin:0 auto var(--gap-40) auto; display:block;}
.section-team .bottom-wrap > .inner-box > .tlt{color:#fff; font-weight: 600; font-size:var(--font-size-xxlarge); margin-bottom:10px; text-align: center; text-transform: uppercase;}
.section-team .bottom-wrap > .inner-box > .stlt{color:var(--color-font); font-size:var(font-size-normal); text-align: center;}
@keyframes rotateCube { 0% { transform: rotateX(0deg) rotateY(0deg); } 100% { transform: rotateX(360deg) rotateY(360deg); } }




.section-history{padding:var(--gap-140) 0; margin-top:var(--gap-400); overflow: hidden;}
.section-history .title-wrap{width:100%;}
.section-history .title-wrap .stlt{font-size:var(--font-size-xxlarge); color:var(--color-point); font-weight: 600; text-transform: uppercase;}
.section-history .title-wrap .tlt{font-size:var(--font-size-xhuge); color:#fff; font-weight: 900; text-transform: uppercase; line-height: 110%;}
.section-history .contents-container{width:100%; overflow: hidden; margin-top:var(--gap-140); overflow-x: auto; position: relative; white-space: nowrap; padding:var(--gap-40) 0;}
.contents-container::-webkit-scrollbar {height: 3px;background: #3A3A3A;}
.contents-container::-webkit-scrollbar-thumb {background-color: var(--color-point); border-radius: 5px;}
.contents-container::-webkit-scrollbar-track {background: #3A3A3A;}
.timeline-container { display: inline-flex; gap:var(--gap-140); position: relative; width: max-content; white-space: normal; padding:0 40px; }
.section-history .timeline-line{position:absolute; top:5px; left:0; z-index: -1; width:100%; height: 1px; background-color:#3A3A3A;}
.section-history .timeline-year{display:inline-block; width:auto;}
.section-history .event-point{width:10px; height: 10px; background-color:var(--color-point); border-radius: 50%; margin:0 auto var(--gap-30) auto;}
.section-history h2{color:var(--color-point); font-size:var(--font-size-xxlarge); font-weight: 600; margin-bottom:var(--gap-30);}
.section-history .year-wrap{display: inline-block; width:auto; text-align: center;}
.section-history .event{text-align: left; margin-bottom:var(--gap-5); font-weight: 200;}
.section-history .event:last-child{margin-bottom:0;}
.section-history .event .number{margin-right:var(--gap-20); color:var(--color-font); font-size:var(--font-size-normal); font-weight: 900;}
.section-history .event-content{display:flex; align-items: center;}
.section-history .event-content > p{color:#fff; font-size:var(--font-size-normal);}



.section-partners{padding:var(--gap-140) 0; margin-top:var(--gap-400); overflow: hidden; }
.section-partners .title-wrap{width:100%;}
.section-partners .title-wrap .stlt{font-size:var(--font-size-xxlarge); color:var(--color-point); font-weight: 600; text-transform: uppercase;}
.section-partners .title-wrap .tlt{font-size:var(--font-size-xhuge); color:#fff; font-weight: 900; text-transform: uppercase; line-height: 110%;}
.section-partners .logo-wrap{display:flex; flex-wrap:wrap; gap: 80px 6%; justify-content: space-evenly; align-items: center; margin-top:var(--gap-140);}
.section-partners .logo-wrap > img{width:20%; max-height:90px; transform-style: preserve-3d; transition: all 1.5s ease-in-out;  opacity:0;}
.section-partners .logo-wrap > img:nth-child(even){transform: rotate3d(1,-1,0,60deg);}
.section-partners .logo-wrap > img:nth-child(odd){transform: rotate3d(-1,1,0,60deg);}



@media only screen and (max-width:1020px){
	.section-team .left-wrap .cont > br{display:none;}
}

@media only screen and (max-width:993px){
	.section-vision .left-wrap .tlt{font-size:var(--font-size-huge);}
	.section-partners .logo-wrap{flex-wrap:wrap; gap: 60px 6%;}
}

@media only screen and (max-width:821px){
	.section-team .left-wrap{width:calc(60% - 20px);}
	.section-team .right-wrap {width:calc(40% - 20px);}
}

@media only screen and (max-width:780px){
	.section-overview .text-wrap{margin-top:150px;}
	.section-overview .text-wrap .stlt{font-size:var(--font-size-xlarge);}
	.section-overview .text-wrap .tlt{font-size:var(--font-size-xxxxlarge);}
	.section-overview .text-wrap .cont{font-size:var(--font-size-normal);}
	
	.section-overview .image-wrap .image-inner-wrap > .inner-wrap{ background-size: auto calc(170%); }
	
	.section-vision .left-wrap .stlt{font-size:var(--font-size-xlarge);}
	.section-vision .left-wrap .tlt{font-size:var(--font-size-xxxxlarge);}
	.section-vision .left-wrap .cont{font-size:var(--font-size-normal);}
	.section-vision .right-wrap > .inner-box .tlt{font-size:var(--font-size-xlarge);}
	
	.section-team .left-wrap .stlt{font-size:var(--font-size-xlarge);}
	.section-team .left-wrap .tlt{font-size:var(--font-size-xxxxlarge);}
	.section-team .left-wrap .cont{font-size:var(--font-size-normal);}
	.section-team .bottom-wrap > .inner-box > .tlt{font-size:var(--font-size-large);}
	
	.section-history .title-wrap .stlt{font-size:var(--font-size-xlarge);}
	.section-history .title-wrap .tlt{font-size:var(--font-size-xxxxlarge);}
	
	.section-partners .title-wrap .stlt{font-size:var(--font-size-xlarge);}
	.section-partners .title-wrap .tlt{font-size:var(--font-size-xxxxlarge);}
	
	.section-team .cube { position: relative; width: 50px; height:50px; transform-style: preserve-3d; animation: rotateCube 10s infinite linear; } 
	.section-team .cube .face { position: absolute; width: 50px; height: 50px; background-color: transparent; border: 2px solid var(--color-point); box-sizing: border-box; } 
	.section-team .cube .front { transform: rotateY(0deg) translateZ(25px); background-color:var(--color-point); } 
	.section-team .cube .back { transform: rotateY(180deg) translateZ(25px); } 
	.section-team .cube .left { transform: rotateY(-90deg) translateZ(25px); } 
	.section-team .cube .right { transform: rotateY(90deg) translateZ(25px); } 
	.section-team .cube .top { transform: rotateX(90deg) translateZ(25px); } 
	.section-team .cube .bottom { transform: rotateX(-90deg) translateZ(25px); } 
	
	.section-partners .logo-wrap{flex-wrap:wrap; gap: 40px 10%; perspective: 1000px;}
	.section-partners .logo-wrap > img{width:17%; max-height:90px;}
}

@media only screen and (max-width:640px){
	.subtop-wrap > .inner-wrap > .threed-dwrap{width:calc(100vw - var(--layout-flax-margin));}
	.section-overview .text-wrap .cont br{display:none;}
	.subtop-wrap > .inner-wrap > .threed-dwrap{width:300px; top:30px;}
	.section-vision .right-wrap > .inner-box > img{width:15px; height: 15px;}
	.section-vision .right-wrap > .inner-box > div{margin-left:15px; width:calc(100% - 15px);}
	.section-vision .right-wrap > .inner-box .cont > br{display:none;}
	.section-partners .logo-wrap{flex-wrap:wrap; gap: 40px 15%;}
	.section-partners .logo-wrap > img{width:23%; max-height:90px;}
}

@media only screen and (max-width:560px){
	.section-overview .text-wrap{width:100%; margin-top:0px;}
	.section-overview .image-wrap{width:81%; margin-left: 19%; margin-top:var(--gap-40);}
}

@media only screen and (max-width:500px){
	.left-location p.tlt {font-size: var(--font-size-normal); }
	.left-location p.stlt{font-size: var(--font-size-normal);}
	.left-location .tlt-wrap {width:21px;}
	.left-location .stlt-wrap{width:21px;}
	.section-overview .text-wrap{margin-top:0;}
	.section{display:flex; justify-content: flex-end;}
	.section > .inner-wrap{width:calc(100% - 81px); margin:0 20px 0 0;}
}

@media only screen and (max-width:425px){
	.section-vision .left-wrap{width:100%; margin-bottom:var(--gap-80);}
	.section-vision .right-wrap{width:100%;}
	.section-vision .right-wrap > .inner-box .cont > br{display:block;}
	.section-team .bottom-wrap > .inner-box{width:calc(50% - 20px);}
	.section-team .bottom-wrap > .inner-box:nth-child(1){margin-bottom:var(--gap-40);}
	.section-team .bottom-wrap > .inner-box:nth-child(2){margin-bottom:var(--gap-40);}
}

@media only screen and (max-width:375px){
	.section-overview .image-wrap .image-inner-wrap > .inner-wrap{ background-size: auto calc(200%); }	
}

@media only screen and (max-width:370px){
	.section-overview .text-wrap{width:100%;}
}

@media only screen and (max-width:340px){
	.subtop-wrap > .inner-wrap > .threed-dwrap{width:calc(100vw - var(--layout-flax-margin));}
}