@charset "utf-8";
@import url(http://cdn.jsdelivr.net/nanumsquare/1.0/nanumsquare.css);

* {
  letter-spacing: -1px;
}

body {
  font-family: 'NanumSquare', sans-serif !important;
  font-weight: 400 !important;
}

h1,h2,h3,h4,h5,h6 {
  font-family: 'NanumSquare', sans-serif !important;
  font-weight: 400 !important;
}
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
}
h1, h2, h3, h4, h5, h6 { font-weight: normal;}
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}
ol, ul {list-style: none;}
blockquote, q {	quotes: none;}
blockquote:before, blockquote:after,
q:before, q:after {content: '';content: none;}
table {border-collapse: collapse;border-spacing: 0;}
img { border: 0; vertical-align: middle;}
a { color: #000; text-decoration: none;}
a:hover, a:focus, a:visited { text-decoration: none;}
* {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
html,body { width:100%; }
#wrap {position:relative; width:100%;}
body { overflow-x:hidden; }

.container {
  margin: 0 auto;
  width: 1280px;
  position: relative;
  overflow: hidden;
}
.header-wrap {
  position: fixed;
  left: 0px;
  top: 0px;
  width: 100%;
  z-index: 9999;
}

.header-wrap .logo {
  float: left;
  line-height: 100px;
}

.header-wrap .logo a {
  display: inline-block;
}

.header-wrap #logo_c {
  display: none;
}

.header-wrap.fixed {
  background-color: #fff;
  border-bottom: 1px solid rgba(195, 195, 195, 0.2);
}
.header-wrap.fixed #logo_w {
  display: none;
}

.header-wrap.fixed #logo_c{
  display: inline-block;
}
.header-wrap .header {
  width: 1280px;
  height: 100px;
  position: relative;
  line-height: 100px;
}

.header {
  overflow: inherit;
}
.header #gnb {
  float: left;
  padding-left: 200px;
}

.header #gnb .main_menu {
  float: left;
  text-align: center;
  padding: 0 30px;
}

.header #gnb .main_menu> a {
  display: block;
  font-size: 17px;
  color: #fff;
}

.header-wrap.fixed #gnb .main_menu> a {
  color: #404142;
}

.header #gnb .main_menu>:first-child a {
  margin-left: 0px;
}

.header .link {
  float: right;
  width: 100px;
}

.header .link a {
  line-height: 100px;
}

