@charset "utf-8";

/* 레이어팝업 */
.layer_wrap{width: 100%; height: 100vh; position: absolute; top: 0; left: 0;}
.layer {position:absolute; top:70vh;  z-index:10; background:rgba(255, 255, 255, 0.8); padding:10px; max-width:505px; width: 100%;}
.layer .pop_wrap {position:relative;}
.layer .pop_wrap img {display:block; max-width:100%; width:500px; }
.layer .close {position:relative; background:#000; color:#fff; text-align:center; font-size:0.95em; line-height:40px;}
.layer .close label {margin:0 5px;}
.layer .close a {color:#fff; font-weight:600;}
.layer a.control { display:block; position:absolute; left:0; bottom:0; width:40px; height:40px; z-index:100; text-indent:-9999px; background:#333; overflow:hidden; }
.layer a.control::before {content:''; position:absolute; left:15px; top:13px; width:10px; height:10px; border-top:2px solid #fff; border-left:2px solid #eee; transform:rotate(-45deg); }
.layer a.control.next { background:#444; left:37px; transform:rotate(180deg);}


#layerpop01{left: 5%;}
#layerpop02{right: 5%;}
#layerpop03{left:5%; top:495px;}
#layerpop04{right:5%; top:520px;}
@media all and (max-width:1179px){
  /*.layer {top: 600rem;}*/
  .layer {top: 130rem; bottom: unset; left: 50% !important; transform: translateX(-50%); width: 90%;}
}
@media all and (max-width:599px) {
.layer {right:0 !important;}
  #layerpop01{left: inherit;}
	#layerpop03{left:inherit; top:200rem;;}
}

/* 비주얼 */
.visual{max-width: 1920rem; height: 100vh; margin: 0 auto; position: relative;}
.visual .vis_txt{position: relative; padding-top: 300rem; width: 1240rem; margin: 0 auto; z-index: 2; padding-left: 10rem;}

.visual .vis_txt .vis_t01{color:#00babc; font-size:48rem;  font-weight: 500;  line-height: 1.5; letter-spacing: -2px;}
.visual .vis_txt .vis_t02{font-size: 48rem; font-weight: 500; color: #fff; line-height: 1.5; margin-top: 10rem; letter-spacing: -2px;}

.visual .vis_slide{position: absolute; top: 0;}
.visual .vis_slide li{width: 100% !important;}
.visual .vis_slide img{width: 100%; height: 100%;}
.pagination_container{z-index: 4; padding-left: 10rem; margin-top: 20rem;}
.swiper-pagination-bullet{background: #fff; width: 28rem; height: 4rem; border-radius: 0; margin-right: 10rem;}

.scroll{position: absolute; left: 50%; transform: translateX(-50%); bottom: 26rem; color: #fff; font-size: 16rem; font-weight: 300;  animation: scroll 2s infinite; z-index: 3;}
.scroll span{padding-left: 56rem; position: relative; font-family: 'Montserrat';}
.scroll span::before{position: absolute; content: ""; width: 42rem; height: 42rem; left: 0; top: 50%; transform: translateY(-50%); background: url('../img/main/scroll.png') no-repeat center left;}

@keyframes scroll {
  0% {
      transform: translate(-50%, -50%)
  }

  50% {
      transform: translate(-50%, 0)
  }

  100% {
      transform: translate(-50%, -50%)
  }
}

@media all and (max-width:1300px) {
  /* .visual{padding: 10rem;} */
    .visual .vis_txt .vis_t01{font-size: 45rem;}
  .visual .vis_txt .vis_t02{font-size: 45rem;}
}
@media all and (max-width:1179px) {
  .visual{height: 600rem; background-size: cover; display: flex; align-items: center;}
  .visual .vis_txt{padding-top: 0;}
      .visual .vis_txt .vis_t01{font-size: 40rem;}
  .visual .vis_txt .vis_t02{font-size: 40rem; margin-top: 10rem;}
  .scroll{display: none;}
}
@media all and (max-width:760px) {
  .visual{height: 500rem; background-size: cover; display: flex; align-items: center;}
  .visual .vis_txt{padding-top: 80rem;}
    .visual .vis_txt .vis_t01{font-size: 34rem;}
  .visual .vis_txt .vis_t02{font-size: 34rem;}
  .visual .vis_slide img{object-fit: cover;}
}


.visual2 {position:relative;}
.visual2:before {content:''; position:absolute; top:0; left:0; width:100%; height:100%; background: rgba(0,0,0,0.4); background:linear-gradient(0deg, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0.6) 100%);}
.visual2 video {display:block; width:100%; height:100vh; object-fit:cover;}
.visual2 .txt {position:absolute; top:50%; left:50%; width:1380rem; transform:translate(-50%, -50%); font-size:47rem; color:#fff; line-height:1.3; font-weight:500; letter-spacing:-3px; text-shadow:0px 0px 20px rgba(0,0,0,1)}
.visual2 .txt .small {font-size:37px; font-weight:300; margin-bottom:7rem;}
.visual2 .txt .big span {color:#00babc; font-weight:600;}
@media all and (max-width:1440px){
.visual2 .txt {width:100%; padding:0 40rem;}
}
@media all and (max-width:1179px){
	.visual2 video {height:600rem;}
	.visual2 .txt {font-size:37rem; letter-spacing:-2px;}
	.visual2 .txt .small {font-size:27px;}
}
@media all and (max-width:760px){
	.visual2 video {height:500rem;}
	.visual2 .txt {display:none;}
}



.cont01{position: relative;}
.cont01::before{position: absolute; content: ""; background: url('../img/main/dot01.png') no-repeat; width: 174rem; height: 172rem; top: -100rem; right: 30rem;}

.cont01 .wrap02{max-width: 1675rem; margin: 0 auto;  position: relative;}

.cont01_txt{display: flex; justify-content: space-between; margin-top: 130rem; position: relative;}
.cont01_t01{display: block; text-indent: -9999px; background: url('../img/main/cont01_tit_240313.png') no-repeat; width: 450rem; height: 100rem; position: relative; margin-top: 80rem; background-size: contain;}
.cont01_txt::before{position: absolute; content: ""; background: url('../img/main/42_bg.png') no-repeat; width: 542rem; height: 420rem; left: -120rem; top: -68rem; z-index: -1;}
.cont01_t02{width: 100%; }
.cont01_t02 > div{display: flex; flex-wrap: wrap; justify-content: space-between;}
.cont01_t02 dl{width: 43%;}
.cont01_t02 dl:nth-child(even){margin-top: 160rem;}
.cont01_t02 dl dt span{color: #5b5b60; font-size: 50rem; font-weight: 500; font-style: italic; position: relative; font-family: 'Montserrat';}
.cont01_t02 dl dt span::before{position: absolute; content: ""; width: 24rem; height: 2rem; background: #5b5b60; right:-27rem; bottom: 11rem;}
.cont01_t02 dl dt p{color: #202026; font-size: 28rem; font-weight: 500; margin-top: 25rem; margin-bottom: 20rem;}
.cont01_t02 dl dt p em{color: #fff; background: #475b67; padding: 0 6rem;}
.cont01_t02 dl dd{color: #5b5b60; font-weight: 500; font-size: 20rem;}
.cont01_t02 dl dd span{font-family: 'Montserrat'; font-size: 24rem; font-weight: 600;}

a.cont01_view{width: 43%; display: block; float: right; margin-top: 180rem; color: #202026; font-size: 20rem; font-weight: 600; font-family: 'Montserrat';}
a.cont01_view span{position: relative; padding: 0 50rem 0 45rem; background: url('../img/main/more.png') no-repeat right bottom 2rem;}
a.cont01_view span::before{position: absolute; content: ""; background: transparent; width: 79rem; height: 79rem; left: 0; top: 50%; transform: translateY(-50%); border: 1px solid #e3e3e3; border-radius: 50rem; z-index: -1;}

@media all and (max-width:1623px) {
  .cont01 .wrap02{background-size: 750rem; background-position:left -500%, left 135rem bottom ;}
  .cont01_t01{width: 400rem;}
  .cont01_t02 dl{width: 48%;}
}
@media all and (max-width:1500px) {
  .cont01_t02 dl dt p{font-size: 25rem;}
  .cont01_t02 dl dt span{font-size: 40rem;}
  .cont01_t02 dl dd{font-size: 18rem;}
  .cont01_t02 dl dd span{font-size: 20rem;}
}
@media all and (max-width:1325px) {
  .cont01::before{display: none;}
  .cont01 .wrap02{background: none; padding-bottom: 0;}
  .cont01_txt{flex-wrap: wrap; justify-content: center;}
  .cont01_t01{width: 100%; background-position: center center; margin-top: 0;}
  .cont01_t02{width: 100%; padding: 20rem;}
  .cont01_t02 > div{margin-top: 50rem; row-gap: 40rem
    ;}
  .cont01_t02 dl{width: 50%; text-align: center;}
  .cont01_t02 dl:nth-child(even){margin-top: 100rem;}
  a.cont01_view{width: 100%; text-align: center; font-size: 17rem; margin-top: 100rem;}
  a.cont01_view span::before{width: 60rem; height: 60rem;}
}
@media all and (max-width:900px) {
  .cont01_txt{margin-top: 48rem;}
  .cont01_t01::before{left: 0; background-size: 74%;}
  .cont01_t02 dl:nth-child(even){margin-top: 0;}
  .cont01_t02 dl dt p{font-size: 22rem;}
  .cont01_t02 dl dd span,
  .cont01_t02 dl dd{font-size: 17rem;}
}
@media all and (max-width:660px) {
  .cont01_t01::before{background-size: 60%;}
  .cont01_t02 > div{margin-top: 10rem;}
  .cont01_t02 dl{width: 100%;}
  .cont01_t02 dl dt p{font-size: 24rem;}
  .cont01_t02 dl dd span,
  .cont01_t02 dl dd{font-size: 19rem;}
}

/*바로가기메뉴*/
.quickmenu {
    padding: 100rem 0;
    position: relative;
}
/* .quickmenu::after {
    content: '';
    position: absolute;
    display: block;
    width: 100%;
    max-width: 703rem;
    height: 326rem;
    background: url("../img/main/cont01_bg.png") no-repeat center top;
    background-size: contain;
    top: 40rem;
    right: 0;
    z-index: -2;
} */
.quickmenu > ul {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    margin: 0 auto;
    width: calc(100% - 80rem);
}
.quickmenu > ul > li {margin: 10rem 0;}
.quickmenu > ul > li > a {
    display: block;
    padding: 15rem 25rem 15rem 20rem;
    position: relative;
    background: #04809f;
    border: 2px solid #04809f;
    border-radius: 50rem;
    min-width: 185rem;
    text-align: center;
}
.quickmenu > ul > li > a:hover {
  background: #ffffff;
  box-shadow: 1px 1px 10px #97bcc5;
}
/* .quickmenu > ul > li > a::after {content: ''; display: block; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); width: 0; height: 7rem; border-radius: 10rem; background: #04809f; transition: 0.2s;} */
/* .quickmenu > ul > li > a:hover::after {width: 100%;} */
.quickmenu > ul > li > a span {
  color: #ffffff;
  font-size: 20rem;
  font-weight: 600;
  padding-left: 54rem;
  position: relative;
}
.quickmenu > ul > li > a span::before {
    content: '';
    display: block;
    width: 50rem;
    height: 50rem;
    background: url("../img/main/quickicon.png") no-repeat;
    background-size: 300% auto;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}
.quickmenu > ul > li > a:hover span {color: #04809f;}
.quickmenu > ul > li > a:hover span::before {
  background: url("../img/main/quickicon-color.png") no-repeat;
}
/* .quickmenu > ul > li > a:hover span::before {
    transform: scale(1.3);
    -webkit-transform: scale(1.3);
    -moz-transform: scale(1.5);
    -ms-transform: scale(1.5);
    -o-transform: scale(1.5);
    transition: 0.5s;
} */
.quickmenu > ul > li.icon01 > a span::before {
    background-position: 0 0;
}
.quickmenu > ul > li.icon02 > a span::before {
    background-position: 50% 0;
}
.quickmenu > ul > li.icon03 > a span::before {
    background-position: 100% 0;
}
.quickmenu > ul > li.icon04 > a span::before {
    background-position: 0px 100%;
}
.quickmenu > ul > li.icon05 > a span::before {
    background-position: 50% 100%;
}
.quickmenu > ul > li.icon06 > a span::before {
    background-position: 100% 100%;
}

@media all and (max-width:1450px) {
    .quickmenu {
        padding: 0;
    }
    .quickmenu > ul {
        justify-content: flex-start;
    }
    .quickmenu > ul > li {
        width: 33.3%;
        text-align: center;
        margin: 10rem 0;
        padding: 0 20rem;
    }

}
@media all and (max-width:840px) {
    .quickmenu {
        width: 100%;
    }
    .quickmenu > ul {width: 100%;}
    .quickmenu > ul > li {padding: 0 15rem;}
    .quickmenu > ul > li > a {width: 100%; min-width: unset; padding: 15rem 15rem 15rem 10rem;}
    .quickmenu > ul > li > a span {font-size: 18rem;}
}
@media all and (max-width:565px) {
  .quickmenu > ul > li {padding: 0 5rem;}
.quickmenu > ul > li > a span {padding-left: 49rem;}
.quickmenu > ul > li > a span::before {width: 45rem; height: 45rem;}
}
@media all and (max-width:500px) {
    .quickmenu > ul > li {
        width: 50%;
    }
}

.cont02{margin-top: 100rem;}
.cont02 h2{color: #202026; text-align: center; font-size: 40rem; font-weight: 400; letter-spacing: -1px; position: relative; padding-bottom: 30rem;}
.cont02 h2::before{position: absolute; content: ""; width: 76rem; height: 7rem; border-radius: 10rem; background: #04809f; bottom: 0; left: 50%; transform: translateX(-50%);}

.cont02 h2 span{text-indent: -9999px; display: inline-block; background:url('../img/main/cont02_tit.png') no-repeat 0 14rem; width: 66rem; height: 61rem; margin-right: 10rem;}
.cont02 h2 strong{font-family: 'Montserrat'; font-size: 46rem;}
.cont02 h2 em{font-size: 40rem; font-weight: 600;}


.topic{margin: 100rem 0 120rem; overflow: hidden; white-space: nowrap; }
.topic > div{display: flex; margin-bottom: 28rem; margin-top: 5rem;}
.topic > div p{padding: 10rem 20rem 12rem 27rem; border-radius: 50rem; margin: 0 19rem; border: 2px solid #04809f; color: #04809f; font-size: 20rem; font-weight: 600; font-family: 'Montserrat', 'NotoSansKR'; box-shadow:1px 1px 10px #97bcc5;}
.topic > div p span{padding: 0 20rem;  position: relative; z-index: 99; }
.topic > div p span::before{position: absolute; content: '\0023'; background: transparent; left: 0; top: 50%; transform: translateY(-50%); color: #04809f; font-size: 17rem; z-index: 100;}

.swiper-wrapper {
  transition-timing-function: linear;
  width: auto !important;
}

.swiper-slide{width: auto !important;}

  @media all and (max-width:1325px) {
    .cont02{margin-top: 100rem;}
    .topic{margin: 60rem 0 70rem;}
    .topic > div p{padding: 6rem 20rem 9rem 27rem; font-size: 18rem;}
  }
  @media all and (max-width:900px) {
    .topic > div{margin-bottom: 20rem;}
    .topic > div p{padding: 5rem 15rem 8rem 20rem; font-size: 17rem; margin: 0 10rem;}
    .cont02 h2,
    .cont02 h2 em{font-size: 36rem;}
    .cont02 h2 strong{font-size: 40rem;}
    .cont02 h2 span{background-size: 90%; margin-right: 0;}
  }
  @media all and (max-width:660px) {
    .topic > div{animation-duration: 10s;}
    .cont02 h2, .cont02 h2 em{display: block;}
  }

.cont03{background: url('../img/main/cont03_bg.jpg') no-repeat; background-size: cover; height: 480rem;}
.cont03 .wrap03{max-width: 1380rem; margin: 0 auto; display: flex; height: 100%; align-items: center; justify-content: space-between;}

.cont03_left .left_txt{color: #fff; font-size: 20rem; position: relative; padding-left: 216rem; margin-top: -17rem;}

.cont03_left .left_txt span{ font-family: 'Montserrat'; }

.cont03_right a{display: flex; align-items: center; width: 360rem; height: 75rem; color: #fff; background: #000 url('../img/main/arrow.png') no-repeat center right 34rem; border: 1px solid #000; font-size: 21rem; font-weight: 500; padding: 0 48rem; box-shadow: 1px 0 10px rgba(255, 255, 255, 0.18);}

.cont03_right a:nth-child(2){margin-top: 18rem; border: 1px solid #fff; background-color: rgba(0, 0, 0, 0.28);}

@media all and (max-width:1400px) {
  .cont03 .wrap03{padding: 0 20rem;}
}
@media all and (max-width:1300px) {
  .cont03 .wrap03{padding: 0 20rem;}
  .cont03_left .left_txt{font-size: 17rem;}
  .cont03_right a{width: 300rem; font-size: 18rem;}
}
@media all and (max-width:1090px) {
  .cont03{height: auto; padding: 50rem 20rem;}
  .cont03 .wrap03{flex-wrap: wrap;}
  .cont03 .wrap03 > div{width: 100%; text-align: center;}
  .cont03_left .left_txt{padding-left: 0; margin-top: 10rem;}
  .cont03_left p img{width: 320rem;}
  .cont03_right{display: flex; align-items: center; justify-content: center; margin-top: 30rem;}
  .cont03_right a:nth-child(2){margin-top: 0; margin-left: 20rem;}
}
@media all and (max-width:600px) {
  .left_txt br{display: none;}
  .cont03_right a{padding: 0 30rem; background-position: center right 24rem;}
}
@media all and (max-width:530px) {
  .cont03_right{flex-wrap: wrap;}
  .cont03_right a:nth-child(2){margin-left: 0; margin-top: 10rem;}
}



.mnav nav .depth02{display: none;}

/*외국어*/
.cont01.en .cont01_t01{ background: url('../img/main/cont01_tit-en.png')no-repeat;}


@media all and (max-width:623px) {
	.cont01.en .cont01_t01{width: 400rem;}
}


@media all and (max-width:1320px) {
	.cont01.en .cont01_t01{width: 100%;background-position: center center;margin-top: 0;}
}

@media all and (max-width:768px) {
	.cont01.en .cont01_t01{background-size: 360rem;}
}

@media all and (max-width:660px) {
    .cont01.en .cont01_t01{background-size: 360rem;}

}

@media all and (max-width:480px) {
.visual.en .vis_t02{font-size:30rem;}
}