@charset "UTF-8";
:root{
  --teal: #0f8f96;
  --teal-2: #0b7f86;
  --teal-detail :#00739D ;
  --mint-bg: #e9f6f4;
  --card: #ffffff;
  --muted: #6c757d;
  --radius: 18px;
  --shadow: 0 10px 24px rgba(16, 24, 40, 0.08);
    --bs-font-sans-serif: "Pretendard", -apple-system, BlinkMacSystemFont,
                        "Apple SD Gothic Neo", "Noto Sans KR",
                        "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

.text-teal{ color: var(--teal) !important; }

.btn-teal{
  --bs-btn-bg: var(--teal-detail);
  --bs-btn-border-color: var(--teal-detail);
  --bs-btn-color: #fff;
}
.navbar-nav .nav-link:hover{
  color: var(--teal);
}
.btn-teal:hover{
  background-color: #006685;   /* teal-detail보다 8~10% 어둡게 */
  border-color: #006685;
  color:#fff;
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(0,115,157,0.25);
  transition: all .2s ease;

}

.btn-teal-2{
  --bs-btn-bg: #009E9F;
  --bs-btn-border-color: #009E9F;
  --bs-btn-color: #fff;
}

.btn-teal-2:hover{
  color:#fff;
  background-color:#008889;
  border-color:#008889;
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(0,158,159,0.25);
  transition: all .2s ease;
}


.btn-outline-teal{
  --bs-btn-color: var(--teal);
  --bs-btn-border-color: var(--teal);
  --bs-btn-hover-bg: var(--teal);
  --bs-btn-hover-border-color: var(--teal);
  --bs-btn-hover-color: #fff;
}

.hero{
  background: var(--mint-bg);
  padding: 70px 0 50px;
}
.hero-title{
  font-weight :700px;
  font-size: 42px;
  line-height: 1.2;
  letter-spacing: -0.5px;
  
}
.hero-illust{
  max-height: 360px;
  object-fit: contain;
}
.hero-btn{
	height:43px;
}
.stats{
  background: #fff;
  padding: 40px 0 10px;
}
.stat-card{
  background: var(--card);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 18px 18px;
  display:flex;
  justify-content: space-between;
  align-items:center;
  height: 100%;
}
.stat-number{
  font-size: 28px;
  font-weight: 400;
}
.stat-label{
  color: var(--muted);
  font-size: 13px;
  margin-top: 2px;
}
.stat-icon{
  width: 38px;
  height: 38px;
  border-radius: 12px;
  background: var(--mint-bg);
  display:flex;
  align-items:center;
  justify-content:center;
  color: var(--teal);
}

.service-card{
  background: #f3fbfa;
  border-radius: 22px;
  padding: 26px 22px;
  text-align:center;
}


.service-title{
	color: #004D77;
}
.service-illust{
  width: 180px;
  height: 120px;
  object-fit: contain;
}

.cta-band{
  background: var(--teal);
  padding: 70px 0;
}
.cta-band .btn-outline-light:hover{
  background:#fff;
  color: var(--teal);
  transform: translateY(-2px);
  transition:.2s ease;
}
.footer{
  background:#F5FAF9;
}

.footer-desc{
  color:#6c757d;
  font-size:14px;
  line-height:1.6;
  max-width:420px;
}

.footer-title{
  font-weight:600;
  margin-bottom:12px;
}

.footer-menu,
.footer-contact{
  list-style:none;
  padding:0;
  margin:0;
}

.footer-menu li,
.footer-contact li{
  margin-bottom:8px;
  font-size:14px;
  color:#6c757d;
}

.footer-menu a{
  text-decoration:none;
  color:inherit;
}

.footer-menu a:hover{
  color:var(--teal);
}

.footer-bottom{
  border-top:1px solid #e0ecea;
  font-size:13px;
  color:#9aa4a6;
}
h1, h2, h3, h4, h5 {
  font-weight: 700;
}

.hero-title {
  font-weight: 800;
}

.navbar-nav .nav-link {
  font-weight: 500;
}
.contactinfolist{
	font-weight :400;
}
.stat-number {
  font-weight: 700;
}
.hero-title {
  letter-spacing: -0.5px;
}
@media (max-width: 991.98px){
  .hero-title{ font-size: 32px; }
  .hero{ padding: 50px 0 30px; }
}



/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~intro~~~~~~~~~~~~~~~~~~~~~~~~~*/

/* ===== Intro page ===== */

/* 상단 배너 */
.page-hero{
  background: var(--teal);
  padding: 58px 0;
  position: relative;
  overflow: hidden;
   min-height: 220px;	
}
.page-hero-title{
  color:#fff;
  font-size: 40px;
  font-weight: 800;
  letter-spacing: -0.5px;
  margin-bottom: 10px;
}
.page-hero-desc{
  color: rgba(255,255,255,0.72);
  margin: 0;
  line-height: 1.7;
  font-size: 14px;
}
.page-hero-watermark{
  position:absolute;
  right: -20px;
  top: 50%;
  transform: translateY(-50%);
  width: 360px;
  opacity: 0.22;          /* 시안처럼 워터마크 느낌 */
  pointer-events:none;
}

/* 섹션 공통 */
.section-title{
  font-size: 28px;
  font-weight: 800;
  letter-spacing: -0.3px;
}
.section-divider{
  border:0;
  height:1px;
  background:#e7efef;
  margin:0;
}

/* 미션 체크리스트 */
.mission-list{
  list-style:none;
  padding:0;
  margin:0;
  display:grid;
  gap: 10px;
}
.mission-list li{
  display:flex;
  align-items:center;
  gap:10px;
  font-size:14px;
}
.mission-list i{
  color: var(--teal);
  font-size: 18px;
}
.mission-illust{
  max-width: 320px;
}
.value-illust {
  /* 이미지들이 들어갈 공간을 미리 확보해서 타이틀 위치를 고정합니다. */
  width: 100%;
  max-width: 210px; /* 기존 너비 유지 */
  height: 190px;    /* 높이를 고정하여 아래 타이틀 라인을 통일 */
  object-fit: contain; /* 비율 유지하며 영역 채우기 */
  margin-bottom: 0;   /* 여백은 타이틀의 margin-top으로 조절 */
  flex-shrink: 0;     /* 이미지 크기가 줄어들지 않도록 고정 */
}
/* 핵심가치 카드 */
.value-card {
  display: flex;
  flex-direction: column;
  align-items: center; /* 가로 중앙 정렬 */
  background: #f3fbfa;
  border-radius: 18px;
  padding: 35px 25px;
  height: 100%;
}

.value-title {
  color: #004D77;
  font-weight: 800;
  font-size: 1.25rem;
  margin-top: 20px;
  margin-bottom: 20px;
  word-break: keep-all; /* 제목 줄바꿈 예쁘게 */
}

/* 텍스트 리스트 영역 */
.value-text-list {
  text-align: left; /* 내용은 왼쪽 정렬이 국룰! */
  list-style: none;
  padding: 0;
  margin: 0;
  font-size: 14px;
  line-height: 1.6;
  color: #666;
  
  /* 핵심: 내용이 적어도 카드가 꽉 차 보이게 중앙 정렬 */
  flex-grow: 1; 
  display: flex;
  flex-direction: column;
  justify-content: center; 
}

.value-text-list li {
  position: relative;
  padding-left: 15px;
  margin-bottom: 8px;
}

/* 'ㅇ' 대신 깔끔한 점(dot)이나 대시(-) 넣기 */
.value-text-list li::before {
  content: "•";
  position: absolute;
  left: 0;
  color: var(--teal);
  font-weight: bold;
}

.value-icon {
  margin-top: 25px;
  color: var(--teal);
  font-size: 24px;
  flex-shrink: 0; /* 아이콘 위치 고정 */
}
/* 발전사 타임라인 */
.timeline{
  position: relative;
  margin-top: 26px;
}
.timeline-line{
  position:absolute;
  left: 50%;
  top: 0;
  bottom: 0;
  width: 2px;
  background: #cfe7e5;
  transform: translateX(-50%);
}
.timeline-item{
  display:grid;
  grid-template-columns: 1fr 40px 1fr;
  gap: 18px;
  align-items: start;
  padding: 18px 0;
}
.timeline-left{
  text-align: right;
  padding-right: 14px;
}
.timeline-year{
  font-size: 18px;
  font-weight: 800;
  margin-bottom: 6px;
}
.timeline-head{
  font-size: 13px;
  margin-bottom: 6px;
}
.timeline-desc{
  font-size: 12px;
  line-height: 1.6;
}
.timeline-dot{
	
  position: relative; z-index:1;
  
  
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--teal);
  margin: 6px auto 0;
  box-shadow: 0 0 0 6px rgba(15,143,150,0.12);
}
.timeline-right{
  padding-left: 14px;
}
.timeline-img{
  width: 100%;
  max-width: 420px;
  border-radius: 10px;
  object-fit: cover;
}

