@charset "utf-8";

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

div.box-con {
    margin-top: 100px;
}

div.notice-nodata{
    color: #fff; 
    text-align: center;
    font-size: 20px;
    margin-top: 130px;
}
/* pc - list*/
/* 버튼공통 */
div.skin_free div.btn-set {
    display: flex;
    gap: 4px;
    justify-content: center;
    align-items: center;
}
div.skin_free div.btn-set.top{
    /* 여기사이트만 */
    display: none;
}
div.skin_btn_area_mov .btn_set button,
div.skin_free div.btn-set button {
    padding: 6px 24px;
    border: 1px solid #0E4A84;
    border-radius: 500px;
    font-size: 18px;
    box-sizing: border-box;
    font-family: 'pretendard';
    cursor: pointer;
    background-color: #0E4A84;
    color: #fff;
    font-weight: 500;
    line-height: 150%;
}

div.skin_btn_area_mov .btn_set .btn_neg,
div.skin_free div.btn-set .btn_neg {
    background-color: #f3f3f3;
    font-weight: 500;
    border-color: #f3f3f3;
    color: #929292;
}

/* -------------------------------------------------- */
/* 로그인버튼, 검색창 묶음 */
.list-func-wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 4px;
    /* 415이하일 때 줄바꿈 */
    flex-wrap: wrap;
}

/* 로그인아웃 버튼 */
div.login a {
    display: flex;
    align-items: center;
    /* justify-content: center; */
    width: 55px;
    height: 55px;
    border: 1px solid #EAEAEA;
    border-radius: 500px;

    text-align: center; 
    padding: 0 24px 0 20px;
    gap: 0px;
    color: #999;
    font-weight: 400;
    transition: 0.3s;
}

div.login a span{
    min-width: 0px; opacity: 0; visibility: hidden; overflow: hidden;
    transition: 0.3s;
}

div.login a:hover{
    gap: 12px;
    width: auto;
}

div.login a:hover span{
    min-width: max-content; opacity: 1; visibility: visible; overflow: auto;
}

div.login a.login_icon img {
    width: 16px;
    margin-left: -3px;
}

/* 검색창 */
div.search {
    display: flex;
    gap: 8px;
}

div.search select.search_select {
    padding: 14px;
    border-radius: 8px;
    border: 1px solid #EAEAEA;
    font-size: 14px;
    height: 55px;
}

div.input-wrap{
    border-radius: 500px;
    padding: 4px 4px 4px 0; box-sizing: border-box; height: 55px;
    border: 1px solid #EAEAEA;
    display: flex; align-items: center;
}
div.search input.search_input {
    width: 300px;
    padding: 0 24px;
    border-radius: 500px;
    border: none;
    background: none;
    font-size: 16px;
    outline: none;
    box-shadow: none;
    height: 47px;
    margin: 0;
}

div.search input.search_button {
    
    color: #fff;
    cursor: pointer;
    border-radius: 500px;
    border: none;
    font-size: 14px;
    height: 47px;
    width: 47px;
    background: url(svg/icon-search.svg) no-repeat;background-position: center;
    
}

/* 목록 */
div.skin_free {
    margin-top: 16px;
}

ul.board_list{
    margin-bottom: 60px;
}

div.skin_free ul.board_list li.list_heder_pc {
    width: 100%;
    padding: 24px 0;
    background: #f8f8f8;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: 16px;
}

div.skin_free ul.board_list li.list_heder_pc>div {
    text-align: center !important;
    font-weight: 600;
    color: #333;
    font-size: 18px;
}

div.skin_free ul.board_list li.list_heder_pc>div.no,
div.skin_free ul.board_list li.list-flex div.no {
    width: 10%;
    text-align: center;
}

div.skin_free ul.board_list li.list_heder_pc>div.title,
div.skin_free ul.board_list li.list-flex div.flex-center {
    width: 60%; padding-left: 16px;
}

div.skin_free ul.board_list li.list_heder_pc>div.date{
    width: 10%; text-align: center;
}

