@font-face {
    font-family: 'Pretendard';
    src: url('/font/uce/Pretendard-Regular.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Pretendard';
    src: url('/font/uce/Pretendard-Bold.otf') format('opentype');
    font-weight: bold; /* Bold */
    font-style: normal;
}

html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del,
 dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, 
legend, table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, embed, figure, figcaption, 
footer, header, hgroup, menu, nav, output, ruby, section, summary,time, mark, audio, video {
	margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block;
}
.boardContents em {font-style:italic;}
strong {font-weight:bold;}
body {
	line-height: 1; font-family: 'Pretendard', sans-serif;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,q:before, q:after {
	content: ''; content: none;
}
fieldset, hr {
     display: block; margin: 0; padding: 0; border: 0 none; 
}
input, select {
     max-width: 100%; vertical-align: middle; 
}
input, select, button, textarea, optgroup {
     margin: 0; font-family: inherit; font-size: inherit; color: inherit; 
}
a { color: inherit; text-decoration: none; }
button { padding: 0; border: 0 none; background: none; cursor: pointer; }
input[type='submit'] { -webkit-appearance: none; -moz-appearance: none; appearance: none; }
img {max-width: 100%; border: 0 none; font-size: 0; vertical-align: middle; }
select{ -moz-appearance:none; /* Firefox */  -webkit-appearance:none; /* Safari and Chrome */  appearance:none; }
select::-ms-expand { display:none; } 
table {border-collapse: collapse; border-spacing: 0; width: 100%;}
html.no-scroll, body.no-scroll {overflow: hidden !important;}

/*top*/
.back-to-top {position: fixed; bottom: 20px; right: 20px; display: none; background-color: #333; color: #fff; padding: 10px 15px; border: none; border-radius: 5px; cursor: pointer;font-size: 14px; transition: opacity 0.3s;
}
.back-to-top:focus {outline: 2px solid #0074e5;}

/* 로딩 스피너 스타일 */
.loader {border: 8px solid #f3f3f3; border-top: 8px solid #56acff;  border-radius: 50%; width: 50px; height: 50px; animation: spin 1s linear infinite; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 1000;}
/* 스피너 애니메이션 */
@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}


/* 별점 만족도 */
.satisfaction {display: flex; justify-content: right; font-size: 16px; color: #555;}
.satisfaction p {margin-bottom: 8px;}
.satisfaction div {width: calc(100% - 340px); background:#f8f8f8; border-radius: 10px; margin: 24px 0 32px; padding: 24px; box-sizing: border-box;}
.satisfaction ul li {float: left; margin-right: 24px;}
.satisfaction ul li input {margin-right: 4px;}
.satisfaction input[type="text"] {width: calc(100% - 110px); border-radius: 4px;}
.satisfaction .registro {width: 90px; height: 44px; text-align: center; line-height: 44px; display: inline-block; background: #002b55; border-radius: 4px; color: #fff; font-size: 16px;}


/*최근검색어 창*/
.auto-search-dropdown {position: absolute; background-color: #f8f8f8; width: 940px; padding: 14px; top: 186px; box-sizing: border-box; border-radius: 0 0 10px 10px;}
.auto-search-dropdown ul li {background-color: #fff;}
.auto-search-dropdown ul li a {padding: 12px;}
.auto-search-dropdown ul li a:hover {background: #e9ecef;}

.autobtngroup button {padding:8px 4px; font-size: 16px;}
.autoclose-btn {float: right; background: none; border: none; font-size: 16px; cursor: pointer;}
.auto-tab-content {background: #fff; min-height: 40px;}

.auto-tab-content ul li a {cursor: pointer; padding: 12px;}
.auto-tab-content ul li:hover {background: #e9ecef;}



.previewbtn {background:#f1f1f1; border:1px solid #f9f9f9; color: #000;}
.previewoverlay { display: none; position: fixed; top: 0; left: 0; width: 100%;  height: 100%; background: rgba(0, 0, 0, 0.5); z-index: 9999;}
.preview2 {display: none; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 1001; padding: 32px 20px; border: 1px solid #ccc; background: #fff; width: 90%; max-height: 1000px; overflow-y: scroll; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); z-index: 9999;}
.preview2 .closePreview {position: absolute; top: 16px; right: 16px; background: #ff5c5c; color: #fff; border: none; border-radius: 5px; padding: 12px 20px; cursor: pointer;}
.preview2 .closePreview:hover {background: #ff3b3b;}
.preview2 h3 {font-size: 21px; font-weight: 600; margin-bottom: 24px;}
.preview2 .boardView{border-top:2px solid #000;}
.preview2 .boardView h4{font-size:18px; line-height:150%; padding:20px 10px; border-bottom:1px solid #ccc;}
.preview2 .boardData{width:100%; border-bottom:1px solid #ccc; padding:10px; box-sizing:border-box; background:#f1f1f1; }
.preview2 .boardData li{display:inline-block; line-height:150%; margin-right:25px; font-size:16px;}
.preview2 .boardData li:before{content:'· ';}
.preview2 .boardContents{padding:15px; box-sizing:border-box; line-height:150%; font-size:16px; border-bottom:1px solid #ccc;}
.preview2 .boardContents img{max-width:90%; display:block; margin: 12px auto;} 
.preview2 .navFile{ border-bottom:1px solid #ccc; position:relative; padding-left:80px; background-color:#f1f1f1;}
.preview2 .navFile dl dt{ position:absolute; top:15px; left:10px;}
.preview2 .navFile dl dd{ box-sizing:border-box; padding:15px 10px;}
.preview2 .filedownload{margin-bottom:8px; font-size:16px; display:block; line-height:150%; color:#000; position:relative; padding-left:22px;}
.preview2 .filedownload > img{position:absolute; top:3px; left:0;}
.preview2 .filedownload:last-of-type{ margin-bottom:0px; }
.preview2 .boardNav{border-top:2px solid #000;}
.preview2 .boardNav li {box-sizing:border-box; padding:12px; border-bottom:1px solid #ccc;}
.preview2 .boardNav li dl:after{content: ''; display: block; clear: both; visibility: hidden;}
.preview2 .boardNav li dl dt{float:left; width:88px; font-size:16px; box-sizing:border-box; line-height:150%;}
.preview2 .boardNav li dl dt img{margin-right:4px;}
.preview2 .boardNav li dl dd{float:left; width:calc(100% - 88px); font-size:16px; box-sizing:border-box; line-height:150%;}
/*미리보기*/

.contentBox {min-height: 600px;}

/* 기록의 서가 게시판 상세 이미지 가운데 정렬 */
.boardImgCenter{
	display:block;
	margin:0 auto;
	max-width:100%;
	height:auto;
}


@media all and (max-width:860px) {    

    /* 별점 만족도 */
    .satisfaction {width: calc(100% - 40px); justify-content: initial;}
    .satisfaction div {width: 100%;}

	/*최근검색어*/
	.auto-search-dropdown {width: 100%;}

}


@media all and (max-width:600px) {    
    
    /* 별점 만족도 */
    .satisfaction .floatClear {margin-bottom: 24px;}
    .satisfaction .registro {width: 100%;}
    .satisfaction input[type="text"] {width: 100%; box-sizing: border-box; margin-bottom: 12px;}

	/*최근검색어*/
	.auto-search-dropdown {top: 172px;}
    
}


@media all and (min-width:861px) and (max-width:1299px) { 
	
    /* 별점 만족도 */
    .satisfaction {width: calc(100% - 80px); justify-content: initial;}
    .satisfaction div {width: 100%;}

	/*최근검색어 창*/
    .auto-search-dropdown {width: 100%;}
}