@charset "utf-8";
/* 보험사 선택 */
.insurance_section .sticky_box {
  position: sticky;
  left: 0;
  top: 48px;
  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: 14px;
  font-weight: 400;
  color: #666;
  line-height: 31px;
  padding: 0 10px;
  background: #f0f0f0;
  border-radius: 16px;
}
.insurance_section .tab_box li.on a {
  font-weight: 500;
  color: #ffffff;
  background: #3662df;
}
.insurance_section .select_top {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.insurance_section .select_top .title {
  flex: 1;
  font-size: 16px;
  font-weight: 500;
  color: #2a2a2a;
  line-height: 21px;
  letter-spacing: -0.4px;
}
.insurance_section .select_top .count {
  color: #3eb134;
  margin-left: 5px;
}
.insurance_section .select_top .btn_clear {
  display: inline-block;
  height: 31px;
  font-size: 14px;
  font-weight: 400;
  color: #666;
  line-height: 29px;
  padding: 0 10px;
  background: #ffffff;
  border: 1px solid #525962;
  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;
  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: 16px;
  font-weight: 500;
  color: #2a2a2a;
  line-height: 21px;
  margin-bottom: 4px;
}
.fax_section .ins_detail .number {
  display: inline-block;
  font-size: 14px;
  font-weight: 500;
  color: #666;
  line-height: 19px;
  letter-spacing: -0.35px;
  margin-bottom: 4px;
}
.fax_section .ins_detail .time {
  font-size: 14px;
  font-weight: 400;
  color: #666;
  line-height: 19px;
  letter-spacing: -0.5px;
}
.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_blue.svg) no-repeat center center;
  background-size: contain;
}
.fax_section .call {
  display: block;
  font-size: 16px;
  font-weight: 400;
  color: #2a2a2a;
  line-height: 20px;
  letter-spacing: -0.4px;
  text-align: center;
  padding: 10px;
  background: #fff;
  border: 1px solid #989898;
  border-radius: 30px;
  margin-top: 12px;
}
.fax_section .call::after {
  content: "";
  display: inline-block;
  width: 12px;
  height: 12px;
  background: url(../image/icon/icon_arrow_right_gray.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: 12px;
  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: 12px;
  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 {
  position: relative;
  display: block;
  font-size: 16px;
  font-weight: 500;
  color: #2a2a2a;
  line-height: 21px;
  letter-spacing: -0.4px;
  padding-left: 12px;
  margin-bottom: 16px;
}
.form_title h3::before {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  top: 8.5px;
  width: 4px;
  height: 4px;
  background: #3eb134;
  border-radius: 50%;
}
.form_title h3 em {
  display: inline-block;
  font-size: 12px;
  color: #757575;
}
.form_title h3 .icon_info {
  display: inline-block;
  width: 18px;
  height: 18px;
  font-size: 11px;
  color: #aaa;
  line-height: 15px;
  padding: 0 5px;
  border: 1px solid #ccc;
  border-radius: 50%;
  cursor: pointer;
  vertical-align: 1px;
  margin-left: 4px;
}
.form_detail .check_box li {
  margin-right: 6px;
  margin-bottom: 6px;
}
.form_detail .check_box li input {
  display: none;
}
.form_detail .check_box.type01 {
  display: flex;
  flex-wrap: wrap;
}
.form_detail .check_box.type01 li input + label {
  position: relative;
  display: block;
  font-size: 14px;
  font-weight: 500;
  color: #74869c;
  line-height: 16px;
  letter-spacing: -0.35px;
  text-align: center;
  background: #fff;
  border: 1px solid #74869c;
  border-radius: 30px;
  cursor: pointer;
  padding: 8px 12px;
}
.form_detail .check_box.type01 li input + label::before {
  content: "";
  display: inline-block;
  width: 18px;
  height: 18px;
  background: url(../image/icon/icon_check_gray.svg) no-repeat center center;
  background-size: contain;
  vertical-align: -3px;
  margin-right: 8px;
}
.form_detail .check_box.type01 li input:checked + label {
  color: #fff;
  background: #74869c;
}
.form_detail .check_box.type01 li input:checked + label::before {
  background: url(../image/icon/icon_check_white.svg) no-repeat center center;
  background-size: contain;
}
.form_detail .check_box.type02 {
  padding-left: 4px;
}
.form_detail .check_box.type02 li input + label {
  display: inline-block;
  font-size: 14px;
  font-weight: 500;
  color: #2a2a2a;
  line-height: 19px;
  letter-spacing: -0.35px;
  cursor: pointer;
}
.form_detail .check_box.type02 li input + label::before {
  content: "";
  display: inline-block;
  width: 25px;
  height: 25px;
  background: #ffffff;
  border: 2px solid #ccc;
  border-radius: 4px;
  box-sizing: border-box;
  overflow: hidden;
  vertical-align: -7px;
  margin-right: 6px;
}
.form_detail .check_box.type02 li input:checked + label::before {
  background: url(../image/icon/icon_chkbox_green.svg) no-repeat center center,
    #0aa622;
  background-size: 25px;
  border: 1px solid #3eb134;
}
.form_detail .radio_box.type01 {
  display: flex;
  flex-wrap: wrap;
}
.form_detail .radio_box.type01 li {
  margin-right: 6px;
  margin-bottom: 6px;
}
.form_detail .radio_box.type01 li input {
  display: none;
}
.form_detail .radio_box.type01 li input + label {
  position: relative;
  display: block;
  font-size: 14px;
  font-weight: 500;
  color: #74869c;
  line-height: 16px;
  letter-spacing: -0.35px;
  text-align: center;
  background: #fff;
  border: 1px solid #74869c;
  border-radius: 30px;
  cursor: pointer;
  padding: 8px 10px;
}
.form_detail .radio_box.type01 li input + label .icon_radio {
  display: inline-block;
  position: relative;
  width: 16px;
  height: 16px;
  background: #ccc;
  border-radius: 50%;
  vertical-align: -3px;
  margin-right: 8px;
}
.form_detail .radio_box.type01 li input:checked + label {
  color: #fff;
  background: #74869c;
}
.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: #3eb134;
  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: 150px;
}
.form_detail.type_date .select_box {
  width: 82px;
}

/* 서명하기 */
.sign_section .cont_box {
  padding-top: 84px;
}
.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: 16px;
  font-weight: 400;
  color: #3662df;
  line-height: 20px;
  background: transparent;
  border-bottom: 1px solid #3662df;
}