div.skin_free ul.board_list li.list_heder_pc>div.hit{
    width: 10%; text-align: center;
}

div.skin_free ul.board_list li.list_heder_pc>div.file,
div.icon-show {
    width: 10%;
    text-align: center;
}

div.skin_free ul.board_list li.list-flex {
    display: flex;
    align-items: center;
    justify-content: space-between;
    /* gap: 20px; */
    padding: 32px 0;
    border-bottom: 1px solid #eee;
}

div.skin_free ul.board_list li.list-flex div.flex-center div.title a svg {
    margin-right: 4px;
}
div.skin_free ul.board_list li.list-flex div.date{
    width: 10%; text-align: center;
}
div.skin_free ul.board_list li.list-flex div.hit{
    width: 10%; text-align: center;
}
/* 썸네일 */
div.thumb{
    width: 10%; height: 80px; text-align: center;
    overflow: hidden; display: flex; align-items: center; justify-content: center;
}
div.thumb img{ height: 100%;}
/* 공지사항 표시 클래스 */
div.skin_free ul.board_list li.list-flex div.no span.add_notice {
    display: inline-block;
    padding: 7px 20px;
    background-color: #09375e;
    color: #fff;
    border-radius: 500px;
    font-weight: 500;
    font-size: 18px;
}

div.skin_free ul.board_list li.list-flex div.flex-center div.box-flex {
    display: flex;
    align-items: center;
    gap: 12px;
    /* margin-top: 10px; */
    color: #999;
    font-size: 16px;
}

div.skin_free ul.board_list li.list-flex div.flex-center div.title {
    font-size: 18px;
    font-weight: 600;
    text-align: left;
}

div.skin_free ul.board_list li.list-flex div.flex-center div.title img.secret_icon {
    margin-right: 8px;
    position: relative;
    top: 1px;
}


/* -------------------------------------------------------------------------- */
/* pc - view */
div.skin_free .board_view tr.top-info td {
    padding: 0 0 10px 0;
    border: 0;
    font-weight: bold;
}

div.skin_free .board_view th.title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 24px 10px 10px 10px;
    border-top: 2px solid #ddd;
    text-align: left;
    font-size: 25px;
}

div.skin_free .board_view th.title span {
    width: 70%;
}

div.skin_free .board_view tr.view_infor td {
    display: flex;
    gap: 20px;
    padding: 0 10px;
}

div.skin_free .board_view tr.view_infor td span.name,
div.skin_free .board_view tr.view_infor td span.date,
div.skin_free .board_view tr.view_infor td span.hit {
    font-size: 16px;
    font-weight: 300;
    border-right: 2px solid #eee;
    padding-right: 20px;
}

div.skin_free .board_view tr.view_infor td span.hit {
    border-right: none;
}

div.skin_free .board_view td.detail div#content {
    min-height: 250px;
    vertical-align: top;
    padding: 10px;
    text-align: left;
}

/* 이전글 다음글 버튼 */
div.skin_free .board_view td.view_btton_flex {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 10px;
    border-bottom: 2px solid #ddd;
    text-align: left;
}

div.skin_free .board_view td.view_btton_flex div.prev_view,
div.skin_free .board_view td.view_btton_flex div.next_view {
    display: flex;
    align-items: center;
}

div.skin_free .board_view td.view_btton_flex a {
    font-size: 16px;
    font-weight: 500;
    cursor: pointer;
}

div.skin_free .board_view td.view_btton_flex .prev_view a,
div.skin_free .board_view td.view_btton_flex .next_view a {
    display: flex;
    align-items: center;
    gap: 16px;
}

div.skin_free .board_view td.view_btton_flex .prev_view a {
    padding-right: 20px;
}

div.skin_free .board_view td.view_btton_flex .next_view a {
    padding-left: 20px;
}

