@charset "utf-8";
/* Modern Board Design - Responsive & Clean UI */

/* Board Reset */
.board {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans KR", "Malgun Gothic", "Apple SD Gothic Neo", sans-serif;
    line-height: 1.6;
    font-size: 14px;
    color: #2c3e50;
}

.board .inputText,
.board textarea,
.board select {
    border: 1px solid #dcdfe6;
    border-radius: 6px;
    padding: 8px 12px;
    font-size: 14px;
    transition: all 0.2s ease;
    background-color: #ffffff;
}

.board .inputText:focus,
.board textarea:focus,
.board select:focus {
    border-color: #3498db;
    outline: none;
    box-shadow: 0 0 0 3px rgba(52, 152, 219, 0.1);
}

.board label {
    display: inline-block;
    margin: 0;
    cursor: pointer;
    font-weight: 500;
    color: #606266;
}

.board img {
    border: 0;
    max-width: 100%;
    height: auto;
}

.board .document_popup_menu,
.board .comment_popup_menu {
    text-align: right;
    font-size: 13px;
    margin: 15px 0;
}

.board .document_popup_menu a,
.board .comment_popup_menu a {
    text-decoration: none;
    color: #3498db;
    transition: color 0.2s ease;
}

.board .document_popup_menu a:hover,
.board .comment_popup_menu a:hover {
    color: #2980b9;
}

.board .hr {
    display: none;
}


/* Board Header */
.boardHeader *{ margin:0 0 20px 0; padding:0;}
.boardHeader a{ text-decoration:none;}
.boardHeader a:hover,
.boardHeader a:active,
.boardHeader a:focus{ text-decoration:underline;} 
.boardHeader .boardTitle{ letter-spacing:-.1em; margin-bottom:10px; border-bottom:3px solid; *zoom:1; background-repeat:no-repeat; background-position:left 8px;}
.boardHeader .boardTitle:after{ content:""; display:block; clear:both;}
.boardHeader .boardTitleText{ font-size:18px; float:left; clear:both; margin-bottom:-3px; padding:5px 15px 5px 5px; border-bottom:3px solid; background-repeat:no-repeat; background-position:right bottom;}
.boardHeader .boardTitleText a{ text-decoration:none;}
.boardHeader .boardTitleText em{ font-style:normal; font-weight:normal;}
.boardHeader .boardDescription{ padding:7px 15px; -moz-border-radius:3px; -webkit-border-radius:3px; position:relative;}

/* Board Information */
.boardInformation{width:100%; padding:5px 0; font-size:1em; line-height:normal; *zoom:1;}
.boardInformation *{ margin:0; padding:0;}
.boardInformation a{ text-decoration:none;}
.boardInformation a:hover,
.boardInformation a:active,
.boardInformation a:focus{ text-decoration:underline;} 
.boardInformation:after{ content:""; display:block; float:none; clear:both;}
.boardInformation ul{ overflow:hidden;}
.boardInformation .infoSum{ float:left; font-size:16px; font-weight:bold;}
.boardInformation .infoView{ float:right; margin-right:5px;}
.boardInformation .infoView li{ position:relative; float:left; margin-left:3px; display:inline;}
.boardInformation .infoView li.icon a{ display:block; float:left; width:23px; height:23px; overflow:hidden; background-repeat:no-repeat;}
.boardInformation .infoView li.icon a span{ position:absolute; width:0; height:0; overflow:hidden; visibility:hidden; font-size:0; line-height:0;}
.boardInformation .infoView li.icon2 a{ display:block; float:left; width:20px; height:20px; overflow:hidden; background-repeat:no-repeat; border:none;}
.boardInformation .infoView li.icon2 a span{ position:absolute; width:0; height:0; overflow:hidden; visibility:hidden; font-size:0; line-height:0;}
.boardInformation .infoView li.listTypeClassic a{ background-position:0 0;}
.boardInformation .infoView li.listTypeClassic.active a{ background-position:0 -23px;}
.boardInformation .infoView li.listTypeZine a{ background-position:-23px 0;}
.boardInformation .infoView li.listTypeZine.active a{ background-position:-23px -23px;}
.boardInformation .infoView li.listTypeGallery a{ background-position:-46px 0;}
.boardInformation .infoView li.listTypeGallery.active a{ background-position:-46px -23px;}
.boardInformation .infoView li.setup{ margin:0 7px;}
.boardInformation .infoView li.setup a{ display:block; float:left; width:43px; height:23px; background-repeat:no-repeat;}
.boardInformation .infoView li.setup a span{ position:absolute; width:0; height:0; overflow:hidden; visibility:hidden; font-size:0; line-height:0;}

