/* 경쟁업체찾기 */
.companysearch_container {
  display: flex; align-items: flex-end; gap:1rem;
}

.companysearch_wrap {
  width:100%;
  display: flex; flex-direction: column; gap:.5rem;
}
.companysearch_license,
.companysearch_area,
.companysearch_name{
  display:flex;
  align-items:center; 
  gap: 0.75rem;
  width:100%;
}
.companysearch_license span, 
.companysearch_area span, 
.companysearch_name span{
  min-width: 80px;
  flex: 0 0 80px;  
  line-height: 1.4;
  color: var(--blue-1);
}

.companysearch_license > div,
.companysearch_area > div,
.companysearch_name > div{
  display:flex; align-items:center; gap:.5rem;
  width:100%; flex-wrap: wrap;  
}

.companysearch_license input[type="text"],
.companysearch_name input[type="text"],
.companysearch_area select,
.companysearch_name select{
  box-sizing: border-box;
  height: 36px;
  padding: .5rem .7rem;
  border:1px solid var(--color-6);
  border-radius: 6px;
  font-size: .9rem;
  background-color: var(--white);
  
}
.companysearch_area select,
.companysearch_name select{
  appearance: none;
  background-image: url("/assets/images/svg/arrow_down.svg") no-repeat right 8px center;
  background-size: 10px;
}

.companysearch_license input[type="text"]:focus-visible,
.companysearch_name input[type="text"]:focus-visible,
.companysearch_area select:focus-visible,
.companysearch_name select:focus-visible{
  outline: 1px solid #1a73e8;;
  outline-offset: 1px;
}
.companysearch_area > div > div > span {
  display: flex; align-items: center; gap:.3rem;
}


/* 등록된 경쟁업체 */
.comp_regist_board {width: 100%; margin-bottom: 3rem;}

.comp_regist_board table {
    font-size: .9rem;
    width: 100%; 
    border-top: var(--border-3);
    border-bottom: var(--border-2);
    border-collapse: collapse; 
    table-layout: fixed;
}
.comp_regist_board thead th {
    background-color: var(--gray-6);
    font-weight: 600; 
}

.comp_regist_board thead th:nth-child(1) { width: 7%; }
.comp_regist_board thead th:nth-child(2) { width: auto; }
.comp_regist_board thead th:nth-child(3) { width: 15%; min-width: 100px }
.comp_regist_board thead th:nth-child(4) { width: 15%; min-width: 100px }

.comp_regist_board thead tr,
.comp_regist_board tbody tr {
  border-bottom: var(--border-1); 
}
.comp_regist_board thead th, 
.comp_regist_board tbody td {
  padding:.7rem .5rem;
  vertical-align: middle;
  text-align: center;
  white-space: nowrap;  
}
.comp_regist_board tbody td:nth-child(2) { text-align: left;}
.comp_regist_board tbody tr:nth-child(even) { background-color: var(--gray-7); }

.comp_regist_board .company{
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;   
    max-width: 90%;
	vertical-align: middle;
}


/* 검색된 경쟁업체 */
.comp_search_board {width: 100%; margin-bottom: 3rem;}

.comp_search_board table {
    font-size: .9rem;
    width: 100%; 
    border-top: var(--border-3);
    border-bottom: var(--border-2);
    border-collapse: collapse; 
    table-layout: fixed;
}
.comp_search_board thead th {
    background-color: var(--gray-6);
    font-weight: 600; 
}

.comp_search_board thead th:nth-child(1) { width: 5%; }
.comp_search_board thead th:nth-child(2) { width: 20%; }
.comp_search_board thead th:nth-child(3) { width: 7%; }
.comp_search_board thead th:nth-child(4) { width: 10%; }
.comp_search_board thead th:nth-child(5) { width: 10%; }
.comp_search_board thead th:nth-child(6) { width: auto;}
.comp_search_board thead th:nth-child(7) { width: 15%; }

.comp_search_board thead tr,
.comp_search_board tbody tr {
  border-bottom: var(--border-1); 
}
.comp_search_board thead th, 
.comp_search_board tbody td {
  padding:.7rem .5rem;
  vertical-align: middle;
  text-align: center;
  white-space: nowrap;  
}
.comp_search_board tbody tr:nth-child(even) { background-color: var(--gray-7); }
.comp_search_board tbody td:nth-child(6) { 
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;   
    max-width: 100%; 
    border-bottom: none;
}
.comp_search_board .s_add {text-align: center;}

.comp_search_board .company{
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;   
    max-width: 100%; 
}
.comp_search_board .com_address{
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;   
    max-width: 100%; 
}
.only_mobile {display: none}

