html,body{position:relative; min-width:1440px;}
.inner{max-width:1440px; margin:0 auto;}
@media (max-width:1440px){
  .inner{margin:0 2rem;}
}

/* visual-swiper */
.visual-swiper{position:relative; overflow:hidden;}
.visual-swiper .inner{position:relative;}
@media (max-width:1600px){
  .visual-swiper .inner{padding:0 8rem;}
}
@media (max-width:1024px){
  .visual-swiper .inner{padding:0 8rem; margin:0 2rem; padding:0;}
}
.visual-swiper .swiper-slide{position:relative; overflow:hidden;}
.visual-swiper .swiper-slide.dark::before{
  display:inline-block; width:100%; height:100%; left:0; top:0;
  background:rgba(0,0,0,.1); z-index:2;
}
.visual-swiper .swiper-slide video::before{
  display:inline-block; width:100%; height:100%; left:0; top:0; background:#000;
}
.visual-swiper .swiper-slide .bg{
  position:absolute; width:100%; height:100%; left:0; top:0;
  background:no-repeat center; background-size:cover; z-index:1;
}
.visual-swiper .swiper-slide .bg video{
  position:inherit; width:inherit; height:inherit; left:0; top:0; object-fit:cover;
}
.visual-swiper .swiper-slide .inner{
  position:relative; height:100vh; line-height:100vh; font-size:0; z-index:3;
}
.visual-swiper .swiper-slide .inner .el{display:inline-block; line-height:1; vertical-align:middle; color:#fff;}
.visual-swiper .swiper-slide .inner .el h2{font-size:7.2rem; letter-spacing:-3px; text-transform:uppercase;}
.visual-swiper .swiper-slide .inner .el p{font-size:2.4rem; font-weight:100;}
@media (max-width:1024px){
  .visual-swiper .swiper-slide .inner .el h2{font-size:6.5rem;}
  .visual-swiper .swiper-slide .inner .el p{font-size:2rem;}
}
.visual-swiper .func{
  position:absolute; width:100%; left:0; top:50%; margin-top:15rem; z-index:1;
}
.visual-swiper .func .visual-pagination{margin-right:5rem;}
.visual-swiper .func .visual-pagination button{position:relative;}
.visual-swiper .func .visual-pagination button span{
  position:absolute; left:calc(50% - 1px); top:calc(50% - 1px);
  transform:translate(-50%, -50%); font-size:1.5rem; color:#fff; font-weight:900; opacity:.2;
}
.visual-swiper .func .visual-pagination button .progress{stroke-dasharray:200; stroke-dashoffset:200;}
.visual-swiper .func .visual-pagination button svg{visibility:hidden;}
.visual-swiper .func .visual-pagination button.visual-bullets-active svg{visibility:visible;}
.visual-swiper .func .visual-pagination button.visual-bullets-active .progress{
  animation:dashdraw 15s linear forwards;
}
.visual-swiper .func .visual-pagination button.visual-bullets-active .progress.pause{animation-play-state:paused;}
.visual-swiper .func .visual-pagination button.visual-bullets-active .progress.play{animation-play-state:running;}
.visual-swiper .func .visual-pagination button.visual-bullets-active span{opacity:1;}
@keyframes dashdraw{to{stroke-dashoffset:0;}}

.visual-swiper .func button[aria-pressed]{
  position:relative; width:10px; height:13px; margin:0 2rem; opacity:.5;
}
.visual-swiper .func button[aria-pressed][aria-pressed=false]::before,
.visual-swiper .func button[aria-pressed][aria-pressed=false]::after{
  display:inline-block; width:3px; height:100%; top:0; background:#fff;
}
.visual-swiper .func button[aria-pressed][aria-pressed=false]::before{left:0;}
.visual-swiper .func button[aria-pressed][aria-pressed=false]::after{right:0;}
.visual-swiper .func button[aria-pressed][aria-pressed=true]::before{
  display:inline-block; border:5px solid rgba(0,0,0,0); border-left:6px solid #fff; left:3px; top:0;
}

.visual-swiper .scroll-animation{
  position:absolute; height:14px; line-height:14px; left:2rem; top:50%;
  margin-top:-5rem; color:#fff; z-index:2; transform:rotate(-90deg);
}
.visual-swiper .scroll-animation::before{
  display:inline-block; width:6rem; height:1px; right:6rem; top:50%; background:#fff; opacity:.2;
}
.visual-swiper .scroll-animation::after{
  display:inline-block; width:0; height:1px; right:6rem; top:50%;
  background:#fff; animation:scrollDownWidth 3s ease infinite;
}
.visual-swiper .scroll-animation i{letter-spacing:1px; font-size:11px;}
.visual-swiper .scroll-animation i::before{
  display:inline-block; width:5px; height:5px; border-radius:5px; right:6rem; top:50%;
  margin-top:-2.5px; background:#fff; animation:scrollDown 3s ease infinite;
}
@keyframes scrollDownWidth{from{width:0;} to{width:6rem;}}
@keyframes scrollDown{from{right:6rem;} to{right:12rem;}}

/* news */
.news{position:relative; margin:10rem auto; overflow:hidden;}
.news .inner .news-tab{position:relative; margin-bottom:5rem; white-space:nowrap;}
.news .inner .news-tab .el{overflow:scroll; padding-right:10rem;}
.news .inner .news-tab button{height:3rem; margin-right:4rem; font-size:2.4rem; font-weight:700; color:#999;}
.news .inner .news-tab button:last-child{margin-right:0;}
.news .inner .news-tab button.active{color:#111;}
.news .inner .news-tab::before{
  display:inline-block; width:10rem; height:100%; right:0; top:0;
  background:linear-gradient(to right, rgba(255,255,255,0) 0%, rgb(255,255,255) 70%, rgb(255,255,255) 100%);
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#00ffffff", endColorstr="#ffffff", GradientType=1);
}
.news .inner h3{
  height:3rem; line-height:3rem; margin-bottom:5rem; font-size:2.4rem; font-weight:700; color:#111;
}
.news .inner .tab-contents{position:absolute; left:0; top:0; visibility:hidden; opacity:0;}
.news .inner .tab-contents.active{position:relative; visibility:visible; opacity:1;}

.news .inner .tab-swiper{position:relative;}
.news .inner .tab-swiper .swiper-container{margin:-1rem;}
.news .inner .tab-swiper .swiper-container .swiper-slide{padding:1rem;}
.news .inner .tab-swiper .swiper-container .swiper-slide a{
  position:relative; display:block; height:35rem; padding:8rem 3rem;
  border:1px solid #dbdddf; background:#fff; transition:all .3s ease;
}
.news .inner .tab-swiper .swiper-container .swiper-slide a:hover{
  border-color:#7a8085; box-shadow:0 0 1rem rgba(0,0,0,.1);
}
.news .inner .tab-swiper .swiper-container .swiper-slide a mark{
  position:absolute; left:3rem; top:0; padding:2rem; font-size:1.4rem; color:#fff; background:#2569c9;
}
.news .inner .tab-swiper .swiper-container .swiper-slide a em{font-size:2.2rem;}
.news .inner .tab-swiper .swiper-container .swiper-slide a p{margin-top:4rem; font-size:1.6rem; color:#454545;}
.news .inner .tab-swiper .swiper-container .swiper-slide a sub{
  position:absolute; left:3rem; bottom:3rem; font-size:1.4rem; color:#999;
}

/* CEO swiper */
.news .inner .ceo-swiper{position:relative;}
.news .inner .ceo-swiper .swiper-container{margin:-1rem;}
.news .inner .ceo-swiper .swiper-container .swiper-slide{padding:1rem; overflow:hidden;}
.news .inner .ceo-swiper .swiper-container .swiper-slide a{
  position:relative; display:block; height:35rem; background:#fff no-repeat center; overflow:hidden;
}
.news .inner .ceo-swiper .swiper-container .swiper-slide a .thumbs{
  height:35rem; background:#eee url(/kor/assets/img/common/svg/logo_black.svg) no-repeat center; background-size:20rem;
}
.news .inner .ceo-swiper .swiper-container .swiper-slide a .thumbs img{
  position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover;
}
.news .inner .ceo-swiper .swiper-container .swiper-slide a em{
  position:absolute; left:0; bottom:0; width:100%; height:10rem; line-height:10rem; padding:0 2.5rem;
  font-size:2.2rem; font-weight:400; color:#fff;
  background:linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgb(0,0,0) 100%);
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#00ffffff", endColorstr="#000000", GradientType=0);
}
.news .inner .ceo-swiper .swiper-container .swiper-slide a em span{width:75%;}

.news .inner .func{position:absolute; right:0; top:-7rem; white-space:nowrap;}
.news .inner .func a,
.news .inner .func button{width:3rem; height:3rem; line-height:3rem; text-align:center;}
.news .inner .func a img,
.news .inner .func button img{vertical-align:middle;}

/* about */
.about{position:relative; padding:12rem 0; overflow:hidden;}
.about .inner{position:relative;}
.about .inner mark{font-size:1.8rem;}
.about .inner h2{margin-top:1.5rem; margin-bottom:7rem; font-size:4rem;}
.about .inner h2+.row{margin:0 -2.5rem;}
.about .inner h2+.row [class^=grid-]{padding:0 1.2rem;}
.about .inner h2+.row [class^=grid-] a{position:relative; display:block; padding-bottom:18rem;}
.about .inner h2+.row [class^=grid-] a .thumbs{
  position:relative; height:28.5rem; background:no-repeat center; background-size:cover; background:#111; overflow:hidden;
}
.about .inner h2+.row [class^=grid-] a .thumbs img{
  position:absolute; min-width:101%; min-height:101%; left:50%; top:50%; transform:translate(-50%, -50%);
}
.about .inner h2+.row [class^=grid-] a dl{
  position:absolute; width:100%; min-height:20rem; left:0; bottom:0; padding:4rem; line-height:1.2; background:#fff; transition:all .3s ease;
}
.about .inner h2+.row [class^=grid-] a dl dt{margin-bottom:2rem; font-size:2.5rem; font-weight:700; transition:all .3s ease;}
.about .inner h2+.row [class^=grid-] a dl dd{
  position:relative; font-size:1.5rem; color:#555; line-height:1.5; transition:all .3s ease;
}
.about .inner h2+.row [class^=grid-] a dl dd img{
  position:absolute; left:-1rem; bottom:-5rem; opacity:0; visibility:hidden; transition:all .3s ease; transition-delay:0;
}
.about .inner h2+.row [class^=grid-] a:hover dl{padding-bottom:10rem; background:#2c7cec;}
.about .inner h2+.row [class^=grid-] a:hover dl dt,
.about .inner h2+.row [class^=grid-] a:hover dl dd{color:#fff;}
.about .inner h2+.row [class^=grid-] a:hover dl img{visibility:visible; opacity:1; left:0; transition-delay:.2s;}

.about .inner div.init{margin-top:8rem;}
.about .inner div.init a{padding:0 7rem;}
.about .inner div.init a i{display:inline-block; width:8rem; height:8rem; line-height:8rem; margin-bottom:2rem; font-size:0;}
.about .inner div.init a i img{vertical-align:middle;}
.about .inner div.init a span{display:block; font-size:2.1rem; color:#333; font-weight:500; transition:color .3s ease;}
.about .inner div.init a:hover span{color:#2c7cec;}
.about .inner a.more{display:block; text-align:center; font-size:1.6rem; color:#555;}

.about .marquee{
  position:absolute; width:100%; height:100vh; left:0; top:0; background:#f1f4f7; z-index:-1;
  white-space:nowrap; line-height:1; overflow:hidden;
}
.about .marquee .rotate{position:absolute; left:21vw; top:0; transform:rotate(-90deg);}
.about .marquee .rotate i{display:block; font-size:20rem; font-weight:900;}
.about .marquee .rotate i:nth-child(1){
  color:rgba(0,0,0,0); -webkit-text-stroke:1px #e5e8eb; will-change:transform; animation:marquee 20s linear infinite;
}
.about .marquee .rotate i:nth-child(2){
  color:#e5e8eb; will-change:transform; animation:marquee-reverse 20s linear infinite;
}
@keyframes marquee{from{transform:translateX(0);} to{transform:translateX(-50%);}}
@keyframes marquee-reverse{from{transform:translateX(0);} to{transform:translateX(50%);}}

/* prcenter */
.prcenter{
  position:relative; background:#111 no-repeat center; background-size:cover;
  background-image:url(/images/eng/assets/img/main/pr_bg.jpg); background-attachment:fixed; overflow:hidden;
}
.prcenter::after{
  position:absolute; z-index:1; top:0; left:0; display:block; width:100%; height:100%; background:rgba(0,0,0,.15);
}
.prcenter .inner{position:relative; z-index:2;}
.prcenter .inner .el{padding:15rem 0 6rem; color:#fff; text-align:center;}
.prcenter .inner .el h2{font-size:4rem;}
.prcenter .inner .el p{opacity:.5; margin-top:1.5rem; font-size:1.6rem; font-weight:300;}
.prcenter .inner .el a{font-size:1.9rem;}
.prcenter .inner .row [class^=grid-] a{
  position:relative; display:block; padding:5rem 4rem; height:26rem; color:#fff; transition:all .3s ease;
}
.prcenter .inner .row [class^=grid-] a.promotion{
  position:relative; padding:7rem 5rem; color:#222;
  background:url(/images/eng/assets/img/main/img_pr_bg01.jpg) no-repeat right bottom; background-size:cover;
}
.prcenter .inner .row [class^=grid-] a.promotion em{font-size:2.4rem;}
.prcenter .inner .row [class^=grid-] a.promotion p{margin:1rem 0 4rem 0; font-size:1.5rem; line-height:1.5; color:#777;}

.prcenter .inner .row [class^=grid-] .row [class^=grid-] a em{font-size:2.2rem; font-weight:600;}
.prcenter .inner .row [class^=grid-] .row [class^=grid-] a p{opacity:.5; margin:1rem 0 2.5rem 0; font-size:1.4rem; font-weight:400; line-height:1.4;}

.prcenter .inner .row [class^=grid-] .row [class^=grid-] a.brochure{
  background:#1c5fbd url(/images/eng/assets/img/main/svg/icon_pr_bg01.svg) no-repeat calc(100% - 4rem) calc(100% - 4rem);
  border-right:1px solid #1751a2;
}
.prcenter .inner .row [class^=grid-] .row [class^=grid-] a.magazine{
  background:#1c5fbd url(/images/eng/assets/img/main/svg/icon_pr_bg02.svg) no-repeat calc(100% - 4rem) calc(100% - 4rem);
  border-right:1px solid #1751a2;
}
.prcenter .inner .row [class^=grid-] .row [class^=grid-] a.newsletter{
  background:#1c5fbd url(/images/eng/assets/img/main/svg/icon_pr_bg03.svg) no-repeat calc(100% - 4rem) calc(100% - 4rem);
}
.prcenter .inner .row [class^=grid-] .row [class^=grid-] a:hover{background-color:#2c7ced;}

.prcenter .inner .row [class^=grid-] img{
  position:absolute; display:block; bottom:5rem; left:5rem; transition:margin .3s ease;
}
.prcenter .inner .row [class^=grid-]:hover img{margin-left:1rem;}
.prcenter .inner .row [class^=grid-] i{position:relative; display:inline-block;}
.prcenter .inner .row [class^=grid-] i svg:last-child{
  position:absolute; left:50%; top:50%; z-index:1; transform:translate(-50%, -50%);
}

/*# sourceMappingURL=style.main.min.css.map */