@charset "utf-8"; 

/*********************
	Common Style
**********************/
.goto-control {display:block; position:absolute; width:100%; height:0; overflow:hidden; bottom:0; left:0; right:0; z-index:-1000; background:#2292e9; text-align:center; color:#fff !important; opacity:0; box-sizing:border-box;}
.goto-control:focus {z-index:9999; opacity:1; height:auto; padding:10px;}


/****************************************************************
	Heading Style
****************************************************************/
#conts h3,
#conts h4,
#conts h5 {display:block; position:relative; line-height:1.5em;}

#conts h3 + *,
#conts h4 + *,
#conts h5 + * {margin-top:2rem;}

#conts h3 {font-weight:700; color:#111; font-size:3.2rem; margin-top:5rem; }
#conts h3.h3{padding-left:4.2rem;background: url(/culture/portal/images/common/bul_h3.png) no-repeat left center;}
#conts * + h3.h3{margin-top:8.5rem;}


#conts h4:first-child {margin-top:0;}
#conts h4 {font-weight:700; color:#111; font-size:2.6rem; margin-top:4rem; display:block; position:relative;}
#conts h4 span {display:inline-block; position:relative;}
#conts h4 span strong {z-index:1; position:relative;}

#conts h5 {font-weight:700;color:#111;font-size:2.0rem;margin-top: 3.5rem;} 
#conts h5.h5{padding-top: .8rem;background: url(/culture/portal/images/common/bul_h5.jpg) no-repeat left top;font-size: 2.2rem;}


/********************
	Line Style
********************/
hr.line {display:block !important; clear:both; height:0px; background:transparent; border-width:0; border-top-width:1px; border-style:solid; border-color:#DDDDDD; margin:2em 0;}
hr.line.point {border-color:#347DDD;}
hr.line.dotted {border-style:dotted;}
hr.line.dashed {border-style:dashed;}
hr.line.bold {border-top-width:2px;}
hr.line.bold2 {border-top-width:4px;}


/****************************************************************
	Text Style
****************************************************************/
#conts em,
#conts .em {color:var(--color-main1);}

#conts strong {font-weight:700;}

#conts .tip {font-size:1.5rem;padding: 0rem 1rem 0rem 2.6rem;margin: 0.2rem 0;border-radius:0.5rem;color: #e8425d;/* background-color:#fdf3f4; */position:relative;line-height: 1.8em;}
#conts .tip:before {content:'!';display:flex;width: 1.7rem;height: 1.7rem;align-items:center;justify-content: center;font-size: 1.2rem;font-weight: 500;position:absolute;left: 0rem;top: 0.5rem;background: #e8425d;border-radius: 3rem;color: #fff;}
#conts .tip.blue {background-color:#f5f6f9; color:#2d55b3;}
#conts .tip.gray {background-color:#f7f7f7; color:#111;}

#conts .tip.blue:before {background:#e1e5f2;}
#conts .tip.gray:before {background:#e3e3e3;}


/****************************************************************
	Box Style
****************************************************************/
.gggggg {background:#fff; padding:3rem; border:1px solid #ddd; position:relative; padding-top:8rem; margin-bottom:5rem;}
.gggggg p.ggg {font-size:1.6rem; color:#111; font-weight:600; margin-bottom:1rem; background:#111; color:#fff; padding:1rem; position:absolute; top:0; left:0; right:0;}
.gggggg p.ggg + h3 {margin-top:0!important;}

.box-txt {display:block; position:relative; border:1px solid #DDD; padding:4rem; background:#FFF; margin-bottom:5rem;}

.bod_guide {display:block; position:relative; margin-bottom:5rem; padding:4rem; border:1px solid #ddd; background:#FFF;}
.bod_guide .icon {position:relative; width:5rem; height:5rem; background:var(--color-main); color:#fff; display:flex; align-items:center; justify-content: center; font-size:2.5rem; border-radius:50%; font-weight:400;}

.bod_guide .tit {font-size:2.4rem; color:#111; font-weight:600; margin:1rem 0;}
.bod_guide ul li {display:block; position:relative; word-break:keep-all;}
.bod_guide ul li + li {margin-top:.2em;}
.bod_guide ul li li li {color:#555; font-size:888889em;}
/* .bod_guide ul > li {padding-left:.833333em;} */
.bod_guide ul ul > li {padding-left:.666667em;}
.bod_guide * + ul {margin-top:1em;}
.bod_guide ul ul {margin:.55em 0;}
.bod_guide li:before  {content:''; display:inline-block; width:0.6rem; height:0.6rem; background:#111; border-radius:50%; transform:translateY(-0.25em); margin-right:0.6rem;}
.bod_guide ul > li:before { width:0.4rem; height:0.4rem;}
 

.guidebox { position:relative; margin-bottom:5rem;  padding:5rem 5rem 4rem 5rem; border-bottom:1px dashed #dedede; display:flex; flex-wrap:wrap; align-items:center; justify-content: space-between; background:#FFF;}
.guidebox:after {content:''; display:block; width:100%; height:4px; background:#f3f3f3; position:absolute; top:0; left:0; z-index:1;}
.guidebox:before {content:''; display:block; width:18rem; height:4px; background:var(--color-main); position:absolute; top:0; left:0; z-index:2;}
.guidebox * {position:relative; z-index:1;}

.guidebox .guideimg {width:12rem;}
.guidebox .guidecon {width:calc(100% - 15rem);}
.guidebox .guidecon p.tit {color:var(--color-main); font-weight:700; font-size:2.2rem; margin-bottom:1rem;}
@media (max-width:768px) {
	.guidebox {padding:3rem;}
	.guidebox .guideimg {display:none;}
	.guidebox .guideimg:has( + .guidecon .tit) { position:absolute; top:2rem; left:2rem; width:5rem; height:5rem; display:block;}
	.guidebox .guideimg:has( + .guidecon .tit) + .guidecon p.tit {padding-left:5rem; margin-bottom:2rem;}

	.guidebox .guidecon {width:100%;}
	
}


/****************************************************************
	List Style
****************************************************************/
.list-ul li,
.list-ol li {display:block;position:relative;line-height:1.5em;word-break:keep-all;}
.list-ul li + li,
.list-ol li + li {margin-top: 0.7rem;}
.list-ul li li,
.list-ol li li {font-size:.95em;}
.list-ul li li li,
.list-ol li li li {color:#777;}

.list-ul > li {padding-left: 1.9rem;font-weight: 500;color: #333;}
.list-ul ul > li,
.list-ol ul > li {padding-left: 1rem;font-weight:400;color:#555;}
.list-ol > li {padding-left:3rem;}
.list-ol ol > li,
.list-ul ol > li {padding-left:1.5rem;}
.list-ul ul > li > ul > li,
.list-ol ul > li > ul > li {padding-left:1rem; font-weight:400; color:#555; }

.list-ul,
.list-ol {margin:0;}

/* .list-ul + *,
.list-ol + * {margin-top:1em;} */

* + .list-ul,
* + .list-ol {margin-top:1rem;}

.list-ul ul,
.list-ul ol,
.list-ol ul,
.list-ol ol {margin:.55rem 0;}


/* List Ul */
.list-ul > li:before,
.list-ul ul > li:before,
.list-ol ul > li:before {content:""; display:block; position:absolute; left:0; background:no-repeat 0 50%; background-size:100% auto;}
.list-ul > li:before {width:1.3rem;height:1.3rem;border-radius:50%;background:url(/culture/portal/images/common/bul_ul.png);top: 0.7rem;}
.list-ul ul > li:before,
.list-ol ul > li:before {width: 0.5rem;height: 0.5rem;background: #c4c4c4;border-radius:3rem;top: 1rem;}
.list-ul ul ul > li:before,
.list-ol ul ul > li:before {width:0.4rem; height:0.4rem; background:#6e6e6e; border-radius:50%; top:1rem;}

/* List Ol */
.list-ol > li > .num,
.list-ol ol > li > .num,
.list-ul ol > li > .num  {display:block; position:absolute; left:0; transform:translateY(-50%); -webkit-transform:translateY(-50%); }
.list-ol > li > .num {font-size:.6667em; width:2em; height:2em; line-height:2em; text-align:center; box-sizing:content-box; top:1.15em; background:#111; color:#fff!important; border-radius:100%; font-weight:600;}
.list-ol ol > li {padding-left:3rem;}
.list-ol ol > li > .num,
.list-ul ol > li > .num {font-size:1em; top:.75em; line-height:1.5em; color:#222222; font-weight:600;}
.list-ol ol > li > .num:after,
.list-ul ol > li > .num:after {content:". ";}
.list-ol ol > li li {padding-left:2.5rem;}
.list-ol ol > li li > .num,
.list-ul ol > li li > .num {color:#fff;}

li .progress {display:inline !important; margin:0 !important; vertical-align:bottom;}
.progress li {display:inline-block !important; position:relative; margin:0 .55em 0 0 !important; font-size:1em !important; padding:0 !important; vertical-align:middle; line-height:inherit;}
.progress li:first-child:before {display:none;}
.progress li + li {padding-left:1.889em !important;}
.progress li:before {top:.1em !important; left:0; width:1.33em !important; height:1.33em !important; background:url(../img/ico_progress_arrow.svg) no-repeat 50% 50% !important; background-size:contain !important;}

/* li:has(.box):before {display:none!important;} */


/*********************************************
	Table
*********************************************/

.tbl {width:100%; table-layout:fixed; vertical-align:initial;}
.tbl th,
.tbl td {box-sizing:border-box;padding: 2.4rem 4rem;border: 1px solid #dddddd;border-top-width:0;font-size:1.6rem;word-break: break-all;}
.tbl thead,
.tbl tbody {border-top:3px solid var(--color-main);}
.tbl thead {background: #f5f9fc;}
.tbl thead + tbody  {border-top-width:0;}
.tbl thead th {font-weight: 500;border-color: #dcd6e0;}
.tbl tbody th {background: #f9f9f9;}

.tbl-respon {position:relative;margin-top: 1.5rem;}
.tbl-respon > .guide {display:none; font-weight:300; padding-bottom:0; line-height:1.11112em; position:relative;}
.tbl-respon > .guide {position:absolute; top:.2em; left:0;}
.tbl-respon > .guide:before {content: "\ea62"; display:inline-block; font-family: remixicon !important; font-style: normal; -webkit-font-smoothing: antialiased;}

.tbl-box {position:relative;}
.tbl-legend {display:block; position:relative; text-align:right; font-weight:300; color:#555; padding-bottom:.55em;}

.tbl tr td:first-child,
.tbl tr th:first-child {border-left:0;}

.tbl tr td:last-child,
.tbl tr th:last-child {border-right:0;}

@media all and (max-width:1000px) {
	.tbl-respon > .guide {display:block;}
	.tbl-respon .tbl-box {overflow:auto;}
	.tbl-respon .tbl {width:56em; margin-top:2em;}
	.tbl-respon .tbl-legend {width:100%; width:56em;}
	.tbl-respon .tbl-legend + .tbl {margin-top:0;}
}
@media all and (max-width:640px) {
	.tbl-respon > .guide {position:relative; top:auto;}
	.tbl-respon .tbl{margin-top:1rem;}
	.tbl-respon .tbl-legend {text-align:left; margin-top:.2em;}
}






/********************************************
	Step Flow
********************************************/

.box-stepflow { opacity:0; transition:.3s all; -webkit-transition:.3s all;}
.box-stepflow.complate {opacity:1;}
.stepflow {display:grid;position:relative;flex-wrap:wrap;gap: 0rem 5rem;}
.stepflow.cols-4{grid-template-columns: repeat(auto-fill, minmax(20%, 1fr));grid-template-rows: repeat(1, minmax(21rem, auto));}
.stepflow:after {content:""; display:block; clear:both;}
.stepflow > li {display:block; position:relative; }
.stepflow > li:after {content:"\EA6E";display:flex;position:absolute;top:50%;bottom:0;right: -2.5rem;font-size: 2rem;width: 3.5rem;height: 3.5rem;transform: translate(50%, -50%);align-items:center;justify-content:center;border-radius:50%;background: #f3f3f3;color: #333;font-family: remixicon !important;font-style: normal;-webkit-font-smoothing: antialiased;}
.stepflow > li:last-child:after{display:none;}

.stepflow .item {display:flex;position:relative;padding:1.11rem;z-index:0;text-align:center;border: 5px solid #f3f3f3;border-radius: 2.5rem;height: 100%;flex-direction: column;align-items: center;justify-content: center;}
.stepflow .item .num span{display:flex;width:4rem;height:4rem;border-radius:2rem;background:#0167ba;color:#fff;font-weight: 700;align-items:center;justify-content:center;margin: 0 auto 3rem;}
.stepflow .item .tit { width:100%; font-weight:800; color:#111; text-align:Center;}
.stepflow .item .tit span {display:block;}
.stepflow .item .tit:before{content:'step01'; display:block; font-size:1rem; color:#727272; width:100%; font-weight:500; text-transform: uppercase;}
.stepflow li:nth-of-type(1) .item .tit:before {content:'step01';}
.stepflow li:nth-of-type(2) .item .tit:before {content:'step02';}
.stepflow li:nth-of-type(3) .item .tit:before {content:'step03';}
.stepflow li:nth-of-type(4) .item .tit:before {content:'step04';}
.stepflow li:nth-of-type(5) .item .tit:before {content:'step05';}
.stepflow li:nth-of-type(6) .item .tit:before {content:'step06';}
.stepflow li:nth-of-type(7) .item .tit:before {content:'step07';}
.stepflow li:nth-of-type(8) .item .tit:before {content:'step08';}
.stepflow li:nth-of-type(9) .item .tit:before {content:'step09';}
.stepflow li:nth-of-type(10) .item .tit:before {content:'step010';}


.stepflow .item .tit > * {display:table-cell; vertical-align:middle; text-align:center; box-sizing:border-box; line-height:2.52rem; font-weight:800; color:#111; font-size:1.8rem;}


.stepflow .item .con {position:relative;box-sizing:border-box;font-size: 1.8rem;}
.stepflow .item .tit + .con {padding-top:2.24rem;}
.stepflow .item .tit + .con:before {content:""; display:block; position:absolute; top:1.12rem; left:0; right:0; height:1px; border-top:1px dashed #DFE4EF;}

@media all and (max-width:1024px) {
	.stepflow{gap:0 1.5rem;}
	.stepflow > li {padding:1rem 1rem;}
	.stepflow > li:after {width:2rem; height:2rem; right:-.7rem;}
	.stepflow .item {padding:1rem;}
	.stepflow .item .tit > * {line-height:2rem; font-size:1.4rem;}
	.stepflow .item .tit + .con {padding-top:1.6rem;}
	.stepflow .item .tit + .con:before {top:.8rem;}
}
@media all and (max-width:768px){
	.stepflow.cols-4{grid-template-columns: repeat(auto-fill, minmax(40%, 1fr));grid-template-rows:initial;}
	.stepflow .item .num span {margin:0 auto 1rem;}
	
}

/********************************************
	Board
********************************************/
.boardWrap {display:block; position:relative; margin-bottom:5rem; }	

.board-top { display: flex; justify-content: space-between; align-items: center; padding-bottom: 1.5rem; }
.board-top .page-info { font-size: 1.6rem; color: #444; display: flex; align-items: center; gap: 0.5rem; }
.board-top .page-info i { color: #ccc; font-size: 1.8rem; }
.board-top .page-info strong { color: var(--color-point); font-weight: 700; }

.board-search { align-items: center; min-width: 35rem; display:flex;}
.board-search select.search-select { padding: 0 4rem 0 2.5rem; border: none;  font-size: 1.6rem; color: #111; font-weight: 500; cursor: pointer;  height: 4.4rem !important; border:0!important;  }
.board-search input[type="text"] {  height: 4.4rem !important; padding: 0 2rem !important; flex: 1; font-size: 1.6rem; background: transparent; }
.board-search .search-btn { width: 4.4rem; height: 4.4rem; background: #000; color: #fff; border: none; border-radius:0.5rem; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: background 0.3s; }
.board-search .search-btn:hover { background: var(--color-main); }
.board-search .search-btn i { font-size: 2.2rem; }
.board-search .search-btn span { text-indent: -9999px; position: absolute; }


/* 리스트형 게시판 */
.board-list {border-top: 2px solid #111; }
.board-list ul li { display: block; border-bottom: 1px solid #f2f2f2; }
.board-list ul li a { display: flex; align-items: center; padding: 3.5rem 2rem; text-decoration: none; transition: background 0.2s; }
.board-list ul li a:hover .title{ text-decoration: underline;}
.board-list ul li:nth-child(even) a{ background: #fafafa; }
.board-list ul li a .num { width: 8rem; text-align: center; font-size: 1.8rem; color: #111; font-weight: 500; flex-shrink: 0; }
.board-list ul li a .notice .num i { font-size:3rem; color: #111; }
.board-list ul li a .title { flex: 1; font-size:2rem; color: #111; font-weight: 500; padding: 0 2rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.board-list ul li a .notice .title { font-weight: 700; }
.board-list ul li a .info { display: flex; align-items: center; gap: 0; flex-shrink: 0; }
.board-list ul li a .info span { display: flex; align-items: center; font-size: 1.8rem; color: #333; }
.board-list ul li a .info .date {margin-right:5rem;}
.board-list ul li a .info .hit { justify-content: flex-end;}
.board-list ul li a .info .hit strong { font-weight:400!important; width:7rem; text-align:center;}
.board-list ul li a .info span em { font-style: normal; color: #888!important; font-weight: 400; font-size: 1.6rem; width: 6rem; flex-shrink: 0; }

/* 테이블형 게시판 */
table.board { width:100%; text-align:center; table-layout: fixed;}
table.board thead th {padding:2rem 1rem; border-bottom:1px solid #dedede; background:#fafafa; font-weight:600;}
table.board tbody td {padding:2rem 1rem; border-bottom:1px solid #dedede; vertical-align: middle; word-break:break-word;}
table.board tbody tr:nth-child(even) { background: #fafafa; }
table.board tbody tr td a {white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width:100%; display:block; }
table.board tbody tr td a:hover {text-decoration: underline;}

/* 갤러리형 게시판 */
.gallery-list {display:grid; grid-template-columns: repeat(auto-fill, minmax(25rem, 1fr)); gap:2rem;}
.gallery-list li {border:1px solid #dedede; text-align:center; border-radius:0.5rem; overflow:hidden; transition: all .2s;}
.gallery-list li:has(a:hover) {box-shadow:0.5rem 0.5rem 0.5rem rgba(0,0,0,0.1); border:1px solid #999;}
.gallery-list li .thum img {max-width:100%; object-fit: cover;}
.gallery-list li .thum {display:flex; align-items: center; justify-content: center; aspect-ratio: 1/0.65; overflow:hidden; background:#f2f2f2;}
.gallery-list li .title {padding:1rem; font-weight:600;}

/* Q&A */
.qna-list {border-top: 2px solid #333; } 
.qna-item {border-bottom: 1px solid #dedede; } 
.question-row {display: flex;align-items: center;padding:2.5rem 2rem;cursor: pointer;transition: background-color 0.2s; } 
.question-row:hover {background-color: #f9f9f9; } 
.qna-item.active .question-row {background-color: #f5f7fa;border-bottom: 1px solid #dedede; } 
.qna-item .title {flex-grow: 1; font-weight: 500; display:flex; align-items:center; gap:1rem; } 
.qna-item .title:before {content:'Q'; font-size:4.6rem; font-weight:700; color:#2835ad; line-height:1em; } 
.qna-item .author {flex-shrink: 0;width: 10rem;text-align: center; } 
.qna-item .date {flex-shrink: 0;width: 12rem;text-align: center;color: #666; } 
.qna-item .toggle-btn {flex-shrink: 0;width: 40px;text-align: center;font-size: 2rem;transition: transform 0.3s; } 
.qna-item.active .toggle-btn {transform: rotate(180deg); } 
.answer-panel {display: none;padding: 2rem;background-color: #fbfbfb; } 
.answer-panel .a-content {padding: 2rem;background: #fff;border: 1px solid #eee;border-radius: 0.5rem; position: relative;padding-left:4.5rem; }
.answer-panel .a-content:before { position: absolute; top: 1.7rem; left: 1.5rem; font-family: "remixicon"; font-size: 2rem; font-weight: 400; content: '\F043'; color: #e61e60; }


@media (max-width:768px) {
	.board-top { flex-direction: column; align-items: flex-start; gap: 1.5rem; }
	.board-search { width: 100%; min-width: auto; display:flex; flex-wrap:wrap;}
	.board-search > * {width:100%;}

	
	.board-list ul li a { padding: 2.5rem 1.5rem; flex-wrap: wrap; }
	.board-list ul li a .num { width: 5rem; font-size: 1.6rem; }
	.board-list ul li a .title { font-size: 1.8rem; width: calc(100% - 6rem); padding: 0 1rem; }
	.board-list ul li a .info { width: 100%; padding-left: 6rem; margin-top: 1rem; gap: 2rem; }
	.board-list ul li a .info span { font-size: 1.6rem; }

	/* 테이블형 게시판 반응형 변환 */
	.board-list table.board { table-layout: auto; }
	.board-list table.board thead { display: none; }
	.board-list table.board colgroup { display: none; }
	.board-list table.board tbody tr { display:flex; flex-wrap:wrap; padding: 2.5rem 1.5rem; border-bottom: 1px solid #f2f2f2; }
	.board-list table.board tbody tr:nth-child(even) { background: #fafafa; }
	.board-list table.board tbody td { display: block; width: 100% !important; padding: 0 !important; text-align: left !important; border: none !important; background: none !important; }

	table.board tbody td.num { font-size: 1.6rem; color: #111; font-weight: 600; margin-bottom: 0.8rem; display:none;}
		table.board tbody td.num:has(i) { display: block;}
	table.board tbody td.num i { color: #f81c4b; } /* 공지 아이콘 보강 */
	table.board tbody td.title { margin-bottom: 1.2rem; }
	table.board tbody td.title a { font-size: 1.9rem; font-weight: 500; white-space: normal; height: auto; padding: 0; line-height: 1.4; }
	
	table.board tbody td.writer,
	table.board tbody td.date { display: inline-block; width: auto !important; vertical-align: middle; font-size: 1.5rem; color: #888; }
	table.board tbody td.file{ display: none;}
	table.board tbody td.writer:after { content: '·'; margin: 0 1rem; font-weight: 700; opacity: 0.5; }
	table.board tbody td.file { margin-right: 1.5rem; }
	table.board tbody td.file i { font-size: 1.8rem; vertical-align: -0.2rem; }

	.question-row {flex-wrap:wrap; position:relative;}
	.qna-item .title {align-items: flex-start; margin-bottom:1rem; width:calc(100% - 4rem); flex-grow: initial;}
	.qna-item .title:before {font-size:3rem; transform: translateY(-0.2rem);}
	.qna-item .author, .qna-item .date {align-items: flex-start; width:auto; font-size:1.6rem;}
	.qna-item .author {margin-left:3.2rem; margin-right:2rem;}
	.qna-item .toggle-btn {position:absolute; top:calc(50% - 2rem); right:0;}
	.qna-item.active .question-row {background-color: #f5f7fa;border-bottom: none;  }
	.qna-item .answer-panel {background-color: #f5f7fa; padding-top:0;}
	/* .qna-item .answer-panel .a-content {padding:1rem; padding-left:3rem;} */
}

@media (max-width: 640px) {
	.board-list ul li a .info { flex-direction: column; align-items: flex-start; gap: 0.5rem; }
	.board-list ul li a .info .hit {justify-content: flex-start;}
	.board-list ul li a .info .hit strong {text-align: left; width:20rem;}

	/* 모바일 상세 조정 */
	table.board tbody tr { padding: 2rem 1rem; }
	table.board tbody td.title a { font-size: 1.7rem; }
	table.board tbody td.writer:after { margin: 0 0.6rem; }
	table.board tbody td.file { margin-right: 0.8rem; }
}

.paging-wrap {display:flex; align-items: center; justify-content:center; margin-top:5rem; position:relative; margin:5rem 0; }
.paging { display:flex; }
.paging a {width:3.6rem; height:3.6rem; background:#fff; display:inline-block; overflow:hidden; align-content: center; text-align:center; border:1px solid #dedede; border-radius:0.3rem; margin:0 0.2rem;}
.paging a:hover {background:#f9f9f9; text-decoration: underline;}
.paging a.on {background:#333; color:#fff; text-decoration: underline; border:1px solid #333;}
.paging a i + span {display:none;}
.paging-wrap .btn-wrap {position:absolute; top:50%; right:0; transform:translateY(-50%);}
@media (max-width:768px) {
	.paging-wrap {flex-direction: column; gap:1rem;}
	.paging a {width:3rem; height:3rem;}
	.paging-wrap .btn-wrap {position:static; transform:none; margin-top:4rem;}
}


/* 글쓰기 */
.board_write {border-top:2px solid #333; width:100%; text-align:left; font-size:1.6rem;}
.board_write tr {border-bottom:1px solid #ededed;}
.board_write tr.hidden {display:none;}
.board_write tr th,
.board_write tr td {padding:1.5rem; align-content: center; color:#333;}
.board_write tr th {font-weight:700; background:#fafafa; text-align:center; }
.board_write tr td .caution {font-size:1.6rem; display:flex; margin-top:1rem; }
.board_write tr td .caution:before {content:'\EF46'; display:inline-block; font-family: remixicon !important; font-style: normal;    -webkit-font-smoothing: antialiased; font-size:1.8rem; color:#999; transform: translateY(-0.2rem); margin-right:0.3rem;}
.board_write tr td .caution em {color:#ff3300!important;}
.board_write tr th span.red {color:#ff0000;}

.board_write tr td div.inbox {padding:1rem 0;/*  border-top:1px solid #dedede;  */}
.board_write tr td div.inbox strong {font-weight:700; color:#000;}

.board_write tr.col-group > td {padding:0!important;}
.board_write tr.col-group > td > table tr {border-bottom:none;}
.board_write tr.col-group > td > table tr td {padding:1rem 0.5rem;}
.board_write tr.col-group > td > table tr[data-main-row] td select,
.board_write tr.col-group > td > table tr[data-main-row] td input {width:100%!important;}
.board_write tr.col-group > td > table tr[data-detail-row] td {padding:1rem 0;}
.board_write tr.col-group > td > table tr[data-detail-row] td > div{display:flex; flex-wrap:wrap; padding-left:5%; position:relative;}
.board_write tr.col-group > td > table tr[data-detail-row] td > div:before {content:'\f309'; display:block; font-family: remixicon !important; font-style: normal; -webkit-font-smoothing: antialiased; position:absolute; top:0; left:2rem; font-size:3rem; color:#ccc;}
.board_write tr.col-group > td > table tr[data-detail-row] div.itemsGroup {width:38%; text-align:left; border-left:1px solid #e9e9e9; padding:0 2rem;}
.board_write tr.col-group > td > table tr[data-detail-row] div.itemsGroup:first-child {width:24%; border-left:none;}
.board_write tr.col-group > td > table tr[data-detail-row] div.itemsGroup div {margin:0.5rem 0; font-weight:700; display:flex; align-items:center;}
.board_write tr.col-group > td > table tr[data-detail-row] div.itemsGroup div strong {min-width:9rem; flex-shrink:0; }
.board_write tr[data-detail-row] {background:#fafafa;}
.board_write td div.datepic{display:flex; align-items: center;}
.board_write input.hasDatepicker + .ui-datepicker-trigger {width:4.4rem;height:4.4rem; border-radius:0.5rem; border:1px solid #dedede; padding:1rem; transform:translateY(1.8rem); margin-top:-1.8rem;}

.file_list li + li { margin-top: 8px; }
.file_list > li a:hover,
.file_list > li a:focus {color:#333 !important; text-decoration:none;}
.file_list > li a >span {line-height:1.5em;}
.file_list .file_size {color:#afb9c6; font-size:1.2rem;}


.file-upload-area h4 {color:#000; font-weight:700; position:relative; font-size:1.8rem!important;}
.file-upload-area .file_list {background-color:#fff;}
.file-upload-area .file_list > li {background:#fff; border:1px solid #dcdcdc; padding:1rem; border-radius:0.5rem;}
.file-upload-area .file_list > li > div {display:block; position:relative; padding-right:7.5rem;  line-height:30px;}
.file-upload-area .file_list > li > div .btn.red {position:absolute; top:0; right:0; margin-top:0; margin-right:0 !important; line-height:normal;}
.file-upload-area .file_list > li > div + div {padding-right:0;}
.file-upload-area .file_list > li {margin-top:1rem;}
.file-upload-area .no_data {padding:1rem; background-color:#f4f5f9; border-radius:0.5em; text-align:center; font-size:1.3rem; color: #b0b3c0;}

.file-upload-area .drag_and_drop {background-color:#f4f5f9; text-align:center; color:#666; border-radius:0.5rem; padding:1rem;}
.file-upload-area .drag_and_drop span {display:block; margin:0; padding:0; color: #b0b3c0; font-size:1.3rem; padding-top:1rem;}
.file-upload-area .drag_and_drop .tit {font-size:1.6rem;}
.file-upload-area .drag_and_drop .tit i {font-size:3rem; display:block;}

.file_list > li a.download {position:relative; border-radius:3px; color:#8895a7; letter-spacing:-1px; cursor:pointer; font-size:1.4rem !important; display:inline-block; vertical-align:middle;}
.file_list > li a.download:hover {color:#000; text-decoration:none;}
.file_list > li a.download::before {content:'\EC53'; display:inline-block; align-content: center; font-family: remixicon !important; font-style: normal; -webkit-font-smoothing: antialiased; font-size:1.8rem; margin:0 0.5rem 0 0;  }

.file_list .label {display:flex; position:relative; overflow:hidden; margin-top:1rem; border-radius:0.5rem; font-size:1.4rem;}
.file_list .label label { width:6rem; text-align:center; background:#333; padding:0;  align-content:center; color:#fff;}
.file_list .label input[type="text"] {margin:0 !important; background:#f4f5f9; border-left-width:0 !important; width:100%; font-size:1.3rem;}
.file_list .label input::placeholder {font-size:1.3rem; color: #b0b3c0;}

.dragging {opacity:0.2;}
.drag-placeholder { background: #cc0000; border: 2px dashed #90a4ae; min-height: 36px; }

.flex-SB {display:flex; justify-content: space-between;}
@media (max-width:768px) {
	.board_write {border-bottom:1px solid #333;}
	.board_write tr {display:flex; flex-direction:column; border-bottom:0; }	
	.board_write tr th {width:100%; text-align: left; font-size:2rem; padding:2rem 1rem 1rem 1rem;  border-top:1px solid #dedede; background:#fff;}
	.board_write tr td {width:100%; padding:0 1rem 2rem 1rem;}
	.board_write tr:nth-child(2n) th,
	.board_write tr:nth-child(2n) td{background:#fafafa;}
	.flex-SB {justify-content: flex-end; }
	.flex-SB div:nth-child(1) {order:2; margin-left:0.3rem;}
	.flex-SB div:nth-child(2) {order:1;}
}

/* board_view */
.board_view {border-top:2px solid #333; width:100%; text-align:left; font-size:1.6rem;}
.board_view {border-bottom:1px solid #333;}
.board_view .title {border-bottom:1px solid #ededed; background:#fafafa;}
.board_view .title p {font-size:2rem; color:#111; padding:3rem 2rem; font-weight:700; word-break:break-word;}
.board_view .title p em {color:#ff6600!important; font-size:1.6rem;  display:flex;}
.board_view .info {display:flex; flex-wrap:wrap; padding:2rem; border-bottom:1px solid #ededed;}
.board_view .info li {display:flex; align-items:center; }
.board_view .info li:after {content:''; display:inline-block; width:0.4rem; height:0.4rem; border-radius:50%; background-color:#dedede; margin:0 2rem;}
.board_view .info li:last-child:after {display:none;}
.board_view .info li .label { margin-right:1rem; color:#666;}
.board_view .info li .value {color:#111; font-weight:600;}
.board_view .files {padding:2rem; border-bottom:1px solid #ededed; display:flex; align-items:center; flex-wrap: wrap;}
.board_view .files a {display:flex; align-items:center; border:1px solid #ededed; border-radius: 0.5rem; padding:0.5rem 1.5rem; margin-right:1rem; font-weight:300;} 
.board_view .files a i:first-child {margin-right:0.5rem;}
.board_view .files a i:last-child {margin-left:0.5rem;}

.board_view_content {padding:2rem 2rem 4rem 2rem;}
.board_view_content .thum {margin-bottom:2rem;}
.board_view_content .thum img {max-width:100%;}

.nuri {position:relative;}
.nuri p {display:flex; align-items:center; border:1px solid #dedede; border-radius:0.5rem; margin:1rem; padding:1rem; justify-content: center; flex-wrap:wrap;}
.nuri p img {margin-right:1rem; height:4rem;}
.nuri p span {font-weight:600;}

@media (max-width:768px) {
	.board_view .title p,
	.board_view .info,
	.board_view .files,
	.board_view_content { padding-left:1rem; padding-right:1rem; }
}



/************************************
설문조사
************************************/
.qstn_ul {position:relative;}
.qstn {position:relative; display:flex; flex-wrap:wrap; justify-content:space-between; width:100%; margin-top:5rem;/* border:1px solid #dedede; padding:2rem; border-radius:1rem; */}
.qstn:first-child {margin-top:0;}
.qstn .title {width:100%; border-bottom:2px solid #1c2d7c; font-size:1.8rem; font-weight:700; }
.qstn .title span {color:#fff; background:#1c2d7c; padding:0.8rem 2rem; border-radius:1rem 1rem 0 0; display:inline-block; font-size:1.6rem; font-weight:400; margin-right:1rem;}
.qstn .qstn-img-area {width:100%; text-align:center; }
.qstn .qstn-img-area img {max-width:100%; }
.qstn .qstn-content-area {width:100%; padding:1rem 0; font-weight:400; font-size:1.8rem;}
.qstn .qstn-img-area:has( img) {border-bottom:1px solid #dedede; padding:1rem;}

.qstn .sub_qstn_ul:has( li) {width:100%; background:#fafafa; border:1px solid #dedede; padding:2rem; border-radius:1rem; margin-top:2rem;}
.qstn .title {display:flex; align-items:center;}
.qstn .title span {align-content: center; height:100%;}


.qitem_ul li {margin:0.5rem 0 0.5rem 0; font-weight:400; font-size:1.8rem;}
.qitem_ul li > div:has( img) {padding-left:2.5rem;}
.qstn img {max-width:100%;}

.survey-info {position:relative; margin-bottom:8rem;}
.survey-info .title {background:var(--color-main); color:#fff; padding:1.5rem 2rem; font-size:1.8rem; font-weight:600; text-align:center; border-radius:1rem; margin-bottom:1rem;}
.survey-wrap {display:grid; grid-template-columns:30% 1fr; gap:3rem;}
.survey-wrap .survey-img {background:#f2f2f2; display:flex; align-items:center; justify-content:center; border-radius:1rem; overflow:hidden; height:100%;}
.survey-wrap .survey-img img {max-width:100%;}
.survey-wrap .survey-img:not(:has( img)):before{content:'설문 이미지가 없습니다.';}
.survey-wrap .survey-con ul li {display:flex; margin:1rem 0;}
.survey-wrap .survey-con ul li strong {flex-shrink:0; width:10rem;}
.survey-headcopy {margin-top:3rem; padding:1rem 0 3rem; border-bottom:1px solid #dedede;}
.survey-headcopy img {max-width:100%;}

.survey-footcopy {margin-top:3rem; padding:3rem 0 3rem; border-top:1px solid #dedede; border-bottom:1px solid #dedede;}

.survey-result {position:relative; margin-top:5rem;}
.survey-result dt {width:100%; border-bottom:2px solid #1c2d7c; font-size:1.8rem; font-weight:700;}
.survey-result dt span.tit {color:#fff; background:#1c2d7c; padding:0.8rem 2rem; border-radius:1rem 1rem 0 0; display:inline-block; font-size:1.6rem; font-weight:400; margin-right:1rem;}
.survey-result-list {position:relative; width:100%;}
.survey-result-list li {display:flex; flex-wrap:wrap; align-items:center; justify-content: space-between; margin:1rem 0; position:relative;}
.survey-result-list li p {font-weight:700; color:#000; width:100%; margin-bottom:0.5rem;}
.survey-result-list li .bar-warp {width:calc(100% - 20rem); height:1.5rem; border-radius:3rem; background:#f2f2f2; position:relative; overflow:hidden;}
.survey-result-list li .bar-warp span {position:absolute; top:0; left:0; background:#19b921 url(/common/images/patten01.png); height:100%; border-radius:3rem;}


.survey-result-list li > ul {padding-left:2rem; position:relative;}
.survey-result-list li > ul:before {content:''; display:block; width:1px; height:calc(100% - 58px); background:#dedede; position:absolute; top:0; left:1rem;}
.survey-result-list li > ul > li:before {content:''; display:block; width:0.5rem; height:2px; background:#dedede; position:absolute; top:0.8rem; left:-1rem;}
.survey-result-list li > ul > li p {font-weight:400;}
.survey-result-list li > ul > li .bar-warp span {position:absolute; top:0; left:0; background:#c4b52f url(/common/images/patten01.png); height:100%; border-radius:3rem;}

.text-box {border:1px solid #dedede; padding:2rem; width:100%; margin-top:2rem; border-radius:1rem; display:none;}
.text-box>ul {max-height:30rem; overflow-y: auto;}
.text-box>ul>li {border-bottom:1px dashed #dedede; padding:1rem; display:flex; line-height:1.6em; justify-content: flex-start; flex-wrap: nowrap;}
.text-box>ul>li>span:first-child {flex-shrink:0; width:8rem;}
.survey-result-list > li.on .text-box {display:block;}


.metrix_write {border-top:1px solid #777; width:100%; text-align:left; font-size:1.6rem; min-width:560px;  }
.metrix_write tr th,
.metrix_write tr td {padding:1.5rem; align-content: center; color:#333; border:1px solid #ededed;}
.metrix_write tr th {font-weight:700; background:#fafafa; text-align:center; }

@media (max-width:768px) {
.survey-wrap {display:grid; grid-template-columns:1fr; gap:1rem;}
.qstn-content-area:has(.metrix_write) {overflow-x: auto;}
}


/* Survey List Utils */
.st {display:inline-block; padding:0.5rem 1.2rem 0.3rem 1.2rem; border-radius:0.5rem; font-size:1.4rem; font-weight:600; text-align:center; min-width:6rem; vertical-align: middle;}
.st.ongoing {background-color:#1b9937; color:#fff;}
.st.ended {background-color:#eee; color:#999;}
.st.waiting {background-color:#fff3e0; color:#ef6c00;}

.survey-list-table thead th {padding: 1.4rem .6em; background:#fafafa;}
.survey-list-table td {padding: 1.4rem .6em;}
.survey-list-table tr.disabled td {color:#aaa;}
.survey-list-table tr.disabled a {pointer-events:none; cursor:default; color:#aaa; text-decoration:none;}
.survey-list-table tr.disabled .st.ongoing {background-color:#ccc;}

/* Survey List Responsive */
@media (max-width:1024px) {
    /* 가로 스크롤 방지 및 카드형 전환을 위해 테이블 자체를 블록으로 변경 */
    .survey-list-table { display: block !important; width: 100% !important; margin-top: 0 !important; table-layout: auto !important; }
   
    
    .survey-list-table thead, 
    .survey-list-table colgroup { display: none; }
    .survey-list-table tbody {display:flex; flex-wrap:wrap; width: 100%; gap:2rem;  justify-content: space-between;}
    .survey-list-table tbody tr { display:flex; justify-content: flex-start; flex-direction:column; flex-wrap:wrap; padding:1.5rem; border: 1px solid #dedede; position: relative; border-radius:0.5rem; width:calc(50% - 1rem); }
    .survey-list-table tbody td { display: block; width: 100% !important; padding: 0.5rem 0 !important; text-align: left !important; border: none !important; background: none!important; }
    
    .survey-list-table .num {display:none;}
    .survey-list-table .title {order:2; font-size:2rem; font-weight:700;}
    .survey-list-table .status {order:1;}
    .survey-list-table .public {order:5; display:none;}
		.survey-list-table .public:has(a) {display:block;}
		.survey-list-table .public a {width:100%; text-align:center; padding:1rem; height:auto;}
    .survey-list-table .count {order:4;}
    .survey-list-table .date {order:3;}
}	

@media (max-width:768px) {
	.survey-list-table tbody tr { width:100%; }
}



.loginWrap, .authWrap { max-width:50rem; margin: 8rem auto; }
.login-tab, .auth-tab { display: flex; margin-bottom: -1px; }
.login-tab a, .auth-tab a { flex: 1; height: 5.4rem; display: flex; align-items: center; justify-content: center; background: #f8f9fa; border: 1px solid #e4e4e4; color: #777; font-size: 1.6rem; font-weight: 500; text-decoration: none; border-radius: 6px 6px 0 0; }
.login-tab a.on, .auth-tab a.on { background: #fff; border-color: #c6c6c6; border-bottom-color: #fff; color: #111; font-weight: 700; position: relative; z-index: 1; }
.login-tab a + a, .auth-tab a + a { margin-left: -1px; }
.login-tab-con, .auth-tab-con { display: none; padding: 4rem 3rem 3rem; border: 1px solid #c6c6c6; background: #fff; border-radius: 0 0 6px 6px; box-shadow: 0 2px 8px rgba(0,0,0,0.05); }
.login-tab-con.on, .auth-tab-con.on { display: block; }
.login-tab-con p.icon, .auth-tab-con p.icon {display:flex; align-items:center; justify-content:center; height:10rem; width:10rem; margin:0 auto; background:#f8f8f8; border-radius:50%;}
.login-tab-con p.icon img, .auth-tab-con p.icon img {width:8rem;}
.login-tab-con h4, .auth-tab-con h4 { font-size: 2.2rem; font-weight: 700; margin-bottom: 3rem; text-align: center; }
.login-input { position: relative; border: 1px solid #c6c6c6; padding: 1.2rem 1.5rem; background: #fff; }
.login-input:first-of-type { border-radius: 6px 6px 0 0; }
.login-input + .login-input { border-top: none; border-radius: 0 0 6px 6px; margin-bottom: 2rem; }
.login-input label { display: block; font-size: 1.3rem; color: #8e8e8e; margin-bottom: 0.4rem; font-weight: 500; }
.login-input input { width: 100%; border: none; padding: 0.5rem 4rem 0.5rem 0; font-size: 1.8rem; font-weight: 600; color: #111; outline: none; background: transparent; }
.login-input input::placeholder { color: #ccc; font-weight: 400; }
.loginWrap .btn { width: 100%; height: 5.6rem; border-radius: 6px; font-size: 1.8rem; font-weight: 700; cursor: pointer; transition: all 0.2s; border: 1px solid #dedede; background: #fff; color: #333; margin-bottom: 1rem; display: flex; align-items: center; justify-content: center; }
.loginWrap .btn i {font-weight:400;}
.loginWrap .btn.indigo { background: #03c75a; border-color: #03c75a; color: #fff; margin-top: 1rem; }
.loginWrap .btn.indigo:hover { background: #02b350; }
.loginWrap .btn i { margin-right: 0.8rem; font-size: 2rem; }
.loginWrap > div:last-child { display: flex; justify-content: center; gap: 2rem; margin-top: 3.5rem; }
.loginWrap > div:last-child a { font-size: 1.45rem; color: #888; text-decoration: none; position: relative; }
.loginWrap > div:last-child a + a:before { content: ''; width: 1px; height: 1.2rem; background: #dadada; position: absolute; left: -1rem; top: 52%; transform: translateY(-50%); }
.loginWrap > div:last-child a:hover { text-decoration: underline; color: #555; }
.authWrap .copy { text-align: center; margin-bottom: 3rem; color: #666; font-size: 1.6rem; }
.authWrap .btn.indigo { background: #03c75a; border-color: #03c75a; color: #fff; width:100%; height:5.6rem; border-radius: 6px; font-size: 1.8rem; font-weight: 700; cursor: pointer; transition: all 0.2s; display: flex; align-items: center; justify-content: center; }
.authWrap .btn.indigo:hover { background: #02b350; }
.pw-toggle { position: absolute; right: 1.5rem; bottom:3rem; background: none; border: none; font-size:2rem; color: #bbb; cursor: pointer; padding: 0; line-height: 1; transition: color 0.2s; z-index: 5; } .pw-toggle:hover { color: #666; }

@media (max-width:560px) {
.login-tab-con, .auth-tab-con {padding: 4rem 1.5rem 3rem;}
}

.idresult p {text-align:center; font-size:2rem;}
.idresult p span {font-weight:700; color:#03c75a;}

.login-input.allradius {border-radius: 6px!important; margin-bottom:1rem;}
.login-input.first {border-radius: 6px 6px 0 0!important;}
.login-input.second {border-radius: 0 0 6px 6px!important;}

/* 개인정보 수집 및 이용 안내 */

.privacy-tit { font-size: 2.2rem; font-weight: 800; color: #111; margin-bottom: 1.5rem; letter-spacing: -1px; }
.privacy-box { border: 1px solid #dedede; background: #fafafa; padding: 3rem; border-radius: 0.5rem 0.5rem 0 0; max-height:30rem; overflow-y:auto; scrollbar-width: thin; scrollbar-color: rgba(0,0,0,0.2) transparent; }
.privacy-box::-webkit-scrollbar { width: 6px; }
.privacy-box::-webkit-scrollbar-track { background: transparent; }
.privacy-box::-webkit-scrollbar-thumb { background: rgba(0,0,0,0.2); border-radius: 10px; }
.privacy-box::-webkit-scrollbar-thumb:hover { background: rgba(0,0,0,0.4); } 
.privacy-warn { font-size: 1.4rem; font-weight: 500; color: #eb5959; }
.privacy-warn span { font-weight: 700; margin-right: 0.5rem; letter-spacing: -1px; }
.privacy-agree { border: 1px solid #dedede; padding: 2rem; border-radius: 0 0 0.5rem 0.5rem; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; border-top:0;}
.privacy-agree .checkbox-ui { display: flex; align-items: center; }
.privacy-agree .checkbox-ui input[type="checkbox"] { width: 1.7rem; height: 1.7rem; margin-right: 1rem; cursor: pointer; border: 1px solid #ccc; accent-color: #333;}
.privacy-agree .checkbox-ui label { font-size: 1.6rem; color: #111; font-weight: 500; cursor: pointer; }

@media (max-width:768px) {
	.privacy-box { max-height:20rem; padding: 1.5rem; }
}

.readyBox {border-radius:2rem; background:#f2f2f2; }
.readyBox > div {display:flex; align-items:center; justify-content:center; flex-direction:column; min-height:40rem; padding:1rem; text-align:center;}
.readyBox > div strong {font-size:4rem; font-weight:700; font-family:var(--font-main); opacity:0.2; margin-bottom:2rem;}
.readyBox > div span { font-family:var(--font-main); opacity:0.2;}


/* 사이트맵 */
.submenu{margin-top:2rem;}
.sitemap_wrap{border-bottom: 1px dashed #eee;padding-bottom:5rem;}
.submenu > ul{display:grid;grid-template-columns:repeat(auto-fill, minmax(30%, 1fr));gap: 4rem;padding-left:2rem;}
.submenu > ul > li > a{border:1px solid #dedede; border-radius:1rem; display:block; padding:1.6rem; margin-bottom:1rem;}
.submenu > ul ul > li {padding-left: 3rem;margin:1rem 0; position:relative;}
.submenu > ul ul > li:before {width: 0.5rem;height: 0.5rem;background:var(--color-main); border-radius:3rem;top: 1rem; content:"";display:block;position:absolute;left: 1rem;}
.submenu > ul ul ul > li:before {width: 0.5rem;height: 0.2rem;background: #c4c4c4; border-radius:3rem;top: 1.2rem; content:"";display:block;position:absolute;left: 1rem;}
@media screen and (max-width:1200px){
	.submenu > ul{display:grid;grid-template-columns:repeat(auto-fill, minmax(30%, 1fr));gap: 2rem;padding-left:0rem;}
}
@media screen and (max-width:900px){
	.submenu > ul{display:grid;grid-template-columns:repeat(auto-fill, minmax(40%, 1fr));}
}
@media screen and (max-width:600px){
	.submenu > ul{display:grid;grid-template-columns:repeat(auto-fill, minmax(100%, 1fr));}
}