/* 경쟁업체 팝업 */
.com_tuchal_pop {
  padding:0 1rem ; 
}
.com_name_title {color: var(--blue-1);}
.com_tuchal_title {
  font-size: .8rem; color: var(--blue-1); margin: .5rem 0;
}
.com_tuchal_title span{ 
  color: var(--blue-0);
}
.com_tuchal_title h3{ 
	font-size:1.4em; font-weight: 900;
}
.com_tuchal_company_info {
  width:100%; font-size: 1rem; margin-bottom: 15px;
}
.com_tuchal_company_info h3{
  padding:.5rem 0 0 .5rem;
  
}
.com_tuchal_company_info ul {
  width:100%;
  padding:.9rem; 
  display: flex; flex-wrap: wrap; }
.com_tuchal_company_info li:nth-child(3){
  /* width:100%; */
}
.com_tuchal_company_info li { 
  width:50%; line-height: 1.8rem;;
  display: flex; flex-wrap: nowrap;
}
.com_tuchal_company_info li span:nth-child(1) {
  display: block; white-space: nowrap;
  color:var(--gray-3); font-weight: 600;  font-size: .9rem;
  min-width:70px;
}
.com_tuchal_company_info li span:nth-child(2) {
  white-space: wrap;
}
.com_tuchal_graph {
  border: var(--border-1); width:100%;
  min-height: 100px;
}
.com_tuchal_search {
  padding: .5rem 1rem;
  display: flex; align-items: center;
  justify-content: left;
  margin-top: 0;
}
.com_tuchal_date, .com_tuchal_area, .com_tuchal_license{
  display: flex; align-items: center;
  margin-left:15px;
}
.com_tuchal_area, .com_tuchal_license div {
  display: flex; flex-wrap: nowrap; gap: .5rem;
}
.com_tuchal_date .period_input {
  width:100%;
  display: flex; gap:.3rem; flex-wrap: wrap;
}
.com_tuchal_area select {width:150px}
.com_tuchal_license select {width:150px}

.com_tuchal_result_btn {
  display: flex; gap:.2rem;
}
.com_tuchal_result_btn span {
  font-size: .9rem; color:var(--gray-2);
  align-content: center;
}
.com_tuchal_result_btn select {
  height: 32px;
}
.com_tuchal_tab {
  display: flex; 
}
.com_tuchal_tab a { 
  display: block; text-align: center;
  border:var(--border-1);
  border-bottom: 0;
  border-radius: 5px 5px 0 0;
  width:100px; height:32px; line-height: 32px;
  font-size: .9rem;
}
.com_tuchal_tab a.active{
  background-color: var(--blue-1); color:var(--white)
}

.com_tuchal_tab_btn {
  flex-wrap: wrap;
  display: flex; align-items: flex-end; justify-content: space-between;
  margin-bottom: 5px;
}
.span_left{
  margin-left: 10px;
}
.span_right{
  margin-right: 10px;
}
.btn_tp{
  height:32px;
  padding:4px 8px;
  border-radius: 5px;
  font-size: .9rem;
  transition: all 0.3s;
  background-image: none;
}
.btn_tps{
  height: 36px;
  padding: 4px 20px;
  border-radius: 5px;
  font-size: .9rem;
  transition: all 0.3s;
  background-image: none;
}
.com_tuchal_btn_posion {  
  margin-left:10px;
}
.table_bottom{
  margin-bottom: 15px;
}
@media (max-width:1200px){
    .com_tuchal_tab {
      padding:0 0 0 10px;
    }
}

