* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/* 스크롤 부드럽게하기 */
html {
  scroll-behavior: smooth;
}

body {
  background-image: url("../assets/images/background_01.png");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  min-height: 100vh;
}

/* 맨 위로 올리기 버튼 css*/
#backtotop {
  position: fixed;
  bottom: 30px;
  right: 30px;
  display: none;
  z-index: 9999;
  padding: 15px;
  cursor: pointer;
  border-radius: 10px;
}

/* 헤더 전체 박스 조절 */
.header-container {
  max-width: 100%; /* 1400px 제한 해제 */
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px 3%;
}

.nav ul {
  display: flex;
  list-style: none;
  gap: 40px;
}

/* 헤더 로고 */
.logo {
  height: 40px;
  width: auto;
}

/* 네비게이션 */
.nav ul {
  display: flex;
  list-style: none;
  gap: 30px;
  align-items: center;
}

.nav a {
  text-decoration: none;
  color: white;
  font-size: 16px;
}

.lang-menu {
  display: flex;
  align-items: center;
  gap: 8px;
}

.lang-menu img {
  width: 20px;
  height: auto;
}

/* 메인 콘텐츠 */
.main-content {
  padding: 100px 0;
  height: 100vh;
  width: 100%;
  justify-content: center;
  align-items: center;
}

/* 승차권조회 */
/* 1. 두 박스를 담고 있는 큰 바구니 설정 */
.booking-wrapper {
  display: flex; /* 왼쪽 박스와 오른쪽 티켓을 옆으로 나란히 배치합니다 */
  justify-content: center; /* 화면 정중앙에 모읍니다 */
  align-items: stretch; /* 왼쪽 박스 높이에 맞춰 티켓도 아래로 길게 늘립니다 */

  /* ★여기가 핵심: 두 박스 사이의 '공간'을 만듭니다 */
  gap: 30px; /* 숫자(30px)를 키울수록 사이 간격이 더 넓어집니다 */

  max-width: 1400px; /* 화면이 너무 넓어질 때 박스가 너무 커지지 않게 제한합니다 */
  margin: 50px auto 0; /* 위쪽 여백을 주고 화면 가운데로 정렬합니다 */
}

.bus-box {
  background-color: white;
  width: 90%;
  max-width: 1100px;
  border-radius: 0px 30px;
  box-shadow: 0 15px 40px rgba(0, 0, 0, 0.2);
  overflow: visible;
  position: relative;
  margin-top: 50px;
  position: relative;
  padding: 40px 40px 20px;
  flex: 5;
  display: flex;
  flex-direction: column;
}

/* 편도 왕복 버튼 */
.bus-tabs {
  display: flex;
  margin-bottom: 20px;
  gap: 10px;
  position: absolute;
  top: 0;
  left: 0%;
  transform: translateY(-100%);
}

/* [수정] 모든 탭 버튼 공통 스타일 (기본: 하얀색) */
.tab-btn {
  background-color: white; /* 기본은 하얀색 */
  color: #333;
  border: none;
  padding: 15px 60px;
  border-radius: 10px 10px 0 0;
  font-family: "KoPubWorldDotumBold";
  cursor: pointer;
}

/* [추가] 선택된 버튼 스타일 (주황색 불빛) */
.tab-btn.active {
  background-color: #ffa74e; /* 주황색 */
  color: white;
}

/* 출발지->도착지 */
.bus-content {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 50px;
  padding: 40px 20px;
  position: relative;
  flex-grow: 1;
}

.start-select {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  flex: 1;
  padding-bottom: 60px;
}

.end-select {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  flex: 1;
  padding-bottom: 60px;
}

.location {
  display: flex;
  flex-direction: column;
  align-items: center;
  color: gray;
  z-index: 2;
}

/* 버스아이콘 화살표 도시 아이콘 css */
.bg-icon-bus {
  width: 120px;
  height: auto;
  margin-top: 10px;
  position: absolute;
  bottom: -15px;
}

