@charset "utf-8";

body {width:100%; min-width:280px;}
input[type="text"], 
select {height:32px; line-height:30px; padding:3px 4px 3px 13px; border:1px solid #c3c6c9; border-radius:0; background-color:#fff; color:#838282; font-size:14px;}
textarea {padding:3px 4px 3px 13px; border:1px solid #c3c6c9; border-radius:0; background-color:#fff; color:#838282; font-size:14px;}
.a_underline:hover,
.a_underline:focus {text-decoration:underline}
.inner {position:relative; width:1200px; margin:0 auto;}

#wrap {position:relative; overflow:hidden;}

/* loading */
#loading {position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,.5);z-index:9999;}
#loading .con {position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:-webkit-box;display:-moz-box;display:-ms-flexbox;display:-webkit-flex;display:flex; align-items:center;justify-content:center;-webkit-align-items:center;-webkit-justify-content:center;-webkit-box-pack:center;-webkit-box-align:center;-moz-box-pack:center;-moz-box-align:center;-ms-box-pack:center;-ms-box-align:center;}
#loading .loading_inner {position:relative; height:auto; margin-top:-25px;}
#loading .text {position:absolute; width:160px; height:100%; font-size:20px; color:#fff; font-weight:500; letter-spacing:10px; margin-left:5px; display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; align-items:center; justify-content:center; -webkit-align-items:center; -webkit-justify-content:center; -webkit-box-pack:center; -webkit-box-align:center; -moz-box-pack:center; -moz-box-align:center; -ms-box-pack:center; -ms-box-align:center;}
#loading .loader,
#loading .loader:after {border-radius:50%; width:160px; height:160px;}
#loading .loader {margin:0 auto; font-size:13px; position:relative; text-indent:-9999em; border-top:13px solid rgba(255, 255, 255, 0.2); border-right:13px solid rgba(255, 255, 255, 0.2); border-bottom:13px solid rgba(255, 255, 255, 0.2); border-left:13px solid #ffffff; -webkit-transform:translateZ(0); -ms-transform:translateZ(0); transform:translateZ(0); -webkit-animation:load 1.2s infinite linear; -ms-animation:load 1.2s infinite linear; animation:load 1.2s infinite linear; overflow:hidden;}
@-webkit-keyframes load {
  0% {
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes load {
  0% {
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

/* header */
#header {position:fixed; top:0; left:0; width:100%; height:90px; z-index:3; background-color:transparent;}
#header .logo {position:absolute; top:25px; left:0; width:42px; height:44px; margin: 0 auto auto 0; background-image:url(../../images/homepage/layout/logo.svg); background-repeat:no-repeat; background-position:left top; z-index:100;}
#header .logo_div {display:block; width:204px; color:#fff; font-size:19px; font-weight:700;}
#header .logo_div a {position:relative; display:block; height:100%; padding-left:55px;}
#header .logo_div em {position:absolute; bottom:-16px; left:0; width:calc(100% - 4px); padding-left:58px; font-size:9px; font-weight:300; display:flex; justify-content:space-between;}
#header.head_on,
#header.header_fix {background-color:#fff; border-bottom:1px solid #ebe9e8; -webkit-transition:all 0.2s; transition:all 0.2s; }
#header.head_on .logo,
#header.header_fix .logo {}
#header.head_on .logo_div,
#header.header_fix .logo_div {color:#353535;}
#header.head_on {background-color:#fff}

/* 대메뉴 */
#header .gnb_wrap2 {display:none;}
#header .gnb_wrap {margin-left:400px; /* padding-bottom:30px; */}
#header .gnb_wrap .control {display:none;}
#gnb:after {content:""; display:block; clear:both;}
#gnb li {position:relative; float:left; padding:0 32px; font-size:16px; font-weight:700; color:#fff;}
#header.head_on #gnb li,
#header.header_fix #gnb li {color:#414141}
#gnb > li {padding-top:36px; padding-bottom:28px }
#header.head_on #gnb > li,
#header.header_fix #gnb > li {}
#gnb > li > a {position:relative; padding:0 10px ;}
#gnb > li > a:before {content:''; position:absolute; left:0; bottom:0; width:100%; height:100%; padding-bottom:20px;}
#gnb > li > a:after{content:'';position:absolute;left:50%;bottom:-31px;width:0;height:3px;background-color:#f68938;z-index:2;transition-duration:0.3s;}
#gnb > li > a.show:after,
#gnb > li > a.show:hover:after,
#gnb > li > a.show:focus:after {left:0; width:100%;}

#gnb .sub_gnb {display:none; position:absolute; top:90px; left:40px; width:1200px; padding:0; background-color:#fff; min-height:50px; z-index:2;}
#gnb .sub_gnb::before {content:''; position:absolute; left:-500%; top:0; width:1000%; height:100%; background-color:#fff; border-bottom:1px solid #ebe9e8;}
#gnb .sub_gnb li {position:relative; float:left; padding:12px 42px 0 0;}
#gnb .sub_gnb li:first-child {padding-left:0;}
#gnb .sub_gnb li:last-child {padding-right:0;}
#gnb .sub_gnb li a {color:#646363; font-weight:400; font-size:15px; z-index:1200;}
#gnb .sub_gnb li a:hover,
#gnb .sub_gnb li a:focus {color:#3a3a3a; font-weight:900;}

/* util */
#header .util {position:absolute; right:0; top:38px;}
#header .util:after {content:""; display:block; clear:both;}
#header .util li {float:left; height:19px; margin-right:32px; margin-top:1px;}
#header .util li:last-child {margin-right:0;}
#header .util li a {display:block; font-size:14px; color:#fff; font-weight:700}
#header .login {}
#header .myhome {}
#header .sitemap {width:14px; margin-top:0 !important; background:url(../../images/homepage/layout/icon_sitemap_w.png) center no-repeat; text-indent:-9999px;}
#header.head_on .util,
#header.header_fix .util {}
#header.head_on .util li a,
#header.header_fix .util li a {color:#414141;}
#header.head_on .sitemap,
#header.header_fix .sitemap {width:14px; background-image:url(../../images/homepage/layout/icon_sitemap_g.png);}

/* header_fix */
#header.header_fix {height:76px}
#header.header_fix .logo {top:15px}
#header.header_fix #gnb > li {padding-top:26px}
#header.header_fix #gnb > li > a:after {bottom:-26px}
#header.header_fix #gnb .sub_gnb {top:76px}
#header.header_fix .util {top:28px}

/* container */
#container {position:relative; overflow:hidden;}

/* menu_management */
.menu_management {position:relative; margin-top:40px;}
.menu_management:after {content:""; display:block; clear:both;}
.menu_management > div {border:1px solid #dfdfdf; height:624px}
.menu_management .menu_tree {float:left; position:relative; width:350px; overflow-x:hidden; overflow-y:auto;}
.menu_management .menu_tree h3 {position:absolute; top:-1px; left:-1px; width:calc(100% + 2px); height:53px; line-height:50px; font-size:16px; font-weight:900; color:#fff; background-color:#2282d4; text-align:center}
#menu_master {margin-top:52px;}
#menu_master li {position:relative;}
#menu_master li a {display:inline-block;}
#menu_master li a:hover {font-weight:700}
#menu_master > li {border-bottom:1px solid #d8dadf; background-color:#fff}
#menu_master > li > a {padding:13px 10px 11px 0; margin-left:42px; font-size:15px; color:#2a2a2a;}
#menu_master .depth1_btn, #menu_master .depth2_btn {text-indent:-9999px;}
#menu_master .depth1_btn {position:absolute; left:15px; top:15px; width:18px; height:16px; border:1px solid #d3dae2; background:url("../../images/homepage/layout/bg_depth1_btn.jpg") center repeat-x;}
#menu_master .depth1_btn:after {content:""; position:absolute; font-family:"xeicon"; left:0; top:-4px; font-size:16px; color:#a1b4c7; font-weight:bold; text-indent:0; -webkit-transform: rotate(0); transform: rotate(0); -webkit-transition: all 0.2s; transition: all 0.2s; margin-top:0;}
#menu_master .decoration.active .depth1_btn:after {content:"";}
#menu_master .depth2_ul .depth2_btn {position:absolute; left:25px; top:11px; width:20px; height:20px;}
#menu_master .depth2_ul .depth2_btn:after {content:""; position:absolute; font-family:"xeicon"; left:2px; top:-2px; font-size:16px; color:#959595; font-weight:bold; text-indent:0; -webkit-transform: rotate(0); transform: rotate(0); -webkit-transition: all 0.2s; transition: all 0.2s; margin-top:0;}
#menu_master .depth2_ul .decoration .depth2_btn:after {content:""; position:absolute; font-family:"xeicon"; left:2px; top:-2px; font-size:16px; color:#959595; font-weight:bold; text-indent:0; -webkit-transform: rotate(0); transform: rotate(0); -webkit-transition: all 0.2s; transition: all 0.2s; margin-top:0;}
#menu_master .depth2_ul .decoration.active .depth2_btn:after {content:"";}
#menu_master .depth2_ul {display:none; border-top:1px solid #d8dadf;}
#menu_master .depth2_ul > li {border-bottom:1px solid #d8dadf; background-color:#f6f6f6;}
#menu_master .depth2_ul > li:last-child {border-bottom:0 none;}
#menu_master .depth2_ul > li > a {padding:11px 10px 10px 0; margin-left:47px; font-size:14px; color:#5b5a5a;}
#menu_master .depth3_ul {display:none; padding:10px 10px 13px 38px; border-top:1px solid #d8dadf; background-color:#efefef}
#menu_master .depth3_ul > li {}
#menu_master .depth3_ul > li > a {padding-left:13px; margin:5px 0 4px; font-size:14px; color:#777777; background:url("../../images/homepage/layout/bullet_menu_master.png") left center no-repeat;}
#right_click {display:none; position:fixed; min-width:120px; top:auto; right:auto; padding:7px 10px 9px 8px; border:1px solid #d8dadf; background-color:#fff; z-index:10;}
#right_click.open {display:block;}
#right_click button {display:block; margin-top:4px; font-size:13px;}
#right_click button i {position:relative; display:inline-block; width:14px; height:21px; vertical-align:middle; margin-right:5px;}
#right_click button i::after {font-family:"xeicon"; position:absolute; left:0; top:0;}
#right_click .subaddition i:after {content:"";}
#right_click .move_up i::after {content:"";}
#right_click .move_down i::after {content:"";}
#right_click .close i::after {content:"";  -webkit-transform: rotate(0); transform: rotate(0); -webkit-transition: all 0.2s; transition: all 0.2s;}
#right_click .close:hover i::after, 
#right_click .close:focus i::after{-webkit-transform: rotate(180deg); transform: rotate(180deg); margin-top:-1px;}
.menu_management .menu_content {float:left; position:relative; margin-left:12px; width:calc(100% - 362px);}
.menu_content .board_write_box {padding:0; border:0 none; background-color:#fff;}
.menu_content .content_top {padding:20px 30px;}
.menu_content .content_top:after {content:""; display:block; clear:both;}
.menu_content .content_bottom {padding:10px 30px 20px; border-top:1px solid #dfdfdf;}
.menuManagementPopCon .menu_management {margin-top:0;}
.menuManagementPopCon .menu_management_location {margin-bottom:10px;}
.menuManagementPopCon .menu_management .menu_tree {width:100%}
.menuManagementPopCon .menu_management > div {height:auto;}
.menuManagementPopCon #menu_master > li:last-child {border-bottom:0 none}

/* 공공누리 유형 */
.tit_h3 + .license {margin-top:0;}
.license {display:flex; align-items:center; width:100%; margin-top:52px; padding:16px 0 17px; border-top:2px solid #3b3b3b; border-bottom:1px solid #a5a5a5;}
.license + .license {border-top:0 none; margin-top:0;}
.license .img {min-width:126px;}
.license .txt {padding-left:24px; color:#696969;}
.license .txt span {color:#404040; font-weight:900;}

/* 레이어팝업 공통 */
.layerPop,
.opacityLayerPop {position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;box-sizing:border-box; z-index:9000; box-sizing:border-box; padding:24px 48px;}
.layerPop {display:none;}
.opacityLayerPop {opacity:0; z-index:-1;}
.layerPop .layer_wrap,
.opacityLayerPop .layer_wrap {display:-webkit-box;display:-moz-box;display:-ms-flexbox;display:-webkit-flex;display:flex; align-items:center;justify-content:center;-webkit-align-items:center;-webkit-justify-content:center; -webkit-box-pack:center;-webkit-box-align:center;-moz-box-pack:center;-moz-box-align:center;-ms-box-pack:center;-ms-box-align:center;height:100%;}
.layerPop .layer_area {/* width:470px; */width:620px}
.opacityLayerPop .layer_area {width:100%;}
.layerPop .layer_tit,
.opacityLayerPop .layer_tit {position:relative; padding:16px 30px 14px; background:#858585 url("../../images/homepage/layout/fit_pop_bg.jpg") 85% bottom no-repeat;}
.layerPop .layer_tit .con,
.opacityLayerPop .layer_tit .con {position:relative;}
.layerPop .layer_tit .con .tit,
.opacityLayerPop .layer_tit .con .tit {display:inline-block; font-size:20px; color:#fff; font-weight:500;}
.layerPop .layer_tit .pop_close_btn,
.opacityLayerPop .layer_tit .pop_close_btn {position:absolute; width:24px; height:24px; top:-7px; right:-19px; border:none; text-indent:-9999px;}
.layerPop .layer_tit .pop_close_btn::before,
.opacityLayerPop .layer_tit .pop_close_btn::before {content:""; position:absolute; top:-2px; left:0; width:24px; height:24px; font-family:"xeicon"; font-size:20px; color:#fff; text-indent:0; -webkit-transform: rotate(0); transform: rotate(0); -webkit-transition: all 0.2s; transition: all 0.2s; margin-top:0;}
.layerPop .layer_tit .pop_close_btn:hover::before, 
.layerPop .layer_tit .pop_close_btn:focus::before,
.opacityLayerPop .layer_tit .pop_close_btn:hover::before, 
.opacityLayerPop .layer_tit .pop_close_btn:focus::before {-webkit-transform: rotate(180deg); transform: rotate(180deg);margin-top:3px;}
.layerPop .layer_con,
.opacityLayerPop .layer_con {padding:28px; box-sizing:border-box; max-height:460px; overflow-y: auto; border:1px solid #c2c2c2; border-top:0 none; background:#fff;}
.layerPop .layer_con > .board_write_box,
.opacityLayerPop .layer_con > .board_write_box {margin-top:0;}
.layerPop .board_write_box .section dl:first-child dt,
.opacityLayerPop .board_write_box .section dl:first-child dt {margin-right:22px; min-width:auto;}
.layerPop .form_select, 
.layerPop .form_input,
.layerPop .form_textarea,
.layerPop .board_write .file_add,
.opacityLayerPop .form_select, 
.opacityLayerPop .form_input,
.opacityLayerPop .form_textarea,
.opacityLayerPop .board_write .file_add {width:100%;}
.opacityLayerPop.popOpen { opacity:1; z-index:9000;}
.opacityLayerPop .grid_area {min-width:auto;}
.layerPop.noticePop {}
.layerPop.noticePop .layer_area {width:524px}
.layerPop.noticePop .layer_tit {background:#2384d7 url("../../images/homepage/layout/notice_pop_bg.jpg") 85% bottom no-repeat;}
.layerPop.noticePop .con .tit {font-weight:700}
.layerPop.noticePop .layer_con {padding:0;}
.layerPop.noticePop .notice_tit {display:table; width:100%; min-height:94px; padding:20px 110px 20px 35px; font-size:17px; font-weight:500; color:#373330; background:#efebe8 url("../../images/homepage/layout/icon_noticePop.png") 94% center no-repeat; word-break:keep-all}
.layerPop.noticePop .notice_tit > p {display:table-cell; vertical-align:middle}
.layerPop.noticePop .notice_cont {padding:22px 35px 24px 35px; line-height:26px}
.layerPop.noticePop .btn_area {margin-bottom:34px}
.layerPop .layer_check {padding:9px 10px 13px;border-top:1px solid #c0c0c0; background-color:#f9f9f9; text-align:center}
.layerPop .layer_check .form_check {padding-left:27px; padding-top:1px}
.layerPop .layer_check .form_check label {color:#545454; font-weight:500}
.layerPop .layer_check .form_check label::before {border-radius:0}
/* form_check */
.form_check {display:inline-block;position:relative;z-index:1;padding-left:25px;margin-right:16px}
.form_check label {cursor:pointer;color:#222;vertical-align:top;}
.form_check label::before {content:'';position:absolute;left:0;top:1px;z-index:-2;width:20px;height:20px;border:1px solid #ccc;background-color:#fff;border-radius:5px;}
.form_check label::after {content:'';position:absolute;right:auto;font-family:"xeicon";left:0;top:1px;z-index:-1;width:20px;height:20px;line-height:20px;color:#282828;text-align:center;opacity:0;font-weight:bold;font-size:14px}
.form_check input {position:absolute;left:0;top:0;opacity:0;width:20px;height:20px;cursor:pointer}
.form_check input:focus + label::before {outline:1px dotted #000;}
.form_check input:checked + label::after {opacity:1;}
.form_check:last-of-type {margin-right:0;}
.form_check.label_hide {width:20px;height:20px;padding-left:20px;overflow:hidden;margin-right:0 !important;}
.form_check.label_hide input:focus + label::before {border:1px dotted #000;}
.form_check.form_check_big {padding-left:30px;}
.form_check.form_check_big label {font-size:17px; font-weight:700}
.form_check.form_check_big label::before {width:25px;height:25px}
.form_check.form_check_big label::after {width:25px;height:25px;line-height:25px;font-size:16px}
.form_check.form_check_big input {width:25px;height:25px}
/* 기본버튼 */
.btn_area {margin-top:30px; font-size:0; text-align:center;}
.btn_area button,
button.btn,
a.btn {display:inline-block; height:37px; line-height:35px; margin-left:5px; padding:0 30px; font-size:15px; color:#fff; font-weight:500; text-align:center;}
.btn_area button.dark_gray,
button.btn.dark_gray,
a.btn.dark_gray {background-color:#717171;}
.btn_area button.light_gray ,
button.btn.light_gray,
a.btn.light_gray {background-color:#9e9e9e;}
.btn_area button.light_blue,
button.btn.light_blue,
a.btn.light_blue {background-color:#2384d7;}
.btn_area button:hover,
.btn_area button:focus,
button.btn:hover,
button.btn:focus,
a.btn:hover,
a.btn:focus {font-weight:900;}
/*통합검색 검색도움말 팝업*/
#search_help_pop .layer_con {background:#fafafa}
#search_help_pop .tit_h5 {margin-left:0; margin-bottom:3px; font-weight:700 !important}
#search_help_pop .notice_cont p {}
#search_help_pop .ex_style {display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-align:center; -ms-flex-align:center; align-items:center}
#search_help_pop .ex_style .disFnone {margin-right:10px}
#search_help_pop .ex_style .border {display:inline-block; padding:4px 10px; border:1px solid #c3c6c9; width:100%; background-color:#fff; color:#838282; font-size:14px}
#search_help_pop .ex_arrow {position:relative; display:block; padding:3px 5px 5px 18px; color:#858585;}
#search_help_pop .ex_arrow:after {content:""; position:absolute; font-family:"xeicon"; left:0; top:2px; font-size:16px; color:#a5a5a5;text-indent:0; }
#search_help_pop .btn_area,
#search_help_pop .btn_area button, 
#search_help_pop button.btn, a.btn {min-width:auto; text-align:center;}

/* footer */
#footer {position:relative; min-height:178px; border-top:1px solid #e7e7e7; color:#797979;}
#footer:after {content:""; display:block; clear:both;}
#footer > * {letter-spacing:-0.8px;}
#footer .inner {padding:36px 338px 40px 200px; background:url("../../images/homepage/layout/footer_logo.png") left 32px no-repeat;}
#footer address {float:left; margin-right:17px; word-break:keep-all; font-size:13px}
#footer .tel {display:inline-block; word-break:keep-all; font-size:13px; vertical-align:top}
#footer .tel span {color:#2f2f2f}
#footer .copyright {margin-top:5px; color:#898989; font-size:10px; font-weight:900; letter-spacing:0; text-transform:uppercase}
#footer .copyright span {font-weight:500}
#footer .pp_page_go {position:absolute;right:0;top:38px;width:130px;}
#footer .pp_page_go a {display:block;position:relative;width:100%;width:100%;padding:0 5px 0 15px;height:32px;line-height:30px;font-size:14px;font-weight:900;color:#525252;background-color:#e3e3e3;}
#footer .pp_page_go span {margin-left:16px; font-size:10px; color:#5a5a5a; font-weight:900; letter-spacing:-0.5px}
#footer .family_site {display:none; position:absolute;right:169px;top:38px;width:164px;}
#footer .family_site button {position:relative;width:100%;padding:0 61px 0 15px;height:32px;line-height:30px;color:#6c6c6c;background-color:#e3e3e3;border:0 none;border-radius:0;outline:0 none;-webkit-transition:all 0.2s;transition:all 0.2s;text-align:left;}
#footer .family_site button::before {content:'';font-family:"xeicon";color:#575757;position:absolute;right:0;top:0;width:48px;height:100%;line-height:36px;text-align:center;-webkit-transition:all 0.2s;transition:all 0.2s;}
#footer .family_site button:hover,
#footer .family_site button:focus {font-weight:500;}
#footer .family_site.close > button::before {-webkit-transform:rotate(-180deg);transform:rotate(-180deg);}
#footer .family_site button span {position:absolute;top:0;right:0;width:1px;height:1px;margin:-1px;overflow:hidden;}
#footer .family_site .family_list {display:none;position:absolute;width:100%;bottom:32px;padding:10px 15px;border-bottom:0 none;background-color:#3b3b3b;overflow:hidden;z-index:1;}
#footer .family_site .family_list li a {display:block;padding:3px 0; color:#fff;font-size:13px}
#footer .family_site .family_list li a:hover {text-decoration:underline;}

/* 반응형 - media qurey 시작 */
/* 넓이가 1200px 이하일 때*/
@media all and (max-width:1200px){	
	.inner {width:100%;}
	#header .logo {left:10px;}
	#header .util {right:10px;}
	#header .gnb_wrap {margin-left:35%;}

	#gnb li {padding:0 20px;}
	#gnb > li {padding-top:41px; padding-bottom:28px;}
	#gnb .sub_gnb {left:26px; width:calc(100vw - 420px)}
	#gnb .sub_gnb li {padding:12px 32px 0 0;}

	#footer .inner {width:100%; padding-left:230px; padding-right:30px; background-position:30px 32px;}
	#footer .foot_mid:after {content:""; display:block; clear:both;}
	#footer .pp_page_go {float:left; position:relative; right:auto; top:auto; margin:10px 6px 10px 0}
	#footer .family_site {float:left; position:relative; top:auto; right:auto; margin:10px 0 13px; text-align:left;}
}

/* 넓이가 1024px 이하일 때*/
@media (max-width:1024px) {
	#header {height:76px; background-color:#fff; border-bottom:1px solid #ebe9e8; overflow:hidden;}
	#header .logo {top:15px;}
	#header .logo_div {color:#353535;}

	#header .gnb_wrap {display:none;}
	#header .gnb_wrap2 {display:block;}
	#header .gnb_wrap2 {margin-left:0; z-index:-1;}
	#header .gnb_wrap2 .control {display:block; overflow:hidden; position:absolute; right:10px; top:27px; width:24px; height:24px; line-height:24px; color:#707070; font-size:24px; text-align:center; z-index:3;}
	#header .gnb_wrap2 .control::before {content:""; display:block; width:100%; height:100%; font-family:"xeicon"; text-align:center; line-height:inherit;}
	#header .gnb_wrap2 .control.close { display:none;font-size:23px;}
	#header .gnb_wrap2 .control.close::before {-webkit-transform: rotate(0); transform: rotate(0); -webkit-transition: all 0.2s; transition: all 0.2s; }
	#header .gnb_wrap2 .control.close:hover::before, 
	#header .gnb_wrap2 .control.close:focus::before { -webkit-transform: rotate(180deg); transform: rotate(180deg);}
	#header .gnb_wrap2 .control.close::before { content: ''; }
	#header .gnb_wrap2.mobile_on .open { display: none; }
	#header .gnb_wrap2.mobile_on .close { display: block; }
	.fixed{overflow:hidden}
	.fixed #wrap{position:fixed;width:100%;overflow:hidden;}
	.fixed #header {overflow:visible;}
	#gnb2 {-webkit-transform:translateX(100%); transform:translateX(100%);}
	.mobile_on #gnb2 {position:fixed;top:76px;right:0;width:100%;height:100%;background-color:#fff;z-index:9999;-webkit-transform:translateX(0); transform:translateX(0); -webkit-transition:all 0.8s; transition:all 0.8s;}
	#header .gnb_wrap2.mobile_on {z-index:999;}
	#gnb2 li {color:#414141; float:none;}
	#gnb2 li a {display:block;}
	#gnb2 > li {border-bottom:1px solid #e8e8e8}
	#gnb2 > li > a {position:relative;display:block; width:100%; height:auto; font-size:16px; padding:10px 40px 10px 20px; font-weight:700; -webkit-transition:all 0.2s; transition:all 0.2s;}
	#gnb2 > li.dep > a::after {content: '';  position:absolute; top:auto; right:22px; font-family: "xeicon"; -webkit-transition:all 0.2s; transition:all 0.2s; }
	#gnb2 > li.active > a {background-color:#f68938; color:#fff;}
	#gnb2 > li.active > a::after { content: ''; color:#fff; -webkit-transform: rotate(180deg); transform: rotate(180deg); }
	#gnb2 .sub_gnb {display:none; position:relative; width:100%; padding:20px 40px 20px 20px}
	#gnb2 .sub_gnb li {padding-left:20px; margin-top:10px; background:url("../../images/homepage/sub/list_style_bullet.png") 10px 8px no-repeat; word-break:keep-all;}
	#gnb2 .sub_gnb li:first-child {margin-top:0;}
	#gnb2 .sub_gnb li a {color:#646363;}
	#gnb2 .sub_gnb li a:hover,
	#gnb2 .sub_gnb li a:focus {color:#3a3a3a; font-weight:900;}

	#header .util {top:28px; right:30px;}
	#header .util li a {color:#414141;}
	#header .util li.pc_sitemap,
	#header .sitemap {display:none;}
}

/* 넓이가 767px 이하일 때*/
@media all and (max-width: 767px){
	/* 레이어팝업 공통 */
	.layerPop, .opacityLayerPop {padding:24px 28px}
	.layerPop .layer_tit, .opacityLayerPop .layer_tit, .layerPop.noticePop .layer_tit {padding:11px 15px 10px; background-image:none;}
	.layerPop .layer_con, .opacityLayerPop .layer_con {padding:17px 20px}
	.layerPop .layer_tit .con .tit, .opacityLayerPop .layer_tit .con .tit, .layerPop.noticePop .notice_tit {font-size:16px;}
	.layerPop .layer_tit .pop_close_btn, .opacityLayerPop .layer_tit .pop_close_btn {top:-2px; right:0;}
	.layerPop.noticePop .notice_tit {min-height:auto;padding:15px 20px 15px 25px; background-image:none;}
	.layerPop.noticePop .notice_cont {padding:17px 20px 19px 20px}
	/*통합검색 검색도움말 팝업*/
	#search_help_pop .ex_style {display:block}
	#search_help_pop .ex_style span {display:block; margin-top:3px}

	/* 기본버튼 */
	.btn_area {margin-top:16px;}
	.btn_area button, button.btn, a.btn {height:30px; line-height:27px; padding:0 14px; font-size:14px;}
	
	/* footer */
	#footer .inner {padding:26px 30px 40px 30px; background:none; text-align:center;}
	#footer address {float:none; margin-right:0;}
	#footer .tel {display:block;}
	#footer .foot_mid {display:inline-block; margin:0 auto}
	#footer .family_site {margin:10px auto 13px;}
	#footer .pp_page_go {margin:10px 6px 2px 0}
}


/* 넓이가 425px 이하일 때*/
@media (max-width:425px) {
	/* header */
	#header .logo {width:30px; height:32px; top:20px;}
	#header.head_on .logo,
	#header.header_fix .logo {top:20px;}
	#header .logo_div {font-size:17px; margin-top:-3px}
	#header .logo_div a {padding-left:40px;}
	#header .logo_div em {width:calc(100% - 34px); bottom:-13px; padding-left:43px;}

	/* 공공누리 유형 */
	.license {display:block; padding:10px; text-align:center;}
	.license .txt {padding:0; margin-top:10px;}

	/* footer */
	#footer .pp_page_go, #footer .family_site {float:none; margin:10px auto 10px}
}

/* 넓이가 380px 이하일 때*/
@media (max-width:380px) {
	/* header */
	#header .logo {width:26px; height:28px; top:24px;}
	#header.head_on .logo,
	#header.header_fix .logo {top:24px;}
	#header .logo_div {width:146px; font-size:14px; margin-top:-2px}
	#header .logo_div a {padding-left:32px;}
	#header .logo_div em {width:calc(100% - 9px); bottom:-11px; padding-left:34px; font-size:5px;}
	#header .util li {margin-right:12px;}
	#header .util li a {font-size:13px;}
}

/* 넓이가 320px 이하일 때*/
@media (max-width:320px) {
	#header .logo {left:0}
	#header .util {right:20px}
	#header .gnb_wrap2 .control {right:0}
	#footer .inner {padding-left:20px; padding-right:20px;}
}