@charset "utf-8";
a {
    color:#333;
}
@media (min-width: 1200px) {
    #qna_board, #notice_board {
        border-top: 2px solid #333;
        border-left: 1px solid #ccc;
        border-right: 1px solid #ccc;
        border-bottom: 1px solid #ccc;
        font-size: 14px;
        height: 183px

    }


    .elements {
        width: 100%;
        height: 30px;
        background: #f5f5f5;
        line-height: 30px;
        border-bottom: 1px solid #ccc;
    }

    .elements p {
        float: left;
        height: 100%;
    }

    .board_li {
        height: 30px;

        line-height: 30px;
    }

    #qna_board .num {
        width: 68px;
        text-align: center;
    }

    #qna_board .div_default {
        width: 68px;
        text-align: center;
    }

    #qna_board .board_title {
        width: 280px;
        text-align: center;
    }

    #qna_board .div_title {
        width: 280px;
        text-align: left;
    }

    #qna_board .div_title a {
        width: 280px;
        display: block;
        color: #333;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
    }

    #qna_board .writer {
        width: 70px;
    }

    #qna_board .div_name {
        width: 70px;
        text-align: left;
    }

    #qna_board .date {
        width: 90px;
        text-align: center;
    }

    #qna_board .div_date {
        width: 90px;
        text-align: center;
    }

    #qna_board .reply {
        width: 90px;
        text-align: center;
    }

    #qna_board .div_reply {
        width: 90px;
        text-align: center;
    }


    #notice_board .div_badge {
        width: 80px;
        text-align: center;
    }

    #notice_board .num {
        width: 80px;
        text-align: center;
    }

    #notice_board .div_default {
        width: 80px;
        text-align: center;
    }

    #notice_board .board_title {
        width: 348px;
        text-align: center;
    }

    #notice_board .div_title {
        width: 348px;
        text-align: left;
    }

    #notice_board .div_title a {
        width: 348px;
        display: block;
        color: #333;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
    }


    #notice_board .date {
        width: 90px;
        text-align: center;
    }

    #notice_board .div_date {
        width: 90px;
        text-align: center;
    }

    #notice_board .view {
        width: 80px;
        text-align: center;
    }


    .board_list p {
        float: left;
    }

    .board_list .board_title {
        text-align: left;
    }

    .more {
        width: 100%;
        height: 41px;
        background: #0074d6;
        color: #fff;
        display: block;
        text-align: center;
        line-height: 41px;
        margin-top: 10px;
        clear: both;
    }

    #photo_board {
        width: 590px;
    }

    #photo_board .pro_photo {
        float: left;
        width: 50%;
        margin-bottom: 5px;
        height:100%;
         padding:5px;
    }


    #photo_board {
        height: 183px;

    }
    #pro_more {
        width:590px;
    }

    .pro_photo a {
        overflow:hidden;
        display:block;
        height:100%;
        text-align:center;
        position:relative;

    }
    .pro_photo img {
        width:100%;
        position:absolute;
        top:50%;
        left:50%;
        transform:translate(-50%,-50%);
    }


    #notice_board div p {
        float: left;
    }


    .elements .board_title {
        text-align: center !important;
    }

}

@media (min-width: 700px) and (max-width: 1199px) {
    #qna_board {
        width: 100%;
        border: 1px solid #ccc;
        height: 182px;
    }

    #qna_board .writer {
        width: 90px;
        text-align: center;
    }

    #notice_board div {
        height: 30px;
        line-height: 30px;
    }


    #notice_board {
        border: 1px solid #ccc;
        height: 182px;
    }
    #notice_board .div_date {
        width:100px;
        text-align:center;
    }
    .elements {
        width: 100%;
        height: 30px;
        background: #f5f5f5;
        border-bottom: 1px solid #ccc;
        line-height: 30px;
    }

    .elements p {
        float: left;
        height: 100%;
    }

    .num {
        width: 70px;
        text-align: center;
    }

    #qna_board .board_title {
        width: 358px;
        text-align: center;
    }

    #qna_board .date {
        width: 100px;
        text-align: center;
    }
    #qna_board .div_date {
        width: 100px;
        text-align: center;
    }
    #qna_board .reply {
        width: 80px;
        text-align: center;
    }

    #qna_board .div_default {
        width: 70px;
        text-align: center;
    }
    #qna_board .div_title a {
        width:358px;
        display:block;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    #qna_board .div_title {
        width: 358px;
    }

    #qna_board .div_name {
        width: 90px;
        text-align: center;
    }

    #qna_board .div_reply {
        width: 80px;
        text-align: center;
    }

    .board_title a {
        color: #333;
        width: 400px;
        white-space: nowrap;
        overflow: hidden;
        display: block;
        text-overflow: ellipsis;
    }

    #notice_board .board_title a {
        width: 500px;
    }


    .board_list p {
        float: left;
    }

    .board_list .board_title {
        text-align: left;
    }

    .more {
        width: 100%;
        height: 41px;
        background: #0074d6;
        color: #fff;
        display: block;
        text-align: center;
        line-height: 41px;
        margin-top: 10px;
        clear: both;
    }

    #photo_board {
        width: 700px;
    }

    #photo_board .pro_photo {
        float: left;
        width: 50%;
        margin-bottom: 5px;
        padding:5px;
        height:182px;
        overflow:hidden;

    }
    .pro_photo a {
        width:100%;
        padding:10px;
        height:182px;
        display:block;
        position:relative;
    }

    #photo_board {
        height: 182px;
    }

    .pro_photo a img {
        width:100%;
        position:absolute;
        top:50%;
        left:50%;
        transform:translate(-50%,-50%);
    }


    #notice_board div p {
        float: left;
    }

    #notice_board .board_title {
        width: 418px;
        text-align: left;
    }

    #notice_board .num {
        width: 90px;
        text-align: center;
    }

    #notice_board .view {
        width: 90px;
        text-align: center;
    }

    #notice_board .date {
        width: 100px;
        text-align: center;
    }

    #notice_board .div_title {
        width: 418px;
        text-align: left;
    }
    #notice_board .div_title a {
        width:418px;
        display:block;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    #notice_board .div_default {
        width: 90px;
        text-align: center;
    }

    .elements .board_title {
        text-align: center !important;
    }


}

@media (max-width: 699px) {
    .board_list {
        border-bottom: 1px solid #ccc;

    }

    .board_li {
        height:74px;
    }
    .pro_photo {
        height:182px;
    }
    .pro_photo a {
        height:180px;
        display:block;
        overflow:hidden;
        width:100%;
        position:relative;
    }

    .pro_photo a img {
        width:100%;
        position:absolute;
        top:50%;
        left:50%;
        transform:translate(-50%,-50%);
    }

    .div_default {
        width:60px;
        float:left;
        text-align:center;
        padding:5px;
    }
    .div_title {
        width:250px;
        float:left;
    }
    .div_title a {
        width:250px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        display:block;
        padding:5px;
    }

    #qna_board .div_name {
        width:33.333%;
        float:left;
        text-align:center;
        background:#eee;
        padding:5px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        display:block;
    }
    #qna_board .div_reply {
        width:33.333%;
        float:left;
        text-align:center;
        background:#eee;
        padding:5px;
    }
    #qna_board .div_date {
        width:33.333%;
        float:left;
        text-align:center;
        background:#eee;
        padding:5px;
    }

    #notice_board .div_date {
        width:50%;
        float:left;
        text-align:center;
        background:#eee;
        padding:5px;
    }
    #notice_board .div_default:last-of-type {
        width:50%;
        float:left;
        text-align:center;
        background:#eee;
        padding:5px;
    }
}