div.skin_free .board_view td.view_btton_flex span {
    width: 400px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

div.skin_free .board_view td.view_btton_flex .prev_view span {
    padding-left: 20px;
    border-left: 2px solid #eee;
}

div.skin_free .board_view td.view_btton_flex .next_view span {
    padding-right: 20px;
    border-right: 2px solid #eee;
    text-align: right;
}

div.skin_btn_area_mov {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 16px;
}

div.skin_btn_area_mov .list_btn {
    padding: 6px 24px;
    border: 1px solid #f3f3f3;
    border-radius: 500px;
    font-size: 18px;
    box-sizing: border-box;
    font-family: 'pretendard';
    cursor: pointer;
    background-color: #f3f3f3;
    font-weight: 500;
    color: #929292;
    line-height: 150%;
}

/* 본문 */
div.skin_free .board_view td.detail {
    padding: 50px 0;
    table-layout: fixed;
    word-break: break-all;
    word-break: break-word;
    border-bottom: 1px solid #eee;

}

/* 첨부파일 */
div.skin_free .board_view td.detail div.attachment {
    margin: 8px 0 30px 0;
}

div.skin_free .board_view td.detail div.attachment ul.list_attach {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 24px 20px;
    background: #f8f8f8;
    text-align: left;
}

div.skin_free .board_view td.detail div.attachment ul.list_attach li img {
    text-align: absmiddle;
}

/* 글쓰기, 수정, 삭제, 목록 위젯 전체 감싸는 fix된 박스*/
.widget_fix_wrap {
    position: fixed !important;
    bottom: 50px;
    right: 50px;
    z-index: 100;
    display: flex;
    gap: 8px;
    flex-direction: column;
}

/* 태블릿, 모바일일때 위젯 펼치고 접는 버튼 */
.widget-btns-wrap {
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-items: center;
}

.widget_close,
.widget_open {
    width: 72px;
    height: 72px;
    background-color: #fff;
    border-radius: 500px;
    text-align: center;
    line-height: 80px;
    box-shadow: 0px 0px 10px #ddd;
    cursor: pointer;
}

.widget_func_btn .widget_close,
.widget_func_btn .widget_open {
    display: none;
}

/* 글쓰기, 수정, 삭제, 목록 위젯 */
div.skin_free div.skin_write_btn_area {
    position: fixed;
    bottom: 50px;
    right: 50px;
    padding: 10px;
}

div.skin_free div.skin_write_btn_area,
div.skin_free div.widget_fix_wrap div.skin_btn_area_func {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 10px;
    background-color: #fff;
    border-radius: 500px;
    box-shadow: 0px 0px 10px #ddd;
    color: #666;
    font-weight: 600;
    text-align: center;
    font-weight: 700;
    line-height: 30px;
    z-index: 100;
}

div.skin_free div.skin_btn_area_func .skin_button button {
    background: none;
    border: none;
    cursor: pointer;
    color: #666;
    font-weight: 700;
    font-size: 16px;
    font-family: 'pretendard';
    line-height: 30px;
    text-align: center;
}

div.skin_free div.skin_write_btn_area div.write_icon,
div.skin_free div.skin_btn_area_func .widget_icon {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 56px;
    height: 56px;
    border-radius: 500px;
    margin: 0 auto;
}

div.skin_free div.skin_write_btn_area div.write_icon,
div.skin_free div.skin_btn_area_func .write_icon {
    background: #09375e;
}

div.skin_free div.skin_btn_area_func .modify_icon {
    background: #2C80ED;
}

div.skin_free div.skin_btn_area_func .delete_icon {
    background: #F04545;
}

div.skin_free div.skin_btn_area_func .list_icon {
    background: #717171;
}

div.skin_free .nodata {
    text-align: center;
    font-size: 18px;
    font-weight: 600;
    text-align: center;
    padding: 100px 0;
}

/* ----------------------------------------------------------------- */
/* 비밀글보기 */
div.skin_secret_view {
    width: 380px;
    padding: 40px;
    margin: 0 auto;
    text-align: center;
    background: #FFFFFF;
    box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.1);
    border-radius: 30px;
}

