/*****************************************
*******   문의처 공통내용   ***********
*****************************************/
/* 스코프: #kictex-contact 내부 전용 */
#kictex-contact * { box-sizing: border-box; }
#kictex-contact {padding: 20px;}

/* 카드 리스트 */
#kictex-contact .kictex-contact__cards {
  list-style: none;
  padding: 0;
  margin: 0;
  max-width: 1100px;
  width: 100%;
}

/* 카드: 모바일 1열 */
#kictex-contact .kictex-contact__card {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
  align-items: center;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  padding: 18px 20px;
  margin: 0 0 12px;
}
#kictex-contact .kictex-contact__card:focus-within {
  outline: 2px solid #1a73e8;
  outline-offset: 2px;
}

/* 아이콘: 모바일 숨김 */
#kictex-contact .kictex-contact__icon { display: none; }
#kictex-contact .kictex-contact__icon-i { font-size: 18px; color: #fff; }

/* 내용 */
#kictex-contact .kictex-contact__content { display: grid; gap: 4px; }

/* 라인(라벨 | 값) — 기본(데스크톱) 가로 배치 */
#kictex-contact .kictex-contact__row {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
#kictex-contact .kictex-contact__label { font-weight: 700; color: #1f2937; }
#kictex-contact .kictex-contact__value {
  position: relative;
  padding-left: 12px;
  border-left: 1px solid #d7dde7; /* 시각적 구분자 | */
  color: #111;
  word-break: keep-all;            /* 한글 단어 잘림 방지 */
}

/* 전화 링크: 한 번호가 '하나의 덩어리'로 줄바꿈되지 않도록 */
#kictex-contact .kictex-contact__tel {
  display: inline-block;
  white-space: nowrap;             /* ★ 번호 중간에서 줄바꿈 금지 */
  color: #0b3a75;
  text-decoration: none;
  border-radius: 6px;
  padding: 2px 4px;
}
#kictex-contact .kictex-contact__tel:hover { text-decoration: underline; }
#kictex-contact .kictex-contact__tel:focus {
  outline: 2px solid #1a73e8;
  outline-offset: 2px;
  background: #e8f0fe;
}

/* 데스크톱(≥768px): 아이콘 표시 + 2열 레이아웃 */
@media (min-width: 768px) {
	#kictex-contact .kictex-contact__card { grid-template-columns: auto 1fr; }
	#kictex-contact .kictex-contact__icon {
		display: flex;
		width: 40px; height: 40px;
		border-radius: 50%;
		background: #2f3a8a;
		align-items: center; justify-content: center;
		flex: 0 0 40px;
	}
	#kictex-contact .kictex-contact__tel::after{content: ',';}
	#kictex-contact .kictex-contact__tel:last-child::after{display: none;}
}

/* 모바일(≤767px): 라벨과 값을 '세로 스택'으로 + 구분선 제거 */
@media (max-width: 767px) {
  #kictex-contact .kictex-contact__row {
    flex-direction: column;        /* 라벨 위, 값 아래 */
    align-items: flex-start;
    gap: 4px;
  }
  #kictex-contact .kictex-contact__value {
    border-left: none;             /* 왼쪽 구분선 제거 */
    padding-left: 0;
  }
  #kictex-contact .kictex-contact__tel::after{display: none;}
}

/* 모션 최소화 */
@media (prefers-reduced-motion: reduce) {
  #kictex-contact .kictex-contact__card,
  #kictex-contact .kictex-contact__tel { transition: none; }
}

/* 인쇄 시 tel 링크 표기 (옵션) */
@media print {
  #kictex-contact .kictex-contact__tel::after {
    content: " (" attr(href) ")";
    font-size: 0.9em;
    color: #000;
  }
}





/*****************************************
*******   연구원소개  >  원장 인사말   ***********
*****************************************/
.wonjang {max-width: 360px; margin: 0 auto 20px auto;}
.wonjang img{width:100%; min-width:360px;}
.wonjang p{text-align:right; font-size: 18px;}
.wonjang p strong{font-size: 28px;}

.greeting{padding:1em; }
.greeting_number {margin-top: 20px;}
.greeting p:nth-child(1) {font-size: 1.4em; font-weight: 500; line-height: 1.4; margin-bottom: 20px;}
.greeting p span:nth-child(1){font-weight:600;}
.greeting p span{display:block; word-break: keep-all;}

@media (min-width:768px){
	.greeting_container{display:flex;}
	.greeting{padding:0 20px 0 30px; font-size:17px;}
	.greeting p:nth-child(1){font-size:1.8em; font-weight:700; line-height:1.4; }
	.wonjang {margin-bottom: 0px;}
}

@media (min-width:1440px){
	.greeting{padding:0 0 0 40px; font-size:18px;}
	.greeting p:nth-child(1){font-size:2em; margin-bottom:50px}
}

.sub_img{max-width: 100%;}
.sub_img img {width: 100%;}




/*****************************************
*******   연구원소개  >  미션 비전   ***********
*****************************************/
.Intro_vision section{margin-bottom:40px ; }
@media (min-width: 768px){
.Intro_vision section{margin-bottom:80px ; }
.goal-list{grid-template-columns: repeat(2, minmax(0,1fr)); }
}

@media (max-width: 959px){
.mission p span{display:block ;}

:root{
  /* Brand */
  --brand-blue:  #0B4596;
  --brand-green: #1C7D3B;
  --brand-amber: #F1B93C;

  /* UI */
  --bg: #ffffff;
  --bg-soft: #f6f9ff; /* 살짝 푸른 화이트 */
  --glass: rgba(255,255,255,.65);
  --text: #0f172a;
  --text-muted: #5b6472;
  --border: #e6e7eb;
  --shadow: 0 10px 28px rgba(17,24,39,.08), 0 4px 12px rgba(17,24,39,.06);

  /* Layout / Type Rhythm */
  --radius-xs: 8px;
  --radius: 14px;
  --radius-lg: 22px;
  --space-1: .25rem;
  --space-2: .5rem;
  --space-3: .75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --maxw: 1100px;

  /* Gradients */
  --g-brand: linear-gradient(135deg, var(--brand-blue), var(--brand-green));
  --g-soft: linear-gradient(180deg, #f9fbff, #f4f7ff);
}


/* ========== Section base ========== */
.Intro_vision{padding:0 16px ; }
.Intro_vision section>h2{
  display:inline-flex; align-items:center; gap:.6ch;
  margin:0 0 var(--space-3);
  font-weight: 800;
  letter-spacing: -.01em;
  color:#0b1220;
  font-size: clamp(20px, 1.1vw + 14px, 28px);
  position: relative;
}
.Intro_vision section>h2::before{
  content:"";
  width:12px; height:12px; border-radius:4px;
  background: var(--g-brand);
  box-shadow: 0 0 0 6px color-mix(in srgb, var(--brand-blue) 6%, transparent);
}
.Intro_vision section>p{
  margin:0 0 var(--space-5);
  color:var(--text-muted);
  line-height:1.8;
}


.cv-card_container{}
.cv-card{

  background: var(--glass);
  backdrop-filter: saturate(160%) blur(6px);
  border: 1px solid color-mix(in srgb, var(--border) 70%, white);
  border-radius: var(--radius);
  padding: clamp(14px, 1.2vw, 18px);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
  margin-bottom:0.4em;
}

.cv-card h3{
  margin:0 0 var(--space-2);
  font-size: clamp(17px, 1vw + 12px, 20px);
  font-weight:700;
  color: var(--g-brand);
}
.cv-card p{ margin:0; color:var(--text); line-height:1.7; }

/* ======= Goals (중장기 경영목표) ======= */
.goal-list{
  /* 리스트 초기화 + 그리드 카드화 */
  margin:0; padding:0; list-style:none;
  display:grid; gap: var(--space-4);
}

.goal-list > li{
  position: relative;
  display: grid;
  grid-template-rows: auto auto;
  row-gap: .5rem;
  padding: clamp(16px, 1.4vw, 22px);
  border-radius: var(--radius-lg);
  /* Glass + soft gradient */
  background:
    linear-gradient(180deg, rgba(255,255,255,.75), rgba(255,255,255,.6)),
    var(--g-soft);
  backdrop-filter: blur(6px) saturate(140%);
  border: 1px solid color-mix(in srgb, var(--border) 70%, white);
  box-shadow: var(--shadow);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}


/* 첫 번째 <span>: 제목(정성 목표) */
.goal-list > li > span:first-child{
  font-weight: 700;
  letter-spacing: -.01em;
  color: #0b1220;
  font-size: clamp(16px, 1vw + 12px, 18px);
  line-height: 1.6;
  padding-left: 1.25rem;
  position: relative;
}
.goal-list > li > span:first-child::before{
  content:"";
  position:absolute; left:0; top:.65em;
  width:8px; height:8px; border-radius:50%;
  background: radial-gradient(circle at 30% 30%, var(--brand-amber), var(--brand-green));
  box-shadow: 0 0 0 4px rgba(28,125,59,.08);
}

/* 두 번째 <span>: 수치(정량 KPI) - 배지/칩 스타일 */
.goal-list > li > span:last-child{
  align-self: start;
  justify-self: start;
  display: inline-flex;
  align-items: center;
  gap: .5ch;
  padding: .4rem .7rem;
  border-radius: 999px;
  font-weight: 600;
  font-size: .98rem;
  color: #0b1220;
  background:
    linear-gradient(180deg, rgba(255,255,255,.85), rgba(255,255,255,.65)),
    linear-gradient(135deg, rgba(11,69,150,.10), rgba(28,125,59,.10));
  border: 1px solid color-mix(in srgb, var(--brand-blue) 25%, var(--border));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.6);
}

/* 칩 앞에 아이콘 점 */
.goal-list > li > span:last-child::before{
  content:"";
  width:8px; height:8px; border-radius:50%;
  background: var(--brand-blue);
  display:inline-block;
}

/* ========== Optional: KPI legend (정의목록) ========== */
.kpi-legend{
  margin: var(--space-6) 0 0;
  display:grid; grid-template-columns: 120px 1fr; gap: .4rem 1rem;
  color: var(--text-muted);
  font-size: .95rem;
}
.kpi-legend dt{ font-weight:700; color:#0b1220; }
.kpi-legend dd{ margin:0; }

.bullet-list li{position:relative; padding-left:1em;}
.bullet-list li:before{ 
	content: "";
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--brand-blue);
    display: inline-block;
	margin-right:0.4em;}


.bullet-list-12 li{position:relative; padding-left:1em;}
.bullet-list-12 li span{display:block;}
.bullet-list-12 li span:before{ 
	content: "";
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--brand-blue);
    display: inline-block;
	margin-right:0.4em;}

}/*     //    max-width   959 */

.core-values article p {word-break: keep-all;}

@media (min-width: 960px) and (max-width: 1200px){
	.mission, .projects12{margin:0 20px 0 20px;}
}

