@charset "utf-8";

/*=================모바일 및 기본 세팅===================*/
html,body{  position:relative; overflow-x:hidden }
html.open,body.open{ overflow: hidden; }
#skip{ display:block; margin:0; padding:0; z-index:2000}
#skip a {display:block; font-size:1em; left:0; text-align:center; top:-10000px; position:absolute; width:100%; z-index:500;}
#skip a:hover, #skip a:focus, #skip a:active {background:#006dd8; color:#fff; font-weight:bold; height:40px; padding:10px 0; position:absolute; top:0; z-index:9000; }

.sprite{ background-image:url("/home/caeng/images/common/icon_sprite.png"); background-repeat: no-repeat; }

#header_area{ position:fixed; top:0; width:100%; padding:10px 15px; background:#fff; z-index:3000 }
#header_area .goog-te-gadget-simple{ border:0; background:none; padding:0; }
#header_area .goog-te-gadget-simple .goog-te-menu-value{ color:#fff; }
#header_area .goog-te-gadget-simple .goog-te-menu-value span{ border-left:0 !important; margin-left:5px; color:#fff !important }
#header_area .goog-te-gadget img{ display:none }

.tnb_wrap{ display:none; }

.m_gnb_wrap .m_gnb{ position:fixed; left:-200%; top:0; bottom:0; width:300px; z-index: 200;  transition:0.3s all }
.m_gnb_wrap .m_gnb{ padding-top:70px; background:#fff url(/home/caeng/images/common/logo.png) 15px 10px no-repeat; background-size:150px; }
.m_gnb_wrap .m_gnb.open{ left:0; transition:0.3s all}
.m_gnb_wrap .m_menu{ position: absolute; top:15px; right:15px; font-size:30px;  }
.m_gnb_wrap .m_close{ position:absolute; right:-35px; top:15px; font-size:30px; color:#fff; }
.m_gnb_wrap .m_top_menu ul{ display:table; width:100%; background:#288dfe;  }
.m_gnb_wrap .m_top_menu > ul > li{ position:relative; display:table-cell; border-right:#3e98fc solid 1px;  text-align: center; }
.m_gnb_wrap .m_top_menu > ul > li > a{ display:block; font-size:14px; padding:15px 0;  color:#fff; }
.m_gnb_wrap .m_top_menu > ul > li > a[target="_blank"]:after{display:none;}

.m_gnb_wrap .m_top_menu a:last-child{ border-right:0; }
.m_gnb_wrap .m_gnb > ul{ padding:20px; overflow-y: auto }
.m_gnb_wrap .m_gnb > ul > li{ position:relative; border-bottom:#e1e1e1 solid 1px; }
.m_gnb_wrap .m_gnb > ul > li:first-child{ position:relative; border-top:#e1e1e1 solid 1px; }
.m_gnb_wrap .m_gnb > ul > li:after{ position:absolute; right:15px; top:12px; display:inline-block; content:"\f054"; font-family: "Font Awesome 5 Pro"; font-weight:500; transition: 0.3s all; }
.m_gnb_wrap .m_gnb > ul > li.open:after{ transform: rotate(90deg); transition: 0.3s all; }
.m_gnb_wrap .m_gnb > ul > li > a{ display:block;  padding:12px 10px;  font-size:16px;  font-weight:500;  }
.m_gnb_wrap .m_gnb > ul > li > ul{ display:none;  border-top:#eee solid 1px;}
.m_gnb_wrap .m_gnb > ul > li > ul > li{ position:relative; border-bottom:#eee solid 1px; font-size:16px; }
.m_gnb_wrap .m_gnb > ul > li > ul > li.has_sub:after{ position:absolute; right:12px; top:10px; display:inline-block; content:"\f0fe"; font-family: "Font Awesome 5 Pro"; font-weight:300; transition: 0.3s all; }
.m_gnb_wrap .m_gnb > ul > li > ul > li.has_sub.open:after{ content:"\f146"; transition: 0.3s all; }
.m_gnb_wrap .m_gnb > ul > li > ul > li:last-child{ border-bottom:0; }
.m_gnb_wrap .m_gnb > ul > li > ul > li > a{ display:block; padding:10px 15px;  }
.m_gnb_wrap .m_gnb > ul > li > ul > li > ul{ display:none; padding:10px 0; background:#eee; }
.m_gnb_wrap .m_gnb > ul > li > ul > li > ul > li > a{ display:block; padding:5px 20px; font-size:14px;  }
.m_gnb_wrap .drawer{ position:fixed; left:0; right:0; top:0; bottom:0; background:rgba(0,0,0,0.6); visibility: hidden; z-index: 100}
.m_gnb_wrap .drawer.open{ visibility: visible; transition:1s all; }

.gnb_wrap .gnb{ display:none; }
.gnb_wrap .logo{ width:150px; }
.gnb_wrap .logo a{ display:block; line-height: 0}
.gnb_wrap .logo a img{ width:100%; }

.sch_box{ position:absolute; right:50px; top:64px; left:0; right:0;   z-index: 100}
.sch_box .container{ position:relative; text-align: center;}
.sch_box > a{ position:absolute; top:-49px; right:46px; display:inline-block; font-size:20px; padding:5px 10px;  }
.sch_block{ display:none; position:absolute; top:0; left:0; right:0; padding:20px 0; background:#f1f1f1;}
.sch_block .sch_text{ border:0; height:40px; width:45%; padding:0 10px; vertical-align: middle; }
.sch_block .sch_btn{ font-size:18px; background:#f1f1f1; height:40px; padding:0 10px; border:0; vertical-align: middle; cursor:pointer }
.sch_block .sch_close{ display:block; position:absolute; right:15px; top:50%; transform: translateY(-55%); padding:5px; font-size:25px; font-weight:500; }

#footer_area{ position:relative; background:#1d1d1d;  z-index:3000}
#footer_area .bottom_menu{  background:#2e2e2e; width:100%; }
#footer_area .bottom_menu .container{ display:flex; flex-flow: wrap; flex-direction: row;}
#footer_area .menu_list{ display:flex; flex-wrap: wrap; width: 100%;}
#footer_area .menu_list li{ width:50%; border-right:#999 solid 1px;  border-bottom:#999 solid 1px;font-size:14px; text-align: center; }
#footer_area .menu_list li:nth-child(2n){ border-right:0; }
#footer_area .menu_list li a{ display:block; color:#959595; padding:10px 5px;  }

#footer_area .site_link_wrap{ position:relative;  width:50%; }
#footer_area .site_link_wrap:nth-child(2){ border-right:#999 solid 1px; }
#footer_area .site_link_wrap > a{ position:relative; display:block; padding:15px 10px; background:#393939; color:#fff; }
#footer_area .site_link_wrap > a:after{ position:absolute; right:10px; top:50%; transform: translateY(-50%); display:block; content:"\f067"; font-family: "Font Awesome 5 Pro"; font-weight:500; }
#footer_area .site_link_wrap > a.active:after{ content:"\f068"}
#footer_area .site_link_wrap .site_link{ display:none; position:absolute; bottom:46px; background:#393939; width:100%; right:0; overflow:hidden; max-height: 250px; overflow-y: auto;}
#footer_area .site_link_wrap .site_link li{float:left; width:100%;}
#footer_area .site_link_wrap .site_link li a{ display:block; padding:10px 15px; color:#fff; font-size:14px;  }

#footer_area .copyright{ padding:20px; }
#footer_area .copyright h1{ width:180px; margin:0 auto 20px; }
#footer_area .copyright h1 img{ width:100%; }
#footer_area .copyright p{ text-align: center; margin-bottom:10px; color:#fff; opacity: 0.4; font-size:14px; line-height: 1.3}

/*===============서브영역 시작==============*/
.sub_visual_area{ display:flex; align-items: center; justify-content: center; margin-top:65px; background-image:url(/home/caeng/images/sub/bg_subvisual01.jpg); background-position:center; background-repeat:no-repeat;  background-size:cover; min-height:100px; }
.sub_visual_area p{ font-family:'NanumSquare';  color:#fff; font-size:22px; }
.sub_visual_area p span{ font-weight:bold;  }

#content_area{padding:0 15px;  }

.left_menu{ display:none; }

.content_top{ position:relative; padding:20px 0; border-bottom:#ccc solid 1px; }
.content_top h3{ color:#232323; margin-bottom:10px; font-size:22px;  }
.breadcrumb li{ position:relative; display:inline-block; font-size:14px; margin-right:15px;  }
.breadcrumb li a{ display:block; line-height: 1.3 }
.breadcrumb li:after{ display:inline-block; position:absolute; right:-13px; top:50%; transform: translateY(-50%); content:"\f054"; font-family: "Font Awesome 5 Pro"}
.breadcrumb li:last-child a{ font-weight:bold }
.breadcrumb li:last-child:after{ display:none; }

.content{ padding:20px; }

.share_box{ position:absolute; right:0; top:20px;  display:flex; }
.share_box > li > a{ display:flex; justify-content: center; align-items: center; border:#d4d4d4 solid 1px; width:40px; height:40px;  }
.share_box > li.print{ display:none; }
.share_box > li.print > a{ border-right:0; }
.sns_links_wrap{ display:none; position:fixed; width:100%; height:100%;  left:0; top:0; background:rgba(0,0,0,0.6); z-index: 6000 }
.sns_links_wrap .sub_sns_links{ display:block; position:absolute; width:80%; left:10%; right:10%; top:50%; transform:translateY(-50%); padding:20px 10px; border:#eee solid 1px;  background:#fff;  overflow:hidden; z-index: 200}
.sub_sns_links span{ display:block; text-align: center; margin-bottom:20px; font-size:18px;  font-weight:bold  }
.sub_sns_links ul{ text-align: center; }
.sub_sns_links ul li{ display:inline-block;  margin-right:3px; margin-bottom:3px;  }
.sub_sns_links ul li a{ display:block;  width:40px; height:40px; background-size:cover; background-position:center; background-repeat:no-repeat; text-indent: -9999px;  }
.sub_sns_links .sns01{ background-image:url("/home/caeng/images/sub/sns01_icon.png")}
.sub_sns_links .sns02{ background-image:url("/home/caeng/images/sub/sns02_icon.png")}
.sub_sns_links .sns03{ background-image:url("/home/caeng/images/sub/sns03_icon.png")}
.sub_sns_links .sns04{ background-image:url("/home/caeng/images/sub/sns04_icon.png")}
.sub_sns_links .sns05{ background-image:url("/home/caeng/images/sub/sns05_icon.png")}
.sub_sns_links .sns_close_btn{ position:absolute; right:20px; top:20px; font-size:20px; color:#2a2a2a }

/*===============서브영역 끝==============*/

/*==================
사이즈별 추가코드
==================*/

/*smartphones ( portrait )*/
@media all and (max-width:320px) {

}

/*smartphones ( landscape )*/
@media all and (min-width:321px) and (max-width:360px) {

}

/*smartphones ( landscape )*/
@media all and (min-width:361px) and (max-width:375px) {

}

/*smartphones ( landscape )*/
@media all and (min-width:376px) and (max-width:414px) {

}

/*smartphones ( landscape )*/
@media all and (min-width:415px) and (max-width:480px) {

}

/*tablet( portrait )*/
@media all and (min-width:640px) {



}
@media all and (min-width:641px) and (max-width:767px) {

}

/*=================
태블릿 기본 세팅
===================*/
@media all and (min-width:768px) {

  .container{ position:relative; max-width:760px !important; margin:0 auto; }

  .gnb_wrap .sch_box{ top:10px; right:35px; }

  #footer_area .menu_list{ width:100%; }
  #footer_area .menu_list li{ width:50%;}
  #footer_area .menu_list li:nth-child(2n){ border-right:#999 solid 1px}
  #footer_area .menu_list li:nth-child(4n){ border-right:0 }


  .sub_visual_area{ height:200px;  }
  .sub_visual_area p{ font-size:30px; }

}

@media all and (min-width:769px) and (max-width:1023px) {

}
/*=================
데스크탑 기본 세팅
===================*/
@media all and ( min-width:1024px){

  .container{ position:relative; max-width:1000px !important; margin:0 auto; }

  #header_area{ padding:0;   }
  .tnb_wrap{ display:block; background:#043078; }
  .tnb_wrap .container{ display:flex; justify-content: space-between;  }

  .link_list > li{ position:relative; float:left; font-size:14px;  border-right:#1d4484 solid 1px; }
  .link_list > li > a{ display:block; padding:10px 15px; color:#fff; }
  .link_list > li:hover > a{ background:#005fcb; transition:0.3s }
  .link_list > li > ul{ display:none; position:absolute; top:35px; left:0; width:100%; padding:10px 0; background:#005fcb;   z-index:1000}
  .link_list > li > ul > li > a{ display:block; padding:5px 10px; color:#fff; line-height: 1.2}
	.link_list > li > ul > li > a[target="_blank"]:after{display:none;}

  .tnb_list li{ float:left; font-size:14px; border-right:#1d4484 solid 1px; }
  .tnb_list li:first-child{ border-left:#1d4484 solid 1px;}
  .tnb_list li > a{ display:block; padding:10px 15px; color:#fff; }
  .tnb_list li > a:hover{ background:#005fcb; transition:0.3s }

  .m_gnb_wrap{ display:none; }

  .gnb_wrap{ padding:25px 0 0; background:#fff; }
  .gnb_wrap:after{ display:block; clear: both; content:"" }
  .gnb_wrap .logo{ float:left; width:178px; }
  .gnb_wrap .gnb{display:block;float:left;margin-left: 51px;}
  .gnb > ul > li{ position:relative; font-family:'NanumSquare'; font-size:22px;  font-weight:500;  float:left;  }
  .gnb > ul > li > a{ position:relative; display:block; padding:18px 10px 35px; }
  .gnb > ul > li > a:after{  display:block;  position:absolute; left:0; bottom:0; width:1px;  content:""; transition:0.3s }
  .gnb > ul > li:hover > a:after{ left:0; width:100%; background:#1580f9; height:3px;  transition:0.3s }
  .gnb > ul > li:hover > a{ color:#288dfe; }
  .gnb > ul > li > ul{ display:none; position:absolute; left:0; top:75px; right:0; height:220px;  padding:20px 0; z-index: 100 }
  .gnb > ul > li:hover > ul{ background:#f1f3ff; }
  .gnb > ul > li > ul > li{ font-size:14px; font-weight:500;  }
  .gnb > ul > li > ul > li > a{ display:block; padding:8px 10px; line-height: 1.2; word-break: keep-all;}
  .gnb > ul > li > ul > li > a:hover{ color:#288dfe; }
  .gnb_drawer{ display:none; position:absolute; top:135px;  left:0; right:0; height:220px; background:#fff;  border-top:#f1f1f1 solid 1px;   border-bottom:#f1f1f1 solid 1px;  z-index: 50}

  .sch_box{ top:115px; }
  .sch_box > a{ display:block; padding:10px 18px; right:0; }
  .sch_box .sch_block{ top:20px; }

  #footer_area .bottom_menu .container{ max-width:100% !important; width: 100%;}
  #footer_area .menu_list{ flex-flow: nowrap; justify-content: center;}
  #footer_area .menu_list li{ width:auto; border:0; }
  #footer_area .menu_list li:last-child{ width:auto; }
  #footer_area .menu_list li:nth-child(2n),#footer_area .menu_list li:nth-child(4n){ border:0; }
  #footer_area .menu_list li a{ font-size:16px; padding:22px 15px; font-weight:500; }
  #footer_area .copyright{ padding:30px 15px; }
  #footer_area .copyright h1{ float:left; margin-right:50px;  }
  #footer_area .copyright p{ text-align: left; }
  #footer_area .copyright p br{ display:none; }

  .sub_visual_area{  height:240px; margin-top:135px;  background-attachment: fixed; background-size:100% auto ; background-position:top center; }
  .sub_visual_area p{ font-size:40px; margin-bottom:60px; }

  #content_area .container{ position:relative; background:#fff; border-right:#d4d4d4 solid 1px; border-bottom:#d4d4d4 solid 1px; border-top-right-radius: 30px; margin:-60px auto 0 auto; margin-bottom:50px; }
  #content_area .container:after{ display:block; clear: both; content:""}
  #content_area aside{ position:absolute; width:21%; margin-top:-48px; height:calc(100% + 48px);}
  .left_menu{ display:block;  height:100%;}
  .left_menu h2{ display:flex; justify-content: center; align-items: center; height:220px; font-family:'NanumSquare'; font-size:30px; text-shadow: rgba(0,0,0,0.4) 1px 1px 2px; background:url(/home/caeng/images/sub/bg_lefttitle.jpg) center no-repeat; background-size:cover; color:#fff; border-top-left-radius: 20px; border-top-right-radius: 20px;  }
  .left_menu > ul{ border-left:#d4d4d4 solid 1px; border-right:#d4d4d4 solid 1px; height:calc(100% - 220px); padding:15px;  }
  .left_menu > ul > li{ position:relative; border-top:#c5cddd solid 1px; }
	.left_menu > ul > li:first-child{border-top:0;}
  .left_menu > ul > li > a{ position:relative; display:block; padding:15px 35px 15px 10px; background:#fff; word-break: keep-all; line-height: 1.2}
  .left_menu > ul > li a:after{ display:inline-block; position:absolute; right:10px; top:50%; transform: translateY(-50%); font-family: "Font Awesome 5 Pro"}
  .left_menu > ul > li.has_sub > a:after{ content:"\f078"; }
  .left_menu > ul > li.has_sub.open > a:after{ content:"\f077"}
  .left_menu > ul > li > ul{ display:none; background:#f5fbff; padding:10px 15px; border-top:#c5cddd solid 1px;  }
  .left_menu > ul > li > ul > li{ font-size:14px; }
  .left_menu > ul > li > ul > li > a{ display:block; padding:10px 0; line-height: 1.3; word-break: keep-all;}
  .left_menu > ul > li > ul > li > a:hover{ font-weight:bold; color:#091562;  }

  .content{min-height:870px; padding:20px 0;}
  .content_wrap{ float:right; width:75%; margin-right:25px; }
  .content_top{  padding:30px 0;  overflow:hidden }
  .content_top h3{ float:left; font-size:30px; margin-bottom:0; }
  .content_top .breadcrumb{ float: right; margin-right:100px; margin-top:10px; }

  .share_box{ right:20px; }
  .share_box > li.print{ display:block; }
  .sns_links_wrap .sub_sns_links{ width:480px; left:50%; transform: translateX(-50%) translateY(-50%);  padding:30px; }
  .sub_sns_links span{ font-size:24px; margin-bottom:30px;  }
  .sub_sns_links ul li{ margin:0 5px; }
  .sub_sns_links ul li a{ width:60px; height:60px; }
  .sub_sns_links .copy_addr{ margin-top:20px; }
  .sub_sns_links .copy_addr .copy_addr_txt{ width:80%; }
  .sub_sns_links .copy_addr .copy_btn{ width:15%; cursor: pointer}
  .sub_sns_links .sns_close_btn{ font-size:30px; right:20px; top:20px; }

}

@media all and ( min-width:1440px){

  .container{ max-width:1400px !important }


  .gnb_wrap .gnb{ margin-left:130px; }
  .gnb > ul > li > a{ padding:18px 30px 35px; }

  .sch_box > a{ right:50%; margin-right:-700px;  }
  .sch_box .sch_block{ width:100%; padding:30px 0; }
  .sch_box .sch_block .sch_close{ font-size:30px; }
  .sch_box .sch_text{ width:400px; background-color:transparent; border-bottom:#ddd solid 1px; border-radius: 0; font-size:16px;}


  #footer_area .bottom_menu .container{ max-width:1400px !important;  flex-flow:nowrap; justify-content: space-between;}
  #footer_area .menu_list{ justify-content: flex-start; }
  #footer_area .site_link_wrap{ width:250px; }
  #footer_area .site_link_wrap > a{ padding:22px 30px; }
  #footer_area .site_link_wrap > a:after{ right:25px; }
  #footer_area .site_link_wrap .site_link{ bottom:60px; right:0;}
  #footer_area .copyright{ padding:48px 0; }


  .sub_visual_area{  height:330px;}
  #content_area aside{ width:300px; }
  .left_menu h2{ font-size:45px; border-top-left-radius: 20px; border-top-right-radius: 20px; }
  .left_menu > ul{ padding:20px; }
  .left_menu > ul > li{ font-size:20px; font-weight:500; }
  .left_menu > ul > li > ul > li{ font-size:18px; font-weight:300;  }

 .content_wrap{ width:1040px; }
  .content_top{ padding:50px 0; }
  .content_top h3{ font-size:40px; }

  .content_top .breadcrumb{ margin-right:130px; }
  .content_top .breadcrumb li{ font-size:16px;  }
  .share_box{ top:50px;  }

}
@media all and ( min-width:1600px){


}
@media all and ( min-width:1900px){


}

/* 팝업 */
.link_popup_comm {
    display: block;
}
.link_popup_comm img {
    display: block;
    width: 100%;
}
.popup_foot_comm {
    display: flex;
    align-items: center;
    height: calc(var(--popup-comm-foot-size) - 1px);
    padding: 0 20px;
    background: #2b3030;
}
.popup_foot_comm label {
    display: flex;
    align-items: center;
    gap: 5px;
    margin-right: auto;
    font-size: 16px;
    line-height: 0px;
    color: #fff;
    cursor: pointer;
}
.popup_foot_comm input {
    width: 18px;
    height: 18px;
}
.popup_foot_comm .popup_close {
    padding: 10px;
    margin-right: -10px;
    font-size: 16px;
    line-height: 20px;
    color: #fff;
}