.fontWb{font-weight: bold;} .fontW500{font-weight: 500;} .fontS18{font-size: 18px;} .fontS16{font-size: 16px;} .fontS14{font-size: 14px;} .fontS12{font-size: 12px;} .ml_8{margin-left: 8px ;} .mar_bm26{margin-bottom:26px} .mar_bm15{margin-bottom:15px} .mab40{margin-bottom:40px} .mat6{margin-top:6px!important} .border_bottom.W{border-bottom:1px solid #ffffff} .align_flex{display: flex;align-items: center;} .justify_center{justify-content: center;} .align_flex+.my_list{ width: calc(100% - 150px);margin-left: auto;} .flex_left{justify-items: flex-start;margin-left: auto;} .col_flex{display: flex;flex-direction: column;justify-content: center;align-items: center;} /* 추가버튼 css */ .btnp14{font-size: 14px;font-weight: 500;padding: 0 14px;} dl dd ul.chk_box{min-height:58px} dl dd ul.chk_box li{min-width:140px;margin-right: 16px ;} .my_list .right_box{padding: 8px 0 8px 20px;} .side_border{border:1px solid #dedede;border-width: 0 1px;} .chk_content_box{display: flex;flex-flow: wrap; border-bottom: 1px solid #dedede;border-left: 1px solid #dedede;} .my_list .chk_content_box:first-child{border-left: 0;} .my_list:last-child .chk_content_box:nth-last-child(-n+2){border-bottom: 0;} .chk_content_box dl{} .chk_content_box dd{line-height: 34px;} .list_detail{padding: 0 14px;color:#1e1e1e;font-size: 14px;margin-right: 10px;border: 1px solid #e8e8e8;border-radius: 50em;background-color: #fff;text-align: center;height: 34px; line-height: 32px; font-weight: 500;} .list_detail.on{background-color: #1c293f; color: #fff;} div.fronticon.current{margin:30px 0 17px 0} /* 업체정보 */ .busi_banner{width:100%;background: url(../images/banner/bg_con2.png) no-repeat center center ; background-size: cover;position:relative;padding: 28px 0 ;} .busi_banner>div:first-child{position: absolute;width:100%;height:100%;top:0;} .busi_txt01,.busi_txt02 div{position: relative;display: flex;flex-flow: column;} .busi_txt01{ justify-items: flex-end;margin-left: auto;} .busi_txt01>span{color:#ffffff;font-size: 16PX; font-weight: 300;} .busi_txt01 span+span{ font-family: 'GmarketSansMedium';font-size: 28px;font-weight: 500;line-height: 1.5;margin-top: 25px;} .busi_txt02{width:50%;justify-items: flex-end;margin-left: auto;margin-right: 60px;} .busi_txt02 div{width:calc(50% - 40px);margin-left: 40px;} .busi_txt02 div h6{display: block;padding: 7px 0 ;text-align: center;border-radius: 4px;background-color: #1e286d;width:100px;color: #fff;} .busi_txt02 div p {background-color: #fff;text-align: center;padding: 18px 0;} .busi_txt02 div strong {display: block;margin-bottom: 8px;font-size: 22px;} .new{background: url(../images/design/new_flag.svg) no-repeat;width:20px;height:20px;margin-left: 4px;} .fronticon.current+ul.selection_option_box .select_0:first-child{ width: 130px!important;} .fronticon.current+ul.selection_option_box input[type=number],.fronticon.current+ul.selection_option_box input[type=text]{height:34px} .table_list.type3 li .align_flex+div .right_box{ padding: 8px 0 8px 20px;border-bottom: 1px solid #dedede;} .table_list.type3 li .right_box dt.list_detail{padding:0 10px;width:auto;} /* 공고페이지 */ .dark_btn{padding: 5px 22px; text-align: center; border-radius: 50em;background-color: #1c293f;color:#fff;margin: 0!important;} .subp_table{width:100%} .subp_table tbody tr td{vertical-align: inherit;height: 50px;padding: 0;} .left_table.tagtable thead tr th:last-child{ border-bottom: 1px solid #ffff;} .sub_table_wrap{display:flex;align-items:flex-start;gap:18px;} .left_table {width:363px;flex-shrink:0;} .right_table{flex:1;min-width:0;margin-left:0!important;padding-left:0!important;} /* 낙찰 상세 「복수예가 분포도」↔「조합 1365개 분포도」 사이 40→16px (2026-09-24 사용자 지시). user.css 에 같은 규칙이 있으나 이 파일이 뒤에 로드돼 이긴다 — 둘 다 같이 고칠 것. */ .right_table table:first-child{margin-bottom: 16px;} .right_table tbody{min-height: 500px;} .right_table .suc_li_height th{padding-left: 30px;} tr.pink td{color:#fa448c} .select_wrap .all_about_btn::before{content: "전체";display: block;padding-top: 4px;} .search_box{border:1px solid #dedede;padding: 4px 0 4px 14px!important;min-width:272px;color:#767676} /* 맞춤분석 */ .bg_lightB{background: #fafbff;} .bg_lightP{background: #fff5fa} input[type=text].star_orpart_lineder{max-width: 676px;width:100%} .table_flex_list dl .stit{width:151px} .table_flex_list dl .stit+dd .price_input{margin:6px 0 0 0} .partice_input i{ display: inline-block;padding: 0 8px;} .large_tit{padding-left: 20px;} .part_line::after{content: "|";display: inline-block;margin:0 16px } .part_line+li.select_wrap button{margin:0} .firnum tbody tr td.none::before{content: "";} .layout_contain.wMidium{max-width: 693px;} div[data-popup=buyer_research_pop] table tbody tr td:first-child:not(.none){padding-left: 30px;} .boksu_num td{font-weight: 500;} input[type=text].fit_box{min-width: 667px;width:calc(100% - 350px)} .table_flex_list .bottom_floor dd{padding:8px 30px;} .bottom_floor dd div:first-child{min-width:119px} .bottom_floor dd div:last-child{width:calc(100% - 125px)} .bottom_floor dd{display: flex;align-items: center;} /* 온라인결제 */ .lineH26{line-height: 26Px;} div[data-popup=pay_type_popup] .layout_contain{max-width:889px ;} div[data-popup=pay_type_popup] .grayline_box>div{line-height: 26px;} div[data-popup=pay_type_popup] table tr td{text-align: left;line-height: 26px;padding-left:20px;} div[data-popup=pay_type_popup] table tr td p:not(:last-child){margin-bottom: 40px;} .explain_box{padding: 30px 0 30px 66px ;} .explain_box li{line-height: 26px;} .coupon_box .dropdownbox{min-width:360px;} .coupon_box div>p{margin-right:10px} .coupon_box div:nth-child(2)>p strong{vertical-align: -6px;} .coupon_num{font-size: 0px;display: flex;flex-wrap:wrap ;justify-content:flex-start;max-width: 360px;} .coupon_num>label{width:calc(100% - 78px)} .consulting_pop .layout_contain{max-width:600px} .consult_phone .dropdownbox{min-width:86px;} .consult_phone td i{margin:0 7px} .consulting_pop textarea{max-height: 200px;border-radius: 4px;} .capcha_input input:nth-of-type(1){width:39%;max-width: 120px;min-width:120px} .capcha_input input:nth-of-type(2){width:calc(100% - 126px);margin-left: 6px;max-width:200px;min-width:165px;} .deposit_box input.deposit{max-width: 500px;} .selec_fee tr td{vertical-align: middle;} .free_addition{margin-left: 38px;} .free_addition li { text-align: left;line-height: 30px;} .inq_content>div{padding: 15px 30px 15px 0;} .inq_content>div textarea{border-radius: 4px;} /*2022 07 13*/ .graph_wrap{padding:12px 0;overflow-x: auto;} .tagtable tr td.graph_wrap>div{width:100%} .chart01 .tip,.chart02 .tip,.chart03 .tip{z-index: 200000!Important;text-align: left;} .graph_hover {border:1px solid #303030;background-color: #fff;padding: 10px 15px; box-shadow: 2px 2px 2px grey;text-align: left;} .graph_hover span{display: block;font-weight: 500;} .graph_hover span:nth-of-type(2){color:#db720a;font-weight:500;} .graph_hover span:nth-of-type(4){color:#60b3cb;font-weight:500;} .showbox{margin:12px 0} .showbox .chart01{margin:0 auto} .showbox .controller.two{margin-top:20px} .border0{border:0} /* 업종 필드 길이 제한 */ .category_cell { max-width: 150px !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; } /* board_data1/2 등 신규 게시물 New 배지 (등록 7일 이내) */ .badge_new_data { display: inline-block; margin-left: 6px; padding: 2px 7px; font-size: 11px; font-weight: 900; line-height: 1.3; letter-spacing: 0.3px; color: #d32f2f; background-color: #fff59d; border: 1px solid #d32f2f; border-radius: 3px; vertical-align: middle; text-transform: uppercase; box-shadow: 0 1px 2px rgba(0,0,0,0.15); } /* 목록 행 호버 강조 (2026-09-19) — 입찰·낙찰 목록(공사·용역·물품·통합)·나의서류함 입찰/낙찰 공통. 세 화면 모두 `.list_from > form > .table_list.tagtable` 표에 공고 1건 = 1행 구조라 여기 한 곳에서 건다. ★ `> td` 로 한정 — 머리행(th)은 안 바뀐다. td 에 배경을 거는 이유: tr 배경은 td 배경(지정 시)에 가려진다. */ .list_from .table_list.tagtable tbody tr:hover > td { background-color: #eef3fb; } /* 목록 행 칸 상하 가운데 정렬 (2026-10-01 사용자 지시) — 위 호버와 같은 범위(입찰·낙찰 목록·서류함·최근 조회·달력). 공용 `.tagtable tr td { vertical-align: top }`(common.css) 때문에 두 줄 칸(공고명·날짜) 옆의 한 줄 칸이 위에 붙어 있었다. ★ 공용 규칙을 바꾸지 않고 목록 표에만 건다 — 상세·팝업 표(.tagtable)는 top 을 전제로 짜여 있다. */ .list_from .table_list.tagtable tbody tr > td { vertical-align: middle; } /* 목록 표가 상자(내용 폭)보다 넓어지면 페이지가 아니라 **표 상자 안에서** 가로 스크롤 (2026-10-15 사용자 지시 「모든 출력항목을 설정하면 리스트가 오른쪽 밖으로 나가는데 밖으로 나가지 않게」). ★ 출력항목을 22~23칸으로 켜면 table-layout:auto 의 칸 최소폭 합(실측 1,672px)이 상자(1,247px)를 넘어 페이지 전체가 옆으로 밀렸다 — 칸 글자 크기·폭 힌트(% )로는 최소폭 아래로 못 줄인다. 같은 범위(입찰·낙찰 목록·서류함·최근조회·달력). */ .list_from .table_list.tagtable { max-width: 100%; overflow-x: auto; } /* 공고 목록 「기초금액」·「투찰마감」 칸 강조색 (2026-09-24 사용자 지시) — 검색 버튼 등 강조 분홍(#fa448c)과 같은 색. 적용 화면: 입찰 통합·공사·용역·물품 / 낙찰 통합·공사·용역·물품 / 입찰서류함·낙찰서류함 (PC). 칸에 class="list_hl_pink" 를 단다. ★ `.list_hl_pink *` 까지 칠한다 — common.css 전역 리셋 끝의 `*{color:#1e1e1e}` 가 자식 요소(span 등)에 직접 매칭돼 상속을 이긴다. */ .list_hl_pink, .list_hl_pink * { color: #fa448c; } /* 목록 「투찰금액산출」 버튼 — 한 줄로 (2026-09-24). 이름이 예가산출(4자)→투찰금액산출(6자)로 길어져 좁은 칸(약 77px)에서 「투찰금액 / 산출」 두 줄로 접혔다. 좌우 여백 12→4px·자간 조금 좁혀 한 줄. 목록 표 안의 계산 팝업 링크에만 건다(다른 btn30_rid 무변경). */ tbody a.btn30_rid[href*="bid_calcula_popup"] { white-space: nowrap; padding: 0 4px; letter-spacing: -0.6px; } /* 높이도 표 안 알약 버튼 공통 26px 로(2026-09-25 사용자 지시) — btn30_rid 는 테두리가 없어 줄높이 = 단일소스 + 2px. */ tbody a.btn30_rid[href*="bid_calcula_popup"] { height: auto; line-height: var(--vbid-row-btn-lh, 24px); } /* 외곽선 — 회색 채움만으로는 흰 표 바탕에서 버튼으로 안 보였다(2026-10-09 사용자 지시). 테두리 1px×2 만큼 위 줄높이에서 뺐다(높이 26px 유지). */ tbody a.btn30_rid[href*="bid_calcula_popup"] { border: 1px solid #8c939d; } tbody a.btn30_rid[href*="bid_calcula_popup"]:hover { border-color: #1c293f; } /* 입찰정보 목록 「투찰금액」 칸의 금액 — 옆 「추정가격」 칸(td 기본 글자)과 같은 크기(2026-10-09 사용자 지시). */ td.bid_tender_cell p.bid_tender_amt { font-size: inherit; font-weight: inherit; line-height: inherit; } /* ★ 상단 메뉴 아래 첫 여백 통일 (2026-10-01 사용자 지시 — 「메뉴 아래가 휑해 서비스 신뢰를 떨어뜨린다」). 기준: 제목 화면 28px(common.css .page_title) · 목록 화면 35px(.pat70). ① 공동도급 업체정보·축하의방: .pat70(35px) 위에 첫 제목 아이콘(.fronticon)의 위 여백 30px 이 겹쳐 65px → 목록 화면과 같은 35px. ② 로그인·아이디/비번 찾기·회원가입·약관(.mem_wrap): 섹션 위 40px + .new_title 위 20px = 60px → 제목 화면과 같은 28px. ★ 이 파일은 PC 전용이다(모바일 헤더는 안 읽는다) — common.css 에 넣으면 모바일 로그인·가입 화면까지 같이 바뀐다. */ .tab_table_list.pat70 > .ininner > .table_list:first-child > .fronticon:first-child { margin-top: 0; } .mem_wrap.sectionbt40 { padding-top: 8px; } /* ★ 화면 안 블록(.inner) 사이 간격 통일 (2026-10-01 사용자 지시 — 「서류함 등은 줄였는데 서비스소개는 휑해 일관성이 떨어진다」). 기준: 맞춤공고(서류함) 목록 블록 사이 40px. 공용 .inner 는 아래 120px(user.css) 이라 블록을 쌓으면 그대로 120px 이 벌어진다. ① 서비스소개(.intro_box)·분석프로그램 소개(.program_box): 블록 사이 120 → 40px. 마지막 블록은 푸터 앞 여백이라 공용 120px 유지. ② 서류함 맨 아래 「맞춤 삭제 공고 열기」: 앞 블록 120 + 섹션 위 40 = 160px → 앞 블록 아래를 0 으로 해 40px. ★ 이 파일은 PC 전용이다(모바일은 user_mo.css 의 .inner 패딩 체계라 별개). */ .introduce_wrap > .intro_box:not(:last-child) > .inner, .introduce_wrap > .program_box:not(:last-child) > .inner { margin-bottom: 40px; } .tab_table_list:has(+ #pin-deleted-section) > .inner { margin-bottom: 0; } /* ③ 서류함 접힌 섹션 「맞춤 삭제 공고」·「설정 변경으로 인해 삭제 및 취소된 공고」(2026-10-20 사용자 지적 — 맞춤 삭제 공고를 설정 변경 위로 옮기자 위아래가 휑했다). 두 섹션은 그린 뒤 채우는 자리(div#doc-side-*-slot) 안에 있어 블록 사이 40px 규칙(user.css `.mid_search_box ~ section…pat80`, 형제만 잡는다)이 안 걸린다 → 공용 .pat80(80)이 그대로였고, 맞춤 삭제 공고는 .inner 아래 120 까지 더해 아래 설정 변경 제목까지 약 200px. 블록 사이 40px 로 맞춘다. */ #doc-side-pindel-slot > section.tab_table_list.pat80, #doc-side-cfgdel-slot > section.tab_table_list.pat80 { padding-top: 40px; } #pin-deleted-section > .inner { margin-bottom: 0; } /* 열면 표 아래 공용 .table_list 70px 이 표와 가로 스크롤바 사이에 빈칸으로 남았다(위 목록은 user.css `.mid_search_box ~ … .table_list` 가 0 으로 뺀다 — 같은 형제 규칙 미적용). */ #doc-side-pindel-slot .list_from .table_list, #doc-side-cfgdel-slot .list_from .table_list { padding-bottom: 0; } /* ★ 푸터 앞 여백 120px 통일 (2026-10-01 사용자 지시 — 「푸터 간격도 120px 로 맞춰줘」). 기준은 공용 .inner 아래 120px. 그 위에 다른 여백이 더 쌓이던 곳만 뺀다(PC 27+화면 실측 — 나머지는 이미 120). ① 자료실 목록·게시글 보기(board/list·board4_view): 섹션 아래 40 + .inner 120 + 목록 표 아래 70 = 230/160 → 120. ② FAQ: .inner 120 + 목록 표 아래 70 = 190 → 120. (.table_list 의 70px 은 20여 화면 공용이라 「페이지 맨 끝 표」만 뺀다) ③ 관심업체분석: 마지막 섹션 아래 40 + 120 = 160 → 120(표 ~ 푸터에 내려앉는 「투찰금액 간편계산기」 버튼 사이. 발주처심층분석과 같게). ④ 공지(board/notice): 아래 검색 상자를 bottom:70px 로 끌어올려 상자 아래가 20+70 = 90 → 30 더해 120. ⑤ 약관·로그인·가입·찾기(.mem_wrap): 아래 140 → 120. ⑥ 낙찰 상세: 마지막 섹션 아래 18 + 120 = 138 → 120. ⑦ 결제 화면 60px 은 _payment_compact_style.php 에서 줄 삭제(공용 120 을 따른다). ⑧ ★본문 영역(.layout_body)은 min-height:50vh 라, 본문이 짧으면 마지막 .inner 의 120px 이 **통째로 사라졌다**(FAQ 글 0건 66px·쿠폰 81px). min-height 가 있으면 자식 아래 여백이 부모 밖으로 새지 못하고 최소 높이 안에 묻힌다 → flow-root 로 여백을 본문 높이에 넣는다(= max(최소 높이, 내용+120)). ★ 본문+120 이 화면 절반보다도 짧은 화면(사용후기)은 여전히 최소 높이가 푸터를 아래로 민다 — 푸터가 화면 중간에 뜨지 않게 하는 장치라 그대로 둔다. */ .layout_body { display: flow-root; } .layout_body > section.sectionbt40:not(.plan_sec):last-of-type:has(> .inner:last-child) { padding-bottom: 0; } .inner > .tab_content:last-child > .table_list:last-child, .inner > .tab_table_list:last-child > .tab_content:last-child > .table_list:last-child { padding-bottom: 0; } .relative.mab120 > section.sectionbt40:last-child { padding-bottom: 0; } .end_search { margin-bottom: 30px; } .mem_wrap, .mem_wrap.sectionbt40 { padding-bottom: 120px; } .detail_gap > section.sectionbt40:last-child { padding-bottom: 0; } /* ★ 분석 화면 그래프 두 칸이 화면 밖(가로 3,557px)으로 밀리던 것 (2026-10-01). 발주처 심층분석·관심업체분석·다중분석·나의투찰성향. 칸 안 그래프는 `overflow-x:auto` + `min-width:1714px` 로 「칸 안에서 가로 스크롤」하게 짜였는데, 바깥 표(auto 레이아웃)가 그 폭을 그대로 받아 칸 자체가 1,734px 로 늘어났다 → 칸은 남은 폭을 반씩(min-width:0), 표는 고정 레이아웃이라야 안쪽 스크롤이 산다. ★ 공고 상세의 좌·우 표(.left_table 363px 고정 / .right_table)는 제 규칙이 따로 있어 제외. */ .sub_table_wrap > .tagtable:not(.left_table):not(.right_table) { flex: 1 1 0; min-width: 0; } .sub_table_wrap > .tagtable:not(.left_table):not(.right_table) > table { table-layout: fixed; } /* 서비스소개 > 분석프로그램 소개 캡처 이미지(2026-10-01). 틀(.graph_box 703×440 테두리)은 그대로 두고 이미지는 원본 폭을 넘겨 키우지 않는다(흐림 방지). */ .graph_box img { display: block; max-width: 100%; height: auto; margin: 0 auto; } .graph_box:has(img) { width: 703px; box-sizing: border-box; flex-shrink: 0; min-height: 0; display: flex; align-items: center; justify-content: center; padding: 10px; background: #fff; } .prog_img_top { display: block; width: 100%; aspect-ratio: 1366 / 885; overflow: hidden; } /* 04·05 캡처는 그래프 2개짜리 → 위(흐름 그래프)만 보이게 아래 빈도·분포 그래프를 잘라 가린다(2026-10-05 사용자 지시). 885 = 두 그래프 사이 흰 띠(855~909px). 되돌리기는 뷰에서 이 span 만 걷으면 된다 */ .prog_img_top img { width: 100%; height: auto; } .program_explain li { word-break: keep-all; } /* 소개 문구가 「있습니 / 다」처럼 글자 중간에서 끊기지 않게 */ /* ★ 표 행 높이·표 사이 간격 = 공고 상세 기준(행 35px·섹션 사이 36px) — 2026-10-02 사용자 지시 (「공고 상세 표 높이·간격을 서류함 구분표·통합입찰 필터·발주처 심층분석·관심업체분석·자료실 표에, 같은 속성 표 전부에」). Docs/16. 화면·관리자/화면 동작 규칙.md §8-p. 기준: .basic_info_tbl(td 6px 16px·line-height 22px)·.detail_gap(섹션 위아래 18px). 칸 안에 30px 짜리 버튼·선택상자·입력칸이 들어가는 표는 위아래 2px + 30px = 35px(마이페이지 §8-o 와 같은 셈). 범위(★공용 클래스 자체를 줄이지 않는다 — .table_list_type·.tagtable·.sectionbt40 은 수십 화면 공용): .bid_filter_panel = 입찰·낙찰 목록 8화면(통합·공사·용역·물품 × 입찰·낙찰)의 「설정 열기」 필터 .doc_filter_table = 입찰·낙찰 서류함 맨 위 구분·분류·발주처 표(표 자신) .tbl_compact = 화면 안 표 전부(발주처 심층분석·복수예가분석·관심업체분석·나의투찰성향·자료실 목록) — 뷰의 본문 상자에 붙인다 ★ 목록 결과 표(공고 행)는 넣지 않는다 — 한 행에 공고명·태그·버튼이 여러 줄이라 출력항목 설정(§7 list_row_clamp)이 높이를 따로 잰다. */ :is(.tbl_compact, .bid_filter_panel) .table_list_type tr td, .table_list_type.doc_filter_table tr td { padding: 2px 16px; line-height: 22px; vertical-align: middle; } /* 서류함 구분·분류 칸의 회사·분류 버튼은 33px — 위아래 1px 로 행 36px */ .table_list_type.doc_filter_table tr td { padding-top: 1px; padding-bottom: 1px; } :is(.tbl_compact, .bid_filter_panel) .table_list_type tr td.tit, .table_list_type.doc_filter_table tr td.tit { min-height: 0; line-height: 30px; } :is(.tbl_compact, .bid_filter_panel) .table_list_type tr td label, .table_list_type.doc_filter_table tr td label { line-height: 30px; } /* 목록형 표(.tagtable) — 위아래 여백만 줄인다(좌우는 각 표 값 유지: 큰 제목칸 .large_tit 의 왼쪽 20px 등). ★ 그래프 칸(.subp_table 의 칸 하나짜리 행 = 캔버스)은 제외 — 원래 여백 0·높이를 그래프가 정한다. .subp_table 이라도 칸이 둘 이상인 행(복수예가 번호별 통계 등 숫자 표)은 고정 height:50px 을 풀고 같이 줄인다. */ .tbl_compact .tagtable tr th { padding-top: 6px; padding-bottom: 6px; line-height: 22px; } .tbl_compact .tagtable table:not(.subp_table) tr td, .tbl_compact .tagtable .subp_table tbody tr:has(> td + td) > td { height: auto; padding-top: 6px; padding-bottom: 6px; line-height: 22px; vertical-align: middle; } .tbl_compact section.sectionbt40 { padding: 18px 0; } /* 자료실 「첨부」 칸 아이콘(24px, .onlyico::before)이 줄 높이 22px 보다 커서 행이 42px 로 늘었다 → 아이콘 칸만 위아래 여백 0·가운데 정렬(다른 칸이 35px 를 정한다). */ .tbl_compact .tagtable table:not(.subp_table) tr td:has(> .onlyico) { padding-top: 0; padding-bottom: 0; } .tbl_compact .tagtable td > .onlyico::before { vertical-align: middle; } /* 표 사이 간격 36px(상세 .detail_gap 과 같은 셈 = 앞 섹션 아래 18 + 뒤 섹션 위 18). 그 위에 더 쌓이던 것만 뺀다(발주처 심층분석 실측): ① 흐름 그래프 표 .subp_table.mab40 아래 40 → 0 (그래프 ↔ 「현재 미개찰공고」 76 → 36) ② 미개찰공고 목록 .table_list 아래 70 → 18 (더보기 ↔ 「개찰공고(분석자료)」 88 → 36 — 뒤 섹션은 class 없는
이라 위 여백이 0) ③ 맨 위 조회 표의 「분석」 버튼 ↔ 아래 탭 18 → 36 (버튼 줄 아래 18) */ .tbl_compact .tagtable > .subp_table.mab40 { margin-bottom: 0; } .tbl_compact section.sectionbt40 > .table_list { padding-bottom: 18px; } .tbl_compact .btn_center_wrap:has(> .cellular_btn) { padding-bottom: 18px; } /* ★ 레이어 팝업(.layout_popup) 안 표 — 위 .tbl_compact 와 같은 값(행 35px). 2026-10-03 사용자 지시(「지난입찰정보 팝업 표 간격이 넓다 — 비슷한 팝업 전부」). §8-p. 팝업은 전부 .layout_popup … .pop_body 구조라 마크업에 클래스를 붙이지 않고 여기 한 곳에서 건다(팝업이 80곳 넘게 흩어져 있어 하나씩 붙이면 새 팝업이 또 빠진다). ★위아래 여백만 줄인다 — 좌우는 팝업마다 값이 달라(업종 체크 목록·공동도급 방 개설 등) 건드리지 않는다. ★제목칸(td.tit)은 위쪽 정렬 유지 — 업체 수정요청·방 개설처럼 칸 안이 여러 줄이면 제목이 중간으로 내려간다(§8-o 와 같은 이유). line-height 30 이라 한 줄 칸은 가운데와 같아 보인다. ★그래프 칸(.subp_table 의 칸 하나짜리 행)·입찰결과 보고서(.report_compact, 더 구체적인 자체 규칙)는 제외된다. */ .layout_popup .pop_body .table_list_type tr td { padding-top: 2px; padding-bottom: 2px; line-height: 22px; vertical-align: middle; } .layout_popup .pop_body .table_list_type tr td.tit { min-height: 0; line-height: 30px; vertical-align: top; } .layout_popup .pop_body .table_list_type tr td label { line-height: 30px; } .layout_popup .pop_body .tagtable tr th { padding-top: 6px; padding-bottom: 6px; line-height: 22px; } .layout_popup .pop_body .tagtable table:not(.subp_table) tr td, .layout_popup .pop_body .tagtable .subp_table tbody tr:has(> td + td) > td { height: auto; padding-top: 6px; padding-bottom: 6px; line-height: 22px; vertical-align: middle; } /* 표 사이 간격 = 상세 .detail_gap 과 같은 36px. 팝업 안 .pat80(지난입찰정보 검색표 ↔ 목록, 비밀번호 변경 칸 사이)이 80 이었다. */ .layout_popup .pop_body .pat80 { padding-top: 36px; } /* 지난입찰정보 — 공고 하나 = 제목 줄 + 표. 표 아래가 다음 제목에 바로 붙고 제목 아래는 15px 이 떠 있어 「표 ↔ 제목」 묶음이 거꾸로 보였다 → 제목 아래 8·공고 사이 20. */ .layout_popup[a="last_bid_pop"] i[a="ajax_list"] > div + div { margin-top: 20px; } .layout_popup[a="last_bid_pop"] i[a="ajax_list"] > div > p.fon16500 { padding-bottom: 8px; } .layout_popup[a="last_bid_pop"] .tagtable td .pa6030 { padding-top: 0; padding-bottom: 0; } /* 새 창 팝업(복수예가 동가보기·전체보기) — 위 공고정보 표 ↔ 아래 결과 표 사이가 .pab120(120)·.pat80(80) 이었다 → 36px. */ .layout_contain.tbl_compact .table_list_type.pab120 { padding-bottom: 36px; } .layout_contain.tbl_compact .pat80 { padding-top: 36px; } /* 나의서류함(입찰) 목록 「업종제한」 칸 최대 폭(2026-10-02 사용자 지시 「업종제한 넓이를 조금 좁혀줘」). ★표가 table-layout:auto 라 % 힌트(BID_DOC_LIST_COL_WIDTH_PCT)로는 안 줄었다 — 업종이 긴 공고(「정보통신공사업 and 전기공사업 and 건축」) 하나가 열을 171px 까지 늘렸다. 칸 내용 상자에 최대 폭을 줘야 브라우저가 열을 그만큼만 잡는다. 넘치는 업종은 줄을 바꾼다. ★.doc_bid_tbl = _bid_result_partial·_bid_next_partial 의 표 상자(낙찰 서류함은 대상 밖). */ .doc_bid_tbl .list_indstry_cell { max-width: 110px; } /* ───────────────────────────────────────────────────────────────────────────── 서류함 구분·분류·발주처 칩 디자인 정리(2026-10-03 사용자 지시 「타원형 버튼들이 너무 안 이쁘다」). 전: 구분·분류 = 진파랑으로 **꽉 찬** 알약(33px·굵게) / 발주처 = 얇은 회색 알약(30px) — 줄마다 모양·높이가 달랐고 선택된 칩이 전부 진한 덩어리라 무엇을 골랐는지보다 「파란 벽」이 먼저 보였다. 후: 세 줄을 **한 칩 체계**로 — 높이 30·모서리 8px(둥근 사각)·선택은 **연한 바탕 + 진한 테두리·글자 + ✓**. 「전체」는 감청(다른 칩과 색을 달리한다 — 2026-09-20 지시 유지) + 오른쪽 세로 구분선, 「수동」은 주황 계열 유지. ★범위: PC 서류함 표(.doc_filter_table, 입찰·낙찰 공용) 한정 — 같은 클래스(.auto_co_btn·.doc_agcy_btn)를 쓰는 다른 화면(임시 자동 서류함 줄·모바일 사본)은 그대로다. 마크업·onclick·클래스는 손대지 않았다(모양만). ★예가산출 팝업 「나의 예가/기초」 회사 칩(#calc_flow .calc_flow_companies, 2026-10-04 사용자 지시 「구분 회사 이름 스타일」)도 같은 규칙에 얹었다. ★선택자 앞머리(.table_list_type.doc_filter_table td)는 특이도용 — 공용 user.css 의 .auto_co_btn.auto_co_all.on(0,3,0)· _agency_filter.php 인라인 .doc_agcy_filter .doc_agcy_btn.doc_agcy_all.on(0,4,0)·전역 body *{color} 를 이겨야 한다. ───────────────────────────────────────────────────────────────────────────── */ .table_list_type.doc_filter_table tr td { padding-top: 3px; padding-bottom: 3px; } .table_list_type.doc_filter_table td .auto_co_tabs, .table_list_type.doc_filter_table td .doc_agcy_filter { gap: 6px; } .table_list_type.doc_filter_table td :is(.auto_co_btn, .doc_agcy_filter .doc_agcy_btn), #calc_flow .calc_flow_companies .auto_co_btn { display: inline-flex; align-items: center; gap: 5px; box-sizing: border-box; height: 30px; padding: 0 13px; border: 1px solid #dde2ea; border-radius: 8px; background: #fff; color: #4a5568; font-size: 13px; font-weight: 500; line-height: 1; letter-spacing: -0.2px; box-shadow: 0 1px 1px rgba(16, 24, 40, .04); transition: border-color .12s, background-color .12s, color .12s; } .table_list_type.doc_filter_table td :is(.auto_co_btn, .doc_agcy_filter .doc_agcy_btn):hover, #calc_flow .calc_flow_companies .auto_co_btn:hover { border-color: #9db4ea; background: #f6f9ff; color: #1e46a8; } /* 선택 — 연한 바탕 + 진한 테두리·글자 + 체크 표시(채움이 아니라 「표시」로 고른 것을 알린다) */ .table_list_type.doc_filter_table td :is(.auto_co_btn, .doc_agcy_filter .doc_agcy_btn).on, #calc_flow .calc_flow_companies .auto_co_btn.on { border-color: #2b57c1; background: #edf2fe; color: #1e46a8; font-weight: 600; } .table_list_type.doc_filter_table td :is(.auto_co_btn, .doc_agcy_filter .doc_agcy_btn).on::before, #calc_flow .calc_flow_companies .auto_co_btn.on::before { content: ''; flex: 0 0 auto; width: 12px; height: 12px; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2 6.3l2.6 2.5L10 3.4' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2 6.3l2.6 2.5L10 3.4' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat; } .table_list_type.doc_filter_table td :is(.auto_co_btn, .doc_agcy_filter .doc_agcy_btn).on *, #calc_flow .calc_flow_companies .auto_co_btn.on * { color: inherit; } /* 「전체」 — 감청. 켜지면 감청으로 채운다(기본값 축이라 한눈에 「필터 없음」이 보이게). 뒤에 세로 구분선 */ .table_list_type.doc_filter_table td :is(.auto_co_btn.auto_co_all, .doc_agcy_filter .doc_agcy_btn.doc_agcy_all) { position: relative; margin-right: 9px; border-color: #c3cad6; color: #1c293f; font-weight: 600; } .table_list_type.doc_filter_table td :is(.auto_co_btn.auto_co_all, .doc_agcy_filter .doc_agcy_btn.doc_agcy_all)::after { content: ''; position: absolute; top: 7px; right: -10px; width: 1px; height: 14px; background: #dde2ea; } .table_list_type.doc_filter_table td :is(.auto_co_btn.auto_co_all, .doc_agcy_filter .doc_agcy_btn.doc_agcy_all):hover { border-color: #1c293f; background: #f4f6f9; color: #1c293f; } .table_list_type.doc_filter_table td :is(.auto_co_btn.auto_co_all, .doc_agcy_filter .doc_agcy_btn.doc_agcy_all).on { border-color: #1c293f; background: #1c293f; color: #fff; } .table_list_type.doc_filter_table td :is(.auto_co_btn.auto_co_all, .doc_agcy_filter .doc_agcy_btn.doc_agcy_all).on::before { display: none; } /* 「수동」 — 직접 담은 공고. 주황 계열 유지(자동 회사들과 다른 축), 앞에 여백으로 회사 묶음과 떼어 둔다 */ .table_list_type.doc_filter_table td .auto_co_btn.auto_co_manual { margin-left: 8px; border-color: #ecd3b4; color: #b25f00; } .table_list_type.doc_filter_table td .auto_co_btn.auto_co_manual:hover { border-color: #c26a00; background: #fff8ef; color: #b25f00; } .table_list_type.doc_filter_table td .auto_co_btn.auto_co_manual.on { border-color: #c26a00; background: #fff3e4; color: #b25f00; } /* 등록 업종·물품이 없는 회사(누를 수 없음) — 점선 테두리로 「못 고르는 칸」임을 보인다 */ .table_list_type.doc_filter_table td .auto_co_btn.is_off, .table_list_type.doc_filter_table td .auto_co_btn.is_off:hover { border-style: dashed; border-color: #d5dae2; background: #f7f8fa; color: #a3abb8; box-shadow: none; cursor: default; } .table_list_type.doc_filter_table td .doc_agcy_filter .doc_agcy_help { margin-left: 6px; font-size: 12px; color: #98a2b3; } /* 최종낙찰현황(/success_bid/suc_final, PC) — 2026-10-04 사용자 지시(「표 높이·표와 다른 객체 간 거리를 공고 상세처럼, 입찰일 한 줄」). §8-p. 행 높이는 본문 상자의 .tbl_compact 가 맞추고, 여기선 이 화면만의 간격·한 줄 칸만. 검색 버튼 ↔ 「최종낙찰현황」 제목: 필터 상자 .table_list 아래 70 → 36(.detail_gap 과 같은 값). */ .suc_final_page .success_option .table_list.type3 { padding-bottom: 36px; } .suc_final_page .list_from td.suc_final_date { white-space: nowrap; } /* 서비스소개 > 이용요금 안내(views/service/vibid_pc/price.php, 2026-10-05) */ .price_guide .table_list_type th, .price_guide .table_list_type td.center { text-align: center; } .price_guide del.gray { color: #999; } .price_guide .price_explain { padding-left: 0; } .price_guide .price_pay_btn { display: inline-block; text-align: center; min-width: 220px; height: 48px; line-height: 48px; font-size: 17px; border-radius: 4px; color: #fff; } /* 출력항목설정 팝업 「초기화」 + 여백 축소 (2026-10-09) — 모든 화면 공통(팝업은 views/vibid_pc/common/footer.php 하나). 초기화 버튼은 팝업에 data-bid-type 을 적은 화면만 보인다(안 적으면 눌러도 어느 목록인지 모른다). 버튼은 가운데 버튼 열의 맨 아래, 두 상자 아래 끝선에 맞춘다. */ .layout_popup[data-popup="output_item_setting"] .pop_body { padding-top: 24px; padding-bottom: 24px; } .layout_popup[data-popup="output_item_setting"] .filter_wrap .filter_list { padding-top: 10px; padding-bottom: 12px; } .layout_popup[data-popup="output_item_setting"] .filter_wrap .filter_list .tit { padding-bottom: 8px; } .layout_popup[data-popup="output_item_setting"] .filter_wrap .con:first-child { display: flex; } .layout_popup[data-popup="output_item_setting"] .filter_wrap .con:first-child .filter_btn_list { position: relative; display: flex; flex-direction: column; justify-content: center; } .layout_popup[data-popup="output_item_setting"] .btn_oi_reset { display: none; } .layout_popup[data-popup="output_item_setting"][data-bid-type] .filter_wrap .btn_oi_reset { display: inline-block; position: absolute; left: 14px; bottom: 0; margin: 0; } /* PC 상단 좌측 로고 — 헤더 높이(내용 약 92px)에 맞춰 확대. 원래 107x52(viewBox 위 여백 8 포함) (2026-10-22 사용자 지시) ★ 팝업 머리(.layout_header.popup — 예가산출 팝업)는 빼고 원래 크기 — 키우면 로고가 옆 탭(투찰금액산출…)과 겹친다 (2026-10-23 사용자 지시) */ .layout_header:not(.popup) .left_header .logo img { height: 84px; width: auto; display: block; } /* 홈(/)에서는 「맞춤공고」 기본 분홍(user.css .gnb_cabinet)을 끈다 — 다른 메뉴처럼 회색, 마우스를 올리면 평소대로 (2026-10-22 사용자 지시) */ .gnb_list.gnb_on_home > li.gnb_cabinet > a:not(.on):not(:hover) { color: #313131; font-weight: 400; } /* 입찰 목록 날짜 구분선(2026-10-27 사용자 지시 — 정렬 칸 날짜가 바뀌는 자리마다 한 줄). 마크업 basic_helper vbid_list_date_sep_html ★행 높이 고정·말줄임 스크립트(list_row_clamp.js)는 colspan 한 칸짜리 행을 건너뛴다. */ /* ★목록 표의 .tagtable.small_font tr td(12px·padding 3px, user.css)가 이 줄을 덮어 글자·높이가 안 바뀌었다 → 표 클래스까지 붙여 이긴다 */ tr.list_date_sep > td, .tagtable tr.list_date_sep > td, .tagtable.small_font tr.list_date_sep > td { padding: 11px 14px; background: #e8f1ff; color: #0958d9; font-size: 15px; font-weight: 700; line-height: 1.4; text-align: left; border-top: 1px solid #e9ecef; border-bottom: 1px solid #e9ecef; } /* 제목줄(#f4f4f4)보다 밝게 — 같은 색이면 제목줄로 보인다(2026-10-27 사용자 지시). 잘 안 보여 파란 글자·15px·줄 높이 넓힘 + 연파랑 배경(맞춤 행 분홍과 구별, 2026-10-28 사용자 지시) */