/* .main-visual */
.main-visual { position: relative; height: 100vh; overflow: hidden; } 
.main-visual .main-visual-slider, 
.main-visual .main-visual-slider .slick-list, .main-visual .main-visual-slider .slick-track { position: relative; height: 100%; } 
.main-visual .main-visual-slider .slick-slide { position: relative; } 
.main-visual .main-visual-slider .slick-slide a { position: relative; display: inline-block; width: 100%; height: 100%; cursor: default; } 
.main-visual .main-visual-slider .slick-slide a .txt-wrap { height: 70vh; position: absolute; top: 50%; left: 100px; transform: translateY(-50%); z-index: 9; } 
.main-visual .main-visual-slider .slick-slide a .txt-wrap.flex { width: 100%; max-width: 1720px; display: flex; justify-content: space-between; } 
.main-visual .main-visual-slider .slick-slide a .txt-wrap h6 { font-family: "NanumSquare"; font-size: 36px; font-weight: 400; line-height: 54px; text-align: left; color: #FFFFFF; } 
.main-visual .main-visual-slider .slick-slide a .txt-wrap h2 { font-family: "NanumSquare"; font-size: 60px; font-weight: 300; line-height: 78px; text-align: left; color: #FFFFFF; margin: 20px 0 40px; } 
.main-visual .main-visual-slider .slick-slide a .txt-wrap h2 span { font-family: "NanumSquare"; font-size: 60px; font-weight: 700; line-height: 78px; text-align: left; color: #FFFFFF; } 
.main-visual .main-visual-slider .slick-slide a .txt-wrap p { font-family: "NanumSquare"; font-size: 30px; font-weight: 400; line-height: 45px; text-align: left; color: #FFFFFF; } 
.main-visual .main-visual-slider .slick-slide a .img { width: 100%; height: 100vh; position: absolute; top: 0; left: 0; clip-path: circle(100%); transform: translateY(0); background-size: cover; background-repeat: no-repeat; background-position: center center; transition: all 3s; } 
.main-visual .main-visual-slider .slick-slide a .img img { position: relative; display: block; height: 100%; width: 100%; left: 50%; transform: translateX(-50%) scale(1.3); transition: all 3s; } 
.main-visual .main-visual-slider .slick-slide.slick-active a .img.on img { transform: translateX(-50%) scale(1); transition: all 3s; } 
.main-visual .main-visual-slider .slick-slide a .img.on { animation: clipOn 3s cubic-bezier(0.19, 0.82, 0.29, 1.01) forwards; } 
.main-visual .main-visual-slider .slick-slide a .dim { position: absolute; top:0; left:0; width: 100%; height:100%; background: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); z-index: 9; } 
.main-visual .main-visual-slider .slick-slide a .dim-bl { position: absolute; top:0; left:0; width: 100%; height:100%; background: rgba(1, 17, 75, 0.5); z-index: 9; } 
.main-visual .main-visual-slider .slick-slide a .dim-bk { position: absolute; top:0; left:0; width: 100%; height:100%; background: rgba(0, 0, 0, 0.1); z-index: 9; } 
.main-visual .control { display: flex; align-items: center; position: absolute; height: 50px; top: 88vh; left: 100px; color: #fff; z-index: 1; } 
.main-visual .control .prev,
.main-visual .control .next { margin: 1px 1rem 0; cursor: pointer; } 
.main-visual .control .play,
.main-visual .control .stop { display: inline-flex; align-items: center; justify-content: center; width: 50px; height: 50px; border-radius: 50%; border: 2px solid #B4B9C0; } 
.main-visual .control .play { display: none; cursor: pointer; } 
.main-visual .control > strong { font-size: 18px; font-weight: 800; line-height: 1; text-align: center; color: #FFFFFF; } 
.main-visual .control > p { font-size: 18px; font-weight: 400; line-height: 1; text-align: center; color: #FFFFFF; } 
.main-visual .control .bar { position: relative; display: inline-block; width: 160px; height: 2px; background: #828a95; margin: 0 0.5rem; } 
.main-visual .control .bar::before { content: ""; display: block; position: absolute; height: 100%; width: 0; left: 0; background: #fff; } 
.main-visual .control .pro-ani::before { animation: proBar 5.5s 1; width: 100%; } 
.slick-prev.slick-arrow, .slick-next.slick-arrow,.slick-dots { display: none !important; } 
@keyframes proBar { 
 0% { width:0; } 
100% { width:100%; } 
 }

 .vision { position: relative; padding: 200px 0; background: url("/asset_eng/image/bg/company-vision.jpg") no-repeat center center / cover; } 
 .vision .dim { position: absolute; top:0; left:0; width: 100%; height:100%; background: rgba(0, 0, 0, 0.3); z-index: 1; } 
 .vision > p { font-size: 24px; font-weight: 800; line-height: 36px; text-align: center; color: #FFFFFF; margin-bottom: 20px; position: relative; z-index: 2; } 
.vision h2 { font-size: 72px; font-weight: 800; line-height: 72px; text-align: center; color: #FFFFFF; position: relative; z-index: 2; } 
 .vision ul { max-width: 1720px; margin: 100px auto 0; } 
 .vision ul li { width: 100%; height: 250px; border-radius: 200px; padding: 30px 99.5px; background: #00000099; border: 1px solid #FFFFFF66; display: flex; align-items: center; position: relative; z-index: 2; gap: 60px; } 
 .vision ul>:nth-child(1) { margin-bottom: 20px; } 
 .vision ul li > :nth-child(1) { width: 135px; } 
 .vision ul li img { } 
 .vision ul li > h5 { display: block; width: 317px; font-size: 42px; font-weight: 800; line-height: 54.6px; text-align: left; color: #51CBFF; } 
 .vision ul li > :nth-child(3) { } 
 .vision ul li > :nth-child(3) p { font-size: 30px; font-weight: 800; line-height: 45px; text-align: left; color: #FFFFFF; margin-bottom: 20px; } 
 .vision ul li > :nth-child(3) span { font-size: 20px; font-weight: 400; line-height: 30px; text-align: left; color: #FFFFFF; } 


 .history { padding: 300px 0; background: url("/asset_eng/image/bg/company-history.png") no-repeat center center / cover; } 
 .history > p { font-size: 24px; font-weight: 800; line-height: 36px; text-align: center; margin-bottom: 20px; color: #FFFFFF; } 
.history h2 { font-size: 72px; font-weight: 800; line-height: 72px; text-align: center; margin-bottom: 50px; color: #FFFFFF; } 
.history .sub-title { font-size: 30px; font-weight: 400; line-height: 45px; text-align: center; color: #FFFFFF; } 
 .history .cont-wrap { position: relative; margin: 100px auto 0; width: 1720.25px; height: 2390px; } 
 .history .cont-wrap .line { position: absolute; top: 107px; left: 112px; } 
 .history .cont-wrap .year-2024 { position: absolute; top: 0; left: 50%; transform: translateX(-50%); } 
 .history .cont-wrap .year-2023 { position: absolute; top: 690px; right: 160px; transform: translateX(-50%); } 
 .history .cont-wrap .year-2022 { position: absolute; bottom: 1000px; left: 500px; transform: translateX(-50%); } 
 .history .cont-wrap ul li { width: 520px; display: inline-block; padding: 50px; background: #0000004D;; border-radius: 50px; } 
 .history .cont-wrap ul li>img { margin-bottom: 50px; } 
 .history .cont-wrap ul li .date { font-size: 30px; font-weight: 800; line-height: 45px; text-align: left; margin-bottom:20px; color: #51CBFF; } 
 .history .cont-wrap ul li .memo { font-size: 20px; font-weight: 400; line-height: 30px; text-align: left; color: #FFFFFF; margin-bottom:50px; } 
 .history .cont-wrap ul li .memo-sm { font-size: 17px; font-weight: 400; line-height: 25.6px; text-align: left; color: #FFFFFF; margin-bottom:50px; } 
 .history .cont-wrap ul li .memo.strong { font-weight: 800; } 
 .history .cont-wrap ul>:nth-child(1) { position: absolute; top: 180px; left: 0; } 
 .history .cont-wrap ul>:nth-child(2) { position: absolute; top: 980px; right: 0; } 
 .history .cont-wrap ul>:nth-child(3) { position: absolute; bottom: -120px; left: 0; } 
 .history .cont-wrap .circle-wrap li { background: none; width: 40px; height: 40px; padding: 0; } 

 .history .cont-wrap .circle-wrap>:nth-child(1) { position: absolute; top: 88px; left: 100px; } 
 .history .cont-wrap .circle-wrap>:nth-child(2) { position: absolute; top: 88px; left: 400px; } 
 .history .cont-wrap .circle-wrap>:nth-child(3) { position: absolute; top: 300px; left: 1205px; } 
 .history .cont-wrap .circle-wrap>:nth-child(4) { position: absolute; top: 520px; left: 1000px; } 
 .history .cont-wrap .circle-wrap>:nth-child(5) { position: absolute; top: 658px; left: 650px; } 
 .history .cont-wrap .circle-wrap>:nth-child(6) { position: absolute; top: 658px; left: 1050px; } 
 .history .cont-wrap .circle-wrap>:nth-child(7) { position: absolute; top: 921px; left: 730px; } 
 .history .cont-wrap .circle-wrap>:nth-child(8) { position: absolute; top: 921px; left: 1010px; } 
 .history .cont-wrap .circle-wrap>:nth-child(9) { position: absolute; top: 1207px; left: 1080px; } 
 .history .cont-wrap .circle-wrap>:nth-child(10) { position: absolute; top: 1163px; left: 733px; } 
 .history .cont-wrap .circle-wrap>:nth-child(11) { position: absolute; top: 1248px; left: 700px; } 

 .location { max-width: 1720px; margin: 0 auto; padding: 200px 0; } 
 .location > p { font-size: 24px; font-weight: 800; line-height: 36px; text-align: center; color:#0046FF; margin-bottom: 20px; } 
 .location h2 { font-size: 72px; font-weight: 800; line-height: 72px; text-align: center; color: #000000; } 
 .location .map { margin-top: 100px; } 
 .location .map iframe { width: 100%; } 
 .location ul { margin-top: 70px; } 
 .location ul li { padding: 30px 0; border-bottom: 1px solid #CCCCCC; display: flex; align-items: center; } 
 .location ul>:nth-child(1) { padding-top: 30px; } 
 .location ul li .icon-wrap { width: 74px; height: 74px; border-radius: 50%; background: #D6E3F5; position: relative; } 
 .location ul li .icon-wrap img { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); } 
 .location ul li p { width: 330px; font-size: 30px; font-weight: 800; line-height: 45px; text-align: left; } 
.location ul li span { font-size: 20px; font-weight: 400; line-height: 30px; text-align: left; color: #777777; } 

 .location ul li > div { display: flex; gap: 50px; align-items: center; } 
 .location ul li > div.align-s { align-items: flex-start; } 
 .location ul li.load > div > div { } 
 .location ul li.load >:nth-child(3) > :nth-child(1) { width: 415px; } 
 .location ul li.load >:nth-child(3) > :nth-child(2) { display: flex; flex-direction: column; } 
 .location ul li > div > div p { font-size: 20px; font-weight: 800; line-height: 30px; text-align: left; margin-bottom: 20px; } 
 .location ul li > div > div span { font-size: 20px; font-weight: 400; line-height: 30px; text-align: left; } 
 .location ul li > div > div span.strong { font-weight: 800; } 
 .location ul li > div > div > div { display: flex; } 
.location ul li > div > div > div >div { width: 415px; display: flex; flex-direction: column; } 
 @media screen and (max-width:1720px){
 .mo-dn-1700 { display: none; } 
 .main-visual .main-visual-slider .slick-slide a .txt-wrap.flex { max-width: calc(100% - 40px); justify-content: flex-start; } 
 .history { background: url("/asset_eng/image/bg/company-history.png") no-repeat 0 center / cover; } 
 .history .cont-wrap { width: calc(100% - 40px); height: auto; } 
 .history .cont-wrap ul li { width: calc(100% - 44px); margin-left: 44px; display: inline-block; padding: 20px; background: #0000004D;; border-radius: 10px; } 
 .history .cont-wrap ul li>img { width: 40px; margin-bottom: 20px; } 
 .history .cont-wrap ul li > div { margin-bottom: 50px; } 
 .history .cont-wrap ul li >:last-child { margin-bottom: 0; } 
 .history .cont-wrap ul li .date { font-size: 24px; font-weight: 800; line-height: 31.2px; text-align: left; color:#51CBFF; margin-bottom: 20px; } 
 .history .cont-wrap ul li .memo { font-size: 17px; font-weight: 400; line-height: 22.4px; text-align: left; } 
 .history .cont-wrap ul li .memo.strong { font-weight: 400; } 
 .history .cont-wrap ul li .memo.strong-mo { font-weight: 800; } 
 .history .cont-wrap ul li .memo-sm { font-size: 14px; font-weight: 400; line-height: 19.6px; text-align: left; } 
 .history .cont-wrap ul { display: flex; gap:40px; flex-direction: column; } 
 .history .cont-wrap ul>:nth-child(1) { position: static; } 
 .history .cont-wrap ul>:nth-child(2) { position: static; } 
 .history .cont-wrap ul>:nth-child(3) { position: static; } 
 .history .cont-wrap .line { position: absolute; top: 110px; left: 12px; width: 2px; border-left: 2px dashed rgba(0,0,0,0.4); height: 2263px; } 
 .history .cont-wrap .circle-wrap li { width: 24px; height: 24px; } 
 .history .cont-wrap .circle-wrap li img { width: 100%; } 
 .history .cont-wrap .circle-wrap>:nth-child(1) { position: absolute; top: 87px; left: -42px; } 
 .history .cont-wrap .circle-wrap>:nth-child(2) { position: absolute; top: 372px; left: -42px; } 
 .history .cont-wrap .circle-wrap>:nth-child(3) { position: absolute; top: 866px; left: -42px; } 
 .history .cont-wrap .circle-wrap>:nth-child(4) { position: absolute; top: 1033px; left: -42px; } 
 .history .cont-wrap .circle-wrap>:nth-child(5) { position: absolute; top: 1199px; left: -42px; } 
 .history .cont-wrap .circle-wrap>:nth-child(6) { position: absolute; top: 1364px; left: -42px; } 
 .history .cont-wrap .circle-wrap>:nth-child(7) { position: absolute; top: 1608px; left: -42px; } 
 .history .cont-wrap .circle-wrap>:nth-child(8) { position: absolute; top: 1773px; left: -42px; } 
 .history .cont-wrap .circle-wrap>:nth-child(9) { position: absolute; top: 2025px; left: -42px; } 
 .history .cont-wrap .circle-wrap>:nth-child(10) { position: absolute; top: 2170px; left: -42px; } 
 .history .cont-wrap .circle-wrap>:nth-child(11) { position: absolute; top: 2358px; left: -42px; } 
 .location { max-width: 100%; width: calc(100% - 40px); margin: 0 auto; padding: 200px 0; } 
 .location ul li > div.align-s { flex-direction: column; gap: 30px; } 
 .vision ul { width: calc(100% - 40px); margin: 0 auto; padding: 200px 0; } 
 }
 @media screen and (max-width:1600px) { } 
 @media screen and (max-width:1500px){
 .vision ul { width: calc(100% - 40px); height: auto; margin: 50px auto 0; } 
 .vision ul li { width: 100%; height: auto; } 
 .vision ul li > h5 { width: 180px; } 
 }
 @media screen and (max-width:1440px) { } 
 @media screen and (max-width:1200px){
 .location ul li > div > div > div >div { width: 360px; } 
 }
 @media screen and (max-width:1125px){
 .main-visual-slider .slick-track,.main-visual .main-visual-slider .slick-slide a .img { height: 100%; } 
.main-visual .main-visual-slider .slick-slide a .img img { width: auto; } 
.main-visual .main-visual-slider .slick-slide a .txt-wrap,.main-visual .control { left: 20px; } 
.main-visual .main-visual-slider .slick-slide a .txt-wrap.flex { flex-direction: column; gap: 0; justify-content: flex-start; } 
.main-visual .main-visual-slider .slick-slide a .txt-wrap.flex img { width: calc(100% - 40px); margin: 0 auto; } 
.main-visual .control .bar { width: 80px; margin-bottom: 6px; } 
.main-visual .control > strong { margin-right: 5px; padding-bottom: 3px; } 
.main-visual .control > p { margin-left: 5px; padding-bottom: 3px; } 

 .vision { padding: 80px 20px; } 
 .vision p { font-size: 14px; font-weight: 800; line-height: 19.6px; text-align: center; } 
 .vision h2 { font-size: 38px; font-weight: 800; line-height: 49.4px; text-align: center; } 
 .vision ul {width: 100%; margin: 0 auto; padding: 80px 0;}
 .vision ul li { padding: 30px; border-radius: 20px; display: flex; flex-direction: column; align-items: baseline; gap:20px; } 
 .vision ul li img { } 
 .vision ul li h5 { font-size: 30px; font-weight: 800; line-height: 39px; text-align: left; color: #51CBFF; margin: 0; } 
 .vision ul li > :nth-child(3) { } 
 .vision ul li > :nth-child(3) p { font-size: 18px; font-weight: 800; line-height: 27px; text-align: left; margin-bottom: 10px; } 
 .vision ul li > :nth-child(3) span { font-size: 17px; font-weight: 400; line-height: 22.4px; text-align: left; } 

 .history { padding: 80px 20px; } 
 .history p { font-size: 14px; font-weight: 800; line-height: 19.6px; text-align: center; margin-bottom: 10px; } 
 .history h2 { font-size: 38px; font-weight: 800; line-height: 49.4px; text-align: center; margin-bottom: 20px; } 
 .history p.sub-title { font-size: 18px; font-weight: 400; line-height: 27px; text-align: center; } 
 .history .cont-wrap { width: 100%; margin: 50px auto 0; } 
 .location { padding: 80px 0; } 
 .location p { font-size: 14px; font-weight: 800; line-height: 19.6px; text-align: center; } 
 .location h2 { font-size: 38px; font-weight: 800; line-height: 49.4px; text-align: center; } 
 .location ul { margin-bottom: 50px; } 
 .location ul li { flex-direction: column; align-items: baseline; gap: 20px; } 
 .location ul>:nth-child(1) { } 
 .location ul li .icon-wrap { } 
 .location ul li .icon-wrap img { } 
 .location ul li p { } 
 .location ul li span { margin-left: 0; } 
 .location ul li > div {width: 100%; flex-direction: row; align-items: center; } 
 .location ul li.load > div > div { } 
 .location ul li.load >:nth-child(3) > :nth-child(1) { } 
 .location ul li.load >:nth-child(3) > :nth-child(2) { } 
 .location ul li.load>:nth-child(2) { flex-direction: column; align-items: baseline; } 
 .location ul li > div > div p {width: 100%; margin-bottom: 10px; margin-left: 0; } 
 .location ul li > div > div span {display: block; width: 100%;} 
 .location ul li > div > div span.strong { } 
 .location ul li > div > div > div { flex-direction: column; align-items: baseline; gap:10px; } 
 .location ul li > div > div > div >div { } 
 }
@media screen and (max-width:992px) { } 
@media screen and (max-width:768px) {.main-visual-slider .slick-track,.main-visual .main-visual-slider .slick-slide a .img { height: 100%; } 
.main-visual .main-visual-slider .slick-slide a .txt-wrap h6 { font-size: 18px; font-weight: 400; line-height: 27px; text-align: left; } 
.main-visual .main-visual-slider .slick-slide a .txt-wrap h2 { font-size: 32px; line-height: 41.6px; text-align: left; margin: 10px 0 20px; } 
.main-visual .main-visual-slider .slick-slide a .txt-wrap h2 span { font-size: 32px; line-height: 41.6px; text-align: left; } 
.main-visual .main-visual-slider .slick-slide a .txt-wrap p { font-size: 18px; font-weight: 400; line-height: 27px; text-align: left; } 
.main-visual .control { left: 20px; } 
 .beyond-wrap > ul li .img-wrap { width: 100%; } 
 }
@media screen and (max-width:600px) { } 
@media screen and (max-width:480px) { } 
@media screen and (max-width:380px){
 .circle-wrap { width: 100%; } 
 }