div.skin_secret_view h2 {
    margin: 0 0 12px 0;
}

div.skin_secret_view h2 img {
    width: 20px;
    height: 27px;
    position: relative;
    top: 3px;
    margin-right: 6px;
}

div.skin_secret_view p {
    font-size: 14px;
    margin-top: 12px;
    color: #666;
}

div.skin_secret_view div.secret_view_pw {
    width: 300px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px;
    border: 1px solid #ddd;
    border-radius: 1000px;
    margin: 40px auto 8px;
}

div.skin_secret_view .secret_view_pw input {
    outline: none;
    border: none;
}

div.skin_secret_view img.show_pw,
div.skin_secret_view img.hide_pw {
    cursor: pointer;
}

div.btn_secret_view button {
    border: none;
    width: 300px;
    border-radius: 999px;
    padding: 18px 0;
    background-color: #0e4675;
    color: #fff;
    font-size: 18px;
    font-weight: 600;
    cursor: pointer;
}

/* ----------------------------------------------------------------- */
/* 메인화면 notice */
div.skin_free>.board_notice {
    padding: 0;
    margin: 0;
    border: 0
}

div.skin_free>.board_notice th {
    padding: 25px 0;
    border: 0;
}

div.skin_free>.board_notice td {
    padding: 25px 0;
    border: 0;
}

div.skin_free>.board_notice td a {
    font: 22px "pretendard", "open sans", Tahoma, Geneva, sans-serif;
    color: #fff;
    font-weight: 400;
}

div.skin_free>.board_notice td a:hover {
    color: #f27a2a
}

div.skin_free>.board_notice td.date {
    color: #fff;
    text-align: right;
    letter-spacing: .5px;
    font-weight: 100;
}

/* ----------------------------------------------------------------- */
/* pc - write */
div.skin_free .board_write {
    width: 100%;
}

div.skin_free .board_write.write_infor,
div.skin_free .board_write.write_option {
    border-top: 2px solid #ddd;
    border-bottom: 2px solid #ddd;
}

div.skin_free .board_write td input#Url,
div.skin_free .board_write td input#Title {
    width: 100%;
}

/* 표 여백 이쁘게, 첫째tr 마지막 tr여백 조금 더 줌 */
div.skin_free .board_write tr:first-child th,
div.skin_free .board_write tr:first-child td {
    padding-top: 32px;
}
div.skin_free .board_write tr{
    text-align: left;
}

div.skin_free .board_write tr:last-child th,
div.skin_free .board_write tr:last-child td {
    padding-bottom: 32px;
}

div.skin_free .board_write tr td span.popup-flex {
    display: flex;
    gap: 8px 18px;
    align-items: center;
    flex-wrap: wrap;
}

div.skin_free .board_write th {
    border: none;
    width: 8%;
    padding: 16px;
    background: none;
    text-align: left;
    white-space: nowrap;
    font-weight: 500;
    padding-left: 16px;
}

div.skin_free .board_write td {
    border: none;
    /* height: 16px; */
    padding: 16px 8px;
    /* height: 55px; */
    background: none
}

/* 글쓰기부분 텍스트박스 */
div.skin_free .board_write td .i_text {
    padding: 6px 10px;
    border: none;
    outline: none;
    border-radius: 5px;
    font-size: 16px;
    background-color: #f8f8f8;
}

div.skin_free .board_write td .i_text:hover {
    border-color: #09375e
}

div.skin_free .board_write td .i_text:focus {
    border-color: #09375e
}

div.skin_free .board_write td .i_text.date {
    width: 130px !important;
    padding-left: 32px;
    background-image: url('svg/icon-calendar.svg');
    background-position: 5px center;
    background-repeat: no-repeat;
    background-size: 18px 18px;
}

div.skin_free .board_write td input[type="checkbox"] {
    width: 18px;
    height: 18px;
    accent-color: #171717;
    vertical-align: text-bottom;
}

