.absc { position : absolute; top : 50%; left : 50%; transform : translate(-50%, -50%) }

#archive_contents.main{background: #3d3d3e url('../img/sub/archive/img_archive_bg.png') no-repeat top center / contain; padding-top: 14rem;}
#archive_contents .tit2 { color : #fff !important }
#archive_contents .board_detail_box.ty2 .tit{white-space: normal;}

.tit3 { padding-bottom : 1rem; border-bottom : 1px solid #666 }
.tit3 h3 { font-size : 2rem }
.custom_dropdown { display: none;}
.custom_dropdown2 { top : -4rem !important }
.custom_dropdown { position : absolute; top : 0; right : 0; z-index : 5; background: var(--primary); border-radius: 8px;}
.custom_dropdown.main{border: 1px solid var(--s_primary); background: transparent; color: #fff;}
.custom_dropdown button { padding : 0.8rem 1.3rem; color: #fff; }
.custom_dropdown button i { display : inline-block; top : -1px; font-size : .5rem; transition : all .3s ease; margin-left : 10px }
.custom_dropdown button.active i { transform : rotate(180deg) }
.custom_dropdown .dropdown_content { display : none }
.custom_dropdown .dropdown_content.active { display : block }
.custom_dropdown .dropdown_content a { display : block; line-height : 2rem; padding : 0.2rem 1rem }
.custom_dropdown .dropdown_content a:hover { background-color : var(--s_primary); color : #fff }

.tit4 { font-size : 1.5rem; padding-bottom : 1.5rem }
.tit4 b{color: #FF6464;}
#archive_contents .btn { transition : all .3s ease }
#archive_contents .btm_btn .blue{border-color: var(--s_primary) !important; border-radius: 0.5rem; color: var(--s_primary) !important;}
#archive_contents .btm_btn .b_gray{background-color: #fff; border-radius: 0.5rem;}
#archive_contents .ap_complete > i{color: var(--s_primary);}
#archive_contents .ap_complete p{color: #fff;}

.arc_list_btn { background-color : #555555; color : #fff; width : 10rem; line-height : 4rem; font-size : 1rem; border-radius : 5px }
.arc_list_btn:hover { background-color : var(--s_primary) }
.arc_btn_default { background-color : #555555; color : #fff; font-size : 1rem; padding : 0.2rem 1rem; font-weight: normal; }
.arc_save_btn { border : 1px solid var(--s_primary); color : var(--s_primary); line-height : 4rem; font-size : 1rem; border-radius : 5px }
.arc_save_btn:hover { color : #fff }

.arc_btn_default2 { background-color : #DFDFDF }


.arc_btn_default .fa-solid { font-size : 0.9rem }

/* archive-styleguide */
dl.dtTable { display : flex; }
dl.dtTable dt,
dl.dtTable dd { font-size : 0.9rem }
dl.dtTable dt { width : 8rem !important;}
dl.dtTable dd { width : calc(50% - 8rem) !important; }

#archive_contents .board_tbl table {color: #fff; border-top: 2px solid var(--s_primary);}
#archive_contents .board_tbl table thead th {color: #fff; font-weight: 600; background: #555;}
#archive_contents .board_tbl table tbody td {border-bottom: 1px solid #666;}
#archive_contents .board_tbl table tbody tr:hover {background: #555; color: #fff;}
#archive_contents .tab.ty1 ul li a { color : #DFDFDF; height: 100%; border : 1px solid #888; transition : color .3s ease }
#archive_contents .tab.ty1 ul li a span { display : inline-block; margin-right : 0.5rem }
#archive_contents .tab.ty1 ul li a img { filter : brightness(0) invert(1); transition: filter .3s ease }
#archive_contents .tab.ty1 ul li.on a { color : var(--s_primary); border-bottom : 4px solid var(--s_primary) }
#archive_contents .tab.ty1 ul li:hover a { color : var(--s_primary) }
#archive_contents .tab.ty1 ul li.on a img,
#archive_contents .tab.ty1 ul li:hover a img { filter : inherit }
@media(min-width:1025px){
    .tab.arc_tab ul{flex-wrap: wrap; border-bottom: 0;}
    .tab.arc_tab ul li{width: calc(33.33% - 0.5rem); margin: 0.25rem;}
    .tab.arc_tab ul li a{height: 100% !important; padding: 0.2rem 2rem; text-align: center; border: 1px solid var(--darkgray); border-radius: 1rem; color: var(--darkgray);}
    .tab.arc_tab ul li.on a{background: var(--primary); border-color: var(--primary); color: #fff; border-radius: 1rem;}
}

.tab br { display : none }
.add_file_btn { font-size : .9rem; padding : 0 1rem; margin : 0 0 .5rem 0 }
.file_list p { display: inline-block; margin: 0.25rem 0; }
.file_list p + p{margin-left: 1rem;}
.file_list span { padding-bottom : .3rem; border-bottom : 2px solid #333; }
.file_list a { display : inline-block; width : 1.5rem; height : 1.5rem; line-height : 1.5rem; background-color : #555; border-radius: 100%; text-align : center; }
.file_list a img { display : inline-block; filter : brightness(0) invert(1); width : .5rem; vertical-align: baseline; }

#archive_contents .form_table { border-top : none }
#archive_contents .form_table tr th,
#archive_contents .form_table tr td { border-top : 1px solid #666 }
#archive_contents .form_table tr th.require::before { color : #FF6464 }
#archive_contents .form_table input,
#archive_contents .form_table select,
#archive_contents .form_table textarea,
#archive_contents .form_table .agree_box { border-radius: 0; background-color: #555555 !important; border : none; color: #fff; }
#archive_contents input[type="radio"] { border-radius : 100%; padding : 0; border : 1px solid #999999; background-color : transparent }
#archive_contents input[type="radio"] + span { color : #999 }
#archive_contents input[type="radio"]:checked + span { color : var(--s_primary); border-radius : 100% }
#archive_contents input[type="radio"]:checked { border : 0.3rem solid var(--s_primary); }

#archive_contents .no_data{background: #333;}

/* file custom */
#archive_contents [data-ax5uploader] [data-ax5uploader-dropzone]{background: #555; border: 0; border-radius: 0; text-align: center;}
#archive_contents [data-ax5uploader-uploaded-box][data-ax5uploader-uploaded-box] [data-ax5uploader-uploaded-item]{background: #333; color: #fff;}
#archive_contents .form_table .arc_btn_default{font-size: 0.8rem;}

#archive_contents .board_detail_box.ty2{border-bottom-color: #999;}
#archive_contents .board_detail_box .cate{border: 1px solid #fff; background: transparent; border-radius: 0.25rem;}
.board_detail_box .name{padding-bottom: 2rem;}
#archive_contents .board_detail_box .share_util > ul > li > a{background: #555; color: #fff;}
#archive_contents .board_detail_box .share_util > ul > li.share_list ul{background: #555;}
#archive_contents .board_detail_box .share_util > ul > li.share_list ul > li > a{color: #fff;}
#archive_contents .board_detail_box .share_util > ul > li.share_list ul li a:hover{background: #333;}


.btm_btn_wrap { border-top : 2px solid #999; margin-top : 4rem; text-align : center; padding : 4rem 0 }
.btm_btn_wrap.noBorder { padding : 0; border-top : none !important }
.btm_btn_wrap .btn { width : 10rem; line-height : 3rem; padding : 0 }
.btm_btn_wrap .btn + .btn { margin-left : 1rem }
.txt_left { text-align: left !important; }

.btn_form_reset { width : 10rem }

#archive_contents .tbl { text-align : center; background : transparent }
#archive_contents .tbl table { border-top-color : #707070; border-bottom-color : #707070 }
#archive_contents .tbl th,
#archive_contents .tbl td { background : transparent; color : #fff; border-bottom-color :#555; border-left-color : transparent }
#archive_contents .tbl th { background : #555 }


#archive_contents .layer_pop_wrap .layer_pop .layer_tit{background: #555;}
#archive_contents .layer_pop_wrap .layer_pop .layer_cont{background: #282828; color: #fff;}





/* // common 추가 */

/* archive_video */
.archive_video{margin-bottom:4.5rem;}
.archive_video .tit { color: var(--s_primary); font-weight: 600; font-size: 2.6rem; padding-bottom: 2rem; margin-bottom: 2rem; border-bottom: 1px solid var(--s_primary); }
.archive_video .tit_txt { color: var(--s_primary); font-size: 1.4rem; }
.archive_video .slide_wrap { width: calc((100vw - 72rem) / 2 + 72rem); overflow: hidden; padding-left: 3.5rem; border-left: 2px solid var(--s_primary); }
.archive_video .archive_video_slide { width: 74rem; }
.archive_video .archive_video_slide .slick-list { overflow: visible; }
.archive_video .archive_video_slide .item { width: 18rem; vertical-align: top; margin-right: 2rem; }
.archive_video .archive_video_slide .item .img { position: relative; width: 100%; height: 10rem; overflow: hidden; }
.archive_video .archive_video_slide .item.slick-current { width: 27rem; }
.archive_video .archive_video_slide .item.slick-current .img { height: 15.5rem; background: var(--s_primary); }
.archive_video .archive_video_slide .item.slick-current .img img { width: calc(100% - 0.5rem); height: calc(100% - 0.5rem); }
.archive_video .archive_video_slide .item.slick-current .txt { color: var(--s_primary); }


/* data_link */
.data_link { margin-bottom: 4.5rem; }
.data_link .box { position: relative; width: 100%; height: 10rem; display: flex; flex-wrap: wrap; align-items: center; align-content: center; background: #c9bfa8 url('../img/sub/archive/img_link_bg.png') no-repeat center / 100% 100%; padding: 0 10rem 0 21.5rem; border-radius: 1rem; color: #000; overflow: hidden; }
.data_link .box p { width: 100%; margin-bottom: 1rem; font-size: 1.4rem; font-weight: 700; }
.data_link .box span { font-size: 1rem; }
.data_link .box span a { display: inline-block; margin-left: 1rem; border-bottom: 2px solid #000; }
.data_link .box span a i { font-size: 0.8rem; margin-left: 0.5rem; }

/* archive_board */
.archive_board .inner { display: flex; }
.archive_board .board_left { width: calc(100% - 49rem); }
.archive_board .board_left .tit { font-size: 2.1rem; margin-bottom: 2.5rem; line-height: 1.3; }
.archive_board .board_left .tit em { font-size: 0.9rem; color: var(--s_primary); display: block; margin-bottom: 1rem; }
.archive_board .board_left ul li + li { margin-top: 0.5rem; }
.archive_board .board_left ul li a { display: inline-block; border: 1px solid #999; line-height: 2.25rem; border-radius: 2.25rem; padding: 0 1rem; color: #999; font-size: 1rem; }
.archive_board .board_left ul li a::before { content: '#'; }
.archive_board .board_list { width: 49rem; }
.archive_board .board_list ul { display: flex; flex-wrap: wrap; justify-content: space-between; }
.archive_board .board_list ul li { width: 15rem; margin-bottom: 2rem; }
.archive_board .board_list ul li a { display: block; position: relative; }
.archive_board .board_list ul li .img { position: relative; width: 100%; height: 15rem; border-radius: 0.5rem; overflow: hidden; }
.archive_board .board_list ul li .img::before { position: absolute; width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 1; content: ''; background: linear-gradient(to top, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.6) 30%, rgba(0,0,0,0.1) 50%,rgba(0,0,0,0) 100%); background: -webkit-linear-gradient(to top, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.6) 30%, rgba(0,0,0,0.1) 50%,rgba(0,0,0,0) 100%); background: -moz-linear-gradient(to top, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.6) 30%, rgba(0,0,0,0.1) 50%,rgba(0,0,0,0) 100%); background: -ms-linear-gradient(to top, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.6) 30%, rgba(0,0,0,0.1) 50%,rgba(0,0,0,0) 100%); }
.archive_board .board_list ul li .img img{transition:0.3s; -webkit-transition:0.3s;}
.archive_board .board_list ul li a:hover .img img{transform: translate(-50%, -50%) scale(1.1); -webkit-transform:translate(-50%, -50%) scale(1.1);}
.archive_board .board_list ul li div {width: calc(100% - 2rem); position: absolute; left: 1rem; bottom: 1.5rem; height: 3.25rem; overflow: hidden; z-index: 1; text-align: left; }
.archive_board .board_list ul li .tit {  font-size: 0.9rem; font-weight: 700; margin-bottom: 0.5rem; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.archive_board .board_list ul li span { display: inline-block; margin-right: 0.5rem; font-size: 0.8rem; color: var(--s_primary); }
.archive_board .board_list ul li span::before { content: '#'; }

/* archive_board2 */
.archive_board2 { border-bottom: 1px solid #999; }
.archive_board2 .tab { display: flex; }
.archive_board2 .tab li a { position: relative; display: block; color: #999; padding: 0 1.5rem; font-size: 1.4rem; }
.archive_board2 .tab li a::before { width: 100%; height: 2px; background: var(--s_primary); position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); transition: 0.3s; -webkit-transition: 0.3s; content: ''; }
.archive_board2 .tab li.on a { color: var(--s_primary); font-weight: 600; }
.archive_board2 .pop_open{position: absolute; top: 1rem; right: 0; line-height: 2.25rem; background: #555 !important; border-radius: 5px;}
.archive_board2 #archive_book_popup .layer_pop{width: 24rem;}
.archive_board2 #archive_book_popup .layer_pop .layer_cont{max-height: 28.5rem; font-size: 0.8rem;}
.archive_board2 #archive_book_popup .layer_pop .layer_cont .tbl{font-size: 0.8rem;}

.archive_cate .slick-arrow { position : absolute; top : 0.5rem; right : 0; opacity : 0.5; font-size : 1.2rem; z-index : 2; transition : all .3s ease; }
.archive_cate.main .slick-arrow{color: #fff;}
.archive_cate .slick-arrow:hover { opacity : 1 }
.archive_cate .slick-arrow.slick-prev { right : 2.2rem }
.archive_cate {
    /* display: flex; */
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: center;
	gap: 0px 15px;
}
.archive_cate .cate_btn {
    display: inline-flex;
    text-decoration: none;
    box-sizing: border-box;
    transition: all 0.2s ease;
}
.archive_cate .cate_btn i {
    flex: 0 0 auto;
    color: #8c939b;
}
.archive_cate .cate_btn span {
    display: block;
    white-space: nowrap;
}
.archive_cate .cate_btn:hover,
.archive_cate .cate_btn:focus {
    border-color: #1f3f75;
    color: #1f3f75;
    background: #f5f8fc;
}
.archive_cate .cate_btn:hover i,
.archive_cate .cate_btn:focus i {
    color: #1f3f75;
}

.archive_cate .cate_btn.on {
    border-color: #1f3f75;
    background: #1f3f75;
}
.archive_cate .cate_btn.on i {
    color: #fff;
}

#archive_contents .board_search .b_count em { color : var(--s_primary) }
#archive_contents select,
#archive_contents input { background-color : #555555; border-radius : 8px; border : none; padding : 0 0.5rem; font-size : .9rem; color : #B2B2B2 }
#archive_contents select { position : relative; background-image : url('../img/layout/ic_down_w.svg'); }
#archive_contents input::placeholder { color : #b2b2b2 }
#archive_contents .board_search form > *,
#archive_contents .board_search > div > * { margin-left : .5rem }
#archive_contents .board_search a { font-size : .9rem; border-radius : 8px }
#archive_contents .paging p input { border-radius : 10rem }




.archive_nobg { background : #3d3d3e !important }
.archive_video{margin-bottom: 4.5rem;}
.archive_video .tit { border-bottom : 1px solid var(--darkgray) }
.archive_video .slide_wrap { padding-left : 2rem; height : 21rem; margin-top : 2.2rem }
.archive_video .archive_video_slide .item a,
.archive_video .archive_video_slide .item .img { transition : height .3s ease }
.archive_video .img img { filter : grayscale(100%) }
.archive_video .slick-current .img img { filter : grayscale(0); }
.archive_video a p + p { font-size : 1rem; color : var(--darkgray)999; margin-top : 1.5rem }
.archive_video .slick-current a p + p { font-size : 1.2rem }

.archive_board li { margin : 0.8rem 0 }
.archive_board2 { border : none !important }
.archive_board2 .tab { border-bottom : 1px solid var(--darkgray); margin-bottom : 0 !important }
.archive_board2 .tab li a { padding : 1rem 1.5rem }
.archive_board2 .tab li a::before { opacity: 0; }
.archive_board2 .tab li.on a::before { opacity : 1; background-color :var(--s_primary) }

.archive_cate { position : relative; /* padding-right: 5rem;  */padding-bottom: 1rem; border-bottom: 1px solid #dfdfdf; }
.archive_cate a { display : inline-block; padding : 0.2rem 0.75rem; border : 1px solid var(--darkgray); color : var(--darkgray); font-size : 1rem; border-radius : 50px; margin: 0.3rem 0; }
.archive_cate a.on { background-color : var(--primary); border-color : var(--primary); color : #fff }
.archive_cate.main a.on{background-color: var(--s_primary); border-color: var(--s_primary);} 
/* .archive_cate a + a { margin-left:1rem; } */
.archive_cate .slick-list { padding-right : 2rem }

.archive_cate.open_cate { display : flex; flex-wrap : wrap; padding-right: 0;}
.archive_cate.open_cate a { padding : 0.2rem 2rem; margin : 0.5rem; width : calc(33.33% - 1rem); text-align : center }
.archive_cate_ty2 a.active { background-color : var(--primary); border-color : var(--primary); color : #fff }

.archive_sub_cate button.select_sub_cate { display : none }
.archive_sub_cate .sub_cate_list { overflow : hidden; margin : 1rem -1rem }
.archive_sub_cate .sub_cate_list li {position: relative; float : left; width : 25%; padding : 0.5rem }
.archive_sub_cate .sub_cate_list li a:not(.cate_more) { display :Block; width : 100%; padding: 0.2rem 4rem 0.2rem 0.75rem; border : 1px solid var(--darkgray); color : var(--darkgray); font-size : 0.9rem; border-radius : 50px; text-align : center }
.archive_sub_cate .sub_cate_list li a.cate_more{
	position: absolute; 
	top: 0.5rem; right: 0.5rem; 
	display: inline-block; 
	/* width: 1.95rem; 
	height: 1.95rem; 
	line-height: 1.8rem;  
	border: 1px solid var(--darkgray); 
	color: var(--darkgray); */
	margin: 0.25rem;
	border-radius: 50px; 
	color: #fff; background-color: var(--primary);
    border-color: var(--primary);
	text-align: center; 
	font-size: 0.7rem;
	padding: 0.15rem 0.4rem;
}
.archive_sub_cate .sub_cate_list li.active a:not(.cate_more){ background-color : var(--primary); border-color : var(--primary); color : #fff }
.archive_sub_cate .sub_cate_list li.active a.cate_more{color: #fff; border: 1px solid #fff;}

#cate_more_popup .cate_more_pop_tit .cate_locate{border-bottom: 1px solid var(--darkgray); padding-bottom: 1rem; text-align: right;}
#cate_more_popup .cate_more_pop_tit span{line-height: 2rem; display: inline-block; padding: 0 0.5rem; background: var(--s_primary); color: #fff; margin-top: 1rem;} 
#cate_more_popup .cate_more_pop_con{white-space: pre-line; word-break: break-all;}

.archive_cate_ty2{position : relative; display : flex; flex-wrap : wrap; padding : 1.5rem 0;text-align:center;justify-content:space-between;}
.archive_cate_ty2 a {display : inline-block; padding : 0.2rem 2rem; margin : 0 0 0.3rem 0; width : calc(33.333% - 0.5rem); text-align : center;border : 1px solid var(--darkgray); color : var(--darkgray); font-size : 1rem; border-radius : 50px }
.archive_cate_ty2 a.active { background-color : var(--s_primary); border-color : var(--s_primary); color :#fff; }

.archive_cate_thumb { display : flex; flex-wrap : wrap; margin : 0 -1.2rem 4rem -1.2rem; }
.archive_cate_thumb li { width : 25%; padding : 1.2rem }
.archive_cate_thumb li a { position : relative; display : block;}
.archive_cate_thumb .img { position: relative; width: 100%; height: 17rem; border-radius: 0.5rem; border: 1px solid #dfdfdf; overflow: hidden; }
.archive_cate_thumb .img img { transition : all .3s ease }
.archive_cate_thumb li .img:hover img{transform: translate(-50%, -50%) scale(1.1); -webkit-transform:translate(-50%, -50%) scale(1.1);}
.archive_cate_thumb .img::before { position: absolute; width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 1; content: '';
    background: linear-gradient(to top, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.6) 30%, rgba(0,0,0,0.1) 50%,rgba(0,0,0,0) 100%);
    background: -webkit-linear-gradient(to top, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.6) 30%, rgba(0,0,0,0.1) 50%,rgba(0,0,0,0) 100%);
    background: -moz-linear-gradient(to top, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.6) 30%, rgba(0,0,0,0.1) 50%,rgba(0,0,0,0) 100%);
    background: -ms-linear-gradient(to top, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.6) 30%, rgba(0,0,0,0.1) 50%,rgba(0,0,0,0) 100%);
}
.archive_cate_thumb div { position : absolute; top : 0; left : 0; padding : 1rem; z-index : 2 }
.archive_cate_thumb .txt{position: absolute; bottom: 1rem; left : 1rem; max-height: 2.75rem; overflow: hidden; z-index : 2; width: calc(100% - 2rem); color: #fff;}
.archive_cate_thumb div span { display : inline-block; color : #fff; background: #3d3d3e; padding : 0.2rem 0.8rem; font-size : 0.7rem; border-radius : 5px }
.archive_middle { background : #000 url('../img/sub/archive/img_archive_bg2.png') no-repeat center center / cover; padding : 2rem 0 }

.archive_cate_photo .img { height : 12rem }
.archive_cate_photo div { position : static; bottom : inherit; left : inherit; }

.archive_middle .archive_board2 > button { position : absolute; bottom : 1rem; right : 0; background-color : #555555; color : var(--white); border-radius : 5px }

.archive_middle_slick { display : flex; justify-content: space-between; padding : 2rem 0; align-items: end; }
.archive_middle_slick > * { width : 50% }



.arch_slide_thumb .img { width : 15rem; height : 22rem; }
.arch_slide_thumb .slick-slide { display : inline-flex; z-index : 2 !important }
.arch_slide_thumb .slick-slide.slick-current{z-index: 3 !important;}
.arch_slide_thumb .wrap { display : flex; flex-direction: column; width : calc(100% - 15rem); padding : 5rem 2rem 2rem 2rem; justify-content: space-between; }
.arch_slide_thumb h2 { margin-bottom : 2rem }
.arch_slide_thumb a { display : inline-block; border-radius : 5px; border : 1px solid #999; background-color : #DFDFDF; color : #3D3D3E; padding : 0 1rem; line-height : 2rem }
.arch_slide_thumb a + a { background-color : transparent; color : #999; margin-left : 0.5rem }




.arch_slide_nav .img { position : relative; width : 8rem; height : 15rem; margin : 0 1rem; border-radius : 0.5rem }
.arch_slide_nav .img::before { position: absolute; width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 1; content: ''; transition : opacity .3s ease;
    background: linear-gradient(to top, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.6) 30%, rgba(0,0,0,0.1) 50%,rgba(0,0,0,0) 100%);
    background: -webkit-linear-gradient(to top, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.6) 30%, rgba(0,0,0,0.1) 50%,rgba(0,0,0,0) 100%);
    background: -moz-linear-gradient(to top, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.6) 30%, rgba(0,0,0,0.1) 50%,rgba(0,0,0,0) 100%);
    background: -ms-linear-gradient(to top, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.6) 30%, rgba(0,0,0,0.1) 50%,rgba(0,0,0,0) 100%); }
.arch_slide_nav .slick-current.img::before { opacity: 0; }


.arch_count { position : absolute; top : 4rem; left : 17rem; }
#currentCnt { color : var(--s_primary) }

.archive_btm { padding : 5rem 1rem 10rem }
.archive_btm:after { content : url('../img/sub/archive/img_archive_bg3_v1.png'); position : absolute; top : 0rem; right : -62% }
.archive_btm h2 span { display: block; color : var(--s_primary); font-size : 0.9rem; margin-bottom : 0.8rem }
.archive_btm h2 { font-size : 2.1rem; line-height : 1.1; z-index : 1 }
.archive_btm ul { z-index : 1 }
.archive_btm ul li { display : inline-block }
.archive_btm ul li + li { margin : 0 0.5rem }
.archive_btm a { display : flex; flex-direction: column; justify-content : center; border : 1px solid #999; background-color : rgba(255, 255, 255, 0.05); text-align : center; border-radius : 5px; width : 7rem; height : 7rem; align-items: center; transition : all .3s ease }
.archive_btm a:hover { background-color : rgba(0, 0, 0, 0.5) }
.archive_btm a span { display : block; width : 100%; height : 2.4rem }
.archive_btm a span i{font-size: 1.8rem;}
.arc_cate { border : 1px solid #fff; color : #fff; padding : 0.5rem 1rem; font-size : 0.8rem; border-radius : 5px }
.arc_bbs_detail_title {padding : 0 15rem 0 0; border-bottom : 1px solid #999999 }
.arc_bbs_detail_title.noBorder { border-bottom : none }

.arc_bbs_detail_title h2 { margin : 2rem 0; font-size : 1.7rem }
.arc_bbs_detail_title h2 b { color : #FF6464; font-size : 1rem }
.arc_bbs_detail_title.noBorder h2 { font-size : 1.6rem }
.arc_bbs_detail_title p { margin : 2rem 0 }
.arc_bbs_detail_title > div { font-size : 1rem }
#archive_contents .arc_bbs_detail_title .snb_util { top : inherit; bottom : 2rem }


.arc_bbs_detail_slider_sync { padding : 5rem; border-bottom : 1px solid #666666; text-align: center; }
.arc_bbs_detail_slider_sync img{max-height: 40rem;}

.floor_slide_wrap .nuri_wrap { position : absolute; bottom : 3.5rem; width : 100%; padding : 0.8rem; background-color : rgba(0, 0, 0, 0.5); color: #fff;}
.floor_slide_wrap .nuri_wrap .flex { align-items: center; font-size : 0.8rem; line-height : 1.3 }
.floor_slide_wrap .nuri_wrap .flex img { margin-right : 1rem; }
.floor_slide_wrap .nuri_wrap .flex .nuri_img{width: 7.5rem;}
.floor_slide_wrap .nuri_wrap a { display : flex; height : 100%; align-items: center; padding : 0 0.2rem }

.sync_btm { margin-top : 3rem }
.sync_btm a { position : relative; display : block; height : 6rem; margin : 0 0.5rem; border-radius : 5px; overflow : hidden }
.sync_btm a:before { content : ''; position : absolute; top : 0; left : 0; width : 100%; height : 100%; background-color : rgba(0, 0, 0, 0.8); transition : all .3s ease }
.sync_btm a img { width : 100%; height : 100%; object-fit: cover }
.sync_btm .slick-current a:before { opacity : 0 }
.sync_btm .slick-current a { border : 8px solid var(--s_primary); margin : 0 }
.sync_btm .slick-arrow { position : absolute; top : 1.4rem; right : 0; color : #fff; opacity : 0.5; font-size : 2rem; z-index : 2; transition : all .3s ease; } 
.sync_btm .slick-arrow:hover { opacity : 1 } 
.sync_btm .slick-arrow.slick-prev { right: auto; left: 0;} 
#arc_detail_layer_pop .layer_cont img{width: 100%;}
.arc_bbs_detail_img_sync{position: relative; text-align: center;}

.arc_bbs_data { padding : 2.5rem 0; border-bottom : 1px solid #666 }
.arc_bbs_data dl { margin : 2rem 0; }
.arc_bbs_data dl dt { position : relative; color : #999; width : 130px; padding-left : 15px }
.arc_bbs_data dl dt:before { content : ''; display : inline-block; position : absolute; top : 10px; left : 0; width : 7px; height : 7px; border-radius : 100%; background-color : #999 }
.arc_bbs_data dl dd { padding : 0 0.5rem }
.arc_bbs_data .link_list a { display : inline-block; padding : 0 0 0.5rem 0; border-bottom : 1px solid #fff; margin : 0.5rem }
.arc_bbs_data .file_down { display : inline-block; padding : 0 0 0.5rem 0; border-bottom : 1px solid var(--s_primary); color : var(--s_primary); }
.arc_bbs_data .file_down i { margin-right : 0.5rem }
.arc_bbs_data ul { margin : -0.5rem 0; overflow : hidden }
.arc_bbs_data ul li { margin : 0.5rem 0 }
.arc_bbs_data ul.li_2 li{width: 50%; float: left;}
.arc_bbs_data ul.li_3{display: flex; flex-wrap: wrap; gap: 2%;}
.arc_bbs_data ul.li_3 li{width: 48%; word-break: auto-phrase;}
.arc_bbs_data ul li:before { content : ''; width : 0.2rem; height : 0.2rem; border-radius : 100%; background-color : #fff; display : inline-block; margin-right : 0.5rem; position : relative; top : -3px }
.arc_bbs_data .dtTable2 dd { width : 100% !important }
.arc_bbs_data ul li:before { content : ''; width : 0.2rem; height : 0.2rem; border-radius : 100%; background-color : #000; display : inline-block; margin-right : 0.5rem; position : relative; top : -3px }
.arc_bbs_data .dtTable2 dd { width : 100% !important }

.arc_bbs_txt { padding : 4rem 0; font-size : 1rem; border-bottom: 1px solid #666;}


.unesco_intro { padding : 4rem 0 }
.unesco_intro h2 { margin-bottom : 1rem }
.unesco_intro h2 br { display : none }
.unseco_bg_01 { background : url('../../images/sub/info/img_unesco_01.png') no-repeat center center / cover; color: #fff; }
.unseco_bg_01 .flex > * { width : 50% }
.unseco_bg_01 p img { display : block; margin : 0 auto }

.unseco_bg_02 { background : url('../../images/sub/info/img_unesco_03.png') no-repeat center center / cover; color: #fff; }


.unesco_intro_txt li { display : flex; border-bottom : 1px dashed #888; font-size : 1rem; padding : 2rem }
.unesco_intro_txt li span { font-size : 1.4rem; width : 10rem; flex-shrink: 0; margin-bottom: 0.5rem; font-weight: 600; }

.unesco_list_table { border-top : 2px solid #000;}
.unesco_list_table p,
.unesco_list_table .body a span { text-align : center; display: flex; align-items: center; justify-content: center; }
.unesco_list_table .body .flex span { text-align : center; display: flex; align-items: center; justify-content: center; }
.unesco_list_table p:first-child,
.unesco_list_table p:last-child,
.unesco_list_table .body .flex span:first-child,
.unesco_list_table .body .flex span:last-child,
.unesco_list_table .body a span:first-child,
.unesco_list_table .body a span:last-child { padding: 0.7rem; width : 10rem; flex-shrink: 0; display: flex; align-items: center; justify-content: center; }
.unesco_list_table2 p:first-child,
.unesco_list_table2 p:last-child{width: 20rem;}
.unesco_list_table .head { background-color : #f8f8f8; border-bottom: 1px solid #707070; padding : 1rem 0 }
.unesco_list_table .body a,
.unesco_list_table .body div { border-bottom : 1px solid var(--sub); padding : 1rem 0; transition : all .3s ease-in-out }
.unesco_list_table .body a:hover { background: #f8faff; color: var(--primary); font-weight: 700; }

/* 모바일 UNESCO 목록 */
@media (max-width: 768px) {
    .unesco_list_table {
        margin-top: 24px;
    }

    /* 모바일에서는 표 헤더 숨김 */
    .unesco_list_table .head {
        display: none !important;
    }
    .unesco_list_table .body {
        display: block;
    }
    .unesco_list_table .body > a.flex,
    .unesco_list_table .body > div.flex {
        display: block !important;
        width: 100%;
        padding: 10px 16px;
        margin-bottom: 14px;
        border: 1px solid #d7d7d7;
        border-radius: 10px;
        background: rgba(255, 255, 255, 0.65);
        box-sizing: border-box;
        text-align: left;
    }
    .unesco_list_table .body > .flex > span,
    .unesco_list_table .body > .flex > p {
        display: grid !important;;
        grid-template-columns: 92px 1fr;
        gap: 12px;
        align-items: start !important;
        justify-content: left !important;
        width: 100%;
        margin: 0;
        color: #111;
        font-size: 14px;
        line-height: 1.55;
        text-align: left !important;
        word-break: keep-all;
        overflow-wrap: break-word;
        white-space: normal;
        box-sizing: border-box;
    }
    .unesco_list_table .body .flex span,
    .unesco_list_table .body .flex p {
	    text-align: left !important;
	    align-items: start !important;
	    justify-content: left !important;
        padding: 0.5rem !important;
	}
    .unesco_list_table .body > .flex > span::before,
    .unesco_list_table .body > .flex > p::before {
    	display: block;
        color: #333;
        font-weight: 700;
        white-space: nowrap;
    }
    .unesco_list_table .body > div.flex > span:nth-child(1), 
    .unesco_list_table .body > div.flex > span:nth-child(2),
    .unesco_list_table .body > div.flex > p:nth-child(1), 
    .unesco_list_table .body > div.flex > p:nth-child(2) {
    	border-bottom: 1px solid #ddd;
    }
    .unesco_list_table .body > .flex > span,
    .unesco_list_table .body > .flex > p {
        font-weight: 400;
    }
    .unesco_list_table .body > .flex > span:nth-child(2),
    .unesco_list_table .body > .flex > p:nth-child(1) {
        font-weight: 600;
    }
    .unesco_list_table1 .body > .flex > span:nth-child(1)::before { content: "소장/관리처"; }
    .unesco_list_table1 .body > .flex > span:nth-child(2)::before { content: "기록물 명칭"; }
    .unesco_list_table1 .body > .flex > span:nth-child(3)::before { content: "통계연도"; }
    .unesco_list_table2 .body > .flex > p:nth-child(1)::before { content: "기록물 명칭"; }
    .unesco_list_table2 .body > .flex > p:nth-child(2)::before { content: "소장/관리처"; }
    .unesco_list_table2 .body > .flex > p:nth-child(3)::before { content: "통계연도"; }
    /* 영문 라벨 */
    .unesco_en.unesco_list_table1 .body > div.flex > span:nth-child(1)::before { content: "Possessed by\A/Managed by"; }
    .unesco_en.unesco_list_table1 .body > div.flex > span:nth-child(2)::before { content: "Title"; }
    .unesco_en.unesco_list_table1 .body > div.flex > span:nth-child(3)::before { content: "Statistics Year"; }
    .unesco_en.unesco_list_table2 .body > div.flex > p:nth-child(1)::before { content: "Title"; }
    .unesco_en.unesco_list_table2 .body > div.flex > p:nth-child(2)::before { content: "Possessed by\A/Managed by"; }
    .unesco_en.unesco_list_table2 .body > div.flex > p:nth-child(3)::before { content: "Statistics Year"; }
    
    .unesco_list_table1 .body > .flex > span::before,
    .unesco_list_table2 .body > .flex > p::before{ width: 90px !important; }
    .unesco_en.unesco_list_table .body > .flex > span::before,
    .unesco_en.unesco_list_table .body > .flex > p::before{ width: 120px !important; }
    .unesco_en.unesco_list_table .body > .flex > span::before,
    .unesco_en.unesco_list_table .body > .flex > p::before { white-space: pre-line; }
    .unesco_en.unesco_list_table .body > .flex > span, .unesco_en.unesco_list_table .body > .flex > p {
	    grid-template-columns: 120px 1fr;
			align-items: center !important;
    }
    .unesco_list_table .body .flex span:first-child,
	.unesco_list_table .body .flex span:last-child,
	.unesco_list_table .body a span:first-child,
	.unesco_list_table .body a span:last-child {
		width : 100%;
	}
    
}


/* 518민주화운동등재 */
.arc_doc_list { position : relative; padding-left : 26rem }
.arc_doc_list .doc_img { position : absolute; width : 100%; height : 100%; left : -12rem; background : url('../../images/sub/info/img_register_01.png') no-repeat left top; border-radius : 0 30px 30px 0; overflow : hidden; }
.arc_doc_list .doc_img2 { background : url('../../images/sub/info/img_register_02.png') no-repeat left top }
.arc_doc_video video{width: 70%;}

.arc_doc_list ul li { position : relative; padding-left : 10rem; font-size : 1rem; padding : 4rem 0 4rem 9rem; border-bottom : 1px dashed #666666 }
.arc_doc_list2 ul li { padding-left : 2rem; padding-top: 0; border-bottom : none; line-height: 1.4; }
.arc_doc_list ul li span { position : absolute; top : 1.2rem; left : 0; font-size : 4.5rem; font-weight: bold; color : var(--primary) }
.arc_doc_list ul li h2,
.arc_doc_list ul li h3 { font-size : 2rem; margin-bottom : 1rem }

/* 518민주화운동등재 - 등재절차 */
.arc_history{position: relative; margin-top: -4rem;}
.arc_history .arc_history_nav{width: 20rem; position: absolute; top: 4rem; z-index: 10;}
.arc_history .arc_history_nav.fix{position: fixed; top: 10rem;}
.arc_history .arc_history_nav.bottom {position: absolute; top: auto; bottom: 0;}
.history_top_btn {margin-top: 1.6rem; width: 80px; height: 80px; border-radius: 50%; background: rgb(51, 51, 51); color: rgb(255, 255, 255); cursor: pointer; text-align: center; border: 0px; line-height: 1.2;}
.arc_history .arc_history_nav p{font-size: 1.8rem; font-weight: 700; color: var(--primary); margin-bottom: 2.5rem;}
.arc_history .arc_history_nav ul{position: relative;}
.arc_history .arc_history_nav ul::before{width: 1px; height: 100%; background: #000; position: absolute; top: 0; left: 1rem; content: '';}
.arc_history .arc_history_nav ul li + li{margin-top: 3rem;}
.arc_history .arc_history_nav ul li a{display: block; position: relative; padding-left: 4rem; line-height: 2.25rem; font-size: 1.3rem; font-weight: 400;}
.arc_history .arc_history_nav ul li a::before{width: 2.25rem; height: 2.25rem; background: #dfdfdf; border-radius: 50%; position: absolute; top: 0; left: 0; content: '';}
.arc_history .arc_history_nav ul li a::after{width: 0.85rem; height: 0.85rem; background: #000; border-radius: 50%; position: absolute; top: 50%; left: 0.7rem; transform: translateY(-50%); -webkit-transform: translateY(-50%); content: '';}
.arc_history .arc_history_nav ul li.active a{color: var(--primary); font-weight: 700;}
.arc_history .arc_history_nav ul li.active a::after{background: var(--primary);}
.arc_history .arc_history_list{padding-left: 20rem;}
.arc_history .arc_history_list dl:first-child{padding-top: 4rem;}
.arc_history .arc_history_list dl + dl{border-top: 1px dashed #666; padding-top: 4rem; margin-top: 4rem;}
.arc_history .arc_history_list dl dt{font-size: 3.5rem; font-weight: 700; color: var(--primary);}
.arc_history .arc_history_list dl dd ul li{position: relative; padding: 1rem 0 1rem 6.5rem; font-size: 1rem;}
.arc_history .arc_history_list dl dd ul li::before{width: 0.35rem; height: 0.35rem; background: var(--primary); border-radius: 50%; position: absolute; top: 1.5rem; left: 0; content: '';}
.arc_history .arc_history_list dl dd ul li .date{position: absolute; top: 1rem; left: 0.75rem; color: var(--primary);}
.arc_history .arc_history_list dl dd ul li .arc_history_img{display: flex; flex-wrap: wrap; justify-content: space-between; margin-top: 2rem;}
.arc_history .arc_history_list dl dd ul li .arc_history_img p{max-width: 48%;}
.arc_history .arc_history_list dl dd ul li .arc_history_img p span{display: block; margin: 1rem 0;}
.arc_history .arc_history_list dl dd ul li .arc_history_img p span::before{font-family: "Font Awesome 5 Free"; font-weight: 900;  content: "\f062"; margin-right: 0.5rem;}

.arc_bbs_detail_img { text-align : center; padding : 3rem 2rem; border-bottom : 1px solid #666 }
.img_inner { position : relative; display : inline-block; }
.img_inner p { position : absolute; bottom : 0; left : 0; width : 100%; height : 100%; text-align : left; padding : 2rem; display: flex; align-items: end; color : #DFDFDF }
.arc_bbs_detail_img img{max-width: 30rem;}
.arc_bbs_detail_img.ty2{display : flex; flex-wrap : wrap; justify-content:space-between;}
.arc_bbs_detail_img.ty2 .img_inner { width:49%; }


.periodical_list_wrap ul { overflow : hidden; margin : 0 -1rem }
.periodical_list_wrap ul li { float : left; width : calc(50% - 2rem); margin : 1rem; background: rgb(0,0,0); background: -moz-linear-gradient(11deg, rgba(0,0,0,0.7) 0%, rgba(61,61,61,0.7) 48%, rgba(84,84,84,1) 99%); background: -webkit-linear-gradient(11deg, rgba(0,0,0,0.7) 0%, rgba(61,61,61,0.7) 48%, rgba(84,84,84,1) 99%); background: linear-gradient(11deg, rgba(0,0,0,0.7) 0%, rgba(61,61,61,0.7) 48%, rgba(84,84,84,1) 99%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#545454",GradientType=1); border-radius : 10px; overflow : hidden }

.periodical_list_wrap .flex { padding : 1.5rem }
.periodical_list_wrap .flex > a { position : relative; width : 13rem; height : 19rem; flex-shrink: 0; border-radius : 1rem; overflow : hidden }
.periodical_list_wrap .img_hover_effect { position : absolute; bottom : -100%; left : 0; width : 100%; height : 100%; display : flex; align-items: center; flex-direction: column; justify-content: center; background-color : rgba(255, 255, 255, 0.9); font-size : 1rem; color : #333; transition : all .3s ease }
.periodical_list_wrap .img_hover_effect p { position : static; width : 3rem; height : 3rem; line-height : 3rem; text-align : center; color : #fff; margin : 0 auto 1rem; background-color : #333; border-radius : 100%; padding : 0;}
.periodical_list_wrap .flex > a:hover .img_hover_effect { bottom : 0 }

.periodical_list_wrap .flex > div { display : flex; flex-direction: column; justify-content: space-between; padding : 0 0 0 2rem; color: #fff; width: calc(100% - 13rem);}
.periodical_list_wrap .flex > div a { display : inline-block; border : 1px solid #EEEEEE; color : #eee; border-radius : 5px }
.periodical_list_wrap .flex p.file_wrap { display : flex; justify-content: space-between; }
.periodical_list_wrap .flex p.file_wrap a { width : 100%; white-space : nowrap }
.periodical_list_wrap .flex p.file_wrap a:hover { background-color : #dfdfdf !important; color : #000 }


#periodicalDetailModal .layer_pop { background-color : #282828 }
#periodicalDetailModal .layer_tit { background-color : #555555; font-size : 0.8rem; color : #eee; padding : .9rem; line-height : 1; }
#periodicalDetailModal .layer_tit a { position : absolute; display : flex; align-items: center; top : 0; right : 0; height : 100%; padding : 0 1rem; font-size : 1rem }
#periodicalDetailModal .modal_opt { background-color : #3D3D3E; padding : 0.5rem 1.2rem; align-items: center; color : #DFDFDF }
#periodicalDetailModal .modal_opt a { display : inline-block; line-height : 2rem; padding : 0 0.5rem; }
#periodicalDetailModal .opt_left a i { margin-right : 0.5rem }
#periodicalDetailModal .opt_ctrl > * { display : inline-block; line-height : 2rem }
#periodicalDetailModal .opt_ctrl p { border-radius : 10rem; background-color : #4E4F52; padding : 0.3rem 1rem; margin :0 0.5rem }
#periodicalDetailModal .opt_right p a { display : inline-block; padding : 0 0.3rem }
#periodicalDetailModal .opt_right select { background-color : #4E4F52 !important; border : none !important; border-radius : 10rem; color : #fff; background-image : url('../img/layout/ic_down_w.svg') !important; padding-right : 2rem }
#periodicalDetailModal .opt_right p { background-color : #4E4F52; padding : 0.3rem 1rem; border-radius : 10rem; margin-left : 0.5rem }
#periodicalDetailModal .viewer_wrap { padding : 2rem; color : #fff; text-align : center }

.book_list_visual { background : url('../img/sub/archive/bg_newbook.png') no-repeat center center / cover; padding : 2rem; text-align : center; border-radius : 1rem; overflow : hidden }
.book_list_visual p { font-size : 2rem; margin-bottom : 1rem }
.book_list_visual p a { position : relative; top : -4px; display : inline-block; padding : 0 1.5rem; font-size : 1.5rem; opacity : 0.5; transition : all .3s ease }
.book_list_visual p a:hover { opacity : 1 }


.book_list_dt div:not(.no_data) { color: #fff; display : block; margin : 1.5rem 0; padding : 3rem; background: rgb(0,0,0); background: -moz-linear-gradient(90deg, rgba(0,0,0,0.7) 0%, rgba(61,61,61,0.7) 48%, rgba(84,84,84,1) 99%); background: -webkit-linear-gradient(90deg, rgba(0,0,0,0.7) 0%, rgba(61,61,61,0.7) 48%, rgba(84,84,84,1) 99%); background: linear-gradient(90deg, rgba(0,0,0,0.7) 0%, rgba(61,61,61,0.7) 48%, rgba(84,84,84,1) 99%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#545454",GradientType=1); border-radius : 1rem; overflow : hidden; transition : all .3s ease }

.book_list_dt div span { border : 1px solid #fff; color : #fff; font-size : 0.8rem; border-radius : 5px; margin-right : 0.5rem; cursor: auto;}
.book_list_dt div:not(.no_data):hover { background : #333 }
.book_list_dt div:not(.no_data):hover span { background : var(--s_primary); border-color : var(--s_primary) }
.book_list_dt dl { margin-top : 2rem; }
.book_list_dt dl dt { padding-right : 1rem; color : #999 }
.book_list_dt dl dd { padding-right : 4rem }

.use_donation_top { background : url('../img/sub/archive/img_use_bg.png') no-repeat center center / cover; border-radius : 1rem; padding : 3rem; overflow : hidden }
.use_donation_top > img { position : absolute; top : 3rem; right : 3rem }
.use_donation_top h2 { font-size : 1.7rem }
.use_donation_top p { margin : 1rem 0; font-size : 1rem }
.use_donation_top ul li { position : relative; padding-left : .8rem; margin : 0.5rem 0 }
.use_donation_top ul li:before { content : ''; width : .2rem; height : .2rem; display : inline-block; border-radius : 100%; margin-right : 0.5rem; background-color : #fff; position : absolute; top : 0.5rem; left : 0; }

.use_donation_txt { padding : 2rem 0; border-bottom : 1px solid #999 }
.use_donation_txt div { padding : .2rem 2rem; border-right : 1px dashed #999; width : 33.33% }
.use_donation_txt div:last-child { border : none }
.use_donation_txt h2 { font-size : 1rem }
.use_donation_txt span { position : relative; top : -.1rem; display : inline-flex; align-items : center; width : 1.4rem; height : 1.4rem; justify-content: center; font-size : 0.5rem; background-color : var(--s_primary); border-radius : 100%; margin-right : .3rem }

.use_donation_step ul { display : flex; justify-content: space-between; }
.use_donation_step ul li { position : relative; text-align : center; width : 20%; padding : 0 1.2rem }
.use_donation_step ul li:after { content : url('../img/sub/archive/ic_donation_arrow.png'); position : absolute; top : 3.1rem; right : -1rem }
.use_donation_step ul li:last-child:after { display : none }
.use_donation_step ul li p.img { margin : 0 auto 1.5rem; width : 8rem; height: 8rem; background-color : #555; border-radius : 100% }
.use_donation_step ul li p img { width : auto; height : auto }
.use_donation_step ul li h2 + p { font-size : 1rem; margin : 1rem 0 0 0; border-bottom : 2px solid var(--s_primary); padding-bottom : 0.5rem }
.use_donation_step ul li span { display : block; background-color : #555; padding : .7rem 0 }


.login_check_wrap { border-top : 2px solid #999; border-bottom : 1px solid #999; padding : 2rem; text-align : center; font-size : 1.2rem }
.login_check_wrap img { display : block; margin : 0 auto 2rem }
.login_check_wrap a { font-size : 1rem; background-color : #555555; border-radius : 0.5rem }

.donation_fin { padding : 4rem 1rem; text-align : center; font-size : 1.2rem }
.donation_fin i { font-size : 4rem; color : var(--s_primary) }
.donation_fin h2 { margin : 1.2rem 0; font-size : 1.8rem }


.donation_result_table td { position : relative }
.donation_result_table2 .file_select_wrap { display : flex; justify-content: space-between; }
.donation_result_table2 .file_select_wrap * { border-radius : 0 !important }
.donation_result_table2 .file_select_wrap input { width : 100% }
.donation_result_table2 .file_select_wrap button { flex-shrink: 0; background-color : #555; color : #fff; font-size : 0.9rem }
.donation_result_table2 button { background-color : #DFDFDF; font-size : .9rem; border-radius : 0 !important }

.notice_txt { font-size : .8rem; padding : .5rem 0 }
.notice_txt b { color : #FF6464 }


.archive_detail_content { position : relative; z-index : 99; height : 100vh; transition : all .3s ease }

/* 큐레이션-웹진 */
.archive_webzine{height: calc(100vh - 8rem);}

/* .swiper { width: 100%; height: 100%; }
.swiper-slide { text-align: center; font-size: 18px; background: #fff; display: flex; justify-content: center; align-items: center; }
#header.detailHead { display : block; z-index : 999 }
#header.detailHead.active { display : none }


.detail_section { position : relative; background-size : cover; background-repeat : no-repeat; background-position : center center; padding : 2rem }

#detailSection01 { color : #fff }
#detailSection01 .inner { padding-top : 5rem }
#detailSection01 .inner > span { display : inline-block; padding : 0.4rem 1rem; border-radius : 10px; border : 1px solid #fff }
#detailSection01 h2 { font-size : 1.8rem; margin : 1rem 0; }
#detailSection01 .share_btn_wrap { margin : 1rem 0 3rem 0; }
#detailSection01 .share_btn_wrap button { border-radius : 5px }

#detailSection02 { color : #fff }
#detailSection02 .img_relative { margin : 2rem }
#detailSection02 .img_relative img { display : block; width : 100%; height : auto !important; object-fit: cover; }
#detailSection02 .video_wrap { overflow : hidden }
#detailSection02 .video_wrap video { width : 100%; height : auto !important }
#detailSection02 .audio_wrap { position : absolute; bottom : 0; left : 0; background-color : rgba(0, 0, 0, 0.7); text-align : left; padding : 2rem; color : #BBBBBB }
#detailSection02 .audio_wrap h2 { font-size : 1rem; color : #fff }
#detailSection03 .inner { display : flex; justify-content: space-between; align-items : end }
#detailSection03 .inner > *,
#detailSection04 .inner > * { width : 50%; color : #fff; text-align: left; }
.detail_section .detail_modal_info { text-align : left }
.detail_section .detail_modal_info a { display : inline-block; border : 1px solid #fff; padding : 1rem 2rem; font-size : 1.1rem; background-color : rgba(0, 0, 0, 0.8); border-radius : 10px; margin-bottom : 1rem; }
.detail_section .detail_modal_info a i { margin-right : 0.5rem }
.detail_section .detail_modal_info .scroll_wrap { position : relative; max-height : 17rem; overflow : hidden auto; width : 70%; padding : 1rem; background-color : rgba(0, 0, 0, 0.8); border-radius : 10px;  }



#detailSection03 .detail_slide_wrap { display : flex; justify-content: space-between; align-items: end; padding-left : 3rem  }
#detailSection03 .detail_slide_wrap .detail_slide { width : 13rem }
#detailSection03 .detail_slide_wrap .detail_slide_txt { width : calc(100% - 14rem)}
#detailSection03 .detail_top { background-color : #fff; margin-bottom : 0.5rem; height : 18rem; overflow : hidden }
#detailSection03 .detail_top img { display : block; margin : 0 auto; height : 100% !important; object-fit: cover;}
#detailSection03 .detail_btm a { display : block; padding : 0 0.3rem; }
#detailSection03 .detail_slide_txt h2 { font-size : 1.3rem }
#detailSection03 .detail_slide_txt span { display : block; margin-top : 0.8rem; font-size : 1rem }
#detailSection03 .detail_slide_txt .detail_tab { display : flex; margin-top : 0.5rem }
#detailSection03 .detail_slide_txt .detail_tab a { display : block; width : 33.33%; text-align : center; color : #999; background-color : #DFDFDF; padding : .5rem 0;}
#detailSection03 .detail_slide_txt .detail_tab a.active { background-color : #000; color : #fff }
#detailSection03 .detail_txt { background-color : #fff; padding : 1rem 0.5rem; font-size : 14px; max-height : 12rem; overflow : hidden auto; color : #333 }
#detailSection03.active:before { content :''; width : 50%; top : 0; right : 0; height : 100%; background: rgba(0, 0, 0, 0.8); position : absolute }
#detailSection03 .slideClose { position : fixed; top : -5rem; right : 0; color : #fff; font-size : 2rem  }
#detailSection03 .right { display : none }
#detailSection03.active .right { display : block; }
#detailSection03 .player { margin-top : 0.5rem }
#detailSection03 audio { width : 100% }
#footer.detailFoot { position : fixed; left : 0; bottom : -100%; width : 100%; transition : all .3s ease }
#footer.detailFoot.active { bottom : 0 }


#detailSection04 .inner { display : flex; justify-content: end; align-items : end }
#detailSection04.active:before { content :''; width : 50%; top : 0; left : 0; height : 100%; background: rgba(0, 0, 0, 0.8); position : absolute }
#detailSection04 { color : #fff; overflow : hidden }
#detailSection04 .detail_modal_info { text-align : right }
#detailSection04 .scroll_wrap { float : right; text-align : left }
#detailSection04 .detail_modal_txt h2 { font-size : 1.4rem; margin-bottom : 1rem }
#detailSection04 .detail_modal_txt .scroll_wrap { max-height : 20rem; overflow : hidden auto; }
#detailSection04 .slideClose { position : fixed; top : -4rem; left : 0; font-size : 2rem; display : none }

#detailSection04 .left { display : none; padding-right : 3rem }
#detailSection04.active .left { display : block }
#detailSection04.active .slideClose { display : block }

.scroll_wrap::-webkit-scrollbar { width: 10px }
.scroll_wrap::-webkit-scrollbar-track { background : transparent;  }
.scroll_wrap::-webkit-scrollbar-thumb { background: #888; border-radius : 10px; }
.scroll_wrap::-webkit-scrollbar-thumb:hover { background: #555 }

.show_mobile { display : none }

#swiperPaging { position : fixed; left : 0; width : 80%; left : 10%; right : 10%; z-index : 9; top : 97% !important }
.swiper-pagination-progressbar .swiper-pagination-progressbar-fill { background-color : var(--s_primary) !important }  */

/* 기록물이용신청 */
.layer_pop_wrap.add_data .layer_cont{ padding: 0}
.layer_pop_wrap.add_data .page_search_con{ background: #333; padding: 2.5rem; justify-content: center; }
.layer_pop_wrap.add_data .page_search{ display: flex; align-items: center; justify-content: space-between; max-width: 800px; /* margin: 0 auto; */}
.layer_pop_wrap.add_data .page_search input{margin-left: 0.5rem; /* border: 0; border-bottom: 2px solid var(--s_primary); width: calc(100% - 2.8rem); */}
.layer_pop_wrap.add_data .page_search .search_btn{display: inline-block; vertical-align: middle; width: 2.5rem; height: 2.5rem; text-align: center; line-height: 2rem; background: #888888; border-radius: 8px;}
.layer_pop_wrap.add_data .page_search .search_btn:after{font-family: "Font Awesome 5 Free"; font-weight: 900;  content: "\f002"; font-size: 1rem; line-height: 2.5rem;}
.layer_pop_wrap.add_data .board_search select{ margin-left: 0.5rem }
.layer_pop_wrap.add_data .board_search .info_wrap span:before{ color: #EBEBEB}
.layer_pop_wrap.add_data .pop_select_img_list_wrap{ padding: 2rem 2rem; max-height: calc(90vh - 5.5rem); overflow-y: auto}
.layer_pop_wrap.add_data .pop_select_img_list{ display: grid; grid-template-columns: repeat(5,2fr); gap: 40px; }
.layer_pop_wrap.add_data .pop_select_img_item{ width: 11.5rem;}
.layer_pop_wrap.add_data .pop_select_img_item .img_wrap{ margin-bottom: 1rem; position: relative}
.layer_pop_wrap.add_data .pop_select_img_item .img_wrap .img{ width: 100%; height: 11.5rem;}
.layer_pop_wrap.add_data .pop_select_img_item .img_wrap .img:before{ content: ""; display: block; padding-top: 100%; width: 100%}
.layer_pop_wrap.add_data .pop_select_img_item .img_wrap .img:before{ content: ""; display: block; padding-top: 100%; width: 100%}
.layer_pop_wrap.add_data .pop_select_img_item .ck_box{ position: absolute; left: 0.8rem; top: 0.8rem}
.layer_pop_wrap.add_data .pop_select_img_item label{ position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
.layer_pop_wrap.add_data .pop_select_img_item .ck_box:checked ~ label{ border: 4px solid var(--s_primary);}
.layer_pop_wrap.add_data .pop_select_img_item .txt_wrap .tit{ font-size: 0.9rem; font-weight: 900; margin-bottom: 0.5rem}
.layer_pop_wrap.add_data .pop_select_img_item .txt_wrap .txt{ font-size: 0.7rem; color: #666}
.layer_pop_wrap.add_data .btn_area{ position: relative}
.layer_pop_wrap.add_data .btn_area .btn{ position: absolute; right: 0; top: 50%; transform: translateY(-50%); font-size: 0.9rem; font-weight: 400}

@media( max-width : 1440px ){
    .data_link .box { padding : 0 5rem 0 18rem }
    .archive_middle_slick .arch_slide_thumb_wrap { width : 60% }
    .archive_middle_slick .arch_slide_nav { width : 40% }
    .arch_slide_thumb .img { width : 12rem; height : 19rem; }
    .arch_slide_thumb .wrap { width : calc(100% - 13rem ) }

    .archive_board2 #archive_book_popup .layer_pop{width: calc(100% - 2rem);}
    .archive_board2 #archive_book_popup .layer_pop .layer_cont{max-height: 90vh;}

    .arc_doc_list .doc_img { left : -15rem }

    .arc_history .arc_history_nav{width: 20rem;}
    .arc_history .arc_history_list{padding-left: 20rem;}

    .periodical_list_wrap .flex > div { padding-left : 1rem; width: calc(100% - 10rem); }

    .periodical_list_wrap .flex p { flex-wrap : wrap }
    .periodical_list_wrap .flex p a { width : 100% }
    .periodical_list_wrap .flex p a + a { margin-top : 0.5rem }
}



@media( max-width : 1200px ){
    .archive_board .inner { flex-direction: column; }
    .archive_board .board_left,
    .archive_board .board_list { width : 100% }
    .archive_board .board_left .tit { margin-bottom : 1rem; text-align : center }
    .archive_board .board_left .tit br { display : none }
    .archive_board ul { text-align : center }
    .archive_board li { display : inline-block; margin : 0.5rem }
    .archive_board .board_list ul { justify-content: flex-start; }
    .archive_board .board_list ul li { width : calc(25% - 1rem ); margin : 1rem 0.5rem; margin-bottom : 0 }

    .archive_cate_thumb { margin : 0 -0.5rem 3rem -0.5rem }
    .archive_cate_thumb li { width : 33.33%; padding : 0.5rem }

    .periodical_list_wrap .flex > a { width : 10rem; height : 16rem }

    .use_donation_top { text-align : center }
    .use_donation_top > img { position : static; top : inherit; right : inherit; display : block; margin : 0 auto }
    .use_donation_top ul li:before { display : none }
    .use_donation_step ul { flex-wrap : wrap; justify-content: center; }
    .use_donation_step ul li { width : 33.33%; margin : 2rem 0 }
    .use_donation_step ul li:nth-child(3):after { display : none }
}


@media ( max-width : 1024px ){
        .tit3 h3{font-size: 1.5rem;}

        #archive_contents.main{padding-top: 6rem;}
    #archive_contents .tab br { display : block }
    #archive_contents .tab a { line-height : 1.5; padding : 0.75rem 1rem; }
    #archive_contents .tab.ty2 > a::before{top: inherit;}
    #archive_contents .board_search form > *,
    #archive_contents .board_search > div > *{margin-left: 0;}
    .archive_video .slide_wrap { width : calc(100% - 3rem); height: auto; padding-left : 1rem; overflow: visible;}
    .archive_video .archive_video_slide { width : 100% }
    .archive_video .archive_video_slide .item.slick-current .img{height: 12rem;}
    .archive_video .archive_video_slide .item .img{height: 8rem;}
    .archive_board .board_list ul li { width : calc(33% - 1rem ); }
    .archive_middle_slick .arch_slide_thumb_wrap { width : 100% }
    .archive_middle_slick .arch_slide_nav { display : none }
    .arch_slide_thumb a { display : block; margin : 0.8rem 0 !important; width : 140px }
    .arch_count { top : 2rem; left : 16rem }
    .archive_btm h2 { text-align : center }
    .archive_btm ul { margin : 2rem auto 0 }
    .archive_btm ul li { display : block; float : left; width : 33.33%; margin : 1rem 0 !important }
    .archive_btm ul li + li { margin : 0 }
    .archive_btm ul li a { margin : 0 auto }

    .arc_bbs_detail_slider_sync { padding : 3rem }
    dl.dtTable { flex-wrap : wrap; margin : 0 }
    dl.dtTable dt,
    dl.dtTable dd { margin : 1rem 0 }
    dl.dtTable dd { width : calc(100% - 100px) !important }

    .unesco_list_table .head p:nth-child(2),
    .unesco_list_table .body a span:nth-child(2) { text-align : left }
    .unesco_list_table .head p:nth-child(2){width: calc(100% - 7rem); text-align: center;}
    .unesco_list_table1 .head p:last-child,
    .unesco_list_table1 .body a span:last-child { display : none }
    .unesco_list_table p, .unesco_list_table .body a span{padding: 0 0.8rem;}
    .unesco_list_table1 .flex,
    .unesco_list_table1 .body a { justify-content: flex-start; }
    .unesco_list_table p:first-child, .unesco_list_table p:last-child, .unesco_list_table .body a span:first-child, .unesco_list_table .body a span:last-child{width: 7rem;}
    .unesco_list_table{font-size: 0.8rem;}

    .unesco_list_table2 p:first-child{width: 35%;}
    .unesco_list_table2 p:last-child { width : 6rem }

    .arc_doc_list .doc_img { position : relative; left : -1rem; height : 20rem; background-size : cover }
    .arc_doc_list { padding-left : 0 }
    .arc_doc_list ul li { padding : 2rem 0; }
    .arc_doc_list ul li span { position : static; font-size : 2rem; margin-right : 10px; }
    .arc_doc_video video{width: 100%;}

    /* 등재절차 */
    .arc_history .arc_history_nav{width: 100%;}
    .arc_history .arc_history_nav.fix{background: #efefef; padding: 1rem 0; top: 4rem; z-index: 10;}
    .arc_history .arc_history_nav p{display: none;}
    .arc_history .arc_history_nav ul{display: flex;}
    .arc_history .arc_history_nav ul::before{width: calc(100% + 2rem); top: 3.5rem; left: -1rem; height: 1px;}
    .arc_history .arc_history_nav ul li{width: 33.3%;}
    .arc_history .arc_history_nav ul li + li{margin-top: 0;}
    .arc_history .arc_history_nav ul li a{padding-left: 0; padding-bottom: 2.5rem; text-align: center;}
    .arc_history .arc_history_nav ul li a::before{top: auto; bottom: 0; left: 50%; transform: translateX(-50%);}
    .arc_history .arc_history_nav ul li a::after{top: auto; bottom:0.75rem; left: 50%; transform: translateX(-50%);}
    .arc_history .arc_history_list{padding-left: 0; padding-top: 7rem;}
    .arc_history .arc_history_list dl{position: relative; padding-top: 12rem !important; margin-top: -8rem !important;}
    .arc_history .arc_history_list dl + dl{border-top: 0;}
    .arc_history .arc_history_list dl + dl::before{width: 100%; height: 1px; border-top: 1px dashed #666; position: absolute; top: 10rem; left: 0; content: '';}

    .arc_bbs_detail_img { padding : 3rem 0; overflow: hidden;}
    .arc_bbs_detail_img img{max-width: 100%;}
    .img_inner p { padding : 1.5rem }
    .arc_bbs_data ul li { float : none !important; width : 100% !important }
    .arc_bbs_detail_img.ty2{display : flex; flex-wrap : wrap; justify-content:space-between;}
    .arc_bbs_detail_img.ty2 .img_inner { width:49%; }

    .periodical_list_wrap ul { margin : 0 }
    .periodical_list_wrap ul li { float : none; width : 100%; margin : 1rem 0; padding-bottom : 4rem }
    .periodical_list_wrap p { position : absolute; bottom : -2rem; left : 0; width : 100%; flex-wrap : nowrap; padding : 0 2rem }
    .periodical_list_wrap p a { width : 48% !important; margin : 0 !important }

    .use_donation_top { padding : 1.5rem }
    .use_donation_top ul li br { display : none }

    .donation_result_table thead { display : none }
    .donation_result_table table,
    .donation_result_table tr,
    .donation_result_table tbody,
    .donation_result_table td { display : block }
    .donation_result_table td { text-align : left; padding-left : 120px !important; border-bottom : 1px solid }
    .donation_result_table td:before { content : attr(data-name); position : absolute; top : 0; left : 0; display : flex; justify-content : center; align-items : center; width : 100px; height : 100%; background-color : #f8f8f8; word-break: keep-all; text-align : center }

    .donation_result_table2 td:first-child { padding-left : 1rem !important }
    .donation_result_table2 td:first-child:before { display : none }

    .donation_relative .absr { position : static; text-align : center; margin-top : 2rem }
    .donation_relative .absr button { margin : 0 0.5rem }

    .detail_section { padding : 1rem }
    #detailSection01 .inner br { display : none }
    #detailSection02 .img_relative { margin : 0 }
    #detailSection02 .audio_wrap { position : static; padding : 0.5rem 1rem }

    #detailSection03 .inner,
    #detailSection04 .inner { display : block; }
    #detailSection03 .detail_modal_info,
    #detailSection04 .detail_modal_info { display : flex; flex-direction: column-reverse;}
    #detailSection03 .inner > *, #detailSection04 .inner > * { width : 100% }

    .show_mobile { display : block }
    .detail_section .detail_modal_info .scroll_wrap{ width : 100%; border-radius : 0; font-size : 0.9rem }
    .detail_section .detail_modal_info a { width: fit-content; padding : 0.5rem 1rem; margin-top : 1rem; font-size : .8rem }

    #detailSection03 .detail_slide_wrap,
    #detailSection04.active .left { display : block; position : fixed; top : 50%; left : 50%; transform : translate(-50%, -50%); width : 100%; padding : 1rem; z-index : 9 }
    #detailSection03.active:before,
    #detailSection04.active:before { width: 100%; top: -50%; height: 200%; z-index : 3 }
    #detailSection04.active:before { content :''; width : 100%; top : -50%; right : 0; height : 100%; background: rgba(0, 0, 0, 0.8); position : absolute;  height: 200%; z-index : 3 }
    #detailSection03.active .absc,
    #detailSection04.active .absc { position : static; top : 0; left : 0; transform : none }
    #detailSection03 .detail_slide_wrap .detail_slide { display : none }
    #detailSection03 .detail_slide_wrap .detail_slide_txt { width : 100% }
    #detailSection03 .detail_slide_wrap .detail_slide_txt h2,
    #detailSection03 .detail_slide_txt span { display : none }
    #detailSection03 .slideClose,
    #detailSection04 .slideClose { top : 1rem; left : initial; right : 1rem; z-index : 10; width : auto; }

    .sync_btm { margin-top : 1.5rem }
    .arc_bbs_data { padding : 0 }
    .arc_bbs_detail_img.ty2 .img_inner { width:100%; margin-bottom:1rem;}
    
    table.detail_table td[style*="width: 476px"],
    table.detail_table td[style*="width: 75%"] {
        width: 63% !important;
    }
    table.detail_table td[style*="width: 121px"],
    table.detail_table td[style*="width: 25%"] {
        width: 37% !important;
    }
    table.detail_table td[style*="width: 476px"] p,
    table.detail_table td[style*="width: 121px"] p,
    table.detail_table td[style*="width: 75%"] p,
    table.detail_table td[style*="width: 25%"] p {
        word-break: keep-all !important;
        overflow-wrap: break-word !important;
        white-space: normal !important;
    }
}

@media ( max-width : 900px ){
    .data_link .box { background : #c9bfa8 url('../img/sub/archive/img_link_bg.png') no-repeat top center; border-radius : 0; padding : 2rem; height : auto }
    .arc_bbs_detail_slider_sync img{max-height: 30rem;}
    .sync_top .nuri_wrap .flex > img { width : 150px }
    .unesco_intro h2 br { display : block }
    .unseco_bg_01 .flex { flex-wrap : wrap }
    .unseco_bg_01 .flex > * { width : 100%; text-align : center }
    .unseco_bg_01 .flex div { padding-top : 2rem }
    .unesco_intro_txt li { flex-wrap : wrap; padding: 1.5rem 0; }
    .unesco_intro_txt li span { width : 100% }

    .use_donation_txt { display : block; padding-bottom : 0 }
    .use_donation_txt div { width : 100%; border-right : none; border-bottom : 1px dashed #999; padding : 1.8rem 0 }
    .use_donation_txt div h2 { margin-bottom : 1rem }

    .use_donation_step ul li h2 + p { height : 70px }
    .use_donation_step ul li:nth-child(4) h2 + p ,
    .use_donation_step ul li:nth-child(5) h2 + p { height : inherit }
    .custom_dropdown {display: block;}
    .custom_dropdown { position : static; }
    .custom_dropdown2 { margin-top : 1rem }
    .custom_dropdown button { position : relative; width : 100%; text-align : left }
    .custom_dropdown.main button{color: #fff;}
    .custom_dropdown button i { position : absolute; top : calc(50% - .3rem); right : 1rem }
    .archive_cate { display : none }
    .custom_dropdown.active { border-radius : 10px 10px 0 0; border-color : var(--primary) }
    .custom_dropdown.main.active{border-color: var(--s_primary);}
    .custom_dropdown.main.active button{color: var(--s_primary);}
    .archive_cate.open_cate { border : 1px solid var(--primary); border-top : none; position : relative; top : -1px; width : 100%; padding : 0; border-radius : 0 0 10px 10px; background: #fff; overflow: hidden; }
    .archive_cate.main.open_cate{border-color: var(--s_primary);}
    .archive_cate.open_cate a { width : 100%; border : none; font-size : .8rem; padding : 0.5rem; border-top : 1px solid #999; border-radius : 0; margin : 0; }
    .archive_cate.open_cate a i { display : none }


    .select_sub_cate { width: 100%; background: var(--primary); color: #fff; box-sizing: border-box; border-radius: 10px; text-align: left; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
    .archive_sub_cate button.select_sub_cate { margin-top: 1rem; position : relative; display : block; padding : 0.8rem 1.3rem; color : #fff; border-radius : 8px !important; }
    .archive_sub_cate button.select_sub_cate i { position: absolute; top: calc(50% - .3rem); right: 1rem; font-size : .5rem; transition : all .3s ease }
    .archive_sub_cate button.select_sub_cate.on { border-radius : 10px 10px 0 0 !important }
    .archive_sub_cate button.select_sub_cate.on i { transform : rotate(180deg) }

    .archive_sub_cate .sub_cate_list { margin : 0; max-height : 193px; overflow : auto; z-index : 3 }
    .archive_sub_cate .sub_cate_list li { float : none; width : 100%; padding : 0; }
    .archive_sub_cate .sub_cate_list { display: none; position :relative; width: 100%; top: 0; left: 0; border: 1px solid var(--primary); border-top-color : var(--darkgray); box-sizing: border-box; box-shadow: 4px 4px 14px rgba(204, 199, 199, 0.15); border-radius: 0 0 10px 10px; }
    .archive_sub_cate .sub_cate_list li a:not(.cate_more) { border : none; margin : 0; border-bottom : 1px solid #999; border-radius : 0; padding : 0.4rem 2rem 0.4rem 0.4rem; font-size : .8rem }
    .archive_sub_cate .sub_cate_list li a.cate_more{top: 0.25rem; width: 1.4rem; height: 1.4rem; line-height: 1.3rem;;}
    .select_sub_cate.on+.sub_cate_list { display: block; }
    
    table.detail_table td[style*="width: 476px"],
    table.detail_table td[style*="width: 75%"] {
        width: 57% !important;
    }
    table.detail_table td[style*="width: 121px"],
    table.detail_table td[style*="width: 25%"] {
        width: 43% !important;
    }
}


@media ( max-width : 800px ){
        .tit4 { font-size : 1.5rem; padding-bottom : 0.5rem }

    /* .board_search { margin-top: 0;} */
    #archive_contents select, #archive_contents input { background-color :#555 !important }
    #archive_contents .board_detail_box.ty2 .tit{margin: 1rem 0;}
    #archive_contents .board_tbl table tbody td{border-bottom: 0; color: var(--s_primary);}
    .archive_cate_thumb li { width : 50% }
    .archive_board2 .tab li a { padding : 1rem }

    .book_list_dt h2 { margin-bottom : 2rem }
    .book_list_dt dl { flex-wrap : wrap; margin : 0 }
    .book_list_dt dl dt,
    .book_list_dt dl dd { padding : 0.5rem 0 }
    .book_list_dt dt { width : 110px }
    .book_list_dt dl dt:before { content : ''; width : 0.3rem; height : 0.3rem; border-radius : 100%; display : inline-block; background-color: #999; position : relative; top : -4px; margin-right : 0.5rem }
    .book_list_dt dd { width : calc(100% - 110px ) }

    #archive_contents .tab.ty1 ul li a span { display : none }

    #archive_contents .file_list { flex-wrap : wrap }
    #archive_contents .file_list p { width : 100%; margin : 0.5rem 0 }
    #archive_contents .form_table tr th, #archive_contents .form_table tr td{border-top: 0;}

    .history_txt h2{font-size: 2.5rem;}

    /*자료추가 팝업*/
    .layer_pop_wrap.add_data .layer_pop{ max-height: 95vh;}
    .layer_pop_wrap.add_data .layer_cont{ max-height: calc(95vh - 3.5rem);}
    .layer_pop_wrap.add_data .page_search_con{ padding: 1rem}
    .layer_pop_wrap.add_data .pop_select_img_list_wrap{ padding: 1rem; height: 100%; max-height: 100%}
    .layer_pop_wrap.add_data .pop_select_img_list_wrap .board_search{ background: transparent; display: flex; align-items: center; flex-wrap: nowrap; justify-content: space-between; margin-bottom: 0; padding: 1rem 0; width: 100%; margin-left: 0}
    .layer_pop_wrap.add_data .pop_select_img_list_wrap .board_search .info_wrap{ width: 100%; display: flex; align-items: center; flex-wrap: nowrap; justify-content: flex-start; display: none}
    .layer_pop_wrap.add_data .pop_select_img_list_wrap .board_search > div,
    .layer_pop_wrap.add_data .pop_select_img_list_wrap .board_search form{ width: 100%; display: flex; align-items: center; justify-content: space-between; flex-flow: row-reverse}
    .layer_pop_wrap.add_data .pop_select_img_list_wrap .board_search > div label,
    .layer_pop_wrap.add_data .pop_select_img_list_wrap .board_search form label{ flex-shrink: 0}
    .layer_pop_wrap.add_data .pop_select_img_list_wrap .board_search > div select,
    .layer_pop_wrap.add_data .pop_select_img_list_wrap .board_search form select{ flex-shrink: 0; width: 10rem; margin: 0; max-width: 40%}
    .layer_pop_wrap.add_data .pop_select_img_list_wrap .board_search .info_wrap .b_count{ width: auto; margin-bottom: 0}
    .layer_pop_wrap.add_data .pop_select_img_list_wrap .board_search > div input[type='radio'],
    .layer_pop_wrap.add_data .pop_select_img_list_wrap .board_search > div input[type='checkbox'],
    .layer_pop_wrap.add_data .pop_select_img_list_wrap .board_search form input[type='radio'],
    .layer_pop_wrap.add_data .pop_select_img_list_wrap .board_search form input[type='checkbox']{ width: 1rem; height: 1rem}
    .layer_pop_wrap.add_data .pop_select_img_list{ display: block; width: 100%}
    .layer_pop_wrap.add_data .pop_select_img_item{ width: 100%; display: flex; border-bottom: 1px dashed #DFDFDF; padding: 1rem 0}
    .layer_pop_wrap.add_data .pop_select_img_item .img_wrap{ width: 7rem; flex-shrink: 0; margin-bottom: 0}
    .layer_pop_wrap.add_data .pop_select_img_item .img_wrap .img{height: 7rem;}
    .layer_pop_wrap.add_data .pop_select_img_item .txt_wrap{ width: calc(100% - 7rem); padding: 1rem 1rem}
    .layer_pop_wrap.add_data .pop_select_img_item .txt_wrap .tit{ font-size: 1rem}
    .layer_pop_wrap.add_data .pop_select_img_item .txt_wrap .txt{ font-size: 0.8rem}
    .layer_pop_wrap.add_data .btn_area{ display: flex; flex-flow: column; align-items: center}
    .layer_pop_wrap.add_data .btn_area .btn{ position: static; transform: translate(0,0); margin: 1rem}


    /* 기록물기증 */
    .file_list p { display: block;position: relative; margin-top: 1rem; }
    .file_list p + p{margin-left: 0;}
    .file_list a{position: absolute; top: 0; right: 0;}
    .file_list span{display: block; padding-right: 2rem;}
    
    table.detail_table td[style*="width: 476px"],
    table.detail_table td[style*="width: 75%"] {
        width: 53% !important;
    }
    table.detail_table td[style*="width: 121px"],
    table.detail_table td[style*="width: 25%"] {
        width: 47% !important;
    }
}

@media (max-width: 768px) {
	table.detail_table {
	    table-layout: fixed !important;
	    margin-left: auto !important;
	    margin-right: auto !important;
	    font-size: 12px !important;
	}
 	table.select_detail_table {
        width: 100% !important;
        min-width: 100% !important;
        table-layout: auto !important;
    }
	table.detail_table td {
	    height: auto !important;
	    padding: 9px 6px !important;
	    vertical-align: middle !important;
	    box-sizing: border-box !important;
	}
	table.detail_table td p {
	    margin: 0 !important;
	    line-height: 1.45 !important;
	    text-align: center !important;
	    word-break: break-word !important;
	    overflow-wrap: normal !important;
	    white-space: normal !important;
	}
	table.detail_table td span {
	    word-break: normal !important;
	    overflow-wrap: normal !important;
	    white-space: normal !important;
	}
	table.detail_table td:not(:first-child) p {
	    white-space: nowrap !important;
	}
	table.detail_table td:first-child p {
	    white-space: normal !important;
	    word-break: word-break !important;
	    overflow-wrap: normal !important;
	}
    table.detail_table tr:first-child td p {
        word-break: normal !important;
        overflow-wrap: normal !important;
        white-space: normal !important;
        line-height: 1.35 !important;
    }
    table.detail_table td[style*="width: 476px"],
    table.detail_table td[style*="width: 75%"] {
        width: 51% !important;
    }
    table.detail_table td[style*="width: 121px"],
    table.detail_table td[style*="width: 25%"] {
        width: 49% !important;
    }
    .arc_bbs_detail_slider_sync .sync_top div:nth-child(8) table.detail_table {
    	width: 800px !important;
    }
}
@media ( max-width : 765px ){
    .archive_board .board_list ul li { width : calc(50% - 1rem ); }
    .arc_bbs_detail_title { text-align : center; padding : 2rem 0 }
    .arc_bbs_detail_title h2 { margin : 1rem 0 }
    .arc_btn_default span { display : none }
    .arc_btn_default i { margin : 0 }
    #archive_contents .arc_bbs_detail_title .snb_util { position : relative; bottom : inherit; margin-top : 2rem }
    #archive_contents .arc_bbs_detail_title .snb_util ul{justify-content: center;}
    .arc_bbs_detail_slider_sync img{max-height: 20rem;}
    .sync_top .nuri_wrap { display : none }
    .arc_bbs_detail_slider_sync { padding : 1rem 0; border-bottom: 0; }
    dl.dtTable dt,
    dl.dtTable dd { margin : 0.5rem 0 }
    table.detail_table td[style*="width: 476px"],
    table.detail_table td[style*="width: 75%"] {
        width: 50% !important;
    }
    table.detail_table td[style*="width: 121px"],
    table.detail_table td[style*="width: 25%"] {
        width: 50% !important;
    }
}   

@media ( max-width : 600px ){
    .arch_slide_thumb .img { width : 10rem; height : 17rem; }
    .arch_slide_thumb .wrap { width : calc(100% - 11rem); }
    .archive_cate_thumb .img{height: 13rem;}
    .arch_count { left : 12rem }
    .use_donation_step ul li { width : 100% }
    .use_donation_step ul li h2 + p { display : inline-block; height : auto !important }
    .use_donation_step ul li span { background-color : transparent; padding : 0 }
    .use_donation_step ul li span b { display : inline-block; background-color : #555; padding : .5rem 1rem }
    .use_donation_step ul li:after { display : block !important; top : calc(100% + 1rem); right : calc(50% - .5rem); transform : rotate(90deg) }
    .use_donation_step ul li:last-child:after { display : none !important }

    .periodical_list_wrap .flex{flex-wrap: wrap;}
    .periodical_list_wrap .flex > a{width: 100%; height: auto;}
    .periodical_list_wrap .flex > a img{position: static; transform: none; -webkit-transform: none;}
    .periodical_list_wrap .flex > div{width: 100%; padding-left: 0;}
    .periodical_list_wrap .flex > div h2{font-size: 1.2rem; margin-top: 0.5rem;}

    /* 등재절차 */
    .arc_history .arc_history_nav ul li a{font-size: 1.2rem;}
    .arc_history .arc_history_list dl + dl{padding-top: 2rem; margin-top: 2rem;}
    .arc_history .arc_history_list dl dt{font-size: 2.5rem;}
    .arc_history .arc_history_list dl dd ul li{padding-left: 1rem;}
    .arc_history .arc_history_list dl dd ul li .date{position: static; display: block; }
}

@media ( max-width : 500px ){
    .archive_board .board_list ul li { width : calc(100% - 1rem ); }
    .archive_btm ul li { width : 50% }
    .book_list_visual{padding: 1.5rem 1rem;}
    .book_list_visual p{font-size: 1.5rem;}
    .book_list_visual p a{padding: 0 1rem;}
    .book_list_dt div { padding : 1.5rem }
    .book_list_dt h2 { margin-bottom : .8rem; font-size : 1.2rem }
    .book_list_dt h2 span { display : block; width: fit-content; margin-bottom : 0.5rem; line-height : 1.9rem }
    .book_list_dt dl dt, .book_list_dt dl dd { padding : 0.2rem 0 }
    .archive_cate_thumb .img{height: 10rem;}
    .btm_btn_wrap .btn{width: 7.5rem; line-height: 2.5rem;}
    .arc_history .arc_history_list dl dd ul li .arc_history_img p{max-width: 100%;}
}

@media ( max-width : 480px ){
    .template_type01 > .template_tit {
		font-size: 1.8rem;
	}
	.template_type31 .template_tit_wrap, .template_type31 .template_tit {
	    line-height: +1.2;
	}
}


