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

.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;}

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

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: 5rem !important;}

h1.bititle {font-size: 6rem !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;}

.ps-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;}
.bs-content {font-size: 1.4rem !important;}

.mb05 {margin-bottom: 5px !important;}
.mb2 {margin-bottom: 2rem !important;}
.mt2 {margin-top: 2rem !important;}
.ml2 {margin-left: 20px !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;}
.mb10 {margin-bottom: 10rem !important;}

.pt4 {padding-top: 40px !important;}
.pt5 {padding-top: 5rem !important;}
.pt6 {padding-top: 60px !important;}

.pb6 {padding-bottom: 60px !important;}
.pt10 {padding-top: 100px !important;}
.pb10 {padding-bottom: 100px !important;}

.pl2 {padding-left: 2rem;}

.co666 {color: #666666 !important;}
.co000 {color: #000000 !important;}
.cofff {color: #FFFFFF !important;}
.cof60 {color: #001F60 !important;}
.co8f8 {color: #F8F8F8 !important;}
.cobac {color: #005BAC !important;}
.co757 {color: #575757 !important;}
.cocf0 {color: #719CF0 !important;}
.co452 {color: #002452 !important;}
.co0a5 {color: #2550A5 !important;}
.co090 {color: #909090 !important;}

.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.dot-cf0 > li:after {background: #719CF0;}
.list-dot.co66 li:after {background-color: #666666;}
.list-dot.coff li:after {background-color: #FFFFFF;}
.list-dot.cm-title > li {padding-left: 12px;}
.list-dot.cm-title > li:after {width: 5px; height: 5px; top: 2rem;}

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

.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: 7px 3.8rem;}
.btn.btn-m {font-size: 1.8rem; font-weight: 500; padding: 13px 0;}
.btn.btn-s {font-size: 1.6rem; padding: 7px 2.3rem;}

.btn.bk-52 {background-color: #002452; color: #FFFFFF; border: 1px solid #002452; border-radius: 10px;}
.btn.bk-ff {background-color: #FFFFFF; color: #005BAC; border: 1px solid #005BAC;}

#footer {background-color: #00266D; padding: 5rem 0;}
.fmenus ul li {margin-right: 20px; line-height: 1; position: relative;}
.fmenus ul li:after {position: absolute; content: ''; display: block; width: 1px; height: 100%; background: #FFFFFF; top: 0; right: -11px;}
.fmenus ul li:last-child:after {display: none;}
.fmenus ul li a {font-size: 1.6rem; color: #FFFFFF;}
.fcompany h5 {font-size: 1.6rem; display: table; padding: 6px 0; border: 1px solid #FFFFFF; border-radius: 8.7rem; width: 17.4rem; text-align: center;}
.us .fcompany h5 {width: 24.4rem;}
.finfo p {font-size: 1.6rem; color: #FFFFFF;}
.finfo ul li {margin-right: 6rem; font-size: 1.6rem; color: #FFFFFF;}

#goTop {width: 8.2rem; height: 8.2rem; background: #8CB9FF; border-radius: 100%; position: fixed; bottom: 3rem; right: 3rem; display: flex; align-items: center; justify-content: center; cursor: pointer; opacity: 0; transition: all 0.5s;}
#goTop.on {opacity: 1;} 

#content {padding-bottom: 100px;}

#header {position: fixed; width: 100%; left: 0; z-index: 100; background: rgba(255,255,255,0.2); top: 0;}
#header.whel {box-shadow: 0px 4px 15px 0px rgba(0, 0, 0, 0.20); background: #FFFFFF;}
#header.active {background: #FFFFFF;}
#header.sitemap {background: #FFFFFF;}

.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: #00266D; padding: 6px 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; padding: 1rem 0; background-image: url('/css/egovframework/img/userpage/header-logo.svg'); background-size: 100% 100%; background-position: center;}
.whel .header-logo {background-image: url('/css/egovframework/img/userpage/header-logo-on.svg');}
.active .header-logo {background-image: url('/css/egovframework/img/userpage/header-logo-on.svg');}
.sitemap .header-logo {background-image: url('/css/egovframework/img/userpage/header-logo-on.svg');}
.language-icon, .sitemap-icon {background-size: 100% 100%; background-position: center; display: block;}
.language-icon {background-image: url('/css/egovframework/img/userpage/language.svg');}
.sitemap-icon {background-image: url('/css/egovframework/img/userpage/sitemap.svg');}
.active .language-icon, .whel .language-icon, .sitemap .language-icon {background-image: url('/css/egovframework/img/userpage/language-on.svg');}
.on .language-icon {background-image: url('/css/egovframework/img/userpage/language.svg');}
.active .sitemap-icon, .whel .sitemap-icon, .sitemap .sitemap-icon {background-image: url('/css/egovframework/img/userpage/sitemap-on.svg');}

.header-icon {padding: 3.1rem 0;}

.language-select {
	background-color: #FFFFFF;
  	border: 1px solid #FFFFFF;
  	border-radius: 32px;
  	color: #000000;
  	font-size: 16px;
  	padding: 10px 4.4rem 10px 5rem;
  	-o-appearance: none;
  	-webkit-appearance: none;
  	-moz-appearance: none;
  	appearance: none;
  	background-image: url('/css/egovframework/img/userpage/language-arrow.png'), url('/css/egovframework/img/userpage/language.png');
  	background-repeat: no-repeat;
  	background-position: right+1rem center, left+1rem center;
  	line-height: 1;
}
.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: 2rem; font-weight: bold; display: block; position: relative; transition: color 0.1s; color: #FFFFFF;}
.header-menu > li > a:after {position: absolute; content: ''; display: block; height: 4px; background: #005BAC; left: 50%; bottom: 0; transform: translateX(-50%);}
.whel .header-menu > li > a {color: #000000;}
.active .header-menu > li > a {color: #000000;}
.sitemap .header-menu > li > a {color: #000000;}
.header-sub-menu {position: relative; width: 100%; display: none; padding: 15px 0;}
.on .header-sub-menu {display: block;}
.sitemap .header-sub-menu {display: block;}
.header-sub-menu li a {font-size: 1.8rem; font-weight: 500; display: block; padding: 15px 0; text-align: left; transition: all 0.5s; text-align: center;}
.header-sub-menu li a:hover {color: #005BAC;}
#header.active, #header.sitemap {
	border-top: 1px solid #EDEDED;
  	box-shadow: 0px 4px 15px 0px rgba(0, 0, 0, 0.20);
  	background-image: url('/css/egovframework/img/userpage/header-menu-back.png'); background-repeat: no-repeat;
}

.language-txt {border-radius: 50px; padding: 8px 10px; z-index: 100;}
.language-txt.on {background: #2561AE; }
.language-txt ul {display: none;}
.language-txt.on ul {display: flex;}
.language-txt li {line-height: 1;}
.language-txt li a {font-size: 1.6rem; color: #7E7E7E; display: block; padding: 0 5px; line-height: 1;}
.kr .language-txt li a.kr {color: #FFFFFF; font-weight: bold;}
.us .language-txt li a.us {color: #FFFFFF; font-weight: bold;}

#mopen img {visibility: hidden;}
#mopen {background: 100%; background-repeat: no-repeat; background-image: url('/css/egovframework/img/userpage/sitemap.svg');}
.whel #mopen {background-image: url('/css/egovframework/img/userpage/sitemap-on.svg');}

.line-1 {line-height: 1;}
/*공통*/

/*게시판*/
.bdsearch .total {font-size: 14px; font-weight: 600; margin-bottom: 0;}
.bdsearch select {font-size: 18px; padding: 12px; border: 1px solid #DDDDDD; width: 100%; max-width: 120px; margin-right: 8px;}
.bdsearch input {font-size: 14px; padding: 10px 15px 9px 15px; border: 1px solid #858585; width: 100%; max-width: 229px; border-right: 0px;}
.bdsearch button {background-color: #002452; padding: 8px;}
.bdsearch input:focus {outline: none;}

.bdgallery > div {margin-top: 25px; margin-bottom: 25px;}
.bdgallery .bdthumb {width: 100%; height: 227px; background-size: cover; background-repeat: no-repeat; background-position: center; margin-bottom: 3rem; position: relative;}
.bdgallery .bdinfo h5 {font-size: 2rem; font-weight: bold; margin-bottom: 1rem; width: 100%; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
.bdgallery .bdinfo ul li {font-size: 1.6rem; font-weight: bold; color: #909090;}

.bdcatalog > div {margin-top: 25px; margin-bottom: 25px;}
.bdcatalog .bdthumb {width: 23rem; max-width: 100%; position: relative; background-color: #D9D9D9; background-position: center; background-size: cover; background-repeat: no-repeat; box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.15);}
.bdcatalog .bdthumb:after {content: ''; display: block; padding-bottom: 139.13%;}
.bdcatalog .bdthumb .bdmore {width: 5.5rem; height: 5.5rem; background: #65C4D4; display: flex; align-items: center; justify-content: center; position: absolute; right: 1.5rem; bottom: 1.5rem;}
.bdcatalog .bdtitle li {font-size: 1.6rem; color: #909090; font-weight: 800;}
.bdcatalog .bdtitle li:nth-child(1) {margin-right: 2rem;}
.bdcatalog .bdinfo a {font-size: 1.8rem; display: inline-block; padding: 9px 3.8rem; border-radius: 3rem; font-weight: 800; color: #002452; background: #D9D9D9;}
.bdcatalog .bdinfo a.preview {background: #002452; color: #FFFFFF;}

.bdcerti .bditem {position: relative; width: 23rem; max-width: 100%; box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.15); background-size: cover; background-repeat: no-repeat; background-position: center; margin: 0 auto;}
.bdcerti .bditem:after {content: ''; display: block; padding-bottom: 139.13%;}
.bdcerti .bditem a {top: 0; left: 0; display: flex; align-items: center; justify-content: center; visibility: hidden; opacity: 0; transition: all 0.3s; backdrop-filter: blur(6px);}
.bdcerti .bditem:hover a {visibility: visible; opacity: 1;}
.bdcerti .bd-more {padding: 8px; background: #002452; display: inline-block;}

.mc-zone {padding-bottom: 10rem; }
.mc-img {box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.15); width: 38rem; max-width: 100%;}
.mc-img img {width: 100%;}

/* .bdtable {border-top: 4px solid #0068B6;} */
.bdtable th, .bdtable td {font-size: 1.8rem; padding-top: 1.3rem; padding-bottom: 1.3rem; border-bottom: 1px solid #C2C2C2;}
.bdtable td .bdt-info li {font-size: 15px; 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 thead th {background: #002452; color: #FFFFFF;}
.bdtable td a {width: 100%; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; display: block;}

.faqtable tbody tr.faq-content td {display: none;}
.faqtable tbody tr.faq-content.on td {display: table-cell;}
.faqtable tbody tr.faq-title {cursor: pointer;}
.faqtable tbody tr.faq-title td ul li {position: relative;}
.faqtable tbody tr.faq-title td ul li:after {
	position: absolute;
    content: '';
    display: block;
    width: 18px;
    height: 18px;
    background-image: url(/css/egovframework/img/userpage/arrow.png);
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center;
    right: 0;
    top: 4px;
}
.faqtable tbody tr.faq-content td {background: #D3DCED;}
.faqtable tbody tr.faq-content td div {min-height: 189px;}

.faqtable tbody tr td ul li span:nth-child(1) {display: block; width: 3rem; height: 3rem; font-size: 1.8rem; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #FFFFFF; background: #2550A5;}
.faqtable tbody tr.faq-title td ul li span:nth-child(2) {padding-right: 24px;}

.bdgoods .bdthumb {width: 100%; position: relative; border: 1px solid #002452; overflow: hidden;}
.bdgoods .bdthumb:after {content: ''; display: block; padding-bottom: 79.31%}
.bdgoods .bdthumb img.thumb {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); max-width: 100%; max-height: 100%;}
.bdgoods .bdthumb a {left: 0; top: 0; display: flex; align-items: center; justify-content: center; visibility: hidden; opacity: 0; transition: all 0.3s; backdrop-filter: blur(6px);}
.bdgoods .bdthumb:hover a {visibility: visible; opacity: 1;}
.bdgoods .bd-more {padding: 4px; background: #002452; display: inline-block;}

.pagination li {width: 34px; height: 34px; display: flex; justify-content: center; align-items: center; margin: 0 8px; border-radius: 50%;}
.pagination li a {font-size: 18px; color: #333333 !important; display: flex;}
.pagination li.active {background: #002452;}
.pagination li.active a {color: #FFFFFF !important; font-weight: bold;}
.pagination li.pg-arw {border-radius: 50%;}

.bddetail {border-top: 4px solid #002452;}
.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;}
.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: 1.7rem 0; border-bottom: 1px solid #C7C7C7; font-size: 1.7rem;}

.bdinquiry .bdinfo {padding: 5rem; box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.15);}
.input-table th, .input-table td {padding: 7px 0;}
.input-table th {color: #00266D; font-size: 1.8rem;}
.input-table td {font-size: 1.6rem;}
.input-table td > div {max-width: 403px; width: 100%;}
.input-table input, .input-table textarea {font-size: 1.6rem; padding: 1rem 1rem; border: 1px solid #00266D; background: #F2F2F2; width: 100%;}
.toast-message {font-size: 1.6rem;}

.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;
}
/*게시판*/

.section1 {padding-top: 24.1rem; background: #2561AE;} /*min-height: 100vh; */

.mof-item {padding: 15px 35px; background-image: url('/css/egovframework/img/userpage/main/mof-item.png'); background-position: bottom; background-size: 100%; background-repeat: no-repeat; min-height: 220px; border-radius: 40px 0 40px 0;}
.mof-item a {font-size: 1.8rem; font-weight: 500; display: block; position: relative; z-index: 1;}
.mof-item a span {display: inline-block; padding: 14px 0; position: relative; z-index: 1;}
.mof-item a:before {position: absolute; content: ''; display: block; width: 4rem; height: 4rem; border-radius: 100%; left: -12px; top: 50%; transform: translateY(-50%); z-index: -1; transition: left 0.5s;}
.mof-item a:hover:before {left: 34px;}
.mof-item.mof-one a:before {background: #719CF0;}
.mof-item.mof-two a:before {background: #719CF0;}
.mof-img {position: absolute; transform: translateX(50%);}
.mof-img1 {bottom: -8%; left: -46%; max-width: 73.69%;}
.mof-img2 {bottom: 14%; left: -10%; max-width: 31.51%;}

.ms-item {overflow: hidden; min-height: 100vh;}
.ms-zoom {height: 100%; width: 100%; left: 0; top: 0; background-size: cover; background-repeat: no-repeat; background-position: center; z-index: -1; transition: all 0.5s;}
.slick-active .ms-zoom {animation: fadeUp 7s forwards; animation-delay: 1s;}
.ms-txt h1 {font-size: 8rem; background: #FFFFFF; -webkit-background-clip: text; -webkit-text-fill-color: transparent;}
.slick-active .ms-txt h1 {animation: colorChange 7s forwards; animation-delay: 1s; background-clip: text; }
.ms-txt p {font-size: 2.6rem}

@keyframes fadeUp {  
    0% {transform: scale(1);}  
    100% {transform: scale(1.1);}
} 

@keyframes colorChange {
	0% {background: #FFFFFF; background-clip: text;}  
    100% {background: linear-gradient(90deg, #001F60 0%, #719CF0 100%); background-clip: text;}
}

.ms-slider .slick-dots {left: 0; top: auto; bottom: 190px; width: 100%;}
.ms-slider .slick-dots .snum {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: 58px; height: 4px; background: rgba(255,255,255,0.5); position: relative; margin: 0 7px; overflow: hidden; margin: 0 5px;}
.ms-slider .progressbar.on span {background: #FFFFFF; width: 4px; position: absolute; left: 0; top: 0; height: 100%; animation: fill 7s forwards; animation-delay: 1s;}
@keyframes fill {  
    0% {width: 0px;}  
    100% {width: 100%;}
} 

.section3 {padding: 10rem 0;}
.mp-list {margin: 0 -5px;}
.mp-item {padding: 0 5px; min-height: 49.8rem; transition: all 0.5s;}
.mp-item > div > div {background-position: center; background-size: cover; background-repeat: no-repeat; padding: 2rem;}
.mp-item h5 {font-size: 3.2rem; padding-bottom: 0; transition: padding 0.5s;}
.mp-item .arrow-more {display: none; position: absolute; left: 2rem; bottom: 2rem;}

.arrow-more {font-size: 1.8rem; padding: 1rem 3.5rem 1rem 2rem; border: 1px solid #FFFFFF; border-radius: 42.5px; color: #FFFFFF; display: inline-block; position: relative;}
.arrow-more img {position: relative; top: -1px; z-index: 2;}
.arrow-more:after {content: ''; display: block; position: absolute; width: 3rem; height: 3rem; background: #7193F0; right: 2rem; top: 8px; border-radius: 50%; z-index: 1; transition: all 0.5s;}
.arrow-more:hover:after {background: #001F60;}

.section4 {background-color: #F8F8F8; background-position: left center; background-size: 100% auto; background-repeat: no-repeat; background-image: url('/css/egovframework/img/userpage/main/section4-back.png'); padding: 10rem 0;}

.mba-item {position: relative; background-size: cover; background-repeat: no-repeat; background-position: center; border-radius: 40px 0 40px 0;}
.mba-item:after {content: ''; display: block; padding-bottom: 100%;}

.mb-img {width: 100%; position: relative;}
.mb-img > div {border-radius: 0 40px 0 40px; overflow: hidden; }
.mb-txt {position: relative;}

.mg-parent {padding: 10rem 5rem 10rem 5rem;}
.mg-item {background: #001644; padding: 2rem 3rem 6rem 3rem; max-width: 32.3rem; position: relative; border-radius: 0px; transition: all 0.5s;}
.mg-item:hover {border-radius: 40px 0 40px 0;}
.mg-item span {font-size: 1.6rem; color: #719CF0; border: 1px solid #719CF0; display: inline-block; padding: 2px 15px; border-radius: 14px;}
.mg-item p {
	display: -webkit-box;
    display: -ms-flexbox;
    word-wrap: break-word;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    max-height: 4.8rem;
    min-height: 4.8rem;
}
.mg-item h5, .mg-item p {transition: all 0.5s;}
.mg-item:hover h5, .mg-item:hover p {color: #719CF0 !important;}
.mg-img {position: relative; overflow: hidden;}
.mg-img > a {display: flex; align-items: center; justify-content: center;}
.mg-img > a > span {display: inline-block; padding: 1.5rem; background: #719CF0; border-radius: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 2; opacity: 0; transition: all 0.5s;}
.mg-item:hover .mg-img > a > span {transform: translate(-50%, -50%) rotate(180deg); opacity: 1;}
.mg-img:after {content: ''; display: block; padding-bottom: 68.96%;}
.mg-img > img {position: absolute; max-width: 100%; max-height: 100%; top: 50%; left: 50%; transform: translate(-50%, -50%); height: auto; width: auto;}

.mg-arrow {position: absolute; right: 0; bottom: 3rem;}
.mg-arrow .mg-prev {margin-right: 6rem;}
.mg-arrow li {position: relative; cursor: pointer;}
.mg-arrow li:after {position: absolute; content: ''; display: block; width: 4.5rem; height: 4.5rem; background: #719CF0; border-radius: 50%; top: 50%; transform:translateY(-50%); z-index: 1;}
.mg-arrow li.mg-prev:after {left: -2rem;}
.mg-arrow li.mg-next:after {right: -2rem;}
.mg-arrow a {position: relative; z-index: 2; transition: all 0.5s; left: 0; right: 0;}
.mg-arrow .mg-prev:hover a {left: 10px; right: auto;}
.mg-arrow .mg-next:hover a {right: 10px; left: auto;}

.page-top {background-size: cover; background-repeat: no-repeat; background-position: center; margin-bottom: 10rem;}
.page-top > div {padding: 19.9rem 0 17.3rem;}
.page-navi li {padding: 0 3.3rem; line-height: 1; position: relative;}
.page-navi li:after {position: absolute; content: url('/css/egovframework/img/userpage/home-arrow.svg'); right: -10%; top: 50%; transform: translateY(-50%);}
.page-navi li:last-child:after {display: none;}
.page-navi li a {font-size: 1.8rem; color: #FFFFFF;}
.page-menu {position: absolute; background: rgba(18, 18, 18, 0.4); left: 0; bottom: 0; width: 100%; border-radius: 20px 20px 0 0;}
.page-menu li a {display: flex; align-items: center; justify-content: center; text-align: center; font-size: 2rem; font-weight: 500; color: #FFFFFF; padding: 20px 0; width: 217px; height: 100%;}
.page-menu li.on a {background: #FFFFFF; color: #000000;}

.page-title {padding-bottom: 3rem; border-bottom: 1px solid #002452; margin-bottom: 8rem;}

.ht-item li a {width: 100%; padding: 1.2rem 0; text-align: center; font-weight: bold; border: 1px solid #D9D9D9; display: block;}
.ht-item li.on a {background: #002452; color: #FFFFFF; border: 1px solid #002452; box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.15);}
.ht-content {padding-top: 8rem;}
.ht-content > div {display: none;}
.ht-content > div.on {display: block;}
.ht-year h3 {position: relative;}
.ht-year h3:after {position: absolute; content: ''; display: block; width: 12px; height: 12px; background: #FFFFFF; border: 2px solid #2550A5; border-radius: 50%; top: 50%; transform: translateY(-50%); z-index: 1;}
.ht-desc {padding-left: 3.6rem; padding-top: 7px; padding-bottom: 7rem; position: relative;}
.ht-desc li {font-size: 2rem; margin-bottom: 3rem;}
.ht-desc li span:nth-child(1) {flex: 0 0 6rem;}

.pc-item {position: relative; box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.15); background: #FFFFFF;} 
.pc-item:after {content: ''; display: block; padding-bottom: 29.96%;}
.pc-item img {position: absolute; max-width: 100%; max-h0eight: 80%; left: 50%; top: 50%; transform: translate(-50%, -50%);}

.map-info {padding: 5rem; box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.15);}

.gd-slider .slick-slide {padding: 1px;}
.gd-slider .gd-item {position: relative; border: 1px solid #002452; overflow: hidden;}
.gd-slider .gd-item a {display: none;}
.gd-slider .gd-item:after {content: ''; display: block; padding-bottom: 79.24%;}
.gd-slider .gd-item > img {position: absolute; max-width: 100%; top: 50%; left: 50%; transform: translate(-50%, -50%); width: auto; height: auto;}

.gd-info span {font-size: 1.6rem; color: #FFFFFF; background: #002452; padding: 9px 25px; display: inline-block; margin-bottom: 2rem;}
.gd-info h5 {font-size: 1.6rem; padding: 20px; background: #D3DCED; font-weight: 500;}

.gdi-slider .slick-slide {padding: 5px;}
.gdi-slider .slick-track {margin-left: 0; margin-right: auto;}
.gdi-slider .gd-item {position: relative; border: 1px solid #002452; max-width: 15rem; margin: 0 auto; overflow: hidden;}
.gdi-slider .slick-slide.slick-current .gd-item {box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.35); }
.gdi-slider .gd-item a {position: absolute; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; opacity: 0; background: rgba(255,255,255,0.7); transition: all 0.5s;}
.gdi-slider .gd-item:hover a {opacity: 1;}
.gdi-slider .slick-slide.slick-current .gd-item a {display: none;}
.gdi-slider .gd-item a span {background: #002452; padding: 8px; display: inline-block;}
.gdi-slider .gd-item:after {content:''; display: block; padding-bottom: 80%;}
.gdi-slider .gd-item > img {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: auto; max-width: 100%; height: auto; max-height: 100%;}

.gd-detail > div {border-bottom: 1px solid #002452;}
.gd-detail .gd-content {display: none; min-height: 96.9rem; padding: 3rem 0;}
.gd-detail .gd-content img {max-width: 100%;}
.gd-detail .on .gd-content {display: flex; align-items: center; justify-content: center;}

.gd-detail h1 {border-top: 1px solid #002452; padding-right: 7rem; position: relative;}
.gd-detail h1:after {
	position: absolute; content: ''; display: block; width: 1.8rem; height: 1.8rem;
	background-image: url('/css/egovframework/img/userpage/goods/detail-arrow.svg'); background-size: 100% 100%;
	top: 50%; transform: translateY(-50%); right: 2.6rem;
}
.gd-detail .on h1:after {transform: translateY(-50%) rotate(180deg);}

.tech-content > div {display: none;}
.tech-content > div.on {display: block;}
.tech-title {padding: 7.4rem 0 5rem; background-size: cover; background-position: center; border-radius: 40px 0 40px 0; overflow: hidden; background-image: url('/css/egovframework/img/userpage/tech/tech-title.png?v=20250203');}
.tc-item li a {width: 100%; padding: 1.2rem 0; text-align: center; font-weight: bold; border: 1px solid #D9D9D9; display: block;}
.tc-item li.on a {background: #002452; color: #FFFFFF; border: 1px solid #002452; box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.15);}
.tech-desc {display: block; padding: 5rem; box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.15);}