@charset "utf-8";
/* CSS Document */


@import url(//fonts.googleapis.com/earlyaccess/hanna.css);

.hanna * {
    font-family: 'Hanna', fantasy;
}

/* reset  */
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {margin:0; padding:0; border:0; outline:0;vertical-align:baseline; background:transparent;} 

html {font-size:20px} 
@media screen and (max-width:1300px){ 	
	html {font-size:18px} 
}


body {
    width: 100%;
    height: 100%;
	-ms-text-size-adjust: none;
	-webkit-text-size-adjust:none;
	-moz-text-size-adjust: none;
	font-smoothing: antialiased;
    -webkit-font-smoothing: antialiased;
    line-height:1.5; 
    font-weight:400;
    font-size:0.8rem; 
    font-family:"Noto Sans KR", sans-serif;color:#555;
    letter-spacing:-0.05em;
    word-wrap:break-word;
    word-break: break-word;
}

*{box-sizing:border-box;-webkit-box-sizing:border-box;-ms-box-sizing:border-box;-moz-box-sizing:border-box;-o-box-sizing:border-box}


/* html5 block */
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {display:block;}


/* 헤더 폰트 사이즈 초기화 */
h1, h2, h3, h4, h5, h6 {font-size:100%;}

/* 리스트의 스타일 제거 */
dl, ol, ul, li {list-style: none}
	
/* 폰트 강조 특성 초기화 */
address, caption, cite, code, dfn, em, th, var,i {font-style:normal;} 

/* 테이블 스타일 초기화 */
table {width:100%;border-collapse:separate;border-spacing:0;} /* border-collapse: collapse; ff에서 border="0" 인 경우 문제 발생 */
tbody, tfoot, thead, tr, th, td {word-break:break-all;}
caption {visibility:hidden;width:0;height:0;font-size:0;line-height:0;position:static;left:0;top:-999999px;}

a {text-decoration:none}

/*이미지 초기화 */
img{vertical-align:middle; border:0;}

/* 인용구 표시 초기화 */
blockquote, q {quotes: none;}
blockquote:before, blockquote:after,
q:before, q:after {
    content:'';
    content:none;
}
::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color:#999;
}
::-moz-placeholder { /* Firefox 19+ */
  color:#999;
}
:-ms-input-placeholder { /* IE 10+ */
  color:#999;
}
:-moz-placeholder { /* Firefox 18- */
  color:#999;
}
input:focus::-webkit-input-placeholder, textarea:focus::-webkit-input-placeholder { 
  /* WebKit browsers */ color:transparent; 
} 
input:focus:-moz-placeholder, textarea:focus:-moz-placeholder { 
  /* Mozilla Firefox 4 to 18 */ color:transparent;
} 
input:focus::-moz-placeholder, textarea:focus::-moz-placeholder { 
  /* Mozilla Firefox 19+ */ color:transparent; 
} 
input:focus:-ms-input-placeholder, textarea:focus:-ms-input-placeholder { 
  /* Internet Explorer 10+ */ color:transparent; 
}

input[type="checkbox"],
input[type="radio"] {
  cursor: pointer;
  width: 14px;
  height: 14px;
  margin-top: -1px;
}

.blind {
    border: 0;
    clip: rect(0,0,0,0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    white-space:nowrap;
}

.font-hanna {font-family:'Hanna', serif;letter-spacing:0}
.font-NanumSquareRound {font-family:'NanumSquareRound', serif;letter-spacing:0}
.font-mont {font-family:'Montserrat', sans-serif;}
.it {font-style:italic}
.container { *zoom:1; }   /*IE 6~7 브라우저에서만 작용*/ 
.container:after { content: ""; clear: both; display: block; }  /*IE 6~7 브라우저에서만 작용*/ 
.clear { clear: both }

#daumIndex {overflow:hidden;position:absolute;left:-9999px;width:0;height:1px;margin:0;padding:0} /* 스킵네비게이션 */
.ir_pm {display:block;overflow:hidden;font-size:0px;line-height:0;text-indent:-9999px} /* 사용된 이미지내 의미있는 텍스트의 대체텍스트를 제공할때 */
.ir_wa {display:block;overflow:hidden;position:relative;width:100%;height:100%;z-index:-1} /* 중요한 이미지 대체텍스트로 이미지off시에도 대체 텍스트를 보여주고자 할때 */
.screen_out {
    border: 0;
    clip: rect(0,0,0,0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    white-space: nowrap;
} /* 대체텍스트가 아닌 접근성을 위한 숨김텍스트를 제공할때 */
.screen_hide {font-size:0;line-height:0;visibility:hidden} /* screen_out클래스를 사용할 수 없으며, 해당 텍스트를 숨겨야 할때 */
#skipNav {
    position: absolute;
    left: 0;
    top: -1000px;
    width: 100%;
    height: 0px;
    z-index: 1000;
    line-height: 0px;
    font-size: 0px;
}
#skipNav a {
    display: block;
    text-align: center;
    width: 100%;
    line-height: 0px;
    font-size: 0px;
}