.header .link a+a {
  margin-left: 15px;
}
/* 서브메뉴 */
.sub_wrap_w{display:none;background-color: #2e55d1;position: fixed;left:0;width:100%;top:101px}
.sub_wrap_w .container{display: flex;flex-wrap: wrap;justify-content: space-between;    padding: 0 100px 0 350px;}
.sub_wrap_w .sub_menu{padding: 30px 0;}
.sub_wrap_w .sub_menu:nth-child(2) li:first-child a,.sub_wrap_w .sub_menu:nth-child(4) li:first-child a{color: #fefe01 !important;}
.sub_menu li {
  line-height: 2;
}
.sub_menu li a {
  color:#fff;
  font-size:15px;
  display: block;
  font-weight: 900
}

.sub_menu li:hover a {
  color: #fefe01 !important;
}
.quick_wrap{    position: fixed;
    bottom: 60px;
    right: 20px;
    z-index: 1000;}
.quick_wrap ul{display: none;text-align: center}
.quick_wrap ul li{margin-bottom: 10px}
.quick_wrap .quick_btn{background: url(../image/quick_btn.png) no-repeat center / cover;width:61px;height: 70px; text-align: center;
    line-height: 55px;cursor: pointer;}
.quick_wrap .quick_btn>div{width:.5rem;
 height:.5rem;
 background-color:#fff;
 border-radius:100%;
 display:inline-block;
 margin:0 0 0 .2rem;
 -webkit-animation:bounce 1.4s ease-in-out infinite both;
 animation:bounce 1.4s ease-in-out infinite both}
.quick_wrap .quick_btn .bubble1 {
  -webkit-animation-delay:-.32s;
  animation-delay:-.32s
 }
.quick_wrap .quick_btn .bubble2 {
  -webkit-animation-delay:-.16s;
  animation-delay:-.16s
 }
 @-webkit-keyframes bounce {
  0%,
  80%,
  to {
   -webkit-transform:scale(0)
  }
  40% {
   -webkit-transform:scale(1)
  }
 }
 @keyframes bounce {
  0%,
  80%,
  to {
   transform:scale(0)
  }
  40% {
   transform:scale(1)
  }
 }
/* footer */
.footer-wrap { background:#ededed; width:100%; font-family: "NanumSquare";}
.footer {overflow:hidden; padding:40px 0 40px 20px;  text-align:left;}
.footer .ft_logo{float:left;}
.footer .ft_txt { float: right;    width: 80%;color: #888888;font-size: 14px;}
.footer .ft_txt a{ color:#888888;}
.footer .ft_txt .divide { display:inline-block; color:#565658; margin:0px 7px; }
.footer .ft_txt p {line-height: 1.6;margin-top: 10px}
.footer .ft_txt p #may{float: right}

.sub_wrap .wide_cont {
  text-align: center;
}
.sub_wrap .wide_cont img{
  width:100%
}
.sub_wrap .wide_cont .container img{
  width:auto
}
/* 메인슬라이드 */
#mo_visual{display: none}
.visual-wrap {
  position: relative;
  width: 100%;
  height: 100vh;
}

.visual-wrap .bx-wrapper {
  width: 100%;
  height: 100%;
}

.visual-wrap .bx-viewport,
.visual-wrap .bx-wrapper ul {
  height: 100% !important;
}

.visual-wrap .bx-wrapper ul li {
  height: 100%;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}
.visual-wrap .txt-wrap {
  height: 100%;
}
.visual-wrap .txt-ani{
  -ms-display: flex;
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100%;
position: absolute;
top: 0;
width: 100%;
z-index: 999
}
.visual-wrap .txt-ani .txt1{ opacity: 0;}
.visual-wrap .txt-ani .txt2{ opacity: 0;margin-top: 30px;}
.visual-wrap #bg01 .txt-ani .txt1{margin-left: -50px;}
.visual-wrap li.on .txt1{
  animation: fade 1.5s .2s forwards;
}
.visual-wrap li.on .txt2{
 animation: slideup 1.5s 1s forwards;
}
@keyframes fade{
  0% {
    opacity:0;
  }
  100% {
    opacity:1;
  }
}
@keyframes slideup{
  from{
    transform:translateY(20px);
  }
  to{
    opacity: 1;
    transform:none;
  }
}

.visual-wrap #bx-bt {
  text-align: right;
  font-size: 0.85em;
  color: #fff;
  right: 0;
  left:0;
  bottom:20px;
  position: absolute;
  display: block !important;
      z-index: 999;
          overflow: inherit;
}
.visual-wrap #bx-bt::after{display: block;content:'';clear: both;}
.visual-wrap #bx-bt #bx-arrow{display: inline-block}
.visual-wrap #bx-bt #bx-arrow{margin-left:20px;}
.visual-wrap #bx-bt #bx-arrow .slide_arrow + .slide_arrow::before{content: '|';display: inline-block;color:#fff;margin:0 30px}
.visual-wrap #bx-bt #bx-arrow .slide_arrow{display: inline-block}
.visual-wrap #bx-bt .slide_arrow a{color:transparent;    line-height: 26px;}
.visual-wrap #bx-pager{position: absolute;left:0;top: 0;z-index: 999;transform: translate(0, -55%);top: 55%;}
.visual-wrap #bx-pager a{display: block;position: relative;color:#b4b8bc;margin-left: 50px;font-size: 17px}
.visual-wrap #bx-pager a+a {
  margin-top: 15px;
}
.visual-wrap #bx-pager a:hover,
.visual-wrap #bx-pager a.active{
color:#dceb0c;
font-weight: bold;
}
.visual-wrap #bx-pager a.active::before{
  display: inline-block;
  content: '';
  width:40px;
  height: 2px;
  background: #dceb0c;
  vertical-align: middle;
  margin-left: -50px;
  margin-right: 10px
}
.visual-wrap .bx-prev {
  background: url(../image/slide_arrow.png) no-repeat center / contain;
  left: 0;
}

.visual-wrap .bx-next {
  background: url(../image/slide_arrow02.png) no-repeat center / contain;
  right: 0;
}
.visual-wrap .scroll {
  position: absolute;
  left: 0px;
  right: 0px;
  bottom: 20px;
  z-index: 500;
  margin: 0px auto;
  width: 27px;
}
#section01{background: #f2f2f2 url(../image/section01_bg.jpg) repeat-y center top;padding: 140px 0}
#section01 ul{display: flex;flex-wrap: wrap;margin-top: 80px}
#section01 ul li{width:424px}
#section01 ul li:nth-child(1){margin-top: 80px}
#section01 ul li:nth-child(2){margin-top: 200px}
#section01 ul li .img{overflow: hidden;}
#section01 ul li:hover .img{
  border: solid 8px;
  border-image: linear-gradient(to right, #25aae1 0%, #007ac3 100%);
  border-image-width: 8px;
  border-image-slice: 1;
  box-sizing:border-box;
  transition: all 0.1s;
}
#section01 ul li:hover .img img {
  margin: -8px;
  transition: all 0.1s;
}
#section01 ul li .txt{margin-top: 40px}
#section02{padding:140px 0 0;position: relative;}
#section02 .container{height: 986px;overflow: visible;}
#section02 img:first-child{margin: 50px 0 70px}
#section02 img:last-child{position: absolute;right:0;bottom:0}
#section03{padding:120px 0;}
#section03 ul {
	display: flex;
	width: 1000%;
}