/* Board List Form */
.boardListForm{ margin:0; line-height:normal;}
.boardListForm *{ margin:0; padding:0;}
.boardListForm fieldset{ border:0; clear:both;}
.boardListForm fieldset:after{ content:""; display:block; float:none; clear:both;}
.boardListForm legend{ position:absolute; width:0; height:0; overflow:hidden; font:0/0 Sans-serif; visibility:hidden;}
.boardListForm em,
.boardListForm strong{ font-style:normal;}
.boardListForm strong.trackback { color:#423CC4; }

/* Board List */
.boardList {
    border: 0;
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    background-color: #ffffff;
	margin-top:10px;
}

.boardList a {
    text-decoration: none;
    color: #2c3e50;
    transition: color 0.2s ease;
}

.boardList a:hover,
.boardList a:active,
.boardList a:focus {
    color: #3498db;
}

.boardList .inputCheck {
    width: 16px;
    height: 16px;
    cursor: pointer;
}

.boardList .jumpTo {
    float: left;
    display: flex;
    align-items: center;
    gap: 8px;
}

.boardList .jumpTo * {
    vertical-align: middle;
}

.boardList .jumpTo select {
    height: 32px;
    font-size: 13px;
    padding: 6px 12px;
}

.boardList .jumpTo button {
    width: auto;
    min-width: 32px;
    height: 32px;
    line-height: 32px;
    border: 1px solid #dcdfe6;
    border-radius: 6px;
    margin: 0;
    padding: 0 12px;
    text-align: center;
    background: #ffffff;
    font-size: 13px;
    cursor: pointer;
    overflow: visible;
    transition: all 0.2s ease;
}

.boardList .jumpTo button:hover {
    background-color: #f5f7fa;
    border-color: #3498db;
}

.boardList .meta {
    position: relative;
    overflow: hidden;
    margin: 0 0 8px 0;
    padding: 0;
    list-style: none;
    white-space: nowrap;
}

.boardList .meta li {
    position: relative;
    display: inline-block;
    padding: 0 8px 0 0;
    margin-right: 8px;
    border-right: 1px solid #e4e7ed;
    font-size: 12px;
    color: #909399;
}

.boardList .meta li:last-child {
    border-right: none;
}

.boardList .meta li.author {
    font-size: 13px;
    font-weight: 500;
    color: #606266;
}

.boardList .meta li.date {
    font-size: 12px;
}

.boardList .meta li em {
    font-size: 12px;
}

.boardList .replyNum,
.boardList .trackbackNum {
    font-size: 12px;
    color: #3498db;
    font-weight: 600;
}

.boardList th {
    border: 0;
    border-bottom: 2px solid #e4e7ed;
    padding: 12px 10px;
    white-space: nowrap;
    text-align: center;
    line-height: normal;
    font-weight: 600;
    background: linear-gradient(to bottom, #f8f9fa, #f0f2f5);
    color: #606266;
    font-size: 13px;
}

.boardList th.title {
    width: 50%;
    text-align: left;
}

.boardList th a .sort {
    vertical-align: middle;
    margin: 0 5px;
}

.boardList td {
    border: 0;
    border-bottom: 1px solid #e4e7ed;
    padding: 12px 10px;
    text-align: center;
    line-height: 1.6;
    vertical-align: middle;
    transition: background-color 0.2s ease;
}

.boardList tr:hover td {
    background-color: #f8f9fa;
}

.boardList td {
    word-break: break-word;
}

.boardList td.notice {
    font-size: 13px;
    font-weight: 600;
    color: #e74c3c;
}

.boardList td.num {
    font-size: 12px;
    color: #909399;
}

.boardList td.check {
    font-size: 13px;
}

.boardList td.title {
    white-space: normal;
    text-align: left;
    font-size: 14px;
}

.boardList td.title img {
    vertical-align: middle;
    margin: 0 4px;
}

.boardList td.title .author {
    font-size: 12px;
    color: #909399;
    margin-left: 8px;
}

.boardList td.author {
    font-size: 13px;
    text-align: left;
    font-weight: 500;
}

.boardList td.replies {
    font-size: 12px;
    color: #3498db;
    font-weight: 600;
}

.boardList td.reading {
    font-size: 12px;
    color: #909399;
}

.boardList td.recommend {
    font-size: 12px;
    font-weight: 600;
    color: #27ae60;
}

.boardList td.date {
    font-size: 12px;
    color: #909399;
}

.boardList td.summary {
    text-align: left;
    border-top: 1px dashed #e4e7ed;
    white-space: normal;
    padding: 15px 10px;
}

.boardList td.summary .thumb {
    display: block;
    float: left;
    padding: 4px;
    border: 1px solid #e4e7ed;
    border-radius: 6px;
    margin-right: 15px;
    background-color: #ffffff;
}

.boardList td.summary .thumb img {
    display: block;
    border-radius: 4px;
}

.boardList td.lastReply {
    text-align: left;
    font-size: 13px;
}

.boardList td .notice {
    font-size: 12px;
    padding: 2px 8px;
    margin-right: 8px;
    background-color: #e74c3c;
    color: #ffffff;
    border-radius: 3px;
    font-weight: 600;
}

.boardList td .category {
    font-weight: 500;
    font-size: 12px;
    padding: 2px 8px;
    margin-right: 8px;
    background-color: #3498db;
    color: #ffffff;
    border-radius: 3px;
}

.boardList td .replyAnchor {
    position: relative;
    font-size: 12px;
    color: #3498db;
    font-weight: 600;
}

.boardList td .by {
    font-size: 12px;
    color: #909399;
}

.boardList td .wait_approve {
    font-size: 13px;
    font-weight: 600;
    color: #e74c3c;
}




/* WebZine Style */
.boardList.webZine tr.bg1 td,
.boardList.webZine tr.bg2 td {
    padding: 20px 10px;
}

.boardList.webZine td.title p.title {
    margin-bottom: 10px;
}

.boardList.webZine td.title p.title .category {
    font-size: 13px;
}

.boardList.webZine td.title p.title a.title {
    font-weight: 600;
    font-size: 16px;
}

.boardList.webZine td.title p.summary {
    line-height: 1.8;
    margin-bottom: 10px;
    color: #606266;
}

.boardList.webZine td.title p.summary a {
    text-decoration: none;
}

.boardList.webZine td.title .thumb {
    float: right;
    clear: right;
    border: 1px solid #e4e7ed;
    border-radius: 6px;
    padding: 8px;
    margin-left: 20px;
}

.boardList.webZine td.title .by {
    font-size: 12px;
    color: #909399;
}

/* Thumbnail List */
.thumbList {
    border-bottom: 1px solid #e4e7ed;
    border-top: 0;
    margin-right: -20px;
    padding: 20px 0 0 0;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 20px;
}

.thumbList:after {
    content: "";
    display: block;
    clear: both;
}

.thumbList li {
    position: relative;
    margin: 0;
    padding: 0;
    list-style: none;
    overflow: hidden;
    border-radius: 8px;
    background-color: #ffffff;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease;
}

.thumbList li:hover {
    transform: translateY(-4px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
}

.thumbList li .num {
    color: #909399;
    font-size: 11px;
    margin-bottom: 8px;
    padding: 0 10px;
}

.thumbList li .thumb {
    position: relative;
    overflow: hidden;
    border-radius: 8px 8px 0 0;
    background-color: #f5f7fa;
}

.thumbList li .thumb a {
    display: block;
    position: relative;
    text-decoration: none !important;
}

.thumbList li .thumb a * {
    cursor: pointer;
}

.thumbList li .thumb a img {
    display: block;
    width: 100%;
    height: auto;
    transition: transform 0.3s ease;
}

.thumbList li:hover .thumb a img {
    transform: scale(1.05);
}

.thumbList li .thumb a .text {
    position: absolute;
    left: 0;
    top: 50%;
    margin-top: -0.8em;
    display: block;
    width: 100%;
    text-align: center;
    font-size: 2em;
    font-weight: 700;
    white-space: nowrap;
    letter-spacing: -1px;
    color: #2c3e50;
}

.thumbList li .thumb a .category {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    overflow: hidden;
    padding: 8px 10px;
    white-space: nowrap;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.7), transparent);
    font-weight: 500;
    font-size: 12px;
    color: #ffffff;
}

.thumbList li .thumb a .noPhoto {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    text-align: center;
    min-height: 150px;
    color: #909399;
}

.thumbList li .title {
    font-weight: 600;
    clear: both;
    white-space: nowrap;
    margin: 10px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.thumbList li .title input {
    width: 16px;
    height: 16px;
    vertical-align: middle;
    white-space: nowrap;
}

.thumbList li .summary {
    line-height: 1.6;
    margin: 0 10px 10px;
    color: #606266;
    font-size: 13px;
}

.thumbList li .summary a {
    text-decoration: none;
}

.thumbList li .meta {
    position: relative;
    white-space: normal;
    text-align: left;
    overflow: visible;
    padding: 10px;
    border-top: 1px solid #e4e7ed;
}

.thumbList li .meta li {
    float: none;
    display: inline;
    margin: 0;
    white-space: nowrap;
    box-shadow: none;
    transform: none;
}

.thumbList .lastReply {
    text-align: left;
    font-size: 12px;
    padding: 10px;
}

.thumbList .lastReply a {
    display: block;
}

.thumbList .by {
    font-size: 12px;
    color: #909399;
}



/* Search Form */
.boardSearchForm {
    position: relative;
    margin: 20px 0;
    padding: 20px;
    line-height: normal;
    background-color: #f8f9fa;
    border-radius: 8px;
}

.boardSearchForm * {
    margin: 0;
    padding: 0;
}

.boardSearchForm fieldset {
    border: 0;
    clear: both;
    text-align: center;
    position: relative;
}

.boardSearchForm fieldset:after {
    content: "";
    display: block;
    float: none;
    clear: both;
}

.boardSearchForm fieldset * {
    vertical-align: middle;
}

.boardSearchForm legend {
    position: absolute;
    width: 0;
    height: 0;
    overflow: hidden;
    font: 0/0 Sans-serif;
    visibility: hidden;
}

/* 검색어 입력창 */
.boardSearchForm .inputText {
    width: 250px;
    height: 38px;
    padding: 8px 12px;
    font-size: 14px;
    border: 1px solid #dcdfe6;
    border-radius: 6px;
    margin-right: 5px;
    line-height: normal;
    box-sizing: border-box;
    vertical-align: middle;
}

/* 검색 대상 선택 */
.boardSearchForm select {
    height: 38px;
    padding: 8px 12px;
    font-size: 14px;
    border: 1px solid #dcdfe6;
    border-radius: 6px;
    margin-right: 5px;
    background-color: #ffffff;
    box-sizing: border-box;
    vertical-align: middle;
}

/* 검색 버튼 */
.boardSearchForm .buttonOfficial {
    display: inline-block;
    margin-right: 10px;
    vertical-align: middle;
}

.boardSearchForm .buttonOfficial button,
.boardSearchForm button[type="submit"],
.boardSearchForm fieldset button {
    position: relative !important;
    height: 38px !important;
    padding: 8px 20px !important;
    font-size: 14px !important;
    font-family: inherit !important;
    border: 1px solid #3498db !important;
    border-color: #3498db #3498db #3498db #3498db !important;
    border-radius: 6px !important;
    background: #3498db !important;
    background-color: #3498db !important;
    background-image: none !important;
    background-repeat: no-repeat !important;
    color: #ffffff !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    font-weight: 500 !important;
    box-sizing: border-box !important;
    line-height: normal !important;
    vertical-align: middle !important;
    text-align: center !important;
    text-shadow: none !important;
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    filter: progid:DXImageTransform.Microsoft.gradient(enabled=false) !important;
    filter: none !important;
    margin: 0 !important;
    overflow: visible !important;
    z-index: 1 !important;
	
}

.boardSearchForm .buttonOfficial button::before,
.boardSearchForm .buttonOfficial button::after,
.boardSearchForm button[type="submit"]::before,
.boardSearchForm button[type="submit"]::after {
    display: none !important;
    content: none !important;
}

.boardSearchForm .buttonOfficial button:hover,
.boardSearchForm .buttonOfficial button:focus,
.boardSearchForm button[type="submit"]:hover,
.boardSearchForm button[type="submit"]:focus,
.boardSearchForm fieldset button:hover,
.boardSearchForm fieldset button:focus {
    background: #2980b9 !important;
    background-color: #2980b9 !important;
    background-image: none !important;
    border: 1px solid #2980b9 !important;
    border-color: #2980b9 #2980b9 #2980b9 #2980b9 !important;
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
}

/* 우측 링크들 (Contributors, Tag List) - 원본 스타일 */
.boardSearchForm .infoEtc {
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
}

.boardSearchForm .infoEtc li {
    display: inline;
}

.boardSearchForm .infoEtc li a {
    display: inline-block;
    height: 11px;
    background-repeat: no-repeat;
    overflow: hidden;
}

.boardSearchForm .infoEtc li a span {
    position: absolute;
    width: 0;
    height: 0;
    overflow: hidden;
    font-size: 0;
    line-height: 0;
    visibility: hidden;
}

.boardSearchForm .infoEtc li.contributors a {
    width: 12px;
    background-position: 0 0;
}

.boardSearchForm .infoEtc li.tag a {
    width: 42px;
    background-position: -11px 0;
}

/* Board Read */
.boardReadHeader {
    border-radius: 8px;
    overflow: hidden;
    background-color: #ffffff;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    margin-bottom: 20px;
}

.boardReadHeader a {
    text-decoration: none;
    color: #2c3e50;
    transition: color 0.2s ease;
}

.boardReadHeader a:hover,
.boardReadHeader a:active,
.boardReadHeader a:focus {
    color: #3498db;
}

.boardReadHeader:after {
    content: "";
    display: block;
    float: none;
    clear: both;
}

.boardReadHeader * {
    margin: 0;
    padding: 0;
}

.boardReadHeader .titleArea {
    padding: 20px;
    border-bottom: 1px solid #e4e7ed;
    background: linear-gradient(to right, #f8f9fa, #ffffff);
}

.boardReadHeader .titleArea:after {
    content: "";
    display: block;
    clear: both;
}

.boardReadHeader .titleArea .title {
    float: left;
    font-size: 20px;
    font-weight: 700;
    margin-right: 15px;
    color: #2c3e50;
}

.boardReadHeader .titleArea .category {
    float: left;
    padding: 4px 12px;
    margin-top: 2px;
    font-size: 13px;
    background-color: #3498db;
    color: #ffffff;
    border-radius: 4px;
    font-weight: 500;
}

.boardReadHeader .titleArea .sum {
    float: right;
    white-space: nowrap;
    margin-top: 4px;
}

.boardReadHeader .titleArea .sum .read,
.boardReadHeader .titleArea .sum .vote {
    font-size: 13px;
    margin-right: 8px;
    color: #909399;
}

.boardReadHeader .titleArea .sum .num {
    font-size: 12px;
    color: #606266;
    font-weight: 600;
}

.boardReadHeader .titleArea .sum .date {
    padding-left: 15px;
    margin-left: 15px;
    font-size: 12px;
    border-left: 1px solid #e4e7ed;
    color: #909399;
}

.boardReadHeader .authorArea {
    padding: 15px 20px;
}

.boardReadHeader .authorArea:after {
    content: "";
    display: block;
    clear: both;
}

.boardReadHeader .authorArea .author {
    float: left;
    margin-right: 15px;
    font-weight: 600;
    color: #2c3e50;
}

.boardReadHeader .authorArea .ipAddress {
    float: left;
    font-size: 12px;
    margin-top: 2px;
    color: #909399;
}

.boardReadHeader .authorArea .permaLink {
    float: right;
    font-size: 12px;
    margin-top: 2px;
    color: #909399;
}

.boardReadBody {
    overflow: hidden;
    padding: 30px;
    background-color: #ffffff;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    margin-bottom: 20px;
    line-height: 1.8;
}

.boardReadBody .xe_content {
    overflow: hidden;
    font-size: 15px;
    color: #2c3e50;
}

.boardReadBody .xe_content a {
    color: #3498db;
    text-decoration: underline;
}

.boardReadBody .xe_content a:hover {
    color: #2980b9;
}

.boardReadBody.between img {
    margin-bottom: 20px;
}

.boardReadFooter .memberSignature {
    border: 1px solid #e4e7ed;
    padding: 15px;
    margin: 20px 0;
    overflow: hidden;
    clear: both;
    border-radius: 8px;
    background-color: #f8f9fa;
}

.boardReadFooter .memberSignature img.profile {
    margin: 0 15px 0 0;
    border: 1px solid #e4e7ed;
    border-radius: 50%;
}

.boardReadFooter .tag {
    margin: 20px 0;
    clear: both;
    padding: 15px;
    background-color: #f8f9fa;
    border-radius: 6px;
}

.boardReadFooter .tag * {
    display: inline;
    margin: 0;
    padding: 0;
    font-size: 13px;
    vertical-align: middle;
}

.boardReadFooter .tag dt {
    margin-right: 10px;
    font-weight: 600;
    color: #606266;
}

.boardReadFooter .tag dd {
    margin-right: 8px;
}

.boardReadFooter .tag dd a {
    display: inline-block;
    padding: 4px 10px;
    background-color: #3498db;
    color: #ffffff;
    border-radius: 4px;
    text-decoration: none;
    margin: 2px;
    transition: all 0.2s ease;
}

.boardReadFooter .tag dd a:hover {
    background-color: #2980b9;
}

.boardReadFooter .trackbackURL {
    margin: 20px 0;
    clear: both;
    padding: 15px;
    background-color: #f8f9fa;
    border-radius: 6px;
}

.boardReadFooter .trackbackURL * {
    display: inline;
    margin: 0;
    padding: 0;
}

.boardReadFooter .trackbackURL dt {
    margin-right: 10px;
    font-size: 13px;
    font-weight: 600;
    color: #606266;
}

.boardReadFooter .trackbackURL dd {
    font-size: 12px;
    text-decoration: none;
    color: #909399;
}

.boardReadFooter .trackbackURL a {
    text-decoration: none;
    color: #3498db;
}

.boardReadFooter .trackbackURL a:hover,
.boardReadFooter .trackbackURL a:active,
.boardReadFooter .trackbackURL a:focus {
    text-decoration: underline;
}

/* 게시글 읽기 페이지의 네비게이션 - 우측 정렬 */
.boardRead .boardNavigation {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 10px;
    margin: 20px 0;
}

.boardRead .boardNavigation .btn,
.boardRead .boardNavigation input[type="submit"],
.boardRead .boardNavigation button {
    position: relative !important;
    height: 38px !important;
    padding: 8px 20px !important;
    font-size: 14px !important;
    font-family: inherit !important;
    border: 1px solid !important;
    border-radius: 6px !important;
    background-image: none !important;
    color: #ffffff !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    font-weight: 500 !important;
    box-sizing: border-box !important;
    line-height: normal !important;
    vertical-align: middle !important;
    text-align: center !important;
    text-shadow: none !important;
    box-shadow: none !important;
    margin: 0 !important;
    overflow: visible !important;
}

/* 목록 버튼 - 회색 */
.boardRead .boardNavigation .btn:first-child,
.boardRead .boardNavigation button:first-child {
    background: #8e8e93 !important;
    border-color: #8e8e93 !important;
}

.boardRead .boardNavigation .btn:first-child:hover,
.boardRead .boardNavigation button:first-child:hover {
    background: #6e6e73 !important;
    border-color: #6e6e73 !important;
}

/* 수정 버튼 - 파란색 */
.boardRead .boardNavigation .btn:nth-child(2),
.boardRead .boardNavigation button:nth-child(2) {
    background: #5856d6 !important;
    border-color: #5856d6 !important;
}

.boardRead .boardNavigation .btn:nth-child(2):hover,
.boardRead .boardNavigation button:nth-child(2):hover {
    background: #4745b8 !important;
    border-color: #4745b8 !important;
}

/* 삭제 버튼 - 진한 파란색 */
.boardRead .boardNavigation .btn:nth-child(3),
.boardRead .boardNavigation button:nth-child(3) {
    background: #4745b8 !important;
    border-color: #4745b8 !important;
}

.boardRead .boardNavigation .btn:nth-child(3):hover,
.boardRead .boardNavigation button:nth-child(3):hover {
    background: #3634a0 !important;
    border-color: #3634a0 !important;
}

/* 의사 요소 제거 */
.boardRead .boardNavigation .btn::before,
.boardRead .boardNavigation .btn::after,
.boardRead .boardNavigation button::before,
.boardRead .boardNavigation button::after {
    display: none !important;
    content: none !important;
}


/* Feedback List */
.feedbackList{ overflow:hidden; padding-top:15px; margin-bottom:10px; border-top:1px solid;}
.feedbackList .feedbackHeader{ float:left; font-weight:bold; margin:1em 1em .5em 0; font-size:16px;}
.feedbackList .feedbackHeader em{ font-style:normal;}
.feedbackList .trackbackURL{ position:relative; top:1.5em; float:left; font-size:9px;}
.feedbackList .trackbackURL a{ text-decoration:none;}
.feedbackList .trackbackURL a:hover,
.feedbackList .trackbackURL a:active,
.feedbackList .trackbackURL a:focus{ text-decoration:underline;}
.feedbackList .trackbackList,
.feedbackList .replyList{ clear:both;}

.feedbackList .item{ position:relative; border-top:1px dashed; *zoom:1;}
.feedbackList .item .indent{ position:relative; *zoom:1;}
.feedbackList .item .indent:after{ content:""; display:block; clear:both;}
.feedbackList .item.itemReply .indent{ padding-left:15px; background-repeat:no-repeat; background-position:0 1.2em;}

.feedbackList .item .header{ margin:0 0 5px 0;}
.feedbackList .item .header a{ font-size:12px; text-decoration:none;}
.feedbackList .item .header a:hover,
.feedbackList .item .header a:active,
.feedbackList .item .header a:focus{ text-decoration:underline;}

.feedbackList .item .itemContent { position:relative; padding:1em 0 1em 120px; *zoom:1; z-index:1;}
.feedbackList .item .itemContent:after{ content:""; display:block; clear:both;}
.feedbackList .item .itemContent .xe_content{ width:auto !important;}
.feedbackList .item .itemContent .xe_content *{ margin-top:0;}
.feedbackList .item .itemContent .xe_content a { text-decoration:underline; }
.feedbackList .item .itemContent .option{ position:relative; margin:1em 0; padding:0; list-style:none; white-space:nowrap; overflow:hidden; *zoom:1; float:right;}
.feedbackList .item .itemContent .option li{ position:relative; left:-1px; display:inline; padding:0 0 0 5px; background-repeat:no-repeat; background-position:left center; font-size:11px;}
.feedbackList .item .itemContent .option li.wouldYou{ background:none;}
.feedbackList .item .itemContent .option li a{ text-decoration:none;}
.feedbackList .item .itemContent .option li a:hover,
.feedbackList .item .itemContent .option li a:active,
.feedbackList .item .itemContent .option li a:focus{ text-decoration:underline;} 
.feedbackList .item .itemContent .delete{ position:relative; display:inline-block; width:13px; height:13px; background-repeat:no-repeat; background-position:center center; vertical-align:middle;}
.feedbackList .item .itemContent .delete span{ position:absolute; width:0; height:0; font-size:0; line-height:0; overflow:hidden; visibility:hidden;}
.feedbackList .item.itemOnly{ border-top:0;}

.feedbackList .item .itemAside{ position:relative; float:left; width:100px; margin-right:-100px; padding:1em 0 0 0; *zoom:1; text-align:left; z-index:2;}
.feedbackList .item .itemAside a{ text-decoration:none;}
.feedbackList .item .itemAside a:hover,
.feedbackList .item .itemAside a:active,
.feedbackList .item .itemAside a:focus{ text-decoration:underline;}
.feedbackList .item .itemAside img.profile{ display:block; border:1px solid; margin-bottom:5px;}
.feedbackList .item .itemAside .meta{ font-size:9px; margin:0 0 5px 0; white-space:nowrap;}
.feedbackList .item .itemAside .vote{ margin:0; *zoom:1; overflow:hidden;}
.feedbackList .item .itemAside .vote:after{ content:""; display:block; clear:both;}
.feedbackList .item .itemAside .vote *{margin:0; padding:0;}
.feedbackList .item .itemAside .vote dt{ position:relative; left:-5px; float:left; width:10px; height:9px; margin-right:2px; padding-left:5px; background-image:url(../img/common/iconLove.gif); background-repeat:no-repeat; overflow:hidden; border-left:1px solid #e5e5e5;}
.feedbackList .item .itemAside .vote dt.love{ background-position:5px 1px;}
.feedbackList .item .itemAside .vote dt.hate{ background-position:5px -19px;}
.feedbackList .item .itemAside .vote dt span{ position:absolute; width:0; height:0; line-height:0; font-size:0; overflow:hidden; visibility:hidden;}
.feedbackList .item .itemAside .vote dd{ position:relative; left:-5px; float:left; margin-right:5px; font-size:9px; font-weight:bold;}

.feedbackList .item .secretMessage{ margin:0; padding:1em 3em;}
.feedbackList .item .secretMessage p{ text-align:center; margin:1em 0; font-size:18px;}
.feedbackList .item .secretMessage dl{ text-align:center; margin:1em 0;}
.feedbackList .item .secretMessage dt{ font-weight:bold; display:inline;}
.feedbackList .item .secretMessage dd{ margin:0; display:inline;}
.feedbackList .item .secretMessage dd .inputText{ padding:3px 4px; height:15px; vertical-align:middle; margin-right:5px;}

/* Attached File */
.attachedFile { position:relative; float:left; width:100%;}
.attachedFile *{ margin:0; padding:0; font-size:11px; vertical-align:middle;}
.attachedFile dt img{ margin-right:10px;}
.attachedFile dt .fileToggle{ border:0; padding:0; overflow:visible; cursor:pointer; font-size:11px; background:none; vertical-align:middle;}
.attachedFile dd{ position:relative; margin-right:5px; display:none; margin-top:5px; padding-left:40px;}
.attachedFile.open dd{ display:block;}
.attachedFile ul.files { position:relative; margin:0 0 1em 0; padding:0; clear:both; list-style:none; text-align:left;}
.attachedFile ul.files *{ display:inline-block; *display:inline; padding:0; margin:0; font-size:11px;}
.attachedFile ul.files li{ position:relative; margin:0 10px 0 0;}
.attachedFile ul.files a{ position:relative; background-repeat:no-repeat; background-position:left center; *zoom:1; text-decoration:none !important;}
.attachedFile ul.files a .bubble{ display:none; position:absolute; top:-20px; left:0; padding:2px 5px; z-index:100; white-space:nowrap;}
.attachedFile ul.files a:hover .bubble,
.attachedFile ul.files a:active .bubble,
.attachedFile ul.files a:focus .bubble{ display:block;}

/* Board Write */
.boardWrite fieldset {
    border: 0;
    background-color: #ffffff;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    margin-bottom: 20px;
}

.boardWrite legend {
    position: absolute;
    width: 0;
    height: 0;
    overflow: hidden;
    font: 0/0 Sans-serif;
    visibility: hidden;
}

.boardWrite .boardWriteHeader {
    margin: 0 0 20px 0;
}

.boardWrite .boardWriteHeader * {
    vertical-align: middle;
}

.boardWrite .boardWriteHeader select {
    font-size: 14px;
    vertical-align: top;
    height: 38px;
    padding: 8px 12px;
}

.boardWrite .boardWriteHeader .inputText {
    width: 100%;
    max-width: 600px;
    padding: 10px 12px;
    font-size: 14px;
}

.boardWrite .boardWriteHeader dl.title dd {
    white-space: nowrap;
}

.boardWrite .boardWriteHeader dl.title dd .inputText {
    width: 100%;
}

.boardWrite .tag {
    clear: both;
    margin-bottom: 20px;
}

.boardWrite .tag:after {
    content: "";
    display: block;
    float: none;
    clear: both;
}

.boardWrite .tag .inputText {
    float: left;
    width: 100%;
    max-width: 500px;
    padding: 10px 12px;
    margin-right: 10px;
    font-size: 14px;
}

.boardWrite .tag p {
    float: left;
    margin: 10px 0;
    color: #909399;
}

/* Editor */
.board .boardEditor {
    border: 1px solid #e4e7ed;
    margin-bottom: 20px;
    border-radius: 8px;
    background-color: #ffffff;
    overflow: hidden;
}

.board .boardEditor .commentEditor {
    margin: 20px;
    position: relative;
}

/* Editor Option */
.board .editorOption {
    margin: 20px 0;
    text-align: left;
    padding: 15px;
    background-color: #f8f9fa;
    border-radius: 6px;
}

.board .editorOption * {
    vertical-align: middle;
}

.board .editorOption select {
    margin-right: 10px;
    font-size: 14px;
    padding: 8px 12px;
}

.board .editorOption label {
    margin-right: 15px;
    font-weight: 500;
}

.board .editorOption .inputText {
    padding: 8px 12px;
    height: auto;
    margin: 0 10px 8px 0;
    font-size: 14px;
    vertical-align: middle;
}

.board .editorOption .inputText.userName {
    width: 150px;
}

.board .editorOption .inputText.userPw {
    width: 120px;
}

.board .editorOption .inputText.emailAddress {
    width: 200px;
}

.board .editorOption .inputText.homePage {
    width: 200px;
}


/* Editor */
.board .boardEditor{ border:1px solid; margin-bottom:20px; -moz-border-radius:5px; -webkit-border-radius:5px; }
.board .boardEditor .commentEditor{ margin:15px; *zoom:1; position:relative;}

/* Editor Option */
.board .editorOption{ margin:1em 0; text-align:left;}
.board .editorOption *{ vertical-align:middle;}
.board .editorOption select{ margin-right:10px; font-size:12px;}
.board .editorOption label{ margin-right:10px;}
.board .editorOption .inputText{ padding:3px 4px; height:15px; margin:0 10px 5px 0; font-size:12px; vertical-align:middle;}
.board .editorOption .inputText.userName{ width:100px;}
.board .editorOption .inputText.userPw{ width:50px; font:11px Tahoma;}
.board .editorOption .inputText.emailAddress{ width:140px; font:11px Tahoma;}
.board .editorOption .inputText.homePage{ width:140px; font:11px Tahoma;}


/* Require Password */
.board .requirePassword {
    text-align: center;
    padding: 60px 20px;
}

.board .requirePassword fieldset {
    border: 0;
    padding: 0;
}

.board .requirePassword h3 {
    font-size: 20px;
    margin-bottom: 20px;
    color: #2c3e50;
}

.board .requirePassword .inputText {
    height: auto;
    width: 250px;
    padding: 12px;
    font-size: 14px;
}


/* Extra Vars Table */
.extraVarsList {
    width: 100%;
    border: 0;
    border-bottom: 1px solid #e4e7ed;
    margin-bottom: 20px;
    border-collapse: separate;
    border-spacing: 0;
}

.extraVarsList caption {
    text-align: right;
    padding: 10px 0;
    color: #909399;
}

.extraVarsList em {
    font-style: normal;
    font-weight: normal;
}

.extraVarsList th,
.extraVarsList td {
    border: 0;
    padding: 12px 15px;
    text-align: left;
    border-top: 1px solid #e4e7ed;
    vertical-align: top;
}

.extraVarsList th {
    white-space: nowrap;
    font-weight: 600;
    background-color: #f8f9fa;
    color: #606266;
}

.extraVarsList td {
    width: 100%;
    word-break: break-all;
}

.extraVarsList td p {
    display: block;
    margin: 8px 0;
}

.extraVarsList td * {
    vertical-align: middle;
}

.extraVarsList td li {
    display: inline;
    margin-right: 15px;
}

.extraVarsList td .inputText {
    padding: 8px 12px;
    font-size: 14px;
    width: 96%;
    display: block;
}

.extraVarsList td .inputNum {
    padding: 8px 12px;
    font-size: 14px;
    width: 100px;
    border: 1px solid #dcdfe6;
    border-radius: 6px;
}

.extraVarsList td .inputCheck {
    width: 16px;
    height: 16px;
    margin-right: 8px;
    cursor: pointer;
}

.extraVarsList td select {
    font-size: 14px;
    padding: 8px 12px;
}

.extraVarsList td textarea {
    padding: 10px 12px;
    font-size: 14px;
    width: 96%;
    display: block;
    overflow: auto;
    min-height: 100px;
    line-height: 1.6;
}

/* Tag Cloud */
.tagCloud{ padding:3em 0; border-top:1px solid; border-bottom:1px solid;}
.tagCloud *{ margin:0; padding:0;}
.tagCloud ul{ text-align:justify;}
.tagCloud li{ display:inline; list-style:none; margin:0 5px; }
.tagCloud li.rank1 a{ font-weight:bold; font-size:24px;}
.tagCloud li.rank2 a{ font-weight:bold; font-size:18px;}
.tagCloud li.rank3 a{ font-weight:bold; font-size:14px;}
.tagCloud li.rank4 a{ font-size:12px;}
.tagCloud li.rank5 a{ font-size:11px;}

/* Extra Vars Form Styles */
.extraVarsList tr td input,
.extraVarsList tr td textarea {
    font-size: 14px;
}

.extraVarsList tr td .text {
    border: 1px solid #dcdfe6;
    padding: 8px 12px;
    margin-right: 10px;
    width: 90%;
    border-radius: 6px;
}

.extraVarsList tr td .email_address {
    border: 1px solid #dcdfe6;
    padding: 8px 12px;
    margin-right: 10px;
    width: 300px;
    border-radius: 6px;
}

.extraVarsList tr td .homepage {
    border: 1px solid #dcdfe6;
    padding: 8px 12px;
    margin-right: 10px;
    width: 300px;
    border-radius: 6px;
}

.extraVarsList tr td .tel {
    border: 1px solid #dcdfe6;
    padding: 8px 12px;
    margin-right: 10px;
    width: 80px;
    border-radius: 6px;
}

.extraVarsList tr td .textarea {
    border: 1px solid #dcdfe6;
    padding: 10px 12px;
    margin-right: 10px;
    width: 90%;
    height: 120px;
    border-radius: 6px;
}

.extraVarsList tr td ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.extraVarsList tr td ul li {
    display: block;
    margin-right: 10px;
    margin-bottom: 8px;
}

.extraVarsList tr td ul li input {
    margin-right: 8px;
    vertical-align: middle;
}

.extraVarsList tr td .date {
    border: 1px solid #dcdfe6;
    padding: 8px 12px;
    margin-right: 10px;
    width: 150px;
    border-radius: 6px;
}

.extraVarsList tr td .address {
    border: 1px solid #dcdfe6;
    padding: 8px 12px;
    margin-right: 10px;
    width: 400px;
    border-radius: 6px;
}

.hidden { visibility:hidden;}
#table_checkbox {border-bottom:1px solid; border-color:#cccccc;;} 
#table_checkbox td{width:auto;} 
#table_checkbox .checkbox_th{border-right:1px solid; border-color:#cccccc; padding: 3px 2px;} 
#table_checkbox .checkbox_td{border-right:1px solid; border-color:#cccccc; padding: 3px 2px; vertical-align:top;} 
.underline {border-bottom: 1px dashed green;}



/* Board Navigation */
.boardNavigation {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 20px 0;
    gap: 20px;
}

.boardNavigation .buttonLeft {
    flex: 0 0 auto;
    display: flex;
    gap: 10px;
}

.boardNavigation .pagination {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 5px;
}

.boardNavigation .buttonRight {
    flex: 0 0 auto;
    display: flex;
    gap: 10px;
}

/* 버튼 공통 스타일 */
.boardNavigation .buttonOfficial,
.boardNavigation .buttonOfficial a,
.boardNavigation .buttonLeft a,
.boardNavigation .buttonRight a {
    position: relative !important;
    display: inline-block !important;
    height: 38px !important;
    padding: 8px 20px !important;
    font-size: 14px !important;
    font-family: inherit !important;
    border: 1px solid !important;
    border-radius: 6px !important;
    background-image: none !important;
    color: #ffffff !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    font-weight: 500 !important;
    box-sizing: border-box !important;
    line-height: 22px !important;
    vertical-align: middle !important;
    text-align: center !important;
    text-shadow: none !important;
    box-shadow: none !important;
    margin: 0 !important;
    overflow: visible !important;
    text-decoration: none !important;
}

/* 목록 버튼 - 회색 */
.boardNavigation .buttonLeft a {
    background: #8e8e93 !important;
    border-color: #8e8e93 !important;
}

.boardNavigation .buttonLeft a:hover,
.boardNavigation .buttonLeft a:focus {
    background: #6e6e73 !important;
    border-color: #6e6e73 !important;
}

/* 쓰기, 게시물관리 버튼 - 파란색 */
.boardNavigation .buttonRight a {
    background: #5856d6 !important;
    border-color: #5856d6 !important;
}

.boardNavigation .buttonRight a:hover,
.boardNavigation .buttonRight a:focus {
    background: #4745b8 !important;
    border-color: #4745b8 !important;
}

/* 페이지네이션 스타일 */
.boardNavigation .pagination a,
.boardNavigation .pagination strong,
.boardNavigation .pagination span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 32px;
    height: 32px;
    padding: 0 8px;
    font-size: 14px;
    color: #333;
    text-decoration: none;
    border: 1px solid #ddd;
    border-radius: 4px;
    background: #fff;
    transition: all 0.2s ease;
}

.boardNavigation .pagination a:hover {
    background: #f5f5f5;
    border-color: #5856d6;
    color: #5856d6;
}

.boardNavigation .pagination strong {
    background: #5856d6;
    border-color: #5856d6;
    color: #fff;
    font-weight: 600;
}

.boardNavigation .pagination span.disabled {
    opacity: 0.3;
    cursor: not-allowed;
}

/* 이전/다음/처음/끝 버튼 아이콘 */
.boardNavigation .pagination .prev::before {
    content: "‹";
    font-size: 18px;
}

.boardNavigation .pagination .next::before {
    content: "›";
    font-size: 18px;
}

.boardNavigation .pagination .prevEnd::before {
    content: "«";
    font-size: 18px;
}

.boardNavigation .pagination .nextEnd::before {
    content: "»";
    font-size: 18px;
}

/* 의사 요소 제거 */
.boardNavigation .buttonOfficial::before,
.boardNavigation .buttonOfficial::after,
.boardNavigation .buttonLeft a::before,
.boardNavigation .buttonLeft a::after,
.boardNavigation .buttonRight a::before,
.boardNavigation .buttonRight a::after {
    display: none !important;
    content: none !important;
}





/* Responsive Design */
@media screen and (max-width: 768px) {
    .board {
        font-size: 13px;
    }
    
    .boardHeader .boardTitleText {
        font-size: 20px;
    }
    
    .boardList td,
    .boardList th {
        padding: 8px 6px;
        font-size: 12px;
    }
    
    .boardList .meta li {
        font-size: 11px;
    }
    
    .thumbList {
        grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
        gap: 15px;
    }
    
    .boardReadHeader .titleArea .title {
        font-size: 18px;
        float: none;
        margin-bottom: 10px;
    }
    
    .boardReadHeader .titleArea .sum {
        float: none;
        margin-top: 10px;
    }
    
    .boardReadBody {
        padding: 20px;
    }
    
    .feedbackList .item .itemContent {
        padding-left: 0;
    }
    
    .feedbackList .item .itemAside {
        float: none;
        width: 100%;
        margin-right: 0;
        margin-bottom: 15px;
        display: flex;
        align-items: center;
        gap: 15px;
    }
    
    .feedbackList .item .itemAside img.profile {
        width: 50px;
        height: 50px;
    }
}

@media screen and (max-width: 480px) {
    .board {
        font-size: 12px;
    }
    
    .boardHeader .boardTitleText {
        font-size: 18px;
    }
    
    .boardInformation {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }
    
    .boardInformation .infoSum {
        font-size: 16px;
    }
    
    .boardList td.title {
        font-size: 13px;
    }
    
    .thumbList {
        grid-template-columns: 1fr;
    }
    
    .boardReadBody {
        padding: 15px;
    }
    
    .boardWrite .boardWriteHeader .inputText {
        max-width: 100%;
    }
    
    .boardSearchForm .inputText {
        width: 100%;
        margin-bottom: 10px;
    }
}