@charset "utf-8";

/* search */
.search_box {display: flex; align-items: center; justify-content: center; gap: 10px; margin-bottom: 60px;}
.search_box select {width: 160px; height: 50px;}
.search_box .search_input {position: relative; display: flex; align-items: stretch; flex-wrap: wrap; width: 600px;}
.search_box .search_input input {margin: 0; border-top-right-radius: 0; border-bottom-right-radius: 0; width: 1%; flex: 1 1 auto; min-width: 0; padding-right: 40px;}
.search_box .search_input button {margin: 0; width: 50px; height: 50px; font-size: 24px; font-weight: 600;}
.search_box .search_input button.search_btn {border: 1px solid var(--gray-200); border-width: 1px 1px 1px 0; border-radius: 0 4px 4px 0;}
.search_box .search_input button.search_btn > i {vertical-align: middle; color: var(--main-color);}
.search_box .search_input button.search_reset {position: absolute; top: 0; right: 50px; /* background: url('/images/page/common/icon_reset.png') no-repeat 50% 50%; */ background-size: auto 16px; border-radius: 0;}


/* table common */
.scrollTable {overflow: auto;}
.scrollTable table {min-width: 768px; margin-bottom: 5px;}
.scrollTable .bbsList td,
.scrollTable .bbsList th {white-space: nowrap;}
.tbFixed {table-layout: fixed;}
.ws_wrap{white-space: wrap;}

