﻿/* 공통 tab_지역,학교 */
.tabListInJob,.tabListInSchool {display: flex; flex-wrap: wrap; gap: 10px 8px; padding: 12px 14px; margin: 10px 0;  border-radius: 10px; background: #fff; }

.tabListInJob li, .tabListInSchool li { list-style: none;}

.tabListInJob li a, .tabListInSchool li a { display: inline-block; border: 1px solid #ccc; border-radius: 20px; padding: 8px 18px; color: #333; background: #fff; text-decoration: none; transition: 0.2s; }

.tabListInJob li a:hover, .tabListInSchool li a:hover { border-color: #007bff; color: #007bff; }

.tabListInJob li a.on, .tabListInSchool li a.on { background: #007bff; color: #fff; border-color: #007bff; }


/* 공통 tab_직종 */
.tabListInOccp {  display: flex; gap: 10px; flex-wrap: wrap;  }

/* 각 depth 영역 스타일 */
.tabListInOccp .depth1,  .tabListInOccp .depth3 { flex: 1; min-width: 200px; }

.tabListInOccp .depth2 { flex: none; width: 300px; }

/* 스크롤 영역 */
.tabListInOccp .job-wrap__col-section--list { min-height: 300px; max-height: 300px; overflow-y: auto; padding: 5px; border: 1px solid #ddd; border-radius: 4px; margin-bottom: 20px;}

/* 항목 개별 스타일 */
.tabListInOccp .job-select-item { margin-bottom: 5px;}

.tabListInOccp .job-select-item a { text-decoration: none; color: #333; display: block; padding: 3px 5px; border-radius: 3px; transition: color 0.2s, background-color 0.2s;}

.tabListInOccp .job-select-item a:hover { color: #007bff; background-color: #f0f8ff; cursor: pointer;}

/* 선택된 항목 on 클래스 */
.tabListInOccp .job-select-item a.on { background-color: #007bff; color: #fff; font-weight: bold;}

/* 반응협 _ 각 탭별 디자인 */
@media (max-width: 768px) {

	.tabListInOccp {  flex-direction: column;}

    .tabListInOccp .depth1, .tabListInOccp .depth2, .tabListInOccp .depth3 { width: 100%; min-width: 0;}
}
