@charset "utf-8";

.board {position:relative;}
.board__top {
    width:100%;
    display:flex;
    flex-wrap:wrap;
    flex-direction:row;
    justify-content:space-between;
}
@media screen and (max-width:749px ) {
    .board__top {flex-direction:column-reverse;}
}
.board__list {
    position:relative;
    width:100%;
    border-collapse: separate;
    border-spacing: 0;
    word-break: keep-all;
    table-layout: auto;
    border-top:2px solid #559150;
    border-left: none;
    border-right: none;
    margin-top:10px;
    table-layout: fixed;
}
.board__list thead th {
    padding: 0.75rem 1%;
    font-weight: 500;
    border-left: 1px solid #ccc;
    vertical-align: middle;
    text-align: center;
    background-color: #d8ebd7;
    border-bottom: 1px solid #9e9e9e;
    border-right: none;
}
.board__list thead th:first-child {border-left:0;}
.board__list tbody th {
    padding:0.5rem 1%; 
    border-bottom:1px solid #ccc; 
    border-left:1px solid #ccc; 
    border-right:1px solid #ccc; 
    vertical-align:middle; 
    text-align:center; 
    background-color:#f7f7f7; 
    border-right:none; 
    font-weight:500;
}
.board__list tbody td {
    padding:0.5rem 1%; 
    border-bottom:1px solid #ccc; 
    border-left:1px solid #ccc; 
    vertical-align:middle; 
    text-align:center; 
    background-color:#fff; 
    border-right:none;
}
.board__list tbody th:first-child,
.board__list tbody td:first-child {border-left:0;}
.board__list img {
    max-width:100%;
    height:auto;
}
.board__list .wd--85 {width:85px}
.board__list .wd--130 {width:130px}
.board__list .wd--120 {width:120px}
.board__list .wd--100 {width:100px}
.board__list .td--subject {text-align:left;}
.board__list .only-m {display:none;}
.board__list .td-link {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    display: inline-block;
    display: block;
    color:#313131;
}
.board__list .td--state .btn {width:100%}

@media screen and (max-width:749px) {
    .board__list {display:block;}
    .board__list colgroup {display:none;}
    .board__list thead {display:none;}
    .board__list tbody {display:block;}
    .board__list tr {
        position: relative;
        padding:0.8rem;
        height: auto;
        display: block;
        border-bottom:1px solid #ccc; 
    }
    .board__list tbody td  {
        padding-bottom: 0;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        border:0 !important;
        padding-left:0;
        padding-right:0;
    }
    .board__list .num {display: none;}
    .board__list .td-link {font-size:1rem}
    .board__list .only-m {
        font-weight: 300;
        margin-right: 10px;
        display: block;
        font-size:0.8rem;
        line-height: 1;
        height: auto;
        border-radius: 3px;
        -ms-flex-preferred-size: 60px;
        flex-basis: 60px;
        -ms-flex-negative: 0;
        flex-shrink: 0;
        text-align:left;
    }
    .board__list .td--subject {
        padding-top:0;
        font-size:1rem;
    }
    .board__list .td--state .btn {
        width:auto;
    }
    .board__list .td--state .btn.btn--xs {
        padding:0 15px;
    }
}

