@charset "UTF-8";
/* =========================================================
 * common
 * ========================================================= */
:root {
  --layout-padding-x: 20px;
}

body{
	width:100%;
	height:100%;
	font-family: "Pretendard", sans-serif;
    line-height: 1.5;
}
body.on{overflow:hidden;}

/********* 컨텐츠 넓이 *********/
.wrapper{padding: 0px var(--layout-padding-x);width: 100%;margin: 0px auto;height: 100%;}
@media only screen and (max-width: 1720px) {}
@media only screen and (max-width: 1250px) {}
@media only screen and (max-width: 767px) {}

/* 네비게이션 메뉴 */
.nav-menu{display: flex;}
.nav-menu ul li{padding: 12px;}
.nav-menu.active{display: block;}

/* =========================================================
 * scroll
 * ========================================================= */
.scroll-css::-webkit-scrollbar{
	margin: 15px 0px;
	width: 4px;
	border-radius: 4px;
	background: #F1F1F1;
}
.scroll-css::-webkit-scrollbar-thumb{
	background: #EBECF1;
	border-radius: 4px;
}
.scroll-css::-webkit-scrollbar-track{
	border-radius: 4px;
}

.custom-scroll{
	overflow-y: auto;
}
.custom-scroll::-webkit-scrollbar{
	width: 8px;
}
.custom-scroll::-webkit-scrollbar-thumb{
	height: 62%;
	background-color: #cfcfd0;
	border-radius: 4px;
	background-clip: padding-box;
	border: 2px solid transparent;
}
.custom-scroll::-webkit-scrollbar-track{
	border-radius: 4px;
}

/* =========================================================
 * skip navi
 * ========================================================= */

/* =========================================================
 * pagination
 * ========================================================= */
