/*공통*/
.un-style {list-style: none; margin:0; padding:0;}
.clearfix:after {content:" "; display: table; clear:both;}

.fnl {font-weight: 300 !important;}
.fnr {font-weight: 400 !important;}
.fnm {font-weight: 500 !important;}
.fnsb {font-weight: 600 !important;}
.fnb {font-weight: 700 !important;}
.fneb {font-weight: 800 !important;}

table {table-layout: fixed;}

@font-face {
  font-family: 'SeoulHangangM';
  src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_two@1.0/SeoulHangangM.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'KimjungchulMyungjo-Bold';
  src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2302_01@1.0/KimjungchulMyungjo-Bold.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
}

.ffp {font-family: Pretendard-Regular;}
.ffn {font-family: Noto Sans KR !important;}

.line-15 {line-height: 1.5;}
.line-2 {line-height: 2;}

h5.title {font-size: 2rem !important;}
h4.title {font-size: 3rem !important;}
h3.title {font-size: 3.6rem !important;}
h2.title {font-size: 4rem !important;}
h1.title {font-size: 4.4rem !important;}

p.content {font-size: 1.7rem !important;}

.ptitle {font-size: 2.5rem;}

.cs-title {font-size: 2.4rem !important;}
.cm-title {font-size: 2.8rem !important;}
.cl-title {font-size: 3.2rem !important;}
.cx-title {font-size: 3.4rem !important;}

.bb-content {font-size: 2.2rem !important;}
.pp-content {font-size: 2rem !important;}
.cs-content {font-size: 1.8rem !important;}
.ss-content {font-size: 1.6rem !important;}

.mb05 {margin-bottom: 5px !important;}
.mb2 {margin-bottom: 2rem !important;}
.mb4 {margin-bottom: 4rem !important;}
.mb5 {margin-bottom: 5rem !important;}
.mb6 {margin-bottom: 6rem !important;}
.mb7 {margin-bottom: 7rem !important;}
.mb8 {margin-bottom: 8rem !important;}
.mb9 {margin-bottom: 9rem !important;}
.mb10 {margin-bottom: 10rem !important;}

.mt2 {margin-top: 2rem !important;}
.mt4 {margin-top: 4rem !important;}
.mt10 {margin-top: 10rem !important;}

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

.pt4 {padding-top: 4rem !important;}
.pt5 {padding-top: 5rem !important;}
.pt6 {padding-top: 6rem !important;}
.pt10 {padding-top: 10rem !important;}

.pb6 {padding-bottom: 6rem !important;}
.pb10 {padding-bottom: 10rem !important;}

