
:root {
    --font-14: 14px;
    --font-15: 15px;
    --font-16: 16px;
    --font-18: 18px;

    --color-black: #222222;

    --radius4:4px;
    --radius10:10px;
    --radius80:80px;
}


/* 공통 */
.radius20 { -webkit-border-radius:20px; -moz-border-radius:20px; border-radius:20px; }

/* 게시판 */
#board {}

#board .board_head { display:flex; justify-content:space-between; margin-bottom:15px; }

/* 검색 */
#search { }
#search .list { }
#search .list ul { margin: 0; padding: 0; }
#search .list li { list-style: none; float: left; margin: 0 0 0 5px; background-color: #f2f2f2; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; }
#search .list li.select { width:130px; }
#search .list li.select select { width: 100%; height: 36px; margin: 0; padding: 0 10px; font-weight: normal; font-size: var(--font-14); line-height: 36px; color: #999999; letter-spacing: -0.5px; border: none; background-color: transparent; outline: none; }
#search .list li.input { width: 200px; }
#search .list li.input input { width: 100%; height: 36px; margin: 0; padding: 0 14px; font-weight: normal; font-size: var(--font-14); line-height: 36px; color: #999999; letter-spacing: -0.5px; border: none; background-color: transparent; outline: none; }
#search .list li.input input::-webkit-input-placeholder { font-size: var(--font-14); color:#999999; }
#search .list li.input input:moz-placeholder { font-size: var(--font-14); color:#999999; }
#search .list li.input input::-moz-placeholder { font-size: var(--font-14); color:#999999; }
#search .list li.input input:-ms-input-placeholder { font-size: var(--font-14); color:#999999; }
#search .list li.submit { width: 80px; background-color: #444444; }
#search .list li.submit a,
#search .list li.submit a:hover { display: block; font-weight: normal; font-size: var(--font-14); line-height: 36px; color: #f1f1f1; letter-spacing: -0.5px; text-align: center; }
#search .list li.submit input { width: 100%; padding: 0; background-color: #444444; font-size: var(--font-14); line-height: 36px; color: #f1f1f1; letter-spacing: -0.5px; text-align: center; border:none; outline:none; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; }
#search .list:after{ content:""; display:block; clear:both; /* height:0; visibility:hidden; */}


