@charset "UTF-8";

/* 공통 :: bbs-util */
div.bbs-wrap div.bbs-util{display: flex; align-items: center; justify-content: space-between; margin-bottom: 0.625rem;}
div.bbs-wrap div.bbs-util div.total{}
div.bbs-wrap div.bbs-util div.total span.total-num{font-family: 'Pretendard-Bold', sans-serif; color: var(--color-main02);}

/* 공통 :: 페이지네이션 */
div.pagination{margin-top:3rem;}
div.pagination ul{display:flex; align-items:center; gap:5px; justify-content:center;}
div.pagination ul li{width:2.5rem; height:2.5rem; line-height:2.5rem; text-align:center; border-radius:0.5rem; color:#777;}
div.pagination ul li a{width:100%; height:100%;}
div.pagination ul li.arrow{background:url("../img/ico_arrow_down.svg")50% 52%/40% auto no-repeat; border:1px solid #333; transform: rotate(-90deg); opacity: .3;}
div.pagination ul li.arrow.prev{transform:rotate(90deg); margin-right:1rem;}
div.pagination ul li.arrow.next{margin-left:1rem;}
div.pagination ul li.on{color:#fff; background: var(--color-main02); box-shadow: 0 10px 20px rgba(32, 75, 156, .1); font-family: 'Pretendard-Bold', sans-serif;}
div.pagination ul li:not(.on, .arrow, .dots):hover{background:#f1f1f1;}
@media(hover:hover){
	div.pagination ul li.arrow:hover{opacity: 1;}
}

/* list */
div.bbs-wrap section.board.list{overflow: hidden;}
div.bbs-wrap section.board.list div.bbs-table-wrap{border:1px solid var(--color-gray400); border-radius: 1rem;}
div.bbs-wrap section.board.list table.bbs-table{text-align:center; width:100%; border-radius: 1rem; overflow: hidden;}
div.bbs-wrap section.board.list table.bbs-table thead{background: var(--color-gray100); border-bottom: 1px solid var(--color-gray400); border-radius: 1rem 1rem 0 0;}
div.bbs-wrap section.board.list table.bbs-table thead th{padding:1.125rem 0.5rem; font-size:1.125rem; border: 0;}
div.bbs-wrap section.board.list table.bbs-table tbody tr{border-bottom:1px solid #ddd;}
div.bbs-wrap section.board.list table.bbs-table tbody tr:last-child{border-bottom: 0;}
div.bbs-wrap section.board.list table.bbs-table tbody td{padding:1.125rem 0.5rem; font-size:1.1rem; color:#777; border:0;}
div.bbs-wrap section.board.list table.bbs-table tbody td.tit{text-align:left; display: flex; align-items: center; font-family: 'Pretendard-Medium', sans-serif; color:#333;}
div.bbs-wrap section.board.list table.bbs-table tbody td.tit a{max-width:50rem; vertical-align:middle; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
div.bbs-wrap section.board.list table.bbs-table tbody td.tit a p.bbs-tit{overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
div.bbs-wrap section.board.list table.bbs-table tbody td.tit span.new{font-size: 0.8rem; font-family: 'Pretendard-Bold', sans-serif; background: var(--color-main01); color: #fff; margin-right: 0.8rem; padding: 0.25rem 0.5rem; border-radius: 4px; box-shadow: 0 0 10px rgba(0, 164, 151, 0.3);}
div.bbs-wrap section.board.list table.bbs-table tbody td.tit span.must-read{font-size: 0.9rem; font-family: 'Pretendard-Bold', sans-serif; color: var(--color-sub01); border: 2px solid var(--color-sub01); padding: 0 0.5rem; margin-right: 0.8rem; border-radius: 4px;}
div.bbs-wrap section.board.list table.bbs-table tbody td.tit span.attach{display:inline-block; width:1.8rem; height:1.8rem; background:url("../img/icon_pdf.svg")center/auto 100% no-repeat; margin-left: 0.4rem;}
div.bbs-wrap section.board.list table.bbs-table tbody tr.main-noti td.tit{font-family:'Pretendard-Bold', sans-serif;}
div.bbs-wrap section.board.list table.bbs-table tbody tr.main-noti td.num span.noti{display: block; width: 1.8rem; height: 1.8rem; margin: 0 auto; background-color: var(--color-main02); -webkit-mask: url('../img/icon_notice.svg') center/100% no-repeat; mask: url('../img/icon_notice.svg') center/100% no-repeat;}
@media(hover:hover){
	div.bbs-wrap section.board.list table.bbs-table tbody tr:hover{background:#f8fafc;}
	div.bbs-wrap section.board.list table.bbs-table tbody td.tit:hover{font-family: 'Pretendard-Bold', sans-serif;}
}

/* view */
div.bbs-wrap section.board.view{}
div.bbs-wrap section.board.view div.viewer{}
div.bbs-wrap section.board.view div.viewer div.view-top{padding: 2rem; background: var(--color-gray100); border: 1px solid var(--color-gray400); overflow: hidden; border-radius: 1rem 1rem 0 0;}
div.bbs-wrap section.board.view div.viewer div.view-top div.title span.tit-lab{font-size: 1rem; font-family: 'Pretendard-Bold', sans-serif; color: var(--color-sub01); padding: 0.25rem 0.5rem; border-radius: 4px; border: 2px solid var(--color-sub01);}
div.bbs-wrap section.board.view div.viewer div.view-top div.title h3{font-family:'Pretendard-Bold', sans-serif; font-size:2rem; line-height:1.5; margin-top: 1rem; margin-bottom: 1.25rem;}
div.bbs-wrap section.board.view div.viewer div.view-top div.util{display:flex; flex-wrap: wrap; align-items:center; gap: 1.5rem; position:relative;}
div.bbs-wrap section.board.view div.viewer div.view-top div.util ul.info{display:flex; flex-wrap: wrap; gap: 2rem; align-items:center;}
div.bbs-wrap section.board.view div.viewer div.view-top div.util ul.info > li{display: flex; position: relative; padding-left: 1.5rem;}
div.bbs-wrap section.board.view div.viewer div.view-top div.util ul.info > li::before{content: ''; position: absolute; width: 1rem; height: 1rem; left: 0; top: 50%; transform: translateY(-50%);}
div.bbs-wrap section.board.view div.viewer div.view-top div.util ul.info > li.writer::before{background: url('../img/icon_user.svg')center / 100% no-repeat;}
div.bbs-wrap section.board.view div.viewer div.view-top div.util ul.info > li.date::before{background: url('../img/icon_calendar.svg')center / 100% no-repeat;}
div.bbs-wrap section.board.view div.viewer div.view-top div.util ul.info > li.view-count::before{background: url('../img/icon_view.svg')center / 100% no-repeat;}
div.bbs-wrap section.board.view div.viewer div.view-cont{font-size:1rem; color:#000; line-height:1.5; padding:1.5rem; background:#fff; border: 1px solid var(--color-gray400); border-top:0; border-radius:0 0 1rem 1rem;}
div.bbs-wrap section.board.view div.viewer div.view-cont div.inner a{color:blue;}
div.bbs-wrap section.board.view div.viewer div.view-cont div.inner a:hover{text-decoration:underline;}
div.bbs-wrap section.board.view div.viewer div.view-cont div.inner img{display:inline-block; max-width:100%;}
div.bbs-wrap section.board.view div.viewer div.view-cont div.inner table{max-width:100%;}
div.bbs-wrap section.board.view div.viewer div.view-cont div.inner table th{border:1px solid #ccc; padding:5px; font-weight:bold;}
div.bbs-wrap section.board.view div.viewer div.view-cont div.inner table td{border:1px solid #ccc; padding:5px;}
div.bbs-wrap section.board.view div.viewer div.view-cont div.inner ul,
div.bbs-wrap section.board.view div.viewer div.view-cont div.inner ol,
div.bbs-wrap section.board.view div.viewer div.view-cont div.inner dl{list-style:revert;}
div.bbs-wrap section.board.view div.viewer div.view-cont div.inner video,
div.bbs-wrap section.board.view div.viewer div.view-cont div.inner iframe{max-width:100%;}
div.bbs-wrap section.board.view div.viewer div.view-attach{display:flex; align-items:center; padding:1rem; background: var(--color-gray200); border-radius: 1rem; margin-top: 2rem;}
div.bbs-wrap section.board.view div.viewer div.view-attach span.lab{width:10rem; text-align:center; font-family:'Pretendard-Bold', sans-serif;}
div.bbs-wrap section.board.view div.viewer div.view-attach ul.attach-list{}
div.bbs-wrap section.board.view div.viewer div.view-attach ul.attach-list li{position:relative; padding-left:1.5rem;}
div.bbs-wrap section.board.view div.viewer div.view-attach ul.attach-list li:before{content:''; display:block; width:1.35rem; height:1.35rem; background:url("../img/ico_attach_file.svg")center/contain no-repeat; position:absolute; top:0.5rem; left:0;}
div.bbs-wrap section.board.view div.viewer div.view-attach ul.attach-list li a{display:inline-block; padding:0.5rem 0; padding-left: 0.25rem;}
@media(hover:hover){
	div.bbs-wrap section.board.view div.viewer div.view-attach ul.attach-list li a:hover{font-weight: bold;}
}

/* FAQ */
div.bbs-wrap section.board.faq{}
div.bbs-wrap section.board.faq div.faq-list{background: #fff; border: 1px solid var(--color-gray400); border-radius: 1rem;}
div.bbs-wrap section.board.faq div.faq-list div.item{border-bottom: 1px solid var(--color-gray400); padding: 2rem;}
div.bbs-wrap section.board.faq div.faq-list div.item:last-child{border-bottom: 0;}
div.bbs-wrap section.board.faq div.faq-list div.item div.faq-Q{}
div.bbs-wrap section.board.faq div.faq-list div.item div.faq-Q a{display: flex; width: 100%; height: 100%; font-size: 1.2rem; position: relative;}
div.bbs-wrap section.board.faq div.faq-list div.item div.faq-Q a span.ico-q{font-family: 'Montserrat_B','Pretendard-Bold',sans-serif; color: var(--color-main04); font-size: 1.25rem; margin: 0 2rem 0 1rem;}
div.bbs-wrap section.board.faq div.faq-list div.item div.faq-Q a span.faq-tit{font-family:'Pretendard-Bold', sans-serif; padding-right: 2rem; word-break: keep-all;}
div.bbs-wrap section.board.faq div.faq-list div.item div.faq-Q a span.ico-open{display: block; width: 1.125rem; height: 1.125rem; background: url("../img/ico_arrow_down.svg")center/contain no-repeat; position: absolute; top: 50%; right: 0; opacity: .3; transform: translateY(-50%);}
div.bbs-wrap section.board.faq div.faq-list div.item div.faq-A{display: none; margin-top: 1.25rem;}
div.bbs-wrap section.board.faq div.faq-list div.item div.faq-A div.inner{padding-left: 4rem; position: relative; font-size: 1rem; line-height: 1.5;}
div.bbs-wrap section.board.faq div.faq-list div.item div.faq-A div.inner:before{content: 'A'; font-family: 'Montserrat_B','Pretendard-Bold',sans-serif; color: var(--color-main02); font-size: 1.25rem; position: absolute; top: 0; left: 1rem;}
div.bbs-wrap section.board.faq div.faq-list div.item.open div.faq-Q a span.ico-open{transform: translateY(-50%) rotateZ(180deg); opacity: 1;}

/****** 반응형 ******/
@media screen and (max-width:1600px){

}

@media screen and (max-width:1440px){
}

@media screen and (max-width:1280px){
	/* list */
	div.bbs-wrap section.board.list table.bbs-table tbody td.tit a{max-width:40rem;}
}


@media screen and (max-width:1200px){
}

@media screen and (max-width:1024px){
	/* list */
	div.bbs-wrap section.board.list table.bbs-table thead th{padding:1.25rem 0.5rem;}
	div.bbs-wrap section.board.list table.bbs-table tbody td{padding:1rem 0.5rem;}
	div.bbs-wrap section.board.list table.bbs-table tbody td.tit a{max-width:28rem;}
	div.bbs-wrap section.board.list table.bbs-table tbody td.tit span.attach{width: 1.5rem; height: 1.5rem;}

	/* view */
	div.bbs-wrap section.board.view div.viewer div.view-top div.title h3{font-size: 1.8rem;}

	/* FAQ */
	div.bbs-wrap section.board.faq div.faq-list div.item{padding: 1.5rem;}
	div.bbs-wrap section.board.faq div.faq-list div.item div.faq-Q a span.ico-q{margin: 0 1.25rem 0 1rem;}
	div.bbs-wrap section.board.faq div.faq-list div.item div.faq-A div.inner{padding-left: 3.3rem;}
}

@media screen and (max-width:800px){
	/* pagination */
	div.pagination ul{gap:2px;}

	/* table */
	div.bbs-wrap section.board.list table.bbs-table{display:block; text-align: left;}
	div.bbs-wrap section.board.list table.bbs-table thead{display:none;}
	div.bbs-wrap section.board.list table.bbs-table tbody{display:block;}
	div.bbs-wrap section.board.list table.bbs-table tr{display:block;}
	div.bbs-wrap section.board.list table.bbs-table th{display:block;}
	div.bbs-wrap section.board.list table.bbs-table td{display:inline-block;}
	div.bbs-wrap section.board.list table.bbs-table tbody tr{width:100%; padding:1rem; position:relative;}
	div.bbs-wrap section.board.list table.bbs-table tbody tr.no-data{text-align: center;}
	div.bbs-wrap section.board.list table.bbs-table tbody td{padding:0; text-align:left; font-size: 1rem;}
	div.bbs-wrap section.board.list table.bbs-table tbody td.num{font-family:'Montserrat_B','Pretendard_Bold',sans-serif; color:var(--color-main01);}
	div.bbs-wrap section.board.list table.bbs-table tbody td.tit{width:100%; margin:0.65rem 0;}
	div.bbs-wrap section.board.list table.bbs-table tbody td.tit a{max-width:80%;}
	div.bbs-wrap section.board.list table.bbs-table tbody tr.main-noti td.num span.noti{display: block; font-size: 0; width: 2rem; height: 2rem; box-shadow: none; padding: 0;}
	div.bbs-wrap section.board.list table.bbs-table tbody td.writer{font-size:0.9rem; padding-right:0.7rem; margin-right:0.7rem; position:relative; color:#777;}
	div.bbs-wrap section.board.list table.bbs-table tbody td.writer::before{content:''; display:block; width:1px; height:60%; background:#ccc; position:absolute; top:20%; right:0;}
	div.bbs-wrap section.board.list table.bbs-table tbody td.date{font-size:0.9rem; padding-right:0.7rem; margin-right:0.7rem; position:relative; color:#777;}
	div.bbs-wrap section.board.list table.bbs-table tbody td.date:after{content:''; display:block; width:1px; height:60%; background:#ccc; position:absolute; top:20%; right:0;}
	div.bbs-wrap section.board.list table.bbs-table tbody td.view{position:relative; padding-left:2.5rem; font-size:0.9rem; color:#777;}
	div.bbs-wrap section.board.list table.bbs-table tbody td.view:before{content:'View.'; display:block; position:absolute; font-size:1em; color:inherit; top:0; left:0;}

	/* FAQ */
	div.bbs-wrap section.board.faq div.faq-list div.item div.faq-Q a span.ico-q{margin:0 1.25rem 0 0;}
	div.bbs-wrap section.board.faq div.faq-list div.item div.faq-A div.inner{padding-left:2.25rem;}
	div.bbs-wrap section.board.faq div.faq-list div.item div.faq-A div.inner:before{left: 0;}
}

@media screen and (max-width:680px){

}

@media screen and (max-width:640px){
	/* view */
	div.bbs-wrap section.board.view div.viewer div.view-top{padding: 1.5rem;}
	div.bbs-wrap section.board.view div.viewer div.view-top div.title h3{font-size: 1.5rem; margin-bottom: 1rem;}
	div.bbs-wrap section.board.view div.viewer div.view-top div.util ul.info{gap: 1rem;}
	div.bbs-wrap section.board.view div.viewer div.view-top div.util ul.info > li{font-size: 0.9rem;}

	/* FAQ */
	div.bbs-wrap section.board.faq div.faq-list div.item div.faq-Q a{font-size: 1.1rem;}
	div.bbs-wrap section.board.faq div.faq-list div.item div.faq-Q a span.ico-q{font-size: 1.1rem;}
	div.bbs-wrap section.board.faq div.faq-list div.item div.faq-A div.inner:before{font-size: 1.1rem;}
}

@media screen and (max-width:480px){
	/* pagination */
	div.pagination ul li{width:2.2rem; height:2.2rem; line-height:2.2rem; font-size:0.9rem;}

	/* table */
	div.bbs-wrap section.board.list table.bbs-table tbody tr.main-noti td.num span.noti{width: 1.8rem; height: 1.8rem;}
	div.bbs-wrap section.board.list table.bbs-table tbody td.tit span.must-read,
	div.bbs-wrap section.board.list table.bbs-table tbody td.tit span.new{margin-right: 0.5rem;}

	/* view */
	div.bbs-wrap section.board.view div.viewer div.view-top div.title h3{font-size: 1.3rem;}
	div.bbs-wrap section.board.view div.viewer div.view-cont{padding: 1rem;}
	div.bbs-wrap section.board.view div.viewer div.view-attach{flex-wrap: wrap;}
	div.bbs-wrap section.board.view div.viewer div.view-attach span.lab{width: 100%; text-align:left; margin-bottom: 0.5rem;}

	/* FAQ */
	div.bbs-wrap section.board.faq div.faq-list div.item{padding: 1.25rem;}
}

@media screen and (max-width:400px){
}

@media screen and (max-width:320px){}
/* 첨부파일 버튼의 클릭 가능 상태와 다운로드 동작을 명확하게 표시합니다. */
div.bbs-wrap section.board.view div.viewer div.view-attach ul.attach-list li:before{
	pointer-events:none;
	z-index:1;
	margin-top: 5px;
}
div.bbs-wrap section.board.view div.viewer div.view-attach button.attach-download-button{
	display:flex;
	align-items:center;
	gap:0.75rem;
	max-width:100%;
	min-height:2.5rem;
	margin-left:-1.5rem;
	padding:0.45rem 0.65rem 0.45rem 1.75rem;
	border:1px solid transparent;
	border-radius:0.6rem;
	background:transparent;
	color:inherit;
	font:inherit;
	text-align:left;
	cursor:pointer;
	transition:background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}
div.bbs-wrap section.board.view div.viewer div.view-attach button.attach-download-button span.attach-file-name{
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
	text-underline-offset:0.2rem;
}
div.bbs-wrap section.board.view div.viewer div.view-attach button.attach-download-button span.attach-download-guide{
	flex:none;
	padding:0.25rem 0.55rem;
	border:1px solid var(--color-main01);
	border-radius:1rem;
	color:var(--color-main01);
	font-size:0.8rem;
	line-height:1;
}
div.bbs-wrap section.board.view div.viewer div.view-attach button.attach-download-button:hover,
div.bbs-wrap section.board.view div.viewer div.view-attach button.attach-download-button:focus-visible{
	border-color:var(--color-main01);
	background:#fff;
	box-shadow:0 0.2rem 0.6rem rgba(0, 0, 0, 0.08);
	outline:none;
}
div.bbs-wrap section.board.view div.viewer div.view-attach button.attach-download-button:hover span.attach-file-name,
div.bbs-wrap section.board.view div.viewer div.view-attach button.attach-download-button:focus-visible span.attach-file-name{
	font-family:'Pretendard-Bold', sans-serif;
	text-decoration:underline;
}
div.bbs-wrap section.board.view div.viewer div.view-attach button.attach-download-button:hover span.attach-download-guide,
div.bbs-wrap section.board.view div.viewer div.view-attach button.attach-download-button:focus-visible span.attach-download-guide{
	background:var(--color-main01);
	color:#fff;
}

@media screen and (max-width:600px){
	div.bbs-wrap section.board.view div.viewer div.view-attach ul.attach-list,
	div.bbs-wrap section.board.view div.viewer div.view-attach button.attach-download-button{
		width:100%;
	}
}