#section03 ul li {
	margin-right: 30px;
}
#section03 .swiper-container{position: relative;    text-align: center;}
#section03 .swiper-scrollbar{position: relative !important;background: #fff;margin: 0 auto 50px;left:auto;bottom:auto;width:30% !important}
#section03 .swiper-scrollbar-drag{background: #007ac3;}
#section03 .swiper-scrollbar-drag::after{display: block;content: '';width:28px;height: 28px;background-image: url(../image/section03_page.png);position: absolute;right:-8px;top:-8px;z-index: 9}
/* #section03 .swiper-pagination{position: relative;margin-bottom: 90px}
#section03 .swiper-pagination-bullet{width:200px;height: 10px;opacity: 1;margin: 0;z-index: -1;position: relative;vertical-align: top;background: #f2f2f2;border-radius: 0}
#section03 .swiper-pagination-bullet:last-child{border-radius: 0 10px 10px 0;}
#section03 .swiper-pagination-bullet-active{background:#007ac3;z-index: 1;border-radius: 10px 0 0 10px}
#section03 .swiper-pagination-bullet-active::after{display: block;content: '';width:28px;height: 28px;background-image: url(../image/section03_page.png);position: absolute;right:-8px;top:-8px;z-index: 9}
#section03 .swiper-pagination-bullet-active:nth-child(2) {width:400px;margin-left: -200px}
#section03 .swiper-pagination-bullet-active:nth-child(3) {width:600px;margin-left: -400px}
#section03 .swiper-pagination-bullet-active:nth-child(4) {width:800px;margin-left: -600px;border-radius: 10px;} */
/* #section03 .prev,#section03 .next{    text-indent: -9999px;color:transparent;cursor: pointer;
    outline: 0;
    width: 40px;
    height: 60px;
    position: absolute;
    top: 50%;z-index: 999;
  background-repeat: no-repeat;}
  .swiper-button-prev:after, .swiper-button-next:after{display: none}
  #section03 .prev {
    left: 50%;
    margin-left: -350px;
    background-image: url(../image/section03_arrow.jpg);
  }

  #section03 .next {
    right: 50%;
    margin-right: -350px;
    background-image: url(../image/section03_arrow.jpg);
    transform: rotate(-180deg)
  } */

#section03 ul li{width:auto !important;
  }
 #section03 ul li .img_wrap img{width:100%}
#section04{padding: 260px 0 140px;position: relative;}
#section04_bg{position: absolute;top:140px;left: 50% !important;}
#section04 #bx-bt{margin-bottom: 30px}
#section04 .prev,#section04 .next{display: inline-block;text-indent: -9999px;color:transparent;cursor: pointer;
      outline: 0;
      width: 50px;
      height: 50px;
    background-repeat: no-repeat;}
    .swiper-button-prev:after, .swiper-button-next:after{display: none}
#section04 .prev {
      background-image: url(../image/section04_arrow.jpg);
    }

#section04 .next {
  margin-left: -5px;
      background-image: url(../image/section04_arrow.jpg);
      transform: rotate(-180deg)
    }

#section05 .container{padding: 130px 0}
#section05 .container ul{display: flex;flex-wrap: wrap;justify-content: space-between;margin-top:60px}
#section05 .container ul li{width:200px;}
#section07 .container ul{display: flex;flex-wrap: wrap;margin-bottom: 140px;}
#section07 .container ul li:last-child{margin-left: 30px}
#section08 .video{height:540px;overflow: hidden;position: relative;}
#section08 .video p{font-size: 2.3vw;line-height: 1.4;color:#fff;position: absolute;z-index: 9;transform: translate(-50%, -50%);top: 50% !important;left:50%}
#section08 .video .video_w{transform: translate(0, -55%);top: 55% !important;padding:56.25% 0 0 0;position:relative;}
#section08 .video .video_bg{position: absolute;top:0;left: 0;width:100%;height: 100%;background: rgba(0,0,0,0.3);z-index: 99;}
#section09 .container ul{display: flex;flex-wrap: wrap;justify-content: space-between;margin-bottom: 140px;}
#section10 .video{margin-bottom: 140px;position: relative;padding:0 5px;height: 720px;overflow: hidden;}
#section10 .video iframe{margin-top:-1px;}
#section10 .video::before{display: block;content: '';width:1280px;height: 8px;background: #00b1b6;z-index: 9;position: relative;margin-left: -5px;}
#section11{background: url(../image/section11_bg.jpg) no-repeat center center / cover;
    width: 100%;
    height: 975px;}
