@charset "utf-8";

:root {
	--box-shadow3: 0 0 2px 0 var(--color-alpha-shadow2, rgba(0, 0, 0, 0.08)), 0 var(--shadow-y-3, 8px) var(--shadow-blur-3, 16px) 0 var(--color-alpha-shadow3, rgba(0, 0, 0, 0.12));
	--flowchart-width: 30rem;
}

.sfont {
	font-size: 1.4rem;
	color: #444;
}

.img-sz640 {
	max-width: 64rem;
}
.img-sz810 {
	max-width: 81rem;
}
.img-sz930 {
	max-width: 93rem;
}

.bd-imgbox {
	text-align: center;
	border: 0.1rem solid #ccc;
}

.tb-unit {
	margin-bottom: 0.3rem;
}
.tb-unit + .table-wrap {
	margin-top: 0;
}
.m_t60 {
	margin-top: 6rem;
}
.map-box {
	width: 100%;
	height: 45rem;
	border-radius: 1rem;
	background: #f5f5f5;
	overflow: hidden;
}

.bl03 + .map-box {
	margin-left: 2.4rem;
	margin-top: 1rem;
	height: 40rem;
	width: calc(100% - 2.4rem);
}

@media (max-width: 767px) {
	.map-box {
		height: 30rem;
	}
}

.detail_iframe {
	width: 100%;
	height: 1200px;
	margin-top: 2.8rem;
	border: 0;
}

/* 홈페이지 바로가기 */
.outlink {
	margin-top: 4rem;
}
.outlink .imgbox {
	max-width: 64rem;
	aspect-ratio: 1/0.66;
	padding-top: 3rem;
	margin: 0 auto;
	background: url(../img/contents/pic_homepage_godeco01.jpg) no-repeat top center/100%;
	border-radius: 0.8rem;
	border: 0.1rem solid rgba(0, 0, 0, 0.06);
	box-shadow:
		0 0 0.2rem 0 var(--krds-light-color-alpha-shadow1),
		0 0.4rem 0.8rem 0 var(--krds-light-color-alpha-shadow2);
	overflow: hidden;
}
.outlink .btn-wrap {
	margin-top: 3rem;
}
.flex-con .outlink {
	margin-top: 0;
}
.flex-con .outlink .btn-wrap {
	width: auto;
}
.flex-con .outlink .btn-wrap .btn {
	flex: 0 0 auto;
}
@media all and (max-width: 767px) {
	.flex-con:has(.outlink) {
		gap: 4rem;
	}
}

/* 민원 상담 */
.counsel-box {
	display: flex;
	gap: 4rem;
}
.counsel-box > div {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 2rem;
	flex: 1;
	min-width: 0;
	border-radius: 0.8rem;
	padding: 5rem;
	text-align: center;
	border: 1px solid rgba(74, 57, 147, 0.4);
	background:
		url(../img/contents/ico_gh_symbol.svg) no-repeat right bottom,
		linear-gradient(180deg, rgba(74, 57, 147, 0) 0%, rgba(74, 57, 147, 0.1) 100%);
}
.counsel-box > div:hover {
	border-color: var(--sub-point);
	box-shadow: 0 0 0 0.2rem var(--sub-point) inset;
}
.counsel-box > div .tit {
	display: block;
	margin-bottom: 2rem;
	padding-top: 13rem;
	font-size: 2.4rem;
	font-weight: 400;
	font-family: var(--ft-family-one);
	background-repeat: no-repeat;
	background-position: center top;
}
.counsel-box > div.online .tit {
	background-image: url(../img/contents/ico_counsel01.svg);
}
.counsel-box > div.sign .tit {
	background-image: url(../img/contents/ico_counsel02.svg);
}
.counsel-box .bl-list {
	align-items: center;
	text-align: left;
}

/* 폐업신고 원스톱절차 */
.onestop-step {
	display: flex;
	text-align: center;
	margin-top: 1.6rem;
}
.onestop-step > div {
	flex: 1;
	min-width: 0;
	background: #f8f8f8;
	border-radius: 0.8rem;
	padding: 3rem 3rem 4rem;
	border: 2px solid transparent;
}
.onestop-step > div .tit {
	margin-bottom: 2rem;
	padding: 1.2rem;
	font-size: 2rem;
	line-height: 1.5;
	text-align: center;
	font-weight: 600;
	color: #fff;
	border-radius: 0.8rem;
	background: var(--sub-gray);
}
.onestop-step > div .txt {
	font-size: 2rem;
	font-weight: 700;
	line-height: 1.5;
}
.onestop-step > div .txt strong {
	display: block;
	color: var(--sub-point);
}
.onestop-step > div .con {
	padding-top: 19.6rem;
	background-repeat: no-repeat;
	background-position: center top 1rem;
	background-size: 15rem;
}
.onestop-step > div.old .con {
	background-image: url(../img/contents/ico_onestop_old.svg);
}
.onestop-step > div.old .con .old-list {
	position: relative;
	display: flex;
}
.onestop-step > div.old .con .old-list:before {
	position: absolute;
	z-index: 1;
	left: 50%;
	top: -3.4rem;
	content: '';
	width: 1px;
	height: 1.7rem;
	background: #c3c3c3;
}
.onestop-step > div.old .con .old-list:after {
	position: absolute;
	z-index: 1;
	left: 50%;
	top: -1.7rem;
	content: '';
	width: 50%;
	height: 1px;
	background: #c3c3c3;
	transform: translateX(-50%);
}
.onestop-step > div.old .con .old-list li {
	position: relative;
	display: flex;
	gap: 0.6rem;
	flex-direction: column;
	align-items: center;
	flex: 1;
	min-width: 0;
}
.onestop-step > div.old .con .old-list li:before {
	display: block;
	content: '';
	width: 8rem;
	height: 8rem;
	margin-bottom: 1rem;
	border-radius: 50%;
	background: #fff url(../img/contents/ico_onestop_docu.svg) no-repeat center;
}
.onestop-step > div.old .con .old-list li:after {
	position: absolute;
	z-index: 1;
	left: 50%;
	top: -1.7rem;
	content: '';
	width: 1px;
	height: 1.7rem;
	background: #c3c3c3;
}
.onestop-step > div.old .con .old-list li i {
	display: inline-block;
	padding: 0.2rem 1.4rem;
	border-radius: 10rem;
	background: var(--sub-gray);
	color: #fff;
}
.onestop-step > div.cnt {
	background: var(--light-gra);
	border: 2px dashed var(--sub-point);
	box-shadow: var(--box-shadow3);
}
.onestop-step > div.cnt .tit {
	background: var(--sub-point);
}
.onestop-step > div.cnt .con {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.6rem;
	padding-top: 18rem;
	background-image: url(../img/contents/ico_onestop_cnt.svg);
}
.onestop-step > div.cnt .con:before {
	display: block;
	content: '';
	width: 8rem;
	height: 8rem;
	margin-bottom: 1rem;
	border-radius: 50%;
	background: #fff url(../img/contents/ico_onestop_docu.svg) no-repeat center;
}
.onestop-step > div.cnt .con p {
	font-weight: 600;
}
.onestop-step > div.cnt .con i {
	display: inline-block;
	padding: 0.2rem 1.4rem;
	border-radius: 10rem;
	background: var(--sub-point);
	color: #fff;
}
.onestop-step > div.cnt .con em {
	color: var(--krds-light-color-text-subtle);
}

/* 수산업 지원사업 */
.fish-tit {
	display: inline-block;
	width: 4.2rem;
	text-align: justify;
	text-align-last: justify;
}

/* 조직운영지표 */
.manage-wrap .manage-box {
	display: flex;
	align-items: flex-start;
	gap: 4rem;
	margin-top: 1rem;
}
.manage-wrap .manage-box .table-wrap {
	flex: 1;
	min-width: 0;
	margin-top: 0;
}
.manage-wrap .manage-box .graph-box {
	display: flex;
	position: relative;
	width: 40rem;
	padding-left: 4.3rem;
}
.manage-wrap .manage-box .graph-box ul.legend {
	position: absolute;
	display: flex;
	flex-direction: column-reverse;
	justify-content: space-between;
	left: 0;
	top: -0.85rem;
	width: 4rem;
	height: calc(100% + 1.5rem);
	padding-right: 1.3rem;
	font-size: 1.3rem;
	line-height: 1.5;
	text-align: right;
}
.manage-wrap .manage-box .graph-box > div {
	position: relative;
	display: flex;
	width: 100%;
	justify-content: space-evenly;
	background: url(../img/contents/bg_graph.svg) repeat-x left top;
	border-bottom: 1px solid #000;
	border-left: 1px solid #000;
}
.manage-wrap .manage-box .graph-box > div + div {
	border-left: 0;
}
.manage-wrap .manage-box .graph-box > div dl {
	position: relative;
}
.manage-wrap .manage-box .graph-box > div dl dt {
	position: absolute;
	top: calc(100% + 0.7rem);
	left: 50%;
	line-height: 1.38;
	letter-spacing: -1px;
	white-space: nowrap;
	text-align: center;
	transform: translateX(-50%);
}
.manage-wrap .manage-box .graph-box > div dl dd {
	width: 5.6rem;
	height: 15rem;
}
.manage-wrap .manage-box .graph-box > div dl p {
	position: absolute;
	z-index: 1;
	left: 0;
	bottom: 0;
	width: 100%;
	border-radius: 0.4rem 0.4rem 0 0;
	background: var(--sub-point) url(../img/contents/bg_graph_pp.svg) repeat center;
}
.manage-wrap .manage-box .graph-box > div dl:nth-child(2) p {
	background: #009eb0 url(../img/contents/bg_graph_mint.svg) repeat center;
}
.manage-wrap .manage-box .graph-box > div > p {
	position: absolute;
	z-index: 1;
	left: 50%;
	transform: translateX(-50%);
	font-size: 1.5rem;
	font-weight: 600;
	line-height: 1.38;
	padding: 0.2rem 1.4rem;
	border-radius: 10rem;
	color: #fff;
	background: #544f6b;
}

/* 강화군시설관리공단 */
.ghss-top {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 1rem;
	padding: 3.6rem;
	text-align: center;
	background: url(../img/contents/bg_ghss.png) no-repeat center top/cover;
	border-radius: 0.8rem;
}
.ghss-top i {
	display: block;
	width: 21rem;
}
.ghss-top .tit {
	display: block;
	width: 100%;
	max-width: 61.2rem;
	padding: 1.6rem 0 1.2rem;
}
.ghss-orga {
	--orga-width: 20rem;
	--orga-gap: 4rem;
	padding: 3.2rem 0 0 1rem;
}
.ghss-orga > li {
	display: flex;
	flex-direction: column;
	gap: 5rem;
	align-items: center;
}
.ghss-orga .tit {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	max-width: var(--orga-width);
	height: 6.4rem;
	border-radius: 50rem;
	font-weight: 600;
	color: #fff;
}
.ghss-orga .rank01 {
	font-size: 2rem;
	background: var(--gra);
}
.ghss-orga .rank02 {
	position: relative;
	display: flex;
	width: 100%;
	max-width: 81.6rem;
	justify-content: space-between;
}
.ghss-orga .rank02:before {
	position: absolute;
	z-index: 1;
	left: 50%;
	top: -5rem;
	content: '';
	width: 1px;
	height: calc(100% + 10rem);
	border-left: 1px dashed rgba(74, 57, 147, 0.5);
}
.ghss-orga .rank02:after {
	position: absolute;
	z-index: 0;
	left: 0;
	top: 50%;
	content: '';
	width: 100%;
	height: 1px;
	border-top: 1px dashed rgba(74, 57, 147, 0.5);
}
.ghss-orga .rank02 > li {
	position: relative;
	z-index: 1;
	font-size: 1.8rem;
	background: var(--sub-point);
}
.ghss-orga .rank03 {
	position: relative;
	display: flex;
	justify-content: center;
	width: 100%;
	gap: var(--orga-gap);
}
.ghss-orga .rank03:before {
	position: absolute;
	z-index: 0;
	left: 50%;
	top: 0;
	content: '';
	width: calc(var(--orga-width) * 3 + var(--orga-gap) * 3);
	height: 1px;
	border-top: 1px dashed rgba(74, 57, 147, 0.5);
	transform: translateX(-50%);
}
.ghss-orga .rank03 > li {
	position: relative;
	width: 100%;
	max-width: var(--orga-width);
	margin-top: 1.6rem;
}
.ghss-orga .rank03 > li:before {
	position: absolute;
	z-index: 1;
	left: 50%;
	top: -1.6rem;
	content: '';
	width: 1px;
	height: 1.6rem;
	border-left: 1px dashed rgba(74, 57, 147, 0.5);
}
.ghss-orga .rank03 .tit {
	font-size: 1.8rem;
	color: var(--sub-point);
	border: 1px solid var(--sub-point);
}
.ghss-orga .rank03 ul {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	margin-top: 0.6rem;
	padding: 2rem 1.6rem;
	border-radius: 2rem;
	background: var(--sub-point-light);
	font-size: 1.7rem;
	line-height: 1.5;
}
.ghss-orga .rank03 ul li {
	position: relative;
	padding-left: 9px;
}
.ghss-orga .rank03 ul li:before {
	position: absolute;
	left: 0;
	top: 1.1rem;
	content: '';
	width: 3px;
	height: 3px;
	border-radius: 50%;
	background: #787878;
}