.board-detail {position:relative;}
.board-detail__title {
    display:block;
    font-size:1.1rem;
    font-weight:500;
    word-break:break-all;
    margin-bottom:6px;
}
.board-detail__info {
    margin-top:0.8rem;
    padding:0.8rem 0.85rem;
    background-color:#f1f1f1
}
.board-detail__info ul {
    display:flex;
    flex-direction:row;
    flex-wrap:wrap;
    width:100%;
}
.board-detail__info ul li {
    display:flex;
    flex-direction:row;
    align-items:flex-start;
    position:relative;
    padding:0 1.35rem;
    color:#222;
    font-size:0.75rem
}
.board-detail__info ul li:first-child {padding-left:0;}
.board-detail__info ul li:last-child {padding-right:0;}
.board-detail__info ul li strong,
.board-detail__info ul li span {display:inline-block;position:relative;}
.board-detail__info ul li strong {padding-left:0.75rem;font-weight:500}
.board-detail__info ul li strong:before {
    display:block;
    content:"";
    position:absolute;
    top:0.3rem;
    left:0;
    width:0.2rem;
    height:0.2rem;
    background-color:#555;
}
.board-detail__info ul li span.dot {margin:0 0.2rem}
@media screen and (max-width:618px){
    .board-detail__info ul {
        flex-direction:column;
        align-items:flex-start;
    }
    .board-detail__info ul li {
        width:100%;
        padding:0;
    }
    .board-detail__info ul li span.dot + span {width:calc(100% - 100px - 5px);}
    .board-detail__info ul li+li {margin-top:5px}
}

.board-detail__file {
    display:flex;
    flex-direction:row;
    flex-wrap:wrap;
    width:100%;
    margin-top:2px;
    padding:0.85rem 0.85rem;
    background-color:#f1f1f1;
    color:#222;
    font-size:0.75rem;
}
.board-detail__file .file__tit {
    position:relative;
    display:block;
    padding-left:0.65rem;
    font-weight:500;
}
.board-detail__file .file__tit:before {
    display:block;
    content:"";
    position:absolute;
    top:0.25rem;
    left:0;
    width:0.2rem;
    height:0.2rem;
    background-color:#555;
}
.board-detail__file .file__tit span {
    display:inline-block;
    position:relative;
    margin:0 0.1rem;
}
.board-detail__file .file__items {
    position:relative;
    width:calc(100% - 5rem);
    margin-left:auto;
}
.board-detail__file .file__item a {
    display:block;
    position:relative;
    color:#222;
}
.board-detail__file .file__item + .file__item {margin-top:0.4rem}