#section11 #tit{margin: 130px auto 80px;display: block}
#section11 .bx-wrapper {
  position: relative;
}
#section11 .slider_wrap{height: 500px}
#section11 .slider{
      float: left;
    width: 940px;
}

#section11 .tour_img {
  width: 940px;
  height: 500px;
  float:left;
}

#section11 .tour_img img {
  width: 100%
}
#section11 .tour_txt{
  background: #25aae2;
  float:right;
  width:calc(100% - 940px);
  height: 500px;
  color:#fff;
  padding: 70px 40px;
  position:relative;
}
#section11 .tour_txt h1{
  font-size:45px;
  font-weight: 300 !important;
  line-height: 55px;
}

#section11 .tour_txt h1 b{
  font-weight: bold !important;
}
#section11 .tour_txt h1::after{
  display: block;
  content: '';
  width:2px;
  height: 60px;
  margin:30px 0;
  background: #fff;
}
#section11 .tour_txt p{
  font-size: 24px;
  font-weight: 300;
  display: none;
}
#section11 .tour_txt li.active p{
  display: block;
}
#section11 .tour_txt a{
  display: block;
      position: absolute;
    bottom: 40px;
}
#section11 .pager {
  position: absolute;
  bottom: 30px;
  right: 400px;
  width: 245px;
}

#section11 .pager .bx-wrapper {
  background: none !important;
}

#section11 .tour_page li {
  display: block;
  height: 45px;
  width: 75px !important;
  margin-right: 10px;
  float: left;
  position: relative;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}

#section11 .tour_page li span {
  background: rgba(0, 0, 0, 0.35);
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  transition: all 0.2s;
}

#section11 .tour_page li:last-child {
  margin-right: 0;
}

#section11 .tour_page li.active span {
  border: 4px solid #25aae2;
  background: none;
}

#section11 .bx-controls {
  position: absolute;
  top: 0;
}

#section11 .bx-controls-direction {
  width: 940px;
  height: 500px;
  position: relative;
}

#section11 .bx-controls-direction a {
  width: 40px;
  height: 86px;
  text-align: center;
  line-height: 86px;
  top:calc(50% - 40px);
  margin-top: 0;
  z-index: 80;
  text-indent: -9999px;
  position: absolute
}

#section11 .bx-prev {
  background: url(../image/tour/tour_arrow.png) no-repeat;
}

#section11 .bx-next {
  background: url(../image/tour/tour_arrow.png) no-repeat;
  right: 0;
  transform: rotate(-180deg) !important;
}
#section12 .but-wrap{margin-bottom: 150px}
#section12 .but-wrap ul {
  width: 100%;
}
#section12 .but-wrap::after{display: block;content: '';clear: both;}
#section12 .but-wrap .but_l{float:left;margin-right: 10px;height: 590px;}
#section12 .but-wrap .but_l .full a{width:830px;height: 311px}
#section12 .but-wrap .but_l .half a{width:410px;height: 270px;float:left}
#section12 .but-wrap .but_l .half a + a{margin-left: 10px;}
#section12 .but-wrap .but_r{float:right;}
#section12 .but_cont li{ overflow: hidden;position:relative;}
#section12 .but_cont li + li{margin-top: 10px;}
#section12 .but_cont li a{display:block;position: relative;}
#section12 .but_r li a{width:440px;height: 590px}
#section12 .but_cont li:hover img{
  height: 105%;
  transition: all 0.3s;
}
#section12 .but_cont li a img {
  position: absolute;
  top: 50%;
  left: 50%;
  height: 100%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  transition: all 0.3s;
}
#map{position: relative;
  width: 100%;}
  .panel {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    font-size: 60px;
    text-align: center;
    color: #fff;
  }
  #map .map-left{background: #007ac3;width:40%;height: 450px;z-index: 9;
    position: relative;}
    #map .map-txt{position:absolute;right:50px}
#map .map-img{    width: 100%;
    position: absolute;
    z-index: 1;
    right: 0;
    top: 0;}
