@charset "utf-8";

/* 폰트 불러오기 Pretendard
Copyright (c) 2021 Kil Hyung-jin, with Reserved Font Name Pretendard.
https://github.com/orioncactus/pretendard

This Font Software is licensed under the SIL Open Font License, Version 1.1.
This license is copied below, and is also available with a FAQ at:
http://scripts.sil.org/OFL
*/

@font-face {
	font-family: 'Pretendard';
	font-weight: 900;
	font-display: swap;
	src: local('Pretendard Black'), url('../fonts/woff2-subset/Pretendard-Black.subset.woff2') format('woff2'), url('../fonts/woff-subset/Pretendard-Black.subset.woff') format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 800;
	font-display: swap;
	src: local('Pretendard ExtraBold'), url('../fonts/woff2-subset/Pretendard-ExtraBold.subset.woff2') format('woff2'), url('../fonts/woff-subset/Pretendard-ExtraBold.subset.woff') format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 700;
	font-display: swap;
	src: local('Pretendard Bold'), url('../fonts/woff2-subset/Pretendard-Bold.subset.woff2') format('woff2'), url('../fonts/woff-subset/Pretendard-Bold.subset.woff') format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 600;
	font-display: swap;
	src: local('Pretendard SemiBold'), url('../fonts/woff2-subset/Pretendard-SemiBold.subset.woff2') format('woff2'), url('../fonts/woff-subset/Pretendard-SemiBold.subset.woff') format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 500;
	font-display: swap;
	src: local('Pretendard Medium'), url('../fonts/woff2-subset/Pretendard-Medium.subset.woff2') format('woff2'), url('../fonts/woff-subset/Pretendard-Medium.subset.woff') format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 400;
	font-display: swap;
	src: local('Pretendard Regular'), url('../fonts/woff2-subset/Pretendard-Regular.subset.woff2') format('woff2'), url('../fonts/woff-subset/Pretendard-Regular.subset.woff') format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 300;
	font-display: swap;
	src: local('Pretendard Light'), url('../fonts/woff2-subset/Pretendard-Light.subset.woff2') format('woff2'), url('../fonts/woff-subset/Pretendard-Light.subset.woff') format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 200;
	font-display: swap;
	src: local('Pretendard ExtraLight'), url('../fonts/woff2-subset/Pretendard-ExtraLight.subset.woff2') format('woff2'), url('../fonts/woff-subset/Pretendard-ExtraLight.subset.woff') format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 100;
	font-display: swap;
	src: local('Pretendard Thin'), url('../fonts/woff2-subset/Pretendard-Thin.subset.woff2') format('woff2'), url('../fonts/woff-subset/Pretendard-Thin.subset.woff') format('woff');
}

/* 초기화 */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, address, big, cite, code, del, dfn, em, font, img, ins, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, dl, dt, dd, ol, ul, li, fieldset, form, span, legend, table, caption, tbody, tfoot, thead, tr, th, td, button {margin:0;padding:0;border:0;}

