@charset "utf-8";

/* =====================
   1) 기본: 여백/타이포/유틸
   ===================== */
.pr-top-padding{
  margin-top: 5px;
  padding-top: 100px;
  padding-bottom: 130px;
}
.pr-mb-l{margin-bottom:32px;}
.pr-mt-n{margin-top: 60px !important;}
.pr-mt-sss{margin-top:8px;font-size: 1.06667rem;}
.pr-mt-ss{margin-top:12px;font-size: 1.06667rem;}
.pr-mt-s{margin-top: 40px !important;}
.pr-mt-s p{font-size: 1.06667rem;}
.pr-mt-l{margin-top: 80px !important;}
.pr-mt-sn{margin-top: 30px !important;}
.pr-mt-snb{margin-top: 120px !important;}

.fz_l{
  font-size: 1.2rem;
  letter-spacing: -0.02em;
  line-height: 1.6;
}
.fz_tit_ss{font-size:22px;line-height:1.35;font-weight:700;margin-top:24px;}
.fz_nl{font-size:16px;}
.fz_s{font-size:14px;}

.ff-tit{font-weight:700;font-size: 22px;}
.fw-b{font-weight: 700;}
.fw-b-l{font-weight:600;}
.fw-b.color-blue.tbold {
    font-weight: bold;
    font-size: 16px;
}