#map .root_daum_roughmap .wrap_controllers {
  display: none;
}

/* 로그인팝업 */
.modal {
    width: 100%;
    height: 100%;
    background: #000;
    filter: alpha(opacity=85);
    opacity: 0.8;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 99998;
    display: none;
}
.layerPop {
    z-index: 99999;
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    width: 484px;
    padding: 60px 78px;
    min-height: 220px;
    background: #fff;
    box-shadow: 5px 10px 2px rgba(0,0,0,.1);
}
.layerPop.wideWidth{width:960px; margin-left:-550px; padding:70px 50px;}
.layerPop.wideWidth .selectArea input{width:160px !important;}
.layerPop.maxWidth{width:901px; margin-left:-480px; padding:50px 95px;}
.layerPop.smallWidth{width:480px; margin-left:-240px; padding:20px 0;}
.layerPop .btnX{position:absolute; top:30px; right:30px; z-index:99999;}
.layerPop .thk{text-align:center; padding:60px 0 0 0;}
.layerPop .cpw{text-align:center; padding:100px 0 0 0;}
.layerPop .cpw .text{margin:10px auto 0 auto; display:block;}
.layerPop .bigPic{text-align:center;}
.layerPop .bigPic img{max-width:750px;}
.layerPop .bigPic span.msg{display:inline-block; font-size:12px; width:750px; text-align:left; margin:10px 0;}
.layerPop .bigPic span.msg strong{font-size:14px;}
.layerPop .popPrev{position:absolute; top:45%; left:90px;}
.layerPop .popNext{position:absolute; top:45%; right:90px;}
.layerPop .commonPop .textBox{margin:40px 0 0 0; padding:20px; border:1px solid #dcdcdc; overflow:auto; overflow-X:hidden; height:390px;line-height: 1.5;font-size:14px; color:#8d8d8d;}
.layerPop .commonPop h2{ font-size:25px; font-weight:800 !important; color:#333;    margin-bottom: 20px !important; }
.layerPop .commonPop .desc { color:#888888; font-size:16px; letter-spacing:-1px; font-weight:400; line-height: 1.4;word-break: keep-all;}
.layerPop .commonPop .emphasis { font-size:16px; color:#333333; line-height: 1.5 }

.layerPop .popTit{display:block; margin-bottom:20px;}
.layerPop .popText{text-align:center; padding:30px 0; border:1px solid #dcdcdc; border-left:none; border-right:none;}
.layerPop .popText2{text-align:center; padding:30px 0;}
#popLogin{position:fixed !important; top:50% !important; left:50% !important; margin:-345px 0 0 -450px !important; padding:50px 95px 70px 95px; }
#popPrivacy,#popTerms{position:fixed !important; width:1010px; height:auto;   }

.layerPop .welcomeNotice{padding:20px 0 0 0; color:#888888; font-size:15px; font-weight:500;line-height: 1.4}
.layerPop .welcomeNotice .divide { color:#cdcdcd; display:inline-block; margin:0px 10px; }
.layerPop .welcomeNotice .blue{color: #09baee !important;}
.login-wrap { position:relative; width:860px; margin:0px auto; padding:60px 80px; }
.login-wrap .loginBox { border:1px solid #dcdcdc; width:100%; box-sizing:border-box; overflow:hidden; padding:95px 0px 80px; }
.login-wrap .loginBox .con { width:425px; overflow:hidden;  position:relative; margin:0px auto; }
.login-wrap .loginBox .con li { line-height:16px; margin-top:15px; overflow:hidden; }
.login-wrap .loginBox .con li:first-child { margin-top:20px; }
.login-wrap .loginBox .con li span { font-size:15px; color:#888888; font-weight:500; }
.login-wrap .loginBox .con li a { font-size:16px; color:#333333; font-weight:bold; }
.login-wrap .loginBox .top { padding-bottom:35px; border-bottom:1px solid #d7d7d7; }
.login-wrap .loginBox .input-wrap { width:301px; overflow:hidden;}
.login-wrap  .loginBox .text{height:40px; margin-top:10px; font-size:15px; padding:7px 10px; border:1px solid #dbdbdc; display:inline-block; }
.login-wrap  .loginBox .text:first-child { margin-top:0px; }
.login-wrap  .loginBox .loginBtn{ margin-left:15px; }
.login-wrap  .loginBox .loginTxt{border-bottom:1px solid #d7d7d7; }
.login-wrap  .loginBox ul{margin:130px 0 0 0;}
.loginBox ul li{margin:8px 0 0 0;}
.fl-l { float: left;}
.fl-r { float: right;}
.fl-no { float: none;}