@charset "utf-8"; 

/* 
 * layout CSS Document
 */

body.modal-open {
    overflow: hidden; /* 팝업 열리면 body 스크롤 막기 */
}

#img-modal.img-modal {
    display: none;
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(0,0,0,0.8);
    justify-content: center;
    align-items: center;
    z-index: 9999;
}

.img-modal-content-wrapper {
    max-width: 90%;
    max-height: 90%;
    overflow: auto; /* 이미지 래퍼에만 스크롤 */
}

.img-modal-content {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 90vh; /* ✨ 세로 최대 90%로 제한 */
    box-shadow: 0 0 10px rgba(0,0,0,0.5);
    border-radius: 4px;
}

.img-modal-content.full-img {
    max-width: none;
    max-height: none;
}

.img-modal-close {
    position: absolute;
    top: 20px; right: 30px;
    font-size: 2rem;
    color: #fff;
    cursor: pointer;
    user-select: none;
}


/***********************************************************************************
header gnb
************************************************************************************/
/* pc */
#header {position: fixed;top: 0;left: 0;z-index: 99;width: 100%;transition: 0.6s}
#header #logo { position:absolute; top:23px; left:30px; z-index: 99}
#header #gnb { position:relative; text-align:right; padding-right: 12.5px; }
#header:hover { background:#000d30; }
#header.act { background:#000d30; }
#header #gnb > ul > li{display:inline-block;position: relative;}
#header #gnb > ul > li > a{ display:block; line-height:90px; color: #ffffff; font-size:1.19em; padding:0 34.5px;}
#header #gnb > ul > li .depth_2{position: absolute;width: auto;min-width: 7.813rem;top: 90px;left: 50%;transform: translateX(-50%);display: block;/* background: url(../img/gnb_bg.png) right; */background-size: 980px 350px;text-align: left;height: 0;/* overflow: hidden; */transition: 1s;/* background-color: #4A5A84; */}
#header #gnb > ul > li:hover .depth_2{height: auto;}
#header #gnb > ul > li:hover .depth_2{display: block}
#header #gnb > ul > li .depth_2 > div{float:left;width:50%;overflow: hidden;}
#header #gnb > ul > li .depth_2 > div.img img{ display: block; min-width: 100%; }
#header #gnb > ul > li .depth_2 > div.img{position: relative;display: none;}
#header #gnb > ul > li .depth_2 > div.img .txt {position:absolute; right:0; top:12%;}
#header #gnb > ul > li .depth_2 > div.img .txt strong { display:block; color:#ffffff; font-size:32px; font-family:Saira, Pretendard, Dotum, '돋움', Arial, sans-serif; }
#header #gnb > ul > li .depth_2 > div.img .txt strong:after{content: '';display: inline-block;vertical-align: middle;width: 270px;height: 2px;background: #fff;position: relative;top: -2px;margin-left: 55px;}
#header #gnb > ul > li .depth_2 > div.txt{position:relative;/* display:flex; */justify-content:center;align-items:center;width: 100%;height:100%;/* padding:0 4em; */padding-top: 1.25rem;}
#header #gnb > ul > li .depth_2 > div.txt ul {/* display:flex; */position:relative;flex-wrap:wrap;padding: 1.25rem 0;background-color: #4A5A84;}
#header #gnb > ul > li:hover .depth_2 > div.txt ul:before{content:'';position: absolute;bottom: 100%;left: 50%;transform: translateX(-50%);width: 1.875rem;border-bottom: 1.25rem solid #4A5A84;border-right: 0.938rem solid transparent;border-left: 0.938rem solid transparent;}
#header #gnb > ul > li .depth_2 > div.txt ul li {text-align: center;}
#header #gnb > ul > li .depth_2 > div.txt ul li a {position:relative;/* margin-left:10px; */display:block;color:#939fb9;padding: 0 0.313rem;transition: 0.6s;/* text-align: center; */height: 1.875rem;display: flex;justify-content: flex-start;align-items: center;font-size: 1rem;white-space: nowrap;}
#header #gnb > ul > li .depth_2 > div.txt ul li:hover a{ color: #fff}
#header #gnb > ul > li .depth_2 > div.txt ul li a:before{content: '';display: block;width: 5px;height: 5px;box-sizing: border-box;/* background:#fff; */position: absolute;left: 0;top: 50%;margin-top: -2.5px;opacity: 0;transition: 0.6s}
#header #gnb > ul > li .depth_2 > div.txt ul li:hover a:before{ opacity:1; }

/* mo */
#header .mo_menu { padding-top:100px; }
#header .mo_menu.on { padding-top:100px; }
#header .mo_menu button { background:none; border: none; right: 20px; top: 20px; position:absolute; }
#header .mo_menu { position:fixed; right:-100%; z-index: 999; background:url(../img/menu_open.png) right bottom #000d30; width:100%; height: 100%; top: 0; transition: 1s; overflow-y:hidden; }
#header .mo_menu.on { right:0; }
#header .mo_menu .gnb1 { padding:0 20px; }
#header .mo_menu .gnb1 > ul > li > a{ font-size:1.31em; padding: 10px 0; color:#fff; display:block; border-bottom:2px solid #eeeeee77; }
#header .mo_menu .gnb1 > ul > li > a::before { content:''; position:relative; display:inline-block; width:5px; height:5px; background:#eeeeee77; margin:0 12px 3px 0px; transform: translate(0,-50%);}
#header .mo_menu .gnb1 > ul > li > ul > li > a{ font-size:14px; padding:10px; color: #939fb9; display:block; display: none; }
#header .mo_menu .gnb1 > ul > li > ul > li > a{ display: block; }
#header .mo_menu .gnb1 > ul > li > ul { display:none; border-bottom:1px solid #eeeeee77; }
#header .mo_menu .gnb1 > ul > li > ul.on { display:block; }
#header .mo_menu .gnb1 > ul > li > ul > li { position:relative; display:block; border-bottom:1px dashed #eeeeee77; }
#header .mo_menu .gnb1 > ul > li > ul > li:last-child { border-bottom:none; }
#header .mo_menu .gnb1 > ul > li > ul > li > a::before { content:''; position:relative; display:inline-block; top:-4px; margin:0 12px 0px 0px; width:15px; height:1px; background:#eeeeee77; }

