/*공통*/
.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: 'YiSunShinDotumM';
	src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_two@1.0/YiSunShinDotumM.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}

.ffp {font-family: Pretendard-Regular;}
.ffn {font-family: Noto Sans KR !important;}
.ffs {font-family: Noto Serif KR !important;}

.line-15 {line-height: 1.5;}
.line-2 {line-height: 2;}

.line-30 {line-height: 30px;}

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;}

.sm-title {font-size: 2.6rem !important;}

.ptitle {font-size: 2.5rem;}
.btitle {font-size: 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;}
.mt5 {margin-top: 5rem !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;}
.co36 {color: #363636 !important;}
.co33 {color: #333333 !important;}
.coeb8 {color: #036EB8 !important;}
.cof5c {color: #434F5C !important;}
.co4ff {color: #99F4FF !important;}
.coad {color: #ADADAD !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.btn-s-txt {font-size: 1.6rem;}

.btn.bk-ff {background-color: #FFFFFF; color: #036EB8; border: 1px solid #036EB8;}
.btn.bk-b8 {background-color: #036EB8; color: #FFFFFF; border: 1px solid #036EB8;}

.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 a {font-size: 1.8rem; color: #FFFFFF; display: block;}

.finfo {padding: 6rem 0 3rem;}
.footer-logo {margin-right: 6rem; max-width: 16rem;}
.finfo p {font-size: 1.8rem; color: #FFFFFF;}
.finfo ul li span {font-size: 1.6rem; color: #939393;}

.finfo ul.page-info li {position: relative; padding-left: 2rem; padding-top: 1rem; padding-bottom: 1rem;}
.finfo ul.page-info li:after {content: ''; display: block; height: 100%; width: 6px; position: absolute; top: 0; left: 0;}
.finfo ul.page-info li:nth-child(1) {margin-right: 6rem;}
.finfo ul.page-info li:nth-child(1):after {background-color: #00B0FF}
.finfo ul.page-info li:nth-child(2):after {background-color: #FFC300;}
.finfo ul.page-info li span {font-size: 1.6rem; font-weight: 400; color: #C4C4C4;}
.finfo ul.page-info li h5 {font-size: 2.4rem; font-weight: bold;}

#header {position: fixed; width: 100%; left: 0; z-index: 100; top: 0; background: #FFFFFF; box-shadow: 0px 4px 15px 0px rgba(0, 0, 0, 0.20);}
#header .menus {background: transparent;}
#header.whel {box-shadow: 0px 4px 15px 0px rgba(0, 0, 0, 0.20); background: #FFFFFF;}
#header.active {background: #FFFFFF;}
#header.sitemap {background-color: #036EB8;}

.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: #036EB8; 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; box-shadow: none;}
#header .hm-menu .on .header-sub-menu {display: block; background-color: #FFFFFF !important;}
#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; background-size: 100% 100%; background-position: center; background-repeat: no-repeat; background-image: url('/css/egovframework/img/userpage/header-logo.svg');}
.whel .header-logo {background-image: url('/css/egovframework/img/userpage/header-logo.svg');}
.active .header-logo {background-image: url('/css/egovframework/img/userpage/header-logo.svg');}
.sitemap .header-logo {background-image: url('/css/egovframework/img/userpage/header-logo-on.svg');}

.menu input {display: none;}
.menu input + label {display: block; width: 2.2rem; height: 1.6rem; position: relative;}
.menu label span {display: block; width: 2.2rem; height: 3px; position: absolute; transition: all 0.5s; margin: 0; background: #000000;}
.whel .menu label span {background: #000000;}
.active .menu label span {background: #000000;}
.sitemap .menu label span {background: #FFFFFF;}
.menu label span:nth-child(1) {top: 0;}
.menu label span:nth-child(2) {top: 50%; transform: translateY(-50%); width: 1.1rem;}
.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);}

#mopen {background-image: url('/css/egovframework/img/userpage/hamburger-on.png'); background-size: 100% 100%; background-repeat: no-repeat;}
.whel #mopen {background-image: url('/css/egovframework/img/userpage/hamburger-on.png');}
.active #mopen {background-image: url('/css/egovframework/img/userpage/hamburger-on.png');}

.header-menu {z-index: 10; position: relative;}
.header-menu > li {position: relative; }
.header-menu > li > a {font-size: 2rem; font-weight: 500; display: block; position: relative; transition: color 0.1s; color: #000000;}
.whel .header-menu > li > a {color: #000000;}
.active .header-menu > li > a {color: #000000;}
.sitemap .header-menu > li > a {color: #FFFFFF;}

.header-sub-menu {position: absolute; width: 100%; display: none; padding: 1.5rem 0;  box-shadow: 0px 4px 15px 0px rgba(0, 0, 0, 0.20);}
#header:not(.sitemap) .on .header-sub-menu {display: block; background-color: #0776C3;}
.sitemap .header-sub-menu {display: block; box-shadow: none;}
.header-sub-menu li a {font-size: 2rem; color: #FFFFFF; display: block; padding: 0.8rem 0; text-align: center;}
.sitemap .header-sub-menu li a {color: #000000;}
.header-menu-back {
	height: 44.4rem; 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;
	background-image: url('/css/egovframework/img/userpage/header-back.png'); background-repeat: no-repeat; background-position: right bottom;
}
.sitemap .header-menu-back {display: block;}
.us .header-menu-back {height: 54.4rem;}

.btn.btn-shop {font-size: 1.8rem; color: #FFFFFF; display: inline-block; padding: 1px 1.2rem; border-radius: 150px; background-color: #0776C3; color: #FFFFFF;}
.countryZone {cursor: pointer; z-index: 2;}
.countryZone span {margin: 0 2rem; font-size: 1.8rem; padding: 5px 1.1rem 7px 1.1rem; background-color: #F6F6F6; border-radius: 4px; display: flex; align-items: center; line-height: 1;}
.countryZone span img {position: relative; top: 1px; margin-right: 3px;}
.mheader .countryZone span {margin: 0;}
.mheader .countryZone > ul {width: 100%;}
.countryZone > ul {position: absolute; left: 50%; transform: translateX(-50%); width: calc(100% - 4rem); border-bottom: 1px solid #F3F3F3; display: none;}
.countryZone.on > ul {display: block;}
.countryZone > ul li {font-size: 1.6rem; padding: 5px 1.1rem; background-color: #F6F6F6; width: 100%; text-align: center; line-height: 1; border: 1px solid #F3F3F3; border-bottom: 1px solid #F3F3F3;}

.header-mobile .header-sub-menu {height: auto;}
/*공통*/

/*게시판*/
.bdsearch {margin-bottom: 2rem;}
.bdsearch .total {font-size: 18px; font-weight: 600; margin-bottom: 0;}
.bdsearch select {
	font-size: 1.8rem; padding: 1.4rem 2.3rem; border: 1px solid #E6E6E6; width: 100%; max-width: 136px; margin-right: 10px;
	-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+1.9rem center;
}
.bdsearch input {font-size: 1.8rem; padding: 1.4rem 2.3rem; border: 1px solid #E6E6E6; width: 100%; max-width: 356px;}
.bdsearch button {background-color: #036EB8; padding: 1.4rem 3.5rem; color: #FFFFFF; font-size: 1.8rem; border: 0px; font-weight: 500;}
.bdsearch input:focus {outline: none;}

.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.9rem 0; background-color: #036EB8; color: #FFFFFF;}
.bdtable td {padding: 5px 0; height: 1px;}
.bdtable tr:first-child td {padding-top: 10px;}
.bdtable td div {font-size: 1.8rem; padding-top: 3rem; padding-bottom: 3rem; background-color: #FAFAFA; height: 100%;}
.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%;}

.bd-top {padding-bottom: 16.7rem; background-color: #F5F5F5;}

.pagination li {width: 5rem; height: 5rem; display: flex; justify-content: center; align-items: center; margin: 0 8px; border-radius: 100%; border: 1px solid #C0C0C0;}
.pagination li a {font-size: 1.8rem; color: #000000 !important; line-height: 1; display: flex; justify-content: center; align-items: center;}
.pagination li.active {background: #036EB8; border: 1px solid #036EB8; font-weight: bold;}
.pagination li.active a {color: #FFFFFF !important;}
.pagination li.pg-arw {border: 0;}

.bddetail {border-top: 4px solid #036EB8;}
.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;}

.input-table th {background-color: #036EB8; padding: 2.5rem 0; border-bottom: 1px solid #D9D9D9; font-size: 2.2rem; color: #FFFFFF; text-align: center; font-weight: 500;}
.input-table td {padding: 1.3rem 2.8rem; font-size: 1.8rem;}
.input-table td input {font-size: 1.8rem; border: 1px solid #D9D9D9; padding: 1.5rem 1.2rem; width: 100%;}
.input-table td select {
	font-size: 1.8rem; padding: 1.5rem 1.2rem; color: #686868; width: 100%;
	-o-appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	background-color: #F9F9F9; border: 1px solid #D9D9D9;
	background-image: url('/css/egovframework/img/userpage/consulting/select-arrow.svg');
	background-repeat: no-repeat;
	background-position: right+1.9rem center;
}
.input-table td textarea {font-size: 1.8rem; border: 1px solid #D9D9D9; padding: 1.5rem 1.2rem; width: 100%; height: 28.2rem;}

.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;}
/*게시판*/

.btn.btn-page {padding: 1.4rem 3.8rem; max-width: 27.2rem; width: 100%; color: #FFFFFF; font-size: 2rem; display: flex; align-items: center; justify-content: space-between; border: 1px solid #FFFFFF; border-radius: 100px;}

.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;
}

.ms-item {background-color: #9F9F9F; overflow: hidden; position: relative; height: 100vh;}
/*.ms-item:after {content: ''; display: block; padding-bottom: 48.8%;}*/
.ms-item h1 {font-size: 5.5rem; position: relative; opacity: 0; animation: slideUp 1s forwards 0s; padding-bottom: 20rem; font-family: YiSunShinDotumM;}
.ms-item span {width: 1px; height: 0; margin: 4.3rem 0; background-color: #FFFFFF; animation: line 1s forwards 1s; position: absolute; left: 50%; top: calc(100% - 12.6rem - 6.1rem);}
.ms-item p {font-size: 2.2rem; position: relative; position: relative; opacity: 0; animation: slideUp 1s forwards 2s;}

.ms-txt {height: 100%; animation: showDown 1s forwards 4s; opacity: 1; position: absolute; top: 0; left: 0; width: 100%;}
.ms-video {position: absolute; top: 0; left: 0; width: 100%; animation: showUp 1s forwards 4s; opacity: 0; transform: scale(2); height: 100vh;}
.ms-video > div {position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #FFFFFF;}
.ms-video > div > div {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%;}
.ms-video > div > div:after {content: ''; display: block; padding-bottom: 56.25%;}
.ms-video iframe {height: 100%; width: 100%; object-fit: cover; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%);}

.ms-back {background-color: rgba(159,159,159,0.3); position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.ms-img {position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-image: url('/css/egovframework/img/userpage/main/ms-back.png'); background-position: center; background-size: cover;}

@keyframes slideUp {
	from {opacity: 0; transform: translate3d(0,100px,0);}
	to {opacity: 1; transform: translateZ(0);}
}

@keyframes line {
	from {height: 0px;}
	to {height: 8rem;}
}

@keyframes showUp {
	from {opacity: 0; transform: scale(2);}
	to {opacity: 1; transform: scale(1);}
}

@keyframes showDown {
	from {opacity: 1;}
	to {opacity: 0;}
}

#section2 {background-size: cover; background-repeat: no-repeat; background-position: center; background-image: url('/css/egovframework/img/userpage/main/section2-back.png');}
.tb-item {position: relative; background-color: #FFFFFF; border-radius: 22px; box-shadow: 8px 8px 10px 0px #AEAEAE; border: 1px solid #C0C0C0; overflow: hidden;}
.tb-item:after {content: ''; display: block; padding-bottom: 121.62%;}
.tb-item > div {position: absolute; width: 100%; height: 100%; top: 0; left: 0; background-color: #FFFFFF; display: flex; flex-direction: column; align-items: center; justify-content: center; transition: all 0.5s;}
.tbi-txt {height: 11.2rem; display: flex; align-items: center; justify-content: center;}
.tbi-icon {width: 94px; height: 94px; margin: 0 auto; margin-bottom: 3rem; border-radius: 100%;}
.tbi-icon > img {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}

.tb-item:nth-child(1).on > div {background-color: #036EB8;}
.tb-item:nth-child(2).on > div {background-color: #00A1E9;}
.tb-item:nth-child(3).on > div {background-color: #036EB8;}

.tb-item:nth-child(2).on .tbi-icon {border: 3px solid #06B2FF;}
.tb-item:nth-child(3).on .tbi-icon {border: 3px solid #0081DA;}

.tb-item.on h1, .tb-item.on p {color: #FFFFFF;}

#section3 {background-size: cover; background-position: center; background-repeat: no-repeat;}
.hg-img {flex: 0 0 33.2rem; max-width: 49%; position: relative; border-radius: 30px; background-repeat: no-repeat; background-size: cover; background-position: center;}
.hg-img:after {content: ''; display: block; padding-bottom: 138.85%;}

#section4 {background-size: cover; background-repeat: no-repeat; background-position: center bottom;}
.mp-img:after {content: ''; display: block; padding-bottom: 79.21%;}
.mpd-zone {background-color: #FFFFFF; border-radius: 21px; box-shadow: 8px 8px 10px 0px rgba(0, 0, 0, 0.25); padding: 3.2rem;}
.mpd-menu {margin-left: -4px; margin-right: -4px; display: flex; align-items: center; flex-wrap: wrap;}
.mpd-menu li {padding: 4px;}
.mpd-menu li a {
	width: 100%; text-align: center; font-size: 1.8rem; color: #000000; border: 1px solid #C0C0C0; border-radius: 3.5px; transition: all 0.5s; height: 5.7rem;
	display: flex; align-items: center; justify-content: center;
}
.mpd-menu li a:hover {background-color: #00A1E9; color: #FFFFFF; border: 1px solid #00A1E9;}
.mpd-menu li.on a {color: #FFFFFF; background-color: #036EB8; border: 1px solid #036EB8;}
.mp-img > div {display: none; position: absolute; width: 100%; height: 100%; top: 0; left: 0;}
.mp-img > div.on {display: block;}
.mp-img > div > img {position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); max-width: 100%; max-height: 100%;}
.mpd-content {padding: 0 2rem; min-height: 16rem;}
.mpd-content > div {display: none; position: relative;}
.mpd-content > div.on {display: block;}
.gview {position: absolute; top: 0; right: 0;}
.mpd-content ul li {font-size: 1.8rem; color: #036EB8; font-weight: 500; margin-right: 10px; padding-right: 10px; line-height: 1; position: relative;}
.mpd-content ul li:last-child {padding-right: 0; margin-right: 0;}
.mpd-content ul li:after {content: ''; display: block; width: 1px; height: 100%; background-color: #B0B0B0; position: absolute; right: 0; top: 1px;}
.mpd-content ul li:last-child:after {display: none;}

#section5 {padding: 9.6rem 0 8.3rem; background-repeat: no-repeat; background-position: center; background-size: cover; background-image: url('/css/egovframework/img/userpage/main/section5-back.png'); position: relative; z-index: 2; background-color: #003F7A;}
.mpromise {background-repeat: no-repeat; background-position: center; background-size: 100% 100%; position: relative; transition: all 0.5s;}
.mpromise:hover {background-size: 105% 105%;}
.mpromise:after {content: ''; display: block; padding-bottom: 122.08%;}
.mpromise > div {position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; flex-direction: column; justify-content: end; align-items: start;}
.mpromise:hover > div p {height: auto; opacity: 1;}
.mc-item {max-width: 22.1rem; width: 100%; margin: 0 auto;}
.mc-img {position: relative; background-size: cover; background-repeat: no-repeat; background-position: center; width: 100%; background-color: #FFFFFF;}
.mc-img:after {content: ''; display: block; padding-bottom: 142.08%;}

.mc-list .slick-dots {top: auto; bottom: 3rem; left: calc(-100% + 25.673%);}
.mc-list .slick-dots li {width: 10px; height: 10px;}
.mc-list .slick-dots li button {width: 10px; height: 10px;}
.mc-list .slick-dots li button:before {width: 10px; height: 10px; border: 1px solid #FFFFFF; background-color: #FFFFFF;}
.mc-list .slick-dots li.slick-active {width: 29px; border-radius: 7px;}
.mc-list .slick-dots li.slick-active button {width: 29px; border-radius: 7px;}
.mc-list .slick-dots li.slick-active button:before {background-color: #99F4FF; width: 29px; border: 1px solid #99F4FF; border-radius: 7px;}
.mc-list .slick-slide {padding: 0 15px;}

#section6 {padding: 14rem 0 19rem; background-repeat: no-repeat; background-position: top left; background-size: cover; background-image: url('/css/egovframework/img/userpage/main/section6-back.png');}
.msx-contact > div {
	background-image: url('/css/egovframework/img/userpage/main/msx-contact.png'); background-repeat: no-repeat; background-position: center; background-size: cover;
	display: flex; align-items: center; justify-content: center; padding: 10rem 0; height: 100%;
}

.page-title {background-size: cover; background-repeat: no-repeat; background-position: center;}
.page-title h1 {font-size: 5rem; color: #FFFFFF; font-weight: bold; animation: slideUp 1s forwards 0s; position: relative; opacity: 0;}
.pagebread {animation: slideUp 1s forwards 0s; position: relative; opacity: 0;}
.pagebread li {margin: 0 1.4rem; padding: 0 1.4rem; position: relative;}
.pagebread li:after {content: ''; display: block; width: 2.4rem; height: 2.4rem; background-size: 100% 100%; background-image: url('/css/egovframework/img/userpage/page-menu.svg'); position: absolute; top: 2px; right: -2.6rem;}
.pagebread li:last-child:after {display: none;}
.pagebread li a {font-size: 1.8rem; color: #FFFFFF;}

.pagemenu ul {align-items: center; justify-content: center;}
.pagemenu li {text-align: center; padding: 0 7rem;}
.pagemenu li a {font-size: 2.2rem; color: #B0B0B0; display: inline-block; position: relative; padding: 1.3rem 5px;}
.pagemenu li.on a {color: #036EB8; font-weight: 500;}
.pagemenu li.on a:after {content: ''; display: block; width: 100%; height: 3px; background-color: #036EB8; position: absolute; left: 0; bottom: 0; animation: toright 1000ms 1 ease-out;}

@keyframes toright { 0% {width: 0%;}  100% {width: 100%;}}

.menuContent {padding-bottom: 15rem;}

.flex-title {display: flex; align-items: start;}
.flex-title img {position: relative; top: 1.6rem;}

.company-two {background-size: cover; background-repeat: no-repeat; background-position: center; padding: 8rem 0 18rem; background-image: url('/css/egovframework/img/userpage/introduce/company-two.png');}

.icerti {max-width: 29.5rem; margin: 0 auto; margin-bottom: 9rem;}
.ic-img {width: 100%; background-size: cover; background-repeat: no-repeat; background-position: center; position: relative; border: 1px solid #B0B0B0;}
.ic-img:after {content: ''; display: block; padding-bottom: 137.28%;}
.ic-img > a {position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(26, 26, 26, 0.50); backdrop-filter: blur(2px); opacity: 0; transition: all 0.5s; display: flex; align-items: center; justify-content: center;}
.ic-img:hover a {opacity: 1;}

html.certi {width: 100%; height: 100%; overflow-y: hidden;}
.certizone {position: fixed; height: 100%; left: 0; top: 0; width: 100%; background-color: rgba(0,0,0,0.75); visibility: hidden;}
.certizone.on {display: flex; z-index: 1000; visibility: visible; align-items: center; justify-content: center;}
.certizone-img {width: 100%; max-width: 41.9rem; position: relative; background-color: #FFFFFF; margin: 0 auto;}
.certizone-img:after {content: ''; display: block; padding-bottom: 146.56%;}
.certizone-img > img {position: absolute; width: 100%; height: 100%; top: 0; left: 0;}
.certizone-close {font-size: 1.8rem; padding: 2px 1.5rem; border: 1px solid #FFFFFF; border-radius: 6px; display: inline-block; color: #FFFFFF; cursor: pointer;}

.company-map {background-color: #00A1E9; border-radius: 20px; padding: 6rem 0;}
.company-map > div {margin: 0 2.2rem; padding-left: 1.8rem; position: relative; height: 8.3rem; display: flex; align-items: center;}
.company-map > div:after {content: ''; display: block; height: 100%; width: 5px; position: absolute; top: 0; left: 0;}
.company-map > div:nth-child(1):after {background-color: #DAF4FF;}
.company-map > div:nth-child(2):after {background-color: #A1FFE9;}

.bnf-zone {padding-bottom: 11rem;}
.bnf-img {position: absolute; right: 0;}

.bnf-zone2 {background-color: #036EB8; padding: 12rem 0 11rem; background-repeat: no-repeat; background-position: top left; background-image: url('/css/egovframework/img/userpage/story/bnf-zone2.png');}
.bnf-item {max-width: 33.6rem; width: 100%; margin: 3.5rem auto; position: relative; background-color: rgba(255, 255, 255, 0.2); border-radius: 20px;}
.bnf-item:after {content: ''; display: block; padding-bottom: 101.48%;}
.bnf-item > div {position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center;}
.bnf-icon {height: 6.5rem; display: flex; align-items: center; justify-content: center;}
.bnf-icon > img {max-height: 100%;}

.bnf-zone3 {padding-top: 14rem;}
.bnf-desc {padding: 7rem 0;}

.cfh-zone {padding: 11rem 0 9.3rem; background: linear-gradient(0deg, #FFF 0%, #F3FCFE 100%);}
.cfh-item {position: relative;}

.cfh-back {position: absolute; height: 100%; z-index: -1;}
.cfh-item:nth-child(2n + 1) .cfh-back {top: 0; left: 0; padding-right: 8rem;}
.cfh-item:nth-child(2n) .cfh-back {top: 0; left: 0; padding-left: 8rem;}
.cfh-back > img {height: 100%;}
.cfh-back > img:nth-child(2) {position: absolute; top: 0;}
.cfh-item:nth-child(2n + 1) .cfh-back > img:nth-child(2) {left: 0;}
.cfh-item:nth-child(2n) .cfh-back > img:nth-child(2) {right: 0;}

.snum {color: #FFFFFF; background-color: #036EB8; width: 2.8rem; height: 2.8rem; font-size: 1.8rem; border-radius: 100%; display: flex; align-items: center; justify-content: center; position: relative; top: 2px; flex: none;}

.recipe-zone {padding: 9.5rem 0 8rem; background: linear-gradient(0deg, #FFF 0%, #F4F4F4 100%);}
.rz-list .slick-slide {padding: 0 10px;}
.rz-item {width: 100%; max-width: 19rem; margin: 0 auto; background-repeat: no-repeat; background-position: center; background-size: cover; border-radius: 100%; position: relative;}
.rz-item:after {content: ''; display: block; padding-bottom: 100%;}
.rz-item > a {position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.55); display: flex; align-items: center; justify-content: center; font-size: 2.4rem; color: #FFFFFF; border-radius: 100%; opacity: 1; transition: all 0.2s; text-align: center;}
.rz-item > a:hover {opacity: 0;}

.rp-arrow {position: absolute; top: 50%; transform: translateY(-50%); max-width: 15px;}
.rp-prev {left: -15px;}
.rp-next {right: -15px;}

.recipe-zone2 {padding-top: 8rem;}
.rzi-zone {margin-bottom: 7rem; min-height: 58.2rem;}
.us .rzi-zone {min-height: 64.5rem;}
.rzinfo {
	background-color: #036EB8; border-radius: 20px; position: relative; z-index: 2; margin-right: 0; margin-left: auto;
	background-image: url('/css/egovframework/img/userpage/story/rzinfo.png'); background-repeat: no-repeat; background-position: right bottom;
}
.rzinfo ul {display: flex; flex-wrap: wrap; margin: 0 -7px;}
.rzinfo ul li {padding: 7px;}
.rzinfo ul li span {font-size: 1.8rem; color: #FFFFFF; padding: 6px 2rem; display: block; border: 1px solid #FFFFFF; border-radius: 24px;}

.rz-desc li {
	font-size: 2rem; margin-bottom: 5rem;
	background-image: url('/css/egovframework/img/userpage/story/rz-desc.png'); background-size: 100% auto; background-repeat: no-repeat; background-position: left bottom;
}
.rz-desc li:last-child {margin-bottom: 0;}
.rz-desc li span {font-size: 2.4rem; width: 4.3rem; height: 4.3rem; background-color: #036EB8; color: #FFFFFF; border-radius: 100%; margin-right: 4rem; display: flex; align-items: center; justify-content: center; font-weight: bold; flex: none;}

.pz-zone {padding: 9rem 0 0 0; display: flex; align-items: center; margin-bottom: 17rem; flex-wrap: wrap;}
.pz-img {z-index: 2;}
.pz-text {
	background-color: #036EB8;
	border-radius: 20px;
	background-repeat: no-repeat; background-image: url('/css/egovframework/img/userpage/product/pzt-text.png');
	background-position: right bottom; position: relative;;
}
.pzt-option {display: flex; margin: 0 -4px;}
.pzt-option li {font-size: 1.6rem; padding: 4px 1.8rem; margin: 0 4px;}
.pzt-option li:nth-child(2n + 1) {color: #FFFFFF; border: 1px solid #FFFFFF;}
.pzt-option li:nth-child(2n) {color: #036EB8; background-color: #FFFFFF;}
.pz-text p {max-width: 41.2rem;}
.btn.btn-goods {font-size: 2rem; color: #FFFFFF; padding: 1.4rem 3.6rem; border-radius: 45px; border: 1px solid #FFFFFF; display: inline-block;}
.btn.btn-goods img {position: relative; top: -2px;}

.pz-detail {padding: 12.3rem 0 15.2rem; background-size: cover; background-repeat: no-repeat; background-image: url('/css/egovframework/img/userpage/product/pz-detail.png'); background-position: center;}
.pzd-title {margin-bottom: 17rem;}

.pz-num {font-size: 8rem; color: #E1E1E1; font-weight: bold;}
.pzd-item {margin-bottom: 12.8rem;}
.pzd-item:last-child {margin-bottom: 0;}

.pz-recipe {padding: 10.7rem 0 15.9rem;}
.pzr-item {position: relative; border-radius: 7px; background-position: center; background-repeat: no-repeat; background-size: cover; overflow: hidden;}
.pzr-item:after {content: ''; display: block; padding-bottom: 80.34%;}
.pzr-item a {position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding: 3rem 4rem; display: flex; align-items: end; background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 57.03%, #000 100%);}
.pzr-item a span {font-size: 2rem; color: #FFFFFF;}

.bvt-left {background-color: #000000; position: relative; box-shadow: 5px 7px 15px rgba(0, 0, 0, 0.25); background-repeat: no-repeat; background-position: center; background-size: cover;}
.bvt-right {background-color: #036EB8; position: relative;}
.bvt-right div {padding: 6rem 4rem;}
.bvt-left:after {content: ''; display: block; padding-bottom: 56.32%;}
.bvt-right h4 {text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;}

.bvt-list .slick-dots {bottom: -7.7rem; left: 50%; transform: translateX(-50%); top: auto;}
.bvt-list .slick-dots li {width: 20px; height: 20px;}
.bvt-list .slick-dots li button {width: 20px; height: 20px;}
.bvt-list .slick-dots li button:before {width: 20px; height: 20px; border: 1px solid #C0C0C0; background-color: #FFFFFF;}
.bvt-list .slick-dots li.slick-active button:before {background-color: #036EB8; width: 20px; border: 1px solid #036EB8;}
.bvt-type {padding-bottom: 7px; position: relative; display: table;}
.bvt-type:after {content: ''; display: block; width: 100%; height: 2px; background-color: #FFFFFF; position: absolute; bottom: 0px; left: 0;}
.btn.bvt-btn {padding: 1.4rem 3.2rem; color: #FFFFFF; font-size: 2rem; border: 1px solid #FFFFFF; border-radius: 430px; display: flex; align-items: center; justify-content: space-between; max-width: 23.2rem;}

.bn-zone {border-top: 4px solid #F5F5F5; border-bottom: 4px solid #F5F5F5;}
.bn-item {border-bottom: 1px solid #ADADAD; display: flex; align-items: center; position: relative; flex-wrap: wrap;}
.bn-item:last-child {border-bottom: 0;}
.bn-item > a {position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 2;}
.bn-img > div {position: relative; background-size: cover; background-repeat: no-repeat; background-position: center; background-color: #F7F7F7;}
.bn-img > div:after {content: ''; display: block; padding-bottom: 50.34%;}

.bn-info {display: flex; }
.bn-info li {font-size: 1.6rem; color: #ADADAD; position: relative; line-height: 1; padding-right: 1.3rem; margin-right: 1.3rem;}
.bn-info li:first-child {color: #036EB8;}
.bn-info li:after {content: ''; display: block; width: 1px; height: 100%; background-color: #ADADAD; position: absolute; top: 0; right: 0;}
.bn-info li:last-child:after {display: none;}

.bn-txt {padding-right: 8rem;}
.bn-txt p {
	word-break: break-word;`
	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: 5.4rem;
	min-height: 5.4rem;
}

.con-title {padding-bottom: 6rem; margin-bottom: 6rem; border-bottom: 1px solid #777777;}
.con-icon {max-width: 30rem; position: relative; border-radius: 100%; background-color: #F5F5F5;}
.con-icon:after {content: ''; display: block; padding-bottom: 100%;}
.con-icon > img {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); max-width: 80%;}

.consulting-check input {display: none;}
.consulting-check label {
	font-size: 1.8rem; color: #CFCFCF; border: 1px solid #CFCFCF; border-radius: 4px; padding: 1rem 1.6rem 1.4rem 5.7rem; margin-bottom: 0;
	background-image: url('/css/egovframework/img/userpage/consulting/check.svg'); background-repeat: no-repeat; background-position: left+1.5rem center;
	background-size: 3.4rem;
}
.consulting-check input[type=radio]:checked + label {color: #036EB8; background-image: url('/css/egovframework/img/userpage/consulting/check-on.svg'); border-color: #036EB8;}
