@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;max-width:100%}
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: 100%;
  position: relative;
  overflow: hidden;
}
.header-wrap {
  position: fixed;
  left: 0px;
  top: 0px;
  width: 100%;
  z-index: 999999;
  background: #fff;padding: 0;height: 100px;line-height: 100px
}

.header-wrap .logo {
  float: none;
  text-align: center;
  line-height: 100px;
}

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


.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: 100%;
  height: 100px;
  position: relative;
  line-height: 100px;
}

.header {
  overflow: inherit;
}



.mo_close { position:absolute; right:-40px; top:10px;display:none;}
.mo_close img{height:30px}
.mo_menu {display: block;font-size: 0;top: 0;position: absolute;left: 0;cursor: pointer;width:80px;text-align: center;
    line-height: 100px;}
.mo_menu img{height: 20px;vertical-align: middle;}

/* 서브메뉴 */
.bg{
  z-index: 999;
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: #000;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
  filter: alpha(opacity=60);
  -moz-opacity: 0.6;
  -khtml-opacity: 0.6;
  opacity: 0.6;
  display: none}
.nav {
  background: #fff;
  position: fixed;
  z-index: 1000;
  width: 250px;
  height: 100%;
  left: -250px;
  top: 0;
      line-height: initial;
}
.nav #gnb li {
  position: relative;
}

.nav #gnb>li>a {
  font-size: 15px;
  display: block;
  padding: 10px;
  border-bottom: solid 1px #f1f1f1;
  font-family: 'NanumSquare', sans-serif !important;
}

.nav #gnb>li>a:after {
  content: '';
  display: block;
  background: url(../image/menu_down.png) no-repeat center/100% 100%;
  width: 11px;
  height: 6px;
  position: absolute;
  right: 15px;
  top: 13px;
}

.nav #gnb>li.active a:after {
  background-image: url(../image/menu_up.png);
  z-index: 9;
}

.nav #gnb>li.active a {
  color: #0f3432;
}

.nav #gnb>li.active .sub_menu {
  display: block !important
}

.nav #gnb>li .sub_menu {
  background: #f9f9f9;
  padding: 12px 10px;
  display: none;
}

.nav #gnb>li .sub_menu>li>a {
  display: block;
  font-size: 13px;
  color: #000;
  padding: 5px 0;
      font-family: 'NanumSquare', sans-serif !important;
}
.header .link {
  padding: 10px;
  background: #f9f9f9;
}

.header .link a {
  font-size: 12px;
  width: 49%;
  display: inline-block;
      font-family: 'NanumSquare', sans-serif !important;
}

.header .link .mem {
  display: none
}

.header .link a img {
  width: 25px;
  margin-right: 3px;
}
.header .mo_close {
  display: none;
  top: 0;
  position: absolute;
  right: -60px;
  padding: 10px;
      z-index: 999;
}