/* 모바일 대응 */
@media (max-width: 991.98px){
  .page-hero-title{ font-size: 32px; }
  .page-hero-watermark{ width: 260px; right:-60px; }

  .timeline-line{ left: 14px; transform:none; }
  .timeline-item{
    grid-template-columns: 28px 1fr;
    gap: 12px;
  }
  .timeline-left{
    text-align: left;
    padding: 0;
    grid-column: 2;
  }
  .timeline-dot{
    grid-column: 1;
    margin: 10px 0 0;
  }
  .timeline-right{
    grid-column: 2;
    padding: 0;
  }
}

/* 터치 디바이스에서 hover/transform 제거 */
@media (hover: none) and (pointer: coarse) {
  .btn-teal:hover,
  .btn-teal-2:hover,
  .cta-band .btn-outline-light:hover {
    transform: none;
    box-shadow: none;
  }
}
/* MAIN - 모바일 보정 */
@media (max-width: 575.98px) {
  .hero { padding: 44px 0 26px; }
  .hero-title { font-size: 28px; line-height: 1.25; }

  .hero-btn {
    width: 100%;
    height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  .hero-illust {
    max-height: 300px;
    margin-top: 10px;
  }
    .service-card .btn {
    width: 70% !important; /* w-50 덮기 */
    border-radius: 10px;
  }
  
}

/* INTRO - 상단 배너 모바일 보정 */
@media (max-width: 575.98px) {
  .page-hero { padding: 44px 0; }
  .page-hero-title { font-size: 30px; }
  .page-hero-watermark {
    width: 240px;
    right: -80px;
    opacity: 0.18;
  }
  .timeline-line { left: 16px; } /* 기존 14px -> 살짝 여유 */
  .timeline-item { padding: 16px 0; }
  .timeline-left { padding-left: 6px; } /* 텍스트가 라인에서 살짝 떨어지게 */
  .timeline-img { max-height: 140px; }  /* 이미지가 너무 커져서 흐름 끊기는 것 방지 */
  
}


/*~~~~~~~~~~~~~~~~~~companyregister 기업신고제~~~~~~~~~~~~~~~~~~*/
/* ===== Company page ===== */

/* 상단 배너 우측 일러스트 */
.company-hero {  
  overflow:hidden; }
.company-hero-illust{
  position:absolute;
  right: -10px;
  top: 50%;
  transform: translateY(-50%);
  width: 360px;
  opacity: 0.95;
  pointer-events:none;
}

/* 혜택 카드(6개) */
.icon-card{
  background:#f3fbfa;
  border-radius: 18px;
  padding: 26px 22px;
  text-align:center;
}
.icon-badge{
  width: 46px;
  height: 46px;
  border-radius: 14px;
  background: #e9f6f4;
  display:flex;
  align-items:center;
  justify-content:center;
  margin: 0 auto 12px;
  color: var(--teal);
  font-size: 20px;
}
.icon-card-title{
  font-weight: 800;
  font-size: 16px;
  margin-bottom: 10px;
}

/* 요건 카드(3개) */
.req-card {
  display: flex;
  flex-direction: column; /* 세로 방향 정렬 */
  background: #fff;
  border-radius: 18px;
  box-shadow: var(--shadow);
  padding: 30px 20px; /* 위아래 패딩을 조금 더 주면 여백이 예쁩니다 */
  height: 100%; /* h-100과 함께 작동 */
}

.req-title {
  /* min-height를 유지하면 타이틀이 두 줄이 되어도 높이가 깨지지 않아요 */
  min-height: 48px; 
  font-weight: 800;
  font-size: 16px;
  margin-bottom: 15px;
  text-align: center;
  flex-shrink: 0; /* 타이틀 영역이 좁아지지 않도록 고정 */
}

.req-list {
  list-style: none;
  margin: 0;
  padding-left: 0; /* 중앙 정렬 시 어색하지 않게 0으로 조절 추천 */
  color: var(--muted);
  font-size: 13px;
  line-height: 1.7;
  /* 핵심: 리스트 영역만 남은 공간 안에서 세로 가운데 정렬 */
  flex-grow: 1; 
  display: flex;
  flex-direction: column;


}


/* 프로세스 카드(4단계) */
.step-card{
  background:#f3fbfa;
  border-radius: 18px;
  padding: 22px 18px;
  text-align:center;
  position:relative;
}
.step-num{
  width: 42px;
  height: 42px;
  border-radius: 999px;
  background: #e9f6f4;
  color: var(--teal);
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight: 800;
  margin: 0 auto 10px;
}
.step-title{
  font-weight: 800;
  margin-bottom: 6px;
}
.step-time{
  margin-top: 10px;
  font-size: 12px;
  color: var(--teal);
  font-weight: 700;
}

/*첫 일러스트부분 깨짐 방지 */
@media (max-width: 575.98px){
  .company-hero-illust{
    width: 240px;
    right: -80px;
    opacity: 0.35;
  }
  .icon-card, .step-card{ padding: 22px 18px; }
}

/* ===== Company page - Mobile polish ===== */
@media (max-width: 575.98px){

  /* 1) Page Hero: 제목/설명 가독성 + 일러스트 위치 */
  .page-hero-title{
    font-size: 30px;
    line-height: 1.2;
  }
  .page-hero-desc{
    font-size: 13px;
    line-height: 1.6;
  }
  .company-hero-illust{
    width: 230px;     /* 시안 캡처 느낌으로 살짝 줄임 */
    right: -70px;
    opacity: 0.35;
  }

  /* 2) “기업신고제란?” 2컬럼: 이미지가 너무 커 보이면 제한 */
  .mission-illust{
    max-width: 260px;
    margin-top: 6px;
  }
  .mission-list li{
    font-size: 13px;
  }

  /* 3) 지원 혜택(6개) 카드: 텍스트 간격 + 아이콘 크기 */
  .icon-card{
    padding: 22px 18px;
    border-radius: 16px;
  }
  .icon-badge{
    width: 44px;
    height: 44px;
    border-radius: 14px;
    font-size: 18px;
    margin-bottom: 10px;
  }
  .icon-card-title{
    font-size: 15px;
    margin-bottom: 8px;
  }
  .icon-card p{
    font-size: 12px;
    line-height: 1.6;
    margin-bottom: 0;
  }

  /* 4) 요건 카드(3개): 리스트 들여쓰기/아이콘 체크형(선택) */
  .req-card{
    padding: 20px 18px;
    border-radius: 16px;
  }
  .req-title{
    font-size: 15px;
    margin-bottom: 10px;
  }
  .req-list{
    padding-left: 0;      /* 모바일에선 들여쓰기 제거가 더 깔끔 */
    font-size: 12px;
  }
  .req-list li{
    position: relative;
    padding-left: 16px;
    margin-bottom: 8px;
  }
  .req-list li::before{
    content: "✓";
    position: absolute;
    left: 0;
    top: 0;
    color: var(--teal);
    font-weight: 700;
  }

  /* 5) 프로세스(4단계): 카드 높이/타이포 통일 */
  .step-card{
    padding: 22px 18px;
    border-radius: 16px;
  }
  .step-num{
    width: 40px;
    height: 40px;
    margin-bottom: 8px;
  }
  .step-title{
    font-size: 15px;
  }
  .step-desc{
    font-size: 12px;
    line-height: 1.6;
  }
  .step-time{
    font-size: 12px;
    margin-top: 8px;
  }

  /* 6) CTA 버튼: 모바일에서 풀폭에 가깝게 (시안 느낌) */
  .cta-band .btn{
    width: 100%;
    max-width: 320px;
    height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
}


/*분석 장비/시설 예약 (list)~~~~~~~~~~~~~~~~*/

/* ===== Reservation list page ===== */

/* 프로세스 3단계 */
.process-steps{
  display: grid;
  grid-template-columns: 1fr 60px 1fr 60px 1fr;
  align-items: center;
  gap: 10px;
}
.process-step{
  background:#f3fbfa;
  border-radius: 18px;
  padding: 22px 18px;
  text-align:center;
}
.process-num{
  font-style:italic;
  
  
  width: 42px;
  height: 42px;
  border-radius: 999px;
  background:#e9f6f4;
  color: var(--teal);
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight: 800;
  margin: 0 auto 10px;
}
.process-title{
  font-weight: 800;
  margin-bottom: 6px;
}
.process-desc{
  font-size: 12px;
}
.process-arrow{
  text-align:center;
  color: var(--teal);
  font-size: 18px;
}

/* 필터 카드 */
.filter-card{
  background: #fff;
  border-radius: 18px;
  box-shadow: var(--shadow);
  padding: 18px 18px;
}

/* 자원 카드 리스트 */
.resource-list{
  display:flex;
  flex-direction: column;
  gap: 14px;
  
}
.resource-card{
  background:#fff;
  border-radius: 18px;
  box-shadow: var(--shadow);
  padding: 16px;
  display:grid;
  grid-template-columns: 110px 1fr 180px;
  gap: 16px;
  align-items: center;
  
  
  
    text-decoration: none;
  color: inherit;
   cursor: pointer;
  transition: transform .15s ease, box-shadow .15s ease;
}
.resource-card:hover{
  transform: translateY(-2px);
  box-shadow: 0 14px 26px rgba(16,24,40,0.10);
}

/* 목적(purpose) 태그 */
.purpose-chip{
  display:inline-flex;
  align-items:center;
  padding: 4px 10px;
  border-radius: 999px;
  background: rgba(0,115,157,0.12); /* teal-detail 계열 느낌 */
  color: var(--teal-detail);
  font-size: 12px;
  font-weight: 700;
}

/*summary text 분리*/
.summary-list{
  list-style:none;
  padding:0;
  margin: 10px 0 0;
  display:flex;
  flex-wrap: wrap;
  gap: 8px 14px; /* 줄간격/칩간격 */
}

.summary-list li{
  display:flex;
  align-items:center;
  gap: 6px;
  font-size: 12px;
  color: #6c757d;
  white-space: nowrap;
}

.summary-list i{
  color: var(--teal);
  font-size: 14px;
}


/* 우측 포인트 영역 */
.resource-price{
  text-align: right;
  display:flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 2px;
  min-width: 160px;
}
.point-num{
  font-size: 22px;
  font-weight: 800;
  color: #004D77; /* 너가 service-title로 쓰는 톤 */
  line-height: 1.1;
}
.point-unit{
  font-size: 12px;
}

.point-status{
  margin-top: 6px;
  font-weight: 800;
  font-size: 14px;
}
.point-status.ok{ color:#22c55e; }
.point-status.no{ color:#94a3b8; }

/* 점검중(비활성)일 때는 링크여도 클릭 막기 */
.resource-card.is-disabled{
  opacity: 0.55;
  background: #f9fafb;
  pointer-events: none;
  transform: none !important;
  box-shadow: var(--shadow);
}

.resource-thumb{
  width:110px;
  height:84px;
  border-radius: 14px;
  overflow:hidden;
  background:#f3fbfa;
  border: 1px solid #e7efef;
  display:flex;
  align-items:center;
  justify-content:center;
}
.resource-thumb img{
  width:100%;
  height:100%;
  object-fit: cover;
}
.thumb-placeholder{
  font-size: 12px;
}
.resource-title{
  font-weight: 800;
  font-size: 18px;
  margin-bottom: 4px;
}
.resource-sub{
  font-size: 12px;
  line-height: 1.5;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 760px;
}
.resource-meta{
  font-size: 12px;
}
.resource-actions{
  display:flex;
  flex-direction: column;
  gap: 10px;
}
.type-chip{
  display:inline-flex;
  align-items:center;
  padding: 4px 10px;
  border-radius: 999px;
  background:#e9f6f4;
  color: var(--teal);
  font-size: 12px;
  font-weight: 700;
}
.status-chip{
  display:inline-flex;
  align-items:center;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
}
.status-chip.ok{ background:#dcfce7; color:#166534; }
.status-chip.no{ background:#e5e7eb; color:#64748b; }

/* 사용 불가(점검중) 비활성화 - 기존 로직 유지 */
.resource-card.is-disabled{
  opacity: 0.55;
  background: #f9fafb;
  pointer-events: none;
}
.resource-card.is-disabled .btn{
  background-color: #cbd5e1 !important;
  border-color: #cbd5e1 !important;
  color: #fff !important;
}

/* 페이지네이션 */
.pager{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  gap: 12px;
}

/* 특징 카드 */
.feature-card{
  background:#f3fbfa;
  border-radius: 18px;
  padding: 26px 22px;
  text-align:center;
}
.feature-icon{
  width: 46px;
  height: 46px;
  border-radius: 14px;
  background:#e9f6f4;
  color: var(--teal);
  display:flex;
  align-items:center;
  justify-content:center;
  margin: 0 auto 12px;
  font-size: 20px;
}
.feature-title{
  font-weight: 800;
  margin-bottom: 8px;
}

/* 모바일 */
@media (max-width: 575.98px){
  .process-steps{
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .process-arrow{ display:none; }

  .resource-card{
    grid-template-columns: 90px 1fr;
    grid-template-areas:
      "thumb body"
       "price price";
  }
  .resource-thumb{ width:90px; height:72px; }
   .resource-price{
    grid-column: 1 / -1;
    align-items: flex-start;
    text-align: left;
    margin-top: 6px;
  }
  .point-num{ font-size: 18px; }
  .point-status{ font-size: 13px; }
  
  .resource-sub{ max-width: 100%; }
  .pager{ justify-content: center; }
}

/* ~~~~~~~~~~~ Resource Detail Page ~~~~~~~~~ */
/* ===== Resource Detail Page ===== */
.back-link{ color:#6c757d; text-decoration:none; font-weight:600; }
.back-link:hover{ color:var(--teal); text-decoration:underline; }

.detail-head{ display:flex; justify-content:space-between; align-items:flex-start; gap:14px; }

.detail-title{ font-size:28px; font-weight:700; letter-spacing:-0.4px; }

.badge-pill{
  display:inline-flex; align-items:center;
  padding:8px 12px; border-radius:8px;
  font-weight:400; font-size:16px;
}
.badge-pill.ok{ background:#EAF8F3; color:#009E9F; }
.badge-pill.no{ background:#e5e7eb; color:#64748b; }

.info-card{
  background:#fff; border-radius:18px;
  box-shadow:var(--shadow);
  padding:18px;
  border:1px solid #eef3f2;
}
.pre-note{ white-space:pre-wrap; font-family:inherit; margin:0; }

.calendar-head{ display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:10px; }
.calendar-card{
  background:#fff; border-radius:18px;
  box-shadow:var(--shadow);
  border:1px solid #eef3f2;
  padding:14px;
}

/* ===== FullCalendar custom (GreenBio) ===== */
#calendar .fc{
  --fc-border-color:#e7efef;
  --fc-today-bg-color:rgba(233,246,244,0.85);
  font-size:12px;
}

#calendar  .fc-button{
  
  border-radius:10px; border:1px solid #e7efef;
  background:#fff; color:#1E1E1E;
  padding:6px 10px; font-weight:800; box-shadow:none;
}

#calendar .fc-button-group{
	gap:8px;
}
#calendar .fc-button:hover{ background:#f3fbfa; }
#calendar .fc-button:focus{ box-shadow:none !important; }

#calendar .fc-col-header-cell{ background:#fff; }

#calendar .fc-timegrid-slot-label{ color:#64748b; font-weight:400; }
#calendar .fc-timegrid-slot{ height:53px; }







#calendar  .fc-timegrid-event{
  
 
  display: grid;
  place-items: center;
  border:none !important; 
  border-radius:12px;
  padding: 10px 10px;
  box-shadow:0 8px 18px rgba(16,24,40,0.10);
}
#calendar  .fc-event-title{
  text-align: center;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.2; }
#calendar .fc-event-time{  
	
  text-align: center;
  font-size: 11px;
  font-weight: 400;
  opacity: 0.9;
  margin-top: 4px; }

#calendar .fc-timegrid-event.evt-approved {
  background-color: #004D77 !important;
  border-color: #004D77 !important;
  color: #fff !important;
}
#calendar .fc .fc-timegrid-slot{
  height: 48px; /* 44 -> 48 */
}

/* 승인대기 */
#calendar .fc-timegrid-event.evt-requested {
  background-color: #cfe97a !important;
  border-color: #cfe97a !important;
  color: #1f2937 !important;
}

/* 텍스트  */
#calendar .fc-timegrid-event.evt-approved .fc-event-title,
#calendar .fc-timegrid-event.evt-approved .fc-event-time {
  color: #fff !important;
}

