/* 공통 */
*{ box-sizing: border-box; }
figure{margin: 0;}
select::-ms-expand { display: none; }
select { 
    -webkit-appearance: none; 
    -moz-appearance: none; 
    appearance: none;
	outline: none;
}
input{outline: none; border: 1px solid #000;}
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 */
:root{
	/* 페이지버튼 */
	--pagingFontStyle: 'Red Hat Display', sans-serif;
	--pagingNumC : #333;
	--pagingArrowC: #666;
	--aSize : 30px;
	--pagingMarTop: 100px;
}

.paging{display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;}
.paging a{ letter-spacing: 0; }
.paging .arr{display:flex;}
/* .paging .arr a.last,
.paging .arr a.first{letter-spacing:-10px;} */
.paging .arr a.last i,
.paging .arr a.first i{ display: inline-block; -webkit-transform:translateX(-5px);transform:translateX(-5px); letter-spacing: -10px;}
.paging a{display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center; }
.paging ul{display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin:0 5px;}
.paging .arr a:not(:last-child),.paging ul li:not(:last-child){margin-right:5px;}

/* 커스텀 */
.paging{margin-top: var(--pagingMarTop);}
.paging a{width:var(--aSize); height:var(--aSize); color: var(--pagingNumC); font-family: var(--baseFont);  line-height: var(--aSize); font-weight: 600; font-size:1.6rem; border-radius:50%; border:none;}
.paging ul li.on a {
  color:#fff;
  background: var(--mainColor);
  border-color: var(--mainColor);
}
.paging .arr a{border:none; color: var(--pagingArrowC);}
.paging .arr a.first i{transform:translateX(-6px);}
.paging .arr a.last i{transform:translateX(-4px);}
.paging .arr a.first i:first-of-type{transform:translateX(-5px);}
.paging .arr a.last i:last-of-type{transform:translateX(-5px);}

@media screen and (max-width: 1250px) {
	:root{
		--pagingMarTop: 50px;
	}
	.paging a{font-size: 1.5rem;}
	.paging .arr a:not(:last-child), .paging ul li:not(:last-child){margin-right: 0;}
}



/* search_box */ 
:root{
	/* 검색창 */
	--sfontSiez: 17px;
	--sfontColor: #111;
	--sHeight: 60px;
	--sLetter: -0.02em;
	--sPadding: 0 30px;
	--sborderR: 5px;
}

/* 기본 */
.search_box{display:flex; align-items:center; gap:15px; padding: 60px; background: #F8F8F8;}
.search_box select{width: calc(35% - 90px); border:none; background:#fff url("/img/board/icon_select.png") no-repeat calc(100% - 30px) 50%; outline: none; appearance: none; --webkit-appearance: none;}
.search_box input{width: calc(65% - 90px); border:none; outline: none; }
.search_box input::placeholder{color: #ccc;}
.search_box button{width: 180px; font-family: var(--baseFont); font-weight: bold; color: #fff; background: #000000; border: none; outline: none; cursor: pointer; transition: background-color 0.3s;}

/* 변수(:root) */
.search_box *{letter-spacing: var(--sLetter);}
.search_box select{height: var(--sHeight); font-size: var(--sfontSiez); color: var(--sfontColor); padding: var(--sPadding); border-radius:var(--sborderR);}
.search_box input{height: var(--sHeight); font-size: var(--sfontSiez); color: var(--sfontColor); padding: var(--sPadding);  border-radius:var(--sborderR);}
.search_box button{height: var(--sHeight); font-size: var(--sfontSiez); border-radius:var(--sborderR);}

/* 호버 */
.search_box button:hover{background: var(--mainColor);}

/* 미디어 */
@media screen and (max-width:1200px) {
	:root{
		/* 검색창 */
		--sPadding: 0 15px
	}
	.search_box{padding: 30px;}
}

@media screen and (max-width:800px) {
	:root{
		/* 검색창 */
		--sHeight: 50px;
		--sfontSiez: 16px;
	}
	.search_box{flex-wrap: wrap; }
	.search_box select{width: 100%; background:#fff url("/img/board/icon_select.png") no-repeat calc(100% - 15px) 50%;}
	.search_box input{width: calc(100% - 145px);}
	.search_box button{width: 130px;}
}


/* .board_box */
:root{
	/* 게시판-기본(공통) */
	--marginTop:60px;
	--tableLine: #e0e0e0;
	--noticeBg: #FFF7F8;
	--thBg: #f9f9f9;
	--thPadding: 40px 0;
	--thFontSize: 17px;
	--thFontC: #111;
	--tdFontSize: 1.6rem;
	--tdFontC: #666;
	--tdLinkC: #222;
	--tdLinkPadding: 40px;
	/* 게시판-채용 */
	--defaultIngBg: #999;
}

/* 기본 */
.board_box{border-top: 1px solid #000;}
.board_box table tr{position: relative;}
.board_box table tr::after{content:""; position: absolute; bottom: 0; left: 0; width: 0; height: 1px; transition: 0.7s;}
.board_box table th{position: relative;}
.board_box table th::after{content:""; position: absolute; top: 50%; right: 0; width: 1px; height: 15px; transform: translateY(-50%);}
.board_box table th:last-of-type::after{display: none;}
.board_box table td{text-align: center; padding: var(--tdLinkPadding); }
.board_box table td h6{width: 100%; display: inline-block; vertical-align: top; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-align: left; font-weight: 600; font-size: 1.7rem; color: #222;}
/* 변수(:root) */
.board_box{margin-top: var(--marginTop);}
.board_box table tr::after{background: var(--mainColor);}
.board_box table thead tr::after{ display: none; }
.board_box table th{background: var(--thBg); padding: var(--thPadding); font-size: var(--thFontSize); color: var(--thFontC); border-bottom: 1px solid var(--tableLine);}
.board_box table th::after{background: var(--tableLine);}
.board_box table td{font-size: var(--tdFontSize); color: var(--tdFontC); border-bottom: 1px solid var(--tableLine);}
.board_box table td *{ font-size: var(--tdFontSize); color: var(--tdFontC); }
.board_box table td a{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 20; }
/* 호버 */
.board_box table tr:hover::after{width: 100%;}


/* 공지 */
.board_box .notice td:first-of-type{ position: relative; }
.board_box .notice td:first-of-type::before{ content: ""; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: #fff; }
.board_box .notice td:first-of-type::after{ content: "공지"; border: 1px solid var(--mainColor); color: var(--mainColor); padding: 9px 18px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }

@media screen and (max-width: 1600px){
	:root{
		--thPadding: 30px 0;
		--tdLinkPadding: 30px;
	}
}

@media screen and (max-width: 1250px){
	:root{
		--marginTop: 30px;
	}
}

@media screen and (max-width: 1000px){
	:root{
		--thPadding: 25px 0;
		--tdLinkPadding: 25px;
	}
}


/* 게시판-상세 */
:root{
	--titCommonMargin: 30px;
	--pagesBg: #F8F8F8;
	--dtWidth: 140px;
	--dtColor: #222;
	--ddWidth: calc(100% - 140px);
	--ddColor: #666;
	--lightLineC: #e0e0e0;
}

.view_ctn{border-top: 1px solid #000;}
.view_ctn .tit{text-align: center; padding: 60px 0;}
/* .view_ctn .tit .tag{display: inline-block; padding: 0 23px; line-height: 35px; border-radius:20px; font-weight: 500; font-size: 15px; color: #fff; min-width: 85px} */
.view_ctn .tit .tag{ font-size: 2rem; font-weight: 600; color: var(--mainColor); margin-bottom: 10px; }
.view_ctn .tit h2{font-weight: 600; font-size: 3.2rem; color: #222;}
.view_ctn .tit ul{display:flex; justify-content: center; flex-wrap: wrap; gap: 40px;}
.view_ctn .tit ul li{font-size: 1.6rem; color: #666;}
.view_ctn .tit ul li span{font-weight: 600; color: #222;}

.view_ctn .info{padding: 65px 0; font-size: 1.6rem; }

.view_ctn .file_box{padding: 5px 0;}
.view_ctn .file_box dl{display:flex; flex-wrap:wrap; align-items:center;}
.view_ctn .file_box dl dt{position: relative; font-weight: 500; font-size: 1.6rem; padding: 20px 30px; }
.view_ctn .file_box dl dd{ font-size: 1.6rem;}
.view_ctn .file_box dl dd a{position: relative; display: inline-block; vertical-align: top; width: 100%; padding: 20px 30px; padding-right: 150px !important; transition: 0.3s; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.view_ctn .file_box dl dd a span{position: absolute; top: 50%; right: 30px; transform: translateY(-50%);}
.view_ctn .file_box dl dd a i{margin-right: 8px;}

.view_ctn .pages{margin-top: 60px;}
.view_ctn .pages dl{display: flex; align-items: center; margin-bottom: 10px;}
.view_ctn .pages dl:last-of-type{margin-bottom: 0;}
.view_ctn .pages dl dt{position: relative; padding: 24px 30px; font-weight: 500; font-size: 1.6rem;}
.view_ctn .pages dl dt i{margin-right: 15px;}
.view_ctn .pages dl dd a{display: inline-block; vertical-align: top; width: 100%; padding: 24px 30px; font-size: 1.6rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.view_ctn .pages dl dt::after,
.view_ctn .file_box dl dt::after{content:""; position: absolute; top: 50%; right: -1px; width: 1px; height: 20px; background: #e0e0e0; transform: translateY(-50%);}
.view_ctn .list_btn{margin-top: 130px; text-align: center;}
.view_ctn .list_btn a{display: inline-block; width: 180px; line-height: 60px; vertical-align: top; background: #000; font-weight: bold; font-size: 1.7rem; color: #fff; border-radius: 0; letter-spacing: -0.02em; transition: 0.3s;}
.view_ctn .list_btn a i{margin-right: 10px; transform: translateY(1px);}
/* 변수 */
.view_ctn .tit{border-bottom: 1px solid var(--lightLineC);}
/* .view_ctn .tit .tag{background: var(--mainColor); margin: 0 auto var(--titCommonMargin);} */
.view_ctn .tit ul{margin-top: var(--titCommonMargin);}
.view_ctn .file_box{border-top: 1px solid var(--lightLineC); border-bottom: 1px solid var(--lightLineC);}
.view_ctn .file_box dl dt{width:var(--dtWidth); color: var(--dtColor);}
.view_ctn .file_box dl dd{width: var(--ddWidth); }
.view_ctn .file_box dl dd a{ font-family: var(--Lora); color: var(--ddColor);}
.view_ctn .pages dl{/* background: var(--pagesBg); */ border-top: 1px solid var(--lightLineC); border-bottom: 1px solid var(--lightLineC);}
.view_ctn .pages dl dt{width: var(--dtWidth); color: var(--dtColor);}
.view_ctn .pages dl dd{width: var(--ddWidth);}
.view_ctn .pages dl dd a{ color: var(--ddColor);}

/* 호버 */
.view_ctn .file_box dl dd:hover a{color: var(--mainColor);}
.view_ctn .list_btn a:hover{background: var(--mainColor);}

@media screen and (max-width: 1600px){
	.view_ctn .tit{ padding: 50px 0; }
	.view_ctn .tit h2{ font-size: 2.8rem; }
	.view_ctn .tit .tag{ font-size: 1.8rem; }

	.view_ctn .list_btn{ margin-top: 100px; }

}

@media screen and (max-width: 1250px){
	:root{
		--titCommonMargin: 20px;
		--dtWidth: 110px;
		--ddWidth: calc(100% - 110px);
	}

	.view_ctn .tit{ padding: 40px 0; }
	.view_ctn .tit h2{ font-size: 2.4rem; }
	.view_ctn .tit .tag{ font-size: 1.7rem; }
	.view_ctn .tit ul li{font-size: 1.5rem; }

	.view_ctn .file_box dl dt, .view_ctn .file_box dl dd a{ font-size: 1.5rem; padding: 15px; }
	.view_ctn .file_box dl dd a{ padding-right: 120px !important; }
	.view_ctn .file_box dl dd a span{ right: 15px; }

	.view_ctn .pages{ margin-top: 30px; }
	.view_ctn .pages dl dt, .view_ctn .pages dl dd a{ font-size: 1.5rem; padding: 15px; }
	.view_ctn .pages dl dt i{ margin-right: 5px; }

	.view_ctn .list_btn{ margin-top: 80px; }
	.view_ctn .list_btn a{ width: 150px; height: 55px; font-size: 1.6rem; line-height: 55px; }

}

@media screen and (max-width: 900px){
	.view_ctn .tit{ padding: 30px 0; }
	.view_ctn .tit h2{ font-size: 2.2rem; }
	.view_ctn .tit .tag{ font-size: 1.6rem; }

	.view_ctn .file_box dl dt{ font-size: 1.5rem; }

	.view_ctn .list_btn{ margin-top: 60px; }
	.view_ctn .list_btn a{ width: 120px; height: 50px; line-height: 50px; }
}



/* 썸네일 게시판 (공통) */
.img_borad_list{display: flex; flex-wrap:wrap;}
.img_borad_list .item{ position: relative; cursor: pointer; }
.img_borad_list .item a{ position: absolute;top: 0; left: 0; right: 0;bottom: 0; z-index: 10; }
.img_borad_list .item figure{ position: relative; overflow: hidden; }
.img_borad_list .item figure::after{ content: ""; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); position: absolute; top: 0; left: 0; z-index: 3; opacity: 0; transition: opacity 0.8s; }
.img_borad_list .item figure img{ width: 100%; height: 100%; object-fit: cover; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); filter: grayscale(0); transition: all 0.8s; }
.img_borad_list .item .txt{ padding-top: 20px; }
.img_borad_list .item .txt span{ display: inline-block; line-height: 30px; border: 1px solid var(--mainColor); color: var(--mainColor); border-radius: 15px; font-weight: 600; font-size: 1.4rem; text-align: center; margin-bottom: 15px; padding: 0 14px; }
.img_borad_list .item .txt h2{ height: 3.2em; font-size: 2rem; font-weight: 600; color: #222; line-height: 1.6; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; white-space: normal; overflow: hidden; text-overflow: ellipsis; word-wrap: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }

@media (hover: hover){
	.img_borad_list .item:hover figure::after{ opacity: 1; }
	.img_borad_list .item:hover figure img{ transform: translate(-50%,-50%) scale(1.1); filter: grayscale(0); }
}

@media screen and (max-width: 1600px){
	.img_borad_list .item .txt h2{ font-size: 1.9rem; }
}

@media screen and (max-width: 1250px){
	.img_borad_list .item .txt{ padding-top: 10px; }
	.img_borad_list .item .txt h2{ font-size: 1.8rem; }
}

@media screen and (max-width: 900px){
	.img_borad_list .item .txt h2{ font-size: 1.7rem; }
}


:root{
	--faqBorderC:#E0E0E0;
	--iconFont: 3.5rem;
}
/* 기본 */
.faq_ctn{border-top: 1px solid #000; margin-top: 100px; }
.faq_ctn .item{border-bottom: 1px solid var(--faqBorderC);}
.faq_ctn .item .tit{display:flex; /* align-items: center; */ padding: 38px 60px; cursor: pointer;}
.faq_ctn .item .tit > span{display: block; width: 86px; font-weight: 700; font-size: var(--iconFont); color: #CCC; transition: color 0.5s;}
.faq_ctn .item .tit h2{position: relative; width: calc(100% - 86px); font-weight: 500; font-size: 2rem; letter-spacing: -0.02em; color: #222; /* white-space: nowrap; overflow: hidden; text-overflow: ellipsis; */ padding-right: 60px; margin-top: 9px; }
.faq_ctn .item .tit h2 .icon{display: inline-block; vertical-align: top; width: 29px; height: 29px;position: absolute; top: 50%; right: 0; transform: translateY(-50%); }
.faq_ctn .item .tit h2 .icon::before{content:""; position: absolute; top: 50%; right: 0; width: 100%; transform: translateY(-50%); height: 1px; background: #666;}
.faq_ctn .item .tit h2 .icon::after{content:""; position: absolute; top: 50%; left: 50%; height: 100%; transform: translate(-50%, -50%) rotate(0deg); width: 1px; background: #666; transition: all 0.5s;}
.faq_ctn .item .info{ align-items:center; border-top: 1px solid var(--faqBorderC); padding: 50px 60px; background: #F8F8F8; display: none; font-size: 0;}
.faq_ctn .item .info span{display: inline-block; /* vertical-align: middle; */ vertical-align: top; width: 86px; font-weight: 700; font-size: var(--iconFont); color: var(--mainColor);}
.faq_ctn .item .info .txt_box{display: inline-block; vertical-align: middle; width: calc(100% - 86px); margin-top: 12px; }
.faq_ctn .item .info p{font-weight: 300; font-size: 1.7rem; letter-spacing: -0.02em; color: #333;}

/* on */
.faq_ctn .item.on .tit > span{ color: var(--mainColor); }
.faq_ctn .item.on .tit h2 .icon::after{ top: 50%; transform: translate(-50%, -50%) rotate(90deg); }

@media screen and (max-width: 1600px){
	:root{
		--iconFont: 3rem;
	}

	.faq_ctn{ margin-top: 70px; }
	.faq_ctn .item .tit{ padding: 35px 50px; }
	.faq_ctn .item .tit h2{ font-size: 1.9rem; }
	.faq_ctn .item .info{ padding: 45px 50px; }
	.faq_ctn .item .info .txt_box{ margin-top: 8px; }
}

@media screen and (max-width: 1250px){
	:root{
		--iconFont: 2.8rem;
	}

	.faq_ctn{ margin-top: 40px; }
	.faq_ctn .item .tit{ padding: 30px 40px; }
	.faq_ctn .item .tit > span{ width: 70px }
	.faq_ctn .item .tit h2{ width: calc(100% - 70px); font-size: 1.8rem; padding-right: 50px; margin-top: 7px; }
	.faq_ctn .item .tit h2 .icon{ width: 25px; height: 25px; }
	.faq_ctn .item .info span{ width: 70px; }
	.faq_ctn .item .info .txt_box{ width: calc(100% - 70px); margin-top: 6px; }
	.faq_ctn .item .info{ padding: 35px 40px; }
}

@media screen and (max-width: 900px){
	:root{
		--iconFont: 2.6rem;
	}

	.faq_ctn{ margin-top: 20px; }
	.faq_ctn .item .tit{ padding: 20px; }
	.faq_ctn .item .tit > span{ width: 40px; }
	.faq_ctn .item .tit h2{ width: calc(100% - 40px); font-size: 1.7rem; padding-right: 40px; margin-top: 5px; }
	.faq_ctn .item .tit h2 .icon{ width: 20px; height: 20px; }
	.faq_ctn .item .info{ padding: 20px; }
	.faq_ctn .item .info span{ width: 40px; }
	.faq_ctn .item .info .txt_box{ width: calc(100% - 40px); margin-top: 5px; }
	.faq_ctn .item .info p{ font-size: 1.6rem; }
}