/* 옵션 항목 정렬 */
div.skin_free .board_write td.option-flex {
    display: flex;
    gap: 80px;
}

/* 항목 안에 체크박스랑 label정렬 */
div.skin_free .board_write td.option-flex div {
    display: flex;
    gap: 8px;
    align-items: center;
}

div.skin_free .board_write td .IsSecret_input {
    width: 360px;
}

/* 첨부파일 드롭존 */
.its-dz-main {
    min-height: 70px;
    cursor: pointer;
}

.dz-default {
    text-align: center;
    padding: 40px 0;
    background-color: #F5F5F5;
}

.dz-guide1 {
    display: block;
    font-weight: bold;
    color: #377EDC;
    font-size: 18px;
    margin-top: 16px
}

.dz-guide2 {
    display: block;
    color: #717171;
    margin-top: 8px;
}

.dz-size {
    min-width: 50px;
    margin-left: 8px;
}

.dz-preview {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px;
    min-height: 20px;
    margin-top: 8px;
    border: 1px solid #ddd;
    font-size: 16px;
    border-radius: 10px;
    color: #807579
}

.dz-remove {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2px;
    background-color: #EE0000;
    width: 24px;
    height: 24px;
    border-radius: 200px;
}

/* 등록옵션 */
.publish_option {
    display: flex;
}

.publish_option h3 {
    padding: 30px 0 0 0;
    margin: 0 50px 0 20px;
    color: #000;
}

.publish_option .option_area {
    flex-grow: 1;
}

/* 비밀번호, 팝업기간 기본상태 - 흐림처리 */
.publish_option tr:not(:first-child) {
    color: #ddd;
}

/* 활성화됐을때 */
.publish_option tr.on th,
.publish_option tr.on td {
    color: #1a1a1a;
}

/* input들 disabled 비활성화일 떄 */
.publish_option .i_text:disabled,
.publish_option .i_text:disabled:hover {
    border-color: #ddd !important;
    opacity: 0.8;
}

.publish_option .i_text:disabled::placeholder {
    color: #ddd;
}

.publish_option input[type="checkbox"]:disabled {
    opacity: 0.5;
}

div.skin_free div.btn-set.write_page {
    margin-top: 32px;
}

/* ----------------------------------------------------------------- */
/* 로그인 화면 */
.skin_login {
    margin: 0 auto;
    text-align: center;
    width: 380px;
    padding: 40px;
    background: #FFFFFF;
    box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.1);
    border-radius: 30px;
}

.skin_login p {
    font-size: 14px;
    margin-top: 12px;
    color: #666;
}