/* 게시판 리스트 */
.bbsList {width: 100%; border-top: 2px solid #000;}
.bbsList thead th {font-size: 1rem; font-weight: 600; color: #111; background-color: var(--gray-100); border: 1px solid var(--gray-200); padding: 15px 20px; text-align: center; vertical-align: middle;}
.bbsList thead th:first-child {border-left: 0;}
.bbsList thead th:last-child {border-right: 0;}
.bbsList tbody td {font-size: 1rem; font-weight: 400; color: var(--gray-700); border: 1px solid var(--gray-200); padding: 15px 20px; text-align: center; vertical-align: middle;}
.bbsList tbody td:first-child {border-left: 0;}
.bbsList tbody td:last-child {border-right: 0;}
.bbsList tbody td.tit {text-align: left;}
.bbsList tbody td.tit a {color: #111; font-weight: 400;}
.bbsList tbody th {font-size: 1rem; font-weight: 600; color: #111; background-color: var(--gray-100); border: 1px solid var(--gray-200); padding: 10px 15px; text-align: center; vertical-align: middle;}
.bbsList tbody th:first-child {border-left: 0;}
.bbsList tbody th:last-child {border-radius: 0;}

.bbsList tbody tr:hover {background-color: var(--gray-100);}
.bbsList tbody tr:hover td.tit a {text-decoration: underline;}

.tb_txt {position: relative; font-size: 14px; color: var(--gray-400); word-break: keep-all; padding: 3px 0; padding-left: 15px;}
.tb_txt:before {content: '※'; font-size: inherit; position: absolute; left: 0; color: #E51A2F;}

/* 게시판 상세보기 */
.bbsView {width: 100%; border-top: 2px solid #000; border-bottom: 1px solid var(--gray-200);}
.bbsView .bbsView_header {padding-top: 40px;}
.bbsView .bbsView_header h3 {display: inline-block; font-size: 28px; font-weight: 700; vertical-align: middle;}
.bbsView .bbsView_header .state {margin-right: 10px; vertical-align: middle;}
.bbsView .bbsView_header .bbsTbView {border-top: 1px solid  var(--gray-200);}
.bbsView .bbsView_header .bbsTbView th {text-align: center; word-break: keep-all;}
.bbsView .bbsView_info {font-size: 0; padding-top: 20px; padding-bottom: 30px; border-bottom: 1px solid var(--gray-200);}
.bbsView .bbsView_info * {display: inline-block; font-size: 16px; color: var(--gray-400);}
.bbsView .bbsView_info dt {font-weight: 800;}
.bbsView .bbsView_info dd {padding-left: 20px; margin-right: 40px;}
.bbsView .bbsView_info dd:last-child {margin-right: 0;}
.bbsView .bbsView_info ~ .bbsTbView {border-top: 0;}
.bbsView .bbsView_body {border-bottom: 0; padding-bottom: 30px;}
.bbsView .bbsView_body p {font-size: 1rem; color: #000; font-weight: 400; word-break: keep-all;}
.bbsView .bbsView_content {border-width: 1px 0 1px 0; padding: 40px 0;}

.bbsTbView {width: 100%; border-top: 2px solid #000;}
.bbsTbView tbody th,
.bbsTbView tbody td {padding: 15px 20px; border-bottom: 1px solid var(--gray-200); vertical-align: middle;}
.bbsTbView tbody th {background: var(--gray-100); font-weight: 600;}
.bbsTbView tbody td {color: #666;}

/* 게시판 작성 */
.bbsWrite {width: 100%; vertical-align: top; border-top: 2px solid #000;}
.bbsWrite th {padding: 10px 15px; font-size: 1rem; font-weight: 600; min-width: 15%; border-bottom: 1px solid var(--gray-200); border-right: 1px solid var(--gray-200); background-color: var(--gray-100); vertical-align: middle;}
.bbsWrite td {padding: 10px 10px; font-size: 1rem; font-weight: 400; min-width: 85%; border-bottom: 1px solid var(--gray-200); vertical-align: middle;}

/* 폼 작성 */
.form_box {width: 100%;}
.form_box + .form_box {margin-top: 40px;}
.form_box .form_group + .form_group {margin-top: 20px;}
.form_box .form_group {display: flex; align-items: center; width: 100%; clear: both; flex-wrap: wrap;}
.form_box .form_group .form_label {width: 200px; vertical-align: middle; font-size: 18px; font-weight: 600;}
.form_box .form_group .form_tit {display: block; font-size: 18px; font-weight: 600;}
.form_box .form_group .form_field {position: relative; width: calc(100% - 200px);  word-break: break-all;}
.form_box .form_group .form_field .form_control {width: 100%; background-color: #fff;}
.form_box .form_group .form_field .designFile .form_control {width: auto;}
.form_box .form_group .form_field select {background-color: #fff;}
.form_box .form_group .form_field .form_control + .form_control {margin-left: 10px;}
.form_box .form_group.tbl-col {gap: 0 40px;}
.form_box .form_group.tbl-col > div {display: flex; align-items: center; flex: 1;}
.form_box .form_group .form_field .txt {font-size: 14px; color: #999; margin-top: 5px;}
.form_box .form_group .form_field .form_control,
.form_box .form_group .form_field select {margin: 0 5px;}
.form_box .form_group .form_field .form_control:first-child,
.form_box .form_group .form_field select:first-child {margin-left: 0;}
.form_box .form_group .time_field {position: relative; display: inline-block;}
.form_box .form_group .time_field > .form_control {padding-right: 60px;}
.form_box .form_group .time_field .timer {position: absolute; top: 50%; right: 20px; transform: translateY(-50%); font-size: 1rem; color: var(--dmi-sub);}

.form_box .form_group.full {flex-direction: column; align-items: stretch;}
.form_box .form_group.full .form_label {width: 100%;}
.form_box .form_group.full .form_field {width: 100%;}

.form_box .form_group .form_field .info_box {width: 100%;}
.form_box .form_group .form_field .info_box li {display: flex; font-size: 1rem;}
.form_box .form_group .form_field .info_box li b {position: relative; flex: 0 0 80px;}
.form_box .form_group .form_field .info_box li span {position: relative; padding-left: 10px; flex: 1 1 calc(100% - 80px);}


.bbsList .search_box,
.bbsTbView .search_box {margin-bottom: 0 !important; justify-content: stretch;}
.bbsList .search_box .search_input,
.bbsTbView .search_box .search_input {width: 100%;}
.bbsList .search_box .search_input input,
.bbsTbView .search_box .search_input input {padding-right: 16px;}
.bbsList .search_box .search_input button,
.bbsTbView .search_box .search_input button {width: 40px; height: 40px; font-size: 20px;}

/* pagination */
.pagination {text-align: center; font-size: 0; margin-top: 80px; border-top: 1px solid var(--gray-200); padding-top: 50px;}
.pagination .page_item {position: relative; display: inline-block; width: 40px; height: 40px; line-height: 38px; border: 1px solid transparent; border-radius: 50%; font-size: 1rem; color: var(--gray-500); font-weight: 400; margin: 0 3px; transition: all .2s;}
/* .pagination .page_item:after {content: ''; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); width: 50%; height: 3px; border-radius: 1.5px; background-color: var(--main-color); opacity: 0; visibility: hidden;} */
/* .pagination .page_item:hover {color: var(--main-color); background-color: rgba(202, 31, 28, .1);} */
.pagination .page_item.on {color: #fff; font-weight: 500; background-color: #000;}
/* .pagination .page_item.on:after {opacity: 1; visibility: visible;} */
.pagination .page_control {display: inline-block; vertical-align: top;}
.pagination .page_control:first-child {margin-right: 10px;}
.pagination .page_control:last-child {margin-left: 10px;}
.pagination .page_control .page_item {background: no-repeat 50% 50%; background-size: auto 24px; border: 1px solid var(--gray-200);}
.pagination .page_control .page_item.page_first {background-image: url('/images/page/common/icon_bbs_first.png');}
.pagination .page_control .page_item.page_prev {background-image: url('/images/page/common/icon_bbs_prev.png');}
.pagination .page_control .page_item.page_next {background-image: url('/images/page/common/icon_bbs_next.png');}
.pagination .page_control .page_item.page_end {background-image: url('/images/page/common/icon_bbs_last.png');}

/* badge */
.badge {display: inline-block; min-width: 40px; height: 30px; padding: 4px 20px; background-color: var(--gray-200); font-size: 15px; font-weight: 400; color: var(--gray-500); border-radius: 20px; text-align: center; white-space: nowrap;}
.badge.ongoing {background-color: var(--sub-color); color: #fff;}
.badge.error {background-color: #ffdee6; color: #dc2229;}
.badge.complete {background-color: var(--main-color); color: #fff;}
.badge.ect {background-color: rgba(var(--sub-color-rgb), .2); color: var(--sub-color);}
.badge.end {background-color: var(--gray-400); color: #fff;}

/* thumb list */
.thumbList {display: flex; flex-wrap: wrap; gap: 50px 25px;}
.thumbList li {width: calc((100% - 75px) / 4);}
.thumbList li.nodata {width: 100%;}
.thumbList li a {position: relative; display: block;}
.thumbList li .thumb {position: relative; height: 0; border-radius: 10px; border: 1px solid var(--gray-200); padding-bottom: 126%; overflow: hidden;}
.thumbList li .thumb > img {position: absolute; top: 0; left: 0; width: 100%; min-height: 100%; max-height: none; min-width: 100%; object-fit: cover;}
.thumbList li .thumb .bg {position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(255, 255, 255, .1); backdrop-filter: blur(5px); transition: all .25s; opacity: 0; visibility: hidden;}
.thumbList li .thumb .bg .arw_btn {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.thumbList li:hover .thumb .bg {opacity: 1; visibility: visible;}
.thumbList li .tit {font-size: 22px; font-weight: 700; color: #000; margin-top: 23px;}
.thumbList li .date {margin-top: 23px;}
.thumbList li .date i {color: var(--gray-300); font-size: 18px; vertical-align: middle;}
.thumbList li .date span {font-size: 1rem; color: var(--gray-300); vertical-align: middle; margin-left: 10px;}

/* card list */
.cardList {display: flex; flex-wrap: wrap; gap: 40px 40px;}
.cardList li {width: calc((100% - 120px) / 4);}
.cardList li.nodata {width: 100% !important;}
.cardList li a {position: relative; display: block; border: 1px solid transparent; background-color: var(--gray-100); border-radius: 20px; padding: 60px 40px; transition: all .3s;}
.cardList li .tit {font-size: 18px; font-weight: 700; color: #333; margin-top: 25px;}
.cardList li .txt {font-size: 1rem; font-weight: 400; color: var(--gray-400); margin-top: 15px;}
.cardList li .date {font-size: 1rem; font-weight: 400; color: var(--gray-400); margin-top: 40px;}
.cardList li:not(.nodata):hover a {border-color: var(--main-color); background-color: #fff; box-shadow: 0 3px 15px 0 rgba(var(--main-color-rgb), .15);}

/* FAQ */
.faqList {border-top: 2px solid #000; border-bottom: 1px solid var(--gray-200);}
.faqList li {display: block; overflow: hidden; transition: all .3s ease;}
.faqList li + li {border-top: 1px solid var(--gray-200);}
.faqList .faq_tit {position: relative; padding: 30px 60px 30px 40px; cursor: pointer;}
.faqList .faq_tit:before {content: 'Q'; position: absolute; top: 50%; left: 20px; transform: translateY(-50%); width: 50px; height: 50px; background-color: #000; font-size: 18px; font-weight: 500; color: #fff; text-align: center; line-height: 50px; border-radius: 50%;}
.faqList .faq_tit p {font-size: 20px; font-weight: 600; color: #000; padding-left: 50px; word-break: keep-all;}
.faqList .faq_tit .arw_btn {display: block; position: absolute; top: 50%; right: 20px; width: 18px; height: 12px; margin-top: -6px; background: no-repeat 50% 50%; background-image: url('/images/page/common/icon_next.png'); background-size: auto 12px; transform: rotate(90deg);}
.faqList .faq_cont {display: none; position: relative; padding: 0 40px 30px; font-size: 17px; font-weight: 400; color: #000; word-break: keep-all;}

.faqList li.active {background-color: var(--gray-100);}
.faqList li.active .faq_tit:before {background-color: var(--main-color);}
.faqList li.active .faq_tit .arw_btn {transform: rotate(-90deg);}

.faqList li.nodata {border-width: 0 0 1px 0; border-radius: 0;}

/* 파일 업로드 */
.upload_wrap {border: 1px solid #ddd; width:100%; height:120px; text-align: center; position: relative; cursor: pointer; border-radius:10px; overflow:hidden;}
.upload_wrap.file_on {border-color: #00b894; background-color: #f0fff0;}
.upload_wrap.thumb_preview {height: 180px;}

.drop_zone{width:100%; height:100%; padding:20px;}
.drop_zone > input[type="file"]{display:none;}
.drop_zone > img {width:100%; height:100%; position:absolute; top:0; bottom:0; left:0; right:0; margin:auto; object-fit: contain;}

.view_txt {position:absolute; top:0; bottom:0; left:0; right:0; margin:auto; text-align: center; height:fit-content;}
.view_txt > img {width:40px;}
.view_txt > b{font-size:15px; color:#666; font-weight: 400; display:block;}
.view_txt > span {font-size: 13px; color:#999; font-weight: 400; display:block; word-break: keep-all;}

/* 첨부파일 */
.file_list {margin-top:10px; background-color: var(--gray-100); border-radius: 4px; padding:20px; display:flex; overflow-y: auto;}
.file_list ul{display: inline-block; width: 100%;}
.file_list li{display: block; position:relative; font-size: 15px; letter-spacing: 0;}
.file_list li + li{margin-top:5px;}
.file_list li * {display: inline; vertical-align: middle; color: var(--gray-700);}
.file_list li a i.bx {color: var(--main-color);}
.file_list li button > i {color: var(--red-color);}

/* 이전글 다음글 */
.view_ctrl {position: absolute; bottom: 0;}
.view_ctrl:before, .view_ctrl:after { content: ''; display: inline-block; width: 60px; height: 60px; background: no-repeat 50% 50%; background-size: auto 24px; border: 1px solid var(--gray-200); border-radius: 50%; vertical-align: middle; transition: border .3s;}
.view_ctrl:hover:before, .view_ctrl:hover:after {border-color: var(--gray-200);}
.view_paging .prev_btn {left: 0;}
.view_paging .next_btn {right: 0;}
.view_paging .prev_btn:after, .view_paging .next_btn:before {content: none;}
.view_paging .prev_btn:before {background-image: url('/images/page/common/icon_bbs_prev.png');}
.view_paging .next_btn:after {background-image: url('/images/page/common/icon_bbs_next.png');}
.view_ctrl .txt {display: inline-block; vertical-align: middle; color: #666; margin: 0 10px;}
.view_ctrl .txt > b { display: block; color: #333;}


/* 날짜 */
/* datepicker */
.date_form {display: inline-block; vertical-align: middle;}
.date_form > div {position: relative; display: inline-block; max-width: 150px;}
.date_form > div .action_icon {position: absolute; top: 0; right: 0; width: 40px; height: 40px; color: var(--main-color); font-size: 1rem; text-align: center; line-height: 40px;}
.date_form input {margin: 0;}

.ui-widget.ui-widget-content {display: none; position: absolute; border: 1px solid #ddd; background-color: #fff; border-radius: 4px; padding: 10px 10px; z-index: 999 !important;}
.ui-widget-header {position: relative; color: #333; text-align: center; padding: 10px 0;}
.ui-datepicker-prev, 
.ui-datepicker-next {position: absolute; top: 0; width: 14.5%; height: 100%; background-repeat:no-repeat; background-position:50% 50%; background-size: auto 12px; text-align: center; cursor: pointer;}
.ui-datepicker-prev {left: 0; background-image: url('/images/page/common/icon_prev.png');}
.ui-datepicker-next {right: 0; background-image: url('/images/page/common/icon_next.png');}
.ui-datepicker-prev span, 
.ui-datepicker-next span {display: none;}
.ui-datepicker select.ui-datepicker-month, 
.ui-datepicker select.ui-datepicker-year{height: 30px; margin: 0 2px !important; border: 1px solid #ddd; border-radius: 4px; padding: 0 19px 0 10px; padding-right:19px; font-size: 14px; color: #666; background-position: calc(100% - 7px) center;}

.ui-datepicker-calendar {width: 100%; box-sizing: border-box;}
.ui-datepicker-calendar thead th {width: calc(100% / 7); height: 35px; text-align: center; font-size: 14px; font-weight: 700; color: #333;}
.ui-datepicker thead tr > th.ui-datepicker-week-end:first-child {color: #dc2229;}
.ui-datepicker thead tr > th.ui-datepicker-week-end:last-child {color: #284fda;}
.ui-datepicker tbody tr > td.ui-datepicker-week-end:first-child a {color: #dc2229;}
.ui-datepicker tbody tr > td.ui-datepicker-week-end:last-child a {color: #284fda;}

.ui-datepicker td {height: 30px; text-align: center; vertical-align: top; font-size: 14px;}
.ui-datepicker-calendar td a {position: relative; display: block; width: 100%; height: 100%; padding: 10px; box-sizing: border-box; color: #666; border-radius: 4px; line-height: 1;}

/* datepicker hover & active */
.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight {background: var(--gray-100); color: #111; border-radius: 3px;}
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, a.ui-button:active, .ui-button:active, .ui-button.ui-state-active:hover {background: var(--main-color); color: #fff !important; border-radius: 3px;}
/* datepicker today */
.ui-datepicker-calendar td.ui-datepicker-today a:before {content: ''; position: absolute; bottom: 4px; right: 4px; display: inline-block; border: solid transparent; border-width: 0 0 7px 7px; border-bottom-color: var(--main-color);}


/* 달력 아이콘 */
.ui-datepicker-trigger {display: none !important; position: relative; z-index:10; width:50px; height:50px; background: url('/images/page/common/icon_calendar.svg') no-repeat 50%; background-size:14px 14px; font-size:0px; text-indent:-999em; vertical-align:middle;}
.ui-datepicker-trigger {position: absolute; top: 0; right: 0;}
input + .ui-datepicker-trigger{border-left:0;}

/* timepicker */
.ui-timepicker-standard {border: 1px solid #eee; border-radius: 4px;}
.ui-timepicker-standard a {color: #666;}
.ui-timepicker-standard .ui-state-hover {background-color: var(--main-color); border-color: #F6F9F2; color: #fff;}

/* yearpicker */
.yearpicker-container {width: 250px; box-shadow: none; border-color: #dadada;}
.yearpicker-items {padding: 5px 10px;}
.yearpicker-items.selected,
.yearpicker-items:hover {background-color: var(--main-color); border-radius: 3px;}
.yearpicker-items.selected,
.yearpicker-items:hover {color: #fff;}

/* timer 타이머 */
.timer_form {position: relative; display: inline-block;}
.timer_form .timer {position: absolute; top: 50%; right: 20px; transform: translateY(-50%); font-size: 1rem; color: var(--main-color);}
.timer_form .form_control {padding-right: 60px;}

/* 주소 */
.address_form input {margin: 2px 0;}
.address_form .address {display: flex; flex-wrap: wrap; gap: 2px 0; margin-top: 5px;}
.address_form .address .post_num {max-width: 200px;}

#address_add_con {display:none;}

/* icons button */
.action_icon {display: inline-block; font-size:0; padding: 0 3px; color: #666; background-color: transparent; vertical-align: middle;}
.action_icon .bx{vertical-align: middle; font-size: 1.2rem;}
.action_icon.del {color: #e82c27;}



/* **************************************** *
 * responsive
 * **************************************** */
@media (max-width: 1280px) {
    /* 게시판 상세보기 */
    .bbsView .bbsView_header h3 {font-size: 26px;}

    /* thumb list */
    .thumbList li {width: calc((100% - 50px) / 3);}

    /* card list */
    .cardList li {width: calc((100% - 80px) / 3);}
}

@media (max-width: 1024px) {
    /* search */
    .search_box {margin-bottom: 40px;}
    .search_box select {height: 40px;}
    .search_box .search_input button {width: 40px; height: 40px; font-size: 18px;}

    /* 게시판 상세보기 */
    .bbsView .bbsView_header h3 {font-size: 22px;}

    /* 폼 작성 */
	.form_box .form_group {display: block;}
    .form_box .form_group .form_label {width: 100%;}
    .form_box .form_group .form_field {width: 100%; margin-top: 5px;}
    .form_box .form_group.tbl-col > div {display: block; margin-top: 20px;}

    .pagination {margin-top: 40px; padding-top: 30px;}

    /* thumb list */
	.thumbList li .tit {font-size: 18px;}

    /* card list */
    .cardList li a {padding: 40px 30px;}

}

@media (max-width: 768px) {
    /* 검색 */
   .search_box {flex-direction: column; gap: 5px 0;}
   .search_box select {width: 100%;}
   .search_box .search_input {width: 100%;}

    /* 게시판 리스트 */
    .bbsList thead th {padding: 12px 16px; word-break: break-all; overflow-wrap: break-word;}
    .bbsList tbody td {padding: 12px 16px; word-break: break-all; overflow-wrap: break-word;}

    .responsive .bbsList {border-top: 0;}
    .responsive .bbsList,
    .responsive .bbsList tr,
    .responsive .bbsList tbody,
    .responsive .bbsList tbody td {display: block;}
    .responsive .bbsList thead,
    .responsive .bbsList thead th {display: none;}
    
    .responsive .bbsList tr {position: relative; margin-bottom: 20px; border: 1px solid var(--gray-200); border-radius: 10px;}
    .responsive .bbsList tbody td {text-align: left; border: 0; border-top: 1px dashed var(--gray-200);}
    .responsive .bbsList tbody td:first-child {border-top: 0;}
    .responsive .bbsList tbody td:last-child {border-top: 0;}

    .responsive .bbsList tbody td.tit a {font-weight: 600;}
    .responsive .bbsList tbody td.file {position: absolute; right: 0; bottom: 0;}

	.responsive .bbsList tbody td.view {display: none;}

    /* 게시판 상세보기 */
    .bbsView .bbsView_header {padding-top: 30px;}
    .bbsView .bbsView_info {padding-top: 20px; padding-bottom: 20px;}

    .bbsTbView,
    .bbsTbView tr,
    .bbsTbView tbody,
    .bbsTbView tbody th,
    .bbsTbView tbody td {display: block;}

    .bbsTbView tbody th {border-right: 0;}
    .bbsTbView tbody td {padding-left: 0; padding-right: 0;}

	/* 게시글 작성 */
	.bbsWrite,
    .bbsWrite thead,
    .bbsWrite tbody,
    .bbsWrite tr,
    .bbsWrite th,
    .bbsWrite td {display: block;}
    .bbsWrite td {padding: 10px 0;}

    /* pagination */
    .pagination .page_item {width: 32px; height: 32px; line-height: 30px;}

    /* badge */
    .badge {font-size: 12px; line-height: 22px;}

    /* thumb list */
    .thumbList li {width: calc((100% - 25px) / 2);}

    /* card list */
    .cardList {gap: 20px 20px;}
    .cardList li {width: calc((100% - 20px) / 2);}

    /* FAQ */
    .faqList .faq_tit {padding: 20px 60px 20px 30px;}
    .faqList .faq_tit:before {left: 10px; width: 40px; height: 40px; line-height: 40px;}
    .faqList .faq_tit p {font-size: 18px; padding-left: 40px;}
    .faqList .faq_cont {padding: 0 30px 30px;}
}

@media (max-width: 640px) {
    /* 게시판 상세보기 */
    .bbsView .bbsView_header h3 {font-size: 20px;}

    /* 이전글 다음글 */
    .view_paging {padding-bottom: 20px;}
    .view_ctrl:before, .view_ctrl:after {width: 50px; height: 50px;}
    .view_paging .view_ctrl {position: relative;}

    /* thumb list */
    .thumbList li {width: 100%}
}

@media (max-width: 420px) {
    .bbsView .bbsView_info * {font-size: 14px;}

    /* card list */
    .cardList li {width: 100%;}
}