.arrow {
  display: flex;
  align-items: center;
  justify-content: center;
}

.arrow img {
  width: 80px;
  height: auto;
}

.bg-icon-city {
  width: 120px;
  height: auto;
  margin-top: 10px;
  position: absolute;
  bottom: -15px;
}

.place {
  font-size: 32px;
  font-family: "KoPubWorldDotBold";
  color: black;
}

/* 일정 날짜 바 */
.day-bar {
  display: flex;
  align-items: center;
  background-color: #d9d9d9;
  padding: 12px 20px;
  border-radius: 10px;
  margin: -43px 0 15px 0;
}

.day_icon {
  width: 20px;
  height: auto;
  margin-right: 12px;
}

.day-bar span {
  font-size: 18px;
  font-weight: 500;
  color: #333;
  letter-spacing: -0.5px;
}

/* 실시간 운행상황 */
.bottom-section {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  gap: 15px;
  width: 100%;
  margin-top: auto;
}

.live-status-container {
  flex: 2.2;
  background-color: rgba(51, 51, 51, 0.8);
  color: white;
  padding: 15px 20px;
  display: flex;
  align-items: center;
  gap: 10px;
  border-radius: 15px;
}

.status-title {
  font-size: 14px;
  line-height: 1.3;
  border-right: 1px solid #555;
  padding-right: 30px;
  white-space: nowrap;
  text-align: center;
}

.status-item {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  margin-bottom: 5px;
}

.status-item :last-child {
  margin-bottom: 0;
}

.dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  display: inline-block;
}

.dot.relaxed {
  background-color: #4caf50;
}

.dot.normal {
  background-color: #ffeb3b;
}
.dot.full {
  boackground-color: #f44336;
}

/* 버스조회 버튼 */
.search-btn {
  flex: 1;
  color: white;
  border: none;
  border-radius: 15px;
  font-size: 20px;
  cursor: pointer;
  background-color: #ffa74e;
  min-height: 60px;
}

/* 1. 티켓 전체 틀 */
.side-ticket {
  flex: 0 0 220px; /* 티켓의 가로 길이를 180px로 딱 고정합니다 */
  margin-top: 50px; /* 왼쪽 박스 시작 높이와 맞추기 위해 위쪽 여백을 줍니다 */
  height: 430px; /* 티켓의 전체 세로 길이를 정합니다 */
  cursor: pointer;
  position: relative; /* 마우스를 올리면 손가락 모양으로 바뀝니다 */
}

/* 2. 티켓 내부 배경 및 정렬 */
.ticket-inner {
  width: 100%; /* 가로를 꽉 채웁니다 */
  height: 100%; /* 세로를 꽉 채웁니다 */
  /* ↓ 아래 경로에 '검은색 칸이 있는 티켓 배경 이미지' 이름을 넣으세요 */
  background-image: url("../assets/icons/ticket_check_btn_01.png");
  background-size: 100% 100%; /* 이미지가 박스 크기에 맞춰서 꽉 차게 늘어납니다 */
  background-repeat: no-repeat; /* 이미지가 반복되지 않게 합니다 */

  display: flex; /* 내부 요소(아이콘, 글자)를 정렬하기 위해 씁니다 */
  flex-direction: column; /* 아이콘이 위, 글자가 아래로 오게 세로로 쌓습니다 */
  align-items: center; /* 가로 기준으로 정중앙에 모읍니다 */

  /* ★중요: 아래 padding-top 수치를 조절해서 검은색 칸 안으로 아이콘을 밀어 넣으세요 */
  padding-top: 80px; /* 위에서부터 80px만큼 아래로 밀어냅니다 (검은 칸 위치에 맞춰 조절) */
  text-align: center; /* 글자를 가운데 정렬합니다 */
}

/* 3. 티켓 안의 버스 아이콘 */
.ticket-icon {
  width: 80px; /* 아이콘 크기를 적당히 조절합니다 */
  height: auto; /* 가로세로 비율을 유지합니다 */
  margin-bottom: 15px; /* 아이콘과 아래 '승차권 조회' 글자 사이 간격입니다 */
  filter: brightness(0) invert(1); /* 아이콘이 검은색이라면 하얗게 반전시키는 마법의 코드입니다 */
}

