@charset "utf-8";

/* -- 게시판 공통 -- */
    #board { position: relative; width: 100%; }
    #board .board { padding-top: 3%; padding-bottom: 3%; }
    #board table { border-top: 2px solid #162B71; border-bottom: 2px solid #162B71; }
    #board table th, #board table td { padding: 15px 10px; text-align: center; border-bottom: 1px solid #E6E6E6; }

    #board .web_col{ display: table-column-group; }
    #board .mob_col{ display: none; }
    #board .web_td{ display: table-cell; }
    #board .mob_td{ display: none; }

    @media ( max-width: 991px) {
        #board .board { padding-top: 5%; padding-bottom: 5%; }
        #board .web_col{ display: none !important; }
        #board .mob_col{ display: table-column-group; }
        #board .web_td{ display: none !important; }
        #board .mob_td{ display: table-cell; }
    }

/* 게시판 제목 말줄임 */
    #board .subject{ display: inline-block; width: 100%; text-align: left; line-height: 1.5em; vertical-align: middle; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    #board .subject2 { text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; /* 라인수 */ -webkit-box-orient: vertical; word-wrap:break-word; line-height: 1.2em; height: 2.4em; overflow: hidden; }
    #board .subject3 { text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; /* 라인수 */ -webkit-box-orient: vertical; word-wrap:break-word; line-height: 1.2em; height: 3.6em; overflow: hidden; }

/* -- 비밀번호 -- */
    #board_pw{padding: 5% 1%; text-align : center;  border: 1px solid #333a99;  background: #fff; }
    #board_pw .pw_title{ padding:0 0 10px 0; font-size: 1.2em; }
    #board_pw .btn_ok{padding: 5px 20px; font-weight: 500; vertical-align: middle; color: #fff; background: #7a6a56;}
    #board_pw .btn_no{ padding: 5px 20px; font-weight: 500; vertical-align: middle; color: #fff; background: #333a99; }
    #board_pw input[type="password"]{ width:  40%; }