.color-blue{color:#0082cf !important;}
.color-blue-dark{color:#0055A3;}
.color-black{color:#000000 !important;}
.color-point{color:#C92424;}

.mt10{margin-top:10px;}
.ml5{margin-left:5px;}

.hidden{
  position:absolute!important;
  width:1px;height:1px;
  padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);
  border:0;
}

.w100p{width:100%;}
.w70p{width:70%;}
.w1{width:100%;}

.boldtitle{
  font-size: 22px;
  font-weight: 700;
  color: #222;
}


/* =====================
   2) 페이지 컨테이너/레이아웃
   ===================== */
#page-contents .inr-c2{max-width:1120px;margin:0 auto;padding:0 20px;}
@media (min-width:768px){
  #page-contents .inr-c2{padding:0 24px;}
}


/* =====================
   3) 상단 탭
   ===================== */
.tab_type1{
  border-bottom: 1px solid #e7e7e7;
  padding-top: 80px;
  font-size: 20px;
}
.tab_type1 .inner{
  max-width:1120px;margin:0 auto;padding:0 20px;
  display:flex;gap:12px;justify-content:center;
  width:100%;box-sizing:border-box; /* 안전 */
}
.tab_type1 .inner li{list-style:none;}
.tab_type1 .inner a{
  font-size: 16px;
  min-width: 280px;
  padding: 25px;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 3px solid transparent;
  border-width: 0 0 3px;
}
.tab_type1 .inner li.on a{
  border-bottom-color: #0078A6;
  color: #0078A6;
  font-weight: 600;
}

.top_reduc{
  padding-top: 40px;
}


/* =====================
   4) 텍스트/도트/이메일 링크
   ===================== */
.email-links{color:#0071CE!important;text-decoration:underline;}
.p_dot1{position:relative;padding-left:16px;color:#2B2F36;line-height:1.6;}
.p_dot1 .dot{position:absolute;left:0;top:0;}


/* =====================
   5) 안내 박스
   ===================== */
.wrap_noti_report2_1{
  position: relative;
  overflow: hidden;
  padding: 35px 0;
  background-color: #f4f4f4;
  border-radius: 0 30px 0 30px;
}
.wrap_noti_report2_1 .inner{
  background-color:#f4f4f4;
  border-radius:14px!important;padding:22px!important;
}
.wrap_noti_report2_1 .inr-c2{
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  margin-left: 60px;
  margin-right: 60px;
  box-sizing: border-box;
}
.wrap_noti_report2_1 .ico{
  min-width: 130px;
  height: 130px;
  border-radius: 50%;
  background-color: #fff;
  align-items: center;
  justify-content: center;
  display: inline-flex;
}
.wrap_noti_report2_1 .cont{
  margin-left: 40px;
  font-size: 16px;
  line-height: 2;
  font-weight: 600;
}
.wrap_noti_report2_1 .cont a{
  padding: 10px;
  background: #333;
  border-radius: 5px;
  color: #fff;
  margin-top: 10px;
  display: block;
  max-width: 190px;
  text-align: center;
  font-size: 1.06667rem;
}
.wrap_noti_report2_1 .cont a:hover{filter:brightness(.98);}

.grey-box {
    padding: 40px;
    background: #f1f1f1;
    margin-top: 30px;
}

.area_td p.inputxt{
  font-size:16px !important;
  color:#666 !important;
  margin-top:3px !important;  
  display:block;
}



/* =====================
   6) 폼 테이블/인풋/텍스트영역/라디오·체크
   ===================== */
.tlb_type1{
  border-top: 2px solid #222;
  padding-top: 0;
}
.tlb_type1 .item{
  display: flex;
  flex-wrap: wrap;
  margin-top: 0;
  padding: 20px 0;
  border-bottom: 1px #f0f0f0 solid;
}
.tlb_type1 .item:first-child{border-top:0;}
.tlb_type1 .area_th{
  min-width: 250px;
  margin-right: 20px;
  padding-top: 0;
  font-weight: 600;
  font-size: 16px;
  display: flex;
  align-items: center;
}
.tlb_type1 .area_td{width: calc(100% - 270px);}
.tlb_type1 .item > * {flex: none;}

.bdreset{
    border-top: 1px #f0f0f0 solid;
}

.area_select3.box > select
 {
    min-width: 160px;
    min-width: 70px\9;
    height: 60px;
    padding: 0 50px 0 10px;
    padding: 6px 9px 6px 15px\9;
    border: 1px solid #ddd;
    border-width: 0 0 1px;
    font-size: 17px;
    font-size: 17px\9;
    line-height: 1;
    color: #444;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    -o-appearance: none;
    background: none\9;
    background-color: #fff;
    font-weight: 400;
    outline-offset: -2px;

    border-width: 1px;
    height: 48px;
    padding-left: 20px;
    min-width: 178px;
}

.area_select3 {
    position: relative;
    display: inline-block;
    width: 280px; /* 원하는 크기로 조정 */
}

.area_select3 select {
    -webkit-appearance: none; /* 크롬, 사파리 */
    -moz-appearance: none;    /* 파이어폭스 */
    appearance: none;         /* 기본 화살표 제거 */
    width: 100%;
    padding: 8px 35px 8px 10px; /* 오른쪽 화살표 공간 확보 */
    font-size: 14px;
    border: 1px solid #ccc;
    border-radius: 4px;
    background: #fff;
    cursor: pointer;
}

/* ▼ 표시 */
.area_select3::after {
    content: "▼";
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 12px;
    color: #8e8e93;
    pointer-events: none;
}


@media (max-width:919px){
  .tlb_type1 .item{grid-template-columns:1fr;}
  .tlb_type1 .area_th{border-bottom:1px solid #ECEFF4;}
}

input[type="tel"],
input[type="text"],
input[type="password"],
input[type="file"]{
  padding:0;margin:0px;
  background:#fff;border:1px solid #dddddd;
  width:480px;height:50px;position:relative;
  line-height:50px;padding:0 20px;box-sizing:border-box;
}

.textarea1{border:1px solid #ddd;line-height:0;}
.textarea1 textarea{
  width:100%;height:220px;padding:15px 22px;box-sizing:border-box;
  border:0;margin:0;line-height:1.3;
}

/* 비밀번호 가이드 */
#pw + p{
  font-size: 16px;
  color: #666;
  padding-top: 3px;
}

/* 전화번호 3분할 */
.inp_tel{
  display: flex;
  align-items: center;
  max-width: 480px;
}
.inp_tel input{width:100%;text-align:center;}
.inp_tel .phone-line{
  min-width:30px;text-align:center;display:block;
}

/* 라디오/체크 */
.checks{display:flex;align-items:center;gap:18px;flex-wrap:wrap;}
body .checks > label{margin-right:60px;}

/* =====================
   7) 첨부파일 업로드 (inc 근접)
   ===================== */
.upload_file_wrap{
  position: relative;
  display: inline-block;
  border: 1px solid #ddd;
  background: #fff;
  height: 50px;
  box-sizing: border-box;
  overflow: hidden;
  max-width: 363px;
}
.upload_file_wrap input[type="file"]{
  height: 50px;border:0;box-sizing:border-box;
  width: 382px;direction: rtl;
  font: inherit;color: transparent;background: transparent;
  cursor: pointer;
}
.upload_file_wrap input[type="file"]::file-selector-button{
  height: 50px;padding:0 18px;border:0;border-left:1px solid #ddd;
  background:#666;color:#fff;font-weight:600;cursor:pointer;
}
.upload_file_wrap input[type="file"]::file-selector-button:hover{background:#555;}
.upload_file_wrap .filename{
  position:absolute;left:12px;right:130px;top:0;bottom:0;
  display:flex;align-items:center;color:#333;pointer-events:none;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font:inherit;
}


/* =====================
   8) 개인정보 동의 영역
   ===================== */
.wrap_textarea1{border:1px solid #ddd;}
.wrap_textarea1 .textarea{
  width:100%;height:360px;border:0;background-color:#fff;
  padding:50px;box-sizing:border-box;overflow:hidden;overflow-y:auto;
  font-size:16px;
}
.wrap_textarea1 .checks{
  background:#f9f9f9;padding:20px 40px;border-top:1px #ddd solid;
}


/* =====================
   9) 버튼
   ===================== */
.btn-wrap{
  display:flex;justify-content:center;gap:12px;margin-top:40px;flex-wrap:wrap;
}
.btn-solid{
  min-width: 300px;height:60px;display:inline-flex;align-items:center;justify-content:center;
  border:1px solid #aaa;color:#333;
  -webkit-transition: all 300ms ease-in-out;
  -moz-transition: all 300ms ease-in-out;
  -ms-transition: all 300ms ease-in-out;
  -o-transition: all 300ms ease-in-out;
  transition: all 300ms ease-in-out;
}
.btn-solid.full{
  background-color:#0082cf;color:#fff;font-size:1.06667rem;
}
.btn-solid:hover{filter:brightness(.98);}  /* ← 문법 오류 복구 */



/* 첨부파일 추가삭제 버튼 */
/* 한 줄 배치 (부모) */
.file-row{
  display: inline-flex;
  align-items: center;
  gap: 8px;              /* 파일 영역과 버튼 사이 간격 */
}

/* 파일 영역 - 기존 스타일 유지 */
.upload_file_wrap{ display:inline-block; }

/* 파일 입력의 버튼(회색 '파일 선택') 왼쪽 경계선 제거 */
.upload_file_wrap input[type="file"]::file-selector-button{ border-left: none; }
.upload_file_wrap input[type="file"]::-webkit-file-upload-button{ border-left: none; } /* Safari/구버전 */

/* + / - 아이콘 버튼 */
.file-btns{ display:inline-flex; align-items:center; gap:6px; padding-left: 15px;}

a.btn_image_add,
a.btn_remove{
  display:inline-block;
  width:25px; height:30px;
  background-size:contain;
  background-repeat:no-repeat;
  background-position:center;
  border:0; outline:0; cursor:pointer;
}
a.btn_image_add{ background-image:url(/assets/img/report/file_add.jpg); }
a.btn_remove   { background-image:url(/assets/img/report/file_del.jpg); }


/* =====================
   10) 포커스 접근성
   ===================== */
#page-contents a:focus-visible,
#page-contents button:focus-visible,
#page-contents .btn-solid:focus-visible{
  outline:2px solid rgba(0,113,206,.35);
  outline-offset:2px;border-radius:6px;
}


/* =====================
   11) 모달/확인 섹션
   ===================== */
.report_confirm{font-size: 17px;}
#more_report.modal > .inner .modal_content > .inner{
  padding: 10px 60px 50px;
}


/* =====================
   12) 반응형 (모바일 분기)
   ===================== */

/* ≤ 767px 단일 유틸 */
@media (max-width:767px){
  .w100p_mo{width:100%!important;}
}

/* ≤ 480px 세부 */
@media (max-width:480px){
  .mobile-hide{display:none!important;}
  .inp_tel{grid-template-columns:1fr 1fr 1fr;}
}

/* ≤ 768px: 입력 최적화/탭/폼/파일/안내/개인정보/버튼/모달
   - 탭 가로 스크롤 제거 + 폼/모달 100% 폭 처리
*/
@media screen and (max-width: 768px){

  /* 공통 레이아웃 여백 */
  .pr-top-padding{padding-top:56px;padding-bottom:80px;}
  #page-contents .inr-c2{padding:0 16px;}

  /* 상단 탭: 가로 스크롤 제거 */
  .tab_type1{padding-top:48px;font-size:18px;overflow-x:hidden;}
  .tab_type1 .inner{
    max-width:none;margin:0 auto;padding:0 12px;gap:8px;width:100%;box-sizing:border-box;
  }
  .tab_type1 .inner li{list-style:none;flex:1 1 0;min-width:0;}
  .tab_type1 .inner a{
    display:flex;align-items:center;justify-content:center;width:100%;
    min-width:0 !important;padding:16px 8px;box-sizing:border-box;font-size:15px;border-width:0 0 3px;
  }

  /* 폼 테이블: 세로 스택 */
  .tlb_type1 .item{display:block;padding:14px 0;}
  .tlb_type1 .area_th{min-width:0;margin:0 0 8px 0;font-size:15px;display:block;}
  .tlb_type1 .area_td{width:100%;}

  /* 인풋 공통 */
  input[type="tel"],
  input[type="text"],
  input[type="password"],
  input[type="file"]{
    width:100%;height:48px;line-height:48px;font-size:16px;
  }
  .w70p{width:100% !important;}

  /* 전화번호 3분할 */
  .inp_tel{max-width:none;gap:8px;}
  .inp_tel .phone-line{display:none;}
  .inp_tel input{height:48px;text-align:center;font-size:16px;}

  /* 텍스트영역 */
  .textarea1{border:1px solid #ddd;}
  .textarea1 textarea{height:200px;font-size:16px;padding:14px;}

  /* 라디오/체크 표시 보정 */
  #page-contents .checks input[type="radio"],
  #page-contents .checks input[type="checkbox"]{
    position:static !important;width:auto !important;height:auto !important;
    margin:0 6px 0 0 !important;opacity:1 !important;clip:auto !important;clip-path:none !important;
    appearance:auto !important;-webkit-appearance:auto !important;
  }
  #page-contents .checks label{display:inline-flex;align-items:center;gap:6px;line-height:1.3;}
  #page-contents .checks label::before,
  #page-contents .checks label::after{content:none !important;}
  .checks{gap:12px;flex-wrap:wrap;}
  body .checks > label{margin-right:16px;}

  /* 첨부파일 */
  .upload_file_wrap{max-width:100%;height:52px;}
  .upload_file_wrap input[type="file"]{width:107%;height:52px;}
  .upload_file_wrap input[type="file"]::file-selector-button{height:52px;padding:0 20px;font-size:16px;}
  .upload_file_wrap .filename{left:14px;right:140px;font-size:16px;}


  /* 안내 박스 */
  .wrap_noti_report2_1{padding:24px 0;border-radius:0 20px 0 20px;}
  .wrap_noti_report2_1 .inr-c2{margin-left:16px;margin-right:16px;align-items:flex-start;}
  .wrap_noti_report2_1 .ico{min-width:72px;height:72px;}
  .wrap_noti_report2_1 .cont{margin-left:16px;font-size:15px;line-height:1.7;}
  .wrap_noti_report2_1 .cont a{max-width:100%;font-size:16px;}

  /* 개인정보 동의: 스크롤 제거 */
  .wrap_textarea1 .textarea{
    height:auto !important;max-height:none !important;overflow:visible !important;
    padding:16px;font-size:15px;line-height:1.6;
  }
  .wrap_textarea1 .checks{padding:16px;}

  /* 버튼 */
  .btn-wrap{gap:10px;}
  .btn-solid{min-width:0;width:100%;height:54px;font-size:16px;}

  /* 모달 내부 여백/폰트 (입력부 포함) */
  #more_report.modal > .inner .modal_content > .inner{padding:10px 20px 30px;}
  .report_confirm{font-size:16px;}
}
