@charset "utf-8";
@import url("mnav.css");
@import url("https://fonts.googleapis.com/earlyaccess/notosanskr.css");
@font-face {
font-family: 'Noto Sans KR';
font-style: normal;
font-weight: 100;
src: url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.woff2) format('woff2'),
url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.woff) format('woff'),
url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.otf) format('opentype');
}
@font-face {
font-family: 'Noto Sans KR';
font-style: normal;
font-weight: 300;
src: url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff2) format('woff2'),
url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff) format('woff'),
url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.otf) format('opentype');
}
@font-face {
font-family: 'Noto Sans KR';
font-style: normal;
font-weight: 400;
src: url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff2) format('woff2'),
url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff) format('woff'),
url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.otf) format('opentype');
}
@font-face {
font-family: 'Noto Sans KR';
font-style: normal;
font-weight: 500;
src: url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff2) format('woff2'),
url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff) format('woff'),
url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.otf) format('opentype');
}
@font-face {
font-family: 'Noto Sans KR';
font-style: normal;
font-weight: 700;
src: url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff2) format('woff2'),
url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff) format('woff'),
url(https://fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.otf) format('opentype');
}

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)  {
  .clearfix:before, .clearfix:after {
          display: block;
          content: ' ';
          line-height: 0;
  }
  .clearfix:after {
          clear: both;
  }
  .clearfix{
          *zoom:1;
  }

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:1200px !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; }

