@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;200;300;400;500;600;700;800;900&family=Noto+Sans+KR:wght@100;200;300;400;500;600;700;800;900&display=swap');
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard-dynamic-subset.css');

@font-face {
    font-family: 'ONE_mobile';
    src: url('./font/ONE Mobile Title.ttf') format('woff');
	font-weight: 200;
}

/******************************  전체  ******************************/
html, body, div, object, iframe, h1, h2, h3, h4, h5, h6, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, sub, sup, var, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure,
header, hgroup, menu, nav, section, summary, time, mark, audio, video, textarea,button{margin:0;padding:0;border:0;font-size:100%;font-weight:normal;}
body{width:100%;font-family:'Pretendard', Noto Sans KR, Nanum_BG, Nanum_BGB, NanumBarunGothicBold, 나눔고딕, '맑은 고딕', HelveticaNeue, DroidSans, Sans-serif, Helvetica;font-size:14px;/* color:#333; */}
ul, li{list-style:none;}
p {margin:0;padding:0;}
a{margin:0;padding:0;font-size:100%;text-decoration:none;vertical-align:baseline;background:transparent;}
a, a:link, a:hover, a:active{color:inherit;text-decoration:none;}
img{vertical-align:middle;}
input{margin:0;padding:0;box-sizing:content-box;vertical-align:middle;font-family:'Pretendard', Noto Sans KR, Nanum_BG, Nanum_BGB, NanumBarunGothicBold, 나눔고딕, '맑은 고딕', HelveticaNeue, DroidSans, Sans-serif, Helvetica;}
textarea{border:1px solid #ddd;font-family:'Pretendard', Noto Sans KR, Nanum_BG, Nanum_BGB, NanumBarunGothicBold, 나눔고딕, '맑은 고딕', HelveticaNeue, DroidSans, Sans-serif, Helvetica;}
table{border-collapse:collapse;border-spacing:0;}
input[type=text], input[type=password], select{height:26px;vertical-align:middle;border:1px solid #bbb;}
input[type=button], input[type=submit], button{cursor:pointer;-webkit-appearance: none;}
strong, b{font-weight:bold;}

input[type=text], input[type=password]:focus{outline:none;}
input[type=text]::-ms-clear {  display: none; width : 0; height: 0; }
input[type=text]::-ms-reveal {  display: none; width : 0; height: 0; }

input[type=text], input[type=password]{
   -webkit-appearance: none;
   -webkit-border-radius: 0;
   padding: 0 5px;
   box-sizing: border-box;
}

button {
	font-family:'Pretendard', Noto Sans KR, Nanum_BG, Nanum_BGB, NanumBarunGothicBold, 나눔고딕, '맑은 고딕', HelveticaNeue, DroidSans, Sans-serif, Helvetica;
}



/******************************  색상 변수 설정  ******************************/
:root {
  --main-color: #0c2716;
  --sub-color: #000;
  --gray: #E8E8E8;
  --lightgray: #F5F5F5;
}

/******************************  PC, Mobile  ******************************/
.mob { display: none !important; }
.mob-in { display: none !important; }
.mob-table { display: none !important; }

@media screen and (max-width:1000px) {
	.pc { display: none !important; }
	.mob { display: block !important; }
	.mob-table { display: table !important; }
}

.no-data {
	width: 100%;
	padding: 100px 0 150px;
	font-size: 24px;
	text-align: center;
}

li.no-data {
	width: 100% !important;
	padding: 40px 0;
	font-size: 16px;
	text-align: center;
}

@media screen and (max-width:1000px) {
	.no-data {
		padding: 20vw 0 30vw;
		font-size: 6vw;
	}

	li.no-data {
		font-size: 3.6vw;
	}
}

/******************************  페이징  ******************************/
.paging{
	width:100%;
	margin:45px 0;
	text-align:center;
}

.paging ul{
	margin:0 auto;
}

.paging ul li{
	display:inline-block;
	width:30px;
	margin-right:7px;
	border:1px solid #ddd;
	font-size:18px;
	line-height:30px;
	text-align:center;
}

.paging ul li a,.paging ul li a:hover, .paging ul li a:link, .paging ul li a:focus, .paging ul li a:active{
	 display:block;
	 color:inherit;
}

.paging ul li:hover, .paging ul li.over{
	background:#000;
	color: #fff;
	cursor:pointer;
}


.paging ul li.now_page{
	background:#000;
	color: #fff;
}


@media screen and (max-width:1000px) {
	.paging{
		margin:10vw 0;
	}

	.paging ul li{
		width:8.2vw;
		margin-right:1.9vw;
		font-size:4.3vw;
		line-height:8.2vw;
	}
}


/******************************  버튼  ******************************/
.btn_area01{
	width:100%;
	margin:35px 0;
	text-align:center;
}

.btn_area02{
	width:100%;
	margin:10px 0;
}

.btn_area03{
	width:100%;
	margin:10px 0;
	text-align:right;
}

.solid_button, .line_button {
	width: 120px;
	height: 40px;
	font-size: 16px;
	font-weight: bold;
}

.solid_button {
	border: 1px solid var(--main-color);
	background: var(--main-color);
	color: #fff;
}

.line_button {
	border: 1px solid #DDDDDD;
	background: #fff;
	color: #666666;
}

.solid_sbutton, .line_sbutton {
	margin-left: 10px;
	padding: 5px 15px;
	font-size: 14px;
}

.solid_sbutton {
	border: 1px solid var(--main-color);
	background: var(--main-color);
	color: #fff;
}

.line_sbutton {
	border: 1px solid #DDDDDD;
	background: #fff;
	color: #666666;
}

@media screen and (max-width:1000px) {
	.btn_area02{
		text-align:center;
	}

	.btn_area03{
		text-align:center;
	}

	.solid_button, .line_button {
		width: 24vw;
		height: 8vw;
		font-size: 3.2vw;
	}
}

/******************************  마진 / 패딩  ******************************/
.mt_10{margin-top:10px;}
.mt_20{margin-top:20px;}
.mt_30{margin-top:30px;}
.mt_40{margin-top:40px;}
.mt_50{margin-top:50px;}
.mt_60{margin-top:60px;}
.mt_70{margin-top:70px;}
.mt_80{margin-top:80px;}
.mt_90{margin-top:90px;}
.mt_100{margin-top:100px;}
.mt_150{margin-top:150px;}
.mt_200{margin-top:200px;}
.mt_250{margin-top:250px;}

.ml_10{margin-left:10px;}
.ml_20{margin-left:20px;}
.ml_30{margin-left:30px;}
.ml_40{margin-left:40px;}
.ml_50{margin-left:50px;}
.ml_60{margin-left:60px;}
.ml_70{margin-left:70px;}
.ml_80{margin-left:80px;}
.ml_90{margin-left:90px;}
.ml_100{margin-left:100px;}
.ml_150{margin-left:150px;}
.ml_200{margin-left:200px;}
.ml_250{margin-left:250px;}

.mr_10{margin-right:10px;}
.mr_20{margin-right:20px;}
.mr_30{margin-right:30px;}
.mr_40{margin-right:40px;}
.mr_50{margin-right:50px;}
.mr_60{margin-right:60px;}
.mr_70{margin-right:70px;}
.mr_80{margin-right:80px;}
.mr_90{margin-right:90px;}
.mr_100{margin-right:100px;}
.mr_150{margin-right:150px;}
.mr_200{margin-right:200px;}
.mr_250{margin-right:250px;}

.mb_10{margin-bottom:10px;}
.mb_20{margin-bottom:20px;}
.mb_30{margin-bottom:30px;}
.mb_40{margin-bottom:40px;}
.mb_50{margin-bottom:50px;}
.mb_60{margin-bottom:60px;}
.mb_70{margin-bottom:70px;}
.mb_80{margin-bottom:80px;}
.mb_90{margin-bottom:90px;}
.mb_100{margin-bottom:100px;}
.mb_150{margin-bottom:150px;}
.mb_200{margin-bottom:200px;}
.mb_250{margin-bottom:250px;}

.pt_10{padding-top:10px;}
.pt_20{padding-top:20px;}
.pt_30{padding-top:30px;}
.pt_40{padding-top:40px;}
.pt_50{padding-top:50px;}
.pt_60{padding-top:60px;}
.pt_70{padding-top:70px;}
.pt_80{padding-top:80px;}
.pt_90{padding-top:90px;}
.pt_100{padding-top:100px;}
.pt_150{padding-top:150px;}
.pt_200{padding-top:200px;}
.pt_250{padding-top:250px;}

.pl_10{padding-left:10px;}
.pl_20{padding-left:20px;}
.pl_30{padding-left:30px;}
.pl_40{padding-left:40px;}
.pl_50{padding-left:50px;}
.pl_60{padding-left:60px;}
.pl_70{padding-left:70px;}
.pl_80{padding-left:80px;}
.pl_90{padding-left:90px;}
.pl_100{padding-left:100px;}
.pl_150{padding-left:150px;}
.pl_200{padding-left:200px;}
.pl_250{padding-left:250px;}

.pr_10{padding-right:10px;}
.pr_20{padding-right:20px;}
.pr_30{padding-right:30px;}
.pr_40{padding-right:40px;}
.pr_50{padding-right:50px;}
.pr_60{padding-right:60px;}
.pr_70{padding-right:70px;}
.pr_80{padding-right:80px;}
.pr_90{padding-right:90px;}
.pr_100{padding-right:100px;}
.pr_150{padding-right:150px;}
.pr_200{padding-right:200px;}
.pr_250{padding-right:250px;}

.pb_10{padding-bottom:10px;}
.pb_20{padding-bottom:20px;}
.pb_30{padding-bottom:30px;}
.pb_40{padding-bottom:40px;}
.pb_50{padding-bottom:50px;}
.pb_60{padding-bottom:60px;}
.pb_70{padding-bottom:70px;}
.pb_80{padding-bottom:80px;}
.pb_90{padding-bottom:90px;}
.pb_100{padding-bottom:100px;}
.pb_150{padding-bottom:150px;}
.pb_200{padding-bottom:200px;}
.pb_250{padding-bottom:250px;}


/******************************  가로 사이즈  ******************************/
.size50{width:50px;}
.size80{width:80px;}
.size100{width:100px;}
.size130{width:130px;}
.size150{width:150px;}
.size200{width:200px;}
.size300{width:300px;}
.size400{width:400px;}
.size500{width:500px;}
.size600{width:600px;}
.size700{width:700px;}
.size90per{width:90%;}
.size98per{width:98%;}
.size100per{width:100%;}
.textarea_set{width:98%;height:100px;}
.textarea_set2{width:98%;height:200px;}

/******************************************
	폰트 정렬
*******************************************/
.ta-left{text-align:left;}
.ta-center{text-align:center;}
.ta-right{text-align:right;}

/******************************************
	가상 요소
*******************************************/
.after_clear::after {display:block;clear:both;content:"";}

/******************************************
	배경색
*******************************************/
.bg-lightgray {background:#F6F6F6;}

/******************************************
	폰트색
*******************************************/
.fc-white {color:#fff;}
.fc-main {color:var(--main-color);}
.fc-blue {color:#4BA3E0;}
.fc-lightgray {color:#777;}

.ff-onemobile {font-family: 'ONE_mobile';}

/******************************  웹접근성 CSS  ******************************/
#skip {
	padding: 8px 0;
	text-align: center;
	background: var(--main-color);
}

#skip > a {}

.sound-only {
	font-size: 0px;
	color: transparent;
}

/******************************************
	리스트 (일반)
*******************************************/
.default_list {
	width: 100%;
	/* margin-top: 70px; */
	border-top: 2px solid var(--main-color);
}

.default_list thead th,
.default_list tbody td {
	border-bottom: 1px solid #ddd;
	font-size: 16px;
	height: 60px;
}

.default_list thead {
	/* border-top: 2px solid #000; */
}

.default_list thead th {
	/* padding: 15px 0; */
	line-height: 1.625;
	/* background: var(--main-color); */
	/* color: #fff; */
}

.default_list thead th.num {
	width: 100px;
}

.default_list thead th.tit {}

.default_list thead th.name {
	width: 120px;
}

.default_list thead th.view {
	width: 60px;
}

.default_list thead th.date {
	width: 140px;
}

.default_list thead th.l_date {
	width: 260px;
}

.default_list tbody {}

.default_list tbody td {
	/* padding: 20px 0; */
	text-align: center;
}

.default_list tbody td.l_content {
	text-align: left;
}

.default_list tbody td .lock_ico {
	margin-left: 7px;
}

@media screen and (max-width:1000px) {
	.default_list {
		margin-top: 14vw;
	}

	.default_list thead th,
	.default_list tbody td {
		font-size: 3.200vw;
		height: 14vw;
	}

	.default_list thead th {
		/* padding: 2vw 0; */
	}

	.default_list thead th.num {
		width: 10%;
	}

	.default_list thead th.tit {}

	/* .default_list thead th.name {
		width: 120px;
	} */

	.default_list thead th.view {
		width: 15%;
	}

	.default_list thead th.date {
		width: 25%;
	}

	.default_list thead th.l_date {
		width: 27%;
	}

	.default_list tbody td {
		/* padding: 4vw 0; */
	}
}

/******************************************
	리스트 (갤러리)
*******************************************/
.default_gallery_list {}

.default_gallery_list > li {
	position: relative;
	float: left;
	width: calc(25% - 20.25px);
	height: 352px;
	margin-right: 26px;
	margin-bottom: 29px;
	box-sizing: border-box;
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	cursor: pointer;
	overflow: hidden;
}

.default_gallery_list > li:nth-child(4n + 4) {
	margin-right: 0;
}

.default_gallery_list > li .info_box {
	position: absolute;
	top: 100%;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,0.8);
	color: #fff;
	text-align: center;
	transition: .4s;
}

.default_gallery_list > li:hover .info_box {
	top: 0;
}

.default_gallery_list > li .info_box > span {
	display: block;
}

.default_gallery_list > li .info_box .title {
	padding-top: 95px;
	font-size: 16px;
	font-weight: bold;
}

.default_gallery_list > li .info_box .date {
	padding-top: 181px;
	font-size: 14px;
}

@media screen and (max-width:1000px) {
	.default_gallery_list > li {
		width: 100%;
		height: 110.6vw;
		margin-right: 0;
		margin-bottom: 8vw;
	}

	.default_gallery_list > li:nth-child(4n + 4) {
		margin-right: 0;
	}

	.default_gallery_list > li .info_box {
		top: 0;
	}

	.default_gallery_list > li .info_box .title {
		padding-top: 24vw;
		font-size: 4.4vw;
	}

	.default_gallery_list > li .info_box .date {
		padding-top: 50vw;
		font-size: 3.6vw;
	}
}




/******************************************
	리스트 (일반2)
*******************************************/
.default_list2 {
	margin-top: 105px;
	border-top: 2px solid #000;
}

.default_list2 > li {
	display: flex;
	align-items: center;
	height: 208px;
	border-bottom: 1px solid #ddd;
}

.default_list2 > li .date {
	width: 140px;
	text-align: center;
}

.default_list2 > li .date .day {
	display: block;
	font-size: 36px;
}

.default_list2 > li .date .year {
	font-size: 15px;
	line-height: 1.7;
	color: #8A8A8A;
}

.default_list2 > li .img {
	position: relative;
	width: 210px;
	height: 120px;
	margin-left: 30px;
}

.default_list2 > li .img::before {
	position: absolute;
	top: 0;
	left: -30px;
	width: 1px;
	height: 100%;
	background: #ddd;
	content: "";
}

.default_list2 > li .content {
	width: calc(100% - 467px);
	padding-left: 20px;
	box-sizing: border-box;
}

.default_list2 > li .content .title, 
.default_list2 > li .content .detail {
	width: 95%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.default_list2 > li .content .title {
	font-size: 22px;
}

.default_list2 > li .content .detail {
	font-size: 18px;
}

.default_list2 > li .button {
	width: 87px;
}

.default_list2 > li .button > button {}

.default_list2 > li .button > button > img {}

@media screen and (max-width:1000px) {
	.default_list2 {
		margin-top: 10.5vw;
	}

	.default_list2 > li {
		height: 20.8vw;
	}

	.default_list2 > li .date {
		width: 14vw;
	}

	.default_list2 > li .date .day {
		font-size: 3.6vw;
	}

	.default_list2 > li .date .year {
		font-size: 3.2vw;
	}

	.default_list2 > li .img {
		width: 21vw;
		height: 12vw;
		margin-left: 3vw;
	}

	.default_list2 > li .img::before {
		left: -3vw;
		width: 0.1vw;
	}

	.default_list2 > li .content {
		width: calc(100% - 22.7vw);
		padding-left: 2vw;
	}

	.default_list2 > li .content .title {
		font-size: 3.8vw;
	}

	.default_list2 > li .content .detail {
		font-size: 3.2vw;
	}

	.default_list2 > li .button {
		width: 8.7vw;
	}

	.default_list2 > li .button > button {
		width: 5.6vw;
		height: 5.6vw;
	}

	.default_list2 > li .button > button > img {
		width: 100%;
	}
}


/******************************************
	상세
*******************************************/
.default_view_table {
	width: 100%;
	/* margin-top: 60px; */
	border-top: 2px solid var(--main-color);
}

.default_view_table th, .default_view_table td {
	border-bottom: 1px solid #DDDDDD;
}

.default_view_table th {
	padding: 20px;
	/* border-top: 2px solid var(--sub-color); */
	text-align: left;
}

.default_view_table td {}

.default_view_table .title {
	/* background: #354791; */
	font-size: 18px;
	/* color: #fff; */
}

.default_view_table .title h3 {
	font-size: 20px;
	line-height: 1.3;
	margin-bottom: 4px;
}

.default_view_table .title span {
	margin-right: 40px;
	font-size: 17px;
	line-height: 1.53;
}

.default_view_table .content {
	padding: 45px 20px;
}

.default_view_table .content img {
	max-width: 100%;
}

.default_view_table .content img.thumb_img, 
.default_view_table .content img.cert_img {
	display: block;
	margin: 0 auto;
}

.default_view_table .content img.thumb_img {
	max-width: 300px;
}

.default_view_table .content img.cert_img {
	margin-top: 30px;
	margin-bottom: 30px;
	max-width: 634px;
}

.default_view_table .content .thumb_txt {
	margin: 5px 0 40px;
	text-align: center;
}

.default_view_table .file {
	padding: 20px;
	font-size: 16px;
}

.default_view_table .file > span {
	margin-right: 35px;
}

.default_view_table .file > a {
	text-decoration: underline;
}


.qna_reply_content {
	margin-top: 30px;
	padding: 20px;
	background: #FAFAFC;
}

.qna_reply_content > h3.qna_reply_title {
	padding-bottom: 15px;
	margin-bottom: 20px;
	border-bottom: 1px solid #ddd;
	font-size: 20px;
	font-weight: 500;
	text-align: center;
}

@media screen and (max-width:1000px) {
	.default_view_table {
		/* margin-top: 10.6vw; */
	}

	.default_view_table th {
		padding: 4vw;
	}

	.default_view_table .title h3 {
		font-size: 4vw;
	}

	.default_view_table .title span {
		font-size: 3.2vw;
		line-height: 5.2vw;
		margin-right: 5%;
	}

	.default_view_table .content {
		padding: 8vw 4vw;
	}

	.default_view_table .content img.cert_img {
		margin-top: 0;
		margin-bottom: 0;
		max-width: 100%;
	}

	.default_view_table .file {
		padding: 8vw 4vw;
		font-size: 3.200vw;
	}

	.default_view_table .file > span {
		margin-right: 5%;
	}

	.qna_reply_content {
		margin-top: 7vw;
		padding: 4vw;
	}

	.qna_reply_content > h3.qna_reply_title {
		padding-bottom: 3vw;
		margin-bottom: 4vw;
		font-size: 4vw;
	}

}


/******************************************
	글쓰기 - only PC
*******************************************/
.default_write_table {
	width: 100%;
	/* margin-top: 60px; */
}

.default_write_table th, .default_write_table td {
	border-bottom: 1px solid #DDDDDD;
	vertical-align: top;
}

.default_write_table th {
	border-top: 2px solid var(--sub-color);
	text-align: left;
}

.default_write_table td {}

.default_write_table td.content img {
	max-width: 300px;
}

.default_write_table .title {
	padding: 20px 0;
	padding-left: 20px;
	font-size: 16px;
	text-align: left;
}

.default_write_table .content {
	padding: 20px 35px;
	font-size: 16px;
	text-align: left;
}


@media screen and (max-width:1000px) {
	.default_write_table {
		/* margin-top: 12vw; */
	}

	.default_write_table td.content img {
		max-width: 100%;
	}

	.default_write_table .title {
		width: 20%;
		padding: 4vw 0;
		padding-left: 4vw;
		font-size: 3.200vw;
	}

	.default_write_table .content {
		padding: 4vw 7vw;
		font-size: 3.200vw;
	}
}


/******************************************
	웹접근성 관련 CSS
*******************************************/
.skip {
	padding: 5px 0;
	background: #003D65;
	font-size: 12px;
	text-align: center;
	color: #fff;
}

.skip_area {
	display: flex;
	align-items: center;
	margin: 5px 278px 0;
}

.skip_area .skip_title {
	flex: 1;
	font-size: 24px;
	line-height: 1.3;
	text-align: left;
}

.skip_area .skip_logo {
	flex: 1;
	text-align: right;
}

.skip_area .skip_logo > li {
	display: inline-block;
	margin-left: 13px;
	text-align: center;
}

.skip_area .skip_logo > li > p {
	margin-top: 5px;
}

.read-only {
	font-size: 0px;
}

.closed-caption-title {
	font-size: 16px;
	font-weight: 500;
	margin: 20px 0 5px;
}

.closed-caption {
	height: 300px;
	padding: 20px;
	border: 1px solid #ddd;
	box-sizing: border-box;
	overflow: auto;
}

.focus-outline {
	border: 1px solid transparent;
}

.focus-outline:focus {
	border: 1px solid #fff;
	outline: 2px solid #000;
}


@media screen and (max-width:1000px) {
	.skip {
		padding: 2vw 0;
		font-size: 2vw;
	}

	.skip_area {
		margin: 0.5vw 6% 0;
	}

	.skip_area .skip_title {
		font-size: 3.2vw;
	}

	.skip_area .skip_logo {
		font-size: 1.6vw;
	}

	.skip_area .skip_logo > li {
		margin-left: 1.3vw;
	}

	.skip_area .skip_logo > li > img {
		width: 6.2vw;
	}

	.skip_area .skip_logo > li > p {
		margin-top: 0.5vw;
	}

	.closed-caption-title {
		font-size: 1.6vw;
		margin: 2vw 0 0.5vw;
	}

	.closed-caption {
		height: 30vw;
		padding: 2vw;
	}
}


/******************************************
	검색영역
*******************************************/
.search_area {
	margin-top: 40px;
	text-align: center;
}

.search_area .search_input {
	height: 40px;
	font-size: 16px;
	box-sizing: border-box;
}

.search_area .search_text {
	width: 324px;
	margin-right: 3px;
	padding: 0 20px;
	border: 1px solid #ddd;
}

.search_area .search_submit {
	width: 82px;
	background: #000;
	border: 1px solid #000;
	color: #fff;
}

@media screen and (max-width:1000px) {
	.search_area {
		margin-top: 7.6vw;
	}

	.search_area .search_input {
		height: 10vw;
		font-size: 4vw;
	}

	.search_area .search_text {
		width: 52.4vw;
		margin-right: 1vw;
		padding: 0 4.4vw;
	}

	.search_area .search_submit {
		width: 18.9vw;
	}

}


.ready-message {
	padding: 150px 0 350px;
	font-weight: bold;
	font-size: 24px;
	text-align: center;
}

@media screen and (max-width:1000px) {
	.ready-message {
		font-size: 6vw;
		padding: 30vw 0 50vw;
	}
}