@charset "utf-8";

/* 가운데 영역 */
.container {position: relative; width: 1200px; margin: 0 auto; }

/* 로우 영역 */
.row {padding: 0 24px;}

#captcha #captcha_img {width: 100px !important;} /* 캡챠이미지 사이즈 */

/* 메인 */
#qna_bbs {margin-top: 163px;}
.qna_bbs {width: 100%; height: 400px; background: url(../img/qna_bg.jpg) no-repeat center center;
background-size: cover;}
.qna_bbs .box {
display: flex; flex-wrap: wrap; flex-direction: column; align-items: center; justify-content: center;
background: linear-gradient(120deg,#71ff89,#1e8796);
width:292px; height:150px;
position: absolute;
top: 100px; left:50px;
text-align: center;
box-shadow: 3px 3px 5px rgba(0,0,0,0.5);
}
.qna_bbs .box h3 {font-size: 28px; color:#fff;}
.qna_bbs .box p {color:#fff;}

/* 게시판 */
.tatal {overflow: hidden; width: 100%; padding-top: 50px;}
.tatal .menu_list {float: left; width: 20%; padding: 24px 0;}
.tatal .menu_list h4 {font-size: 16px; color:#222; text-align: center; padding: 24px 0; border-bottom: 5px solid #222;
    border-top: 5px solid #222;}
.tatal .menu_list ul {}
.tatal .menu_list li {position: relative; border-left: 1px solid #dbdbdb; border-right: 1px solid #dbdbdb;}
.tatal .menu_list li a {
   font-size: 16px;
   color: #222; border-bottom: 1px solid #dbdbdb;
   padding: 10px;
   display: block;
   transition: box-shadow 0.34s ease, background 0.34s ease;
   }
.tatal .menu_list li a:hover { box-shadow: inset 180px 0 0 0 rgba(36,130,174,0.7);color: #fff; background: rgba(36,130,174,0.9);}

.tatal .board_list {float: left; width: 80%; text-align: center;  padding: 24px; }
.tatal .board_list h5 {font-size: 53px;
    color: #222;
    text-align: center;
    padding-left: 24px;
    font-family: 'Nanum Brush Script', cursive;
    border-top: 5px solid #222;
    border-bottom: 1px solid #222;}
.tbl_head01 thead th {background: #f2f2f2;}


  /* 푸터 */
  #footer { background: #222;  padding-top: }
  .footer_sns {position: absolute; right: 17px; top: 33px; }
  .footer_sns ul { text-align: right; }
  .footer_sns li { display: inline-block; margin-right: 20px; }
  .footer_sns ul li a {color: #fff;}
  .footer_sns ul li a i {color: #fff; font-size:40px;}
  .footer_sns .tel {text-align: right; padding-top: 5px;}
  .footer_sns .tel a {color: #8f8f8f; font-size: 21px;}
  .footer_sns .tel a em {color: #fff;}

  .footer_infor {position: relative; padding: 50px 0; width: 80%;}
  .footer_infor h2 img {width:150px; opacity: .8;}
  .footer_infor ul {padding: 15px 0;}
  .footer_infor li {position: relative; display: inline; padding-right: 16px; white-space: nowrap;}
  .footer_infor li:after {content: ''; position: absolute; right: 5px; top: 5px; width: 1px; height: 11px; background: #8f8f8f;}
  .footer_infor li:last-child:after {width: 0; height: 0;}
  .footer_infor li a {color: #8f8f8f;}
  .footer_infor address p {color: #8f8f8f; padding-bottom: 15px;}


/* 미디어쿼리 */
@media (max-width: 1210px){
  .container {width: 100%;}
}
@media (max-width: 1024px){
 .qna_list .container {width: 940px;}
}
@media (max-width: 960px){
  #qna_bbs {margin-top: 85px;}
  .qna_list .container {width: 750px;}
  .qna_list {padding: 22px;}
  .qna_list h4 {padding-top: 24px;}
  .tbl_head01 thead th {padding: 12px 0;}

  .tatal .menu_list {float: none; width: 100%;}
  .tatal .menu_list h4 {font-size: 22px; font-family: sans-serif;  padding: 8px 0; border-bottom: 3px solid #222;}
  .tatal .board_list {width: 100%; padding:50px 0;}
  .tatal .board_list h5 { font-size: 22px; font-family: sans-serif; border-bottom: 3px solid #222; padding: 8px 0;}
  .tatal .menu_list li { border-left: 0; border-right: 0;}

  .footer_sns {position: static; text-align: center; background: #352c2c; padding: 15px 0;}
  .footer_sns .tel {display: none;}
  .footer_infor {width: 100%; text-align: center;}
}

@media (max-width: 768px){
  .qna_list .container {width: 580px;}
  .qna_bbs {height: 300px;}
  .qna_bbs .box h3 {font-size: 22px;}
  .qna_bbs .box {width: 200px; height: 97px; top: 70px; left:30px;}
  .qna_bbs .box p {display: none;}


}

@media (max-width: 600px){
.row {padding: 0 12px;}
.btn01 ul {display: block;}
.btn01 ul li {
width: 100%;
padding: 3px;
border:1px solid #ccc;
margin-bottom: 8px;
box-sizing: border-box;}

.qna_list .container {width: 522px;}
.qna_list {padding: 7px;}
.qna_list h4 {font-size: 18px; padding-top: 12px;}
}

@media (max-width: 480px){
.row {padding: 0 8px;}
.qna_list .container { width: 345px; }
.qna_bbs {height: 200px;}
.qna_bbs .box h3 {font-size: 18px;}
.qna_bbs .box {height: 78px; top: 40px; left:20px;}

.tatal {padding-top: 12px;}
.tatal .menu_list h4 {font-size: 16px;}
.tatal .board_list h5 {font-size: 16px;}
.tatal .menu_list li a {font-size: 13px;}
}

@media (max-width: 320px){

}