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

html {overflow-x: hidden;}

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


@font-face {
  font-family: 'Pretendard-Regular';
  src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff') format('woff');
  font-weight: 400;
  font-style: normal;
}

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

h5.title {font-size: 2rem !important;}
h4.title {font-size: 3rem !important;}

h2.title {font-size: 4rem !important;}
h1.title {font-size: 4.5rem !important;}

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


.ptitle {font-size: 2.5rem;}

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

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

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

.co666 {color: #666666 !important;}
.co000 {color: #000000 !important;}
.cofff {color: #FFFFFF !important;}
.co7741 {color: #A87741 !important;}
.co1741 {color: #CE1741 !important;}
.co6941 {color: #936941 !important;}
.co2C27 {color: #942C27 !important;}
.coA589 {color: #BEA589 !important;}
.co9999 {color: #999999 !important;}
.co3f20 {color: #003F20 !important;}

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

.line2 {line-height: 2;}
.line1-5 {line-height: 1.5;}

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

.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 6rem;}
.btn.btn-s {font-size: 1.6rem; padding: 7px 2.3rem;}

.btn.bk-57 {background-color: #EC7357; color: #FFFFFF; border: 1px solid #EC7357;}
.btn.bk-ff {background-color: #FFFFFF; color: #EC7357; border: 1px solid #EC7357;}
.btn.bk-27 {background-color: #942C27; color: #FFFFFF; border: 1px solid #942C27;}

#header {position: absolute; width: 100%; left: 0; z-index: 100; background: transparent; top: 0;}

.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: #942C27; padding: 10px 20px;}

#header.active {background: #FFFFFF;}

#header .header-mobile .hm-menu > li {padding: 0; text-align: left; border-bottom: 1px solid #DBDBDB;}
#header .header-mobile .hm-menu > li.realgin {border-bottom: 0;}
#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; background: #FFFFFF;}
#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;}

.language-select {
	background-color: transparent;
  	border: 0px;
  	border-radius: 32px;
  	color: #000000;
  	font-size: 1.6rem;
  	padding: 6px 4.4rem 6px 5rem;
  	-o-appearance: none;
  	-webkit-appearance: none;
  	-moz-appearance: none;
  	appearance: none;
  	background-image: url('/css/egovframework/img/userpage/language-arrow.svg'), url('/css/egovframework/img/userpage/language.svg');
  	background-repeat: no-repeat;
  	background-position: right+2.2rem center, left+2.2rem center;
}
.mheader .language-select {color: #FFFFFF; background-image: url('/css/egovframework/img/userpage/language-arrow2.svg'), url('/css/egovframework/img/userpage/language2.svg'); background-position: right+2.2rem center, left center; font-size: 15px;}
.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;}
.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.realgin img {max-width: 8rem;}
.header-menu > li > a {font-size: 2rem; font-weight: bold; display: block; position: relative; transition: all 0.1s; color: #000000;}
.header-menu > li.on:not(.realgin) > a:after {content: ''; display: block; width: 0; animation: widthUp 0.5s forwards 0s; height: 3px; background-color: #942C27; position: absolute; bottom: -3px; left: 2.5rem; border-radius: 24px;}
.header-menu > li.realgin a {height: 100%; display: flex; align-items: center; justify-content: center;}
.header-sub-menu {position: absolute; width: 100%; display: none; padding-top: 2rem;}
.active .header-sub-menu {display: block;}
.header-sub-menu li a {font-size: 2rem; font-weight: 500; display: block; padding: 1rem 0; text-align: center; color: #000000; transition: all 0.5s;}
.us .header-sub-menu li a {font-size: 1.7rem;}
.header-sub-menu li a:hover {color: #942C27; font-weight: 600;}

@keyframes widthUp {  
    0% {width: 0;}  
    100% {width: calc(100% - 5rem);}
} 

.header-sub-back {position: absolute; width: 100%; background: #FFFFFF; height: 28.8rem; display: none; border-top: 3px solid #EDEDED;}
.vn .header-sub-back {height: 33.8rem;}
.active .header-sub-back {display: block;}

#footer {background-color: #B7977A;}

.footer-info {position: relative;}
.ft-company h5 {font-size: 2.3rem;}
.ft-company li {font-size: 1.5rem; color: #FFFFFF;}
.ft-phone h5 {font-size: 1.4rem; color: #FFFFFF;}
.ft-phone h5 span {font-size: 2.5rem;}
.ft-time li {font-size: 1.4rem; color: #FFFFFF;}
.ft-page li {margin-right: 5px; width: 10.5rem; border: 1px solid #FFFFFF; border-radius: 10px;} 
.ft-page li a {display: inline-block; width: 10rem; padding: 6px 0; font-size: 1.4rem; text-align: center;}

.ft-qr li {border-radius: 50% 50% 0 0; background-color: #F5F0E1; padding: 36px 1.8rem 0.5rem; margin-right: 1.9rem; background-repeat: no-repeat;}
.ft-qr li:nth-child(1) {background-image: url('/css/egovframework/img/userpage/ft-qricon1.svg'); background-position: center top+8px;}
.ft-qr li:nth-child(2) {background-image: url('/css/egovframework/img/userpage/ft-qricon2.svg'); background-position: center top+10px;}
.qr-zone {width: 100%; position: relative;}

.footer-right {padding: 2.3rem 0; border-top: 1px solid rgba(255,255,255,0.2);}
.footer-right p {font-size: 1.5rem;}

#content {padding-bottom: 100px;}
/*공통*/

/*게시판*/
.bdsearch {margin-bottom: 2rem;}
.bdsearch .total {font-size: 1.8rem; font-weight: 600; margin-bottom: 0;}
.bdsearch select {font-size: 1.8rem; padding: 12px; border: 1px solid #DDDDDD; width: 100%; max-width: 120px; margin-right: 8px;}
.bdsearch input {font-size: 1.8rem; padding: 10px; border: 1px solid #DDDDDD; width: 100%; max-width: 311px; margin-right: 8px; padding-right: 6rem;}
.bdsearch button {background: none; border: 0px; position: absolute; top: 50%; transform: translateY(-50%); right: 1.5rem;}
.bdsearch button img {max-width: 3.4rem;}
.bdsearch input:focus {outline: none;}

.bdgallery > div {margin-bottom: 5rem;}
.bdgallery .bdthumb {width: 100%; background-size: cover; background-repeat: no-repeat; background-position: center; margin-bottom: 1rem; border-radius: 20px; background-color: #D9D9D9;}
.bdgallery .bdthumb:after {content: ''; display: block; padding-bottom: 65.8%;}
.bdgallery .bdthumb a {position: absolute; width: 100%; height: 100%; top: 0; left: 0; display: flex; align-items: center; justify-content: center;}
.bdgallery .bdinfo h5 {font-size: 1.8rem; font-weight: 500; flex: none;}
.bdgallery .bdinfo span {font-size: 1.8rem; color: #C7C9CB;}

.bdtable {border-top: 4px solid #0068B6;}
.bdtable th, .bdtable td {font-size: 17px; padding-top: 2.2rem; padding-bottom: 2.2rem; 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: #F5F5F5; }

.bdgoods > div {margin-bottom: 6rem;}
.bdgoods .bdthumb {width: 100%; background-size: cover; margin-bottom: 1rem; border-radius: 20px; overflow: hidden; position: relative;}
.bdgoods .bdthumb:after {content: ''; display: block; padding-bottom: 100%;}
.bdgoods .bdthumb img {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); transition: all 0.5s; /*max-width: 100%;*/ max-height: 100%; min-height: 100%;}
.bdgoods .bdthumb:hover img {transform: translate(-50%,-50%) scale(1.1);}
.bdgoods .bdthumb a {position: absolute; width: 100%; height: 100%; top: 0; left: 0;}
.bdgoods h5 {word-break: break-word;}

.bdconsulting {width: 1200px; margin: 0 auto; max-width: 100%;}
.input-table tr th {background: #F9F9F9; padding: 1.8rem 0; font-size: 1.8rem; border-bottom: 1px solid #EBEBEB; border-left: 1px solid #EBEBEB; border-right: 1px solid #EBEBEB;}
.input-table tr:first-child th {border-top: 1px solid #EBEBEB; border-radius: 8px 8px 0 0;}
.input-table tr:last-child th {border-radius: 0 0 8px 8px;}
.input-table td {padding: 8px 1.4rem; font-size: 1.8rem;}
.input-table td input, .input-table td textarea {background: #FFFFFF; border: 1px solid #EBEBEB; font-size: 1.6rem; padding: 1.2rem; width: 100%; max-width: 100%; border-radius: 8px;}
.input-table td select {
	width: 100%; max-width: 100%; 
	background-color: #FFFFFF;
  	border: 1px solid #EBEBEB;
  	border-radius: 8px;
  	color: #000000;
  	font-size: 1.6rem;
  	padding: 1.2rem;
  	-o-appearance: none;
  	-webkit-appearance: none;
  	-moz-appearance: none;
  	appearance: none;
  	background-image: url('/css/egovframework/img/userpage/select-arrow2.png');
  	background-repeat: no-repeat;
  	background-position: right+1.2rem center;
}
.input-table td select::option {padding: 1.2rem 5px;}
.toast-message {font-size: 1.7rem;}

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

.consulting-check input {display: none;}
.consulting-check label {
	font-size: 1.8rem; color: #CFCFCF; border: 1px solid #CFCFCF; border-radius: 4px; padding: 1.4rem 2rem 1.4rem 5.2rem; margin-bottom: 0;
	background-image: url('/css/egovframework/img/userpage/customer/check.svg'); background-repeat: no-repeat; background-position: left+1.4rem center;
	background-size: 2.7rem;
}
.consulting-check input[type=radio]:checked + label {color: #B7977A; background-image: url('/css/egovframework/img/userpage/customer/check-on.svg'); border-color: #B7977A;}

.pagination li {width: 4rem; height: 4rem; display: flex; justify-content: center; align-items: center; margin: 0 8px; background: #F5F5F5; border: 1px solid #EEEEEE; border-radius: 4px;}
.pagination li a {font-size: 1.6rem; color: #404B52 !important; display: flex;}
.pagination li.active {background: #942C27;}
.pagination li.active a {color: #FFFFFF !important; font-weight: bold;}

.bdmenu {background: #F8F8F8;}
.bdmenu h5 {font-size: 2.2rem; font-weight: 500; flex: 0 0 calc(100% - 9.5rem); max-width: calc(100% - 9.5rem); word-break: break-all; text-align: center;}
.bddetail {border-top: 4px solid #0068B6;}
.bddetail th, .bddetail td {padding: 2rem; border-bottom: 1px solid #C1C1C1;}
.bddetail h5 {font-size: 23px; font-weight: 500;}
.bdd-info li {font-size: 17px; 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.8rem; padding-top: 8rem;}
.bdcontent video {max-width: 100%;}
.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: 17px;}
/*게시판*/

.ms-item {overflow: hidden;}
.ms-child {background-repeat: no-repeat; background-size: cover; background-position: center; position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: -1;}
.slick-active .ms-child {animation: fadeUp 7s forwards; animation-delay: 1s;}
.ms-video video {position: absolute; width: 100%; height: 100%; object-fit: fill; top: 0; left: 0;}
.ms-txt {padding-top: 25.8rem; }
.ms-item h2 {color: #942C27; position: relative; opacity: 0;}
.ms-item h2 span.stress {color: #A87741; display: inline-block; position: relative;}
.ms-item h2 span.stress:after {width: 100%; height: 4px; content: ''; display: block; position: absolute; left: 0; bottom: -4px; background: #A87741;}

.slick-active .ms-txt h2:nth-child(1) {animation: showUp 1s forwards 1s;}
.slick-active .ms-txt h2:nth-child(2) {animation: showUp 1s forwards 2s;}

.ms-slider .slick-dots {bottom: 29rem; left: 50%; transform: translateX(-50%); top: auto;}
.ms-slider .slick-dots li, .ms-slider .slick-dots li button {width: 12px; height: 12px;}
.ms-slider .slick-dots li.slick-active, .ms-slider .slick-dots li.slick-active button {width: 2.1rem; height: 2.1rem;}
.ms-slider .slick-dots li button:before {width: 12px; height: 12px; background: #FFFFFF; border: 1px solid #BFBFBF;}
.ms-slider .slick-dots li.slick-active button:before {width: 2.1rem; height: 2.1rem; background: #A87741; border: 1px solid #A87741;}

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

@keyframes showUp {
	from {opacity: 0; top: 10px}
	to {opacity: 1; top: 0;}
} 

.section2 {padding: 46rem 0 14.1rem; background: #FAF7F0;}
.mq-slider .slick-slide {padding: 1.7rem;}
.mq-slider .slick-dots {top: auto; bottom: 0; left: 50%; transform: translateX(-50%);}
.mq-slider .slick-dots li button:before {border: 1px solid #A87741; }
.mq-slider .slick-dots li.slick-active button:before {background: #A87741;}
.mq-zone {position: absolute; width: 100%; top: -62rem; left: 0;}
.mq-item {max-width: 44.3rem; margin: 0 auto; box-shadow: 0px 0px 17px rgba(0, 0, 0, 0.20); border: 1px solid #D9D9D9; border-radius: 15px; overflow: hidden;}
.mq-img {background-repeat: no-repeat; background-position: center; background-size: cover; position: relative; background-color: #F4F4F4;}
.mq-img:after {content: ''; display: block; padding-bottom: 55%;}
.mq-icon {width: 96px; height: 96px; border-radius: 50%; background: #FCFCFC; position: absolute; left: 50%; transform: translateX(-50%); bottom: -48px; display: flex; align-items: center; justify-content: center; border: 1px solid #D9D9D9;}
.mq-icon img {width: auto; height: auto;}
.mq-txt {padding: 7.7rem 0 6.5rem 0; background-color: #FFFFFF;}

.mq-shop {position: absolute; display: flex; right: -14rem; top: 50%; transform: translateY(-50%);align-items: center;}
.mq-shop a {width: 13rem; height: 13rem; background: #F26522; border-radius: 50%; padding-left: calc(40% - 23px); display: flex; align-items: center; justify-content: center; transition: all 0.5s;}
.mq-shop a:hover {background: #942C27;}
.mq-shop span {font-size: 1.6rem; color: #8C8C8C; padding-left: 1rem;}

.mp-txt h4 {letter-spacing: -1.5px;}

.btn.btn-all {font-size: 1.8rem; color: #FFFFFF; font-weight: 600; padding: 1.1rem 2.7rem; background: #B7977A; border-radius: 10px; transition: all 0.5s;}
.btn.btn-all:hover {background: #942C27;}
.btn.btn-shop {padding-left: 8rem; padding-right: 8rem;}

.section3 {padding: 8.4rem 0 46rem 0; background-image: url('/css/egovframework/img/userpage/main/section3-back.png'); background-repeat: no-repeat; background-size: 100% 52.7rem; background-position: top center;}
.mp1-slider .slick-slide {padding: 0 0.9rem;}
.mp1-slider .slick-dots {top: auto; bottom: -5rem; left: 50%; transform: translateX(-50%); display: flex; align-items: center;}
.mp1-slider .slick-dots li, .ms-slider .slick-dots li button {width: 12px; height: 12px;}
.mp1-slider .slick-dots li.slick-active, .ms-slider .slick-dots li.slick-active button {width: 2.1rem; height: 2.1rem;}
.mp1-slider .slick-dots li button:before {width: 12px; height: 12px; background: #DED2C4; border: 1px solid #DED2C4;}
.mp1-slider .slick-dots li.slick-active button:before {width: 2.1rem; height: 2.1rem; background: #BEA589; border: 1px solid #BEA589;}

.mp1-zone {position: absolute; width: 100%; left: 0; bottom: -41rem;}
.mp1-item {position: relative; max-width: 33.5rem; margin: 0 auto; border-radius: 10px;}
.mp1-item:after {content: ''; display: block; padding-bottom: 100%;}
.mp1-img {position: absolute; width: 100%; height: 100%; border-radius: 10px; overflow: hidden;}
.mp1-img:hover:after {content: ''; display: block; width: 100%; height: 100%; left: 0; top: 0; position: absolute; border-bottom: 5px solid #AD3732;}
.mp1-img > span {position: absolute; width: 100%; height: 100%; left: 0; top: 0; background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,254,0) 50%, #F6E1E1 100%); }
.mp1-img > img {min-height: 100%; min-width: 100%; width: auto; height: auto; filter: blur(0px); transition: all 0.5s;}
.mp1-img:hover > img {filter: blur(5px);}
.mp1-img a {width: 100%; height: 100%; top: 0; left: 0; opacity: 0; transition: all 0.5s; z-index: 1;}
.mp1-img:hover a {opacity: 1;}
.mp1-item h5 {position: absolute; width: 100%; left: 0; bottom: 2rem; color: #533315; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; padding: 0 1rem;}

.section4 {padding: 4.4rem 0 8.4rem;}
.mp2-slider .slick-slide {padding: 3rem 0 8rem;}
.mp2-slider .slick-dots {top: auto; bottom: 8rem; left: 21%; display: flex; align-items: center;}
.mp2-slider .slick-dots li, .ms-slider .slick-dots li button {width: 12px; height: 12px;}
.mp2-slider .slick-dots li.slick-active, .ms-slider .slick-dots li.slick-active button {width: 2.1rem; height: 2.1rem;}
.mp2-slider .slick-dots li button:before {width: 12px; height: 12px; background: #DED2C4; border: 1px solid #DED2C4;}
.mp2-slider .slick-dots li.slick-active button:before {width: 2.1rem; height: 2.1rem; background: #BEA589; border: 1px solid #BEA589;}

.mp2-text {padding-top: 3rem;}
.mp2-text h5 {font-size: 2rem; display: inline-block; padding: 6px 13px; border: 1px solid #942C27; color: #942C27; position: relative; background: #FFFFFF; z-index: 2;}
.mp2-text h5 span {position: relative; z-index: 2;}
.mp2-text h5:before { content: ''; display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0px; background: #FFFFFF;}
.mp2-text h5:after {
	content: ''; display: block; width: 100%; height: 100%; border: 1px solid #A87741; position: absolute; top: 10px; left: 10px; z-index: -1;
}
.mp2-text ul li {font-size: 2rem; margin-bottom: 1.5rem;}
.mp2-text ul li:last-child {margin-bottom: 0;}

.mp2-ichild {position: relative; background-color: #FFFFFF; border-radius: 20px; padding: 2.5rem; border: 1px solid #D9D9D9; box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.20);}
.mp2-ichild:after {content: ''; display: block; padding-bottom: 100%;}
.mp2-iimg1 {position: absolute; width: calc(100% - 5rem); height: calc(100% - 5rem); overflow: hidden; top: 50%; left: 50%; transform: translate(-50%, -50%); border-radius: 20px; overflow: hidden;}
.mp2-iimg1 img {min-height: 100%; min-width: 100%; width: auto; height: auto;}

.mp2-isub {position: absolute; width: 28.5rem; max-width: 28.5rem; border-radius: 10px; background-repeat: no-repeat; background-position: center; background-size: cover; right: 5px; bottom: 0rem;}
.mp2-isub:after {content: ''; display: block; padding-bottom: 100%;}

.mp2-back {position: absolute; transform: translate(-50%, 50%); width: auto !important; height: auto !important;}
.mp2-back1 {left: -100%; bottom: 23%; transition: all 0.5s; max-width: 44% !important;}
.mp2-back2 {right: -100%; top: -28%; max-width: 56% !important;}
.mp2-flower {right: 0%; top: 25%; animation: rotate_image 5s linear infinite; transform: translate(-50%,-50%) rotate(-0); max-width: 15% !important;}

.slick-active .mp2-back1 {animation: animation-mp2-back1 1s forwards 1s;}
.slick-active .mp2-back2 {animation: animation-mp2-back2 1s forwards 1s;}

@keyframes rotate_image{
	100% {
    	transform: translate(-50%,-50%) rotate(-360deg);
    }
}

@keyframes animation-mp2-back1{
	100% {
    	left: 16%;
    }
}

@keyframes animation-mp2-back2{
	100% {
    	right: -28%;
    }
}

.section5 {padding: 10rem 0 13.4rem; background-repeat: no-repeat; background-position: center; background-repeat: no-repeat; background-size: 100% auto; background-image: url('/css/egovframework/img/userpage/main/section4-back.png')}
.mc-item {max-width: 260px; position: relative; background: #FFFFFF; border: 1px solid #C7C7C7; padding: 2rem; margin: 0 auto;}
.mc-item:after {content: ''; display: block; padding-bottom: 134.2%;}
.mc-item img {position: absolute; max-width: 100%; max-height: 100%; top: 50%; left: 50%; transform: translate(-50%, -50%);}

.section6 {padding: 7.6rem 0;}
.mi-item {width: 100%; position: relative; background-size: cover; background-repeat: no-repeat; background-position: center; background-color: #F2F2F2;}
.mi-item:after {content: ''; display: block; padding-bottom: 100%;}
.mi-item > a {top: 0; left: 0; display: flex; align-items: center; justify-content: center; background-color: rgba(0,0,0,0.5); opacity: 0; transition: all 0.5s;}
.mi-item:hover > a {opacity: 1;}
.mi-item > a img {width: auto; height: auto;}

@keyframes scaleUp {
	from {transform: scale(1);}
	to {transform: scale(1.1);}
} 

.page-top {padding: 15.1rem 0 18.3rem; margin-bottom: 6rem; overflow: hidden;}
.page-child {background-repeat: no-repeat; background-position: center; background-size: cover; position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: -1; animation: scaleUp 2s forwards 0s; transform: scale(1)}
.page-top h1 {font-size: 5rem;}
.pagebread li {margin-right: 20px; padding-right: 20px; position: relative;}
.pagebread li:last-child {margin-right: 0; padding-right: 0;}
.pagebread li:after {
	content: url('/css/egovframework/img/userpage/top-arrow.png'); display: block; position: absolute; right: -10px; top: 58%; transform: translateY(-50%);
}
.pagebread li:last-child:after {display: none;}
.pagebread li a {font-size: 1.8rem; color: #FFFFFF; display: flex; align-items: center; font-weight: 500;}
.pagebread li:first-child a {color: #A87741; font-weight: bold;}

.page-menu li a {font-size: 1.8rem; color: #777777; display: block; padding: 0 5.8rem; position: relative; line-height: 1; text-align: center;}
.page-menu li.on a {color: #942C27; font-weight: bold;}
.page-menu li a:after {content: ''; display: block; width: 1px; height: 100%; position: absolute; right: 0; top: 0; background: #D9D9D9;}
.page-menu li:last-child a:after {display: none;}

.ip-img {position: relative; border-radius: 20px; background-repeat: no-repeat; background-position: center; background-size: cover;}
.ip-img:after {content: ''; display: block; padding-bottom: 61.9%;}

.iv-zone {padding: 14rem 0; background-color: #F9F7EF; background-position: center bottom; background-repeat: no-repeat; background-size: 100% auto; background-image: url('/css/egovframework/img/userpage/introduce/iv-back.png')}
.iv-item {background: #FFFFFF; border: 1px solid #D9D9D9; border-radius: 20px; position: relative; box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.15);}
.iv-item:after {content: ''; display: block;}
.iv-parent {position: absolute; width: 100%; height: 100%; top: 0; left: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 0 2rem;}
.iv-img {width: 9rem; height: 9rem; display: flex; align-items: center; justify-content: center;}
.ig-parent {padding-top: 12rem;}
.ig-child {background-color:  #F9F7EF; margin-right: 0; margin-left: auto; padding-top: 6rem; padding-bottom: 14rem; background-position: center bottom; background-repeat: no-repeat; background-size: 100% auto; background-image: url('/css/egovframework/img/userpage/introduce/ig-back.png')}

.ih-item {position: relative;}
.ih-year {font-size: 4.5rem; font-weight: bold; padding-right: 9rem; margin-bottom: 0; position: relative;}
.ih-content {padding-top: 1.5rem; position: relative;}
.ih-content li {position: relative; padding-left: 10px; font-size: 1.8rem; font-weight: 300; color: #666666;}
.ih-content li:after {content: '-'; position: absolute; left: 0; top: 2px;}

.ic-item {max-width: 26rem; margin: 0 auto 3rem auto; position: relative; border: 1px solid #D9D9D9; overflow: hidden; display: flex; align-items: center; justify-content: center;}
.ic-item:after {content: ''; display: block; padding-bottom: 134.6%;}
.ic-item > img {max-width: 100%; max-height: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);}

.brand-img {position: relative; background-size: cover; background-repeat: no-repeat; background-position: center; background-image: url('/css/egovframework/img/userpage/brand/brand-img.png'); background-size: cover; border-radius: 20px; overflow: hidden;}
.brand-img:after {content: ''; display: block; padding-bottom: 27%;}
.bb-zone {padding: 12rem 0 19.9rem; background-color: #F9F7EF; background-position: left bottom; background-repeat: no-repeat; background-size: 100% auto; background-image: url('/css/egovframework/img/userpage/brand/bb-back.png')}
.bb-item {position: relative; background: #FFFFFF; border-radius: 10px; box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.15); overflow: hidden;}
.bb-item:after {content: ''; display: block;}
.bb-parent {position: absolute; width: 100%; height: 100%; top: 0; left: 0; padding: 13px;}
.bb-img {width: 100%; position: relative; background-size: cover; background-repeat: no-repeat; background-position: center; border: 10px; overflow: hidden; margin-bottom: 2.5rem;}
.bb-img:after {content: ''; display: block; padding-bottom: 68.3%;}

.pd-info {grid-template-columns: 55% 45%; padding-bottom: 9rem; border-bottom: 1px solid #D9D9D9;}
.pd-desc {padding: 3rem; background: #F9F9F9; border-radius: 20px; min-height: 23.7rem;}
.gd-img {grid-template-columns: 80.1% 18.2%; column-gap: 10px; justify-content: center; width: 100%; max-width: 609px; margin: auto;}

.gd-item {position: relative; width: 48.8rem; max-width: 100%; border-radius: 20px; overflow: hidden; margin: 0 auto;}
.gd-item:after {content: ''; display: block; padding-bottom: 100%;}
.gd-item img {max-width: 100%; max-height: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.gdi-item {position: relative; max-width: 10.9rem; min-height: 10.9rem; border-radius: 20px; overflow: hidden;}
.gdi-item img {max-width: 100%; max-height: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.gdi-slider .slick-slide {padding-bottom: 14px;}

.gd-content {padding-top: 8rem;}
.gd-content img {max-width: 100%; height: auto;}

#goTop {position: fixed; bottom:10rem; right: 10rem; opacity: 0; transition: all 0.5s;}
#goTop.on {opacity: 1;}