@charset "UTF-8";

body {
    margin: 0;
    padding: 0;
}

.content-wrap{
	padding: 0 40px;
	height: calc(100% - 5.875rem);
	color: #454545;
}

.content-title-wrap{
	padding: 1rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.content-btn-wrap{
	width: 10%;
}

.content-title-text{
	font-size: 1.25rem;
	font-weight: 700;
}

.sidebar #sidebarToggle::after{
	content: "\f021" !important;
}

.fa-bar-chart::before{
	content: "\f080" !important;
}

.fa-krw::before{
	content: "\f159" !important;
}

.fa-picture-o::before{
	content: "\f03e" !important;
}

.fa-pie-chart::before{
	content: "\f200" !important;
}

.fa-pie-trello::before{
	content: "\f181" !important;
}

.navbar-img{
	height: 40px;
}

.modal, .modal .btn {
	font-size: 0.85rem;
	font-weight: 700;
}

.modal-title {
	font-weight: 700;
}

.modal-dialog{
	position: relative !important;
    top: 15% !important;
    z-index: 1000 !important;
}

.modal-content{
    width: 100%;
    height: 100%;
}

.popup { 
	display: none;/*hide setting*/
    position: absolute;
    left: 50%;
    top: 50%;
    width: 600px; /*가로길이 설정은 여기서*/
    margin-left: -300px; /*width의 반만큼 음수로*/
    height: 600px; /*세로길이 설정은 여기서*/
    margin-top: -300px; /*height의 반만큼 음수로*/
    z-index: 1000;

    /*style*/
    background: white;
    border: 1px solid dimgrey;
    box-shadow: 0 0 2px 1px rgb(0 0 0 / 30%);
    padding: 0;
}

.btn.reg {
	width: 100%;
    margin-right: 0;
    margin-bottom: 0;
    font-weight: 700;
}

.statistics-header{
	display: flex;
	justify-content: space-between;
}

.statistics-header-container{
	width: 100%;
}

.grid-table {
    display: grid;
    grid-template-columns: auto auto auto auto;
    gap: 10px; /* 셀 간격 설정 */
    align-items: center;
}
.grid-table div {
    padding: 5px;
}
.grid-table label {
    white-space: nowrap;
}
.button-group {
    grid-column: span 2; /* 두 열을 차지 */
    display: flex;
    justify-content: flex-end;
    gap: 10px;
}

.ql-snow .ql-picker.ql-size .ql-picker-label::before,
.ql-snow .ql-picker.ql-size .ql-picker-item::before {
    content: attr(data-value);
}

.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="dotum"]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="dotum"]::before {
    content: "돋움";
    font-family: 'dotum', sans-serif;
}

.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="gullim"]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="gullim"]::before {
    content: "굴림";
    font-family: 'gullim', sans-serif;
}

.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="batang"]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="batang"]::before {
    content: "바탕";
    font-family: 'batang', serif;
}

.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="NanumGothic"]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="NanumGothic"]::before {
    content: "나눔고딕";
    font-family: 'Nanum Gothic', sans-serif;
}

.ql-font-dotum {
    font-family: 'dotum', sans-serif;
}
.ql-font-gullim {
    font-family: 'gullim', serif;
}
.ql-font-batang {
    font-family: 'batang', serif;
}
.ql-font-NanumGothic {
    font-family: 'Nanum Gothic', sans-serif;
}

th {
    text-align: center;
    vertical-align: middle;
    padding: 8px;
}

.tab-header {
    /*font-size: 1.2rem;*/
    font-weight: 600;
}

.tab-link {
    color: #6c757d; /* 회색 */
    text-decoration: none;
    padding: 0 8px;
}

.tab-link.active {
    color: #000; /* 진한 색 */
    border-bottom: 2px solid #000;
}

.separator {
    color: #999;
    padding: 0 5px;
}


/* 공지사항/문의사항 공통 테이블 스타일 */
/* 양옆 테두리 없애기 */
.info-table {
    border-collapse: collapse;
    width: 100%;
    border-left: none !important;
    border-right: none !important;
}
/* 모든 td, th는 Bootstrap 기본 테두리 유지 */
.info-table td,
.info-table th {
    border: 1px solid #ddd !important;
    border-left-width: 1px;  /*좌우 테두리 유지*/ 
    border-right-width: 1px;
    padding: 12px 16px;
}

/* 첫 행 위쪽 굵고 진한 선 */
.info-table tr:first-child td {
    border-top: 2px solid #ccc !important;
}
/* 마지막 행 아래쪽 굵고 진한 선 */
.info-table tr:last-child td {
    border-bottom: 2px solid #ccc !important;
}
/* 첫 번째 열 셀 왼쪽 테두리 제거 */
.info-table td:first-child,
.info-table th:first-child {
    border-left: none !important;
}
/* 마지막 열 셀 오른쪽 테두리 제거 */
.info-table td:last-child,
.info-table th:last-child {
    border-right: none !important;
}

/* 공통 헤더 셀 스타일 */
.info-table .info-header {
    background-color: #f8f8f8;
    font-weight: 500;
    color: #222222;
    text-align: center;
    vertical-align: middle; /* 세로 가운데 정렬 */
}

/* 공통 바디 셀 스타일 */
.info-table .info-body {
    vertical-align: middle; /* 세로 가운데 정렬 */
}