.faq__list {border-top: 1px solid #111; font-size: 1.0625em; font-weight: 500; line-height: 157%;}
.faq__item {border-bottom: 1px solid #e6e6e6;}

.faq__q {cursor: pointer; padding: 20px 110px; position: relative;}
.faq__q::after {content: ''; display: block; position: absolute; top: 22px; right: 50px; width: 24px; height: 24px; border: 0; transform: none; background: url(/img/faq_arrow.png) no-repeat center center; background-size: 100%; -webkit-transition: transform 0.3s ease; transition: transform 0.3s ease;}
.faq__q.on::after {-webkit-transform: rotate(180deg); transform: rotate(180deg);}

.faq__a {padding: 20px 20px 20px 170px; display: none; position: relative; color: #0B4198;}
.faq__a * {word-break: keep-all;}

.faq_badge {display: flex; align-items: center; justify-content: center; position: absolute; top: 15px; left: 40px; width: 37px; height: 37px; background: #F6F6F6; color: #999; border-radius: 50%;}
.faq__a .faq_badge {background: #F4F6FB; color: #0B4198; left: 110px;}


.write_btn {display: flex; align-items: center; justify-content: center; background: #111; color: #fff; column-gap: 15px; padding: 15px 26px; margin: 0 0 10px auto; font-size: 0.875em; font-weight: 500; width: fit-content;}
.write_btn img {width: 15px; transition: transform .2s;}
.write_btn:hover img {transform: translateX(3px);}

.board_table {text-align: center;}
.board_table thead {border-top: 1px solid #111111; border-bottom: 1px solid #e6e6e6; color: #666; font-weight: 600; font-size: 0.9375em;}
.board_table thead th {height: 60px;}
.board_table tbody tr {border-bottom: 1px solid #e6e6e6;}
.board_table tbody td {padding: 20px 10px; font-weight: 500;}
.board_table tbody td.title {text-align: left;}
.board_table tbody td.title,
.board_table tbody td.writer {font-size: 1.0625em;}
.board_table tbody td.number,
.board_table tbody td.date,
.qna_table tbody td.state span {font-size: 0.875em;}
.board_table tbody td.date {color: #aaa;}

.board_table tbody td.number {width: 130px;}
.board_table tbody td.title {width: auto;}
.board_table tbody td.writer {width: 120px;}

.qna_table tbody td.date {width: 100px;}
.qna_table tbody td.state {width: 150px;}

.qna_table tbody td.title a {
  line-height: 137%; width: fit-content;
  white-space: normal;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  word-break: break-all;
}
.qna_table tbody td.title:hover a {text-decoration: underline; text-underline-offset: 3px;}
.qna_table tbody td.state span {padding: 5px 15px; border-radius: 5px;}
.qna_table tbody td.state span.standby {background: #F6F6F6; color: #999;}
.qna_table tbody td.state span.end {background: #EDF0F9; color: #0B4198;}

.review_table tbody td.date {width: 130px;}
.review_table tbody td.title p.category {font-size: 0.875rem; color: #aaa; margin-bottom: 8px;}
.review_table tbody td.title .title_under {
  line-height: 137%; width: fit-content;
  white-space: normal;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  word-break: break-all;
}
.review_table tbody td.title:hover .title_under {text-decoration: underline; text-underline-offset: 3px;}

.board_view_table {display: flex; flex-wrap: wrap; border-top: 1px solid #111; font-size: 1.0625em; font-weight: 500; line-height: 140%;}
.board_view_table > li {width: 100%; display: flex; align-items: center; border-bottom: 1px solid #E6E6E6;}
.board_view_table > li > div {height: 100%;}
.board_view_table > li.cont {height: 390px;}
.board_view_table > li .lt {width: 230px; background: #F6F6F6; text-align: center; display: flex; justify-content: center; align-items: center;}
.board_view_table > li .rt {width: calc(100% - 230px); display: flex; align-items: center;}
.view_view_table > li .rt {min-height: 90px; padding: 20px 30px;}
.view_view_table > li.cont .rt {align-items: flex-start;}
.comment_table {border-top: 1px solid #0B4198; margin-top: 50px;}
.comment_table > li .lt {background: #F4F6FB; color: #0B4198;}
.comment_table > li .rt {padding: 35px 30px;}

.board_write_table > li .rt {padding: 20px 30px; padding-right: 100px; height: 100%;}
.board_write_table > li .rt input,
.board_write_table > li .rt textarea,
.board_write_table > li .rt select {background: #FFFFFF; border: 1px solid #E6E6E6; border-radius: 5px; padding: 0 20px; width: 100%;}
.board_write_table > li .rt input,
.board_write_table > li .rt select {height: 50px;}
.board_write_table > li .rt textarea {padding-top: 15px; padding-bottom: 15px; height: 100%;}
.board_write_table > li .rt select {background: #fff url(/img/select.png) no-repeat right 15px center; background-size: 24px; padding-right: 50px;}
.board_write_table > li .rt select {color: #aaa;}
.board_write_table > li .rt option:not(:first-of-type) {color: #111;}
.board_write_table > li .rt > *.width_half {width: 500px; max-width: 100%;}

.view_bt_btn {margin-top: 40px;}

@media screen and (max-width: 1024px) {
  .faq__q {padding: 20px 60px 20px 80px;}
  .faq__q::after {top: 22px; right: 20px;}
  .faq__a {padding: 20px 20px 20px 140px;}
  
  .faq_badge {left: 20px; width: 35px; height: 35px;}
  .faq__a .faq_badge {left: 80px;}

  .view_view_table > li .rt {min-height: 80px; padding: 20px 20px;}
  .comment_table > li .rt {padding: 30px 20px;}
  .board_view_table > li.cont {height: 320px;}
  .board_view_table > li .lt {width: 200px;}
  .board_view_table > li .rt {width: calc(100% - 200px);}

  .board_write_table > li .rt {padding: 20px 20px;}
  .board_write_table > li .rt input,
  .board_write_table > li .rt textarea,
  .board_write_table > li .rt select {padding: 0 20px;}
  .board_write_table > li .rt > *.width_half {width: 100%;}

  .board_table tbody td.number {width: 70px;}
  .board_table tbody td.writer {width: 100px;}
  
  .qna_table tbody td.date {width: 100px;}
  .qna_table tbody td.state {width: 110px;}
  
  .review_table tbody td.date {width: 100px;}
}

@media screen and (max-width: 768px) {
  .faq__q {padding: 17px 40px 17px 55px;}
  .faq__q::after {top: 18px; right: 10px; width: 21px; height: 21px;}
  .faq__a {padding: 10px 20px 20px 100px;}
  
  .faq_badge {top: 13px; left: 10px; width: 30px; height: 30px;}
  .faq__a .faq_badge {left: 55px; top: 6px;}

  .view_view_table > li .rt {min-height: 65px; padding: 15px;}
  .comment_table > li .rt {padding: 22px 15px;}
  .board_view_table > li.cont {height: 275px;}
  .board_view_table > li .lt {width: 150px;}
  .board_view_table > li .rt {width: calc(100% - 150px);}
  .comment_table {margin-top: 40px;}

  .board_write_table > li .rt {padding: 15px;}
  .board_write_table > li .rt input,
  .board_write_table > li .rt textarea,
  .board_write_table > li .rt select {padding: 0 15px;}
  .board_write_table > li .rt input,
  .board_write_table > li .rt select {height: 45px;}
  .board_write_table > li .rt select {background: #fff url(/img/select.png) no-repeat right 15px center; background-size: 21px; padding-right: 45px;}

  .board_table thead th {height: 50px;}
  .board_table tbody td {padding: 15px 10px;}
  .board_table tbody td.title, .board_table tbody td.writer {font-size: 1em;}

  .board_table tbody td.number {width: 50px;}
  .board_table tbody td.writer {width: 70px;}
  
  .qna_table tbody td.date,
  .review_table tbody td.date {width: 90px;}
  .qna_table tbody td.state {width: 80px;}
  .review_table tbody td.title p.category {margin-bottom: 5px;}
  
  .write_btn {padding: 12px 20px; column-gap: 10px;}
}

@media screen and (max-width: 540px) {
  .sub_banner .sub_tab li {width: 33.3333%;}
  .faq__list {line-height: 145%; font-size: 1em;}
  .faq__q {padding: 15px 35px 15px 37px;}
  .faq__q::after {top: 17px; right: 5px; width: 18px; height: 18px;}
  .faq__a {padding: 5px 0 15px 37px;}
  
  .faq_badge {top: 12px; left: 0; width: 27px; height: 27px;}
  .faq__a .faq_badge {left: 0; top: 2px;}

  .board_view_table {font-size: 1em;}
  .view_view_table > li .rt {min-height: auto;}
  .board_view_table > li.cont {height: 180px;}
  .board_view_table > li .lt {width: 85px;}
  .board_view_table > li .rt {width: calc(100% - 85px);}
  .board_table tbody td.title {font-size: 1.05em;}
  .comment_table {margin-top: 30px;}

  .board_write_table > li .rt {padding: 12px 0 12px 12px;}
  .board_write_table > li .rt input,
  .board_write_table > li .rt select {height: 40px;}
  .board_write_table > li .rt textarea {padding-top: 10px; padding-bottom: 10px;}
  .board_write_table > li .rt select {background: #fff url(/img/select.png) no-repeat right 10px center; background-size: 18px; padding-right: 36px;}
  
  .view_bt_btn {margin-top: 35px;}
  .view_bt_btn a {width: 90px;}
  
  .board_table {border-top: 1px solid #111;}
  .board_table thead {display: none;}
  .board_table tbody tr {display: flex; align-items: center; flex-wrap: wrap; padding: 15px 0; column-gap: 15px; row-gap: 10px;}
  .board_table tbody td.number {display: none;}
  .board_table tbody td {padding: 0;}
  .board_table tbody td.title, .board_table tbody td.writer {width: 100%;}
  .board_table tbody td.writer {width: fit-content;}
  .qna_table tbody td.state {width: fit-content;}
  .qna_table tbody td.date, .review_table tbody td.date {width: fit-content;}
  .qna_table tbody td.state span {padding: 3px 10px;}

  .write_btn {padding: 10px 15px; column-gap: 7px; font-size: 0.9em;}
  .write_btn img {width: 13px;}
  #qna #searchBar,
  #review #searchBar {margin-bottom: 20px;}
}