/* 버튼 */
.board_btn { display: inline-block; min-width: 80px; background-color: #444444; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; }
.board_btn a,
.board_btn a:hover { display: block; padding: 0 25px; font-size: 14px; line-height: 36px; color: #f1f1f1; text-align: center; }



/* 게시판 - 일반리스트 */
#board > .list { border-top: 3px solid #444444; }
#board > .list ul { margin:0; padding:0; }
#board > .list li { display:table; list-style:none; width:100%; border-bottom: 1px solid #d9d9d9; }
#board > .list li .th { display:table-cell; vertical-align:middle; position: relative; padding: 16px 0; font-size: var(--font-16); font-weight: bold; line-height: 28px; color: #000000; letter-spacing: -0.5px; text-align: center; background-color: #f9f9f9; }
#board > .list li .td { display:table-cell; vertical-align:middle; padding: 16px 0; font-size: var(--font-16); font-weight: normal; line-height: 28px; color: #888888; letter-spacing: -0.5px; text-align: center; }
#board > .list li .col_no { width:100px; }
#board > .list li .col_subject { }
#board > .list li .col_date { width:140px; }
#board > .list li .col_writer { width:180px; }
#board > .list:after{ content:""; display:block; clear:both; /* height:0; visibility:hidden; */}

#board > .list .list_head { }
#board > .list .list_body { }
#board > .list .list_body ul { margin:0; padding:0; }
#board > .list .list_body li { list-style:none; background-color:#fff; }
#board > .list .list_body li .col_subject { padding-left: 10px; font-size: var(--font-15); line-height: 28px; color: #444444; text-align: left; display: block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; }
#board > .list .list_body li .col_subject a,
#board > .list .list_body li .col_subject a:hover { font-size: var(--font-15); line-height: 28px; color: #555555; display: block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; }
#board > .list .list_body li .col_subject .dash_re { display: inline-block; width: 18px; height: 18px; background: url("../images/board/reply.svg") no-repeat; background-size: cover; }
#board > .list .list_body li .col_subject .secret { display:inline-block; vertical-align:middle; width:16px; height:16px; margin-bottom: 3px; background:url("../images/board/icon_lock.svg") no-repeat center; background-size:cover; }
#board > .list .list_body li .col_subject .count { display:inline-block; vertical-align:middle; padding: 0 10px 1px; margin-bottom: 3px; margin-left: 5px; font-size: 11px; line-height: 16px; text-align: center; color: #fff; background-color: #aaa; -webkit-border-radius:8px; -moz-border-radius:8px; border-radius:8px; }

#board > .list .list_body:after{ content:""; display:block; clear:both; /* height:0; visibility:hidden; */}


/* 이벤트 게시판 리스트 */
#board > .event_list { display: flex; flex-direction: column; gap: 60px; }
#board > .event_list .event_head { display: flex; flex-direction: column; width:1200px; margin:0 auto; gap:36px; }
#board > .event_list .event_tab { display:flex; flex-direction:row; gap:12px; }
#board > .event_list .event_tab .item { }
#board > .event_list .event_tab .item a { display: block; padding:10px 28px; font-family: 'Pretendard', sans-serif; font-size: 16px; font-weight: 400; color: #777777; border-bottom:1px solid #D9D9D9; }
#board > .event_list .event_tab .item a:hover { font-weight: 500; color: #202020; border-bottom:1px solid #202020; }
#board > .event_list .event_tab .item.v1 a,
#board > .event_list .event_tab .item.v1 a:hover { font-weight: 500; color: #202020; border-bottom:1px solid #202020; }

#board > .event_list .event_notice { display:flex; flex-direction:row; flex-wrap:wrap; gap:20px 1.6%; }
#board > .event_list .event_notice .item { cursor:pointer; position: relative; display: flex; flex-direction: column; gap: 12px; width:49.2%; min-height: 160px; padding: 32px; background-color: #F5F6F8; -webkit-border-radius:16px; -moz-border-radius:16px; border-radius:16px; }
#board > .event_list .event_notice .item:nth-child(1) { background-color: #058B80; }
#board > .event_list .event_notice .item:nth-child(2) { background-color: #33AD69; }

#board > .event_list .event_notice .item .item_title { font-family: 'Pretendard', sans-serif; font-size: 20px; font-weight: 700; line-height: 150%; color: #202020; }
#board > .event_list .event_notice .item .item_date { font-family: 'Pretendard', sans-serif; font-size: 14px; font-weight: 400; line-height: 150%; color: #777777; }
#board > .event_list .event_notice .item .item_icon { position:absolute; width: 80px; right:20px; bottom:20px; }
#board > .event_list .event_notice .item .item_icon img { width:100%; }


#board > .event_list .event_notice .item:nth-child(1) .item_title { font-weight: 600; color: #fff; }
#board > .event_list .event_notice .item:nth-child(1) .item_date { color: #fff; }
#board > .event_list .event_notice .item:nth-child(2) .item_title { font-weight: 600; color: #fff; }
#board > .event_list .event_notice .item:nth-child(2) .item_date { color: #fff; }


#board > .event_list .event_bottom { padding: 80px 0; background-color:#F5F6F8; }
#board > .event_list .event_bottom .event_inner { display:flex; flex-direction:row; flex-wrap:wrap; gap:20px 1.6%; width:1200px; margin:0 auto; }

#board > .event_list .event_bottom .event_inner .item { cursor:pointer; position: relative; display: flex; flex-direction: column; gap: 12px; width:49.2%; min-height: 160px; padding: 32px; background-color: #ffffff; -webkit-border-radius:16px; -moz-border-radius:16px; border-radius:16px;-webkit-box-show:6px 6px 8px rgba(0, 0, 0, 0.05); -moz-box-shadow:6px 6px 8px rgba(0, 0, 0, 0.05); box-shadow:6px 6px 8px rgba(0, 0, 0, 0.05); }
#board > .event_list .event_bottom .event_inner .item .item_title { font-family: 'Pretendard', sans-serif; font-size: 20px; font-weight: 700; line-height: 150%; color: #202020; }
#board > .event_list .event_bottom .event_inner .item .item_date { font-family: 'Pretendard', sans-serif; font-size: 14px; font-weight: 400; line-height: 150%; color: #777777; }
#board > .event_list .event_bottom .event_inner .item .item_icon { position:absolute; width: 80px; right:20px; bottom:20px; }
#board > .event_list .event_bottom .event_inner .item .item_icon img { width:100%; }



/* 게시판 - 보기 */
#board > .view { width:1200px; margin:0 auto; }
#board > .view .subject { position: relative; margin: 0 30px 20px; font-size: 20px; font-weight: bold; line-height: 28px; color: #252525; }
#board > .view .subject .info { position: absolute; right: 0; top: 0; }
#board > .view .subject .info ul { margin: 0; padding: 0; }
#board > .view .subject .info li { position: relative; list-style: none; float: left; margin-left: 5px; font-size: 15px; line-height: 28px; color: #bbbbbb; }
#board > .view .subject .info li:before { content: "/ "; font-size: 15px; line-height: 28px; color: #bbbbbb; }
#board > .view .subject .info li:first-child { margin: 0; }
#board > .view .subject .info li:first-child:before { display: none; }
#board > .view .subject .info:after{ content:""; display:block; clear:both; /* height:0; visibility:hidden; */}

#board > .view .option { border-top: 3px solid #444444; } 
#board > .view .option ul { margin: 0; padding: 0; }
#board > .view .option li { list-style: none; padding: 16px 0; border-bottom: 1px solid #d9d9d9; font-size: 0; }
#board > .view .option .col { display: inline-block; vertical-align: middle; position: relative; width: 50%; }
#board > .view .option .col .title { position: absolute; left: 30px; top: 0; padding-left: 28px; font-size: 15px; line-height: 28px; color: #333333; }
#board > .view .option .col .title:after { content: ""; position: absolute; width: 12px; height: 9px; left: 0; top: 50%; margin-top: -5px; background: url("../images/board/dot.png") no-repeat; }
#board > .view .option .col .info { margin: 0 0 0 165px; font-size: 15px; line-height: 28px; color: #888888; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; }
#board > .view .option:after{ content:""; display:block; clear:both; /* height:0; visibility:hidden; */}

#board > .view .content { margin: 40px 30px 80px; font-size: 16px; font-weight: normal; line-height: 34px; color: #888888; } 

#board > .view .file_add { margin: 0 0 20px; padding: 30px; background-color: #f2f2f2; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; }
#board > .view .file_add .title { position: relative; padding-left: 28px; font-size: 16px; line-height: 28px; color: #333333; }
#board > .view .file_add .title:after { content: ""; position: absolute; width: 12px; height: 9px; left: 0; top: 50%; margin-top: -5px; background: url("../images/board/dot.png") no-repeat; }
#board > .view .file_add .list { margin: 0 28px; }
#board > .view .file_add .list ul { margin: 0; padding: 0; }
#board > .view .file_add .list li { list-style: none; margin: 10px 0 0; font-size: 16px; line-height: 20px; color: #888888; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; }
#board > .view .file_add .list li a,
#board > .view .file_add .list li a:hover { font-size: 16px; line-height: 20px; color: #888888; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; }
#board > .view .file_add .list:after{ content:""; display:block; clear:both; /* height:0; visibility:hidden; */}


#board > .view .reple { position: relative; margin: 0 0 30px; padding: 30px; background-color: #f6f7fa; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; font-size: 0; }
#board > .view .reple .textarea { margin: 0 280px 0 0; }
#board > .view .reple .textarea textarea { width:100%; height: 60px; padding: 10px 20px; font-size: var(--font-14); font-weight: normal; line-height: 24px; color: #888888; border:1px solid #e4e4e4; -webkit-border-radius:6px; -moz-border-radius:6px; border-radius:6px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; resize:none; outline:none; }
#board > .view .reple .textarea textarea::-webkit-input-placeholder { font-size: var(--font-14); color:#888888; }
#board > .view .reple .textarea textarea:moz-placeholder { font-size: var(--font-14); color:#888888; }
#board > .view .reple .textarea textarea::-moz-placeholder { font-size: var(--font-14); color:#888888; }
#board > .view .reple .textarea textarea:-ms-input-placeholder { font-size: var(--font-14); color:#888888; }
#board > .view .reple .submit { cursor: pointer; position:absolute; width: 270px; height:60px; right:30px; top:30px; font-size: var(--font-14); font-weight: normal; line-height: 60px; color: #ffffff; text-align: center; background-color: #0066ff; -webkit-border-radius:6px; -moz-border-radius:6px; border-radius:6px; }

#board > .view .reple .reple_list {}
#board > .view .reple .reple_list ul { margin:0; padding:0; }
#board > .view .reple .reple_list li { position: relative; list-style:none; padding: 20px 30px; border-top:1px solid #d5d5d5; -webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; -o-transition: all 0.5s ease; transition:all 0.5s ease; }
#board > .view .reple .reple_list li:first-child { border-top:none; }
#board > .view .reple .reple_list li:last-child { padding: 20px 30px 0; }
#board > .view .reple .reple_list .name { display:inline-block; font-size: var(--font-14); font-weight: bold; line-height: 28px; color: #333333; letter-spacing: -0.5px; text-align: left; }
#board > .view .reple .reple_list .btn_option { cursor: pointer; display:inline-block; margin-left: 15px; font-size: var(--font-14); font-weight: normal; line-height: 28px; color: #a8a7a7; letter-spacing: -0.5px; text-align: left; }
#board > .view .reple .reple_list .date { position: absolute; right: 10px; top: 20px; font-size: var(--font-14); font-weight: normal; line-height: 28px; color: #a8a7a7; letter-spacing: -0.5px; text-align: right; }
#board > .view .reple .reple_list .reple_subject { font-size: var(--font-14); line-height: 28px; color: #888888; }
#board > .view .reple .reple_list pre { margin: 0; font-size: var(--font-14); line-height: 28px; color: #888888; }
#board > .view .reple .reple_list:after{ content:""; display:block; clear:both; /* height:0; visibility:hidden; */}

#board > .view .reple .reple_more { cursor: pointer; display: block; width: 200px; margin: 10px auto 0; font-size: 14px; font-weight: normal; line-height: 36px; color: #ffffff; text-align: center; background-color: #bbb; -webkit-border-radius:6px; -moz-border-radius:6px; border-radius:6px; }


#board > .view .list_preview { border-top: 1px solid #d9d9d9; border-bottom: 1px solid #d9d9d9; }
#board > .view .list_preview ul { margin: 0; padding: 0; font-size: 0; }
#board > .view .list_preview li { display: inline-block; vertical-align: top; position: relative; width: 50%; padding: 16px 0; }
#board > .view .list_preview .title { position: absolute; left: 30px; top: 16px; padding-left: 28px; font-size: 16px; line-height: 28px; color: #333333; letter-spacing: -0.5px; text-align: left; }
#board > .view .list_preview .title:after { content: ""; position: absolute; width: 7px; height: 12px; left: 0; top: 50%; margin-top: -6px; background: url("../images/board/dot_prev.png") no-repeat; }
#board > .view .list_preview .info { margin: 0 0 0 165px; font-size: 16px; line-height: 28px; color: #888888; letter-spacing: -0.5px; text-align: left; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; }
#board > .view .list_preview .info a,
#board > .view .list_preview .info a:hover { font-size: 16px; font-weight: normal; line-height: 28px; color: #888888; letter-spacing: -0.5px; text-align: left; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; }

#board > .view .list_preview li:nth-child(2) { }
#board > .view .list_preview li:nth-child(2) .title { left: auto; right: 30px; padding-left: 0; padding-right: 28px; text-align: right; }
#board > .view .list_preview li:nth-child(2) .title:after { left: auto; right: 0; background: url("../images/board/dot_next.png") no-repeat; }
#board > .view .list_preview li:nth-child(2) .info { margin: 0 165px 0 0; text-align: right; }
#board > .view .list_preview li:nth-child(2) .info a,
#board > .view .list_preview li:nth-child(2) .info a:hover { text-align: right; }
#board > .view .list_preview:after{ content:""; display:block; clear:both; /* height:0; visibility:hidden; */}

#board > .view .btn_list { margin: 50px 0 0; }
#board > .view .btn_list ul { margin: 0; padding: 0; font-size: 0; text-align: center; }
#board > .view .btn_list li { display: inline-block; vertical-align: top; list-style: none; width: 24.4%; margin: 0 0 0 0.8%; background-color: #8f8f8f; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; }
#board > .view .btn_list li:last-child { background-color: #282828; }
#board > .view .btn_list li:first-child { margin: 0; }
#board > .view .btn_list a,
#board > .view .btn_list a:hover { display: block; font-size: var(--font-15); font-weight: normal; line-height: 50px; color: #ffffff; letter-spacing: 0; text-align: center; }
#board > .view .btn_list:after{ content:""; display:block; clear:both; /* height:0; visibility:hidden; */}
#board > .view .btn_list .input { cursor: pointer; width: 100%; height: 50px; font-size: var(--font-15); font-weight: normal; line-height: 48px; color: #ffffff; text-align: center; background-color: #8f8f8f; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; border:none; }


/* 게시판 - 글쓰기 */
#board > .write { border-top: 3px solid #444444; } 
#board > .write .write_list {}
#board > .write .write_list ul { margin: 0; padding: 0; }
#board > .write .write_list li { position: relative; list-style: none; padding: 10px 0; border-bottom: 1px solid #d9d9d9; font-size: 0; }
#board > .write .write_list li.col_texarea { padding: 20px 30px; }
#board > .write .write_list .col { position: relative; padding: 0 30px; }
#board > .write .write_list .col.v1 { display: inline-block; vertical-align: middle; width: 50%; }
#board > .write .write_list .title { position: absolute; left: 20px; top: 50%; margin-top: -14px; padding-left: 28px; font-size: var(--font-15); font-weight: normal; line-height: 28px; color: #333333; letter-spacing: -0.5px; text-align: left; }
#board > .write .write_list .title:after { content: ""; position: absolute; width: 12px; height: 9px; left: 0; top: 50%; margin-top: -5px; background: url("../images/board/dot.png") no-repeat; }
#board > .write .write_list .title.v1 { position: relative; left: auto; top: auto; margin: 10px 30px 0; }


#board > .write .write_list .agree { position: relative; margin: 10px 58px 15px; }
#board > .write .write_list .agree .check { position: absolute; width: 22px; height: 22px; left: 0; top: 0; border: 1px solid #cccccc; }
#board > .write .write_list .agree .check.on { background: url("../images/inc/check.png") no-repeat center; }
#board > .write .write_list .agree .check_text { margin-left: 32px; font-family: 'Noto Sans KR', sans-serif; font-style: normal; font-weight: 300; font-size: 15px; line-height: 22px; color: #888888; letter-spacing: -1px; text-align: left; }

#board > .write .write_list .info { position: relative; margin: 0 0 0 135px; font-size: 16px; font-weight: normal; line-height: 28px; color: #777777; letter-spacing: -0.5px; text-align: left; }
#board > .write .write_list .input { width: 100%; height: 48px; padding: 0 20px; font-size: 16px; font-weight: normal; line-height: 28px; color: #777777; letter-spacing: -0.5px; text-align: left; border: none; outline: none; background-color: #f4f4f4; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; }
#board > .write .write_list .input::-webkit-input-placeholder { font-size: 16px; color:#777777; }
#board > .write .write_list .input:moz-placeholder { font-size: 16px; color:#777777; }
#board > .write .write_list .input::-moz-placeholder { font-size: 16px; color:#777777; }
#board > .write .write_list .input:-ms-input-placeholder { font-size: 16px; color:#777777; }

#board > .write .write_list .textarea { width: 100%; height: 350px; padding: 10px 20px; font-size: 16px; font-weight: normal; line-height: 28px; color: #777777; letter-spacing: -0.5px; text-align: left; border: 1px solid #b6b6b6; outline: none; resize: none; }
#board > .write .write_list .btn_file { position: absolute; width: 200px; height: 48px; right: 0; top: 0; background-color: #8f8f8f; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; }
#board > .write .write_list .btn_file a,
#board > .write .write_list .btn_file a:hover { display: block; font-size: 16px; font-weight: normal; line-height: 48px; color: #ffffff; letter-spacing: -0.5px; text-align: center; }
#board > .write .write_list:after{ content:""; display:block; clear:both; /* height:0; visibility:hidden; */}


#board > .write .write_list .option_list { position: relative; margin: 0; }
#board > .write .write_list .option_list ul { margin: 0; padding: 0; }
#board > .write .write_list .option_list li { list-style: none; float: left; margin-right: 10px; padding: 0; border: none; }
#board > .write .write_list .option_list:after{ content:""; display:block; clear:both; /* height:0; visibility:hidden; */}


#board > .write .btn_list { margin: 30px 0 0; }
#board > .write .btn_list ul { margin: 0; padding: 0; font-size: 0; text-align: center; }
#board > .write .btn_list li { display: inline-block; vertical-align: top; list-style: none; width: 260px; margin: 0 0 0 10px; background-color: #8f8f8f; -webkit-border-radius:6px; -moz-border-radius:6px; border-radius:6px; }
#board > .write .btn_list li:last-child { background-color: #282828; }
#board > .write .btn_list li:first-child { margin: 0; }
#board > .write .btn_list a,
#board > .write .btn_list a:hover { display: block; font-size: var(--font-15); font-weight: normal; line-height: 48px; color: #ffffff; letter-spacing: 0; text-align: center; }
#board > .write .btn_list:after{ content:""; display:block; clear:both; /* height:0; visibility:hidden; */}

#board > .write .btn_list input { cursor: pointer; width: 100%; padding: 0; background-color: #282828; font-size: var(--font-15); font-weight: normal; line-height: 48px; color: #ffffff; letter-spacing: 0; text-align: center; -webkit-border-radius:6px; -moz-border-radius:6px; border-radius:6px; border: none; outline: none; }

#board > .write .write_list progress { width: 100%; height: 40px; border: none; outline: none; background-color: #f4f4f4; -webkit-border-radius:6px; -moz-border-radius:6px; border-radius:6px; }
#board > .write .write_list progress::-webkit-progress-bar { background-color: #f4f4f4; -webkit-border-radius:6px; -moz-border-radius:6px; border-radius:6px; }
#board > .write .write_list progress::-webkit-progress-value { background-color: #239aff; -webkit-border-radius:6px; -moz-border-radius:6px; border-radius:6px; }



/* 페이징 */
#paging { position: relative; margin: 40px 0 0; padding: 16px 0 20px; background-color: #fff; font-size: 0; text-align: center; }
#paging.paging_reple { position: relative; left: auto; right: auto; bottom: auto; padding: 35px 0 20px; background-color: transparent; border-top: none; }
#paging .paging_btn { cursor: pointer; display: inline-block; vertical-align: middle; width: 16px; height: 16px; margin-top: 3px; text-align: center; text-indent:-9999px }
#paging .paging_btn.first { background: url("../images/board/first.svg") no-repeat center; margin-right: 10px; }
#paging .paging_btn.before { background: url("../images/board/before.svg") no-repeat center; }
#paging .paging_btn.next { background: url("../images/board/next.svg") no-repeat center; }
#paging .paging_btn.last { background: url("../images/board/last.svg") no-repeat center; margin-left: 10px; }

#paging .paging_list { display: inline-block; vertical-align: middle; margin: 0 18px; }
#paging .paging_list ul { margin: 0; padding: 0; }
#paging .paging_list li { display: inline-block; vertical-align: top; list-style: none; margin: 0 10px; }
#paging .paging_list a,
#paging .paging_list a:hover { display: block; font-weight: normal; font-size: var(--font-14); line-height: 24px; color: #888888; letter-spacing: -0.5px; text-align: center; }
#paging .paging_list li.select a,
#paging .paging_list li.select a:hover { font-weight: bold; font-size: var(--font-14); color: #242424; }
#paging .paging_list:after { content:""; display:block; clear:both; /* height:0; visibility:hidden; */}



/* 체크박스 - 요소를 숨기는 class.*/
#board .write .col_check .checkbox {
    position: absolute;
    clip: rect(0 0 0 0);
    width: 1px;
    height: 1px;
    overflow: hidden;
}

/* 체크박스 - 체크를 안 했을 때*/
#board .write .col_check label::before{
    content:"";
    display: inline-block;
    vertical-align: middle;
    width: 12px;/*체크박스 크기*/
    height: 12px;/*체크박스 크기*/
    margin: -5px 0 0 0;/*label과의 여백*/
    border: 1px solid #b5bbd5;
    -webkit-border-radius:4px; -moz-border-radius:4px; border-radius:4px;
    background-image:none;
    background-color: #fff;
}