ol, ul, li, dl, dt, dd {list-style:none;margin:0;padding:0;}
a, a:link, a:visited, a:active { text-decoration: none; }
table {border-spacing:0;border-collapse: collapse;}
img { -ms-interpolation-mode: bicubic; vertical-align: top; max-width: 100%;}
select { color:#555; vertical-align:middle; padding: 5px; }
input { color:#555; vertical-align:middle; }
input[type='text'],input[type='password'],input[type='submit'],input[type='search'] {-webkit-appearance:none; border-radius:0}
input:checked[type='checkbox'] {background-color:#666; -webkit-appearance:checkbox}
button,input[type='button'],input[type='submit'],input[type='reset'],input[type='file'] {-webkit-appearance:button; border-radius:0}
input[type='search']::-webkit-search-cancel-button {-webkit-appearance:none}
h1, h2, h3, h4, h5, h6{font-weight:normal;font-size:1em;}
button { background: none; cursor: pointer; }
textarea { resize: none; }
input, textarea { font-family: Pretendard; }
input:focus::placeholder { color: transparent; }

* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
a, button { -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; }
html, body { height: 100%; }
.body_wrap { font-size: 15px; line-height:1.4; font-family: Pretendard, HelveticaNeue-Light, AppleSDGothicNeo-Light, Arial, sans-serif; color:#333; min-height: 100%; height: auto !important; position: relative; max-width: 1920px; margin: 0 auto; padding-bottom: 160px; }
.body_wrap.fixed { position: fixed; width: 100%; }
:focus { outline: none; }

.top { position: fixed; top: 0; left: 0; width: 100%; height: 80px; z-index: 555; border-bottom: 1px solid rgba(255, 255, 255, 0.1); transition: all 0.3s ease; background-color: transparent; display: flex; justify-content: space-between; }

.top h1 { margin-left: 30px; margin-top: 16px; }
.top h1 a { display: block; width: 135px; height: 42px; background: url(../images/logo_wh.png) center no-repeat; background-size: auto 100%; }

.gum { height: 30px; padding-top: 20px; margin-right: 30px; }
.gum li { display: inline-block; padding-left: 10px; margin-left: 6px; position: relative; }
.gum li a { display: inline-block; font-size: 14px; font-weight: 300; line-height: 30px; color: #fff; }
.gum li a:hover { color: #222; }

.gnb > li { display: inline-block; position: relative; padding: 0 86px; }
.gnb > li > a { display: block; height: 80px; line-height: 80px; font-size: 20px; font-weight: 700; color: #fff; position: relative; letter-spacing: -1px; }
.gnb > li > a::after { content: ""; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); width: 0; height: 4px; background-color: #222; transition: all 0.3s ease-in-out; }
.gnb > li > a:hover { color: #222; }
.gnb > li > a:hover::after { width: 100%; }
.gnb > li > a.selected::after { width: 100%; }

.top:hover { background-color: #fff; border-bottom: 1px solid rgba(0, 0, 0, 0.2); }
.top:hover h1 a { background-image: url(../images/logo_bk.png); }
.top:hover .gum li a { color: #222; }
.top:hover .gnb > li > a { color: #222; }
.top:hover .gnb > li > a.selected::after { background-color: #222; }
.top.scrolled { background-color: #fff; border-bottom: 1px solid rgba(0, 0, 0, 0.2); }
.top.scrolled h1 a { background-image: url(../images/logo_bk.png); }
.top.scrolled .gum li a { color: #222; }
.top.scrolled .gnb > li > a { color: #222; }
.top.scrolled .gnb > li > a.selected::after { background-color: #222; }
.top.bg_white { background-color: #fff; border-bottom: 1px solid rgba(0, 0, 0, 0.2); }
.top.bg_white h1 a { background-image: url(../images/logo_bk.png); }
.top.bg_white .gum li a { color: #222; }
.top.bg_white .gnb > li > a { color: #222; }
.top.bg_white .gnb > li > a.selected::after { background-color: #222; }

.gnb_sub_bg { display: none; position: absolute; top: 80px; left: 0; width: 100%; height: 220px; overflow: hidden; box-shadow: 1px 5px 10px rgba(0, 0, 0, 0.3); background-color: #fff; }
.gnb_sub { display: none; position: absolute; top: 80px; left: 50%; transform: translateX(-50%); padding: 15px 0; z-index: 1; text-align: center; }
.gnb_sub > li > a { display: inline-block; font-size: 17px; line-height: 36px; color: #222; position: relative; margin-bottom: 10px; }
.gnb_sub > li > a::after { content: ""; position: absolute; bottom: 3px; left: 50%; transform: translateX(-50%); width: 0; height: 1px; background-color: #222; transition: all 0.3s ease-in-out; }
.gnb_sub > li > a:hover::after { width: 100%; }
.gnb_sub > li > a.selected::after { width: 100%; }

.footer { position: absolute; bottom: 0; left: 0; width: 100%; background-color: #262626; z-index: 222; height: 160px; padding: 40px 0 0 260px; }
.footer_menu { padding-bottom: 10px; }
.footer_menu a { display: inline-block; position: relative; font-size: 16px; font-weight: 700; color: #fff; opacity: 0.9; }
.footer_menu a:hover { opacity: 1; }
.footer p { font-size: 14px; color: #fff; line-height: 20px; opacity: 0.5; }
.footer .logo { position: absolute; top: 50%; transform: translateY(-50%); left: 60px; width: 135px; height: 42px; background: url(../images/logo_wh.png) 0 0 no-repeat; opacity: 0.5; }
.footer select { position: absolute; top: 76px; right: 200px; padding-left: 15px; width: 170px; height: 42px; font-size: 13px; color: #fff; background-color: #000; border: none; border-radius: 999px;  }
#go_top { display: none; position: fixed; bottom: 20px; right: 20px; width: 40px; height: 40px; opacity: 0.7; }
#go_top.active { display: block; }
#go_top:hover { opacity: 1; }

.container { position: relative; }

/* main */
.main_banner { position: relative; overflow: hidden; }
.main_slide li { height: 648px; }
.main_slide_01 { background: url(../images/main_banner_01.jpg) center no-repeat; background-size: cover; }
.main_slide_02 { background: url(../images/main_banner_02.jpg) center no-repeat; background-size: cover; }
.main_slide_03 { background: url(../images/main_banner_03.jpg) center no-repeat; background-size: cover; }
.main_slide_04 { background: url(../images/main_banner_04.jpg) center no-repeat; background-size: cover; }

.main_banner_txt { position: absolute; top: 215px; left: 0; width: 100%; z-index: 11; }
.main_banner_txt h2 { font-size: 80px; font-weight: 800; color: #fff; line-height: 1.2; letter-spacing: -1px; max-width: 1400px; margin: 0 auto; }
.main_banner_txt p { font-size: 28px; color: #fff; max-width: 1400px; margin: 0 auto; }

.main_menu { position: absolute; bottom: 0; left: 50%; margin-left: -700px; width: 1400px; z-index: 22; display: flex; align-items: flex-end; }
.main_menu li { width: 25%; height: 80px; overflow: hidden; transition: all 0.3s ease-out; }
.main_menu li:hover { height: 240px; }
.main_menu .main_menu_01 { background: #CA6C81 url(../images/icon01.png) 10px 10px no-repeat; }
.main_menu .main_menu_02 { background: #5281E5 url(../images/icon02.png) 10px 10px no-repeat;; }
.main_menu .main_menu_03 { background: #5B9A81 url(../images/icon03.png) 10px 10px no-repeat;; }
.main_menu .main_menu_04 { background: #956CBE url(../images/icon04.png) 10px 10px no-repeat;; }
.main_menu .main_menu_01:hover { background: #CA6C81 url(../images/icon01_on.png) right top no-repeat; }
.main_menu .main_menu_02:hover { background: #5281E5 url(../images/icon02_on.png) right top no-repeat; }
.main_menu .main_menu_03:hover { background: #5B9A81 url(../images/icon03_on.png) right top no-repeat; }
.main_menu .main_menu_04:hover { background: #956CBE url(../images/icon04_on.png) right top no-repeat; }
.main_menu li a { display: block; position: relative; height: 240px; }
.main_menu li a h3 { height: 80px; line-height: 60px; padding: 10px 0 10px 90px; position: relative; z-index: 22; }
.main_menu li a h3 span { display: inline-block; font-size: 20px; line-height: 30px; font-weight: 600; color: #222; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-wrap: break-word; max-height: 60px; width: 100%; padding-right: 10px; }
.main_menu li a p { padding-left: 40px; position: relative; z-index: 22; font-size: 16px; color: #222; font-weight: 500; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; word-wrap: break-word; line-height: 24px; height: 72px; padding-right: 10px; }
.main_menu li a > span { display: block; padding-left: 40px; position: relative; z-index: 22; font-size: 16px; color: #222; background: url(../images/arrow.png) left 40px bottom no-repeat; padding-top: 20px; }
.main_menu li:hover a h3 { height: 100px; line-height: 80px; padding: 10px 0 10px 40px; }
.main_menu li:hover a h3 span { font-size: 28px; line-height: 40px; max-height: 80px; }

.category_wrap { padding: 120px 0; }
.category { max-width: 1400px; margin: 0 auto; display: flex; justify-content: space-between; }
.category li a { display: block; min-width: 86px; padding-top: 110px; }
.category li a h3 { font-size:20px; font-weight: 500; color: #000; text-align: center; position: relative; padding-bottom: 5px; }
.category li a h3::after { content: ""; position: absolute; bottom: 0; left: 50%; width: 0; height: 3px; background-color: #5579D7; transform: translateX(-50%); transition: all 0.3s ease-out; }
.category li a:hover h3::after { width: 100%; }
.category li .cat_01 { background: url(../images/cat_01.png) top center no-repeat; }
.category li .cat_02 { background: url(../images/cat_02.png) top center no-repeat; }
.category li .cat_03 { background: url(../images/cat_03.png) top center no-repeat; }
.category li .cat_04 { background: url(../images/cat_04.png) top center no-repeat; }
.category li .cat_05 { background: url(../images/cat_05.png) top center no-repeat; }
.category li .cat_06 { background: url(../images/cat_06.png) top center no-repeat; }
.category li .cat_07 { background: url(../images/cat_07.png) top center no-repeat; }
.category li .cat_08 { background: url(../images/cat_08.png) top center no-repeat; }
.category li .cat_11 { background: url(../images/cat_09.png) top center no-repeat; }
.category li .cat_12 { background: url(../images/cat_10.png) top center no-repeat; }
.category li .cat_13 { background: url(../images/cat_11.png) top center no-repeat; }
.category li .cat_14 { background: url(../images/cat_12.png) top center no-repeat; }
.category li .cat_01:hover { background: url(../images/cat_01_on.png) top center no-repeat; }
.category li .cat_02:hover { background: url(../images/cat_02_on.png) top center no-repeat; }
.category li .cat_03:hover { background: url(../images/cat_03_on.png) top center no-repeat; }
.category li .cat_04:hover { background: url(../images/cat_04_on.png) top center no-repeat; }
.category li .cat_05:hover { background: url(../images/cat_05_on.png) top center no-repeat; }
.category li .cat_06:hover { background: url(../images/cat_06_on.png) top center no-repeat; }
.category li .cat_07:hover { background: url(../images/cat_07_on.png) top center no-repeat; }
.category li .cat_08:hover { background: url(../images/cat_08_on.png) top center no-repeat; }
.category li .cat_11:hover { background: url(../images/cat_09_on.png) top center no-repeat; }
.category li .cat_12:hover { background: url(../images/cat_10_on.png) top center no-repeat; }
.category li .cat_13:hover { background: url(../images/cat_11_on.png) top center no-repeat; }
.category li .cat_14:hover { background: url(../images/cat_12_on.png) top center no-repeat; }

.section_board { padding: 100px 0; background-color: #F3F7FC; }
.board_tab { max-width: 1400px; margin: 0 auto; position: relative; text-align: right; }
.board_tab li { display: inline-block; margin-left: 30px; }
.board_tab li a { display: inline-block; font-size: 24px; font-weight: 700; color: #B2BCC9; position: relative; padding-top: 20px; }
.board_tab li a::before { content: ""; position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 10px; height: 10px; border-radius: 50%; background-color: #222; opacity: 0; transition: all 0.3s ease-out; }
.board_tab li a:hover { color: #222; }
.board_tab li a.selected { color: #222; }
.board_tab li a.selected::before { opacity: 1; }

.board_panel { max-width: 1400px; margin: 0 auto; position: relative; padding-top: 50px; }
.board_main { position: relative; }
.board_main::after { content: ""; display: block; clear: both; }
.board_main li { float: left; width: 23.5%; margin-left: 2%; margin-bottom: 2%; background-color: #fff; }
.board_main li:nth-child(4n+1) { margin-left: 0; }
.board_main li a { display: block; padding: 40px; position: relative; }
.board_main li a::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url(../images/bg_board.png) center no-repeat; opacity: 0; transition: 0.3s ease-out; }
.board_main li a .item { display: inline-block; line-height: 30px; padding: 0 15px; border: 1px solid #5F83CF; font-size: 15px; font-weight: 700; color: #5F83CF; margin-bottom: 20px; position: relative; z-index: 1; transition: 0.3s ease-out; }
.board_main li a .item_02 { border-color: #8F6EB9; color: #8F6EB9; }
.board_main li a .item_03 { border-color: #6A9882; color: #6A9882; }
.board_main li a .item_04 { border-color: #CA6C81; color: #CA6C81; }
.board_main li a h3 { font-size: 24px; font-weight: 700; color: #222; line-height: 30px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-wrap: break-word; height: 60px; margin-bottom: 45px; position: relative; z-index: 1; transition: 0.3s ease-out; }
.board_main li a .date { font-size: 16px; font-weight: 500; color: #9A9A9A; position: relative; z-index: 1; transition: 0.3s ease-out; }
.board_main li a .misc { position: absolute; bottom: 40px; right: 40px; font-size: 16px; font-weight: 500; color: #222; background: url(../images/arrow.png) bottom right no-repeat; padding-right: 20px; z-index: 1; transition: 0.3s ease-out; }
.board_main li a:hover::before { transform: scale(1.1); opacity: 1; }
.board_main li a:hover .item { border-color: #fff; color: #fff; }
.board_main li a:hover h3 { color: #fff; }
.board_main li a:hover .date { color: #fff; }
.board_main li a:hover .misc { color: #fff; background-image: url(../images/arrow_wh.png); }


.sub_banner { height: 250px; }
.sub_banner_01 { background: url(../images/sub_banner_01.jpg) center no-repeat; background-size: cover; }
.sub_banner_02 { background: url(../images/sub_banner_02.jpg) center no-repeat; background-size: cover; }
.sub_banner_03 { background: url(../images/sub_banner_03.jpg) center no-repeat; background-size: cover; }
.sub_banner_04 { background: url(../images/sub_banner_04.jpg) center no-repeat; background-size: cover; }
.sub_banner_05 { background: url(../images/sub_banner_05.jpg) center no-repeat; background-size: cover; }
.aside { position: fixed; top: 180px; left: 50%; margin-left: -700px; width: 300px; padding: 60px 30px; z-index: 22; }
.aside h2 { font-size: 50px; font-weight: bold; color: #fff; margin-bottom: 30px; }
.aside ul li { margin: 10px 0; }
.aside ul li a { font-size: 20px; color: #fff; opacity: 0.9; position: relative; padding-left: 20px; }
.aside ul li a::before { display: none; content: ""; position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 10px; height: 2px; background-color: #fff; }
.aside ul li a:hover { opacity: 1; }
.aside ul li a.selected { opacity: 1; }
.aside ul li a.selected::before { display: block; }
.aside_01 { background: #956CBE url(../images/icon04_on.png) right top no-repeat; }
.aside_02 { background: #5B9A81 url(../images/icon03_on.png) right top no-repeat; }
.aside_03 { background: #5281E5 url(../images/icon02_on.png) right top no-repeat; }
.aside_04 { background: #CA6C81 url(../images/icon01_on.png) right top no-repeat; }
.aside_05 { background: #0495CB url(../images/icon05_on.png) left top no-repeat; }

.sub_wrap { background-color: #fff; position: relative; z-index: 11; }
.sub_conts { max-width: 1400px; margin: 0 auto; padding-left: 340px; padding-bottom: 50px; }
.sub_tit { padding-top: 40px; position: relative; margin-bottom: 30px; }
.sub_tit h3 { font-size: 40px; font-weight: bold; color: #000; }

.list_hd { position: relative; margin-bottom: 30px; min-height: 50px; }
.list_hd > span { font-size: 20px; font-weight: 500; color: #000; margin-right: 15px; line-height: 50px; }
.list_hd > select { border: 1px solid #000; width: 200px; height: 50px; padding-left: 10px; font-size: 16px; color: #000; vertical-align: top; }
.list_hd .search_box { position: absolute; top: 0; right: 0; border: 1px solid #000; }
.list_hd .search_box select { width: 160px; height: 48px; font-size: 16px; color: #000; border: none; padding-left: 10px; }
.list_hd .search_box input { width: 180px; height: 48px; font-size: 16px; color: #000; border: none; vertical-align: top; padding-left: 10px; }
.list_hd button { width: 48px; height: 48px; font-size: 16px; color: #000; vertical-align: top; border-left: 1px solid #000; }

.list_01 { position: relative; }
.list_01::after { content: ""; display: block; clear: both; }
.list_01 li { float: left; width: 48%; margin-left: 4%; margin-bottom: 4%; }
.list_01 li:nth-child(2n+1) { margin-left: 0; }
.list_01 li a { display: block; height: 640px; }
.list_01 li .img { height: 0; padding-bottom: 66%; position: relative; margin-bottom: 30px; }
.list_01 li .img img { position: absolute; width: 100%; height: 100%; object-fit: cover; }
.list_01 li .img > p { position: absolute; bottom: 0; right: 0; line-height: 38px; font-size: 16px; color: #fff; background: #956CBE url(../images/people.png) left 10px center no-repeat; padding: 0 15px 0 40px; }
.list_01 li .cat { font-size: 26px; font-weight: 500; color: #000; }
.list_01 li h4 { font-size: 34px; font-weight: bold; color: #000; margin-bottom: 12px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-wrap: break-word; line-height: 42px; max-height: 84px; }
.list_01 li a:hover h4 { color: #956CBE; }
.list_01 li a > p { font-size: 18px; color: #000; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; word-wrap: break-word; line-height: 28px; height: 140px; }

.menu_tab { overflow: hidden; margin: 40px 0; }
.menu_tab li { float: left; border-right: 1px solid #dadada; }
.menu_tab li:first-child { border-left: 1px solid #dadada; }
.menu_tab2 li { width: 50%; }
.menu_tab3 li { width: 33.33%; }
.menu_tab4 li { width: 25%; }
.menu_tab5 li { width: 20%; }
.menu_tab7 li { width: 14.28%; }
.menu_tab_ext li { width: 12.5%; }
.menu_tab8 li { width: 25%; }

.menu_tab li a { display: flex; width: 100%; height: 56px; justify-content: center; align-items: center; font-size: 18px; color: #666; background-color: #f6f6f6; border-top: 1px solid #dadada; border-bottom: 1px solid #dadada; line-height: 1.2; padding: 0 10px; text-align: center; word-break: keep-all; }
.menu_tab8 li:nth-child(5) a { border-left: 1px solid #dadada; border-top: none; }
.menu_tab8 li:nth-child(6) a { border-top: none; }
.menu_tab8 li:nth-child(7) a { border-top: none; }
.menu_tab8 li:nth-child(8) a { border-top: none; }
.menu_tab li a:hover { color: #000; background-color: #fcfcfc; }
.menu_tab li a.selected { color: #000; font-weight: bold; background-color: #fff; border-top: 3px solid #091368; border-bottom-color: #fff; }
.menu_tab_ext li a { font-size: 16px; }

.prj_box { position: relative; }
.prj_box::after { content: ""; display: block; clear: both; }
.prj_box .img { float: left; width: 55%; margin-right: 5%; }
.prj_box .txt { float: left; width: 40%; }
.prj_box .txt h4 { font-size: 32px; font-weight: bold; color: #000; line-height: 1.3; margin-bottom: 15px; }
.prj_box .txt p { font-size: 18px; color: #000; word-break: keep-all; }
.sns_share { text-align: right; margin-bottom: 15px; }
.sns_share a { opacity: 0.85; margin-left: 10px; }
.sns_share a:hover { opacity: 1; }
.prj_box2 { margin-top: 40px; border: 1px solid #8F6EB9; background-color: #F6F0FD; padding: 60px 340px 40px 35px; position: relative; }
.prj_box2 > span { position: absolute; top: 0; left: 0; line-height: 38px; font-size: 16px; color: #fff; background: #956CBE url(../images/people.png) left 10px center no-repeat; padding: 0 15px 0 40px; }
.prj_box2 p { font-size: 16px; font-weight: 500; color: #000; word-break: keep-all;  }
.prj_box2 > a { position: absolute; top: 50%; transform: translateY(-50%); right: 35px; text-align: center; line-height: 50px; padding: 0 20px; font-size: 16px; font-weight: bold; color: #fff; background-color: #8F6EB9; }
.prj_box2 > a:hover { background-color: #7a59a7;}
.prj_box2 > a img { vertical-align: middle; margin-top: -3px; margin-right: 5px; }
.prj_nav { position: relative; margin-top: 50px; }
.prj_nav::after { content: ""; display: block; clear: both; }
.prj_nav li { float: left; width: 50%; }
.prj_nav li a { display: block; position: relative; height: 200px; padding-left: 50%; background-color: #F4F7FC; padding-top: 50px; padding-right: 30px; }
.prj_nav li a .img { position: absolute; top: 0; left: 0; width: 46%; height: 100%; }
.prj_nav li a .img img { width: 100%; height: 100%; object-fit: cover; }
.prj_nav li a h3 { font-size: 20px; font-weight: 700; color: #000; line-height: 26px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-wrap: break-word; height: 60px; margin-bottom: 20px; }
.prj_nav li a:hover { background-color: #F6F0FD; }
.prj_nav li a > span { display: inline-block; line-height: 38px; font-size: 16px; color: #fff; background: #956CBE url(../images/people.png) left 10px center no-repeat; padding: 0 15px 0 40px; }

.faq_list li { margin-bottom: 10px; background-color: #F7F7F7; border: 1px solid #D8D8D8; }
.faq_list li.on { background-color: #fff; border-color: #000; }
.faq_list li .q, .faq_list li .a { padding: 30px 60px 30px 80px; position: relative; }
.faq_list li .item { position: absolute; top: 30px; left: 40px; width: 32px; height: 32px; line-height: 32px; border-radius: 50%; font-size: 16px; font-weight: bold; color: #fff; text-align: center; }
.faq_list li .q .item { background-color: #000; }
.faq_list li .a .item { background-color: #5281E5; top: 0; }
.faq_list li .q { font-size: 22px; font-weight: bold; color: #000; background: url(../images/arrD_01.png) right 30px top 40px no-repeat; cursor: pointer; }
.faq_list li.on .q { background-image: url(../images/arrU_01.png); }
.faq_list li .a { display: none; font-size: 20px; color: #000; padding-top: 0; }

.table_board { width: 100%; border-top: 2px solid #000; border-bottom: 2px solid #000; }
.table_board th { border-top: 1px solid #ddd; height: 65px; font-size: 18px; font-weight: 500; color: #091368; text-align: center; background-color: #f5f5f9; padding: 15px 0; }
.table_board .emp { background-color: #F4F7FC;}
.table_board td { border-top: 1px solid #ddd; height: 80px; font-size: 16px; color: #000; text-align: center; }
.table_board td:first-child { border-left: none; }
.table_board td .post_info { display: none; }
.table_board .tit { text-align: left; padding-left: 20px; font-weight: bold; }
.table_board .tit a { display: block; color: #000; }
.table_board .tit a:hover { text-decoration: underline;}
.table_board td .notice { display: inline-block; padding: 3px 10px; border-radius: 999px; background-color: #091368; color: #fff; }
.table_board .lock img { margin-top: 3px; margin-left: 5px; }
.table_board .ta_left { text-align: left; padding-left: 10px; }
.table_board .btn_cancel { display: inline-block; width: 80px; line-height: 38px; text-align: center; background-color: #8c8c8c; color: #fff; font-size: 16px; vertical-align: top; }
.table_board .ing { color: #ff1f1f; margin-right: 10px; }
.table_board .cmpl { color: #185196; margin-right: 10px; }

.pagination { text-align: center; margin: 25px 0; }
.pagination a { display: inline-block; width: 43px; height: 43px; border: 1px solid #D8D8D8; line-height: 41px; background-color: #fff; color: #666; position: relative; }
.pagination a img { vertical-align: middle; margin-top: -3px; }
.pagination a:hover { font-weight: bold; color: #000; }
.pagination a.selected { font-weight: bold; color: #000; }
.pagination a.selected::after { content: ""; position: absolute; bottom: 5px; left: 50%; transform: translateX(-50%); width: 14px; height: 2px; background-color: #000;}
.pagination ul { display: inline-block; margin: 0 10px; }
.pagination ul li { display: inline-block; }
.pagination ul li a { border: none }

.table_scroller { width: 100%; overflow-x: auto; }
.table_01 { width: 100%; border-top: 2px solid #000; table-layout: fixed; }
.table_01 th { font-size: 16px; font-weight: 500; color: #000; background-color: #f2f3f7; text-align: center; height: 50px; border-left: 1px solid #dadadf; border-bottom: 1px solid #dbdbdf; padding: 20px 0; }
.table_01 th:first-child { border-left: none; }
.table_01 td { font-size: 16px; line-height: 1.3; color: #474747; text-align: center; height: 50px; border-left: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5; padding: 20px 3px; }
.table_01 td:first-child { border-left: none; }
.table_01 td.ta_left { text-align: left; padding-left: 35px ;}
.table_01 .brd_l { border-left: 1px solid #dadadf;}

.view_header { text-align: center; padding: 20px; border-bottom: 2px solid #000; }
.view_header h4 { font-size: 28px; font-weight: bold; color: #000; margin-bottom: 10px; }
.view_header.answer { text-align: left; border-top: none; background-color: #F4F7FC; padding: 40px 30px 10px 30px; border-bottom: none; }
.view_header.answer h4 { color: #5281E5; }
.view_info { text-align: center; }
.view_header.answer .view_info { text-align: left; }
.view_info li { display: inline-block; margin-left: 6px; padding-left: 10px; font-size: 16px; color: #000; line-height: 20px; position: relative; }
.view_info li::before { content: ""; position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 1px; height: 12px; background-color: #A7A7A7; }
.view_info li:first-child { padding-left: 0; margin-left: 0; }
.view_info li:first-child::before { display: none; }
.view_conts { padding: 40px 30px; font-size: 18px; color: #333; }
.view_conts.answer { background-color: #F4F7FC; }
.view_conts p { font-size: 20px; color: #000; }
.attach { padding: 20px 10px; }
.attach span { display: inline-block; font-size: 16px; color: #091368; margin-right: 15px; }
.attach span img { vertical-align: middle; margin-top: -3px; margin-right: 5px; }
.attach a { display: inline-block; font-size: 16px; font-weight: bold; color: #0059D1; }
.attach a:hover { text-decoration: underline; }
.board_nav { margin-top: 35px; border-bottom: 1px solid #000; }
.board_nav li { padding: 0 120px; position: relative; border-top: 1px solid #ddd; }
.board_nav li .item { position: absolute; top: 0; left: 0; width: 120px; text-align: center; font-size: 16px; color: #000; line-height: 58px; }
.board_nav li .item img { height: 10px; vertical-align: middle; margin-top: -3px; margin-right: 10px; }
.board_nav li a { display: block; font-size: 18px; font-weight: bold; color: #000; line-height: 58px; overflow: hidden; text-overflow: ellipsis; word-wrap: normal; white-space: nowrap; padding-left: 15px; }
.board_nav li a:hover { text-decoration: underline; }
.board_nav li a img { vertical-align: middle; }
.board_nav li .date { position: absolute; top: 0; right: 0; width: 120px; text-align: center; font-size: 16px; color: #a9a9a9; line-height: 58px; }
.board_nav li .ing { color: #ff1f1f; margin-right: 10px; }
.board_nav li .cmpl { color: #185196; margin-right: 10px; }

.view_header .status { float: right; width: 80px; line-height: 38px; text-align: center; background-color: #8c8c8c; color: #fff; font-size: 16px; margin-left: 15px; }
.view_header .status.blue { background-color: #182271; }
.view_header .status.dark_gray { background-color: #666; }

.btn_box_r { margin: 20px 0; text-align: right; position: relative; }
.btn_box_c { margin: 20px 0; text-align: center; position: relative; }
.btn_box_c::before { content: ""; display: block; clear: both; }
.cuation { font-size: 16px; color: #ff1f1f; position: absolute; top: 0; left: 0; text-align: left; }
.btn_box_r button, .btn_box_r a { display: inline-block; min-width: 160px; font-size: 18px; color: #fff; font-weight: bold; text-align: center; line-height: 50px; padding: 0 15px; }
.btn_box_c button, .btn_box_c a { display: inline-block; min-width: 160px; font-size: 18px; color: #fff; font-weight: bold; text-align: center; line-height: 50px; padding: 0 15px; }
.btn_box_r button, .btn_box_r a img { margin: 7px; vertical-align: middle; }
.btn_box_c button, .btn_box_c a img { margin: 7px; vertical-align: middle; }
.btn_blue { background-color: #5281E5; }
.btn_gray { background-color: #5a5a5a; }
.btn_box_c .btn_big, .btn_box_c .btn_big { min-width: 400px; }

.table_write { width: 100%; border-top: 2px solid #000; border-bottom: 2px solid #000; }
.table_write th { font-size: 18px; font-weight: 500; color: #000; text-align: left; border-bottom: 1px solid #DEDEDE; height: 70px; width: 150px; }
.table_write td { font-size: 18px; font-weight: 500; color: #000; text-align: left; border-bottom: 1px solid #C6C6C6; height: 55px; padding: 5px 0 5px 10px; }
.table_write td input { border: 1px solid #C6C6C6; padding-left: 15px; font-size: 16px; color: #000; font-weight: normal; width: 100%; height: 45px; }
.table_write td select { border: 1px solid #C6C6C6; padding-left: 15px; font-size: 16px; color: #000; font-weight: normal; height: 45px; min-width: 300px; }
.table_write td select.full { width: 100%; }
.table_write td input[type="number"] { width: 200px; }
.table_write td textarea { border: 1px solid #C6C6C6; padding: 15px; font-size: 16px; color: #000; font-weight: normal; width: 100%; }
.table_write td .file { color: #185196; }
.table_write td .btn_file { display: inline-block; width: 110px; height: 45px; position: relative; margin-left: -110px; cursor: pointer; }
.table_write td .btn_file::after { content: "찾아보기"; position: absolute; top: 0; left: 0; width: 100%; height: 100%; line-height: 45px; color: #fff; font-size: 15px; text-align: center; background-color: #000; z-index: 111; cursor: pointer; }
.table_write td input[type="file"] { width: 110px; height: 45px; border: none; z-index: 222; position: relative; opacity: 0; cursor: pointer; }
.table_write .pdr_10 { padding-right: 10px; }
.file_del { text-align: right; margin: 5px 0; }
.btn_del { width: 110px; height: 45px; font-size: 15px; color: #fff; background-color: #5a5a5a;}
.table_write th label { cursor: pointer; }
.table_write .chk_secret { width: 20px; height: 20px; border: 1px solid #dadada; border-radius: 5px; margin-left: 10px; vertical-align: middle; }
.table_write input:read-only { background-color: #f3f3f3; }
.table_write input:-moz-read-only { background-color: #fafafa; }

.terms_box { padding: 30px; border: 1px solid #d5d5d5; }
.terms { font-size: 16px; color: #5f5f5f; }
.terms h4 { font-size: 18px; font-weight: 700; color: #666; padding-left: 0; margin-bottom: 10px; }
.terms h5 { font-size: 16px; font-weight: 500; color: #000; padding-left: 0; margin-bottom: 10px; }
.terms h5::before { display: none; }
.terms > p { margin-bottom: 20px; }
.terms .clause { margin: 20px 0; }
.terms ul, ol { margin: 10px 0; }
.terms ul li, .terms ol li { position: relative; padding-left: 10px; }
.terms ul li, ol li { margin-bottom: 7px; color: #5f5f5f; }
.terms .noti { font-size: 16px; }
.selection_agree { margin: 20px 0; text-align: center; }
label { font-size: 17px; color: #474747; }
label input { vertical-align: middle; width: 20px; height: 20px; margin-right: 10px; margin-top: 0; }
.selection_agree label { margin: 0 20px; }

.input_box .btn_file { display: inline-block; width: 13%; height: 42px; position: relative; margin-left: 1%; cursor: pointer; }
.input_box .btn_file::after { content: "파일찾기"; position: absolute; top: 0; left: 0; width: 100%; height: 100%; line-height: 42px; color: #fff; font-size: 15px; text-align: center; background-color: #091368; z-index: 111; cursor: pointer; }
.input_box input[type="file"] { width: 100%; height: 42px; border: none; z-index: 222; position: relative; opacity: 0; cursor: pointer; }
.input_box .file { width: 86%; }
.input_wrap { position: relative; }
.article_input { position: relative; }
.article_input .btn_add_input { display: block; width: 13%; height: 42px; line-height: 42px; text-align: center; background-color: #091368; color: #fff; font-size: 15px; position: relative; margin: 0 0 0 auto; }

.login_box { margin: 50px auto 0 auto; width: 510px; }
.login_box h4 { font-size: 32px; font-weight: 800; color: #000; margin-bottom: 20px; text-align: center; }
.login_input { border: 1px solid #d9d9d9; background-color: #fcfcfc; padding: 20px 20px 20px 90px; margin-bottom: 15px; position: relative; }
.login_input .icon { position: absolute; top: 20px; left: 20px; width: 50px; height: 40px; border-right: 1px solid #E7ECF0; line-height: 40px; }
.login_input h5 { font-size: 15px; font-weight: bold; line-height: 1.1; }
.login_input input { width: 100%; font-size: 18px; font-weight: bold; color: #666; height: 30px; border: none; background: none; }
.login_input input:focus::placeholder { color: transparent; }
.login_tool { margin: 30px 0; text-align: center; }
.login_tool a { font-size: 15px; font-weight: 600; color: #000; }
.login_tool a:first-child { margin-right: 6px; padding-right: 10px; position: relative; }
.login_tool a:first-child::after { content: ""; position: absolute; top: 50%; transform: translateY(-50%); right: 0; width: 1px; height: 12px; background-color: #d8d8d8; }
.login_box .btn_login { display: block; height: 60px; line-height: 60px; font-size: 20px; font-weight: 500; color: #fff; background-color: #000; opacity: 0.85; text-align: center; }
.login_box .btn_login:hover { opacity: 1; }
.login_box .btn_login img { vertical-align: middle; margin-top: -5px; }
.login_input .chk_overlap { position: absolute; top: 20px; right: 20px; width: 80px; height: 40px; font-size: 15px; color: #fff; background-color: #0495CB; border-radius: 5px; }
.chk_terms_wrap { margin: 40px 0; }
.chk_terms_wrap h5 { font-size: 18px; font-weight: bold; color: #0059D1; margin-bottom: 10px; }
.chk_terms_wrap label { display: inline-block; font-size: 16px; font-weight: 500; color: #000; line-height: 30px; }
.chk_terms_wrap label input { vertical-align: middle; }
.chk_terms { padding-left: 50px; position: relative; }
.chk_terms a { font-size: 15px; font-weight: bold; color: #000; position: absolute; top: 0; right: 0; }
.chk_terms a:hover { text-decoration: underline; }
.login_box > h5 { font-size: 32px; font-weight: 800; color: #0495CB; margin-bottom: 20px; text-align: center; }
.login_box > p { font-size: 20px; color: #222; text-align: center; }


.bg_layer_pop { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.61); z-index: 777; overflow-y: auto; }
.bg_layer_pop .pop_alert { position: absolute; top: 50%; left: 50%; width: 320px; transform: translate(-50%, -50%); background-color: #fff; border: 1px solid #091368; padding: 30px; text-align: center; border-radius: 5px; }
.bg_layer_pop .pop_alert.hidden { display: none; }
.bg_layer_pop .pop_alert p { font-size: 20px; color: #121212; margin-bottom: 20px; }
.bg_layer_pop .pop_alert input { width: 100%; height: 45px; border: 1px solid #d1d1d1; background-color: #f2f5f8; font-size: 16px; font-weight: bold; color: #666; margin-bottom: 20px; text-align: center; }
.bg_layer_pop .pop_alert .btn_box_c { margin: 0; }
.bg_layer_pop .pop_alert .btn_box_c button, .bg_layer_pop .pop_alert .btn_box_c a { min-width: 100px; height: 45px; line-height: 45px; font-size: 15px; vertical-align: middle; }

.layer_pop { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background-color: #fff; border-radius: 20px; width: 1000px; max-height: 90%; padding: 30px; display: flex; flex-direction: column; }
.layer_pop_hd { padding: 20px 0; position: relative; }
.layer_pop_hd h4 { font-size: 24px; font-weight: bold; color: #000; text-align: left; }
.layer_pop_hd button { position: absolute; top: 0; right: 0; width: 40px; height: 40px; }
.layer_pop_hd button img { height: 25px; }
.layer_pop_conts { flex: 1; overflow-y: auto; }

.intro { padding-bottom: 100px; }
.intro .banner { height: 369px; position: relative; background: url(../images/intro_01.jpg) center no-repeat; background-size: cover; margin-bottom: 30px; }
.intro .banner h2 { position: absolute; bottom: 0; left: 0; width: 320px; height: 188px; background: #3A77A4 url(../images/line_01.png) right top no-repeat; padding: 45px 35px; font-size: 28px; font-weight: bold; color: #fff; line-height: 1.3; }
.intro p { font-size: 20px; font-weight: 500; color: #000; }

.testbed h4 { text-align: center; font-size: 30px; font-weight: bold; margin: 20px 0 50px 0; word-break: keep-all; }
.testbed h5 { font-size: 20px; font-weight: bold; margin-bottom: 10px; }
.testbed_box { background-color: #F6F0FD; padding: 30px; margin-bottom: 50px; }
.testbed_box .input_wrap { position: relative; padding-left: 130px; display: flex; gap: 10px; margin: 10px 0; padding-bottom: 25px; }
.testbed_box .input_wrap .item { position: absolute; top: 0; left: 0; font-size: 16px; font-weight: bold; line-height: 40px; }
.testbed_box .input_wrap input[type=text] { flex: 1; height: 40px; border: 1px solid #8F6EB9; background-color: #fff; font-size: 16px; font-weight: 500; padding-left: 20px; }
.testbed_box .input_wrap .btn_file { width: 110px; height: 40px; position: relative; }
.testbed_box .input_wrap .btn_file::after { content: "파일찾기"; position: absolute; top: 0; left: 0; width: 100%; height: 100%; line-height: 40px; color: #fff; background-color: #5281E5; text-align: center; font-size: 15px; }
.testbed_box .input_wrap .btn_file input { width: 110px; height: 40px; border: none; z-index: 11; position: relative; opacity: 0; cursor: pointer; }
.testbed_box .input_wrap .upload { width: 110px; height: 40px; font-size: 15px; color: #fff; background-color: #8F6EB9; }
.testbed_box .input_wrap .upload:disabled { opacity: 0.3; cursor: default; }
.testbed_box .btn_box_c button, .testbed_box .btn_box_c a { min-width: 400px; background-color: #5281E5;}
.testbed_box .btn_box_c button:disabled { opacity: 0.3; cursor: default; }
.testbed_box .btn_box_c a.disabled { opacity: 0.3; cursor: default; pointer-events: none; }
.testbed_box textarea { border: 1px solid #8F6EB9; padding: 20px; width: 100%; font-size: 16px; font-weight: 500; }
.testbed_box .noti { position: absolute; bottom: 0; left: 0; width: 100%; font-size: 15px; font-weight: bold; color: #8F6EB9; padding-left: 130px; }

.agree_box { text-align: center; padding: 20px 0; background-color: #fff;}
.agree_box label { font-size: 18px; font-weight: bold; cursor: pointer; }
.agree_box label input { width: 24px; height: 24px; }

.prj_link { margin: 20px 0; text-align: right; }
.prj_link a { display: inline-block; line-height: 40px; margin-left: 20px; font-size: 16px; color: #666; }
.prj_link a:hover { color: #111; }
.prj_git_hd { margin: 20px 0; border-bottom: 1px solid #ededed; padding-bottom: 10px; font-size: 18px; font-weight: bold; color: #111; }
.prj_git ul li { border: 1px solid #ededed; border-radius: 10px; padding: 30px 40px; position: relative; margin: 10px 0; }
.prj_git ul li .tools { position: absolute; top: 30px; right: 40px; }
.prj_git ul li .tools button { height: 34px; font-size: 16px; font-weight: 500; color: #fff; padding: 0 20px; border-radius: 10px; min-width: 90px; margin: 0 10px; }
.prj_git ul li .tools button:hover { background-color: #121212; }
.prj_git ul li .tools .readme { background-color: #8F6EB9; }
.prj_git ul li .tools .readme:hover { background-color: #7a59a7; }
.prj_git ul li .tools .edit { background-color: #797979; }
.prj_git ul li .tools .edit:hover { background-color: #232323; }
.prj_git ul li .tools span { line-height: 34px; font-size: 16px; }
.prj_git ul li .tools span img { vertical-align: middle; margin-top: -3px; margin-right: 5px; height: 22px; }
.prj_git ul li h4 { font-size: 26px; font-weight: bold; color: #111; padding-right: 280px; }
.prj_git ul li h5 { font-size: 18px; color: #666; margin: 15px 0; }
.prj_git ul li h5 img { height: 27px; margin-right: 10px; }
.prj_git_conts { display: none; border: 1px solid #ededed; border-radius: 10px; padding: 20px; font-size: 16px; }

#url_copy { position: absolute; bottom: 0; left: 0; opacity: 0; }

.sitemap { padding-top: 50px; }
.sitemap > li { padding-bottom: 30px; }
.sitemap > li > span { display: block; padding-bottom: 10px; font-size: 22px; font-weight: bold; border-bottom: 1px solid #ececec; }
.sitemap > li ul { padding: 20px 0; display: flex; }
.sitemap > li ul li { width: 20%; }
.sitemap > li ul li a { font-size: 18px; font-weight: 500; color: #666; }

.list_ext { border-top: 2px solid #000; border-bottom: 2px solid #000; }
.list_ext > li { display: flex; min-height: 80px; padding: 10px 0; justify-content: space-between; align-items: center; text-align: center; border-top: 1px solid #ddd; font-size: 16px; color: #000; transition: background-color 0.3s ease-in-out; cursor: pointer; }
.kind1 > li { cursor: default; }
.list_ext > li:hover { background-color: #fafafa; }
.list_ext > li:first-child { border-top: none; }
.list_ext > li .num { width: 80px; }
.list_ext > li .cat { width: 130px; }
.list_ext > li .name { width: 120px;  font-weight: bold; }
.list_ext > li .name a { color: #000; text-decoration: underline; }
.list_ext > li .detail { flex: 1; text-align: left; padding-left: 30px; }
.list_ext > li .phone { width: 150px; }
.list_ext > li .email { width: 250px; }
.list_ext .layer_pop { display: none; width: 800px; }
.personal_info { text-align: left; font-size: 18px; }
.personal_info li { position: relative; padding-left: 20px; margin: 5px 0; }
.personal_info li::before { content: "-"; position: absolute; top: 0; left: 0; }
.personal_info > li ul { margin-top: 10px; }
.personal_info > li ul li::before { content: "*"; }

.menu_tab + .noti { font-size: 18px; color: #0059D1; }

.tab_mid { margin: 40px 0; text-align: center; }
.tab_mid a { display: inline-block; font-size: 30px; font-weight: bold; color: #000; opacity: 0.3; margin: 0 20px; }
.tab_mid a.selected { opacity: 1; }

.ext_parts th { width: 300px; }

.table_scroller .table_01 a { color: #000; text-decoration: underline; }

.no_data { text-align: center; padding: 100px 0; font-size: 18px; font-weight: 500; color: #000; }

.ext_hd { margin: 20px 0; }
.ext_hd p { font-size: 20px; color: #000; margin-bottom: 10px; }
.ext_hd p.noti { position: relative; padding-left: 20px; font-size: 18px; color: #CA6C81; }
.ext_hd p.noti::before { content: "※"; position: absolute; top: 0; left: 0; }
.ext_hd .btn_box { margin: 20px 0; display: flex; gap: 20px; }
.ext_hd .btn_box a { min-width: 200px; height: 50px; line-height: 50px; text-align: center; background-color: #8F6EB9; color: #fff; font-size: 16px; padding: 0 20px; }
.ext_hd .btn_box a:hover { background-color: #7a59a7; }

.table_write td > label { display: inline-block; cursor: pointer; margin: 0 20px; }
.table_write td > label input { width: 20px; height: 20px; margin-right: 5px; }
.table_write td > input + input { margin-top: 8px; }
 
.bg_side { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.61); z-index: 777; overflow-y: auto; }
.open_menu { display: none; }
.nav_m { display: none; }
.for_m { display: none; }


/**************************/
@media (max-width:1399px){

.top { height: 60px; }
.top h1 { margin-left: 20px; margin-top: 13px; }
.top h1 a { width: 109px; height: 34px; }
.gum { display: none; }
.gnb { display: none; }
.open_menu { display: block; position: absolute; top: 50%; right: 20px; transform: translateY(-50%); width: 40px; height: 40px; background: url(../images/btn_menu_wh.png) center no-repeat; background-size: auto 25px; font-size: 0; }
.top:hover .open_menu { background-image: url(../images/btn_menu.png); }
.top.scrolled .open_menu { background-image: url(../images/btn_menu.png); }
.top.bg_white .open_menu { background-image: url(../images/btn_menu.png); }

.close_menu { position: absolute; top: 15px; right: 20px; width: 30px; height: 30px; }
.close_menu img { height: 25px; }
.side_menu { position: absolute; top: 0; right: -450px; width: 450px; height: 100%; background: #fff; transition: all 0.3s ease-in-out; overflow-y: auto; }
.side_menu.on { right: 0; }

.gum_m { padding: 15px 20px; }
.gum_m li { display: inline-block; padding-left: 20px; margin-left: 16px; position: relative; }
.gum_m li::before { content: ""; position: absolute; top: 15px; left: 0; width: 1px; height: 12px; background-color: #C6C6C6; }
.gum_m li:first-child { padding-left: 0; margin-left: 0; }
.gum_m li:first-child::before { display: none; }
.gum_m li a { display: inline-block; font-size: 15px; line-height: 40px; color: #000; }
.gnb_m { padding: 0; text-align: left; }
.gnb_m > li { padding-bottom: 20px; }
.gnb_m > li > a { display: block; font-size: 18px; font-weight: 700; line-height: 50px; color: #2a2a2a; padding-left: 25px; }
.gnb_m > li > a:hover { background-color: #f0f0f0; }
.gnb_sub_m li a { display: block; padding-left: 35px; font-size: 16px; line-height: 40px; font-weight: 700; color: #666; }
.gnb_sub_m li a:hover { background-color: #f0f0f0; color: #185196; }
.gnb_sub_m li a.selected { color: #185196; }
.gnb_sub_m2 li a { display: block; padding-left: 45px; font-size: 14px; line-height: 40px; color: #999; }

.footer { height: 160px; padding: 30px 0 0 160px; }
.footer_menu a { font-size: 15px; opacity: 1; }
.footer p { font-size: 13px; line-height: 18px; }
.footer .logo { left: 20px; width: 109px; height: 34px; background-size: auto 100%; }
.footer select { position: absolute; top: 20px; right: 20px; padding-left: 15px; width: 170px; height: 36px; }
#go_top { width: 30px; height: 30px; }

/* main */
.main_slide li { height: 386px; }
.main_banner_txt { position: absolute; top: 110px; left: 20px; }
.main_banner_txt h2 { font-size: 60px; }
.main_banner_txt p { font-size: 20px; }

.main_menu { left: 0; margin-left: 0; width: 100%; }
.main_menu li { width: 25%; height: 64px; }
.main_menu li:hover { height: 64px; }
.main_menu .main_menu_01 { background: #CA6C81 url(../images/icon01.png) 10px 18px no-repeat; background-size: auto 30px; }
.main_menu .main_menu_02 { background: #5281E5 url(../images/icon02.png) 10px 18px no-repeat; background-size: auto 30px; }
.main_menu .main_menu_03 { background: #5B9A81 url(../images/icon03.png) 10px 18px no-repeat; background-size: auto 30px; }
.main_menu .main_menu_04 { background: #956CBE url(../images/icon04.png) 10px 18px no-repeat; background-size: auto 30px; }
.main_menu .main_menu_01:hover { background: #CA6C81 url(../images/icon01.png) 10px 18px no-repeat; background-size: auto 30px; }
.main_menu .main_menu_02:hover { background: #5281E5 url(../images/icon02.png) 10px 18px no-repeat; background-size: auto 30px; }
.main_menu .main_menu_03:hover { background: #5B9A81 url(../images/icon03.png) 10px 18px no-repeat; background-size: auto 30px; }
.main_menu .main_menu_04:hover { background: #956CBE url(../images/icon04.png) 10px 18px no-repeat; background-size: auto 30px; }
.main_menu li a { display: block; position: relative; height: 64px; }
.main_menu li a h3 { height: 64px; line-height: 44px; padding: 10px 0 10px 50px; }
.main_menu li a h3 span { font-size: 16px; line-height: 22px; }
.main_menu li a p { display: none; }
.main_menu li a > span { display: none; }
.main_menu li:hover a h3 { height: 64px; line-height: 44px; padding: 10px 0 10px 50px; }
.main_menu li:hover a h3 span { font-size: 16px; line-height: 22px; }

.category_wrap { padding: 60px 0; }
.category { padding: 0 20px; }
.category li { width: 12%;}
.category li a { padding-top: 80px; }
.category li a h3 { font-size: 16px; }
.category li .cat_01 { background-size: auto 60px; }
.category li .cat_02 { background-size: auto 60px; }
.category li .cat_03 { background-size: auto 60px; }
.category li .cat_04 { background-size: auto 60px; }
.category li .cat_05 { background-size: auto 60px; }
.category li .cat_06 { background-size: auto 60px; }
.category li .cat_07 { background-size: auto 60px; }
.category li .cat_08 { background-size: auto 60px; }
.category li .cat_11 { background-size: auto 60px; }
.category li .cat_12 { background-size: auto 60px; }
.category li .cat_13 { background-size: auto 60px; }
.category li .cat_14 { background-size: auto 60px; }
.category li .cat_01:hover { background-size: auto 60px; }
.category li .cat_02:hover { background-size: auto 60px; }
.category li .cat_03:hover { background-size: auto 60px; }
.category li .cat_04:hover { background-size: auto 60px; }
.category li .cat_05:hover { background-size: auto 60px; }
.category li .cat_06:hover { background-size: auto 60px; }
.category li .cat_07:hover { background-size: auto 60px; }
.category li .cat_08:hover { background-size: auto 60px; }
.category li .cat_11:hover { background-size: auto 60px; }
.category li .cat_12:hover { background-size: auto 60px; }
.category li .cat_13:hover { background-size: auto 60px; }
.category li .cat_14:hover { background-size: auto 60px; }

.section_board { padding: 60px 20px; }
.board_tab li { margin-left: 20px; }
.board_tab li a { font-size: 18px; padding-top: 16px; }
.board_tab li a::before { width: 8px; height: 8px; }

.board_panel { padding-top: 30px; }
.board_main li { width: 32%; }
.board_main li:nth-child(4n+1) { margin-left: 2%; }
.board_main li:nth-child(3n+1) { margin-left: 0; }
.board_main li a { padding: 20px; }
.board_main li a .item { line-height: 24px; padding: 0 12px; font-size: 13px; margin-bottom: 16px; }
.board_main li a h3 { font-size: 18px; line-height: 24px; height: 48px; margin-bottom: 20px; }
.board_main li a .date { font-size: 13px; }
.board_main li a .misc { bottom: 20px; right: 20px; font-size: 13px; padding-right: 20px; }

.sub_banner { height: 196px; }
.aside { top: 150px; left: 0; margin-left: 0; width: 220px; padding: 40px 20px; z-index: 11; }
.aside h2 { font-size: 36px; margin-bottom: 0; }
.aside ul { display: none; }
.aside_01 { background-size: auto 110px;  }
.aside_02 { background-size: auto 110px; }
.aside_03 { background-size: auto 110px; }
.aside_04 { background-size: auto 110px; }
.aside_05 { background-size: auto 160px; }

.sub_wrap { background-color: #fff; position: relative; z-index: 11; }
.sub_conts { padding: 0 20px 40px 20px; }
.sub_tit { padding-top: 24px; position: relative; margin-bottom: 20px; }
.sub_tit h3 { font-size: 28px; }

.list_hd { margin-bottom: 20px; min-height: 40px; }
.list_hd > span { font-size: 15px; margin-right: 10px; line-height: 40px; }
.list_hd > select { width: 160px; height: 40px; font-size: 14px; }
.list_hd .search_box select { width: 145px; height: 38px; font-size: 14px; }
.list_hd .search_box input { width: 160px; height: 38px; font-size: 14px; }
.list_hd button { width: 38px; height: 38px; font-size: 14px; }

.list_01 li .img { margin-bottom: 20px; }
.list_01 li .img > p { line-height: 32px; font-size: 14px; padding: 0 12px 0 35px; background-size: auto 12px; }
.list_01 li a { height: 465px; }
.list_01 li .cat { font-size: 20px; }
.list_01 li h4 { font-size: 26px; line-height: 32px; max-height: 64px; }
.list_01 li a > p { font-size: 14px; line-height: 22px; height: 110px; }

.menu_tab { margin: 30px 0; }
.menu_tab li a { font-size: 15px; }
.menu_tab7 li a { font-size: 14px; }
.menu_tab_ext li a { font-size: 14px; }

.prj_box .img { width: 45%; }
.prj_box .txt { width: 50%; }
.prj_box .txt h4 { font-size: 24px; margin-bottom: 12px; }
.prj_box .txt p { font-size: 14px; }
.sns_share { margin-bottom: 12px; }
.sns_share a { display: inline-block; opacity: 1; width: 25px; height: 25px; }
.prj_box2 { margin-top: 30px; padding: 50px 270px 30px 25px; }
.prj_box2 > span { line-height: 32px; font-size: 14px; padding: 0 12px 0 35px; background-size: auto 12px; }
.prj_box2 p { font-size: 14px; }
.prj_box2 > a { right: 20px; text-align: center; line-height: 45px; padding: 0 20px; font-size: 14px; }
.prj_nav { margin-top: 40px; }
.prj_nav li a { height: 120px; padding-left: 40%; background-color: #F4F7FC; padding-top: 20px; padding-right: 20px; }
.prj_nav li a .img { width: 36%; }
.prj_nav li a h3 { font-size: 15px; line-height: 21px; height: 42px; margin-bottom: 16px; }
.prj_nav li a > span { line-height: 32px; font-size: 14px; padding: 0 12px 0 35px; }

.faq_list li .q, .faq_list li .a { padding: 20px 40px 20px 60px; }
.faq_list li .item { top: 16px; left: 20px; width: 28px; height: 28px; line-height: 28px;font-size: 13px; }
.faq_list li .q { font-size: 16px; background: url(../images/arrD_01.png) right 30px top 40px no-repeat; }
.faq_list li .a { font-size: 15px; padding-top: 0; }

.table_board th { height: 52px; font-size: 15px; }
.table_board td { height: 48px; font-size: 14px; }
.table_board .tit { text-align: left; padding-left: 14px;}
.table_board .lock img { margin-top: 0; }
.table_board .status { width: 66px; line-height: 32px; font-size: 14px; }
.table_board .btn_cancel { width: 66px; line-height: 32px; font-size: 14px; }

.view_header { padding: 20px; }
.view_header.answer { padding: 20px; padding-bottom: 0; }
.view_header h4 { font-size: 20px; }
.view_info li { margin-left: 4px; padding-left: 8px; font-size: 14px; line-height: 18px; }
.view_conts { padding: 30px 20px; font-size: 16px; }
.view_conts p { font-size: 16px; color: #000; }
.attach { padding: 16px 10px; }
.attach span { font-size: 15px; margin-right: 12px; }
.attach a { font-size: 15px; }
.board_nav { margin-top: 26px; }
.board_nav li { padding: 0 100px; }
.board_nav li .item { width: 100px; font-size: 14px; line-height: 45px; }
.board_nav li .item img { margin-right: 8px; }
.board_nav li a { font-size: 14px; line-height: 45px; padding-left: 10px; }
.board_nav li a img { height: 20px; }
.board_nav li .date { width: 100px; font-size: 14px; line-height: 45px; }
.view_header .status { width: 66px; line-height: 32px; font-size: 14px; }

.btn_box_r { margin: 16px 0; }
.btn_box_c { margin: 16px 0; }
.cuation { font-size: 16px; }
.btn_box_r button, .btn_box_r a { min-width: 110px; font-size: 15px; line-height: 45px; padding: 0 15px; }
.btn_box_c button, .btn_box_c a { min-width: 110px; font-size: 15px; line-height: 45px; padding: 0 15px; }
.btn_box_c .btn_big, .btn_box_c .btn_big { min-width: 320px; }

.table_01 th { font-size: 14px; height: 42px; padding: 12px 0; }
.table_01 td { font-size: 14px; height: 42px; padding: 8px; }
.table_01 td.ta_left { padding-left: 24px; }

.terms_box { padding: 24px; }
.terms { font-size: 15px; }
.terms > p { margin-bottom: 16px; }
.terms ul, ol { margin-bottom: 10px; }
.terms ul li, ol li { margin-bottom: 6px; }
.terms .noti { font-size: 15px; }
.selection_agree { margin: 16px 0; }
label { font-size: 15px; }
label input { width: 16px; height: 16px; margin-right: 8px; margin-top: -4px; }
.selection_agree label { margin: 0 16px; }

.bg_layer_pop .pop_alert { width: 300px; padding: 30px; }
.bg_layer_pop .pop_alert p { font-size: 16px; margin-bottom: 16px; }
.bg_layer_pop .pop_alert input { width: 100%; height: 40px; font-size: 15px; margin-bottom: 16px; }
.bg_layer_pop .pop_alert .btn_box_c button { min-width: 90px; height: 40px; line-height: 40px; font-size: 13px; }

.layer_pop { border-radius: 16px; width: 600px; padding: 20px; }
.layer_pop_hd { padding: 16px 0; }
.layer_pop_hd h4 { font-size: 20px; }
.layer_pop_hd button { width: 32px; height: 32px; }
.layer_pop_hd button img { height: 20px; }

.table_write th { font-size: 14px; height: 44px; width: 120px; }
.table_write td { font-size: 14px; height: 44px; }
.table_write td input, .table_write td select { padding-left: 15px; font-size: 14px; height: 40px; }
.table_write td select { min-width: 260px; }
.table_write td input[type="number"] { width: 160px; }
.table_write td textarea { padding: 15px; font-size: 14px; }
.table_write td .btn_file { width: 90px; height: 40px; margin-left: -90px; }
.table_write td .btn_file::after { line-height: 40px; font-size: 13px; }
.table_write td input[type="file"] { width: 90px; height: 40px; }
.btn_del { width: 90px; height: 40px; font-size: 13px; }
.table_write .chk_secret { width: 20px; height: 20px; }

.login_box { margin: 30px auto 0 auto; width: 480px; }
.login_box h4 { font-size: 26px; margin-bottom: 16px; }
.login_input { padding: 16px 16px 16px 70px; margin-bottom: 12px; }
.login_input .icon { top: 16px; left: 16px; width: 40px; height: 32px; line-height: 32px; }
.login_input .icon img { height: 32px; }
.login_input h5 { font-size: 13px; }
.login_input input { font-size: 15px; height: 24px; }
.login_tool { margin: 24px 0; }
.login_tool a { font-size: 14px; }
.login_box .btn_login { height: 50px; line-height: 50px; font-size: 16px; opacity: 1; }
.login_input .chk_overlap { top: 16px; right: 16px; width: 70px; height: 36px; font-size: 13px; }
.chk_terms_wrap { margin: 30px 0; }
.chk_terms_wrap h5 { font-size: 15px; }
.chk_terms_wrap label { font-size: 14px; line-height: 26px; }
.chk_terms { padding-left: 34px; }
.chk_terms a { font-size: 14px; }
.login_box > h5 { font-size: 22px; margin-bottom: 16px; }
.login_box > p { font-size: 16px; }

.intro { padding-bottom: 80px; }
.intro .banner { height: 280px; margin-bottom: 24px; }
.intro .banner h2 { width: 260px; height: 130px; padding: 30px 20px; font-size: 20px; background-size: auto 36px; }
.intro p { font-size: 16px; }

.testbed h4 { font-size: 24px; margin: 16px 0 35px 0; }
.testbed h5 { font-size: 16px; }
.testbed_box { padding: 24px; margin-bottom: 35px; }
.testbed_box .input_wrap { padding-left: 100px; gap: 8px; padding-bottom: 22px; }
.testbed_box .input_wrap .item { font-size: 14px; line-height: 36px; }
.testbed_box .input_wrap input[type=text] { height: 36px; font-size: 14px; padding-left: 10px; }
.testbed_box .input_wrap .btn_file { width: 90px; height: 36px; }
.testbed_box .input_wrap .btn_file::after { line-height: 36px; font-size: 13px; }
.testbed_box .input_wrap .btn_file input { width: 90px; height: 36px; }
.testbed_box .input_wrap .upload { width: 90px; height: 36px; font-size: 13px; }
.testbed_box .btn_box_c button, .testbed_box .btn_box_c a { min-width: 320px; }
.testbed_box textarea { padding: 16px; font-size: 14px; }
.testbed_box .noti { font-size: 14px; padding-left: 100px; }

.agree_box { padding: 16px 0; }
.agree_box label { font-size: 15px; }
.agree_box label input { width: 18px; height: 18px; margin-top: 0; }

.prj_link { margin: 16px 0; }
.prj_link a { line-height: 32px; margin-left: 16px; font-size: 14px; color: #111; }
.prj_link a img { height: 30px; }
.prj_git_hd { margin: 16px 0; font-size: 16px; }
.prj_git ul li { padding: 20px; }
.prj_git ul li .tools { top: 20px; right: 20px; }
.prj_git ul li .tools button { height: 28px; font-size: 14px; padding: 0 16px; min-width: 70px; margin: 0 10px; }
.prj_git ul li .tools span { line-height: 28px; font-size: 14px; }
.prj_git ul li .tools span img { margin-top: -3px; margin-right: 5px; height: 18px; }
.prj_git ul li h4 { font-size: 20px; padding-right: 200px; }
.prj_git ul li h5 { font-size: 15px; margin: 15px 0; }
.prj_git ul li h5 img { height: 22px; margin-right: 10px; }
.prj_git_conts { padding: 16px; font-size: 14px; }

.sitemap { padding-top: 40px; }
.sitemap > li { padding-bottom: 20px; }
.sitemap > li > span { font-size: 18px; }
.sitemap > li ul { padding: 16px 0; }
.sitemap > li ul li { width: 20%; }
.sitemap > li ul li a { font-size: 15px; }

.list_ext > li { min-height: 48px; padding: 10px 0; font-size: 14px; }
.list_ext > li .num { width: 40px; }
.list_ext > li .cat { width: 90px; }
.list_ext > li .name { width: 70px; }
.list_ext > li .detail { padding-left: 20px; }
.list_ext > li .phone { width: 120px; }
.list_ext > li .email { width: 180px; }
.list_ext .layer_pop { max-width: 800px; width: 90%; }
.personal_info { font-size: 14px; }
.personal_info li { padding-left: 16px; margin: 4px 0; }

.ext_parts th { width: 270px; }

.no_data { padding: 80px 0; font-size: 15px; }

.ext_hd { margin: 16px 0; }
.ext_hd p { font-size: 16px; }
.ext_hd p.noti { padding-left: 16px; font-size: 14px; }
.ext_hd .btn_box { gap: 16px; }
.ext_hd .btn_box a { min-width: 160px; height: 40px; line-height: 40px; font-size: 14px; padding: 0 16px; background-color: #7a59a7; }

.table_write td > label { margin: 0 10px; margin-top: 5px; }
.table_write td > label input { width: 16px; height: 16px; margin-right: 2px; }
.table_write td > input + input { margin-top: 5px; }

}

/**************************/
@media (max-width:767px){

.body_wrap { padding-bottom: 227px; }

.top { height: 50px; justify-content: center; }
.top h1 { margin-left: 0; margin-top: 12px; text-align: center; }
.top h1 a { width: 80px; height: 25px; }
.open_menu { right: 0; width: 40px; height: 40px; background-size: auto 16px; }
.close_menu { top: 6px; right: 0; width: 40px; height: 40px; }
.close_menu img { height: 20px; }
.side_menu { right: -280px; width: 280px; height: 100%; }

.gum_m { padding: 10px; }
.gum_m li { padding-left: 10px; margin-left: 6px; }
.gum_m li::before { top: 13px; left: 0; width: 1px; height: 9px; }
.gum_m li a { font-size: 13px; line-height: 36px; }
.gnb_m { padding: 0; text-align: left; }
.gnb_m > li { padding-bottom: 16px; }
.gnb_m > li > a { font-size: 14px; line-height: 40px; }
.gnb_sub_m li a { font-size: 13px; line-height: 36px; }

.footer { height: 227px; padding: 65px 10px 20px 10px; text-align: center; }
.footer_menu { text-align: center; }
.footer_menu a { font-size: 13px; opacity: 1; }
.footer p { font-size: 12px; font-weight: 300; }
.footer .logo { top: 20px; left: 0; width: 100%; height: 25px; background-size: auto 100%; background-position: center; transform: translateY(0); }
.footer select { position: relative; top: auto; right: auto; padding-left: 15px; width: 160px; height: 30px; font-size: 12px; margin-top: 10px; }
#go_top { bottom: 10px; right: 10px; width: 30px; height: 30px; }
#go_top img { height: 20px; }

/* main */
.main_slide li { height: 460px; }
.main_slide_01 { background-image: url(../images/main_banner_01_m.jpg); }
.main_slide_02 { background-image: url(../images/main_banner_02_m.jpg); }
.main_slide_03 { background-image: url(../images/main_banner_03_m.jpg); }
.main_slide_04 { background-image: url(../images/main_banner_04_m.jpg); }
.main_banner_txt { position: absolute; top: 160px; left: 0; }
.main_banner_txt h2 { font-size: 40px; text-align: center; }
.main_banner_txt p { font-size: 16px; text-align: center; }

.main_menu { left: 0; margin-left: 0; width: 100%; flex-wrap: wrap; }
.main_menu li { width: 50%; height: 50px; }
.main_menu li:hover { height: 50px; }
.main_menu .main_menu_01 { background: #CA6C81 url(../images/icon01.png) 10px 10px no-repeat; background-size: auto 30px; }
.main_menu .main_menu_02 { background: #5281E5 url(../images/icon02.png) 10px 10px no-repeat; background-size: auto 30px; }
.main_menu .main_menu_03 { background: #5B9A81 url(../images/icon03.png) 10px 10px no-repeat; background-size: auto 30px; }
.main_menu .main_menu_04 { background: #956CBE url(../images/icon04.png) 10px 10px no-repeat; background-size: auto 30px; }
.main_menu .main_menu_01:hover { background: #CA6C81 url(../images/icon01.png) 10px 10px no-repeat; background-size: auto 30px; }
.main_menu .main_menu_02:hover { background: #5281E5 url(../images/icon02.png) 10px 10px no-repeat; background-size: auto 30px; }
.main_menu .main_menu_03:hover { background: #5B9A81 url(../images/icon03.png) 10px 10px no-repeat; background-size: auto 30px; }
.main_menu .main_menu_04:hover { background: #956CBE url(../images/icon04.png) 10px 10px no-repeat; background-size: auto 30px; }
.main_menu li a { display: block; position: relative; height: 50px; }
.main_menu li a h3 { height: 50px; line-height: 36px; padding: 7px 0 7px 50px; }
.main_menu li a h3 span { font-size: 14px; line-height: 18px; }
.main_menu li:hover a h3 { height: 50px; line-height: 36px; padding: 7px 0 7px 50px; }
.main_menu li:hover a h3 span { font-size: 14px; line-height: 18px; }

.category_wrap { padding: 30px 0; }
.category { padding: 0; flex-wrap: wrap; }
.category li { width: 25%; margin-top: 16px;}
.category li a { padding-top: 54px; }
.category li a h3 { font-size: 13px; }
.category li .cat_01 { background-size: auto 40px; }
.category li .cat_02 { background-size: auto 40px; }
.category li .cat_03 { background-size: auto 40px; }
.category li .cat_04 { background-size: auto 40px; }
.category li .cat_05 { background-size: auto 40px; }
.category li .cat_06 { background-size: auto 40px; }
.category li .cat_07 { background-size: auto 40px; }
.category li .cat_08 { background-size: auto 40px; }
.category li .cat_11 { background-size: auto 40px; }
.category li .cat_12 { background-size: auto 40px; }
.category li .cat_13 { background-size: auto 40px; }
.category li .cat_14 { background-size: auto 40px; }
.category li .cat_01:hover { background-size: auto 40px; }
.category li .cat_02:hover { background-size: auto 40px; }
.category li .cat_03:hover { background-size: auto 40px; }
.category li .cat_04:hover { background-size: auto 40px; }
.category li .cat_05:hover { background-size: auto 40px; }
.category li .cat_06:hover { background-size: auto 40px; }
.category li .cat_07:hover { background-size: auto 40px; }
.category li .cat_08:hover { background-size: auto 40px; }
.category li .cat_11:hover { background-size: auto 40px; }
.category li .cat_12:hover { background-size: auto 40px; }
.category li .cat_13:hover { background-size: auto 40px; }
.category li .cat_14:hover { background-size: auto 40px; }

.section_board { padding: 30px 10px; }
.board_tab li { margin-left: 10px; }
.board_tab li a { font-size: 15px; padding-top: 16px; }
.board_tab li a::before { width: 6px; height: 6px; }

.board_panel { padding-top: 20px; }
.board_main li { width: 49%; }
.board_main li:nth-child(4n+1) { margin-left: 2%; }
.board_main li:nth-child(3n+1) { margin-left: 2%; }
.board_main li:nth-child(2n+1) { margin-left: 0; }
.board_main li a { padding: 20px 10px; }
.board_main li a .item { line-height: 20px; padding: 0 10px; font-size: 12px; margin-bottom: 12px; }
.board_main li a h3 { font-size: 14px; line-height: 20px; height: 40px; margin-bottom: 12px; }
.board_main li a .date { font-size: 12px; }
.board_main li a .misc { bottom: 20px; right: 10px; font-size: 12px; padding-right: 16px; }

.sub_banner { height: 168px; }
.sub_banner_01 { background-image: url(../images/sub_banner_01_m.jpg); }
.sub_banner_02 { background-image: url(../images/sub_banner_02_m.jpg); }
.sub_banner_03 { background-image: url(../images/sub_banner_03_m.jpg); }
.sub_banner_04 { background-image: url(../images/sub_banner_04_m.jpg); }
.sub_banner_05 { background-image: url(../images/sub_banner_05_m.jpg); }
.aside { top: 164px; width: 150px; padding: 20px 16px; }
.aside h2 { font-size: 26px; }
.aside_01 { background-size: auto 60px;  }
.aside_02 { background-size: auto 60px; }
.aside_03 { background-size: auto 60px; }
.aside_04 { background-size: auto 60px; }
.aside_05 { background-size: auto 110px; }

.sub_conts { padding: 0 10px 30px 10px; }
.sub_tit { padding-top: 20px; margin-bottom: 20px; }
.sub_tit h3 { font-size: 20px; text-align: center; }

.list_hd { margin-bottom: 20px; }
.list_hd > span { font-size: 12px; margin-right: 7px; line-height: 36px; }
.list_hd > select { width: 130px; height: 36px; font-size: 13px; }
.list_hd .search_box { position: relative; margin-top: 10px; display: flex; }
.list_hd .search_box select { width: 130px; height: 36px; font-size: 12px; }
.list_hd .search_box input { flex: 1; width: auto; height: 36px; font-size: 12px; }
.list_hd button { width: 36px; height: 36px; font-size: 12px; }

.list_01 li { width: 100%; margin-left: 0; margin-bottom: 8%; }
.list_01 li .img { margin-bottom: 16px; }
.list_01 li .img > p { font-size: 13px; }
.list_01 li a { height: auto; }
.list_01 li .cat { font-size: 15px; }
.list_01 li h4 { font-size: 18px; line-height: 26px; max-height: 52px; }
.list_01 li a > p { font-size: 13px; line-height: 20px; height: auto; }

.menu_tab { margin: 20px 0; }
.menu_tab_ext li { width: 33.33%; }
.menu_tab_ext li:nth-child(4) { border-left: 1px solid #dadada; }
.menu_tab_ext li:nth-child(7) { border-left: 1px solid #dadada; }
.menu_tab_ext li:nth-child(4) a { border-top: none; }
.menu_tab_ext li:nth-child(5) a { border-top: none; }
.menu_tab_ext li:nth-child(6) a { border-top: none; }
.menu_tab_ext li:nth-child(4) a.selected { border-top: 3px solid #091368; }
.menu_tab_ext li:nth-child(5) a.selected { border-top: 3px solid #091368; }
.menu_tab_ext li:nth-child(6) a.selected { border-top: 3px solid #091368; }
.menu_tab li a { font-size: 12px; letter-spacing: -0.5px;}

.prj_box .img { width: 100%; }
.prj_box .txt { width: 100%; }
.prj_box .txt h4 { font-size: 16px; margin-bottom: 10px; }
.prj_box .txt p { font-size: 13px; }
.sns_share { margin-bottom: 12px; margin-top: 12px; }
.sns_share a { width: 20px; height: 20px; }
.prj_box2 { margin-top: 20px; padding: 50px 15px 15px 15px; }
.prj_box2 > span { line-height: 30px; font-size: 13px; padding: 0 12px 0 35px; background-size: auto 10px; }
.prj_box2 p { font-size: 13px; }
.prj_box2 > a { position: relative; display: block; margin: 0 auto; right: auto; line-height: 40px; padding: 0 20px; font-size: 13px; top: auto; transform: translateY(0); margin-top: 20px; }
.prj_nav { margin-top: 30px; }
.prj_nav li { width: 100%; margin-bottom: 10px; }
.prj_nav li a { height: 110px; padding-left: 45%; padding-top: 16px; padding-right: 10px; }
.prj_nav li a .img { width: 40%; }
.prj_nav li a h3 { font-size: 13px; line-height: 20px; height: 40px; margin-bottom: 12px; }
.prj_nav li a > span { line-height: 30px; font-size: 12px; padding: 0 12px 0 30px; background-size: auto 10px; }

.faq_list li .q, .faq_list li .a { padding: 10px 20px 10px 35px; }
.faq_list li .item { top: 9px; left: 5px; width: 22px; height: 22px; line-height: 22px;font-size: 11px; }
.faq_list li .q { font-size: 14px; background: url(../images/arrD_01.png) right 10px top 16px no-repeat; background-size: auto 7px; }
.faq_list li .a { font-size: 13px; padding-top: 0; }

.table_board th { height: 48px; font-size: 14px; padding: 10px 0; }
.table_board td { height: 42px; font-size: 13px; padding: 10px 0; }
.table_board td .post_info { display: block; overflow: hidden; padding-top: 5px; }
.table_board td .post_info li { float: left; margin-left: 10px; font-size: 12px; color: #808080; font-weight: 400; }
.table_board td .post_info li:first-child { margin-left: 0; }
.table_board td .post_info li img { height: 14px; }
.table_board .tit { padding-left: 10px;}
.table_board .lock img { margin-top: 3px; margin-left: 3px; height: 12px; }
.table_board .status { width: 56px; line-height: 28px; font-size: 12px; }
.table_board .btn_cancel { width: 56px; line-height: 28px; font-size: 12px; margin-top: 5px; }
.table_board .ing { margin-right: 5px; }
.table_board .cmpl { margin-right: 5px; }

.pagination { text-align: center; margin: 15px 0; }
.pagination a { width: 24px; height: 24px; line-height: 22px; font-size: 12px; }
.pagination a img { height: 8px; }
.pagination a.selected::after { bottom: 3px; width: 8px; }

.view_header { padding: 12px 10px; }
.view_header h4 { font-size: 15px; margin-bottom: 5px; }
.view_info li { margin-left: 3px; padding-left: 7px; font-size: 12px; line-height: 16px; }
.view_conts { padding: 20px 10px; font-size: 13px; }
.view_conts p { font-size: 14px; }
.attach { padding: 12px 10px; }
.attach span { font-size: 13px; margin-right: 10px; }
.attach span img { height: 15px; }
.attach a { font-size: 13px; }
.board_nav { margin-top: 20px; }
.board_nav li { padding: 0 70px 0 60px; }
.board_nav li .item { width: 60px; font-size: 12px; line-height: 40px; }
.board_nav li .item img { margin-right: 5px; height: 4px; }
.board_nav li a { font-size: 12px; line-height: 40px; padding-left: 0; }
.board_nav li a img { height: 16px; }
.board_nav li .date { width: 70px; font-size: 12px; line-height: 40px; }
.view_header .status { width: 56px; line-height: 28px; font-size: 12px; }
.view_header.answer { padding: 20px 10px 0 10px; }

.btn_box_r { margin: 12px 0; }
.btn_box_c { margin: 12px 0; }
.cuation { font-size: 13px; }
.btn_box_r button, .btn_box_r a { min-width: 90px; font-size: 13px; line-height: 40px; padding: 0 10px; }
.btn_box_c button, .btn_box_c a { min-width: 90px; font-size: 13px; line-height: 40px; padding: 0 10px; }
.btn_box_c .btn_big, .btn_box_c .btn_big { min-width: 100%; margin: 0; }

.terms_box { padding: 16px; }
.terms { font-size: 13px; }
.terms > p { margin-bottom: 12px; }
.terms ul, ol { margin-bottom: 10px; }
.terms ul li, ol li { margin-bottom: 5px; }
.terms .noti { font-size: 13px; }
.selection_agree { margin: 10px 0; }
label { font-size: 13px; }
label input { width: 15px; height: 15px; margin-right: 5px; margin-top: -3px; }
.selection_agree label { margin: 0 12px; }

.selection_hd { margin: 20px 0; }
.selection_hd h3 { font-size: 16px; padding-bottom: 20px; }
.step_bar span { height: 4px; }

.bg_layer_pop .pop_alert { width: 260px; padding: 20px; }
.bg_layer_pop .pop_alert p { font-size: 14px; margin-bottom: 12px; }
.bg_layer_pop .pop_alert input { height: 35px; font-size: 13px; margin-bottom: 12px; }
.bg_layer_pop .pop_alert .btn_box_c button { min-width: 80px; height: 35px; line-height: 35px; font-size: 13px; }

.layer_pop { border-radius: 12px; width: 90%; padding: 15px; }
.layer_pop_hd { padding: 12px 0; }
.layer_pop_hd h4 { font-size: 18px; }
.layer_pop_hd button { width: 30px; height: 30px; }
.layer_pop_hd button img { height: 18px; }

.table_write th { font-size: 13px; height: 40px; width: 70px; }
.table_write td { font-size: 13px; height: 40px; }
.table_write td input, .table_write td select { padding-left: 10px; font-size: 13px; height: 36px; }
.table_write td select { width: 100%; min-width: 220px; }
.table_write td input[type="number"] { width: 100px; }
.table_write td select + input[type="number"] { margin-top: 5px; }
.table_write td textarea { padding: 10px; font-size: 13px; }
.table_write td .btn_file { width: 70px; height: 36px; margin-left: -70px; }
.table_write td .btn_file::after { line-height: 36px; font-size: 12px; }
.table_write td input[type="file"] { width: 70px; height: 36px; }
.btn_del { width: 70px; height: 36px; font-size: 12px; }
.table_write .chk_secret { width: 16px; height: 16px; }

.terms_box { max-height: 140px; overflow-y: auto; }

.login_box { margin: 20px auto 0 auto; width: 90%; }
.login_box h4 { font-size: 18px; margin-bottom: 10px; }
.login_input { padding: 10px 10px 10px 60px; margin-bottom: 10px; }
.login_input .icon { top: 10px; left: 10px; width: 30px; height: 30px; line-height: 30px; }
.login_input .icon img { height: 30px; }
.login_input h5 { font-size: 12px; }
.login_input input { font-size: 13px; height: 22px; }
.login_tool { margin: 20px 0; }
.login_tool a { font-size: 13px; }
.login_box .btn_login { height: 45px; line-height: 45px; font-size: 14px; }
.login_input .chk_overlap { top: 10px; right: 10px; width: 60px; height: 36px; font-size: 12px; }
.chk_terms_wrap { margin: 20px 0; }
.chk_terms_wrap h5 { font-size: 14px; }
.chk_terms_wrap label { font-size: 13px; line-height: 22px; }
.chk_terms { padding-left: 20px; }
.chk_terms a { font-size: 13px; }
.login_box > h5 { font-size: 16px; margin-bottom: 12px; }
.login_box > p { font-size: 14px; }
.login_box h4 img { height: 70px;}

.intro { padding-bottom: 50px; }
.intro .banner { height: 240px; margin-bottom: 20px; }
.intro .banner h2 { width: 160px; height: 100px; padding: 20px 10px; font-size: 16px; background-size: auto 24px; }
.intro p { font-size: 14px; }

.testbed h4 { font-size: 16px; margin: 10px 0 25px 0; }
.testbed h5 { font-size: 15px; }
.testbed_box { padding: 15px 10px; margin-bottom: 25px; }
.testbed_box .input_wrap { padding-left: 0; gap: 5px; padding-bottom: 20px; padding-top: 30px; }
.testbed_box .input_wrap .item { font-size: 14px; line-height: 36px; }
.testbed_box .input_wrap input[type=text] { height: 32px; font-size: 12px; padding-left: 5px; }
.testbed_box .input_wrap .btn_file { width: 60px; height: 32px; }
.testbed_box .input_wrap .btn_file::after { line-height: 32px; font-size: 12px; }
.testbed_box .input_wrap .btn_file input { width: 60px; height: 32px; }
.testbed_box .input_wrap .upload { width: 60px; height: 32px; font-size: 12px; }
.testbed_box .btn_box_c button, .testbed_box .btn_box_c a { min-width: 100%; margin: 0; }
.testbed_box textarea { padding: 10px; font-size: 14px; }
.testbed_box .noti { font-size: 12px; padding-left: 0; }

.agree_box { padding: 10px 0; }
.agree_box label { font-size: 13px; }
.agree_box label input { width: 15px; height: 15px; }

.prj_link { margin: 12px 0; }
.prj_link a { line-height: 26px; margin-left: 12px; font-size: 13px; }
.prj_link a img { height: 24px; }
.prj_git_hd { margin: 12px 0; font-size: 14px; }
.prj_git ul li { padding: 16px; }
.prj_git ul li .tools { top: 10px; right: 10px; }
.prj_git ul li .tools button { height: 22px; font-size: 13px; padding: 0 12px; min-width: 50px; margin: 0 5px; }
.prj_git ul li .tools span { line-height: 22px; font-size: 13px; }
.prj_git ul li .tools span img { margin-top: -3px; margin-right: 5px; height: 16px; }
.prj_git ul li h4 { font-size: 16px; padding-right: 0; padding-top: 13px; }
.prj_git ul li h5 { font-size: 14px; margin: 12px 0; }
.prj_git ul li h5 img { height: 18px; margin-right: 10px; }
.prj_git_conts { padding: 12px; font-size: 13px; }

.sitemap { padding-top: 30px; }
.sitemap > li { padding-bottom: 16px; }
.sitemap > li > span { font-size: 15px; }
.sitemap > li ul { padding: 12px 0; }
.sitemap > li ul li { width: auto; padding-right: 20px; }
.sitemap > li ul li a { font-size: 13px; }

.list_ext > li { min-height: 48px; padding: 10px 0; font-size: 13px; flex-wrap: wrap; justify-content: start; gap: 5px 10px; }
.list_ext > li .num { display: none; }
.list_ext > li .cat { width: auto; }
.list_ext > li .name { width: auto; }
.list_ext > li .detail { flex: none; padding-left: 0; }
.list_ext > li .phone { width: auto; }
.list_ext > li .email { width: auto; }
.list_ext .layer_pop { max-width: 800px; width: 90%; }
.personal_info { font-size: 14px; }
.personal_info li { padding-left: 16px; margin: 4px 0; }

.table_01 th { font-size: 13px; height: 40px; padding: 10px 0; }
.table_01 td { font-size: 13px; height: 40px; padding: 6px; }
.table_01 td.ta_left { padding-left: 16px; }

.ext_parts th { width: 150px; }

.no_data { padding: 60px 0; font-size: 14px; }

.ext_hd { margin: 12px 0; }
.ext_hd p { font-size: 14px; }
.ext_hd p.noti { padding-left: 14px; font-size: 13px; }
.ext_hd .btn_box { flex-wrap: wrap; gap: 10px; }
.ext_hd .btn_box a { min-width: 140px; height: 36px; line-height: 36px; font-size: 13px; padding: 0 10px; }

.table_write td > label { margin: 0 8px; margin-top: 3px; }
.table_write td > label input { width: 14px; height: 14px; margin-right: 2px; }
.table_write td > input + input { margin-top: 5px; }

.for_p { display: none; }
.for_m { display: block; }

}