@charset "utf-8";
/* 초기화 */

@import url("content.css");
@import url("form.css");
@import url("materialdesignicons.css");
@import url("animate.css");

@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 100;
  src: url(fonts/NotoSansKR-Thin.woff2) format('woff2'),
       url(fonts/NotoSansKR-Thin.woff) format('woff'),
       url(fonts/NotoSansKR-Thin.otf) format('opentype');
}
@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 300;
  src: url(fonts/NotoSansKR-Light.woff2) format('woff2'),
       url(fonts/NotoSansKR-Light.woff) format('woff'),
       url(fonts/NotoSansKR-Light.otf) format('opentype');
}
@font-face {
   font-family: 'Noto Sans KR';
   font-style: normal;
   font-weight: 400;
   src: url(fonts/NotoSansKR-Regular.woff2) format('woff2'),
        url(fonts/NotoSansKR-Regular.woff) format('woff'),
        url(fonts/NotoSansKR-Regular.otf) format('opentype');
 }

@font-face {
   font-family: 'Noto Sans KR';
   font-style: normal;
   font-weight: 500;
   src: url(fonts/NotoSansKR-Medium.woff2) format('woff2'),
        url(fonts/NotoSansKR-Medium.woff) format('woff'),
        url(fonts/NotoSansKR-Medium.otf) format('opentype');
 }


html, body { 
    margin:0; padding:0;border: 0; 
    font-family:'Noto Sans KR', Helvetica, '맑은 고딕', sans-serif;
    font-size: 17px;
    line-height: 25px;
    vertical-align: baseline;
   	text-decoration:none;
	color: #333;
    font-weight:400;
    word-break:keep-all;
    min-width: 1200px;
}

ul, dl,dt,dd {margin:0;padding:0;list-style:none}