@media (min-width: 960px) and (max-width: 1499px){
	.core-values > div {height: 400px;}
	.core-values article:nth-child(even) {padding: 0px 8% 0 20%; text-align: left;}
	.core-values article:nth-child(odd) {padding:0 20% 0 8%;}
	.core-values article {height: 230px;}
	.directions {margin:0 50px 0 50px;}
	.goals h2, .directions h2, .projects12 h2 {margin-bottom: 20px !important;}
}

@media (min-width: 1500px){
	.core-values > div {height: 500px;}
	.core-values article {height: 300px;}
	.core-values article:nth-child(even) {padding:0 8% 0 24%;}
	.core-values article:nth-child(odd) {padding:0 24% 0 8%;}
	.directions {margin:0 20px 140px 20px;}
	.goals h2, .directions h2, .projects12 h2 {margin-bottom:40px !important;}
}



@media (min-width: 960px){
	.mission{
		padding:120px 0;
		margin-bottom:60px; 
		text-align:center;
		color:#fff;
		font-weight:600;
		border-radius:6px; 
		background-image: url('../img/mission_bg.jpg');
		 background-size: cover; /* 배경 이미지를 컨테이너 크기에 맞게 확장 */
  background-position: center center; /* 이미지가 중앙에 위치하도록 설정 */
  background-repeat: no-repeat;
	}
	.mission h2{font-size:1.6em;}
	.mission p{font-size:1.8em; }

	.vision{text-align:center; margin-bottom:80px; }
	.vision h2{color:#2e4e8b;}
	.vision p{font-size:30px;  font-weight:700;}

	.core-values h2,
	.goals h2,
	.directions h2,
	.projects12 h2{
		width:200px;
		margin:0 auto;
		padding:0.8em 0;
		text-align:center; 
		font-size:1.2em;
		background-color:#2d4f8c;
		border-radius:50px;
		color:#fff;
	}


	/*   핵심가치 */
	.core-values{margin-bottom:80px; }
	.core-values > div {
		width: 100%;
		margin: 0 auto;
		padding-top:50px; 
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		background-image: url('../img/core-values_bg.svg');
		background-position: center center;
		background-repeat: no-repeat;
		background-size: auto;
	}

	.core-values article {
	  width: 50%;               /* 카드 폭 */
	  margin-bottom: 20px;      /* 줄바꿈 시 세로 간격 */
	  box-sizing: border-box;
	}

	/* 홀/짝 텍스트 정렬 */
	.core-values article:nth-child(odd) {
		text-align: right;
		
	}
	.core-values article:nth-child(even) {text-align: left;}


	/* 중장기 경영 목표 */
	.goals{margin-bottom:100px; }
	.goal-list { display:flex;flex-wrap: wrap; justify-content: space-between;}
	.goal-list li{ width:49%; margin-bottom:20px; padding:2em; background-color:#eff2fa; border-radius: var(--radius);}
	.goal-list li span{display:block}
	.goal-list li span:nth-child(1){font-size:1.4em; font-weight:600; margin-bottom:2px;}
	.goal-list li span:nth-child(2){font-size:1.2em; color:#666; }



	/*   중점추진방향 */
	.directions{margin-bottom:100px; }
	.directions .bullet-list{
		display:flex;
		flex-wrap: wrap;
		justify-content: space-between; 
		 }

	.directions .bullet-list li{
		width:22%;
		padding:1.4em;
		text-align:center; 
		font-size:1.2em; 
		border-radius: var(--radius);
		}
	.directions .bullet-list li{background-color:var(--blue); border:1px solid var(--blue1)}
	.directions .bullet-list li span{display:block;}


	/*   12대 핵심 사업  */
	.bullet-list-12{ display: grid;  grid-template-columns: repeat(2, 1fr);   gap: 16px;  }
	

	/* li 기본 박스 */
	.bullet-list-12 li {
	  position: relative;
	  padding: 2em 1em 2em 140px;  /* ← 왼쪽에 before가 들어갈 자리 확보(100px + 여백) */
	  background-color: #f7f9ff;
	  border: 1px solid #ddd;
	  border-radius: var(--radius);
	}

	/* 왼쪽 박스 */
	.bullet-list-12 li::before {
	  content: ''; /* 텍스트 대신 배경이미지 사용 */
	  position: absolute;
	  left: 24px;                 
	  top: 50%;
	  transform: translateY(-50%);
	  width: 80px;
	  height: 80px;
	  background-size: contain;   /* 비율 유지하며 꽉 채우기 */
	  background-repeat: no-repeat;
	  background-position: center;
	  display: block;
	  /* border:1px solid red; */
	}
	.bullet-list-12 li:nth-child(1)::before { background-image: url('../img/intro_vision_icon_01.svg');}
	.bullet-list-12 li:nth-child(2)::before { background-image: url('../img/intro_vision_icon_02.svg');}
	.bullet-list-12 li:nth-child(3)::before { background-image: url('../img/intro_vision_icon_03.svg');}
	.bullet-list-12 li:nth-child(4)::before { background-image: url('../img/intro_vision_icon_04.svg');}

	/* 오른쪽 텍스트(한 줄씩) */
	.bullet-list-12 li span {display: block; font-size: 18px;}

}/*   min-width :960 */












/* 섹션 */
.kictex-strategy12 {
  max-width: 1200px;
  margin: 0 auto;
  padding: 40px 20px;
  box-sizing: border-box;
  text-align: center;
}

/* 상단 제목(알약형 배지) */
.kictex-strategy12__title {
  display: inline-block;
  margin: 0 0 28px;
  padding: 10px 24px;
  background: #2f5da7;        /* 진한 파랑 */
  color: #fff;
  font-weight: 700;
  font-size: 1.125rem;
  line-height: 1.2;
  border-radius: 9999px;
}

/* 4컬럼 그리드 */
.kictex-strategy12__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  list-style: none;
  margin: 0;
  padding: 0;
  text-align: left;            /* 카드 안 텍스트는 좌측 정렬 */
}

/* 카드(라운드 박스) */
.kictex-strategy12__card {
  background: #fff;
  border: 4px solid #cfe1f5;   /* 연파랑 보더 */
  border-radius: 16px;
  padding: 22px 24px;
  box-sizing: border-box;
  box-shadow: 0 2px 6px rgba(0,0,0,0.04);
}

/* 내부 목록 */
.kictex-strategy12__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.kictex-strategy12__list li {
  position: relative;
  padding-left: 14px;
  line-height: 1.6;
  color: #111;
  font-size: 1rem;
}

.kictex-strategy12__list li + li { margin-top: 8px; }

/* 파란 점 불릿 */
.kictex-strategy12__list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: .65em;                  /* 텍스트 높이에 맞춰 점 정렬 */
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #78b6f0;
}

/* 첫 번째 카드: 점 없이(이미지처럼) */
.kictex-strategy12__list--plain li { padding-left: 0; }
.kictex-strategy12__list--plain li::before { display: none; }

/* 반응형 */
@media (max-width: 1024px) {
  .kictex-strategy12__grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 640px) {
  .kictex-strategy12__grid { grid-template-columns: 1fr; }
  .kictex-strategy12__title { font-size: 1.0625rem; padding: 8px 18px; }
}



/**********************************
************  연구원소개 > 연혁  ******
***********************************/
/* ===== Tabs ===== */
.hx-tab{ position:relative; margin: 20px 0 8px 0; }
.hx-tab ul{ display:flex; gap:48px; padding:0 0 14px 0; margin:0; list-style:none; }
.hx-tab::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:1px; background:#e6eef9; }
.hx-tab button{background:none; border:0; padding: 6px 70px; cursor:pointer; font-weight:700; line-height:1.2; font-size: 22px; color: #2E4E8B; position:relative;}
.hx-tab button[aria-selected="true"]{color:#2E4E8B;}
.hx-tab button[aria-selected="true"]::before{ content:""; position:absolute; left:0; right:0; bottom:-14px; height:6px; background:#2156c5; z-index:10; }
.hx-tab button:focus-visible{ outline:2px solid #2156c5; outline-offset:3px; }

/* ===== Hero ===== */
.hx-hero {
  text-align: center;
  background: url("../images/history_bg.jpg") 
              no-repeat center center;
  background-size: cover;
  color: #fff;
  font-size: 1.5rem;
  font-weight: bold;
  padding: 120px 20px;
  border-radius: 8px;
}

.hx-hero-title {
  font-size: clamp(1.2rem, 2vw, 2rem); /* 반응형 글씨 크기 */
  font-weight: bold;
  color: #fff;
  z-index: 1;
}


.hx-bg-src{ position:absolute; width:1px; height:1px; clip:rect(0 0 0 0); overflow:hidden; }

/* ===== Timeline ===== */
.hx-wrap{margin-top: 60px; padding: 0 20px;}
.hx-timeline{--line-x: 210px; position:relative; width: 60%; margin: 0 auto;}
.hx-timeline::before{content:""; position:absolute; left:var(--line-x); top:0; bottom:0; width: 1px; background:#dfe3ea;}

/* 연도 블록: 연도는 왼쪽 큰 글씨, 이벤트는 오른쪽 세로 배치 */
.hx-year{display:grid; grid-template-columns: 160px 1fr; gap: 40px; position:relative; margin-bottom: 60px;}
.hx-year-label{grid-column:1 / 2; align-self:flex-start; font-weight:500; font-size: 70px; line-height:.9; color:#e9ecf0; letter-spacing:-0.02em;}

/* 연도 점 = 파란 테두리 원 (의사요소) */
.hx-year::before{
  content:"";
  position:absolute;
  left:calc(var(--line-x) - 7px);  /* 점지름 10px의 반 */
  top:6px;
  width: 14px; height:14px; border-radius:50%;
  background:#fff; border:3px solid #1f7be8;
  box-sizing:border-box; z-index:2;
}

/* 이벤트 래퍼 */
.hx-events{grid-column:2 / 2; display:flex; flex-direction:column; gap: 12px; margin-top: 30px;}

/* 이벤트 행: 월/내용 */
.hx-row{
  position:relative;
  display:grid;
  grid-template-columns:48px 1fr; /* 48: 점 영역(시각적 기준만) */
}

/* 월별 점 = 회색 실점 (의사요소) */
.hx-month::before{content:""; position:absolute; left: -42px; top: 40%; width:8px; height:8px; border-radius:50%; background:#b8bdc6;}

/* 텍스트 */
.hx-event{display:grid; grid-template-columns: 44px 1fr; grid-column:2 / 2; column-gap:16px; row-gap:6px; align-items:start; }
.hx-month{position: relative; grid-column:1; grid-row:1 / -1; font-weight: 700; font-size:28px; color:#1e2a39; min-width:34px;}
.hx-desc{grid-column:2; display:block; line-height:2.75; color:#1f2430; font-size: 18px;}

@media (min-width: 960px) and (max-width: 1200px) {
    .hx-hero {
        margin: 0 20px 0 20px;
    }
}

/* ===== Responsive ===== */
@media (max-width:960px){
	.hx-hero {border-radius: 0; padding: 100px 20px;}
	.hx-hero-title{ font-size:24px; }
	.hx-year{ grid-template-columns:120px 1fr; }
	.hx-year-label{ font-size:64px; }
	.hx-month{ min-width:38px; font-size:20px; }
	.hx-desc{ font-size:16px; }
	.hx-tab ul{gap:24px;}
	.hx-timeline{ --line-x: 170px; width: 100%;}
	.hx-tab button {padding: 6px 32px;}
}

@media (max-width:640px){
	.hx-tab ul{gap: 30px 8px; flex-wrap: wrap;}
	.hx-tab button{padding: 6px 10px; width: 100%; font-size: 16px; white-space: nowrap;}

	.hx-month::before {left: -34px;}
	.hx-year::before{left: calc(var(--line-x) - 57px);}
	.hx-hero-title{ font-size:20px; }
	.hx-year{display:block; margin-bottom: 40px;}
	.hx-year-label{display:block; font-size:48px; line-height:1; margin-bottom:12px;}
	.hx-row{display:block; padding-left:0; margin-bottom:14px;}
	.hx-event{display: block;}
	.hx-events{margin-top:0; gap: 8px;}
	.hx-month{display:block; font-size:18px; font-weight: 700; margin-bottom:4px; min-width:0;}
	.hx-desc{display:block; line-height:1.6; margin-left:0;}
	.hx-timeline{--line-x: 20px; padding-left: 50px;}
	.hx-tab ul li {text-align: center; width: 30%;}
}

@media (max-width:420px){
	.hx-year-label{ font-size:42px; }
	.hx-month{min-width:30px;}
}

/* High contrast */
@media (prefers-contrast: more){
	.hx-tab button[aria-selected="true"]{ color:#0a43b3; }
	.hx-year::before{ border-color:#0a43b3; }
}

		
/**********************************
************  연구원소개 > 조직도 상단 조직구성도  세희에스앤디  ******
***********************************/

.orglist_contanter{
  max-width: 1100px;        /* 섹션 폭 제한 */
  margin: 0 auto 40px auto;           /* 가운데 배치 */
  padding: 0 !important;    /* 좌우 패딩 제거 */
  position: relative;
  --row-gap: 200px;         /* 이사장↕원장 간 간격 */
  box-sizing: border-box;   /* 보더 포함 폭 계산 */
}

/* 섹션 내부의 중앙 세로 1px 라인 */
.orglist_contanter::before{
  content: "";
  position: absolute;
  top: 40px;
  bottom: 40px;
  left: 50%;                 /* 컨테이너 가로의 정중앙 */
  transform: translateX(-0.5px); /* 1px 폭을 정확히 중앙에 얹기 */
  width: 1px;               
  background:#666;           
  pointer-events: none;
  padding: 0;                /* ✅ 50% 패딩 제거! */
}
@media (min-width:640px){
  .orglist_contanter::before { display: block !important; }
}


/* 리스트 초기화 */
.orglist_contanter .orglist{
  margin: 0;
  padding: 0;
  list-style: none;
  position: relative;
}

/* 카드 기본 (오타 mrgin -> margin fix) */
.orgcard{
  width: 320px;
  margin: 0 auto;   /* 모바일 기본 중앙 */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 8px 4px;
  font-weight: 700;
  box-sizing: border-box;
}


/* 등급 색상 */
.card--chair{ color:#fff; background:#1F2444; }
.card--board{ color:#fff; background:#264283; }
.card--director{ color:#111; background:#fff; border:1px solid #333; }
.card--hq1, .card--hq2{ color:#fff; background:#1455a5; }
.card--dept{ color:#fff; background:#00788F; }
.card--team{ width:260px; color:#336CB3; background:#fff; border:1px dashed #333; font-weight:600; }

/* 팀 스택 */
.teamcol{
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: stretch;
}

/* 모바일: 세로 스택 */
.orglist{
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.orglist > li{ margin: 0 auto; }
.org-bottom{ margin-bottom: 12px; }




@media (min-width:1024px){
.orglist_contanter::before{width: 0;}
.orglist_contanter{	padding:20px;}
.orgcard{width: 260px;}

/*  배경이미지 라인 */
/* orglist 배경 이미지 */
.orglist{
  /* 기존 flex/grid 등 레이아웃 속성은 그대로 두고 아래만 추가 */
  background-image: url("../images/org-bg-line.gif");
  background-repeat: no-repeat;      /* 반복 없음 */
  background-position: 120px 50px;  /* 좌 200px, 상 100px */
  background-origin: padding-box;    /* 패딩 기준 위치(기본값이지만 명시) */
  background-clip: padding-box;      /* 패딩 영역에만 칠하기(선택) */
}



  /* 상단 3개를 정확히 위치시키기 위해 절대배치 */
  .orglist_contanter .item--chair{
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);   /* 가로 중앙 */
    z-index: 1;
  }
  .orglist_contanter .item--director{
    position: absolute;
    top: var(--row-gap);
    left: 50%;
    transform: translateX(-50%);   /* 가로 중앙 */
    z-index: 1;
  }
  .orglist_contanter .item--board{
    position: absolute;
    top: calc(var(--row-gap) / 2);                /* 이사장~원장 중간 높이 */
    left: 50%;
    transform: translateX(calc(-50% - 300px));    /* 중앙 기준 300px 좌측 */
    z-index: 1;
  }

  /* 하단 영역은 그리드로: hq1을 1열부터 시작하도록 areas 수정 */
  .orglist_contanter .orglist{
    display: grid !important;
    grid-template-columns: repeat(12, 1fr) !important;
    grid-auto-rows: auto !important;
    align-items: start !important;
    gap: 18px 18px !important;

    /* 상단 3카드 높이만큼 공간 확보(그렇지 않으면 빨간 테두리 밖으로 튀어 보일 수 있음) */
    padding-top: calc(var(--row-gap) + 120px);

    /* ✅ 첫 칸부터 hq1 시작(왼쪽 라인과 맞춤) */
    grid-template-areas:
      "hq1 hq1 . hq2 hq2 . dept1 dept1 . dept2 dept2 ."
      "hq1teams hq1teams . hq2teams hq2teams . . . . . . ."
      !important;
    width: 100%;                 /* 컨테이너 안에서 100%로 제한 */
    box-sizing: border-box;
  }

  /* 각 아이템 배치 */
  .orglist_contanter .item--hq1     { grid-area: hq1 !important;     position:relative; }
  .orglist_contanter .item--hq2     { grid-area: hq2 !important;     position:relative; }
  .orglist_contanter .item--dept1   { grid-area: dept1 !important;   position:relative; }
  .orglist_contanter .item--dept2   { grid-area: dept2 !important;   position:relative; }
  .orglist_contanter .teamlist--hq1 { grid-area: hq1teams !important; position:relative; }
  .orglist_contanter .teamlist--hq2 { grid-area: hq2teams !important; position:relative; }

  /* 데스크탑에선 중앙정렬 제거 → 빨간 박스 왼쪽 라인에 정확히 맞음 */
  .orglist > li{
    margin: 0 !important;       /* auto 제거 */
    justify-self: start;        /* 그리드 셀 내부에서도 좌측 정렬 */
  }
  .orglist_contanter .orgcard{
    padding: 1em 0;
    margin: 0 !important;       /* 카드도 좌측 정렬 */
    max-width: 100%;
  }
  

}






/******************************************************************

연구원소개  > 조직도  > 조직도 하단 직원 업무 테이블 

**********************************************************************/




/* 스크롤 컨테이너(접근성용 설명 + 포커스 가능) */
.table-scroll{
  max-width:1100px;
  margin:0 auto;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  border-radius:12px 12px 0 0;
  background:#fff;
  box-shadow:0 1px 2px rgba(0,0,0,.04);
}
.table-scroll:focus{ outline:3px solid #2563eb; outline-offset:2px; }

/* 표 기본 */
.a11y-table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  font-size:clamp(14px, 1.2vw, 16px);
  line-height:1.6;
  color:#111827;
  min-width:800px; /* 작은 화면에서도 헤더/열 의미 유지 */
  table-layout:fixed;
  word-break:keep-all;
  
}
.a11y-table th, .a11y-table td{
  padding:.9rem 1rem;
  border-bottom:1px solid #ccc;
  border-left:1px solid #ccc;
  vertical-align:top;
  background:#fff;
}
.a11y-table td:last-child{border-right:1px solid #ccc; }
.a11y-table tr{border-bottom:1px solid red; }

/* 헤더(고정) */
.a11y-table thead th{
  position:sticky; top:0; z-index:3;
  background:#1F2444; color:#fff;
  text-align:left; font-weight:600;
}
.a11y-table thead th:first-child{ left:0; z-index:4; }

/* 첫 열(부서명) 고정 */
.a11y-table tbody th[scope="row"],
.a11y-table tbody th[scope="rowgroup"]{
  position:sticky; left:0; z-index:2;
  background:#f8fafc; font-weight:600;
  border-right:1px solid #eef2f7;
}

/* 줄무늬 가독성 */
.a11y-table tbody tr:nth-child(even) td{ background:#fcfcfd; }

/* 셀 안 목록(업무) */
.td-list{ padding:0; }
.td-list li{ margin:.1rem 0; }

/* 링크 강조(접근성 대비) */
.a11y-table a{ color:#181818; text-underline-offset:2px; }
.a11y-table a:focus{ outline:2px solid #0b63ce; outline-offset:2px; }

/* 전화/메일 줄바꿈 방지 + 주소는 자동 줄바꿈 허용 */
.tel{ white-space:nowrap; }
.a11y-table td:last-child{ word-break:break-all; }

/* 반응형 여백/둥근모서리 */
@media (max-width: 767px){
  .table-scroll{ border-radius:10px; }
  .a11y-table th, .a11y-table td{ padding:.8rem .9rem; }
}







/*     이하   상단 수정 함   */

.a11y-table thead th,
.a11y-table tbody th,
.a11y-table tbody td:nth-child(1){text-align:center;} 

.a11y-table tbody th[scope="rowgroup"]{ vertical-align: middle;}


.a11y-table{ table-layout:fixed; /* 또는 auto 가능 */ }
.a11y-table .col-dept { width:22%; }
.a11y-table .col-pos  { width:12%; }
.a11y-table .col-task { width:33%; }
.a11y-table .col-tel  { width:12%; }
.a11y-table .col-mail { width:21%; }

@media (max-width: 640px){
.a11y-table th,
.a11y-table td{font-size:12px !important;  }

.a11y-table .col-dept { width:16%; }
.a11y-table .col-pos  { width:11%; }
.a11y-table .col-task { width:34%; }
.a11y-table .col-tel  { width:13%; }
.a11y-table .col-mail { width:24%; }

.anjeon span{display:block ;}
}


/***************************************************************
*******   연구원 소개 ＞ 시설장비안내  >  시설안내   ***********
***************************************************************/
/* 메인 헤더 */
.page-head{text-align:center; margin-bottom:28px;}
.page-title{margin:0 0 8px; font-weight:800; letter-spacing:-.02em; line-height:1.25; font-size:clamp(20px, 2.4vw, 36px);}
.page-sub{margin:0; opacity:.95; font-size:clamp(14px, 1.6vw, 20px);}

/* 카드 공통 */
.Intro_facilities {display: flex;}
.facilities{
    border-radius:var(--radius); box-shadow:var(--shadow);
	overflow:hidden; 
	margin:18px 20px;
	border:1px solid rgba(255,255,255,.05);
}

/* 좌측 이미지 영역 */
.facilities-media img{width:100%; height:100%; display:block; object-fit:cover;}

/* 우측 패널 */
.facilities-body{padding:28px 28px; display:flex; flex-direction:column; justify-content:center; gap:16px; border-left:1px solid #e5e7eb;}

/* 제목 */
.facilities-title{color: var(--text-blue); line-height: 1.3; margin: 0; font-size:24px; font-weight: 700;}
.facilities-title .tag{font-weight:700; color:#fff; border-radius:16px; padding:7px 12px 0 12px; margin-left:6px; font-size:14px; background-color:var(--text-blue);}

/* 기본 상태(원하는 기본색으로 조정 가능) */
.facilities-body .tag {color: #fff; transition: color .15s ease;}

/* 마우스 오버 + 키보드 포커스(접근성)에서 노란색으로 */
.facilities-body:hover .tag, .facilities-body:focus-within .tag {color: #ffd400; /* 노랑 */}

/* 요약 목록 (정의 리스트) */
.facilities-body .info-list{margin:4px 0 0; padding:0;}
.facilities-body .info-list dt{float:left; width:72px; color:#334155; font-weight:700; margin:0 0 6px;}
.facilities-body .info-list dd{margin-left:72px; margin-bottom:6px; color:#0b1b2b;}
.facilities-body .info-list dd small{color:var(--muted);}


/* 반응형 */
@media (max-width: 768px){
	.Intro_facilities{display: block; background-color:var(--mobile-bg); padding: 12px 0 20px 0;}
	.Intro_facilities article{background-color:#fff;}
	.facilities{grid-template-columns: 1fr; /* 이미지 위, 내용 아래 */ border-radius:18px;}
	.facilities-body{padding:20px 20px 22px; border-left:0; border-top:1px solid #e5e7eb;}
	.facilities-body .info-list dt{ width:68px; }
	.facilities-body .info-list dd{ margin-left:68px; }
}

@media (min-width: 960x){
	.Intro_facilities article{margin:80px 0 !important;}
	.facilities{ margin:0 0 140px 0 !important; }
	.facilities-title{font-size:30px;}
}



/*****************************************
*******   주요사업  >  연구개발   ***********
*****************************************/
/* sub.css */

/* 기본 레이아웃 */
.future-tech-container {
    max-width: 1100px;
    margin: 0 auto;
    padding: 40px 20px;
    text-align: center;
}
.future-tech-container .icon-container img{width:36px; height:auto; }
	@media (min-width: 768px){.future-tech-container .icon-container img{width:56px; height:auto; }}

.section-title {
    font-size: 2rem;
    margin-bottom: 30px;
    font-weight: 700;
    color: #333;
}

/* 카드 컨테이너 */
.tech-cards {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: 16px;
}

/* 카드 스타일 */
.tech-card {
    background-color: #f8f8f8;
    border-radius: 10px;
    padding: 20px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.tech-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 8px 12px rgba(0, 0, 0, 0.2);
}

.icon-container img {
    width: 60px;
    height: 60px;
    margin-bottom: 20px;
}

/* 제목 */
.tech-card h3 {
    font-size: 1.5rem;
    color: #333;
    margin-bottom: 15px;
}

/* 설명 텍스트 */
.tech-card p {
    font-size: 1rem;
    color: #555;
}

/* 반응형: 768px 이상에서 5개 항목을 가로로 표시 */
@media (min-width: 768px) {
    .tech-cards {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* 반응형: 1024px 이상에서 5개 항목을 3열로 표시 */
@media (min-width: 1024px) {
    .tech-cards {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* 반응형: 1440px 이상에서 5개 항목을 5열로 표시 */
@media (min-width: 1440px) {
    .tech-cards {
        grid-template-columns: repeat(5, 1fr);
    }
}




/*****************************************
*******   주요사업  >  연구개발실적   ***********
*****************************************/


/* ===== R&D Achievements (scoped) ===== */
.rnd-wrap {	padding:20px;	background-color:var(--mobile-bg);	}
	@media (min-width: 768px) {.rnd-wrap {	background-color:#fff;}	}
	@media (min-width: 1440px) {.rnd-wrap, #kictex-contact {margin-top: 50px; padding:0;}	}
.rnd-btn{
	border:1px solid #d1d5db;
	background:#181818;
	color:#fff;
	border-radius:40px; 
	padding:4px 16px;
	cursor:pointer;
	font-size:14px;
	}
.rnd-btn:focus{outline:3px dashed red; outline-offset:2px; color:#181818; font-weight:600;}
.rnd-group {display: flex; flex-direction: column-reverse;}
.rnd-year{border:1px solid #ccc; border-radius:14px; background:#fff; margin-bottom:4px; overflow:hidden;}
	@media (min-width: 1440px) {.rnd-year{ margin-bottom:20px;}	}
.rnd-year summary{cursor:pointer; padding:1rem 1.1rem 1rem 30px;color:#181818; display:flex; 
	align-items:center;
	background-color:#f8f8f8;
	}
.rnd-year summary::-webkit-details-marker{display:none;}
/* Year label left, arrow right */
.rnd-year .yr-label{display:flex; align-items:center; justify-content:space-between; width:100%; gap:.75rem;}
.rnd-year .yr-label i {color: #6890bf;}
.rnd-year .yr-text{display:inline-flex; align-items:center; gap:.5rem;}
	@media (min-width: 1440px) {.rnd-year .yr-text{font-size:18px; }}
.rnd-year .arrow{display:inline-flex;  margin-left:auto; transition: transform .2s ease;}
.rnd-year .arrow svg{width:20px; height:20px; display:block;}
.rnd-year .arrow svg path{fill: currentColor;}
/* Collapsed: arrow up; Expanded: arrow down */
.rnd-year .arrow{transform: rotate(180deg);} /* up */
.rnd-year[open] .arrow{transform: rotate(0);}   /* down */
.rnd-year .year-body{padding:20px 30px;}
/* Lists */
.rnd-list{margin:0; }
.rnd-list > li{margin:.4rem 0; }
.rnd-cat-title::before{ 
/* position: absolute; */
    display: inline-block;
    content: '';
    background-color: #fff;
    width: 8px;
    height: 8px;
    border: 2px solid #005c9c;
    border-radius: 50%;
    margin:0 8px 0 16px;
    left: 0;
    top: 10px;
	
}
.rnd-cat-title{
	font-weight:500;
	margin:.25rem 0 .35rem;
	padding-left: 8px; 
    text-indent: -30px;}
.rnd-sublist{margin:.25rem 0 .5rem; padding-left:1.1rem;}
.rnd-sublist li {
  position:relative;
  padding-left: 8px;  /* ::before 너비 + margin-right 고려 */
  text-indent: -1px;  /* 들여쓰기 음수로 앞 글자 위치 보정 */
  font-size:0.9em;
  line-height: 1.7;
}

.rnd-sublist li::before {
  content: '-';
  font-size: 20px;
  position: absolute;
  margin-left: -12px;  /* ::before 위치를 정확히 맞춤 */
  top:-8px;
}
/* 2024 top categories */
.rnd-topcat{padding:1em 0; margin:0 0.45rem 0; border-bottom:2px dashed var(--gray1);}
.rnd-topcat > .rnd-topcat-title{
	display:inline-block;
	font-weight:600;
	font-size:14px;
	color:#fff; 
	padding: 4px 20px; 
	margin:.4rem 0;
	border-radius:30px;
	background-color:var(--main);}

.rnd-grid>div{margin-bottom:16px; }

/* Print */
@media print{
  .rnd-controls{display:none!important;}
  .rnd-year{break-inside: avoid;}
}
@media (prefers-reduced-motion: reduce){
  *{transition:none !important; scroll-behavior:auto !important;}
}


@media (min-width: 768px) {
.rnd-year .year-body{padding:1em 2em;}
.rnd-cat-title {font-size:17px;}
.rnd-sublist li {font-size:15px; }
}

@media (min-width: 960px) {
.rnd-year .year-body{padding:0 2em  1em 2em;background-color:#f8f8f8;}
.rnd-year .year-body .rnd-grid{border:1px solid #ddd; border-radius:8px; padding: 20px 34px; background-color:#fff;}
.rnd-cat-title {font-size:18px;}
.rnd-sublist{margin:.25rem 0 .5rem; padding-left:28px;}
.rnd-sublist li {font-size:16px; margin-bottom:8px; }

.rnd-cat-title::before{ 
    width: 4px;
    height: 4px;
    border: 3px solid #333;
    border-radius: 50%;
    margin:0 8px 0 16px;
    left: 0;
    top: 0;
	}
}


/*****************************************
*******   주요사업  >  기업지원   ***********
*****************************************/
  /* 섹션 레이아웃 */
.programs {padding:var(--padding); }
.programs_bg_wrap {
	font-size:20px; 
	line-height:1.8;
    color: #333;
}
	@media (min-width: 960px){
	.programs_bg_wrap {
	position: relative;
    background: url(../images/programs_bg.jpg) no-repeat center center / cover;
    color: #fff;
    text-align: center;
    padding: 10rem 1.5rem;
	border-radius:var(--radius);}
	}

.programs_bg_wrap2 {
	position: relative;
    background: url(../images/projects_testing_bg.jpg) no-repeat center center / cover;
    color: #fff;
    text-align: center;
    padding: 11rem 1.5rem;
	border-radius:var(--radius);
}

  .programs header{
    text-align:center;
  }
  .programs h2{
    font-size:clamp(1.4rem,2.5vw,2rem);
    line-height:1.25; margin:.25rem 0 .5rem;
  }
  .programs p.lead{
    margin:0 auto; max-width:48rem;
    font-size:clamp(1rem,1.2vw,1.125rem);
	color: #fff;
  }

  /* 그리드 */
  .program-list{
    list-style:none; padding:0; margin:var(--gap) 0 0;
    display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,360px),1fr));
    gap:var(--gap);
  }

  /* 카드 */
  .sub-card {
   	border:1px solid var(--border);
    border-radius:var(--radius); box-shadow:var(--shadow);
    padding:clamp(32px,100px,20px); display:flex; flex-direction:column; gap:.75rem;
  }
  .sub-card img{ margin: 0 auto; text-align:center; }
  .sub-card .icon{margin:0 auto 20px auto;
    width:56px; height:56px; border-radius:12px; display:inline-grid; place-items:center;
    background:color-mix(in oklab, var(--brand) 12%, white);
  }
  .sub-card h3{
  	color:var(--text-blue);
    font-size:20px; line-height:1.3; margin:0; font-weight:700; 
  }
  .sub-card .desc{margin:0; color:var(--muted)}
  .sub-card ul{margin:.25rem 0 0 1.1rem}
  .sub-card li{position:relative; margin:.2rem 0; }
  .sub-card li::before{
  	position:absolute; 
	display:inline-block;
	content:''; 
	width:4px; 
	height:4px;
	top:12px;
	left:-12px; 
	border-radius:50%; 
	background-color:var(--orange); 
	}

  .icon { }
  .icon svg{display:block}
  .icon .stroke{stroke:var(--brand); stroke-width:2; fill:none}
  .icon .dot{fill:var(--brand-2)}

@media (min-width: 768px) {
	.programs {padding:var(--padding); }
	.program-list{padding: 40px 0; }
	.card h3 {font-size:27px;}
	.card li{font-size:18px;}

}

@media (max-width: 767px) {
	.programs h2{font-size: clamp(1.1rem,2.5vw,2rem)}

}


/*   기업지원   개인정보수집동의   */
 
.privacy-consent{
	max-width:1070px; 
	background: var(--card);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
	margin:20px 20px;
    padding: clamp(32px, 100px, 20px);
    display: flex;
    flex-direction: column;
    gap: .75rem;}

@media (min-width: 968px){
.privacy-consent{margin:0 auto 40px auto;  }
}


.privacy-consent .design{ 
	margin-bottom: 20px;
	color: var(--text-blue);
    font-size: 18px;
	font-weight:700; 
    line-height:1.6;
}
.privacy-consent .design .name li{display:inline;}


		  .privacy-consent legend{
			font-weight:700;
			padding:0 6px;
			width: 200px;
			}

		  .consent-options{
		  	max-width:320px;
			display:flex;
			gap:16px;
			margin:8px 0;
			flex-wrap: wrap; /* 자식 요소가 부모를 넘지 않도록 */
		  }

		

/*   신청페이지 이동  버튼  */
.projects_bizSupport-button{text-align:center;}
.projects_bizSupport-button button{
	width:300px;
	padding:12px; 
	margin-top:20px;
	border-radius:40px;
	background-color:var(--main);
	color:#fff;
	font-weight:710;
	 cursor: pointer;
	 border:0;
  transition: all 0.3s ease; /* 색상, 위치, 그림자 부드럽게 변화 */}


/* 마우스 오버 시 효과 */
.projects_bizSupport-button button:hover {
  transform: translateY(-3px); /* 위로 살짝 이동 */
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2); /* 그림자 강조 */
}

/* 클릭(눌림) 시 효과 */
.projects_bizSupport-button button:active {
  transform: translateY(0); /* 다시 원위치 */
  border:2px dashed red;
}



/*****************************************
*******   주요사업  >  시제품 제작 ***********
*****************************************/

/* ===== 시제품 제작 지원 ===== */
.projects_prototype_container {position: relative;}

/* 배경 영역 */
.proto_bg_wrap{
	position: relative;
	background: url("../images/projects_prototype_bg.jpg") no-repeat center center / cover;
	color:#fff;
	text-align:center;
	padding: 4rem 1.5rem;
	border-radius:var(--radius);
}

/* 상단 문구 */
.proto_text_area{ margin-bottom: 3rem; }
.proto_text_list{ padding:0; margin:0 auto; max-width:1000px; text-align:center; display:inline-block; }
.proto_text_list li{ margin:.5rem 0; font-size:1.8rem; font-weight:600; line-height:1.6; }
.proto_text_list li span{ position:relative; padding-left:14px; display:inline-block; }
.proto_text_list li span::before{ content:""; position:absolute; left:0; top:50%; width:4px; height:4px; border-radius:50%; background:#fff; transform:translateY(-50%); }

/* 하단 박스 */
.proto_box_area{ display:flex; flex-wrap:wrap; justify-content:center; gap:.8rem; max-width:1100px; margin:0 auto; }
.proto_box{background:#fff; color:#000; border-radius:8px; padding:2rem 1.25rem; flex:1 1 200px; max-width:240px; box-shadow:0 2px 6px rgba(0,0,0,.15); font-size:1.2rem; line-height:1.5; font-weight:500; word-break:keep-all; display:flex; align-items:center; justify-content:center; text-align:center;}

/* ===== 신청서 절차 안내 (PC 스타일은 그대로) ===== */
.proto_flow_section{ padding:3.5rem 1rem 2.75rem; text-align:center; color:#0f172a; }
.proto_flow_title{font-weight: 600; font-size:clamp(1.4rem,2.2vw,2rem); color:#1c4e8e; margin:0 auto .75rem; word-break: keep-all;}
.proto_flow_sub{ margin:0 auto 2.25rem; font-size:clamp(.95rem,1.4vw,1.05rem); color:#334155; }

.proto_flow_list{list-style:none; padding:0; margin:0 auto; max-width:1100px; display:grid; grid-template-columns:repeat(5, minmax(120px,1fr)); gap:clamp(1rem,2vw,1.5rem); position:relative;}
.proto_flow_list::before{content:""; position:absolute; left:0; right:0; top: 74%; height:2px; background:#1c4e8e; z-index:0; }
.proto_flow_item{position:relative; display:flex; flex-direction:column; align-items:center; gap: 32px;}
.proto_flow_item::after{content:""; position:absolute; left:50%; top: 74.5%; transform:translate(-50%,-50%); width:10px; height:10px; border-radius:50%; background: #fff; border: 2px solid #1c4e8e; z-index:1;}
.proto_flow_step {display:inline-flex; flex-direction: column; align-items: flex-start; min-height:28px; color: var(--text-blue);}
.proto_flow_step .proto_flow_stepno {font-size: 16px; font-weight: 500;}
.proto_flow_step .proto_flow_steptxt {font-size: 24px; font-weight: 700; line-height: 1;}
.proto_flow_icon{ height:60px; display:flex; align-items:center; justify-content:center; }
.proto_flow_icon img{ width:clamp(44px,6vw,60px); height:auto; display:block; }
.proto_flow_desc{margin-top:34px; font-size: 18px; font-weight: 500; line-height:1.45; color:#0f172a; text-align:center; word-break: keep-all;}

/* ===== 모바일: 2열 카드 + 아이콘 아래 라인/점(아이템 내부) ===== */
@media (max-width: 768px){
	.proto_text_area{ margin-bottom: 2rem; }
	.proto_text_list{ max-width: 680px; }
	.proto_text_list li{ font-size: 1.1rem; }
	.proto_text_list li span{ padding-left: 12px; }
	.proto_text_list li span::before{ width: 5px; height: 5px; }

	.proto_box_area{ flex-direction: column; align-items: stretch; gap: .6rem; max-width: 680px; }
	.proto_box{ max-width: 100%; flex: 1 1 auto; padding: 1.25rem 1rem; font-size: 1.05rem; }
	.proto_bg_wrap{ padding: 2.5rem 1rem; }

	.proto_flow_list{grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.1rem; align-items: start;}
	.proto_flow_list::before{ content: none !important;}
	.proto_flow_item::after{ content: none !important;}
	.proto_flow_item{background: #efefef; padding: 20px 0; border-radius: 10px;gap: 10px;}
	.proto_flow_step{flex-direction: row; align-items: center; gap: .4rem; min-height: auto; color: var(--text-blue);}
	.proto_flow_step .proto_flow_stepno{ font-size: 14px; font-weight: 600; }
	.proto_flow_step .proto_flow_steptxt{ font-size: 18px; font-weight: 700; }
	.proto_flow_icon{position: relative; height: 56px; display: flex; align-items: center; justify-content: center;}
	.proto_flow_icon img{ width: 48px; height: auto; }
	.proto_flow_icon::after, .proto_flow_icon::before{display: none;}
	.proto_flow_desc{margin-top: 0; font-size: 15px; line-height: 1.45;}
}
@media (max-width: 480px){
	.proto_flow_list{ grid-template-columns: repeat(2, minmax(0, 1fr));}
	.proto_flow_icon{height: 50px;}
	.proto_flow_icon img{ width: 40px; }
	.proto_flow_desc{font-size: 14px; margin-top: 0;}
	.proto_flow_step .proto_flow_steptxt{ font-size: 16px; }
}

/* ===== 의뢰서 다운받기 ===== */
.proto-reqdl-wrap{ background:#f3f5f9; padding: 24px 70px; margin: 24px 0; }
.proto-reqdl-inner{max-width: 1100px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1.2fr; gap: 24px; align-items: center;}
.proto-reqdl-left{ padding: 12px 8px; }
.proto-reqdl-title{ margin:0 0 10px; font-size: 26px; font-weight: 800; color:#254c86; letter-spacing:-.02em; }
.proto-reqdl-desc{color: var(--text-blue); line-height: 1.4;}
.proto-reqdl-grid{display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px;}
.proto-reqdl-btn{display:flex; align-items:center; justify-content:space-between; gap:12px; background:#233f7a; color:#fff; text-decoration:none;
	padding: 14px 16px; border-radius: 2px; box-shadow: 0 1px 0 rgba(0,0,0,.15) inset;}
.proto-reqdl-btn:focus-visible{ outline:3px solid #94b4ff; outline-offset:2px; }
.proto-reqdl-text{white-space: nowrap;}
.proto-reqdl-text:hover {color: #fff; text-decoration: none;}
.proto-reqdl-ico{ display:inline-flex; align-items:center; justify-content:center; width:24px; height:24px; }

/* 반응형 - 의뢰서 영역 */
@media (max-width: 960px){
	.proto-reqdl-inner{ grid-template-columns: 1fr; gap: 16px; }
	.proto-reqdl-left{ padding-bottom: 0; }
	.proto-reqdl-wrap {padding: 24px 40px;}
	.proto-reqdl-btn {border-radius: 8px;}
}

@media (max-width: 768px){
	.proto-reqdl-grid{display: flex; flex-direction: column;}
}

@media (max-width: 480px){
	.proto-reqdl-grid{ grid-template-columns: 1fr; }
	.proto-reqdl-title{ font-size:22px; }
	.proto-reqdl-wrap {padding: 24px;}
}


/*****************************************
*******   주요사업  >  시험분석   ***********
*****************************************/
.testing_download {width: 100%;}
.testing_download ul {display: flex; justify-content: flex-end;}
.testing_download li {text-align: center; padding: 10px 2%; background: #213152;}
.testing_download li a {color: #fff;}




/*****************************************
*******   주요사업  >  입주공간지원 ***********
*****************************************/
/* 배경 영역 */
.projects_officeSpace_wrap{
	position: relative;
	background: url("../images/projects_officeSpace_bg.jpg") no-repeat center center / cover;
	color:#fff;
	text-align:center;
	padding: 12rem 1.5rem;
}

/* 메인 헤더 */
.page-head{text-align:center; margin-bottom:28px;}
.page-title{margin:0 0 8px; font-weight:800; letter-spacing:-.02em; line-height:1.25; font-size:clamp(20px, 2.4vw, 36px);}
.page-sub{margin:0; opacity:.95; font-size:clamp(14px, 1.6vw, 20px);}

/* 카드 공통 */
.facility{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:0;
  	border:1px solid var(--border);
    border-radius:var(--radius); box-shadow:var(--shadow);
  overflow:hidden; 
  margin:18px 20px;
  border:1px solid rgba(255,255,255,.05);
}
.facility + .facility{ margin-top:22px; }

/* 좌측 이미지 영역 */
.facility-media img{width:100%; height:100%; display:block; object-fit:cover;}

/* 우측 패널 */
.facility-body{padding:28px 28px; display:flex; flex-direction:column; justify-content:center; gap:16px; border-left:1px solid #e5e7eb;}

/* 제목 */
.facility-title{color: var(--text-blue); line-height: 1.3; margin: 0; font-size:24px; font-weight: 700;}
.facility-title .tag{font-weight:700; color:#fff; border-radius:16px; padding:7px 12px 0 12px; margin-left:6px; font-size:14px; background-color:var(--text-blue);}

/* 기본 상태(원하는 기본색으로 조정 가능) */
.facility-body .tag {color: #fff; transition: color .15s ease;}

/* 마우스 오버 + 키보드 포커스(접근성)에서 노란색으로 */
.facility-body:hover .tag, .facility-body:focus-within .tag {color: #ffd400; /* 노랑 */}

/* 요약 목록 (정의 리스트) */
.info-list{margin:4px 0 0; padding:0;}
.info-list dt{float:left; width:72px; color:#334155; font-weight:700; margin:0 0 6px;}
.info-list dd{margin-left:72px; margin-bottom:6px; color:#0b1b2b;}
.info-list dd small{color:var(--muted);}


/* 반응형 */
@media (max-width: 768px){
	.projects_officeSpace{background-color:var(--mobile-bg); padding: 12px 0 20px 0;}
	.projects_officeSpace article{background-color:#fff;}
	.facility{grid-template-columns: 1fr; /* 이미지 위, 내용 아래 */ border-radius:18px;}
	.facility-body{padding:20px 20px 22px; border-left:0; border-top:1px solid #e5e7eb;}
	.info-list dt{ width:68px; }
	.info-list dd{ margin-left:68px; }
}

@media (min-width: 960x){
	.projects_officeSpace article{margin:80px 0 !important;}
	.facility{ margin:0 0 140px 0 !important; }
	.facility-title{font-size:30px;}
}


/*****************************************
*******   홍보마당  >  전붇특별자치도란 ***********
*****************************************/
.jeonbuk-button-container{}
.jeonbuk-img img{width:100%;}

.jb-p{padding-left:1em;}
.global{background-color:#f3f5f8;}

/* =============== state_intro 전용 =============== */
.state_intro{
  --bd:#e5e7eb; --fg:#0f172a; --muted:#64748b;
  --brand:#0369a1;        /* 링크/포커스 */
  --accent:#0ea5e9;       /* 좌측 라인/강조 (도청 톤 고려한 블루) */
  background:#fff; color:var(--fg);
  padding:0 20px 20px 20px;
  line-height:1.75;
}
.state_intro *{box-sizing:border-box;}
.state_intro .st-mute{color:var(--muted);}
.state_intro .st-link{color:#035aa6;text-underline-offset:2px;}
.state_intro .st-link:hover{text-decoration:underline;}
.state_intro a.ext::after{content:"↗";margin-left:.25em;font-size:.9em;}
.state_intro .st-foot{margin-top:.75rem;color:var(--muted);font-size:.9rem;}

.state_intro h2{font-size:clamp(1.25rem,1.8vw,1.5rem);margin:0 0 .75rem 0;line-height:1.3;}
.state_intro .st-h3{font-size:1.125rem; margin:0 0 .5rem 0; line-height:1.35; position:relative; padding-left:.75rem;}
.state_intro .st-h3::before{content:""; position:absolute; left:0; top:.25em; width:4px; height:1.2em; background:var(--accent); border-radius:2px;}
.state_intro .st-h3{color: #014594; font-size: 22px; word-break: keep-all;}
.state_intro .st-h5{font-size:.95rem;margin:.5rem 0 .25rem 0;color:var(--muted);}
.state_intro .st-sec{margin-bottom:1.8rem;}
.state_intro .st-p{margin:0 0 .75rem 0;}

.state_intro .st-timeline{list-style:none;margin:.25rem 0 0 0;padding:0;display:grid;gap:.5rem;}
.state_intro .st-timeline li{display:grid;grid-template-columns:auto 1fr;gap:.5rem;align-items:baseline;}
.state_intro .st-date{font-variant-numeric:tabular-nums; background:#ecfeff; color:#0f766e; padding:.2rem .45rem; border-radius:.35rem; font-weight:600;}
.state_intro .st-event{line-height:1.6;}

.state_intro .st-dl{display:grid;grid-template-columns:auto 1fr;gap:.35rem 1rem;margin:.25rem 0 .5rem 0;}
.state_intro .st-dl dt{font-weight:700;}
.state_intro .st-dl dd{margin:0;}


.state_intro .st-cols{
  display:grid; gap:.25rem .75rem; padding-left:0; list-style:none; 
  margin-top:.35rem;
}

/* 글로벌 생명경제 도시 */
.global{    border: 1px solid var(--bd);
    border-radius: 12px;
    padding: 1rem;
	margin-bottom:20px; 
    background: #f3f5f8;}
.global-title{
	font-size:20px;
	color:var(--main);
	font-weight:700;}
.global ul li{
	position:relative;
	font-size:16px; 
	margin:0 0 0 20px;
	padding:0 !important;}
.global ul li:before {
    content: "";
    display: block;
    width: 4px;
    height: 4px;
    background: #034694;
    position: absolute;
    top: 12px;
    left: -10px;
}
.jb-business{position:relative;}

@media (min-width:640px){
.global_container {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px; /* 카드 사이 간격 */
  }
 }
 @media (min-width:960px){
.global_container {
  grid-template-columns: repeat(3, minmax(0, 1fr));
 }
}


/* 전북이 특별해집니다 */
.state_intro .st-special-grid{
  display:grid; gap:1rem; grid-template-columns:1fr;
}
.the{font-size:19px; padding-top:20px }
@media (min-width:768px){
  .state_intro .st-special-grid{grid-template-columns:1fr 1fr;}
}
.state_intro .st-card{
  border:1px solid var(--bd); border-radius:12px; padding:20px; background:#f3f5f8;
}

/*  5대산업   3대산업 */
.indus{
	font-weight:600;
	font-size:20px;
	color:#fff;
	text-align:center;
	border-bottom:1px solid #ccc;
	padding:12px;
	border-radius:8px 8px 0 0;
	margin-bottom:28px; background-color:var(--main); }
.indus-title_container {padding-left:18px;}
.indus-title_container li{margin-bottom:28px;}
.indus-title_container span{
	position:relative;
	display:block ;
	margin-left:20px;
	}
.indus-title_container span:before{
    content: "";
    display: inline-block;
    width: 14px;
    height: 14px;
    position: absolute;
    top: 9px;
    left: -22px;
    background-image: url('../img/jb-icon.png');
	background-size: 100%;
}

.indus-title{position:relative; font-size:20px; color:var(--main);}
.indus-title::before{
	position:absolute;
	content: "";
    display: block;
    width: 4px;
    height: 4px;
    background: #034694;
    top: 10px;
    left: -12px;}

.indus-p{color:#333; font-size:17px; font-weight:600; }

/* 접근성 선호도 */
@media (prefers-reduced-motion: reduce){
  .state_intro *{transition:none !important;animation:none !important;}
}



/*****************************************
*******   홍보마당 > 용어 Q&A   ***********
*****************************************/
/* ===== Glossary (scoped) ===== */
.jb-glossary { --accent:#155e75; --accent-2:#0e7490; --text:#111827; --muted:#6b7280; --line:#e5e7eb; --bg:#f8fafc; }
.jb-glossary .sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* state_intro */
.jb-glossary .state_intro{
  margin: 0 0 24px 0; padding: 22px 20px;
  background: var(--bg);
  border: 1px solid var(--line); border-radius: 12px;
}
.jb-glossary .state_intro .eyebrow{
  display:inline-block; font-weight:700; font-size:14px; letter-spacing:.02em;
  color: var(--accent-2); background:#ecfeff; border:1px solid #cffafe; border-radius:999px; padding:6px 10px; margin-bottom:10px;
}
.jb-glossary .state_intro .title{
  font-size: clamp(20px, 2.3vw, 26px); line-height:1.3; color:var(--text); font-weight:800; margin:0 0 6px 0;
}
.jb-glossary .state_intro .desc{
  margin:8px 0 0 0; color:var(--muted); font-size:15px; line-height:1.7;
}

/* QnA (details/summary) */
.jb-glossary .qna{border-top:1px solid var(--line)}
.jb-glossary .qna details{
  border-bottom:1px solid var(--line); background:#fff;
}
.jb-glossary .qna summary{
  list-style:none; cursor:pointer; display:flex; align-items:flex-start; gap:12px;
  padding:18px 16px; font-weight:700; font-size:17px; color:#0b1726;
}
.jb-glossary .qna summary::-webkit-details-marker{display:none}
.jb-glossary .qna summary .q-badge{
  flex:0 0 auto; width:28px; height:28px; border-radius:999px;
  background:#ecfeff; border:1px solid #a5f3fc; display:inline-grid; place-items:center;
  font-size:13px; font-weight:800; color:var(--accent-2);
}
.jb-glossary .qna details[open] summary{background:#f9fafb}
.jb-glossary .qna .answer{padding:0 16px 18px 56px; color:#1f2937; font-size:15px; line-height:1.8}
.jb-glossary .qna .answer p{margin:8px 0}
.jb-glossary .qna .answer ul{margin:8px 0 0 20px}
.jb-glossary .qna .answer li{margin:6px 0; list-style:disc}

/* sample block items to mirror 도청 스타일(소제목, 예시 표기) */
.jb-glossary .ex-label{display:inline-block; font-size:13px; font-weight:700; color:#334155; background:#f1f5f9; border:1px solid #e2e8f0; border-radius:6px; padding:4px 8px; margin:8px 0 2px}
.jb-glossary .ex-box{border:1px dashed #dbeafe; background:#eff6ff; border-radius:10px; padding:10px 12px; margin:6px 0; font-size:14px}

/* links */
.jb-glossary a{color:#0ea5e9; text-underline-offset:2px}
.jb-glossary a:focus-visible{outline:2px solid #0ea5e9; outline-offset:2px}

/* KOGL notice */
.jb-glossary .kogl{
  margin-top:20px; padding:14px 16px; border:1px solid var(--line); border-radius:10px; background:#fcfcff; color:#374151; font-size:14px;
}
.jb-glossary .kogl strong{font-weight:800}

/* responsive tweaks */
@media (max-width: 640px){
  .jb-glossary .qna summary{padding:16px 14px; font-size:16px}
  .jb-glossary .qna .answer{padding:0 14px 16px 52px}
}

/* motion preference */
@media (prefers-reduced-motion: reduce){
  *{animation:none!important; transition:none!important}
}

/*****************************************
*******   윤리경영 > 고객헌장   ***********
*****************************************/

.bubble-item.color1 .num,
.bubble-item.color1 .bubble-text {border-color:#4EB2E3; }
.bubble-item.color1 .num {background:#4EB2E3; }
.bubble-item.color1 .bubble-text::before,
.bubble-item.color1 .bubble-text::after {border-color:#4EB2E3; }
.bubble-item.color1 .bubble-arrow {border-top: 8px solid transparent; border-right: 12px solid #4EB2E3; border-bottom: 8px solid transparent;}

.bubble-item.color2 .num,
.bubble-item.color2 .bubble-text { border-color:#4092CE; }
.bubble-item.color2 .num { background:#4092CE; }
.bubble-item.color2 .bubble-text::before,
.bubble-item.color2 .bubble-text::after { border-color:#4092CE; }
.bubble-item.color2 .bubble-arrow {border-top: 8px solid transparent; border-right: 12px solid #4092CE; border-bottom: 8px solid transparent;}

.bubble-item.color3 .num,
.bubble-item.color3 .bubble-text { border-color:#4481C0; }
.bubble-item.color3 .num { background:#4481C0; }
.bubble-item.color3 .bubble-text::before,
.bubble-item.color3 .bubble-text::after { border-color:#4481C0; }
.bubble-item.color3 .bubble-arrow {border-top: 8px solid transparent; border-right: 12px solid #4481C0; border-bottom: 8px solid transparent;}

.bubble-item.color4 .num,
.bubble-item.color4 .bubble-text { border-color:#0F50A2; }
.bubble-item.color4 .num { background:#0F50A2; }
.bubble-item.color4 .bubble-text::before,
.bubble-item.color4 .bubble-text::after { border-color:#0F50A2; }
.bubble-item.color4 .bubble-arrow {border-top: 8px solid transparent; border-right: 12px solid #0F50A2; border-bottom: 8px solid transparent;}

.bubble-item.color5 .num,
.bubble-item.color5 .bubble-text { border-color:#15477C; }
.bubble-item.color5 .num { background:#15477C; }
.bubble-item.color5 .bubble-text::before,
.bubble-item.color5 .bubble-text::after { border-color:#15477C; }
.bubble-item.color5 .bubble-arrow {border-top: 8px solid transparent; border-right: 12px solid #15477C; border-bottom: 8px solid transparent;}

@media (max-width:640px){
	.bubble-item.color1 .bubble-arrow {border-left: 8px solid transparent; border-right: 8px solid transparent; border-bottom: 12px solid #4EB2E3;}
	.bubble-item.color2 .bubble-arrow {border-left: 8px solid transparent; border-right: 8px solid transparent; border-bottom: 12px solid #4092CE;}
	.bubble-item.color3 .bubble-arrow {border-left: 8px solid transparent; border-right: 8px solid transparent; border-bottom: 12px solid #4481C0;}
	.bubble-item.color4 .bubble-arrow {border-left: 8px solid transparent; border-right: 8px solid transparent; border-bottom: 12px solid #0F50A2;}
	.bubble-item.color5 .bubble-arrow {border-left: 8px solid transparent; border-right: 8px solid transparent; border-bottom: 12px solid #15477C;}
}

.ethic_mgmt_container{padding:2.5rem 1rem}
.customer-charter{max-width:980px;margin:0 auto;position:relative}
.charter-quotes-top,.charter-quotes-bottom{position:absolute;width:44px;height:44px;z-index:1}
.charter-quotes-top{top: -8%;left:12%;transform:translateX(-50%)}
.charter-quotes-bottom{bottom: 14%; right: 9%;transform:translateX(-50%)}
.charter-quote{position:relative; font-size:18px; text-align:center; font-size:clamp(1rem,2.4vw,1.125rem); line-height:1.75; color:#111827; padding-bottom: 3.25rem; word-break:break-word; hyphens: auto; font-weight: 500;}
.charter-quote p{margin:.75rem 0; word-break: keep-all;}

.charter-visual{max-width:980px;margin:3rem auto;text-align:center;position:relative}
.charter-visual-top{position:relative; display:inline-flex; flex-direction:column; align-items:center; justify-content:center; border:6px solid var(--main); border-radius:50%; width:200px; height:200px; margin:0 auto 3rem auto; background:#fff;}
.charter-visual-topline{position: absolute; width: 120%; height: 120%; border: 4px dotted #fff; border-bottom: 4px dotted var(--main); border-radius: 50%;}
.charter-visual-topline::before{content: ''; position: absolute; width: 5px; height: 34px; background: #ABADBC; left: 49%; bottom: -40px;}
.charter-visual-topline::after{content: ''; position: absolute; width: 16px; height: 16px; background: #fff; border: 4px solid #ABADBC; bottom: -32px; left: 46.5%; border-radius: 50%;}

.charter-logo{width:94px;height:94px}
.charter-top-title{font-size:1.8rem;font-weight:700;color:#111827; margin-bottom:0}
.charter-visual-list{list-style:none; margin:0; padding:0; max-width: 880px; margin-inline: auto;}
.charter-visual-list li{margin-bottom:1.5rem}
.bubble{display:flex;align-items:center;position:relative}
.bubble .num{position:relative; flex:0 0 auto; width:52px; height:52px; border-radius:50%; color:#fff; font-weight:700; font-size: 1.2rem; display:flex; align-items:center; justify-content:center; z-index:2;}
.bubble-text{position:relative; flex:1; margin-left: 16px; padding: 3rem; background:#fff; font-size: 1.2rem; line-height:1.6; color:#111827; text-align: left; word-break: keep-all;}
.bubble-text::before{content:""; position:absolute; top:0; bottom:0; left: 0; width: 80%; border: 8px solid; border-right: 0; border-radius: 40px 0 0 40px}
.bubble-text::after{content:""; position:absolute; top:0; bottom:0; right: 0; width: 35%; border: 2px dashed; border-left: 0; border-radius: 0 40px 40px 0;}
.bubble-text p {margin: 0;}
.bubble-arrow{position: absolute; left: -12px; top: 40%; transform: translate(0, 50%);}

@media (max-width: 1439px){
	.charter-quotes-top,.charter-quotes-bottom{display:none}
}

@media (max-width:640px){
	.charter-logo {width: 74px; height: 74px;}
	.ethic_mgmt_container{padding: 0 1rem}
	.charter-quote p{font-size:1rem;line-height:1.5}
	.charter-quotes-top,.charter-quotes-bottom{width:30px;height:30px}
	.bubble {flex-direction:column; align-items: center;}
	.bubble .num {width: 42px; height: 42px; font-size: 1.2rem; margin-bottom: 20px;}
	.bubble-text {font-size: 1rem; margin-left: 0; padding: 2rem;}
	.bubble-arrow{left: 50%; top: -20px; transform: translate(-50%, 0);}
	.bubble-text::before {border: 4px solid; border-right: 0;}
	.bubble-text::after {border: 1px dashed; border-left: 0}
	.charter-quote {padding-bottom: 0;}
}

/*****************************************
*******   윤리경영 > 윤리헌장   ***********
*****************************************/
.ethic_charter_container {display: flex; flex-direction: column; border: 3px solid var(--main);}
.ethic_charter_top {background-image: url('../images/ethic_charter_bg.jpg'); background-size: cover; background-position: center; color: #fff; padding: 100px 80px 50px 80px;}
.ethic_charter_top .ethic_charter_title {font-size: clamp(1.5rem, 2.2vw, 2.2rem); font-weight: 700; margin-bottom: 16px; line-height: 1.5;}
.ethic_charter_top .ethic_charter_title span {display: block;}
.ethic_charter_top p {font-size: 17px; line-height: 2; margin-bottom: 0; word-break: keep-all;}
.ethic_charter_bottom {background-color: #fff; padding: 40px 80px; color: #111; text-align: left; width: 100%;}
.ethic_charter_bottom p {display: flex; align-items: flex-start; gap: 10px; margin: 24px 0 10px; line-height: 1.8; word-break: keep-all;}
.ethic_charter_bottom .ethic_charter_indent {font-size: 18px; line-height: 1.8; word-break: keep-all;}
.ethic_charter_indent .indent_bold {font-size: 24px; line-height: 1;}
.ethic_charter_indent .indent_detail {font-size: 17px;}

.ethic_features {margin-top: 40px;}
.ethic_features_intro {margin-bottom: 30px; text-align: center; color: #22376b; font-weight: 500; line-height: 1.8; font-size: clamp(1.1rem, 1.8vw, 1.5rem); word-break: keep-all;}
.ethic_features_intro .ethic_features_line {display: block;}
.ethic_features_panel {/*background: #f4f5f7; */padding: 28px 100px;}
.ethic_features_list {grid-template-columns: repeat(3, 1fr); place-items: center;}
.ethic_feature_item img {width: 100%; height: auto; display: block; margin: 0 auto;}
.ethic_feature_item .icon-circle {display: flex; align-items: center; justify-content: center; width: 120px; height: 120px; border: 4px solid #1d2f5c; border-radius: 50%; margin: 0 auto 12px; padding: 22px; background: #fff;}
.ethic_feature_item figure {margin: 0; text-align: center;}
.ethic_feature_item figcaption {font-size: 20px; color: #111; line-height: 1.4; word-break: keep-all;}

@media (min-width: 520px){
	.ethic_features_list {display: grid; gap: clamp(12px, 3vw, 32px);}
}

@media (max-width: 767px)
{
	.ethic_charter_top {padding: 50px 30px;}
	.ethic_charter_bottom {padding: 40px 30px;}
	.ethic_charter_bottom p {display: block;}
	.ethic_features {padding: 0 20px;}
	.ethic_features_panel {padding: 28px 0px;}
	.ethic_feature_item .icon-circle {width: 80px; height: 80px; border: 2px solid #1d2f5c;}
	.ethic_feature_item figcaption {font-size: 16px;}
}

@media (max-width: 519px)
{
	/* .ethic_feature_item {border: 1px solid var(--gray1); background: #fff; width: 100%; padding: 16px 0; border-radius: 10px;} */
	.ethic_features_list {display: flex; justify-content: space-between; align-items: flex-start; gap: 10px;}
	.ethic_features_list li {width: calc(100% / 3);}
}



/*****************************************
*******   윤리경영 > 공평성 기밀유지 선언   ***********
*****************************************/
/* 선언서 카드 */
.eco-privacy-container .eco-privacy {
  position: relative;
  background-image: url("../images/fair-01.png");
  background-position: top;
  background-repeat: no-repeat;
  display: flex;
  align-items: flex-start;
}

.eco-privacy-container .eco-privacy-declaration {
  width: 100%;
  max-width: 600px;
  margin: 90px auto 150px auto;
  text-align: center;
  box-sizing: border-box;
}

.eco-privacy-container .erc-title {
	display: block;
	font-weight: 700;
	font-size: 38px;
	color: var(--text-blue);
	margin: 30px 0;
}

.eco-privacy-container .eco-privacy-intro {
  font-size: 20px;
  line-height: 1.7;
  margin: 0 0 42px;
  word-break: keep-all;
  text-align: left;
}

.eco-privacy-container .erc-list {
  display: grid;
  gap: 28px;
}
.eco-privacy-container .erc-list li {
	text-align: left;
}

.eco-privacy-container .eco-privacy-num {
  font-weight: 600;
  font-size: 22px;
}

.eco-privacy-container .erc-list p {
  margin: 0;
  font-size: 18px;
  line-height: 1.5;
  text-align: left;
  flex: 1 1 auto;
  word-break: keep-all;
  overflow-wrap: break-word;   /* 모바일에서 강제로 줄바꿈 */
}

.eco-privacy-container .erc-date {
  margin-top: 28px;
  font-size: 1.4rem;
  margin-bottom: 0;
}

.eco-privacy-container .eco-privacy-footer {
  margin-top: 40px;
  font-size: 1.8rem;
  font-weight: 600;
  color: var(--text-blue);
}

@media (max-width: 849px) {
	.eco-privacy-container .eco-privacy {background-image: none; background-color: #f8f9fa; min-height: auto;}
	.eco-privacy-container .eco-privacy-declaration {padding: 0 20px; margin: 50px auto; max-width: 700px;}
	.eco-privacy-container .erc-list {gap: 24px;}
	.eco-privacy-container .eco-privacy-intro {font-size: 16px;}

	.eco-privacy-container .erc-title {display: none;}
	.eco-privacy-container .erc-intro {font-size: 15px;}
	.eco-privacy-container .erc-list li {gap: 20px; align-items: flex-start;}
	.eco-privacy-container .eco-privacy-num {font-size: 16px;}
	.eco-privacy-container .erc-list p {font-size: 16px;}
	.eco-privacy-container .erc-org, .eco-privacy-container .erc-date {font-size: 1.2rem;}
	.eco-privacy-container .eco-privacy-footer {font-size: 1.6rem;}
}


/*****************************************
*******   윤리경영 > 인권경영 > 인권경영헌장   ***********
*****************************************/
.ethic_rights_charter_container .erc-visual {
  position: relative;
  background-image: url("../images/ethic_rights_charter_bg.svg");
  /* background-size: cover; */
  background-position: top;
  background-repeat: no-repeat;
  display: flex;
  align-items: flex-start;
}

.ethic_rights_charter_container .erc-content {
  width: 100%;
  max-width: 700px;
  margin: 100px auto 50px auto;
  text-align: center;
  box-sizing: border-box;
}

.ethic_rights_charter_container .erc-title {
	display: block;
	font-weight: 800;
	font-size: 40px;
	color: var(--text-blue);
	margin: 30px 0;
}

.ethic_rights_charter_container .erc-intro {
  font-size: 18px;
  line-height: 1.7;
  margin: 0 0 42px;
  word-break: keep-all;
}

.ethic_rights_charter_container .erc-list {
  display: grid;
  gap: 16px;
}

.ethic_rights_charter_container .erc-list li {
  display: flex;
  gap: 12px;
  align-items: center;
}

.ethic_rights_charter_container .erc-label {
  padding: 12px;
  border-radius: 50px 50px 0 50px;
  background: var(--text-blue);
  color: #fff;
  flex: 0 0 auto;
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
}

.ethic_rights_charter_container .erc-list p {
  margin: 0;
  font-size: 17px;
  line-height: 1.5;
  text-align: left;
  flex: 1 1 auto;
  word-break: keep-all;
  overflow-wrap: break-word;   /* 모바일에서 강제로 줄바꿈 */
}

.ethic_rights_charter_container .erc-date {
  margin-top: 28px;
  font-size: 1.4rem;
  margin-bottom: 0;
}

.ethic_rights_charter_container .erc-org {
  margin-top: 28px;
  font-size: 1.4rem;
  font-weight: 600;
}


@media (max-width: 849px) {
	.ethic_rights_charter_container .erc-visual {background-image: none; background-color: #f8f9fa; min-height: auto;}
	.ethic_rights_charter_container .erc-content {padding: 0 20px; margin: 50px auto;}
	.ethic_rights_charter_container .erc-list {gap: 24px;}
	.ethic_rights_charter_container .erc-title {display: none;}
}

@media (max-width: 768px) {
  .ethic_rights_charter_container .erc-intro {font-size: 15px;}
  .ethic_rights_charter_container .erc-list li {gap: 16px; align-items: flex-start;}
  .ethic_rights_charter_container .erc-label {font-size: 14px;}
  .ethic_rights_charter_container .erc-list p {font-size: 15px;}
  .ethic_rights_charter_container .erc-org, .ethic_rights_charter_container .erc-date {font-size: 1.2rem;}
}

/*****************************************
*******   윤리경영  >  클린신고센터  ***********
*****************************************/

  .voc2025 { 
    --bg:#0b1020; --card:#10182f; --ink:#e9eef7; --dim:#b8c2d9; --key:#79c1ff; --key2:#8df2c1;
	--line:#24335b; --focus:#ffd166;
    --r:16px;
    color:var(--ink); background:linear-gradient(180deg,var(--bg) 0%,#0f1530 100%);
    padding:clamp(20px,4vw,40px); box-shadow:0 8px 30px rgba(0,0,0,.25);
    font-family:system-ui,-apple-system,Segoe UI,Roboto,Pretendard,Apple SD Gothic Neo,sans-serif;
  }
@media (min-width:1440px){
  .voc2025 {border-radius:var(--r);}

}

  .voc2025 .eyebrow{font-size:.85rem; letter-spacing:.12em; text-transform:uppercase; color:var(--key2); margin:0 0 .25rem;}
  .voc2025 .title{font-size:clamp(1.5rem,2.4vw,2rem); font-weight:700; margin:0 0 .5rem;}
  .voc2025 .lead{color:var(--dim); margin:.25rem 0 1rem; font-size:16px; line-height:1.7}

  .voc2025 .card{background:var(--card); border:1px solid var(--line); border-radius:12px; padding:1rem; }
  .voc2025 h3{font-size:1.05rem; margin:.25rem 0 .75rem; font-weight:800;}
  .voc2025 .steps{display:grid; gap:.6rem; margin:0; padding:0; list-style:none;}
  .voc2025 .step{display:grid; grid-template-columns:28px 1fr; align-items:center; gap:.6rem; }
  .voc2025 .step .dot{width:28px;height:28px;display:grid;place-items:center;border-radius:50%;
    background:linear-gradient(90deg,var(--key),var(--key2)); color:#0b1020; font-weight:900; font-size:.9rem}
  .voc2025 .step .txt{color:var(--ink)}

  .voc2025 .privacy{display:grid; gap:.5rem; color:var(--ink)}
  .voc2025 .privacy ol{margin:.25rem 0 0 1.1rem}
  .voc2025 .privacy li{margin:.25rem 0}
  .voc2025 .agree{display:flex; gap:.5rem; align-items:flex-start; margin-top:.5rem}
  .voc2025 .agree input{margin-top:.2rem}

  .voc2025 .cta{display:flex; gap:.75rem; align-items:center; justify-content:space-between; margin-top:1rem}
  .voc2025 .btn{
    appearance:none; border:2px solid transparent; background:linear-gradient(90deg,var(--key),var(--key2));
    color:#0a0f1f; font-weight:800; padding:.9rem 1.1rem; border-radius:12px; cursor:pointer; font-size:1.05rem;
  }
  .voc2025 .btn:hover{filter:brightness(1.05)}
  .voc2025 .btn[disabled]{opacity:.55; cursor:not-allowed}
  .voc2025 .btn:focus-visible{outline:3px solid var(--focus); outline-offset:2px}

  .voc2025 .help{color:var(--dim); font-size:.9rem}
  .voc2025 .sr-only{position:absolute;width:1px;height:1px;clip:rect(0 0 0 0);clip-path:inset(50%);overflow:hidden;white-space:nowrap}
  .voc-gate-form button {text-align: center; padding: 1em; margin:1em 0; width:100% ; max-width:400px; background: #fff; border-radius: 10px;}
  @media (prefers-reduced-motion: reduce){*{transition:none!important;animation:none!important}}







/*****************************************
*******   정보공개  >  정보공개제도   ***********
*****************************************/
.info_open_system_container{margin-top: 50px;}
.infoOpen{}
.infoOpen dl{position:relative; padding-left:112px; margin:0 0 46px;}
.infoOpen dl:focus-within{background:rgba(28,100,242,.06); border-radius:12px;}
.infoOpen dl::before{
  content:"";
  position:absolute; left:0; top:0;
  width:88px; height:88px;
  border-radius:22px;
  background-color:var(--bg-soft);
  background-repeat:no-repeat;
  background-position:center;
  background-size:60%;
}

.infoOpen dl:nth-child(1)::before{ background-image:url('../images/open_system_icon01.svg'); }
.infoOpen dl:nth-child(2)::before{ background-image:url('../images/open_system_icon02.svg'); }
.infoOpen dl:nth-child(3)::before{ background-image:url('../images/open_system_icon03.svg'); }
.infoOpen dl:nth-child(4)::before{ background-image:url('../images/open_system_icon04.svg'); }

/* 타이포 */
.infoOpen dt{font-size:1.375rem; line-height:1.3; font-weight:700; color:var(--text-blue); margin-bottom:.35rem;}
.infoOpen dd{font-size: 18px; margin:0; line-height:1.7; word-break:keep-all;}

.infoOpen_scope_list{margin:.75rem 0 0 1.25rem; padding-left:0;}
.infoOpen_scope_list li{margin:.25rem 0; color:var(--muted);}

.infoOpen dd > ol.infoOpen_scope_list,
.infoOpen dd > ol.infoOpen_scope_list > li{font-size: 16px; color: #686868; list-style: decimal !important;}
.infoOpen dd > ol.infoOpen_scope_list{padding-left: 1.25rem; margin: .75rem 0 0; list-style-position: outside;}
.infoOpen dd > ol.infoOpen_scope_list > li::marker{color: var(--brand);}

@media (max-width:1024px){
  .infoOpen dl{padding-left:104px;}
  .infoOpen dl::before{width:80px; height:80px; border-radius:20px;}
}

@media (max-width:768px){
	.infoOpen {background: var(--mobile-bg); padding: 20px 20px;}
	.infoOpen dl{background: #fff; border: 1px solid var(--gray1); padding: 30px 20px; border-radius: var(--radius); margin-bottom: 10px;}
	.infoOpen dl::before{position:static; display:block; margin-bottom: 20px; width: 76px; height: 76px; margin: 0 auto 16px auto; border-radius:14px; background-size:58%;}
	.infoOpen dt{font-size:1.20rem; margin:2px 0 6px;} /* 20px */
	.infoOpen dd{font-size:.95rem;}
}

@media (max-width:480px){
  .infoOpen dl{display:block;}
  .infoOpen dl::before{position:relative; display:block; border-radius:14px; background-size:56%;}
  .infoOpen dt{font-size: 1.20rem;} /* 18px */
  .infoOpen_scope_list{margin-left:1rem;}
}

@media (prefers-reduced-motion:reduce){
  *{animation:none !important; transition:none !important;}
}