/* 비전 2030 */
.vision {
	text-align: center;
}
.vision ul {
	display: flex;
	flex-wrap: wrap;
	margin-top: 1.2rem;
	gap: 2rem;
	text-align: left;
}
.vision ul li {
	display: flex;
	gap: 1rem;
	align-items: center;
	flex: 1 1 calc(50% - 1rem);
	padding: 3rem 2rem;
	min-width: 0;
	border-radius: 0.8rem;
	box-shadow: 0.2rem 0.2rem 0.8rem 0 rgba(0, 0, 0, 0.11);
}
.vision ul li:before {
	display: block;
	flex-shrink: 0;
	content: '';
	width: 10rem;
	height: 10rem;
	border-radius: 50%;
	background-size: 100%;
	background-repeat: no-repeat;
}
.vision ul li.culture:before {
	background-image: url(../img/contents/ico_vision_ct.svg);
}
.vision ul li.life:before {
	background-image: url(../img/contents/ico_vision_life.svg);
}
.vision ul li.traffic:before {
	background-image: url(../img/contents/ico_vision_tf.svg);
}
.vision ul li.economy:before {
	background-image: url(../img/contents/ico_vision_eco.svg);
}
.vision ul li.env:before {
	background-image: url(../img/contents/ico_vision_env.svg);
}
.vision ul li.edu:before {
	background-image: url(../img/contents/ico_vision_edu.svg);
}
.vision ul li .tit {
	margin-bottom: 0.6rem;
	font-size: 2.2rem;
}

/* 유래와 연혁 */
.origin .img {
	border-radius: 0.8rem;
	overflow: hidden;
}
.origin-box {
	margin-top: 1rem;
}
.origin-box .con-box {
	margin-top: 2rem;
	padding: 2rem 2rem 2rem 14.4rem;
	border-radius: 0.8rem;
	background: var(--sub-point-light) url(../img/contents/ico_origin.svg) no-repeat 2rem 2rem/10rem;
}
.origin-box .con-box strong {
	display: block;
	margin-bottom: 1rem;
	font-size: 2rem;
	font-weight: 600;
	color: var(--sub-point);
}
.origin .history ol {
	display: flex;
	flex-direction: column;
	gap: 0.6rem;
	margin-top: 2rem;
}
.origin .history ol li {
	display: flex;
	gap: 1rem;
	padding: 1.4rem 1.6rem;
	border-radius: 0.8rem;
	border: 1px solid #e8e8e8;
}
.origin .history ol li em {
	display: block;
	flex-shrink: 0;
	padding-left: 2.4rem;
	width: 11rem;
	font-size: 1.6rem;
	line-height: 1.5;
	color: var(--sub-point);
	font-family: var(--ft-family-one);
	background: url(../img/contents/ico_history_blet.svg) no-repeat left top 0.3rem/1.8rem;
}
.origin .history ol li > div > p + p {
	margin-top: 1rem;
}
.symbol-wrap {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 2rem;
	margin-left: 1.1rem;
}
.symbol-wrap.slogan {
	margin-left: 3.2rem;
}
.symbol-wrap > div {
	width: calc(50% - 1rem);
	text-align: center;
	padding: 3rem;
	border-radius: 0.8rem;
	overflow: hidden;
	border: 1px solid #ced2db;
	background: url(../img/contents/bg_grid.svg) repeat center/1.3rem;
}
.symbol-wrap > div.wide {
	flex-shrink: 0;
	width: 100%;
}
.symbol-wrap > div.wide.txtfull {
	padding: 0;
}
.symbol-wrap > div.wide.txtfull .mark {
	padding: 5rem;
}
.symbol-wrap > div.wide.txtfull .txt {
	color: #fff;
	font-weight: 600;
	border-radius: 0;
	background-color: var(--sub-point);
}
.symbol-wrap .color {
	margin-top: 4rem;
	margin-bottom: 4rem;
	display: inline-flex;
	gap: 5rem;
	text-align: left;
}
.symbol-wrap .color li {
	position: relative;
	padding-left: 5rem;
}
.symbol-wrap .color li:before {
	content: '';
	position: absolute;
	z-index: 1;
	left: 0;
	top: 50%;
	width: 4rem;
	height: 4rem;
	border-radius: 0.4rem;
	transform: translateY(-50%);
	background: #f7941e;
}
.symbol-wrap .color li:nth-child(2):before {
	background: #ed1c24;
}
.symbol-wrap .color li strong {
	font-weight: 600;
}
.symbol-wrap .txt {
	display: flex;
	margin-top: 2rem;
	padding: 1.4rem;
	min-height: 8rem;
	justify-content: center;
	align-items: center;
	border-radius: 0.8rem;
	background: var(--sub-point-light);
}
/* 나무,꽃,새 */
.sym-tree {
	display: flex;
	gap: 2rem;
}
.sym-tree li {
	flex: 1;
	min-width: 0;
	padding: 2rem 2rem 4rem;
	text-align: center;
	border-radius: 0.8rem;
	background-color: var(--sub-point-light);
}
.sym-tree li .img {
	margin-bottom: 3rem;
	border-radius: 0.8rem;
	overflow: hidden;
}
.sym-tree li .con strong {
	display: block;
	font-size: 2.2rem;
	color: var(--sub-point);
}
.sym-tree li .con small {
	color: var(--ft-c-sub);
	font-size: 1.7rem;
}
.sym-tree li .con p {
	margin-top: 1.6rem;
}
.sym-tree li .con em {
	font-weight: 600;
}

/* 캐릭터 */
.grid-info {
	display: flex;
	gap: 2rem;
}
.grid-info .grid-item {
	flex: 1 1 calc(50% - 1rem);
	padding: 3rem;
	text-align: center;
	border-radius: 0.8rem;
	border: 1px solid #ced2db;
	background: url(../img/contents/bg_grid.svg) repeat center/1.3rem;
}
.grid-info .grid-item strong {
	display: block;
	padding: 1rem;
	text-align: center;
	margin-bottom: 2rem;
	font-weight: 600;
	border-radius: 0.8rem;
	background: var(--sub-point-light);
}
.grid-info .grid-item img {
	width: 100%;
	max-width: 21.2rem;
}
.grid-info .grid-item .char-list {
	display: flex;
	max-width: 29rem;
	margin: 0 auto;
	flex-wrap: wrap;
	justify-content: center;
	gap: 2rem 5rem;
}
.grid-info .grid-item .char-list p {
	flex: 1 1 calc(50% - 2.5rem);
	text-align: center;
}
[class^='char-col'] {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 3.5rem 2rem;
	margin-top: 1rem;
	padding: 3rem;
	border-radius: 0.8rem;
	border: 1px solid #ced2db;
	background: url(../img/contents/bg_grid.svg) repeat center/1.3rem;
}
[class^='char-col'] li {
	text-align: center;
	min-width: 0;
}
[class^='char-col'] img {
	width: auto;
	min-width: auto;
}
[class^='char-col'] strong {
	display: block;
	margin-top: 1rem;
	font-weight: 400;
}
.char-col5 li {
	flex: 1 1 calc((100% - 8rem) / 5);
}
.char-col4 {
	gap: 1rem 2rem;
}
.char-col4 li {
	flex: 1 1 calc((100% - 6rem) / 4);
}