.input_wrap {
    margin: 40px auto;
    width: 300px;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.input_wrap .item_userid,
.input_wrap .item_userpw {
    display: flex;
    gap: 16px;
    align-items: center;
    padding: 0 8px;
}

.input_wrap .item_userid {
    border-bottom: 1px solid #ddd
}

.input_wrap .item_userpw {
    border-bottom: 1px solid #ddd;
}

.input_wrap .item_userid input,
.input_wrap .item_userpw input {
    padding: 8px;
    border: none;
    outline: none;
    font-size: 18px;
}

.btn_area_login button {
    border: none;
    width: 300px;
    border-radius: 999px;
    padding: 18px 0;
    background-color: #0e4675;
    color: #fff;
    font-size: 18px;
    font-weight: 600;
}


/* 셀렉트박스 */
.container-wrap {
    width: 150px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;

    position: relative;
}

.container-wrap span.text-hidden {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

div.container {
    width: 100%;
    background-color: #fff;
    border: 1px solid #EAEAEA;
    padding: 8px 24px;
    /* border-radius: 10px; */
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
    cursor: pointer;
    height: 55px;
    border-radius: 500px;
}

div.container span.text-area {
    font-weight: 400;
    color: #666;
    font-size: 16px;
}

div.container .icon-area {
    float: right;
    position: relative;
    background-color: #fff;
    border: none;
}

div.container .slide-down {
    top: -1px;
}

div.container .slide-up {
    display: none;
    top: -2px;
}

div.container-wrap div.list-wrap {
    width: 100%;
    max-height: 193px;
    overflow: hidden;
    overflow-y: auto;
    background-color: #fff;
    border: 1px solid #EAEAEA;
    border-radius: 10px;
    display: none;
    position: absolute;
    top:60px;
}

/* 셀렉트박스 스크롤바 너비 */
div.container-wrap div.list-wrap::-webkit-scrollbar {
    width: 4px;
}

div.container-wrap div.list-wrap::-webkit-scrollbar-thumb {
    background-color: #ccc;
    font-weight: 400;
    border-radius: 500px;
}

div.container-wrap div.list-wrap ul.option-list {
    padding: 8px 0;
}

div.container-wrap div.list-wrap ul.option-list li.option {
    margin: 0 8px;
    padding: 6px 16px;
    border-radius: 10px;
    cursor: pointer;
    transition: 0.5s;
    font-weight: 400;
    color: #666;
    list-style: none;
    font-size: 16px;
}

div.container-wrap div.list-wrap ul.option-list li.option:hover {
    background-color: #eee;
    color: #000;
}

/* 반응형 사이즈*/
@media (max-width: 1199px) {

    div.notice-nodata{
        font-size: 18px;
        margin-top: 100px;
    }
    /* 버튼 공통 */
    div.skin_btn_area_mov .list_btn,
    div.skin_btn_area_mov .btn_set button,
    div.skin_free div.btn-set button {
        padding: 4px 20px !important;
        font-size: 16px !important;
    }

    /* 목록부분 폰트 통일 */
    div.skin_free ul.board_list li.list_heder_pc>div,
    div.skin_free ul.board_list li.list-flex div.flex-center div.title {
        font-size: 16px !important;
    }

    div.skin_free ul.board_list li.list-flex div.no span.add_notice {
        font-size: 14px !important;
    }

    div.title svg {
        width: 10px !important;
    }

    div.skin_free ul.board_list li.list-flex div.flex-center div.box-flex div {
        font-size: 14px !important;
    }

    div.skin_free ul.board_list li.list-flex div.flex-center div.box-flex {
        margin-top: 6px;
    }

    /* ----------------------------------------------------------------- */
    /* veiw 위젯 */
    
    div.skin_free div.widget_fix_wrap div.skin_btn_area_func {
        display: none;
    }

    div.skin_free div.widget_fix_wrap div.skin_btn_area_func.on {
        display: block;
    }

    div.skin_free div.skin_btn_area_func .widget_icon {
        width: 48px !important;
        height: 48px !important;
    }

    div.skin_free div.skin_btn_area_func .widget_icon svg {
        width: 20px !important;
    }

    .widget_func_btn .widget_close.on,
    .widget_func_btn .widget_open.on {
        display: block !important;
    }

    div.skin_free .board_view th {
        font-size: 20px !important;
    }

    div.skin_free .board_view td.detail div.attachment ul.list_attach {
        padding: 20px 16px !important;
    }

    div.skin_free .board_view tr.view_infor td span.name,
    div.skin_free .board_view tr.view_infor td span.date,
    div.skin_free .board_view tr.view_infor td span.hit {
        font-size: 14px !important;
    }

    div.skin_free .board_view td.view_btton_flex span {
        width: 220px;
    }

    /* write */
    .drag-drop {
        font-size: 14px !important;
    }

    /* 메인 노티스 */
    div.skin_free>.board_notice th {
        padding: 18px 0 !important;
    }

    div.skin_free>.board_notice td {
        padding: 18px 0 !important;
    }

    div.skin_free>.board_notice td a {
        font-size: 18px !important;
    }

    div.skin_free>.board_notice td.date {
        font-size: 18px !important;
    }

    .dz-preview{
        font-size: 15px;
        padding: 12px 16px;
    }
}

/*모바일*/
@media (max-width: 767px) {

    div.notice-nodata{
        font-size: 16px;
        margin-top: 100px;
    }

    /* 검색창 */
    div.container-wrap {
        width: 100px !important;
    }

    div.container {
        padding: 6px 16px !important;
    }

    div.search input.search_input {
        width: 251px !important;
        height: 33px;
        font-size: 14px !important;
    }

    div.search input.search_button {
        padding: 6px 12px !important;
        font-size: 14px !important;
    }


    /* list */
    div.skin_free ul.board_list li.list_heder_pc>div,
    div.skin_free ul.board_list li.list-flex div.flex-center div.title {
        font-size: 14px !important;
    }

    div.skin_free ul.board_list li.list-flex div.no span.add_notice {
        font-size: 12px !important;
    }

    div.skin_free ul.board_list li.list-flex div.flex-center div.title {
        word-break: keep-all;
    }

    div.skin_free ul.board_list li.list-flex div.flex-center div.box-flex div {
        font-size: 12px !important;
    }

    div.skin_free ul.board_list li.list-flex div.flex-center div.box-flex {
        margin-top: 0px;
    }

    div.title svg {
        position: relative;
        top: 1px !important;
        width: 10px !important;
    }

    div.skin_free .box-flex div.name,
    div.skin_free .box-flex div.date,
    div.skin_free .box-flex div.hit {
        font-size: 12px !important;
    }

    div.skin_free ul.board_list li.list-flex {
        padding: 20px 0;
    }

    div.skin_free li.list-flex div.no span.add_notice {
        padding: 4px 12px !important;
    }

    div.skin_free ul.board_list li.list-flex div.no {
        width: 12% !important;
    }

    div.skin_free ul.board_list li.list-flex div.no {
        font-size: 14px !important;
    }

    /* 첨부파일아이콘 */
    div.icon-show img {
        width: 12px !important;
    }

    div.skin_free ul.board_list li.list-flex {
        gap: 12px !important;
    }

    /* ----------------------------------------------------------------- */
    div.skin_free div.widget_fix_wrap{
        bottom: 30px;
        right: 30px;
    }
    div.skin_free div.skin_write_btn_area {
        bottom: 30px;
        right: 30px;
    }
    div.skin_free .board_view th.title span {
        width: auto;
    }

    div.skin_free th.title div.btn-set {
        display: none;
    }

    div.skin_free div.skin_write_btn_area,
    div.skin_free div.widget_fix_wrap div.skin_btn_area_func {
        gap: 6px;
    }

    /* 위젯 폰트 크기*/
    div.skin_free div.skin_btn_area_func .skin_button,
    div.skin_free div.skin_btn_area_func .skin_button button {
        font-size: 14px !important;
        line-height: 24px !important;
    }

    div.skin_free .board_view th {
        font-size: 18px !important;
        word-break: keep-all;
    }

    div.skin_free .board_view td.detail div.attachment ul.list_attach a {
        font-size: 14px !important;
    }

    div.skin_free .board_view td.detail div.attachment {
        margin: 8px 0 16px 0;
    }

    div.skin_free .board_view td.detail div.attachment ul.list_attach {
        padding: 16px 12px !important;
    }

    div.skin_free .board_view td.detail {
        padding: 12px 0 !important;
    }

    div.skin_free .board_view tr.view_infor td {
        gap: 12px !important;
    }

    div.skin_free .board_view tr.view_infor td span.name,
    div.skin_free .board_view tr.view_infor td span.date,
    div.skin_free .board_view tr.view_infor td span.hit {
        padding-right: 12px !important;
    }

    div.skin_free .board_view td.view_btton_flex span {
        display: none !important;
    }

    div.skin_free .board_view td.view_btton_flex a {
        font-size: 14px !important;
    }

    /* write */
    div.skin_free .board_write th,
    div.skin_free .board_write td {
        font-size: 14px !important;
    }

    div.skin_free .board_write td .i_text {
        padding: 4px !important;
        font-size: 14px !important;
    }

    div.skin_free .board_write td .i_text.date {
        padding-left: 28px !important;
    }

    div.skin_free .board_write th,
    div.skin_free .board_write td {
        padding: 10px !important;
    }

    div.skin_free .board_write td.write_section {
        padding: 12px 0 !important;
    }

    div.skin_free .board_write td.drag-drop {
        padding: 0px 0 12px 0 !important;
    }

    div.skin_free .board_write td.option-flex {
        align-items: center;
        gap: 24px;
    }

    .publish_option h3 {
        display: none !important;
    }

    div.skin_free .board_write td .i_text.date {
        width: 172px !important;
    }

    #content img {
        width: 100% !important;
    }
    .dz-preview{
        font-size: 14px;
        padding: 8px 12px;
    }

    .dz-remove{
        width: 22px;
        height: 22px;
        padding: 4px;
    }
    
    /* 표 여백 이쁘게 */
    div.skin_free .board_write tr:first-child th,
    div.skin_free .board_write tr:first-child td {
        padding-top: 24px !important;
    }

    div.skin_free .board_write tr:last-child th,
    div.skin_free .board_write tr:last-child td {
        padding-bottom: 24px !important;
    }

    /* 메인 노티스 */
    div.skin_free>.board_notice th {
        padding: 10px 0 !important;
    }

    div.skin_free>.board_notice td {
        padding: 10px 0 !important;
    }

    div.skin_free>.board_notice td a {
        font-size: 16px !important;
        word-break: keep-all !important;
    }

    div.skin_free>.board_notice td.date {
        font-size: 14px !important;
    }

    div.container-wrap div.list-wrap{
        top: 60px;
    }


    div.list-func-wrap div.login{
        position: absolute; bottom: 76px;
    }

    div.list-func-wrap form{
        width: 100%;
    }

    div.list-func-wrap div.search{
        width: 100%; justify-content: space-between;
    }

    /* 로그인아웃아이콘 */
    /* div.login a.logout_icon svg {
        width: 14px !important;
    }

    div.login a {
        width: 33px !important;
        height: 33px !important;
    } */


}

@media (max-width: 490px) {
    
    div.search input.search_input {
        width: 173px !important;
    }

    div.search {
        gap: 4px !important;
    }

    div.skin_free ul.board_list li.list_heder_pc {
        padding: 16px 0;
    }

    div.skin_free ul.board_list li.list-flex div.no span.add_notice {
        font-size: 13px !important;
    }

    div.skin_free ul.board_list li.list-flex {
        gap: 10px !important;
    }

    div.skin_free ul.board_list li.list_heder_pc>div.no,
    div.skin_free ul.board_list li.list-flex div.no,
    div.skin_free ul.board_list li.list-flex div.icon-show,
    div.skin_free ul.board_list li.list_heder_pc>div.file {
        width: 19% !important;
    }


    div.skin_free .board_write td .i_text.IsPopup_input {
        width: 77px !important;
    }

    div.skin_free .board_write td.option-flex {
        justify-content: space-between;
    }

    div.skin_free .board_write td .IsSecret_input {
        width: 100% !important;
    }

    /* 로그인화면 */
    .skin_login {
        width: 90%;
    }

    .skin_login h2 {
        font-size: 20px;
    }

    .skin_login p {
        font-size: 13px;
    }

    .input_wrap {
        width: auto;
        margin: 20px auto;
    }

    .btn_area_login button {
        width: 100%;
        font-size: 14px;
        padding: 12px 0;
    }

    .input_wrap .item_userpw {
        margin-top: 10px;
    }

    /* 비밀글화면 */
    div.skin_secret_view {
        width: 90%;
    }

    div.skin_secret_view h2 {
        font-size: 20px;
    }

    div.skin_secret_view p {
        font-size: 13px;
    }

    div.skin_secret_view div.secret_view_pw {
        width: auto;
        padding: 12px;
        margin: 20px auto 8px;
    }

    div.btn_secret_view button {
        width: 100%;
        font-size: 14px;
        padding: 14px 0;
    }

}