/* 체크박스 - 체크했을 때*/
#board .write .col_check input:checked+label::before{
    background-image:url("../images/board/dot_check.png");
    background-color: #0066ff;
    border: 1px solid #0066ff;
    background-repeat: no-repeat;
    background-position: center;
}    

/* 체크박스 - 체크박스 선택한 상태일 때 테두리 생김*/
#board .write .col_check input:focus+.label::before{
    outline:2px solid #000;
}

#board .write .col_check label { display:inline-block; vertical-align:middle; margin:0 10px 0 0; padding:0;  font-size: var(--font-15); font-weight: normal; line-height: 28px; color: #777777; letter-spacing: -0.5px; text-align: left;}



/* 썸네일 */
.upload_thum input[type="file"] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip:rect(0,0,0,0);
    border: 0;
}

.upload_thum label {
    position: absolute; 
    width: 180px; 
    height: 40px; 
    right: 0; 
    top: 0; 
    background-color: #8f8f8f; 
    -webkit-border-radius:6px; -moz-border-radius:6px; border-radius:6px;
    cursor: pointer;
    font-family: "Apple SD Gothic Neo","Malgun Gothic","맑은 고딕",dotum,"돋움",sans-serif; 
    font-size: var(--font-15); 
    font-weight: normal; 
    line-height: 40px; 
    color: #ffffff; 
    letter-spacing: -0.5px; 
    text-align: center;
}



