/*--------------------
invesume home base
----------------------*/

@charset "utf-8";
@import url(materialdesignicons.css);
@import url(animate.css);
@import url(content.css);
@import url(main.css);
@import url(owl.carousel.css);
@import url(owl.theme.css);
@import url(bootstrap.css);
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700;900&display=swap');


@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');
 }

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



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

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


a:hover, a:active {outline: 0;text-decoration: none; -webkit-transition-duration: 0.5s; transition-duration: 0.5s;cursor: pointer; transition: all 0.5s; color:#2e409b}
a {color:#222}
p {margin: 0; padding: 0}




#wrap {min-width:320px}
#container {width:100%; min-height:800px;}





/* header */
#header {position:fixed; top:0; left:0; width:100%; height:100px; background:#fff; border-bottom:1px solid #d9d9d9; z-index:1000;}
#header h1 {position:absolute; top:20px; left:100px; z-index:11; margin: 0}
#header h1 img {width:150px;}

#header .head_util {position:absolute; top:0; right:218px; z-index:12;}
#header .head_util .tit {display:none;}
#header .head_util > ul {padding:32px 0px 0 0; font-size:0;}
#header .head_util > ul > li {position:relative; display:inline-block; font-size:14px; padding:0 10px; font-weight:500; color:#666}
#header .head_util > ul > li:before {content:''; position:absolute; top:50%; right:0; display:block; width:1px; height:10px; margin-top:-6px; background:#d0d0d0;}
#header .head_util > ul > li:last-child:before {display:none}
#header .head_util > ul > li a:hover {color:#222; text-decoration:none; }
#header .head_util > ul > li:last-child a {position:relative; padding-left:20px; display: none}
#header .head_util > ul > li:last-child a:before {content:''; position:absolute; top:1px; left:0; display:block; width:15px; height:15px; background:url('../images/common/ico_gb.png') 0 0 no-repeat; background-size:15px;}
#header .head_util > ul > li:last-child a:hover:before {background-image:url('../images/common/ico_gb_color.png') }

#header .btn_bar {position:absolute; display:block; top:0; right:0; z-index:20;}
#header .btn_bar > button {display:block; width:30px; height:30px; border: 0}
#header .btn_bar > button > span {position:relative; display:block; margin: 0 auto; width:25px; height:2px; background:#222; text-indent:-9999px;}
#header .btn_bar > button > span:after, #header .btn_bar > button > span:before {position:absolute; display:block; right:0; width:25px; height:2px; background:#222;}
#header .btn_bar > button > span:after {top:-9px; transition: all 0.3s ease; content:''; }
#header .btn_bar > button > span:before {top:9px; transition: all 0.2s ease; content:'';} 
#header .btn_bar > button:hover > span:after, #header .btn_bar > button:hover > span:before {width:100%;}	


#header .btn_nav, #header .nav_close {display:none; }

/* gnb */
#ognb {position:relative; z-index:10; }
#ognb > ul {text-align:center; font-size:0;}
#ognb > ul > li {position:relative; display:inline-block; }
#ognb > ul > li > a {display:block; padding:0 60px; height:100px; font-size:22px; font-weight:500; text-decoration:none; line-height:100px; letter-spacing:-0.6px;color: #000 }
#ognb > ul > li.long > a {padding:0 60px;}
#ognb > ul > li > a:hover, #ognb > ul > li > a:focus {color:#2e409b; transition:all 0.2s ease-out;}
#ognb > ul > li > a:after {display:block; position:absolute; left:50%; bottom:0; width:0; height:2px; content:''; transition:all 0.2s ease-out;}
#ognb > ul > li > a:hover:after, #ognb > ul > li:hover a:after {width:100%; margin-left:-50%; background:#114c9f;}
#ognb > ul > li.on > a:before {display:block} 
/* #gnb > ul > li.on > a {color:#114c9f;} */

#ognb > ul > li > ul {display:none; position:absolute; z-index:120; top:100px; left:0; width:100%; height:250px; padding-top:15px ; border-right:1px solid #e5e5e5;}
#ognb > ul > li:first-child > ul {border-left:1px solid #e5e5e5;}
#ognb.open > ul > li > ul {display:block;}
#ognb span.bg {display:none; position:absolute; z-index:110; top:100px; left:0; width:100%; height:250px; background:#fff;border-bottom:1px solid #e5e5e5;}
#ognb.open span.bg {display:block;}
#ognb.open > ul > li:first-child:before {display:block;}
#ognb > ul > li > ul > li > a {display:block; position:relative; padding:10px 5px; color:#666; font-size:16px; text-align:center; line-height:22px; text-decoration:none; letter-spacing:-0.3px; color: #333}
#ognb > ul > li > ul > li > a:hover, #ognb > ul > li > ul > li > a:focus {color:#2e409b;}
#ognb > ul > li ul.depth3 {display:none;}



@media screen and (max-width:1700px) {	
	/* header */
	#header h1 {left:100px;}

	/* gnb */
	#ognb > ul > li > a {padding:0 50px;}
	#ognb > ul > li.long > a {padding:0 60px;}
	#ognb > ul > li > ul > li > a {padding-left:5px; padding-right:5px; font-size:16px;}
}
@media screen and (max-width:1500px) {	
	/* gnb */
	#ognb > ul > li > a {padding:0 50px;}
}
@media screen and (max-width:1025px) {	

	/* header */
	#header {height:80px;}
	#header h1 {position:static; padding-top:15px; text-align:center;}
    #header h1 img {width: 120px}

	#header .head_util {display:table; width:290px; right:-290px; left:auto; height:100px; margin-left:0; background:#fff; border-bottom:1px solid #e7e7e7; transition: right 0.3s ease; z-index:110; opacity:0;}
	#header .head_util:after {content:''; display:block; clear:both;}
	#header .head_util > ul {display:table-cell; padding:0; vertical-align:middle; text-align:right; padding-right:5px;}
	
	#header .head_util > ul > li {padding:0 6px;}
	#header .head_util > ul > li a {display:inline-block; font-size:14px;}
	#header .head_util .tit {display:table-cell; text-align:left; vertical-align:middle; padding-left:18px;}
	#header .head_util .tit img {width: 80px}
	#header .head_util > ul > li:last-child a {padding:3px 13px; border:1px solid #cecece; color:#777; border-radius:30px;display: inline-block}
	#header .head_util > ul > li:last-child a:before {display:none}
	#header .head_util > ul > li:last-child a span {display:none}



	#header .btn_bar > button {width:64px; height:64px; background: #fff;}
	#header .btn_sitemap {display:none}
	#header .btn_nav, #header .nav_close {display:block}
  
	#header .nav_close {z-index:110; position:fixed; top:0; right:-40px; display:block; transition: right 0.3s ease;}
	#header .nav_close > button {width:40px; height:40px; background:#111 url('/content/images/ico_cancel.png') no-repeat 50%/18px; text-indent:-9999px; border: 0; }
	
	#header.open .head_util {right:0; opacity:1;}
	#header.open .nav_close {right:290px;}
	#header.open .mask {position: fixed; z-index:100; top:0; left:0; width:100%; height:100%; background:#000; opacity:0.5;}
	#header.open #ognb {right:0; overflow-y:auto;}	

	/* gnb */
	#ognb {position:fixed; display:block; top:0; right:-290px; padding-top:80px; width:290px; height:100%; background:#fff; z-index:110; transition: right 0.3s ease;}
	#ognb > ul {text-align:left;}
	#ognb > ul > li {display:block; width:100%; border-bottom:1px solid #e7e7e7}
	#ognb > ul > li:after {display:none}
	#ognb > ul > li > a {padding:0 30px; height:70px; line-height:70px; font-size:21px; color:#000; text-decoration:none; }
	#ognb > ul > li.long > a {padding:0 50px;}
	#ognb > ul > li > a:hover {background-color:#f6f6f6;}
	#ognb > ul > li > a:hover:before {display:none}
	#ognb > ul > li > ul {position:static; padding:0; height:auto; max-height:0; min-height:auto; border:0; display:block !important; overflow:hidden; transition:max-height 0.8s;}	
	#ognb > ul > li > ul > li > a {position:relative; display:block; padding:0 30px; height:46px; line-height:46px; border-bottom:1px solid #e5e5e5; color:#666; font-size:16px; text-align:left;}
	#ognb > ul > li > ul > li:last-child > a {border-bottom:0 none}
	#ognb > ul > li > ul > li > a:hover, #ognb > ul > li > ul > li.on > a { color:#114c9f;} 
	#ognb > ul > li > ul > li.on > a {font-weight:bold; } 
    #ognb > ul > li.on > ul {max-height:2000px;}
	#ognb > ul > li.on > a {background:#114c9f;   color:#fff}
	#ognb > ul > li > a:after, #ognb.open span.bg {display:none;}
	#ognb > ul > li.on > a:before {display:none;}
}
@media screen and (max-width:620px) {	

	/* header */
	#header {height:65px;}
	#header h1 {padding:15px 0 0 15px;}
	#header h1 img {width: 100px}

	
	#header .btn_bar > button {width:64px; height:64px; }
	#header .btn_bar > button > span {transform:scale(0.9)}

	#header .head_util {height:65px;}

	#header .head_util > ul > li a {font-size:11px}	

	/* gnb */
	#ognb {padding-top:65px;}
	#ognb > ul > li > a {height:60px; line-height:60px; font-size:17px; letter-spacing:-0.3px;}
	#ognb > ul > li > ul > li > a {height:42px; line-height:42px; font-size:14px;}
	#ognb > ul > li > ul > li > a:before {top:49%}
}








.lang{position: absolute; right: 100px; top:30px}
.lang a{color:#fff; line-height: 30px; border-radius: 3px; padding: 5px 10px; background: #000}
.lang a:hover{background: #2e409b}




.entry{width: 100%; height: 430px;overflow: hidden;margin: 0 auto;text-align: center;position: relative;margin-top: 70px;}
.entry_header{
	background-repeat: no-repeat;-webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;background-size: cover;  
	height: 430px;text-align:center;position: relative;
    animation-name: zoom;vertical-align: middle;z-index: 90;
    animation-duration: 2s;
    animation-delay: 1.5s;
    animation-iteration-count: 1;
    animation-direction: alternate;
    animation-fill-mode: forwards;
    transform: scale(1.1, 1.1);}


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

.entry_header .content {position: relative;}
h2.intitle{color: #fff; z-index: 99 ; position:absolute; left:50%; transform:translateX(-50%);top:150px; font-size:80px;font-weight: 500;}
h2.intitle span {display: block; font-size:27px;  line-height: 150px;font-weight: 400 }



.entry_header.bg1 {background-image: url(/content/images/sub_01.jpg); background-position: center bottom;}
.entry_header.bg2 {background-image: url(/content/images/sub_02.jpg); background-position: center bottom;}
.entry_header.bg3 {background-image: url(/content/images/sub_03.jpg); background-position: center bottom;}
.entry_header.bg4 {background-image: url(/content/images/sub_04.jpg); background-position: center bottom;}


.tabarea {width: 100%;  font-size: 0; border-bottom: 1px solid #dcdfe2;}
.menu_tab {width: 1200px;text-align: center; margin: 0 auto; }
.menu_tab li {display:inline-block; font-size:20px;width: 20%; border-right: 1px solid #dcdfe2;box-sizing: border-box;height: 70px;}
.menu_tab li a{line-height: 70px;  color: #111;display: block}
.menu_tab li a:hover { color:#123ea5; }
.menu_tab li a.on { color: #123ea5}
.menu_tab li:first-child{ border-left: 1px solid #dcdfe2;}

.menu_tab3 {width: 1200px;text-align: center; margin: 0 auto; }
.menu_tab3 li {display:inline-block; font-size:20px;width: 30%; border-right: 1px solid #dcdfe2;box-sizing: border-box;height: 70px;}
.menu_tab3 li a{line-height: 70px;  color: #111;display: block}
.menu_tab3 li a:hover { color:#123ea5; }
.menu_tab3 li a.on { color: #123ea5}
.menu_tab3 li:first-child{ border-left: 1px solid #dcdfe2;}


.menu_tab2 {width: 1200px;text-align: center; margin: 0 auto; }
.menu_tab2 li {display:inline-block; font-size:20px;width: 50%; border-right: 1px solid #dcdfe2;box-sizing: border-box;height: 70px;}
.menu_tab2 li a{line-height: 70px;  color: #111;display: block}
.menu_tab2 li a:hover { color:#123ea5; }
.menu_tab2 li a.on { color: #123ea5}
.menu_tab2 li:first-child{ border-left: 1px solid #dcdfe2;}



.bottom-footer {padding:40px 0 ; width: 100% ; border-top: 1px solid #dcdfe2;}
.bottom-footer .site-identity {color: #888;font-size:14px; line-height:20px;text-align: left;  margin:0 auto; width: 1000px;  background: url('/content/images/logo2.png') no-repeat; padding-left: 170px}
.bottom-footer .site-identity ul li {display: inline-block; padding-right: 30px ; }
.bottom-footer .site-identity a{color: #888;}
.bottom-footer .site-identity p {padding-top: 7px}





.container {padding-left:0!important; padding-right:0!important; width: 100%; margin-bottom: 150px;background: #fff }
.sub_content  { width: 1200px;text-align: left; margin: 0 auto; min-height: 500px; padding-top: 100px}


.container_bbs {padding-left:0!important; padding-right:0!important; width: 100%; margin-bottom:100px; background: #fff}
.sub_content_bbs  { width: 1200px;text-align: left; margin: 50px auto; }







/*--------------------
해상도별
----------------------*/
 @media (max-width: 1680px) 
{
.sh-header {padding-right:40px; padding-left:40px;}
.sh-header .logo img{margin-right: 100px; }
.sh-header .lang{ right: 40px; }
.menu li .menu-content { padding-left: 420px; }
.menu li .menu-content a { width: 20%; margin-right: 5%; }
.menu-content .menu1 { width: 380px; background-position: right 10px top 70px ,left 50px top 0px;}
   
}

 @media (max-width: 1280px) 
{

#header h1 {left:30px; }
.lang{ right: 30px;}
  
.menu_tab {width: 100%; }
  
  
.sub_content  { width: 100%; padding-right: 30px; padding-left: 30px}
 

.sub_content_bbs  { width: 100%; }
 
}



 @media (max-width: 1024px) {
   html, body {font-size:15px; line-height: 23px}

   
  .container {width:100%!important; margin-bottom: 50px}  
  .sub_content {width:100%!important;  padding: 0 20px;  margin: 50px auto;}  
 
  
  .container_bbs {width:100%!important; margin-bottom: 50px}  
  .sub_content_bbs {width:100%!important;  margin:0; padding: 0 20px}  

   
  h2.intitle{ width: 100%; font-size: 30px;top:40px}
  h2.intitle span {display: block; font-size:16px;  line-height: 70px;  }
  .entry_header.bg1 { background-position: right bottom;}
  .entry{height: 150px; margin-top: 60px;}
  .entry_header{height: 150px;}

   
  .tabarea {border-bottom: 0px}
  .menu_tab {width: 100%; }
  .menu_tab li {font-size:16px;width: calc(100% / 3); border-bottom: 1px solid #dcdfe2; height: 50px;}
  .menu_tab li:nth-child( 3 ) {border-right: 0}
  .menu_tab li:nth-child( 4 ) {width: 50%}
  .menu_tab li:nth-child( 5 ) {width: 50%}
  .menu_tab li:nth-child( 5 ) {border-right: 0}
  .menu_tab li a{line-height: 50px;  }
   
  .menu_tab3 {width: 100%;}
  .menu_tab3 li {font-size:16px;width: calc(100% / 3); border-right: 1px solid #dcdfe2; border-bottom: 1px solid #dcdfe2;height: 50px; font-weight: 500}
  .menu_tab3 li a{line-height: 50px;  }
  .menu_tab3 li:first-child{ border-left: 0} 
   
  
  .menu_tab2 {width: 100%;}
  .menu_tab2 li {font-size:16px;width: 50%; height: 50px;border-bottom: 1px solid #dcdfe2;}
  .menu_tab2 li a{line-height: 50px;}
  .menu_tab2 li:first-child{ border-left: 0;} 
  .menu_tab2 li:last-child{ border-right: 0;}  
   
  .bottom-footer {padding:20px;}
  .bottom-footer .site-identity {color: #666; font-size:12px; line-height:16px;text-align: left;  width: 100%;  background: url('/content/images/logo2.png') center top no-repeat; padding-left: 0; background-size: 80px; padding-top: 30px}
  .bottom-footer .site-identity ul li { padding-right: 10px ; }
  .bottom-footer .site-identity a{color: #666;}
  .bottom-footer .site-identity p {padding-top: 7px}
  .bottom-footer  span {display: none}
   
   
      
}



 @media (max-width: 640px) {

  .menu_tab li {width: 50%; font-size: 16px; height: 50px; font-weight: 500 }
  .menu_tab li:nth-child( 3 ) {border-right: 1px solid #dcdfe2;}
  .menu_tab li:nth-child( 5 ) { width: 100%}
  .menu_tab li:nth-child( 2n )  {border-right: 0}
  .menu_tab li a{line-height: 50px; }
   
   

  .menu_tab2 li {font-size:14px; }
  .menu_tab2 li a{line-height: 50px;}
  .menu_tab2 li:first-child{ border-left: 0; width: 60%;} 
  .menu_tab2 li:last-child{ border-right: 0;width: 40%;}  

}