#header div.logo { position:absolute; left:0; padding:5px 15px;   box-sizing:border-box;   z-index:23 ; }
#header div.logo a {display: block; width:250px; height:70px;  background:url("../../img/main/sj_logo_w.png")no-repeat center top; margin: 7.5px auto;}
#header div.logo_on a {background:url("../../img/main/sj_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(255,255,255,0.3);
margin:0px auto 0 auto; text-align:center; transition: all 0.5s ; }
.gnb a {color:#fff;}
.gnb > ul{overflow:hidden; list-style-type:none; width:1200px; padding-left:400px; box-sizing:border-box; margin:0 auto;}
.gnb .menu{float:left; width:20%; text-align:center;}
.gnb .menu:first-child{margin:0}
.gnb .depth1{padding:0; font-size:18px; 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:15px;}
.gnb .depth2 ul li:first-child{margin-top:10px}
.gnb .depth2 ul li a:hover {text-decoration:underline; color:#f26c4f !important; }
.gnb:hover {background:rgba(255,255,255,1); color:#333; }
.gnb:hover a {color:#333;}
.gnb .menu:hover {background-color:#f5f5f5;  }
.gnb .menu:hover a{  border-bottom:2px solid #f26c4f;  padding-bottom:7px;}
.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.05);}/*background:rgba(0,0,0,0.3)*/
/**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-2.jpg")} /*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-2.jpg")} /*background-image:url("../../img/main/main_visual_3.jpg"*/
.swiper-image-7 {  background-image:url("../../img/main/main_visual_4-2.jpg")} /*background-image:url("../../img/main/main_visual_4.jpg"*/

.swiper-image-20{  background:url("../../img/main/main_visual_2-2.jpg");}  /*background:url("../../img/main/main_v1.jpg"*/
.swiper-image-21{  background:url("../../img/main/m_sl_02.png");}  /*background:url("../../img/main/main_v2.jpg"*/
.swiper-image-22{  background:url("../../img/main/m_sl_03.png");}  /*background:url("../../img/main/main_v3.jpg"*/

.swiper-image-10 { background-image:url("../../img/main/main_visual_5-2.jpg") } /*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; }

/**text**/
div.swiper-box {width:1000px; margin:0 auto;    }
div.swiper-box2 {width:1200px; margin:0 auto;    }
div.swiper-box3 {width:1300px; margin:10% auto; position:relative; }
div.main_b_img2 {/*width:1500px;*/ margin:0 auto;    }
div.cont {text-align:center; /*width:500px;*/  }
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:30%;  color:#fff; font-size:16px; } /*width:105px;*/
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/sb_01.png")no-repeat center center; }
div.cont2 ul li.ico2 {background:url("../../img/main/sb_02.png")no-repeat center center; }
div.cont2 ul li.ico3 {background:url("../../img/main/sb_03.png")no-repeat center center; }
*/
/*
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:#fff ;}
div.cont3 h1{text-align: center;}
div.cont3 p.txt {font-size:15px; text-align:center; }
div.cont3 h1 span.emphasis {font-weight:600; font-size:45px; line-height: 58px;}
div.cont4 p, div.cont4 span{color:#333; !important}
div.cont4 p.txt {font-size:15px; text-align:left; }
div.cont4 h1 span.emphasis {font-weight:600; font-size:45px; line-height: 58px;}
div.cont5 {text-align:center; /*width:1500px;*/ float:right; }
div.cont5 ul{list-style: none; clear:both; padding:30px 0 0 0; margin:0;width:100%;}
div.cont5 ul li{display:inline-block; width: 25.4%;  color:#000; font-size:16px;border: 1px solid rgba(255,255,255,0.5);background: rgba(255,255,255,0.5);margin-right:50px;} /*width:105px;*/
div.cont5 ul li:last-child{margin-right: 0}
div.cont5 ul li:hover{background: rgba(255,255,255,1);border: 1px solid rgba(255,255,255,1);}
div.cont5 ul li a{display:block;text-align: left;}
div.cont6 p, div.cont6 span{color:#333; !important}
div.cont6 p.txt {font-size:17px; text-align:left; }
div.cont6 h1 span.emphasis {font-weight:600; font-size:45px; line-height: 58px;}
/*div.cont5 ul li:hover a, div.cont5 ul li:hover p.txt{color:#fff !important;}
div.cont5 ul li:hover p.line{background: #fff;}*/
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: #fff; margin: 0 0 30px 0;  font-size: 2.5rem;  line-height: 1;  opacity: 1;}
h1 span.emphasis {  font-weight: 600; padding:0 10px 20px 0px;  font-size: 45px; padding-bottom:10px; line-height: 58px;}
.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 a:hover{display:block; background:rgba(0,0,0,0.2); color:#fff; }

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

/*하단 링크*/
.main_bottom{
  width: 100%;
  height: auto;
  position: absolute;
  bottom: 0;
  display: block;
  z-index:1000;
  border-top: 1px solid rgba(255, 255, 255, 0.5);
  box-sizing: border-box;
}
.banner_bottm{
  width: 100%;
}
.banner_title {
  background: #ff6600;
  border-left: none;
}
.banner_link,.banner_title {
  width: 25%;
  height: 100%;
  display: block;
  float: left;
  line-height:130px;
  border-left: 1px solid rgba(255, 255, 255, 0.5);
  box-sizing: border-box;
}
.banner_link:hover{background: rgba(0,0,0,0.3);}
h4.txt_t2 {
  font-size: 22px;
  text-align: center;
  color:#fff;
  font-weight: normal !important;
}
/*첫번째 배너슬라이드*/
.s1_pc{display: none !important;}
.s1_mobile{display: block !important;}
.main_b_txt{
  position:absolute;
  left:0;
  right:0;
  margin:auto;
  width:1220px;
  bottom: 40%;
}
.main_b_txt>.txt2{
  line-height: 70px;
  font-weight: bold;
}
.slide-txt>.line{
  content: '';
  display: block;
  width: 100%;
  background: rgba(255, 255, 255, 0.5);
  height: 1px;
  padding: 0;
}

.main_b_txt2>p{
  float:left;
  line-height: 70px;
  text-align:center;
  margin: 0 50px;
  padding: 25px 0;
}
.main_b_txt2 p.txt{text-align: left;line-height: 40px}
.main_b_txt2>.line{
  content: '';
  display: block;
  width: 1px;
  background: rgba(255, 255, 255, 0.5);
  height: 100%;
  margin: 0;
}

/*두번째 슬라이드*/
div.cont4{position: absolute;bottom: 0}
div.cont4 .img-box{width: 100%;}
div.cont4 .img-box>div{width: 50%;float: left;}
div.cont4 .img-box img{width: 100%;}
div.cont2 span.company_t{font-weight: bold;}
/*두번째 바로가기1*/
.swiper-image .shortcut{position: absolute;right: 0;top: 0;}
.swiper-image .shortcut a{font-size: 15px;font-weight: bold;}
.swiper-image .shortcut a::after{content: ' ↗'; font-size: 18px;}
.swiper-image .shortcut a:hover{color: #ff6600}

/*세번째 슬라이드*/
div.cont5 p.txt{text-align: left;font-size: 18px;color: #000;width: 90%;display: block;margin: 20px auto 10px auto;}
div.main_b_img2 .cont5 .line{
  content: '';
  display: block;
  height: 1px;
  width: 90%;
  margin: 0 auto 30px auto;
  background: #000;
}
.main_b_img2 .cont5 img {
    width: 100%;
}
/*네번째 슬라이드*/
div.cont6 .img-box2{width: 100%;}
div.cont6{float: left;margin-top: 50px;}
div.cont6:first-child{width: 45%;margin-right: 5%}
div.cont6:last-child{width: 50%;}
div.cont6 .img-box2 ul{list-style:none;clear: both;}
div.cont6 .img-box2 ul li {
    float: left;
    width: 28%;
    margin-right: 7%;
    margin-bottom: 20px;
}
div.cont6 .img-box2 ul li:last-child{margin-right: 0}
div.cont6 .img-box2 ul li img {width: 100%; box-shadow: 0 2px 5px 0 rgba(0,0,0,0.3);}
/*네번째 바로가기2*/
.swiper-image .shortcut2{position: absolute;left: 0;bottom: 0;}
.swiper-image .shortcut2 a{font-size: 15px;font-weight: bold;}
.swiper-image .shortcut2 a::after{content: ' ↗'; font-size: 18px;}
.swiper-image .shortcut2 a:hover{color: #ff6600}

/*다섯번째 슬라이드*/
div.cont3{width: 1200px; margin: 0 auto;}
div.cont3 ul{list-style: none; width: 100%}
.cont3 ul li {
  width: 30%;
  float: left;
  display: inline-block;
  text-align: center;
  margin-right: 5%;
}
.cont3 ul li:last-child{margin-right: 0}
.cont3 ul li::before {
    content: '';
    width: 20%;
    height: 5px;
    background: #ff6600;
    display: block;
    margin: auto;
}
div.cont3 ul li span{
    display: block;
    width: 100%;
    font-size: 18px;
    line-height: 32px;
    margin-top: 30px;
}
div.cont3 ul li img {
    margin-top: 50px;
}
div.cont3 .line{
    width: 100%;
    height: 1px;
    position: absolute;
    background: rgba(255, 255, 255, 0.5);
    left: 0;
    right: 0;
    margin: auto;
}

/**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.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 #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;  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:200px; height:60px; background-size: contain !important;  background:url("../../img/main/sj_logo_m.png")no-repeat left top; }
div.button_container div.txt{display:none;}
.gnb{ display:none; }

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

.page-wrap {  width: 100%;  height: 100vh;  display: -webkit-box;  display: -ms-flexbox;}
#home-slider {  height: 100vh;  width: 100vw;  position: relative; padding:70px 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.3);}
/**images**/
.swiper-image-1 {  background:url("../../img/main/main_visual_2-2.jpg");}
/*.swiper-image-1 {  }*/ /*background:url("../../img/main/main_v1.jpg"*/
.swiper-image-2 {  background:url("../../img/main/main_visual_1.jpg")}/*../../img/main/main_visual_1.jpg*/

/*.swiper-image-20{  background:url("../../img/main/main_v1.jpg");}*/
.swiper-image-21{  background:url("../../img/main/m_sl_02.png");} /*background:url("../../img/main/main_v2.jpg"*/
.swiper-image-22{  background:url("../../img/main/m_sl_03.png");} /*background:url("../../img/main/main_v3.jpg"*/

.swiper-image-3 {  background-image:url("../../img/main/main_visual_2-2.jpg")}  /*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-2.jpg")} /*background-image:url("../../img/main/main_visual_3.jpg")*/
.swiper-image-7 {  background-image:url("../../img/main/main_visual_4-2.jpg")} /*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-2.jpg") } /*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; }

/**text**/
div.swiper-box {width:100%; margin:0 auto;    }
div.swiper-box2 {width:100%; margin:0 auto 80px;;    }
div.swiper-box3 {width:100%; margin:0 auto 80px;;    }
div.main_b_img2 {width:100%; margin:0 auto;    }
div.cont {text-align:left; 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:#fff; width:100%; }
div.cont3 p.txt {font-size:15px; }
div.cont4 p, div.cont4 span{color:#333; !important; width:100%; }
div.cont4 p.txt {font-size:15px; }
div.cont6 p, div.cont6 span{color:#333; !important; width:100%; }
div.cont6 p.txt {font-size:15px; }
div.cont2 p.txt2 { display:none; }

div.cont5 {text-align:center; width:100%; float:none; }
div.cont5 ul{list-style: none; clear:both; padding:30px 0 0 0; margin:0;width:100%;}
div.cont5 ul li{display:inline-block; width: 100%;  color:#000; font-size:16px; border: 1px solid rgba(255,255,255,0.5);background: rgba(255,255,255,0.5); margin-right: 00px;}
div.cont5 ul li:last-child{margin-right: 0}
div.cont5 ul li:hover{background: rgba(255,255,255,1);border: 1px solid rgba(255,255,255,1);}
div.cont5 ul li a{display:block;margin-bottom: 35px;}
/*
div.cont5 ul li:hover a, div.cont5 ul li:hover p.txt{color:#fff !important;}
div.cont5 ul li:hover p.line{background: #fff;}*/

/*첫번째 슬라이드 모바일*/
.main_bottom{
  display: none;
}
.main_b_txt {
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    width: 100%;
    bottom: 40%;
}
.main_b_txt>.txt2 {
    line-height: 70px;
    font-size: 30px;
    font-weight: bold;
}
.main_b_txt2>.txt2 {
    line-height: 60px;
}
.slide-txt>.line{
  content: '';
  display: block;
  width: 100%;
  background: rgba(255, 255, 255, 0.5);
  height: 1px;
  padding: 0;
}
.slide-txt img.b_logo{width: 300px;}

/*두번째 슬라이드 모바일*/
div.cont4 .img-box{width: 100%;}
div.cont4 .img-box>div{width: 50%;float: left;}
div.cont4 .img-box img{width: 100%;}
div.cont4 span.company_t, div.cont2 span.company_t, div.cont3 span.company_t {
  font-weight: bold;
}
.swiper-image .shortcut a, .swiper-image .shortcut2 a{
  color: #333;
  padding: 5px;
  display: block;
  background: #fff;
  margin: 20px auto 70px;
  position: static;
  width: 100%;
}
.swiper-image .shortcut a::after, .swiper-image .shortcut2 a::after{content: ' ↗';}
.swiper-image .shortcut, .swiper-image .shortcut2 {
    width: 100%;
    height: 100%;
    clear: both;
    text-align: center;
}

/*세번째 슬라이드 모바일*/
div.cont5 ul li a img{display: none;}
div.cont5 ul li a{margin-top: 10px;}
/*네번째 슬라이드 모바일*/
div.cont6 .img-box2 {
    width: 90%;
    margin: auto;
}
div.cont6 .img-box2 ul{list-style:none;clear: both;}
div.cont6 .img-box2 ul li {
    float: left;
    width: 30%;
    margin-right: 5%;
    margin-bottom: 10px;
}
div.cont6 .img-box2 ul:last-child{margin-bottom: 0}
div.cont6 .img-box2 ul li:last-child{margin-right: 0}
div.cont6 .img-box2 ul li img {width: 100%; box-shadow: 0 2px 5px 0 rgba(0,0,0,0.3);}
/*네번째 슬라이드 문구 사라지기*/
div.cont6 .txt_n{display: none !important}

/*다섯번째 슬라이드 모바일*/
div.cont3{width: 100%; margin: 0 auto;}
div.cont3 ul{list-style: none; width: 100%}
.cont3 ul li {
    width: 30%;
    float: left;
    display: inline-block;
    text-align: center;
    margin-right: 5%;
}
.cont3 ul li:last-child{margin-right: 0}
div.cont3 ul li span{display: block; width: 100%;}
/*다섯번째 슬라이드 문구 사라지기*/
div.cont3 .txt_n{display: none !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: #fff; margin: 0 0 30px 0;  font-size: 2.5rem;  line-height: 1;  opacity: 1;}
h1 span.emphasis {  font-weight: 400; padding:0 0px 20px 0px;  font-size: 30px; padding-bottom:10px;line-height: 40px;}
.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:80%; box-sizing:border-box; text-align:center;
padding:20px 30px; font-size: 22px; font-weight:400; }
.swiper-image p.btn a:hover{display:block; background:rgba(0,0,0,0.2); color:#fff; }

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%;  position: relative;  background-color: #fff;  overflow: hidden;
   display: block;  }
.img_right {overflow:hidden; position:absolute; top:0; }
}

/*****************************메뉴 반응형****************************/
@media not all and (min-width:1200px){
  .gnb > ul{width: 100%;}
  /*메인 텍스트*/
  .main_b_txt{width: 100%;}
}

/*****************************모바일 화면****************************/
@media not all and (min-width:640px){

  /*첫번째 슬라이드 모바일2*/
  .main_b_txt {
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    width: 100%;
    bottom: 40%;
  }
  .main_b_txt>.txt2 {
    line-height: 50px;
    font-size: 25px;
    font-weight: bold;
    color: #000;
  }
  .main_b_txt2>p.txt2 {
    line-height: 40px;
    font-size: 30px;
  }
  .main_b_txt2>.line{
    display: none;
  }
  .slide-txt img.b_logo{width: 200px;}
  .swiper-image p.txt{font-size: 15px !important;}
  h1, .swiper-image p{margin: 0 0 15px 0;}

  /*두번째 슬라이드 모바일2*/
  div.cont4 span.company_t, div.cont2 span.company_t {
    font-size: 20px;
    font-weight: bold;
  }

  /*세번째 슬라이드 모바일2*/
  div.cont5 ul{padding: 0}
  div.cont5 ul li{width: 100%;margin-right: 0}
  div.cont5 ul li a{margin-bottom: 0}

}


/*****************************모바일 화면****************************/
@media not all and (min-width:460px){

  /*첫번째 슬라이드 모바일3*/
  .main_b_txt>.txt2{font-size: 20px;}
  /*세번째 슬라이드 모바일3*/
   h1 span.emphasis{font-size: 18px !important;line-height: 20px;font-weight: bold;}
   div.cont5 p.txt {line-height: 21px;}
   .cont2-2 h1 {
      padding: 0;
      margin: 15px 0;
      line-height: 0;
    }

}