@charset "utf-8";
/*layout.css에서 sub에만 별도 적용*/
#header h1.logo a {background-image:url('/data/intro_2021/img/intro/logo_2022.png');}
#navi .dept1 > li > a {text-shadow:none; color:#333;}
/*#header {top:0;}*/
#header .topMenu > ul > li:nth-of-type(2) {display:none;}
/*sub.css*/
.sub_container {position:relative; overflow:hidden; /*margin-top:85px;*/}

@media all and (max-width:1023px){
  .sub_container {margin-top:160px;}
  footer {margin-top:30px;}
}
.util {position:absolute; right:5%; top:8px; color:#fff; margin-top:12px;}
.util div {display:inline-block;}
.util a {display:inline-block; height:40px; line-height:40px; width:40px; margin-left:25px;}
.util a:last-child {}
.util a {position:relative; text-indent:-99999px;}
.util a::after {content:''; display:block; position:absolute; top:5px; left:5px; background:url('/Main/Images/new/ko/sub/iconUtil.png') no-repeat center; width:30px; height:30px;}
.util a.plus::after {background-position:-30px 0;}
.util a.minus::after {background-position:0 0;}
.util a.print::after {background-position:-60px 0;}
.util a.share::after {background-position:-90px 0;}
.util a.add_bold::after {background-position:-120px 0;}
.util .shareWrap {display:none; float:right; width:110px; border-left:1px solid rgba(255,255,255,.2); margin-left:30px;}
.util .shareWrap a {display:inline-block; margin-left:7px;}
.util .shareWrap a::after {content:''; position:absolute; background-image:url('/Main/Images/new/ko/layout/footer_sns_area.png'); background-repeat:no-repeat; width:40px; height:40px; display:block; top:0; left:0;}
.util .shareWrap a.faceBook::after {background-position:-80px 0;}
.util .shareWrap a.twitter::after {background-position:-160px 0;}
.util .shareWrap.on {display:block;}
.add2 {font-weight:600;}
@media all and (max-width:1720px){
  .util {right:2%}
  .util a {margin:0 5px;}
}
@media all and (max-width:1200px){
    .util {right:0%}
}
@media all and (max-width:1023px){
    .util {display:none; position:absolute; float:none; margin-top:0; top:30px; border-radius:20px; background:#f1f1f1; padding:5px 10px;}
    .util a {width:25px; height:25px; line-height:25px;}
    .util a::after {border-radius:50%; width:25px; height:25px; top:0; left:0; background:url('/Main/Images/new/ko/sub/iconUtil_b.png') no-repeat center;}
    .util .shareWrap {border-left:1px solid rgba(0,0,0,.2); margin-left:15px; width:85px;}
    .util .shareWrap a::after {background-image:url('/Main/Images/new/ko/common/sns_b.png'); width:30px; height:30px; top:-7.5px;}
    .util a.plus::after {background-position:-25px 0;}
    .util a.minus::after {background-position:0 0;}
    .util a.print::after {background-position:-50px 0;}
    .util a.share::after {background-position:-75px 0;}
	.util a.add_bold::after {background-position:-100px 0;}
}
@media all and (max-width:640px){
    /*.util {right:auto;}
    .util a {margin:0 3px 0 0;}
	*/
}
.pathWrap {position:relative; z-index: 20; min-height:55px;border-bottom:1px solid #dfe3e7; border-top:1px solid #dfe3e7;}
.pathM {display:none;}
.pathWrap .path > li { border-right:1px solid #dfe3e7; position:relative; float:left; box-sizing: border-box;}
.pathWrap .path > li > a::after {content:''; display:block; position: absolute; top:23px; right:20px; width:13px; height:10px; background:url('/Main/Images/new/ko/sub/arr03.png') no-repeat 85% center; transform: rotate(0deg);}
.pathWrap .path > li.on a::after  {transform: rotate(-180deg);}

.pathWrap .path > li:first-child {border-left:1px solid #dfe3e7; background:none;}
.pathWrap .path > li:first-child::after {display:none;}
.pathWrap .path > li:last-child > a span { font-weight:400;}
.pathWrap .path > li:nth-of-type(2) {padding:0 100px 0 40px; line-height:55px;}
.pathWrap .path > li > a {position:relative; display:block; padding:0 100px 0 40px; line-height:55px;}
.pathWrap .path > li > a > span {display:block; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; font-size:16px;}
.pathWrap .path .home a { text-indent:-99999px; background:url('/Main/Images/new/ko/sub/home.png') no-repeat center; width:55px; height:55px; padding:0;}
.pathWrap .path .home a::after {display:none;}
.pathWrap .path .dept2 { display:none; position:absolute; left:-1px; top:55px; width: calc(100% + 2px); border:1px solid #ccc; background:#fff; padding:10px;  z-index:50; /*box-shadow: 3px 3px 3px rgba(221,221,221,.8);*/ max-height:500px; overflow-y:auto; }
.pathWrap .path .dept2 li a { display:block; padding:10px 5px; border-bottom:1px solid #eee; }
.pathWrap .path .dept2 li a span {font-size:16px;}
.pathWrap .path .dept2 li a[target="_blank"] {background:url('/Main/Images/new/ko/common/blank.png') no-repeat 95% 18px; padding-right:25px;}
.pathWrap .path .dept2 li.on a,
.pathWrap .path .dept2 li a:hover {font-weight:600;}
.pathWrap .path .dept2 li:last-child a {border-bottom:0;}
@media all and (max-width:1023px){
	.pathWrap {border-bottom:none; min-height:auto; }
	.pathWrap .path {width:100% !important; display:block; /*height:40px; border-bottom:1px solid #ddd; */margin:0; margin-bottom:20px; position:relative;}
	.pathWrap .path::before {display:block; content:''; width:100%; height:1px; background:#ddd; top:39px; position:absolute;}
	.pathWrap .path > li {width:25%; line-height:40px; height:40px; border-bottom:1px solid #ddd;}
	.pathWrap .path > li > a::after {top:15px;}
	.pathWrap .path > li:first-child {display:none;}
	.pathWrap .path > li:nth-of-type(2) {display:none;}
	.pathWrap .path .dept2 {top:40px;}
	.pathWrap .path > li > a {/*width:90%; padding:0 5%;*/ width:100%; font-size:16px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding:0 30px 0 10px;}
	.pathWrap .path > li > a {line-height:40px;}
	.pathWrap .path .dept2 li a {font-size:15px; padding:5px 0;}
	.pathWrap .path .dept2 li a[target="_blank"] {background-position:95% 19px;}
	.pathM {/*display:block;*/}
	.pathM li {display:inline; background:url('/Main/Images/new/ko/sub/arr02.png') no-repeat 2px 8px; padding-left:10px;}
	.pathM li a {display:inline-block;font-size:15px;}
	.pathM li:first-child {background:url('/Main/Images/new/ko/sub/home.png') no-repeat left center; background-size:12px; padding-left:15px;}
	.pathM li:first-child a {position:relative; text-indent:-9999px;}
	.pathM li:last-child a {font-weight:500;}
}
@media all and (max-width:768px){
	.pathWrap .path {}
	.pathWrap .path > li {width:50%; }
  /*
	.pathWrap .path > li:last-child a,
    .pathWrap .path > li:nth-last-of-type(2) a {border-bottom:1px solid #ddd;}*/
 }
 @media all and (max-width:360px){
	.pathWrap .path > li {width:100%; }
 }
/*
@media all and (max-width:768px){
  .pathWrap {float:left; width:100%; min-height:50px; margin-bottom:20px;}
  .pathWrap .path {position:relative; width:100% !important; margin:0;}
  .pathWrap .path::before {content:''; display:block; position:absolute; top:50px; width:100%; height:1px; background:#ddd;}
  .pathWrap .path > li {width:50%;}
  .pathWrap .path > li > a {line-height:50px;}
  .pathWrap .path .dept2 {top:50px;}
}
@media all and (max-width:640px){
  .pathWrap {border-bottom:none;}
}
*/
.sub_container .cont {width:100%; clear:both; text-align:center; margin-top:30px; font-size:18px;}
.cont_tit {font-size:40px; font-weight:600; margin-bottom:35px;}
@media all and (max-width:1023px){
  .sub_container .cont {margin-top:0px;}
  .cont_tit {font-size:28px; margin-bottom:0px; text-align:left; /*border-bottom:1px solid #878787;*/ padding-bottom:10px; padding-top:10px;}
}
@media all and (max-width:640px){
  .cont_tit {padding-top:10px;margin-left:10px; border:none;}
}
/*탭1단계*/
.page_tab {width:100%; overflow:hidden; position:relative; margin-bottom:50px;}
.page_tab::before {content:''; display:block; position:absolute; left:0; bottom:5px; width:100%; border-bottom:1px dashed #d9d9d9;}
.page_tab ul {}
.page_tab ul li {display:inline-block; margin:0 15px; padding:5px;}
.page_tab ul li a {position:relative; padding:15px; display:block; font-size:22px; color:#898989; font-weight:600;}
.page_tab ul li a.on,
.page_tab ul li a:hover {color:#333;}
.page_tab ul li a.on::before,
.page_tab ul li a:hover::before {content:''; display:block; position:absolute; left:0; bottom:0; width:100%; height:4px; background:rgb(187,23,105); z-index:-1;}
@media all and (max-width:1023px){
  .page_tab  {border-bottom:1px solid #ddd; padding:0 2% 13px; margin-bottom:10px;}
  .page_tab::before {display:none;}
  .page_tab ul li {margin:0 3% 5px 0; float:left;}
  .page_tab ul li a {font-size:18px; padding:0;}
  .page_tab ul li a.on::before,
  .page_tab ul li a:hover::before {height:10px; background:rgba(187,23,105,.2);}
}
@media all and (max-width:640px){
  .page_tab ul li a {font-size:16px;}
}
/*탭2단계(1단계와 동일)*/
.page_tab2 {width:100%; overflow:hidden; position:relative; margin-bottom:50px; padding-bottom:5px;}
.page_tab2::before {content:''; display:block; position:absolute; left:0; bottom:5px; width:100%; height:1px; background:#ddd;}
.page_tab2 ul li {display:inline-block; padding:5px 4px 15px 4px;}
.page_tab2 ul li a {position:relative; padding:2px 7px 5px 7px; display:block; font-size:18px; height:32px; line-height:32px;}
.page_tab2 ul li a.on,
.page_tab2 ul li a:hover {color:#004098; font-weight:600;}
.page_tab2 ul li a.on span,
.page_tab2 ul li a:hover span {box-shadow:inset 0px -10px 0px #dbffff;}
/*.page_tab2 ul li a.on::before,
.page_tab2 ul li a:hover::before {content:''; display:block; position:absolute; left:0; bottom:0; width:100%; height:4px; background:rgb(187,23,105); z-index:-1;}*/
@media all and (max-width:1023px){
  .page_tab2  {border-bottom:1px solid #878787; padding:5px 2%; margin-bottom:10px;}
  .page_tab2::before {display:none;}
  .page_tab2 ul li {margin:3px 5% 3px 0; float:left; padding:0;}
  .page_tab2 ul li a {font-size:18px; padding:0;}
  .page_tab2 ul li a.on::before,
  .page_tab2 ul li a:hover::before {height:10px; background:rgba(187,23,105,.2);}
}
@media all and (max-width:640px){
  .page_tab2 ul li a {font-size:16px;}
}
/*탭2단계 (원본작업 백업)
.page_tab2 {width:100%; overflow:hidden; margin-bottom:30px; padding:0px 2% 20px; border-bottom:1px dashed #ccc;}
.page_tab2 ul li {display:inline-block;}
.page_tab2 ul li a {display:block; padding:15px 40px; border-radius:40px; font-size:18px; color:#898989; font-weight:500;}
.page_tab2 ul li a.on {background:rgb(187,23,105); color:#fff; }
@media all and (max-width:1023px){
	.page_tab2 {padding:0 0 10px; margin-bottom:10px;}
	.page_tab2 ul li {float:left;}
	.page_tab2 ul li a  {padding:5px 20px; border-radius:20px; font-size:16px;}
}
*/
.cont_body {overflow:hidden; /*display:grid;*/ text-align:left;}
/*공공누리,담당부서,만족도*/
.cont_foot {overflow:hidden; margin-top:100px;}
.cont_foot > div {overflow:hidden; }
.open_area {overflow:hidden; width:100%; border:1px solid #ddd; padding:15px 2%; text-align:center; margin-bottom:5px;}
.open_area .mark,
.open_area p {display: inline;}
.open_area .mark img {vertical-align:middle;}
.cont_customer {border:1px solid #ddd; }
.cont_manager {background:#f1f1f1;padding:15px 2%; overflow:hidden; border-bottom:1px dashed #ddd;}
.page_manager {overflow:hidden; float:left;}
.page_manager dt,
.page_manager dd {display:inline-block; }
.page_manager dt {font-weight:500; margin-left:50px; color:#3b434f; margin-right:10px;}
.page_manager dt:first-child {margin-left:0;}
.lastModifiedDate {overflow:hidden; float:right;}
.lastModifiedDate dt {margin-left:0; font-weight:500; display:inline-block; color:#3b434f;}
.lastModifiedDate dd {display:inline-block; font-size:16px; margin-left:10px;}
@media all and (max-width:1200px){
  .open_area {width:100%; padding-bottom:10px; text-align:center;}
}
@media all and (max-width:1023px){
	.cont_foot {margin-top:50px;}
	.cont_foot * {font-size:15px !important;}
  .open_area {width:100% !important; text-align:center !important;}
  .open_area .mark, 
  .open_area p {display:block; margin-bottom:5px;}
  .open_area .mark {margin-right:0;}
    .page_manager,
	.lastModifiedDate {width:100%; float:none;}
  .page_manager dt {margin-right:5px; margin-left:15px;}
  .lastModifiedDate {margin-top:5px;}
}
@media all and (max-width:768px){
		.cont_foot * {font-size:14px !important;}
}
@media all and (max-width:480px){
	 .page_manager dt,
		.lastModifiedDate dt {width:30%; margin:0; float:left; clear:left; margin-bottom:3px;}
			 .page_manager dd,
		.lastModifiedDate dd {width:70%; margin:0;float:left;margin-bottom:3px;}
		  .lastModifiedDate {margin-top:0px;}
}
/*만족도*/
.cont_customer .cont_rating {overflow:hidden; width:100%; clear:both; padding:10px 2%;}
.cont_customer .cont_rating legend {position:absolute;left:-9999px}
.cont_customer .cont_rating .label_wrap {}
.cont_customer .cont_rating .label_wrap > p,
.cont_customer .cont_rating .label_wrap > span,
.cont_customer .cont_rating .label_wrap > input  {display: inline-block;}
.cont_customer .cont_rating .label_wrap > p {padding:5px 0 5px 55px; background:url('/Main/Images/new/ko/sub/cont_rating.png') no-repeat left 2px; margin-right:120px;}
.cont_customer .cont_rating .label_wrap > span {margin-right:20px;}
.cont_customer .cont_rating .label_wrap > input {font-family:"NotoSansKR", sans-serif; background:#3b434f; color:#fff; border:none; padding:5px 20px; border-radius:25px;  font-size:16px; margin-left:20px;}
@media all and (max-width:1200px){
  .cont_customer .cont_rating .label_wrap > p {margin-right:20px;}
}
@media all and (max-width:1023px){
  .cont_customer .cont_rating .label_wrap > p {width:100%;}
}
@media all and (max-width:640px){
  .cont_customer .cont_rating .label_wrap > input {margin-left:0; padding:2px 10px; font-size:15px;}
  .cont_customer .cont_rating .label_wrap > p {font-size:15px; font-weight:600; margin-bottom:5px; background:none; padding-left:0;}
  .cont_customer .cont_rating .label_wrap > span label {font-size:15px;}
}
.gnbArea .dept1 {position:relative;}
.gnbArea .dept1 > li > a {position:absolute; display: block; width:100px; height:60px; top:0; left:10px;}
.gnbArea .dept1 > li:nth-of-type(2) > a  {top:60px;}
.gnbArea .dept1 > li:nth-of-type(3) > a  {top:120px;}
.gnbArea .dept1 > li:nth-of-type(4) > a  {top:180px;}
.gnbArea .dept1 > li:nth-of-type(5) > a  {top:240px;}
.gnbArea .dept1 > li:nth-of-type(6) > a  {top:300px;}
.gnbArea .dept1 > li:nth-of-type(7) > a  {top:360px;}
.naviWrap {display:block; width:calc(100% - 130px); float:right; position:absolute;top:0; right:10px;}

/*동영상 자막*/
.video_caption {height:290px; overflow-y:auto; background:#f7f7f7; padding:20px;}
.video_caption .title {font-weight:bold; margin-bottom:10px;}



/*TYPE1_20220329_서브좌측추가테스트*/
.cksearchwrap {position:relative; width:100%;}
.cksearch_lnb {float:left; width:320px;}
.cksearch_lnb .lnb_cont {display:inline-block; float:left; width:270px; padding:0 25px 25px 25px; box-sizing:border-box; border-right:1px solid #aaa;}
.cksearch_lnb .lnb_btn {float:left; width:30px; height:50px; text-indent:-9999px; background:#fff url('/Main/Images/new/ko/common/arrow_close.png') no-repeat center center;  border:1px solid #aaa; border-left:none; cursor:pointer;}
.cksearchwrap .content_wrap {float:left; width:calc(100% - 370px); overflow:hidden;}
.cksearchwrap.lclose .content_wrap {width:calc(100% - 100px);}
.cksearchwrap.lclose .cksearch_lnb .lnb_cont{display:none;}
.cksearchwrap.lclose .cksearch_lnb {width:50px;}
.cksearchwrap.lclose .lnb_btn {background:#fff url('/Main/Images/new/ko/common/arrow_open.png') no-repeat center center;}
@media all and (max-width:1200px){
	.cksearch_lnb {display:none;}
	.cksearchwrap .content_wrap {float:none; width:96%; margin:0 2%;}
}

#snb {float:left; width:100%;}
#snb h2 {padding:30px 0; text-align:center; font-size:33px; font-weight:600;}
#snb.fixed {position:fixed;}
#snb .snb a {display:block; position:relative; padding:0 17px;}
#snb .snb a[target="_blank"]:before {display:none;}
#snb .snb a[target="_blank"] span {display:block; padding-right:20px; background:url('/Main/Images/new/ko/common/blank_b.png') no-repeat right 48%;}
#snb .snb .depth03 a[target="_blank"] span {display:inline;}
#snb .snb > li > a {padding:10px 0; border-bottom:1px solid #e3e3e3;}
#snb .snb > li:first-child > a {border-top:2px solid #004098;}
#snb .snb > li > a:before {content:''; position:absolute; top:50%; right:0; width:6px; height:6px; border-bottom:2px solid #d3d3d3; border-right:2px solid #d3d3d3; transform:translateY(-50%) rotate(45deg);}
#snb .snb > li.on .depth03 {display:block;}
#snb .snb > li.on:first-child > a {border-top:0;}
#snb .snb > li.on > a {padding-left:20px; color:#fff !important; font-weight:700;}
#snb .snb > li.on > a:before {display:none;}
#snb .snb > li.on > a:after {content:''; position:absolute; top:0; left:0; width:100%; height:100%; background:#004098; z-index:-1;}
#snb .snb > li:hover > a {color:#004098; font-weight:700;}
#snb .snb > li:hover > a:before {border-color:#004098;}
#snb .depth03 {display:none; padding:5px 10px; border-bottom:1px solid #004098;}
#snb .depth03 > li > a {margin:7px 0; padding:0; color:#2b2b2b; font-size:16px;}
#snb .depth03 > li.on > a, #snb .depth03 > li:hover > a {color:#004098; font-weight:600; text-decoration:underline;}

.content_title {margin-bottom:40px; overflow:hidden;}
.content_title h3 {font-size:40px; font-weight:600;}
.content_title ul {height:50px; padding:15px 0; box-sizing:border-box; overflow:hidden;}
.content_title li {float:left;}
.content_title .home {width:15px; height:23px; margin-right:5px; background:url('/Main/Images/new/ko/common/ico_home.png') no-repeat left 5px; text-indent:-9999px;}


/*TYPE220220330_상단 추가*/
.slnb {text-align:center; background:#cbe2ff; overflow:hidden;}
.slnb li {display:inline-block; padding:12px 0;}
.slnb li a {padding:0 20px;}
.slnb li.on a {color:#000; font-weight:600;}
.slnb li a:hover {color:#000; text-decoration:underline; font-weight:600;}
.slnb li a[target="_blank"] span {display:inline-block; padding-right:20px; background:url('/Main/Images/new/ko/common/blank.png') no-repeat right 48%;}

.slnb_dept {width:80%; margin:0 auto 20px auto; text-align:center; overflow:hidden;}
.slnb_dept li {display:inline-block; margin-top:10px; padding:0 5px;}
.slnb_dept li:before {display:inline-block; content:''; width:12px; height:42px; background:url('/Main/Images/new/ko/common/ico_slide.png') 50% 50% no-repeat; vertical-align:middle; margin-right:8px;}
.slnb_dept li:first-child:before {display:none;}
.slnb_dept li a {padding:0 0 10px 0;}
.slnb_dept li.on a {color:#004098; font-weight:600; border-bottom:3px solid transparent; border-color:#004098;}
.slnb_dept li a:hover {color:#000; text-decoration:underline; font-weight:600;}
.slnb_dept a[target="_blank"] span {display:inline-block; padding-right:20px; background:url('/Main/Images/new/ko/common/blank.png') no-repeat right 48%;}