#calendar .fc-timegrid-event.evt-requested .fc-event-title,
#calendar .fc-timegrid-event.evt-requested .fc-event-time {
  color: #1f2937 !important;
}


/* Bootstrap a 스타일(파란색/밑줄) 캘린더 안에서 무력화 */
#calendar a{
  color: inherit !important;
  text-decoration: none !important;
}
#calendar a:hover,
#calendar a:focus{
  color: inherit !important;
  text-decoration: none !important;
}

#calendar .fc-col-header-cell-cushion{
  color: #6b7280 !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  padding: 10px 0 !important; /* FC 기본 2px 4px 덮기 */
  text-decoration: none !important;
}
#calendar .fc-col-header-cell-cushion:hover{
  color: #6b7280 !important;
  text-decoration: none !important;
}

#calendar .fc-day-today{
  background: rgba(233,246,244,0.85) !important;
}

#calendar .fc-scrollgrid,
#calendar .fc-scrollgrid td,
#calendar .fc-scrollgrid th{
  border-color: #e7efef !important;
}

/* 가로 슬롯 라인 */
#calendar  .fc-timegrid-slot{
  border-color: #e7efef !important;
}

#calendar  .fc-toolbar-title{
  text-align:left;
  
  color: #1B1B1B;
  font-size: 18px !important;
  font-weight: 400 !important;
  letter-spacing: -0.5px !important;
  color: #111827 !important;
}