/* 4. "승차권 조회" 글씨 스타일 */
.ticket-text {
  color: white; /* 글씨 색깔을 하얗게 만듭니다 */
  font-size: 28px; /* 글씨 크기를 키웁니다 */
  font-weight: bold; /* 글씨를 두껍게 만듭니다 */
  line-height: 1.3; /* 줄 간격을 조절합니다 (조회 글자가 아래로 내려감) */
  font-family: "KoPubWorldDotumBold"; /* 폰트를 적용합니다 */
}

/* -----------------------------------------제로데이택배 영역----------------------------------------------------------------- */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/* 2. 제로데이 택배 섹션 (원래 디자인 복구 + 여백 차단) */
.delivery-section {
  background-image: url("../assets/images/zeroday-bg-img01.png");
  background-size: cover;
  background-position: center bottom;
  background-color: #f7a05b; /* 💡 틈새 방지용 배경색 */
  width: 100%;
  height: 950px; /* 💡 하늘색 바를 방지하기 위한 충분한 높이 */
  position: relative;
  display: flex;
  align-items: center;
  margin-bottom: 0 !important;
  overflow: hidden;
}

.banner-container {
  width: 100%;
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 50px;
  position: relative; /* 버튼 배치의 기준점 */
}

/* 로고 및 메인 텍스트 스타일 복구 */
.deliverylogo {
  width: 250px;
  margin-bottom: 20px;
}
.zero-sub-text {
  font-size: 22px;
  color: #a7353a;
  margin-bottom: 10px;
  font-weight: 500;
}
.zero-main-text {
  font-size: 70px;
  font-weight: 900;
  color: #a7353a;
  display: flex;
  align-items: baseline;
  gap: 20px;
  margin-bottom: 30px;
}
.zero-btn-detail {
  font-size: 24px;
  color: #a7353a;
  text-decoration: underline;
  font-weight: 300;
}

/* 해시태그 스타일 복구 */
.hashtag-group {
  display: flex;
  gap: 12px;
  margin-bottom: 50px;
}
.hashtag-group span {
  background-color: #a7353a;
  padding: 8px 20px;
  border-radius: 50px;
  font-size: 16px;
  color: #fff;
  width: 180px;
  display: flex;
  justify-content: center;
}

/* 앱 다운로드 영역 스타일 복구 */
.app-download-area img {
  width: 400px;
  height: auto;
  border-radius: 20px;
  margin-top: 150px;
}

/* 💡 오른쪽 아래 버튼 스타일 및 위치 완벽 복구 */
.zero-btn {
  position: absolute;
  right: 50px;
  bottom: 0px; /* 위치가 너무 낮으면 이 수치를 조절하세요 */
  display: flex;
  gap: 15px;
  z-index: 10;
}

.btn-track,
.btn-apply {
  display: inline-block;
  text-decoration: none; /* 밑줄 제거 */
  padding: 15px 30px;
  font-size: 18px;
  font-weight: bold;
  border-radius: 8px;
  text-align: center;
  width: 220px; /* 버튼 가로길이 복구 */
  transition: 0.3s;
  cursor: pointer;
}

.btn-track {
  background-color: #ffc489;
  color: #a7353a;
  border: none;
}
.btn-apply {
  background-color: #a7353a;
  color: white;
  border: none;
}

/* ----------------------------------------------------------- */

/* 3. 서울고속버스터미널 영상 섹션 (완벽 중앙 정렬 유지) */
.video-section {
  position: relative;
  width: 100%;
  height: 750px; /* 웅장한 높이 확보 */
  background-color: #000;
  margin-top: -2px; /* 💡 윗 섹션과의 틈새를 강제로 덮음 */
  display: block;
}