/* 파일업로드 */
.upload_box input[type="file"] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip:rect(0,0,0,0);
    border: 0;
}

.upload_box label {
    position: absolute; 
    width: 180px; 
    height: 40px; 
    right: 0; 
    top: 0; 
    background-color: #8f8f8f; 
    -webkit-border-radius:6px; -moz-border-radius:6px; border-radius:6px;
    cursor: pointer;
    font-family: "Apple SD Gothic Neo","Malgun Gothic","맑은 고딕",dotum,"돋움",sans-serif; 
    font-size: 15px; 
    font-weight: normal; 
    line-height: 40px; 
    color: #ffffff; 
    letter-spacing: 0; 
    text-align: center;
}

.upload_box progress { width: 100%; height: 40px; border: none; outline: none; background-color: #fafbfc; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; }
.upload_box progress::-webkit-progress-bar { background-color: #fafbfc; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; }
.upload_box progress::-webkit-progress-value { background-color: #239aff; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; }



/* 파일업로드 리스트 */
#fileupload { margin: 10px 20px 0; }
#fileupload > .fileupload_list { font-size: 0; }
#fileupload > .fileupload_list .list_box { position: relative; display: inline-block; vertical-align: top; list-style: none; float: none; width: 32%; height: 60px; margin: 0 2% 10px 0; padding: 0; background-color: #fafbfc; border: 1px solid #e3e3e3; -webkit-border-radius:4px; -moz-border-radius:4px; border-radius:4px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
#fileupload > .fileupload_list .list_box:nth-child(3n) { margin: 0 0 10px 0; }
#fileupload > .fileupload_list .list_box .icon { position: absolute; width: 54px; height: 54px; left: 2px; top: 2px; -webkit-border-radius:4px; -moz-border-radius:4px; border-radius:4px; background-size: cover; }
#fileupload > .fileupload_list .list_box .icon img { width: 100%; -webkit-border-radius:4px; -moz-border-radius:4px; border-radius:4px; }
#fileupload > .fileupload_list .list_box .box_info { display: block; margin: 10px 60px 0 80px; font-family: "Apple SD Gothic Neo","Malgun Gothic","맑은 고딕",dotum,"돋움",sans-serif; font-style: normal; font-weight: normal; font-size: 14px; line-height: 18px; color: #555555; letter-spacing: 0; text-align: left; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; }
#fileupload > .fileupload_list .list_box .box_info span { display: block; font-family: "Apple SD Gothic Neo","Malgun Gothic","맑은 고딕",dotum,"돋움",sans-serif; font-style: normal; font-weight: normal; font-size: 14px; line-height: 18px; color: #777777; letter-spacing: 0; text-align: left; }
#fileupload > .fileupload_list:after { content:""; display:block; clear:both; /* height:0; visibility:hidden; */}

#fileupload > .fileupload_list .list_box .file_btn { position: absolute; right: 5px; top: 1px; }
#fileupload > .fileupload_list .list_box .file_btn ul { margin: 0; padding: 0; }
#fileupload > .fileupload_list .list_box .file_btn li { cursor: pointer; list-style: none; width: 38px; height: 22px; margin-top: 4px; border: 1px solid #bebebe; -webkit-border-radius:4px; -moz-border-radius:4px; border-radius:4px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
background: #ffffff; /* Old browsers */
background: -moz-linear-gradient(top,  #ffffff 0%, #f9f8f8 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#f9f8f8)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #ffffff 0%,#f9f8f8 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #ffffff 0%,#f9f8f8 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #ffffff 0%,#f9f8f8 100%); /* IE10+ */
background: linear-gradient(to bottom,  #ffffff 0%,#f9f8f8 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f9f8f8',GradientType=0 ); /* IE6-9 */ 
}
#fileupload > .fileupload_list .list_box .file_btn:after { content:""; display:block; clear:both; /* height:0; visibility:hidden; */}

#fileupload > .fileupload_list .list_box .file_btn li:nth-child(1):after { content: ""; position: absolute; width: 10px; height: 2px; left: 50%; margin-left: -5px; top: 50%; margin-top: -1px; background-color: #7f7f7f; }
#fileupload > .fileupload_list .list_box .file_btn li:nth-child(1):before { content: ""; position: absolute; width: 2px; height: 10px; left: 50%; margin-left: -1px; top: 50%; margin-top: -5px; background-color: #7f7f7f; }
#fileupload > .fileupload_list .list_box .file_btn li:nth-child(2):after { content: ""; position: absolute; width: 10px; height: 2px; left: 50%; margin-left: -5px; top: 50%; margin-top: -1px; background-color: #7f7f7f; }



/* 게시판 - 비밀번호 입력 */
#secret_bg { position:fixed; width:100%; height:100vh; left:0; top:0; background-color:rgba(0,0,0,0.6); z-index:999999; display:none; }
#secret { position:fixed; width:100%; height:100vh; left:0; top:0; -webkit-overflow-scrolling:touch; z-index:999999; display:table; display:none; }
#secret .outer { display:table-cell; vertical-align:middle; }
#secret .outer .inner { position:relative; width:520px; margin:0 auto; background-color:#fff; -moz-border-radius:40px; -webkit-border-radius:40px; border-radius:40px; }
#secret .outer .inner .inner_box { position:relative; padding:50px 40px; -moz-border-radius:40px; -webkit-border-radius:40px; border-radius:40px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; -moz-box-shadow:0 0 20px #555; -webkit-box-show:0 0 20px #555; box-shadow:0 0 20px #555; }
#secret .outer .inner .btn_close { position:absolute; right:-40px; top:4px; cursor:pointer; }

#secret_field {}
#secret_field ul { margin: 0; padding: 0; }
#secret_field li { list-style: none; margin: 10px 0 0; background-color: #f2f2f2; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; }
#secret_field li:first-child { margin: 0; }
#secret_field .input { width: 100%; height: 58px; padding: 0 25px; font-size: 16px; line-height: 58px; color: #777777; letter-spacing: 0; border: none; outline: none; background-color: transparent; }
#secret_field .input::-webkit-input-placeholder { font-size: 16px; color:#999999; }
#secret_field .input:moz-placeholder { font-size: 16px; color:#999999; }
#secret_field .input::-moz-placeholder { font-size: 16px; color:#999999; }
#secret_field .input:-ms-input-placeholder { font-size: 16px; color:#999999; }
#secret_field:after{ content:""; display:block; clear:both; }

#secret_login { margin: 15px 0 0; background-color: #0066ff; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; }
#secret_login a,
#secret_login a:hover { display: block; font-size: 16px; line-height: 58px; color: #ffffff; letter-spacing: 0; text-align: center; }



@media screen and (max-width:1200px) {
    #board > .event_list .event_head { width: 100%; padding:0 3.5%; }
    #board > .event_list .event_bottom .event_inner { width:auto; }

    #board > .view { width:auto; margin:0 3.5%; }
}

@media screen and (max-width:640px) {

    #board .board_head { display:flex; justify-content:space-between; flex-direction:column; }

    /* 검색 */
    #search { margin:10px 0 0; }
    #search .list li { margin: 0 0 0 1%; }
    #search .list li:first-child { margin: 0; }
    #search .list li.select { width: 25%; margin-left:0; }
    #search .list li.input { width: 58%; }
    #search .list li.submit { width: 15%; }

    /* 게시판 */
    #board > .search { margin: 0 0 20px; }
    #board > .search li { width: 39%; -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px; }
    #board > .search .select { height: 40px; padding: 0 10px; font-size: 15px; line-height: 40px; }
    #board > .search .input { height: 40px; padding: 0 10px; font-size: 15px; line-height: 40px; }
    #board > .search .input::-webkit-input-placeholder { font-size: 15px; }
    #board > .search .input:moz-placeholder { font-size: 15px; }
    #board > .search .input::-moz-placeholder { font-size: 15px; }
    #board > .search .input:-ms-input-placeholder { font-size: 15px; }
    #board > .search li.submit { width: 20%; height: 40px; }
    #board > .search li.submit a,
    #board > .search li.submit a:hover { font-size: 15px; line-height: 40px; }
    #board > .search li.submit input { font-size: 15px; line-height: 40px; -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px; }


    /* 게시판 - 일반리스트 */
    #board > .list { border-top: 2px solid #444444; }
    #board > .list li { display:block; padding: 20px 15px; }
    #board > .list li .td { display:inline-block; padding: 0; font-size: 15px; }
    #board > .list li .col_no { display: none; }
    #board > .list li .col_date { width: auto; font-size:14px; }
    #board > .list li .col_date:before{ content: attr(data-label);}
    #board > .list li .col_writer { width: auto; font-size:14px; margin-right:10px; }
    #board > .list li .col_writer:before{ content: attr(data-label);}

    #board > .list .list_head { display: none; }
    #board > .list .list_body li .col_subject { padding-left: 0; }


    /* 이벤트 게시판 리스트 */
    #board > .event_list { display: flex; flex-direction: column; gap: 40px; }
    #board > .event_list .event_head { display: flex; flex-direction: column; width:100%; margin:0 auto; gap:36px; }
    #board > .event_list .event_tab { display:flex; flex-direction:row; gap:12px; }


    #board > .event_list .event_notice { flex-direction:column; gap:20px; }
    #board > .event_list .event_notice .item { gap: 8px; width:100%; min-height: 60px; padding: 32px 32px 60px; }

    #board > .event_list .event_notice .item .item_title { font-size: 18px; }
    #board > .event_list .event_notice .item .item_date { font-weight: 300; }
    #board > .event_list .event_notice .item .item_icon { width: 60px; right:15px; bottom:15px; }


    #board > .event_list .event_bottom { padding: 50px 20px; }
    #board > .event_list .event_bottom .event_inner { flex-direction:column; gap:20px; width:auto; margin:0 auto; }

    #board > .event_list .event_bottom .event_inner .item { gap: 8px; width:100%; min-height: 60px; padding: 32px 32px 60px;; }
    #board > .event_list .event_bottom .event_inner .item .item_title { font-size: 18px; }
    #board > .event_list .event_bottom .event_inner .item .item_date { font-weight: 300; }
    #board > .event_list .event_bottom .event_inner .item .item_icon { width: 60px; right:15px; bottom:15px; }



    /* 게시판 - 보기 */
    #board > .view .subject { margin: 0 15px 15px; font-size: 20px; line-height: 30px; }
    #board > .view .subject .info { position: relative; right: auto; top: auto; margin-top: 5px; }

    #board > .view .option { border-top: 2px solid #444444; } 
    #board > .view .option li { padding: 0; border-bottom: none; }
    #board > .view .option .col { display: block; width: auto; padding: 10px 0; border-bottom: 1px solid #d9d9d9; }
    #board > .view .option .col .title { left: 20px; top: 10px; padding-left: 25px; }
    #board > .view .option .col .info { margin: 0 0 0 125px; }

    #board > .view .content { margin: 30px 20px 60px; }
    #board > .view .content img { width:100%; height: auto; }

    #board > .view .file_add { padding: 20px; }
    #board > .view .file_add .title { padding-left: 25px; }
    #board > .view .file_add .list { margin: 0 25px; }

    #board > .view .reple { padding: 20px; }
    #board > .view .reple .textarea { margin: 0 100px 0 0; }
    #board > .view .reple .textarea textarea { padding: 10px 15px; }
    #board > .view .reple .submit { width: 95px; right:20px; top:20px; }

    #board > .view .reple .reple_list li { padding: 20px 10px; }
    #board > .view .reple .reple_list li:last-child { padding: 20px 10px 0; }
    #board > .view .reple .reple_list .date { position: relative; right: auto; top: auto; text-align: left; }

    #board > .view .list_preview li { display: block; width: auto; padding: 10px 0; }
    #board > .view .list_preview .title { position: relative; left: auto; top: auto; margin: 0 20px; padding-left: 25px; }
    #board > .view .list_preview .title:after { width: 12px; height: 7px; margin-top: -3px; background: url("../images/board/dot_prev_m.png") no-repeat; }
    #board > .view .list_preview .info { margin: 0 0 0 45px;  }

    #board > .view .list_preview li:nth-child(2) { border-top: 1px solid #d9d9d9; }
    #board > .view .list_preview li:nth-child(2) .title { left: auto; right: auto; padding-left: 25px; padding-right: 0; text-align: left; }
    #board > .view .list_preview li:nth-child(2) .title:after { left: 0; right: auto; background: url("../images/board/dot_next_m.png") no-repeat; }
    #board > .view .list_preview li:nth-child(2) .info { margin: 0 0 0 45px; text-align: left; }
    #board > .view .list_preview li:nth-child(2) .info a,
    #board > .view .list_preview li:nth-child(2) .info a:hover { text-align: left; }

    #board > .view .btn_list { margin: 40px 0 0; }
    #board > .view .btn_list a,
    #board > .view .btn_list a:hover { line-height: 40px; }
    #board > .view .btn_list .input { height: 40px; line-height: 40px; }


    /* 게시판 - 글쓰기 */
    #board > .write { border-top: 2px solid #444444; } 
    #board > .write .write_list li.col_texarea { padding: 20px 10px; border-bottom: 1px solid #d9d9d9; }
    #board > .write .write_list li.v1 { border-bottom: 1px solid #d9d9d9; }
    #board > .write .write_list .col { display: block; width: auto; padding: 0 10px; }
    #board > .write .write_list .title { left: 10px; }
    #board > .write .write_list .title.v1 { display: block; width: auto; margin: 10px 15px 0; }
    #board > .write .write_list .agree { margin: 10px 8px 15px; }

    #board > .write .write_list .info { margin: 0 0 0 120px; }
    #board > .write .write_list .input { height: 44px; padding: 0 10px; font-size: 15px; }
    #board > .write .write_list .input::-webkit-input-placeholder { font-size: 15px; }
    #board > .write .write_list .input:moz-placeholder { font-size: 15px; }
    #board > .write .write_list .input::-moz-placeholder { font-size: 15px; }
    #board > .write .write_list .input:-ms-input-placeholder { font-size: 15px; }
    #board > .write .write_list .textarea { height: 200px; padding: 10px 15px; font-size: 15px; }
    #board > .write .write_list .btn_file { width: 100px; height: 44px; }
    #board > .write .write_list .btn_file a,
    #board > .write .write_list .btn_file a:hover { font-size: 15px; line-height: 44px; }

    #board > .write .btn_list li { width: 48%; margin: 0 0 0 1%; }
    #board > .write .btn_list a,
    #board > .write .btn_list a:hover { font-size: 15px; line-height: 44px; }
    #board > .write .btn_list input { font-size: 15px; line-height: 44px; }



    /* 썸네일 */
    .upload_thum label {
        width: 100px;
    }


    /* 파일업로드 */
    .upload_box label {
        width: 100px; 
    }
    .upload_box progress { width: 100%; }


    /* 파일업로드 리스트 */
    #fileupload { margin: 10px 0 0; }
    #fileupload > .fileupload_list .list_box { width: 49%; height: 50px; margin: 0 2% 10px 0; }
    #fileupload > .fileupload_list .list_box:nth-child(3n) { margin: 0 2% 10px 0; }
    #fileupload > .fileupload_list .list_box:nth-child(even) { margin: 0 0 10px 0; }
    #fileupload > .fileupload_list .list_box .icon { width: 44px; height: 44px; top: 2px; left: 2px; }
    #fileupload > .fileupload_list .list_box .box_info { margin: 5px 60px 0 60px; font-size: 13px; }
    #fileupload > .fileupload_list .list_box .box_info span { font-size: 13px; }

    #fileupload > .fileupload_list .list_box .file_btn { right: 4px; top: 2px; }
    #fileupload > .fileupload_list .list_box .file_btn li { width: 30px; height: 18px; margin-top: 3px;}





}