@charset "utf-8";
@import url("font.css");
/* style reset */

/*라디오박스*/
.radio_box, .check_box {position: relative; display: flex; display:-webkit-flex; flex-wrap:wrap; -webkit-flex-wrap:wrap; align-items: center;}
input[type=radio] + label ,
input[type=checkbox] + label {display:inline-block; vertical-align:middle}
input[type=radio],
input[type=checkbox] {border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:0}

.radio_box > li {margin: 10px 60px 10px 0;}
.radio_box > li:last-child {margin: 10px 0 !important;}
.radio_box input[type=radio] + label {position: relative; padding-left: 35px; display: block; color: #666; font-size: 14px; font-weight: 500; line-height: 22px; cursor:pointer; background-repeat: no-repeat; background-position: 0 0; background-image: url('../../images/web/icon_radio_off.png');}
.radio_box input[type=radio]:focus + label {outline: 2px solid #000; border-radius: 3px;}
.radio_box input[type=radio] + label::after, .radio_box input[type=radio] + label::before {content: ''; position: absolute; border-radius: 100%;}
.radio_box input[type=radio] + label::after {left: 0; top: 0; width: 20px; height: 20px; border: 1px solid #888;}
.radio_box input[type=radio] + label.on::before, 
.radio_box input[type=radio]:checked  + label::before {left: 7px; top: 7px; width: 8px; height: 8px; background-color: #666;}

/*체크박스*/
.check_box.all {justify-content: center;}
.check_box > li {margin: 10px 60px 10px 0;}
.check_box > li:last-child {margin: 10px 0 !important;}
.check_box input[type=checkbox] + label {position: relative; padding-left: 32px; display: block; line-height: 22px; color: #666; font-size: 14px; cursor:pointer;}
.check_box input[type=checkbox]:focus + label {outline: 2px solid #000; border-radius: 3px;}
.check_box input[type=checkbox] + label::before {content: ''; position: absolute; left: 0; top: 0; width: 20px; height: 20px; border: 1px solid #888; background-color: #fff; background-repeat: no-repeat; background-position: center center;}
.check_box input[type=checkbox] + label.on::before, 
.check_box input[type=checkbox]:checked  + label::before {background-image: url('../../images/web/icon_check.png');}
.check_box.box {justify-content: center;}
.check_box.box input[type=checkbox] + label {padding-left: 0; width: 22px; height: 22px; line-height: 0; color: transparent; font-size: 0;}
.check_box.good {justify-content: center;}
.check_box.good input[type=checkbox] + label {padding-left: 0; width: 30px; height: 25px; line-height: 0; color: transparent; font-size: 0; background-image: url('../../images/web/icon_good_off.png');}
.check_box.good input[type=checkbox] + label::before {display: none;}
.check_box.good input[type=checkbox] + label.on, 
.check_box.good input[type=checkbox]:checked  + label {background-image: url('../../images/web/icon_good_on.png');}

.optionbox, .inpbox {position: relative; height: 34px; border: 1px solid #888;}
textarea {position: relative; height: 100px; border: 1px solid #888;}
.optionbox {background-repeat: no-repeat; background-position: right 10px center; background-image: url('../../images/web/arrow_select.png');}
.calendarbox {display: flex; display:-webkit-flex; align-items: center;}
.calendarbox .inpbox .ui-datepicker-trigger {position: absolute; top: 0; right: 0; width: 40px; height: 100%; color: transparent; font-size: 0; line-height: 0; background-color: #888; background-repeat: no-repeat; background-position: center center; background-image: url('../../images/web/icon_calendar.png');}
.calendarbox .character {color: #666; font-size: 28px;}
.file_list li {margin-bottom: 5px; padding-left: 15px; background-repeat: no-repeat; background-position: left top 6px; background-image: url('../../images/web/icon_file2.png');}
.file_list li:last-child {margin-bottom: 0;}
.file_list li a {color: #666; font-size: 14px; text-decoration: underline; text-underline-position: under;}
.character {margin: 0 10px;}
.no_list {padding: 180px 0 240px !important; margin: 0 !important; width: 100% !important; border-bottom: 1px solid #222;}
.no_list p {padding-top: 220px; width: 100%; font-size: 24px; text-align: center; background-repeat: no-repeat; background-position: center top; background-image: url('../../images/web/icon_nolist.png');}

/*목록 상단검색 기본*/
.boardlist_top {margin-bottom: 60px; padding: 30px 10px; background-color: #fafafa;}
.boardlist_top > ul {display: flex; display:-webkit-flex; flex-wrap:wrap; -webkit-flex-wrap:wrap;}
.boardlist_top > ul > li {margin-bottom: 40px; padding: 0 10px; display: flex; display:-webkit-flex; align-items: center; width: 50%;}
.boardlist_top > ul.full > li {width: 100%;}
.boardlist_top > ul > li label {flex: none; width: 78px; font-weight: 500;}
.boardlist_top > ul li > div {margin-right: 10px;}
.boardlist_top > ul li > div:last-child {margin-right: 0;}
.boardlist_top > ul li .optionbox {width: 210px; max-width: 100%; height: 40px;}
.boardlist_top > ul li .inpbox {width: 100%; height: 40px;}
.boardlist_top > ul li .box {display: flex; display:-webkit-flex; width: 100%;}
.boardlist_top > ul li .box .optionbox {margin-right: 10px; flex: none;}
.boardlist_top > ul li .check_area > button {display: none;}
.boardlist_top > ul li .check_area .check_box > li {margin: 5px 20px 5px 0;}
.boardlist_top > ul li .check_area .check_box > li:last-child {margin: 5px 0 !important;}
.boardlist_top > ul li .check_area .check_box input[type=checkbox] + label {padding: 0 20px; min-width: 82px; width: auto; line-height: 34px; color: #444; text-align: center; background-color: #fff; border: 1px solid #d8d8d8; border-radius: 36px;}
.boardlist_top > ul li .check_area .check_box input[type=checkbox]:focus + label {border-radius: 36px;}
.boardlist_top > ul li .check_area .check_box input[type=checkbox] + label::before {display: none;}
.boardlist_top > ul li .check_area .check_box input[type=checkbox] + label.on, 
.boardlist_top > ul li .check_area .check_box input[type=checkbox]:checked  + label {color: #fff; font-weight: 500; background-color: #008ed7; border-color: #008ed7;}
.boardlist_top .category_box {padding: 20px; border-top: 1px solid #d8d8d8; border-bottom: 1px solid #d8d8d8; background-color: #fff;}
.boardlist_top .category_box .category_txt {color: #666; font-size: 14px;}
.boardlist_top .category_box .button_box {margin-top: 15px;}
.boardlist_top .button_box {margin-top: 20px;}
.boardlist_top .button_box button {margin-left: 20px;}

/*일반게시판 검색바*/
.board_top {margin-bottom: 15px; display: flex; display:-webkit-flex; justify-content: space-between; align-items: center;}
.board_top .all {color: #666;}
.board_top .all p {display: inline-block;}
.board_top .all span {color: #004096; font-weight: 500;}
.board_top .boardschbox {display: flex; display:-webkit-flex;}
.board_top .boardschbox .select_box {display: flex; display:-webkit-flex;}
.board_top .boardschbox .select_box .optionbox {margin-right: 10px; width: 140px; border-color: #b8b8b8;}
.board_top .boardschbox .select_box .optionbox select {font-size: 14px;}
.board_top .boardschbox .search_box {display: flex; display:-webkit-flex;}
.board_top .boardschbox .search_box .inpbox {width: 260px; border-color: #b8b8b8;}
.board_top .boardschbox .search_box .inpbox input.txt {padding: 0 10px; font-size: 14px;}
.board_top .boardschbox .search_box .btn_search {margin-left: 5px; width: 94px; background-color: #444; color: #fff; font-size: 14px; font-weight: 500;}
.board_top .boardschbox .search_box .btn_search .icon {position: relative; top: 1px; margin-right: 3px; display: inline-block; width: 13px; height: 14px;}
.board_top .boardschbox .search_box .btn_search .icon::after {width: 9px; height: 9px; border-width: 1px; border-color: #fff;}
.board_top .boardschbox .search_box .btn_search .icon::before {bottom: 2px; width: 7px; height: 1px; background-color: #fff;}
.board_top .radio_box.order > li {position: relative; margin: 0; width: 80px;}
.board_top .radio_box.order > li:last-child {margin: 0 !important;}
.board_top .radio_box.order > li input[type=radio] + label {padding-left: 0; width: 100%; color: #444; font-weight: 400; line-height: 34px; text-align: center; background: none; background-color: #fff;}
.board_top .radio_box.order > li input[type=radio] + label::after {left: -1px; top: -1px; width: 100%; height: 100%; border: 1px solid #d8d8d8; border-radius: 0;}
.board_top .radio_box.order > li:first-child input[type=radio] + label::after {border-radius: 18px 0 0 18px;}
.board_top .radio_box.order > li:last-child input[type=radio] + label::after {border-radius: 0 18px 18px 0;}
.board_top .radio_box.order input[type=radio] + label::before {display: none;}
.board_top .radio_box.order > li input[type=radio] + label.on, 
.board_top .radio_box.order > li input[type=radio]:checked  + label {z-index: 30; color: #008ed7;}
.board_top .radio_box.order > li input[type=radio] + label.on::after, 
.board_top .radio_box.order > li input[type=radio]:checked  + label::after {border-color: #008ed7;}

/*게시판(공지사항) 리스트*/
.boardlist {overflow: hidden; width: 100%; border-top: 3px solid #222;}
.boardlist * {transition:all 0.3s; -webkit-transition:all 0.3s; -moz-transition:all 0.3s; -o-transition:all 0.3s;}
.boardlist table {width:100%; table-layout:fixed;}
.boardlist table thead tr {border-bottom: 1px solid #666; background-color: #a8a8a8;}
.boardlist table thead tr th {padding: 17px 10px; color: #fff; font-weight: 600;}
.boardlist table tbody tr {border-bottom: 1px solid #d8d8d8;}
.boardlist table tbody tr:hover {background-color: #bbfbd3;}
.boardlist table tbody tr td {padding: 17px 10px; text-align: center;}
.boardlist table tbody tr td.m_hidden {display: table-cell !important;}
.boardlist table tbody tr.notice_line {background-color: #eef4fc;}
.boardlist table tbody tr.notice_line td.notice p {margin: 0 auto; width: 60px; color: #fff; font-size: 14px; font-weight: 600; line-height: 36px; background-color: #008ed7; border-radius: 36px;}
.boardlist table tbody tr td .tit {display: none;}
.boardlist table tbody tr td.title_box {}
.boardlist table tbody tr td.title_box a {display: block;}
.boardlist table tbody tr td.title_box .title {position: relative; padding-left: 35px; display: flex; display:-webkit-flex; align-items: center; justify-content: space-between;}
.boardlist table tbody tr td.title_box .title .new {position: absolute; left: 0; top: calc(50% - 13px);}
.boardlist table tbody tr td.title_box .title a {overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.boardlist table tbody tr td.title_box .title .re_num {margin-left: 10px; flex: none; display: block; width: 26px; height: 26px; color: #fff; font-size: 14px; font-weight: 600; line-height: 26px; background-color: #666; border-radius: 100%; font-family: 'Tahoma', 'Noto Sans KR', sans-serif;}
.boardlist table tbody tr td.title_box .title .secret {margin-left: 10px; flex: none;}
.boardlist table tbody tr.reply td.title_box .title {padding-left: 62px; background-repeat: no-repeat; background-position: left 35px center; background-image: url('../../images/web/icon_reply.png');}
.boardlist table tbody tr td.title_box .title.reply a span {font-weight: 500;}
.boardlist table tbody tr td .state {width: 82px; height: 36px; font-size: 14px; border-radius: 36px; line-height: 34px;}
.boardlist table tbody tr td .state.bg_white {font-weight: 500;}
.boardlist table tbody tr td .cancel {color: #ff0000; font-size: 13px; line-height: 13px;}
.boardlist table tbody tr td .color_blue u {font-weight: 500;}
.boardlist table tbody tr td .color_gray {font-size: 14px;}

/*하단 버튼*/
.button_box {margin-top: 60px; display: flex; display:-webkit-flex; align-items: center; justify-content: space-between;}
.button_box.top {margin: 60px 0;}
.button_box > div, .button_box > li {display: flex; display:-webkit-flex; align-items: center; width: 100%;}
.button_box .center {justify-content: center;}
.button_box .right {justify-content: flex-end;}
.button_box button {margin-left: 30px;}
.button_box button:first-child {margin-left: 0 !important;}

/*페이징*/
.paging {margin-top: 60px; display: flex; display:-webkit-flex; justify-content: center;}
.paging button {margin: 0 15px; display: block; width: 30px; height: 30px; color: #888; text-align:center; font-weight: 500; border: 1px solid #888; border-radius: 100%; background-repeat: no-repeat; background-position: center center; transition:all 0.3s; -webkit-transition:all 0.3s; -moz-transition:all 0.3s; -o-transition:all 0.3s;}
.paging button:hover, .paging button.on {font-weight: 500; color: #222;}
.paging button.btn-paging-first {background-image:url('../../images/web/paging_first.png');}
.paging button.btn-paging-pre {background-image: url('../../images/web/paging_prev.png');}
.paging button.btn-paging-next {background-image: url('../../images/web/paging_next.png');}
.paging button.btn-paging-last {background-image: url('../../images/web/paging_last.png');}

/*일반게시판 상세*/
.board_detail {border-top: 3px solid #222;}
.board_detail > div:nth-child(n+2) {border-bottom: 1px solid #888;}
.board_detail .title_box {position: relative; padding: 28px 20px; border-bottom: 1px solid #d8d8d8; background-color: #f6fff9;}
.board_detail .title_box .category {display: flex; display:-webkit-flex; flex-wrap:wrap; -webkit-flex-wrap:wrap;}
.board_detail .title_box .category li {margin-right: 35px; font-size: 14px;}
.board_detail .title_box .category li:last-child {margin-right: 0;}
.board_detail .title_box .category li.color_green {font-weight: 600;}
.board_detail .title_box h4 {font-size: 20px; line-height: 28px;}
.board_detail .title_box h4.color_blue {padding-right: 90px;}
.board_detail .title_box .check_box {position: absolute; right: 20px; top: calc(50% - 12px);}
.board_detail .title_box .btn5 {position: absolute; right: 20px; top: calc(50% - 18px); line-height: 34px; text-align: center;}
.board_detail .detail_box.bg {background-color: #fafafa;}
.board_detail .detail_box.flex {display: flex; display:-webkit-flex;}
.board_detail .detail_box.flex .img_box {padding: 30px 20px; flex: none;}
.board_detail .detail_box.flex .img_box img {width: 300px; border-radius: 5px;}
.board_detail .detail_box.flex .slide_box {padding: 30px 15px 30px 20px; width: 345px; flex: none;}
.board_detail .detail_box.flex .slide_box .slick-slider .slick-slide {margin-right: 5px;}
.board_detail .detail_box.flex .slide_box .slider-for {margin-bottom: 5px;}
.board_detail .detail_box.flex .slide_box .slider-for img {border-radius: 10px;}
.board_detail .detail_box.flex .slide_box .slider-nav .slick-slide div {overflow: hidden; display: flex; display:-webkit-flex; align-items: center; justify-content: center; height: 56px;}
.board_detail .detail_box.flex .slide_box .slider-nav .slick-slide:nth-child(1) img {border-radius: 5px 0 0 5px;}
.board_detail .detail_box.flex .slide_box .slider-nav .slick-slide:nth-child(4) img {border-radius: 0 5px 5px 0;}
.board_detail .detail_box > ul {border-bottom: 1px solid #d8d8d8;}
.board_detail .detail_box > ul:last-child {border-bottom: 0;}
.board_detail .detail_box .list_type {padding: 12px 20px;}
.board_detail .detail_box > .file_list {padding: 12px 20px 20px;}
.board_detail .list_type2 {padding: 30px 20px; background-color: #fafafa;}
.board_detail .list_type2 > dl {margin-bottom: 25px;}
.board_detail .list_type2 > dl:last-child {margin-bottom: 0;}
.board_detail .list_type2 > dl dd .list_type {padding: 0;}
.board_detail .list_type2 > dl dd .list_type li {margin-right: 30px; padding-right: 30px; color: #222; font-size: 16px;}
.board_detail .keyword {padding: 15px 20px; display: flex; display:-webkit-flex; flex-wrap:wrap; -webkit-flex-wrap:wrap;}
.board_detail .keyword li {margin-right: 20px; padding: 0 15px; color: #444; font-size: 14px; line-height: 34px; background-color: #f8f8f8; border: 1px solid #d8d8d8; border-radius: 36px;}
.board_detail .detail_box .keyword li:last-child {margin-right: 0;}
.board_detail .content_box > div {border-bottom: 1px solid #d8d8d8;}
.board_detail .content_box > div:last-child {border-bottom: 0;}
.board_detail .content_box .video_box {padding: 45px; background-color: #fafafa; border-bottom: 1px solid #d8d8d8;}
.board_detail .content_box .video_box.fix {z-index: 60; position: fixed; top: 0; left: 50%; transform: translateX(-50%); padding: 0; width: 640px;}
.board_detail .content_box .video_box .youtube {position: relative; padding-bottom: 56.25%; padding-top: 32px; height: 0;}
.board_detail .content_box .video_box .youtube iframe {position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0;}
.board_detail .content_box .video_box .video .video-js {height: 100%; width: 100%; border: 0;}
.board_detail .content_box .video_box .video .video-js .vjs-big-play-button {left: calc(50% - 45px); top: calc(50% - 22px); width: 60px; height: 60px; border: 3px solid #fff; border-radius: 100%;}
.board_detail .content_box .video_box .video .video-js .vjs-big-play-button .vjs-icon-placeholder:before {top: 5px;}
.board_detail .content_box .video_box.contents {overflow-y: auto; height: 100px;}
.board_detail .content_box .contents {padding: 20px;}
.board_detail .content_box .bg {background-color: #fafafa;}
.board_detail .content_box .condition dl {padding: 15px 20px; display: flex; display:-webkit-flex; align-items: center; border-bottom: 1px solid #d8d8d8;}
.board_detail .content_box .condition dl:last-child {border-bottom: 0;}
.board_detail .content_box .condition.bg dl:nth-child(2n) {background-color: #f5f8fc;}
.board_detail .content_box .condition dl dt {flex: none; width: 140px; font-weight: 500;}
.board_detail .content_box .condition dl dd {color: #666; font-size: 14px; line-height: 24px;}
.board_detail .content_box .list_type {padding: 15px 0; justify-content: center;}
.board_detail .content_box .list_type li {font-weight: 500; font-size: 16px;}
.board_detail .content_box.tabarea .tabmenu {margin-bottom: 0; padding: 10px 20px;}
.board_detail .content_box.tabarea .bg {display: none; border-bottom: 0;}
.board_detail .content_box.tabarea .bg.active {display: block;}

/*이전글 다음글*/
.view_bottom {margin-top: 100px; border-top: 1px solid #0372b8; border-bottom: 1px solid #0372b8;}
.view_bottom dl {padding: 20px 15px; display: flex; display:-webkit-flex; align-items: center;}
.view_bottom dl dt {position: relative; width: 150px; color: #008ed7; font-size: 14px; text-align: center; border: 1px solid #008ed7; border-radius: 42px;}
.view_bottom dl dt span {position: relative; padding-left: 40px; display: inline-block; line-height: 40px;}
.view_bottom dl dt span::after, .view_bottom dl dt span::before {content: ''; position: absolute;}
.view_bottom dl dt span::after {left: 0; top: calc(50% - 1px); width: 18px; height: 2px; background-color: #008ed7;}
.view_bottom dl dt span::before {top: calc(50% - 5px); width: 7px; height: 8px; border-top: 2px solid #008ed7; border-right: 2px solid #008ed7;}
.view_bottom dl.next {border-bottom: 1px solid #d8d8d8;}
.view_bottom dl.next dt span::before {left: 0; transform: rotate(-135deg);}
.view_bottom dl.prev dt span::before {left: 10px; transform: rotate(45deg);}
.view_bottom dl dd {padding-left: 55px; width: calc(100% - 150px);}
.view_bottom dl dd a {overflow: hidden; display: block; color: #666; text-overflow: ellipsis; white-space: nowrap;}

/*댓글입력*/
.comment_area {margin-top: 100px;}
.comment_area .write_box .button_box {margin-top: 20px;}
.comment_area .write_box .button_box .right .byte {color: #888;}
.comment_area .write_box .button_box .right button {margin-left: 20px;}
.comment_area .comment_write {position: relative; margin-bottom: 60px; border-top: 3px solid #666;}
.comment_area .comment_write .write_box .tareabox {padding: 10px; border-bottom: 1px solid #666;}
/*댓글목록*/
.comment_area .comment_list {border-top: 3px solid #222;}
.comment_area .comment_list > li {padding: 20px; border-bottom: 1px solid #d8d8d8;}
.comment_area .comment_list > li:last-child {border-bottom: 1px solid #666;}
.comment_area .comment_list > li .list_box {position: relative; margin-bottom: 20px; display: flex; display:-webkit-flex; align-items: center;}
.comment_area .comment_list > li .list_box .button_box {margin-top: 0; margin-left: 40px;}
.comment_area .comment_list > li .list_box .button_box button {margin-left: 10px;}
.comment_area .comment_list > li .text_box {padding: 15px; background-color: #fafafa;}
.comment_area .comment_list > li .text_box .name {margin-right: 5px; color: #004096; font-weight: 500;}
.comment_area .comment_list > li .text_box .name::before {content: '@';}
.comment_area .comment_list > li.reply {padding: 20px 20px 20px 50px;}
.comment_area .comment_list > li.reply .list_box .icon {position: absolute; left: -30px; top: calc(50% - 5px);}


/*게시판 글쓰기 타입1-일반글쓰기*/
.boardview {overflow:hidden; width: 100%;}
.boardview table {width: 100%; table-layout: fixed; border-top: 3px solid #333;}
.boardview table tr {border-bottom: 1px solid #d8d8d8;}
.boardview table tr th {position: relative; padding: 8px 20px; font-weight: 500; text-align: left; word-break: keep-all; border-right: 1px solid #d8d8d8; background-color: #f6fff9;}
.boardview table tr th span {position: relative;}
.boardview table tr th.point::after {content: '*'; position: absolute; right: 10px; color: #ff0000;}
.boardview table tr td {padding: 10px 20px; color: #666; font-size: 14px;}
.boardview table tr td > a {display: block;}
.boardview table tr td .optionbox {width: 210px;}
.boardview table tr td .optionbox select, .boardview table tr td .inpbox input.txt {color: #666; font-size: 14px;}
.boardview table tr td .character {font-size: 20px;}
.boardview table tr td .text {color: #888;}
.boardview table tr td .box {display: flex; display:-webkit-flex; align-items: center;}
.boardview table tr td .box.tel .optionbox, .boardview table tr td .box.tel .inpbox {width: 160px;}
.boardview table tr td .box.tel .character {width: 12px; height: 2px; background-color: #888;}
.boardview table tr td .box.email .inpbox {width: 210px;}
.boardview table tr td .box.email .optionbox {margin-left: 10px;}
.boardview table tr td .box .btn3 {margin-left: 10px;}
.boardview table tr td .box.address {margin-bottom: 10px;}
.boardview table tr td .box.address:last-child {margin-bottom: 0;}
.boardview table tr td .box.address .inpbox {margin-left: 10px; width: 300px;}
.boardview table tr td .box.address .inpbox:first-child {margin-left: 0;}
.boardview table tr td .box.address .btn3 {color: #fff; font-size: 14px; font-weight: 500; background-color: #444;}
.boardview table tr td .box.address .inpbox.post {width: 210px;}
.boardview table tr td .list_type li {padding: 0 60px 0 0;}
.boardview table tr td .list_type li:first-child {padding: 0 60px 0 0;}
.boardview table tr td .list_type li:last-child {padding: 0 0 0 60px;}
.boardview table tr td .list_type li::after {background-color: #222;}
.boardview table tr.editor td {padding: 10px 20px;}
.boardview table tr td .attachment-file-edit {width: 100%; align-items: center;}
.boardview table tr td .attachment-file {position:relative; overflow: hidden; margin-top: 10px; display: flex; display:-webkit-flex; align-items: center;}
.boardview table tr td .attachment-file:first-child {margin-top: 0;}
.boardview table tr td .attachment-file .ipfile {position: relative; margin-left: 10px; flex: none; width: 80px; height: 34px;}
.boardview table tr td .attachment-file .ipfile input[type="file"] {overflow: hidden; position:absolute; width: 1px; height: 1px; margin: -1px; cursor: pointer;}
.boardview table tr td .attachment-file .ipfile input.file {position:absolute; z-index:5; width:100%; height:100%; opacity:0; filter:alpha(opacity=0); cursor:pointer;}
.boardview table tr td .attachment-file .ipfile span {position: absolute; z-index: 2; display: block; left: 0; top: 0; color: #fff; width:100%; height:100%; text-align:center; background:#444; line-height:34px; font-size: 14px; cursor:pointer;}
.boardview table tr td .attachment-file .inpbox {position:relative; width: 210px;}
.boardview table tr td .attachment-file .button_box {margin-top: 0; margin-left: 10px;}
.boardview table tr td .attachment-file .button_box button {margin-left: 10px;}

.surveylist {border-top: 1px solid #e2e2e2; border-left: 1px solid #e2e2e2; border-right: 1px solid #e2e2e2;}
.surveylist dl {border-bottom: 1px solid #e2e2e2;}
.surveylist dl dt {padding: 10px; display: flex; display:-webkit-flex; font-size: 14px; line-height: 20px; background-color: #f5f8fc; border-bottom: 1px solid #e2e2e2;}
.surveylist dl dt .num {margin-right: 3px; flex: none;}
.surveylist dl dt .tit {}
.surveylist dl dt .tit p {}
.surveylist dl dt .tit p.ex {font-size: 13px;}
.surveylist dl dd {padding: 10px;}
.surveylist dl dd .radio_box {}
.surveylist dl dd .radio_box li {margin: 5px 0 !important; width: 100%;}

/*썸네일게시판*/
.thumbnaillist {overflow: hidden; width:100%; border-top: 3px solid #222;}
.thumbnaillist * {transition:all 0.3s; -webkit-transition:all 0.3s; -moz-transition:all 0.3s; -o-transition:all 0.3s;}
.thumbnaillist > li {overflow: hidden; position: relative; border-bottom: 1px solid #d8d8d8;}
.thumbnaillist > li:hover {background-color: #edf9f2;}
.thumbnaillist > li:last-child {border-color: #c0c1c3;}
.thumbnaillist > li a {padding: 35px 40px; display:flex; display:-webkit-flex;}
.thumbnaillist > li a .img_box {width: 300px; height: 210px; flex: none; background-repeat: no-repeat; background-position: center center; background-size: cover; border: 1px solid #888; border-radius: 10px;}
.thumbnaillist > li a .img_box.noimg {background-position: center; background-color: #d8d8d8; background-image: url('../../images/web/logo_w.png'); background-size: auto;}
.thumbnaillist > li a .text_box {overflow: hidden; position: relative; padding-left: 40px; width: 100%;}
.thumbnaillist > li a .text_box h3 {overflow: hidden; margin-bottom: 25px; font-size: 20px; text-overflow: ellipsis; white-space: nowrap;}
.thumbnaillist > li a .text_box .text {overflow: hidden; margin-bottom: 35px; display: -webkit-box; -webkit-box-orient: vertical; height: 78px; -webkit-line-clamp: 3;}

/*갤러리형 게시판*/
.gallaylist {overflow: hidden; padding: 15px 0 10px; display:flex; display:-webkit-flex; flex-wrap:wrap; -webkit-flex-wrap:wrap; border-top: 3px solid #222; border-bottom: 1px solid #666;}
.gallaylist * {transition:all 0.3s; -webkit-transition:all 0.3s; -moz-transition:all 0.3s; -o-transition:all 0.3s;}
.gallaylist > li {position: relative; margin: 25px 52px 25px 0; width: calc(25% - 39px);}
.gallaylist > li:nth-child(4n) {margin: 25px 0;}
.gallaylist > li .check_box.good {z-index: 55; position: absolute; left: 10px; top: 10px;}
.gallaylist > li .check_box.good input[type=checkbox] + label {width: 20px; height: 16px; background-size: 100%;}
.gallaylist > li a {position: relative; display: block;}
.gallaylist > li a .img_box {width: 100%; height: 210px; background-repeat: no-repeat; background-position: center center; background-size: cover; border: 1px solid #888; border-radius: 10px;}
.gallaylist > li a .img_box.noimg {background-position: center; background-color: #d8d8d8; background-image: url('../../images/web/logo_w.png'); background-size: auto;}
.gallaylist > li a .text_box {padding-top: 15px; height: 140px;}
.gallaylist > li a .text_box .categoty {overflow: hidden; margin-bottom: 5px; color: #444; text-align: center; text-overflow: ellipsis; white-space: nowrap;}
.gallaylist > li a .text_box h3 {overflow: hidden; margin-bottom: 15px; display: -webkit-box; -webkit-box-orient: vertical; height: 52px; -webkit-line-clamp: 2; font-size: 18px; font-weight: 400; text-align: center;}
.gallaylist > li a .text_box .list_type li {margin-right: 25px; padding-right: 25px;}
.gallaylist > li a .text_box .other .name {color: #666; text-align: center;}
.gallaylist > li a .text_box .other .keyword {display: flex; display:-webkit-flex; flex-wrap:wrap; -webkit-flex-wrap:wrap; justify-content: center;}
.gallaylist > li a .text_box .other .keyword li {margin-right: 5px; color: #004096; font-size: 14px; font-weight: 500;}
.gallaylist > li a .text_box .other .keyword li:last-child {margin-right: 0;}
.gallaylist > li a .text_box .other .keyword li::before {content: '#';}
.gallaylist > li a::after {content: ''; position: absolute; left: 0; top: 0;}
.gallaylist > li:hover a {background-color: #edf9f2;}
.gallaylist > li:hover a::after {height: calc(100% - 4px) !important; width: calc(100% - 4px) !important; border: 2px solid #02973a !important;}
.gallaylist > li.no_list {border-bottom: 0 !important;}
.gallaylist.hover > li:hover a .img_box {border-radius: 0; border-width: 0;}
.gallaylist.hover > li:hover a .text_box {padding: 0 20px; display:flex; display:-webkit-flex; align-items: center; justify-content: center;}
.gallaylist.hover > li:hover a .text_box .categoty {position: absolute; opacity: 0; transform: scale(0);}
.gallaylist.hover > li:hover a .text_box h3 {margin-bottom: 0; max-height: 60px; height: auto; font-size: 20px; font-weight: 500; line-height: 30px;}
.gallaylist.hover > li:hover a .text_box .list_type {position: absolute; opacity: 0; transform: scale(0);}
.gallaylist.hover > li:hover a .text_box .other {position: absolute; opacity: 0; transform: scale(0);}
/*갤러리형 게시판 오프라인교육*/
.gallaylist.type2 > li a::after {height: calc(100% - 2px); width: calc(100% - 2px); border: 1px solid #888; border-radius: 10px;}
.gallaylist.type2 > li a .text_box {padding: 25px 20px; height: 280px; display:flex; display:-webkit-flex; flex-flow: column; justify-content: space-between;}
.gallaylist.type2 > li a .text_box .title {position: relative;}
.gallaylist.type2 > li a .text_box .title .info {margin-bottom: 20px;}
.gallaylist.type2 > li a .text_box .title .info .year {font-size: 14px; font-weight: 500;}
.gallaylist.type2 > li a .text_box .title .info .day {font-size: 18px; font-weight: 600;}
.gallaylist.type2 > li a .text_box .title .info .btn5 {position: absolute; right: 0; top: 0; line-height: 34px; text-align: center;}
.gallaylist.type2 > li a .text_box h3 {font-weight: 500; text-align: left;}
.gallaylist.type2 > li a .text_box .list_type li {padding: 0 25px 0 0; margin-right: 25px; color: #888; font-size: 16px;}

.textlist {border-top: 3px solid #222;}
.textlist * {transition:all 0.3s; -webkit-transition:all 0.3s; -moz-transition:all 0.3s; -o-transition:all 0.3s;}
.textlist > li {position: relative; padding: 0 20px; display:flex; display:-webkit-flex; align-items: center; min-height: 82px; border-bottom: 1px solid #d8d8d8;}
.textlist > li:nth-child(2n) {background-color: #f5f8fc;}
.textlist > li a {padding: 30px 0; display: block; width: 100%;}
.textlist > li a .btn5 {text-align: center; line-height: 34px;}
.textlist > li .txt {color: #666; font-size: 16px; font-weight: 400;}
.textlist > li .title {position: relative; width: 100%;}
.textlist > li .title h3 {font-size: 18px;}
.textlist > li .title h3 span {display: block;}
.textlist > li .title p {color: #666; font-size: 14px;}
.textlist > li .title .date {margin-left: 40px; flex: none; color: #888;}
.textlist > li .icon {flex: none; width: 50px; height: 50px; background-repeat: no-repeat; background-position: center center; border: 1px solid #666; border-radius: 100%;}
.textlist > li button.icon {background-image: url('../../images/web/icon_arrow2.png');}
.textlist > li a .info {margin-bottom: 15px; display:flex; display:-webkit-flex; align-items: center;}
.textlist > li a .info .btn5 {margin-right: 30px;}
.textlist > li a .info .txt {font-weight: 500;}
.textlist > li .text {overflow: hidden; margin-bottom: 10px; display: -webkit-box; -webkit-box-orient: vertical; max-height: 72px; -webkit-line-clamp: 3; white-space: inherit; color: #888; line-height: 24px;}
.textlist > li a .list_type > li {color: #888; font-size: 16px;}
.textlist > li a .list_type > li .keyword {margin: 0;}
.textlist > li a .list_type > li .keyword li {margin: 5px 20px 5px 0;}
.textlist > li a .keyword {display: flex; display:-webkit-flex; flex-wrap:wrap; -webkit-flex-wrap:wrap;}
.textlist > li a .keyword li {margin: 5px 20px 0 0; padding: 0 20px; color: #444; font-size: 14px; line-height: 34px; border: 1px solid #d8d8d8; border-radius: 36px;}
.textlist > li a .keyword li span::before {content: '#';}
.textlist > li .nav {display: flex; display:-webkit-flex; flex-wrap:wrap; -webkit-flex-wrap:wrap;}
.textlist > li .nav li {font-size: 14px;}
.textlist > li .nav li::after {content: '>'; margin: 0 15px;}
.textlist > li .nav li:last-child::after {content: ''; margin: 0;}
.textlist > li:hover .title h3 {color: #008ed7;}
.textlist > li:hover .title p {color: #008ed7;}
.textlist > li:hover .icon {border-color: #008ed7;}
.textlist > li:hover button.icon {background-image: url('../../images/web/icon_arrow2_on.png');}
.textlist.contract > li .title {padding: 15px 20px 15px 55px; background-repeat: no-repeat; background-position: left center; background-image: url('../../images/web/icon_text_off.png');}
.textlist.contract > li:hover .title {background-image: url('../../images/web/icon_text_on.png');}
.textlist.faq > li .title {padding: 15px 0 15px 20px;}
.textlist.faq > li .icon {background-image: url('../../images/web/icon_q.png');}
.textlist.faq > li:hover .icon {background-image: url('../../images/web/icon_q_on.png');}
.textlist.work > li .check_box.good {position: absolute; right: 20px; top: 30px;}
.textlist.work > li a .title {margin-bottom: 15px;}
.textlist.work > li a .title h3 {color: #008ed7; font-size: 20px;}
.textlist.work > li a .list_type {margin-bottom: 35px;}
.textlist.work > li a .list_type2 {margin-bottom: 20px;}
.textlist.work > li a.thumbnail {padding-left: 200px;}
.textlist.work > li a.thumbnail .img_box {position: absolute; left: 20px; top: 30px; width: 160px; height: 160px; border: 1px solid #c8c8c8; border-radius: 5px; background-repeat: no-repeat; background-size: cover; background-position: center center;}
.textlist.total > li a .title {margin-bottom: 15px; display:flex; display:-webkit-flex; align-items: center;}
.textlist.total > li a .title h3 {overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 20px;}
.textlist.total > li a .title .btn5 {margin-left: 30px; flex: none;}
.textlist.total > li a .list_type {margin-bottom: 40px;}
.textlist.total > li a .list_type li {margin-right: 30px; padding-right: 30px;}
.textlist.total > li a .text {margin-bottom: 20px;}
.textlist.total > li a .nav {margin-top: 40px;}

/*상세보기 일반 테이블(세로)*/
.tablebasic {clear:both; overflow-x: auto; border-top: 3px solid #888;}
.tablebasic table {width:100%; table-layout:fixed;}
.tablebasic table thead tr {border-bottom-color: transparent;}
.tablebasic table tbody tr:last-child {border-bottom: 1px solid #888;}
.tablebasic table tr {border-bottom: 1px solid #f0f0f0;}
.tablebasic table tr th {padding: 15px; font-weight: 500; text-align: center; background-color: #f4f4f4;}
.tablebasic table tr td {padding: 15px; text-align: center;}
.tablebasic table tr td:last-child {border-right-width: 0;}
.tablebasic table tr td.line {border-right-width: 1px;}

/*게시판 E*/

@media screen and (max-width:1400px) {
    .board_top {padding: 0 10px;}
    /*페이징*/
    .paging {padding: 0 10px;}
    
    .button_box {padding: 0 10px;}
    
    /*갤러리형 게시판*/
    .gallaylist {padding: 15px 10px 10px;}
    .gallaylist > li {margin: 10px 16px 10px 0; width: calc(25% - 12px);}
    .gallaylist > li:nth-child(4n) {margin: 10px 0;}
    .gallaylist > li a .img_box {height: 180px;}
    .gallaylist.type2 > li a .text_box .list_type li {padding: 0 10px 0 0; margin-right: 10px;}
}
@media screen and (max-width:1200px) {
    .radio_box > li {margin: 5px 60px 5px 0;}
    .radio_box input[type=radio] + label {padding-left: 30px; line-height: 20px;}
    .radio_box input[type=radio] + label::after {width: 18px; height: 18px;}
    .radio_box input[type=radio] + label.on::before, 
    .radio_box input[type=radio]:checked  + label::before {width: 7px; height: 7px;}
    
    .check_box > li {margin: 5px 30px 5px 0;}
    .check_box input[type=checkbox] + label {padding-left: 25px; line-height: 20px;}
    .check_box input[type=checkbox] + label::before {width: 18px; height: 18px; background-size: 13px;}
    .check_box.box input[type=checkbox] + label {width: 20px; height: 20px;}
    .check_box.good input[type=checkbox] + label {width: 20px; height: 17px; background-size: 20px;}
    .check_box.good input[type=checkbox] + label.on::before, 
    .check_box.good input[type=checkbox]:checked  + label::before {background-size: 20px;}
    
    .file_list li {background-position: left top 4px;}
    .no_list {padding: 80px 0 100px !important;}
    .no_list p {padding-top: 130px; font-size: 18px; background-size: 150px;;}
    
    /*목록 상단검색 기본*/
    .boardlist_top {margin-bottom: 40px; padding: 10px;}
    .boardlist_top > ul li {margin-bottom: 10px; padding: 0; width: 100%; flex-wrap:wrap; -webkit-flex-wrap:wrap;}
    .boardlist_top > ul li label {margin-bottom: 5px; width: 100%;}
    .boardlist_top > ul li > div {margin-right: 0; margin-bottom: 10px;}
    .boardlist_top > ul li > div:last-child {margin-bottom: 0;}
    .boardlist_top > ul li .optionbox select, .boardlist_top > ul li .inpbox input {font-size: 14px;}
    .boardlist_top > ul li .optionbox {width: 100%; height: 34px;}
    .boardlist_top > ul li .inpbox {height: 34px;}
    .boardlist_top > ul li .check_area {z-index: 90; position: relative; width: 100%;}
    .boardlist_top > ul li .check_area > button {position: relative; padding: 0 10px; display: block; width: 100%; height: 34px; color: #666; font-size: 14px; text-align: left; border: 1px solid #888;}
    .boardlist_top > ul li .check_area > button::after {content: ''; position: absolute; right: 10px; top: calc(50% - 4px); width: 14px; height: 8px; background-repeat: no-repeat; background-position: center center; background-image: url('../../images/web/arrow_select.png');}
    .boardlist_top > ul li .check_area.open > button::after {transform: rotate(180deg);}
    .boardlist_top > ul li .check_area .check_box {position: absolute; left: 0; top: 38px; width: 100%; display: none; border: 1px solid #888;}
    .boardlist_top > ul li .check_area.open .check_box {display: block;}
    .boardlist_top > ul li .check_area .check_box > li {margin: 0;}
    .boardlist_top > ul li .check_area .check_box > li:last-child {margin: 0 !important;}
    .boardlist_top > ul li .check_area .check_box input[type=checkbox] + label {padding: 0 10px; margin: 0; min-width: 100%; width: auto; line-height: 34px; color: #222; text-align: left; background-color: #f8f8f8; border: 0; border-radius: 0;}
    .boardlist_top > ul li .check_area .check_box input[type=checkbox]:focus + label {border-radius: 0;}
    .boardlist_top > ul li .check_area .check_box input[type=checkbox] + label::before {display: none;}
    .boardlist_top > ul li .check_area .check_box input[type=checkbox] + label.on, 
    .boardlist_top > ul li .check_area .check_box input[type=checkbox]:checked  + label {color: #fff; font-weight: 500; background-color: #008ed7; border-color: #008ed7;}
    .boardlist_top .category_box {padding: 10px;}
    .boardlist_top .button_box button {margin-left: 10px;}

    /*일반게시판 검색바*/
    .board_top {margin-bottom: 15px; display: block; display:-webkit-block;}
    .board_top .all {margin-bottom: 15px;}
    .board_top .all p {display: block;}
    .board_top .boardschbox {display: flex; display:-webkit-flex;}
    .board_top .boardschbox .select_box {display: flex; display:-webkit-flex; flex: none;}
    .board_top .boardschbox .search_box {width: 100%;}
    .board_top .boardschbox .search_box .inpbox {width: calc(100% - 95px);}
    .board_top .radio_box.order > li {width: 33.33%;}
    .board_top .radio_box.order > li input[type=radio] + label {padding-left: 0; width: 100%; color: #444; font-weight: 400; line-height: 34px; text-align: center; background: none; background-color: #fff;}
    .board_top .radio_box.order > li input[type=radio] + label::after {left: -1px; top: -1px; width: 100%; height: 100%; border: 1px solid #d8d8d8; border-radius: 0;}
    .board_top .radio_box.order > li:first-child input[type=radio] + label::after {border-radius: 18px 0 0 18px;}
    .board_top .radio_box.order > li:last-child input[type=radio] + label::after {border-radius: 0 18px 18px 0;}
    .radio_box input[type=radio] + label::before {display: none;}
    .board_top .radio_box.order > li input[type=radio] + label.on, 
    .board_top .radio_box.order > li input[type=radio]:checked  + label {z-index: 30; color: #008ed7;}
    .board_top .radio_box.order > li input[type=radio] + label.on::after, 
    .board_top .radio_box.order > li input[type=radio]:checked  + label::after {border-color: #008ed7;}

    /*게시판(공지사항) 리스트*/
    .boardlist table {display: block;}
    .boardlist table thead {display: none;}
    .boardlist table tbody {display: block;}
    .boardlist table tbody tr {position: relative; padding: 10px 30px 10px 10px; display: flex; display:-webkit-flex; flex-wrap:wrap; -webkit-flex-wrap:wrap; line-height: 24px;}
    .boardlist table tbody tr td {padding: 0; display: flex; display:-webkit-flex; flex-wrap:wrap; -webkit-flex-wrap:wrap; align-items: center; text-align: left; color: #888; font-size: 14px;}
    .boardlist table tbody tr td.m_hidden {display: none !important;}
    .boardlist table tbody tr.notice_line td.notice {margin-right: 10px;}
    .boardlist table tbody tr.notice_line td.notice p {width: 50px; font-size: 12px; line-height: 24px; text-align: center;}
    .boardlist table tbody tr td.check {margin-right: 10px;}
    .boardlist table tbody tr td.category {color: #222; font-size: 16px;}
    .boardlist table tbody tr td .tit {display: block; line-height: 20px; color: #444;}
    .boardlist table tbody tr td .tit::after {content: ':'; margin: 0 3px;}
    .boardlist table tbody tr td.al {width: 100%;}
    .boardlist table tbody tr td.title_box {padding: 5px 0; width: 100%;}
    .boardlist table tbody tr td.title_box .title {position: inherit; padding-left: 0;}
    .boardlist table tbody tr td.title_box .title .new {left: inherit; right: 10px; top: 13px; width: 19px;}
    .boardlist table tbody tr td.title_box .title a {display: -webkit-box; -webkit-box-orient: vertical; max-height: 38px; -webkit-line-clamp: 2; white-space: inherit; line-height: 19px;}
    .boardlist table tbody tr td.title_box .title .re_num {position: absolute; right: 10px; width: 19px; height: 19px; font-size: 12px; line-height: 19px; text-align: center;}
    .boardlist table tbody tr td.title_box .title .secret {position: absolute; right: 10px; width: 19px;}
    .boardlist table tbody tr.reply {padding-left: 35px; background-position: left 10px center; background-image: url('../../images/web/icon_reply.png'); background-repeat: no-repeat;}
    .boardlist table tbody tr.reply td.title_box .title {padding-left: 0; background: none;}
    .boardlist table tbody tr td .state {width: auto; height: auto; border-radius: 0; line-height: 19px; border: 0;}
    .boardlist table tbody tr td .state.bg_white {font-weight: 500;}
    .boardlist table tbody tr td .cancel {display: inline-block;}
    .boardlist table tbody tr td button {font-size: 14px;}
    .boardlist table tbody tr td.line {position: relative; margin-right: 16px; padding-right: 18px;}
    .boardlist table tbody tr td.line::after {content: ''; position: absolute; right: 0; top: calc(50% - 1px); width: 2px; height: 2px; background-color: #888;  border-radius: 100%;}
    .boardlist table tbody tr td.right {position: absolute; right: 10px; bottom: 12px;}
    .boardlist table tbody tr td.right img {width: 16px;}
    .boardlist table tbody tr td .color_blue {font-size: 13px;}
    .boardlist table tbody tr td .color_gray {font-size: 12px;}

    /*하단 버튼*/
    .button_box {margin-top: 30px; display: block; display:-webkit-block;}
    .button_box.top {margin: 30px 0;}
    .button_box.mb80 {margin-bottom: 40px !important;}
    .button_box > div {margin-bottom: 10px; display: flex; display:-webkit-flex; align-items: center; width: 100%;}
    .button_box > div:last-child {margin-bottom: 0;}
    .button_box button {margin-left: 10px; width: 100%;}

    /*페이징*/
    .paging {margin-top: 30px;}
    .paging button {margin: 0 10px; width: 25px; height: 25px; background-size: auto 11px; line-height: 23px;}
    
    /*일반게시판 상세*/
    .board_detail .title_box {padding: 10px;}
    .board_detail .title_box .category {padding-right: 30px;}
    .board_detail .title_box h4 {padding-right: 0 !important; line-height: 24px;}
    .board_detail .title_box h4.color_blue {text-align: center;}
    .board_detail .title_box .check_box {position: relative; right: inherit; top: 0; margin-top: 10px;}
    .board_detail .title_box .btn5 {position: relative; right: inherit; top: 0; margin: 10px auto 0; width: 70px; height: 30px; line-height: 28px;}
    .board_detail .detail_box.flex {display: block; display:-webkit-block;}
    .board_detail .detail_box.flex .img_box {padding: 15px 10px;}
    .board_detail .detail_box.flex .img_box img {width: 100%;}
    .board_detail .detail_box.flex .slide_box {padding: 15px 10px; margin: 0 auto; width: 185px;}
    .board_detail .detail_box.flex .slide_box .slick-slider .slick-slide {margin: 0 2px;}
    .board_detail .detail_box.flex .slide_box .slider-for {margin-bottom: 5px;}
    .board_detail .detail_box.flex .slide_box .slider-for img {border-radius: 5px;}
    .board_detail .detail_box.flex .slide_box .slider-nav .slick-slide div {height: 30px;}
    .board_detail .detail_box.flex .slide_box .slider-nav .slick-slide:nth-child(1) img {border-radius: 3px 0 0 3px;}
    .board_detail .detail_box.flex .slide_box .slider-nav .slick-slide:nth-child(4) img {border-radius: 0 3px 3px 0;}
    .board_detail .detail_box .list_type {padding: 15px 10px;}
    .board_detail .list_type2 {padding: 15px 10px;}
    .board_detail .list_type2 > dl {margin-bottom: 15px;}
    .board_detail .keyword {padding: 5px;}
    .board_detail .keyword li {margin: 5px; padding: 0 15px; font-size: 12px; line-height: 28px;}
    .board_detail .detail_box > .file_list {padding: 15px 10px;}
    .board_detail .content_box .video_box {padding: 20px;}
    .board_detail .content_box .contents {padding: 15px 10px;}
    .board_detail .content_box .condition dl {padding: 15px 10px; display: block; display:-webkit-block;}
    .board_detail .content_box .condition dl dt {width: 100%;}
    .board_detail .content_box.tabarea .tabmenu .menu li button {height: 45px;}
    
    /*이전글 다음글*/
    .view_bottom {margin-top: 50px;}
    .view_bottom dl {padding: 10px;}
    .view_bottom dl dt {width: 30px; height: 30px; font-size: 0; color: transparent; border-radius: 100%;}
    .view_bottom dl dt span {padding-left: 0; display: block; line-height: 30px;}
    .view_bottom dl dt span::after {left: calc(50% - 7px); top: calc(50% - 1px); width: 14px;}
    .view_bottom dl dt span::before {top: calc(50% - 5px); width: 7px; height: 7px;}
    .view_bottom dl.next dt span::before {left: 8px;}
    .view_bottom dl.prev dt span::before {left: 11px;}
    .view_bottom dl dd {padding-left: 10px; width: calc(100% - 30px);}

    /*댓글입력*/
    .comment_area {margin-top: 50px;}
    .comment_area .write_box .button_box {margin-top: 10px;}
    .comment_area .write_box .button_box .right button {margin-left: 10px;}
    .comment_area .comment_write {margin-bottom: 30px;}
    /*댓글목록*/
    .comment_area .comment_list > li {padding: 10px;}
    .comment_area .comment_list > li .list_box {margin-bottom: 10px; display: block; display:-webkit-block;}
    .comment_area .comment_list > li .list_box .list_type {margin-bottom: 5px;}
    .comment_area .comment_list > li .list_box .button_box {margin-left: 0; padding: 0; width: 100%;}
    .comment_area .comment_list > li .list_box .button_box button {margin-left: 5px;}
    .comment_area .comment_list > li .text_box {padding: 10px;}
    .comment_area .comment_list > li.reply {padding: 10px;}
    .comment_area .comment_list > li.reply .list_box .icon {position: absolute; left: 0; top: 6px;}
    .comment_area .comment_list > li.reply .list_box .list_type {padding-left: 30px;}
    
    /*게시판 글쓰기 타입1-일반글쓰기*/
    .boardview table {display: block;}
    .boardview table tbody {display: block;}
    .boardview table tr {display: block; border-bottom: 1px solid #666;}
    .boardview table tr th {padding: 10px; display: block; width: 100%; border-right-width: 0; border-bottom: 1px solid #d8d8d8; background-color: #f6fff9;}
    .boardview table tr td {padding: 10px; display: block;}
    .boardview table tr td .optionbox {width: 100% !important;}
    .boardview table tr td .box.tel .optionbox, .boardview table tr td .box.tel .inpbox {width: 100%;}
    .boardview table tr td .box.tel .character {flex: none;}
    .boardview table tr td .box.email {flex-wrap:wrap; -webkit-flex-wrap:wrap; justify-content: space-between;}
    .boardview table tr td .box.email .inpbox {width: calc(100% - 25px);}
    .boardview table tr td .box.email .character {margin: 0;}
    .boardview table tr td .box.email .optionbox {margin-left: 0;}
    .boardview table tr td .box.email > div:nth-child(n+3) {margin-top: 5px; width: calc(50% - 5px);}
    .boardview table tr td .box.address .inpbox {width: 100%;}
    .boardview table tr.editor td {padding: 10px;}
    .boardview table tr td .attachment-file {margin-top: 5px;}
    .boardview table tr td .attachment-file .inpbox {width: 100% !important;}
    .boardview table tr td .attachment-file .button_box {padding: 0; display: flex; display:-webkit-flex;}
    .boardview table tr td .attachment-file .button_box button {margin-left: 5px;}
    
    /*썸네일게시판*/
    .thumbnaillist > li a {padding: 25px 10px;}
    .thumbnaillist > li a .img_box {width: 214px; height: 150px;}
    .thumbnaillist > li a .text_box {padding-left: 20px;}
    .thumbnaillist > li a .text_box h3 {margin-bottom: 15px;}
    .thumbnaillist > li a .text_box .text {margin-bottom: 15px; height: 69px;}
    
    /*갤러리형 게시판*/
    .gallaylist {padding: 15px 10px 10px;}
    .gallaylist > li {margin: 10px 16px 10px 0; width: calc(25% - 12px);}
    .gallaylist > li:nth-child(4n) {margin: 10px 0;}
    .gallaylist > li a .img_box {height: 140px;}
    .gallaylist > li a .text_box {padding-top: 15px; height: auto;}
    .gallaylist > li a .text_box .categoty {margin-bottom: 5px; color: #888; font-size: 14px;}
    .gallaylist > li a .text_box h3 {margin-bottom: 15px; height: 46px;}
    /*갤러리형 게시판 오프라인교육*/
    .gallaylist.type2 {padding: 5px;}
    .gallaylist.type2 > li {margin: 0 !important; padding: 10px 5px; width: 50%;}
    .gallaylist.type2 > li a::after {border-radius: 5px;}
    .gallaylist.type2 > li a .text_box {padding: 10px; height: 185px;}
    .gallaylist.type2 > li a .text_box .title .info {margin-bottom: 10px;}
    .gallaylist.type2 > li a .text_box .title .info .btn5 {width: 80px; height: 35px; line-height: 33px;}
    
    .textlist > li {padding: 5px; min-height: auto;}
    .textlist > li a {padding: 5px;}
    .textlist > li .icon {width: 40px; height: 40px; background-size: 18px;}
    .textlist > li .txt {font-size: 14px;}
    .textlist > li .text {max-height: 54px; font-size: 14px; line-height: 18px;}
    .textlist > li .title .date {margin-left: 0; margin-top: 10px; font-size: 14px;}
    .textlist > li a .list_type li .keyword li {margin: 5px 10px 5px 0;}
    .textlist > li a .keyword li {margin: 10px 10px 0 0; font-size: 12px; line-height: 28px;}
    .textlist.contract > li .title {padding: 0 10px 0 0; background-image: none;}
    .textlist.faq > li {padding: 15px 10px; flex-wrap:wrap; -webkit-flex-wrap:wrap; justify-content: center;}
    .textlist.faq > li .title {padding: 0; text-align: center;}
    .textlist.faq > li .icon {margin-bottom: 5px;}
    .textlist.work > li .check_box.good {right: 10px; top: 15px;}
    .textlist.work > li a .info {margin-bottom: 10px;}
    .textlist.work > li a .info .btn5 {margin-right: 10px; height: 30px; line-height: 28px;}
    .textlist.work > li a .title {margin-bottom: 10px;}
    .textlist.work > li a .list_type {margin-bottom: 15px;}
    .textlist.work > li a .list_type li {font-size: 14px;}
    .textlist.work > li a .list_type2 > dl {display: flex; display:-webkit-flex;}
    .textlist.work > li a .list_type2 > dl dt {width: 90px;}
    .textlist.work > li a.thumbnail {padding-left: 155px;}
    .textlist.work > li a.thumbnail .img_box {left: 10px; top: 10px; width: 138px; height: 138px;}
    .textlist.total > li a .title {display:block; display:-webkit-block;}
    .textlist.total > li a .title h3 {overflow: hidden; text-overflow: inherit; display: -webkit-box; -webkit-box-orient: vertical; max-height: 50px; -webkit-line-clamp: 2; white-space: inherit; line-height: 25px;}
    .textlist.total > li a .title .btn5 {margin-left: 0; margin-top: 15px; flex: none; height: 35px;}
    .textlist.total > li a .list_type {margin-bottom: 20px;}
    .textlist.total > li a .list_type li {margin-right: 15px; padding-right: 15px; font-size: 14px;}
    .textlist.total > li a .nav {margin-top: 30px;}
    
    .tablebasic table tr th {padding: 10px;}
    .tablebasic table tr td {padding: 10px;}
}
@media screen and (max-width:784px){
    /*갤러리형 게시판*/
    .gallaylist {padding: 0;}
    .gallaylist.hover > li {margin: 0 !important; padding: 25px 5px 25px 10px; width: 50%; border-bottom: 1px solid #d8d8d8;}
    .gallaylist.hover > li:nth-child(2n) {padding: 25px 10px 25px 5px;}
    .gallaylist > li a .img_box {height: 210px;}
}
@media screen and (max-width:640px){

    /*일반게시판 검색바*/
    .board_top .boardschbox {flex-wrap:wrap; -webkit-flex-wrap:wrap;}
    .board_top .boardschbox .select_box {margin-bottom: 10px; width: 100%;}
    .board_top .boardschbox .select_box .optionbox {width: 100%;}
    .board_top .boardschbox .select_box .optionbox:last-child {margin-right: 0;}
    
    .board_detail .content_box .list_type {padding: 15px 0; display:block; display:-webkit-block;}
    .board_detail .content_box .list_type li {margin: 0; padding: 0; text-align: center;}
    
    .boardview table tr td .box.address {flex-wrap:wrap; -webkit-flex-wrap:wrap;}
    .boardview table tr td .box.address .inpbox {margin-left: 0; margin-top: 10px;}
    .boardview table tr td .box.address .inpbox:first-child {margin-top: 0;}
    .boardview table tr td .box.address .inpbox.post {width: calc(100% - 90px);}
    
    /*썸네일게시판*/
    .thumbnaillist > li a {padding: 25px 10px 15px; display:block; display:-webkit-block;}
    .thumbnaillist > li a .img_box {margin: 0 auto 20px; width: 185px; height: 135px;}
    .thumbnaillist > li a .text_box {padding-left: 0; height: auto;}
    .thumbnaillist > li a .text_box .text {max-height: 92px; height: auto; -webkit-line-clamp: 4;}
    
    /*갤러리형 게시판*/
    .gallaylist > li a .img_box {height: 160px;}
    /*갤러리형 게시판 오프라인교육*/
    .gallaylist.type2 > li {width: 100%;}
    .gallaylist.type2 > li a .text_box {height: auto;}
    .gallaylist.type2 > li a .text_box h3 {height: auto; max-height: 46px;}
    
    .textlist.work > li a.thumbnail {padding-left: 5px;}
    .textlist.work > li a.thumbnail .img_box {position: relative; left: 0; top: 0; margin: 0 auto 10px;}
    .textlist.work > li a .list_type2 {margin-bottom: 5px;}
}
@media screen and (max-width:480px){
    .calendarbox .inpbox .ui-datepicker-trigger {width: 25px; background-size: 15px;}
    .calendarbox .character {margin: 0 5px; font-size: 20px;}

    /*목록 상단검색 기본*/
    .boardlist_top > ul li .box {flex-wrap:wrap; -webkit-flex-wrap:wrap;}
    .boardlist_top > ul li .box .optionbox {margin-right: 0; margin-bottom: 10px;}

    /*페이징*/
    .paging {justify-content: space-between;}
    .paging button {margin: 0;}
    
    /*갤러리형 게시판*/
    .gallaylist > li a {height: 100%;}
    .gallaylist > li a .img_box {height: 135px;}
    .gallaylist > li a .text_box {height: calc(100% - 135px); display: flex; display:-webkit-flex; flex-wrap:wrap; -webkit-flex-wrap:wrap; flex-flow: column; justify-content: space-between;}
    .gallaylist > li a .text_box h3 {max-height: 92px; height: auto; -webkit-line-clamp: 4;}
    
}
@media screen and (max-width:360px){
    .boardview table tr td .attachment-file .button_box {flex-wrap:wrap; -webkit-flex-wrap:wrap; width: 27px;}
    .boardview table tr td .attachment-file .button_box button {margin: 0;}

    /*갤러리형 게시판*/
    .gallaylist > li a .img_box {height: 105px;}
    .gallaylist > li a .text_box {height: calc(100% - 105px);}
}
@media screen and (max-width:320px){
    
}