/* 청구서 제출하기 */
.claim_detail_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 {
  display: inline-block;
  font-size: 16px;
  font-weight: 300;
  color: #3662df;
  letter-spacing: -0.4px;
  line-height: 21px;
  border-bottom: 1px solid #3662df;
}
.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 {
  color: #666;
}
.file_info_box .file_count {
  font-size: 14px;
  font-weight: 500;
  color: #666;
  letter-spacing: -0.35px;
  line-height: 19px;
}
.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: 158px;
  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;
}

/* 타사 청구 전송 내역 조회 */
.history_section {
  width: 100%;
}
.history_section .period_nav_box {
  display: flex;
}
.history_section .period_nav_box ul {
  display: flex;
  align-items: center;
  padding: 5px 8px;
  border: 1px solid #ccc;
  border-radius: 50px;
}
.history_section .period_nav_box ul li a {
  display: inline-block;
  font-size: 15px;
  font-weight: 400;
  color: #888;
  line-height: 16px;
  letter-spacing: -0.375px;
  padding: 7px 16px;
  cursor: pointer;
  border-radius: 50px;
}
.history_section .period_nav_box ul li a.active {
  color: #fff;
  background: #3eb134;
}
.history_section .data_top_box {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}
.history_section .data_top_box .total_count_box,
.history_section .data_top_box .total_search_box {
  display: flex;
  align-items: center;
  padding: 14px 16px;
}
.history_section .data_top_box .claim_state_box {
  display: flex;
  flex-wrap: wrap;
  margin-left: 8px;
}
.history_section .data_top_box .claim_state_box .state {
  display: block;
  height: 32px;
  font-size: 14px;
  font-weight: 400;
  color: #666;
  line-height: 31px;
  padding: 0 10px;
  background: #f0f0f0;
  border-radius: 16px;
  margin-right: 8px;
}
.history_section .data_top_box .claim_state_box .state.blue {
  font-weight: 500;
  color: #ffffff;
  background: #3662df;
}
.history_section .select_box {
  margin-right: 8px;
}
.history_section .select_box select {
  font-weight: 400;
}
.history_section .search_box {
  display: flex;
  align-items: center;
}
.history_section .search_box .input_box {
  width: 220px;
}
.history_section .search_box .btn {
  display: inline-block;
  font-size: 16px;
  font-weight: 400;
  color: #fff;
  line-height: 40px;
  white-space: nowrap;
  padding: 0 16px;
  background: #525962;
  border-radius: 50px;
  margin-left: 8px;
}
.history_section .data_table_box table {
  width: 100%;
}
.history_section .data_table_box table tr th,
.history_section .data_table_box table tr td {
  height: 46px;
  padding: 8px 6px;
  vertical-align: middle;
  text-align: center;
}
.history_section .data_table_box table tr th,
.history_section .data_table_box table tr td > span {
  font-size: 14px;
  line-height: 19px;
  letter-spacing: -0.35px;
}
.history_section .data_table_box table tr th {
  font-weight: 300;
  color: #666;
  background: #f7f7f7;
}
.history_section .data_table_box table tr td {
  border-bottom: 1px solid #f0f0f0;
}
.history_section .data_table_box table tr td > span {
  display: inline-block;
  font-weight: 400;
  color: #2a2a2a;
}
.history_section .data_table_box table tr td > span.blue {
  color: #3662df;
}
.history_section .pager_box {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 16px;
}
.history_section .pager_box .btn {
  display: inline-block;
  width: 16px;
  height: 16px;
  text-indent: -9999px;
  margin: 0 8px;
}
.history_section .pager_box .btn.btn_start {
  background: url(../image/btn/btn_pager_start.svg) no-repeat center center;
  background-size: contain;
}
.history_section .pager_box .btn.btn_prev {
  background: url(../image/btn/btn_pager_prev.svg) no-repeat center center;
  background-size: contain;
}
.history_section .pager_box .btn.btn_next {
  background: url(../image/btn/btn_pager_next.svg) no-repeat center center;
  background-size: contain;
}
.history_section .pager_box .btn.btn_end {
  background: url(../image/btn/btn_pager_end.svg) no-repeat center center;
  background-size: contain;
}
.history_section .pager_box .pager_number {
  display: flex;
  align-items: center;
  justify-content: center;
}
.history_section .pager_box .pager_number a {
  display: inline-block;
  width: 24px;
  font-size: 16px;
  font-weight: 400;
  color: #666;
  line-height: 21px;
  text-align: center;
  margin: 0 8px;
}
.history_section .pager_box .pager_number .active {
  color: #0aa622;
}
