/* list */
.list_box {position: relative; padding: 16px 20px 40px 20px; border-bottom: 1px solid #000;}
.list_box .row_list { display: flex; flex-direction: row; justify-content: center;}
.list_box .row_list li a.character_on { color: #fff; background-color: #41478f; border: 1px solid #41478f;}
.list_box .row_list li a { display: block; font-weight: 300;}
.list_box .row_list li a {padding: 12px 25px 12px 25px; font-size: 16px; color: #000; border: 1px solid #000; margin: 0 5px 10px 0; white-space: nowrap;}

.accCon_searchArea {display: flex; width: 100%; margin: 40px 0px;}
.search_value {display: flex; align-items: center; width: 20%;}
.search_value select { width: 100%; padding: 0px 20px; box-sizing: border-box; height: 50px; border: 1px solid #000; font-weight: 300; color: #000; font-size: 16px;}
.search_value02 {display: flex; align-items: center; width: 80%; border: 1px solid #000;  border-left: 0 none;}
.search_value02 input[type="text"] { width: 90%; height: 100%; box-sizing: border-box; color: #000; font-weight: 300; padding: 0px 20px; font-size: 16px;}
.search_value02 input[type="text"]::placeholder { color: #000;}
.search_value02 button { width: 10%; color: #000; font-size: 20px; height: 100%; text-align: center; cursor: pointer;}


.accConArea ul{ display: flex; width: 100%; flex-wrap: wrap;  }
.accConArea ul li { width: 20%; margin-bottom: 15px;}
.accConArea ul li .box { width: 95%; border: 1px solid #dfdfdf; margin:  0 auto; display: flex; flex-direction: column; align-items: center; padding-bottom: 20px;}
.accConArea ul li .box .image { width: 100%; height: 300px;}
.accConArea ul li .box > div { text-align: center;}
.accConArea ul li .box > div.tag { border: 1px solid #000; padding: 3px 13px; border-radius: 20px; margin: 15px 0px;}
.accConArea ul li .box > div.title a {
		display: inline-block;
		width: 100%;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: normal;
		line-height: 1.2em;
		height: 2.45em;
		text-align: center;
		word-wrap: break-word;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
		box-sizing: border-box;
		padding: 0px 10px;
		font-size: 15px;
		color: #000;
		}



/* view */
.conTopline{ width: 100%; display: flex; justify-content: flex-end;}
.con_view{clear:both; display: flex;flex-direction: row; padding-bottom: 30px; margin-bottom: 30px;}
.con_cl{ display: flex; box-sizing: border-box; flex-direction: column; border-top: none; margin-bottom: 50px; position: relative;}

.accConTabDiv_Area { border: 1px solid #dfdfdf; padding: 30px 30px;}

#accConTabDiv { display: flex; margin-bottom: 20px;; }

#accConTabDiv ul {display: flex; width: 100%;  flex-wrap: wrap;}
#accConTabDiv ul li {position: relative; width:16.66666666666667%; margin-bottom:-1px;  margin-left:-1px;}
#accConTabDiv ul li a {
		height: 50px;
		padding: 10px 30px;
		font-size: 16px;
		color: #000;
		text-align: center;
		border: 1px solid #d8d8d8;
		background-color: #fff;
		display: flex;
		align-items: center;
		justify-content: center;
}
#accConTabDiv ul li a div {
	display: inline-block;
	width: 100%;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	text-align: center;
	/* 여러 줄 자르기 추가 스타일 */
	white-space: normal;
	line-height: 1.2;
	max-height: 2.4em;
    height: auto;
	word-wrap: break-word;
	display: -webkit-box;
	-webkit-line-clamp:2;
	-webkit-box-orient: vertical;
}
#accConCdTabUl li.active a { position: relative; z-index: 1;  border: 1px solid #dfdfdf; color: #fff; border-bottom: 0 none;background-color: #41478f;}

.thumb-view{display: flex; flex-direction: column; width: 30%;  background-color: #fff;}
.ch_swiper{ display: flex; flex-direction: row; flex-wrap: wrap; width: 100%; background-color: #fff;}

.accConTabDiv { width: 100%;}
.accConTabDiv_con { width: 100%; margin-bottom: 10px;}


#accConCdTabUl { display: flex; position: relative; z-index: 2; bottom: -1px;}

#accConCdTabUl li {text-align: center;}
#accConCdTabUl li a {
	border: 1px solid #dfdfdf;
	padding: 15px 30px;
	font-size: 16px;
	font-weight: 500;
	display: block;
}


.thumb-view .image{ display: block; position: relative; overflow: hidden; height: 320px; font-size: 0; line-height: 0; background-color: #fff; border:1px solid #dfdfdf; }

.info-view { padding:0; padding-left:50px; box-sizing: border-box;}
.info-view .info-view-head {border-bottom: 0px;}
.info-view .info_meta_table { border-bottom: 0px;}
.info_meta_table { margin-top: 0; margin-bottom: 0;}

.info-view .info-view-head .info-view-title { justify-content: space-between; align-items: flex-start;}
.info-view .info-view-head .info-view-title .category {word-break: normal; margin: 8px 0 0 0;}
.info-view .info-view-head .info-view-title div { width: 90%; padding: 0 0px;}


.con_view .info-view-head .info-view-title .thumb_image_box {height: 350px;}

.accConTab02 { box-sizing: border-box; padding: 30px 0px 0px;}
.accConTab02 #accConCdTabUl li{ width: auto; display: flex; flex-direction: row; align-items: center; position: relative;}
.accConTab02 #accConCdTabUl li::after{ content: ''; width: 1px; height: 10px; background-color: #aaa; position: absolute;}
.accConTab02 #accConCdTabUl li.active::after { display: none;}
.accConTab02 #accConCdTabUl li:first-child::after { display: none;}
.accConTab02 #accConCdTabUl li:first-child { margin-left: 0px;}
.accConTab02 #accConCdTabUl li a {
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
	z-index: 0;
	min-width: 100%;
	padding: 5px 15px;
	border: 0 none;
	color: #595959;
	font-size: 14px;
	text-align: center;
	cursor: pointer;
	font-weight: 400;
	border-radius: 0;
	width: 100%;
	white-space: nowrap;
}
.accConTab02 #accConCdTabUl li.active a { background-color: #41478f; color: #fff; border-radius: 3px;}
.chAcc-list { margin-top: 0px; box-sizing: border-box; padding: 30px 0px;}
.ch_swiper .swiper-slide { width: 20%; margin-bottom: 20px; margin-right: 0; border-bottom: 0 none; height: auto; max-height: 338px;}
.ch_swiper .swiper-slide .inner_box { width: 96%; margin: 0 auto; display: flex; flex-direction: column; border-bottom: 1px solid #cccccc;}
.accCon_srh { width:100%; display: flex; justify-content: flex-end; margin-top: 0px; margin-bottom: 20px;}
.accCon_srh div { display: flex; flex-direction: row; align-items: center;}
.accCon_srh div input[type="text"] { border:1px solid #000; color: #000; font-weight: 300; padding: 5.5px 10px;}
.accCon_srh div button { background-color: #000; color: #fff; font-size: 15px; padding: 5px 8px}

.collection_list_box { border: 1px solid #dfdfdf; margin-top: 0; padding: 30px; box-sizing: border-box; min-height: 100px;}

.accContab03 { border-bottom: 1px solid #41478f;}
.accContab03 li:last-child a { border-right:1px solid #dfdfdf !important;}
.accContab03 li a{ border-bottom: 0 none !important;}
.accContab03 li:first-child { border-left: 1px solid #dfdfdf;}
.accContab03 li.active a { border-left:0 none !important;}

.conn_cn { position: relative; top: -1px;}
.more_btn { width: 100%; display: flex; justify-content: flex-end;}
.more_btn button i { font-size: 18px; margin-left: 5px;}
.more_btn button { display: flex; align-items: center; font-size: 13px; padding: 3px 8px; border: 1px solid #000; background-color: #000; color: #fff; border-radius: 3px;}

.morecontent span {display: none;}
.morelink {display: inline-block; position: relative; z-index: 2;}
.less { display: flex; align-items: center; justify-content: end;}

.ch_swiper {height: 716px; overflow: hidden; }

/*
.info_meta_table tr:nth-child(n+4) {
	display:none;
}
.readmore { display: flex; width: 100%; justify-content: flex-end;}
.readmore span { display: flex; align-items: center; text-align: center; border-radius: 3px; font-weight: bold; cursor: pointer; transition: 0.5s; position: relative; z-index: 2; padding: 3px 5px;}
.readmore span::after { content: "\f106"; font-family: 'Font Awesome 5 Pro'; font-weight: 300; display: flex; transition: 0.5s;    transform: rotate(180deg); font-size: 18px; color: #000; align-items: center; position: relative; top: 1px; margin-left: 8px;}
.readmore.close span::after {transform: rotate(0deg); transition: 0.5s; margin-top: 0; vertical-align: -0.1rem;}
.readmore span::before { content: "더 보기";}
.readmore.close span::before {content: "접기";}
*/
.readmore02 { display: flex; width: 100%; justify-content: flex-end;}
.readmore02 span { display: flex; align-items: center; text-align: center; border-radius: 3px; font-weight: bold; cursor: pointer; transition: 0.5s; position: relative; z-index: 2; padding: 3px 5px;}
.readmore02 span::after { content: "\f106"; font-family: 'Font Awesome 5 Pro'; font-weight: 300; display: flex; transition: 0.5s;    transform: rotate(180deg); font-size: 18px; color: #000; align-items: center; position: relative; top: 1px; margin-left: 8px;}
.readmore02.close span::after {transform: rotate(0deg); transition: 0.5s; margin-top: 0; vertical-align: -0.1rem;}
.readmore02 span::before { content: "더 보기";}
.readmore02.close span::before {content: "접기";}

/*
IFRM_UFTY01    사진&이미지
IFRM_UFTY02    동영상
IFRM_UFTY03    음성
IFRM_UFTY04    홍보물
IFRM_UFTY05    문헌자료
IFRM_UFTY06    VR
*/

#conTab2_IFRM_UFTY01 a::before { content: '\f03e'; margin-top: 2px; font-size: 15px; font-family: 'Font Awesome 5 Pro'; font-weight: 300; margin-right: 5px;}
#conTab2_IFRM_UFTY02 a::before { content: '\f03d'; margin-top: 2px; font-size: 15px; font-family: 'Font Awesome 5 Pro'; font-weight: 300; margin-right: 5px;}
#conTab2_IFRM_UFTY03 a::before { content: '\f6a8'; margin-top: 2px; font-size: 15px; font-family: 'Font Awesome 5 Pro'; font-weight: 300; margin-right: 5px;}
#conTab2_IFRM_UFTY04 a::before { content: '\f86d'; margin-top: 2px; font-size: 15px; font-family: 'Font Awesome 5 Pro'; font-weight: 300; margin-right: 5px;}
#conTab2_IFRM_UFTY05 a::before { content: '\f02d'; margin-top: 2px; font-size: 15px; font-family: 'Font Awesome 5 Pro'; font-weight: 300; margin-right: 5px;}
#conTab2_IFRM_UFTY06 a::before { content: '\f729'; margin-top: 2px; font-size: 15px; font-family: 'Font Awesome 5 Pro'; font-weight: 300; margin-right: 5px;}


#conTab708533_IFRM_UFTY01 a::before { content: '\f03e'; margin-top: 2px; font-size: 15px; font-family: 'Font Awesome 5 Pro'; font-weight: 300; margin-right: 5px;}
#conTab708533_IFRM_UFTY02 a::before { content: '\f03d'; margin-top: 2px; font-size: 15px; font-family: 'Font Awesome 5 Pro'; font-weight: 300; margin-right: 5px;}
#conTab708533_IFRM_UFTY03 a::before { content: '\f6a8'; margin-top: 2px; font-size: 15px; font-family: 'Font Awesome 5 Pro'; font-weight: 300; margin-right: 5px;}
#conTab708533_IFRM_UFTY04 a::before { content: '\f86d'; margin-top: 2px; font-size: 15px; font-family: 'Font Awesome 5 Pro'; font-weight: 300; margin-right: 5px;}
#conTab708533_IFRM_UFTY05 a::before { content: '\f02d'; margin-top: 2px; font-size: 15px; font-family: 'Font Awesome 5 Pro'; font-weight: 300; margin-right: 5px;}
#conTab708533_IFRM_UFTY06 a::before { content: '\f729'; margin-top: 2px; font-size: 15px; font-family: 'Font Awesome 5 Pro'; font-weight: 300; margin-right: 5px;}


.info-view .moreTable01 tr td {letter-spacing: 0.005em; line-height: 2.0em;}

@media all and (max-width: 1380px){
		.accConArea ul li { width: 25%;}
		.thumb-view .info-view-head .info-view-title { border: 1px solid #dfdfdf; overflow: hidden;}
		.con_view { margin-top: 20px;}
		.info-view .info-view-head .info-view-title .category { min-width: 70px; text-align: center; margin-right: 10px;}
		.ch_swiper .swiper-slide { width: 25%;}
		.sub_container .content_wrap {padding: 40px 20px 40px 20px !important}
		.accConTab02 #accConCdTabUl li { width: 100%;}
}
@media all and (max-width: 1024px){


		.info-wrap {padding: 0px 20px 60px 20px !important;}
		.accConArea ul li { width: 33.333333333%;}

		.conTopline { margin-top: 20px;}
		.info-view { padding-left: 30px;}

		.ch_swiper .swiper-slide { width: 33.333333333%;}

		.list_box .row_list li a { padding: 10px 18px 10px 18px; font-size: 15px;}

		.accConTab02 { padding:0px}
	
		.info-view .info_meta_table tr th {white-space: nowrap;}
		.viewBtn { display: block !important;}
		
		#accConTabDiv ul li {width:20%}
		#accConTabDiv ul li a {padding: 10px 10px;}
}

@media all and (max-width: 760px){
	.list_box {padding: 16px 0px 40px 0px}
	.list_box .row_list li a {padding: 5px 8px 4px 8px;}

	.thumb-view { width: 45%;}

	.moreTable01 tr{}
	.moreTable01 tr td{ width: 100%; float: left;}
	.info-view .moreTable01 tr td {padding: 0px 0px 14px 0px;}
	.info-view .info-view-head { padding: 0;}

	.accConTab02 { overflow:hidden;}
	#accConTabDiv1 {overflow-x:scroll; }

	#accConTabDiv1::-webkit-scrollbar {
		height: 5px;
	}
	#accConTabDiv1::-webkit-scrollbar-thumb {
		background-color: rgba(0,0,0,0.3);
		border-radius: 5px;
	  }
	#accConTabDiv1::-webkit-scrollbar-track {
		background-color: rgba(0,0,0,0.1);
		border-radius: 5px;
	  }

}

@media all and (max-width: 670px){
	.accConArea ul li { width: 50%;}
	.search_value { width: 30%;}
	.search_value02 { width: 70%;}
	.search_value02 input[type="text"] { width: 85%;}
	.search_value02 button { width: 15%;}
	.list_box .row_list { flex-wrap: wrap;}
	.ch_swiper .swiper-slide  { width: 50%;}
}

@media all and (max-width: 620px){
	.con_view { flex-direction: column;}
	.thumb-view { width: 100%;}
	.info-view { width: 100%; margin-top: 20px; border-top: 1px solid #dfdfdf; padding-left: 0px; padding-top: 20px;}
	#accConTabDiv ul li {width:25%}
}

@media all and (max-width: 480px){

	.accConTabDiv_Area { padding: 20px;}
	.accConArea ul li { width: 100%;}
	.ch_swiper .swiper-slide  { width: 100%;}
	#accConCdTabUl li a { font-size: 15px !important;}
	#accConTabDiv ul li { width: 25%;}
	.con_view { margin-bottom: 0;}

	#accConTabDiv ul li.tabul a { padding: 15px 0px;}
	.accContab03 li { width: 33.3333333%;}
	.accContab03 li a{ padding: 15px 0px !important;}

	#accConTabDiv ul li {width:33.33333333333%}
}

@media all and (max-width: 380px){
	#accConTabDiv ul li {width:50%}
}