@charset "utf-8";
@import url('../font/font.css');


header, footer, section, article, aside, nav, hgroup, details, menu, figure, figcaption, summary, mark, meter, output, progress, time, video 
{ display: block; }
body,form,th,td,p { margin:0;padding:0; -webkit-text-size-adjust:none; }
html { font-family:"Noto Sans KR","Malgun Gothic","Dotum","Gulim,Helvetica","sans-serif";}
a:link, a:visited, a:active, a:focus { text-decoration:none; color:inherit; cursor:pointer; }
a:hover{ text-decoration:none; color:#333; cursor:pointer; }
a { text-decoration:none;}
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, article, aside, hgroup, 
header, footer, figure, figcaption, nav, section { margin:0; padding:0; border:0;  vertical-align:baseline; background:transparent; }

/*****************************PC화면*************************************/

@media all and (min-width:960px)  { 
body { font-size:12px; overflow:hidden;  color:#333;  }
#wrap {max-width:100%; margin:0 auto; position:relative; }
#toparea {width:100%; background:none; }
#top {  border-bottom:0px solid #343848;    }
#topBox { margin:0 auto; max-width:1000px !important;  position:relative;}
div.top_mask {width:100%; } 
aside.util {position:absolute; right:10px; margin:0 auto; font-size:12px; display:block;   z-index: 15;border-bottom:0px solid #dfdfdf; }
aside.util div.util_Area { color:#ccc; right:0px;   margin:0 auto;  text-align:right; padding:6px 0px 0px 0; height:30px; box-sizing:border-box; }
aside.util div.util_Area a{  padding:0px 9px 0 5px; border-left:0px solid #ccc;  }
aside.util div.util_Area a:hover {color:#fff;}
aside.util div.util_Area a.first{ border-left:0px; }
#toparea .eng {position:absolute; z-index: 99;  top:38px;  left:calc( 50% + 490px );   transform:translate(-50%,0%);}

#header div.logo { position:absolute; left:0; padding:5px 15px;   box-sizing:border-box;   z-index:23 ; }
#header div.logo a {display: block; width:160px; height:80px;  background:url("../../img/main/logo.png")no-repeat center top; }
#header div.logo_on a {background:url("../../img/main/logo.png")no-repeat center top}
.button_container {display:none;}

.gnb{ position:absolute; top:0px ; background:none; left:0; width:100%;  z-index:13;  border-bottom:1px solid rgba(63,169,245,0.2);  
margin:0px auto 0 auto; text-align:center; transition: all 0.5s ; }
.gnb a {color:#3fa9f5;}
.gnb > ul{overflow:hidden; list-style-type:none; width:1000px; padding-left:200px; padding-right:50px; box-sizing:border-box; margin:0 auto;}
.gnb .menu{float:left; width:16.66666%; text-align:center;}
.gnb .menu:first-child{margin:0}
.gnb .depth1{padding:0; font-size:17px; font-weight:normal; display:block; padding:32px 0 28px 0; height:90px; box-sizing:border-box;}
.gnb .depth2{height:0 ;overflow:hidden;  font-size:14px; border-left:0px solid #353535;  }
.gnb .menu:first-child .depth2{border-left:0px solid #dfdfdf; }
.gnb .depth2 ul{overflow:hidden; } /*depth2 높이 css/menu.js 에서 조절*/
.gnb .depth2 ul li{margin-top:8px;}
.gnb .depth2 ul li:first-child{margin-top:10px}
.gnb .depth2 ul li a:hover {text-decoration:underline; color:#3fa9f5 !important; }
.gnb:hover {background:rgba(255,255,255,1); color:#333; }
.gnb:hover a {color:#555;}
.gnb .menu:hover {background-color:#f5f5f5;  }
.gnb .menu:hover a{  border-bottom:2px solid #3fa9f5;  padding-bottom:7px; color:#3fa9f5;}
.gnb .menu:hover .depth2 ul li a {border-bottom:0;}
.gnb:hover .depth2 {}

.page-wrap {  width: 100%;  height: 100vh;  display: -webkit-box;  display: -ms-flexbox;}
#home-slider {  height: 100vh;  width: 100vw;  position: relative; padding:0px 0 0 0;}

.swiper-container {  height: 100%;  width: 100%; margin:0 auto;  position: relative;  overflow: hidden;  z-index: 1;}
div.mask {position:absolute;  height: 100vh;  width: 100vw; background:rgba(0,0,0,0);}
/**images**/
.swiper-image-1 {}
.swiper-image-2 {  background:url("../../img/main/main_visual_1.jpg")}
.swiper-image-3 { background-image:url("../../img/main/main_visual_2.jpg")}
.swiper-image-4 { }
.swiper-image-5 {  }
.swiper-image-6 {  background-image:url("../../img/main/main_visual_3.jpg")}
.swiper-image-7 {  background-image:url("../../img/main/main_visual_4.jpg")}
.swiper-image-8 {  }
.swiper-image-9 {  }
.swiper-image-10 { background-image:url("../../img/main/main_visual_5.jpg") }
.swiper-image-11 {  background-image:none)}
.swiper-image-12 {  }
.swiper-image {  width: 100%; height: 100%;}
.swiper-image-inner {  background-size: cover;  background-position: center center;  
  display: -ms-flexbox;  display: flex; display: -webkit-box;  -webkit-box-orient: vertical;  -webkit-box-direction: normal;  -ms-flex-direction: column;  flex-direction: column;
  -webkit-box-align: center;   -ms-flex-align: center;  align-items: center;  -webkit-box-pack: center;  -ms-flex-pack: center;  justify-content: center;
  width: 100%;  height: 100%;  background-blend-mode: overlay;}
.swiper-image .info {display:block !important; padding-bottom:250px; opacity:0.6; line-height:50px; color:#000; font-size:17px; text-align:center; }

/**text**/
div.swiper-box {width:1000px; margin:0 auto;    }
div.cont {text-align:center; width:550px;  }
div.cont2 {text-align:center; width:1000px; float:right; }
div.cont2 ul{list-style: none; clear:both; padding:10px 0 50px 0; margin:0;}
div.cont2 ul li{display:inline-block; width:105px;  color:#fff; font-size:16px; }
div.cont2 ul li a{display:block; padding-top:110px;  }
div.cont2 ul li a:hover{color:#fff;}
div.cont2 ul li.ico1 {background:url("../../img/main/ico1.png")no-repeat center center; }
div.cont2 ul li.ico2 {background:url("../../img/main/ico2.png")no-repeat center center; }
div.cont2 ul li.ico3 {background:url("../../img/main/ico3.png")no-repeat center center; }
div.cont2 ul li.ico4 {background:url("../../img/main/ico4.png")no-repeat center center; }
div.cont2 ul li.ico5 {background:url("../../img/main/ico5.png")no-repeat center center; }
div.cont2 ul li.ico6 {background:url("../../img/main/ico6.png")no-repeat center center; }
div.cont2 ul li.ico7 {background:url("../../img/main/ico7.png")no-repeat center center; }
div.cont3 p, div.cont3 span{color:#333; !important}
div.cont3 p.txt {font-size:15px; text-align:left; }
div.cont3 h1 span.emphasis {font-weight:600; font-size:45px;}
p.gallery {width:1000px; margin:0px auto; padding-top:20px;}
.board_output_gallery_subject {display:none; text-align:center; font-size:15px; width:100%;  color:#fff;}
h1, .swiper-image p  {  font-weight: 400;  color: #333; margin: 0 0 30px 0;  font-size: 2.5rem;  line-height: 1;  opacity: 1;}
.swiper-image-4 p, .swiper-image-4 h1,.swiper-image-5 p, .swiper-image-5 h1 {color:#fff;}
.swiper-image-1 p, .swiper-image-1 h1 {color:#3fa9f5;}
h1 span.emphasis {  font-weight: 400; padding:0 10px 20px 0px;  font-size: 38px; padding-bottom:10px;}
.swiper-image p.txt {display:block; font-size: 22px; line-height:35px; text-align: center; }
.swiper-image p.btn a{display:block; margin:0 auto; background:rgba(255,255,255,0.2); border:2px solid #fff; width:300px; text-align:center; 
padding:20px 30px; font-size: 22px; font-weight:400; }
.swiper-image p.btn_blue a {background:rgba(63,169,245,0.2); border:2px solid #3fa9f5; color:#3fa9f5; }
.swiper-image p.btn a:hover{display:block; color:#fff; background:rgba(0,0,0,0.2); color:#fff; }
.swiper-image p.btn_blue a:hover {color:#3fa9f5; background:rgba(63,169,245,0.1);}

div.swiper-image-8 .cont4 {}
div.swiper-image-8 .cont4 .txt{text-align: left;}
div.swiper-image-8 h1{margin:0 !important;}
div.swiper-image-8 p{margin:0 0 10px 0 !important;}
div.swiper-image-8 h1 span.emphasis {font-size:25px; font-weight:bold;}
div.swiper-image-8 .txtHead {font-size:55px; border-bottom:2px solid #3fa9f5; font-weight:bold; }
div.swiper-image-8 .txtHead strong {font-size:70px; line-height:80px;}
div.swiper-image-8 .txt {padding-top:20px !important;}
p.txt2 {font-size:15px; line-height:25px; padding-bottom:20px;}
.txtBlue {color:#3fa9f5 !important;}

div.cont6 {width:1000px; margin:0 auto;}
div.cont6 .txt3 strong {font-size:20px;}
div.cont6 .txt3 {float:right; font-size:17px; line-height:30px;}
.swiper-image-12 h1 {margin-top:70px;}
.swiper-image-12 p{margin:0 0 20px 0 !important;}

p.paragraph {display:none;  color:#000;}
.swiper-slide.swiper-slide-active h1 span { opacity:1; }
.swiper-wrapper div.mobile {position:absolute; z-index: 99;}

/**swiper**/
.swiper-container-vertical > .swiper-wrapper {  -webkit-box-orient: vertical;  -ms-flex-direction: column;  flex-direction: column;}
.swiper-wrapper {  position: relative;  width: 100%;  height: 100%;  z-index: 1;
  display: -webkit-box;  display: -ms-flexbox;  display: flex;  -webkit-transition-property: -webkit-transform;  transition-property: -webkit-transform;
  transition-property: transform;  transition-property: transform, -webkit-transform;  box-sizing: content-box;}
.swiper-container-android .swiper-slide, .swiper-wrapper {  -webkit-transform: translate3d(0px, 0, 0);  transform: translate3d(0px, 0, 0);}
.swiper-container-multirow > .swiper-wrapper {  -webkit-box-lines: multiple;  -moz-box-lines: multiple;  -ms-flex-wrap: wrap;  flex-wrap: wrap;  }
.swiper-container-free-mode > .swiper-wrapper {  -webkit-transition-timing-function: ease-out;  transition-timing-function: ease-out;  margin: 0 auto;}
.swiper-slide {  -webkit-flex-shrink: 0;  -ms-flex: 0 0 auto;  -ms-flex-negative: 0; flex-shrink: 0;
  width: 100%;  height: 100%;  position: relative;  background-color: #fff;  overflow: hidden;
  display: -webkit-box;  display: -ms-flexbox;  display: flex;  }

/* Auto Height */
.swiper-container-autoheight, .swiper-container-autoheight .swiper-slide {  height: auto;}
.swiper-container-autoheight .swiper-wrapper {  -webkit-box-align: start;  -ms-flex-align: start;  align-items: flex-start;
  -webkit-transition-property: -webkit-transform, height;  -webkit-transition-property: height, -webkit-transform;
  transition-property: height, -webkit-transform;  transition-property: transform, height;  transition-property: transform, height, -webkit-transform;}

/* IE10 Windows Phone 8 Fixes */
.swiper-wp8-horizontal {  -ms-touch-action: pan-y;  touch-action: pan-y;}
.swiper-wp8-vertical {  -ms-touch-action: pan-x;  touch-action: pan-x;}

/* Pagination Styles */
.swiper-pagination {  position: absolute;  text-align: center;  -webkit-transition: 300ms;  transition: 300ms;
  -webkit-transform: translate3d(0, 0, 0);  transform: translate3d(0, 0, 0);  z-index: 10;}
.swiper-pagination.swiper-pagination-hidden {  opacity: 0;}

/* paging button */
.swiper-pagination-bullet {  width: 14px;  height: 14px;  display: inline-block;  background: rgba(63,169,245,0.7);  opacity: 0.8;}
.swiper-pagination-clickable .swiper-pagination-bullet {  cursor: pointer; border-radius:10px}
.swiper-pagination-white .swiper-pagination-bullet {  background: #aaa;}
.swiper-pagination-bullet-active {  opacity: 1;  background:none; border:2px solid rgba(63,169,245,0.7);  width: 10px;  height: 10px; }
.swiper-pagination-white .swiper-pagination-bullet-active {  background: #aaa;}
.swiper-pagination-black .swiper-pagination-bullet-active {  background: #000;}
.swiper-container-vertical > .swiper-pagination-bullets {  right: 25px;  bottom: 45%;}
.swiper-container-vertical  > .swiper-pagination-bullets .swiper-pagination-bullet {  margin: 7px 0;  display: block;}
.swiper-container-horizontal  > .swiper-pagination-bullets .swiper-pagination-bullet {  margin: 0 5px;}

}


/*****************************모바일 화면****************************/
@media not all and (min-width:960px){
#menu {	display:none;}
.slicknav_menu { }/*모바일 메뉴*/
.flex-direction-nav a  {display:none;}
body { font-size:12px;  color:#454545; overflow:hidden; }
#wrap {max-width:100%; margin:0 auto; position:relative; padding:0; }
#top {position:absolute; top:0;}
aside.util { display:none; }
#header div.logo { position:absolute; left:0; padding:5px 10px;   box-sizing:border-box;   z-index:23 ; }
#header div.logo a {display: block; width:150px; height:60px; background-size: contain !important;  background:url("../../img/main/logo.png")no-repeat left top; }
div.button_container div.txt{display:none;}
.gnb{ display:none; }
#toparea .eng {position:absolute; z-index: 99;  top:26px; right:80px;  left:auto;   transform:translate(0%,0%);}

/*scroll*/
.center-it {display:none;}

.page-wrap {  width: 100%;  height: 100vh;  display: -webkit-box;  display: -ms-flexbox; word-break:keep-all}
#home-slider {  height: 100vh;  width: 100vw;  position: relative; padding:30px 0 0 0;}
.swiper-container {  height: 100%;  width: 100%; margin:0 auto;  position: relative;  overflow: hidden;  z-index: 1;}
div.mask {position:absolute;  height: 100vh;  width: 100vw; background:rgba(0,0,0,0);}
/**images**/
.swiper-image-1 {}
.swiper-image-2 {  background:url("../../img/main/main_visual_1.jpg")}
.swiper-image-3 { background-image:url("../../img/main/main_visual_2.jpg")}
.swiper-image-4 { }
.swiper-image-5 {  }
.swiper-image-6 {  background-image:url("../../img/main/main_visual_3.jpg")}
.swiper-image-7 {  background-image:url("../../img/main/main_visual_4.jpg")}
.swiper-image-8 {  }
.swiper-image-9 {  }
.swiper-image-10 { background-image:url("../../img/main/main_visual_5.jpg") }
.swiper-image {  width: 100%; height: 100%;}
.swiper-image-inner {  background-size: cover;  background-position: center center;  
  display: -ms-flexbox;  display: flex; display: -webkit-box;  -webkit-box-orient: vertical;  -webkit-box-direction: normal;  -ms-flex-direction: column;  flex-direction: column;
  -webkit-box-align: center;   -ms-flex-align: center;  align-items: center;  -webkit-box-pack: center;  -ms-flex-pack: center;  justify-content: center;
  width: 100%;  height: 100%;  background-blend-mode: overlay;}
.swiper-image .info {display:block !important; padding-bottom:250px; opacity:0.6; line-height:50px; color:#000; font-size:17px; text-align:center; }

div.swiper-image-8 .cont4 {width:100%;  text-align: center;}
div.swiper-image-8 .cont4 .txt{}
div.swiper-image-8 h1{margin:0 !important;}
div.swiper-image-8 p{margin:0 0 10px 0 !important;}
div.swiper-image-8 h1 span.emphasis {font-size:25px; font-weight:bold;}
div.swiper-image-8 .txtHead {font-size:35px; border-bottom:2px solid #3fa9f5; font-weight:bold; }
div.swiper-image-8 .txtHead strong {font-size:50px; line-height:60px;}
div.swiper-image-8 .txt {padding-top:20px !important;}
p.txt2 {font-size:15px !important; line-height:25px !important; padding-bottom:20px;}
.txtBlue {color:#3fa9f5 !important;}

div.cont6 {width:100%; margin:0 auto; padding:0 10px; box-sizing:border-box; }
div.cont6 .txt3 strong {font-size:18px;}
div.cont6 .txt3 {float:right; font-size:16px; line-height:30px;}
.swiper-image-12 h1 span.emphasis {margin-top:70px; font-size:20px !important;}
.swiper-image-12 p{margin:0 0 0px 0 !important;   height:auto !important; width:100% !important; }
.swiper-image-12 img {max-width:98%; vertical-align:top; padding-bottom:20px; }

/**text**/
div.swiper-box {width:100%; margin:0 auto;    }
div.cont {text-align:center; width:100%;  }
div.cont2 {text-align:center; width:100%; float:none; }
div.cont2 ul{list-style: none; clear:both; padding:0px 0 30px 0; margin:0;}
div.cont2 ul li{display:inline-block; width:22%;  color:#fff; font-size:16px; }
div.cont2 ul li a{display:block; padding-top:110px;  }
div.cont2 ul li a:hover{color:#fff;}
div.cont2 ul li.ico1 {background:url("../../img/main/ico1.png")no-repeat center center; }
div.cont2 ul li.ico2 {background:url("../../img/main/ico2.png")no-repeat center center; }
div.cont2 ul li.ico3 {background:url("../../img/main/ico3.png")no-repeat center center; }
div.cont2 ul li.ico4 {background:url("../../img/main/ico4.png")no-repeat center center; }
div.cont2 ul li.ico5 {background:url("../../img/main/ico5.png")no-repeat center center; }
div.cont2 ul li.ico6 {background:url("../../img/main/ico6.png")no-repeat center center; }
div.cont2 ul li.ico7 {background:url("../../img/main/ico7.png")no-repeat center center; }
div.cont3 p, div.cont3 span{color:#333; !important; width:100%; }
div.cont3 p.txt {font-size:15px; }
div.cont2 p.txt2 { display:none; }

.swiper-image-4 p, .swiper-image-4 h1,.swiper-image-5 p, .swiper-image-5 h1 {color:#fff !important;}
.swiper-image-1 p, .swiper-image-1 h1 {color:#3fa9f5 !important;}

/*gallery*/
p.gallery {clear:both; width:100%; margin:0 auto; padding:10px 0 ; }
p.gallery td.board_output_gallery_img {text-align:center;}
.board_output_gallery_img img {width:130px !important; height:130px; }
p.gallery span.board_output_gallery_subject {font-size:15px; padding-top:5px; display:block; text-align:center; width:100%; }
table.main_gallery table {width:100%;  margin:0 auto !important; box-sizing:border-box; padding:10px 0;}

.board_output_gallery_subject {display:none; text-align:center; font-size:15px; width:100%;  color:#fff;}
h1, .swiper-image p  { width:100%; text-align:center; font-weight: 400;  color: #333; margin: 0 0 30px 0;  font-size: 2.5rem;  line-height: 1;  opacity: 1;}
h1 span.emphasis {  font-weight: 400; padding:0 10px 20px 0px;  font-size: 35px; padding-bottom:10px;}
.swiper-image p.txt {display:block; font-size: 18px; line-height:35px; }

.swiper-image p.btn a{display:block; margin:0 auto; background:rgba(255,255,255,0.2); border:2px solid #fff; width:70%; text-align:center; 
padding:20px 30px; font-size: 22px; font-weight:400; }
.swiper-image p.btn_blue a {background:rgba(63,169,245,0.2); border:2px solid #3fa9f5; color:#3fa9f5; }
.swiper-image p.btn a:hover{display:block; color:#fff; background:rgba(0,0,0,0.2); color:#fff; }
.swiper-image p.btn_blue a:hover {color:#3fa9f5; background:rgba(63,169,245,0.1);}

p.paragraph {display:none;  color:#000;}
.swiper-slide.swiper-slide-active h1 span { opacity:1; }
.swiper-wrapper div.mobile {position:absolute; z-index: 99;}

/**swiper**/
.swiper-container-vertical > .swiper-wrapper {  -webkit-box-orient: vertical;  -ms-flex-direction: column;  flex-direction: column;}
.swiper-wrapper {  position: relative;  width: 100%;  height: 100%;  z-index: 1;
  display: -webkit-box;  display: -ms-flexbox;  display: flex;  -webkit-transition-property: -webkit-transform;  transition-property: -webkit-transform;
  transition-property: transform;  transition-property: transform, -webkit-transform;  box-sizing: content-box;}
.swiper-container-android .swiper-slide, .swiper-wrapper {  -webkit-transform: translate3d(0px, 0, 0);  transform: translate3d(0px, 0, 0);}
.swiper-container-multirow > .swiper-wrapper {  -webkit-box-lines: multiple;  -moz-box-lines: multiple;  -ms-flex-wrap: wrap;  flex-wrap: wrap;  }
.swiper-container-free-mode > .swiper-wrapper {  -webkit-transition-timing-function: ease-out;  transition-timing-function: ease-out;  margin: 0 auto;}
.swiper-slide {  -webkit-flex-shrink: 0;  -ms-flex: 0 0 auto;  -ms-flex-negative: 0; flex-shrink: 0;
  width: 100%;  height: 100%;  position: relative;  background-color: #fff;  overflow: hidden;
  display: -webkit-box;  display: -ms-flexbox;  display: flex;  }

/* Auto Height */
.swiper-container-autoheight, .swiper-container-autoheight .swiper-slide {  height: auto;}
.swiper-container-autoheight .swiper-wrapper {  -webkit-box-align: start;  -ms-flex-align: start;  align-items: flex-start;
  -webkit-transition-property: -webkit-transform, height;  -webkit-transition-property: height, -webkit-transform;
  transition-property: height, -webkit-transform;  transition-property: transform, height;  transition-property: transform, height, -webkit-transform;}

/* IE10 Windows Phone 8 Fixes */
.swiper-wp8-horizontal {  -ms-touch-action: pan-y;  touch-action: pan-y;}
.swiper-wp8-vertical {  -ms-touch-action: pan-x;  touch-action: pan-x;}

/* Pagination Styles */
.swiper-pagination {  position: absolute;  text-align: center;  -webkit-transition: 300ms;  transition: 300ms;
  -webkit-transform: translate3d(0, 0, 0);  transform: translate3d(0, 0, 0);  z-index: 10;}
.swiper-pagination.swiper-pagination-hidden {  opacity: 0;}

/* paging button */
.swiper-pagination-bullet {  width: 14px;  height: 14px;  display: inline-block;  background: #fff;  opacity: 0.7;}
.swiper-pagination-clickable .swiper-pagination-bullet {  cursor: pointer; border-radius:10px}
.swiper-pagination-white .swiper-pagination-bullet {  background: #aaa;}
.swiper-pagination-bullet-active {  opacity: 1;  background:none; border:2px solid #fff;  width: 10px;  height: 10px; }
.swiper-pagination-white .swiper-pagination-bullet-active {  background: #aaa;}
.swiper-pagination-black .swiper-pagination-bullet-active {  background: #000;}
.swiper-container-vertical > .swiper-pagination-bullets {  right: 25px;  top: 25px;}
.swiper-container-vertical  > .swiper-pagination-bullets .swiper-pagination-bullet {  margin: 7px 0;  display: block;}
.swiper-container-horizontal  > .swiper-pagination-bullets .swiper-pagination-bullet {  margin: 0 5px;}

.swiper-image {  width: 100%; height: 100%;}
.mobile {position:absolute; bottom:0; float:left; height: 100%; z-index:100;}
.swiper-slide {
  -webkit-flex-shrink: 0;  -ms-flex: 0 0 auto;  -ms-flex-negative: 0; flex-shrink: 0;
  width: 100%;  height: 100% !important;  position: relative;  background-color: #fff;  overflow: hidden;
   display: block;  }
.img_right {overflow:hidden; position:absolute; top:0; }
}