@charset "utf-8";
/* SIR 지운아빠 */

@import url('http://fonts.googleapis.com/earlyaccess/notosanskr.css'); 
/*@import url(http://fonts.googleapis.com/earlyaccess/notosanssc.css); */

/* 초기화 */
@font-face {
  font-family: 'Nanum Barun Gothic';
  font-style: normal;
  src: url(/fonts/NanumBarunGothic.eot);
  src: local('Nanum Barun Gothic'),
       local('NanumBarunGothic'),
       url(/fonts/NanumBarunGothic.eot?#iefix) format('embedded-opentype'),
       url(/fonts/NanumBarunGothic.woff2) format('woff2'),
       url(/fonts/NanumBarunGothic.woff) format('woff'),
       url(/fonts/NanumBarunGothic.ttf) format('truetype');
}

html {overflow-y:scroll}
html *{font-family: 'Noto Sans KR', "맑은 고딕", "Malgun Gothic", sans-serif;}
body {margin:0;padding:0;font-size:0.75em;}
html, h1, h2, h3, h4, h5, h6, form, fieldset, img {margin:0;padding:0;border:0}
h1, h2, h3, h4, h5, h6 {font-size:1em}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block}
#hd ul, nav ul, #ft ul {margin:0;padding:0;list-style:none}
legend {position:absolute;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden}
label, input, button, select, img {vertical-align:middle}
input, button {margin:0;padding:0;font-size:1em}
input[type="submit"] { -webkit-appearance: none; }
button {cursor:pointer}
input[type=text], input[type=password], input[type=submit], input[type=image], button {border-radius:0;font-size:1em;/*-webkit-appearance:none*/}
textarea, select {font-size:1em;font-family:dotum}
textarea {border-radius:0;-webkit-appearance:none}
select {margin:0}
p {margin:0;padding:0;word-break:break-all}
hr {display:none}
pre {overflow-x:scroll;font-size:1.1em}
a:link, a:visited {color:#000;text-decoration:none}
a:hover, a:focus, a:active {color:#000;text-decoration:underline}
ul li{text-decoration: none;}
ol, ul {list-style: 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, 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;
/* 	font-size: 100%; */
	font-size: 14px;
	font: inherit;
	vertical-align: baseline;
}
/* body{overflow: hidden;} */
body *{font-family: 'Noto Sans KR', 'Nanum Barun Gothic', '맑은 고딕', 'Malgun Gothic', sans-serif;}

.center{text-align: center;}
.right{text-align: right;}
.left{text-align: left;}

ul.items,
ul.items li {
  margin: 0;
  padding: 0;
  list-style: none;
}
.ibreset {
  font-size: 0;
  letter-spacing: 0;
  margin: 0;
  padding: 0;
}
.header {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  /* background: url(../images/layout/bg-header.png) repeat-x 0 51px; */
  z-index: 40;
}
.header .hwrap {
  position: relative;
  width: 100%;
  margin: 0 auto;
}
.header .gnb .items {
  display: block;
  font-size: 0;
  letter-spacing: 0;
  margin: 0;
  padding: 0;
  padding: 16px 0;
}
.header .gnb .items li {
  display: inline-block;
}
.header .gnb .items li a {
  display: block;
  font-size: 14px;
  color: #fff;
  padding-left: 20px;
  height: 20px;
  line-height: 20px;
  vertical-align: middle;
  margin-right: 12px;
}
.header .logo {
  /* position: absolute;
  top: 30px;
  left: 0;
  padding: 0;
  margin: 0; */
  text-align:center;
  padding-top: 20px;
  padding-bottom: 10px;
  -webkit-transition: top 20ms ease;
  transition: top 20ms ease;
}
.header .mnb {
    display: block;
    box-sizing: border-box;
    position: relative;
    text-align: center;
    height: 100%;
    overflow: hidden;
    z-index: 110;
	/* background: rgba(46, 44, 38, 0.62); */
  -webkit-transition: top 150ms ease-out;
  transition: top 150ms ease-out;
  padding: 30px 30px;
}
.header .mnb .a_logo{
	position: absolute; top: 45px; left: 59px;
}
.header .mnb .a_logo img{
	width: 150px;
}
.header .mnb .items {
  font-size: 0;
  letter-spacing: 0;
  margin: 0;
  padding: 0;
  float: right;
}
.header .mnb .items li {
  display: inline-block;
  /* padding: 10px 20px; */
}
.header .mnb .items li.change-again {
/*   display: none; */
}
.header .mnb .items li a {
  position: relative;
  display: block;
  font-size: 17px;
  color: #fff;
   height: 100%;
   padding: 20px 45px 23px 45px;
  transition: all 500ms ease;
  text-decoration: none !important;
  font-weight: bold;
}

.header .mnb .items li a:after {
  content: '';
  display: block;
  width: 1px;
  height: 2px;
  background: #fff;
  position: absolute;
  bottom: 0px;
  left: -50%;
  right: -50%;
  margin: 0 auto;
  transition: all 300ms ease;
  opacity: 0;
}

.header .mnb .items li a.active,
.header .mnb .items li a:focus,
.header .mnb .items li a:hover {
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.8);
  /* background-color:#457963; */
}
.header .mnb .items li a.active:after,
.header .mnb .items li a:focus:after,
.header .mnb .items li a:hover:after {
  width: 72%;
  opacity: 1;
  transition: all 200ms ease;
}
html.fixed-h .header {
  position: fixed;
  width: 100%;
  /* height: 80px; */
  left: 0;
  top: 0;
  background-position: 0 -52px;
  /* background-color: #fff; */
  z-index: 90;
  -webkit-box-shadow: 1px 1px 20px rgba(0, 0, 0, 0.2);
  box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.2);
}
html.fixed-h .header .gnb {
  display: none;
}
html.fixed-h .header .logo {
  display: none;
}
html.fixed-h .header .logo a {
  display: block;
  background: url(../images/_blank.gif);
  width: 100%;
  height: 100%;
}
html.fixed-h .header .logo a img {
  display: none;
}
html.fixed-h .header .mnb {
  /* top: 20px; */
  /* background: rgba(46, 44, 38, 0.62); */
  background-color: #ffffff;
   padding: 0 30px;
}
html.fixed-h .header .mnb .a_logo{
	top: 8px;
}
html.fixed-h .header .mnb li a {
  position: relative;
  display: block;
  /* font-size: 16px; */
  color: #4e4e4e;
  padding: 20px 45px 23px 45px;
  transition: all 500ms ease;
  text-shadow: none;
}
html.fixed-h .header .mnb li a:after {
  content: '';
  display: block;
  width: 1px;
  height: 2px;
  background: #4e4e4e;
  position: absolute;
  bottom: 10px;
  left: -50%;
  right: -50%;
  margin: 0 auto;
  transition: all 300ms ease;
  opacity: 0;
}
html.fixed-h .header .mnb li a.active,
html.fixed-h .header .mnb li a:focus,
html.fixed-h .header .mnb li a:hover {
  text-shadow: none;
}
html.fixed-h .header .mnb li a.active:after,
html.fixed-h .header .mnb li a:focus:after,
html.fixed-h .header .mnb li a:hover:after {
  width: 72%;
  opacity: 1;
  transition: all 200ms ease;
}

