@charset "utf-8";
@font-face {
  font-family: "Pretendard-Light";
  src: url("../font/Pretendard-Light.woff") format("woff");
  font-weight: 300;
  font-style: normal;
}
@font-face {
  font-family: "Pretendard-Regular";
  src: url("../font/Pretendard-Regular.woff") format("woff");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: "Pretendard-Medium";
  src: url("../font//Pretendard-Medium.woff") format("woff");
  font-weight: 500;
  font-style: normal;
}
@font-face {
  font-family: "Pretendard-SemiBold";
  src: url("../font//Pretendard-SemiBold.woff") format("woff");
  font-weight: 600;
  font-style: normal;
}
@font-face {
  font-family: "Pretendard-Bold";
  src: url("../font//Pretendard-Bold.woff") format("woff");
  font-weight: 700;
  font-style: normal;
}

/* 초기화 */
html {
  overflow-y: scroll;
  font-size: 10px;
}
body {
  margin: 0 auto;
  padding: 0;
  font-family: "Pretendard-Regular", sans-serif;
  font-weight: 400;
  background: #fff;
  -webkit-text-size-adjust: 100%;
  font-size: 1.2rem;
  color: #2C2C2C;
}
html,
h1,
h2,
h3,
h4,
h5,
h6,
form,
fieldset,
img {
  margin: 0;
  padding: 0;
  border: 0;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: 1.4rem;
  font-family: "Pretendard-Regular", sans-serif;
  font-weight: 400;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block;
}
em,
address {
  font-style: normal;
}
figure,
ul,
li,
dl,
dt,
dd {
  margin: 0;
  padding: 0;
  list-style: none;
}
legend {
  position: absolute;
  margin: 0;
  padding: 0;
  font-size: 0;
  line-height: 0;
  text-indent: -9999rem;
  overflow: hidden;
}
label,
input,
button,
select,
img {
  vertical-align: middle;
  font-size: 1.4rem;
}
input,
button {
  margin: 0;
  padding: 0;
  font-family: "Pretendard-Regular", sans-serif;
  font-weight: 400;
  font-size: 1.4rem;
}
input[type="submit"] {
  cursor: pointer;
}
button {
  cursor: pointer;
  -webkit-appearance: none;
  border: 0;
}
img {
  max-width: 100%;
  height: auto;
}
textarea,
select {
  font-family: "Pretendard-Regular", sans-serif;
  font-weight: 400;
  font-size: 1.4rem;
}
select {
  width: 100%;
  height: 3.6rem;
  padding: 0 1rem;
  padding-right: 3rem;
  font-size: 1.4rem;
  color: #111;
  background: url("../img/arr_down_b.svg") no-repeat 98% 50% #fff;
  background-size: 2.4rem;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: 1px solid #dcdde4;
  border-radius: 0;
}
select::-ms-expand {
  display: none;
}
p {
  margin: 0;
  padding: 0;
  word-break: break-all;
}
hr {
  display: none;
}
pre {
  overflow-x: scroll;
  font-size: 1.2rem;
}
a {
  color: #2C2C2C;
  text-decoration: none;
  transition: all 0.3s ease;
  -webkit-transition: all 0.3s ease;
}

*,
:after,
:before {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  outline: none;
}

input[type="text"],
input[type="password"],
textarea {
  outline: none;
  -webkit-appearance: none;
}

.hd_h1 {
  position: absolute;
  margin: 0;
  padding: 0;
  font-size: 0;
  line-height: 0;
  text-indent: -9999rem;
  overflow: hidden;
}

*::-webkit-scrollbar {
  width: 3px;
  height: 3px;
}
*::-webkit-scrollbar-thumb {
  background: #aaa;
  border-radius: 10px;
}
*::-webkit-scrollbar-track {
  background: #f3f4f6;
}