.foofix{border-bottom:1px solid #ccc;position:fixed; bottom:0px;z-index:99999;width:100%;}
.foofix ul{overflow:hidden;}
.foofix ul li{float:left;width:25%;}
.foofix ul li img{width:100%}
/* footer */
.footer-wrap { background:#ededed; width:100%; font-family: "NanumSquare";padding-bottom: 70px}
.footer {overflow:hidden;}
.footer .ft_txt {color: #5d5d5d;font-size: 14px;text-align: center}
.footer .ft_txt address{border-top:solid 1px #d7d7d7;font-style: normal;padding: 20px 0}
.footer .ft_txt address p {line-height: 1.6;}
.footer .ft_txt address p:last-child{margin-top: 10px}
.footer .ft_txt address p #may{display: block;font-size:13px;border-top: none}
.footer .ft_txt .policy_list{display: inline-block;    overflow: hidden;padding: 10px 0;}
.footer .ft_txt .policy_list li {
  float: left;
  position: relative;
  margin-right: 24px;
}

.footer .ft_txt .policy_list li+li:before {
  content: "|";
  display: block;
  font-size: 12px;
  color: #5d5d5d;
  position: absolute;
  left: -12px;
  top: 2px;
}
.footer .ft_txt .policy_list li:last-child{margin-right: 0;}
.footer .ft_txt .policy_list li a {
  font-size: 14px;
  color: #5d5d5d;
}

.sub_wrap section{text-align: center}
.sub_wrap section img{display: inline-block;}
.sub_wrap .wide_cont {
  text-align: center;
}
.sub_wrap .wide_cont img{
  width:100%
}
.sub_wrap .wide_cont .container img{
  width:auto
}
/* 메인슬라이드 */
.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;padding: 0 10px}
.visual-wrap .txt-ani .txt2{ opacity: 0;margin-top: 30px;padding: 0 10px}
.visual-wrap #bg02 .txt1,.visual-wrap #bg03 .txt1{padding: 0 20px}
.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::after{display: block;content:'';clear: both;}
.visual-wrap #bx-pager{
color: #fff;
bottom:20px;
right:10px;
position: absolute;
display: block !important;
    z-index: 999;
        overflow: inherit;}
.visual-wrap #bx-pager a{display: inline-block;position: relative;color:#b4b8bc;font-size: 14px;}
.visual-wrap #bx-pager a+a {
  margin-left: 5px;
}
.visual-wrap #bx-pager a p{
  background:#ccc;
  border-radius: 100%;
  box-sizing: border-box;
  width: 20px;
  height: 20px;
  line-height: 20px;
  text-align: center;
  font-size: 14px;
  color:#fff;
  font-weight: 800;
}
.visual-wrap #bx-pager a:hover p,
.visual-wrap #bx-pager a.active p{
background:#25aae1;
font-weight: bold;
}
.visual-wrap .scroll {
  position: absolute;
  left: 0px;
  right: 0px;
  bottom: 20px;
  z-index: 500;
  margin: 0px auto;
  width:27px
}
#section01{background: #f2f2f2;padding-bottom: 80px}
#section01 ul{padding: 0 10px}
#section01 ul li + li{margin-top: 20px}
#section02{position: relative;}
#section03{padding:80px 0;}
#section03 .swiper-container{position: relative;}
#section03 .img_wrap{padding: 0 15px}
#section03 .img_wrap img{width:100%}
#section03 #bx-bt{position: absolute;top: calc(55% - 30px);width:100%}
#section03 .prev,#section03 .next{display: inline-block;text-indent: -9999px;color:transparent;cursor: pointer;
      outline: 0;
      width: 30px;
      height: 30px;
    background-repeat: no-repeat;
    background-size: cover;
    position: absolute;
z-index: 99}
    .swiper-button-prev:after, .swiper-button-next:after{display: none}
#section03 .prev {
      background-image: url(../image/section03_arrow.png);
      left:5px;
    }

#section03 .next {
      background-image: url(../image/section03_arrow.png);
      transform: rotate(-180deg);
      right:5px
    }
#section04{padding-bottom: 80px;position: relative;}
#section04 .swiper-container{position: relative;}
#section04 .swiper-container li img{padding: 0 15px;width:100%}
#section04 #bx-bt{position: absolute;top: calc(55% - 30px);width:100%}
#section04 .prev,#section04 .next{display: inline-block;text-indent: -9999px;color:transparent;cursor: pointer;
      outline: 0;
      width: 30px;
      height: 30px;
    background-repeat: no-repeat;
    background-size: cover;
    position: absolute;
z-index: 99}
    .swiper-button-prev:after, .swiper-button-next:after{display: none}
#section04 .prev {
      background-image: url(../image/section03_arrow.png);
      left:5px
    }

#section04 .next {
      background-image: url(../image/section03_arrow.png);
      transform: rotate(-180deg);
      right:5px
    }
