@charset "utf-8";

.over_view {width:min(133px, 24.6vw); height:min(133px, 24.6vw); background:url(../img/community/view2.png) no-repeat center center; background-size:min(110px, 11vw) auto;  position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); z-index:9; opacity:0; transition:all 0.3s 0s ease-in-out;}
.over_view:after {display:block; content:""; width:100%; height:100%; background:url(../img/common/ring.png) no-repeat center top/cover;  position:absolute; left:0%; top:0%;}
.over_view:after {animation:rotate_image 10s linear infinite; transform-origin:50% 50%;}
@keyframes rotate_image{
    100% {
        transform:rotate(360deg);
    }
}
.over_layerW table td, .over_layerW table th {word-break: inherit;}
.code_area {position:relative; display:flex; flex-wrap:wrap; box-sizing:border-box; width:100%; max-width:500px; overflow:hidden;}
.code_area input {width:100%; margin-left:5px; flex:1; z-index:2;}
.code_area .code {width:100px; display:inline-flex; flex-wrap:wrap; justify-content:center; align-items:center; background:#000000; color:#fff; font-weight:600; z-index:2}
.bt_include {position:relative; display:flex; flex-wrap:wrap; box-sizing:border-box; gap: 0.3em;}
.bt_include > div {flex:1}
.bt_include .add_bt {min-width:8em;}

.bt_include select {width:100%; max-width:100%; flex:1}
.bt_include .input {flex:1}
.bt_include2 {padding-right:65px; margin:0 auto;}

.flex_input {display:flex; flex-wrap:wrap; align-items:center}
.flex_input .input {flex:1;}
.flex_input .select {flex:1;}
.flex_input .space {min-width: max-content; padding:0px 0.5em;}
.flex_input.tel .select {flex:0.9;}
.flex_input.tel .input:nth-of-type(1) {flex:0.9;}
.flex_input.tel .input:nth-of-type(2),
.flex_input.tel .input:nth-of-type(3) {flex:1.2;}
.flex_input.tel .select ~ .input {flex:1.2;}
.flex_input.birthday .select:nth-of-type(1) {flex:2;}

.essential:after {display:inline-block; content:"*"; color:#fa6f8c; font-size:1.3em; font-weight:400; line-height:100%; vertical-align:middle; margin-top:2px; margin-left:2px;}


/* 게시판 상세 */
.view_tit+.table_line {border-width:1px;}
.view_tit {padding:25px 20px; margin-bottom:25px; background:#EFF1F6; text-align:center; position:relative; min-height:4em; display:flex; flex-direction:column; justify-content:center; align-items:center;}
/* .view_tit .label {display:inline-flex; justify-content:center; align-items:center; border:1px solid #141414; font-size:var(--small-font-size); line-height:1.3em; font-weight:600; padding:5px 15px 3px 15px; color:#141414; margin-bottom:10px;} */
.view_tit .label { font-size: var(--small-font-size); color: #fff !important; height:2.1em; width:4.5em; border-radius:4px; display: inline-flex; justify-content: center; align-items: center; background:#cc1427; text-align: center; line-height: 1.4em; font-weight:500; vertical-align: middle;}
.view_tit .label.off {background: #cccccc;}
.view_tit .v_tit {font-size:1.33em; line-height:140%; font-weight:700; color:#000000; }
.view_tit .v_list {margin-top:0.4em}
.v_list {font-size:var(--sub-font-size); color:#666666; display: flex; flex-wrap: wrap; gap:5px 20px;}
.v_list > li {font-weight:400; font-size:1em; line-height:120%; position:relative;}
.v_list > li:before {display:block; content:""; width:1px; height:0.8em; background:#cccccc; position:absolute; left:-10px; top:50%; transform:translateY(-50%); -webkit-transform:translateY(-50%)}
.v_list > li:first-child:before {display:none;}
.view_con {padding:clamp(30px, 5vw, 50px) 0px; font-size:var(--sub-font-size); line-height:160%; border-top:1px solid #ccc; border-bottom: 1px solid #000; font-weight:400; }
.view_file {margin-top:10px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; font-size:var(--sub-font-size); gap:10px;}
.view_file strong {font-weight:500;}
.attachments {display:flex; align-items: center; gap:10px; padding-left:30px; padding-bottom:30px; font-size:var(--sub-font-size); background:url(../img/common/ico_attachments.png) no-repeat left 2px; flex:1}
.attachments > dt {min-width:max-content; align-self: flex-start; font-weight:500}
.attachments > dd {flex:1}
.attachments > dd > ul {display: flex; flex-wrap: wrap; gap:10px}
.attachments > dd > ul > li { word-break:break-all}
.attachments > dd > ul > li > a {text-decoration:underline; text-underline-offset:5px; display:inline-block; font-weight:300; color:#333;}
.attachments_wrap {display: flex; justify-content: space-between;}
.board_content {padding:30px 0px; border-top:1px solid #ccc; }





/* 페이징 */
.paging {overflow:hidden; text-align:center; margin:40px 0px 25px 0px; width:100%; font-weight:300; font-size:0px;}
.paging img {vertical-align:top;}
.paging a {color:#000; vertical-align:middle; display:inline-flex; width:50px; height:50px; overflow:hidden; border-radius:100%; font-size:17px; margin:0px 2px; padding:9px; font-weight:400; justify-content:center; align-items:center;}
.paging a.first, .paging a.last, .paging a.next, .paging a.prev {width:50px; height:50px; background:#fff; border:1px solid rgba(0, 0, 0, 20%); text-indent:-99999px; position:relative; font-size:0px;}
.paging a.first:after, .paging a.prev:after {content:''; width:7px; height:7px; border-top:2px solid #787878; border-left:2px solid #787878; display:inline-block; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%) rotate(-45deg); opacity:0.7;}
.paging a.last:after, .paging a.next:after {content:''; width:7px; height:7px; border-top:2px solid #787878; border-right:2px solid #787878; display:inline-block; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%) rotate(45deg); opacity:0.7;}
.paging a.first:before {content:''; width:7px; height:7px; border-top:2px solid #787878; border-left:2px solid #787878; display:inline-block; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%) rotate(-45deg); opacity:0.7; margin-left:5px}
.paging a.last:before {content:''; width:7px; height:7px; border-top:2px solid #787878; border-right:2px solid #787878; display:inline-block; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%) rotate(45deg); opacity:0.7; margin-left:-5px;}
.paging a.next {margin-left:10px;}
.paging a.prev {margin-right:10px;}
.paging a.on {color:#fff; background:#333333; border:1px solid #333333;}


 /* 게시글 검색 */
.list_count_wrap {margin-bottom:min(30px, 3vw);}
.list_count_wrap, .list_count_wrap form {display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; width: 100%; gap:10px;}
.list_count_wrap .bbs_search {order:3; width:60%; max-width:445px; font-size: var(--sub-font-size);}
.list_count_wrap .list_count {order:1; display:flex; align-items: center; gap:5px; align-self: flex-end;}
.list_count_wrap .type_list {display: flex; order:2; margin-right: auto; align-self: flex-end; gap: 5px; margin-left: clamp(10px, 3vw, 30px);}
.list_count_wrap .type_list a {display: flex; align-items: center; justify-content: center; padding: 0px 1.05em; min-height:2.2em; border: 1px solid #DDDDDD; border-radius:30px; font-size:clamp(12px, 1.5vw, 14px); line-height: 1.3em; color: #999999; font-weight: 600; }
.list_count_wrap .type_list a.on {background: #000; border-color: #000; color: #fff; }


.bbs_search .select {border:1px solid #999999; vertical-align:middle; width:30%; max-width:130px; background-color:#fff; height:55px; border-radius:0px; color:#666666}
.bbs_search .select:After {content:"▼"; position: absolute; right:0px; top:0px;}
.bbs_search {display:flex;}
.bbs_search_in {position:relative;margin:0 auto; width:100%;}
.bbs_search_in fieldset {display:flex; flex-wrap:wrap; gap:5px}
.bbs_input {flex:1; display:flex; background:#fff; border:1px solid #333; border-radius:40px;}
.bbs_input .input {height:50px; width:100%; flex:1; border:none; background: none; padding-left: 2em;}
.bbs_input .bt {background:url(../img/common/search3.svg) no-repeat center center; color: #fff; font-weight:600; min-width:50px; text-indent: -99999em; display: block; background-size:20px;}


/* 갤러리 리스트 */
.photo_list {display: flex; flex-wrap: wrap; gap:30px 25px;}
.photo_list > li {width:calc(25% - 19px); position: relative;}
.photo_list > li > a {display: block;}
.photo_list > li * {transition:all 0.3s 0s ease-in-out;}
.photo_list .pic {aspect-ratio: 340/190; overflow: hidden; border-radius: clamp(8px, 2vw, 16px);}
.photo_list .pic img {object-fit: cover; width:100%; height:100%}
.photo_list .info {padding:1em 0px; position: relative;}
.photo_list .date {font-size: var(--sub-font-size); color: #727171; margin-top: 0.5em;}
.photo_list .txt_t {word-break: normal; display:block;  overflow:hidden; text-overflow:ellipsis; display:-webkit-box; line-clamp: 2; -webkit-line-clamp:2; -webkit-box-orient:vertical; text-align:left; line-height:1.4em; max-height:2.8em; font-weight:600;}
.photo_list .s_txt {display:block; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; -o-text-overflow:ellipsis; font-weight:500; color:#000; height:20px; line-height:20px; padding-bottom:10px; font-size:16px; text-align:left;}
.photo_list .txt_s {display:block; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; line-clamp: 2; -webkit-line-clamp:2; -webkit-box-orient:vertical; text-align:left; line-height:1.4em; height:2.8em; }
.photo_list .label {position: absolute; right: 0px; top: 0px; font-size: var(--small-font-size); color: #fff !important; height:2.333em; width:5.33em; border-radius:4px; display: flex; justify-content: center; align-items: center; background:#cc1427; text-align: center; font-weight:500;}
.photo_list .label.off {background: #cccccc}

.photo_list2 {gap:40px;}
.photo_list2 > li {width:calc(33.333% - 27px)}
.photo_list2 > li > a {border-radius:min(20px, 3vw);}


.photo_list2 .pic {padding-bottom: calc(470 / 450 * 100%);}
.photo_list2 .info {padding:1em 1em 0.5em 1em; font-size:1.777em; min-height: 5.5em;}
.photo_list2 .txt_t {font-size:1em; font-weight: 700; line-height: 1.4em; margin:0px; height: auto; max-height: 2.8em;}
.photo_list2 .date {margin-top: 0.5em; font-size: var(--small-font-size);}

/* 비디오 리스트 */
.movie_list {display: flex; flex-wrap: wrap; gap:20px} 
.movie_list > li {width:calc(25% - 15px); border:1px solid #ccc; border-radius:4px; padding:min(20px, 3vw); background: #fff; transition:all 0.3s 0s ease-in-out;}
.movie_list > li:hover {background: var(--key-color);}
.movie_list > li .movie {cursor:pointer; display:block; border:1px solid #ccc; border-radius:8px; overflow:hidden; position:relative}
.movie_list > li .movie::before {content:""; width:100%; height:100%; background: #000; opacity:0.4; position:absolute; left: 0px; top: 0px; z-index: 2;}
.movie_list > li .movie::after {display: block; content:""; width:min(52px, 9vw); height:min(52px, 9vw); background:url(../img/main/bt_play.png) no-repeat left top/cover #000; border-radius:100%; position: absolute; left: 50%; top:50%; transform: translate(-50%, -50%); z-index: 3;}
.movie_list .txt_t {line-height: 1.4em; font-weight: 600; margin-top:1em}
.movie_list .txt_s {padding-top:0.5em;}


/* 게시판 리스트 */
.notice_list {border-top:2px solid #000; font-size:var(--sub-font-size); line-height:1.4em; }
.notice_list > li {box-sizing:border-box; border-bottom:1px solid #e5e5e5}
.notice_list > li.on {background: #fbfbfb;}
.notice_list > li > a * {transition:all 0.3s 0s ease-in-out;}
.notice_list > li > a div {overflow:hidden; flex:1}
.notice_list > li > a .info {text-align: left;}
.notice_list > li > a {position:relative; display:flex; align-items:center; min-height:70px; padding:15px clamp(10px, 4vw, 40px) 15px 0px;}
.notice_list > li > a:after {content:''; width:6px; height:6px; border-top:2px solid #333; border-right:2px solid #333;  display:inline-block; transform:rotate(45deg) translateY(-50%); position:absolute; right:clamp(10px, 3.8vw, 35px); top:50%; margin-top:-3px; display: block;}
.notice_list > li > a .num {min-width:7em; font-size: var(--font-size); font-weight:500; text-align:center; }
.notice_list > li > a .num .notice {display: inline-flex; font-size: clamp(12px, 1.2vw, 14px); width:4em; aspect-ratio: 55/30; justify-content: center; align-items: center; color: #fff; text-align: center; background-color:var(--deep-key-color); border-radius:clamp(4px, 1vw, 8px); font-weight:700;}
.notice_list > li > a .num .state {display: inline-flex; font-weight:600; border-radius:30px; border:1px solid #000;  font-size: 0.9em; width:7em; height:2.57em; justify-content: center; align-items: center; color: #000; text-align: center; background-color: #eff1f6;}
.notice_list > li > a .num .state2 {border-color: #12a629; background: #fff; color: #12a629;}
.notice_list > li > a .num .state3 {border-color: #e5025b; background: #fff; color: #e5025b;}


.notice_list > li > a .date {overflow: hidden; display: flex; font-size: clamp(12px, 1.2vw, 14px); line-height: 1.4em; flex-wrap: wrap; color: #666666;}
.notice_list > li > a .date > li {position: relative;}
.notice_list > li > a .date > li + li {margin-left: 0.7em; padding-left: 0.7em;}
.notice_list > li > a .date > li + li:before {content: ""; width: 1px; height:0.8em; background: #ccc; opacity: 0.5; position: absolute; left: 0px; top: 50%; transform: translateY(-50%);}
.notice_list > li > a .date img {padding-bottom:1px;}
.notice_list > li > a .date > strong { font-weight:800; display:block; font-size:2.1em; line-height:110%;}
.notice_list > li > a .txt_t {display:inline-block; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; -o-text-overflow:ellipsis; font-weight:500; width:100%; flex:1; font-size:var(--large-font-size); line-height:1.4em;}
.notice_list > li > a .txt_t .txt {display:inline-block; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; -o-text-overflow:ellipsis;  max-width:100%; vertical-align: middle;}
.notice_list > li > a .txt_t img {margin-left:5px;}
.notice_list > li > a .txt_s {font-size:16px; line-height:130%; color:#666666; font-weight:500; display:block; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; -o-text-overflow:ellipsis; padding-top:5px;}
.notice_list > li > a .txt_tW .txt_s {padding-top: 0px; padding-bottom:5px;}
.notice_list > li > a .key {display:flex; align-items:center;}
.notice_list > li > a .key .txt {max-width:calc(100% - 25px); overflow:hidden; white-space:nowrap; text-overflow:ellipsis; -o-text-overflow:ellipsis; }
.notice_list > li > a .file {text-align:center; min-width:5em;}
.notice_list > li > a .doc {text-align:center; min-width:5em; display: flex; gap:0.1em; align-items: center; justify-content: center;}
.notice_list > li > a .doc img {max-width: clamp(20px, 2.2vw, 24px);}
.notice_list > li > a .file img {max-width: clamp(14px, 2vw, 22px);}
.notice_list > li > a .click {text-align:right; min-width:6em; color: #727171;}
.notice_list > li > a .label {min-width:11em; text-align: center; margin-right: 1px;}
.notice_list .new {display: inline-flex; font-size:12px; line-height:1em; width:clamp(18px, 3vw, 21px); height:clamp(18px, 3vw, 21px); border-radius: 100%; background: var(--key-color); color: #fff !important; justify-content: center; align-items: center; font-weight:700; margin-left:0.5em; vertical-align: middle;}
.notice_list .type {display: inline-flex; font-size:clamp(10px, 1.2vw, 12px); line-height:1em; width:5em; height:2.2em; border-radius:4px; background: var(--key-color); color: #fff !important; justify-content: center; align-items: center; font-weight:700; margin-left:0.5em; vertical-align: middle; border: 1px solid var(--key-color);}
.notice_list .type2 {background:#fff; border-color:var(--key-color); color:var(--key-color) !important;}
.notice_list > li > a .txt_t .txt:has(+ .new) {max-width:calc(100% - 34px)}
.notice_list > li > a .txt_t .txt:has(+ .type) {max-width:calc(100% - 4em)}



.notice_list > li > a:hover {color:var(--key-color);}
.notice_list > li > a:hover:after {border-color:var(--key-color);}
.notice_list > li > a:hover .txt_s {color:var(--key-color);}
.notice_list > li > a:hover .txt_t {color:var(--key-color);}
.notice_list > li > a:hover .date {color:var(--key-color);}
.notice_list > li > a:hover .file img {filter:invert(39%) sepia(86%) saturate(3289%) hue-rotate(215deg) brightness(97%) contrast(98%);}
.notice_list > li > a:hover * {color:var(--key-color);}


.board-list {width:100%; table-layout:fixed; border-top:2px solid #000; font-size:var(--sub-font-size)}
.board-list thead th {background:#fff; font-weight:700; height:3.8em; border-bottom:2px solid #000; border-top:none; text-align:center;}
.board-list tbody th {background:#f3f4f8;}
.board-list tbody tr:hover td, .board-list tbody tr:hover th, .board-list tbody tr:hover {background:#fafafa}
.board-list tr.re th, .board-list tr.re td, .board-list tr.re { background:#f2f2f2;}
.board-list tr.on .subject {color: var(--key-color); font-weight:600;}
.board-list td {border-bottom:1px solid #cdcdcd; border-top:none; padding:0.5em;  height:3.5em; font-weight:400; text-align:center; word-break:break-all; line-height:140%;}
.board-list td a {color:#333333;}
.board-list td.subject { text-align:left; padding-left:20px; padding-right:10px; font-size:1em;}
.board-list td.subject a { color:#333333;}
.board-list td img { vertical-align:middle;}
.board-list .notice {display: inline-flex; align-items:center; background:var(--deep-key-color); color:#fff; border-radius: 3px; padding:0em 0.5em; font-weight:400; line-height: 1.3em; height:1.714em; font-size:14px;}
.board-list .new {display: inline-flex; font-size: 12px; line-height:1em; width:21px; height:21px; border-radius: 100%; background: var(--deep-key-color); color: #fff; justify-content: center; align-items: center; font-weight:700; margin-right:0.5em;}
.board-list .re_t {width:22px; height:16px; margin-right:5px; display:inline-block; vertical-align: middle; font-size:0px; text-indent:-999999em; background:url(../img/common/ico_re.png) no-repeat left top/cover}



/* 이전글 다음글 */
.next_list_wrap {margin-top:clamp(30px, 5vw, 50px); position: relative;}
.next_list_wrap .btn_list {max-width: max-content; margin: 0 auto; position: relative; z-index: 2;;}
.next_list_wrap .btn_list > a {max-width: 0 auto; width:clamp(150px, 20vw, 200px); height: clamp(55px, 8vw, 70px); border-radius:60px; display: flex; justify-content: center; align-items: center; gap: 0.8em; font-size: var(--sub-font-size); background: #EFF1F6;}
.next_list_wrap .btn_list > a::before {content: ""; width: 18px; height:18px; background: url(../img/common/ico_list.svg) no-repeat center center/cover;}
.next_list {display: flex; justify-content: space-between; height: clamp(55px, 8vw, 70px); align-items: center; transform: translateY(-100%);}
.next_list > dl {display: flex; align-items: center; flex:1; overflow: hidden; max-width: calc(50% - 100px);}
.next_list dl dt {width:30px; min-width:30px; text-indent:-999999px; display:block; position:relative}
.next_list dl dt:after {content:''; width:10px; height:10px; border-top:3px solid #1b1b1b; border-left:3px solid #1b1b1b; border-radius:2px; display:inline-block; transform:rotate(-45deg) translateY(-50%); position:absolute; left:15px; top:50%; box-sizing:border-box; margin-top:-3px;}
.next_list dl dd {overflow:hidden; white-space:nowrap; text-overflow:ellipsis; -o-text-overflow:ellipsis; flex:1;}
.next_list dl dd.date {position:absolute; padding-left:0px; background:none; padding-right:25px; right:0px; top:50%; transform:translateY(-50%); -webkit-transform:translateY(-50%);}
.next_list dl.prev {justify-content:flex-end}
.next_list dl.prev dt {order:1}
.next_list dl.prev dt:after {border-left:none; border-right:3px solid #000; transform:rotate(45deg) translateY(-50%); left:auto; right:15px; top:50%;}
.next_list dl.prev dd {order:0; text-align:right; }

.preview_list {border-top:1px solid #dddddd; border-bottom:1px solid #dddddd; margin-top:2em; font-size:var(--sub-font-size);}
.preview_list > li:not(:first-child) {border-top:1px solid #dddddd;}
.preview_list > li {display:flex; height:4.5em; align-items: center;}
.preview_list .subj {min-width:5em; margin-right:1.5em; position: relative;}
.preview_list .subj:after {display:block; content:""; width:1px; height:12px; background:#ccc; opacity: 0.7; position: absolute; right:0px; top:50%; transform: translateY(-50%);}
.preview_list .subs {flex:1;  overflow:hidden; white-space:nowrap; text-overflow:ellipsis; -o-text-overflow:ellipsis; color:#1b1b1b; width:100%; line-height:1.3em;}





/*글쓰기*/
.board-write {width:100%; border-top:4px solid #21110d; font-size:var(--sub-font-size);}
.board-write tr:first-child th { border-top:none;}
.board-write tr:first-child td { border-top:none;}
.board-write th {background:#f3f4f8; border-top:1px solid #cccccc; line-height:1.4em; text-align:left; padding:10px; padding-left:1em; font-weight:700}
.board-write th span {padding-right:2px;}
.board-write.th_tc th {padding:13px 0 12px 0px; text-align:center;}
.board-write.th_tc th span {margin-left:-15px;}
.board-write td {border-top:1px solid #cccccc; padding:10px; word-break:break-all; line-height:1.4em; }
.board-write .input, .board-write .select {width:100%; height:3em}
.board-write .textarea {border-radius:4px;}
.board-write .note {padding-top:0.5em; color:#666666; font-weight: 300;}


.phone-write, .email-write, .date-write {display:flex; align-items:center;}
.phone-write .input, .email-write .input, .date-write .input {flex:1}
.email-write .input, .email-write .select {flex:1}
.date-write .datepicker{width:8.75rem;}
.date-write select{width:5rem; min-width:auto;}
.sub-files input[type="text"]{width:auto;}

div:has(> .table_style1) {overflow: hidden;}
div > .table_style1 {width: calc(100% + 2px); margin-left: -1px;}
.table_style1 {clear:both; width:100%; table-layout:fixed; background:#fff; position: relative; line-height:1.3em;}
.table_style1 thead tr {overflow: hidden; border-radius:10px;}
.table_style1 thead tr th {background: var(--deep-key-color); height:3em; padding:0.8em 5px; color: #fff; font-weight:600; word-break:break-all; text-align:center; border:none;}
.table_style1 thead th:first-child {border-top-left-radius:6px;border-bottom-left-radius:6px;}
.table_style1 thead th:last-child {border-top-right-radius:6px; border-bottom-right-radius:6px; }
.table_style1 tbody tr th {padding:0.8em 5px; font-weight:600; font-size: var(--sub-font-size); color: var(--deep-key-color);}
.table_style1 td {border:1px solid #EBEBEB; line-height:1.5em; height:3.2em; padding:0.4em clamp(5px, 1vw, 1em); text-align:center; vertical-align: middle; font-weight:400; font-size: var(--sub-font-size);}
.table_style1 th {border:1px solid #EBEBEB;}
.table_style1 .tl {padding-left:1em; padding-right:10px; text-align:left; word-break:break-all;}
.table_style1 .tr {padding-right:1em; padding-left:10px; text-align:right; word-break:break-all;}
.table_style1 .input, .table_style1 .select {width:100%; height: 2.6em;}
.table_style1 .fee {display: flex; flex-wrap: wrap; justify-content: center; gap:0.5em 2em;}
.table_style1 .btn_go {display: inline-flex; align-items: center; justify-content: center; min-width: max-content; padding: 0.45em 1em; border-radius: 4px; background: var(--point-color); color: #fff; font-size: var(--x-small-font-size); font-weight: 600; white-space: nowrap;}


.table_style1 tfoot tr td{background:#ECF0F8; font-weight:600; border-top:1px solid #EBEBEB; border-bottom:1px solid #EBEBEB; line-height:1.4em; height:3em; padding:0.8em 5px; text-align:center; color:#000;}
.table_style1 tfoot tr td:first-child{border-left:1px solid #EBEBEB;}
.table_style1 tfoot tr td:last-child{border-right:1px solid #EBEBEB;}
.table_style1 tfoot tr td.subject, .table_style1 tfoot tr td.tl {padding-left:18px; padding-right:10px; text-align:left; word-break:break-all;}
.table_style1 tfoot tr td.tr {padding-right:18px; padding-left:10px; text-align:right; word-break:break-all;}

.table_style2 {clear:both; width:100%; table-layout:fixed; background:#fff; position: relative; line-height:1.3em; font-size:0.95em;}
.table_style2:before {width:100%; height:1px; background:#000; content: ""; position: absolute; left: 0px; top: 0px;}
.table_style2 thead tr th {background-color:#f7f8fd; height:3.5em; padding:0.8em 5px; border:1px solid #ccc; font-weight:600; word-break:break-all; text-align:center;}
.table_style2 thead tr:first-child th {border-top:none; }
.table_style2 tbody tr:first-child th {border-top:none;}
.table_style2 tbody tr:first-child td {border-top:none;}
.table_style2 tbody tr th {border-bottom:1px solid #ccc; padding:0.8em 5px; font-weight:600; background:#fff;}
.table_style2 td {border:1px solid #EBEBEB; line-height:1.5em; height:3em; padding:0.8em 5px; text-align:center; vertical-align: top; font-weight:400; font-size:var(--sub-font-size);}
.table_style2 th {border:1px solid #EBEBEB;}
.table_style2 .t-deep {color:#000;}

div:has(> .table_style3) {overflow: hidden;}
div > .table_style3 {width: calc(100% + 2px); margin-left: -1px;}
.table_style3 {clear:both; width:100%; table-layout:fixed; background:#fff; position: relative; line-height:1.3em;}
.table_style3 thead tr th {background-color:#fff; height:3.5em; padding:0.8em 5px; border-top:2px solid #000; border-bottom:2px solid #000; font-weight:600; word-break:break-all; text-align:center;}
.table_style3 tbody tr th {border-bottom:1px solid #ccc; padding:0.8em 5px; font-weight:600;}
.table_style3 td {border-bottom:1px solid #EBEBEB; line-height:1.5em; height:3em; padding:0.8em 5px; text-align:center; vertical-align: middle; font-weight:300;}

.table_style3 .tl {padding-left:1em; padding-right:10px; text-align:left; word-break:break-all;}
.table_style3 .tr {padding-right:1em; padding-left:10px; text-align:right; word-break:break-all;}


 
/* 비밀글 password */
.pw_box {text-align:center; max-width:350px; margin:0 auto;}
.pw_box h3 {font-size:23px; text-align:center; color:#000; font-weight:500; line-height:30px; padding-bottom:30px;}
.pw_box .txt {font-size:1.15em; color:#000; font-weight:500; line-height:140%; padding:30px 0px 10px 0px;}
.pw_box .txt strong {color:#de2b2f;}
.pw_box form {text-align:center;}
.pw_box form .input {width:100%; height:44px; line-height:44px;}
.pw_box .bt {padding:20px 0px; margin-top:20px; border-top:1px solid #000; }
.pw_box .bt > a {display:inline-flex; background:#000; justify-content:center; align-items:center; font-weight:700; width:100%; max-width:110px; height:50px; color:#fff; font-size:1.15em; border-radius:8px;}


.table_scroll_guide {display: none; z-index: 2;}


@media (hover: hover) and (pointer: fine) {
    .photo_list > li > a:hover .pic:after {opacity:0.8;}
    .photo_list > li > a:hover .pic .over_view {opacity:1;}
	.photo_list > li > a:hover *  {color:var(--key-color);}
    .photo_list > li > a:hover .txt_t {color:var(--key-color);}
 }


@media screen and (max-width:1200px) {
	.photo_list > li {width:calc(33.3333% - 17px)}
	.photo_list2 > li {width:calc(50% - 10px)}

	.movie_list > li {width:calc(33.333% - 13.4px);}
}

/* 980px 이하 */
@media screen and (max-width:980px) {
	.photo_list2 > li {width:100%}
    
	
}
/* 768px 이하 */
@media screen and (max-width:767px) {
	.table_scroll {overflow-x: auto; width: 100%; position: relative;}
	.table_scroll::after {content: ""; width: 100%; height: 100%;}
	.table_scroll > .table_wrap {width:100%; min-width: max-content;}
	.table_scroll > .table_wrap > table {table-layout: auto;}
	.table_scroll_guide {display: flex;	align-items: center; justify-content: center; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background:url(../img/common/scroll.svg) no-repeat center center rgba(0, 0, 0, 0.5); color: #fff; font-size:clamp(14px, 4vw, 17px); cursor: pointer; padding-bottom:90px;}




    .bbs_search_in {width:100%}
    .list_count_wrap .bbs_search {width:100%; max-width:100%;}
	.list_count_wrap .type_list {order: 4; margin-left: 0px;}

    
    .view_date {padding-bottom:20px;}
    .view_date > ul li.file .txt_t {background-size:auto 20px; padding-left:20px;}
    .view_date > ul li .txt_t {padding-left:20px;}
	.view_date > ul li {float:none !important;}

	.view_tit .status {width:55px; line-height:26px; }
	.view_tit .share {position:relative; bottom:auto; right:auto; justify-content:flex-end; padding-top:10px;}
	.view_tit .share > li > button {line-height:30px; padding-left:35px;}
	.view_tit .share > li > button .ico img {width:30px;}
	
	.notice_list {font-size:15px;}
	.notice_list > li > a .date img {padding:0px;}
	.notice_list > li > a {flex-wrap:wrap; padding:15px 10px; min-height:70px;}
	.notice_list > li > a:after {display: none;}

	.notice_list > li > a .file img {max-height: 20px;}
	.notice_list > li > a .status > span {line-height:22px; min-height:24px; font-size:13px;}    
	.notice_list > li > .toggle .last {display:none;}
	.notice_list > li > .toggle .manpower_pool .bx1 {min-width:90px;}
	.notice_list > li > .toggle .manpower_pool .type {font-size:13px; height:20px;}
	.notice_list > li > .toggle .manpower_pool .bx1 {width:100%; display:flex; align-items:center;}
	.notice_list > li > .toggle .manpower_pool .type {margin:0px 5px 0px 0px;}
	.notice_list .answer_wrap {padding:20px 20px 20px 60px;}	
	.notice_list > li > a > * {min-width:inherit !important; padding-left:10px; border-left:1px solid #ccc; margin-left:10px; }
	.notice_list > li > a .num {min-width:2.6em !important; margin-left:0px; padding-left: 0px !important; border:none;}
	.notice_list > li > a .num img {max-height:clamp(25px, 4vw, 35px);}
	.notice_list > li > a .num .notice {width: 3em; height: 3em;}
	.notice_list > li > a .cate {width:auto; border:none !important; height:inherit; border-radius:0px; margin:0px; margin-left:10px; border-left:1px solid #ccc !important; }
	.notice_list > li > a .cate_s {text-align:left; margin-left:0px; border:none !important; padding-left:0px;}
	.notice_list > li > a .txt_t, .notice_list > li > a .txt_tW {width:100%; flex:initial; order:9; margin-top:0.5em; border:none; margin-left:0px; padding-left:0px;}
	.notice_list > li > a .txt_tW .txt_t {margin-top: 0px;}
	.notice_list > li > a.column {flex-direction: column; align-items: flex-start;}
	.notice_list > li > a.column > * {border-left:none; padding-left: 0px; margin-left: 0px;} 
	.notice_list > li > a .click {display: none;}
	.notice_list > li > a .label {margin-right: 0px; max-width:6em;}

	.board-list {display:block; table-layout: initial;}
	.board-list thead, .board-list colgroup {display:none;}
	.board-list tbody {width:100%; display: block;}
	.board-list tr {display:flex; flex-wrap: wrap; align-items: center; width:100%; padding:15px 10px; border-bottom:1px solid #cdcdcd;}
	.board-list tr td {border:none; padding:0px; height: auto; font-size:1em; padding-left: 10px; line-height:1.3em; border-left: 1px solid #ccc; margin-left: 10px;}
	.board-list tr td:first-child {margin-left:0px; padding-left:0px; border:none;}
	.board-list tr.on {background: #f6f8fe;}
	.board-list tr.on td {background:none;}
	.board-list td.subject {width: 100%; order:10; padding:0px; font-size:1.15em; font-weight:500; line-height: 1.5em; margin-top:10px; border:none; margin-left:0px;}
	.board-list td.subject > a {display: block;}
	.board-list img {max-height: min(19px, 4vw);}

	.movie_list {gap:min(20px, 4vw)}
	.movie_list > li {width:calc(50% - min(10px, 2vw))}

    .photo_list {gap:30px min(20px, 4vw)}
    .photo_list > li {width:calc(50% - min(10px, 2vw))}
	.photo_list2 {gap:1em}
	.photo_list2 > li {width:100%}

	.m_th {width:115px !important;}

	.movie_list > li {width: calc(50% - 10px);}
	
	.next_list_wrap {margin-bottom: clamp(30px, 5vw, 50px);}
	.next_list {transform:none;}
	.next_list > dl {max-width: calc(50% - 10px);}


/* 600px 이하 */
@media screen and (max-width:599px) {
    .board-list {font-size:13px}
    
    
    .board-write {font-size:13px;}
	
	.board-write th {padding-left:10px !important;}   
    .board-write td {padding:8px 5px; height:auto;}
	
   
    .board-write .btnNormalB span {padding:0px 22px; height:36px; line-height:35px;}
    .board-write .btnNormalB.cancel span {padding:0px 20px; height:34px; line-height:33px;}
    .file_input > input {min-height:36px; line-height:34px; padding-left:5px;}
    .file_input label {height:36px; line-height:36px; font-size:13px;}
    .select_ds select {padding:0px 0px 0px 5px; height:36px;}
    .select {height:36px;}
    .board-list td .ico {line-height:18px; height:20px; min-width:44px;}
	


}


/* 480px 이하 */
@media screen and (max-width:479px) {

    .bbs_search .select, .bbs_input .input {height: 45px;}
    .bbs_input .bt {min-width: 5em;}

    .notice_list {font-size:13px;}
	.notice_list > li > a {min-height:60px;}
	.notice_list > li > a:after {width:8px; height:8px; border-radius:3px; border-top-width:3px; border-right-width:3px; right:20px; margin-top:-1px;}
	.notice_list > li > a .date img {height:24px;}
	.notice_list > li > a .file img {max-height: 18px;}
	.notice_list > li > a .cate > span {line-height:20px; min-height:22px; font-size:12px;}
	.notice_list > li > a .date {min-width:90px;}
	.notice_list > li > a .status > span {line-height:22px; min-height:24px; font-size:12px;}
	.notice_list > li > a .txt_group img {height:18px;}
	.notice_list > li > a .txt_s {font-size:13px; padding-top:0px;}
    .notice_list > li > a .num {min-width:50px;}

	.notice_list > li > .toggle .manpower_pool .type {font-size:12px; width:44px;}
	.notice_list > li > .toggle .manpower_pool > div:not(:first-child) {padding-left:10px; margin-left:10px;}
	
	.board-list tr {padding:10px}
	.board-list .notice {font-size:12px;}
	.board-list .new {width:20px; height:20px;}
	.board-list .re_t {width:16px; height:12px;}


    .view_tit {padding:15px 5px; margin-bottom:10px;}
    .view_tit .v_tit {font-size:1.2em;}
	
	.view_tit .field {min-width:80px; height:25px; }
	.view_tit .cate { width:110px;}


    .attachments { padding-left:20px; padding-bottom:20px; background-size:15px auto; }
	.attachments > dd > ul > li > a {background-size:13px auto; background-position:right 2px; }

	.board_content {padding:20px 0px;}
	.code_area .code {width:70px; }


    .paging {margin:35px 0px 10px 0px; width:100%;}
    .paging a {width:30px; height:30px; margin:0px 2px; padding:0px;}
	.paging a.first:after, .paging a.prev:after, .paging a.last:after, .paging a.next:after {width:6px; height:6px; border-width:1px;}
	.paging a.first:before, .paging a.last:before {width:6px; height:6px; border-width:1px;}
    .paging a.first, .paging a.last {width:30px; height:30px;}
    .paging a.next {width:30px; height:30px; margin-left:0px;}
    .paging a.prev {width:30px; height:30px; margin-right:0px;}
    
    table th {word-break:break-all;}
	table td, table th {word-break:normal; overflow-wrap:break-word;}
	.m_th {width: 85px !important;}


	.movie_list > li {width:100%}
	.movie_list > li .movie::after {width:14vw; height:14vw}

	.photo_list2 > li > a {padding:10px}

	
	

}