.btn_blog{  position: absolute; top: 36px; right: 0; background-color: #00c73c; color: #fff; height: 53px; min-width: 153px; line-height: 53px; text-align: center; letter-spacing: 2px;     transition: all 500ms ease;}
.btn_blog:link{color: #fff;}
.btn_blog:focus{text-decoration: none;}
html.fixed-h .btn_blog{top: 13px;}

#contents{width:1000px; margin: 0 auto; overflow: hidden; margin-top: 50px; margin-bottom: 100px;}


#left{display:inline-block; width: 180px; margin-right:17px; float:left; height: 800px;}
#left>ul{width: 180px; border: 1px solid #b4c9de; box-sizing: border-box;}
#left>ul>li{border-bottom: 1px solid #b4c9de; margin: 0 6px; font-size: 16px;}
#left>ul>li:last-child{border-bottom: 0;}
#left>ul>li>a{display: block; padding: 7px 0; padding-left: 17px; margin: 5px;}
#left>ul>li>a:hover{text-decoration: none; background-color: #184675; color: #fff; border-radius: 0 10px 0;}
#left>ul>li>a.on{background-color: #184675; color: #fff; border-radius: 0 10px 0;}
#left>.l_banner{margin-top: 10px;}
#left>.kommerling{border: 1px solid #ddd; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; margin-top: 30px;}
#left>.l_banner img, #left>.l_banner a{display: block; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; width: 100%;}
#left ul li div{height: 130px; position: relative;}
.en{position: absolute; top: 39px; color: #91adb7; right: 5px;}
.ko{display: inline-block; width: 100%; text-align: center; position: absolute; top: 53px; color: #0072bc; font-size: 26px;}


#right{display:inline-block; width: 780px; float:right; min-height: 800px;}
#right .title {border-bottom: 1px solid #ddd; padding: 0 6px 6px 6px; overflow: hidden;}
#right .title .left{float: left; font-size: 25px; }
#right .title .right{float:right ; padding-top: 12px; font-size: 14px;}
#right .content{margin-top: 30px;}


.bottom{position: fixed; z-index: 70; bottom: 0; background-color: #444; width: 100%;}
.bottom .wrapper1{border-bottom: 1px solid #797979;}
.bottom .wrapper1 .wrapper{padding: 14px 0; color: #a7a7a7; width: 1000px; margin: 0 auto;}
.bottom .wrapper1 .wrapper img{width: 99px;}
.bottom .wrapper2 .wrapper{padding: 10px 0; font-size: 13px; color: #a7a7a7; line-height: 21px; letter-spacing: 1px;  margin: 0 auto; text-align: center;}
.bottom .wrapper2 .wrapper a{color: #a7a7a7;}
.bottom .wrapper2 .wrapper a img{display: inline-block; vertical-align: middle; margin-right: 3px;}
.bottom .wrapper .bottom_l{display: inline-block; width: 350px; float:left; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; padding-left: 80px;}
.bottom .wrapper .bottom_r{display: inline-block; width: 650px; color: #808080; font-size: 15px;}
.bottom .wrapper .bottom_r div{margin-bottom: 8px;}
.bottom .wrapper .bottom_r .highlight{color: #da3939; font-size: 20px; font-weight: bold;}
.bottom .wrapper .bottom_r .blog{color: #0072BC;}
.blogimg{width: 30px; vertical-align: middle;}
.bottom .wrapper .bottom_r .copyright{margin-top: 35px;}
.bottom .wrapper .bottom_r .tel{color: #808080;}
.bottom .wrapper .bottom_r .tel:link, .bottom .wrapper .bottom_r .tel:focus{text-decoration: none;}

#sub_banner{background: url(/img/top_banner_bg.jpg) center center no-repeat; width: 100%; height: 152px;}
#sub_banner .wrapper{width: 1000px; margin: 0 auto; height: 152px;}
#sub_banner .wrapper .left{display: inline-block; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; width: 178px; position: relative; height: 100%; float: left;}
#sub_banner .wrapper .left img{display: inline-block; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto;}
#sub_banner .wrapper .right{width: 773px; height: 152px; float: right; position: relative;}
#sub_banner .wrapper .right .banners{width: 482px; height: 87px; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; overflow: hidden;}

/* paging */
.nav_page{text-align: center;}
.nav_page .pagination{display: inline-block;}
.nav_page .pagination li{float: left; margin-right: 10px; line-height: 29px; padding: 5px;}
.nav_page .pagination li.active{color: #1980C3;}
.nav_page .pagination li a{}
.nav_page .pagination li.active a{color: #16c133;}
.nav_page .pagination li a:hover{color: #1980C3;}