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

/* 초기화 */
*{ box-sizing: border-box;}
html {overflow-y:scroll;overflow-x:hidden}
body {margin:0;padding:0; font-size:15px; letter-spacing:-0.5px; line-height:1.3; font-family: 'Pretendard', sans-serif, '돋움'; font-weight: 400; word-break: keep-all; word-wrap:break-word; overflow-x: hidden;}
html, h1, h2, h3, h4, h5, h6, form, fieldset, img {margin:0;padding:0;border:0}
h1, h2, h3, h4, h5, h6 { font-size:1rem; line-height: 1;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block}
ol, ul, li, dd, dl, dt{list-style:none; padding:0; margin:0;}
#hd ul, nav ul, #ft ul {margin:0;padding:0;list-style:none}
legend {position:absolute;margin:0;padding:0;font-size:0;line-height:0;text-indent:-9999rem;overflow:hidden}
label, input, button, select, img {vertical-align:middle}
input, button {margin:0;padding:0;font-size:1em}
button {cursor:pointer}
input[type=checkbox], input[type=radio]{ margin:0;}
textarea, select { font-size:1rem}
select {margin:0}
p {margin:0;padding:0;word-break:keep-all}
hr {display:none}
pre {overflow-x:scroll;font-size:1rem}
a:link, a:visited {color:#565656;text-decoration:none}
a:hover, a:focus, a:active {color:#000;text-decoration:none;}
@media screen and (max-width:1023px) {
  html { background-color: #f7f7f7;}
  body{ max-width: 768px; border-left: 1px solid #ddd; border-right: 1px solid #ddd; margin: 0 auto;}
}
@media screen and (max-width:767px) {
  body{ max-width: 100%; border-left: 0; border-right: 0;}
}


/* 텍스트 크기 조절 */
#text_size {float:left;margin:0 0 0 10px;letter-spacing:-3px}
#text_size button {margin:0;padding:1px 2px;border:1px solid #c3c6ca;background:transparent;vertical-align:middle;cursor:pointer}
.ts_up {font-size:1.167em !important}
.ts_up2 {font-size:1.3em !important}
/* 화면낭독기 사용자용 */
#hd_login_msg {position:absolute;top:0;left:0;font-size:0;line-height:0;overflow:hidden}
.msg_sound_only, .sound_only {display:inline-block !important;position:absolute;top:0;left:0;margin:0 !important;padding:0 !important;font-size:0;line-height:0;border:0 !important;overflow:hidden !important}
/* 본문 바로가기 */
#skip_to_container a {z-index:100000;position:absolute;top:0;left:0;width:1px;height:1px;font-size:0;line-height:0;overflow:hidden}
#skip_to_container a:focus, #skip_to_container a:active {width:100%;height:75px;background:#21272e;color:#fff;font-size:2em;font-weight:bold;text-align:center;text-decoration:none;line-height:3.3em}
/* ie6 이미지 너비 지정 */
.img_fix {width:100%;height:auto}
/* 자바스크립트 alert 대안 */
#validation_check {margin:100px auto;width:500px}
#validation_check h1 {margin-bottom:20px;font-size:1.3em}
#validation_check p {margin-bottom:20px;padding:30px 20px;border:1px solid #e9e9e9;background:#fff}
/* 사이드뷰 */
.sv_wrap {display:inline-block;position:relative;font-weight:normal}
.sv_wrap .sv {z-index:1000;display:none;margin:5px 0 0;border:1px solid #283646}
.sv_wrap .sv a {display:inline-block;margin:0;padding:3px;width:94px;border-bottom:1px solid #283646;background:#111;color:#fff !important}
.sv_wrap a:focus, .sv_wrap a:hover, .sv_wrap a:active {text-decoration:none}
.sv_on {display:block !important;position:absolute;top:10px;left:20px;width:auto;height:auto}
.sv_nojs .sv {display:block}
/* Mobile화면으로 */
#device_change {display:block;margin:0.3em;padding:0.5em 0;border:1px solid #eee;border-radius:2em;background:#fff;color:#000;font-size:2em;text-decoration:none;text-align:center}
/*메일인증*/
.rg_em{margin-top:5px}
.rg_em caption{padding:0;font-size:0;line-height:0;overflow:hidden}

/*************** 팝업레이어 ***************/
#hd_pop {z-index:1002;position:relative;margin:0 auto;width:970px;height:0}
#hd_pop h2 {position:absolute;font-size:0;line-height:0;overflow:hidden}
.hd_pops {position:absolute;background:#fff; box-shadow:0 0 3px #333}
.hd_pops_con br{ display: none !important;}
.hd_pops_footer { padding:10px 0;background:#000;color:#fff;text-align:right}
.hd_pops_footer button {margin-right:5px;padding:5px 10px;border:0;background:#393939;color:#fff;font-size: 12px;}
@media screen and (max-width:1279px) {
  .hd_pops { top:140px !important; left:5% !important;}
  #hd_pops_2{ left:15% !important;}
  #hd_pops_3{ left:25% !important;}
  #hd_pops_4{ left:35% !important;}
  #hd_pops_5{ left:45% !important;}
  #hd_pops_6{ left:55% !important;}
  #hd_pops_7{ left:65% !important;}
  #hd_pops_8{ left:75% !important;}
  #hd_pops_9{ left:85% !important;}
  #hd_pops_10{ left:95% !important;}
}
@media screen and (max-width:1023px) {
  #hd_pop { width:50% !important;}
  #hd_pop img{ max-width:100%}
  .hd_pops { width:100% !important; top:0px !important; left:50% !important; transform: translateX(-50%) !important;}
  #hd_pops_2{ left:50% !important; transform: translateX(-50%) !important;}
  #hd_pops_3{ left:50% !important; transform: translateX(-50%) !important;}
  #hd_pops_4{ left:50% !important; transform: translateX(-50%) !important;}
  #hd_pops_5{ left:50% !important; transform: translateX(-50%) !important;}
  #hd_pops_6{ left:50% !important; transform: translateX(-50%) !important;}
  #hd_pops_7{ left:50% !important; transform: translateX(-50%) !important;}
  #hd_pops_8{ left:50% !important; transform: translateX(-50%) !important;}
  #hd_pops_9{ left:50% !important; transform: translateX(-50%) !important;}
  #hd_pops_10{ left:50% !important; transform: translateX(-50%) !important;}
  .hd_pops img{ width:100% !important; height:100% !important}
  .hd_pops_con {width: 100% !important;height: 100% !important;}
  .hd_pops_footer { width:100% !important; padding:5px 0;}
}
@media screen and (max-width:767px) {
  #hd_pop { width:100% !important;}
  .hd_pops_footer button { padding:3px 5px; font-size: 10px;}
}


/*************** 레이아웃 ***************/

/*헤더*/
#hd { width:100%; background-color: #fff; border-bottom: 1px solid #eee; position:fixed; top:0; left:0; z-index:23 !important;}
.hd_zindex { z-index:999 !important}
#hd_h1 { position:absolute;font-size:0;line-height:0;overflow:hidden}
#hd_wrapper { zoom:1; width: 85%; margin: 0 auto; position: relative; padding: 10px 0; display: flex; justify-content: space-between; align-items: center;}
#hd_wrapper:after {display:block;visibility:hidden;clear:both;content:""}
#hd .top_tel a{ display: flex; justify-content: center; align-items: center;}
#hd .top_tel .tel_img{ width: 47px; height: 47px; border-radius: 50%; background-color: #6FA80A; text-align: center; line-height: 47px; margin-right: 10px;}
#hd .top_tel .tel_img img{ width: 20px;}
#hd .top_tel p{ font-size: 25px; font-weight: 700; color: #2a3630; line-height: 1.2;}
#hd .top_tel span{ display: block; font-weight: 400; font-size: 14px; color: #999;}

@media screen and (max-width: 1279px) {
  #hd_wrapper { width: 95%; flex-wrap: wrap; padding: 10px 0 0 0;}
  #hd #logo{ width:100%;}
  #hd #logo img{ width: 200px;}
  #hd .top_tel{ width: auto; position: absolute; top: 20px; right: 0;}
}
@media screen and (max-width: 1023px) {
  #hd_wrapper { display: block; width: 100%; padding: 10px 0;}
  #hd #logo{ text-align: center;}
  #hd #logo img{ width:150px;}
  #hd .top_tel{ top: 50%; right: auto; left: 2%; transform: translateY(-50%);}
  #hd .top_tel .tel_img{ width: 40px; height: 40px; line-height: 40px;}
  #hd .top_tel .tel_img img{ width: 15px;}
  #hd .top_tel p{ font-size: 23px;}
  #hd .top_tel span{ font-size: 12px; }
}
@media screen and (max-width: 767px) { 
  #hd #logo img{ width:130px;}
  #hd .top_tel a{ display: block;}
  #hd .top_tel p{ display: none;}
}


/* 메인메뉴 */
#gnb h2 { display:none;}
#gnb_1dul:after {display:block;visibility:hidden;clear:both;content:""}
#gnb .gnb_1dli {z-index:10;position:relative;display:inline-block;}
#gnb .gnb_1da { display:inline-block; padding:20px 20px; font-size:21px; font-weight: 600; color: #333; text-decoration:none; position:relative; z-index:5;}
#gnb .gnb_1da span{ display:none; /*width:0px; height:4px; position:absolute; left:50%; bottom:0px; background:#f9aa62; transform:translateX(-50%); transition:all 0s;*/}
#gnb .gnb_1dli:focus, #gnb .gnb_1dli:hover span{ width:80px; transition:all 0.5s;}
#gnb .gnb_1dli:focus, #gnb .gnb_1dli:hover { color:#111;}
#gnb .gnb_1dli{ position:relative;}

/*2차메뉴*/
#gnb .gnb_2dul {display:none; position:absolute; top:60px; left:50%; transform:translateX(-50%); width:170px; background-color: #6FA80A;  padding:20px 20px !important;  z-index: 23;}
#gnb .gnb_1dli:nth-of-type(4) .gnb_2dul { width: 240px;}
#gnb .gnb_1dli:nth-of-type(5) .gnb_2dul { width: 190px;}
#gnb .gnb_2dul .gnb_2dli:last-child{ border-bottom:none;}
/*2차메뉴*/
#gnb .gnb_2da {display:block; padding:3px 0px; text-align:left; text-decoration:none; color:#fff ; font-size: 17px;}
/*1차메뉴hover*/
#gnb .gnb_1dli:focus .gnb_1da, 
#gnb .gnb_1dli:hover .gnb_1da, 
#gnb .gnb_1dli.hov .gnb_1da{ text-decoration:none; color: #6FA80A;}
/*2차메뉴hover*/
#gnb .gnb_2da:focus, #gnb .gnb_2da:hover{ font-weight: 700;}
#gnb_empty {padding:10px 0;width:100%;text-align:center;line-height:2em}
#gnb_empty a {text-decoration:underline}
.mobile_open{ display: none;}
.mobile_close{ display: none;}
#mobile_menu{ display: none;}

/*작은 데스크탑 & 노트북: 1024px ~ 1279px */
@media screen and (max-width: 1279px) {
  #gnb{ width: 100%;}
  #gnb .gnb_1da { padding: 15px 20px; font-size: 19px;}
}
/*태블릿 : 768px ~ 1023px */
@media screen and (max-width: 1023px) {
  #gnb { display: none;}
  
  .mobile_open { display: block; width: 50px; height: 38px; padding: 10px 15px; position: fixed; right: 2%; top: 10px; z-index: 25; cursor: pointer; }
  .mobile_open.on{ display: none;}
  .mobile_open span{ display:block; width:33px; height:2px; background-color:#333; margin-bottom:6px;}
  .mobile_open span:nth-child(2){ width:28px; height:2px;}

  .mobile_close { display: block; width: 50px; height: 50px; position:absolute; top:2%; right:6%; cursor: pointer; z-index: 26;}
  .mobile_close span{ display: block; width: 50px; height: 1px; background-color: #444;}
  .mobile_close span:first-child{ transform: rotate(45deg); margin-top: 25px;}
  .mobile_close span:last-child{ transform: rotate(-45deg); margin-top: -1px;}

  #mobile_menu { display: block; width: 80%; height: 100%; position: fixed; top: 0px; right: -100%; z-index: 101; background-color: #fff;
    transition: All 0.6s ease;
    -webkit-transition: All 0.6s ease;
    -moz-transition: All 0.6s ease;
    -o-transition: All 0.6s ease;
  }
  #mobile_menu.open { right: 0px; }
  .page_cover.open { display: block; }

  /* #mobile_muenu 너비가 100%가 아닐때, 아래에 깔리는 배경 */
  .page_cover { width: 100%; height: 100%; position: fixed; top: 0px; left: 0px; background-color: rgba(0, 0, 0, 0.7); z-index: 25; display: none; }

  #mobile_menu .hash_scroll{ position:relative; height:100%; overflow-y:scroll;}
  #gnb2{ padding: 20% 7%;}
  #gnb2 li.mgnb_1dli{}
  #gnb2 li.mgnb_1dli a.mgnb_1da{ display:block; font-weight: 700; font-size:22px; letter-spacing: -1px; padding: 0 0 15px 0; cursor:pointer; color:#222!important;
  position: relative;}
  #gnb2 li.mgnb_1dli a.mgnb_1da span{ display: block; width: 11px; height: 3px; background-color: #6FA80A; transform: rotate(45deg); position: absolute; top: 17px; right: 20px;}
  #gnb2 li.mgnb_1dli a.mgnb_1da span:last-child{ transform: rotate(-45deg); right:14px;}

  #gnb2 li.mgnb_1dli a.mgnb_1da.on{border-bottom:0;}
  #gnb2 li.mgnb_1dli a.selected{color:#6FA80A; border-bottom:0;}		
  #gnb2 li.mgnb_1dli a.mgnb_1da .fa-angle-down{ font-size: 15px; padding-left: 20px;}  
  /*2차메뉴*/
  #gnb2 ul.mgnb_2dul{ display: none; text-align: left; padding: 15px 30px; margin-bottom: 20px; background-color: #f7f7f7;}
  #gnb2 li.mgnb_2dli a.mgnb_2da{ font-size:18px; line-height:1.8; color:rgba(0,0,0,.6); display:block;}
}
/*모바일 : 480px ~ 767px */
@media screen and (max-width: 767px) { 
  #mobile_menu { width: 90%;}
  #gnb2{ padding: 90px 7% 0 7%;}
  #gnb2 li.mgnb_1dli a.mgnb_1da span{ top: 13px;}
  #gnb2 ul.mgnb_2dul{padding: 15px 20px;}
}


/* 중간 레이아웃 */
#wrapper {z-index:5;margin:0 auto;width:100%; zoom:1; background:#fff;}
#wrapper:after {display:block;visibility:hidden;clear:both;content:""}
#aside {float:right;margin:0 0 0 -1px;width:210px;border-left:1px solid #dde4e9;background:#fff}
#container_index {position:relative;width:100%;height:auto !important;zoom:1;}
#container { width:100%; height:auto !important; zoom:1; position:relative; padding-top: 88px;}
#container:after {display:block;visibility:hidden;clear:both;content:""}
#scont_wrap{ width:100%;  min-height:800px; position: relative; background-color: #fff;}
#scont_wrap2{ width:100%; padding:0 0 50px 0; min-height:800px; background-color: #fff;}
#scont{ width:1200px; margin: 0 auto; padding: 100px 0;}
#scont2{ width:1200px; margin: 0 auto; padding: 100px 0;}

/*서브-타이틀부분*/
#sub_title{ position:relative; margin-bottom:80px; text-align: center;}
#sub_title .container_title { font-size:40px; color:#222; letter-spacing: -1px;position: relative;}
#sub_title .container_title::after{ display: block; content: ""; width:50px; height: 2px; background-color: #6FA80A; margin: 20px auto 0 auto; }

@media screen and (max-width: 1279px) {
  #container { padding-top: 129px;}
  #scont{ width:95%;}
  #scont2{ width:95%;}
}
@media screen and (max-width: 1023px) {
  #container { padding-top: 60px;}
  #scont_wrap{ min-height: 600px;}
  #scont_wrap2{ min-height: 600px;}
  #scont{ padding: 50px 0;}
  #scont2{ padding: 50px 0;}
  #sub_title{ margin-bottom:50px;}
  #sub_title .container_title { font-size:30px;}
}

@media screen and (max-width: 768px) {
  #container { padding-top: 55px;}
  #scont_wrap{ min-height: 400px;}
  #scont_wrap2{ min-height: 400px;}
  #scont{ padding: 30px 0;}
  #scont2{ padding: 30px 0;}
  #sub_title .container_title { font-size:28px;}
  #sub_title .container_title::after{ width:40px; margin: 15px auto 0 auto; }
}
	
/*푸터-카피라이터*/
#footer{ width:100%; height:auto; background-color:#f9f9f9; border-top: 1px solid #ddd; position: relative;}
#footer .footer_in{ width:1400px; height:auto; margin:0 auto; position: relative; padding: 50px 0 60px 0; display: flex;}
#footer .copy_logo{ margin-right: 100px;}
#footer address{ font-style: normal;}
#footer address p{ font-size: 16px; font-weight: 300; line-height: 1.8; color:#555;}
#footer address p span{ display:inline-block; margin-right:10px;}
#footer address p.co{ font-size:14px; font-weight: 500; color:#0D2042; letter-spacing: 0; margin-top:10px;}
#footer .adm{ position: absolute; bottom: 80px; right: 0px;}
#footer .adm a{ font-size: 13px; font-weight: 300; color: #999; display: inline-block; margin-left: 5px; background-color: #fff; border: 1px solid #ccc; 
  line-height: 30px; padding: 0 15px;}
#footer .adm a:hover{ font-weight: 500; color: #333;}
#footer .adm a.popup_adm{ background-color: #036DB7; border-color: #036DB7; color: #fff;}
#footer .adm a.popup_adm:hover{ color: #fff;}

@media screen and (max-width: 1279px) {
  #footer .footer_in{ width:100%; padding: 70px 3%;}
  #footer .copy_logo{ width: 150px;}
  #footer .copy_logo img{ width: 100%;}
  #footer .adm{ bottom: 60px;}
}
@media screen and (max-width: 1023px) {
  #footer .footer_in{ padding: 40px 3% 60px 3%;}
  #footer .copy_logo{ margin-right: 50px;}
  #footer address p{ font-size: 14px;}
  #footer address p.co{ font-size:12px;}
  #footer .adm{ display: none;}
}
@media screen and (max-width: 767px) { 
  #footer .footer_in{ display: block;}
  #footer .copy_logo{ width: 120px; margin-right: 0; margin-bottom: 20px;}
  #footer address p{ line-height: 1.5;}
}


/*브라우저 상하단이동버튼*/
#gobtn{position:fixed; display:block; right:20px; bottom:40px; display:none; z-index:1000;}
.goHd, .goFt{width:70px; height:70px; background:#fff; border: 1px solid #ddd; z-index:9999; text-indent:-9999px; position:relative;
	  transition:all 0.5s; box-shadow:0px 0px 5px RGBA(95, 95, 95, 0.2); display:block; margin-bottom:6px; border-radius: 50%;}
.goFt{ display: none;}
.goHd span{position:absolute; top:58%; left:30px; display:block; width:10px; height:10px; border-left:2px solid #333; border-top:2px solid #333; border-radius:0px;
    transform:translateY(-50%) rotate(45deg);}
.goFt span{position:absolute; top:44%; left:30px; display:block; width:10px; height:10px; border-left:2px solid #333; border-top:2px solid #333; border-radius:0px;
    transform:translateY(-50%) rotate(-135deg);}
.goHd:hover, .goFt:hover{ background:#6FA80A; border-color: #6FA80A;}
.goHd:hover span, .goFt:hover span{ border-color:#FFF;}
@media (max-width:1023px) {
  #gobtn{ right:10px; bottom:20px;}
  .goHd, .goFt{ width:50px; height:50px;}
  .goHd span{ top:56%; left:19px; width:10px; height:10px;}
}
@media (max-width:767px) {
  #gobtn{ right:5px; bottom:10px;}
  .goHd, .goFt{ width:40px; height:40px;}
  .goHd span{ top:55%; left:15px; width:8px; height:8px;}
}