.wa_ir_wrap {position:relative;width:776px;z-index:0;padding:0;margin:0;overflow:hidden}
.wa_ir_wrap .img {width:100%;text-align:center;background-position:50% 0;background-repeat:no-repeat}
.wa_ir_wrap .txt {display:block;position:relative;z-index:-1;padding:8px 0;border:1px solid #bcc1ec;background-color:#F1F3FF;text-align:left}

.f_l {float:left !important}
.f_r {float:right !important}

.clearfix:before,
.clearfix:after {display:table;content: " "}
.clearfix:after {clear: both}
.show {display:block}
.hide {display:none}

.align_center {text-align:center !important}
.align_left {text-align:left !important}
.align_right {text-align:right !important}

.s_img {position:relative;padding-top:70%;overflow:hidden;z-index:2;}
.s_img .img {position:absolute;top:0;left:0;right:0;bottom:0;overflow:visible !important}
.s_img .img img {position:absolute;top:0;left:0;}

/*etc*/
address,em,i{font-style:normal;}
strong {font-weight:500;}
hr { display:block;height:1px;border:0;   border-top:1px solid #cccccc;margin:1em 0;padding:0;}
abbr[title], dfn[title] {border-bottom:1px dotted; cursor:help;} /*cursor:help; 물음표*/
mark {background-color:#ff9;color:#000; font-style:italic; font-weight:bold;}
del {text-decoration: line-through;}
ins {background-color:#ff9;color:#000;text-decoration:none;}


/* fieldset */
fieldset {border:none; margin:0;padding:0;}
legend {overflow:hidden;position:absolute;top:0;left:0;width:1px;height:1px;font-size:0;line-height:100px;white-space:nowrap}



/* form */
input, button, select, textarea {margin:0;vertical-align:middle; border:0;}
textarea {padding:1%; border:1px solid #e5e5e5; color:#4d4d4d; resize:none;font-family: "Noto Sans KR", sans-serif;}    

input[type="button"], 
button {margin:0; padding:0; border:0; 
        border-radius:0 !important; 
        -webkit-border-radius:0px !important; 
        -webkit-appearance:none !important; cursor:pointer; font-family: "Noto Sans KR", sans-serif;} 
button, input[type="reset"], input[type="button"], input[type="submit"] {line-height:normal; border:none;}

.ie7 input[type="text"], .ie7 input[type="password"], .ie7 input[type="tel"] {text-indent:0 !important;}
.ie8 input[type="text"], .ie8 input[type="password"], .ie8 input[type="tel"] {padding:8px 0 5px;}
.ie9 input[type="file"], .ie10 input[type="file"], .ie11 input[type="file"] {padding:6px 0 7px; border:none;}


input:disabled, input:readonly {background:#f1f1f1;}
input[readonly="readonly"], input[readonly],
input[disabled="disabled"], input[disabled] {border:0 !important; background-color:transparent; color:#555; text-indent:0 !important;}
select[disabled] {border:1px solid #e5e5e5; background:#f1f1f1;}

input[type="text"],
input[type="password"] {   
   line-height: normal;  /* line-height 초기화 */
   padding: .7em .5em;  /* 여백 설정 */
   border:1px solid #ddd; 
   border-radius: 0;  /* iSO 둥근모서리 제거 */ 
   outline-style: none;  /* 포커스시 발생하는 효과 제거를 원한다면 */ 
   -webkit-appearance:none;/* 브라우저별 기본 스타일링 제거 */
   -moz-appearance: none;
   appearance: none;
   box-sizing: border-box; /*padding, border 값에 영향받지 않고 width, height 설정이 가능하다*/
}

select{
  /* width: 200px; 원하는 너비설정 */
  /* padding: .6em .5em; 여백으로 높이 설정 */
  font-family: inherit;  /* 폰트 상속 */
  border:1px solid #999; 
  border-radius: 0px; /* iOS 둥근모서리 제거 */
  /* -webkit-appearance: none; */ /* 네이티브 외형 감추기 */
  /* -moz-appearance: none;
  appearance: none; */
  box-sizing: border-box; /*padding, border 값에 영향받지 않고 width, height 설정이 가능하다*/
  /*ie8이하에서 적용이 불가능하므로 아래와 같이 적용 필요*/
  -webkit-box-sizing:border-box; 
  -moz-box-sizing:border-box;
}

.frm_input {
    display:inline-block;
    height:30px;
    position:relative;
    border:1px solid #ddd !important;    
    padding:0 !important;
    background-color:#fff;
    font-size:12px;
    color:#555;
    vertical-align:middle;
}
.frm_input {transition:all 0.3s ease;background-color:#fff}
.frm_input.grid_100 {width:100%;}
.frm_input.grid_90 {width:90%;}
.frm_input.grid_85 {width:85%;}
.frm_input.grid_80 {width:80%;}
.frm_input.grid_70 {width:70%;}
.frm_input.grid_50 {width:50%;}
.frm_input.grid_48 {width:48%;}
.frm_input.grid_47 {width:47%;}
.frm_input.grid_40 {width:40%;}
.frm_input.grid_30 {width:30%;}
.frm_input.w223 {width:100%;max-width:223px}
.frm_input.w228 {width:100%;max-width:228px}
.frm_input.w200 {width:200px}
.frm_input.w150 {width:150px}
.frm_input.w100 {width:100px}
.frm_input.w500 {width:100%;max-width:500px}
.frm_input.w50 {width:50px}
.frm_input.w60 {width:60px}
.frm_input,
select.frm_input {
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    appearance: none;
    outline: none;    
}
select.frm_input {padding-right:20px !important}
.frm_input::-ms-expand,
select.frm_input::-ms-expand{display:none;}
select.frm_input {background:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAyMy4wLjEsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0i6rKp66asX+uqqOuTnCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4Ig0KCSB5PSIwcHgiIHZpZXdCb3g9IjAgMCA3LjYyIDQuNDUiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDcuNjIgNC40NTsiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPHN0eWxlIHR5cGU9InRleHQvY3NzIj4NCgkuc3Qwe2ZpbGw6Izk5OTk5OTt9DQo8L3N0eWxlPg0KPHBvbHlnb24gY2xhc3M9InN0MCIgcG9pbnRzPSIwLjY0LDAgMCwwLjY0IDMuODEsNC40NSA3LjYyLDAuNjQgNi45OCwwIDMuODEsMy4xNyAiLz4NCjwvc3ZnPg0K) no-repeat 95% 50% #fff;background-size:11px 11px;padding-left:11.6px;font-size:12px;color:#555}
.frm_input:focus {border-color:rgba(74,101,246,1) !important;}
.frm_input:hover {border-color:rgba(74,101,246,1) !important;}
@media screen and (max-width:720px) {
    .frm_input::placeholder {font-size:0.6rem;}
    .frm_input::-webkit-placeholder {font-size:0.6rem;}
    .frm_input::-ms-placeholder {font-size:0.6rem;}
    .frm_input::-moz-placeholder {font-size:0.6rem;}
}


#skipNavi {height:0;}
#skipNavi .skipLink {position:absolute;top:-1000px;left:-1000px;overflow:hidden;z-index:5000;}
#skipNavi .skipLink:focus, #skipNavi .skipLink:active {top:0;left:0;padding:10px 20px;background:#1e64ba;color:#fff;}

/* Slider */
/* slick Slider */

/*.slick-slider { position: relative; display: block; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; } */
.slick-slider { position: relative; display: block; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none; -ms-touch-action: auto !important; touch-action: auto !important; -webkit-tap-highlight-color: transparent; }
.slick-list { position: relative; display: block; overflow: hidden; margin: 0; padding: 0; }
.slick-list:focus { outline: none; }
.slick-list.dragging { cursor: pointer; cursor: hand; }
.slick-slider .slick-track,
.slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
.slick-track { position: relative; top: 0; left: 0; display: block; }
.slick-track:before,
.slick-track:after { display: table; content: ''; }
.slick-track:after { clear: both; }
.slick-loading .slick-track { visibility: hidden; }
.slick-slide { display: none; float: left; height: 100%; min-height: 1px; }
[dir='rtl'] .slick-slide { float: right; }
.slick-slide img { display: block; }
.slick-slide.slick-loading img { display: none; }
.slick-slide.dragging img { pointer-events: none; }
.slick-initialized .slick-slide { display: block; }
.slick-loading .slick-slide { visibility: hidden; }
.slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; }
.slick-arrow.slick-hidden { display: none; }
.slider { opacity:0; -webkit-transition:opacity 0.3s; transition:opacity 0.3s; }
.slider:after { content:""; display:block; clear:both; }
.slider.slick-initialized { opacity:1; }
.slider > .item:not(:first-of-type) { position:absolute; opacity:0; }
.slick-prev,
.slick-next{font-size:0; line-height:0; position:absolute; top:45%; display:block; width:27px; height:44px; padding:0; cursor:pointer; z-index:10; background-repeat:no-repeat;
    -webkit-transform:translate(0, -45%);
    -ms-transform:translate(0, -45%);
    transform:translate(0, -45%);
}
.slick-prev{left:25px; right:auto;}
.slick-next{left:auto; right:25px;}
.slick-dots{display:block; position:absolute; bottom:30px; width:100%; margin:0; padding:0; text-align:center;}
.slick-dots li{display:inline-block; position:relative; margin:0 5px; padding:0; cursor:pointer;}
.slick-dots li button{display:block; padding:5px; font-size:0; line-height:0; cursor:pointer; border:0; outline:none; opacity:0.75;}
.slick-dots li.slick-active button{opacity:1;}

.animate-box {
    opacity: .0;
}