@charset "utf-8";
#header{margin-bottom: 15px !important}
.mo_board_wrap{margin-bottom: 100px; min-height: 50vh;}
.mo_board_wrap .btn_box{margin: 15px auto;}
.container b{font-weight: 600;}
.container strong{font-weight: 700;}
.page_location{font-size: 13px; color: #666;}

/* =========================================================================================================== */
/* ===== 리스트 페이지 ===== */
.list_wrap{text-align: center; font-size: 13px; width: 100%; border-top: 2px solid #333;}
.list_wrap thead{background-color: #fbfbfb; font-weight: 500;}
.list_wrap tr{border-bottom: 1px solid #eee;}
.list_wrap th, .list_wrap td{padding: 10px 5px; vertical-align: middle; text-align: center;}
.list_wrap .t_chk{width: 30px;}
.list_wrap .t_num{width: 40px;}
.list_wrap .t_cate{width: 60px;}
.list_wrap .t_subject{}
.list_wrap .t_name{width: 80px;}
.list_wrap .t_date{width: 50px;}
.list_wrap .t_good{width: 50px;}
.list_wrap .t_nogood{width: 50px;}
.list_wrap td.t_subject{text-align: left;}

.board_btn_wrap{margin: 15px 0;}
.board_btn{display: flex; gap: 5px; align-items: center;}

.board_search{width: fit-content; display: flex; gap: 10px; align-items: center; background-color: #fbfbfb; border: 1px solid #eee; border-radius: 20px; padding: 10px 15px; margin: 20px auto;}
.board_search select, .board_search input[type="text"]{border: none; background-color: transparent; min-height: initial; padding: 0;}
.board_search button{background-color: transparent;}


/* ===== 뷰 페이지 ===== */
.view_title, .write_title{position: relative; padding-bottom: 10px; margin-bottom: 15px; margin-top: 10px; border-bottom: 1px solid #eee;}
.view_title > * + *, .write_title > * + *{margin-top: 10px;}
.view_title .tit, .write_title .tit{position: relative; font-size: 17px; line-height: 1.2; font-weight: 600; }
.view_content{line-height: 1.4;}
.view_content img{display: block; margin: 15px auto;}

.btn_wrap{display: flex; align-items: center; justify-content: space-between; font-size: 12px;}
.btn_wrap .board_btn, .btn_wrap .gall_info{margin: 0;}
.view_info{font-size: 12px; color: #666;}

.reply_wrap > h2{font-size: 17px; font-weight: 600; margin-bottom: 10px;}
.reply_wrap > h2 > b{font-size: 13px; margin-left: 5px; color: #666; font-weight: 400;}
.reply_form{margin-bottom: 10px;}
.reply_btn{display: flex; align-items: center; justify-content: flex-end; border: 1px solid #eee; border-top: none; border-radius: 0 0 5px 5px; gap: 15px;}
.reply_btn label{display: flex; align-items: center; white-space: nowrap; font-size: 13px; gap: 5px;}
#commentPane .reply_btn input[type="checkbox"]{padding: 0; width: 1.2em; height: 1.2em;}
.reply_btn button{padding: 10px 15px; background-color: #f0f0f0; border-left: 1px solid #eee;}
.reply_text{margin-bottom: 0;}
.reply_text textarea{border-radius: 5px 5px 0 0; display: block; width: 100%; line-height: 1.5; resize: none; border: 1px solid #eee; padding: 10px; background-color: #fbfbfb;}
.comment_list{font-size: 13px;}
.comment_list .empty{text-align: center; padding: 3em 0;}
.reply_list > li{border-top: 1px solid #eee; padding: 5px 0;}
.reply_content{word-break: break-all; margin-bottom: 10px; line-height: 1.4; text-align: justify; letter-spacing: -0.02em;}
.reply_content .more, .reply_content .close{text-decoration: underline; color: #161616; font-weight: 600; cursor: pointer;}

.reply_top {display: flex; align-items: center; justify-content: space-between; padding: 10px 0;}
.reply_top_tit{display: flex; align-items: center; gap: 10px;}
.reply_top_tit h5{font-weight: 600;}
.reply_top_tit time{font-size: 11px; color: #999;}
.reply_top .ffd{font-size: 11px;}

.reply_bot {margin: 10px 0;}
.reply_bot i + span{color: var(--color-basic); font-weight: 600;}
.re_reply_box .reply_list > li{border-top: 1px solid #eee; border-bottom: none; padding-bottom: 10px;}

.reply_guest{display: flex; align-items: center; gap: 10px;}
.reply_guest .captcha{display: flex; align-items: center;}
.reply_guest .captcha > div{display: flex; align-items: center;}
.reply_guest .captcha span > img{height: 40px !important; vertical-align: middle;}

.comment_list > li{border-top: 1px solid #eee;}

.evaluation_wrap{margin-top: 30px; margin-bottom: 30px;}
.evaluation{display: flex; gap: 10px; align-items: center; justify-content: center;}
.evaluation > li{flex: 1; max-width: 80px; aspect-ratio: 1/1; text-align: center;}
.evaluation > li > a{display: flex; flex-wrap: wrap; flex-direction: column; align-content: center; justify-content: center; width: 100%; height: 100%;border: 2px solid #eee; border-radius: 50%; gap: 10px;}
.evaluation #good_button{border-color: #f75747; color: #f75747;}
.evaluation #bad_button{border-color: #1374f2; color: #1374f2;}
.evaluation > li > a > i{ font-size: 1.5em; }
.evaluation > li > a > span{font-weight: 600; line-height: 0.9;}


/* ===== 작성 페이지 ===== */
.write_title {margin-bottom: 0;}
.write_form {font-size: 13px;}
.write_form > *{margin-top: 5px;}
.write_form .line dt{max-width: 140px; font-weight: 600; padding: 10px 0;}
.write_form .line dd.option{display: flex; align-items: center; gap: 5px; min-height: 24px;}
.write_form .line dd.file > div + div{margin-top: 5px;}
.write_form .edit_wrap{margin-top: 10px;}
.write_form .cke_chrome{border: 1px solid #eee; box-shadow: none;}

/* ===== 갤러리 페이지 ===== */
.board_title{display: flex ; align-items: center; justify-content: space-between; padding-bottom: 15px; border-bottom: 1px solid #eee;}
.board_tit{font-size: 18px; font-weight: 600; letter-spacing: -0.02em;}
#bo_list_total{display: flex; align-items: center; justify-content: space-between; padding: 1em 0; font-size: 13px;}


#mo_gall{display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px 5px;}
#mo_gall > li{position: relative;}
#mo_gall .check{position: absolute; top: 10px; left: 10px;}
#mo_gall .img{aspect-ratio: 1/1;}
#mo_gall .img img{display: block; width: 100%; height: 100%; object-fit: cover;}

#mo_gall .text{padding: 10px 5px;}
#mo_gall .bo_tit{display: -webkit-box; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 2; -webkit-box-orient: vertical; font-weight: 600;}
.gall_info{display: flex; gap: 8px; font-size: 12px; align-items: center; color: #999; margin-top: 5px;}
.gall_info > li > i{margin-right: 4px; font-size: 0.85em;}

.board_btn{display: flex; gap: 5px; margin: 15px 0;}


.board_search{width: 100%; max-width: 490px; display: flex; gap: 5px; align-items: center; background-color: #fbfbfb; border: 1px solid #eee; border-radius: 20px; padding: 6px 20px; margin: 15px auto;}
.board_search select, .board_search input{border: none; background-color: transparent; min-height: initial; padding: 0;}
.board_search .input_wrap{flex: 1;}
.board_search button{background-color: transparent; font-size: 1.1em;}