.video-bg,
.video-bg img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.video-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.75); /* 확실히 어둡게 눌러줌 */
  display: flex;
  justify-content: center; /* 가로 중앙 */
  align-items: center; /* 세로 중앙 */
  z-index: 5;
}

.video-text-content {
  text-align: center;
  color: #fff;
}

.center-logo {
  width: 420px;
  margin: 0 auto 10px;
  display: block;
  filter: brightness(0) invert(1); /* 검은 로고를 흰색으로 */
}

.subtitle {
  font-size: 1.2rem;
  letter-spacing: 3px;
  margin-bottom: 40px;
  opacity: 0.8;
}
.divider {
  width: 60px;
  height: 1px;
  background-color: #fff;
  margin: 0 auto 30px !important;
}
.slogan {
  font-size: 1.8rem;
  font-weight: 600;
  margin-bottom: 20px;
  color: #a5c7ff;
}
.desc {
  font-size: 1.1rem;
  line-height: 1.8;
  opacity: 0.9;
  word-break: keep-all;
}

/* ----------------------------------------------------------- */

/* 3. 서울고속버스터미널 비주얼 섹션 (최종 목표 디자인 반영) */
/* 서울고속버스터미널 비주얼 섹션 (최종 정렬 및 높이 고정) */
.video-section {
  position: relative; /* 💡 postitionn 오타 수정함 */
  width: 100%;
  height: 900px !important; /* 💡 !important를 주석 밖으로 뺐습니다. 이제 무조건 변합니다. */
  overflow: hidden;
  background-color: #000;
  margin-top: -2px;
  display: block;
}

/* 배경 이미지/GIF 설정 */
.video-bg,
.video-bg img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block;
}

/* 어두운 오버레이와 완벽 중앙 정렬 */
.video-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.75);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 5;
}

.video-text-content {
  text-align: center;
  color: #fff;
}

/* -----------------------------승차권 조회 페이지------------------------------ */
/* 기본 초기화 */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: "Pretendard", sans-serif;
}

/* 배경 설정: 어두운 터미널 이미지 + 오버레이 */
.ticket-page {
  width: 100%;
  height: 100vh;
  background: url("../assets/images/terminal_night.jpg") no-repeat center center;
  background-size: cover;
}

.page-overlay {
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.75); /* 배경을 어둡게 */
  display: flex;
  justify-content: center;
  align-items: center;
}

.content-wrapper {
  width: 100%;
  max-width: 1000px;
  padding: 20px;
}

/* 헤더 스타일 */
.ticket-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 25px;
  color: #fff;
}
.h-left {
  display: flex;
  align-items: center;
  gap: 15px;
}
.h-left h2 {
  font-size: 32px;
  font-weight: 700;
}
.info-link {
  color: #fff;
  text-decoration: none;
  opacity: 0.8;
  font-size: 16px;
}

/* 💡 티켓 컨테이너 메인 스타일 */
.ticket-container {
  display: flex;
  height: 500px;
  background-color: #fba84a; /* 티켓 기본 오렌지색 */
  border-radius: 30px;
  overflow: hidden;
  box-shadow: 0 30px 60px rgba(0, 0, 0, 0.5);
}