.top-bottom {transform: translate(0,-50px); -webkit-transform: translate(0,-50px); -webkit-transition: 0.45s; transition: 0.45s; opacity:0;}
.bottom-top {transform: translate(0,50px); -webkit-transform: translate(0,50px); -webkit-transition: 0.45s; transition: 0.45s; opacity:0;}
.img-ani {transition: transform 0.45s cubic-bezier(0.16, 0.68, 0.43, 0.99),opacity 0.45s ease-in-out; opacity: 0;}
.img-aniload {transform: translate(0,0); -webkit-transform: translate(0,0); opacity:1;}
.img-aniload.top-bottom,
.img-aniload.bottom-top {transition-delay: 0.2s; -webkit-transition-delay: 0.2s; transform: translate(0,0); -webkit-transform: translate(0,0); opacity: 1;}
.txt-ani {overflow: hidden; -webkit-transition: all 1s ease; transition: all 1s ease; opacity: 0; color:#111;}
.txt-ani > span {-webkit-transition: inherit; transition: inherit; transform: translate(0,100px); -webkit-transform: translate(0,100px); opacity: 0; display: inline-block;}
.txt-aniload > span {transform: translate(0,0); -webkit-transform: translate(0,0); opacity: 1;}
.tech-img {display:inline-block; max-width: 100%;}
.tech-img img {max-width: 1200px;}
.tech-img > div {width: 0; overflow: hidden; -webkit-transition: all 1.2s ease; transition: all 1.2s ease; opacity: 0;}
.tech-aniload > div {width: 100%; opacity: 1;}
.left-right {opacity:0; transform: translate(-40px,0); -webkit-transform: translate(-40px,0); transition: all 0.45s ease; -webkit-transition: all 0.45s ease;}
.right-left {opacity:0; transform: translate(40px,0); -webkit-transform: translate(40px,0); transition: all 0.45s ease; -webkit-transition: all 0.45s ease;}
.img-aniload .left-right,
.img-aniload .right-left,
.img-aniload.left-right,
.img-aniload.right-left {transition-delay: 0.3s; -webkit-transition-delay: 0.3s; transform: translate(0,0); -webkit-transform: translate(0,0); -moz-transform: translate(0,0); -ms-transform: translate(0,0); -o-transform: translate(0,0); opacity: 1;}
.dy2 {transition-delay: 0.3s !important;}
.dy3 {transition-delay: 0.4s !important;}

.Lato {font-family: 'Lato', sans-serif !important;}
#hd {position: fixed; top: 0; left: 0; right: 0; height: 10rem; z-index: 100; background: #FFF; transition: all 0.3s ease;}
#hd .inArea {display: flex; align-items: center; justify-content: space-between; padding: 0 6rem; height: 100%;}
#hd .side_menu {height: 100%; cursor: pointer; position: relative; z-index: 1;}
#hd .side_menu .cen {height: 100%; display: flex; justify-content: center; align-items: center; flex-direction: column; width: 38px;}
#hd .side_menu .s2,
#hd .side_menu .s1 {position: relative; width: 38px; height:3px;}
#hd .side_menu .s1:before {content:''; position: absolute; top: 0; right: 0; width: 3px; height: 3px; background: #2C2C2C;}
#hd .side_menu .s1:after {content:''; position: absolute; top:0; left:0; width:32px; height:3px; background: #2C2C2C;}
#hd .side_menu .s2 {margin-top: 8px;}
#hd .side_menu .s2:before {content:''; position: absolute; top: 0; left: 0; width: 3px; height: 3px; background: #2C2C2C;}
#hd .side_menu .s2:after {content:''; position: absolute; top:0; right:0; width:32px; height:3px; background: #2C2C2C;}
.allMenu {height: 100%;}
.allmenuBg {display:block; width:5rem;height:5rem; background:#0C111D; border-radius:50%; position:absolute;left:calc(100% - 4.5%);top:5rem; z-index:1; transform:translate(-50%,-50%) scale(0); transition:all 0.6s ease-in-out;}
.allmenuBg.on {transform:translate(-50%,-50%) scale(100);}
.allmenu {position:absolute;left:0;top:0; padding: 0 6rem; z-index:1; width:100%;height:100vh; transform:scale(0);}
.allmenu.open {transform:scale(1);transition:transform 0s 0.6s;}
.allmenu.open .allmenuwrap {opacity:1;transition:opacity 1s 0.6s;}
.allmenuwrap {position: relative; opacity: 0; display: flex; align-items: center; justify-content: center; width: 100%; height: 100%;}
.side_menu_close {position: absolute; top: 0; right: 0; height: 12rem; display: flex; align-items: center; justify-content: center; background: url('../img/close_btn_w.svg') no-repeat center / 2.4rem; width: 5rem; cursor: pointer;}
.allmenuwrap .lkbox {width: 60%; height: 100%; display: flex; align-items: center; justify-content: right; padding-right: 6rem;}
.allmenuwrap .lkbox  ul {}
.allmenuwrap .lkbox  ul li {position: relative; overflow: hidden; margin: 4rem 0;}
.allmenuwrap .lkbox a {color: #ededed; font-size: 9rem; font-weight: 100; display: block; text-align: right;}
.allmenuwrap .lkbox a::before {content: attr(data-hover); position: absolute; top: 100%; left: 50%; color: #078B7B; text-align: center; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); transform: translateX(-50%); width: 100%; text-align: right; font-family: "Pretendard-Light"; font-weight: 300;}
.allmenuwrap .lkbox a:hover {transform: translateY(-100%);}
.allmenuwrap .rTxt {width: 40%; height: 100%; border-left: 1px solid #494949; display: flex; align-items: center;}
.allmenuwrap .rTxt .contArea {transition: all 0.5s ease; transition-delay: 0.7s; padding-left: 6rem; transform: translateY(30px); opacity: 0;}
.allmenu.open .rTxt .contArea {transform: translateY(0); opacity: 1;}
.allmenuwrap .rTxt .list {margin: 3rem 0;}
.allmenuwrap .rTxt .list .m1 {font-size: 1.6rem; color: #7A7F99; margin-bottom: 1rem;}
.allmenuwrap .rTxt .list .m2 {font-size: 2rem; color: #FFF; padding-left: 16px; line-height: 1.5;}
#hd .logo {height: 100%;}
#hd .logo a {display: flex; align-items: center; height: 100%; color: #2C2C2C; font-size: 2.8rem; font-family: "Pretendard-SemiBold"; font-weight: 600;}
#hd nav {height: 100%;}
#hd nav ul {display: flex; align-items: center; height: 100%;}
#hd nav ul li {position: relative; overflow: hidden;}
#hd nav ul li a {font-size: 1.8rem; color: #2C2C2C; font-family: "Pretendard-SemiBold"; font-weight: 600; padding: 0 3.5rem; display: block;}
#hd nav ul li a::before {content: attr(data-hover); position: absolute; top: 100%; left: 50%; color: #078B7B; text-align: center; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); transform: translateX(-50%); width: 100%;}
#hd nav ul li a:hover {transform: translateY(-100%);}
#hd.fixed {background: rgba(255, 255, 255, 0.87); height: 8rem; backdrop-filter: blur(7px); -webkit-backdrop-filter: blur(7px); -moz-backdrop-filter: blur(7px); -o-backdrop-filter: blur(7px);}
#subPage,
#main {padding: 10rem 0 0;}
.wrap {padding: 0 4rem; position: relative;}
#mainVideo {height: calc(100vh - 160px); border-radius: 2rem; position: relative; margin-top: 1rem;}
#mainVideo::before {content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.82); border-radius: 2rem;}
#mainVideo video {width: 100%; height: 100%; object-fit: cover; border-radius: 2rem;}
.blk {display: block;}
#mainVideo .txtCont {position: absolute; top: 50%; left: 50%; z-index: 1; color: #FFF; text-align: center; transform: translate(-50%, -50%);}
#mainVideo .txtCont .focus {font-size: 5.4rem;}
#mainVideo .txtCont h2 {}
#mainVideo .txtCont .txt2 {font-size: 1.8rem; line-height: 1.7; margin-top: 5rem;}
#mainVideo .focus {filter: blur(2px); opacity: 0.6;}
#mainVideo .mask {position: absolute; left: 0; top: 0; font-size: 5.4rem; clip: rect(0px,70px,75px,0px); animation: mask 5.5s ease infinite alternate;}
#mainVideo .mask .line {position: absolute; top: 0; left: 0; width: 7rem; height: 6.4rem;}
#mainVideo .mask .line::after,
#mainVideo .mask .line::before {content: ''; position: absolute; width: 16px; height: 16px;}
#mainVideo .mask .line::after {bottom: 0; right: 0; border-right: 2px solid #FFF; border-bottom: 2px solid #FFF;}
#mainVideo .mask .line::before {top: 0; left: 0; border-top: 2px solid #FFF; border-left: 2px solid #FFF;}
#mainVideo .text {animation: text 5.5s ease infinite alternate;}
.typing-txt {display: none;}
.typing {font-size: 7.2rem; margin-top: 2rem; font-family: "Pretendard-SemiBold"; font-weight: 600; height: 8rem;}
@keyframes mask {
  to {
    transform: translateX(500px);
  }
}

@keyframes text {
  to {
    transform: translateX(-500px);
  }
}
.more_lk {text-align:center; margin-top: 4.8rem;}
.more_lk .lk {display: inline-flex; justify-content: center; align-items: center; width:20rem; height:6rem; border-radius: 8px; border: 1px solid #FFF; font-size: 1.8rem; color: #FFF; font-family: 'Pretendard-Medium'; font-weight:500; transition: all 0.2s ease-in-out; position: relative; overflow: hidden; z-index:1; cursor:pointer;}
.more_lk .lk:after {content:''; position:absolute; z-index:-1; background:#078B7B; height: 100%; left: -60%; top: 0; transform: skew(50deg); transition-duration: 0.6s; transform-origin: top left; width: 0;}
.more_lk .lk:hover:after {height: 100%;width: 180%;}
.more_lk .lk span {transition:all 0.3s ease; -webkit-transition:all 0.3s ease;}
.more_lk .lk:hover span {position:relative; z-index:1; color:#fff;}
.more_lk .lk:hover {border: 1px solid #078B7B;}
.more_lk button.lk {background: #FFF; color: #2C2C2C; border: 1px solid #2C2C2C;}

#mainFea {}
.feaArea {display: flex;}
.lineTit {border-top: 1px solid #2C2C2C; padding-top: 2.4rem; width: 42rem; position: relative;}
.lineTit .t1 {font-size: 2.4rem; margin-bottom: 8px;}
.lineTit .t2 {font-size: 4rem; font-family: "Pretendard-SemiBold"; font-weight: 600; color: #078B7B;}
.feaArea .contBox {flex: 1; padding-left: 16rem;}
.feaArea .contBox ul {display: flex  ;}
.feaArea .contBox ul li {width: 33.3333333%; padding: 0 2rem;}
.feaArea .contBox .in {background: #F3F4F6; padding: 3.2rem 3.2rem; border-radius: 12px; height: 100%;}
.feaArea .contBox .ic {text-align: right; margin-bottom: 1.6rem;}
.feaArea .contBox .ic img {height: 8rem;}
.feaArea .contBox h3 {font-size: 2.8rem; font-family: "Pretendard-SemiBold"; font-weight: 600;}
.feaArea .contBox .m1 {font-size: 1.6rem; line-height: 1.5; word-break: keep-all; margin-top: 2rem; color: #666;}
.feaArea .iconBox {position: absolute; right: 8px; bottom: 8px; display: flex; gap: 16px;}
.feaArea .iconBox .ic1 {
  width: 32px;
  aspect-ratio: 1;
  background:
    linear-gradient(#078B7B 0 0),
    linear-gradient(#FF00AA 0 0),
    #00AAFF;
  background-repeat: no-repeat;
  animation: l1 2.5s infinite; 
}
@keyframes l1 {
  0%   {background-size:100%    0,0    100%}
  30%,
  50%  {background-size:100%    0,100% 100%}
  80%,
  100% {background-size:100% 100%,100% 100%}
}

.feaArea .iconBox .ic2 {
  width: 32px;
  aspect-ratio: 1;
  border-radius: 50%;
  background:
    linear-gradient(#ED303C 0 0),
    linear-gradient(#ED303C 0 0),
    linear-gradient(#078B7B 0 0),
    linear-gradient(#078B7B 0 0),
    linear-gradient(#FAD089 0 0),
    linear-gradient(#FAD089 0 0),
    linear-gradient(#FF9C5B 0 0),
    linear-gradient(#FF9C5B 0 0),
    #ED303C;
  background-position: top left,bottom right;
  background-repeat: no-repeat;
  animation: l6 3.5s infinite; 
}
@keyframes l6 {
  0%   {background-size: 0   100%,0   100%,100% 0  ,100% 0  ,0   100%,0   100%,100% 0  ,100% 0  }
  20%,
  25%  {background-size: 0   100%,0   100%,100% 0  ,100% 0  ,0   100%,0   100%,100% 50%,100% 50%}
  45%,
  50%  {background-size: 0   100%,0   100%,100% 0  ,100% 0  ,50% 100%,50% 100%,100% 50%,100% 50%}
  70%,
  75%  {background-size: 0   100%,0   100%,100% 50%,100% 50%,50% 100%,50% 100%,100% 50%,100% 50%}
  95%,
  100% {background-size: 50% 100%,50% 100%,100% 50%,100% 50%,50% 100%,50% 100%,100% 50%,100% 50%}
}

.feaArea .iconBox .ic3 {
  width: 36px;
  aspect-ratio: 1.154;
  clip-path: polygon(50% 0,100% 100%,0 100%);
  position: relative;
}
.feaArea .iconBox .ic3::before{
  content: "";
  position: absolute;
  inset:-150% -100% -50%;
  background:repeating-conic-gradient(from 30deg,#FFABAB 0 60deg,#078B7B 0 120deg,#FF7373 0 180deg);
  animation: l9 3s infinite; 
}
@keyframes l9 {
  0%   {transform: rotate(0)}
  23%,
  33%  {transform: rotate(60deg)}
  56%,
  66%  {transform: rotate(120deg)}
  90%,
  100% {transform: rotate(180deg)}
}

#mainSpc {}
#mainSpc .lineTit {height: 32.4rem; position: sticky; top: 20rem;}
.feaArea .contBox .half_cont {display: flex; flex-wrap: wrap;}
.feaArea .contBox .half_cont .list {width: 50%; padding: 2rem 2rem 4rem;}
.feaArea .contBox .half_cont .list .img {margin-bottom: 3.2rem;}
.feaArea .contBox .half_cont .list .img img {border-radius: 12px;}
.feaArea .contBox .half_cont .list h2 {font-size: 2.8rem; font-family: "Pretendard-SemiBold"; font-weight: 600; padding-left: 8px;}
.feaArea .contBox .half_cont .list .p1 {font-size: 1.6rem; padding: 0 8px; line-height: 1.5; margin-top: 1.2rem; word-break: keep-all; color: #666;}
#mainSpc,
#mainFea,
#mainPtn {padding: 10rem 0;}
.ptnBox {flex: 1; margin-left: 16rem; margin-right: -4rem; overflow: hidden;}
.ptnBox ul {display: flex;}
.ptnBox ul li {width: 24rem; border: 1px solid #DCDDE4; border-radius: 8px; padding: 0 1.2rem; margin: 0 1rem; display: flex; align-items: center; justify-content: center; height: 12rem;}
.ptnBox ul li img {height: 9rem;}
.ptnBox .ul1 {animation: jsLoopSlide 80s -40s linear infinite;}
.ptnBox .ul2 {animation: jsLoopSlide2 80s linear infinite;}
.ptnBox .ul3 {animation: jsLoopSlide3 80s -40s linear infinite;}
.ptnBox .ul4 {animation: jsLoopSlide4 80s linear infinite;}
.ptnBox .rowA {margin-bottom: 2rem;}
.ptnBox .rowA,
.ptnBox .rowB {display: flex;}


@keyframes jsLoopSlide {
  0% {
      transform: translateX(100%);
  }

  100% {
      transform: translateX(-100%);
  }
}

@keyframes jsLoopSlide2 {
  0% {
      transform: translateX(0);
  }

  100% {
      transform: translateX(-200%);
  }
}

@keyframes jsLoopSlide3 {
  0% {
      transform: translateX(-100%);
  }

  100% {
      transform: translateX(100%);
  }
}

@keyframes jsLoopSlide4 {
  0% {
      transform: translateX(-200%);
  }

  100% {
      transform: translateX(0);
  }
}

#ft {background: #0C111D; padding: 5rem 0; color: #ededed; text-align: center;}
#ft p {font-size: 1.6rem; margin-bottom: 1rem; font-family: "Pretendard-Light"; font-weight: 300;}
#ft .line {display: inline-block; width: 1px; height: 12px; background: #828282; margin: 0 1rem;}
#ft p.m1 {}
#ft p.m2 {}
#ft p.m3 {}
#ft p.copy {color: #98a2b3; font-size: 1.4rem; margin-top: 1.6rem;}

#subPage {}
.subTit {margin-top: 6rem; text-align: center;}
.subTit .m1 {font-size: 2.2rem; line-height: 1.5;}
.subTit .m2 {font-size: 8rem; font-weight: 900; margin-top: 2rem;}
.subWrap {max-width: 148rem; position: relative; margin: 0 auto; padding: 0 8rem 10rem;}
.subWrap::before,
.subWrap::after {content: ''; position: absolute; top: 0; width: 1px; height: 0; transition: all 0.7s ease-in-out; -webkit-transition: all 0.7s ease-in-out; transition-delay: 1.7s; background:#0C111D;}
.subWrap::before {left: 0;}
.subWrap::after {right: 0;}
.subWrap.img-aniload::before,
.subWrap.img-aniload::after {height: 100%;}
.subLine {position:relative; margin-top: 8rem;}
.subLine::after {content: ""; width: 0; position: absolute; bottom: 0; left: 50%; height: 1px; transition: all 0.7s ease-in-out; -webkit-transition: all 0.7s ease-in-out; transition-delay: 1.0s;}
.subLine.img-aniload::after {width: 100%; z-index: 2; margin-left: -50%; background:#0C111D;}
#hd.fixLine {border-bottom: 1px solid #0C111D;}
.subLine.revm::after {display: none;}

.abtCont1 {padding-top: 8rem; display: flex;}
.abtCont1 .le {font-size: 5.2rem; font-family: "Pretendard-Light"; font-weight: 300; position: sticky; top: 12rem; height: 20rem;}
.abtCont1 .le strong {font-family: "Pretendard-Bold"; font-weight: 700; color: #078B7B;}
.abtCont1 .ri {flex: 1; padding-left: 12rem; padding-top: 12rem; display: flex; flex-wrap: wrap; gap: 4rem;}
.abtCont1 .ri .list {width: calc(50% - 2rem); background: #F3F4F6; border-radius: 12px; padding: 3.2rem 3.2rem;}
.abtCont1 .ri .m1 {font-size: 2rem; color: #666; margin-bottom: 8px;}
.abtCont1 .ri .m2 {font-size: 2.8rem; font-family: "Pretendard-SemiBold"; font-weight: 600;}
.abtCont1 .ri .ic {text-align: right; margin-bottom: 1.6rem;}
.abtCont1 .ri .ic img {height: 8rem; width: 8rem;}
.word {word-break: keep-all;}
.abtCont1.bt {margin-top: 8rem;}

.histArea {display: flex; width: 100%; flex-wrap: wrap;}
.histArea .hist {width: 50%; padding: 0 1.2rem;}
.histArea .hist.sec {margin-top: 24rem;}
.histArea .hist .in {}
.histArea .hist .img {margin-bottom: 1.6rem;}
.histArea .hist .img img {border-radius: 12px;}
.histArea .hist .year {padding: 0 1.2rem; font-size: 3.2rem; font-family: "Pretendard-SemiBold"; font-weight: 600; color: #0C111D; margin-bottom: 8px;}
.histArea .hist .txt {padding: 0 1.2rem; font-size: 1.6rem; color: #666; margin-bottom: 8px; position: relative; padding-left: 5.2rem; line-height: 1.5;}
.histArea .hist .txt span {color: #2C2C2C; position: absolute; top: 0; left: 1.2rem; font-family: "Pretendard-Medium"; font-weight: 500;}

.abtCont1.loc .ri {gap: 0;}
.abtCont1 .ri .map {position: relative; width: 100%; height: 52rem;}
.abtCont1 .ri .map iframe {position: absolute; top: 0; left: 0; right: 0; bottom: 0;}
.abtCont1 .ri .info {margin-top: 2rem; font-size: 1.8rem;}

.portCont {padding-top: 8rem;}
.portCont .list {margin-top: 16rem;}
.portCont .list:first-child {margin-top: 0;}
.portCont .list .tit {text-align: center;}
.portCont .list .tit img {}
.portCont .list .h3 {text-align: center; font-size: 3.2rem; font-family: "Pretendard-SemiBold"; font-weight: 600;}
.portCont .list .subT {text-align: center; font-size: 1.8rem; margin-top: 1.2rem;}
.portCont .list .img {margin-top: 5.2rem;}
.portCont .list .img ul {display: flex; flex-wrap: wrap;}
.portCont .list .img ul li {width: 50%; padding: 1.2rem 1.2rem;}
.portCont .list .img ul li img {border-radius: 12px; border: 1px solid #DCDDE4;}
.portCont .list .ovw {padding: 0 1.2rem; margin-top: 2rem;}
.portCont .list .ovw .inArea {display: flex; flex-wrap: wrap; background: #F3F4F6; border-radius: 12px; padding: 3.2rem 3.2rem;}
.portCont .list .ovw .w50 {width: 50%;}
.portCont .list .ovw .w50 h4 {font-size: 2rem; font-family: "Pretendard-SemiBold"; font-weight: 600; display: flex; align-items: center; gap: 6px;}
.portCont .list .ovw .w50 h4::before {content: ''; width: 1.6rem; height: 1.6rem; background: url(../img/title_line.svg) no-repeat center;}
.portCont .list .ovw .w50 .txt {margin-top: 2rem; padding-left: 4px;}
.portCont .list .ovw .w50 .txt div {position: relative; font-size: 1.6rem; color: #666; margin-bottom: 1.2rem; padding-left: 3rem;}
.portCont .list .ovw .w50 .txt div:last-child {margin-bottom: 0;}
.portCont .list .ovw .w50 .txt .ic {position: absolute; top: -1px; left: 0; width: 2rem; height: 2rem;}
.portCont .list .ovw .w50 .txt .icon1 {background: url(../img/dot_ic.svg) no-repeat center/1.6rem;}
.portCont .list .ovw .w50 .txt .icon2 {background: url(../img/hand_ic.svg) no-repeat center/100%;}
.portCont .list .ovw .w50 .txt .icon3 {background: url(../img/cald_ic.svg) no-repeat center/100%;}
.portCont .list .ovw .w50 .txt .icon4 {background: url(../img/user_ic.svg) no-repeat center/100%;}
.portCont .list .ovw .w50 .txt .icon5 {background: url(../img/news_ic1.svg) no-repeat center/100%;}
.portCont .list .ovw .w50 .txt div strong {color: #0F0F15; font-family: "Pretendard-SemiBold"; font-weight: 600;}

.ctus {}
.ctus .abtCont1 .ri {display: block;}
.ctus .info {font-size: 2rem; text-align: right; margin-bottom: 2rem;}
.red {color: #CE0110;}
.ctus .contArea {}
.ctus .contArea .frm {position: relative; margin-bottom: 6rem;}
.contArea input[type="text"]:focus, .contArea textarea:focus {outline: none; border-bottom: 1px solid #078B7B; padding: 0;}
.contArea input[type="text"], .contArea textarea {position: relative; display: block; font-size: 1.8rem; border: 0; background-color: transparent; border-bottom: 1px solid #DCDDE4; transition: all 0.3s; width: 100%;}
.contArea input[type="text"] {height: 5.2rem;}
.contArea span {position: absolute; top: 6px; left: 0; display: flex; gap: 4px; font-size: 1.8rem; color: transparent; z-index: -1; transition: all 0.3s;}
.contArea span b {color: #CE0110; font-size: 1.6rem; font-family: "Pretendard-SemiBold"; font-weight: 600;}
.contArea span.error-msg {color: #CE0110 !important;}
.contArea input[type="text"]::placeholder, .contArea textarea::placeholder {font-size: 1.8rem; color: #666;}
.contArea input[type="text"]:focus::placeholder, .contArea textarea:focus::placeholder {color: transparent;}
.contArea input[type="text"]:focus + span, .contArea textarea:focus + span,
.contArea input[type="text"]:not(:placeholder-shown) + span, .contArea textarea:not(:placeholder-shown) + span {top: -12px; font-size: 1.4rem; color: #078B7B;}
.contArea textarea {width: 100%; resize: none; height: 5.2rem; line-height: 1.5;}
.contArea textarea:focus {height: 32rem; outline: none; overflow-y: auto; padding: 1.6rem 0;}
.contArea textarea:not(:placeholder-shown) {height: 32rem; padding: 1.6rem 0;}
.prvCont .rowA {margin-top: 1.6rem;}
.prvCont .rowA input[type="checkbox"] {position: absolute; opacity: 0}
.prvCont .rowA label {padding-left: 2.8rem; position: relative; font-size: 1.6rem; cursor: pointer;}
.prvCont .rowA input[type="checkbox"]:checked + label {color: #000;}
.prvCont .rowA input[type="checkbox"] + label:before {content: ''; width: 2rem; height: 2rem; border-radius: 4px; border: 1px solid #DCDDE4;background: #FFF; position: absolute; top: 50%; margin-top: -1rem; left: 0;}
.prvCont .rowA input[type="checkbox"]:checked ~ label:before {border: 1px solid #078B7B; background: url(../img/chk_ic.svg) #078B7B no-repeat center/1.6rem;}
.prvCont .rowB {}
.prvCont .rowB textarea {width: 100%; height: 10rem; resize: none; padding: 1.2rem 1.2rem; font-size: 1.4rem; line-height: 1.5; color: #666; border: 1px solid #DCDDE4;}
.ctus .more_lk {margin-top: 8rem;}





@media (max-width:1440px) {

  .lineTit {width: 32rem;}
  .feaArea .contBox {padding-left: 12rem;}
  .subWrap {padding: 0 4rem 10rem;}
  .subWrap::before {left: 2rem;}
  .subWrap::after {right: 2rem;}
  .subTit .m2 {font-size: 6rem; height: 7rem;}
  .abtCont1 .le {font-size: 4rem;}
  .abtCont1 .ri {flex: 1; padding-left: 8rem; padding-top: 10rem;}
  .abtCont1 .ri .m2 {font-size: 2.4rem;}



}


@media (max-width:1280px) {

.typing {font-size: 6.2rem;}
.feaArea {display: block;}
.lineTit {width: auto;}  
.feaArea .contBox {padding-left: 0; padding-top: 4rem; }
.feaArea .contBox ul {margin: 0 -2rem;}
#mainSpc .lineTit {height: auto; position: relative; top: auto;}
.feaArea .contBox .half_cont {margin: 0 -2rem;}
.ptnBox {padding-left: 0; padding-top: 4rem; margin: 0 -4rem;}

}


@media (max-width:1024px) {

#hd nav {display: none;}
.allmenuwrap .lkbox a {font-size: 6rem;}
.wrap {padding: 0 2rem;}
#hd .inArea {padding: 0 4rem;}
#mainVideo .txtCont {width: 44rem; margin: 0 auto;}
#mainVideo .mask,
#mainVideo .txtCont .focus {font-size: 4rem; width: 44rem; margin: 0 auto;}
#mainVideo .mask .line {width: 6rem; height: 5.4rem;}
@keyframes mask {
  to {
    transform: translateX(380px);
  }
}

@keyframes text {
  to {
    transform: translateX(-380px);
  }
}
.typing {font-size: 5.2rem; height: 6rem;}
#mainVideo .txtCont .txt2 {margin: 5rem -7rem 0;}
.lineTit .t1 {font-size: 2rem;}
.lineTit .t2 {font-size: 3.4rem;}
.feaArea .contBox .half_cont .list h2,
.feaArea .contBox h3 {font-size: 2.4rem;}
.feaArea .contBox .in {padding: 2.4rem 2.4rem;}
#mainSpc, #mainFea, #mainPtn {padding: 7rem 0;}
.subTit {margin-top: 4rem;}
.subTit .m1 {font-size: 1.8rem;}
.subTit .m2 {font-size: 5rem; height: 6rem;}
.subLine {margin-top: 4rem;}
.abtCont1 {padding: 4rem 2rem 0; display: block;}
.abtCont1 .le {position: relative; top: auto; height: auto; font-size: 3.2rem;}
.abtCont1 .ri {padding-top: 3rem; padding-left: 0;}
.abtCont1 .ri .ic img {height: 6rem; width: 6rem;}
.abtCont1 .ri .ic {margin-bottom: 8px;}
.abtCont1 .ri .m1 {font-size: 1.6rem;}
.abtCont1 .ri .m2 {font-size: 2rem;}
.abtCont1.bt {margin-top: 4rem;}
.histArea .hist.sec {margin-top: 16rem;}
.abtCont1 .ri .map {height: 36rem;}





}



@media (max-width:768px) {

#hd {height: 8rem;}
#hd .inArea {padding: 0 2rem;}
#hd .logo a img {height: 3.2rem;}
#subPage, #main {padding: 8rem 0 0;}
#mainVideo .txtCont {width: 32rem;}
#mainVideo .mask, #mainVideo .txtCont .focus {font-size: 2.8rem; width: 32rem;}
@keyframes mask {
  to {
    transform: translateX(240px);
  }
}

@keyframes text {
  to {
    transform: translateX(-240px);
  }
}
.typing {font-size: 4rem; height: 5rem;}
#mainVideo {margin-bottom: 5rem;}
#mainVideo .txtCont .txt2 {margin: 2.4rem 0 0; font-size: 1.6rem; word-break: keep-all;}
#mainVideo .txtCont .txt2 .blk {display: inline-block;}
#mainVideo .mask .line {width: 7rem; height: 3.6rem;}
.feaArea .contBox ul {display: block;}
.feaArea .contBox ul li {width: 100%; margin-bottom: 2rem;}
.feaArea .contBox .ic img {height: 6rem;}
.feaArea .contBox .half_cont .list h2, .feaArea .contBox h3 {font-size: 2rem;}
.feaArea .contBox .m1 {margin-top: 1.2rem;}
#mainSpc, #mainFea, #mainPtn {padding: 4rem 0;}
.feaArea .contBox {padding-top: 3rem;}
.feaArea .contBox .half_cont .list {width: 100%;}
.feaArea .contBox .half_cont .list .img {margin-bottom: 1.6rem;}
.ptnBox {padding-top: 3rem; margin: 0 -2rem;}
#main .wrap {overflow: hidden;}
.ptnBox ul li img {height: 6rem;}
.ptnBox ul li {width: 20rem; height: 8rem;}
#ft p.m1 {font-size: 1.5rem;}
#ft p.m2 {font-size: 1.3rem;}
#ft p.m3 {font-size: 1.3rem;}
#ft p.copy {font-size: 1.2rem;}
#ft .line {height: 10px;}
#ft .line.s3 {display: block; width: 0; height: 0; margin: 6px 0 0;}
.side_menu_close {height: 8rem;}
.allmenu {padding: 0 2rem;}
.allmenuwrap .lkbox {padding: 0 0 2rem; width: 100%; justify-content: center; height: auto;}
.allmenuwrap .lkbox a {font-size: 3rem;}
.allmenuwrap .rTxt {width: 100%; border-left: 0; border-top: 1px solid #494949; height: auto; padding-top: 2rem;}
.allmenuwrap {flex-direction: column;}
.allmenuwrap .lkbox ul li {margin: 2rem 0;}
.allmenuwrap .rTxt .contArea {padding: 0 0;}
.allmenuwrap .rTxt .list {margin: 2rem 0; display: flex; align-items: center;}
.allmenuwrap .rTxt .list .m1 {margin-bottom: 0; width: 6.4rem;}
.allmenuwrap .rTxt .list .m2 {flex: 1; font-size: 1.5rem; word-break: keep-all;}
.subTit .m1 {font-size: 1.6rem; padding: 0 2rem; word-break: keep-all;}
.subTit .m1 .blk {display: inline-block; word-break: keep-all;}
.subTit .m2 {font-size: 3.2rem; height: 4rem;}
.abtCont1 {padding: 3rem 1rem 0;}
.abtCont1 .ri {gap: 2rem;}
.abtCont1 .ri .list {width: 100%; padding: 1.6rem 1.6rem;}
.histArea .hist {width: 100%; margin-bottom: 4rem; padding: 0 0;}
.histArea .hist.sec {margin-top: 0;}
.histArea .hist .year {padding: 0 8px; font-size: 2.4rem;}
.histArea .hist .txt {padding: 0 0; padding-left: 5rem; margin-bottom: 4px; word-break: keep-all;}
.histArea .hist .txt span {left: 8px;}
.abtCont1 .ri .map {height: 24rem;}
.abtCont1 .ri .info {font-size: 1.6rem;}
.portCont {padding-top: 3rem;}
.portCont .list .h3 {font-size: 2rem; margin-top: 1.2rem;}
.portCont .list .tit img {height: 7rem;}
.portCont .list .subT {font-size: 1.6rem; word-break: keep-all;}
.portCont .list .img {margin-top: 2rem;}
.portCont .list .img ul li {width: 100%; padding: 1.2rem 0;}
.portCont .list .ovw {padding: 0 0;}
.portCont .list .ovw .inArea {padding: 2.4rem 1.6rem;}
.portCont .list .ovw .w50 {width: 100%;}
.portCont .list .ovw .w50 .txt div {word-break: keep-all;}
.portCont .list .ovw .w50:first-child {margin-bottom: 4rem;}
.portCont .list {margin-top: 8rem;}
.portCont .list .ovw .w50 h4 {font-size: 1.8rem;}
.ctus .contArea .frm {margin-bottom: 4rem;}
.contArea span,
.contArea input[type="text"]::placeholder, .contArea textarea::placeholder,
.contArea input[type="text"], .contArea textarea {font-size: 1.6rem;}
.contArea textarea:focus,
.contArea textarea:not(:placeholder-shown) {height: 20rem;}
.subTit {margin-top: 2rem;}








}