@charset "utf-8";

.frm_file::placeholder {
    opacity: 0.7;
}


.rand_img {
    height: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}
.rand_img img {
    display: block;
    width: auto;
    height: auto;
    max-height: 200px;
}

.emoticon-card {
	font-family: 'Dotum';
	line-height: 1.25;
	letter-spacing: 1;
	text-align: justify;
}
.emoticon2 {
    white-space: pre-wrap;
}

/*텍스트*/
.txt-sub {
	text-align: center;
	padding: 0px;
	color: var(--txt-color);
	background: transparent;
	font-weight: bold;
	font-size: 16px;
	height:70px;
	font-family:  var(--txt-font);
	text-decoration: none;
	text-shadow: 0 0 10px #fff; 
	display: flex;
	align-items: center;
	justify-content: center;
   }


textarea {display:block;}

/* 본문 */
#page_board_content	{ margin: 35px 0; }
.board-notice	{ width: 340px; padding: 10px; margin: 0 auto; text-align: center; box-sizing: border-box; }



.clap_box form {padding-top: 35px;}

 /* 메시지 남기기 */
.ui-write-box {
	position:relative;
	margin: 0 auto;padding-right:101px;
	width: 100%;
	box-sizing:border-box;
	overflow: hidden;
}
.ui-write-box textarea {
	width: 100%; height: 100px; 
	padding: 10px; 
	box-sizing: border-box;
}
.ui-write-box #btn_submit {
	padding:15px;position:absolute;right:0;top:0;
	width:100px;height:100px;line-height:1.65;
	}
	
.ui-control { overflow: hidden;} 

.ui-control .files {position:relative;display:flex;flex-wrap:wrap;margin:5px 0;}
.files {
	display: flex;
    gap: 1px;
    margin-top: 10px;
}

.files dt {
    width: 100px;
    height: 118px;
    background-color: rgba(0,0,0,.5);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: inset 0 0 0 1px #A3CCA2;

}

.files dt a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: auto;
    height: auto;
}

.files dt img {
    display: block;
    width: auto;
    height: auto;
    max-height: 116px;
    max-width: 100%;
}


.files dd {
	flex: 1;
	margin-right:1px;
	margin:0 !important;
}
.files dd .file_chk {
    margin-top: auto;
    display: block;
}