body {}
.single .single-post h1, .single .single-post h2, .single .single-post h3, .single .single-post h4, .single .single-post h5, .single .single-post h6 {margin: 15px 0 25px;}
.single p i {font-weight: 500;}
.single .single-post ul, .single .single-post ol {margin: 0px 0 40px;}
a:hover, a:active {outline: 0;text-decoration: none; -webkit-transition-duration: 0.5s; transition-duration: 0.5s;cursor: pointer; transition: all 0.5s;}
a {color:#333}

legend {border-bottom: 0!important}
input[type="radio"], input[type="checkbox"] {margin:4px 0 6px}



#header-top-bar {position: relative;width: 100%;clear: both;padding: 15px 0 10px;top: 0;left: 0;right: 0;z-index:9999;background: rgba(0, 0, 0, 0.075);}
#header-top-bar ul {padding-left: 0;}
#header-top-bar ul li {color: #a1aaba;font-size: 12px;list-style: none;}
#header-top-bar ul li a {color: #a1aaba;font-size: 12px;}
#header-top-bar ul.top-social-link li a {font-size: 14px;}
#header-top-bar ul.top-social-link li {padding: 0px 20px;border-right: 1px #737a88 solid;}
#header-top-bar ul.top-social-link li:last-child {border-right: 0px #737a88 solid;}
#header-top-bar .col-md-12 {padding-right: 0;}

#menutop {position: absolute; top:0; z-index:9999;width: 100%;}
#top-menu {padding: 0px;transition: all 0.5s;margin-bottom: 0;}
#top-menu.navbar-default .navbar-brand {margin-left:20px; padding: 15px 60px}
#top-menu.navbar-default .navbar-brand img {width:160px;}
#top-menu.navbar-default {background-color: rgba(231, 231, 231, 0);border-color: rgba(231, 231, 231, 0);position: relative;border: none;}
#top-menu.navbar-default .navbar-nav > li > a {color: #333;font-size: 17px;padding:25px 40px;font-weight:500;display: inline-block;}
#top-menu.navbar-default .navbar-nav {position: relative;}
#top-menu.navbar-default .navbar-nav li {position: relative;border-bottom:0px transparent solid; text-align: left}
#top-menu.navbar-default .navbar-nav li:hover {transition: all 0.5s;color:#000;}
#top-menu.navbar-default .navbar-nav li:hover > a{color:#000; transition: all 0.5s;}
#top-menu.navbar-default .navbar-nav ul {display: none;  position: absolute;top: 70px; left:10px; padding-top:0;  border-radius:0 0 5px 5px}
#top-menu.navbar-default .navbar-nav li.menu-item-has-children a.page-scroll:after {transform: rotate(90deg)}
 /* #top-menu.navbar-default li.menu-item-has-children a:not(:only-child):after {content: "\f105";display: inline-block;font-family: 'FontAwesome';float: right;margin-left: 10px;} */
 
#top-menu.navbar-default .navbar-nav li a.on {color:#00fff6;}

#top-menu.navbar-default .navbar-nav ul li:first-child {border-top-left-radius: 0px;border-top-right-radius: 0px;}
#top-menu.navbar-default .navbar-nav ul li:last-child {border-bottom-left-radius: 0px;border-bottom-right-radius: 0px;}
#top-menu.navbar-default .navbar-nav ul li {float: none;z-index: 2;position: relative;list-style: none;background: #333; padding:20px 10px 0 20px; width:100%; line-height: 30px; }
#top-menu.navbar-default .navbar-nav ul a {line-height: 100%;color: #fff;font-size: 14px;display: block;font-weight: 400;}
#top-menu.navbar-default .navbar-nav li a .fa {text-align: right;margin-left: 10px;}
#top-menu.navbar-default .navbar-nav ul li a .fa {text-align: right;float: right;margin-left: 15px;}
#top-menu.navbar-default .navbar-nav ul a:hover {background: #333; color:#4de7c1}
#top-menu.navbar-default .navbar-nav ul ul:before {display: none;}
#top-menu.navbar-default .navbar-nav ul ul {top: 0;left: 100%}
#top-menu.navbar-default .navbar-nav li:hover > ul {display: block;}
#top-menu.navbar-default .navbar-nav > li a.active-on {}
#top-menu.navbar-default .navbar-nav > li a:hover {transition: all 0.5s;-moz-transition: all 0.5s;-webkit-transition: all 0.5s;text-decoration: none;}
#top-menu.navbar-default .navbar-nav > li:after {content: "|";color: #000;display: none;}
#top-menu.navbar-default .navbar-nav > li:last-child a:after {display: none;}
#top-menu .container {width: 100%!important; padding:0!important;}
.navbar-collapse{ }
.navbar-right {padding-right:50px; margin-right:0!important; }

.gnb_m {display: none}


.sub-menu {position: relative; padding:10px; background: #333; padding-bottom: 20px; width:220px; }
.sub-menu:before{position: absolute; top:-8px; left:60%; display:inline-block;}

#top-menu.navbar-default .navbar-nav li ul li:hover {background-color: none}

    
#top-menu.navbar-default .navbar-nav li.mlang {display: none}
#top-menu.navbar-default ul.navbar-nav > li.mlang > a {display: none}

/* .on {background-color: #103e91 !important;padding: 0 !important;position: fixed !important; }*/
.on #header-top-bar {display: none;}
.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus {color: #fff !important;
/*background-color: rgba(59, 62, 138, 1);*/font-weight: 400;}
.navbar-toggle {border-radius: 0;}
.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {background-color: #000;border-color: #000;}
.navbar-default .navbar-toggle:hover>.icon-bar {background-color: #FFF;}




.bottom-footer {padding:20px 0 10px 0; background-color:#f0f2f6; }
.bottom-footer .site-identity {color: #333;margin-top:10px;font-size:13px; line-height:20px;text-align: center;  margin:0 auto; width: 100%;}
.bottom-footer .site-identity ul li {display: inline-block;  }
.bottom-footer .site-identity ul li:after {content: ' | '; color:#777; padding: 0 10px} 
.bottom-footer .site-identity ul li:last-child:after {content: ''; padding:0}
.bottom-footer .site-identity a{color: #333;}


.entry{
    width: 100%;
    height: 320px;
    overflow: hidden;
    margin: 0 auto;
    text-align: center;
    margin-top:70px;
}


.single .entry-header
{
	background-repeat: no-repeat;
	background-size: cover;
	height: 320px;
	text-align:left;
	position: relative;
    animation-name: zoom;
    animation-duration: 2s;
    animation-delay: 1.5s;
    animation-iteration-count: 1;
    animation-direction: alternate;
    animation-fill-mode: forwards;
    vertical-align: middle;
    transform: scale(1.1, 1.1);
   
}


@keyframes zoom {
    from {
        transform: scale(1.1, 1.1);
    }
    to {
        transform: scale(1.0, 1.0);
    }
}



.entry-header.bg1 {background-image: url(../img/sub_01.jpg); background-position: center center;}
.entry-header.bg2 {background-image: url(../img/sub_02.jpg); background-position: left center;}
.entry-header.bg3 {background-image: url(../img/sub_03.jpg); background-position: left center;}
.entry-header.bg4 {background-image: url(../img/sub_04.jpg); background-position: left center;}
.entry-header.bg5 {background-image: url(../img/sub_05.jpg); background-position: left center;}



.single .entry-header .content {position: relative;}
.single .entry-header h2	{color: #fff;font-weight:400; font-size:40px; margin-top:100px; text-align: center;  margin-bottom: 0!important;line-height: 30px!important}
.single .entry-header em	{color: #fff;font-weight:100; text-align: center; font-size:36px; display: block; font-style: normal; padding-top: 20px}
.single .entry-header span	{color: #fff;font-weight:300; text-align: center; font-size:17px; display: block; font-style: normal; line-height: 50px}
.single .entry-header .h2line {border-bottom: 1px solid #fff; opacity: 0.7; width:50px;display: block;text-align: center; font-size:0; margin: 10px auto;line-height: 20px}


/* visual */
.vbtn	{position: relative; }
.carousel-control i	{font-size:25px;position: absolute; bottom:450px;text-align: left; background: rgba(0, 0, 0, 0.7);  padding:5px 7px }
.carousel-control i.mleft{left:0}
.carousel-control i.mright{right:0}
.visual-01	{background-image: url(../img/main_visual_01.jpg); background-position:center bottom}
.visual-02	{background-image: url(../img/main_visual_01.jpg); background-position:center bottom}


.carousel-caption {text-shadow:0 0 0 rgba(0, 0, 0, 0)}
.carousel-caption .font1	{font-weight:200;color:#000; font-size:25px; display:block;line-height:90px;}
.carousel-caption .font2	{font-weight:700;color:#000; font-size:60px;letter-spacing:-1px; display:block; line-height: 60px; padding-bottom: 40px}
.carousel-caption .font3	{font-weight:400;color:#000; font-size:30px;letter-spacing:-1px; display:block;}
.carousel-caption .font2 span {color: #1367ae}
.carousel-caption {top:200px;}



#home-banner {position: relative;height:850px;background-repeat: no-repeat;background-size: cover; padding: 0px 0;-webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;}
#home-banner:before {content: "";position: absolute;left: 0;top: 0;bottom: 0;right: 0;width: 100%;height: 100%;opacity: 0;}
#home-banner .content {margin-top: 0vw;position: relative;}
#home-banner h1 {color: #fff;font-weight: black;text-transform: uppercase;text-align:center; font-weight:400;}

.carousel-indicators li { background-color: #fff; opacity: 0.5}
.carousel-indicators .active {background-color: #fff; opacity: 1 }
.carousel-indicators {bottom:0px!important}


.container { padding-left:0!important; padding-right:0!important; margin: 0 auto; position: relative;text-align: left; margin-bottom: 200px}
.container  h3 { text-align: center; color:#333; font-size:30px; letter-spacing:0px; margin-top:30px; margin-bottom:80px; font-weight: 500;display: block;  }
.container  h3 span{color:#666; font-size:20px; font-weight: 500;  }
.container  h3.other {margin-top: 70px} 
.container2 {width: 100%; background-color: #ededed; padding:30px 0 70px 0; margin-top:80px}


.main_content {width: 100%; background-color: #ededed; padding:30px 0 70px 0;  }
h3.main_h3  { text-align: center; color:#333; font-size:30px; margin-bottom: 40px; letter-spacing:0px; margin-top:70px; font-weight: 700;display: block; 
background: url(../img/logo3.png) center top no-repeat;  padding-bottom: 15px; background-size: 270px; padding-top: 30px  }
h3.main_h3  span {display: block; font-size:15px; line-height: 30px; padding-bottom: 30px; color:#666}


.menu_tab { margin:20px auto;font-size: 0; width:100%; z-index: 11; text-align: center; border-bottom: 1px solid #ddd; padding-bottom: 20px}
.menu_tab li {text-align: center;display: inline-block; width:300px}
.menu_tab li a{line-height: 60px;  text-align: center;font-size:22px; color: #9caeb7;display: block; font-weight: 500}
.menu_tab li a:hover{ color:#666; cursor: pointer}
.menu_tab li a.on {color:#000; }

.menu_tab li.ot3 {width:auto; padding:0 45px; }
.menu_tab li.ot3 a{font-size:19px;}


.container h2.main {font-size: 45px; text-align: center; color:#000; font-weight: 500; padding: 120px 0 60px 0}
.container h2.main span {font-weight: 100; font-size: 30px; display: block}

.min_product {}
.min_product li {display: inline-block;text-transform:uppercase; height:310px; width: 570px;}
.min_product li.pro_01 {background: url(../img/main_01.png) no-repeat;}
.min_product li.pro_01 .box_01 {border: 4px solid #53a041; background: #fff; margin:40px 0 0 220px; width: 340px; height: 240px; padding:20px}
.min_product li.pro_01 .box_01 span {display: block; padding:50px 0 20px; color:#666; font-size:15px; line-height: 20px}
.min_product li.pro_01 .box_01 i {font-size:26px}
.min_product li.pro_01 .box_01 em {font-size:22px; font-style: normal}

.min_product li.pro_02 {background: url(../img/main_02.png) right top no-repeat; float: right; text-align: right}
.min_product li.pro_02 .box_02 {border: 4px solid #4e9de0; background: #fff; margin:40px 0 0 0px; width: 340px; height: 240px; padding:20px}
.min_product li.pro_02 .box_02 span {display: block; padding:50px 0 20px; color:#666; font-size:15px; line-height: 20px}
.min_product li.pro_02 .box_02 i {font-size:26px}
.min_product li.pro_02 .box_02 em {font-size:22px; font-style: normal}

.main_business {background: url(../img/main_03.png) no-repeat; height: 750px; padding:100px 0 0; text-align: center; background-size: cover}
.main_business h2 {color:#fff; font-size:15px; font-weight: 400;line-height: 50px}
.main_business h2 span {font-size:45px; font-weight: 500; display: block; }
.main_business ul  {margin-top:100px}
.main_business ul li {display: inline-block; width:400px; color:#fff; padding:150px 0 0; font-size: 16px; font-weight: 300; line-height: 22px}
.main_business ul li.ico_01 {background: url(../img/main_ico1.png) center top no-repeat; background-size: 120px}
.main_business ul li.ico_02 {background: url(../img/main_ico2.png) center top no-repeat; background-size: 120px}
.main_business ul li.ico_03 {background: url(../img/main_ico3.png) center top no-repeat; background-size: 120px}
.main_business ul li span {display: block; padding-bottom: 10px; font-weight: 500; font-size: 18px}


.main_plat {margin:80px 0 0; text-align: center; font-size: 22px; line-height: 30px}
.main_plat img {display: block; margin: 0 auto; width: 240px}
.main_plat span {font-size:15px; color:#666; font-weight: 300}



/*--------------------
해상도별
----------------------*/


 @media (max-width: 1280px) {
html, body {font-size:15px; min-width: 100%;}
    
.container {width: 1200px!important}
.main_conall .box1 {width:700px; height:330px; }

.menu_tab li {width:20%}

     
}



 @media (max-width: 1024px) {

.container {width:100%!important; padding: 0 20px!important;margin-bottom: 70px }
#top-menu.navbar-default .navbar-brand {padding:15px 20px;}
.sub_con {padding:0 40px; min-height: auto}
.single .entry-header h2	{margin-top:80px; } 
.container  h3 {font-size:25px; margin-bottom: 50px;margin-top:50px;}
     
.menu_tab { width:100%}     
.menu_tab li {width:25%}

 h3.main_h3 {margin-top:20px; margin-bottom: 10px}
 h3.main_h3 span {line-height: 20px; padding-top: 10px}
     
#top-menu.navbar-default .navbar-nav > li > a {padding:25px 15px; font-size:15px;}
.navbar-right {padding-right:30px;}


.mobile_img {width:100%;}

.menu_tab li.ot3 { padding:0 20px; }
.menu_tab li.ot3 a{font-size:18px;}
 
   
     
}





 @media (max-width: 812px) {
html, body {font-size:15px; line-height: 23px}
.mimg {width: 100%;}
    
#top-menu.navbar-default .navbar-brand img {width: 130px}
#top-menu.navbar-default .navbar-brand {padding:20px; margin-left: 0}
.navbar-right {padding-right: 20px}
#top-menu.navbar-default .navbar-nav > li > a {padding:25px 15px; font-size:16px;}




.carousel-caption {top:160px;}    
#home-banner {height:700px;}     
 
.visual-01	{ background-position:center bottom}
.visual-02	{ background-position:center bottom}    
        
.menu_tab { margin: 0 auto; border-bottom: 0;font-size: 0; }
.menu_tab li {border-right:1px solid #7689a4;border-bottom:1px solid #7689a4;text-align: center; background-color: #627288; display: inline-block; width:25%; font-weight: 400}
.menu_tab li a{line-height: 60px;  text-align: center;font-size:16px; color: #fff;display: block}
.menu_tab li a.on {background-color: #303e51; color:#fff; }
.menu_tab li:first-child {border-left: 0}
.menu_tab li a:hover, .menu_tab li:hover {background-color: #303e51; color:#fff; cursor: pointer}
.menu_tab li.ot3 {width:100%; padding:0}
.menu_tab li.ot2 {width:50%}
.menu_tab li.ot2 a{font-size:17px;}  
 
.container h2.main {padding:50px 0 50px 0}    
     
     
.min_product li {display: block; }
.min_product li.pro_02 {margin:30px 0}


.main_business {clear: both; height: auto; padding:50px 0; text-align: center; background-size: cover}
.main_business h2 span {font-size:40px; }
.main_business ul  {margin-top:50px}
.main_business ul li {display: block; width:100%; margin-bottom: 50px}
 
     
     
}

     



@media (max-width: 736px) {
    
.mnone {display: none;}
.sub-menu {display: none;}
#top-menu.navbar-default ul.navbar-nav ul  li  {display: none!important;}
.navbar-default .navbar-toggle {background-color: #000!important;  border-radius: 3px}

.entry {height:170px;}

.container {overflow: hidden}
.sub_container {padding:30px 20px 50px 20px; letter-spacing:-0.5px;}
.sub_container h3 {font-size:25px; margin-bottom: 30px}

.bottom-footer .site-identity ul li span{display:none;}
.bottom-footer .site-identity ul li:after {content: '  '; padding: 0 5px}     
    

#home-banner h1 {color: #fff;font-weight: black;font-size:25px!important;text-transform: uppercase;text-align:center; font-weight:400;letter-spacing:-1px;}
#home-banner p {color: #fff;font-size:17px!important;margin:20px 0; text-align:center; line-height: 1.3;letter-spacing:0.5px;}


#home-banner .content{padding-top:5em;}
#home-banner .content a{margin-top:10px;}
#home-banner p {margin: 15px 0;line-height:1.2;}



.navbar-right {padding-right: 0}    
.navbar-fixed-top .navbar-collapse, .navbar-fixed-bottom .navbar-collapse {max-height: none;background:#333;}  
.navbar-toggle {margin-right:30px!important; margin-top: 20px!important}
#top-menu.navbar-default ul.navbar-nav > li > a {display: block; font-weight: 400}
#top-menu.navbar-default .navbar-nav > li > a {color: #fff}
#top-menu.navbar-default ul.navbar-nav ul li {width: 100%!important; background: #3d4c62}
#top-menu.navbar-default ul.navbar-nav ul ul {left: 0;}
#top-menu.navbar-default ul.navbar-nav ul {position: relative;}
#top-menu.navbar-default .navbar-nav ul {top:0}   
#top-menu.navbar-default .navbar-nav li:hover {background:none;}
#top-menu.navbar-default ul.navbar-nav > li  {border-bottom:1px solid #555759; font-size:0;}
#top-menu.navbar-default ul.navbar-nav > li > a {display: block; padding: 20px 20px 20px 50px }
#top-menu.navbar-default .navbar-nav ul a {padding-left:30px; line-height: 40px}    


#top-menu.navbar-default .navbar-nav li.mlang {display: block; text-align: right; background: #0b2446}
#top-menu.navbar-default ul.navbar-nav > li.mlang > a {display: block; padding:20px}
#top-menu.navbar-default .navbar-nav ul li {padding:5px 10px 5px 20px;}
#top-menu.navbar-default .navbar-nav ul li:last-child {border-bottom: 0}
.sub-menu {padding:0; padding-bottom:0;width:100%;}
.sub-menu:before{display: none}


#home-banner {height:550px;}
.carousel-caption {bottom:430px;}
.carousel-control i    {bottom:250px; }
.carousel-caption .font1	{font-size:25px; line-height:30px;}
.carousel-caption .font2	{font-size:40px;line-height:70px; padding-bottom: 0}
.carousel-caption .font3    {font-size:17px;line-height:25px; }

.single .entry-header h2	{font-size:24px; margin-top:40px;}
.single .entry-header em	{font-size:25px; padding-top: 10px}
.single .entry-header span	{font-size:15px;line-height: 30px}
.single .entry-header .h2line { margin:0 auto;line-height: 10px}
        


    
    
}





@media (max-width: 520px) {
    
#top-menu.navbar-default .navbar-brand img {width:120px;}
#top-menu.navbar-default .navbar-brand {padding:20px 30px}

    
.sub_con {padding:0 20px; }
    
.carousel-caption .font1	{font-size:21px;}
.carousel-caption {top:120px;}    
#home-banner {height:450px;} 
.carousel-indicators {bottom:0px!important}
.carousel-control i {bottom:200px}
.carousel-indicators .active {width: 13px!important; height: 13px!important}
.carousel-indicators li {width: 13px!important; height: 13px!important}
     
.vision li img {width:100%}
    
    .container h2.main {font-size:30px; padding:  20px 0 20px 0}    
    .container h2.main span {font-size:20px}    
    
.min_product li {display:block; height:auto; width: 100%;}
.min_product li.pro_01 {background-size:180px}
.min_product li.pro_01 .box_01 {margin:40px 0 0 90px; width: 240px; height:200px;   padding:10px; }
.min_product li.pro_01 .box_01 span { padding:40px 0 20px;font-size:14px}

.min_product li.pro_02 {background: url(../img/main_02_m.png) left top no-repeat; float: none; text-align: left;background-size:180px}
.min_product li.pro_02 .box_02 {margin:40px 0 0 90px; width: 240px; height:240px;   padding:10px; border: 4px solid #4e9de0;}
.min_product li.pro_02 .box_02 span { padding:40px 0 20px;font-size:14px}
    
.min_product li.pro_02 {margin:30px 0}
.main_plat {line-height: 25px} 
    
}