@charset "utf-8";
/* 보험사 선택 */
.insurance_section .sticky_box {
  position: sticky;
  left: 0;
  top: 64px;
  background: rgb(255, 255, 255);
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 1) 0%,
    rgba(255, 255, 255, 1) 80%,
    rgba(255, 255, 255, 0.8995973389355743) 95%,
    rgba(255, 255, 255, 0) 100%
  );
  z-index: 1000;
}
.insurance_section .tab_box {
  display: flex;
  flex-wrap: wrap;
}
.insurance_section .tab_box li {
  margin-right: 8px;
}
.insurance_section .tab_box li a {
  display: block;
  height: 32px;
  font-size: 15px;
  font-weight: 400;
  color: #666;
  line-height: 31px;
  letter-spacing: -0.375px;
  padding: 0 10px;
  background: #f0f0f0;
  border-radius: 16px;
}
.insurance_section .tab_box li.on a {
  font-weight: 500;
  color: #ffffff;
  background: #4dac26;
}
.insurance_section .select_top {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.insurance_section .select_top .title {
  flex: 1;
  font-size: 17px;
  font-weight: 500;
  color: #111;
  line-height: 24px;
  letter-spacing: -0.425px;
}
.insurance_section .select_top .count {
  color: #4dac26;
  margin-left: 5px;
}
.insurance_section .select_top .btn_clear {
  display: inline-block;
  font-size: 13px;
  font-weight: 400;
  color: #111;
  line-height: 30px;
  padding: 0 12px;
  background: #ffffff;
  border: 1px solid #e0e0e0;
  border-radius: 6px;
}
.insurance_section .select_list {
  display: flex;
  flex-wrap: wrap;
}
.insurance_section .select_list li {
  position: relative;
  width: calc(33.33% - 8px);
  margin-right: 12px;
  overflow: hidden;
}
.insurance_section .select_list li:nth-of-type(3n) {
  margin-right: 0;
}
.insurance_section .select_list li:nth-of-type(n + 4) {
  margin-top: 12px;
}
.insurance_section .select_list li input[type="checkbox"] {
  display: none;
}
.insurance_section .select_list li input[type="checkbox"] + label {
  width: 100%;
  height: 84px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: #ffffff;
  border: 1px solid #e0e0e0;
  border-radius: 4px;
  cursor: pointer;
}
.insurance_section .select_list li input[type="checkbox"] + label .logo {
  display: block;
  width: 42px;
  height: 24px;
  text-align: center;
  overflow: hidden;
  transition: opacity 0.3s ease, transform 0.3s ease;
  transform: translateY(0);
  opacity: 1;
}
.insurance_section .select_list li input[type="checkbox"] + label .logo img {
  max-width: 100%;
  max-height: 100%;
}
.insurance_section .select_list li input[type="checkbox"] + label .company {
  display: block;
  font-size: 13px;
  font-weight: 400;
  color: #2a2a2a;
  line-height: 18px;
  letter-spacing: -0.325px;
  text-align: center;
  margin-top: 8px;
}
.insurance_section .select_list li input[type="checkbox"] + label .text_box {
  display: none;
  opacity: 0;
  transition: opacity 0.3s ease;
  margin-top: 0;
}
.insurance_section
  .select_list
  li
  input[type="checkbox"]:checked
  + label
  .text_box {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  opacity: 1;
  margin-top: -22px;
}
.insurance_section
  .select_list
  li
  input[type="checkbox"]:checked
  + label
  .text_box
  b {
  display: block;
  font-size: 14px;
  font-weight: 600;
  color: #3eb134;
  letter-spacing: -0.325px;
  text-align: center;
}
.insurance_section
  .select_list
  li
  input[type="checkbox"]:checked
  + label
  .text_box
  span {
  display: block;
  font-size: 10px;
  font-weight: 400;
  color: #667085;
  letter-spacing: -0.325px;
  text-align: center;
}
.insurance_section
  .select_list
  li
  input[type="checkbox"]:checked
  + label
  .text_box
  strong {
  display: block;
  font-size: 15px;
  color: #1077ab;
  font-weight: 700;
  letter-spacing: -0.4px;
  text-align: center;
}
.insurance_section
  .select_list
  li
  input[type="checkbox"]:checked
  + label
  .text_box
  strong
  em {
  font-size: 12px;
}
.insurance_section
  .select_list
  li
  input[type="checkbox"]:checked
  + label
  .company {
  display: none;
}
.insurance_section
  .select_list
  li
  input[type="checkbox"]:checked
  + label
  .logo {
  opacity: 0;
  transform: translateY(-10px);
  pointer-events: none;
}
.insurance_section .select_list li input[type="checkbox"]:checked + label {
  border: 2px solid #4dac26;
}
.insurance_section
  .select_list
  li
  input[type="checkbox"]:checked
  + label
  .company {
  font-weight: 500;
  color: #4dac26;
}
.insurance_section .select_list .btn_link {
  position: absolute;
  right: 10px;
  top: 10px;
  width: 10px;
  height: 10px;
  background: url(../image/icon/icon_link.svg) no-repeat center center;
  background-size: contain;
  text-indent: -9999px;
  overflow: hidden;
  z-index: 5;
}

/* 팩스 */
.fax_section .sort_text {
  display: inline-block;
  font-size: 13px;
  font-weight: 300;
  color: #666;
  line-height: 20px;
  letter-spacing: -0.325px;
  margin-left: 6px;
}
.fax_section .ins_info {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}
.fax_section .ins_info > .icon_box {
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 32px;
  height: 32px;
  overflow: hidden;
}
.fax_section .ins_info > .icon_box img {
  width: 100%;
  max-width: 100%;
  max-height: 100%;
}
.fax_section .ins_info > .ins_detail {
  flex: 1;
  padding: 0 16px;
}
.fax_section .ins_detail .name {
  font-size: 17px;
  font-weight: 700;
  color: #111;
  line-height: 24px;
  letter-spacing: -0.425px;
  margin-bottom: 4px;
}
.fax_section .ins_detail .number {
  display: inline-block;
  font-size: 15px;
  font-weight: 500;
  color: #444;
  line-height: 22px;
  letter-spacing: -0.375px;
  margin-bottom: 4px;
}
.fax_section .ins_detail .time {
  font-size: 13px;
  font-weight: 400;
  color: #444;
  line-height: 20px;
  letter-spacing: -0.325px;
}
.fax_section .chk_box {
  width: 24px;
  overflow: hidden;
}
.fax_section .chk_box input[type="checkbox"] {
  display: none;
}
.fax_section .chk_box input[type="checkbox"] + label {
  display: inline-block;
  width: 24px;
  height: 24px;
  text-indent: -9999px;
  background: url(../image/icon/icon_chkbox_off.svg) no-repeat center center;
  background-size: contain;
  border-radius: 50%;
  overflow: hidden;
  cursor: pointer;
}
.fax_section .chk_box input[type="checkbox"]:checked + label {
  background: url(../image/icon/icon_chkbox_green.svg) no-repeat center center;
  background-size: contain;
}
.fax_section .call {
  display: block;
  font-size: 14px;
  font-weight: 400;
  color: #444;
  line-height: 20px;
  letter-spacing: -0.4px;
  text-align: center;
  padding: 10px;
  background: #fff;
  border: 1px solid #ccc;
  border-radius: 4px;
  margin-top: 12px;
}
.fax_section .call::before {
  content: "";
  display: inline-block;
  width: 12px;
  height: 12px;
  background: url(../image/icon/icon_phone.svg) no-repeat center center;
  background-size: contain;
  vertical-align: 0;
  margin-left: 8px;
  margin-right: 4px;
}
.fax_insurance li {
  padding: 20px;
  border: 1px solid #e0e0e0;
  border-radius: 4px;
  margin-bottom: 16px;
}
.fax_insurance li:last-of-type {
  margin-bottom: 0;
}
.direct_insurance li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 20px;
  background: #ffffff;
  border: 1px solid #e0e0e0;
  border-radius: 4px;
  overflow: hidden;
  margin-bottom: 16px;
}
.direct_insurance li:last-of-type {
  margin-bottom: 0;
}
.direct_insurance .ins_info {
  align-items: center;
}
.direct_insurance .ins_detail .name {
  margin-bottom: 0;
}