/* -- 버튼 -- */
    .btn_wrap { padding: 3% 0 0 0; overflow: hidden; }
    .btn_wrap .fl_center{ text-align: center; }
    .btn_wrap .fl_left{ text-align: left; }
    .btn_wrap .fl_right{ text-align: right; }
    .btn_wrap a{ display: inline-block; height: 40px; margin: 0 3px; padding: 0 50px; vertical-align: middle; text-align: center; line-height: 40px; border-radius: 10px; }
    .btn_wrap input[type="submit"]{ display: inline-block; vertical-align: middle; width: auto; padding: 0 50px; line-height: 40px; border-radius: 50px; }
    .btn_wrap .prev{ color: #fff; background: #808080; } /* 이전 */
    .btn_wrap .next{ color: #fff; background: #2565d0; } /* 다음 */
    .btn_wrap .save{ color: #fff; background: #2565d0; } /* 저장 */
    .btn_wrap .list{ color: #fff; background: #808080; }
    .board_search input[type="submit"]{ color: #fff; background: #808080; } /* 검색버튼 */
    .board_search input[type="button"]{ color: #fff; background: #808080; } /* 전체보기 */

/* -- 글갯수 -- */
    #board .total{ padding: 0 2px 10px 0; text-align: left; line-height: 1em; }
    @media (max-width:991px) {
        #board .total{ text-align: right; }
    }

/* -- 개시물 없음 -- */
    .no_data{ padding: 10% 0; text-align: center; }
    .no_data i{ font-size: 3em; }
    .no_data p{ padding: 10px 0 0 0; }

/* -- 리스트 -- */
    .list th{ background: #F5F5F5; }
    #board .list span{ display: none; }
    @media (max-width:991px){
        #board .list { width: 100%; border-bottom: 1px solid #E6E6E6; }
        /* #board .list td:nth-child(2){ border-top: 1px solid #E6E6E6; border-bottom: 0; display: block; width: 100%; padding: 15px 10px 0 10px; font-weight: 700; }
        #board .list td:nth-child(3), #board .list td:nth-child(4) { display: inline-block; width: auto; padding: 0 0 15px 10px; border:0; } */
        #board .list span{ display: inline-block; }
    }

/* 대출후기 */
.after_list { display: flex; flex-wrap: wrap; gap: 70px 20px; padding: 40px 0; border-top: 3px solid #162B71; border-bottom: 1px solid #162B71; }
    .after_list li { width: calc(25% - 15px); }
    .after_list .title { margin: 30px 0 0 0; }
    .after_list .name { margin: 5px 0 10px 0; }
    @media (max-width:991px){
        .after_list { gap: 20px 10px; padding: 20px 0; }
            .after_list li { width: calc(50% - 5px); }
            .after_list .title { margin: 15px 0 0 0; }
            .after_list .name { margin: 2px 0 5px 0; }
    }

/* -- 페이징 -- */
    #page { padding: 3% 0 0 0; text-align: center; clear: both; }
    #page button{ display: inline-block; width: 40px; height: 40px; margin: 0 2px; border: 0; outline: 0; background: #E6E6E6; }
    #page button:hover { color: #fff; background: #077AD2; }
    #page span { position: relative; }
    #page .on { color: #fff; background: #077AD2; }
    #page .on:hover{ color: #fff; }
    #page .first, #page .prev, #page .next ,#page .last{ width: 20px; height: 40px; background: url('../../img/common/arrow.png') no-repeat; vertical-align: top; }
    #page .first{ background-position: -40px 8px; }
    #page .prev{ background-position: 0px 8px; margin: 0 10px 0 0; }
    #page .next{ background-position: -20px 8px; margin: 0 0 0 10px; }
    #page .last{ background-position: -60px 8px; }
    #page .prev:hover{ background: url('../../img/common/arrow.png') no-repeat; background-position: 0px 8px; }
    #page .next:hover{ background: url('../../img/common/arrow.png') no-repeat; background-position: -20px 8px; }
    @media (max-width:991px){
        #page { padding: 5% 0 0 0; }
    }

/* -- 검색 -- */
    .board_search { width: 45%; margin: 0 auto; padding: 3% 0 0 0; text-align: center; }
    .board_search ul{ font-size: 0; }
    .board_search ul li{ display: inline-block; width: 20%; padding: 0 1px; font-size: 16px; vertical-align: middle; }
    .board_search ul li:nth-child(2){ width: 40%; }
    .board_search input, .board_search select{ border-radius: 5px; }
    @media (max-width:991px) {
        .board_search { width: 90%; margin: 0 auto; }
        .board_search ul li{ font-size: 14px; }
    }
    @media (max-width:767px) {
        .board_search ul li{ font-size: 12px; }
    }

/* -- 보기 -- */
    #board .view th{ padding: 15px 10px; text-align: left; font-weight: 500; background: #F5F5F5; }
    #board .view td{ padding: 15px 10px; text-align: left; border-bottom: 1px solid #f1f1f1; }
    #board .view .date{ font-size: 0.9em; color: #595959; }
    #board .view .con{ text-align: left; }
    #board .view .con img{ display: block; width: auto; max-width: 100%; margin: 0 auto; }

    #board .next{ color: #595959; border-top: 0; }
    @media (max-width:991px) {
        #board .next td{ display: block; width: 100%; text-align: left; }
        #board .next td:nth-child(1){ padding: 15px 10px 0 10px; border-bottom: 0; }
    }

/* -- FAQ -- */
    .faq dt, .faq dd { position: relative; padding: 10px 50px; line-height: 30px; font-weight: 300; }
    .faq dt{ cursor: pointer; border-top: 1px solid #9e9e9e; }
    .faq dd{ display: none; border-top: 1px solid #eee; background: #fafafa; }
    .faq dt i, .faq dd i{ position: absolute; left: 10px; display: inline-block; width: 30px; text-align: center; border-radius: 0 3px 3px 3px; }
    .faq dt i{ color: #4254f3; border: 1px solid #4254f3; }
    .faq dd i{ color: #999490; border: 1px solid #999490; }
    .faq dt span{ position: absolute; right: 10px; display: inline-block; width: 30px; text-align: center; }
    .faq dt span:before{ content: "\e942"; font-family: "xeicon"; }
    .faq .active span:before{ content: "\e945"; font-family: "xeicon"; color: #4254f3; }


/* 상단 */
.hero { padding: 100px 0; color: #fff; }
.hero h1 { font-family: "Paperlogy-8ExtraBold"; font-size: 50px; }
.notice_bg { background: url(../../img/03_board/noti_bg.png) center no-repeat, #3e4997; }
.after_bg { background: url(../../img/03_board/after_bg.png) center no-repeat, #077AD2; }
@media (max-width:991px) {
    .hero { padding: 50px 0; background-size: 170%; }
    .hero h1 { font-size: 30px; }
}

.tt_top { padding: 0 0 15px 0; }