/* ===== Reservation Modal ===== */
.reservation-modal{ border-radius:18px; border:none; }
.target-card{ background:#e9f6f4; border-radius:16px; padding:18px 16px; }
.target-title{ font-size:20px; font-weight:800; }
.target-sub{ font-size:13px; margin-top:4px; }

.notice-card{ background:#e9f6f4; border-radius:16px; padding:16px; }
.notice-card ul{ padding-left:18px; }
.notice-card li{ color:#6c757d; font-size:13px; line-height:1.6; margin-bottom:6px; }

.upload-box{
  border:2px dashed #dbe7e6; border-radius:14px;
  padding:22px 16px; background:#fff; text-align:center;
}
.upload-box.is-dragover{ background:#f3fbfa; border-color:var(--teal); }
.upload-inner .upload-icon{ font-size:24px; color:var(--teal); }
.upload-text{ font-weight:800; margin-top:8px; }
.upload-hint{ font-size:12px; margin-top:4px; }

.file-list{ display:flex; flex-direction:column; gap:10px; }
.file-item{
  display:flex; justify-content:space-between; align-items:center; gap:10px;
  padding:10px 12px; border-radius:12px;
  border:1px solid #eef3f2; background:#fff;
}
.file-left{ display:flex; align-items:center; gap:8px; min-width:0; }
.file-name{
  font-size:13px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  max-width:420px;
}

@media (max-width: 575.98px){
  .detail-title{ font-size:22px; }
  .calendar-card{ padding:12px; }
  .target-title{ font-size:18px; }
  .file-name{ max-width:220px; }
}


/*~~~~~~~~ notices Page~~~~~~~~~~*/
/* ===== Notice List Page ===== */

.notice-hero{
  background: var(--teal);
  padding: 70px 0;
  position: relative;
  overflow: hidden;
}
.notice-hero .page-hero-title{ color:#fff; }
.notice-hero .page-hero-desc{ color: rgba(255,255,255,0.78); max-width: 520px; }

.notice-hero-illust{
width: 380px; /* 시안 크기에 맞춰 조정 */
  margin-bottom: -80px; /* 하단에 걸치는 효과 */
}

/* card */
.gb-card{
  background:#fff;
  border-radius: 18px;
  box-shadow: var(--shadow);
  padding: 28px 60px 10px;
}
.gb-card-header{
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 12px;
  padding-bottom: 16px;
  
}
.gb-card-title{
  margin:0;
  font-size: 32px;
  font-weight: 700;
  letter-spacing: -0.4px;
}

/* search bar */
.gb-searchbar{
  display:flex;
  align-items:center;
  gap: 12px;
  padding: 18px 0 16px;
  border-bottom: 1px solid #e7efef;
}
.gb-search-input{
  flex:1;
  position: relative;
}
.gb-search-input i{
  position:absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  color: #9aa4b2;
  font-size: 16px;
}
.gb-search{
  padding-left: 42px;
  height: 44px;
  border-radius: 12px;
  border: 1px solid #e7efef;
}
.gb-search:focus{
  border-color: rgba(15,143,150,0.35);
  box-shadow: 0 0 0 0.2rem rgba(15,143,150,0.15);
}

.gb-search-actions .gb-btn{
  height: 44px;
  min-width: 92px;
  border-radius: 12px;
  font-weight: 400;
  font-size:16px;
}
.gb-btn-primary{
  background: #009E9F;

  color:#fff;
}
.gb-btn-primary:hover{
  background: var(--teal-2);
  border-color: var(--teal-2);
  color:#fff;
}
.gb-btn-ghost{
  background: #e9f6f4;
  border-color: #e9f6f4;
  color: #0b6b70;
}
.gb-btn-ghost:hover{
  filter: brightness(0.98);
}

/* list rows */
.gb-list{ }
.gb-row{
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 14px;
  padding: 18px 14px;
  border-bottom: 1px solid #edf2f2;
  text-decoration: none;
  color: inherit;
}
.gb-row:hover{
  background: #eef8f6; /* 시안 hover 민트 */
}
.gb-row-title{
  font-weight: 400;
  color: #3A3A3A;
}
.gb-row-date{
  color: #6B7280;
  font-weight: 400;
  font-size: 14px;
  white-space: nowrap;
}

/* pagination */
.gb-pagination {
  gap: 8px; /* 숫자 사이 간격 */
}

.gb-pagination .page-link{
  border-radius: 10px !important;
  border: none;
  padding: 10px 14px;
  color: #111827;
}
.gb-pagination .page-item.active .page-link{
	
  background: #009E9F;
  color:#fff;
}
.gb-pagination .page-item.disabled .page-link{
	
  opacity: 0.5;
}

/* count */
.gb-count{
  color: #9aa4b2;
  font-weight: 700;
}

/* mobile */
@media (max-width: 575.98px){
  .notice-hero{ padding: 56px 0; }
  .gb-card{ padding: 22px 18px 8px; }
  .gb-card-title{ font-size: 22px; }
  .gb-searchbar{ flex-direction: column; align-items: stretch; }
  .gb-search-actions{ display:flex; gap: 10px; }
  .gb-search-actions .gb-btn{ flex:1; min-width: 0; }
}



/* ===== Notice Detail ===== */

.gb-detail-wrap{ 
	
}

/* 시안처럼 큰 흰 박스 */
.gb-detail-card{
  background:#fff;
  border: 1px solid #e7efef;
  border-radius: 18px;
  box-shadow: var(--shadow);
  overflow:hidden;
  
}

.gb-detail-head{
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 12px;
  padding: 18px 22px;
  background: #eef8f6;  
  border-bottom: 1px solid #e7efef;

}

.gb-detail-title{
  font-weight: 400;
  font-size:18px;
  color: #3A3A3A;
}

.gb-detail-date{
  color: #6B7280;
  font-weight: 400;
  font-size: 14px;
  white-space: nowrap;
}

/*본문 이미지 제어*/
.gb-detail-content img {
  max-width: 100%;
  max-height: 500px;
  height: auto;
  object-fit: contain;
  border-radius: 6px;
  margin: 8px 0;
  display: block;
}
.gb-detail-body{
  padding: 22px;
}

.gb-detail-meta{
  color: #9aa4b2;
  font-weight: 700;
  font-size: 13px;
  margin-bottom: 14px;
}

.gb-detail-content{
  color: #757575;
  line-height: 1.85;
  font-size: 16px;
}

.gb-detail-content a{
  color: var(--teal-detail);
  text-decoration: underline;
}

/* 첨부 */
.gb-attach-title{
  font-weight: 800;
  margin-bottom: 10px;
}
.gb-attach-row{
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 12px;
  border: 1px solid #e7efef;
  border-radius: 14px;
  padding: 12px 14px;
  background:#fff;
}
.gb-attach-left{
  display:flex;
  align-items:center;
  gap: 10px;
}
.gb-attach-ico{ font-size: 16px; }
.gb-attach-name{ font-weight: 700; }
.gb-attach-meta{ color:#9aa4b2; font-size: 12px; font-weight: 700; }

/* 모바일 */
@media (max-width: 575.98px){
  .gb-detail-head{ padding: 16px 16px; }
  .gb-detail-body{ padding: 16px; }
  .gb-attach-row{ flex-direction: column; align-items: stretch; }
}