.board-detail__content {
    padding:1.5rem 1.5rem;
    font-size:0.9rem;
    line-height:1.5rem;
    color:#313131;
}
.board-detail__content .gall_img {text-align:left;margin-bottom:2rem}
.board-detail__content img {max-width:100%;height:auto}
.board-detail__content.recomment {border-top:1px solid #ddd}
.board-detail__content .recomment-title {
    font-size:1.1rem;
    font-weight:500;
    color:#313131;
}

.board-detail__btnbox {
    margin-top:1.5rem;
    text-align:center;
}

.board-detail__page {
    width:100%;
    margin-top:1.5rem;
}
.board-detail__page .page-items {border-top:1px solid #ddd;}
.board-detail__page .page-items__item {
    display:flex;
    flex-direction:row;
    flex-wrap:wrap;
    width:100%;
    align-items:center;
    border-bottom:1px solid #ddd;
    padding:0;
}
.board-detail__page .page-items__tit {
    display:block;
    width:7.143rem;
    padding:0.7rem 0;
    text-align:center;
    color:#222;
    font-size:0.8rem;
    font-weight:bold
}
.board-detail__page .page-items__link {
    display:block;
    width:calc(100% - 14.29rem);
    padding:0.7rem 0;
    text-align:left;
    color:#222;
    font-size:0.8rem;
    font-weight:400;
}
.board-detail__page .page-items__link a {
    display:block;
    width:100%;
    color:#222;
    text-overflow:ellipsis;
    white-space:nowrap;
    overflow:hidden;
}
.board-detail__page .page-items__date {
    display:block;
    width:7.143rem;
    padding:0.7rem 0;
    text-align:center;
    color:#999;
    font-size:0.75rem;
    font-weight:400;
}
.board-detail__page .page-items__tit,
.board-detail__page .page-items__link,
.board-detail__page .page-items__date {vertical-align:middle}
@media screen and (max-width:749px){
    .board-detail__page .page-items__tit {width:5rem}
    .board-detail__page .page-items__link {width:calc(100% - 5.5rem)}
    .board-detail__page .page-items__date {display:none;}
}


.board_view_btn_box {padding-top:0.7143rem;text-align:right}

.board__total {
    margin-top:0.7rem;
    line-height: 0.8rem;
    display: flex;
    font-size:0.8rem;
}
.board__total em {
    color: #559150;
    font-weight: 600;
    font-style: normal;
    display: inline-block;
    margin-left: 4px;
}

.board-filter {
    position:relative;
}
.board-filter__form {
    position:relative;
    display:flex;
    width:500px;
    flex-wrap:wrap; 
}
.board-filter__content {
    position: relative;
    width: 100%;
    max-width:500px;
    margin-left: auto;
}
.board-filter__items {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    flex-direction: row;
    width: 100%;
}
.board-filter__item {padding:0 3px;}
.board-filter__item.item--fst {
    width: 100%;
    max-width:130px;
}
.board-filter__item.item--mid {
    width: 100%;
    max-width:300px;
}
.board-filter__item.item--last {
    width: 100%;
    max-width:70px;
}
.board-filter__item .btn,
.board-filter__item .frm-input {width:100%}
.board-filter__item .btn {padding:0 10px}
@media screen and (max-width:749px ) {
    .board-filter__form {width:100%;}
    .board-filter__content {
        max-width:100%;
    }
    .board-filter__item.item--fst {
        width:30%;
        max-width:30%;
    }
    .board-filter__item.item--mid {
        width:70%;
        max-width:70%;
    }
    .board-filter__item.item--last {
        max-width:100%;
        margin-top:4px;
    }
    .board__total {margin-top:1rem}
    .board__list tbody td.vt--top {align-items:flex-start;}
}

.frm-input {
    display: inline-block;
    padding:0 10px;
    margin:0;
    font-size:0.8rem;
    color: #484848;
    background-color: transparent;
    border: 1px solid #ddd;
    height:2.25rem;
}
.frm-input.wd--100 {
    width:100%;
    max-width:100px;
}
.frm-input.wd--200 {
    width:100%;
    max-width:200px;
}
.frm-input.wd--300 {
    width:100%;
    max-width:300px;
}

.btn {
    display: inline-block;
    padding: 0 2rem;
    margin: 0;
    height:2.25rem;
    line-height:2.25rem;
    font-size:0.8rem;
    text-align: center;
    background-color: transparent;
    border-color: #ddd;
    border-width: 1px;
    border-style: solid;
    color:#313131;
}
.btn.btn--xs {
    height:2rem;
    line-height:2rem;
    padding:0 5px;
}
.btn.btn--round {
    border-radius:50px !important;
}

.btn.btn--grey {
    background-color:#999;
    border-color:#999;
    color:#fff;
}
.btn.btn--green {
    background-color:#559150;
    border-color:#559150;
    color:#fff;
}
.btn.btn--light {
    background-color:#fff;
    border-color:#707070;
    color:#484848;
}
.btn.btn--cy {
    background-color: #02a8c6;
    border-color:#02a8c6;
    color:#fff;
}
.btn.btn--red {
    background-color: #f2391f ;
    border-color:#f2391f ;
    color:#fff;
}
.btn-box {
    position:relative;
    width:100%;
    margin-top:1.5rem;    
}

.pagination {
    position:relative;
    width:100%;
    margin-top:1.5rem;
    text-align:center;
}
.pagination__items {
    margin: 0;
    display: inline-block;
    vertical-align: top;
    padding-left: 0;
    text-align: center;
}
.pagination__item {display:inline;}
.pagination__link {
    position: relative;
    float: left;
    padding: 0;
    text-decoration: none;
    min-width:2rem;
    height:2rem;
    line-height:1.9rem;
    color: #666;
    margin-left: 4px;
    border-radius: 5px;
    background-color: #f0fbef;
}
.pagination__link.link--i {
    border: 1px solid #cecece;
    background-color: #fff;
    color:#559150;
    font-size:1.2rem;
    line-height:1.7rem;
}
.pagination__link:hover,
.pagination__item.active .pagination__link {
    background-color:#559150;
    color:#fff;
}
.pagination__item.item--next>* {margin-left:0.75rem}
.pagination__item.item--prev>* {margin-right:0.75rem}

.frmbox {
    position:relative;
    display:flex;
    flex-wrap:wrap;
    flex-direction:row;
    width:100%;
    margin-bottom:0.75rem;
    border-bottom:1px dashed #ccc;
    padding-bottom:0.75rem;
}
.frmbox .frmbox {margin-bottom:0}
.frmbox .frmbox {border-style:solid}
.frmbox.mt15 {margin-top:0.75rem}
.frmbox .frmbox.border--bottom-0 {
    border-bottom:0;
    padding-bottom:0;
}
.frmbox.mt20 {margin-top:1rem}
.frmbox .frmbox__head {
    display:block;
    padding-top:0.5rem;
}

.frmbox .frmbox__head .title {
    display:inline-block;
    position:relative;
    font-size:0.9rem;
    color:#000;
    font-weight:500;
    padding-left:0.9rem;
}
.frmbox .frmbox__head.pdt--0 {padding-top:0}
.frmbox .frmbox__head .title::before {
    content:"";
    display:block;
    position:absolute;
    top:0.2rem;
    left:0;
    width:0.3rem;
    height:0.3rem;
    background-color:#fff;
    border:3px solid #679c61;
    border-radius:50%;
    box-sizing:content-box;
}
.frmbox .title2 {
    display:inline-block;
    position:relative;
    font-size:0.85rem;
    color:#313131;
    font-weight:400;
    padding-left:0.5rem;
}
.frmbox .title3 {
    display:inline-block;
    position:relative;
    font-size:0.85rem;
    color:#313131;
    font-weight:500;
}
.frmbox .title2::before {
    content:"";
    display:block;
    position:absolute;
    top:0.3rem;
    left:0;
    width:4px;
    height:4px;
    background-color:#679c61;
    border-radius:50%;
}

.frmbox .frmbox__body {
    position:relative;
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    width:calc(100% - 6rem);
    font-size:0.85rem;
    color:#313131;
    margin-left:auto;
    align-items:center;
}
.frmbox .frmbox__body.wd--8 {width:calc(100% - 8rem) !important}
.frmbox .frmbox__body.wd--10 {width:calc(100% - 10rem) !important}
.frmbox .frmbox__body.wd--3 {width:calc(100% - 3rem) !important}
.frmbox .frmbox__body.grid--100 {width:100% !important}
.frmbox .frmbox__body.mt--10 {margin-top:0.5rem}
.frmbox .frmbox__body.no--flex {
    display:block;
}
.frmbox .frmbox__body.v_center {align-self: flex-end;}

.frmbox.no--flex {display:block;}
.frmbox.no--flex .frmbox__head {width:100%;}
.frmbox.no--flex .frmbox__body {
    width:100% !important;
    margin-top:0.5rem;
}

.frmbox .frmbox__body.pt {padding-top:0.7857rem}
.frmbox .frmbox__body .mb_5 {margin-bottom:5px}
.frmbox__close {
    position:absolute;
    top:3px;
    right:0;
}
.frmbox.duplicate .frmbox__close {top:1.8rem}
.frmbox__inbtn {
    position:relative;
    width:100%;
    padding-right:2.5rem;
}
.frmbox__inbtn .btn {
    position:absolute;
    top:0;
    right:0;
    height:2.25rem;
}
.frmbox__inbtn + .frmbox__inbtn {margin-top:0.5rem;}
.frmbox.btn {padding:0 0.8rem}
.frmbox.last {margin-bottom:0}
.frmbox .frm-input {width:100%;}
.frmbox .grid--100 {width:100%;}
textarea.frm-input {padding:0.5rem;line-height:1.3;height:10rem}
.checkbox {
    position:relative;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
}
.checkbox__inp {
    width:1rem;
    height:1rem;
}
.checkbox__text {display:inline-block;vertical-align:middle;}
.checkbo.all {font-size:0.8rem;line-height:0.8rem}
.checkbox.ml10 {margin-left:0.5rem;}
.checkbox ~ .checkbox {margin-left:0.5rem}
.modal-body .frmbox .frmbox__body  {width:calc(100% - 8rem);}

@media screen and (max-width:700px){
    .frmbox {flex-direction:column;}
    .frmbox .frmbox__body {width:100%;margin-top:0.4rem;}
    .modal-body .frmbox .frmbox__body  {width:100%;margin-top:0.4rem;}
    .frminput.w200 {max-width:100%}
    .frminput.w230 {max-width:100%}
    .frmbox .frmbox__body.wd--8 {width:100% !important}
    .frmbox .frmbox__body.wd--10 {width:100% !important}
    .frmbox .frmbox__head .title br {display:none;}
    .frmbox.frmbox--row {flex-direction:row;}
    .frmbox.frmbox--row  .frmbox__body {margin-top:0;}
    .frmbox .frmbox__body.wd--3 {width:100% !important;}
    .frmbox.frmbox--row .frmbox__body.wd--3 {
        width: calc(100% - 3rem) !important;
    }
    .frmbox .frmbox__head {padding-top:0;}
    .frmbox .title3,
    .frmbox .title2 {font-size:0.9rem}
    .frmbox .frmbox__head .title {font-size:0.9rem}
}

.checkbox {
    position:relative;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
}
.checkbox__inp {
    width:1rem;
    height:1rem;
    padding:0;
    margin:0;
}
.checkbox__text {
    display:inline-block;
    margin-left:0.3rem;
}
.checkbo.all {font-size:0.8rem;line-height:0.8rem}
.checkbox.ml10 {margin-left:0.5rem;}
.checkbox ~ .checkbox {margin-left:1rem}

.email-box {
    position:relative;
    width:100%;
}
.email-box .email-box__items {
    position:relative;
    display:flex;
    flex-wrap:wrap;
    width:100%;
}
.email-box .email-box__item {
    width:50%;
    position:relative;
}
.email-box .email-box__item:nth-child(1) {padding-right:10px}
.email-box .email-box__item:nth-child(2) {padding-left:10px}
.email-box .email-box__item:nth-child(3) {
    width:100%;
    margin-top:6px;
}
.email-box .email-box__item:nth-child(1):after {
    display: block;
    content: "@";
    position: absolute;
    top:50%;
    right: -5px;
    font-size: 13px;
    color: #484848;
    transform:translateY(-50%);
}

.tel-box {
    position:relative;
    width:calc(100% + 3px);
    margin-left:-3px;
}
.tel-box .tel-box__items {
    position:relative;
    display:flex;
    flex-wrap:wrap;
    width:100%;
}
.tel-box .tel-box__item {
    width:33.3333333333333%;
    position:relative;
}
.tel-box .tel-box__item:nth-child(1) {padding-left:3px}
.tel-box .tel-box__item:nth-child(2) {padding-left:3px}
.tel-box .tel-box__item:nth-child(3) {padding-left:3px}

.btn-list {position:relative;}
.btn-list__item {text-align:left;}
.btn-list__item + .btn-list__item {margin-top:0.5rem;}
@media screen and (max-width:749px) {
    .board__list .btn-list {
        display:flex;
        flex-wrap:wrap;
        width:100%;
        justify-content:baseline;
    }
    .btn-list__item + .btn-list__item {
        margin-top:0;
        margin-left:0.5rem;
    }
}
@media screen and (max-width:640px) {
    .board__list .btn-list {
        flex-direction:column;
        width:100%;
    }
    .btn-list__item + .btn-list__item {
        margin-top:0.5rem;
        margin-left:0;
    }
}