@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css");
@font-face {
    font-family: 'NotoSerifKR';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_two@1.0/NotoSerifKR.woff') format('woff');
}

@font-face {
    font-family: 'Aggravo';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2108@1.1/SBAggroL.woff') format('woff');
    font-weight: 300;
 }

@font-face {
    font-family: 'Aggravo';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2108@1.1/SBAggroM.woff') format('woff');
    font-weight: 500;
}

@font-face {
    font-family: 'Aggravo';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2108@1.1/SBAggroB.woff') format('woff');
    font-weight: 700;
}

/* Common */
 * {outline:0 !important;}
html,body,h1,h2,h3,h4,h5,h6,div,p,blockquote,pre,code,address,ul,ol,li,menu,nav,section,article,aside,
dl,dt,dd,table,thead,tbody,tfoot,label,caption,th,td,form,fieldset,legend,hr,input,button,textarea,object,figure,figcaption {margin:0;padding:0;}
html, body{width:100%;}
/*html{-webkit-touch-callout:none; -webkit-user-select:none; -webkit-tap-highlight-color:rgba(0, 0, 0, 0);}*/
body{width:100%; background:#fff; min-width:320px; -webkit-text-size-adjust:none;word-wrap:break-word;word-break:break-all;}
body,input,select,textarea,button {border:none;font-size:18px; font-family: "Pretendard" !important;color:#222222;}
ul,ol,li{list-style:none; }
table{width:100%;border-spacing:0;border-collapse:collapse;}
img,fieldset{border:0;}
address,cite,code,em{font-style:normal;font-weight:normal;}
/*label,img,input,select,textarea,button{vertical-align:middle; cursor:pointer;}*/
.hide,caption,legend{line-height:0;font-size:1px;overflow:hidden;}
hr{display:none;}
main,header,section,nav,footer,aside,article,figure{display:block;}
a{color:#000;text-decoration:none !important;}
br{font-family:"돋움",Dotum !important;}
 
/* Form */
textarea { border:1px solid #dbdbdb;}
select { height:32px; font-size:13px; color:#373737; border:1px solid #e9e9e9; background:#fff;border-radius: 5px;}
input[type=tel],
input[type=time],
input[type=text],
input[type=password],
input[type=search],
input[type=email],
input[type=file], 
input[type=url],
input[type=number],
input[type=date],textarea {height:40px; font-size:13px; color:#555; border:1px solid #e9e9e9; background:#fff; border-radius: 5px; transition: all 0.5s; vertical-align:middle;}
input::-webkit-input-placeholder{color:#b5b5b5; font-size:12px; line-height:100%;}
textarea { padding:5px 0;}
select:focus,
textarea:focus,
input:focus { border: 1px solid #727272;}

input[type=tel][readonly],
input[type=text][readonly],
input[type=password][readonly],
input[type=email][readonly], 
input[type=search][readonly], 
input[type=tel][disabled],
input[type=text][disabled],
input[type=password][disabled],
input[type=search][disabled],
input[type=email][disabled]{background:#eaeaea; border-color:#c0c0c0; color:#666; -webkit-appearance:none;font-size:12px;}
textarea[readonly],
textarea[disabled]{font-size:14px; color:#666; font-weight:normal; line-height:140%; height:78px; background:#eaeaea;border:1px solid #c0c0c0;}

.clear {clear:both;}
.clear:after { content:""; display:block; clear:both;}

.align-center{text-align: center;}
.align-left{text-align: left;}
.align-right{text-align: right;}


.font-mj{font-family: 'NotoSerifKR', serif !important;}
.font-wt{font-weight: bold !important;}
.font-red{color: #FF0000;}
#daumRoughmapContainer1747355434148{ font-family:'Paperozi';}
.root_daum_roughmap .cont{display: none !important;}

.font-noto{ font-family: 'Noto Sans KR', sans-serif;}

/* CSS Document */

#wrap {
   margin: 0 auto;
  }
header {
   display: flex !important;
   justify-content:center;
   width: 100%;
   z-index: 20;
   background:#ffffff;
   box-shadow: 5px 2px 5px rgba(91, 91, 91, 0.45);
}

.fixed {
	position: fixed!important;
	animation: fixedd .5s 0s 1 ease-in-out forwards;
}
.fixed.roll {
    background: #ffffff;
	box-shadow: 5px 2px 5px rgba(91, 91, 91, 0.45);
 }

h1{display: flex;}

.navbar {
    padding: 0.8rem;
    width: 70% !important;
    display: flex !important;
    justify-content: space-between !important;
}
#top-nav .logo {position: absolute;left:3%; padding-top: 0.8em;}
#top-nav .openbtn, #top-nav .closebtn{ display: none;}

.container{ margin: 0 auto;}
.navbar-collapse{justify-content: center;}
.navbar-nav li{list-style-type:none;margin-right: 3rem !important;font-size: 20px; font-weight: 600; font-family: "Pretendard";}
.navbar-nav li a:hover{color: #44af35;}
.navbar-nav li i{display: none;}

.nav-item:hover .dropdown-menu{
	display: block !important;
}

.dropdown-menu{
	display: none;
    animation: menuAni 0.5s;}

@keyframes menuAni {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }

}

.navbar-light .navbar-nav .nav-link:hover,
.navbar-light .navbar-nav .nav-link:focus,
.navbar-light .navbar-nav .show>.nav-link,
.navbar-light .navbar-nav .active>.nav-link,
.navbar-light .navbar-nav .nav-link.show,
.navbar-light .navbar-nav .nav-link.active {
    color: #003173 !important;
}

.nav-item{margin-right:1.5rem !important }
.nav-item a{color: #333;}
.dropdown-item{font-size: 18px; line-height: 1.6em;}
.dropdown-menu{background-color:#fff !important;border: 0 !important;border: 2px solid #333333 !important;}
.dropdown-menu a{color: #333333;width: 97%;margin: 0 auto;text-shadow: 0 0 BLACK;font-family: 'Pretendard-Regular';}
.dropdown-menu a:last-child{ border-bottom: 0 !important;}
.dropdown-item:hover, .dropdown-item:focus {
  color: #fff !important;
  text-decoration: none;
  background-color: #333333 !important;
  width: 100%;
}

.top_sns{display: flex; /*padding-top: 1.2em;*/}
.top_sns li{ padding: 0 0.2em;}
.navbar-nav .sns-btn{display:none;}

.login{right:3%;top:50%;}
.btnlogin{border: 2px solid #004aad;
  border-radius:5px;
  background-color: #051a41;
  color: #ffffff;
  padding: 4px 8px;
  font-size: 14px;
  cursor: pointer;
  display: inline-block;
}
.btnlogin:hover{
  background: #ffffff;
  color: #018fd9;
}
aside{position: absolute;top: 40%;right: 0;width: 4%;text-align: center;}
.side-sns{position: fixed;}
.side-sns .go_sns{margin: 1em 0.5em;width: 60px; height:60px; background: #004aad; border-radius:50%;}
.side-sns .go_sns a{color: #fff; font-size:1.6em;}
.side-sns .go_sns i{ margin-top:0.7em;}
.side-sns .go_univ{width: 64px;height:72px;background: #004aad;color: #fff;padding: 10px;border-radius: 5px;line-height: 15px;font-size: 13px;} 
.side-sns .go_univ a{color: #fff;}
.side-sns .go_univ i{font-size: 32px; display: block;}
.side-sns .go_univ span{font-size: 10px;}
.menu_univ{display: none;}


.btnenter{border: 2px solid #21006e;
  border-radius:5px;
  background: #21006e;
  color: white;
  padding: 1% 2%;
  font-size: 18px;
  cursor: pointer;
  margin: 2em 0;
}

.btnenter:hover{border: 2px solid #21006e;
  background-color: white;
  color: #21006e;
}
.btnenter i{padding-left: 1em;}

.toggler_cont {
  display: inline-block;
  cursor: pointer;
}

.bar1, .bar2, .bar3 {
  width: 30px;
  height: 2px;
  background-color: #003173;
  margin: 6px 0;
  transition: 0.4s;
}

.change .bar1 {
  transform: translate(0, 9px) rotate(-45deg);
}

.change .bar2 {opacity: 0;}

.change .bar3 {
  transform: translate(0, -9px) rotate(45deg);
}


/* 메인페이지 */
/*#main-visual .carousel-item:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0.2) 0%, rgba(2, 17, 84, 0.5) 100%);
    z-index: 1;
}*/
#main-visual .carousel-item {
    width: 100%;
    height: 100vh; /* 반드시 높이를 지정해야 배경이 보입니다! */
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
#main-visual .carousel-item .btn-lg{font-size: 1rem;}
.main_bg01{background: url("../images/main.webp") no-repeat; background-size: cover;}

.carousel-caption h3 {
    font-size: 6vmin;
    font-weight: 800;
    color: #003b8a;
    letter-spacing: -1px;
	display: flex;
	flex-direction: column;
}
.carousel-caption h3 span{font-size: 3vmin; color: #004aac; font-weight: 600; margin-bottom: 0.5em;}
.carousel-caption h5{font-size: 4vmin; color: #000000; margin-top: 1em; font-weight: 700;}

#main_btn{width: 100%;/* position: absolute; */right: 0;/* bottom: 13%; */display: flex;cursor: pointer;justify-content: center;margin-top: 5em;}
#main_btn li{margin-right: 0.5em;}
#main_btn li:last-child{margin-right:0 !important;}
.btn-circle{
	background: #cfb17c;
	color: #5e3c00;
	width: 140px;
	height: 140px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 20px;
	font-weight: 700;
}
.btn-circle02{
	background: #ffffff;
	color: #5e3c00;
	width: 140px;
	height: 140px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 20px;
	font-weight: 700;
}
.btn-circle:hover, .btn-circle02:hover{
	background: #003173;
	color: #ffffff;
}

.blue-btn-circle{
	background: #004668;
	color: #ffffff;
	width: 140px;
	height: 140px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 20px;
	font-weight: 700;
}
.blue-btn-circle02{
	background: #ffffff;
	color: #004668;
	width: 140px;
	height: 140px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 20px;
	font-weight: 700;
}
.blue-btn-circle:hover, .blue-btn-circle02:hover{
	background: #005d82;
	color: #ffffff;
}

.main_title{position: absolute;top: 10em;display: flex;flex-direction:column;text-align: center;width: 100%;}

#main_date{background: #003173;padding: 3.5em 3em;}
#main_date ul{display: flex;gap: 25px;justify-content: center;}
#main_date li{width: 16.6%;background: #ffffff;border-radius: 10px;padding: 1.3em;font-size: 16px;}
#main_date li:hover{background: #fff5e9;}
#main_date dt{font-weight: 900;font-size: 20px;color: #003173;border-bottom: 1px solid #000000;padding-bottom: 10px;margin-bottom: 10px;font-family: 'Nanum Myeongjo';}
#main_date dd{margin-bottom: 0 !important;}

#main_info:before{
	top: 0;
	content: '';
	height: 900px;
	width: 100%;
	background: url('../images/vod_bg.webp') top left no-repeat;
	position: absolute;
	display: block;
	z-index: 0;
	right: 0;
	background-size: contain;
}
#main_info{text-align: center;background: linear-gradient(to bottom, #0b0365 50%, #020a31 80%);position: relative;padding: 10em 0;}
#main_info:after{
	bottom: 0;
	content: '';
	height: 900px;
	width: 100%;
	background: url('../images/vod03_bg.webp') bottom no-repeat;
	position: absolute;
	display: block;
	z-index: 0;
	background-size: contain;
}


.poster_info{padding: 5em 7em;background: #ffffff;/*display: block;*/border-radius: 1em;}
.poster_info h3{font-family: 'RiaSans-ExtraBold';  color: #29b963; text-align: center; font-size: 3.5vmin; margin-bottom: 1em; text-shadow: none !important; margin: 0.5em 0 1em 0; font-weight: 500;}
.poster_info h3:before {content: open-quote; color: #29b963; font-family:auto;}
.poster_info h3:after {content: close-quote; color: #29b963; font-family:auto;}
.poster_info p { color: #ffffff; font-size: 2.2vmin; padding-bottom: 2em; text-align: center; line-height: 1.3em;}

.poster_cont{display: flex;}
.poster_cont .left {text-align: center;}
.poster_cont .left img{width: 100%; border-radius: 10px;box-shadow: rgba(0, 0, 0, 0.4) 0px 2px 5px;}
.poster_cont .right div{ width: 100%; margin: 0 auto;}
.poster_cont .right dd div{width: 100% !important;}

.sub_cont .poster_info{padding: 1em 0;background: #ffffff;}

.info_txt{font-size: 22px;line-height: 28px;display: flex;align-items: center;}
.info_txt dl{display: flex;flex-direction: row;border-bottom: 1px solid #d5d5d5;align-items: baseline;padding: 0.3em 0;}
/*.info_txt dl:last-child{margin-bottom: 0 !important;}*/
.info_txt dt{width: 180px;height: 50px;background: #003173;/* padding: 10px 0; */color: #fff;/* border-radius: 5px; *//* text-align: center; */display: flex;justify-content: center;flex-direction: column;text-align: center;border-radius: 2em;font-size: 20px;}
.info_txt small{font-size: 18px !important; line-height: 19px !important;}
.info_txt dd{padding: 0.6em;text-align: left;margin-bottom: 0;line-height: 1.5em;width: 100%;}





.red_txt{background: #d02e28; color: #fff; padding: 1em 0; text-align: center; font-size: 14px; line-height: 20px;} 

/* 섹션 전체 배경 및 정렬 */
.youtube-section {
  display: flex;
  justify-content: center;
  width: 90%;
  margin: 0 auto;
}

/* 영상을 감싸는 부드러운 카드 디자인 */
.video-card {
  width: 100%;
  max-width: 1000px; /* 영상이 너무 커서 부담스럽지 않게 최대 크기 제한 */
  background: #ffffff;
  border-radius: 20px; /* 모서리를 둥글게 깎아 트렌디한 느낌 부여 */
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08); /* 부드러운 그림자 효과 */
  overflow: hidden; /* 내부 요소가 라운드를 벗어나지 않도록 */
  transition: transform 0.3s ease;
  z-index: 10;
}

/* 마우스를 올렸을 때 살짝 떠오르는 효과 */
.video-card:hover {
  transform: translateY(-5px);
}

/* ★ 중요: 16:9 반응형 비율 유지 구조 */
.video-container {
  position: relative;
  width: 100%;
  padding-bottom: 56.25%; /* 16:9 비율 (9 / 16 = 0.5625) */
  height: 0;
  background-color: #000; /* 영상 로딩 전 검은 배경 */
}

.video-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: none;
}

/* 하단 푸터 영역 */
.video-footer {
  padding: 20px;
  background-color: #fafafa;
  text-align: center;
  border-top: 1px solid #f0f0f0;
  font-size: 15px;
  color: #666;
}

#spon{background: #f7f7f7;padding: 5em 0 4em 0;}

/*.sponsor{display: flex;}*/
.sponsor dl {display: flex;align-items: center;margin-bottom: 2em; flex-direction: column;}
.sponsor h4{font-weight: 600;font-size: 20px;color: #003173;}
.sponsor span{background: #003173;display: block;height: 2px;margin: 0.5em auto;overflow: hidden;position: relative;width: 30px;}
.sponsor h6{font-size: 16px; color: #666666;} 
.sponsor dd img{padding: 10px;}
.sponsor dt{font-size: 18px;margin-right: 5px;/* width: 90px; *//* background: aliceblue; */border-radius: 3px;color: #003173;;padding: .5em;text-align: center;}
.sponsor dd{width: 100%;display: flex;justify-content: center;flex-direction: row;padding-top: 0.5em;flex-wrap: wrap;}
/* //메인페이지 */



/* 서브페이지 */
#sub-visual{height: 400px;background: #fbfbfb;padding-top: 15em;background: url("/images/sub.webp") no-repeat center bottom; background-size: 100%;}
.sub_logicon{position: absolute;left: 5%;top: 15%;}
.sub_banner{ display: flex; justify-content:center;}
.banner_heading{
	font-weight:600;
	font-size:2em;
	color: #effaff;
	padding-top:3.5%;
	text-transform: uppercase;
	text-shadow: 2px 2px 2px #002a34;
} 
.banner_date{
	font-weight: 600;
	font-size: 1.4em;
	color: #ffffff;
	padding-top: 8.5%;
	text-shadow: 1px 1px 1px #111111;
	text-align: center;
} 

.subnav {width:100%;}
.subnav ul {width:100%; overflow:hidden;display: flex;justify-content: center;}
.subnav li {float:left; font-size: 18px;line-height:1.5em;font-weight:bold;color:#383838;text-align:center;/* border-right:1px solid #cecece; */ overflow:hidden;}
.subnav ul.col2 li {width:50%;}
.subnav ul.col3 li {width:33.33%;}
.subnav ul.col4 li {width:25%;}
.subnav ul.col5 li {width:20%;}
.subnav ul.col6 li { width:16.7%;}
.subnav ul.col7 li { width:14.2%;}
.subnav ul.col8 li { width:12.5%;}

.side-menu{background: #004aad;}
.side-menu .sub-menu01{display: flex; justify-content: center; font-size: 20px;}
.side-menu .sub-menu01 li{padding: 1.3em 0.5em;font-weight: 400;border-right: 1px solid #003883;}
.side-menu .sub-menu01 li:first-child{border-left: 1px solid #003883;}
.side-menu .sub-menu01 li a{color: #ffffff;}
.side-menu .sub-menu01 .on{background: rgba(39, 39, 39, 0.26); font-weight: bold;} 
.side-menu .sub-menu01 .on a, .side-menu .sub-menu01 li a:hover{color: #ffffff;}

.sub-menu02{display: none;cursor: pointer;}
.sub-menu02 span{color: #003173; font-size: 20px;}
.sub-menu02 i{float: right;}
.sub-menu02 .subdrop-menu{display: none; border-bottom: 1px solid #ddd;background:#fff; border-radius: 0px; width: 100%; position: absolute;left: 0px; margin-top: 1.6em; z-index: 100;padding: 1.2em 0;}
.sub-menu02 .subdrop-menu li{ padding: 0.6em 1.2em; font-size: 18px;}
.sub-menu02 .subdrop-menu a{color: #666;}
.sub-menu02 .subdrop-menu li:hover{background: #fafafa;}


.subpage{padding:5em 0; font-weight: 400;}
.heading-agileinfo {
    font-weight: 900;
    font-size: 2.5em;
    text-align: center;
    color: #003173;
    margin-bottom: 0.5em;
	font-family: "Pretendard";
	text-transform: uppercase;
}
.sub_cont {padding: 0 0 3em 0; word-break:keep-all;}
.sub_cont02 {padding: 60px; word-break:keep-all; background-color: #fdfdfd; border-radius:1em;}
.sub_cont .row{margin: 0;}
.sub_cont h4{color: #003173;font-size: 28px;font-weight: 600;margin-bottom: 0;}
.classic_info h4{ color: #003173;font-size: 28px;font-weight: 600;margin-bottom: 0; text-align: center;}
.classic_info p{font-size: 20px !important;}

.sub_tab {
  overflow: hidden;
  border: 1px solid #d8d8d8;
  background-color: #fff;
  margin: 2em 0;
}
.b_05 button{ width: 20%;}
.b_04 button{ width: 25%;}
.b_03 button{ width: 33.333%;}
.b_02 button{ width: 50%;}
.sub_tab button{
  background-color: inherit;
  float: left;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 20px 0;
  transition: 0.3s;
  font-size: 18px;
  border-right: 1px solid #d8d8d8;}
.sub_tab button:last-child{border-right:none;}
.sub_tab button:hover {
  background-color: #F7F7F7;
}
.sub_tab button.active {
  background-color: #004aad;
  color: #fff;
}

.info_table table{ 
	 border-collapse: collapse;
	 width: 100%;
	 border-top: 2px solid #d1d1d1;
	 border-bottom: 2px solid #d1d1d1;
	 line-height: 20px;
	 text-align: center;
}

.info_table th{padding: 15px;border: 1px solid #d1d1d1;background: #f9f9f9;color: #474747; font-size: 20px;} 
.info_table td{padding: 15px;border: 1px solid #d1d1d1;background: #ffffff;font-size: 20px;line-height: 25px;}
.info_table td:hover {
    background-color: #fffbf4;
}


.handi{border: 1px solid #d1d1d1;font-size: 18px;line-height: 30px;color: #333333; word-break: break-all;}
.handi_title{ background: #003173; color: #ffffff; font-size: 20px; text-align: center;}
.handi table{word-break:keep-all;}
.handi li{padding: 1em 1.5em; border-bottom: 1px solid #d1d1d1;}
.handi h5{width: 250px;margin: 0 auto;background: #272627;color: #ffffff;text-align: center;padding: 0.5em;border-radius: 2em;}
.hand_last{line-height: 22px;}

.session_title{font-size: 30px; font-weight: 600; text-align: center; margin-bottom: 1em;}
.session_title span {
	background: #004aad none repeat scroll 0 0;
	display: block;
	height: 2px;
	margin: 10px auto 0.5em;
	overflow: hidden;
	position: relative;
	width: 50px;
}
.session_subtitle{text-align:center;font-weight:bold; margin-bottom:2em;}
.subtabcontent {
  display: none;
}
.subtabcontent h3{text-align: center;margin-bottom: 0.3em;font-size: 20px;color: #004aad;}
.subtabcontent table {
  border-collapse: collapse;
  width: 100%;
  border-top: 1px solid #e5e5e5;
  border-bottom: 1px solid #e5e5e5;
}

.subtabcontent th, .subtabcontent td {
  text-align: left;
  padding: 12px;
  border-bottom: 1px solid #e5e5e5;
}
.subtabcontent th{ width: 25%; background: #F7F7F7; text-align: center;}
.subtabcontent details{color: #999; cursor: pointer;}
.subtabcontent details > summary {
  border: solid 1px #eee;
  margin-top: 1em;
  padding: 5px 10px;
  width: 76px;
  font-size: 14px;
  border-radius:5px;
}
.subtabcontent details ul{padding: 10px; width: 100%;}
.subtabcontent details li{display: flex;}
.subtabcontent details span {width: 10%; color: #636363;}
.subtabcontent details p{width: 90%;}
.subtabcontent details .s02 span {width: 18%;}
.subtabcontent details .s02 p{width: 82%;}

.info_title{display: flex;border-bottom: none !important;padding-bottom: 0 !important;}
.info_title .alert{ margin: 0 auto; width: 100%; text-align: center;}

.info_photo{display: flex;}
.info_photo .photo_name{padding-left: 5px;display: table-cell;vertical-align: bottom;height: 130px;}
.info_photo dl{margin: auto 0 auto 20px; width: 100%;}
.info_photo dt{font-size: 30px; padding-left: 10px; color:#003173; margin-bottom: 15px;}
.info_photo dt span{ font-size: 16px; color: #666; padding-left: 10px;font-weight: 500;}
.info_photo dd{background: #f7f7f7; padding: 20px; width: 100%;}


.message h3{font-family: 'NotoSerifKR', serif !important;font-weight: bold !important;margin: 2em 0 !important;text-align: center;font-size: 28px;}
.message ul{display: flex; margin-top: 2em; justify-content:space-between;}
.message_photo{ width: 30%; padding-right: 1em;}
.message_txt01{ width: 70%;}
.message_txt01 p{font-weight: bold; margin-top:1em; font-family: 'NotoSerifKR'; font-size: 18px;}
.message_txt01 span{font-size: 15px; margin-right: 0.3em;}
.message_txt01 .font-bm{font-family: 'NotoSerifKR'; font-size: 22px; margin-top:0; margin-bottom: 1em; font-weight: 400;}

/* 글로벌 그라운드 소개*/
/* 상단 소개 영역 */
.intro-header {
    text-align: center;
    margin: 0 auto 60px auto;
}
.sub-title {
    display: inline-block;
    font-size: 14px;
    font-weight: 700;
    color: #0056b3; /* KNN 브랜드 아이덴티티 반영 블루 */
    letter-spacing: 2px;
    margin-bottom: 15px;
}
.main-title {
    font-size: 45px;
    font-weight: 700;
    color: #000e21;
    line-height: 1.4;
    margin-bottom: 40px;
    word-break: keep-all;
    font-family: 'Aggravo';
}
.desc-box p {
    margin-bottom: 20px;
    word-break: keep-all;
}
.desc-box p:last-child {
    margin-bottom: 0;
}

/* 구분선 */
.divider {
    border: 0;
    height: 1px;
    background: #e0e0e0;
    margin: 60px 0;
}

/* 핵심 가치 영역 */
.value-section {
    width: 100%;
}
.section-title {
    font-size: 24px;
    font-weight: 700;
    color: #111;
    text-align: left;
    margin-bottom: 10px;
    position: relative;
}
/* 핵심 가치 그리드 레이아웃 */
.value-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}
.value-card {
    background: #ffffff;
    border: 1px solid #eaeaea;
    border-radius: 12px;
    padding: 40px 30px;
    text-align: center;
    transition: all 0.3s ease;
    box-shadow: 0 4px 6px rgba(0,0,0,0.02);
}
.value-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 12px 20px rgba(0, 86, 179, 0.1);
    border-color: #0056b3;
}

/* 카드 내부 스타일 */
.card-icon {
    margin-bottom: 20px;
}
.icon-text {
    font-size: 20px;
    font-weight: 800;
    color: #0056b3;
    letter-spacing: 1px;
    background: #e6f0fa;
    padding: 8px 20px;
    border-radius: 30px;
    display: inline-block;
	font-family: 'Aggravo';
}
.card-content h4 {
    font-size: 22px;
    color: #111;
    margin-bottom: 15px;
}
.card-content p {
    font-size: 16px;
    color: #666;
    word-break: keep-all;
}
/* // 글로벌 그라운드 소개 끝*/


.summary h3{font-size: 38px;text-align: left;font-weight: 700; color: #000000;}
.summary h4{color: #003173;font-size: 24px;font-weight: 600;margin-bottom: 0.3em;}

.fmc-business-section {
  padding: 100px 0;
  background-color: #f8fafc; /* 완전 백색 대신 미세한 회색조로 카드가 도드라지게 처리 */
  border-radius: 1em;
  margin-top: 1em;
}
.business-container {
  max-width: 1100px; /* 양옆 공간을 넓혀 와이드한 안정감 부여 */
  margin: 0 auto;
}

.business {
  display: flex;
  padding: 50px 0 !important;
  flex-direction:row;
  border-bottom: 1px solid #e1e1e1;
}
.business:last-child{border-bottom: none !important;}

.business-item {
  position: relative;
  width: 100%; /* 이미지 크기에 맞게 조절 */
  height: 300px;
  border-radius: 20px;
  overflow: hidden;
  cursor: pointer;
  /* 기본 상태: 투명한 테두리를 미리 그려서 호버 시 덜덜거림 방지 */
  transition: all 0.3s ease;
  background-color: #1d201f;
}

.business-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0.6; /* 기본적으로 약간 어둡게 */
  transition: all 0.3s ease;
}

.business-overlay {
  position: absolute;
  top: 0;
  left: 0; /* absolute 사용 시 좌측 기준점도 명확히 잡아주는 것이 좋습니다 */
  width: 100%;
  height: 100%; /* ★ 이 부분을 추가해 보세요! */
  color: #fff;
  text-shadow: 1px 1px 2px black;
  padding: 2em;
  display: flex;
  flex-direction: column;
  text-align: center;
  justify-content: center;
}

.business-overlay .title {font-size: 28px;font-weight: bold;line-height: 1.2em;}
.business-overlay .content{ font-size: 20px;}

.business .project{ display: flex; justify-content: center; flex-direction:column;}
.business .project h6{color: #838383;font-size: 14px;}
.business .project h4{font-weight: 800;}
.business .project h5{font-weight: 600;}
.business.reverse{flex-direction: row-reverse !important;}

/*연혁*/
.fmc-history-section {
  padding: 100px 0;
  background-color: #f8fafc; /* 완전 백색 대신 미세한 회색조로 카드가 도드라지게 처리 */
  border-radius: 1em;
  margin-top: 1em;
}

.timeline-container {
  max-width: 1100px; /* 양옆 공간을 넓혀 와이드한 안정감 부여 */
  margin: 0 auto;
  padding: 0 20px;
}

/* 상단 타이틀 풍성하게 보완 */
.section-title-wrap {
  margin-bottom: 60px;
  text-align: left;
}

.section-main-title {
  font-size: 32px;
  font-weight: 700;
  color: #021739;
  margin: 0 0 10px 0;
  letter-spacing: -1px;
}

.section-sub-title {
  font-size: 20px;
  color: #5b5b5b;
  margin: 0;
  font-weight: bold;
}

.timeline-wrapper {
  position: relative;
}

/* 중앙 수직 타임라인 축 라인 */
.timeline-wrapper::before {
  content: '';
  position: absolute;
  top: 0px;
  left: 146px;
  width: 2px;
  height: calc(100% - 5px);
  background: linear-gradient(to bottom, #cbd5e1, #e2e8f0); /* 선에도 그라데이션 적용 */
}

/* 개별 행 구조 */
.timeline-block {
  display: flex;
  align-items: stretch; /* 카드 높이가 제각각이어도 축이 고르게 유지되도록 변경 */
  position: relative;
  margin-bottom: 24px;
}

.timeline-block:last-child {
  margin-bottom: 0;
}

.timeline-block-gap {
  height: 40px;
}

/* 왼쪽 날짜 정렬 영역 */
.timeline-date-zone {
  flex: 0 0 120px;
  display: flex;
  align-items: baseline;
  justify-content: flex-end;
  gap: 12px;
  padding-top: 22px; /* 카드 안쪽 패딩과 정렬 일치 */
}

.timeline-date-zone .year {
  font-size: 24px;
  font-weight: 700;
  color: #003173;
  line-height: 1;
  min-width: 58px;
  text-align: right;
}

.timeline-date-zone .year.empty {
  display: inline-block;
  visibility: hidden;
}

.timeline-date-zone .month {
  font-size: 22px;
  font-weight: 700;
  color: #4b4b4b;
  line-height: 1;
}

.timeline-date-zone.font-highlight .month {
  color: #003173;
}

/* 노드 원형 영역 */
.timeline-line-zone {
  flex: 0 0 52px;
  position: relative;
}

.line-node {
  position: absolute;
  top: 25px; /* 날짜선 중앙에 안착 */
  left: 22px;
  width: 10px;
  height: 10px;
  background-color: #ffffff;
  border: 3px solid #cbd5e1;
  border-radius: 50%;
  z-index: 2;
  transition: all 0.3s ease;
}

.line-node.highlight {
  border-color: #003173;
  background-color: #003173;
}

/* [핵심 핵심] 우측 텍스트 내용 카드 박스형 리디자인 */
.timeline-content-zone {
  flex: 1;
}

.history-card {
  background-color: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  padding: 22px 28px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.02); /* 보이지 않는 부드러운 그림자 */
  transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}

/* 마우스 올리면 사진 없이도 인터랙티브하게 공간감 부여 */
.history-card:hover {
  transform: translateX(6px); /* 우측으로 스르륵 밀림 */
  border-color: #cbd5e1;
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.05);
}

/* 마지막 중요 성과 카드 디자인 차별화 (네이비 포인트 테두리) */
.important-card {
  border: 2px solid #003173;
  background: linear-gradient(135deg, #ffffff 0%, #f0f4f8 100%); /* 미세한 푸른 그라데이션 */
}

.important-card:hover {
  border-color: #003173;
  box-shadow: 0 12px 25px rgba(0, 44, 95, 0.08);
}

/* 상세 연혁 글자 정렬 */
.content-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.content-list li {
  font-size: 16px;
  color: #192740;
  font-weight: 600;
  line-height: 1.5;
  word-break: keep-all;
}

/* 부연 설명 텍스트는 색을 옅게 해 대비 극대화 */
.content-list li.text-sub {
  font-size: 16px;
  color: #4b4b4b;
  font-weight: 500;
}

.content-list li.important-text {
  font-size: 18px; /* 메인 텍스트보다 살짝 더 큼 */
  color: #003173;
  font-weight: 700;
}

/* // 연혁 */

/* 조직도 */

.fmc-organization-section {
  padding: 100px 0;
  background-color: #f8fafc;
  border-radius: 1em;
  margin-top: 1em;
}

.org-container {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 20px;
}

.section-title-wrap {
  margin-bottom: 60px;
  text-align: left;
}

.section-main-title {
  font-size: 32px;
  font-weight: 700;
  color: #021739;
  margin: 0 0 10px 0;
  letter-spacing: -1px;
}

.section-sub-title {
  font-size: 15px;
  color: #64748b;
  margin: 0;
}

.org-tree-wrapper {
  position: relative;
  width: 100%;
  max-width: 800px;
  margin: 0 auto;
}

.org-tree-wrapper::before {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  width: 2px;
  height: 100%;
  background-color: #cbd5e1;
  transform: translateX(-50%); /* 정확한 하프 픽셀 정렬 */
  z-index: 1;
}


.org-row {
  display: flex;
  position: relative;
  width: 100%;
  margin-bottom: 60px; 
  z-index: 2;
}

.org-row:last-child {
  margin-bottom: 0;
}

/* 1단 정렬 (중앙 배치) */
.org-row.single-node {
  justify-content: center;
}

/* 2단 정렬 (좌우 대칭 분할) */
.org-row.double-node {
  justify-content: space-between;
}

/* 2단 카드 각각을 감싸는 박스 - 정확히 50%에서 여백을 제외한 만큼 차지 */
.org-row.double-node .org-card-wrap {
  width: calc(50% - 20px); /* 가로 여백 40px의 절반인 20px씩 차감 */
}

/* [중요] 2단 구조에서 좌우 카드를 수평으로 이어주는 가로선 칼각 배치 */
.org-row.double-node::before {
  content: '';
  position: absolute;
  top: 50%; /* 카드의 border 테두리 시작선과 일치 */
  left: 25%; /* 왼쪽 카드의 중심점 */
  width: 50%; /* 오른쪽 카드의 중심점까지 연결 */
  height: 2px;
  background-color: #cbd5e1;
  z-index: -1;
}

/* 개별 카드 컴포넌트 스펙 */
.org-card {
  position: relative;
  background-color: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  padding: 24px 30px;
  text-align: center;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.02);
  transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  box-sizing: border-box;
  width: 100%;
}

/* 1단 카드 가로폭 제한 (중앙 균형감) */
.org-row.single-node .org-card {
  max-width: 360px;
}
.org-row.single-node .primary-card {
  max-width: 450px;
}

/* 호버 이펙트 (라인 정렬에 영향을 주지 않도록 그림자 위주 제어) */
.org-card:hover {
  transform: translateY(-4px);
  border-color: #cbd5e1;
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.06);
}

/* 테두리 포인트 강조형 */
.leader-card { border: 2px solid #e05e5e; }
.primary-card { border: 2px solid #003173; }

/* 배지 스타일 */
.badge-tag {
  display: inline-block;
  font-size: 11px;
  font-weight: 700;
  color: #e05e5e;
  background-color: #fef2f2;
  padding: 4px 10px;
  border-radius: 20px;
  margin-bottom: 12px;
  letter-spacing: 0.5px;
}
.badge-tag.accent { color: #2563eb; background-color: #eff6ff; }
.badge-tag.gray { color: #475569; background-color: #f1f5f9; }
.badge-tag.navy { color: #ffffff; background-color: #003173; }
.badge-tag.purple {color: #003173;background-color: #e4e1ff;}
.badgefont-02{font-size: 14px !important;}

.position-title {
  font-size: 18px;
  font-weight: 700;
  color: #021739;
  margin: 0;
  letter-spacing: -0.5px;
}
.primary-card .position-title { color: #003173; }

/*  // 조직도 */

/* 조직도 구성 */

.table-container {
  max-width: 1100px;
  margin: 80px auto 0 auto;
  padding: 0 20px;
}
.section-title-wrap {
  margin-bottom: 40px;
  text-align: left;
}

.section-main-title {
  font-size: 32px;
  font-weight: 700;
  color: #021739;
  margin: 0 0 10px 0;
  letter-spacing: -1px;
}

.section-sub-title {
  font-size: 15px;
  color: #64748b;
  margin: 0;
}

.fmc-table-wrapper {
  background-color: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.02);
  overflow: hidden;
}

.member-status-table {
  width: 100%;
  border-collapse: collapse;
  text-align: center;
}

.member-status-table th {
  background-color: #003173;
  color: #ffffff;
  font-size: 16px;
  font-weight: 700;
  padding: 18px 10px;
  letter-spacing: -0.5px;
}

.member-status-table td {
  padding: 16px 15px;
  font-size: 16px;
  color: #334155;
  border-bottom: 1px solid #edf2f7;
  border-right: 1px solid #edf2f7;
  vertical-align: middle;
  background-color: #ffffff; /* 모든 셀 기본 바탕을 흰색으로 고정 */
}

.member-status-table td:last-child,
.member-status-table th:last-child {
  border-right: none;
}

.member-status-table tr:last-child td {
  border-bottom: none;
}

/* 직위 열 글자 포인트 색상 유지 */
.position-cell {
  color: #003173 !important;
  font-weight: 700;
}

.name-cell {
  font-weight: 500;
  color: #021739;
}

.dept-cell {
  color: #475569;
}

/* // 조직도 구성 */


/* 정관 */
.statute-container {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 20px;
  display: flex;
  gap: 40px; /* 목차와 본문 사이의 간격 */
}

/* 상단 메인 타이틀 스펙 */
.statute-header {
  max-width: 1100px;
  margin: 0 auto 50px auto;
  padding: 0 20px;
  text-align: left;
}

.statute-main-title {
  font-size: 32px;
  font-weight: 700;
  color: #09244B; /* KNN 메인 딥 네이비 */
  margin: 0 0 10px 0;
  letter-spacing: -1px;
}

.statute-sub-title {
  font-size: 15px;
  color: #64748b;
  margin: 0;
}

.statute-content-paper {
  flex-grow: 1;
  background-color: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 1em;
  padding: 50px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.02);
}

/* 장(Chapter) 타이틀 디자인 */
.chapter-title {
  font-size: 20px;
  font-weight: 700;
  color: #09244B;
  background-color: #f1f5f9;
  padding: 12px 20px;
  border-radius: 6px;
  margin: 50px 0 25px 0;
  border-left: 5px solid #09244B;
  scroll-margin-top: 40px; /* 링크 이동 시 댕강 잘리지 않게 상단 여백 보정 */
}

.chapter-title:first-of-type {
  margin-top: 0; /* 첫 번째 장은 상단 마진 초기화 */
}

/* 조(Article) 타이틀 디자인 */
.article-item {
  margin-bottom: 30px;
  padding: 0 20px;
}

.doc-article {
      font-size: 15px;
      word-break: keep-all;
    }
.doc-article:last-child {
      margin-bottom: 0;
    }
    /* 조항 제목 볼드 처리 및 띄어쓰기 여백 */
.doc-article .article-title {
      font-weight: 700;
      color: #021739;
      margin-right: 8px;
}

.article-title {
  font-size: 16px;
  font-weight: 700;
  color: #021739;
  margin: 0 0 10px 0;
}


/* 항 및 호 내용 서체 정의 */
.article-text {
  font-size: 15px;
  margin: 0 0 8px 0;
  padding-left: 4px;
}

/* 내부 리스트(①, 1. 등) 정렬 구조화 */
.sub-list {
  list-style: none;
  padding-left: 20px !important;
  margin: 5px 0;
}

.sub-list li {
  font-size: 15px;
  margin-bottom: 6px;
  text-indent: -20px;
  padding-left: 20px;
}

.sub-list li span.bullet {
  font-weight: 500;
  color: #09244B;
  display: inline-block;
  width: 20px;
  text-align: end;
  padding-right:3px;
}

/* 부칙 발기인 서명 엠블럼 박스 */
.signature-box {
  margin-top: 40px;
  padding: 20px;
  background-color: #f8fafc;
  border: 1px dashed #cbd5e1;
  border-radius: 6px;
  text-align: center;
  font-weight: 500;
  color: #475569;
}



.program table{
	  border-collapse: collapse;
	  width: 100%;
	  border-top: 1px solid #e5e5e5;
	  border-bottom: 1px solid #e5e5e5;
	  border: 1px solid #e5e5e5;
	  font-size: 16px;
	  min-width: 500px;
	  margin-bottom: 2em;
	  line-height: 22px;
}
.program th, .program td {
  padding: 15px 10px;
  border-bottom: 1px solid #e5e5e5;
  border-right: 1px solid #e5e5e5;
  text-align: center;
}
.program th{background: #004aad; color: #fff;}
.program dl{ text-align: left; display: flex;margin: 0;}
.program dt{ margin-right: 10px;}
.program dd{margin: 0;}


.place_txt{padding: 15px 0; border: 1px solid #b9a79f;background: #fffbf4; font-size: 20px; text-align: center; margin-top: 0.5em;}


.partner .row{margin: 0;}
.partner h3{font-size: 24px;}
.partner-list{padding-bottom: 2em;}
.partner-list li{border: 1px solid #b9a79f; margin:0.5em 1em 0.5em 0 !important; width: 30%; text-align: center; padding: 1.5em 0; cursor:pointer;}
.partner-list li:hover{background: #fffbf4;}
.partner-list li p{height: 39px; margin-bottom: 0 !important; display:flex; justify-content: center; align-items: center; font-size:20px;}

.history_btn {text-align: center;}
.history_btn .btn-outline-dark{color: #a2a2a2 !important;border: none;font-size: 20px;}
.history_btn .btn{padding: 0.6em !important;}
.history_btn .btn:hover, .history_btn .btn:focus, .history_btn .btn:active{color: #987029 !important; background: none !important;}
.history_btn .btn-outline-dark-on{
  color: #987029;
  border-bottom: 2px solid;
  border-radius: 0;
  font-size: 20px;  
}
.history_btn .btn-outline-dark-on:focus, .history_btn .btn-outline-dark-on:active, .history_btn .btn-outline-dark-on:checked {border-top: none;  border-top: none;  border-left: none;  border-right: none; border-bottom: 2px solid;}

.history_txt{font-weight: 400;text-align: center;border: 1px solid #ededed;padding: 3em;margin-bottom: 2em !important;}
.history_txt img{width: 100%;}
.history-info {padding: 0 2em;font-size: 18px;}
.history-info dl{display: flex;flex-direction: row;border-bottom: 1px solid #d5d5d5;padding: 0.5em 0;}
.history-info dt{width: 120px;height: 40px;background: #003173;/* padding: 10px 0; */color: #fff;/* border-radius: 0; *//* text-align: center; */display: flex;justify-content: center;flex-direction: column;text-align: center;border-radius: 2em;}
.history-info dd{text-align: left;padding: 10px;}
.history-info .session{line-height: 1.5em !important;}
.history-info .session p{font-size: 16px;color: #616161;border: solid 1px #e6e6e6;padding: 20px;background: #fdfdfd;margin-top: 10px;}
.history-info .session b{ color: #987029; width: 70px;}
.history-info .session span{padding-left: 4em;}
.history_vod{ height: 600px;}

.history-gallery{border-bottom: 1px solid #e3e3e3; padding: 2em 0;}
.history-gallery a{ padding-top: 10px;}
.history-gallery .col-sm-3{padding: 5px;}
.img-history{ width: 100%;}


.live_title{ background: #004aad; color: #dbf2ff; padding: 1em 0; text-align: center; border-radius: 5px;  margin-bottom: 5px;}
.live{ display: flex; height: 460px;}
.live_vod{ width: 68%; height: 100%; margin-right:2%;}
.live_text{ width: 30%; border: solid 1px #d8d8d8;}
.live_text .scroll{ width: 100%; height: 370px; overflow-y: scroll; background: #f7f7f7; font-size: 13px; font-weight: 400; border-bottom: solid 1px #d8d8d8;}
.live_text .scroll::-webkit-scrollbar {
    width: 10px;
  }
.live_text .scroll::-webkit-scrollbar-thumb {
    background-color: #c8c8c8;
    border-radius: 8px;
  }
.live_text .scroll::-webkit-scrollbar-track {
    background-color: #ededed;
	border-radius: 6px;}
.live_text .scroll li{margin: 8px 12px;}
.live_text .scroll .chat{border: 1px solid #dedede;
  background-color: #fff;
  border-radius: 5px;
  padding: 10px;
  margin: 3px 0 10px 0;
  display: flex;
}
.live_text .scroll .time-right {
  margin-left: 5px;
  color: #aaa;
}
.chat_info{background:#e6e6e6;text-align: center;font-size: 14px;padding: 10px 0;z-index: 5;color: #4c4c4c;font-weight: 500;}
.live_text .chat_area{ padding: 5px; width: 79% !important; float: left;}
.live_text .chat_name{ 
	width: 100%;
	height:20px;
    padding: 5px;
	font-size: 12px;
	color: #666;
    border: 1px solid #e9e9e9;
	resize:none;
	font-weight: 400;
	margin-bottom: 5px;
}
.live_text .chat_write{ 
	width: 100%;
	height: 50px;
    padding: 5px;
	font-size: 12px;
	color: #666;
	border: 1px solid #e9e9e9;
    resize:none;
	font-weight: 400;
}

.chat_write_enter{
  border-radius:5px;
  background: #004aad;
  color: white;
  padding: 3%;
  font-size: 12px;
  cursor: pointer;
  letter-spacing: 2px;
  margin: 5px 5px 0 0;
  float: right;
  height:78px;
}

.year_bar{margin-bottom: 1em;width: 100%;text-align: end;}
.year_bar select {background: #000 url("/images/select_bg.jpg") no-repeat right;font-size: 16px;color: #fff;border: 0; border-radius:5px;padding: .7em;width: 240px; appearance:none;height: 50px;}

.contact{ gap:20px; display: flex;}
.fmc-contact-section {
  padding: 2em;
  background-color: #f8fafc; /* 완전 백색 대신 미세한 회색조로 카드가 도드라지게 처리 */
  border-radius: 1em;
  margin-top: 1em;
}
.contact li{width: 50%;font-size: 22px;font-weight: 600;}

/* //서브페이지 */



footer {
	background: #222222;
	padding: 20px 0;
	text-align: center;
	color: #AAAAAA;
	font-size: 12px;
}
footer .footer-grid{ border-bottom: 1px solid #494949; padding-bottom: 1rem; }
.footer-grid ul{ display: flex; justify-content: space-around; margin-bottom: 1em; align-items:center;}
.footer-grid li a{display:block; padding:.5rem 1.25rem; background:#575757; color:#adb5bd; font-size:12px;margin-top:2em; border-radius: 2px;}
.footer-grid .copy{text-align: left; width: 65%; display: flex; justify-content: flex-start;}
.footer-grid .copy div{ margin-right: 1em;}
.footer-grid .copy span:after{width:0.5px;content:"|"; margin:0 5px;}
.footer-grid .copy span:last-of-type:after{display:none}

footer p{padding-top:1rem; text-transform:uppercase;}




/* 반응형 웹 */
@media only screen and (max-width: 1680px){
	#main_btn{width: 40%;}
}

@media only screen and (max-width: 1440px){
	.sub_logicon{ top:13%;}
	.sub_logicon img{width: 80%;}	
	.navbar{width: 95% !important;}
	#main_btn{width: 30%;}
}

@media only screen and (max-width: 1280px){
	.poster_info{padding: 4em 3em;}
	#main_date li{padding: 1.2em;font-size: 14px;}	
	#main-visual .carousel-item {
    background-position: right;
	}
}
/* 테블릿 가로 */
@media only screen and (max-width: 1024px){
	.container { width: 90%; padding: 0;}   
	.side-sns{display: none;}
	.main_logicon{padding: 20px 20px 0 20px;}
	.navbar-nav li{font-size: 16px;}
	.navbar-expand-lg .navbar-nav .nav-link{padding-left: 0 !important; padding-right: 0 !important;}
	#main_date ul{display: flex;gap: 25px;justify-content: center;flex-flow: wrap;}
	#main_date li{width: 30%;}
	.info_txt{/* font-size: 16px; */word-break: keep-all;}
	.live_text .chat_area{width: 74% !important;}
	#main-visual{background-size: cover !important;}
   	.banner_heading{
	font-size:1.8em;
	padding-top:6%;
  	} 
	.banner_date{
	font-size:1.2em;
	padding-top:12%;
	line-height: 1.3em;
  	} 
	.sub_logicon{ top:16%;}
	.sub_logicon img{width: 60%;}
	.spon01{flex-wrap:wrap;}
	.info_hi_photo{ width: 25%; margin-right: 5%;}
	.info_hi_txt01{ width: 70%;}
	.sponsor{display: block;}
	.sponsor dl{display: block;text-align:center;margin-right: 0 !important;}
	.sponsor dt{margin-bottom:10px;}
	.spon_title dt{width: 120px;margin: .3em auto;}
	.sponsor dd{ text-align: center;}
	#main_btn{width: 100% !important;/* padding: 0.7em !important; */bottom: 20%;/* margin: 0 auto; */display: flex;justify-content: center;}
	#main_info:before, #main_info:after{ height: 500px;}
	.fmc-business-section {
 	 padding: 0 20px;
 	}

}



/* 테블릿 세로 */
@media only screen and (max-width:991px) {
	header {margin-bottom:1em;}
	#top-nav .logo{width:100%; text-align:center;left:0;}
	button{border: 0; background: none;}
	.navbar-nav{background: #fff !important; z-index: 50; border-radius: 5px;}
	.navbar-nav .sns-btn{display: block;border: 0 !important;text-align: right;padding-top: 0.8em;/* background: #eee; */}
	.navbar-nav{padding: 1em 0 !important;border: 1px solid #eee !important; margin-top: 0.5em;}
	.navbar-nav li{text-align: left; padding: 0 1em; border-bottom: solid #f1f1f1 1px; width: 95%; margin: 0 auto !important; font-size:18px !important; text-shadow:0 0 BLACK;}
	.navbar-nav li i{display: inline-block; position: absolute; right: 3%;}
	.navbar-light .navbar-nav .nav-link:hover,.navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .show>.nav-link, .navbar-light .navbar-nav .active>.nav-link, .navbar-light .navbar-nav .nav-link.show,.navbar-light .navbar-nav .nav-link.active  {color: #003173 !important;}
	.nav-item a{color: #333333;}
	.dropdown-menu{background: #fcfcfc !important; width: 95% !important; margin: 0 auto 1em auto !important; border: 1px #f7f7f7 solid !important;}
	.dropdown-menu a{color: #333 !important;width: 100% !important;}
	#top-nav .openbtn, #top-nav .closebtn{ display: block;} 
	#top-nav{padding-top:1.8em}
	#top-nav .logo{padding-top: 0;}
	.top_sns{display: none;}
	.navbar-nav .sns-btn{display: block;border: 0 !important;text-align: right;padding-top: 0.8em;/* background: #eee; */}
	.banner_date{font-weight:600;
	font-size:1.5em;
	padding-top:8%;
	} 
	.poster_cont{display: flex;flex-direction: column;}
	.value-grid {
        grid-template-columns: repeat(1, 1fr); /* 모바일에서는 1열로 배치 */
        gap: 20px;
    }
    .main-title {
        font-size: 28px;
    }
	.sub_cont02{padding: 50px 20px;}
}

@media only screen and (max-width: 800px) {
	.live{display:contents;}
	.main_logicon{padding: 0 5%;}
	#main_btn{ bottom: 5%;}
	.message h3{font-size: 22px;word-break: auto-phrase;}
	.live_vod, .main_live{ width: 100%; height: 400px;}
	.live_text{ width: 100%; margin-top: 0.2em;}
	.live_text .scroll{height: 300px;}
	.live_text .chat_area{width: 86% !important;}
	.live_text .chat_box{ height: 90px;}
	.main_title h3 img{width: 70%;}
	.main_title h2 img{width: 50%;}
	.main_title .date img{width: 60% !important;}
	.poster_txt{width: 80%;}
	#main_info h2{font-size: 2.5em;}
	#sub-visual{background:url("/images/mobile_sub.webp") no-repeat center;}
	.subtabcontent details li{display: block;}
	.subtabcontent details span {width: 100%;}
	.subtabcontent details p{width: 100%;}
	.subtabcontent details .s02 span {width: 100%;}
	.subtabcontent details .s02 p{width: 100%;}
	.intro-list img{width: 100%;}
	.banner_heading{
	font-size:1.4em;
	padding-top:11%;
  	} 
	.banner_date{
	font-size:1em;
	padding-top:15%;
	line-height: 1.3em;
  	} 
	.side-menu .sub-menu01{font-size: 16px !important;}
	.sub_logicon{ top:16%;}
	.sub_logicon img{width: 40%;}
	.info_hi_photo{ width: 35%; margin-right: 5%;}
	.info_hi_txt01{ width: 60%;}
	.history-info dl{flex-direction:column !important;}
	.history-info dd{width: 100% !important;}
	.arrow > li {width:100%; margin-right:0;}
	.arrow > li:after {top:calc(100% + 2px); left:50%; transform: translate(-50%, 0) rotate(90deg);}
	.intro-list dl{flex-direction:column;}
  	.history_vod{ height: 400px;}
	#main_date li{width: 45%;}
	.history-info {padding: 2em 1em;}
	.info_txt dl{flex-direction:column; align-items: start; padding: 0.5em 0;}
	#sub-visual{background-size: cover !important;}
	.footer-grid .copy{text-align: left;width: 50%; flex-direction:column;}
	.business-overlay .title{ font-size: 20px !important;}
	
	.statute-section {
    padding: 40px 0;
  	}
  
  .statute-container {
    flex-direction: column; /* 2단 배열 해제, 수직 흐름 */
    gap: 20px;
 	 }
  
  .statute-sidebar {
    width: 100%;
 	 }
  
  .sticky-summary {
    position: relative; /* 모바일에서는 사이드바 고정 해제 */
    top: 0;
 	 }
  
  .statute-content-paper {
    padding: 30px 20px; /* 내부 여백 압축 */
	  }
  
  .statute-main-title {
    font-size: 26px;
  	}
  
  .chapter-title {
    font-size: 17px;
    padding: 10px 15px;
	  }
  
  .article-title {
    font-size: 15px;
 	 }
  
  .article-text, .sub-list li {
    font-size: 14px;
 	 }
	
  .contact{display: flex;flex-direction: column; gap:0;}
  .contact li{width: 100%;font-size: 18px;font-weight: 600;}
	
}



/* 모바일 */
@media only screen and (max-width: 767px) {
	.sns{
	margin-right:1em;
	}
	.banner_heading{
	font-size:1.8em;
	padding-top:11%;
    
	} 
	.banner_date{font-weight:600;
		font-size:1em;
		padding-top:14%;
	} 
	.sub-menu01{display: none !important;}
	.sub-menu02{display: block; text-align: center;}
	.sub-menu02 select{width: 90%; border: 0;}
	.sub-menu02 select:hover{border: 0 !important;}
	.carousel-caption{width:90% !important;}
	.carousel-caption h4{font-size: 20px !important;}
	.carousel-caption h5{font-size: 18px !important;word-break: keep-all;}
	.carousel-caption p{width:95% !important;margin: 1.5em auto; font-size:18px !important;}
	.business {
	  flex-direction: column;
	}
	.business .project{ margin-top: 20px;}
}

@media (max-width: 640px) {
	/*연혁 위주*/
  .fmc-history-section {
    padding: 60px 0;
  }
  
  .timeline-wrapper::before {
    left: 95px;
  }
  
  .timeline-date-zone {
    flex: 0 0 80px;
    gap: 4px;
    padding-top: 18px;
  }
  
  .timeline-date-zone .year {
    font-size: 18px;
    min-width: 42px;
  }
  
  .timeline-date-zone .month {
    font-size: 16px;
  }
  
  .timeline-line-zone {
    flex: 0 0 32px;
  }
  
  .line-node {
    left: 12px;
    top: 21px;
  }
  
  .history-card {
    padding: 16px 20px;
  }
  
  .content-list li {
    font-size: 14px;
  }
  
  .content-list li.text-sub {
    font-size: 13px;
  }
  
  .content-list li.important-text {
    font-size: 15px;
  }
 /* // 연혁 위주*/
 /*조직도*/	
  .org-tree-wrapper::before {
    left: 20px;
    transform: none;
  }
  
  .org-row {
    flex-direction: column;
    margin-bottom: 20px;
  }
  
  .org-row.double-node .org-card-wrap {
    width: 100%;
    margin-bottom: 20px;
  }
  
  .org-row.double-node .org-card-wrap:last-child {
    margin-bottom: 0;
  }
  
  .org-row.double-node::before {
    display: none;
  }
  
  .org-card {
    padding: 18px 20px 18px 45px;
    text-align: left;
  }
  
  .org-row.single-node .org-card {
    max-width: 100%;
  }

  .org-card::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 17px;
    transform: translateY(-50%);
    width: 8px;
    height: 8px;
    background-color: #ffffff;
    border: 2px solid #cbd5e1;
    border-radius: 50%;
    z-index: 5;
  }
  
  .leader-card::after { border-color: #e05e5e; }
  .primary-card::after { border-color: #003173; }
  
  .position-title { font-size: 16px; }
  .fmc-table-section {
    padding: 50px 0;
  }
  
  .member-status-table th {
    font-size: 14px;
    padding: 14px 8px;
  }
  
  .member-status-table td {
    padding: 12px 10px;
    font-size: 13px;
  }
}

@media only screen and (max-width:500px){
	#main_date{padding: 2.5em 2em;}
	.history-gallery .col-sm-3{ width: 50%;}
	.partner-list li{width: 100%; margin: 0.5em 0 !important;}
	.sponsor dd{flex-direction: column;}
	.sponsor dd img{padding: 0 0 10px 0;width:fit-content !important;margin: 0 auto !important;}
	.sponsor h6{word-break: keep-all;} 
	.poster_info{padding: 1em;}
	.info_txt dt{width: 100px;height: 35px;background: #003173;/* padding: 10px 0; */color: #fff;/* border-radius: 5px; *//* text-align: center; */display: flex;justify-content: center;flex-direction: column;text-align: center;border-radius: 2em;font-size: 18px;}
	.info_txt .long{width: 250px;height: 35px;background: #003173;/* padding: 10px 0; */color: #fff;/* border-radius: 5px; *//* text-align: center; */display: flex;justify-content: center;flex-direction: column;text-align: center;border-radius: 2em;font-size: 18px;}
	.info_photo dt{font-size: 20px !important;}
	.info_photo dl{margin: 0.5em 0 !important;}
	.info_photo dt span{ font-size: 14px; padding-left: 0 !important; display: block !important;}
	.info_photo img{width: 100% !important;}
	.info_photo dd{font-size: 13px !important; padding: 10px !important;word-break:keep-all !important;}
	.sub_tab button{height: 70px; font-size: 14px;}
	.history_txt, .history-info .session p{font-size: 14px;}
	.history_txt{padding: 2em 1em !important;}
	.history-info{ padding: 2em 0;}
	.history_vod{ height: 200px;}
	.message ul{flex-direction:column;}
	.message_photo, .message_txt01{width: 100%;}
	.message_photo{padding-right: 0 !important; padding-bottom: 0.5em; text-align: center;}
	#main_btn{width: 95% !important;bottom: 20%;display: flex;justify-content: center;margin: 5em auto;}
	#main_info{padding: 7em 0em;}
	.poster_cont .right div{ width: 100%;}
	.info_txt dd{padding: 0.5em;line-height: 24px; font-size: 16px;}
	.main_title h3 img{width: 80%;}
	.main_title h2 img{width: 60%;}
	.main_title .date img{width: 70% !important;}
	#main_date li{width: 95%;}
	.btn-circle, .btn-circle02{
	width: 130px;
	height: 130px;
	border-radius: 50%;
	font-size: 20px;
	}
	.info_table th{font-size: 16px;} 
	.info_table td{font-size: 14px;line-height: 20px;}
	.handi{font-size: 16px; line-height:25px;}
	.hand_last{line-height: 18px; font-size: 14px;}
	.info_table h5{font-size: 16px;}
	.sub_cont h4{font-size: 22px;}
	.footer-grid ul{display: block;}
	.footer-grid .copy{text-align: center;width: 100% !important; margin-top: 0.5em;}
	.youtube-section {
	  display: flex;
	  justify-content: center;
	  flex-direction: column;
	}
	.summary h3{font-size:28px;}
	.fmc-business-section {
 	 padding: 0 10px;
 	}
	.fmc-contact-section {
 	padding: 15px;
    }
  .contact li{font-size: 16px;}

}


@media only screen and (max-width:480px){
	.logo img{width: 50%;}
	.live_vod, .main_live{height: 200px;}
	.live_text .chat_area{ width: 81% !important;}
	.chat_write_enter{padding: 2%;}
	.main_title{top: 20% !important;}
	#top-nav{ padding-bottom: 1em;} 
	.navbar{width: 100% !important;}
	#main_info h2{font-size: 1.5em;}
	#main_info h3{font-size: 1.4em;}
	#main_info h5{font-size: 0.9em; word-break: keep-all;}
	.poster_txt{width: 70%;padding: 1.5em;}
	.main_quick{top:-7.5em;}
	.main_quick li{font-size: 12px; padding: 1.5em 0;}
	.spon01{display: contents;justify-content: center;}
	.spon01 li{ margin-right: 0rem; margin-bottom: 1rem;}
	.spon01 h4{padding-top: 2em;}
	.session_title{font-size: 25px;word-break: keep-all;line-height: 32px;}
	.info_photo{display: block;}
	.info_photo .photo_name{padding-left: 5px;display:inline;}
	#sub-visual{ background:url("/images/mobile_sub.webp") no-repeat;padding-top: 5.7em;/* background-size: 100% !important; */height: 55vw;}
	.sub_logicon{ top:16%;}
	.banner_heading{
	font-size:1.2em;
	padding-top:23%;
    
	} 
	.banner_date{font-weight:600;
		font-size:0.8em;
		padding-top:34%;
	} 
	.btnenter{ padding: 2% 2%;}
	.info_hi{display: block;}
	.info_hi_photo{ width: 100%; text-align: center;}
	.info_hi_txt01{ width: 100%; padding-top: 15px;}
	.btn-circle, .btn-circle02, .blue-btn-circle, .blue-btn-circle02{
		width: 110px;
		height: 110px;
		font-size: 18px;
		font-weight: 700;
		}	

}


@media only screen and (max-width:375px) {
	#top-nav h1{
		transform: none;
		font-size: 1.5em;
	}
	.navbar h1{ width: 75%;}
	#top-nav{ padding-bottom: 0.3em;} 
	.sub_tab button{font-size: 14px;}
	.live_text .chat_area{width: 78% !important;}
	/*#main-visual{height: 500px;}*/
	.main_quick{top:-5em;}
	#main_info{padding:4em 0em;}
	.poster_info{padding: 0.5em;margin-top: 1em;}
	#main_info h2{font-size: 1.2em;}
	#main_info h3{font-size: 1.1em; letter-spacing: -1px;}
	#main_info h4 img{width: 55%; height: auto;}
	#main_info h5{font-size: 0.8em;}
	#main_info h2{padding:0.2em 0.1em;}
	.banner_heading{
	font-size:1.2em;
	padding-top:18%;
    } 
	.banner_date{font-weight:600;
	font-size:0.7em;
	padding-top:30%;
	} 
	.info_hi_txt01 .font-bm{font-size: 20px;}
	.heading-agileinfo{font-size: 32px;}
	.carousel-caption h5{font-size: 16px !important;}
	.carousel-caption p{width:95% !important;margin: 1.5em auto; font-size:14px !important;}
}

@media only screen and (max-width:320px) {
	.poster_txt{width: 80%;}
	.main_quick li{font-size: 11px;}
	/*#main-visual{height: 480px;}*/
	.banner_date{font-weight: 400;
	font-size: 0.6em;
	padding-top: 28%;
	} 
}


