*{ box-sizing: border-box; }
figure{ display: inline-block; margin: 0; }
select::-ms-expand { display: none; }
select { 
    -webkit-appearance: none; 
    -moz-appearance: none; 
    appearance: none;
	outline: none;
}
input{ outline: none; border: none; }
input[type="submit"],input[type="button"], input[type="file"],
input[type="text"], button { appearance: none; -moz-appearance: none; -webkit-appearance: none; border-radius: 0;-webkit-border-radius: 0; -moz-border-radius: 0; }
input[type="checkbox"]{ padding: 0 !important; }


/* paging 변수 */
.paging{
	--width: 40px;
	--marginT: 120px;
}
.paging a{ width: var(--width); height: var(--width); border: none; border-radius: var(--contentR); display: flex; justify-content: center; align-items: center; font-size: 17px; font-weight: 400; color: #999; letter-spacing: -0.02em !important; line-height: 1 !important; }
.paging > * > *:not(:last-of-type){ margin-right: 10px; }

.paging .arr a{ border: 1px solid #DDD; border-radius: var(--contentR); }
.paging .arr i{ transform: translate(0, 0) !important; }
.paging .arr i:not(:last-of-type){ margin-right: -3px; }
.paging .arr i::before{ content: ""; display: inline-block; width: 8px; height: 12px; }
.paging .arr i.xi-angle-left-min::before{ background: url("/img/board/paging_prev.svg") no-repeat center center / contain; }
.paging .arr i.xi-angle-right-min::before{ background: url("/img/board/paging_next.svg") no-repeat center center / contain; }

.paging ul{ margin: 0 40px; }
.paging ul li.on a{ background: var(--mainColor); color: #FFF; }

@media screen and (max-width: 1700px){
	.paging{
		--width: 35px;
		--marginT: 80px;
	}
	.paging ul{ margin: 0 30px; }
}

@media screen and (max-width: 1280px){
	.paging{
		--width: 30px;
		--marginT: 40px;
	}
	.paging a{ font-size: 16px; }
	.paging ul{ margin: 0 20px; }
}

@media screen and (max-width: 900px){
	.paging ul{ margin: 0 5px !important; }
	.paging ul li{ margin-right: 0 !important; }
}


/* 검색창 */
.search_box{
	--height: 70px;
	--select: 300px;
	--button: 170px;
	--padding: 25px;
	--gap: 10px;
}
.search_box{ display: flex; flex-wrap: wrap; background: #F5F5F5; border-radius: var(--contentR); padding: 60px; margin-bottom: 50px; }
.search_box *{ font-family: var(--baseFont); font-size: 21px; font-weight: 400; color: #222; }
.search_box > *{ height: var(--height); border: none; border-radius: var(--contentR) !important; -webkit-border-radius: var(--contentR) !important; }
.search_box > *:not(:last-child){ margin-right: var(--gap); }
.search_box select,
.search_box input{ padding: 0 var(--padding); }
.search_box select{ width: var(--select); background: #FFF url("/img/board/select_icon.svg") no-repeat center right calc(var(--padding)); letter-spacing: -0.02em; padding-right: calc((var(--padding) * 2) + 20px); cursor: pointer; }
.search_box input{ width: calc(100% - var(--select) - var(--button) - (var(--gap) * 2)); }
.search_box input::placeholder{ color: #CCC; }
.search_box button{ width: var(--button); background: #111; color: #FFF; }

@media screen and (max-width: 1700px){
	.search_box{
		--height: 60px;
		--select: 250px;
		--button: 140px;
		--padding: 20px;
	}
	.search_box{ padding: 40px; }
	.search_box *{ font-size: 19px; }
}

@media screen and (max-width: 1280px){
	.search_box{
		--height: 55px;
		--select: 220px;
		--button: 120px;
		--padding: 15px;
	}
	.search_box{ padding: 25px; margin-bottom: 30px; }
	.search_box *{ font-size: 17px; }
}

@media screen and (max-width: 900px){
	.search_box{
		--button: 100px;
	}
	.search_box select{ width: 100%; margin-right: 0 !important; margin-bottom: var(--gap); }
	.search_box input{ width: calc(100% - var(--button) - var(--gap)); }
}


/* Team 게시판 */
.team_board_list{ 
	--gapB: 40px; 
	--gapR: 20px; 
	--line: 3; 
}
.team_board_list{ display: flex; flex-wrap: wrap; margin-bottom: calc(var(--gapB) * -1); }
.team_board_list .item{ width: calc((100% - calc(var(--gapR) * (var(--line) - 1))) / var(--line)); padding: 70px 40px; margin-right: var(--gapR); margin-bottom: var(--gapB); position: relative; }
.team_board_list .item:nth-of-type(3n){ margin-right: 0; }
.team_board_list .item::before{ content: ""; width: 100%; height: 100%; border: 1px solid #DDD; border-radius: var(--contentR); position: absolute; top: 0; left: 0; box-sizing: border-box;  transition: border-color 0.3s; }
.team_board_list .item dl dt{ font-size: 30px; font-weight: 500; color: #222; letter-spacing: -0.02em; margin-bottom: 40px; }
.team_board_list .item dl dt span{ display: block; font-size: 21px; font-weight: 500; color: var(--mainColor); margin-bottom: 15px; }
.team_board_list .item dl dd{ font-size: 21px; font-weight: 300; color: #666; letter-spacing: -0.03em; line-height: 1.5; }
.team_board_list .item dl dd *{ line-height: inherit; }
.team_board_list .item dl dd ul li{ position: relative; padding-left: 13px; }
.team_board_list .item dl dd ul li:not(:last-of-type){ margin-bottom: 10px; }
.team_board_list .item dl dd ul li::before{ content: ""; width: 3px; height: 3px; background: var(--mainColor); position: absolute; top: calc(1.5em / 2); left: 0; transform: translateY(-50%); }

@media screen and (hover: hover){
	.team_board_list .item:hover::before{ border-color: var(--mainColor); }
}

@media screen and (max-width: 1700px){
	.team_board_list .item{ padding: 50px 30px; }
	.team_board_list .item dl dt{ font-size: 26px; margin-bottom: 30px; }
	.team_board_list .item dl dt span{ font-size: 19px; }
	.team_board_list .item dl dd{ font-size: 19px; }
}

@media screen and (max-width: 1280px){
	.team_board_list{ 
		--gapB: 20px;
	}
	.team_board_list .item{ padding: 30px 25px; }
	.team_board_list .item dl dt{ font-size: 22px; margin-bottom: 20px; }
	.team_board_list .item dl dt span{ font-size: 17px; margin-bottom: 7px; }
	.team_board_list .item dl dd{ font-size: 17px; }
	.team_board_list .item dl dd ul li:not(:last-of-type){ margin-bottom: 7px; }
}

@media screen and (max-width: 1200px){
	.team_board_list{ 
		--line: 2; 
	}
	.team_board_list .item:nth-of-type(3n){ margin-right: var(--gapR); }
	.team_board_list .item:nth-of-type(2n){ margin-right: 0; }
}

@media screen and (max-width: 850px){
	.team_board_list .item{ width: 100%; margin-right: 0 !important; }
}


/* 기본 게시판 */
.board_box{ border-top: 1px solid #000; }
.board_box colgroup col{ width: 100%; }
.board_box colgroup col:nth-of-type(1){ width: 150px; }
.board_box colgroup col:nth-of-type(2){  }
.board_box colgroup col:nth-of-type(3){ width: 300px; }
.board_box colgroup col:nth-of-type(4){ width: 300px; }
.board_box colgroup col:nth-of-type(5){ width: 150px; }

.board_box table tr{ position: relative; border-bottom: 1px solid #e0e0e0; }
.board_box table th{ position: relative; font-size: 17px; font-weight: 700; color: #111; padding: 40px 10px; }
.board_box table th::after{ content:""; width: 1px; height: 15px; background: #e0e0e0; position: absolute; top: 50%; right: 0; transform: translateY(-50%); }
.board_box table th:last-of-type::after{ display: none; }
.board_box table td{ font-size: 16px; font-weight: 400; color: #666; padding: 40px; text-align: center; }
.board_box table td a{ display: block; font-size: 17px; font-weight: 600; color: #222; text-align: left; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }

.board_box table thead{ background: #f9f9f9; }
.board_box table tbody tr::after{ content: ""; width: 100%; height: 1px; background: var(--mainColor); position: absolute; bottom: -1px; left: 0; transform: scaleX(0); transform-origin: left; transition: transform 1s; }

/* 기본 게시판 - 공지 */
.board_box table .notice td{ background: #FFF7F8; }
.board_box table .notice td i{ color: var(--mainColor); }

@media screen and (hover: hover){
    .board_box table tbody tr:hover::after{ transform: scaleX(1); }
}


/* 이미지 게시판 변수 */
.img_borad_list{ 
	--gapB: 120px; 
	--gapR: 40px; 
	--line: 3; 
}

/* 이미지 게시판 */
.img_borad_list{ display: flex; flex-wrap: wrap; margin-bottom: calc(var(--gapB) * -1); }
.img_borad_list .item{ width: calc((100% - calc(var(--gapR) * (var(--line) - 1))) / var(--line)); margin-right: var(--gapR); margin-bottom: var(--gapB); }
.img_borad_list .item:nth-of-type(3n){ margin-right: 0; }
.img_borad_list .item a{ display: block; border-bottom: 1px solid #DDD; position: relative; }
.img_borad_list .item a::after{ content: ""; width: 100%; height: 1px; background: var(--mainColor); position: absolute; bottom: -1px; left: 0; transform: scaleX(0); transform-origin: left; transition: transform 0.4s; }
.img_borad_list .item figure{ display: block; position: relative; padding-bottom: 57.14%; border-radius: var(--contentR); overflow: hidden; }
.img_borad_list .item figure img{ width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%) scale(1); transition: transform 0.4s; }
.img_borad_list .item .text{ padding: 20px 0 50px; }
.img_borad_list .item .text h6,
.img_borad_list .item .text p{ height: 3.2em; display: -webkit-box; letter-spacing: -0.02em; line-height: 1.6; word-break: break-all; text-overflow: ellipsis; overflow: hidden; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.img_borad_list .item .text h6{ font-size: 24px; font-weight: 500; color: #222; }
.img_borad_list .item .text p{ font-size: 21px; font-weight: 300; color: #666; margin: 20px 0 40px; }
.img_borad_list .item .text span{ display: block; font-size: 17px; font-weight: 400; color: #AAA; letter-spacing: -0.04em; }

@media screen and (hover: hover){
	.img_borad_list .item:hover a::after{ transform: scaleX(1); }
	.img_borad_list .item:hover figure img{ transform: translate(-50%, -50%) scale(1.05); }
}

@media screen and (max-width: 1700px){	
	.img_borad_list{ 
		--gapB: 80px;
	}
	.img_borad_list .item .text{ padding: 20px 0 40px; }
	.img_borad_list .item .text h6{ font-size: 22px; }
	.img_borad_list .item .text p{ font-size: 19px; margin: 20px 0 30px; }
}

@media screen and (max-width: 1280px){
	.img_borad_list{ 
		--gapB: 40px; 
		--gapR: 25px; 
	}
	.img_borad_list .item .text{ padding: 15px 0 25px; }
	.img_borad_list .item .text h6{ font-size: 20px; }
	.img_borad_list .item .text p{ font-size: 17px; margin: 10px 0 20px; }
	.img_borad_list .item .text span{ font-size: 16px; }
}

@media screen and (max-width: 1000px){
	.img_borad_list{ 
		--line: 2;
	}
	.img_borad_list .item:nth-of-type(3n){ margin-right: var(--gapR); }
	.img_borad_list .item:nth-of-type(2n){ margin-right: 0; }
	.img_borad_list .item .text{ padding: 10px 0 15px; }
	.img_borad_list .item .text h6{ font-size: 19px; }
	.img_borad_list .item .text p{ font-size: 16px; margin: 5px 0 15px; }
	.img_borad_list .item .text span{ font-size: 15px; }
}

@media screen and (max-width: 750px){
	.img_borad_list{ 
		--gapR: 20px; 
	}
}


/* 상세 페이지 변수 */
.view_ctn{ 
	--border: 1px solid #DDD;
	--pageW: 26px;
	--dlGap: 30px;
	--icon: 16px;
 }

/* 상세 페이지 */
.view_ctn .tit{ text-align: center; border-top: 1px solid #000; }
.view_ctn .tit h2{ font-size: 42px; font-weight: 400; color: #222; letter-spacing: -0.02em; padding: 60px 0; }
.view_ctn .tit .border{ padding: 30px 0; border-top: var(--border); border-bottom: var(--border); overflow: hidden; }
.view_ctn .tit ul{ display: flex; flex-wrap: wrap; justify-content: center; align-items: center; margin: -5px -35px; }
.view_ctn .tit ul li{ font-size: 21px; font-weight: 300; color: #666; letter-spacing: -0.02em; margin: 5px 35px; }
.view_ctn .tit ul li span{ display: inline-block; font-weight: 500; color: #222; line-height: inherit; padding-right: 20px; position: relative; }
.view_ctn .tit ul li span::after{ content: ""; width: 1px; height: 10px; background: #CCC; position: absolute; top: 50%; right: 10px; transform: translate(50%, -50%); }

.view_ctn .info{ padding: 50px 0; font-size: 21px; }
.view_ctn .info a{ color: var(--mainColor); text-decoration: underline; }

.view_ctn .file_box dl,
.view_ctn .pages dl{ display: flex; align-items: center; }
.view_ctn .file_box dl dt,
.view_ctn .pages dl dt{ white-space: nowrap; position: relative; }
.view_ctn .file_box dl dt span,
.view_ctn .pages dl dt span{ display: inline-block; padding: 0 var(--dlGap); }
.view_ctn .file_box dl dd,
.view_ctn .pages dl dd{ width: calc(100% - var(--dt)); }

.view_ctn .file_box{ margin-bottom: 50px; }
.view_ctn .file_box dl{ font-size: 20px; border-bottom: var(--border); padding: 0 20px; }
.view_ctn .file_box dl:first-of-type{ border-top: var(--border); }
.view_ctn .file_box dl dt{ font-weight: 500; color: #222; letter-spacing: -0.02em; }
.view_ctn .file_box dl dt::after{ content: ""; width: 1px; height: 20px; background: #E0E0E0; position: absolute; top: 50%; right: 0; transform: translate(50%, -50%); }
.view_ctn .file_box dl dd a{ display: block; font-weight: 300; color: #999; letter-spacing: -0.02em; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding: var(--dlGap); padding-right: 180px !important; position: relative; transition: color 0.3s; }
.view_ctn .file_box dl dd a::before,
.view_ctn .file_box dl dd span::before{ filter: grayscale(1) brightness(1.1); -webkit-filter: grayscale(1) brightness(1.1); transition: filter 0.3s; }
.view_ctn .file_box dl dd a::before{ content: ""; width: var(--icon); height: var(--icon); display: inline-block; background: url("/img/board/file_icon.svg") no-repeat center center / contain; margin-right: 8px; vertical-align: middle; transform: translateY(-1px); }
.view_ctn .file_box dl dd span{ position: absolute; top: 50%; right: var(--dlGap); transform: translateY(-50%); }
.view_ctn .file_box dl dd span::before{ content: ""; width: var(--icon); height: var(--icon); display: inline-block; background: url("/img/board/download_icon.svg") no-repeat center center / contain; vertical-align: middle; transform: translateY(-1px); margin-right: 10px; }


.view_ctn .pages{ display: flex; justify-content: space-between; }
.view_ctn .pages dl{ width: calc((100% - 30px) / 2); padding: 30px 25px; border: var(--border); border-radius: var(--contentR); transition: border-color 0.3s; }
.view_ctn .pages dl:last-of-type{ flex-direction: row-reverse; text-align: right; }
.view_ctn .pages dl dt{ font-size: 21px; font-weight: 500; color: #222; letter-spacing: -0.02em; transition: color 0.3s; }
.view_ctn .pages dl dt::before{ content: ""; width: 1px; height: 20px; background: #E0E0E0; position: absolute; top: 50%; right: 0; transform: translate(50%, -50%); }
.view_ctn .pages dl:last-of-type dt::before{ right: unset; left: 0; transform: translate(-50%, -50%); }
.view_ctn .pages dl dd a{ display: block; font-size: 20px; font-weight: 300; color: #555; letter-spacing: -0.02em; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding: var(--dlGap); }
.view_ctn .pages dl dt span::before,
.view_ctn .pages dl dt span::after{ width: var(--icon); height: var(--icon); display: inline-block; vertical-align: middle; transform: translateY(-2px); filter: brightness(0); -webkit-filter: brightness(0); transition: color 0.3s; }
.view_ctn .pages dl:first-of-type dt span::before,
.view_ctn .pages dl:first-of-type dt span::after{ background: url("/img/board/page_prev.svg") no-repeat center center / contain; }
.view_ctn .pages dl:last-of-type dt span::before,
.view_ctn .pages dl:last-of-type dt span::after{ background: url("/img/board/page_next.svg") no-repeat center center / contain; }
.view_ctn .pages dl:first-of-type dt span::before,
.view_ctn .pages dl:last-of-type dt span::after{ content: ""; }
.view_ctn .pages dl:first-of-type dt span::before{ margin-right: 10px; }
.view_ctn .pages dl:last-of-type dt span::after{ margin-left: 10px; }


.view_ctn .list_btn{ margin-top: 100px; }
.view_ctn .list_btn a{ max-width: max-content; display: flex; justify-content: center; align-items: center; background: transparent; border: 1px solid var(--mainColor); border-radius: var(--contentR); font-size: 18px; font-weight: 500; color: var(--mainColor); padding: 25px 45px; margin: 0 auto; transition: background 0.3s, color 0.3s; }
.view_ctn .list_btn a::before{ content: ""; display: inline-block; width: 14px; height: 12px; background: url("/img/board/list_icon.svg") no-repeat center center / contain; margin-right: 10px; filter: unset; -webkit-filter: unset; transition: filter 0.3s; }


/* youtube-iframe */
.youtube-iframe{ position: relative; padding-bottom: 56.25%; margin-bottom: 20px; }
.youtube-iframe iframe{ width: 100% !important; height: 100% !important; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }

@media screen and (hover: hover){
	.view_ctn .file_box dl dd a:hover{ color: var(--mainColor); }
	.view_ctn .file_box dl dd a:hover::before,
	.view_ctn .file_box dl dd a:hover span::before{ filter: unset; -webkit-filter: unset; }

	.view_ctn .pages dl:hover{ border-color: var(--mainColor); }
	.view_ctn .pages dl:hover dt{ color: var(--mainColor); }
	.view_ctn .pages dl:hover dt span::before,
	.view_ctn .pages dl:hover dt span::after{ filter: unset; -webkit-filter: unset; }

	.view_ctn .list_btn a:hover{ background: var(--mainColor); color: #FFF; }
	.view_ctn .list_btn a:hover::before{ filter: invert(1) brightness(5); -webkit-filter: invert(1) brightness(5); }
}

@media screen and (max-width: 1700px){
	.view_ctn{ 
		--dlGap: 25px;
	}
	.view_ctn .tit h2{ font-size: 36px; padding: 40px 0; }
	.view_ctn .tit .border{ padding: 20px 0; }
	.view_ctn .tit ul{ margin: -5px -20px; }
	.view_ctn .tit ul li{ font-size: 19px; margin: 5px 20px; }

	.view_ctn .info{ font-size: 19px; }

	.view_ctn .file_box dl{ padding: 0; }
	.view_ctn .file_box dl{ font-size: 18px; }
	.view_ctn .file_box dl dt::after{ height: 15px; }
	.view_ctn .file_box dl dd a{ padding: calc(var(--dlGap) - 5px) var(--dlGap); }

	.view_ctn .pages dl{ padding: 20px 15px; }
	.view_ctn .pages dl dt{ font-size: 19px; }
	.view_ctn .pages dl dt::before{ height: 15px; }
	.view_ctn .pages dl dd a{ ont-size: 18px; }


	.view_ctn .list_btn{ margin-top: 70px; }
	.view_ctn .list_btn a{ padding: 20px 30px; }
}

@media screen and (max-width: 1280px){
	.view_ctn{ 
		--dlGap: 20px;
	}
	.view_ctn .tit h2{ font-size: 30px; padding: 30px 0; }
	.view_ctn .tit .border{ padding: 15px 0; }
	.view_ctn .tit ul{ margin: -2px -7px; }
	.view_ctn .tit ul li{ font-size: 17px; margin: 2px 7px; }
	.view_ctn .tit ul li span{ padding-right: 15px; }
	.view_ctn .tit ul li span::after{ right: calc(15px / 2); }

	.view_ctn .info{ font-size: 17px; }

	.view_ctn .file_box{ margin-bottom: 30px; }
	.view_ctn .file_box dl{ font-size: 17px; }
	.view_ctn .file_box dl dd a{ padding: var(--dlGap); padding-right: 150px !important; }

	.view_ctn .pages dl{ padding: 10px 5px; }
	.view_ctn .pages dl dt{ font-size: 17px; }
	.view_ctn .pages dl dd a{ font-size: 17px; }

	.view_ctn .list_btn{ margin-top: 40px; }
	.view_ctn .list_btn a{ font-size: 17px; padding: 17px 25px; }
}

@media screen and (max-width: 900px){
	.view_ctn{ 
		--dlGap: 15px;
	}
	.view_ctn .tit h2{ font-size: 24px; padding: 30px 0; }
	.view_ctn .tit ul li{ font-size: 15px; }

	.view_ctn .file_box{ margin-bottom: 20px; }
	.view_ctn .file_box dl{ font-size: 16px; }
	.view_ctn .file_box dl dd a{ padding-right: 120px !important; }
	.view_ctn .file_box dl dd span::before{ margin-right: 7px; }

	.view_ctn .pages{ flex-direction: column; }
	.view_ctn .pages dl{ width: 100%; flex-direction: row !important; text-align: left !important; padding: 5px 0; }
	.view_ctn .pages dl:not(:last-of-type){ margin-bottom: 10px; }
	.view_ctn .pages dl:last-of-type dt::before{ left: unset; right: 0; transform: translate(50%, -50%); }
	.view_ctn .pages dl:last-of-type dt span::before{ content: ""; margin-right: 10px; }
	.view_ctn .pages dl:last-of-type dt span::after{ display: none; }
	.view_ctn .pages dl dt{ font-size: 16px; }
	.view_ctn .pages dl dd a{ font-size: 16px; }

	.view_ctn .list_btn a{ padding: 15px 20px; }
}