/* 보험금 청구 */
.form_box {
  position: relative;
}
.form_title h3 {
  display: block;
  position: relative;
  font-size: 15px;
  font-weight: 500;
  color: #444;
  line-height: 22px;
  letter-spacing: -0.375px;
  padding-left: 26px;
  margin-bottom: 12px;
}
.form_title h3::before {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  top: -2px;
  width: 18px;
  height: 25px;
  background: url(../image/icon/icon_question.svg) no-repeat center center;
  background-size: contain;
}
.form_title h3 .icon_info {
  display: inline-block;
  width: 16px;
  height: 16px;
  font-size: 10px;
  color: #aaa;
  line-height: 13px;
  padding: 0 5px;
  border: 1px solid #ccc;
  border-radius: 50%;
  cursor: pointer;
  vertical-align: 1px;
  margin-left: 2px;
}
.form_detail .check_box.type01 {
  display: flex;
  flex-wrap: wrap;
}
.form_detail .check_box.type01 li {
  width: calc(33.33% - 6px);
  margin-right: 9px;
}
.form_detail .check_box.type01 li:nth-of-type(3n) {
  margin-right: 0;
}
.form_detail .check_box.type01 li:nth-of-type(n + 4) {
  margin-top: 8px;
}
.form_detail .check_box.type01 li input + label {
  display: block;
  position: relative;
  height: 40px;
  font-size: 14px;
  font-weight: 400;
  color: #444;
  line-height: 20px;
  letter-spacing: -0.35px;
  text-align: center;
  background: #fff;
  border: 1px solid #ccc;
  cursor: pointer;
  padding: 8px 12px;
}
.form_detail .check_box.type01 li input:checked + label {
  font-weight: 500;
  color: #4dac26;
  border: 2px solid #4dac26;
}
.form_detail .check_box.type02 li input + label {
  display: inline-block;
  font-size: 15px;
  font-weight: 400;
  color: #111;
  line-height: 20px;
  letter-spacing: -0.375px;
  cursor: pointer;
}
.form_detail .check_box.type02 li input + label::before {
  content: "";
  display: inline-block;
  width: 20px;
  height: 20px;
  background: url(../image/icon/icon_chkbox_off.svg) no-repeat center center;
  background-size: contain;
  border-radius: 50%;
  overflow: hidden;
  vertical-align: -4px;
  margin-right: 8px;
}
.form_detail .check_box.type02 li input:checked + label::before {
  background: url(../image/icon/icon_chkbox_green.svg) no-repeat center center;
}
.form_detail .radio_box.type01 li {
  margin-bottom: 8px;
}
.form_detail .radio_box.type01 li:last-of-type {
  margin-bottom: 0;
}
.form_detail .radio_box.type01 li input + label {
  display: inline-block;
  position: relative;
  font-size: 15px;
  font-weight: 400;
  color: #111;
  line-height: 20px;
  letter-spacing: -0.375px;
  cursor: pointer;
}
.form_detail .radio_box.type01 li input + label .icon_radio {
  display: inline-block;
  position: relative;
  width: 20px;
  height: 20px;
  background: #fff;
  border: 1px solid #ccc;
  border-radius: 50%;
  vertical-align: -4px;
  margin-right: 8px;
}
.form_detail .radio_box.type01 li input:checked + label .icon_radio {
  border: 1px solid #4dac26;
}
.form_detail .radio_box.type01 li input:checked + label .icon_radio::after {
  content: "";
  display: block;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 10px;
  height: 10px;
  background: #4dac26;
  border-radius: 50%;
}
.form_detail.type_date {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  width: 100%;
}
.form_detail.type_date .input_box {
  width: 40%;
  min-width: 136px;
}
.form_detail.type_date .select_box {
  width: calc(30% - 15px);
  min-width: 82px;
}
/*? 서명하기 */
.popup_sign {
  position: relative;
}
.popup_sign .cont_box {
  padding-bottom: 105px;
}
.sign_wrap {
  position: relative;
  padding-bottom: 28px;
}
.sign_wrap .error_msg {
  position: absolute;
}
.sign_wrap .btn_edit {
  position: absolute;
  right: 0;
  bottom: 0;
  display: inline-block;
  font-size: 15px;
  font-weight: 400;
  color: #666;
  line-height: 22px;
  letter-spacing: -0.375px;
  background: transparent;
  border-bottom: 1px solid #666;
}