@media (max-width:768px) {
      .companysearch_container {
        flex-direction: column; align-items: center;
    }
    .companysearch_area select,
    .companysearch_name select {
        width:100%;
    }
    .companysearch_license,
    .companysearch_area,
    .companysearch_name{
        flex-direction: column; 
        align-items: flex-start;
    }
    .companysearch_license > div,
    .companysearch_area > div,
    .com_tuchal_license > div {
      display: flex; gap: .5rem;
      flex: 1 1 100%;
      width: 100%;
    }
    .companysearch_license span, 
    .companysearch_area span, 
    .companysearch_name span {
        flex: 0 0 0;
    }

    .comp_regist_board thead th, 
    .comp_regist_board tbody td {
      padding: .7rem .2rem;
    }
    .comp_regist_board .com_name{
      min-width: auto;
      max-width: 100%;
    }
    .comp_regist_board .btn_cell {
      min-width: auto;
      max-width: 100%;
    }

    /* 모바일에서 경쟁업체 결과 카드형으로 */
    .comp_search_board table{
      border: 0; width:100%;
    }
    .comp_search_board thead{  display:none; }
    .comp_search_board tbody,
    .comp_search_board tr,
    .comp_search_board td{
      display:block; width:100%;
    }

    .comp_search_board tbody tr{
      display:grid; 
      grid-template-columns: 45px 1fr;
      background:#fff;
      border:var(--border-2);
      border-radius:1rem;
      margin: 1rem 0;
      padding:1rem;
    }
    .comp_search_board tbody td:nth-child(n+3){
      grid-column: 1 / -1; 
      display:flex; justify-content:space-between; gap:5px;
    }
    
    .comp_search_board tbody td:nth-child(2),
    .comp_search_board tbody td:last-child{
      border:none
    }
   
    .comp_search_board tbody tr:nth-child(even){
      background-color: var(--white);
    }
    .comp_search_board tbody td:nth-child(1) {
      margin-top: 4px;
      display: block; 
      width:2.5rem; height:30px; line-height: 8px;
      border-radius: 5px; font-weight: 500;
      background-color: #e9f3ff; color:var(--gray-1);
      box-shadow: 1px 1px 1px 0 rgba(0,0,0,0.2)
    }
    .comp_search_board tbody td:nth-child(2) {
      text-align: left;
       display:inline-block; max-width:100%;
       overflow:hidden; text-overflow:ellipsis; 
       white-space:nowrap; font-weight:700;
    }
    .comp_search_board tbody td:nth-child(7) {
      display: block; text-align: right;
    }
    
    .only_mobile{
      display:inline-block; padding-right: 5px;
      color:var(--gray-3); font-weight: 600;
    }
    
    /* 투찰분석 테이블 모바일 카드버전 */
    .com_tuchal_company_info ul {
      flex-direction: column; font-size: .85rem;
    }
    .com_tuchal_company_info li {
      width: 100%;
    }
    .com_tuchal_company_info li span:nth-child(1) {
      font-weight: 500;  font-size: .8rem;
      min-width:75px;
    }

    .com_tuchal_search {
      flex-direction: column; 
      align-items: stretch; gap:.5rem;
	  justify-content: space-between !important;
    }
    .com_tuchal_date, .com_tuchal_area, .com_tuchal_license{
      display: flex; align-items: center;
    }
    .com_tuchal_search > div {  
      display: flex; align-items: center; gap: .5rem;
    }
    .com_tuchal_search .info_text { 
      flex: 0 0 50px; 
      white-space: nowrap;
    }
    
    .com_tuchal_date .period_input {
      flex-wrap: wrap;
    }

    .com_tuchal_area > div,
    .com_tuchal_license > div {
      flex: 1 1 0;
      min-width: 0; 
      display: flex; gap: .5rem; flex-wrap: nowrap;
      width: 100%;
    }
    .com_tuchal_license > div {
      /* align-items: center; */
    }
    .com_tuchal_date span,
    .com_tuchal_area span,
    .com_tuchal_license span{ display: block; width:80px; right:10px !important;}

    .com_tuchal_result_btn{
      display:grid;
      flex-wrap: wrap;
      align-items: center;
      gap: 1px;
    }
    .com_tuchal_result_btn button{
      width:55px; height:32px;
      padding:0; font-size: .8rem;
    }
	.com_tuchal_result_btn span{
      height:32px;
      padding:0; font-size: .8rem;
	  align-content:center;
	}
	.span_left{
	  margin-left: 10px;
	}
	.span_right{
	  margin-right: 10px;
	}
    .com_tuchal_result_btn select{
      width:50px; height: 32px;
      padding:0 0 0 .2rem;
      border-radius: 2px;
    }
    
    .com_tuchal_tab { padding-left:.4rem;}
    .com_tuchal_tab a {
      border-radius: 0 0 0 0;
      width: 54px;
      height: 32px;
      line-height: 32px;
      font-size: .8rem;
      padding:0 0 0 0;
    }
    .com_tuchal_tab a.active{
      border-radius: 0 0 0 0;
      border:none;
    }
    .com_tuchal_license button { width: 50px; height:34px; position: absolute;}
    .com_tuchal_total {
      font-size: .9rem; margin-bottom: .5rem;
    }

	.btn_tp{
		height:32px;
		padding:4px 8px;
		border-radius: none;
		font-size: .9rem;
		transition: all 0.3s;
		background-image: none;
	}
	.btn_tps{
		height: 36px;
		padding: 4px 8px;
		border-radius: 5px;
		font-size: .8rem;
		transition: all 0.3s;
		background-image: none;
		width: 25%;
	}
    .bid_search_wrap .period_input select, 
    .period_input .date-wrapper input[type="text"]{
        width: 100px;
    }
	.com_tuchal_tab_btn {
	  margin-bottom: 5px;
	}
	.com_tuchal_title_m {
	  position:absolute;
	}
	.span_left{
	  margin-left: 8px;
	}
	.span_right{
	  margin-right: 7px;
	}
	.m_line_l1{
      display: inline;
      text-align: right;
      width: 100%;
      padding: 6px 0;
	}
	.m_line_l2{
	  width: 100%;
	  display:flex;
	}
    .com_tuchal_btn_posion {  
      display: block !important;
      text-align: right;
    }
    .com_tuchal_date select, .com_tuchal_area select, .com_tuchal_license select { width: 100%; }
	.date-wrapper {
	  width: 100%;
	}
	.com_tuchal_date, .com_tuchal_area, .com_tuchal_license{
	  margin-left:0;
	}
}