/* 캐릭터 */
.char-story {
	text-align: center;
	padding: 6rem 2rem 10rem;
	border-radius: 0.8rem;
	background: url(../img/contents/bg_story.png) no-repeat center bottom/cover;
}
.char-story > strong {
	display: block;
	text-align: center;
	margin-bottom: 3rem;
	font-size: 3.9rem;
	font-weight: 400;
	font-family: var(--ft-family-one);
	background: linear-gradient(90deg, #386313 0%, #217b8f 100%);
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}
.char-story .con {
	display: inline-flex;
	max-width: 84.5rem;
	gap: 5rem;
	justify-content: space-between;
	align-items: center;
}
.char-story .con .img {
	max-width: 32rem;
}
.char-story .con .txt {
	text-align: left;
}
.char-story .con .txt p + p {
	margin-top: 2.5rem;
}
.char-story .con .txt strong {
	font-weight: 600;
}
.char-info {
	display: flex;
	flex-direction: column;
	gap: 2rem;
}
.char-info > div {
	display: flex;
	gap: 5rem;
	padding: 5rem 3rem;
	align-items: center;
	border-radius: 0.8rem;
	border: 1px solid #ced2db;
	background: url(../img/contents/bg_grid.svg) repeat center/1.3rem;
}
.char-info > div .img {
	min-width: 30rem;
	width: 30rem;
}
.char-info > div .con > i {
	display: block;
	margin-bottom: 3rem;
}
.char-info > div .con .txt {
	flex-grow: 1;
}
.char-info > div .bl02 {
	margin-top: 2rem;
	margin-bottom: 1rem;
}
.char-info > div .tag {
	margin-top: 2rem;
	color: var(--sub-point);
}
.char-info .btn-wrap {
	justify-content: flex-start;
}
.img-line {
	border-radius: 0.8rem;
	border: 1px solid #ced2db;
	overflow: hidden;
}

/* 조직도 */
.organization {
	--name-gap: 1.6rem;
	--name-height: 6.4rem;
	--name-margin: 12rem;
	--org-border: 0.1rem dashed rgba(74, 57, 147, 0.5);
}
.organization strong {
	display: block;
	box-sizing: border-box;
}
.organization .og-name {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: 20rem;
	margin: 0 auto;
	height: var(--name-height);
	font-size: 1.8rem;
	font-weight: 600;
	border-radius: 10rem;
}
.organization .rank1 {
	position: relative;
	color: #fff;
	font-size: 2rem;
	background: var(--gra);
}
.organization .rank1.purple {
	background: var(--sub-point);
}
.organization .rank1::before {
	content: '';
	position: absolute;
	z-index: 1;
	top: 100%;
	left: 50%;
	width: 0.1rem;
	height: calc(var(--name-height) + 3rem);
	border-left: var(--org-border);
}
.organization .rank1-1 {
	position: absolute;
	z-index: 1;
	left: 50%;
	top: 0;
	margin-left: var(--name-margin);
	color: var(--sub-point);
	border: 3px solid var(--sub-point);
}
.organization .rank1-1::before {
	content: '';
	position: absolute;
	z-index: 1;
	top: 50%;
	left: calc((var(--name-margin) * -1) - 0.3rem);
	width: calc(var(--name-margin) + 0.3rem);
	height: 0.1rem;
	border-top: var(--org-border);
}
.organization .rank2 {
	color: #fff;
	background: #3384a7;
}
.organization .rank3 {
	position: relative;
	display: flex;
	gap: 2.4rem;
	margin-top: 3rem;
}
.organization .rank3::before {
	content: '';
	position: absolute;
	z-index: 0;
	top: calc(var(--name-gap) * -1);
	left: 10rem;
	width: calc(50% - 10rem);
	height: 0;
	border-top: var(--org-border);
}
.organization .rank3::after {
	content: '';
	position: absolute;
	z-index: -1;
	top: -3rem;
	left: 50%;
	width: 0;
	height: calc(100% + 6rem);
	border-left: var(--org-border);
}
.organization .rank3 > li {
	position: relative;
	z-index: 1;
	width: 20rem;
}
.organization .rank3 > li::before {
	content: '';
	position: absolute;
	z-index: 1;
	bottom: 100%;
	left: 50%;
	width: 0;
	height: var(--name-gap);
	border-left: var(--org-border);
}
.organization .rank3 .og-name {
	color: var(--sub-point);
	border: 3px solid var(--sub-point);
	background: #fff;
}
.organization .con {
	display: flex;
	flex-direction: column;
	flex-grow: 1;
	gap: 0.6rem;
	margin-top: 0.4rem;
	padding: 1rem;
	border-radius: 0.6rem;
	background: var(--sub-point-light);
}
.organization .con li {
	position: relative;
	padding-left: 0.9rem;
}
.organization .con li:before {
	position: absolute;
	left: 0;
	top: 1.1rem;
	content: '';
	width: 0.3rem;
	height: 0.3rem;
	border-radius: 50%;
	background: #787878;
}
.organization .rank3 .con {
	border-radius: 1rem;
	padding: 2rem 1.6rem;
	gap: 1rem;
	background: #efeff2;
}
.organization .depth2 {
	position: relative;
	padding-top: var(--name-height);
	margin-top: 3rem;
}
.organization .part {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	--part-gap: 2rem;
	gap: 3rem var(--part-gap);
	margin-top: 3rem;
	padding-top: var(--name-gap);
}
.organization .part::before {
	content: '';
	position: absolute;
	z-index: 1;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	width: calc(100% - ((100% - var(--part-gap) * 3) / 4));
	border-top: var(--org-border);
}
.organization .part > li {
	position: relative;
	flex-grow: 1;
	width: 100%;
	max-width: calc((100% - var(--part-gap) * 3) / 4);
}
.organization .part > li::before {
	content: '';
	position: absolute;
	z-index: 1;
	bottom: 100%;
	left: 50%;
	width: 0;
	height: 1.6rem;
	border-left: var(--org-border);
}
.organization .part > li:nth-child(n + 5)::before {
	display: none;
}
.organization .part > li .top {
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 0.6rem;
	text-align: center;
	font-size: 1.8rem;
	color: #fff;
	height: 4.4rem;
	background: var(--sub-point);
	margin-bottom: 1rem;
}
.organization .part > li .tit {
	padding: 0.8rem;
	border: 1px solid var(--sub-point);
	color: var(--sub-point);
	font-size: 1.6rem;
	text-align: center;
	font-weight: 400;
	border-radius: 0.6rem;
}
.organization .part > li > ul {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem 0.4rem;
}
.organization .part > li > ul > li {
	display: flex;
	flex-direction: column;
	flex-grow: 1;
	width: 100%;
	max-width: calc(50% - 0.2rem);
}

.organization .part > li.big > ul {
	flex-direction: column;
}
.organization .part > li.big > ul > li {
	max-width: 100%;
}
.organization .part > li.dong {
	max-width: 100%;
}
.organization .part > li.dong > ul {
	gap: 1rem;
}
.organization .part > li.dong > ul > li {
	max-width: calc(20% - 0.8rem);
}
.organization .part > li.dong > ul > li.big {
	max-width: calc(40% - 0.6rem);
}
.organization .part > li.dong > ul > li.big .con {
	flex-direction: row;
	flex-wrap: wrap;
	gap: 0.6rem;
}
.organization .part > li.dong > ul > li.big .con li {
	width: calc(50% - 0.3rem);
}
.organization.military .rank1::before {
	height: calc(var(--name-height) + 6rem);
}
.organization.military .rank1-1 {
	color: #fff;
	border-color: #6c6a73;
	background: #6c6a73;
}
.organization.military .rank3 {
	justify-content: center;
}
.organization.military .rank3::after {
	display: none;
}
.organization.military .rank3::before {
	display: none;
}
.organization.military .rank3 > li {
	width: 30rem;
}
.organization.military .rank3 > li .og-name {
	width: 100%;
}
.organization.military .rank3 > li::before {
	display: none;
}
.policy-popup {
	padding: 3rem;
	height: auto;
}

/* 행정구역 */
.district-box {
	border: 0.1rem solid #ced2db;
	border-radius: 0.8rem 0.8rem 0 0;
	overflow: hidden;
}
.district-box .ds-top {
	padding: 5rem 5rem 4rem;
	background: var(--sub-point-light) url(../img/contents/ico_ds_top01.svg) no-repeat right -5rem bottom -9rem;
}
.district-box .ds-top .tit {
	font-size: 2.6rem;
	color: #222;
	font-family: var(--ft-family-one);
	line-height: 1.1;
	margin-bottom: 2rem;
}
.district-box .ds-top .tit span {
	display: block;
	color: #717171;
	font-size: 1.6rem;
	line-height: 1;
	margin-top: 0.4rem;
}
.district-box .ds-top .tab-btns {
	display: flex;
	align-items: stretch;
	gap: 0.6rem;
	flex-wrap: wrap;
	margin-top: 2rem;
}
.district-box .ds-top .tab-btns button {
	max-width: calc(14.35% - 0.6rem);
	width: 100%;
	height: 4.4rem;
	font-size: 1.6rem;
	font-weight: 600;
	border: 0.1rem solid #adadad;
	border-radius: 4.8rem;
	background: #fff;
}
.district-box .ds-top .tab-btns button.on,
.district-box .ds-top .tab-btns button:focus {
	color: #fff;
	background: linear-gradient(271deg, #df2947 11.07%, #cc2574 65.14%, #9f31a1 119.21%);
}
.district-box .ds-contents {
	padding: 2rem 0 4rem;
}
.district-box .ds-contents > div {
	width: 64.5rem;
	margin: 0 auto;
}
.district-box .ds-contents > div > a {
	position: relative;
	display: block;
	width: 100%;
	height: 100%;
}
.district-box .ds-contents > div .go-btn {
	position: absolute;
	z-index: 1;
	bottom: 0;
	left: 0;
	line-height: 1.36;
	display: flex;
	align-items: center;
	gap: 2.5rem;
	font-weight: 700;
	padding: 0.7rem 0.7rem 0.7rem 2rem;
	border-bottom: 0.1rem dashed #5c5b66;
}
.district-box .ds-contents > div .go-btn i {
	flex-shrink: 0;
	width: 3rem;
	height: 3rem;
	background: url(../img/contents/ico_ds_arrow01.svg) no-repeat right center/cover;
}

/* 행정교류 */
.exchange-local {
	display: flex;
	align-items: center;
	gap: 5rem;
	padding: 4rem;
	border-radius: 0.8rem;
	border: 0.1rem solid #ced2db;
}
.exchange-local .logo {
	flex-shrink: 0;
	width: 40rem;
}
.exchange-local .logo img {
	display: block;
	width: 100%;
}
.exchange-local .con .tit {
	padding-bottom: 1.6rem;
	border-bottom: 0.1rem dashed #d5d5d5;
}
.exchange-local .con .tit em {
	display: inline-block;
	padding: 0.4rem 1rem;
	border-radius: 0.4rem;
	background: #f5f5f5;
}
.exchange-local .con .tit strong {
	display: block;
	margin-top: 1.2rem;
	font-size: 2.6rem;
	font-family: var(--ft-family-one);
	color: #222;
}
.exchange-local .con .txt {
	padding-top: 2rem;
	margin-bottom: 3rem;
}
.exchange-local .con .txt p + p {
	margin-top: 1rem;
}

/* 청사안내 */
.office-map .tab-btns {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 2rem;
	padding: 1rem;
	border-radius: 0.8rem;
	background: var(--sub-point-light);
	margin-bottom: 2rem;
}
.office-map .tab-btns button {
	position: relative;
	width: 20rem;
	height: 4.6rem;
	font-weight: 500;
	color: var(--ft-c-sub);
	border-radius: 0.8rem;
}
.office-map .tab-btns button::before {
	content: '';
	position: absolute;
	z-index: 1;
	top: 50%;
	transform: translateY(-50%);
	left: -1rem;
	width: 0.1rem;
	height: 2.8rem;
	background: #d4d4d4;
}
.office-map .tab-btns button:first-child::before {
	display: none;
}
.office-map .tab-btns button.on,
.office-map .tab-btns button.focus {
	background: #fff;
	color: var(--sub-point);
	text-decoration: underline;
	font-weight: 700;
}
.office-map .tab-contents {
	padding: 4rem;
	border-radius: 0.8rem;
	border: 0.1rem solid #ced2db;
}
.office-map .tab-contents > div {
	display: flex;
	align-items: stretch;
	gap: 4rem;
}
.office-map .tab-contents .tit-btn {
	flex-shrink: 0;
	width: 24rem;
}
.office-map .tab-contents .tit-btn .tit {
	font-size: 2.6rem;
	font-family: var(--ft-family-one);
	display: block;
	margin-bottom: 2.2rem;
}
.office-map .tab-contents .floor-img {
	flex-grow: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #fafafa;
	padding: 5.4rem 0;
	border-radius: 0.8rem;
}
.office-map .tab-contents .floor-img img {
	max-width: 55.5rem;
}
.office-map .tab-contents .tit-btn .s-tit {
	position: relative;
	font-size: 1.8rem;
	font-weight: 700;
	padding-left: 1.8rem;
}
.office-map .tab-contents .tit-btn .s-tit::before {
	content: '';
	position: absolute;
	z-index: 1;
	top: 50%;
	transform: translateY(-50%);
	left: 0;
	width: 1.2rem;
	height: 1.2rem;
	border-radius: 1.2rem;
	border: 3px solid var(--ft-c-basic);
	box-sizing: border-box;
}
.office-map .tab-contents .tit-btn ul {
	width: 100%;
	margin-top: 0.6rem;
}
.office-map .tab-contents .tit-btn ul li {
	border-bottom: 0.1rem dashed #dddddd;
}
.office-map .tab-contents .tit-btn ul li + li {
	margin-top: 0.4rem;
}
.office-map .tab-contents .tit-btn ul li a {
	display: block;
	width: 100%;
	height: 100%;
	color: var(--ft-c-sub);
	font-weight: 500;
	padding: 0.6rem 2rem 0.6rem 1rem;
	background: url(../img/contents/ico_officemap_arrow.svg) no-repeat right 1rem center;
}

/* 민선 */
.former-list > ul {
	display: flex;
	align-items: stretch;
	gap: 2rem;
	flex-wrap: wrap;
}
.former-list > ul > li {
	position: relative;
	width: calc((100% - 4rem) / 3);
	padding-top: 1.3rem;
}
.former-list .label {
	position: absolute;
	z-index: 1;
	top: 0;
	left: 0;
	display: inline-block;
	font-size: 1.6rem;
	color: #fff;
	font-family: var(--ft-family-one);
	padding: 1.3rem 2.5rem;
	border-radius: 2.2rem 2.2rem 2.2rem 0;
	background: #5f5b70;
}
.former-list .label::before {
	content: '';
	position: absolute;
	z-index: 1;
	top: 100%;
	left: 0;
	width: 2.2rem;
	height: 2.2rem;
	background: url(../img/contents/ico_former01.svg) no-repeat center/cover;
}
.former-list .label span {
	font-size: 1.5rem;
}
.former-list > ul > li > div {
	border-radius: 0.8rem;
	width: 100%;
	height: 100%;
	overflow: hidden;
	border: 0.1rem dashed #ced2db;
}
.former-list .imgbox {
	text-align: center;
	padding: 4rem 0 2rem;
	background: #fafafa;
}
.former-list .txtbox {
	padding: 1.6rem;
}
.former-list .txtbox .name {
	display: block;
	margin-bottom: 1rem;
	text-align: center;
	font-size: 2rem;
	font-weight: 400;
	font-family: var(--ft-family-one);
}
.former-list .txtbox .bl-list.bl03 {
	margin: 0;
	gap: 0.3rem;
}

/* 취업연계 */
.recruit-site {
	display: flex;
	align-items: start;
	gap: 2rem;
	flex-wrap: wrap;
}
.recruit-site > li {
	width: calc((100% - 4rem) / 3);
	border: 0.1rem solid #ced2db;
	border-radius: 0.8rem;
	overflow: hidden;
}
.recruit-site > li a {
	display: block;
}
.recruit-site > li .img {
	width: 100%;
	height: 14rem;
}
.recruit-site > li .txt {
	text-align: center;
	padding: 3rem;
	background: #fafafa;
}
.recruit-site > li .txt strong {
	display: block;
	margin-bottom: 1.9rem;
	margin-bottom: 0.6rem;
}
.recruit-site > li .txt p {
	font-weight: 500;
}
.recruit-site > li .txt .btn.link {
	margin-top: 2rem;
	font-size: 1.6rem;
}
.recruit-site > li .txt .btn.link .svg-icon {
	width: 2rem;
	height: 2rem;
}
.recruit-site.news > li{
	width: calc((100% - 6rem) / 4);
}
.recruit-site.news > li .tit {
	display: flex;
	align-items: center;
	justify-content: center;
	padding-top: 3.6rem;
	padding-bottom: 2.4rem;
	font-size: 1.9rem;
	font-weight: 700;
}
.recruit-site.news > li .tit+.btn.link.medium {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 5rem !important;
	padding: 0 1.6rem;
	width: 100%;
	background: #FAFAFA;
	text-decoration: underline;
}
.recruit-site.news > li .tit+.btn.link.medium .svg-icon {
	margin-top: -0.4rem;
}
.top-tbox .tit {
	margin-bottom: 1rem;
	font-size: 1.9rem;
	font-weight: 700;
	color: #333;
}
.con-tbox02 {
	margin-top: 5rem;
	padding: 1.5rem 3.3rem;
	border-left: 0.3rem solid var(--sub-point);
	box-sizing: border-box;
	background: #fafafa;
}
.con-tbox02 .tit {
	position: relative;
	padding-left: 3rem;
	background: url(../img/contents/ico_contbox02.svg) no-repeat left top 0.2rem;
}
h4.bl01 + .con-tbox02 {
	margin-top: 3.2rem;
}
hr.hr01 {
	position: static !important;
	width: 100% !important;
	margin: 6.4rem 0 !important;
	border-bottom: 0.1rem dashed #aaa !important;
}
.step.line .tit {
	padding: 1.6rem;
}
.step.line .con {
	font-weight: 600;
	color: var(--sub-point);
	padding: 2.6rem 2rem;
}
.step.line .white .tit {
	background: #fff;
}
.step.line .white .tit::before {
	border-color: var(--ft-c-sub);
}
.step.line > li .tit {
	position: relative;
}
.step.line > li .tit::after {
	content: '';
	position: absolute;
	z-index: 1;
	top: 100%;
	left: 50%;
	transform: translateX(-50%);
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 7px 10px 0px 10px;
	border-color: var(--sub-point) transparent transparent transparent;
}
.step.line > li.white .tit::after {
	border-color: var(--ft-c-sub) transparent transparent transparent;
}
.step.line.only-tit {
	border: 0;
}
.step.line.only-tit > li {
	width: 50%;
}
.step.line.only-tit > li > div {
	height: 100%;
}
.step.line.only-tit .tit {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
	padding-left: 2rem;
	padding-right: 2rem;
}
.step.line.only-tit .tit .bl-list {
	margin: 0;
	width: 100%;
	text-align: left;
}
.step.line.only-tit .tit .bl-list.bl03::before {
	border-radius: 0;
}
.step.line.only-tit > li .tit::after {
	left: 100%;
	top: 50%;
	transform: translate(0, -50%);
	border-width: 10px 0px 10px 7px;
	border-color: transparent transparent transparent var(--sub-point);
}
.step.line.only-tit > li.white .tit::after {
	display: none;
}

/* 강화작은영화관 */
.place-info h4 {
	display: block;
	margin-bottom: 1rem;
	font-family: var(--ft-family-one);
	font-size: 2.4rem;
}
.place-info strong {
	font-weight: 400;
	color: var(--sub-point);
}
.place-info .img {
	margin-top: 1rem;
}

/* 갤러리 */
.gallery-swiperwrap {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 2rem;
	background: url(../img/contents/ico_gallery_deco01.svg) no-repeat left 4.4rem top 9rem;
}
.gallery-swiperwrap.no-list {
	padding-top: 6rem;
	padding-bottom: 4rem;
	background-position: left 4.4rem bottom;
}
.gallery-swiperwrap .gallery-thumb {
	max-width: 83.7rem;
	overflow: hidden;
	border: 1rem solid #fff;
	box-shadow: 0 0.8rem 1.6rem 0 rgba(0, 0, 0, 0.1);
}
.gallery-swiperwrap .btm-img {
	position: relative;
	width: 100%;
	max-width: 100%;
	padding: 2rem 0;
	background: linear-gradient(90deg, #fff 0%, #e4e4e4 50%, #fff 100%);
}
.gallery-swiperwrap .btm-img .btm-swiperwrap {
	position: relative;
	max-width: 77rem;
	margin: 0 auto;
}
.gallery-swiperwrap .btm-img .gallery-list {
	width: 100%;
	text-align: center;
	overflow: hidden;
}
.gallery-swiperwrap .btm-swiperwrap .swiper-button-prev,
.gallery-swiperwrap .btm-swiperwrap .swiper-button-next {
	width: 3.5rem;
	height: 3.5rem;
	border-radius: 4rem;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	border: 0.1rem solid #ddd;
}
.gallery-swiperwrap .btm-img .swiper-button-prev {
	left: -5rem;
	background-image: url(../img/contents/ico_gall_swiper_prev01.svg);
}
.gallery-swiperwrap .btm-img .swiper-button-next {
	right: -5rem;
	background-image: url(../img/contents/ico_gall_swiper_next01.svg);
}
.gallery-swiperwrap .btm-img .swiper-button-prev:after,
.gallery-swiperwrap .btm-img .swiper-container-rtl .swiper-button-next:after,
.gallery-swiperwrap .btm-img .swiper-button-next:after,
.gallery-swiperwrap .btm-img .swiper-container-rtl .swiper-button-prev:after {
	display: none;
}
.gallery-swiperwrap .gallery-list {
	width: 100%;
	box-sizing: border-box;
}
.gallery-swiperwrap .gallery-list .swiper-slide {
	height: auto; /* 세로 찌그러짐 방지 */
	box-sizing: border-box;
}
.gallery-swiperwrap .gallery-list .swiper-slide .img {
	border: 0.4rem solid #fff;
	margin-bottom: 0.6rem;
	box-sizing: border-box;
}
.gallery-swiperwrap .gallery-list .swiper-slide .img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.gallery-swiperwrap .gallery-list .swiper-slide p {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	word-break: keep-all;
}
.scr-tab > li {
	text-align: center;
	width: calc((100% - 3.6rem) / 7);
	background: #fff;
	transition: all 0.3s ease;
}
.scr-tab > li a,
.scr-tab > li a:hover {
	border-color: var(--sub-point);
}
.scr-tab > li > a {
	display: block;
	padding: 1rem 0;
	border-color: #c8c4d8;
	border-radius: 0.4rem;
}
.scr-tab > li > a:focus,
.scr-tab > li:hover > a {
	font-weight: 600;
	text-decoration: underline;
	text-underline-position: under;
}

/* 태권도 */
.vision-plan {
	display: flex;
	align-items: stretch;
	justify-content: space-between;
	gap: 2rem;
}
.vision-plan li {
	padding-top: 16rem;
	flex: 1;
	min-width: 0;
	border: 0.1rem solid #ced2db;
	border-radius: 0.8rem;
	background-repeat: no-repeat;
	background-position: top 3rem center;
	background-size: 10rem;
}
.vision-plan li.plan {
	background-image: url(../img/contents/pic_taekwondo01.png);
}
.vision-plan li.ing {
	background-image: url(../img/contents/pic_taekwondo02.png);
}
.vision-plan li.goal {
	background-image: url(../img/contents/pic_taekwondo03.png);
}
.vision-plan li div {
	height: 100%;
	font-size: 1.9rem;
	font-weight: 700;
	text-align: center;
	padding: 3rem 0;
	background: #fafafa;
}
/* 강화군립합창단 - 연혁 */
.origin .intro {
	margin-left: 3rem;
}
.origin .intro p + p {
	margin-top: 2rem;
}

.origin .history.half {
	display: flex;
}
.origin .history.half ol {
	flex: 0 1 50%;
	margin-top: 0;
	margin-right: 20px;
}
.origin .history.half ol:last-of-type {
	margin-right: 0;
}

/* 강화군립합창단 - 단원소개 */
.choir_orga {
	max-width: 92rem;
	--orga-width: 20rem;
	--orga-gap: 4rem;
	margin: 0 auto;
	padding: 3.2rem 0 0 1rem;
}
.choir_orga > li {
	display: flex;
	flex-direction: column;
	gap: 5rem;
	align-items: center;
}
.choir_orga .tit {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	max-width: var(--orga-width);
	height: 6.4rem;
	border-radius: 50rem;
	font-weight: 600;
	color: #fff;
}
.choir_orga .rank01 {
	font-size: 2rem;
	background: var(--gra);
}
.choir_orga .rank02 {
	position: relative;
	display: flex;
	width: 100%;
	max-width: 81.6rem;
	padding-bottom: 11.4rem;
	justify-content: center;
}
.choir_orga .rank02:before {
	position: absolute;
	z-index: 1;
	left: 50%;
	top: -5rem;
	content: '';
	width: 1px;
	height: calc(100% + 10rem);
	border-left: 1px dashed rgba(74, 57, 147, 0.5);
}
.choir_orga .rank02 > li {
	position: relative;
	z-index: 1;
	font-size: 1.8rem;
	background: var(--sub-point);
}
.choir_orga .rank02 > li.rank02-1 {
	position: absolute;
	z-index: 1;
	top: calc(50% + 5rem);
	right: 0;
	transform: translateY(-50%);
	color: #fff;
	background: #6c6a73;
}
.choir_orga .rank02 > li.rank02-1:after {
	position: absolute;
	z-index: 0;
	right: 100%;
	top: 50%;
	content: '';
	width: calc(100% + 0.5rem);
	height: 1px;
	border-top: 1px dashed rgba(74, 57, 147, 0.5);
}
.choir_orga .rank03 {
	position: relative;
	display: flex;
	justify-content: center;
	width: 100%;
	gap: var(--orga-gap);
}
.choir_orga .rank03:before {
	position: absolute;
	z-index: 0;
	left: 50%;
	top: 0;
	content: '';
	width: calc(var(--orga-width) * 3 + var(--orga-gap) * 2.8);
	height: 1px;
	border-top: 1px dashed rgba(74, 57, 147, 0.5);
	transform: translateX(-50%);
}
.choir_orga .rank03 > li {
	position: relative;
	width: 100%;
	max-width: var(--orga-width);
	margin-top: 1.6rem;
}
.choir_orga .rank03 > li:before {
	position: absolute;
	z-index: 1;
	left: 50%;
	top: -1.6rem;
	content: '';
	width: 1px;
	height: 1.6rem;
	border-left: 1px dashed rgba(74, 57, 147, 0.5);
}
.choir_orga .rank03 .tit {
	font-size: 1.8rem;
	color: var(--sub-point);
	border: 1px solid var(--sub-point);
}
.choir_orga .rank03 ul {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	margin-top: 0.6rem;
	padding: 2rem 1.6rem;
	border-radius: 2rem;
	background: var(--sub-point-light);
	font-size: 1.7rem;
	line-height: 1.5;
}
.choir_orga .rank03 ul li {
	position: relative;
	padding-left: 9px;
}
.choir_orga .rank03 ul li:before {
	position: absolute;
	left: 0;
	top: 1.1rem;
	content: '';
	width: 3px;
	height: 3px;
	border-radius: 50%;
	background: #787878;
}

.chor-mem {
	display: flex;
	margin-top: 1rem;
	border: 1px solid #ced2db;
	border-radius: 1rem;
}
.chor-mem .img {
	padding: 3rem;
	border-radius: 1rem 0 0 1rem;
	background: #fafafa;
}
.chor-mem .img .pic {
	width: 15.7rem;
	height: auto;
	margin-bottom: 1rem;
	border-radius: 1rem;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.08);
	overflow: hidden;
}
.chor-mem .img .pic img {
	width: 100%;
	height: 100%;
}
.chor-mem .img .name {
	text-align: center;
	font-family: var(--ft-family-one);
	font-size: 1.7rem;
}
.chor-mem .img .name span {
	color: var(--sub-point);
}
.chor-mem .history {
	padding: 3rem;
}
.chor-mem .history > div + div {
	margin-top: 2rem;
}
.chor-mem .history strong {
	font-size: 1.9rem;
	padding-left: 2.5rem;
	background: url(../img/contents/ico_contbox02.svg) no-repeat left top 0.1rem;
}
.chor-mem .history .bl-list.bl03 {
	gap: 0.4rem;
	margin-left: 1rem;
}
/* 공구대여목록 */
.land_rental {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1.6rem;
	justify-content: space-between;
}
.land_rental li {
	display: flex;
	flex-direction: column;
	text-align: center;
	gap: 1rem;
	border-radius: 0.8rem;
	border: 1px solid #ced2db;
	justify-content: space-between;
	padding-top: 1rem;
}
.land_rental li p {
	padding-top: 1rem;
	padding: 0.6rem;
}
.land_rental li p.rental_name {
	font-weight: 700;
}

.land_rental li p.rental_num {
	background: #f5f5f5;
	border-bottom-left-radius: 0.8rem;
	border-bottom-right-radius: 0.8rem;
	padding: 1rem 0.6rem;
	display: flex;
	border-top: 1px solid #e3e3e3;
}
.land_rental li p span {
	width: 50%;
	border-left: 1px solid #ddd;
}
.land_rental li p span:first-child {
	border-left: none;
}

@media (max-width: 1399px) {
	.choir_orga {
		max-width: 60rem;
	}
	.choir_orga .rank02 > li.rank02-1:after {
		width: calc(100% - 10.5rem);
	}
	.choir_orga .rank03 {
		--orga-gap: 1rem;
	}
	.choir_orga .rank03:before {
		width: calc(var(--orga-width) * 2.25);
	}
}

@media (max-width: 1023px) {
	.choir_orga {
		max-width: 82rem;
	}
	.choir_orga .rank02 > li.rank02-1 {
		right: 5rem;
	}
	.choir_orga .rank02 > li.rank02-1:after {
		width: calc(100% - 4.5rem);
	}
	.choir_orga .rank03 {
		--orga-gap: 3rem;
	}
	.choir_orga .rank03:before {
		width: calc(var(--orga-width) * 3 + var(--orga-gap));
	}
	.land_rental {
		grid-template-columns: repeat(3, 1fr);
	}
	.land_rental li p.rental_img img {
		width: 70%;
	}
}

@media (max-width: 767px) {
	.choir_orga .rank02 {
		padding-bottom: 8rem;
	}
	.choir_orga .rank02 > li.rank02-1 {
		top: calc(50% + 1.5rem);
		left: 50%;
		transform: translateX(-50%);
	}
	.choir_orga .rank02 > li.rank02-1::after {
		display: none;
	}
	.choir_orga .rank03 {
		flex-direction: column;
		align-items: center;
		--orga-width: 50rem;
		gap: 0;
	}
	.choir_orga .rank03:before {
		display: none;
	}
	.choir_orga .rank03 > li {
		max-width: var(--orga-width);
	}
	.land_rental {
		grid-template-columns: repeat(2, 1fr);
	}
}

/* 건축민원처리절차 */
.flowchart.estate-info {
	margin-top: 1rem;
	margin-left: 2.4rem;
}

.flowchart {
	position: relative;
	display: flex;
}
.flowchart .left {
	position: absolute;
	z-index: 1;
	top: 27rem;
	left: 0;
}
.flowchart .left > p {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 10rem;
	height: 10rem;
	text-align: center;
	color: #fff;
	background: var(--sub-point);
	border-radius: 50rem;
}
.flowchart .left > p + p {
	margin-top: 3rem;
}
.flowchart .right {
	width: 100%;
	padding-top: 1.6rem;
	padding-left: 13rem;
}
.flowchart .flow-step {
	width: 100%;
}
.flowchart .flow-step > li .con {
	display: flex;
}
.flowchart .flow-step > li + li {
	margin-top: 4.4rem;
}
.flowchart .flow-step li .caption {
	display: block;
	width: var(--flowchart-width);
	padding: 0.6rem 0;
	color: var(--sub-point);
	font-size: 16px;
	font-weight: 600;
	text-align: center;
}
.flowchart .flow-step li .tit {
	position: relative;
	flex-shrink: 0;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	width: var(--flowchart-width);
	min-height: 7rem;
	padding: 1rem;
	font-weight: 600;
	border: 3px solid #b6b3c4;
	border-radius: 0.5rem;
}
.flowchart .flow-step li:first-of-type .tit,
.flowchart .flow-step li:last-of-type .tit {
	border-color: var(--sub-point);
	background: var(--sub-point-light);
}
.flowchart .flow-step li .tit::after {
	content: '';
	display: block;
	position: absolute;
	top: calc(100% + 1rem);
	left: 50%;
	transform: translateX(-50%);
	width: 3.2rem;
	height: 3.2rem;
	background: url(../img/contents/ico_bt_arrow_purple.svg);
}
.flowchart .flow-step li:last-of-type .tit::after {
	display: none;
}
.flowchart .flow-step li .txtbox {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	justify-content: center;
	align-items: center;
	width: 100%;
	padding: 2rem;
	border: 1px solid #ced2db;
	border-radius: 0.5rem;
}
.flowchart .flow-step li .txtbox p {
	margin-right: 3rem;
	font-weight: 600;
}
.flowchart .flow-step li .txtbox p:last-of-type {
	margin-right: 0;
}
.flowchart .flow-step li .txtbox p span {
	display: inline-block;
	padding: 0.3rem 1rem;
	color: #fff;
	border-radius: 10rem;
	background: var(--sub-point);
}
.flowchart .flow-step li .sub {
	display: flex;
	align-items: center;
	width: 100%;
	margin-left: 1rem;
	padding: 1.6rem 2rem;
	border: 1px solid #b3b5bc;
	border-radius: 0.5rem;
	background: #f6f6f6;
}
.flowchart .flow-step li .sub .bl-list {
	margin: 0;
}

@media (max-width: 639px) {
	:root {
		--flowchart-width: 15rem;
	}

	.flowchart {
		display: block;
	}
	.flowchart .left {
		display: flex;
		justify-content: center;
		align-items: center;
		position: static;
	}
	.flowchart .left > p {
		margin-right: 3rem;
	}
	.flowchart .left > p + p {
		margin-top: 0;
	}
	.flowchart .left > p:last-of-type {
		margin-right: 0;
	}
	.flowchart .right {
		padding-left: 0;
	}
}

/* 옥외광고물 */
.advertise {
	overflow: hidden;
	margin-top: 1rem;
}
.advertise li {
	float: left;
	width: 33.3%;
	height: 5rem;
	line-height: 5rem;
	font-size: 1.5rem;
	font-weight: 600;
	border-bottom: 0.1rem dotted #b7b7b7;
	background: url('../img/contents/dotline2.gif') repeat-y;
}
.advertise li.first {
	background: none;
}
.advertise li.last {
	border-bottom: 0.1rem solid #fff;
}
.advertise li img {
	vertical-align: middle;
	margin: 0 0.8rem;
}

@media all and (max-width: 767px) {
	.advertise li {
		width: 50%;
		background: none;
	}
	.advertise li img {
		margin: 0 1rem;
	}
}

@media all and (max-width: 479px) {
	.advertise li {
		width: 100%;
		border-bottom: 1px dotted #b7b7b7;
	}
}

/* 농어업인 수당 */
.farmer-allow {
	margin-top: 3.2rem;
}

/* 여성농업인 행복바우처 지원 */
.women_happy {
	margin-left: 3.2rem;
}

/* 귀농귀촌안내 - 귀농준비절차 */
.flowchart.fm-guide {
	margin-top: 3.2rem;
}

/* 귀농귀촌안내 - 영농교육안내 */
.guide-edu {
	display: flex;
	align-items: stretch;
}
.guide-edu > .para01 {
	flex: 0 1 50%;
	margin-top: 1.6rem;
}
.guide-edu > .para01 > .bl02 {
	margin-top: 0;
}
.guide-edu .con {
	margin-top: 1rem;
	border: 1px solid #ced2db;
	border-radius: 1rem;
	overflow: hidden;
}
.guide-edu .con .img {
	display: flex;
	justify-content: center;
	padding: 3rem 1.6rem;
	background: #fafafa;
}
.guide-edu .con .img p {
	max-width: 35rem;
	border-radius: 2rem;
	overflow: hidden;
}
.guide-edu .con .txt {
	padding: 3rem;
	text-align: center;
	background: #fff;
}

@media all and (max-width: 639px) {
	.guide-edu {
		display: block;
	}
}

/* 환경정보 - 탄소중립 */
.clean-info .img-tbox {
	display: flex;
	justify-content: center;
	margin-top: 3.2rem;
}
.clean-info .img-tbox p {
	width: 59.5rem;
}
.clean-info .img-box {
	margin-top: 1rem;
}
.vision-infowrap {
	margin-top: 1rem;
}
.vision-infowrap > div {
	display: flex;
	align-items: stretch;
	gap: 1rem 2rem;
}
.vision-infowrap > div + div {
	margin-top: 1rem;
}
.vision-infowrap > div > strong {
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	width: 16rem;
	border-radius: 0.4rem;
	background: var(--sub-point);
}
.vision-infowrap > div > strong + div {
	flex-grow: 1;
	width: calc(100% - 18rem);
}
.vision-infowrap .vi-overv .line-box {
	text-align: center;
	font-size: 1.9rem;
	font-weight: 600;
	border-radius: 0.4rem;
	padding: 2.2rem 2rem;
	background: var(--sub-point-light);
	border: 0.1rem solid var(--sub-point);
}
.vision-infowrap .vi-overv .line-box.full {
	color: #fff;
	background: var(--sub-point);
}
.vision-infowrap .vi-listbox {
	display: flex;
	align-items: stretch;
	justify-content: space-between;
	gap: 1rem;
	padding: 0;
	counter-reset: num;
}
.vision-infowrap .vi-listbox > li {
	align-items: flex-start;
	flex: 1;
	min-width: 0;
	border-radius: 0.4rem;
	border: 0.1rem dashed #b3b5bc;
	padding: 1rem;
}
.vision-infowrap .vi-listbox.verti {
	flex-direction: column;
}
.vision-infowrap .vi-listbox.verti > li {
	flex: none;
	width: 100%;
}
.vision-infowrap .vi-listbox.verti > li .bl-list li {
	font-size: 1.6rem;
}
.vision-infowrap .vi-listbox.verti > li .bl-list li p {
	margin-top: 0.2rem;
}
.vision-infowrap .vi-listbox > li > strong {
	counter-increment: num;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 1rem;
	gap: 0.5rem;
	font-weight: 600;
	padding: 0.7rem 1rem;
	border-radius: 0.4rem;
}
.vision-infowrap .vi-listbox > li > strong::before {
	content: counter(num);
	display: flex;
	align-items: center;
	justify-content: center;
	width: 1.5rem;
	flex-shrink: 0;
	font-size: 1.2rem;
	line-height: 1;
	aspect-ratio: 1/1;
	border: 0.15rem solid var(--krds-light-color-text-basic);
	border-radius: 50%;
}
.vision-infowrap .vi-listbox > li:first-child > strong {
	background: #e2e9f6;
}
.vision-infowrap .vi-listbox > li:nth-child(2) > strong {
	background: #ede8fa;
}
.vision-infowrap .vi-listbox > li:last-child > strong {
	background: #f9e2e3;
}
.vision-infowrap .vi-listbox .bl-list {
	gap: 0.6rem;
}
.vision-infowrap .bl-list {
	margin-left: 0;
	margin-top: 0;
	font-size: 1.6rem;
}
.vision-infowrap .bl-list > li {
	padding-left: 1rem;
}
.vision-infowrap .gray-box {
	margin-top: 1rem;
	padding: 1.6rem 2rem;
	border-radius: 0.4rem;
	border: 0.1rem dashed #b3b5bc;
	background: #f6f6f6;
}
.vision-infowrap .gray-box > strong {
	display: block;
	margin-bottom: 1rem;
}
@media all and (max-width: 768px) {
	.vision-infowrap > div {
		flex-direction: column;
		gap: 0.8rem;
	}
	.vision-infowrap > div > strong {
		width: 100%;
		height: 4.3rem;
	}
	.vision-infowrap > div > strong + div {
		width: 100%;
	}
	.vision-infowrap > div + div {
		margin-top: 2.5rem;
	}
	.vision-infowrap .vi-listbox {
		flex-direction: column;
	}
	.vision-infowrap .vi-listbox > li {
		width: 100%;
	}
}

/* 환경정보 - 공공 신규 하수처리시설 현황 */
.new-sewage .flex-box {
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	align-items: stretch;
	gap: 2rem;
}
.new-sewage .flex-box > li {
	flex: 0 1 calc(50% - 2.4rem);
}
.new-sewage .flex-box > li > p {
	margin-left: -1.4rem;
}

@media (max-width: 767px) {
	.new-sewage .flex-box {
		display: block;
	}
	.new-sewage .flex-box > li + li {
		margin-top: 2rem;
	}
}

/* 대기환경 - 오존정보 */
.air-forecast .table-wrap .img > p {
	width: 8.5rem;
	margin: 0 auto;
}
/* 저작권정책 */
.icon-bnr {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 5rem;
	padding: 7.9rem 5rem;
	border-radius: 0.8rem;
	background: var(--sub-point-light);
}
.icon-bnr::after {
	content: '';
	flex-shrink: 0;
	display: inline-block;
	width: 22.4rem;
	height: 19.6rem;
}
.icon-bnr.copy::after {
	background: url(../img/contents/ico_guide_copy01.svg) no-repeat center/cover;
}
.icon-bnr.email::after {
	background: url(../img/contents/ico_guide_email01.png) no-repeat center/cover;
}
.icon-bnr > div {
	flex-grow: 1;
}
.icon-bnr > div .tit {
	display: block;
	margin-bottom: 3rem;
	font-size: 2.2rem;
	font-weight: 400;
	font-family: var(--ft-family-one);
}
.copy-error {
	margin-top: 1.6rem;
	padding: 5rem;
	border: 0.1rem solid #ced2db;
	border-radius: 0.8rem;
}
.copy-error ul li {
	display: flex;
	align-items: center;
	gap: 3rem;
	position: relative;
	padding-top: 2rem;
	padding-bottom: 2rem;
	border-bottom: 0.1rem solid #e6e8ed;
}
.copy-error ul li:first-child {
	padding-top: 0;
}
.copy-error ul li:last-child {
	padding-bottom: 0;
	border-bottom: 0;
}
.copy-error ul li::before {
	content: '';
	display: inline-block;
	flex-shrink: 0;
	width: 8rem;
	height: 8rem;
	border-radius: 8rem;
	background: #f5f5f5 url(../img/contents/ico_guide_copy_error.svg) no-repeat center;
}
.copy-error ul li p {
	flex-grow: 1;
}
/* 정보통신설비유지보수·관리제도 */
.maintenance.step.col04 li .con p {
	margin-top: 1rem;
	padding-top: 1rem;
	border-top: 1px dashed #cdcbd9;
}
/* 산림녹지공원 - 숲가꾸기 사업안내, 녹지조경 */
.clean-green .img-box {
	display: flex;
	gap: 1.6rem;
}
.clean-green .img-box div span {
	display: block;
	padding: 1rem;
	text-align: center;
	background: var(--sub-point-light);
}
.clean-green .img-box:before {
	display: none;
}

.clean-green .table-wrap tbody tr td {
	padding: 1.2rem 1rem;
}

/* 중대재해 - 안전보건경영방침 */
.disaster-safy .policy-box {
	width: 100%;
	height: 85.7rem;
	padding: 10rem 12rem;
	border-radius: 1rem;
	overflow: hidden;
	background: url(../img/contents/bg_disaster_safy.jpg) no-repeat center;
	background-size: contain;
}
.disaster-safy .policy-box .top {
	margin-bottom: 3rem;
	text-align: center;
}
.disaster-safy .policy-box .top em {
	display: block;
	width: 25rem;
	height: 4.85rem;
	margin: 0 auto 1.6rem;
	text-indent: -9999px;
	background: url(../img/contents/disaster_safy_ribbon.png) no-repeat center;
	background-size: cover;
}
.disaster-safy .policy-box .top strong {
	display: block;
	margin-bottom: 3rem;
	font-size: 2.9rem;
}
.disaster-safy .policy-box .top p {
	font-weight: 600;
}
.disaster-safy .policy-box .mid li {
	position: relative;
	padding-left: 3.4rem;
}
.disaster-safy .policy-box .mid li + li {
	margin-top: 1.6rem;
}
.disaster-safy .policy-box .mid li span {
	position: absolute;
	z-index: 1;
	top: 0;
	left: 0;
	font-weight: 600;
}
.disaster-safy .policy-box .btm {
	margin-top: 3rem;
	text-align: center;
	font-size: 1.9rem;
	font-weight: 600;
}
/* CCTV관제센터 - 현황 */
.safety-cctv .table-wrap thead th,
.safety-cctv .table-wrap tbody th,
.safety-cctv .table-wrap tbody td,
.safety-cctv .table-wrap tfoot th,
.safety-cctv .table-wrap tfoot td {
	padding-left: 0.6rem;
	padding-right: 0.6rem;
}
/* 고향사랑 제도소개 */
.love-info .top-tbox {
	position: relative;
}
.love-info .top-tbox > div {
	padding-right: 14.8rem;
}
.love-info .top-tbox > div > strong {
	display: block;
	margin-bottom: 1rem;
	font-size: 1.9rem;
}
.love-info .top-tbox .img-qr {
	position: absolute;
	z-index: 1;
	top: 50%;
	right: 4.8rem;
	transform: translateY(-50%);
	width: 9rem;
	height: 10.1rem;
}
.love-info .cont-box {
	margin-top: 1rem;
}
/* 고향사랑 기부혜택 */
.bnf-bnr {
	margin-left: 1.1rem;
	font-size: 3rem;
	font-family: var(--ft-family-one);
	padding: 5.5rem 5rem;
	border-radius: 8px;
	border: 3px solid #df2947;
	background:
		url(../img/contents/ico_lovegohyang_benefit_deco01.svg) no-repeat right 3.4rem bottom -0.5rem,
		linear-gradient(90deg, #f7f7fb 0%, #fdf6f9 100%);
}
.con-tbox div > .bl-list.ordered {
	margin-left: 0;
	margin-top: 0;
}
/* 고향사랑 기부방법 */
.icostep-list {
	--gap-size: 4.3rem;
	display: flex;
	flex-wrap: wrap;
	gap: 1.6rem var(--gap-size);
	margin-top: 1rem;
	margin-left: 2.4rem;
	text-align: center;
}
.icostep-list li {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.6rem;
	width: calc((100% - 21.5rem) / 5);
}
.icostep-list li::before {
	content: '';
	display: inline-block;
	width: 10rem;
	height: 10rem;
	border-radius: 0.8rem;
	background-color: var(--sub-point-light);
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
}
.icostep-list li:last-child::after {
	display: none;
}
.icostep-list li::after {
	content: '';
	position: absolute;
	top: 0;
	right: calc((var(--gap-size) / 2) * -1);
	z-index: 1;
	transform: translateX(50%);
	width: 2.2rem;
	height: 10rem;
	background: url(../img/contents/ico_icostep_arrow01.svg) no-repeat center;
}
.icostep-list.gift-online li.item01::before {
	background-image: url(../img/contents/ico_lovegohyang_method01_1.svg);
}
.icostep-list.gift-online li.item02::before {
	background-image: url(../img/contents/ico_lovegohyang_method01_2.svg);
}
.icostep-list.gift-online li.item03::before {
	background-image: url(../img/contents/ico_lovegohyang_method01_3.svg);
}
.icostep-list.gift-online li.item04::before {
	background-image: url(../img/contents/ico_lovegohyang_method01_4.svg);
}
.icostep-list.gift-online li.item05::before {
	background-image: url(../img/contents/ico_lovegohyang_method01_5.svg);
}
.icostep-list.gift-online li.item06::before {
	background-image: url(../img/contents/ico_lovegohyang_method01_6.svg);
}
.icostep-list.gift-online li.item07::before {
	background-image: url(../img/contents/ico_lovegohyang_method01_7.svg);
}
.icostep-list.gift-online li.item08::before {
	background-image: url(../img/contents/ico_lovegohyang_method01_8.svg);
}
.icostep-list.gift-offline li::before {
	background-color: #fae9f0;
}
.icostep-list.gift-offline li.item01::before {
	background-image: url(../img/contents/ico_lovegohyang_method02_1.svg);
}
.icostep-list.gift-offline li.item02::before {
	background-image: url(../img/contents/ico_lovegohyang_method02_2.svg);
}
.icostep-list.gift-offline li.item03::before {
	background-image: url(../img/contents/ico_lovegohyang_method02_3.svg);
}
.icostep-list.gift-offline li.item04::before {
	background-image: url(../img/contents/ico_lovegohyang_method02_4.svg);
}
.icostep-list.gift-offline li.item05::before {
	background-image: url(../img/contents/ico_lovegohyang_method02_5.svg);
}
.icostep-list.gift-offline li.item06::before {
	background-image: url(../img/contents/ico_lovegohyang_method02_6.svg);
}
.icostep-list.gift-offline li.item07::before {
	background-image: url(../img/contents/ico_lovegohyang_method02_7.svg);
}
.icostep-list.gift-offline li.item08::before {
	background-image: url(../img/contents/ico_lovegohyang_method02_8.svg);
}
/* 고향사랑 답례품현황 */
.gift-list {
	display: flex;
	align-items: start;
	gap: 1.1rem;
	flex-wrap: wrap;
	margin-top: 1rem;
	margin-left: 2.4rem;
}
.gift-list li {
	width: calc((100% - 4.4rem) / 5);
	min-width: 0;
	border-radius: 0.8rem;
	border: 0.1rem solid #ced2db;
	background: #fafafa;
}
.gift-list li .img {
	border-radius: 0.8rem;
	width: 100%;
	height: 15rem;
	overflow: hidden;
}
.gift-list li .img img {
	display: block;
	max-width: auto;
	height: 100%;
	object-fit: cover;
}
.gift-list li .name {
	text-align: center;
	padding: 0.7rem 0 0.5rem;
}
/* 명예의전당 */
.halloffame-list {
	display: flex;
	align-items: start;
	flex-wrap: wrap;
	gap: 1.8rem;
	margin-top: 3.2rem;
}
.halloffame-list li {
	width: calc((100% - 3.6rem) / 3);
	min-width: 0;
	text-align: center;
	border-radius: 0.8rem;
	border: 0.1rem solid #ced2db;
	overflow: hidden;
}
.halloffame-list li > div {
	height: 15rem;
	padding: 2.2rem 2rem 0;
	background:
		url(../img/contents/pic_halloffame_deco01.png) no-repeat left 1rem top 1.3rem/11.4rem,
		url(../img/contents/pic_halloffame_deco02.png) no-repeat right 1rem top 1.3rem/11.4rem;
}
.halloffame-list li.anonymous > div {
	padding-top: 3.9rem;
}
.halloffame-list li > div .name {
	display: block;
	margin-bottom: 1.4rem;
	font-weight: 400;
	font-size: 2.2rem;
	font-family: var(--ft-family-one);
	line-height: 1.3;
	padding-top: 3.3rem;
	background: url(../img/contents/ico_halloffame_name01.svg) no-repeat top center;
}
.halloffame-list li > .amount {
	font-size: 1.9rem;
	font-weight: 600;
	color: #fff;
	padding: 1.4rem 0;
	background: #505571;
}
/* 기금사업 소개 */
.col-flbox {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 2rem;
}
.col-flbox > *:not(.imgbox) {
	flex-grow: 1;
	min-width: 0;
}
.col-flbox .imgbox {
	flex-shrink: 0;
}
.col-flbox .qr {
	width: 13.7rem;
}
/* 개인정보처리방침 */
.personal_wrap h4 img {
	width: 3.7rem;
    margin-left: 1rem;
    transform: translateY(-0.7rem);
    position: absolute;
}
@media (max-width: 767px) {
	.personal_wrap h4 img {
		width: 3rem;
		transform: translateY(0rem);
	}
}
.personal_wrap h4 img:first-of-type {
	margin-left: 0.5rem;
}
.personal_label {
	margin-top: 1.5rem;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	text-align: center;
}
.personal_label * {
	box-sizing: border-box;
	word-break: keep-all;
}
.personal_label > li {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	width: calc(25% - 0.7rem);
	margin-bottom: 1rem;
	padding: 1.5rem 0.5rem;
	border: 0.1rem solid #eee;
	transition: all 0.2s ease;
	border-radius: 0;
}
.personal_label > li > a {
	display: block;
	width: 100%;
}
.personal_label > li:last-child {
	margin-right: calc(50% + 0.5rem);
}
.personal_label > li > a span {
	display: block;
	margin-top: 1rem;
	font-size: 1.5rem;
	line-height: 2rem !important;
	letter-spacing: -0.05rem;
}
.personal_label > li > div {
	display: none;
	position: absolute;
	left: calc(100% + 0.9rem);
	top: -0.1rem;
	text-align: left;
	width: calc(200% + 1.5rem);
	background: #fff;
	box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.1);
	z-index: 10;
}
.personal_label > li > div .tit {
	padding: 1rem 1.5rem;
	color: #fff;
	font-weight: 500;
	border-radius: 0.3rem 0.3rem 0 0;
	background: #1647aa;
}
.personal_label > li > div .txt {
	padding: 1.5rem;
	border: 0.1rem solid #1647aa;
	border-top: 0;
	border-radius: 0 0 0.3rem 0.3rem;
}
.personal_label > li > div:before {
	position: absolute;
	left: -0.4rem;
	top: 2rem;
	width: 0.8rem;
	height: 0.8rem;
	background: #1647aa;
	content: '';
	transform: rotate(45deg);
}
.personal_label > li.on {
	border-color: #1647aa;
	box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.1);
}
.personal_label > li.on > div {
	display: block;
}
.personal_label > li:nth-child(4n-1) > div,
.personal_label > li:nth-child(4n) > div {
	left: auto;
	right: calc(100% + 0.9rem);
}
.personal_label > li:nth-child(4n-1) > div:before,
.personal_label > li:nth-child(4n) > div:before {
	left: auto;
	right: -0.4rem;
}
.personal_index {
	margin-top: 3rem;
	padding: 2.5rem;
	border: 0.1rem solid #ccc;
	border-top: 0.3rem solid var(--sub-point);
	box-sizing: border-box;
}
.personal_index * {
	box-sizing: border-box;
	word-break: keep-all;
}
.personal_index > p {
	text-align: center;
	margin-bottom: 20px;
	font-size: 20px;
	font-weight: bold;
}
.personal_index > ul {
	display: flex;
	flex-wrap: wrap;
	border-top: 0.1rem solid #000;
	border-bottom: 0.1rem solid #000;
}
.personal_index > ul > li {
	position: relative;
	width: 50%;
	padding: 1rem;
	border-bottom: 0.1rem dotted #ccc;
}
.personal_index > ul > li:last-child {
	border-bottom: 0;
}
.personal_index > ul > li img {
	vertical-align: middle;
	width: 2.6rem;
	margin-right: 0.2rem;
}
.personal_old {
	margin-top: 1.5rem;
}
.personal_old > li {
	margin-bottom: 1.6rem;
}
.personal_old > li > a {
	position: relative;
	text-align: center;
	display: block;
	padding: 1rem 4rem;
	color: var(--sub-point);
	font-weight: bold;
	background: var(--sub-point-light);
	border: 0.1rem solid var(--sub-point);
	transition: 0.3s;
}
.personal_old > li.select > a {
	color: #fff;
	background: var(--sub-point);
}
.personal_old > li > a:before {
	position: absolute;
	right: 2rem;
	top: 1.8rem;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 1rem 0.8rem 0px 0.8rem;
	border-color: #33363d transparent transparent transparent;
	content: '';
	transition: 0.3s;
}
.personal_old > li.select > a:before {
	border-color: #fff transparent transparent transparent;
	transform: rotate(-180deg);
}

.individualBox {
	margin-top: 3rem;
	padding: 2.5rem;
	background: #fff;
	border: 0.1rem solid #ccc;
	border-top: 0.3rem solid var(--sub-point);
}
.individualBox * {
	box-sizing: border-box;
	word-break: keep-all;
}
.individualBox > .tit {
	text-align: center;
	margin-bottom: 2rem;
	font-size: 2rem;
	font-weight: bold;
}
.individualBox .labelling {
	position: relative;
	display: flex;
	border-top: 0.1rem solid var(--sub-point);
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: stretch;
}
.individualBox .labelling:after {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	height: 0.1rem;
	background: var(--sub-point);
	content: '';
}
.individualBox .labelling > dl {
	display: table;
	text-align: center;
	width: 50%;
	border-bottom: 0.1rem dashed #d2d2d2;
	border-right: 0.1rem dashed #d2d2d2;
}
.individualBox .labelling > dl:first-of-type {
	width: 100%;
}
.individualBox .labelling > dl:nth-of-type(2n + 1) {
	border-right: 0;
}
.individualBox .labelling > dl dt {
	display: table-cell;
	vertical-align: middle;
	width: 15rem;
	padding: 1rem;
	font-size: 1.6rem;
	font-weight: bold;
}
.individualBox .labelling > dl dt img {
	display: block;
	margin: 0 auto 0.5rem;
}
.individualBox .labelling > dl dd {
	display: table-cell;
	vertical-align: middle;
	text-align: left;
	padding: 1rem;
}
.individualBox .labelling > dl:first-of-type dd {
	text-align: center;
	padding: 1.5rem;
}
.individualBox .labelling > dl:first-of-type dd ul {
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: stretch;
}
.individualBox .labelling > dl:first-of-type dd ul > li {
	width: 30%;
}
.individualBox .labelling > dl:first-of-type dd ul > li .tit {
	margin-top: 0.5rem;
	font-weight: bold;
}
.individualBox .labelling > dl:first-of-type dd ul > li .txt {
	margin-top: 0.3rem;
	font-size: 1.3rem;
	line-height: 1.8rem !important;
}
.individualBox .indexCon {
	position: relative;
	display: flex;
	border-top: 0.1rem solid var(--sub-point);
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: stretch;
}
.individualBox .indexCon:after {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	height: 0.1rem;
	background: var(--sub-point);
	content: '';
}
.individualBox .indexCon > li {
	display: inline-block;
	width: 50%;
	border-bottom: 0.1rem dashed #d2d2d2;
	border-right: 0.1rem dashed #d2d2d2;
}
.individualBox .indexCon > li:nth-child(2n) {
	border-right: 0;
}
.individualBox .indexCon > li > a {
	display: block;
	padding: 1rem 2rem;
	font-size: 1.4rem;
	word-break: keep-all;
}

.vision-policy {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 2rem;
	flex-wrap: wrap;
}
.vision-policy li {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 4rem;
	gap: 1rem;
	width: calc((100% - 4rem) / 3);
	border-radius: 0.8rem;
	background: linear-gradient(180deg, #fff 0%, #f5f5f5 100%);
	box-shadow: 0.2rem 0.2rem 0.8rem 0 rgba(0, 0, 0, 0.11);
	border: 0.1rem solid #ced2db;
}
.vision-policy li em {
	font-weight: 700;
	border-bottom: 1px solid var(--krds-light-color-text-subtle);
}
.vision-policy li p {
	width: 100%;
	text-align: center;
	font-size: 2.2rem;
}
.vision-policy li p::before {
	content: '';
	display: block;
	width: 10rem;
	height: 10rem;
	margin: 0 auto 1rem;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
}
.vision-policy li.pol01 p::before {
	background-image: url(../img/contents/ico_vision01.svg);
}
.vision-policy li.pol02 p::before {
	background-image: url(../img/contents/ico_vision02.svg);
}
.vision-policy li.pol03 p::before {
	background-image: url(../img/contents/ico_vision03.svg);
}
.vision-policy li.pol04 p::before {
	background-image: url(../img/contents/ico_vision04.svg);
}
.vision-policy li.pol05 p::before {
	background-image: url(../img/contents/ico_vision05.svg);
}

/************************************* 반응형 ******************************************/

@media (max-width: 1530px) {
	.disaster-safy .policy-box {
		height: 100%;
		background-size: 100% 85.7rem;
	}
}
@media (max-width: 1330px) {
	.disaster-safy .policy-box .top em {
		width: 22rem;
		height: 4.8rem;
		margin-bottom: 1rem;
	}
	.disaster-safy .policy-box .top strong {
		margin-bottom: 2rem;
	}
	.disaster-safy .policy-box .top p br {
		display: none;
	}
}
@media (max-width: 1199px) {
	.disaster-safy .policy-box {
		padding: 8rem 6rem;
	}
	.disaster-safy .policy-box .top em {
		width: 20rem;
		height: 4.4rem;
	}
	.disaster-safy .policy-box .top strong {
		font-size: 2.6rem;
	}
	.disaster-safy .policy-box .mid li {
		padding-left: 2.4rem;
	}
	.exchange-local {
		gap: 2rem;
		padding: 3rem 2rem;
	}
	.exchange-local .logo {
		width: 30rem;
	}
}
@media (max-width: 1023px) {
	.gallery-swiperwrap .gallery-thumb {
		max-width: 85%;
	}
	.disaster-safy .policy-box {
		padding: 8rem;
		background-size: 100% 70rem;
	}
	.disaster-safy .policy-box .top em {
		width: 18.5rem;
		height: 4rem;
	}
	.disaster-safy .policy-box .top strong {
		font-size: 2.3rem;
	}
	.exchange-local {
		gap: 5rem;
		padding: 4rem;
	}
	.exchange-local .logo {
		width: 40rem;
	}
}

@media (max-width: 767px) {
	.counsel-box {
		flex-direction: column;
	}
	.counsel-box > div {
		padding: 5rem 2rem;
	}
	.onestop-step {
		flex-direction: column;
	}
	.manage-wrap .manage-box {
		flex-direction: column;
	}
	.manage-wrap .manage-box .graph-box {
		width: 100%;
	}
	.ghss-orga .rank02 {
		flex-direction: column;
		align-items: center;
		gap: 2rem;
	}
	.ghss-orga .rank02:after {
		display: none;
	}
	.ghss-orga .rank03 {
		--orga-width: 50rem;
		flex-direction: column;
		align-items: center;
		gap: 0;
	}
	.ghss-orga .rank03:before {
		display: none;
	}
	.vision ul li {
		flex-basis: 100%;
	}
	.symbol-wrap > div {
		width: 100%;
	}
	.symbol-wrap .color {
		flex-direction: column;
		gap: 2rem;
		margin-bottom: 2rem;
	}
	.sym-tree {
		flex-direction: column;
	}
	.grid-info {
		flex-direction: column;
	}
	.grid-info .grid-item {
		flex-basis: 100%;
	}
	.char-col5 li,
	.char-col4 li {
		flex-basis: calc(50% - 1rem);
	}
	.char-story .con {
		flex-direction: column;
		gap: 2rem;
	}
	.char-story .con .txt {
		order: 2;
	}
	.char-info > div {
		flex-direction: column;
		gap: 2rem;
	}

	/* 조직도 */
	.organization .rank1::before {
		height: calc(var(--name-height) + 6rem);
	}
	.organization .depth2 {
		padding-top: 0;
	}
	.organization .depth2 > li + li {
		margin-top: 3rem;
	}
	.organization .rank1-1 {
		position: relative;
		margin-left: 0;
		transform: translateX(-50%);
		background: #fff;
	}
	.organization .rank1-1::before {
		display: none;
	}
	.organization .rank3 {
		width: 100%;
		align-items: flex-start;
	}
	.organization .rank3 > li {
		width: calc(50% - 1.2rem);
	}
	.organization .rank3 > li .og-name {
		max-width: 100%;
	}
	.organization .rank3::before {
		left: 50%;
		transform: translateX(-50%);
		width: calc(50% + 1.2rem);
	}
	.organization .part {
		flex-direction: column;
		padding-top: 0;
	}
	.organization .part::before {
		display: none;
	}
	.organization .part > li {
		width: 100%;
		max-width: 100%;
	}
	.organization .part > li::before {
		display: none;
	}
	.organization .part > li.dong > ul > li.big {
		max-width: 100%;
	}
	.organization .part > li.dong > ul > li {
		max-width: calc(50% - 0.5rem);
	}
	/* 행정구역 */
	.district-box .ds-top {
		padding: 3rem 2rem 2rem;
	}
	.district-box .ds-top .tab-btns button {
		max-width: calc(33.33% - 0.4rem);
	}
	.district-box .ds-contents {
		padding: 1.5rem 2rem 2.5rem;
	}
	.district-box .ds-contents > div {
		width: 100%;
	}
	.district-box .ds-contents > div a {
		padding-bottom: 4rem;
	}
	.district-box .ds-contents > div .go-btn {
		padding: 0.4rem 0.4rem 0.4rem 1rem;
		gap: 2rem;
	}

	/* 행정교류 */
	.exchange-local {
		flex-direction: column;
		align-items: flex-start;
	}
	.exchange-local .logo {
		width: 100%;
	}

	/* 청사안내 */
	.office-map .tab-contents {
		padding: 2rem;
	}
	.office-map .tab-contents > div {
		flex-direction: column;
		gap: 3.7rem;
	}
	.office-map .tab-contents .tit-btn {
		width: 100%;
	}
	.office-map .tab-contents .floor-img {
		width: 100%;
	}
	.office-map .tab-contents .tit-btn ul {
		display: flex;
		align-items: start;
		flex-wrap: wrap;
		gap: 1.2rem;
	}
	.office-map .tab-contents .tit-btn ul li {
		width: calc(50% - 0.6rem);
	}
	.office-map .tab-contents .tit-btn ul li + li {
		margin: 0;
	}
	.office-map .tab-contents .floor-img {
		padding: 2.5rem 2.2rem;
	}
	.office-map .tab-contents .floor-img img {
		width: 100%;
		height: auto;
		max-width: 100%;
	}

	/* 민선 */
	.former-list > ul > li {
		width: calc((100% - 2rem) / 2);
	}

	/* 취업연계사이트 */
	.recruit-site > li {
		width: calc((100% - 2rem) / 2) !important;
	}

	/* 구제제도 */
	.step.line.only-tit > li {
		width: 100%;
	}

	.step.line.only-tit > li .tit::after {
		top: 100%;
		left: 50%;
		transform: translate(-50%, 0);
		border-width: 7px 10px 0px 10px;
		border-color: var(--sub-point) transparent transparent transparent;
	}

	.scr-tab > li {
		width: calc((100% - 2.4rem) / 5);
	}

	.gallery-swiperwrap {
		background-size: 45%;
		background-position: left -2rem top;
	}
	.gallery-swiperwrap.no-list {
		background-position: left -2rem bottom;
	}
	.gallery-swiperwrap .btm-img .btm-swiperwrap {
		width: 75%;
	}

	/* 태권도 */
	.vision-plan {
		flex-direction: column;
	}
	/* 산림녹지공원 - 숲가꾸기 사업안내, 녹지조경 */
	.clean-green .img-box {
		flex-wrap: wrap;
	}
	.clean-green .img-box div {
		flex: 0 1 calc(50% - 1.6rem);
	}
	.disaster-safy .policy-box {
		background-size: 100% 82rem;
	}
	/* 고향사랑 기부방법 */
	.icostep-list li {
		width: calc((100% - (var(--gap-size) * 2)) / 3);
	}

	/* 고향사랑 답례품현황 */
	.gift-list li {
		width: calc((100% - 2.2rem) / 3);
	}

	/* 명예의전당 */
	.halloffame-list li {
		width: calc((100% - 1.8rem) / 2);
	}

	/* 기금사업 소개 */
	.col-flbox .qr {
		flex-shrink: 0;
		width: 10%;
	}

	/* 저작권정책 */
	.icon-bnr {
		flex-direction: column;
		align-items: flex-end;
		gap: 3rem;
		padding: 5rem 3rem 3rem;
	}
	.icon-bnr::after {
		width: 11.4rem;
		height: 10rem;
	}
	.icon-bnr div {
		width: 100%;
	}
	.individualBox .labelling > dl {
		width: 100%;
		border-right: 0;
	}

	.individualBox .labelling > dl dt {
		width: 13.8rem;
		padding: 1.3rem;
		font-size: 1.9rem;
	}

	.individualBox .labelling > dl dt img {
		display: block;
		margin: 0 auto 0.6rem;
	}

	.individualBox .labelling > dl dd {
		display: table-cell;
		vertical-align: middle;
		text-align: left;
		padding: 1.3rem;
	}
	.individualBox .labelling > dl:first-of-type dd ul {
		display: block;
	}

	.individualBox .labelling > dl:first-of-type dd ul > li {
		width: 100%;
		margin: 1.9rem 0;
	}

	.individualBox .labelling > dl:first-of-type dd ul > li .tit {
		margin-top: 0;
	}

	.individualBox .labelling > dl:first-of-type dd ul > li .txt {
		font-size: 1.4rem;
	}

	.individualBox .indexCon > li {
		display: inline-block;
		width: 100%;
		border-right: 0;
	}
}

@media (max-width: 580px) {
	.disaster-safy .policy-box {
		padding: 8rem 6rem;
		background-size: 100% 88rem;
	}
	.disaster-safy .policy-box .top {
		margin-bottom: 2.4rem;
	}
	.disaster-safy .policy-box .mid li + li {
		margin-top: 1.2rem;
	}
	.disaster-safy .policy-box .btm {
		margin-top: 2.4rem;
	}
	.vision-policy li {
		width: calc((100% - 4rem) / 2);
	}
}

@media (max-width: 480px) {
	/* 민선 */
	.former-list > ul {
		flex-direction: colum;
	}
	.former-list > ul > li {
		width: 100%;
	}
	/* 취업연계사이트 */
	.recruit-site {
		flex-direction: colum;
	}
	.recruit-site > li {
		width: 100% !important;
	}
	.recruit-site > li .img {
		height: auto;
	}
	.scr-tab > li {
		width: calc((100% - 1.2rem) / 3);
	}
	.disaster-safy .policy-box {
		padding: 6rem 4rem;
		background-size: 100% 95rem;
	}
	/* 고향사랑 기부방법 */
	.icostep-list {
		--gap-size: 3rem;
	}
	.icostep-list li {
		width: calc((100% - var(--gap-size)) / 2.3);
	}
	/* 고향사랑 답례품현황 */
	.gift-list li {
		width: calc((100% - 1.1rem) / 2);
	}
	/* 명예의전당 */
	.halloffame-list {
		flex-direction: column;
	}
	.halloffame-list li {
		width: 100%;
	}
	.vision-policy {
		flex-direction: column;
	}
	.vision-policy li {
		width: 100%;
	}
}

@media (max-width: 375px) {
	.disaster-safy .policy-box {
		background-size: 100% 105rem;
	}
}

#sitemap .sitemap-box h2 {
	font-family: var(--ft-family-one);
	font-weight: 400;
}

.signature .appBox {
	text-align: center;
	padding: 4rem 2rem;
	margin-top: 3rem;
	border-radius: 1rem;
	border: 1px solid #4a3993;
}
.signature .appBox > div input,
.signature .appBox > div select {
	padding: 1.4rem 1rem;
	border: 1px solid #bbb;
	border-radius: 0.8rem;
}
.signature .appBox > div input {
	padding: 1.4rem 1rem;
}
.signature .appBox > p {
	margin: 2rem 0; /* display: inline-block; */
	position: relative;
}
.signature .appBox > p input {
	width: 2rem !important;
	height: 2rem !important;
	vertical-align: middle;
	clip: auto !important;
	left: 0;
	position: static !important;
}
.signature .appBox > p label {
	vertical-align: middle;
	font-weight: 500;
	color: #111;
}
.signature .appBox > a span {
	font-size: 22px;
	font-family: 'Nanum Myeongjo';
	font-weight: 900;
	letter-spacing: -1px;
	line-height: inherit !important;
}

.ir {
	overflow: hidden;
	display: block;
	margin: auto;
	text-indent: -5000px;
	font-size: 0;
	line-height: 0;
	width: 0;
	height: 0;
}
.ir_ib {
	overflow: hidden;
	display: inline-block;
	margin: auto;
	text-indent: -5000px;
	font-size: 0;
	line-height: 0;
	width: 0;
	height: 0;
}

.signature .participation {
	margin: 0 auto;
	display: flex;
	max-width: 49rem;
	border: 1px solid #bbb;
	border-radius: 0.8rem;
	margin-top: 1rem;
}
.signature .participation label {
	position: relative;
	flex: 0 0 10rem;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
}
.signature .participation label:before {
	position: absolute;
	right: 0;
	top: 10px;
	bottom: 10px;
	width: 1px;
	background: #bbb;
	content: '';
}
.signature .participation input {
	flex: 1 1 auto;
	border: 0 !important;
}

.signature-tbox {
	border-radius: 0.8rem;
	border: 1px solid #ddd;
	text-align: center;
	padding: 4rem 2rem;
	margin-top: 3rem;
}
.signature-tbox p {
	margin-bottom: 1rem;
}
.signature-tbox2 {
	margin-top: 3rem;
	padding: 2.2rem 3.2rem;
	border-radius: 0.8rem;
	background: #f7f7fb;
}
.signature-tbox p:last-child {
	margin-bottom: 0;
}
@media (max-width: 767px) {
	.signature .appBox > div input,
	.signature .appBox > div select {
		width: 100%;
		margin-bottom: 3px;
	}
	.signature .participation label {
		flex: 0 0 6rem;
	}
}
.opendata {
	position: relative;
	margin: 0 auto;
	padding-left: 5rem;
	padding-right: 5rem;
	max-width: 80rem;
	width: 100%;
	overflow: hidden;
}
.opendata .swiper {
	max-width: 60rem;
	width: 100%;
	margin-top: 2rem;
	border-radius: 2rem;
	overflow: hidden;
}
.opendata .swiper-button-next,
.opendata .swiper-button-prev {
	margin: 1rem;
	color: var(--ft-c-basic);
	border-radius: 50%;
	background: #fff;
	box-shadow: var(--box-shadow3);
}
.opendata .swiper-button-next svg,
.opendata .swiper-button-prev svg {
	width: 2rem;
	height: 2rem;
}