/* 청구서 제출하기 */
.documents_section .icon_info {
  display: inline-block;
  width: 20px;
  height: 20px;
  background: url(../image/icon/icon_info.svg) no-repeat center center;
  background-size: 15px;
  text-indent: -9999px;
  overflow: hidden;
  vertical-align: -4px;
  margin-left: 4px;
}
.claim_detail_section .btn_edit,
.documents_section .btn_edit {
  display: inline-block;
  font-size: 15px;
  font-weight: 300;
  color: #666;
  letter-spacing: -0.375px;
  line-height: 22px;
  border-bottom: 1px solid #666;
}
.file_upload_box .btn_upload {
  display: inline-block;
  width: calc(50% - 4px);
  height: 40px;
  font-size: 16px;
  font-weight: 400;
  color: #2a2a2a;
  line-height: 37px;
  text-align: center;
  border: 1px solid #989898;
  border-radius: 50px;
  cursor: pointer;
}
.file_upload_box .btn_upload .icon_picture {
  display: inline-block;
  width: 20px;
  height: 20px;
  background: url(../image/icon/icon_picture.svg) no-repeat center center;
  background-size: 15px;
  text-indent: -9999px;
  overflow: hidden;
  vertical-align: -4px;
}
.file_upload_box .btn_upload .icon_camera {
  display: inline-block;
  width: 20px;
  height: 20px;
  background: url(../image/icon/icon_camera.svg) no-repeat center center;
  background-size: 22px;
  text-indent: -9999px;
  overflow: hidden;
  vertical-align: -4px;
}
.file_upload_box .btn_upload input[type="file"] {
  display: none;
}
.file_info_box p {
  font-weight: 300;
  color: #666;
  letter-spacing: -0.35px;
}
.file_info_box .file_count {
  font-size: 14px;
  font-weight: 400;
  color: #111;
  letter-spacing: -0.35px;
  line-height: 22px;
}
.documents_box .preview_list {
  display: flex;
  flex-wrap: wrap;
}
.documents_box .preview_list li {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: calc(50% - 6px);
  min-width: 158px;
  height: 50vw;
  max-height: 240px;
  min-height: 180px;
  background: #f7f7f7;
  border: 1px solid #ccc;
  border-radius: 4px;
  overflow: hidden;
  margin-bottom: 12px;
}
.documents_box .preview_list li:nth-of-type(odd) {
  margin-right: 12px;
}
.documents_box .preview_list li img {
  width: 100%;
  max-width: 100%;
  max-height: 100%;
}
.documents_box .preview_list li .btn_delete {
  position: absolute;
  right: 10px;
  top: 10px;
  width: 24px;
  height: 24px;
  background: url(../image/btn/btn_delete.svg) no-repeat center center;
  background-size: contain;
  border-radius: 50%;
  text-indent: -9999px;
  z-index: 10;
}
.documents_box .no_file {
  width: 100%;
  font-size: 15px;
  font-weight: 400;
  color: #666;
  padding: 20px;
  text-align: center;
  border: 1px solid #ccc;
  border-radius: 4px;
}