/* [왼쪽] 영역 */
.ticket-left {
  width: 320px;
  background-color: #3c332e; /* 짙은 밤색 */
  padding: 40px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.qr-box {
  background: #fff;
  padding: 20px;
  border-radius: 15px;
  text-align: center;
}
.qr-img {
  width: 100%;
  margin-bottom: 10px;
}
.btn-zoom {
  width: 100%;
  padding: 8px;
  border: 1px solid #ddd;
  background: #fff;
  border-radius: 20px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
}
.bus-type-info {
  color: #aaa;
  font-size: 14px;
  margin-top: 25px;
  line-height: 1.6;
}
.btn-gift {
  background: none;
  border: none;
  color: #fba84a;
  font-size: 16px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}

/* [오른쪽] 영역 */
.ticket-right {
  flex: 1;
  background-color: #fff1e6; /* 연한 크림색 배경 */
  display: flex;
  flex-direction: column;
  position: relative;
}

/* 상단 노선 박스 */
.route-section {
  flex: 1.2;
  padding: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.route-box {
  width: 100%;
  height: 100%;
  background: #fff;
  border-radius: 15px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 50px;
  color: #333;
  font-size: 38px;
  font-weight: 800;
  /* 💡 배경에 흐릿한 도시 이미지를 넣으려면 여기에 이미지를 깔아주세요 */
}
.arrow {
  color: #333;
  font-weight: 300;
}

/* 💡 하단 상세 정보 (짙은 레드 박스) */
.detail-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 15px;
  padding: 0 30px 30px 30px;
}
.info-box {
  background-color: #a1202e; /* 짙은 레드/브라운 */
  border-radius: 12px;
  padding: 20px 10px;
  text-align: center;
  color: #fff;
}
.label {
  display: block;
  font-size: 13px;
  opacity: 0.8;
  margin-bottom: 10px;
}
.value {
  font-size: 24px;
  line-height: 1.2;
  font-weight: 600;
}

/* 오른쪽 끝 바코드 장식 */
.ticket-decoration {
  position: absolute;
  right: 0;
  top: 0;
  width: 35px;
  height: 100%;
  background: repeating-linear-gradient(
    to bottom,
    #fba84a,
    #fba84a 15px,
    #fff 15px,
    #fff 30px
  );
}

/* 하단 버튼 */
.action-buttons {
  display: flex;
  justify-content: flex-end;
  gap: 20px;
  margin-top: 30px;
}
.action-buttons button {
  padding: 15px 50px;
  border: none;
  border-radius: 5px;
  font-size: 18px;
  font-weight: 600;
  cursor: pointer;
}
.btn-edit {
  background: #ccc;
  color: #333;
}
.btn-cancel {
  background: #a1202e;
  color: #fff;
}

/* /////////////////////////////////////////////버-락 영역/////////////////////////////////////////// */
/* 1. 섹션 배경 및 높이 */
.bus-rak-section {
  position: relative;
  width: 100%;
  height: 1000px;
  background: #5b759e url("../assets/images/bus-rak-bg.png") no-repeat center
    center;
  background-size: cover;
  display: flex;
  overflow: hidden;
}

.rak-container {
  width: 100%;
  display: flex;
  justify-content: space-between;
}

/* 2. 태그 영역 가로 정렬 */
.tag-area {
  display: flex;
  gap: 15px; /* 💡 카드 사이 촘촘한 간격 */
  padding-left: 50px;
  align-items: flex-start;
}

.tag-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 320px;
}

/* 얇은 흰색 선 */
.hanging-line {
  width: 1px;
  background-color: rgba(255, 255, 255, 0.8);
}

/* 💡 지그재그 높이 조정 (숫자가 작을수록 태그가 위로 올라가요!) */
.t1 .hanging-line {
  height: 80px;
} /* 쇼핑 */
.t2 .hanging-line {
  height: 220px;
} /* 💡 먹거리: 이전보다 확 올렸습니다! */
.t3 .hanging-line {
  height: 110px;
} /* 볼거리 */
.t4 .hanging-line {
  height: 280px;
} /* 교통정보 */

.tag-item img {
  width: 100%;
  height: auto;
  display: block;
  filter: drop-shadow(0 15px 25px rgba(0, 0, 0, 0.3));
}

/* 3. 오른쪽 반투명 검정 박스 (완전 밀착) */
.info-overlay-box {
  width: 500px;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.65); /* 반투명 검정 65% */
  backdrop-filter: blur(10px); /* 배경 흐림 효과 */
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 10;
}

.info-inner {
  text-align: center;
  color: #fff;
}

.info-icon {
  width: 60px;
  margin-bottom: 25px;
  filter: brightness(0) invert(1);
}
.info-title {
  font-size: 80px;
  line-height: 1.1;
  font-weight: 900;
  margin-bottom: 20px;
}
.info-title span {
  font-size: 50px;
  font-weight: 300;
}
.info-sub {
  font-size: 26px;
  font-weight: 500;
  margin-bottom: 15px;
}
.info-desc {
  font-size: 18px;
  line-height: 1.6;
  opacity: 0.8;
}