.pagination{margin-top: 70px;}
.pagination ul{
	display: flex;
	justify-content: center;
	align-items: center;
	column-gap: 5px;
	font-size: 16px;
}
.pagination ul li{
	width: 2.9375em;
	height: 2.9375em;
}
.pagination ul li a{
	width: 100%;
	height: 100%;
	font-size: 1.5em;
    line-height: 100%;
	letter-spacing: 0px;
	color: #7E84A3;
	border-radius: 4px;
    text-align: center;
    align-content: center;
}
.pagination ul li.active a{color: #FFFFFF;background: #3246A5;}
.pagination ul li.next a{
	background-repeat: no-repeat;
    background-position: center;
    background-color: transparent;
    background-size: 9px 18px;
	background-image: url(/static/image/icon/icon-chevron-right.svg)
}
.pagination ul li.prev a{
	background-repeat: no-repeat;
    background-position: center;
    background-color: transparent;
    background-size: 9px 18px;
	background-image: url(/static/image/icon/icon-chevron-left.svg)
}
.pagination ul li:not(.active) a:hover {
  background-color: #0000000d;
}
 
/* =========================================================
* commonStyle
* ========================================================= */
.icon{
	display: inline-block;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	vertical-align: middle;
	flex-shrink: 0;
}

.tab-menu .tab-body{display: none;}
.tab-menu .tab.active .tab-body{display: block;}

.btn-wrap{display: flex;justify-content: center;align-items: center;}
.btn{
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 90px;
	min-height: 34px;
	box-shadow: 0px 2px 2px #0000004D;
	border-radius: 3px;
	padding: 4px 15px;
	color: #FFF;
}
.btn p{ font-weight: 500; font-size: 17px; letter-spacing: -0.42px; }
.btn.royalBlue { background: #305DCD; }
.btn.deepblue { background: #0A2B7A; }
.btn.oceanBlue { background: #0054A6; }
.btn.outline-gray { background-color: #FFFFFF; border: 1px solid #ABA9AF; box-shadow: 0px 2px 2px #0000004D; }
.btn.outline-gray p{ font-weight: 700; font-size: 15px; letter-spacing: -0.38px; color: #000000; }
.btn.outline-light { background-color: #FFFFFF; border: 1px solid #D2D2D2; color: #000000; box-shadow: none; }



select,
input[type="text"],
input[type="date"],
input[type="number"],
input[type="password"]{width: 100%;height: 100%; padding:0 10px; border: 1px solid #D3D3D3; background-color:#FFF;}
input:read-only{background-color: #EEEEEE;}
input[type="text"]:disabled{background: #EEEEEE; border: 1px solid #D3D3D3;color: #000;}

textarea{
    width: 100%;
    min-height: 150px;
    padding: 10px;
    border: 1px solid #D3D3D3;
    resize: vertical;
}
textarea.s{min-height: 80px;}
textarea:read-only{background: #EEEEEE;color: #000;}

select{
	padding-right: 35px !important;
	background-image: url(/static/image/icon/icon-oper-select.svg);
    background-repeat: no-repeat;
	background-position: calc(100% - 10px) 50%;
	background-color: #F8F8F8;
	border: 1px solid #D1CFCD;
	border-radius: 3px;
	appearance: none;
	color: #000;
}

.input-wrap{min-height: 42px;}
.input-wrap:has(.search){position: relative;}
.input-wrap:has(.search) .search{
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
    width: 30px;
    height: 30px;
	background-image: url(/static/image/icon/icon-search-blue.png);
	background-size: contain;
}

input[type="radio"]{display: none;}
input[type="radio"]:checked + .text::before{
    border: none;
    background: url("/static/image/icon/radio-on.svg") no-repeat center/contain;
}



.radio-list{
    align-items: center;
	flex-shrink: 0;
}
.radio-wrap{
	display: flex;
	align-items: center;
	cursor: pointer;
    position: relative;
}
.radio-wrap .text{position: relative;padding-left: 30px;font-size: 16px;font-weight: 700;letter-spacing: 0px;color: #000000;}

.item-wrap{display: flex;width: 100%;}
.item-wrap .tit{flex: 0 0 100px;width: 100%;font-size: 18px; font-weight: 700;letter-spacing: -0.4px;align-content: center;}
.item-wrap > div{flex: 1;}


/**** 모달에서 사용  ****/
.inquiry-box{
    background: #F1F3F8;
    border: 1px solid #C1C9DC;
    padding: 20px 20px 20px 30px;
    display: flex;
    justify-content: space-between;
    gap: 18px 30px;
}
.tit-input-wrap{display: flex;max-width: 495px;width: 100%;column-gap: 20px;}
.tit-input-wrap .tit{font-size: 16px;font-weight: 700;letter-spacing: -0.4px;color: #000;align-content: center;flex-shrink: 0;}
.tit-input-wrap .input-wrap{min-height: 40px;display: flex;gap: 10px;flex: 1;}
.tit-input-wrap .input-wrap input{
	border: 1px solid #96A1D8;
	border-radius: 3px;

}
.tit-input-wrap .input-wrap .search{
    border-radius: 5px;
    font-size: 18px;
    letter-spacing: 0.18px;
    color: #FFFFFF;
    background: #00198F;
    padding: 4px 10px;
    width: 70px;
    position: unset;
    height: unset;
    transform: unset;
}
/********************/
table > * > tr > * {
    padding: 7px 10px;
    font-size: 16px;
    word-break: break-all;
    text-align: center;
}
.table-type-bg{overflow: hidden;margin-top: 25px;}
.table-type-bg table{
    width: 100%;
    border-top: 2px solid #464646;
    margin-left: -1px;
}
.table-type-bg tbody{background: #F8FAFE;}
.table-type-bg tbody td{
    border-left: none;
    position: relative;
	border-bottom: 1px solid #C7C7C7;
}
.table-type-bg tbody td.first{
    line-height: 34px; text-align: left; padding: 10px 20px 10px 20px;
}
.table-type-bg table tbody td:before{
    content: "";
    position: absolute;
	left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: calc(100% - 28px);
    background: #AAAAAA;
}

.modal .table-wrap{}
.modal .table-wrap table{
    width: 100%;
}
.modal .table-wrap thead{background: #EEF5F9; border-bottom: 1px solid #464646;}
.modal .table-wrap thead th{font-weight: 500;padding: 7px 4px;position: relative;}
.modal .table-wrap thead th:last-child:before{
	content: "";
	display: block;
	position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: calc(100% - 14px);
    background: #CBCBCB;
}
.modal .table-wrap tbody td{
    border-left: none;
	border-bottom: 1px solid #D0D1D2;
	line-height: 34px;
	/* line-height: 34px; first에서 가져옴 확인 ! */
}
.modal .table-wrap tbody td.first{
/* 	background: red;
	line-height: 34px; */
}


.search .list:has(.no-data){background: none;}
.no-data{
	display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
}
.no-data:before{
    display: block;
	content: "";
    width: 19px;
    height: 19px;
    background: url(/static/image/icon/icon-exclamation-circle.svg) no-repeat center;
    background-size: contain;
}
.con-box .table-wrap table:has(.no-data) td{width: 100%;margin-bottom: 0px;}
.con-box .table-wrap table:has(.no-data) td::before{content: none;}
.input-list{
    display: flex;
    gap: 15px 10px;
    margin: 30px 0px;
}
.input-list.column{
    flex-direction: column;
}

.process-steps{
    margin-bottom: 10px;
    border: 2px solid #D5D5D5;
    padding: 27px 40px;
    display: flex;
    gap: 15px;
}
.process-steps .step-top{
    background: #F5F5F5;
    border: 5px solid #D9D9D9;
    border-radius: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    aspect-ratio: 1 / 1;
    position: relative;
}

.process-steps .step-top::before{
    content: "";
    width: 50px;
    height: 5px;
    background: #ABB9DC;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: calc(100% + 5px);
}
.process-steps .step:last-child .step-top:before{content: none;}
.process-steps .step{width: calc((100% - 15px) / 6);}

.process-steps .step .num{
    font-size: 22px;
    font-weight: 800;
    letter-spacing: 0.22px;
    color: #FFFBB2;
}
.process-steps .step .tit{
    font-size: 20px;
    font-weight: 700;
    letter-spacing: 0.24px;
    color: #666666;
    width: 100%;
    height: 100%;
	display: flex;
    align-items: center;
    justify-content: center;
}
.process-steps .step .num{
    font-size: 22px;
    font-weight: 800;
    letter-spacing: 0.22px;
    color: #FFFBB2;
}
.process-steps .step .date{
    margin-top: 11px;
    text-align: center;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: -0.4px;
}

.process-steps .step-top.active{background: #FFF;border-color: #F37023;}
.process-steps .active .tit{color: #000;}

/* .f-unset{flex: unset !important;} */
.select-group{display: flex; gap: 10px;}
.select-group > div{flex: 1;}
.select-wrap{min-height: 42px;}

/**** /모달에서 사용  ****/






.radio-wrap .text::before{
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 23px;
    height: 23px;
    background: #FFFFFF;
    border-radius: 50%;
}



.check-wrap{
	display: flex;
	align-items: center;
	cursor: pointer;
	user-select: none;
}
.check-wrap .text{
	font-size: 16px;
	letter-spacing: -0.9px;
	color: #090909;
}
input[type="checkbox"]{display: none;}
.check-wrap:not(:has(.text)){justify-content: center;}
.check-wrap:not(:has(.text)) .checking{margin-left: 8px;}
.checking{
	display: inline-block;
	width: 17px;
	height: 17px;
	border-radius: 2px;
	background-color: #FFFFFF;
	background-repeat: no-repeat;
	background-position: center;
	border: 2px solid #D6D6D6;
	margin-right: 8px;
	box-sizing: border-box;
	flex-shrink: 0;
}
input[type="checkbox"]:checked + .checking{
    background: #547DE4 url(/static/image/icon/checkmark-on.svg) no-repeat center;
	border: none;
}
input[type="checkbox"]:disabled + .checking{background-color: #FFFFFF;}
/* 작은 blue-line */
.mini-blue-line{
    width: fit-content;
    position: relative;
    font-size: 16px;
    letter-spacing: -0.4px;
    color: #3246A5;
    padding-left: 12px;
    text-align: left;
}
.mini-blue-line::before{
    content: "";
    display: block;
    width: 5px;
    height: 14px;
    background: #3246A5;
    position: absolute;
    left: 0;
    top: 5px;
}
/* =========================================================
 * scroll
 * ========================================================= */
.scroll-css::-webkit-scrollbar{
	margin: 15px 0px;
	width: 4px;
	border-radius: 4px;
	background: #F1F1F1;
}
.scroll-css::-webkit-scrollbar-thumb{
	background: #8b8b8b;
	border-radius: 4px;
}
.scroll-css::-webkit-scrollbar-track{
	border-radius: 4px;
}
#menu-tabs.scroll-css::-webkit-scrollbar-thumb{
	background: #EBECF1;
}
/* =========================================================
* header
* ========================================================= */
.header{
	height: 86px;
	position: absolute;
	width: 100%;
	backdrop-filter: blur(6px);
	background: rgba(255, 255, 255, 0.55);
	z-index: 16;
}
.header .wrapper{
    max-width: 1800px;
    display: flex;
    justify-content: space-between;
}
.header .logo{
	display: flex;
    gap: 13px;
    align-items: center;
    justify-content: center;
}
.header .logo a{
    letter-spacing: -0.7px;
    color: #0D0D0D;
    font-weight: 700;
    font-size: 28px;
}
.header .btn-wrap .btn p{font-size: 15px;}
.nav{
	width: 100%;
	height: 100%;
}
.nav .btn-wrap{display: none;}
.menu-list{
    height: 100%;
    display: flex;
    align-items: center;
}
.menu-list > li{
	padding: 0px 20px;
    height: 100%;
    align-content: center;
    border-bottom : solid 7px transparent;
    position: relative;
}
.menu-list > li > a{
    font-size: 18px;
    font-weight: 800;
    margin-top: 7px;
}
.menu-list > li.active{border-bottom: solid 7px #305DCD;}
.menu-list > li.active:before{
    content: "";
    width: 100%;
    height: 10px;
    background: transparent;
    display: block;
    position: absolute;
    bottom: -17px;
    left: 0px;
}
.menu-list > li.active .submenu-list{display: block;}
.submenu-list{
	display: none;
    width: max-content;
    position: absolute;
    top: 96px;
	left: 0;
    background: #F9F9F9;
    box-shadow: 0px 0px 15px #0000004D;
    padding: 14px 25px;
}
.submenu-list li{
	min-height: 56px;
	padding-right: 40px;
	border-bottom: 1px solid #DCDCDC;
	align-content: center;
}
.submenu-list li:last-child{border-bottom: none;}
.submenu-list li a{
	font-weight: 700;
	font-size: 18px;
	letter-spacing: -0.9px;
	color: #000;
}
.submenu-list li.active a,
.submenu-list li:hover a{
	color: #305DCD;
}

/* 모바일 메뉴 열린 모슨 */
.m-menu-list{
    display: flex;
    align-items: center;
    flex-direction: column;
}
.m-menu-list > li{
    width: 100%;
    position: relative;
	padding: 20px;
}
.m-menu-list > li:not(:last-child){border-bottom: 1px solid #D1D1D1;}
.m-menu-list > li > a{
	width: 100%;
    height: 100%;
	font-size: 30px;
    font-weight: 700;
    text-align: center;
}
.m-menu-list > li.active{}
.m-menu-list > li.active:before{
    content: "";
    width: 100%;
    height: 10px;
    background: transparent;
    display: block;
    position: absolute;
    bottom: -17px;
    left: 0px;
}
.m-menu-list > li.active .m-submenu-list{display: flex;}
.m-submenu-list{
	display: none;
    gap: 10px 20px;
    align-items: center;
    flex-wrap: wrap;
	margin: 0px -20px;
    background: #DDE8F3;
    padding: 14px 25px;
	position: relative;
    top: 20px;
}
.m-submenu-list li{
    flex: 0 0 calc(50% - 10px);
}
.m-submenu-list li a{
	text-align: center;
    border-radius: 50px;
    width: 100%;
    padding: 11.5px 0px;
    background: #fff;
	font-weight: 700;
	font-size: 18px;
	letter-spacing: -0.9px;
	color: #000;
}
.m-submenu-list li.active a,
.m-submenu-list li:hover a{color: #305dcd;}
/* /모바일 메뉴 열린 모슨 */
.utility-menu{
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 20px;
}
.utility-menu li{}
.utility-menu li.bg-blue{
    border-radius: 3px;
    background: #0054A6;
}
.utility-menu li a{
    font-size: 16px;
    font-weight: 600;
    letter-spacing: -0.4px;
}
.utility-menu li a.state{
	padding-left: 29px;
	position: relative;
}
.utility-menu li a.state:before{
    content: "";
    display: block;
	width: 19px;
	height: 19px;
    background: url(/static/image/icon/icon-logout.svg) no-repeat center;
	background-size: contain;
    position: absolute;
    left: 0;
	top: 50%;
	transform: translateY(-50%);
}
.utility-menu li.bg-blue a{
    padding: 6px 14px;
    color: #FFFFFF;
}

/***** hover *****/
.utility-menu li:nth-of-type(2) a:hover{text-decoration: underline;}
.utility-menu li.bg-blue:hover{background: #00509E;}
/***** /hover *****/

/* =========================================================
* footer
* ========================================================= */
.footer{
    background: #333945;
}
.footer.white{background: none;}
.footer.white .f-text .link li { color: #000; }
.footer.white .f-text p { color: #000; }
.footer.white .f-text .copyright { color: #5D5D5D; }
.footer .wrapper{
    max-width: 1720px;
    padding: 32px var(--layout-padding-x);
    display: flex;
    justify-content: center;
    align-items: flex-start;
    position: relative;
}
.footer .f-logo{
    position: absolute;
    left: var(--layout-padding-x);
}
.footer .f-text{
    font-size: 18px;
}
.footer .f-text p{
    letter-spacing: 0.18px;
    color: #FFFFFF;
    text-align: center;
}
.footer .f-text p:nth-of-type(2){margin-top: 6px;}
.footer .f-text .copyright{color: #9FB2BD;}
.footer .f-text .link{
    display: flex;
    justify-content: center;
    margin-bottom: 16px;
}
.footer .f-text .link li{
    padding: 0px 30px;
    text-align: center;
    letter-spacing: 0px;
    color: #FFFFFF;
    font-weight: 700;
}
.footer .f-text .link li:not(:first-child){border-left: solid 1px #575B6D;}

/***** hover *****/
.footer .f-text .link li a:hover{text-decoration: underline;}
/***** /hover *****/







#pubAgndPrgrsModal .scroll-box:has(.table-wrap){overflow-y: auto;}
#pubAgndPrgrsModal .scroll-box table{border-top: 0px;}
#pubAgndPrgrsModal .table-wrap tbody td{padding: 13.25px 10px;line-height: initial;width: -webkit-fill-available;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    cursor: pointer;
}
#pubAgndPrgrsModal .scroll-box{max-height: 200px;}


/*  */
.accordion {
	width: 600px;
	margin: 20px auto;
	font-family: Arial, sans-serif;
}
.accordion-item {
	border: 1px solid #ccc;
	margin-bottom: 8px;
	border-radius: 4px;
	overflow: hidden;
}
.accordion-header {
	display: flex;
	align-items: center;
	padding: 12px 16px;
	cursor: pointer;
	font-weight: bold;
	justify-content: space-between;
	transition: background 0.3s, color 0.3s;
}
.accordion-header.active {
	background-color: #2f4ba0; /* 남색 */
	color: #fff;
}
.accordion-header:not(.active) {
	background-color: #fff;
	color: #2f4ba0;
}
.accordion-content {
	display: none;
	padding: 16px;
	background-color: #fff;
}
/*  */
.mini-total{
	position: relative;
	padding-left: 12px;
	font-weight: 500;
	font-size: 18px;
	line-height: 20px;
	letter-spacing: 0px;
}
.mini-total span{color: #305DCD;font-weight: 700;}
.mini-total:before{
	content: "";
	width: 6px;
	height: 100%;
	border-radius: 3px;
	display: block;
	position: absolute;
	background: #3246A5;
	left: 0px;
	top: 0px;
}

/* =========================================================
* loadingOverlay
* ========================================================= */
.loadingOverlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(255, 255, 255, 0.6);
	z-index: 9999;
	display: none;
}
.loadingOverlay .loaderImg {
	content: '';
	display: block;
	color: #d3ff4f;
	/* #3246A5 */
	font-size: 14px;
	width: 1em;
	height: 1em;
	border-radius: 50%;
	position: relative;
	text-indent: -9999em;
	-webkit-animation: load4 1.3s infinite linear;
	animation: load4 1.3s infinite linear;
	-webkit-transform: translateZ(0);
	-ms-transform: translateZ(0);
	transform: translateZ(0);
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

@keyframes load4 {
  0%,
  100% {
    box-shadow: 0 -3em 0 0.2em, 2em -2em 0 0em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 0;
  }
  12.5% {
    box-shadow: 0 -3em 0 0, 2em -2em 0 0.2em, 3em 0 0 0, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em;
  }
  25% {
    box-shadow: 0 -3em 0 -0.5em, 2em -2em 0 0, 3em 0 0 0.2em, 2em 2em 0 0, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em;
  }
  37.5% {
    box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em,
      3em 0em 0 0, 2em 2em 0 0.2em, 0 3em 0 0em, -2em 2em 0 -1em, -3em 0em 0 -1em, -2em -2em 0 -1em;
  }
  50% {
    box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 0em, 0 3em 0 0.2em, -2em 2em 0 0, -3em 0em 0 -1em, -2em -2em 0 -1em;
  }
  62.5% {
    box-shadow:
      0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 0, -2em 2em 0 0.2em, -3em 0 0 0, -2em -2em 0 -1em;
  }
  75% {
    box-shadow: 0em -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0.2em,
      -2em -2em 0 0;
  }
  87.5% {
    box-shadow: 0em -3em 0 0, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0, -2em -2em 0 0.2em;
  }
}

/** 공통 value **/
.hidden,.blind{overflow:hidden !important;visibility:hidden !important;position:absolute !important;width:0 !important;height:0 !important;padding:0 !important;line-height:0 !important;font-size:0 !important;}
.no-scroll{overflow:hidden !important;width:100%;height:100vh;touch-action:none;}
.hide-pc{display:none !important;}
.close-btn{
	content: "";
	width: 20px;
	height: 20px;
	background: url(/static/image/icon/icon-close.svg) no-repeat center;
	text-indent: -9999px;
    position: absolute;
    top: 20px;
    right: var(--layout-padding-x);
}
/* 모바일 메뉴 */
.mb-menu{
	display: flex;
	align-items: center;
}
.mb-menu > div{
	width: 27px;
	height: 21px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}
.mb-menu span{
	display: block;
	width: 100%;
	height: 3px;
	border-radius: 1px;
	background: #305dcd;
}
.wrap-gnb{height: 100%;}
.hide-pc:has(.logo){
	padding: 0px var(--layout-padding-x);
	height: 60px;
	background: #fff;
    position: relative;
	align-content: center;
}
.header .gnb-con{height: 100%;}
.header .gnb-con .logo{gap: 8px;}
.header .gnb-con .logo a{font-size: 21px;}
.header .gnb-con .logo img{width: 22px;}

.modal.type-01 .modal-body .mini-blue-line{margin-left: auto;}
.modal.type-01 .modal-body .title.mini-total{margin: 30px 0px 15px;}
.modal.type-01 .modal-body .file-box{
	background: #F1F3F8;
    border: 1px solid #C1C9DC;
	padding: 15px 10px 15px 10px;
	display: flex;
    align-items: flex-start;
    gap: 10px;
}
.modal.type-01 .modal-body .file-box > p{align-content: center;min-height: 34px;word-break: break-word;}
.modal.type-01 .modal-body .file-box .btn{column-gap: 10px;flex-shrink: 0;}
.modal.type-01 .modal-body .file-box .btn > p{font-size: 16px;}
.modal.type-01 .modal-body .file-box .icon.prev{
    width: 20px;
    height: 18px;
    background: url(/static/image/icon/icon-pub-prev.svg);
}
.btn.lightBl{ background: #dde6ee; box-shadow: none; color: unset; }
.btn.lightBl p{ font-size: 15px; }
.btn-wrap:has(.btn.lightBl){ border-top: solid 1px #4F5358; gap: 10px; margin-top: 15px; padding-top: 16px; }

@media (max-width: 1280px) {
	.hide-pc{display: block !important;}
	.nav{
		height: calc(100% - 60px);
		padding: 20px var(--layout-padding-x) 50px;
	}
	.wrap-gnb{
		display: none;
		transition: opacity 1s ease;
		position: fixed;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		width: 100%;
		height: 100vh;
		background: rgba(0, 0, 0, .7);
		z-index: 9999;
		opacity: 0;
	}
    .wrap-gnb.on {
		display: block;
        opacity: 1;
    }
    
	.header .logo a{font-size: 26px;}
	.header .logo img{width: 29px;}
	
	.gnb-con{
		width: 100%;
		overflow-y: auto;
		position: absolute;
		top: 0;
		bottom: 0;
		right: 0;
		/* transition: all .3s; */
		background: transparent linear-gradient(180deg, #F5F8FC 0%, #ECF3FB 100%);
	}
}

@media (max-width: 1280px) {
	.modal-dialog{padding: var(--layout-padding-x);}
	.process-steps{padding: 20px 30px;}
}
@media (max-width: 1024px) {
	.header{height: 60px;}
	.header .logo{gap: 8px;}
	.header .logo a{font-size: 21px;}
	.header .logo img{width: 22px;}
	
	.modal-header .close{width: 18px;height: 18px;}
	.utility-menu li:not(:has(.hide-pc)){display: none;}
	.footer .f-logo{display: none;}
	.footer .f-text{font-size: 16px;}
	.nav .btn-wrap{display: flex;}
	.nav .btn-wrap .btn{min-width: unset;width: 100%;}
	
	.modal.type-01 .modal-header{padding: 21px 1.15em;}
	.modal.type-01 .modal-header h5{font-size: 22px;line-height: 1.2;}
	.modal.type-01 .modal-body{padding: 24px 24px 20px;}
	.modal.type-01 .modal-body .contents{font-size: 16px;} /* pre */
	.modal.type-01 .modal-body .file-box > p{font-size: 15px;}
	.modal.type-01 .modal-body .mini-blue-line{margin-left: unset;font-size: 13px;}
	.modal.type-01 .modal-body .mini-blue-line::before{top: 3px;}
	
	.inquiry-box{padding: 20px 10px 10px 20px;}
	.input-list{gap: 10px;margin: 20px 0px;}
	.item-wrap .tit{flex: 0 0 80px;font-size: 16px;}
	.process-steps .step-top::before{}
	.process-steps .step .tit{}
	.process-steps .step .date{}

}
@media (max-width: 768px) {
	:root {--layout-padding-x: 16px;}
	
	.modal.type-01 .modal-header h5{font-size: 19px;}
	.modal.type-01 .modal-body{padding: 20px;}
	.modal.type-01 .modal-body .contents{font-size: 14px;} /* pre */
	.modal.type-01 .modal-body .file-box{padding: 10px;}
	.modal.type-01 .modal-body .title.mini-total{font-size: 16px;margin-bottom: 10px;}
	.modal.type-01 .modal-body .file-box .btn{min-width: unset;}
	.modal.type-01 .modal-body .file-box .btn > p{display: none;}
	.modal.type-01 .modal-body .check-wrap .text{font-size: 14px;}
	

	.m-menu-list > li{padding: 16px;}
	.m-menu-list > li a{font-size: 23px;}
	.m-submenu-list{gap: 10px;padding: 14px 18px;}
	.m-submenu-list li a{font-size: 15px;}
	.m-submenu-list li{flex: 0 0 calc(50% - 5px);}
	.footer .f-text{font-size: 14px;}
	.pagination{margin-top: 35px;}
	.pagination ul{font-size: 14px;}
	
	#pubAgndPrgrsModal .table-wrap tbody td{
	    width: unset;
	    text-overflow: unset;
	    overflow: unset;
	    white-space: unset;
	}

	.input-list .item-wrap > div{font-size: 15px;}
	
	.radio-list{gap: 10px 20px;}
	.inquiry-box{padding: 15px 10px 10px 15px;flex-direction: column;}
	.tit-input-wrap{max-width: 100%;flex-direction: column;}
	.tit-input-wrap .tit{font-size: 15px;margin-bottom: 7px;}
	.tit-input-wrap .input-wrap input{min-height: 40px;}
	.tit-input-wrap .input-wrap .search{font-size: 16px;}
	.modal .table-wrap thead th{font-size: 14px;}
	.modal .table-wrap tbody td{font-size: 14px;}
	
	.process-steps{flex-direction: column;align-items: center;}
	.process-steps .step{position: relative;width: 100%;}
	.process-steps .step-top{max-width: 120px;margin: 0px auto;}	
	.process-steps .step .date{margin: 7px 0px 11px 0px;}
	.process-steps .step-top::before,
	.process-steps .step:last-child .step-top::before{
        content: "";
        width: 5px;
        height: 15px;
        background: #ABB9DC;
        position: absolute;
        transform: translateX(-50%);
        left: 50%;
        top: -20px;
	}
	.process-steps .step:first-child .step-top::before{content: none;}
	.footer .wrapper{padding-top: 20px;padding-bottom: 20px;}
	.footer .f-text .link li{padding: 0px 15px;}
}
@media (max-width: 480px) {
	.header .logo a{font-size: 18px;}
	.header .gnb-con .logo a{font-size: 18px;}
}
@media (max-width: 375px) {
	.m-submenu-list li a{font-size: 13px;}
}

/* vue.js mustache bindings hidden support */
[v-cloak]{display: none;}