#section05{padding: 80px 0;background: #007ac3}
#section08 .video{height:30vh;overflow: hidden;position: relative;}
#section08 .video p{font-size: 4vw;line-height: 1.4;color:#fff;position: absolute;z-index: 9;transform: translate(-50%, -50%);top: 50% !important;left:50%;width: 100%;}
#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 ul{padding: 0 10px}
#section09 ul li + li{margin-top: 20px}
#section10{margin-bottom: 80px}
#section10 .video{position: relative;height: 29vh;overflow: hidden;padding: 0 10px}
#section10 .video_w{transform: translate(0, -55%);top: 55% !important;padding:56.25% 0 0 0;position:relative;}
#section10 .video::before{display: block;content: '';width:100%;height: 3px;background: #00b1b6;z-index: 9;position: relative;}
#section10 .video iframe{margin-top:-1px;}
#section11{background: url(../../image/section11_bg.jpg) no-repeat center center / cover;    width: 100%;padding:80px 0;text-align: center;}
#section11 #tit{margin-bottom: 30px;}
#section11 .slider_wrap{padding: 0 10px}
#section11 .bx-wrapper {
  position: relative;
}
#section11 .bx-wrapper{width:100%;position: relative;;}
#section11 .tour_ul .tour_cont{width: 100%;margin:0 auto;position:relative}
#section11 .tour_ul .tour_cont a{display: block}
#section11 .tour_ul li .tour_img{text-align: center;}
#section11 .tour_ul li .tour_img img{width:100%}
#section11 .tour_txt{background: #25aae1;width:100%;padding: 20px 10px;text-align: left}
#section11 .tour_txt h1{font-size: 5vw;color:#fff;margin-bottom: 10px}
#section11 .tour_txt h1 b{font-weight: 800}
#section11 .tour_txt p::before {
  display: inline-block;
  content: '';
  width: 1px;
  height: 15px;
  margin-right: 10px;
  background: #fff;
  vertical-align: middle;
}
#section11 .tour_txt p{color:#fff;display: none}
#section11 .tour_txt .active p{display: block}
#section11 .tour_txt a{position: absolute;right:20px;bottom:20px}
#section11 .bx-controls{position: absolute;top: calc(55% - 30px);width: 100%;}
#section11 .bx-controls-direction {
  width: 100%;
  position: relative;
  z-index: 9999;
}
#section11 .bx-controls-direction a {
  width: 30px;
  height: 60px;
      position: absolute;
    outline: 0;
    text-indent: -9999px;
    z-index: 1;
}

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

#section11 .bx-next {
  background: url(../../image/tour/tour_arrow.png) no-repeat center center;
  right: 0;
  transform:rotate(-180deg) !important;
}

#section12 .but-wrap{margin-bottom: 30px}
#section12 .but-wrap ul {
  width: 100%;
}
#section12 .but-wrap ul li{margin-top: 20px}
#section12 .but-wrap .half{margin-top: 20px;display: inline-block}
#section12 .but-wrap .half a{width:50%;float:left}
#section12 .but_cont{padding: 0 10px}
#section12 .but_cont li{ overflow: hidden;position:relative;}
#section12 .but_cont li a{display:block;position: relative;}

#map{position: relative;  width: 100%;margin-bottom: 80px}
#map .root_daum_roughmap .wrap_controllers {
  display: none;
}

/* 로그인팝업 */
.popup_wrap {
  display: none;
  overflow-x: hidden;
  position: fixed;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  z-index: 9999;
  background: rgba(0, 0, 0, 0.6);
}

.popup {
  position: absolute;
  background: #fff;
  padding: 90px 80px;
  z-index: 1000;
  left: 50%;
  width: 600px;
  margin-left: -300px;
  top: 20%;
}
.popup_wrap .maxWidth{width:901px; margin-left:-480px; padding:50px 95px;}
.popup_wrap .btnX{position:absolute; top:30px; right:30px; z-index:99999;}
.popup_wrap .welcomeNotice{padding:20px 0 0 0; color:#888888; font-size:15px; font-weight:600;line-height: 1.4}
.popup_wrap .welcomeNotice .divide { color:#cdcdcd; display:inline-block; margin:0px 10px; }
.popup_wrap .welcomeNotice .blue{color: #09baee !important;}
.login-wrap { position:relative; width:860px;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;    float: left;}
.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;}