@charset "utf-8";

@import
	url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css')
	;

@import
	url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR&display=swap')
	;

:root {
	font-size: 10px;
	letter-spacing: -0.4px;
	font-family: 'Pretendard', sans-serif;
	--blue: #00AEEF;
	--darkblue: #012D74;
	--grey: #F3F6F9;
	--green: #177848;
}

/* Reset style */
* {
	word-break: keep-all;
	word-wrap: break-word;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
}

/*html, body {overflow-x: hidden;}*/
.not_scroll, .no-scroll {overflow: hidden;}

body {color: #231F20; font-size: 1.6rem; -webkit-touch-callout: none; -webkit-text-size-adjust: 100%; touch-action: pan-y;}

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p,
	blockquote, pre, a, abbr, acronym, address, big, cite, code, del, em,
	font, img, ins, q, s, small, strike, strong, sub, sup, dl, dt, dd, ol,
	ul, li, fieldset, form, label, legend, table, caption, thead, tbody,
	tfoot, tr, th, td, input {
	margin: 0;
	padding: 0;
	
}

blockquote, button, fieldset, iframe {
	border: 0;
}

cite, em, u, address, i {
	font-style: normal;
}

img {
	border: 0;
	vertical-align: top;
}

hr, legend {
	position: absolute;
	left: -9999px;
	top: -9999px;
}

caption {
	text-indent: -9999px;
	font-size: 0;
}

li {
	list-style: none;
}

table {
	width: 100%;
	table-layout: fixed;
	border-collapse: collapse;
}

a:link, a:visited, a:hover, a:active {
	text-decoration: none;
	color: inherit;;
}

/* Blind 숨김처리 */
.blind {
	position: absolute;
	left: -9999px;
	top: -9999px;
}

.skip {
	position: absolute;
	left: -9999px;
	top: -9999px;
}

/*body {font-family: 'Noto Sans KR', sans-serif; font-size: 16px;}*/
button, textarea {
	font-family: "Pretendard Variable", Pretendard, -apple-system,
		BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI",
		"Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic",
		"Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;
}

button {
	cursor: pointer;
}

/* 정렬 */
.al_c {
	text-align: center;
}

.al_r {
	text-align: right;
}

.vat {
	vertical-align: top;
}

.vam {
	vertical-align: middle;
}

/* 가로길이 */
.w_full {
	width: 100% !important;
}

.w_half {
	width: 50% !important;
}

.w_quarter {
	width: 25% !important;
}

.w_20 {
	width: 20px !important;
}

.w_50 {
	width: 50px !important;
}

.w_80 {
	width: 80px !important;
}

.w_100 {
	width: 100px !important;
}

.w_130 {
	width: 130px !important;
}

.w_150 {
	width: 150px !important;
}

.w_200 {
	width: 200px !important;
}

.w_250 {
	width: 250px !important;
}

.w_300 {
	width: 300px !important;
}

.w_350 {
	width: 350px !important;
}

.w_500 {
	width: 500px !important;
}

.h_30 {
	height: 30px !important;
}

.h_80 {
	height: 80px !important;
}

.h_200 {
	height: 200px !important;
}

.h_400 {
	height: 400px !important;
}

/* 여백 */
.mt0 {
	margin-top: 0 !important;
}

.mt10 {
	margin-top: 10px !important;
}

.mt40 {
	margin-top: 40px !important;
}

.pb10 {
	padding-bottom: 10px !important;
}

.mr5 {
	margin-right: 5px !important;
}

.mr10 {
	margin-right: 10px !important;
}

.mr15 {
	margin-right: 15px !important;
}

.mr20 {
	margin-right: 20px !important;
}

.mr30 {
	margin-right: 30px !important;
}

.ml5 {
	margin-left: 5px !important;
}

.ml10 {
	margin-left: 10px !important;
}

.ml15 {
	margin-left: 15px !important;
}

.ml20 {
	margin-left: 20px !important;
}

.pt20 {
	padding-top: 20px !important;
}

/*폰트사이즈*/
.font-13 {font-size: 1.3rem;}
.font-14 {font-size: 1.4rem;}
.font-15 {font-size: 1.5rem;}
.font-16 {font-size: 1.6rem;}
.font-17 {font-size: 1.7rem;}
.font-18 {font-size: 1.8rem;}
.font-20 {font-size: 2.0rem;}
.font-24 {font-size: 2.4rem;}
.font-26 {font-size: 2.6rem;}
.font-28 {font-size: 2.8rem;}
.font-34 {font-size: 3.4rem;}
.font-44 {font-size: 4.4rem;}
.font-60 {font-size: 6.0rem;}

@media only screen and (max-width: 1440px) {
	:root {
		font-size: 9.2px;
	}
}

@media only screen and (max-width: 1280px) {
	:root {
		font-size: 9px;
	}

	.font-44 {font-size: 4rem;}
	.font-60 {font-size: 5.0rem;}
}

@media only screen and (max-width: 767px) {
	:root {
		font-size: 8.4px;
	}
	
	.font-18 {font-size: 1.7rem;}
	.font-24 {font-size: 2rem;}
	.font-26 {font-size: 2.2rem;}
	.font-28 {font-size: 2.2rem;}
	.font-34 {font-size: 2.6rem;}
	.font-44 {font-size: 3.2rem;}
	.font-60 {font-size: 4.2rem;}
}

/*폰트색깔*/
.text-blue {color: var(--blue);}
.text-darkblue {color: var(--darkblue);}
.text-grey {color: #999;}

/*bg색깔*/
.color-white {background: #fff;}
.color-grey {background: var(--grey);}
.color-blue {background: var(--blue);}
.color-darkblue {background: var(--darkblue);}

.header {background: white; z-index: 1000; width: 100%; transition: .35s ease; border-bottom: 1px solid #E5E7E9; position: sticky; top: 0;}
.header::before {content: ""; display: none; width: 100%; height: 1px; background-color: rgba(255,255,255,0.1);
position: absolute; bottom: 0; z-index: 2;}
.header.active {transition: .35s ease}
.header.active::before {display: inline-block;}
.header > .inner {/*position: relative;*/ max-width: 1760px; width: 95%; height: 100px; margin: 0 auto; padding: 0; display: flex; align-items: center; justify-content: space-between;}
.header .left_col {padding-top: 0; font-size: 0; z-index: 2;}
.header .logo {display: inline-block; width: 132px; }
.header .logo img {display: block;}
.header .go {display: inline-block; margin-left: 12px; vertical-align: 0px;}
.header .go img {display: block;}

.header .top_menu {position: absolute; right: 50px; top: 17px;}
.header .top_menu > span {display: inline-block; height: 24px; font-weight: 300; line-height: 24px; vertical-align: top;}
.header .top_menu .t {color: #666;}
.header .top_menu .t span {color: #0465be; font-weight: 700;}
.header .top_menu .t span::before {content: ""; display: inline-block; width: 21px; height: 24px; margin-right: 8px; background: url(../images/ico_person.png) no-repeat center; vertical-align: top;}
.header .top_menu .d {margin-left: 14px; color: #888;}

/*.gnb {margin-top: 0; height: 100%; }
.gnb .gnb_wrap {height: 100%; position: relative; z-index: 5;}
.gnb .gnb_wrap > ul {display: flex; height: 100%; column-gap: 10rem;}
.gnb .gnb_wrap > ul > li {position: relative; }
.gnb .gnb_wrap > ul > li:first-child {padding-left: 0;}
.gnb .gnb_wrap > ul > li > a {padding: 0; font-size: 1.8rem; color: #231F20; font-size: 18px; font-weight: 600; line-height: normal; height: 100%; display: flex; align-items: center; position: relative;}
.gnb .gnb_sub {overflow: hidden; position: absolute; top: 100%; left: -200px; height: 0; width: 410px; z-index: 1000; font-size: 14px; font-weight: 300; text-align: center;
    -webkit-transition: height .35s ease; transition: height .35s ease; opacity: 0; visibility: hidden; transition-delay: 60ms;}
.gnb .gnb_wrap > ul > li:last-child .gnb_sub {left: auto; right: 0;}
.gnb .gnb_sub .menu_ko_title {font-size: 4.0rem; color: #fff; width: 200px; padding-top: 30px; padding-right: 80px; text-align: right;}
.gnb .gnb_sub_menu {width: 280px; background-color: #000; position: relative; } 
.gnb .gnb_sub_menu > li {width: 100%; padding: 0 25px;}
.gnb .gnb_sub_menu > li > a {color: #fff;}
.gnb .gnb_sub_menu > li > a img {filter: invert(100%) sepia(81%) saturate(0%) hue-rotate(268deg) brightness(141%) contrast(101%); display: inline-block; margin-left: 5px;}
.gnb .gnb_sub_menu > li:first-child {padding-top: 30px; }
.gnb .gnb_sub_menu ul {position: absolute; width: 110%; top: 0; left: 100%; height: 100%;}
.gnb .gnb_sub .gnb_sub_menu > li ul {opacity: 0; visibility: hidden; background-color: #fff; padding: 30px 23px 0;}
.gnb .gnb_sub .gnb_sub_menu > li ul::after {content: ""; display: inline-block; position: absolute; top: 2px; left: 0; height: calc(100% - 2px); width: 1px; background-color: rgba(255,255,255,0.2)}
.gnb .gnb_sub a {display: flex; align-items: center; justify-content: flex-start; width: 100%; padding: 6px 0; font-size: 1.6rem; font-weight: 300; color: #999;}
.gnb_bg {overflow: hidden; position: absolute; top: 0; left: 0; height: 0; z-index: 1; min-width: 100%; background: rgba(255,255,255,0.75); -webkit-transition: height .5s ease; transition: height .35s ease; transition-delay: 30ms;}*/
.header .gnb {display: flex; align-items: center; justify-content: space-between; column-gap: 10rem; }
.header .gnb, .header .gnb nav {height: 100%;}
.header .gnb .depth1 {display: flex; align-items: center; height: 100%;}
.header .gnb .depth1 > li {display: flex; align-items: center; position: relative; height: 100%;}
.header .gnb .depth1 > li:not(:last-child) {padding-right: 5rem;}
.header .gnb .depth1 > li > a {display: flex; align-items: center; justify-content: center; padding: 1.5rem 1rem; position: relative; z-index: 100; line-height: 1; 
border-radius: 1rem; font-size: 1.9rem; font-weight: 600; color: #231F20;}
.header .gnb .depth1 > li span {position: relative; text-decoration: underline; text-underline-offset: 5px; text-decoration-color: transparent;}
.header .gnb a {display: inline-block; font-family: 'Pretendard'; width: 100%; color: #222; word-break: keep-all;;}
.header .gnb .depth2 {position: absolute; top: 99%; width: 100%; z-index: 10; height: 0; overflow: hidden}
.header.open .depth2 > li + li {margin-top: 1.8rem;}
.header .gnb .depth2 > li > a {font-size: 1.5rem; text-align: left; transition: 0.15s;}
.header .gnb .depth3 {margin-top: 1.5rem;}
.header .gnb .depth3 > li > a {font-size: 1.5rem; color: #666;}

.header.open .depth1 > li::after {transition: height .25s, background-color .25s;}
.header.open .depth1 > li:hover::after {background: #F6F8FA; height: calc(100% + 40rem - 2px);}
.header.open .active .depth2 {display: flex; flex-direction: column; left: -2rem; height: auto; padding: 2.2rem; background: #fff; border-radius: 1rem; box-shadow: 0 0 8px rgba(0,0,0, 0.3); min-width: 22rem;}
.header.open .depth2 > li > a {padding: 0.2rem 0; line-height: 1.25; border-radius: 0.5rem; font-size: 1.6rem; font-weight: 600;}
.header.open .depth3 > li > a {padding: 0.6rem 1rem; position: relative;}
.header.open .depth3 > li > a::before {content: ""; display: inline-block; width: 2px; height: 2px; background: #666; position: absolute; left: 2px; top: 50%; transform: translateY(-50%);}


.header_hamburger_menu {position: relative; z-index: 2; display: none;}

.header-menu-open {display: none;}
.header .header-menu--btn {display: flex; justify-content: center; flex-direction: column; cursor: pointer; overflow: hidden; position: relative; z-index: 9999;}
.header .header-menu--btn span {width: 18px; height: 2px; margin: 2px 0; background: #222; transition: .15s;}

.header_link {display: flex; align-items: center; column-gap: 1.8rem;}
.header_link ul {display: flex; align-items: center; column-gap: 0.8rem;}
.header_link a {border-radius: 20px; border: 1px solid #E5E7E9; background: #F3F6F9; padding: 1rem 2.5rem; font-size: 1.5rem; color: #231F20;}
.header_link .mb-only {display: none;}

#header-search img.open {filter: invert(1);}
.header .search {height: 0; overflow: hidden; opacity: 0; visibility: hidden; transition: .15s ease; position: absolute; top: 101px; width: 100%; left: 0; z-index: 1;}
.header .search .inner {display: flex; align-items: center; column-gap: 6rem; padding: 4rem 10rem; justify-content: center;}
.header .search.active {height: auto; opacity: 1; visibility: visible;}

/*사이트맵*/
.f_nav {position: fixed; top: 0; left: 0; display: flex; opacity: 0; visibility: hidden; align-items: center; justify-content: center; width: 100%;
	height: 100%; background-color: #17191a; z-index: 55;}
.f_nav_close {max-width: 1300px; width: 95%; position: absolute; top: 0; text-align: right; height: 100px; display: flex; align-items: center; justify-content: flex-end;}
.f_nav_close button {background-color: transparent;}
.f_nav--active {opacity: 1; visibility: visible; transition: opacity 400ms, visibility 400ms; will-change: opacity, visibility;}
.f_nav_container {max-width: 1300px; width: 90%; margin: 0 auto;}
.f_nav_heading {font-size: 5.0rem; font-weight: 800; padding-bottom: 35px; border-bottom: 1px solid #eee;}
.f_nav_list {padding-top: 40px;}
.f_nav_list .depth01_item {transform: translateX(-2em); opacity: 0; transition: opacity 200ms, transform 200ms; will-change: transform, opacity;}
.f_nav_list .depth01_item--active {opacity: 1; transform: translateX(0);}
.f_nav_list ul {align-items: flex-start; justify-content: space-between;}
.f_nav_list li {text-align: center;}
.f_nav_list li a {display: inline-block; color: #fff;}
.f_nav_list .depth02 {padding-top: 35px;  position: relative;}
.f_nav_list .depth01 > li:first-child > a::after {content: ""; display: inline-block; width: 1300px; height: 1px; background: rgba(255,255,255,0.2); position: absolute;
bottom: 0; left: 0; }
/*.f_nav_list .depth01 > li {width: 20%;}
.f_nav_list .depth02 {width: fit-content; margin: 0 auto;}*/
.f_nav_list .depth01 > li > a {font-size: 3.5rem; font-weight: 800; color: var(--color-blue); width: 100%; position: relative; padding-bottom: 35px;} 
.f_nav_list .depth01 > li:nth-child(4) .has_child .depth03 {position: absolute;}
.f_nav_list .depth02 > li {text-align: left;}

.f_nav_list .depth02 > li > a {font-size: 2.0rem; font-weight: 600; padding: 15px 0; color: #fff;} 
.f_nav_list .depth02 > li > a img {display: none;}
.f_nav_list .depth03 {padding-left: 10px; width: fit-content; margin: 0 auto;}
.f_nav_list .depth03 > li {text-align: left;}
.f_nav_list .depth03 > li > a {font-size: 1.6rem; font-weight: 200; padding-bottom: 18px; color: rgba(255,255,255,0.7); white-space: nowrap;} 

.f_nav_list .depth02 > li:first-child > a {padding: 0 0 15px;}
.f_nav_list .depth01 > li:hover > a,
.f_nav_list .depth02 > li:hover > a,
.f_nav_list .depth03 > li:hover > a {color: var(--color-blue);}
.f_nav_list .depth02 > li:hover > a img {filter: invert(65%) sepia(97%) saturate(6549%) hue-rotate(185deg) brightness(104%) contrast(101%);}


@keyframes checked-overlay {
  0% { transform: scale(0); }
  90% { transform: scale(1); }
  100% { transform: scale(1); }
}
@keyframes not-checked-overlay {
  0% { transform: scale(1); }
  100% { transform: scale(0); }
}

.util_menu {display: none; position: absolute; right: 50px; top: 90px;}
.util_menu ul {font-size: 0; text-align: right;}
.util_menu ul li {display: inline-block; vertical-align: top;}
.util_menu ul li + li {margin-left: 17px;}
.util_menu ul li a {display: block; width: 60px; height: 60px;}
.util_menu .login {background: url(../images/ico_login.png) no-repeat;}
.util_menu .logout {background: url(../images/ico_logout.png) no-repeat;}
.util_menu .mail {position: relative; background: url(../images/ico_mail.png) no-repeat;}
.util_menu .mail span {display: block; position: absolute; right: -6px; top: -6px; width: 26px; height: 26px; border-radius: 50%; color: #fff; font-size: 16px; line-height: 26px; text-align: center; background: #eb6877;}
.util_menu .allmenu {background: url(../images/ico_allmenu.png) no-repeat;}
.util_menu .allmenu.on {background: url(../images/ico_allmenu_close.png) no-repeat;}


.container {min-height: calc(100vh - 360px);}
.content {min-height: 700px; padding-bottom: 100px;}
.container_inner {max-width: 1300px; width: 90%; margin: 0 auto;}

.dfbox {display: flex;}
.dfbox.column {flex-direction: column;}

.sub_layout {border-top: 1px solid #cccccc;}
.sub_in {width: 1400px; margin: 0 auto; padding: 0 50px;}

.layout {display: table; width: 100%; table-layout: fixed;}

/* sub navigation */
.layout .nav {display: table-cell; width: 260px; padding-top: 70px; vertical-align: top;}
.layout .nav .inner {border: 1px solid #dde2e5; border-radius: 10px; box-shadow: 3px 8px 13px #ccc;}
.layout .nav h2 {padding: 31px 30px 24px 30px;  border-bottom: 4px solid #dde2e5; color: #222; font-size: 24px;}

.layout .nav .inner > ul {padding: 26px 30px 27px 30px;}
.layout .nav .inner > ul > li + li {margin-top: 27px;}
.layout .nav .inner > ul > li > a {display: block; position: relative; color: #666; font-size: 18px; font-weight: 500;}
.layout .nav .inner > ul > li > a.cur {color: #222; font-weight: 700;}
.layout .nav .inner > ul > li > ul {margin-top: 10px;}
.layout .nav .inner > ul > li > ul > li a {display: block; color: #666; font-size: 16px; letter-spacing: -1px;}
.layout .nav .inner > ul > li > ul > li a.cur {color: #222; text-decoration: underline;}
.layout .nav .inner > ul > li > ul > li {position: relative; padding-left: 14px;}
.layout .nav .inner > ul > li > ul > li::before {content: ""; display: block; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 4px; height: 4px; background: #474747;}

.layout .content_wrap {display: table-cell; width: auto; padding-left: 70px;}


/* popup */
.popup {z-index: 10; position: fixed; left: 0; top: 0; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, .7);}
.popup .pop_inner {position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 400px; border-radius: 19px; background: #fff;}
.wrap_pop {padding: 20px;}
.pop_container {padding: 29px 40px;}
.pop_container .box_1 {padding: 26px; border: 1px solid #dde2e5; border-radius: 10px;}

.popup .pop_inner h2 {margin: 29px;}

.pop_header {position: relative; height: 94px; border-bottom: 1px solid #dde2e5;}
.pop_header h1 {padding: 42px 29px 0 29px; color: #222; font-size: 24px; font-weight: 700;}
.pop_header .close {display: block; position: absolute; right: 39px; top: 40px; width: 30px; height: 30px; font-size: 0; background: url(../images/ico_pop_close.png) no-repeat;}



/* location */
/*.location {height: 70px; padding-top: 42px; text-align: right;}
.location ul, .location ul li {display: inline-block; vertical-align: top;}
.location ul li {position: relative; color: #666; font-size: 14px;}
.location ul li + li::before {content: ""; display: inline-block; width: 4px; height: 7px; margin: 0 9px 0 3px; line-height: 18px; background: url(../images/ico_arrow_r_gray_4x7.png) no-repeat; vertical-align: 2px;}
.location ul li:last-child {color: #222; text-decoration: underline;}
.location ul li a {display: inline-block; color: #666; font-size: 14px;}
.location ul li a:hover {color: #222; text-decoration: underline;}
.location ul li a.home {position: relative; padding-left: 19px;}
.location ul li a.home::before {content: ""; display: block; position: absolute; left: 0; top: 3px; width: 14px; height: 13px; background: url(../images/ico_home.png) no-repeat;}*/


footer .inner {display: flex; align-items: center; flex-wrap: wrap; max-width: 1760px; }
footer * {color: #fff;}
.footer { background-color: #0A223C; padding: 5.4rem 0; position: relative; z-index: 20;}
.footer .inner {column-gap: 8.5rem;}
.footer .company-wrap {display: flex; align-items: center; column-gap: 2rem; margin-bottom: 2.2rem;}
.footer .term-list {display: flex; align-items: center; column-gap: 8px; }
.footer .term-list a {text-decoration: underline; text-decoration-color: transparent; text-underline-offset: 3px;}
.footer .footer-info--company { font-weight: 600;}
.footer .footer-info--detail p {line-height: 1.5; font-weight: 300;}
.footer .footer-copyright {margin-left: auto;}
.footer-banner {background: #031223; padding: 1.8rem 0;}
.footer-banner .inner { flex-direction: column; row-gap: 2rem;}
.footer-banner .banner-wrap {display: flex; column-gap: 4.4rem; row-gap: 1rem; align-items: flex-start; width: 100%;}
.footer-banner--title {position: relative; flex: 0 0 auto;}
.footer-banner--title::after {content: ""; display: inline-block; width: 0.5px; height: 0.8em; background: rgba(255, 255, 255, 0.20); 
position: absolute; right: -2.2rem; top: 0.4rem; transform: translate(50%, 0);}
.footer-banner--list ul {display: flex; align-items: center; flex-wrap: wrap; column-gap: 2.2rem; row-gap: 0.6rem;}
.footer-banner--list a {font-size: 1.5rem; font-weight: 300;}

.quick_menu {position: fixed; right: 0; bottom: 25%; z-index: 50;}
.quick_menu * {font-size: 1.3rem;}
.quick_menu .quick_list {box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.07);}
.quick_menu .quick_list ul {max-height: 500px; overflow: hidden; transition: max-height 0.25s ease, opacity 0.4s ease; opacity: 1;}
.quick_menu li a {display: flex; flex-direction: column; align-items: center; justify-content: center; row-gap: 5px; text-align: center; width: 10rem; height: 10rem; background: #fff; }
.quick_menu li + li {border-top: 1px solid #E5E7E9;}
.quick_menu .quick_item--icon {display: inline-block; width: 5rem; height: 3.6rem; background-size: contain; background-position: 50% 50%; background-repeat: no-repeat;}
.quick_menu li:nth-child(1) .quick_item--icon {background-image: url('../images/quick_icon01.svg');}
.quick_menu li:nth-child(2) .quick_item--icon {background-image: url('../images/quick_icon02.svg');}
.quick_menu li:nth-child(3) .quick_item--icon {background-image: url('../images/quick_icon03.svg');}
/* OSJ 퀵메뉴 아이콘 처리 : data-type 값으로 분기 */
.quick_menu li[data-type="proficiency_scheme"] .quick_item--icon {background-image: url('../images/quick_icon01.svg');} /* 숙련도시험 */
.quick_menu li[data-type="annual_task"] .quick_item--icon {background-image: url('../images/quick_icon01.svg');} /* 스킴개발 과제 목록 */
.quick_menu li[data-type="comparison"] .quick_item--icon {background-image: url('../images/quick_icon02.svg');} /* 비교시험/측정 심사신창 */
.quick_menu li[data-type="mypage"] .quick_item--icon {background-image: url('../images/quick_icon03.svg');} /* 마이페이지 */
.quick_menu li[data-type="notice"] .quick_item--icon {background-image: url('../images/quick_icon01.svg');} /* 공지사항 */
.quick_menu button {display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; color: #fff; background: var(--darkblue); width: 10rem; height: 10rem;}
.quick_menu button .quick_item--icon {width: 2.4rem; height: 2.4rem; background-image: url('../images/icon_x.svg');}
.quick_menu button .quick_close {transition: 0.15s;}
.quick_list.closed ul {max-height: 0; opacity: 0;}
.quick_list.closed + button .quick_close {transform: rotate(45deg);}

#gotoTop {display: flex; align-items: center; justify-content: center; transform: translateX(50%) translateY(10%); opacity: 0; cursor: pointer;
position: fixed; z-index: 50; right: 5rem; bottom: 5%; background: #fff; border-radius: 999px; width: 5rem; height: 5rem; box-shadow: 3px 5px 15px rgba(0,0,0,0.25);}
#gotoTop.on {transform: translateX(50%) translateY(0); opacity: 1;}
#gotoTop button {width: 2rem; height: 2rem; transform: rotate(180deg); padding: 0;}
#gotoTop button img {width: 100%;}


.tit_1 + .txt_1 {margin-top: 42px;}
.txt_1 + .tit_2 {margin-top: 45px;}
.txt_2 + .condition {margin-top: 17px;}
.txt_2 + .condition2 {margin-top: 17px;}

.tit_2 + .condition {margin-top: 23px;}
.tit_2 + .condition2 {margin-top: 23px;}
.tit_2 + .board_view {margin-top: 43px;}
.tit_2 + .board_view2 {margin-top: 43px;}
.tit_2 + .tit_3 {margin-top: 35px;}
.tit_2 + .tit_4 {margin-top: 34px;}
.tit_2 + .txt_2 {margin-top: 19px;}

.tit_3 + .condition {margin-top: 23px;}
.tit_3 + .condition2 {margin-top: 23px;}
.tit_3 + .board_view2 {margin-top: 24px;}

.tit_4 + .board_view2 {margin-top: 25px;}
.tit_4 + .msg_1 {margin-top: 24px;}

.condition + .board_list {margin-top: 50px;}
.condition + .board_view2 {margin-top: 30px;}

.board_list + .board_list_bot {margin-top: 40px;}
.board_list2 + .board_list_bot {margin-top: 20px;}

.board_view2 + .board_view_bot {margin-top: 40px; height: 120px;}
.board_view2 + .tit_4 {margin-top: 42px;}

.board_view2 + .board_view3 {margin-top: 30px;}
.board_view2 + .board_view4 {margin-top: 30px;}
.board_view2 + .board_top {margin-top: 42px;}

.board_view3 + .board_view_bot {margin-top: 30px;}
.board_view4 + .board_view_bot {margin-top: 30px;}

.board_attach + .board_view_bot {margin-top: 30px;}

.board_top + .board_list {margin-top: 24px;}

.condition + .board_list_top {margin-top: 30px;}
.condition2 + .board_list2 {margin-top: 20px;}
.condition2 + .board_list {margin-top: 30px;}
.condition2 + .board_list_top {margin-top: 30px;}
.board_list_top + .board_list {margin-top: 20px;}



.footer .admin_login_wrap {position: absolute;  right: 260px;  top: 15px; display: flex;}
.footer .admin_login_wrap .admin_login { display: block; width: 20px;  height: 20px;  text-indent: -99999px; background-image: url(../images/setting.svg); background-size: cover; opacity: 0.4;}
.footer .admin_login_wrap .admin_logout {margin: 0 !important; margin-left: 20px !important; color: #fff;}


/************ 미디어쿼리 *************/
@media (hover: hover) {
	.header .gnb .depth1 > li a:hover span {text-decoration-color: #231F20}
	.header .gnb .depth2 > li:hover > a {color: var(--blue)}
	.header .gnb .depth3 a:hover {color: #231F20}
	.header_link a:hover {background: var(--darkblue); color: #fff; border-color: var(--darkblue);}
	.footer-banner--list a:hover {color: var(--blue);}
	.footer .term-list a:hover {text-decoration-color: #fff;}
	.quick_menu li a:hover {background: #F3F6F9;}
	.quick_menu button:hover {background: var(--blue)}
}

@media only screen and (min-width: 1025px) {
	.gnb:hover + .gnb_bg {height: 410px; margin-top: 0; }
	.gnb:hover .gnb_wrap > ul > li:hover > a {color: var(--color-blue);}
	.gnb:hover .gnb_wrap > ul > li:hover > a::after {content: ""; display: inline-block; width: 100%; height: 3px; background-color: #008de7; position: absolute; bottom: 0; left: 0;}
	/*.gnb:hover .gnb_sub {overflow: visible; height: 275px; opacity: 1; visibility: visible;}*/
	.gnb .gnb_wrap > ul > li:hover .gnb_sub {overflow: visible; height: 310px; opacity: 1; visibility: visible;}
	.gnb:hover .gnb_sub .gnb_sub_menu > li > a:hover span {position: relative; color: var(--color-blue);}
	.gnb:hover .gnb_sub .gnb_sub_menu > li:hover > a {color: #578ce3; font-weight: 600;}
	.gnb:hover .gnb_sub .gnb_sub_menu > li:hover > a img {filter: invert(65%) sepia(97%) saturate(6549%) hue-rotate(185deg) brightness(104%) contrast(101%);}
	.gnb:hover .gnb_sub .gnb_sub_menu > li:hover ul {opacity: 1; visibility: visible;}
	.gnb:hover .gnb_sub .gnb_sub_menu > li ul a:hover span {color: #fff; font-weight: 500;}
	.footer h1 .btn_download:hover {background: var(--color-blue); border-color: var(--color-blue);}
	/*.quick_menu .quick_item:nth-child(3):hover {color: #d91d1f;}*/
	
	/* .header_download .ul_wrap .download_select .dlink:hover::before {background-color: #fff;} */
	.header_download .ul_wrap .download_select .dlink:hover { background: #0973b7}
	
	.footer .mid address a:hover,
	.footer .right_col .site_map_link:hover {color: #fff; opacity: 1; font-weight: 400;}
	.footer .mid address a.pc_nohover:hover {color:inherit; opacity: inherit; font-weight: inherit; cursor: default;}
	.footer .right_col .sns_link:hover {background-color: #fff;}
	.footer .right_col .sns_link.youtube:hover::after,
	.footer .right_col .sns_link.facebook:hover::after,
	.footer .right_col .sns_link.blog:hover::after { filter:invert(1) contrast(2);}
	.footer .right_col .flink:hover {background: #578ce3; color: #fff;}
	.footer .right_col .download li a:hover { background-color: #fff; border-color: #fff; color: #000;}
	.footer .right_col .download li a:hover img {opacity: 1; filter: invert(1);}
}

@media (max-width: 1780px) {
	.header > .inner {flex-wrap: wrap; height: 140px;}
	.header .inner > div:not(.header-menu-open) {display: flex; align-items: center; height: 70px;}
	.header .gnb {order: 4; width: 100%; justify-content: center;}
	.header .gnb nav {width: 80%;}
	.header .gnb .depth1 {justify-content: center;}
}

@media (max-width: 1440px) {
	.gnb .gnb_sub {left: -160px; width: 370px;}
	.gnb .gnb_sub .menu_ko_title {width: 160px; font-size: 3.4rem; padding-right: 60px;}
	.gnb .gnb_sub_menu > li {padding: 0 1.65vw;}
	/*.gnb .gnb_wrap > ul > li {margin-left: 30px;}*/
	.header .gnb .depth1 > li:not(:last-child) {padding-right: 4rem;}	

}

@media (max-width: 1280px) {	
	
}

@media ( max-width: 1024px ) {
	body {-webkit-user-select: none;  user-select: none;}
	.gnb {display: none;}
	
	.quick_menu li a, .quick_menu button {width: 8.5rem; height: 8.5rem;}
	.quick_menu .quick_item--icon {width: 4rem; height: 2.8rem;}
	
	.header > .inner {height: 8rem; justify-content: flex-start;}
	.header .inner > div:not(.header-menu-open) {height: auto;}
	.header .gnb {position: fixed; right: -100%; top: 0; margin: 0; padding: 0; padding-top: 8rem; z-index: 5000; max-width: none; min-width: 280px; 
	width: 74%; height: 100% !important; background-color: #fff; -webkit-transition: all 0.5s; -moz-transition: all 0.25s; -ms-transition: all 0.25s; -o-transition: all 0.25s; transition: all 0.25s;}
	.header .gnb nav {width: 100%;}
	.header .gnb .depth1 {display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; row-gap: 1.5rem; overflow-y: scroll; padding: 2.5rem 2rem 8rem;
	margin-left: 0; width: 100%; scrollbar-width: none; scroll-behavior: smooth;}
	.header .gnb .depth1 > li {flex-direction: column; height: auto;}
	.header .gnb .depth1 > li > a {justify-content: flex-start; cursor: pointer;}
	.header .gnb .depth1 > li span {font-weight: 600;}
	.header .gnb .depth2 {position: static; box-shadow: none !important;}
	.header .gnb .depth2 > li > a {font-weight: 400;}
	.header .gnb .depth3 {margin-top: 1rem;}
	.header-menu-open {display: block;}
	.header.open .gnb {right: 0;}
	.header.open .active .depth2 {padding: 1rem 2.2rem;}
	.header.open .header-menu--btn span:nth-child(1) {transform: rotate(45deg) translateY(-0.5px); transform-origin: 0 50%;}
	.header.open .header-menu--btn span:nth-child(2) {transform: translate(-100%); opacity: 0;}
	.header.open .header-menu--btn span:nth-child(3) {transform: rotate(-45deg) translateY(0.5px); transform-origin: 0 50%;}
	.header .header_link {margin-left: auto; margin-right: 0.5rem;}
	.header .header_link ul {opacity: 0; visibility: hidden; transition: opacity 0.15s; transition-delay: 0.15s; }
	.header.open .header_link ul {opacity: 1; visibility: visible; z-index: 9999; position: absolute; left: 29%; top: 0; padding-top: 3rem;}
	
	.header .search {top: 8.1rem;}
	.header .search .inner {padding: 4rem 0; column-gap: 3rem;}
	
    /* 모바일 메뉴 Break Point */
   	.header_link .pc-only {display: none;}
   	.header_link .mb-only {display: block;}
    /*.header {position: fixed; left: 0; top: 0; width: 100%; background: #fff; z-index: 999;}*/
    .header_download {margin-left: auto; margin-right: 25px;}
    .header_download .download_btn {padding: 10px 0 10px 28px;}
    .header_hamburger_menu {opacity: 1; visibility: visible; /*z-index: 19999; position: fixed;*/}
    #logo {display: none}
    .mobile_menu_logo {display: block; position: fixed;   top: 0;  left: 0;  width: 100%;  height: 90px; z-index: 1999;}
    .mobile_menu_logo a {  display: block;  width: 145px;  height: 90px;  background: url(../img/main/logo.png) no-repeat center; background-size: 80% !important; transition: 0.35s ease;}
    .mobile_menu_logo.open a {filter: grayscale(1) brightness(3);}
    
}

@media ( max-width: 767px ) {
	.header > .inner {height: 7rem; flex-wrap: nowrap;}
	.header .gnb {padding-top: 7rem;}
	.header .gnb.login {padding-top: 10rem;}
	.header .gnb .depth1 {row-gap: 0.5rem;}
	.header .gnb .depth1 > li > a {padding: 1.2rem 1rem}
	.header .header_link ul {width: auto; flex-wrap: wrap; row-gap: 1.5rem;}
	.header .header_link a {display: flex; align-items: center; padding: 0.8rem 2rem;}
	.header .login-welcome {width: 100%; }
	.header.open .header_link ul {padding-top: 2.5rem;}
    .header .logo {width: 10rem;}
    .header .logo img {width: 100%}
    .header .search {top: 7.1rem;}
    .header .search .inner {flex-wrap: wrap; row-gap: 1rem; justify-content: flex-start; padding: 3rem 0;}
    
    .footer {padding: 3.5rem 0;}
    .footer .inner {row-gap: 1rem;}
    .footer .footer-logo {width: 12rem;}
    .footer .footer-logo img {width: 100%;}
    .footer .footer-copyright {margin-left: 0;}
}

@media (max-width: 600px) {
	
}

@media (max-width: 480px) {
	.header .gnb {width: 80%;}
	.header .header_link ul {width: 0; flex-wrap: wrap; row-gap: 1rem; column-gap: 0.6rem; padding-left: 2rem;}
	.header.open .header_link ul {width: auto; padding-top: 1.5rem;  width: 80%; left: auto; right: 0;}
	.header.open .gnb.login + .header_link ul {padding-top: 2.5rem;}
	.header .gnb.login {padding-top: 10rem;}
}

@media (max-width: 360px) {
	.header .gnb.login {padding-top: 13rem;}
	.header.open .header_link {left: auto; right: 12.5rem;}
	.header.open .header_link ul {width: 85%;}
	.header .login-welcome {padding-bottom: 0.5rem;}
	.header .manage {width: 95%;}
	.header .gnb.login + .header_link .manage ~ li {width: calc((95% - 0.6rem) / 2);}
	.header .gnb.login + .header_link a {justify-content: center;}
}