/* Small phones to small tablets: from 0 to 767px */

@media only screen and (max-width: 767px) {
  body {
    font-size:1.2rem;
  }
  #wrap {width: 100%; min-width:auto;}
  #header {width: 100%;height: 95px;margin:0 auto;}
  #banner {width: 100%;height: 140px; position: relative}
  #contents {width: 100%;}
  #footer {width: 100%;clear:both;}

  .container {width: 100%;}

  .header {overflow: auto;}
  .header h1 {float:none; margin: 28px auto 0;}
  .header h1 img {vertical-align: middle;}
  .header .nav {display:none;}
  .header .nav_icon {display:none;}

  /* banner */
  #banner h2 {font-size:1.4rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
  #banner h3 {font-size:1.0rem;}
  #banner p {font-size:0.9rem;  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
  #banner .banner_icon {display:none;}
  #banner .noticewrap {display:none;}
  #banner p.p_notice {width:100%;}
  #banner p.p_notice a {width:100%;}
  #banner br.mobr {display:block;}

  .noticePhone {font-size:1rem;}

  .investor {display:none;}

  .corporate {padding:20px 0 50px;font-size:1.2rem;}
  .corporate .corporate_box li {width: 100%;padding-top:30px;margin-left:20px;font-size:1.2rem;}

  .footer_top {display:none;}

  .footer_bom address {padding:10px;}
  .footer_bom br.mobr {display:block;}
  .footer_bom span.spbar {display:none;}
  .footer_bom address {line-height:150%}

  .comment_master_help {display:block;}
  .comment_master_help > div {display:block;padding-left:10px;width:95%;padding-right:10px;}
  .comment_master_help > div > a {display:block;width:100%;padding:2px;}
  .comment_master_help > div > a {line-height:200% !important;}

  .info_wrap { width:95%; margin:0 auto;}

  .info_wrap img {width:100%;}

  .regularly_service_info {width:100%; min-width:auto; font-size:1.1em; height:auto; padding:1em;}
  .regularly_service_info br {display:block;}

  .responsive-table {width:95%; margin:0 auto;}
  .responsive-table input.txt {width:90%;}
  .contents1 .lbl_agree1 {font-size:1rem;}

  .banner {background-size:cover; background-position:center;}

  h2.mt30 {
    font-size:1.2rem;
  }
  .contents1 p.mt10 {
    font-size:1.0rem;
  }

  .noticePhone {
    margin: 10px 0;
    padding: 0px 10px;
    font-size:1rem;
  }

  .member > p {color:#666;margin-top: 20px;text-align:center;padding: 0 20px;}

  .info_wrap .info_area ul>li>a { width:250px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }

  .container .contents1 > div {font-size:1rem;}

  .comment_master_table_list {display:block;}
  .comment_master_table_list col.num {width:25% !important;}
  .comment_master_table_list col.bzusername {display:none;}
  .comment_master_table_list col.content {width:50%}
  .comment_master_table_list col.commentscount {display:none;}
  .comment_master_table_list col.likecount {display:none;}
  .comment_master_table_list col.createdtime {display:none;}
  .comment_master_table_list col.wdate {display:none;}
  .comment_master_table_list col.state {display:none;}
  .comment_master_table_list col.goview {width:25% !important;}
  .comment_master_table_list col.money {display:none;}

  .comment_master_table_list th.num { }
  .comment_master_table_list th.bzusername {display:none;}
  .comment_master_table_list th.content {}
  .comment_master_table_list th.commentscount {display:none;}
  .comment_master_table_list th.likecount {display:none;}
  .comment_master_table_list th.createdtime {display:none;}
  .comment_master_table_list th.wdate {display:none;}
  .comment_master_table_list th.state {display:none;}
  .comment_master_table_list th.goview {}
  .comment_master_table_list th.money {display:none;}

  .comment_master_table_list td.num { }
  .comment_master_table_list td.bzusername {display:none;}
  .comment_master_table_list td.content {}
  .comment_master_table_list td.commentscount {display:none;}
  .comment_master_table_list td.likecount {display:none;}
  .comment_master_table_list td.createdtime {display:none;}
  .comment_master_table_list td.wdate {display:none;}
  .comment_master_table_list td.state {display:none;}
  .comment_master_table_list td.goview {}
  .comment_master_table_list td.money {display:none;}
  
  .btn_area > p {font-size:14px;}
  .btn_area br.mobr {display:block;}

  .comment_master_table_view table > colgroup > col {width:100% !important;}
  .comment_master_table_view table tbody > tr > th {width:100% !important;}
  .comment_master_table_view table tbody > tr > td {width:100% !important;}

  .comment_master_table_view table tbody > tr > td {width:100% !important;}
  a.btn {display:block;width:90%;margin:5px auto;text-align:center;}

  .chartStatic {display:none;}

  .container {width:95%;}
  
  .notice p {font-size:1rem;}

  .member .login_area {width:100%;}
  .member .loginbox {margin: 10px;}
  .member .loginbox .desc {font-size: 1rem;}
  .member .join_text {font-size:1rem;}

  br.mobr {display:block;}

  table tbody tr > .title-null {display:none;}

  .progress_text {font-size:1rem;}

  .comment_master_table_list .tbl_tp01.comment_data_list { table-layout: auto; }
  .comment_master_table_list .tbl_tp01.comment_data_list col.createdtime {width:100%;}
  .comment_master_table_list .tbl_tp01.comment_data_list col.bzusername {width:100%;}
  .comment_master_table_list .tbl_tp01.comment_data_list col.state {width:100%;}
  .comment_master_table_list .tbl_tp01.comment_data_list col.content {width:100%;}
  .comment_master_table_list .tbl_tp01.comment_data_list col.goview {width:100%;}

  /* 헤더 숨기기 */
  .tbl_tp01.comment_data_list thead { display: none; }

  /* 각 행을 블록(카드)으로 */
  .tbl_tp01.comment_data_list tr { display: block; border: 1px solid #ddd; margin-bottom: 12px; padding: 10px; }

  /* 각 셀에 라벨 표시 */
  .tbl_tp01.comment_data_list td { display: flex; justify-content: left; border: none; border-bottom: 1px solid #ddd;} 
  .tbl_tp01.comment_data_list td::before {
    content: attr(data-label);
    font-weight: bold;
    width:15%;
  }

}


/* 반응형: 768px 이하 (태블릿 대응) */
@media screen and (max-width: 768px) {
  .mt30 {
    margin-top: 30px;
  }

  .al_c {
    text-align: center;
  }

/*  .responsive-table {*/
/*    overflow-x: auto;*/
/*  }*/

  /* 표 스타일 개선 */
  .tbl_tp02 {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
  }

  .tbl_tp02 caption {
    font-weight: bold;
    text-align: left;
  }

  .tbl_tp02 th,
  .tbl_tp02 td {
    padding: 12px 10px;
    border: 1px solid #ddd;
    word-break: keep-all;
    vertical-align: top;
  }

  .tbl_tp02 th {
    background-color: #f0f0f0;
    width: 25%;
  }


  .tbl_tp02 th,
  .tbl_tp02 td {
    font-size: 13px;
    padding: 10px 8px;
  }
  h2.info_help {
    font-size:25px;
  }

  .tbl_tp02,
  .tbl_tp02 thead,
  .tbl_tp02 tbody,
  .tbl_tp02 th,
  .tbl_tp02 td,
  .tbl_tp02 tr {
    display: block;
    width: 100%;
  }

  .tbl_tp02 th {
    background: none;
    font-weight: bold;
    border: none;
    padding: 0;
  }

  .tbl_tp02 td {
    padding: 5px 0;
    border: none;
  }

  .tbl_tp02 td:before {
    content: attr(data-label);
    font-weight: bold;
    display: block;
    margin-bottom: 4px;
  }
}