/* ///////////////////////////////////////////////////////영상영역/////////////////////////////////////////// */
/* 비주얼 섹션 기본 설정 */
.video-section {
  position: relative;
  width: 100%;
  height: 600px; /* 시원한 높이 확보 */
  overflow: hidden;
  background-color: #000;
}

/* 배경 이미지/GIF */
.video-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}

.video-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0.6; /* 배경을 약간 어둡게 */
}

/* 💡 화면 정중앙 배치의 핵심 코드 */
.video-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.6); /* 글자가 잘 보이게 더 어둡게 */
  z-index: 2;
  display: flex;
  justify-content: center; /* 가로 중앙 */
  align-items: center; /* 세로 중앙 */
}

.video-text-content {
  text-align: center;
  color: #fff;
}

/* 로고 스타일 (흰색 반전 포함) */
.center-logo {
  width: 350px;
  height: auto;
  margin: 0 auto 10px;
  display: block;
  filter: brightness(0) invert(1);
}

.subtitle {
  font-size: 1.1rem;
  letter-spacing: 2px;
  margin-bottom: 30px;
  font-weight: 300;
  opacity: 0.8;
}

/* 흰색 구분선 중앙 정렬 */
.divider {
  width: 60px;
  height: 2px;
  background-color: #fff;
  margin: 0 auto 30px;
  border: none;
}

.slogan {
  font-size: 1.6rem;
  font-weight: 600;
  margin-bottom: 15px;
  color: #7398c7;
}

.desc {
  font-size: 1rem;
  line-height: 1.6;
  opacity: 0.9;
}

/*-------------------------------------------------------------------------- 푸터영역-------------------------------------------- */
/* 푸터 전체 배경 및 상단 여백 제거 */
.footer-final {
  width: 100%;
  background-color: #2b2623; /* 시안의 짙은 밤색 배경 */
  padding: 80px 0;
  color: #ffffff;
  clear: both; /* 위 섹션의 영향 차단 */
  position: relative;
  z-index: 10;
}

/* 💡 양 끝으로 쫙 벌리는 핵심 설정 */
.footer-inner {
  width: 100%;
  max-width: 1600px; /* 너비를 크게 잡아 양 끝으로 밀어냄 */
  margin: 0 auto;
  display: flex;
  justify-content: space-between; /* 왼쪽-중간-오른쪽 양 끝 정렬 */
  padding: 0 60px;
}

/* --- 왼쪽 영역 --- */
.f-left {
  flex: 1.5;
  text-align: left;
}
.f-title {
  font-size: 24px;
  font-weight: 700;
  margin-bottom: 5px;
}
.f-eng {
  font-size: 12px;
  color: #888;
  margin-bottom: 25px;
}
.f-call {
  font-size: 22px;
  margin-bottom: 15px;
}
.f-left .orange {
  color: #f28a31;
  margin-left: 10px;
} /* 대표번호 주황색 */
.f-info,
.f-copy {
  font-size: 11px;
  color: #666;
  line-height: 1.8;
}

/* --- 중간 & 오른쪽 메뉴 --- */
.f-mid,
.f-right {
  flex: 0.7;
  text-align: left;
  padding-left: 100px; /* 열 사이 간격 확보 */
}

.f-mid h3,
.f-right h3 {
  font-size: 16px;
  color: #ffffff;
  margin-bottom: 25px;
  font-weight: 600;
}

.f-mid ul,
.f-right ul {
  list-style: none;
}
.f-mid li,
.f-right li {
  font-size: 14px;
  color: #999;
  margin-bottom: 12px;
}

/* 💡 오른쪽 언어 선택 주황색 포인트 */
.f-right .orange {
  color: #f28a31 !important;
  font-weight: 600;
}