/***********************************************************************************
footer
************************************************************************************/
footer { position:relative; display:block; }
.gotop { position:fixed; z-index:9; bottom:50px; right:50px; cursor:pointer; width:60px; height:60px; background:url('../img/icon_top.svg') no-repeat center #fff; border:1px solid var(--c01); }

/* sub footer */
footer .footer { position:relative; display:block; margin-top:300px; background:#1A1A1A; padding:0 30px 0 30px; }

.footer .top { padding:30px 0; border-bottom:1px solid #eeeeee77;}
.footer.sub_footer .top ul li { position:relative; display:inline-block; padding-left:20px; }
.footer .top ul li:first-child { padding-left:0; }
.footer .top ul li a { color:#dcdcdc; }

.footer .bot { position:relative; display:flex; padding:35px 0; }
.footer .bot .logo { position:relative; display:block; background:url('../img/logo-dark.png') no-repeat center; width:165px; height: 48px; background-size: cover; }
.footer .bot .txt { position:relative; display:block; padding-left:50px; color:#dcdcdc; line-height:2.1; }
.footer .bot .txt a { margin-right:20px; }
.footer .bot .txt em { margin-right:15px; }
.footer .bot .txt p { font-size:.94em; color:#dcdcdc; padding-top:50px; }


/***********************************************************************************
tab
************************************************************************************/
.tab_depth { display:flex; border-bottom:1px solid #D1D5E3; height:auto; align-items:center; flex-wrap:wrap; word-break: break-word; }
.tab_depth li { font-size:1.059em; flex:1; text-align:center; flex:1; position:relative; }
.tab_depth li a { position:relative; display:block; padding:1em 0; color:#b1b0b0; }

.tab_depth.col02 li { flex:none; width:50%; }
.tab_depth.col07 li { flex:none; width:25%; }

.tab_depth li.active { position:relative; }
.tab_depth li.active a::after { position:absolute; bottom:0px; left:0; width:100%; height:2px; background:#000d30; }
.tab_depth li.active a { color:#000d30; font-weight:600; }
.tab_depth li a::after { content:''; position:absolute; bottom:0px; left:0; width:0; height:2px; background:#000d30; -webkit-transition:all 0.4s; transition:all 0.4s; }
.tab_depth li:hover a { color:#000d30; font-weight:600; -webkit-transition:all 0.4s; transition:all 0.4s;  }
.tab_depth li:hover a::after { width:100%; }

/***********************************************************************************
테이블
************************************************************************************/
table { display:table; position:relative; width:100% !important; table-layout:auto; line-height:1.4; } 
table thead th,
table thead td,
table tbody th,
table tbody td { border-style:solid; border-color:#B1B2B5 !important; border-width:1px; padding:10px; border-spacing:inherit; vertical-align:middle; }
table tbody { border-top:2px solid #1E2633; }

table thead th *,
table thead td *,
table tbody th *,
table tbody td * { display:inline-block; vertical-align:middle; }

table tbody td.subject { width:auto; text-align:left;  } 
table tbody td.subject > a { display:inline-block; max-width:97%; line-height:1.7; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; vertical-align:middle; } 
table tbody td.subject > a:hover { text-decoration:underline;} 
table tbody tr { background:#fff; }
table tbody tr:hover { background:#f8f8f8;  }

.table_wrap.scroll { overflow: auto; } 
.table_wrap .product_table tbody tr td:first-child,
.table_wrap .product_table thead tr th { background:#f7f7f7; font-weight:600; }

.bo_li  { table-layout:fixed; }
.bo_li thead th { border-width:1px 0 1px 0 !important; padding:12px 6px; font-weight:600; } 
.bo_li tbody th,
.bo_li tbody td {height: 67px;line-height:25px;padding:8px 6px;border-width:0 0 1px 0 !important;text-align:center;vertical-align:middle;} 
.bo_li tbody td .new { display:inline-block; position:relative; margin-left:5px; font-size:0; } 
.bo_li tbody td .new::before { content:''; display:inline-block; width:18px; height:18px; background:url('../img/icon_new.svg')center no-repeat; } 

.bo_li .download,
.bo_li .num { color:#888; width:70px;}
.bo_li .name { width:85px; }
.bo_li .date { color:#888; width:200px; }

/* 등록된 게시물 없음 */
table.no_data tbody tr:hover { background:#fff; }
.no_data_wrap { display:grid; place-items: center; padding:9em 0; }
.no_data_wrap p { padding-top:50px; color:#9F9F9F; }

/* 게시판 검색 */
.bo_top { position:relative; margin-bottom:1.2em; } 
.bo_top::after { content:''; display:block; clear:both; } 
.bo_top .search { float:right; width:calc(100% - 180px); text-align:right; } 
.bo_top .search .search_wrap { display:inline-block; width:100%; max-width:400px; height:50px; line-height:50px; background:#EFF1F3; vertical-align:top; } 
.bo_top .search .search_wrap .search_input { display:inline-block; position:relative; width:calc(100% - 119px); } 
.bo_top .search.no_select .search_wrap .search_input { width:100%; }
.bo_top .search.no_select .search_wrap .search_input::before { content:none; } 
.bo_top .search.no_select .search_wrap .search_input button { top:-1px; } 
.bo_top .search .search_wrap::after, 
.bo_top .search .search_wrap .search_input::after { content:''; display:block; clear:both; } 
.bo_top .search .search_wrap .search_input::before { content:''; position:absolute; top:30%; left:2px; width:1px; height:40%; background:#e6e6e6; } 
.bo_top .search .search_wrap .search_input input { float:left; width:calc(100% - 50px); height:50px; line-height:50px; background:0; border:0; padding-left:10px; } 
.bo_top .search .select_wrap { float:left; }
.bo_top .search select { height:48px; line-height:48px; }
.bo_top .search button { float:left; position:relative; width:50px; height:50px; background:#001364; } 
.bo_top .search button span { display:inline-block; font-size:0; } 
.bo_top .search button span::before { content:''; display:inline-block; position:relative; top:-1px; width:21px; height:21px; background:url(../img/bo_search_icon.svg)center no-repeat; } 
.bo_top .post { float:left; margin-top:15px; } 
.bo_top .post strong,
.bo_top .post span { font-weight:600;  color:#000d30;  } 

.select_wrap { display:inline-block; width:119px; } 
select { position:relative; width:100%; -webkit-appearance:none; border:none; height:40px; line-height:40px; background:url(../img/icon_select.png) 86% 50% no-repeat #EFF1F3; padding:0 10px; font-size:.9em; cursor:pointer; } 
.bo_w_select { border:1px solid #d7d7d7; background:url(../img/icon_select.png) 93% 50% no-repeat #fff; }

/***********************************************************************************
갤러리 게시판
************************************************************************************/
.gallery_li { display: grid; grid-auto-flow:dense; height:fit-content; grid-column-gap: 2.5rem; grid-row-gap: 5rem; }
.gallery_li.col01 { grid-template-columns:repeat(1, 1fr); grid-row-gap:1rem; }
.gallery_li.col02 { grid-template-columns:repeat(2, 1fr); }
.gallery_li.col03 { grid-template-columns:repeat(3, 1fr); }
.gallery_li.col04 { grid-template-columns:repeat(4, 1fr); }

.gallery_li .li { position:relative; grid-column:auto/span 1; }
.gallery_li .li a { display:block; }
.gallery_li .li a:focus .txt .tit,
.gallery_li .li a:hover .txt .tit { text-decoration:underline; }
.gallery_li .li img { display:block; width:auto; max-width:100%; /*width:100%;*/ }
.gallery_li .li .img img { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); }

.gallery_li.col03 .li .img_wrap { padding:2em; background:#F2F3F7;  }
.gallery_li.col03 .li .img { overflow:hidden; position:relative; width:100%; padding-top:56%; height:auto; }
.gallery_li.col03 .li .img img { margin:0 auto; object-fit:contain; height:100%;}
.gallery_li.col03 .li .img.video::before,
.gallery_li.col03 .li .img.video::after { content:''; position:absolute; }
.gallery_li.col03 .li .img.video::before { top:50%; left:50%; transform:translate(-50%, -50%); width:54px; height:54px; background:url(../images/user/play02.png) no-repeat; z-index: 2; }
.gallery_li.col03 .li .img.video::after { top:50%; left:50%; width:100%; height:100%; transform:translate(-50%, -50%); background:rgba(0, 0, 0, 0.3); }

/* .gallery_li.col03 .li .img.data { overflow:visible; } */
.gallery_li.col03 .li .img.data img { top:50%; transform:translate(-50%, -50%); width:auto; max-height:100%; /*box-shadow:11px 11px 10px 0 rgb(0 0 0 / 5%);*/ }

.gallery_li.col03 .li .img.no_img img { max-width:60px; transform:translate(-50%, -55%);}
.gallery_li.col03 .li .img.no_img span { margin-top:30px; font-size:.9em; }

/***********************************************************************************
게시판 페이징
************************************************************************************/
.pagination { position:relative; display:flex; align-items:center; justify-content:center; margin:50px auto 0; text-align:center; } 
.pass { display:inline-block; position:relative; width:40px; height:40px; } 
a.page_group { display:inline-block; width:40px; height:40px; line-height:2.5; vertical-align:middle; text-align:center; } 
a.page_group.current.active { border:solid #0C1F3F; border-width:0px 0px 2px 0px; font-weight:600; color:#0C1F3F; } 
.page_control { display:flex; align-items:center; vertical-align:middle } 
.page_control a:first-child { margin-left:10px; }
.page_control a:last-child { margin-right:10px; }

.page_control .last,
.page_control .next,
.page_control .prev,
.page_control .first{ margin:0 3px;} 

.page_control .last:before,
.page_control .next:before,
.page_control .prev:before,
.page_control .first:before { content:''; display:inline-block; position:absolute; vertical-align:middle; top:50%; left:50%; transform:translate(-50%,-50%); } 

.page_control .first::before { width:14px; height:16px; background:url(../img/page_first.svg)center no-repeat; }
.page_control .next::before { width:9px; height:16px; background:url(../img/page_next.svg)center no-repeat; }
.page_control .prev::before { width:9px; height:16px; background:url(../img/page_prev.svg)center no-repeat; }
.page_control .last::before { width:14px; height:16px; background:url(../img/page_last.svg)center no-repeat; }

/***********************************************************************************
게시판 팝업 및 파일
************************************************************************************/
.bo_download { width:50px; height:50px; border:1px solid var(--c01); border-radius:50%; font-size:0; background:var(--c01); }
.bo_download::before,
.bo_preview::before { content:''; display:inline-block; width:17px; height:15px; }
.bo_download::before { background:url(../img/icon_down.svg) no-repeat;  } 

/***********************************************************************************
게시판 view
************************************************************************************/
.bo_v { position:relative; }
.bo_v .head { border-top:2px solid #1E2633; border-bottom:1px solid #B1B2B5; padding:2.50em 0.63em;}
.bo_v .field_cont.date { color:#888888; }
.bo_v .bo_v_atch { padding:1.56em 0.63em; border-bottom:1px solid #B1B2B5; }

.bo_v p.subject { font-size:1.1em; color:#17181a; }
.bo_v ul.bo_info { width:100%; }
.bo_v ul.bo_info > li { display:flex; align-items:center; border-top:1px solid #e5e5e5; }
.bo_v ul.bo_info > li::after { content:''; display:block; clear:both; }
.bo_v ul.bo_info > li:last-child { border-bottom:1px solid #cdcdcd; }
.bo_v ul.bo_info > li .field_name,
.bo_v ul.bo_info > li .field_cont { padding:12px;  }
/* .bo_v ul.bo_info > li .field_name { width:150px; vertical-align:middle; } */
.bo_v ul.bo_info > li .field_cont { width:calc(100% - 150px); }
.bo_v ul.bo_info > li .field_cont.date { letter-spacing:0.02em; }

.bo_v ul.bo_info .info_file li { margin-bottom:5px; }
.bo_v ul.bo_info .info_file li:last-child { margin-bottom:0; }
.bo_v ul.bo_info .info_file p { display:inline-block; margin-right:15px; word-break:break-all; }
.bo_v ul.bo_info .info_file .file_btn_wrap { display:inline-block; }

.bo_v .v_cont { padding:5em 0.63em; color:#1E2633; border-bottom:1px solid #cdcdcd; }
.bo_v .v_cont::after { content:''; display:block; clear:both;}
.bo_v .v_cont .video_wrap { max-width:600px; margin:0 auto; }
.bo_v .v_cont .iframe { position:relative; width:100%; height:auto; padding-bottom:56.25%; margin:0 auto; }
.bo_v .v_cont .iframe iframe { position:absolute; top:0; left:0; width:100%; height:100%; }
.bo_v .v_cont img { display:block; max-width:100% !important; height:auto !important; }

.bo_v .field_cont .info_file { position:relative; display:flex; justify-content:space-between; overflow:hidden; align-items:center; }
.bo_v .field_cont .info_file .left { position:relative; }
.bo_v .field_cont .info_file .right { position:relative; cursor:pointer; text-align:center; background:#303E63; color:#fff; }
.bo_v .field_cont .info_file .right button { margin:18px 30px; }
.bo_v .field_cont .info_file .right button::after { content:''; position:relative; display:inline-block; margin-left:8px; width:13px; height:13px; background:url('../img/icon_link01.svg')no-repeat center; }

.bo_v .field_cont .info_file .left li { padding-bottom:5px; }
.bo_v .field_cont .info_file .left li span { position:relative; color:#888; }
.bo_v .field_cont .info_file .left li a { position:relative; color:#1d1f22; }
.bo_v .field_cont .info_file .left li a::after { content:''; position:relative; display:inline-block; margin:0 0 0 8px; top:1px; width:17px; height:15px; background:url('../img/icon_down_small.svg') no-repeat center; }
.bo_v .field_cont .info_file .left li span::after { content:''; position:relative; display:inline-block; margin:0px 15px; top:1px; width:1px; height:15px; background:#D1D5E3; }

.bo_v .field_cont .info_file .left li:hover a { text-decoration:underline; }

.btn_group { position:relative; display:flex; justify-content:space-between; padding:2.50em 0; }
.btn_next>p, .btn_prev>p { position:relative; text-transform:uppercase; font-size:1.13em; color:#C6C6C6; }
.btn_next { padding-left:30px; }
.btn_prev { padding-right:30px; }
.btn_next::after { content:''; width:9px; height:15px; position:absolute; left:0; top:50%; transform:translateY(-50%); display:inline-block; background:url('../img/icon_next.svg')no-repeat center; }
.btn_prev::after { content:''; width:9px; height:15px; position:absolute; right:0; top:50%; transform:translateY(-50%); display:inline-block; background:url('../img/icon_prev.svg')no-repeat center; }
.btn_list { position:relative; display:inline-block; padding:1.25em 11.25em; background:#000D30; }
.btn_list p { color:#fff; }

.btn_next p { position:relative; width:100%; }
.btn_next:hover p,
.btn_prev:hover p { color:#000D30; font-weight:600; -webkit-transition:all 0.4s; transition:all 0.4s; }
.btn_next p::before,
.btn_prev p::before { content:''; position:absolute; bottom:-5px; left:0; width:0; height:2px; background:#1E2633; -webkit-transition:all 0.4s; transition:all 0.4s;}
.btn_next:hover p::before,
.btn_prev:hover p::before { width:100%; -webkit-transition:all 0.4s; transition:all 0.4s; }
.btn_next:hover::after { background:url('../img/icon_next_active.svg')no-repeat center; -webkit-transition:all 0.4s; transition:all 0.4s; }
.btn_prev:hover::after { background:url('../img/icon_prev_active.svg')no-repeat center; -webkit-transition:all 0.4s; transition:all 0.4s;}

.bo_v .v_cont table thead th { border-width:1px !important; }
.bo_v .v_cont .bo_li tbody td { border-width:0 1px 1px 1px !important; }
.bo_v .v_cont table { width:auto; border-collapse:collapse !important; font-size:0.941em; }

/***********************************************************************************
tipbox
txtbox
text
************************************************************************************/

.section {font-family:'Roboto','Pretendard';}

.lable { position:relative; margin-bottom:30px; display:block; font-family:Saira, Pretendard, Dotum, '돋움', Arial, sans-serif; }
.lable span:first-child { position:relative; padding:0.8em 1.9em; border-radius:0 0 20px 0px; background:#596482; color:#fff; }
.lable span:first-child::after { content:''; position:absolute; bottom:-1px; right:0; width:20px; height:23px; background:url('../img/lable.png')no-repeat center; }
.lable span:last-child { position:relative; padding:0em 1em; font-size:20px; }

.tip_box1 { position:relative; display:block; background:#f2f3f7; padding:30px; font-family: 'Roboto','Pretendard';}
.tip_box1 p { color:#4a4a4a; }
.tip_box1 strong { margin-bottom:15px; position:relative; display:inline-block; color:#000; border-bottom:3px solid #000; font-size:1.13em; font-weight:700; }
.tip_box1 b {font-weight:600; color:#4a5a84; }
.tip_box1 em { text-decoration:underline; color:#4a5a84; }

.tip_box1 ul
.tip_box1 ul li { position:relative; display:block; margin:5px!important; }
.tip_box1 ul li::before { content:''; position:relative; display:inline-block; top:-5px; margin-right:8px; width:14px; height:1px; background:#4a4a4a; }
.tip_box1 ul li.tit { font-weight:600; color:#000D30; position:relative; display:inline-block; margin-bottom:8px;  font-family: 'Roboto','Pretendard';}
.tip_box1 ul li.tit::before { display:none; }

.tip_box1 .txt { border-radius:10px; margin-top:8px; position:relative; background:#fff; padding:22px; }
.tip_box1 .txt .tit { font-weight:600; margin-bottom:5px; color:#000; }
.tip_box1 .txt p { color:#888 }

.tip_box2 { position:relative; text-align:center;  font-family: 'Roboto','Pretendard';}
.tip_box2 p { position:relative; display:inline-block; font-size:1.2em; font-weight:600; color:#fff; padding:10px 30px; border-radius:50px; background:#000d30; margin-bottom:20px; }
.tip_box2 ul { position:relative; display:block; text-align:left; border:solid #F4F5FB; border-width:4px 0 4px 0; padding:2em; }
.tip_box2 ul li { display:flex; color:#4a4a4a; padding-bottom:10px; }
.tip_box2 ul li:last-child { padding-bottom:0; }
.tip_box2 ul li>span { position:relative; padding:4px 0; text-align:center; display:inline-block; width:30px; height:30px; background:#303E63; color:#fff; margin-right:15px; font-weight:600; font-size:13px; text-transform:capitalize;}

.tip_box3 { position:relative; display:block; border:3px solid #f2f3f7; border-width:3px 0 3px 0; padding:2em 0em; }
.tip_box3 p { font-weight:18px; }

.h4_wrap { position:relative; display:inline-block; margin:40px 0 15px 0 ; } 
.h4_wrap h4 { font-size:25px; color:#1E2633; font-weight:700; font-family:Saira, Pretendard, Dotum, '돋움', Arial, sans-serif; }
.h4_wrap h4.txt1::before { content:''; position:relative; display:inline-block; margin-right:10px; width:21px; height:24px; background:url('../img/icon_h4.png')no-repeat center; }
.h4_wrap h4.txt2::before { content:''; top:3px; position:relative; display:inline-block; margin-right:10px; width:5px; height:24px; background:#000d30; }

.img_box { position:relative; margin:0 auto; padding:4em; margin-bottom:30px; display:flex; align-items:center; justify-content:center !important; width:100%; height:auto; border:1px solid #BDBDBD; border-radius:30px; }
.img_box.top-align {display: flex; align-items: flex-start;}
.img_box span.title-span {display: inline-block; width: 100%; text-align: center}
.img_box span.title-text { margin-top: 10px;position: relative;display: inline-block;border-radius: 20px;text-align: center;padding: 8px 20px;background: #303E63;color: #fff;}
.img_box span.cert { -webkit-box-shadow: 5px 5px 15px 5px rgba(220,220,220,0.26); box-shadow: 5px 5px 15px 5px rgba(220,220,220,0.26); z-index:2; color:#fff; text-align:center; border-radius:50%; background: linear-gradient(344deg, rgba(133,130,102,1) 0%, rgba(183,172,48,1) 100%); position:absolute; top:2em; right:2em; width:90px; height:90px; }
.img_box span.cert strong { font-weight:600; line-height:90px; }
.img_box img { position:relative; max-width: fit-content; width: 100%; }

.txt_box { position:relative; text-align:center; margin-bottom:40px; }
.txt_box p { position:relative; display:inline-block; color:#fff; border-radius: 20px; text-align: center; padding: 8px 20px; background: #303E63; }

.info_wrap { position:relative; display:block; border:2px solid #000D30; border-width:2px 0px 2px 0px; }
.info_wrap .info_box { display:flex; width:100%; padding:1em; border-bottom:1px solid #888888; }
.info_wrap .info_box .right { position:relative; display:inline-block; width:30%; }
.info_wrap .info_box .right .tit { font-size: 1.2em; font-weight:600; color:#000D30; }

.info_wrap .info_box .left { width:calc(100% - 20%); }
.info_wrap .info_box .left ul { margin-bottom:15px; }
.info_wrap .info_box .left ul:last-child { margin-bottom:0px; }
.info_wrap .info_box .left ul li.li { padding-bottom:5px; color:#4a4a4a; }
.info_wrap .info_box .left ul li.li::before { content:''; position:relative; display:inline-block; top:-5px; margin-right:8px; width:14px; height:0; background:#888; }
.info_wrap .info_box .left ul li.li p { color:#6A6A6A; margin-left:22px; font-size:15px; padding:3px 0; }
.info_wrap .info_box .left ul li.li p:last-child { padding-bottom:0px; }

.info_wrap .info_box .left ul li.tit { color:var(--c01); font-size:1.1em; font-weight:600; padding-bottom:8px; }
.info_wrap .info_box .left ul li.tit::before { content:''; width:5px; height:5px; top:-4px; margin-right:15px; position:relative; display:inline-block; background:#000D30; }
.info_wrap .info_box .left ul li.tit::before { content:''; width:5px; height:5px; top:-4px; margin-right:15px; position:relative; display:inline-block; background:#000D30; }

/* .item_box {flex:1;} */
/* .item_box .label{max-width: calc(100% - 6em);} */
.item_box {margin:5em 0 2em 0; text-align:center;}
.item_box .label { background:#000d30; top:-50px; border:7px solid #FFF; text-align:center; color:#fff; font-size:1.1em; font-weight:600; padding:1em 2.5em; display:inline-flex; margin:auto; position:relative; justify-content:center; }

.item_box .txt { padding:5em; border-radius:10px; background:#F4F5FB; margin-top:-85px; word-break:keep-all; }
.item_box .txt img { position:relative; max-width:fit-content; width:100%; } 
.item_box .txt ul { position:relative; display:flex; }
.item_box .txt ul li { flex:1; /*height:100%;*/ min-height:auto; background:#fff; padding:2em; margin:0 0 20px 20px; border-radius:20px; }
.item_box .txt ul li strong.tit { position:relative; display:block; border-radius:5px; background:#303E63; padding:1em; color:#fff; margin-bottom:15px; font-weight:600; }
.item_box .txt ul li p { text-align:left; }
.item_box .txt ul li p::before { content:''; width:3px; height:3px; top:-3px; background:#303E63; position:relative; display:inline-block; margin-right:10px; }

.download_btn { /*margin-bottom:50px;*/ }
.download_btn li { position:relative; display:inline-block; margin-bottom:6px; padding:10px 25px; border:1px solid #1D1F22; }
.download_btn li span { position:relative; color:#888888; }
.download_btn li a { position:relative; color:#1D1F22; }
.download_btn li a::after { content:''; position:relative; display:inline-block; margin:0 0 0 8px; top:1px; width:17px; height:15px; background:url('../img/icon_down_small.svg') no-repeat center; }
.download_btn li span::after { content:''; position:relative; display:inline-block; margin:0px 15px; top:3px; width:1px; height:15px; background:#D1D5E3; }
.download_btn  li:hover a { text-decoration:underline; }

.important p { padding-bottom:7px; font-size:.9em; color:#6A6A6A; }
.important p::before { content:''; top:3px; margin-right:8px; width:17px; height:17px; position:relative; display:inline-block; background:url('../img/icon_important.svg')no-repeat center; }

/***********************************************************************************
  layer popup 
************************************************************************************/
.close_popup {width:100%; padding:.8em; border-radius:3px; }
.not_scroll { overflow:hidden!important; width:100%; height:100%; min-height:100%; touch-action:none; } 

.popup_wrap { display:none; position:fixed; top:0; right:0; bottom:0; left:0; z-index:9; } 
.popup_wrap.active { display:block; } 
.popup_wrap .layer_bg { position:absolute; top:0; right:0; bottom:0; left:0; background:rgba(0, 0, 0, 0.5); } 

.popup_wrap .popup { display:flex; flex-direction:column; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); width:94%; max-width:400px; min-width:320px; height:auto; } 
.popup p.title { display:block; padding:.5em .8em; font-size:1.5em; color:#000000; } 
.popup:focus { outline:none; } 
.popup .btngroup { margin-top:0; max-width:100%; padding:.8em; border-top:1px solid #e5e5e5; } 
.popup_cont { border-radius:5px; background:#fff; } 
.popup_cont .cont { display:block; /*display:flex; justify-content:center; align-items:center;*/ padding:2em 1.5em; border-top:1px solid #e5e5e5; text-align:center; } 
.popup_cont .cont img { margin:0 auto; width:100%; height:auto; max-width:fit-content; } 
.popup.nontitle { border-radius:0; } 
.popup.nontitle .popup_cont .cont { border-top:0; } 
.popup .btn_close { position:absolute; width:50px; height:50px; top:-60px; right:-15px; text-indent:-9999px; } 
.popup .btn_close::before, 
.popup .btn_close::after { content:''; position:absolute; right:30%; top:50%; width:30px; height:2px; background:#fff; } 
.popup .btn_close::before { transform:rotate(-45deg); } 
.popup .btn_close::after { transform:rotate(45deg); } 
.popup_cont .cont.no_file { text-align:center !important; }

/* .popup.s { max-width:400px; }
.popup.m { max-width:550px; } */
.popup.l { max-width:700px; }
.popup.xl { max-width:900px; }
/* .popup.xl img { padding-top:1.5em; } */

.popup_cont .tit { position:relative; display:block; text-align:left; font-size:1.13em; padding-bottom:8px; }
.popup_cont .tit p { font-weight:600; }


.list_wrap { position:relative; display:block; border-top:2px solid #000D30; }
.list_wrap .list { display:flex; align-items:center; width:100%; padding:1em; border-bottom:1px solid #888888; }
.list_wrap .list .right { position:relative; display:inline-block; width:30%; text-align:left; }
.list_wrap .list .right .subject { font-size:18px; font-weight:600; color:#000D30; }

.list_wrap .list .left { width:calc(100% - 30%); text-align:left; }
.list_wrap .list .left ul { }
.list_wrap .list .left ul:last-child { margin-bottom:0px; }
.list_wrap .list .left ul li.li { color:#4a4a4a; }
.list_wrap .list .left ul li.li::before { content:''; position:relative; display:inline-block; top:-5px; width:14px; height:1px; background:#888; }
.list_wrap .list .left ul li.li p { color:#6A6A6A; margin-left:22px; font-size:15px; padding:3px 0; }
.list_wrap .list .left ul li.li p:last-child { padding-bottom:0px; }

.list_wrap .list .left ul li.subject { color:var(--c01); font-size:1.1em; font-weight:600; padding-bottom:8px; }
.list_wrap .list .left ul li.subject::before { content:''; width:5px; height:5px; top:-4px; margin-right:15px; position:relative; display:inline-block; background:#000D30; }

/*로케*/
#location {
    /* background-color: rgb(51 51 51 / 0.7); */
    /* margin-top: -50px; */
    position: absolute;
    height: 80px;
    z-index: 1;
    bottom: 0;
    left: 0;
    width: 100%;
}
#location::after {content:'';position: absolute;left:0;top: 0;/* bottom:-50px; */width:100%;height:1px;background:#fff;opacity:30%;animation:lineH 1s both;}

.location_wrap {
    width: 100%;
    max-width: var(--w1600);
    margin: 0 auto;
    font-size: 0;
}

.home_btn_wrap {
    display: inline-block;
    vertical-align: top;
    font-size: 0;
}

.home_btn {
    display: block;
    background-image: url(../img/ico-home.svg);
    /* background-color: #C48B3A; */
    width: 50px;
    height: 100%;
    background-repeat: no-repeat;
    background-position: left;
    position: relative;
}
.home_btn:after{content:'';position: absolute;top: 50%;right: 0;transform: translateY(-50%);height: 20px;border-right: 1px solid #ffffff;opacity: 30%;}

#location ul {
    display: inline-block;
    position: relative;
    /* border-right: 1px solid #696969; */
}


#location ul:after,
#location ul:before {content:'';position:absolute;height: 1px;width: 8px;background: #fff;right: 18px;top: 40px;display: block;transition: all .2s;}

#location ul:after {
    margin-right: 1px;
    transform: rotate(45deg);
}

#location ul:before {
    transform: rotate(-45deg);
    margin-right: -5px;
}

#location ul.on:after {
    transform: rotate(-45deg);
}

#location ul.on:before {
    transform: rotate(45deg);
}





#location ul li{
    width: 280px;
    height: 50px;
    background-color: rgb(51 51 51 / 0.2);
    transition: 0.2s;
}

#location ul li a{
    font-size: 16px;
    font-weight: 500;
    color: #fff;
    display: flex;
    padding: 13px 25px;
    height: 80px;
    align-items: center;
}
#location ul li.active>a,
#location ul li:hover>a{/* font-weight: 700 !important; */}
#location .location_ul {
}
#location .location_ul.on .location_li{height: 80px;}
#location .location_ul.on .location_li:not(:first-child){
    height: 50px;
}
#location .location_ul.on .location_li:not(:first-child)>a{
    padding: 3px 25px;
    font-size: 14px;
    font-weight: 400;
    height: 50px;
}
#location .location_ul2.on .location_li2{
    height: 80px;
}
#location .location_ul2.on .location_li2:not(:first-child){
    height: 50px;
}
#location .location_ul2.on .location_li2:not(:first-child)>a{
    padding: 3px 25px;
    font-size: 14px;
    font-weight: 400;
    height: 50px;
}
#location .location_ul3.on .location_li3{
    height: 50px;

}
#location .location_ul3.on .location_li3:not(:first-child){
    height: 30px;
}
#location .location_ul3.on .location_li3:not(:first-child)>a{
    padding: 3px 25px;
    font-size: 14px;
    font-weight: 400;
}
#location ul.on li:not(:first-child){background-color: rgb(51 51 51 / 0.2);}
#location ul.on li:first-child {background-color:transparent;height: 80px;}
#location .location_li {
    height: 0;
    overflow: hidden;
    
}

#location .location_li.li_plus {}

#location .location_li.active {
    display: inline-block;
    /* position: relative; */
    height: 100%;
    background-color: transparent;
}

#location .location_ul2 {
    position: absolute;
    top: 0;
    left: 100%;
    display: none;
}
#location .location_li.active .location_ul2{
    display: inline-block;
}
#location .location_li2 {
    height: 0;
    overflow: hidden;
}

#location .location_li2.li_plus {}

#location .location_ul.on .location_ul2:not(.on) .location_li2.active,
#location .location_li2.active {
    background-color: transparent;
    height: 50px;
}

#location .location_ul3 {
    position: absolute;
    top: 0;
    left: 100%;
    display: none;
}
#location .location_li2.active .location_ul3{
    display: inline-block;
}
#location .location_li3 {
    height: 0;
    overflow: hidden;
}

#location .location_ul2.on .location_ul3:not(.on) .location_li3.active,
#location .location_li3.active {
    background-color: transparent;
    height: 50px;
}


/***********************************************************************************
mediaquery
************************************************************************************/
@media screen and (max-width: 1716px) {
    #header #gnb > ul > li > a {line-height: 81px; font-size:16px; padding:0 32px; }
    #header #logo{top: 19px;z-index: 9}
    #header #gnb > ul > li .depth_2{top: 80px}
    /*#header #gnb > ul > li:hover .depth_2{height: 280px}*/
    #header #gnb > ul > li .depth_2 > div.img img{height: 280px;min-width: 100%}
    #header #gnb > ul > li .depth_2 > div.txt ul li a{font-size:15px; /*line-height: 43px;*/}
    #header #gnb > ul > li .depth_2 > div.img .txt strong:after{width: 235px;}
    #header #gnb > ul > li .depth_2{background-size: auto 280px}
    /* #header #gnb > ul > li .depth_2 > div.txt{padding-top: 26px} */
    #header #gnb > ul > li .depth_2 > div{ width:46%; }
}
@media screen and ( max-width : 1700px ) {}
@media screen and ( max-width : 1680px ) {
    footer .footer .sub { padding: 0 !important; }
}
@media screen and ( max-width : 1400px ) {
    #header #gnb{ display:none; }
    #header{ height:85px; }
    #header .menu_open{ display:block; position:absolute; right:20px; top:30px; }
	#header .menu_open button{ background:none; padding-top:2px; padding-left:20px; }
	#header .menu_open i.line01{ margin-bottom:5px; }
    #header .menu_open i{ display:block; width:26px; height:1px; background:#fff; }
    #header .menu_open{ top:34px }
    #header .mo_menu .gnb1 > ul > li > a{ position:relative; }
}
@media (max-width: 1540px) {
    #header #gnb > ul > li > a{line-height:71px; padding:0 32px; }
    #header #gnb > ul > li > a{ padding: 0 28px; }
    #header #gnb > ul > li .depth_2{top: 71px}
    #header #gnb > ul > li .depth_2 > div.txt ul li a{ font-size: 14.4px; /*line-height: 40px;*/ }
    /*#header #gnb > ul > li:hover .depth_2{ height: 235px; }*/
    #header #gnb > ul > li:nth-child(6):hover .depth_2 { height: 260px; }
}
@media screen and ( max-width : 1280px ) {

    footer .footer { margin-top:100px; }
    /* board */
    .bo_li .num,
    .bo_li .hit,
    .bo_li .division,
    .bo_li .preview,
    .bo_li .download  { width:60px; }
    .bo_li .date { width:120px; }
    table.noline tbody td { border-top:0; }
    table tbody tr td .txt_li01 li::before { top:9px; }

    /* 페이징 */
    a.page_group { line-height:2.6; }
}
@media screen and ( max-width : 1024px ) {
    /* 게시판 */
    .bo_li .name { width:80px; }
    .bo_li .part { width:130px; }

    .tip_box2 ul { padding:1em; }
    .tip_box2 ul li { }
    .tip_box2 ul li>span { display:block; text-align:center; margin-bottom:8px; }
}
@media screen and ( max-width : 946px ) {
    #header { height: 70px; }
    #header #logo{ left:20px; top:18px; }
    #header #logo img{ height:32px}
    #header .menu_open{ top:30px; }

    .item_box .txt { padding:5em 3em; }
    .item_box .txt ul { display:block; }
    .item_box .txt ul li { margin:0 0 20px 0px; }
}
@media screen and ( max-width : 800px ) {
    .gotop { width:50px; height:50px; right:30px; bottom:30px; }
    footer .footer { padding:0 16px 0 16px; }
    .footer .bot { display:block; }
    .footer .bot .logo { margin-bottom:20px; }
    .footer .bot .txt { padding-left:0; }

    .lable span:last-child { font-size:18px; }
    .img_box { margin-bottom:20px; }
    .lable { margin-bottom:20px; }
}
@media screen and ( max-width : 768px ) {
    table tbody tr:hover { background:#fff; }
    /* bo_top */
    .bo_top .search .inner { max-width:350px; }
    .bo_top_center .search .inner { max-width:100%; }
    
    /* board */
    .bo_li .hit,
    .bo_li .state,
    .bo_li .division,
    .bo_li .preview,
    .bo_li .download, 
    .bo_li .name,
    .bo_li .part,
    .bo_li .date { width:auto; }
    .table_wrap .bo_li thead tr th,
    .table_wrap .bo_li tbody tr th,
    .table_wrap .bo_li tbody tr td { height:auto; line-height:normal; padding:0 !important; }
    
    .bo_li .name,
    .bo_li .state,
    .bo_li .part,
    .bo_li .division,
    .bo_li .date,
    .bo_li .hit { margin-right:5px; }
    
    .bo_li .num { display:none; }
    .bo_li .part { font-weight:600; color:#001364; }

    /* 테이블 */
    table { font-size:0.95em; }
    .tw_s { width:80px; }
    .tw_m { width:130px; }
    .tw_l { width:150px; }
    .tw_xl { width:200px; }

    table tbody tr td .txt_li01 li::before { top:8px; }
    table tbody td.subject > a { display:block; }
    .table_wrap table tbody th,
    .table_wrap table tbody td,
    .table_wrap table thead th,
    .table_wrap table thead td,
    .table_wrap.scroll table thead th,
    .table_wrap.scroll table thead td,
    .table_wrap.scroll table tbody th,
    .table_wrap.scroll table tbody td { padding:10px !important; } 
    .table_scroll_tip { margin-bottom:5px; font-size:0.886em; color:#707070; text-align:left; }

    .bo_v .v_cont table,
    .business .busi_wrap table { width:auto !important; }
    .bo_v .v_cont table thead th,
    .bo_v .v_cont table thead td,
    .bo_v .v_cont table tbody th,
    .bo_v .v_cont table tbody td,
    .business .busi_wrap table thead th, 
    .business .busi_wrap table thead td, 
    .business .busi_wrap table tbody th, 
    .business .busi_wrap table thead td { width:auto !important; height:auto !important; }

    .bo_li colgroup,
    .bo_li thead { display:none; } 
    .bo_li tbody { border-top:1px solid #d7d7d7; } 
    .bo_li tbody tr { display:grid; /*display:block*/; overflow:hidden; border-bottom:1px solid #d7d7d7; padding:21px 0; } 
    .bo_li tbody tr td { padding: 0; border: 0; } 
    .bo_li tbody tr td.subject { display:block; width:100% !important; margin-bottom:5px; text-align:left; font-size:1.063em; } 
    .bo_li tbody tr td.date,
    .bo_li tbody tr td.hit,
    .bo_li tbody tr td.state,
    .bo_li tbody tr td.division,
    .bo_li tbody tr td.part,
    .bo_li tbody tr td.name { display:block; text-align:left; margin-bottom:5px; }
    .bo_li tbody tr td.preview,
    .bo_li tbody tr td.download { display:inline-block; margin-top:10px; text-align:left; color:#595959; vertical-align:middle; } 
    .bo_li tbody tr td.preview button,
    .bo_li tbody tr td.download button { background:#fff; border-color:#001363; color:#001363; font-weight:500; }
    .bo_li tbody tr td.preview.no_file,
    .bo_li tbody tr td.download.no_file { display:none; }
    .bo_li tbody tr td.name::before { content:'작성자 : '; } 
    .bo_li tbody tr td.hit::before { content:'조회수 : '; } 
    .bo_li tbody tr td.division::before { content:'구분 : '; } 
    .bo_li tbody tr td.date::before { content:'등록일 : '; } 
    .bo_li .state { padding:0; border-radius:0; border:0; background:0; font-size:unset; font-weight:600;}
    .bo_li .state01 { color:#001364; }
    .bo_li .state02 { color:#707070; }
    
    .bo_download,
    .bo_preview { width:auto; height:auto; padding:.5em .7em; border-radius:0; font-size:unset; }
    .bo_download::before,
    .bo_preview::before { content:none; }
    .bo_download:hover,
    .bo_preview:hover,
    .bo_download:focus, 
    .bo_preview:focus { border-color:#d7d7d7; background:0; }
    .bo_download:focus:before,
    .bo_download::before,
    .bo_download:hover:before { background-position:-41px -45px; }
    .bo_preview::before,
    .bo_preview:focus:before,
    .bo_preview:hover::before { background-position:-56px -46px; }

    /* 게시판 페이징 */
    .pagination { margin:30px 0; }
        
    /* view btn */
    .btn_list { padding: 1.25em 6em; }

    .info_wrap .info_box { display:block; }
    .info_wrap .info_box .right { width:100%; margin-bottom:10px; font-weight:700; font-size: 1.1em; }

    /* tip box, txt */
    .h4_wrap h4 { font-size:18px; color:#1E2633; font-weight:700; }


    /* .tab_depth li { padding:15px 0; } */
    .product .tab_depth { border-bottom:none; }
    .product .tab_depth.col07 li { border-bottom:1px solid #D1D5E3; }
    .product .tab_depth.col07 li { width:50%; }

    .example_nav li { width:100px; height:60px; }

    .sub { padding:16px; }
    .sub_top {max-height: 266px;height: 266px;}
    .sub_top .txtbox .txt { text-align:center; }
    .sub_top .txtbox .txt h2 { font-size:2.5em; }
    .sub_top .wrap_wide { justify-content:space-evenly; padding-top:20px; }
    .sub_top::before { height:70px; bottom:-35px; }

    .sub_head { padding:1em 0; }
    .sub_head .sub_title h2 { font-size:1.3em; }

    .h4_wrap h4.txt2::before { top:6px; }

    /* q코드정보 */
    .gallery_li.col03 { grid-template-columns:repeat(2,1fr); grid-column-gap:1.5rem; grid-row-gap:3rem; }

    /* 고객 문의 */
    textarea.input_text  { padding:15px; }
    .contact .contact_wrap { padding:3em 2em; }
    .contact .contact_wrap .tit { font-size:2em; }
    .contact .contact_wrap .input_wrap .box { display:block; padding-bottom:0; }
    .contact .contact_wrap .input_wrap .box .left,
    .contact .contact_wrap .input_wrap .box .right { padding:0 0 20px 0; width:100%; }


    .selectbox { display:block; }
    .selectbox dl { display:block; }
    .selectbox dl dt { margin:6px 0; }
    .selectbox dl dd { margin:0; }
    .selectbox dl.nocontent dd { display:none; }

    .certification .cont .li .txt .tit { font-size:1em; }

    .tip_box2 p { font-size:1em; }

    .item_box .txt { padding:3.8em 20px; }
    .item_box .txt ul li { border-radius:10px; }

    /*로케*/
    #location {
        /* background-color: rgb(51 51 51 / 0.7); */
        /* margin-top: -50px; */
        /* position: relative; */
        height: 60px;
        z-index: 1;
    }

    .location_wrap {
        width: 100%;
        max-width: 1240px;
        margin: 0 auto;
        font-size: 0;
    }

    .home_btn_wrap {
        display: inline-block;
        vertical-align: top;
        font-size: 0;
    }

    .home_btn {
        display: block;
        background-image: url(../img/ico-home.svg);
        /* background-color: #C48B3A; */
        width: 70px;
        height: 60px;
        background-position: center;
        padding: 0 10px;
    }

    #location ul {
        display: inline-block;
        position: relative;
        border-right: 1px solid #696969;
    }


    #location ul:after,
    #location ul:before {content:'';position:absolute;height: 1px;width: 8px;background: #fff;right: 18px;top: 30px;display: block;transition: all .2s;}

    #location ul:after {
        margin-right: 1px;
        transform: rotate(45deg);
    }

    #location ul:before {
        transform: rotate(-45deg);
        margin-right: -5px;
    }

    #location ul.on:after {
        transform: rotate(-45deg);
    }

    #location ul.on:before {
        transform: rotate(45deg);
    }





    #location ul li{
        width: 220px;
        height: 50px;
        background-color: rgb(51 51 51 / 0.7);
        transition: 0.2s;
    }

    #location ul li a{
        font-size: 16px;
        font-weight: 500;
        color: #fff;
        /* display: block; */
        padding: 13px 25px;
        height: 60px;
    }
    #location ul li.active>a,
    #location ul li:hover>a{/* font-weight: 700 !important; */}
    #location .location_ul {width: calc(100% - 70px);}
    #location .location_ul.on .location_li{ height: 50px;}
    #location .location_ul.on .location_li:not(:first-child){
        height: 30px;
    }
    #location .location_ul.on .location_li:not(:first-child)>a{
        padding: 3px 25px;
        font-size: 14px;
        font-weight: 400;
    }
    #location .location_ul2.on .location_li2{
        height: 60px;
    }
    #location .location_ul2.on .location_li2:not(:first-child){
        height: 30px;
    }
    #location .location_ul2.on .location_li2:not(:first-child)>a{
        padding: 3px 25px;
        font-size: 14px;
        font-weight: 400;
        height: 30px;
    }
    #location .location_ul3.on .location_li3{
        height: 50px;

    }
    #location .location_ul3.on .location_li3:not(:first-child){
        height: 30px;
    }
    #location .location_ul3.on .location_li3:not(:first-child)>a{
        padding: 3px 25px;
        font-size: 14px;
        font-weight: 400;
    }
    #location ul.on li:not(:first-child){/* background-color: rgb(51 51 51 / 0.7); */}
    #location ul.on li:first-child {background-color:transparent}
    #location .location_li {
        height: 0;
        overflow: hidden;
        width: 100%;
    }

    #location .location_li.li_plus {}

    #location .location_li.active {
        display: inline-block;
        /* position: relative; */
        height: 60px;
        background-color: transparent;
    }

    #location .location_ul2 {
        position: absolute;
        top: 0;
        left: 100%;
        display: none;
        width: 100%;
    }
    #location .location_li.active .location_ul2{
        display: inline-block;
    }
    #location .location_li2 {
        height: 0;
        overflow: hidden;
        width: 100%;
    }

    #location .location_li2.li_plus {}

    #location .location_ul.on .location_ul2:not(.on) .location_li2.active,
    #location .location_li2.active {
        background-color: transparent;
        height: 50px;
    }

    #location .location_ul3 {
        position: absolute;
        top: 0;
        left: 100%;
        display: none;
        width: 100%;
    }
    #location .location_li2.active .location_ul3{
        display: inline-block;
    }
    #location .location_li3 {
        height: 0;
        overflow: hidden;
        width: 100%;
    }

    #location .location_ul2.on .location_ul3:not(.on) .location_li3.active,
    #location .location_li3.active {
        background-color: transparent;
        height: 50px;
    }
    #location .li_plus>a:after{content:'>'}

    #location.loca_lv_1 {}

    #location.loca_lv_2 {}
    #location.loca_lv_2 .location_li{width:0}
    #location.loca_lv_2 .location_li>a{display: none;}
    #location.loca_lv_2 .location_ul2{left:0}
    #location.loca_lv_2 .location_ul:before,
    #location.loca_lv_2 .location_ul:after{display:none}

    #location.loca_lv_3 {}
    #location.loca_lv_3 .location_li{width:0}
    #location.loca_lv_3 .location_li>a{display: none;}
    #location.loca_lv_3 .location_ul2{left:0}
    #location.loca_lv_3 .location_li2{width:0}
    #location.loca_lv_3 .location_li2>a{display: none;}
    #location.loca_lv_3 .location_ul3{left:0}
    #location.loca_lv_3 .location_ul:before,
    #location.loca_lv_3 .location_ul:after,
    #location.loca_lv_3 .location_ul2:before,
    #location.loca_lv_3 .location_ul2:after{display:none}


}
@media screen and ( max-width : 600px ) {
    /* bo_top */
    .bo_util { display:block; } 
    .post_num { margin-bottom:5px; } 
    .bo_search_wrap { display:block; } 
    .bo_search { max-width:100%; } 

    .bo_li { margin-top:.5em; }
    .bo_li .state03 { font-size:1.05em; } /* 진행중 */
    .bo_li .state04 { font-size:1.05em; } /* 마감 */

    /* 테이블 */
    table tbody td.subject > a { line-height:1.7; white-space:normal; }
    .ip_rnd .table_wrap table { min-width:400px !important; }
    .info .table_wrap table { min-width:560px !important; }
    .info.commi .table_wrap table .tw_l { width:110px; }
    
    .table_wrap table tbody th, 
    .table_wrap table tbody td, 
    .table_wrap table thead th, 
    .table_wrap table thead td, 
    .table_wrap.scroll table thead th, 
    .table_wrap.scroll table thead td,
    .table_wrap.scroll table tbody th, 
    .table_wrap.scroll table tbody td { padding:6px !important; word-break:keep-all; }
    .table_wrap table tbody th *, 
    .table_wrap table tbody td *, 
    .table_wrap table thead th *, 
    .table_wrap table thead td *, 
    .table_wrap.scroll table thead th *, 
    .table_wrap.scroll table thead td *,
    .table_wrap.scroll table tbody th *, 
    .table_wrap.scroll table tbody td * { word-break:keep-all; }
    
    /* 게시판 */
    .bo_v ul.bo_info > li .field_name { width:80px; }
    .bo_v ul.bo_info > li .field_cont { width:calc(100% - 80px); } 
    .bo_v ul.bo_info .info_file .btn { font-size:.886em; }
    /* .bo_v .v_cont { padding:em 0; } */
    
    /* 게시판 페이징 */
    .pass { width:35px; height:35px; }
    a.page_group { width:35px; height:35px; line-height:2.5; }
    /* .page_control .last:before,
    .page_control .next:before,
    .page_control .prev:before,
    .page_control .first:before { top:6px; } */

    .product_table { max-width:600px !important; }
    .img_box { padding:3em; margin-bottom:30px; border-radius:20px; }
    .example_cont>li { padding:3em; }

    .bo_top { display:block; }
    .bo_top .post { float:none; margin-bottom:10px; }
    .bo_top .search { float:none; width:100%; text-align:left; }
    .bo_top .search .search_wrap { max-width:100%; }

    .footer .bot .txt span { position:relative; display:block; }
}
@media screen and ( max-width : 520px ) {
    /* 첨부파일 */
    .bo_v .field_cont .info_file { display:block; }
    .bo_v .field_cont .info_file .right { margin-top:20px; }

    .btn_list { padding:1.2em 4em; }
}

@media screen and ( max-width : 480px ) {
    /* bo_top */
    .bo_top_center .search .inner button { top:0; }

    /* 테이블 */
    table tbody tr td .txt_li01 li::before { top:7px; }
    table tbody td.subject > a { max-width:100%; }

    /* 게시판 */
    .bo_v ul.bo_info > li.bo_v_atch { display:block; padding:10px 0 15px 0; }
    .bo_v ul.bo_info > li.bo_v_atch .field_name,
    .bo_v ul.bo_info > li.bo_v_atch .field_cont { display:block; width:100%; }  
    .bo_v ul.bo_info > li.bo_v_atch .field_name { padding-bottom:5px; }
    .bo_v ul.bo_info > li.bo_v_atch .field_cont { padding-top:0; }
    .bo_v ul.bo_info > li .field_name,
    .bo_v ul.bo_info > li .field_cont { padding:6px; }
    .bo_v ul.bo_info > li .field_name { font-weight:600; } 
    .bo_v ul.bo_info > li .field_cont { color:#707070; }
    .bo_v ul.bo_info .info_file .file_btn_wrap { display:block; }
    .btn.btn_down, 
    .btn.btn_show { padding:.5em .9em; }
    .bo_v.gallery_v .img.noimg span { font-size:1em; } 

    /* bo_top */
    .bo_top_center .search .select_wrap { max-width:170px; }

    /* 게시판 페이징 */
    .pass { width:24px; }
    a.page_group { width:35px; height:35px; line-height:2.7; font-size:.95em; }
    .page_control { margin:0; } 
    .page_control .last,
    .page_control .next,
    .page_control .prev,
    .page_control .first { background:0; }

        /*로케*/
        #location {
            /* background-color: rgb(51 51 51 / 0.7); */
            /* margin-top: -50px; */
            /* position: relative; */
            height: 50px;
            z-index: 1;
        }
    
        .location_wrap {
            width: 100%;
            max-width: 1240px;
            margin: 0 auto;
            font-size: 0;
        }
    
        .home_btn_wrap {
            display: inline-block;
            vertical-align: top;
            font-size: 0;
        }
    
        .home_btn {
            display: block;
            background-image: url(../img/ico-home.svg);
            /* background-color: #C48B3A; */
            width: 50px;
            height: 50px;
            background-position: center;
            padding: 0;
        }
    
        #location ul {
            display: inline-block;
            position: relative;
            border-right: 1px solid #696969;
        }
    
    
        #location ul:after,
        #location ul:before {content:'';position:absolute;height: 1px;width: 8px;background: #fff;right: 18px;top: 25px;display: block;transition: all .2s;}
    
        #location ul:after {
            margin-right: 1px;
            transform: rotate(45deg);
        }
    
        #location ul:before {
            transform: rotate(-45deg);
            margin-right: -5px;
        }
    
        #location ul.on:after {
            transform: rotate(-45deg);
        }
    
        #location ul.on:before {
            transform: rotate(45deg);
        }
    
    
    
    
    
        #location ul li{
            width: 220px;
            height: 50px;
            background-color: rgb(51 51 51 / 0.7);
            transition: 0.2s;
        }
    
        #location ul li a{
            font-size: 16px;
            font-weight: 500;
            color: #fff;
            /* display: block; */
            padding: 13px 25px;
            height: 50px;
        }
        #location ul li.active>a,
        #location ul li:hover>a{/* font-weight: 700 !important; */}
        #location .location_ul {width: calc(100% - 50px);}
        #location .location_ul.on .location_li{ height: 50px;}
        #location .location_ul.on .location_li:not(:first-child){
            height: 30px;
        }
        #location .location_ul.on .location_li:not(:first-child)>a{
            padding: 3px 25px;
            font-size: 14px;
            font-weight: 400;
        }
        #location .location_ul2.on .location_li2{
            height: 50px;
        }
        #location .location_ul2.on .location_li2:not(:first-child){
            height: 30px;
        }
        #location .location_ul2.on .location_li2:not(:first-child)>a{
            padding: 3px 25px;
            font-size: 14px;
            font-weight: 400;
            height: 30px;
        }
        #location .location_ul3.on .location_li3{
            height: 50px;
    
        }
        #location .location_ul3.on .location_li3:not(:first-child){
            height: 30px;
        }
        #location .location_ul3.on .location_li3:not(:first-child)>a{
            padding: 3px 25px;
            font-size: 14px;
            font-weight: 400;
        }
        #location ul.on li:not(:first-child){/* background-color: rgb(51 51 51 / 0.7); */}
        #location ul.on li:first-child {background-color:transparent}
        #location .location_li {
            height: 0;
            overflow: hidden;
            width: 100%;
        }
    
        #location .location_li.li_plus {}
    
        #location .location_li.active {
            display: inline-block;
            /* position: relative; */
            height: 60px;
            background-color: transparent;
        }
    
        #location .location_ul2 {
            position: absolute;
            top: 0;
            left: 100%;
            display: none;
            width: 100%;
        }
        #location .location_li.active .location_ul2{
            display: inline-block;
        }
        #location .location_li2 {
            height: 0;
            overflow: hidden;
            width: 100%;
        }
    
        #location .location_li2.li_plus {}
    
        #location .location_ul.on .location_ul2:not(.on) .location_li2.active,
        #location .location_li2.active {
            background-color: transparent;
            height: 50px;
        }
    
        #location .location_ul3 {
            position: absolute;
            top: 0;
            left: 100%;
            display: none;
            width: 100%;
        }
        #location .location_li2.active .location_ul3{
            display: inline-block;
        }
        #location .location_li3 {
            height: 0;
            overflow: hidden;
            width: 100%;
        }
    
        #location .location_ul2.on .location_ul3:not(.on) .location_li3.active,
        #location .location_li3.active {
            background-color: transparent;
            height: 50px;
        }
        #location .li_plus>a:after{content:'>'}
    
        #location.loca_lv_1 {}
    
        #location.loca_lv_2 {}
        #location.loca_lv_2 .location_li{width:0}
        #location.loca_lv_2 .location_li>a{display: none;}
        #location.loca_lv_2 .location_ul2{left:0}
        #location.loca_lv_2 .location_ul:before,
        #location.loca_lv_2 .location_ul:after{display:none}
    
        #location.loca_lv_3 {}
        #location.loca_lv_3 .location_li{width:0}
        #location.loca_lv_3 .location_li>a{display: none;}
        #location.loca_lv_3 .location_ul2{left:0}
        #location.loca_lv_3 .location_li2{width:0}
        #location.loca_lv_3 .location_li2>a{display: none;}
        #location.loca_lv_3 .location_ul3{left:0}
        #location.loca_lv_3 .location_ul:before,
        #location.loca_lv_3 .location_ul:after,
        #location.loca_lv_3 .location_ul2:before,
        #location.loca_lv_3 .location_ul2:after{display:none}
}
@media screen and ( max-width : 340px ) {}