/* 타사 청구 전송 내역 조회 */
.data_top_box {
  display: flex;
  flex-wrap: wrap;
}
.data_top_box .period_nav_box {
  width: 100%;
  margin-bottom: 8px;
}
.data_top_box .period_nav_box ul {
  display: flex;
  border: 1px solid #ccc;
  border-radius: 4px;
}
.data_top_box .period_nav_box ul li {
  flex: 1;
}
.data_top_box .period_nav_box ul li a {
  display: block;
  position: relative;
  font-size: 14px;
  font-weight: 300;
  color: #666;
  line-height: 40px;
  text-align: center;
  background: #fff;
  border-radius: 4px;
}
.data_top_box .period_nav_box ul li a.active {
  font-weight: 500;
  color: #4dac26;
}
.data_top_box .period_nav_box ul li a.active::after {
  content: "";
  display: block;
  position: absolute;
  left: -1px;
  top: -1px;
  width: 100%;
  height: 100%;
  border: 1px solid #4dac26;
  border-radius: 4px;
  z-index: 1;
}
.data_top_box .select_box select {
  width: 120px;
  height: 40px;
  font-size: 15px;
  padding: 7px 30px 10px 8px;
  background: url(../image/icon/icon_arrow_down_gray.svg) no-repeat
      calc(100% - 8px) center,
    #ffffff;
  border: 1px solid #ccc;
  border-radius: 4px;
  margin-right: 6px;
}
.data_top_box .search_box {
  position: relative;
  width: calc(100% - 126px);
}
.data_top_box .search_box .input_box input {
  height: 40px;
  padding-right: 46px;
}
.data_top_box .search_box .input_box input::placeholder {
  color: #ccc;
}
.data_top_box .search_box .btn {
  position: absolute;
  right: 8px;
  top: 8px;
  width: 24px;
  height: 24px;
  background: url(../image/icon/icon_search.svg) no-repeat center center;
  text-indent: -9999px;
  overflow: hidden;
  z-index: 1;
}
.total_count_box {
  display: flex;
  align-items: center;
}
.claim_state_box {
  display: flex;
  flex-wrap: wrap;
  margin-left: 8px;
}
.claim_state_box .state {
  display: block;
  height: 32px;
  font-size: 15px;
  font-weight: 400;
  color: #666;
  line-height: 31px;
  letter-spacing: -0.375px;
  padding: 0 10px;
  background: #f0f0f0;
  border-radius: 16px;
  margin-right: 8px;
}
.claim_state_box .state.green {
  font-weight: 500;
  color: #ffffff;
  background: #4dac26;
}