.co66 {color: #666666 !important;}
.co00 {color: #000000 !important;}
.coff {color: #FFFFFF !important;}
.co35 {color: #353535 !important;}
.co33 {color: #333333 !important;}
.codc {color: #DCDCDC !important;}
.co42 {color: #424242 !important;}
.co4e {color: #F15D4E !important;}
.co66 {color: #666666 !important;}
.co68 {color: #203368 !important;}

.bkff {background-color: #FFFFFF !important;}

.bbd8 {border-bottom: 1px solid #D8D8D8;}

.list-dot > li {position: relative; padding-left: 10px; }
.list-dot > li:after {position: absolute; content: ''; display: block; width: 3px; height: 3px; border-radius: 50%; top: 14px; left: 0; transform: translateY(-50%); background-color: #000000;}
.list-dot.co66 > li:after {background-color: #666666;}

.list-flex > li {display: flex;}
.list-flex  >li span:nth-child(1) {flex: none;}

.list-back > li {background-color: #FFFFFF; border-radius: 73px; padding: 1.5rem 2.8rem;}

.rowm-10 {margin-left: -10px; margin-right: -10px;}
.rowm-10 > div {padding-left: 10px; padding-right: 10px;}

.rowm-20 {margin-left: -20px; margin-right: -20px;}
.rowm-20 > div {padding-left: 20px; padding-right: 20px;}

.btn.btn-l {font-size: 2rem; padding: 20px 0;}
.btn.btn-m {font-size: 1.8rem; font-weight: 500; padding: 1rem 6.4rem;}
.btn.btn-s {font-size: 1.6rem; padding: 7px 2.3rem;}

.btn.bk-4e {background-color: #F15D4E; color: #FFFFFF;}

.btn.btn-pdf {font-size: 3.2rem; color: #FFFFFF; background: #E61E2B; padding: 1rem 9rem; border-radius: 7rem; transition: all 0.3s;}
.btn.btn-pdf:hover {background-color: #AA0D17;}

.btn.btn-regist {font-size: 3.2rem; padding: 1rem 14rem; border-radius: 7.2rem;}

.toast-message {font-size: 1.8rem;}

#footer {background-color: #3E3E3E;}
.fmenus {border-bottom: 1px solid #7A7A7A;}
.fmenus .usepageMenu li {position: relative; line-height: 1;}
.fmenus .usepageMenu li:after {content: ''; display: block; width: 2px; height: 100%; background-color: #7A7A7A; right: -1.5rem; top: 0; position: absolute;}
.fmenus .usepageMenu li:last-child:after {display: none;}
.fmenus .usepageMenu li a {font-size: 2rem; color: #FFFFFF;}
.fmenus select {
  color: rgba(255, 255, 255, 0.50);
  border-radius: 0;
  -o-appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-image: url(/css/egovframework/img/userpage/select-arrow2.svg);
  background-color: transparent;
  background-repeat: no-repeat;
  background-position: right +16px center;
  border: 1px solid rgba(255, 255, 255, 0.50);
  padding: 6px 2rem 6px 11px;
  font-size: 1.8rem;
}
.fmenus select option {
	background-color: #3E3E3E;
	color: rgba(255, 255, 255, 0.50);
}

.fmenus .institutionMenu li a {font-size: 1.6rem; color: #8D8D8D; display: flex; align-items: center; border-right: 1px solid #7A7A7A;}
.fmenus .institutionMenu li:nth-child(1) a {border-left: 1px solid #7A7A7A;}

.finfo {padding: 6rem 0 3rem;}
.finfo > .container {background-image: url('/css/egovframework/img/userpage/footer_logo2.png'); background-repeat: no-repeat; background-position: right bottom;}
.footer-logo {min-height: 144px; max-height: 100%; background-color: #484848; display: flex; align-items: center; justify-content: center; border-radius: 10px;;}
.finfo p {font-size: 18px; color: #FFFFFF;}
.finfo ul li span {font-size: 2.4rem; color: #BFBFBF;}

.finfo ul.page-info li span {font-size: 1.8rem;}

#header {position: fixed; width: 100%; left: 0; z-index: 100; top: 0;}
#header .menus {background: var(--Linear, linear-gradient(90deg, #F15D4E 0%, #203368 100%));}
#header.whel {box-shadow: 0px 4px 15px 0px rgba(0, 0, 0, 0.20); background: #FFFFFF;}
#header.active {background: #9F8467;}

.header-mobile {position: absolute; z-index: 5; background: #ffffff; width: 310px; right: 0; top: 0; height: 100vh; overflow-y: scroll; display: none;}
.header-mobile.active {display: block;}
.mheader {background-color: #F15D4E; padding: 10px 20px;}

#header .header-mobile .hm-menu > li {padding: 0; text-align: left; border-bottom: 1px solid #DBDBDB;}
#header .hm-menu > li > a {color: #000000; padding-top: 20px; padding-bottom: 20px; padding-left: 32px; font-size: 18px; font-weight: 600; display: block;}
#header .hm-menu .header-sub-menu {padding-top: 4px; padding-bottom: 4px; position: relative; width: 100%; left: 0; display: none;}
#header .hm-menu .on .header-sub-menu {display: block;}
#header .hm-menu > li.on .header-sub-menu {border-top: 1px solid #DBDBDB;}
#header .hm-menu .header-sub-menu > li > a {color: #000000; text-align: left; padding: 15px 50px; font-size: 16px;  display: block;}
.header-logo {max-width: 22.8rem;}
.header-logo img {height: 45px;}

.menu input {display: none;}
.menu input + label {display: block; width: 3.3rem; height: 2.6rem; position: relative;} 
.menu label span {display: block; width: 3.3rem; height: 2px; position: absolute; transition: all 0.5s; margin: 0; background: #FFFFFF;}
.whel .menu label span {background: #000000;}
.active .menu label span {background: #FFFFFF;}
.menu label span:nth-child(1) {top: 0;}
.menu label span:nth-child(2) {top: 50%; transform: translateY(-50%);}
.menu label span:nth-child(3) {bottom: 0;}
.menu input[type=checkbox]:checked + label span:nth-child(1) {top: 50%; transform: translateY(-50%) rotate(45deg);} 
.menu input[type=checkbox]:checked + label span:nth-child(2) {opacity: 0;}
.menu input[type=checkbox]:checked + label span:nth-child(3) {top: 50%; transform: translateY(-50%) rotate(-45deg);}

.header-menu {z-index: 10; position: relative;}
.header-menu > li {position: relative; }
.header-menu > li > a {font-size: 2.2rem; font-weight: 600; display: block; position: relative; transition: color 0.1s; color: #FFFFFF;}
.whel .header-menu > li > a {color: #FFFFFF;}
.active .header-menu > li > a {color: #FFFFFF;}
.header-sub-menu {position: absolute; width: 100%; display: none; height: 27.8rem; border-right: 1px solid #E6E6E6;}
.header-menu > li:nth-child(1) .header-sub-menu {border-left: 1px solid #E6E6E6;}
.active .header-sub-menu {display: block;}
.header-sub-menu li a {font-size: 2rem; color: #6A6A6A; display: block; padding: 1.2rem 0; text-align: center;}
.header-menu-back {
    height: 27.8rem; background-color: #FFFFFF; position: absolute; width: 100%; left: 0; border-top: 1px solid #EDEDED; display: block; border-top: 1px solid #EDEDED;
    box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.20); display: none;
}
.active .header-menu-back {display: block;}

.header-mobile .header-sub-menu {height: auto;}

.header-search {padding: 1.2rem 0; background-color: #FFFFFF;}
.header-search input {max-width: 100%; padding: 0.8rem 4.5rem 0.8rem 3.1rem; background-color: #ECECEC; border-radius: 100px; font-size: 1.8rem; border: 0px;}
.header-search button {position: absolute; top: 50%; right: 2.5rem; transform: translateY(-50%); background-color: #ECECEC; padding: 0;}
.header-search select {
  color: rgba(0, 0, 0, 0.50);
  border-radius: 0;
  -o-appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-image: url(/css/egovframework/img/userpage/select-arrow.svg);
  background-color: transparent;
  background-repeat: no-repeat;
  background-position: right +16px center;
  border: 1px solid rgba(0, 0, 0, 0.70);
  padding: 6px 2rem 6px 11px;
  font-size: 1.8rem;
  margin-left: 8rem;
}

.header-search .institutionMenu {display: flex; margin-left: 15px;}
.header-search .institutionMenu li {margin: 0 5px;}
.header-search .institutionMenu li a {font-size: 1.6rem; padding: 2px 1.4rem; display: flex; align-items: center; border-radius: 13px; border: 1px solid #DADADA;}

.header-member ul li {line-height: 1; position: relative;}
.header-member ul li:nth-child(1) {padding-right: 13px; margin-right: 13px;}
.header-member ul li:nth-child(1):after {content: ''; display: block; position: absolute; width: 1px; height: 100%; background-color: #FFFFFF; top: 0; right: 0;}
.header-member ul li.logout:after {display: none !important;}
.header-member ul li a {font-size: 1.8rem; color: #FFFFFF;}

.quickmenu {position: fixed; right: 20px; bottom: 20px; padding: 1.1rem 1rem; background: #FFFFFF; border-radius: 20px; box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.10); z-index: 100;}
.quickmenu h5 {font-size: 2rem; font-weight: 600; margin-bottom: 1.5rem; text-align: center;}
.quickmenu ul li {width: 10.9rem; max-width: 100%; background: #F9F9F9; border-radius: 5px; text-align: center; position: relative; margin: 5px 0;}
.quickmenu ul li:after {content: ''; display: block; padding-bottom: 103.33%;}
.quickmenu ul li a {position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; flex-direction: column; border-radius: 5px;}
.quickmenu ul li span {font-size: 1.4rem; color: #414141; font-weight: 500; display: block;}
/*공통*/

/*게시판*/
.bdsearch {margin-bottom: 2rem;}
.bdsearch .total {font-size: 18px; font-weight: 600; margin-bottom: 0;}
.bdsearch select {font-size: 1.6rem; padding: 8px; border: 1px solid #D9D9D9; width: 100%; max-width: 120px; margin-right: 2px; border-radius: 4px;}
.bdsearch input {font-size: 1.6rem; padding: 7px 2.1rem; border: 1px solid #D9D9D9; width: 100%; max-width: 356px; margin-right: 7px; border-radius: 4px;}
.bdsearch button {background-color: #203368; padding: 0.7rem 0.8rem; border-radius: 4px;}
.bdsearch input:focus {outline: none;}

.bdsearch2 {background: #FFFFFF; border-radius: 1000px; box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.10); padding: 1rem 7.7rem 1rem 16.4rem; max-width: 98rem; margin: auto; margin-bottom: 7.9rem; position: relative}
.bdsearch2 input {width: 100%; background: #F9F9F9; padding: 5px 4rem; border-radius: 100px; font-size: 2.4rem; color: #858585; border: 0px;}
.bdsearch2 span {font-size: 2.4rem; color: #858585; font-weight: 500; position: absolute; top: 50%; left: 5.4rem; transform: translateY(-50%);}
.bdsearch2 button {width: 5.5rem; height: 5.5rem; display: flex; align-items: center; justify-content: center; background: #F15D4E; border-radius: 100px; position: absolute; top: 50%; right: 1.1rem; transform: translateY(-50%);}

.bdgallery > div {margin-top: 12px; margin-bottom: 12px;}
.bdgallery .bditem {background-color: #FAFAFA; border-radius: 30px; padding: 2rem;}
.bdgallery .bdthumb {width: 100%; position: relative; border-radius: 30px; background-size: cover; background-repeat: no-repeat; background-position: center; background-color: #424242;}
.bdgallery .bdthumb:after {content: ''; display: block; padding-bottom: 58.31%;}
.bdgallery .bdinfo span {font-size: 1.8rem; color: #989898; padding: 5px 2.3rem; border: 1px solid#C0C0C0; border-radius: 100px; display: inline-block;}
.bdgallery .bdinfo h5 {font-size: 2.4rem;}
.bdgallery .bdinfo p {font-size: 1.8rem; color: #989898;}

.bdtable th {font-size: 2rem; padding: 1.5rem 0; background-color: #F15D4E; color: #FFFFFF;}
.bdtable td {font-size: 1.8rem; padding-top: 2rem; padding-bottom: 2rem; border-bottom: 1px solid #D9D9D9; border-right: 1px solid #D9D9D9;}
.bdtable td:last-child {border-right: 0;}
.bdtable td .bdt-info li {font-size: 1.5rem; margin-top: 10px; margin-right: 10px; padding-right: 10px; position: relative; line-height: 1;}
.bdtable td .bdt-info li:after {
	position: absolute; content: ''; display: block; height: 100%; width: 1px; background: #000000; top: -1px; right: 0;
}
.bdtable td .bdt-info li:last-child:after {display: none;} 
.bdtable td.title a {display: block; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; width: 100%;}

.bdtype li {padding-right: 1.5rem;}
.bdtype li:last-child {padding-right: 0;}
.bdtype li a {display: inline-block; padding: 8px 1.7rem; border: 1px solid #C0C0C0; font-size: 2.2rem; font-weight: 600; color: #C0C0C0; border-radius: 4px; min-width: 116px; text-align: center; line-height: 1;}
.bdtype li.on a {background-color: #203368; color: #FFFFFF; border-color: #203368;}

.bdevent > div {margin-top: 15px; margin-bottom: 15px;}
.bdevent .bditem {background-color: #FFFFFF; border: 1px solid #B0B0B0; padding: 3.7rem 2.6rem 2.6rem 2.6rem;}
.bdevent .bdtxt {padding-bottom: 2.4rem; margin-bottom: 2.4rem; border-bottom: 1px solid #E8E8E8;}
.bdevent .bditem h5 {font-size: 3.2rem; font-weight: bold; word-break: break-word; display: -webkit-box; display: -ms-flexbox; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; max-height: 8rem; min-height: 8rem;}
.bdevent .bditem p {margin-bottom: 8rem; font-size: 2rem; color: #6C6C6C; word-break: break-word; word-break: break-word; display: -webkit-box; display: -ms-flexbox; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; max-height: 9rem; min-height: 9rem;}
.bdevent .bditem ul li:nth-child(1) {font-size: 1.8rem; color: #FFFFFF; font-weight: bold; padding: 4px 0; width: 96px; background-color: #F15D4E; border-radius: 4px; text-align: center;}
.bdevent .bditem ul li:nth-child(2) {font-size: 1.8rem; color: #CDCDCD;}

.bdmember .bditem {width: 100%; position: relative;}
.bdmember .bditem:after {content: ''; display: block; padding-bottom: 100%;}
.bdmember .bditem:before {content: ''; display: block; width: calc(100% + 1px); height: calc(100% + 1px); border: 1px solid #DDDDDD; position: absolute; top: 0; left: 0;}
.bdmember .bditem a {position: absolute; padding: 3rem 0; width: 100%; height: 100%; top: 0; left: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; font-size: 2.4rem; font-weight: 600; color: #646464; text-align: center;}

.bdmovement .bditem {width: 100%; background-color: #FAFAFA; border-radius: 30px; padding: 1.2rem 1.6rem;}
.bdmovement .bditem span:not(.date) {
	flex: 0 0 221px; max-width: 221px; width: 100%; padding: 7px 0; border-radius: 100px; border: 2px solid #F15D4E; color: #F15D4E; font-size: 2rem; font-weight: bold; text-align: center; display: block; margin: 0 auto;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    transition: all 0.5s;
}
.bdmovement .bditem span.date {flex: 0 0 110px; max-width: 110px; font-size: 2rem; color: #767676; text-align: left;}
.bdmovement .bditem a {flex: 1; font-size: 2rem; color: #323232; margin-bottom: 0; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}

.bdfree .bditem {padding: 2rem; border: 1px solid #E6E6EF; border-radius: 10px;}
.bdfree .bditem .bdthumb {position: relative; flex: 0 0 19rem; max-width: 19rem; width: 100%; border-radius: 10px; background-size: cover; background-position: center; background-repeat: no-repeat;}
.bdfree .bditem .bdthumb:after {content: ''; display: block; padding-bottom: 100%;}
.bdfree .bditem .bdinfo span:not(.count) {font-size: 1.6rem; color: #FFFFFF; background: #F15D4E; padding: 2px 5px; border-radius: 4px; display: inline-block; margin-bottom: 7px;}
.bdfree .bditem .bdinfo h5 {font-size: 2.3rem; font-weight: 600; margin-bottom: 1rem; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
.bdfree .bditem .bdinfo p {font-size: 2rem; color: #989898; margin-bottom: 8px; display: -webkit-box; display: -ms-flexbox; word-wrap: break-word; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; max-height: 9rem; min-height: 9rem;}
.bdfree .bditem .bdinfo span.count {font-size: 1.5rem; columns: #858585; font-weight: 600;}

.pagination li {width: 34px; height: 34px; display: flex; justify-content: center; align-items: center; margin: 0 4px; border-radius: 100%; border: 1px solid #DFDFDF;}
.pagination li a {font-size: 18px; color: #7D7D7D !important; line-height: 1;}
.pagination li.active {background: #203368; border: 1px solid #203368; font-weight: bold;}
.pagination li.active a {color: #FFFFFF !important;}
.pagination li.pg-arw {background-color: #DFDFDF; margin: 0 2rem;}

.bddetail {border-top: 4px solid #F15D4E;}
.bddetail th, .bddetail td {padding: 2rem; border-bottom: 1px solid #C1C1C1;}
.bddetail h5 {font-size: 2.3rem; font-weight: 500;}
.bdd-info li {font-size: 1.7rem; color: #666666; font-weight: 400; padding-left: 2rem; padding-right: 2rem; margin-top: 2rem; margin-bottom: 2rem; position: relative; line-height: 1;}
.bdd-info li:last-child:after {display: none;}
.bdcontent {font-size: 1.7rem;}
.bdcontent img {max-width: 100%; height: auto;}
.bdfile {background: #F8F8F8;}
.bdfile ul li {font-size: 1.7rem;}
.bftext {padding-right: 2rem; margin-top: 4px; position: relative; flex: none; line-height: 1;}
.bflist {padding-left: 2rem; word-break: break-word;}
.bflist a {font-size: 1.7rem; color: #000000 !important;}
.bflist a:hover {text-decoration: underline;}

.pn-table  {border-top: 1px solid #c7c7c7;} 
.pn-table th, .pn-table td {padding: 17px 0; border-bottom: 1px solid #C7C7C7; font-size: 1.7rem;}
/*게시판*/

.ms-slider {padding: 0 2rem;}
.ms-item {position: relative; border-radius: 30px; overflow: hidden;}
.ms-item:after {content: ''; display: block; padding-bottom: 35.67%;}
.ms-item img, .ms-item video {position: absolute; width: 100%; height: 100%; object-fit: fill;}
.ms-txt {padding-top: 8.5%;}
.ms-txt h1, .ms-txt h5 {font-family: SeoulHangangM;}
.ms-txt h1 {background-color: rgba(255,255,255,0.3); border-radius: 500px; display: table; }

.ms-slider .slick-dots {left: 50%; top: auto; bottom: 12rem; width: 100%; transform: translateX(-50%);}
.ms-slider .slick-dots .msnum {font-size: 1.8rem; color: #FFFFFF; padding: 0 7px;}
.ms-slider .slick-dots li {display: none; width: 100%;}
.ms-slider .slick-dots li.slick-active {display: block;}
.ms-slider .progressbar {width: 4.5rem; height: 4px; background: rgba(255,255,255,0); position: relative; overflow: hidden; background: rgba(255,255,255,0.3); }
.ms-slider .progressbar.on span {background: #FFFFFF; width: 4px; position: absolute; left: 0; top: 0; height: 100%; animation: fill 8s forwards; animation-delay: 1s;}
@keyframes fill {  
    0% {width: 4px;}  
    100% {width: 100%;}
} 

.ms-arrow-zone {position: absolute; width: 100%; left: 50%; transform: translateX(-50%);}
.ms-arrow-zone ul {position: absolute; bottom: 10rem; left: 250px;}
.ms-arrow-zone .ms-arrow {width: 3.4rem; height: 3.4rem; display: flex; align-items: center; justify-content: center; background: rgba(0,0,0,0.1); margin: 0 10px; border-radius: 100%; cursor: pointer;}
.ms-arrow-zone .ms-arrow img {width: auto; height: auto;}

.section2 {padding: 8.8rem 0 6rem 0;}
.mb-zone h3 {font-size: 2.6rem; font-weight: 600;}
.mb-top a.mb-more {display: flex; align-items: center; font-size: 2rem; font-weight: 600;}
.mb-list li {margin-bottom: 8px;}
.mb-list li a {font-size: 1.8rem; font-weight: 600; display: block; padding: 2.1rem 2.4rem; border-radius: 8px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; transition: all 0.5s;}
.mb-list1 li a {background: #FFF2EB;}
.mb-list2 li a {background: #F8F8F8;}
.mb-list3 li a {background: #EBF1FF;}
.mb-list1 li a:hover {background: #FAE6DB;}
.mb-list2 li a:hover {background: #DFDFDF;}
.mb-list3 li a:hover {background: #CED8F0;}

.section3 {padding: 10rem 0 10rem 0; background: #FFF5EA;}
.mi-zone {display: grid; margin: 0 -10px;}
.mi-zone > div {padding: 0 10px;}
.mi-greeting {background-color: #F9FCFF; border-radius: 30px; overflow: hidden; background-repeat: no-repeat; background-image: url('/css/egovframework/img/userpage/main/mi-greeting.png'); background-position: bottom right; background-size: 100% auto; padding: 5rem 0 7rem;}
.mgi-title {margin-bottom: 3rem; border-bottom: 1px solid #CCD9E2; padding: 0 5rem; padding-bottom: 2rem;}
.mi-greeting p {padding: 0 5rem;}

.mc-schedule {height: 100%;}
.mcs-zone {height: calc(100% - 7.8rem);}
.mscp {height: calc(100% - 7rem);}

.mf-item {position: relative; border-radius: 18px; overflow: hidden; background-repeat: no-repeat; background-position: center; background-size: cover;}
.mf-item:after {content: ''; display: block; padding-bottom: 13.67%;}
.mf-item > a {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.mf-slider .slick-dots {top: auto; bottom: -4.8rem; left: auto; right: 12.5rem;}
.mf-slider .slick-dots li {display: none; width: auto; height: auto; margin: 0;}
.mf-slider .slick-dots li.slick-active {display: block;}
.mf-slider .slick-dots .num1 {font-size: 3.2rem; padding-right: 5px; line-height: 1;}
.mf-slider .slick-dots .num2 {font-size: 2.4rem; color: #929292; line-height: 1;}
.mf-arrow {margin-top: 13px;}
.mf-arrow li {margin: 0 2px;}
.mf-arrow a {display: flex; width: 3.2rem; height: 3.2rem; align-items: center; justify-content: center; background: #ECECEC; border-radius: 3px;}

.section4 {padding: 7.8rem 0; background-color: #FAFAFA;}
.mc-top a {padding: 5px 2rem; background: #ECECEC; border-radius: 22px;}
.mcg-list .slick-track {margin-left: 0; margin-right: auto;}
.mcg-item {max-width: 35.2rem; margin: 7px auto; padding: 0 8px;}
.mcg-item > div {position: relative; border-radius: 30px; overflow: hidden; background-size: cover; background-repeat: no-repeat; background-position: center;}
.mcg-item > div:after {content: ''; display: block; padding-bottom: 83.33%;}
.mcg-item a {top: 0; left: 0; opacity: 0; background-color: rgba(0, 0, 0, 0.4); color: #FFFFFF; font-size: 2rem; display: flex; align-items: center; justify-content: center; font-weight: bold; transition: all 0.3s;}
.mcg-item:hover a {opacity: 1;}
.mcg-item .mcg-title {display: flex; align-items: center; justify-content: space-between; position: absolute; left: 0; bottom: 0; padding: 1rem 2rem; background-color: #000000; width: 100%; border-radius: 0 0 30px 30px;}
.mcg-item h5 {color: #FFFFFF; font-size: 2rem; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
.mcg-item span {font-size: 25px; background-color: #FFFFFF; width: 2.8rem; height: 2.8rem; border-radius: 50%; color: #000000; display: flex; align-items: center; justify-content: center; line-height: 1; flex: none;}
.mcs-title {padding: 1rem 2.8rem; background-color: #FFFFFF; border-radius: 100px;}
.mcs-title span {display: inline-block; padding: 4px 2rem; background-color: #FFFFFF; border-radius: 16.5px; color: #F15D4E; font-size: 1.8rem; margin-right: 2rem; flex: none; border: 1px solid #F15D4E; font-weight: 600;}
.mcs-title h5 {font-size: 2.2rem; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; margin-bottom: 0; padding-top: 2px;}
.mcs-list-zone {flex: 0 0 calc(100% - 18rem); max-width: calc(100% - 18rem);}

.section5 {padding: 9.8rem 0 8.7rem; background: #203368; overflow: hidden;}
.mp-top span {display: inline-block; font-size: 2.4rem; font-weight: 600; color: #FFFFFF; padding: 0 1.5rem; background: #F15D4E; border-radius: 20px;}
.mp-item {max-width: 23.5rem; position: relative; background: #FFFFFF; border-radius: 6px; margin: 0 auto;}
.mp-item:after {content: ''; display: block; padding-bottom: 45.53%;}
.mp-item a {position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; padding: 1rem;}
.mp-item a img  {max-height: 100%; max-width: 100%;}

.mp-slider .slick-track {margin: 0 -10px;}
.mp-slider .slick-slide {margin: 0 10px;}

.page-top {padding: 0 2.5rem;}
.page-top > .page-banner {background-size: cover; background-repeat: no-repeat; background-position: center; border-radius: 30px;}
.page-top p {font-size: 2.6rem;}

.page-menu {position: absolute; width: 100%; bottom: -35px; left: 0;}
.page-menu > div {background-color: #FFFFFF; box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.10);; border-radius: 20px; position: relative; z-index: 10;}
.page-menu > div > div {position: relative;}
.page-menu > div > div:after {content: ''; display: block; width: 1px; height: 3.8rem; background-color: #EBEBEB; position: absolute; top: 50%; transform: translateY(-50%); right: 0;}
.page-menu .home {padding: 0 4rem;}
.page-menu h5 {position: relative; font-size: 2rem; color: #505050; padding: 2.1rem 0 2.1rem 2.3rem; min-width: 20rem; margin-bottom: 0; background-image: url('/css/egovframework/img/userpage/page-arrow.svg'); background-repeat: no-repeat; background-position: right +2.2rem center; cursor: pointer;}
.page-menu ul {position: absolute; width: 100%; left: 0; background-color: #FFFFFF; z-index: 1; top: calc(100% + 5px); box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.07); max-height: 0; overflow: hidden; transition: all 0.4s ease-out;}
.page-menu .on ul {max-height: 100vh;}
.page-menu ul a {display: block; font-size: 2rem; padding: 1.8rem 2.3rem; color: #6A6A6A;}
.page-menu ul li {border-bottom: 1px solid rgba(0, 0, 0, 0.10);}

.page-title {position: relative; display: table; margin: 0 auto;}
.page-title:after {content: ''; display: block; width: calc(100% + 6rem); height: 5px; background-color: #F15D4E; position: absolute; left: -3rem; bottom: -1.3rem; animation: titleBar 0.5s linear ;}
@keyframes titleBar {
	0% {width: 0px;}
	100% {width: calc(100% + 6rem);}
}

.dm-title {position: relative; padding: 0 4rem;}
/*background-image: url('/css/egovframework/img/userpage/dm-title.svg'), url('/css/egovframework/img/userpage/dm-title.svg'); background-repeat: no-repeat; background-position: center left, center right;*/

.ig-zone {position: relative; padding: 7.6rem 0 20rem; background-color: #FDFBFA; background-image: url('/css/egovframework/img/userpage/introduce/ig-back.png'); background-repeat: no-repeat; background-size: 100%; position: relative;}
.ig-child {max-width: 81.4rem; margin: 0 auto;}
.ig-child h3 {padding-bottom: 6rem; margin-bottom: 8rem; border-bottom: 1px solid #C3C2C1;}

.ig-people {z-index: 1;}
.ig-people span {font-size: 2.4rem; padding: 6px 2.5rem; border: 1px solid #EAEAEA; border-radius: 6px;}

.ig-greeting {display: flex; flex: 0 0 auto; white-space: nowrap; overflow: hidden; position: absolute; bottom: 0; left: 0; width: 100%;}
.ig-greeting h1 {
  font-family: SeoulHangangM; font-size: 25rem; color: rgba(209, 150, 81, 0.1);
  animation: textLoop 10s linear infinite; 
  font-weight: 600;
}
@keyframes textLoop {
	0% {-webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0);}
	100% {-webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0);}
}

.ih-item {padding-bottom: 5rem; position: relative;}
.ih-item:after {content: ''; display: block; width: 1px; height: 100%; background-color: #D6D6D6; top: 0; position: absolute;}
.ih-item:nth-child(1):before, .ih-item:last-child:before {content: ''; display: block; width: 3.4rem; height: 3.4rem; background-image: url('/css/egovframework/img/userpage/introduce/ih-top.svg'); background-size: 100% 100%; position: absolute; z-index: 1;}
.ih-item:nth-child(1):before {top: -2.2rem;}
.ih-item:last-child:before {bottom: -2.2rem;}
.ih-item h3 {padding: 0 6.5rem; position: relative; font-size: 9.6rem; font-weight: bold; color: #BDBDBD; position: relative; margin-bottom: 0;}
.ih-item h3:after {content: ''; display: block; position: absolute; top: 50%; width: 29px; height: 21px; background-image: url('/css/egovframework/img/userpage/introduce/ih-arrow.svg'); background-size: 100% 100%;}
.ih-desc {margin: 0 3.3rem; background-color: #FAFAFA; border-radius: 30px; padding: 3rem; display: table;} /*width: calc(100% - 3.3rem); max-width: 46.3rem;*/
.ih-desc h5 {font-size: 2.4rem; color: #FFFFFF; font-weight: 600; width: 168px; text-align: center; padding: 5px 0; background-color: #F15D4E; line-height: 1;}
.ih-desc ul li {font-size: 2rem;}
.ih-desc > div:last-child {margin-bottom: 0 !important;}

.ih-item:nth-child(2n + 1) .ih-content img {border-radius: 0 18px 18px 18px;}
.ih-item:nth-child(2n) .ih-content img {border-radius: 18px 0 18px 18px;}

.bk-zone {background-color: #F9F9F9; border-radius: 30px;}
.bk-zone2 {background-color: #F4F4F4; padding: 3.5rem 5rem;}
.bk-zone3 {background-color: #FAFAFA; border-radius: 30px;}

.io-zone {padding: 5rem 0 6rem 0; margin-bottom: 13rem;}
.io-child {max-width: 995px; margin: 0 auto; position: relative}
.io-child:before {content: ''; display: block; width: 1px; position: absolute; left: 50%; background-color: #7A7A7A; height: calc(100% - 113px - 4.3rem); top: 113px;}
h1.io-top {padding: 1.8rem 0; font-size: 3.2rem; font-weight: bold; color: #1D1D1D; background-color: #F5F5F5; border: 1px solid #E2E2E2; border-radius: 56px; display: table; margin: 0 auto 8rem auto; font-family: KimjungchulMyungjo-Bold}
.io-chef {position: relative; width: 223px; height: 223px; background-image: url('/css/egovframework/img/userpage/introduce/io-chef.svg'); background-repeat: no-repeat; background-position: center; background-size: cover; margin-bottom: 10rem;}
.io-chef > div {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
.io-chef h5 {font-family: KimjungchulMyungjo-Bold; font-size: 3.2rem;}
.io-chef p {font-size: 2.2rem; font-weight: bold; color: #404040;}
.io-chef p span {font-size: 1.6rem; color: #8E8E8E;}

.io-member {position: relative; z-index: 1;}
.io-member h5 {font-size: 2.4rem; font-weight: bold; color: #FFFFFF; background-color: #F15D4E; border-radius: 44px 0 0 44px; padding: 2.9rem 2.9rem 2.9rem 4.2rem;}
.io-member > div {height: 100%; background-color: #FFFFFF; width: 25.4rem; border: 1px solid #E0E0E0;}
.io-member2 > div {width: 20.2rem;}
.io-member ul li {font-size: 2rem; color: #5D5D5D; position: relative; padding-left: 10px;}
.io-member ul li:after {content: '·'; display: block; color: #5D5D5D; position: absolute; left: 0; top: 0;}
.io-member2 ul li {padding-left: 0;}
.io-member2 ul li:after {display: none;}

.io-department {position: relative;}
.io-department > div {max-width: 272px; width: 100%; padding-top: 57px; position: relative; background-color: #FFFFFF; border-radius: 30px; margin: 0 auto; position: relative;}
.io-department > div:nth-child(2):before {display: none;}
.io-department h5 {font-size: 2.4rem; color: #FFFFFF; background-color: #3C559C; border-radius: 50px; text-align: center; padding: 1.4rem 0; margin-bottom: 0; position: absolute; top: 0; left: 0; width: 100%;}
.io-department ul {padding: 1.5rem 0;}
.io-department ul li {font-size: 2.2rem; font-weight: bold; color: #4C4C4C;}
.io-department ul li span {font-size: 1.6rem; color: #818181;}

.iot-table {border-top: 5px solid #F15D4E; border-bottom: 2px solid #F15D4E;}
.iot-table tr th, .iot-table tr td {padding: 1.6rem 0; text-align: center; font-size: 2rem;}
.iot-table thead th {background-color: #F15D4E; color: #FFFFFF; font-weight: bold;}
.iot-table thead td {background-color: #F9F9F9; font-weight: bold;}
.iot-table tbody th {background-color: #F9F9F9; font-weight: 600;}
.iot-table tbody th, .iot-table tbody td {border-top: 1px solid #CDCDCD; border-right: 1px solid #CDCDCD; font-weight: 500;}
.iot-table tbody td:last-child {border-right: 0;}
.iot-table tbody td span {text-decoration: underline;}

.snum {width: 3.9rem; height: 3.9rem; border-radius: 100%; font-size: 2.8rem; color: #FFFFFF; font-weight: bold; display: flex; align-items: center; justify-content: center; background-color: #203368; line-height: 3.9rem;}
.stitle {font-size: 2.4rem; font-weight: bold; color: #FFFFFF; padding: 4px 1.8rem; background: #F15D4E; display: inline-block;}

.igo-list {display: flex; flex-wrap: wrap; margin: 0 -20px;}
.igo-item {padding: 0 20px;}
.igo-item > div {position: relative; width: 100%; border-radius: 100%; background-size: cover; background-position: center; background-repeat: no-repeat;}
.igo-item > div:after {content: ''; display: block; padding-bottom: 100%;}
.igo-item h5 {position: absolute; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; top: 0; left: 0; line-height: 1.5; font-weight: 900;}

.igb-zone {background: #203368; border-radius: 10px;}
.igb-img {background: #FFFFFF; padding: 1.5rem 2.6rem; border-radius: 10px; display: table;}
.igb-txt h1 {font-size: 3.2rem;}
.igb-txt p {font-size: 2.5rem;}

.igm-zone {background-color: #EBEBEB; border-radius: 10px; padding: 2rem 3.7rem;}
.igm-zone h5 {background-color: #FFFFFF; padding: 10px 2rem; font-size: 2rem; font-weight: 600; display: table; border-radius: 10px;}
.igm-zone ul li {color: #4D4D4D; align-items: center;}
.igm-zone ul li span {font-weight: 600;}

.mdd-zone {background-color: #EBEBEB; border-radius: 10px; padding: 2.1rem 4.7rem; min-height: calc(100% - 4.8rem);}
.mdd-zone.mdp-zone {min-height: calc(100% - 4.8rem); display: flex; align-items: center;}
.mdc-title span {font-size: 2.4rem; display: inline-block; color: #FFFFFF; font-weight: 600; padding: 4px 2.7rem; background-color: #F15D4E; border-radius: 22px;}
.mdc-img {flex: 0 0 14.5rem; border-radius: 100%; background-size: 100% 100%; background-position: center; background-repeat: no-repeat; background-color: #FFFFFF; overflow: hidden;}
.mdc-logo {display: flex; align-items: center; justify-content: center; max-height: 100%;}
.mdc-logo > img {max-height: 100%;}
.mdc-info {font-size: 3.2rem; font-weight: 500; line-height: 1.5;}
.mdc-info span {font-size: 2.4rem; display: block;}

.mdc-logo2 {height: 5.7rem; padding: 0; display: flex; align-items: center; justify-content: center;}
.mdc-logo2 > img {max-height: 100%;}

.mdc-logo3 {height: 5rem; padding: 0; display: flex; align-items: center; justify-content: center; margin-bottom: 1rem;}
.mdc-logo3 > img {max-height: 100%; max-width: 17rem;}

.mds-zone {background-color: #FFFFFF; border-radius: 10px; position: relative;}
.mds-zone > span {font-size: 2.8rem; font-weight: 600; padding: 1rem 4rem; background-color: #F3F3F3; border-radius: 30px; display: table;}

.mdi-zone {padding: 3rem; background-color: #ECECEC; border-radius: 10px; min-height: 27.2rem;}
.mdi-zone h5 {padding-bottom: 2rem; margin-bottom: 2rem; border-bottom: 1px solid #D6D6D6;}
.mdi-zone li {align-items: center; margin-bottom: 12px; font-size: 1.8rem; font-weight: 600; color: #000000;}
.mdi-zone li span:nth-child(1) {width: 4.4rem; height: 4.4rem; background-color: #FFFFFF; border-radius: 100%; display: flex; align-items: center; justify-content: center; margin-right: 1rem;}

.mdb-map {min-height: 30rem !important;}

.bi-icon {max-width:7.4rem; flex: 0 0 7.4rem; border-radius:100%; overflow: hidden; position: relative; margin-right: 1rem;}
.bi-icon:after {content: ''; display: block; padding-bottom: 100%;}
.bi-icon img {max-width: 100%; height: 100%; width: 100%; position: absolute; top: 0; left: 0;}

.mdb-zone li {max-width: 36.7rem; width: 100%;}
.mdb-zone li a.btn {width: 100%; font-size: 2.4rem; padding: 1.5rem 0; border-radius: 70px; font-weight: 600; display: flex; align-items: center; justify-content: center;}
.mdb-zone li.list-btn a.btn {background-color: #EEEEEE; color: #313131;}

.mdb-zone li.list-homepage, .mdb-zone li.list-pdf {max-width: 57.8rem;}
.mdb-zone li.list-homepage a.btn {font-size: 2.8rem; color: #FFFFFF; background-color: #203368; border-radius: 0;}
.mdb-zone li.list-pdf a.btn {font-size: 2.8rem; color: #FFFFFF; background-color: #F15D4E; border-radius: 0;}

.individual {padding: 7rem 0 12rem; background-color: #FAFAFA;}
.individual h4 {padding-bottom: 6.4rem; margin-bottom: 8rem; border-bottom: 1px solid #DBDBDB;}
.idd-txt span {display: inline-block; padding: 1.4rem 3.3rem; border: 1px solid #5F5F5F; color: #5F5F5F; font-size: 2.4rem; font-weight: 600;}

.join-top {padding: 5.7rem 0; background-image: url('/css/egovframework/img/userpage/join/join-top1.png'), url('/css/egovframework/img/userpage/join/join-top2.png'); background-size: auto 100%, auto 100%; background-position: top left, top right; background-repeat: no-repeat;}

.input-table th {font-size: 1.8rem; font-weight: 600;}
.input-table td {color: #CFCFCF;}
.input-table th, .input-table td {padding: 1.2rem 0;}
.input-table input[type=text], .input-table input[type=password], .input-table textarea, .input-table select {background: #FFFFFF; border: 1px solid #CFCFCF; font-size: 1.7rem; padding: 7px 10px; width: 100%;}
.input-table input[type=text], .input-table input[type=password] {max-width: 28.6rem;}
.input-table select {
	max-width: 28.6rem;
	-o-appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image: url(/css/egovframework/img/userpage/select-arrow.svg);
    background-repeat: no-repeat;
    background-position: right +10px center;
}

.login-input {max-width: 415px; margin: 0 auto;}
.login-input input {width: 100%; background-color: #FFFFFF; font-size: 2rem; padding: 1.4rem; border: 0;}
.lg-input {padding-left: 5.8rem; border: 1px solid #CFCFCF; position: relative;}
.lg-img {position: absolute; width: 5.8rem; height: 5.8rem; display: flex; align-items: center; justify-content: center; top: 0; left: 0;}

.wrap-loading{ /*화면 전체를 어둡게 합니다.*/
	display: block;
    position: fixed;
    left:0;
    right:0;
    top:0;
    bottom:0;
    background: rgba(0,0,0,0.2); /*not in ie */
    filter: progid:DXImageTransform.Microsoft.Gradient(startColorstr='#20000000', endColorstr='#20000000');    /* ie */
	z-index: 2000;
}

.wrap-loading div{ /*로딩 이미지*/
    position: fixed;
    top:50%;
    left:50%;
    margin-left: -21px;    
    margin-top: -21px;
}

.search-item {border-bottom: 1px solid #CDCDCD;}
.search-menu li {position: relative; padding-right: 10px; margin-right: 10px; font-size: 16px; color: #424242; font-weight: 500;}
.search-menu li:after {content: '>'; right: -5px; top: 0; position: absolute;}
.search-menu li:last-child:after {display: none;}
.search-info li {position: relative; padding-right: 10px; margin-right: 10px; font-size: 16px; color: #424242; font-weight: 500;}
.search-info li:nth-child(1):after {content: '/'; right: -5px; top: 0; position: absolute;}

.fb-banner {padding: 2rem 0;}
.fb-child {padding: 0 4rem;}
.fb-arrow {left: 0; top: 50%; transform: translateY(-50%);}
.fb-item {width: 100%; height: 75px; display: flex; align-items: center; justify-content: center; margin: 0 auto; padding: 3px 0; background: #FFFFFF; border: 1px solid #EAEAEA; border-radius: 10px;}
.fb-slider .slick-slide {padding: 0 15px;}
.fb-slider .slick-track {margin-left: auto; margin-right: auto;}
.fb-child .slick-arrow.slick-hidden {display: block !important;}
.fb-item a {display: block; height: 100%;}
.fb-item img {max-height: 100%;}