@charset "utf-8"; /** * @author https://www.cosmosfarm.com * 길이 단위: 10px = 1rem (cnnong). %·em 등은 그대로. */ .kboard-default-poweredby { float: left; padding-bottom: 1.5rem; width: 100%; font-size: 1.4rem; } .kboard-default-new-notify { display: inline-block; *display: inline; zoom: 1; padding: 0.2rem 0.2rem; line-height: 1rem; font-size: 1rem; color: white; background-color: #f61b5d; font-weight: normal; } .kboard-default-cut-strings { width: auto; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; word-wrap: normal; } #kboard-default-list { display: inline-block; *display: inline; zoom: 1; margin: 0; width: 100%; } #kboard-default-list form { margin: 0; padding: 0; } #kboard-default-list .kboard-list-header { float: left; display: table; padding-bottom: 1.5rem; width: 100%; } #kboard-default-list .kboard-list-header .kboard-total-count { *float: left; display: table-cell; font-size: 1.4rem; } #kboard-default-list .kboard-list-header .kboard-sort { *float: right; display: table-cell; text-align: right; } #kboard-default-list .kboard-list-header .kboard-sort select { display: inline; margin: 0; padding: 0; width: auto; min-width: 0; max-width: none; height: 2.6rem; min-height: 0; line-height: 2.6rem; font-size: 1.3rem; color: #666666; border-radius: 0; border: 0.1rem solid #f1f1f1; background: white; vertical-align: middle; box-shadow: none; box-sizing: content-box; text-indent: 0; -webkit-appearance: menulist; -moz-appearance: menulist; appearance: menulist; } #kboard-default-list .kboard-category { float: left; padding-bottom: 1.5rem; width: 100%; } #kboard-default-list .kboard-category.category-mobile { display: none; } #kboard-default-list .kboard-category.category-pc { display: block; } #kboard-default-list .kboard-category select { display: inline; margin: 0 0 0.5rem 0; padding: 0; width: 100%; min-width: 100%; height: 2.8rem; min-height: 0; line-height: 2.8rem; font-size: 1.3rem; color: #666666; border-radius: 0; border: 0.1rem solid #f1f1f1; background: white; vertical-align: middle; box-shadow: none; box-sizing: border-box; text-indent: 0; -webkit-appearance: menulist; -moz-appearance: menulist; appearance: menulist; } #kboard-default-list .kboard-category .kboard-category-list { margin: 0 0 0.5rem 0; padding: 0; list-style: none; border: 0; background-color: #f9f9f9; overflow: hidden; } #kboard-default-list .kboard-category .kboard-category-list li { display: inline-block; *display: inline; zoom: 1; margin: 0; padding: 0 0.5rem; border: 0; list-style: none; } #kboard-default-list .kboard-category .kboard-category-list li::before, #kboard-default-list .kboard-category .kboard-category-list li::after { display: none; } #kboard-default-list .kboard-category .kboard-category-list li a { display: block; padding: 1rem 1rem 0.8rem 1rem; font-size: 1.4rem; border: 0; border-bottom: 0.2rem solid transparent; text-decoration: none; text-shadow: none; box-shadow: none; color: #515151; } #kboard-default-list .kboard-category .kboard-category-list li.kboard-category-selected a { font-weight: bold; border-bottom: 0.2rem solid #545861; color: #545861; } #kboard-default-list .kboard-tree-category-wrap { overflow: hidden; } #kboard-default-list .kboard-tree-category-wrap select { display: inline; margin: 0 0 0.5rem 0; padding: 0; width: 100%; height: 2.8rem; line-height: 2.8rem; font-size: 1.3rem; color: #666666; border-radius: 0; border: 0.1rem solid #f1f1f1; background: white; vertical-align: middle; box-shadow: none; box-sizing: border-box; text-indent: 0; -webkit-appearance: menulist; -moz-appearance: menulist; appearance: menulist; } #kboard-default-list .kboard-tree-category-search .kboard-search-option-wrap.type-select { width: auto; } #kboard-default-list .kboard-tree-category-search .kboard-search-option-wrap.type-tab { width: 100%; } #kboard-default-list .kboard-tree-category { float: left; margin: 0 0 0.5rem 0; padding: 0; width: 100%; list-style: none; border: 0; background-color: #f9f9f9; overflow: hidden; } #kboard-default-list .kboard-tree-category li { display: inline-block; *display: inline; zoom: 1; margin: 0; padding: 0 0.5rem; border: 0; list-style: none; } #kboard-default-list .kboard-tree-category li::before, #kboard-default-list .kboard-tree-category li::after { display: none; } #kboard-default-list .kboard-tree-category li a { display: block; padding: 1rem 1rem 0.8rem 1rem; font-size: 1.4rem; border: 0; border-bottom: 0.2rem solid transparent; text-decoration: none; text-shadow: none; box-shadow: none; color: #515151; } #kboard-default-list .kboard-tree-category li.kboard-category-selected a { font-weight: bold; border-bottom: 0.2rem solid #545861; color: #545861; } #kboard-default-list .kboard-tree-category-search { float: left; width: 100%; } #kboard-default-list .kboard-tree-category-search .kboard-search-option-wrap { margin-right: 0.5rem; float: left; } #kboard-default-list .kboard-list { float: left; width: 100%; background-color: white; } #kboard-default-list .kboard-list .kboard-mobile-contents { display: none; font-size: 1.3rem; color: #999999; } #kboard-default-list .kboard-list .kboard-mobile-contents .contents-item { display: inline; margin: 0; padding: 0; } #kboard-default-list .kboard-list .kboard-mobile-contents .contents-item img.avatar { display: inline; margin: 0; width: 2.4rem; max-width: none; height: 2.4rem; vertical-align: middle; border-radius: 50%; } #kboard-default-list .kboard-list .kboard-mobile-contents .contents-separator { display: inline; margin: 0; padding: 0 0.2rem; color: #bebebe; } #kboard-default-list .kboard-pagination { float: left; padding: 1.5rem 0; width: 100%; } #kboard-default-list .kboard-pagination .kboard-pagination-pages { float: left; margin: 0; padding: 0; width: 100%; list-style: none; text-align: center; border: 0; } #kboard-default-list .kboard-pagination .kboard-pagination-pages li { display: inline-block; *display: inline; zoom: 1; margin: 0; padding: 0 0.1rem; background: none; border: 0; list-style: none; } #kboard-default-list .kboard-pagination .kboard-pagination-pages li a { display: block; margin: 0; padding: 0 1.1rem; height: 2.8rem; line-height: 2.8rem; font-size: 1.4rem; color: #999999; text-decoration: none; border: 0; background-color: #f9f9f9; box-shadow: none; transition-duration: 0.3s; } #kboard-default-list .kboard-pagination .kboard-pagination-pages li:hover a, #kboard-default-list .kboard-pagination .kboard-pagination-pages li.active a { border: 0; color: #545861; background-color: #eaeaea; } #kboard-default-list .kboard-pagination .kboard-pagination-pages li:before { display: none; } #kboard-default-list .kboard-pagination .kboard-pagination-pages li:after { display: none; } #kboard-default-list .kboard-search { float: left; padding-bottom: 1.5rem; width: 100%; text-align: center; } #kboard-default-list .kboard-search select { display: inline; margin: 0; padding: 0 0.5rem; width: 10rem; min-width: 0; max-width: 10rem; height: 2.6rem; min-height: 0; font-size: 1.4rem; color: #666666; border-radius: 0; border: 0.1rem solid #f1f1f1; background: none; background-color: white; line-height: 2.6rem; vertical-align: middle; box-shadow: none; box-sizing: content-box; -webkit-appearance: menulist; -moz-appearance: menulist; appearance: menulist; } #kboard-default-list .kboard-search input { display: inline; margin: 0; padding: 0 0.5rem; width: 20rem; min-width: 0; max-width: 20rem; height: 2.6rem; min-height: 0; font-size: 1.4rem; color: #666666; border-radius: 0; border: 0.1rem solid #f1f1f1; background: none; background-color: white; line-height: 2.6rem; vertical-align: middle; box-shadow: none; box-sizing: content-box; } /* ===== board 스킨 (cnnong) – 간결한 클래스명 ===== */ #kboard-default-list.board { display: block; max-width: var(--max-width); margin: 0 auto; } #kboard-default-list.board .search-top { order: -1; float: none; margin-bottom: 2.4rem; } /* list-header: 총 개수 / 정렬 (thumbnail과 동일 노출) */ #kboard-default-list.board .kboard-list-header { float: none; display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 1.6rem; padding-bottom: 0; font-size: 1.5rem; } #kboard-default-list.board .kboard-list-header .kboard-total-count { display: block; color: var(--color-gray100); } #kboard-default-list.board .kboard-list-header .kboard-total-count .count { color: var(--color-red); font-weight: 500; } #kboard-default-list.board .kboard-list-header .kboard-sort { display: block; text-align: right; } #kboard-default-list.board .kboard-list-header .kboard-sort select.sort-select { height: 4rem; padding: 0 2.4rem 0 1.2rem; font-size: 1.4rem; color: var(--color-gray70); border: 0.1rem solid var(--color-gray40); border-radius: 0.5rem; background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23727272' d='M6 8L1 3h10z'/%3E%3C/svg%3E") no-repeat right 1rem center; background-size: 1rem; -webkit-appearance: none; -moz-appearance: none; appearance: none; cursor: pointer; box-sizing: border-box; } #kboard-default-list.board .search-top .search-inner { display: flex; align-items: stretch; gap: 0.6rem; width: 100%; padding: 1.2rem; border-radius: 0.6rem; background: var(--color-gray20); } #kboard-default-list.board .search-top .search-select { flex: 0 0 22%; max-width: 12rem; margin: 0; padding: 0 2.4rem 0 1.2rem; height: 4.2rem; font-size: 1.5rem; color: var(--color-gray70); border: 0.1rem solid var(--color-gray40); border-radius: 0.5rem; background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23727272' d='M6 8L1 3h10z'/%3E%3C/svg%3E") no-repeat right 1rem center; background-size: 1rem; -webkit-appearance: none; -moz-appearance: none; appearance: none; cursor: pointer; box-sizing:border-box;} #kboard-default-list.board .search-top .search-input-wrap { flex: 1; min-width: 0; display: flex; align-items: center; border: 0.1rem solid var(--color-gray40); border-radius: 0.5rem; background: #fff; overflow: hidden; } #kboard-default-list.board .search-top .search-input { flex: 1; min-width: 0; margin: 0; padding: 0 1rem 0 1.4rem; height: 4rem; font-size: 1.5rem; color: var(--color-gray100); border: 0; background: transparent; } #kboard-default-list.board .search-top .search-input::placeholder { color: var(--color-gray50); } #kboard-default-list.board .search-top .search-submit { flex: 0 0 auto; width: 4.4rem; height: 4rem; margin: 0; padding: 0; border: 0; background: transparent; color: var(--color-gray70); cursor: pointer; display: flex; align-items: center; justify-content: center; } #kboard-default-list.board .search-top .search-submit:hover { color: var(--color-gray100); } #kboard-default-list.board .search-top .search-submit svg { flex-shrink: 0; width: 2rem; height: 2rem; } #kboard-default-list.board .board-list { float: none; background: #fff; border-top: .1rem solid var(--color-gray100); } #kboard-default-list.board .list-items { list-style: none; margin: 0; padding: 0; font-size: 1.4rem; } #kboard-default-list.board .list-item { display: flex; align-items: flex-start; padding: 2.8rem 0; border: 0; border-bottom: 0.1rem solid var(--color-gray30); gap: 1rem; } #kboard-default-list.board .list-item:hover { background: #fff; } #kboard-default-list.board .list-item .list-num { flex: 0 0 7rem; text-align: center; font-size: 1.4rem; color: var(--color-gray70); padding: .2rem 0.8rem; } #kboard-default-list.board .list-item.kboard-list-notice .list-num span { display: inline-flex; align-items: center; justify-content: center; width: auto; height: 2.2rem; padding: 0 0.6rem; font-size: 1.1rem; line-height: 1; color: #fff; background: var(--color-gray100); border-radius: 0.3rem; text-align: center; box-sizing: border-box; } #kboard-default-list.board .list-item .list-title { flex: 1; min-width: 0; text-align: left; display: flex; flex-direction: column; align-items: flex-start; gap: 0.6rem; } #kboard-default-list.board .list-item .list-title a { color: var(--color-gray100); font-size: 1.7rem; font-weight: 600; } #kboard-default-list.board .list-item .list-title a:hover { color: var(--color-primary); } #kboard-default-list.board .list-item .list-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 0 0.45rem; margin: 0; font-size: 1.3rem; line-height: 1.4; color: var(--color-gray70); } #kboard-default-list.board .list-item .list-meta-sep { color: var(--color-gray40); user-select: none; font-weight: 300; } #kboard-default-list.board .list-item .list-meta-date { color: inherit; } #kboard-default-list.board .title-text { display: flex; align-items: center; gap: 0.4rem; min-width: 0; } #kboard-default-list.board .title-text .title-inner { flex: 1; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } #kboard-default-list.board .title-text .title-inner .badge-new { vertical-align: middle; } #kboard-default-list.board .title-text .comments-count { flex-shrink: 0; vertical-align: middle; } #kboard-default-list.board .title-text .list-attach-icon { flex-shrink: 0; display: inline-block; width: 2rem; height: 2rem; background: url(images/ico_attach.svg) no-repeat 50%; background-size: contain; } #kboard-default-list.board .badge-new { display: inline-flex; align-items: center; justify-content: center; height: 2.2rem; padding: 0 0.6rem; font-size: 1.1rem; line-height: 1; color: #fff; background: var(--color-red); font-weight: 500; border-radius: 0.3rem; box-sizing: border-box; } #kboard-default-list.board .list-item .list-date { display: none; } #kboard-default-list.board .pagination { float: none; padding: 2.4rem 0; text-align: center; } #kboard-default-list.board .pagination-pages { list-style: none; margin: 0; padding: 0; display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 0.6rem; font-size: 1.4rem; } #kboard-default-list.board .pagination-pages li { display: inline-flex; align-items: center; justify-content: center; } #kboard-default-list.board .pagination-pages li a { min-width: 3.6rem; height: 3.6rem; line-height: 3.6rem; padding: 0 1rem; color: var(--color-gray70); background: transparent; border-radius: 0.4rem; text-decoration: none; display: inline-flex; align-items: center; justify-content: center; } #kboard-default-list.board .pagination-pages li a:hover { color: var(--color-gray100); background: var(--color-gray30); } #kboard-default-list.board .pagination-pages li.active span { min-width: 3.6rem; height: 3.6rem; line-height: 3.6rem; padding: 0 1rem; color: var(--color-gray100); background: var(--color-gray20); border-radius: 0.4rem; font-weight: 500; text-decoration: underline; text-underline-offset: 0.2em; display: inline-flex; align-items: center; justify-content: center; } #kboard-default-list.board .pagination-pages li.pagination-ellipsis span { color: var(--color-gray50); padding: 0 0.4rem; user-select: none; } #kboard-default-list.board .pagination-pages li.prev-page a, #kboard-default-list.board .pagination-pages li.next-page a { font-weight: 500; } #kboard-default-list.board .board-control { float: none; padding-top: 1.6rem; } #kboard-default-editor { overflow: hidden; } #kboard-default-editor .wp-media-buttons { display: none !important; } #kboard-default-editor [data-mce-name="kboard_media"] { display: none !important; } #kboard-default-editor form { margin: 0; padding: 0; } #kboard-default-editor select { display: inline; margin: 0; padding: 0 0.5rem; font-size: 1.4rem; width: 30%; height: 2.8rem; line-height: 2.8rem; color: #666666; border-radius: 0; border: 0; border-bottom: 0.1rem solid #dcdcdc; box-shadow: none; background: none; background-color: transparent; box-sizing: content-box; vertical-align: middle; text-indent: 0; -webkit-appearance: menulist; -moz-appearance: menulist; appearance: menulist; } #kboard-default-editor input[type=text], #kboard-default-editor input[type=email], #kboard-default-editor input[type=number], #kboard-default-editor input[type=date], #kboard-default-editor input[type=password] { display: inline; margin: 0; padding: 0 0.5rem; width: 30%; height: 2.8rem; line-height: 2.8rem; font-size: 1.4rem; color: #666666; border-radius: 0; border: 0; border-bottom: 0.1rem solid #dcdcdc; box-shadow: none; background: none; background-color: transparent; box-sizing: content-box; vertical-align: middle; } /* 커스텀 체크박스·라디오 (박스 2.4rem, 아이콘 background-size 1.8rem) */ #kboard-default-editor input[type="checkbox"], #kboard-default-editor input[type="radio"] { -webkit-appearance: none; -moz-appearance: none; appearance: none; width: 2.4rem; height: 2.4rem; margin: 0 0.6rem 0 0; padding: 0; flex-shrink: 0; border: 0.1rem solid var(--color-gray30); border-radius: 0.4rem; background-color: #fff; background-image: url(images/ico_check_g.svg); background-repeat: no-repeat; background-position: center; background-size: 1.8rem; cursor: pointer; vertical-align: middle; box-sizing: border-box; } #kboard-default-editor input[type="checkbox"]:checked, #kboard-default-editor input[type="radio"]:checked { background-color: #fff; background-image: url(images/ico_check_b.svg); } #kboard-default-editor input[type="checkbox"]:focus-visible, #kboard-default-editor input[type="radio"]:focus-visible { outline: 0.2rem solid var(--color-link); outline-offset: 0.2rem; } #kboard-default-editor input[type="checkbox"]:disabled, #kboard-default-editor input[type="radio"]:disabled { opacity: 0.45; cursor: not-allowed; } #kboard-default-editor select:hover, #kboard-default-editor input[type=text]:hover, #kboard-default-editor input[type=email]:hover, #kboard-default-editor input[type=number]:hover, #kboard-default-editor input[type=date]:hover, #kboard-default-editor input[type=password]:hover { border-bottom: 0.1rem solid #9e9e9e; } #kboard-default-editor select:focus, #kboard-default-editor input[type=text]:focus, #kboard-default-editor input[type=email]:focus, #kboard-default-editor input[type=number]:focus, #kboard-default-editor input[type=date]:focus, #kboard-default-editor input[type=password]:focus { border-bottom: 0.2rem solid #9e9e9e; } #kboard-default-editor input[type=file] { display: inline; margin: 0; padding: 0; width: 30%; font-size: 1.3rem; color: #666666; border-radius: 0; border: 0; box-shadow: none; background-color: transparent; } #kboard-default-editor .kboard-attr-title input { width: 70%; } #kboard-default-editor .kboard-attr-row { float: left; padding: 0.5rem 0; width: 100%; background-color: white; } #kboard-default-editor .kboard-attr-row .attr-name { display: inline; float: left; margin: 0; padding: 0 1rem 0 1rem; width: 12rem; line-height: 3rem; color: #545861; font-size: 1.4rem; font-weight: bold; } #kboard-default-editor .kboard-attr-row .attr-name img { display: inline; margin: 0; padding: 0; width: auto; max-width: 100%; vertical-align: middle; } #kboard-default-editor .kboard-attr-row .attr-name .attr-required-text { color: red; font-weight: normal; font-size: 1.3rem; } #kboard-default-editor .kboard-attr-row.kboard-attr-content .attr-name { display: none; } #kboard-default-editor .kboard-attr-row .attr-value { margin: 0 0 0 14rem; padding: 0; line-height: 3rem; font-size: 1.4rem; } #kboard-default-editor .kboard-attr-row .attr-value .attr-value-option { display: inline; padding-right: 2rem; width: auto; font-size: 1.4rem; cursor: pointer; } #kboard-default-editor .kboard-attr-row .attr-value .attr-value-option input { cursor: pointer; } #kboard-default-editor .kboard-attr-row .attr-value .attr-value-label { display: inline; padding-right: 0.5rem; width: auto; cursor: pointer; } #kboard-default-editor .kboard-attr-row .attr-value .attr-value-label input { cursor: pointer; } #kboard-default-editor .kboard-attr-row .attr-value .description { margin: 0; color: #666666; } #kboard-default-editor .kboard-attr-row .attr-value .kboard-tree-category-wrap { float: left; width: 100%; } #kboard-default-editor .kboard-attr-row .attr-value .kboard-tree-category-wrap select { clear: both; float: left; margin-bottom: 0.5rem; width: 30%; } #kboard-default-editor .kboard-content { float: left; margin: 0; padding: 0.9rem 0; width: 100%; background-color: white; } #kboard-default-editor .kboard-content .editor-textarea { display: inline; margin: 0; padding: 0.5rem; width: 100%; min-width: 100%; max-width: 100%; height: 25rem; min-height: 0; font-size: 1.4rem; border: 0.1rem solid #dcdcdc; box-shadow: none; background: none; background-color: transparent; box-sizing: border-box; text-indent: 0; } #kboard-default-editor.confirm { margin: 10rem auto; max-width: 59rem; } #kboard-default-editor.confirm input[type=password] { width: 100%; box-sizing: border-box; } /* ===== 글쓰기 (cnnong 톤) ===== */ #kboard-default-editor { max-width: var(--max-width); margin: 0 auto; } #kboard-default-editor .editor-wrap { padding-top: 0.8rem; border-bottom: 0.1rem solid var(--color-gray40); } #kboard-default-editor .kboard-content { float: none; width: 100%; padding: 0; background: #fff; } #kboard-default-editor .kboard-attr-row { float: none; width: 100%; padding: 1.8rem 0; background: #fff; } #kboard-default-editor .kboard-attr-row .attr-name { display: block; float: none; width: auto; margin: 0 0 0.8rem; padding: 0; line-height: 1.4; font-size: 1.5rem; font-weight: 600; color: var(--color-gray100); } #kboard-default-editor .kboard-attr-row .attr-value { margin: 0; line-height: 1.6; font-size: 1.5rem; color: var(--color-gray100); } #kboard-default-editor .kboard-attr-row.kboard-attr-content .attr-name { display: block; } #kboard-default-editor .kboard-attr-row input[type=text], #kboard-default-editor .kboard-attr-row input[type=email], #kboard-default-editor .kboard-attr-row input[type=number], #kboard-default-editor .kboard-attr-row input[type=date], #kboard-default-editor .kboard-attr-row input[type=password] { width: 100%; height: 4.2rem; padding: 0 1.2rem; border: 0.1rem solid var(--color-gray40); border-radius: 0.4rem; line-height: 1; font-size: 1.5rem; color: var(--color-gray100); background: #fff; box-sizing: border-box; } #kboard-default-editor .kboard-attr-row input[type=text]:focus, #kboard-default-editor .kboard-attr-row input[type=email]:focus, #kboard-default-editor .kboard-attr-row input[type=number]:focus, #kboard-default-editor .kboard-attr-row input[type=date]:focus, #kboard-default-editor .kboard-attr-row input[type=password]:focus { border-color: var(--color-gray70); } #kboard-default-editor .kboard-attr-row input[type=file] { width: auto; border: 0; font-size: 1.4rem; color: var(--color-gray70); } #kboard-default-editor .kboard-attr-row select { min-width: 16rem; height: 4rem; padding: 0 3rem 0 1rem; border: 0.1rem solid var(--color-gray40); border-radius: 0.4rem; font-size: 1.4rem; color: var(--color-gray100); background-color: #fff; box-sizing: border-box; } #kboard-default-editor .kboard-attr-row .attr-value .description { margin-top: 0.6rem; font-size: 1.3rem; color: var(--color-gray70); } #kboard-default-editor .kboard-attr-row.kboard-attr-thumbnail, #kboard-default-editor .kboard-attr-row.kboard-attr-attach, #kboard-default-editor .kboard-attr-row.kboard-attr-option { display: grid; grid-template-columns: 10rem 1fr; align-items: center; gap: 0; border-top: 0.1rem solid var(--color-gray30); } #kboard-default-editor .kboard-attr-row.kboard-attr-thumbnail .attr-name, #kboard-default-editor .kboard-attr-row.kboard-attr-attach .attr-name, #kboard-default-editor .kboard-attr-row.kboard-attr-option .attr-name { margin: 0; position: relative; } #kboard-default-editor .kboard-attr-row.kboard-attr-thumbnail .attr-value, #kboard-default-editor .kboard-attr-row.kboard-attr-attach .attr-value, #kboard-default-editor .kboard-attr-row.kboard-attr-option .attr-value { padding-left: 1.6rem; } #kboard-default-editor .kboard-attr-row.kboard-attr-option .attr-value .attr-value-option { display: inline-flex; align-items: center; gap: 0.6rem; margin-right: 1.4rem; padding-right: 0; } #kboard-default-editor .kboard-attr-row.kboard-attr-media .field-name { display: none; } #kboard-default-editor .kboard-attr-row.kboard-attr-media a { display: inline-flex; align-items: center; justify-content: center; min-height: 4rem; padding: 0 1.8rem; border-radius: 0.4rem; background: var(--color-gray100); color: #fff; text-decoration: none; } #kboard-default-editor .btn_wrap { margin-top: 3.2rem; display: flex; justify-content: space-between; align-items: center; gap: 1.2rem; } #kboard-default-editor .btn_wrap > div { display: flex; flex-wrap: wrap; gap: 0.8rem; } /* ===== 게시글 보기 (post-view, 범용 클래스) ===== */ #kboard-default-document.post-view { display: block; max-width: var(--max-width); margin: 0 auto; width: 100%; } #kboard-default-document.post-view .view-header {border-bottom:.1rem solid var(--color-gray100);padding-bottom:1.2rem} #kboard-default-document.post-view .view-title-row { display: flex; flex-direction: row; align-items: flex-start; justify-content: space-between; gap: 0.8rem; flex-wrap: nowrap; margin-bottom: 1.2rem; } #kboard-default-document.post-view .view-title-row .view-title-box { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 0.4rem; } #kboard-default-document.post-view .view-badges { display: flex; align-items: center; gap: 0.4rem; flex-shrink: 0; } #kboard-default-document.post-view .view-badges .badge-notice { display: inline-flex; align-items: center; justify-content: center; height: 2.2rem; padding: 0 0.6rem; font-size: 1.1rem; line-height: 1; color: #fff; background: var(--color-gray100); border-radius: 0.3rem; box-sizing: border-box; } #kboard-default-document.post-view .view-badges .badge-new { display: inline-flex; align-items: center; justify-content: center; height: 2.2rem; padding: 0 0.6rem; font-size: 1.1rem; line-height: 1; color: #fff; background: var(--color-red); font-weight: 500; border-radius: 0.3rem; box-sizing: border-box; } #kboard-default-document.post-view .view-title { margin: 0; width: 100%; min-width: 0; font-size: 2.4rem; font-weight: 500; color: var(--color-gray100); text-align: left; } #kboard-default-document.post-view .view-actions { display: flex; align-items: center; gap: 0.8rem; flex-shrink: 0; align-self: flex-start; } #kboard-default-document.post-view .btn-icon { width: 4.2rem; min-width: 4.2rem; height: 4.2rem; border-radius: 1.2rem; background: var(--color-gray20); border: 0; color: var(--color-gray70); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; transition: background-color 0.3s; } #kboard-default-document.post-view .btn-icon::after{content:'';display:block;width:2rem;height:2rem;background-position:50%;background-repeat:no-repeat;background-size:contain} #kboard-default-document.post-view .btn-icon:hover { background-color:var(--color-gray30)} #kboard-default-document.post-view .btn-icon.btn-print::after{background-image:url(images/ico_printer.svg)} #kboard-default-document.post-view .view-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 0.6rem; font-size: 1.4rem; color: var(--color-gray70); margin-bottom: 1.6rem; } #kboard-default-document.post-view .view-meta .meta-sep { color: var(--color-gray40); user-select: none; } #kboard-default-document.post-view .view-header-divider { height: 0.2rem; background: var(--color-gray100); margin: 0 0 2.4rem; } #kboard-default-document.post-view .view-content { min-height: 12rem; padding:5.2rem 0;} #kboard-default-document.post-view .view-content-title { margin: 0 0 2.4rem; font-size: 2.6rem; font-weight: 500;color: var(--color-gray100); } #kboard-default-document.post-view .attachment-list { display: flex; flex-direction: column; gap: 0.8rem; margin-top:3.8rem;} #kboard-default-document.post-view .attachment-bar { display: flex; align-items: center; gap: 1rem; padding: 1.6rem 1.6rem; background: var(--color-gray10); border-radius: 0.4rem; text-decoration: none; color: var(--color-gray70); transition: background 0.2s; } #kboard-default-document.post-view .attachment-bar:hover{color:var(--color-link);text-decoration:underline;} #kboard-default-document.post-view .attachment-icon { width: 2rem; height: 2rem; background:url(images/ico_attach.svg) no-repeat 50%; background-size: 2rem; flex-shrink: 0; } #kboard-default-document.post-view .attachment-name { flex: 1; min-width: 0; font-size: 1.5rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } #kboard-default-document.post-view .attachment-download { width: 2rem; height: 2rem; background:url(images/ico_download.svg) no-repeat 50%; background-size: 2rem;flex-shrink: 0; } #kboard-default-document.post-view .content-body { word-break: break-word; line-height: 2; font-size: 1.8rem; } #kboard-default-document.post-view .content-body iframe { width: 100%; height: auto; aspect-ratio: 16/9; display: block; vertical-align: top; } #kboard-default-document.post-view .content-body img { width: 100%; height: auto; vertical-align: middle; } #kboard-default-document.post-view .content-body hr { margin: 2rem 0; border: 0; height: 0.1rem; background: var(--color-gray30); } #kboard-default-document.post-view .content-body ul, #kboard-default-document.post-view .content-body ol { margin: 1em 0; padding-left: 2em; } #kboard-default-document.post-view .content-body p { margin: 0 0 1em; } #kboard-default-document.post-view .content-body p:last-child { margin-bottom: 0; } #kboard-default-document.post-view .content-body a[href^='http'] { color: var(--color-link); display:inline-flex;gap:.4rem;align-items:center;} #kboard-default-document.post-view .content-body a[href^='http']::after { content: ''; display: inline-block; width: 2rem; height: 2rem; background: url('images/ico_window.svg') no-repeat center / contain; vertical-align: middle; } #kboard-default-document.post-view .content-body .aligncenter { display: block; margin-left: auto; margin-right: auto; } #kboard-default-document.post-view .content-body .alignleft { float: left; margin-right: 1rem; } #kboard-default-document.post-view .content-body .alignright { float: right; margin-left: 1rem; } #kboard-default-document.post-view .comments-area { width: 100%; margin-top: 3rem; } #kboard-default-document.post-view .prev-next-nav { display: flex; flex-direction: column; gap: 0; margin-top: 9.8rem;} #kboard-default-document.post-view .prev-next-nav .nav-prev, #kboard-default-document.post-view .prev-next-nav .nav-next { padding: 1.8rem 0; border-bottom: 0.1rem solid var(--color-gray30); } #kboard-default-document.post-view .prev-next-nav .nav-next{border-bottom:0;} #kboard-default-document.post-view .prev-next-nav .nav-prev:first-child, #kboard-default-document.post-view .prev-next-nav .nav-next:first-child { padding-top: 0; } #kboard-default-document.post-view .prev-next-nav .nav-link { display: flex; align-items: center; gap: 1rem; text-decoration: none; } #kboard-default-document.post-view .prev-next-nav .nav-link:hover .nav-title { color: var(--color-primary); } #kboard-default-document.post-view .prev-next-nav .nav-label { display: inline-block; font-size: 1.4rem; color: var(--color-gray70); min-width: 4rem; flex-shrink: 0; } #kboard-default-document.post-view .prev-next-nav .nav-title { font-size: 1.5rem; color: var(--color-gray100); min-width: 0; } #kboard-default-document.post-view .cut-strings { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } #kboard-default-document.post-view .view-control { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 1.2rem; margin-top: 2.4rem; padding-top: 2rem; border-top: 0.1rem solid var(--color-gray30); } #kboard-default-document.post-view .view-control-left, #kboard-default-document.post-view .view-control-right { display: flex; flex-wrap: wrap; gap: 0.8rem; } #kboard-default-latest table { display: table; table-layout: fixed; width: 100%; border: 0; border-bottom: 0.1rem solid #f1f1f1; } #kboard-default-latest table tr { padding: 0; border: 0; } #kboard-default-latest table th { padding: 0.5rem 0; height: auto; border: 0; text-align: center; } #kboard-default-latest table td { padding: 0.5rem 0; height: auto; border: 0; border-top: 0.1rem solid #f1f1f1; vertical-align: middle; } #kboard-default-latest table td.kboard-latest-title { text-align: left; } #kboard-default-latest table .kboard-latest-title { padding-left: 0.5rem; font-size: 1.4rem; } #kboard-default-latest table .kboard-latest-title a { text-decoration: none; box-shadow: none; } #kboard-default-latest table .kboard-latest-title img { display: inline; margin: 0; width: auto; height: auto; vertical-align: middle; max-width: 100%; } #kboard-default-latest table .kboard-latest-title .kboard-comments-count { } #kboard-default-latest table .kboard-latest-date { width: 8rem; text-align: center; font-size: 1.4rem; } @media screen and (max-width: 76.8rem) { #kboard-default-list.board .search-top .search-inner { max-width: none; } /* 모바일: 번호 제거, 공지 뱃지+제목, 제목 아래 작성자/날짜, 화살표 li 우측 */ #kboard-default-list.board .list-item { position: relative; display: grid; grid-template-rows: min-content; grid-template-columns: 1fr; gap: 0; align-items: start; padding: 2.2rem 3rem 2.2rem 0; } #kboard-default-list.board .list-item::after { content: ''; position: absolute; right: 1.2rem; top: 50%; transform:translateY(-50%); width: 2rem; height: 2rem; background: url(images/ico_arr_line.svg) no-repeat center / contain; pointer-events: none; z-index: 1; } #kboard-default-list.board .list-item.kboard-list-notice { grid-template-columns: auto 1fr; } #kboard-default-list.board .list-item .list-num { grid-column: 1; grid-row: 1; padding: 0; text-align: left; display: flex; align-items: center; } #kboard-default-list.board .list-item:not(.kboard-list-notice) .list-num { display: none; } #kboard-default-list.board .list-item.kboard-list-notice .list-num span { display: inline-flex; align-items: center; justify-content: center; height: 2.2rem; padding: 0 0.6rem; font-size: 1.1rem; line-height: 1; color: #fff; background: var(--color-gray100); border-radius: 0.3rem; margin-right: 0.4rem; box-sizing: border-box; } #kboard-default-list.board .list-item .list-title { grid-column: 2; grid-row: 1; min-width: 0; min-height: min-content; display: flex; flex-direction: column; align-items: flex-start; align-self: start; gap: 0.5rem; padding-right: 3rem; box-sizing: border-box; } #kboard-default-list.board .list-item:not(.kboard-list-notice) .list-title { grid-column: 1; } #kboard-default-list.board .list-item .list-title a { font-size: 1.6rem; font-weight: 500; line-height: 1.5; color: var(--color-gray100); display: block; width: 100%; min-width: 0; min-height: min-content; overflow: visible; } #kboard-default-list.board .list-item .list-title a::after { display: none; } #kboard-default-list.board .list-item .title-text { display: flex; flex-wrap: nowrap; align-items: flex-start; gap: 0.4rem 0.6rem; min-width: 0; min-height: min-content; width: 100%; overflow: visible; } #kboard-default-list.board .list-item .title-text .title-inner { flex: 1 1 0; min-width: 0; min-height: min-content; overflow: visible; white-space: normal; text-overflow: clip; word-break: keep-all; overflow-wrap: anywhere; line-height: 1.5; } #kboard-default-list.board .list-item .title-text .list-attach-icon, #kboard-default-list.board .list-item .title-text .comments-count { flex: 0 0 auto; margin-top: 0.1rem; } #kboard-default-list.board .list-item .badge-new { display: inline-flex; align-items: center; justify-content: center; height: 2.2rem; padding: 0 0.6rem; font-size: 1.1rem; line-height: 1; border-radius: 0.3rem; margin-right: 0.4rem; box-sizing: border-box; flex-shrink: 0; } #kboard-default-list.board .list-item .list-meta { font-size: 1.3rem; } #kboard-default-list .kboard-category.category-mobile { display: block; } #kboard-default-list .kboard-category.category-pc { display: none; } #kboard-default-list .kboard-tree-category-search .kboard-search-option-wrap.select { width: 100%; } #kboard-default-list .kboard-pagination .kboard-pagination-pages li { display: none; } #kboard-default-list .kboard-pagination .kboard-pagination-pages li.first-page, #kboard-default-list .kboard-pagination .kboard-pagination-pages li.last-page, #kboard-default-list .kboard-pagination .kboard-pagination-pages li.prev-page, #kboard-default-list .kboard-pagination .kboard-pagination-pages li.next-page, #kboard-default-list .kboard-pagination .kboard-pagination-pages li.active { display: inline-block; } #kboard-default-list .kboard-pagination .kboard-pagination-pages li.prev-page a, #kboard-default-list .kboard-pagination .kboard-pagination-pages li.next-page a { padding: 0 1.8rem; } #kboard-default-list.board .pagination-pages li { display: inline-flex; } #kboard-default-list .kboard-search select { float: left; margin-right: 1%; width: 29%; min-width: 29%; height: 2.8rem; line-height: 2.8rem; box-sizing: border-box; } #kboard-default-list .kboard-search input { float: left; margin-right: 1%; width: 49%; min-width: 49%; height: 2.8rem; line-height: 2.8rem; box-sizing: border-box; } #kboard-default-list .kboard-search button { float: left; width: 20%; min-width: 20%; box-sizing: border-box; } #kboard-default-editor select, #kboard-default-editor input[type=text], #kboard-default-editor input[type=email], #kboard-default-editor input[type=number], #kboard-default-editor input[type=date], #kboard-default-editor input[type=password], #kboard-default-editor input[type=file] { width: 100% !important; box-sizing: border-box; } #kboard-default-editor .kboard-attr-row { padding: 1rem 0; } #kboard-default-editor .kboard-attr-row .attr-name { padding: 0; width: 100%; font-size: 1.4rem; } #kboard-default-editor .kboard-attr-row .attr-value { margin: 0; } #kboard-default-editor .kboard-attr-row .attr-value .kboard-tree-category-wrap select { margin-bottom: 1rem; width: 100%; } #kboard-default-editor.confirm { max-width: none; } #kboard-default-editor { padding: 3rem 0; } #kboard-default-editor .kboard-attr-row.kboard-attr-thumbnail, #kboard-default-editor .kboard-attr-row.kboard-attr-attach, #kboard-default-editor .kboard-attr-row.kboard-attr-option { display: block; } #kboard-default-editor .kboard-attr-row.kboard-attr-thumbnail .attr-name, #kboard-default-editor .kboard-attr-row.kboard-attr-attach .attr-name, #kboard-default-editor .kboard-attr-row.kboard-attr-option .attr-name { width: 100%; margin-bottom: 1rem; } #kboard-default-editor .kboard-attr-row.kboard-attr-thumbnail .attr-name::after, #kboard-default-editor .kboard-attr-row.kboard-attr-attach .attr-name::after, #kboard-default-editor .kboard-attr-row.kboard-attr-option .attr-name::after { display: none; } #kboard-default-editor .kboard-attr-row.kboard-attr-thumbnail .attr-value, #kboard-default-editor .kboard-attr-row.kboard-attr-attach .attr-value, #kboard-default-editor .kboard-attr-row.kboard-attr-option .attr-value { padding-left: 0; } #kboard-default-editor .btn_wrap { margin-top: 3rem; flex-direction: column; align-items: flex-start; } #kboard-default-document.post-view .view-title { font-size: 1.8rem; } #kboard-default-document.post-view .view-content-title { font-size: 2rem; } #kboard-default-document.post-view .view-control { flex-direction: column; align-items: flex-start; } }