#page_board_content {
    display: flex;
    flex-direction: column;
    flex: 1;
    width: 100%;  /* 추가 */
}
div.fix-layout {  /* 실제 부모 클래스명으로 바꿔주세요 */
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

/* 메시지 리스트 전체 영역 */
.ui-qna-list {
    position: relative;
    clear: both;
    margin-top: auto;  /* 이게 핵심 */
}

.rand_img {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex: 1;  /* 남은 공간 차지 */
    height: auto;
}

/* 각 메시지 영역 */
.ui-qna-list li		{ position: relative; }
.ui-qna-list li p	{ clear: both; margin: 0 0px;}
.ui-qna-list li p i				{ position: relative;}
.ui-qna-list li p.txt-center {padding:10px 0;}
.ui-qna-list li p.notice		{margin:0;}
.ui-qna-list li p.notice strong	{position:absolute;top:15px;right:20px;}
.ui-qna-list li p strong a,
.ui-qna-list li ul li em		{ display: inline-block; margin-left:10px; font-size:12px; }

.ui-qna-list li p strong a {height: 18px;}

.ui-qna-list .date				{ float: right; font-size:12px;opacity:0.7; }

.ui-qna-list li .ui-btn.small {
	margin-top:5px;margin-left:0px;padding:0 5px;
	font-size:11px; font-family:'dotum',sans-serif;
	border-radius:2.5px;opacity:1;line-height: 18px;height: 18px;
}
.ui-qna-list li .qna-content.guest {opacity:0;}
.ui-qna-list li .qna-content { margin-top: 10px; font-family: dotum; line-height: 1.65; word-break: keep-all;}
.ui-qna-list li .qna-content a { word-break:break-all; } 

.ui-qna-list li .qna-comment-content { margin-top:10px;font-family: dotum; line-height: 1.65; word-break: keep-all;}

.qna-comment-content p { clear: both; margin: 0 0px;}
.qna-comment-content p .date				{ float: right; font-size:12px;opacity:0.7; }


.ui-qna-list li ul li			{ padding: 0; }
.ui-qna-list li ul li .clear	{text-align:right;}
.ui-qna-list li ul li .clear a	{display:inline-block;float:none;}

.ui-qna-list .ui-qna-list-password label		{ padding-right: 10px; }
.ui-qna-list .ui-qna-list-password label.blur	{ text-shadow: none; }
.ui-qna-list .ui-qna-list-password input		{ position: relative; z-index: 1; }
.ui-qna-list .ui-qna-list-password button		{ 
	height: 28px; line-height: 28px; padding: 0 25px;
	font-family: 'Dotum'; margin-left: -5px; border-left-width: 0;
}

.ui-qna-list .no-data			{ text-align: center; line-height: 100px; }

.search-box			{ clear: both; float: right; margin-bottom: 10px; }

 
/*통계 섹션*/
#clap_wrap {display:none;max-height:340px;overflow-y:auto;}
/* #clap_wrap::-webkit-scrollbar{display:none;} */
#stat_total {text-align:center; font-size:12px;margin-bottom:0px;}
.clap_container {display:flex;flex-wrap:wrap;justify-content:space-evenly;gap:5px;}
.clap_container section {display:flex; flex-direction: column;justify-content: space-between;margin:10px 0;}
#clap_wrap .clap_stat_daily,
#clap_wrap .clap_stat_weekly {
    flex: 1;
    width: auto;
}

#clap_wrap h3 {margin-bottom:5px;padding:8px 0;}
#clap_wrap h3 .less {display:none;}
#clap_wrap table {width:100%; margin:0 auto;} 

#clap_wrap table td {
	position:relative;padding:0 0 18px;height:140px;
	vertical-align:bottom; text-align:center; line-height:1;
	font-family:'dotum',sans-serif;font-size:11px;
	box-sizing:border-box;
} 
#clap_wrap .clap_stat_weekly table td {height:280px;} 

#clap_wrap table td p {border-top:1px solid #a3cca2;font-size:12px;line-height:18px; display:block; padding:0;margin:0 auto;}
#clap_wrap table td .bar {width:20px;
	max-height: 261px;
	cursor:pointer; background:#a3cca2;position:absolute; bottom:18px;left: 50%;
	transform: translateX(-50%);}
#clap_wrap table td .bar i { 
	display: none;
	position:absolute;
	white-space:nowrap;
	opacity:1;
	z-index:2;
	color:#fff;
	bottom:15px;
}
#clap_wrap table td .bar:hover i { display:block; }
#clap_wrap table td .num {position:absolute;bottom:0;left:0;right:0;height:18px;}
@media all and (max-width: 800px) {
	.clap_container {
        flex-direction: column;
    }
}
@media all and (max-width: 480px) {
	.ui-control input[type="text"],
	.ui-control input[type="password"]	{ display: block; clear: both; width: 100%; margin-top: 10px; }
	.ui-qna-list li	{ padding: 10px 0; }
	#clap_wrap table td.old {width:0;overflow:hidden;}
	#clap_wrap h3 .less {display:inline;}
	#clap_wrap h3 .full, #clap_wrap table td .num .year {display:none;}
}

@media all and (max-width: 380px) {
	.ui-qna-list .ui-qna-list-password		{ position: relative; padding-right: 90px; }
	.ui-qna-list .ui-qna-list-password label	{ display: none; } 
	.ui-qna-list .ui-qna-list-password .ui-submit	{ position: absolute; top: 0; right: 0; }
	.ui-qna-list .ui-qna-list-password input		{ width: 100%; }
}