﻿.main-body .container > .width1200 {margin-top:-190px;}
.main-body {/*margin-top: 60px;*/margin-bottom: 0px;display: block;height: auto; position: relative;z-index: 2;/*opacity: 0;transform: translateY(100px);transition: none;  js로 처리 */ background:#fff;}
.main-body .fix-layout { padding:0 30px;}
/* 메인 - 비쥬얼 */
#mvisual { background: #fff none repeat 0 0 / cover ; width:100%; min-height: 400px;  height: auto; /*aspect-ratio: 16 / 9;*/  overflow: hidden; position: relative; padding-top:0; z-index: 1; }
#mvisual .visual-txt { display:none; position: absolute;top:240px;width:100%;text-align:center; left:0; right:0;}
#mvisual .slide-tit {position: absolute;top: 40%;/* 세로 중앙 */left: 50%;  /* 가로 중앙 */transform: translate(-50%, -50%); /* 정확히 중앙으로 이동 */z-index: 2;color: #fff;font-weight: 500;font-size: clamp(60px, 3vw, 36px); /* 반응형 크기 */text-align: center;text-shadow: 0 2px 8px rgba(0,0,0,.4); /* 가독성 */display: block !important;visibility: visible !important;opacity: 1 !important; font-family: 'Gmarket'; line-height:1.1; letter-spacing: 0em;}
/*
#main_visual .slides {position: absolute; top:0px}
*/
#main_visual .slides .bnr-item { position: relative; }
#main_visual .slides .bnr-item img { width: 100%;height: 100%;object-fit: cover;display: block; position: relative; z-index: 1;}
/*#main_visual .slides,
#main_visual .slides .bnr-item { width: 100%; height: auto; overflow: hidden;}*/
.tb-control-nav.tb-control-paging {position: absolute; bottom:30%;/*bottom:24px;*/ left:0; right:0; text-align:center; white-space:nowrap;}
.tb-control-nav.tb-control-paging li {display:inline-block;}
.tb-control-nav.tb-control-paging li a,
.tb-pauseplay a {display:inline-block; margin: 0 5px; width:24px; height:24px; font-size:0; background-repeat: no-repeat; background-position: center;}
.tb-control-nav.tb-control-paging li a {background-image:url(/resources/images/egsv/main/control_on.png);}
.tb-control-nav.tb-control-paging li a.tb-active {background-image:url(/resources/images/egsv/main/control_onon.png);}
.tb-pauseplay a.tb-pause {background-image: url(/resources/images/egsv/main/control_pause.png);}
.tb-pauseplay a.tb-play {background-image: url(/resources/images/egsv/main/control_progress.png);}
.tb-pauseplay {position:absolute; bottom:30%;/*bottom:24px;*/ left:51.7%; right:0; text-align:center; width:24px;}
.tb-direction-nav {display:none;}

/* 데스크톱 (≥1200px) – 살짝 위쪽 40% 지점 */
@media (min-width: 1200px) {
  /*#main_visual .slides .bnr-item .slide-tit,
  #mvisual .slides .bnr-item .slide-tit {
    top: 40%;
    font-size: clamp(22px, 2.8vw, 40px);
    letter-spacing: 0.02em;
  }*/
}

/* 태블릿 (768–1199px) – 이미지 비율 고려해 살짝 더 아래 */
@media (min-width: 768px) and (max-width: 1199px) {
  #main_visual .slides .bnr-item .slide-tit,
  #mvisual .slides .bnr-item .slide-tit {
    top: 42%;
    font-size: clamp(18px, 3.2vw, 32px);
  }
}

/* 모바일 (≤767px) – 중앙에 더 가깝게, 가독성 강화 */
@media (max-width: 767px) {
  #main_visual .slides .bnr-item .slide-tit,
  #mvisual .slides .bnr-item .slide-tit {
    top: 45%;
    font-size: clamp(16px, 5vw, 26px);
    line-height: 1.3;
    /* 배경이 너무 밝을 때 대비용 반투명 배경 (원치 않으면 주석) */
    /* background: rgba(0,0,0,.18);
       border-radius: 6px; */
  }
}
/*
.visual-button{position: absolute;top:600px;width:100%; left:0; right:0; text-align:center;}
.visual-button img{ margin:0px 5px}
*/
/*
#mvisual { background: #333 none repeat 0 0 / cover ; width:100%; height: 650px; overflow: hidden; position: relative; padding-top:0;  }
#mvisual .visual-txt {position: relative;top:240px;width:100%;text-align:center;z-index:9;margin-left: auto;margin-right: auto;max-width: 1200px;}
#main_visual .slides {position: absolute; top:0px}
#main_visual .slides .bnr-item img {min-height:650px; height:100%;width:100%;}

.visual-button{position: relative;top:600px;width:100%;text-align: right;z-index:9;margin-left: auto;margin-right: auto;max-width: 1200px; text-align:center; }
.visual-button img{ margin:0px 5px}
#mvisual .visual-txt .txt1 span {text-transform:lowercase; }
*/
.main-step02 .step02-title {font-size:1.8em; background:none; }
.main-step02 .step02-title span {font-size:1.5em;  letter-spacing:-0.05em}
.main-step02 .step02-title i { font-weight:600; font-size:0.9em; color:#fff; background:#c31e2a; padding:3px 5px; border-radius:6px; }
.ui-btn {border:#ccc 1px solid; border-radius:0; font-size:0.8em; padding:3px 10px 5px 10px; color:#666; background:#fff; }
.ui-btn:hover {background:#be222f; border:#be222f 1px solid; color:#fff;}

.main-zone { position: relative; padding-top: 273px; }
/*.main_bar { background:#ad302f; color:#ffffff; }*/

/* popup-zone */
.popup-zone .popup-zone-control { position: absolute; right: 19px; top: 16px; }
.popup-zone .popup-zone-control li { float: left; border: 1px solid #000000; margin-left: 5px; width: 29px; height: 29px; line-height: 26px; text-align: center; cursor: pointer; }
.popup-zone .popup-zone-control li img { vertical-align: middle; }

/* main_bar */
.main_bar {position: absolute;right: 0; bottom: 0;  width: 60%; /*height: 130px;  기존 높이 또는 원하는 값 */ margin-left: auto;  /*background-color: #fff;*/ color: #fff; z-index:10; animation: fadeUp 1s ease forwards; opacity: 0; /* 처음엔 투명 */}
.main_bar .fix-layout {  height: 100%; display: flex;  align-items: center; padding: 0 0px;}
/*.main_bar .fix-layout ul li {display: inline-block;width: 24%;padding: 15px 0;font-size: 1.3em;font-weight: 500;}*/
.main_bar ul {display: flex;justify-content: space-between; width: 100%; flex-wrap: nowrap; }
.main_bar ul li {flex: 1; display: flex; align-items: center; justify-content: left; padding: 40px 30px;font-size: 1.3em;font-weight: 500;text-align: left; transition: transform 0.3s ease, box-shadow 0.3s ease;will-change: transform;}
.main_bar a {position: relative;display: flex;align-items: center;width: 100%;height: 100%;color: #ffffff;text-decoration: none;}
.main_bar a:hover { color:#e0989e ;}
.main_bar li a::after {content: "";position: absolute;left: 0;bottom: 8px; /* 글자와 밑줄 간격 */width: 0;height: 2px;background-color: currentColor;transition: width 0.3s ease;}
.main_bar li a:hover::after {width: 100%;}
.main_bar a > span {display: inline-block; padding-left:10px; font-weight:500;}
.main_bar li.item1 { background-color: #002445; } 
.main_bar li.item2 { background-color: #19d3df; } 
.main_bar li.item3 { background-color: #f45c5c; } 
.main_bar li.item4 { background-color: #ffe500; text-align:center; } 
.main_bar li.item4 p {color:#4f4f4f !important; font-size:16px;}
.main_bar li.only-image {display: flex;align-items: center;justify-content: center;}
.main_bar li.only-image a { display: block; /* 다시 block으로 변경 */ width: auto;height: auto;}
.main_bar li.only-image a span {display: none;}
.main_bar ul li em {font-style: normal; display:block;}
.main_bar ul li:hover {
  transform: translateY(0px) scale(1.03); /* 위로 6px 이동 + 약간 확대 */
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15); /* 그림자 강조 */
}
.main_bar li.item1 a:hover { color: #19d3df;}
.main_bar li.item2 a:hover { color: #002445;}
.main_bar li.item3 a:hover { color: #ffcc00;}


@keyframes fadeUp {
  0% {
    transform: translateY(30px);
    opacity: 0;
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}
/* ========== 반응형 대응 ========== */

@media (max-width: 1800px) {
	.main_bar ul li {padding: 20px;}
}

@media (max-width: 1600px) {
	.main_bar {width: 100%;}
	
}
@media (max-width: 1500px) {
	.main_bar .fix-layout ul li img { width:30%;}
	.main_bar ul li {padding: 10px;}
}
@media (max-width: 1400px) {
	.tb-control-nav.tb-control-paging { bottom:40%;}
	.tb-pauseplay { bottom:40%;}
	
}

@media (max-width: 1024px) {
  .main_bar {
    width: 100%;
    height: auto;
    position: relative;
    /*margin-top: 20px;*/
    animation: fadeUp 1s ease forwards;
  }

  .main_bar ul {
    flex-wrap: wrap;
  }

  .main_bar ul li {
    width: 50%;
    box-sizing: border-box;
	
  }

  .main_bar li.only-image a span {
    display: none;
  }
  .tb-pauseplay {left: 55.7%;}
  
}

@media (max-width: 768px) {
  #main_visual .slides .bnr-item img {
    height: auto;
  }
  .main_bar ul {
    flex-wrap: wrap; /* 여러 줄로 감싸기 */
  }
  .main_bar ul li {
    flex: none;       /* flex 비활성화 */
    width: 50%;       /* 2개씩 나오게 */
    box-sizing: border-box;
    padding: 20px 10px;
  }
  .main_bar ul li:last-child { width: 100%; padding: 5px 10px;}
  
}

@media (max-width: 480px) {
  .main_bar ul li {
    width: 100%;
  }

  .main_bar a {
    flex-direction: column;
  }

  .main_bar a > span {
    margin-left: 0;
    margin-top: 8px;
  }
  .main_bar ul li em { display:inline-block;}
  .tb-control-nav.tb-control-paging { bottom:50%;}
}



/* main-box */
.main-box .notice-box { float: left; width: 400px; height: 464px; position: relative; background-color: #ffffff;overflow: hidden; }
.main-box .link-box {float: right;width: 780px;}
.main-box .link-box .link-box-list > div {float: left;width: 48.7%;height: 170px;color: #ffffff;display: inline-block;padding: 15px 25px;}
.main-box .link-box .link-box-list > div:nth-child(2) {margin-right: 0px !important;}
.main-box .link-box .link-box-list > div .counsel-ttl { margin: 10px 0 7px;}
.main-box .link-box .link-box-list > div .counsel-tt {text-align: center;margin: 0 0 7px;}
.main-box .link-box .link-box-list > div .counsel-btn {border: 1px solid #ffffff;padding: 3px;width: 40%;text-align: center;margin: auto;font-size: 0.95em;color:#ffffff;}
.main-box .link-box .link-box-list > div .counsel-btn:hover { border: 1px solid #f2ee7e; color:#f2ee7e ; }
.main-box .link-box .link-box-list > div .counsel-tel {text-align: center;font-size: 1.8em;color:#f2ee7e;font-weight: 500;margin: 0;line-height: 1.4;} 
.main-box .link-box .link-box-list .counsel-box {  background-color: #14b4b7;  }
.main-box .link-box .link-box-list .counseltel-box {background-color: #4697e9;float: right;}

.main-box .link-box .link-box-list .box-list {width: 100%;padding: 0;}
.main-box .link-box .link-box-list .box-list > ul > li {display: inline-block;width: 48.7%;height: 130px;border: 3px solid #d9dfe5;margin-top: 17px;letter-spacing: -0.1em;padding: 15px 25px;}
.main-box .link-box .link-box-list .box-list > ul > li:nth-child(2),
.main-box .link-box .link-box-list .box-list > ul > li:nth-child(4) {margin-right: 0px;float: right;}
.main-box .link-box .link-box-list .box-list > ul > li > a p {margin-top: -13px;display: block;margin-left: 7px;line-height: 1.2;}
.main-box .link-box .link-box-list .box-list > ul > li > a p > img {float: right;margin-top: 30px;padding-right: 0px;}
.main-box .link-box .link-box-list .box-list > ul > li > a .counsel-ttl {color:#000;font-size: 1.6em;font-weight:600;padding-top: 15px;}
.main-box .link-box .link-box-list .box-list > ul > li > a .counsel-tt {color:#696969;font-size:1em;font-weight:500;text-align: left; padding-top: 15px;}


/* counsel-box 상담안내  */
.link-box-list > div > .counsel-ttl { text-align: center; font-size: 24px; font-weight: bold; }


/* board-zone-bottom 바로가기 슬라이더 */
.board-zone-bottom { margin-top: 20px; }
.board-zone-bottom .quick-slider {}
.board-zone-bottom .quick-slider li { float: left; width: 20%; height: 147px; background-color: #d76504; padding: 28px 0; }
.board-zone-bottom .quick-slider li:nth-child(2n) { background-color: #ebc322; }
.board-zone-bottom .quick-slider li a { display: block; text-align: center; }
.board-zone-bottom .quick-slider li a span { display: block; height: 67px; }
.board-zone-bottom .quick-slider li a img { vertical-align: middle; }
.board-zone-bottom .quick-slider .quick-ttl { height: auto; padding-top: 10px; color: #ffffff; font-size: 14px; }


/* notice-box 공지사항, 자료실  */
#notice-tabs .ui-tabs-nav {}
#notice-tabs .ui-tabs-nav li { float: left; }
#notice-tabs .ui-tabs-nav li a { display: block; padding: 12px 15px; color: #2b2a2a; font-size: 18px; font-weight: bold; }
#notice-tabs .ui-tabs-nav li.on a { color: #be222f; }

.notice-box .notice-list li a { overflow: hidden; display: block; }
.notice-list .notice-ttl {float: left;width: 100%;color: #3c3c3c;font-size: 16px;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}
.notice-list .notice-day {float: left;color: #a9a8a8;font-size: 0.88em;}
.notice-box .notice-more {position: absolute;top: 0;right: 10px;padding-top: 22px;width: 53px;height: 45px;text-align: center;}

#notice-tabs #tab-notice > .notice-list > li  {border: 0px;padding-top: 16px;}
#notice-tabs #tab-notice > .notice-list > li .clearfix > li {display: block;border-bottom: 1px solid #d9d9d9;padding-bottom: 37px;}
#notice-tabs #tab-notice > .notice-list > li .clearfix > li a { color: #504e4e; }
#notice-tabs #tab-notice > .notice-list > li .clearfix > li.notice-date {position:absolute;margin-top: 25px;border-bottom: 0px solid #dddfe2;padding-bottom: 0px;font-size: 16px;color: #9c9c9c;}
#notice-tabs #tab-notice > .notice-list > li .clearfix > li.notice-date span {float:left;}

/**/
.notice-box { background: #fff; padding: 20px; border: 1px solid #d9dfe5;}
.notice-box .notice-list {padding: 0px 10px 5px 10px;}
.notice-box .notice-list li {border: 0px;padding-top: 6px;}
.notice-box .notice-list li .clearfix {display: block;border-bottom: 1px solid #d9d9d9;padding-bottom: 30px;}
.notice-box .notice-list li .clearfix li.notice-date span {float:left;}
.notice-box .notice-list li.notice-date {position:absolute;margin-top: 23px;border-bottom: 0px solid #dddfe2;padding-bottom: 0px;font-size: 14px;color: #9c9c9c;}
.notice-box .notice-list li.notice-date::before {content:" - ";font-size: 6px;padding-right: 1px;vertical-align: top;color:#9c9c9c;}
.notice-box .notice-list li a .list-title { color:#555555; color:#555555; display:  block;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}

/* 탭 공지사항 */
#notice-tabs .tabs div{display: none; clear: both;}
#notice-tabs .notice-box input {display: none;}

#notice-tabs .notice-box input:nth-of-type(1):checked ~ div:nth-of-type(1),
#notice-tabs .notice-box input:nth-of-type(2):checked ~ div:nth-of-type(2),
#notice-tabs .notice-box input:nth-of-type(3):checked ~ div:nth-of-type(3){ display: block;}

#notice-tabs .notice-box input:nth-of-type(1):checked ~ section label:nth-of-type(1),
#notice-tabs .notice-box input:nth-of-type(2):checked ~ section label:nth-of-type(2),
#notice-tabs .notice-box input:nth-of-type(3):checked ~ section label:nth-of-type(3){	color: #b30000;}

#notice-tabs .notice-box label {
	width: 45%;
	height: 60px;
	box-sizing: border-box;
	float:left;
	display: block;
	text-align: left;
	padding: 10px;
	cursor:pointer;
	cursor:hand;
	font-size: 18px;
}


/* footer */
.footer {background-color: #222; /* 배경색 */color: #ccc;font-size: 16px;padding: 0px 0;}
.footer-container { max-width: 1690px;margin: 0 auto;display: flex;justify-content: space-between;align-items: center;flex-wrap: wrap; padding: 50px 20px;}
/*.footer-left, .footer-center, .footer-right {flex: 1;}*/
.footer-left {flex: 0 0 40%;line-height: 1.6;}
.footer-center {flex: 0 0 20%;text-align: center;}
.footer-right {flex: 0 0 40%; text-align: right; font-size: 12px; color: #aaa;}
.footer-left {line-height: 1.6; font-size:16px; text-align:left; font-size: 16px; font-weight:500;}
.footer-center {text-align: center;}
.footer-center .footer-logo {vertical-align: middle; height: 40px;margin-right: 8px;}
.footer-center span {display: inline-block; vertical-align: middle;font-weight: bold;color: #fff;}
.footer-right {text-align: right;font-size: 16px;color: #aaa; font-weight:500;}

/* 반응형 대응 */
@media (max-width:1199px){
  .footer-left   { flex-basis:45%; }
  .footer-center { flex-basis:30%; }
  .footer-right  { flex-basis:45%; font-size:14px; text-align:left;}
  .footer-container{ padding:20px; }
}

/* 모바일(<=768px): 세로 스택 100% */
@media (max-width:768px){
  .footer-container{ flex-direction:column; gap:10px; text-align:center; }
  .footer-left, .footer-center, .footer-right{
    flex:0 0 100%; text-align:center;
  }
  .footer-right{ font-size:11px; }
  .footer-center .footer-logo{ height:36px; }
}

@media all and (max-width: 1200px) {
.main-step01 .step02-notice .notice-list li li {width: 66%;padding:7px 10px;}
.main-body {/*padding:0 20px;*/height: auto; margin:0 0 0px;}
.main-box .notice-box,.main-box .link-box  {width:100%; height: auto;margin-top:20px;}

/*main_bar
.main_bar { height: auto;padding:0 20px; margin-top: 0px;}
.main_bar .fix-layout ul li {width: 45%;}
.main-box .link-box .link-box-list > div { height: auto;}*/
    
/* footer */
.foot_top { margin: 20px;}
.foot_site .bx-wrapper {width: 70%;}
}
@media all and (max-width: 767px) {

#mvisual {/*height:400px;*/ margin-top:-20px;}	
#mvisual .visual-txt {top:160px;width: 100%; margin: 0 auto;}	
#main_visual .slides .bnr-item img {min-height:400px;}

.foot_top { margin: 0px; border-right: 0px solid #d9dfe5; border-left: 0px solid #d9dfe5;}
.foot_site .bx-wrapper { width: 80%;}
.foot_site .foot_site_slider li {padding-left: 0px;}
.foot_site .foot_site_slider li a img {width: 80%;}


/*박스링크*/
.main-box .link-box .link-box-list .box-list > ul > li {padding: 0px;}
.main-box .link-box .link-box-list .box-list > ul > li > a p {width: 100%; margin: 10px 20px;}
.main-box .link-box .link-box-list .box-list > ul > li > a p > img { float: right; margin-top: 30px; padding-right: 30px;}
}

@media all and (max-width: 640px) {

/*main_bar*/
.main_bar .fix-layout ul li {font-size:1em;}
.main_bar .fix-layout ul li img {width:24%;}
.main-box .link-box .link-box-list > div { width: 100%;}
.main-box .link-box .link-box-list .box-list > ul > li {width: 100%;}
}

@media all and (max-width: 460px) {

/*main_bar*/
.main_bar .fix-layout ul li {width:100%; padding: 10px 0;}
.main_bar .fix-layout ul li img {width:15%;}

}

.gsv_notice {background-image: linear-gradient(to bottom, #f5f5f7, rgba(245,245,247,0)); padding: 80px 0 0px; overflow: hidden;}
.section-title-box { position:relative; text-align: center; /* 중앙 정렬 */}
.section-title-box .section-title {display: block; color: #222; text-align: center;font-size: 62px;font-weight: 900;line-height: 150%; letter-spacing: -1.86px;}
.section-title-box .section-text { display: block; color: #777; text-align: center;font-size: 22px;font-weight: 500;line-height: 150%;letter-spacing: -0.48px;margin: 30px 0 0;}
.section-more-btn { display: inline-block;margin: 30px auto 0;padding: 12px 0;width: 150px;text-align: center;font-size: 18px;font-weight: 600;color: #0096B8; /*background-color: #0096B8;*/ border:2px solid #0096B8;border-radius: 30px; /* 라운드형 */text-decoration: none;transition: background-color 0.3s ease;}
.section-more-btn:hover {background-color: #007a96; /* hover 배경색 */color: #fff; /* hover 시에도 흰색 유지 */}

.board-content {position: relative; overflow: hidden; left: 0; width: 100%; margin-top:30px; padding:30px 0;}
.board-content .col {width: 100%; margin: 0px;display: flex; flex-wrap: wrap;}
.board-content .col.col4 > div { width: 25%; padding: 20px;  box-sizing: border-box;}
.board-content .content-link {display: block; position: relative;width: 100%;height: 100%;}
.board-content .item {
  position: relative;
  background-color: #fff;
  border-radius: 0px;
  padding: 50px 30px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.04);
  box-sizing: border-box;
  height: 100%;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  overflow: hidden;
  border: 1px solid #e0e0e0;
}

/* 선 효과용 가상 요소 */
.board-content .item::after {
  content: '';
  position: absolute;
  inset: 0;
  border: 1px solid #e0e0e0;
  border-radius: 0px;
  opacity: 0;
  transform: scale(1.05);
  transition: opacity 0.4s ease, transform 0.4s ease;
  pointer-events: none;
}

/* hover 시 애니메이션 실행 */
.board-content .item:hover {
  transform: translateY(-4px);
  box-shadow: 0 4px 16px rgba(0,0,0,0.1);
}

.board-content .item:hover::after {
  opacity: 1;
  transform: scale(1); /* 자연스럽게 선 등장 */
  border: 2px solid #018D36;
}
.board-content .link {position: relative;display: block; width: 100%;height: auto;overflow: hidden;padding: 0 0 0px 0;}
.type-badge {display: inline-flex;align-items: center;justify-content: center; width: auto;height: 39px;padding: 2px 15px 0;border-radius: 50px;transition: all 0.3s; color: #FFF; font-size: 18px;font-weight: 700; line-height: 100%;letter-spacing: -0.54px;}
.board-content .link .type-badge {margin: 0 0 12px;}
.type-badge {display: inline-flex;align-items: center;justify-content: center;width: auto;height: 39px;padding: 2px 15px 0;border-radius: 50px;transition: all 0.3s;color: #FFF; font-size: 18px;font-weight: 700;line-height: 100%; letter-spacing: -0.54px;}
.type-badge.badge3 {background-color: #018D36;}
.board-content .link .news-title {display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;text-overflow: ellipsis; color: #222;font-size: 24px;font-weight: 500;line-height: 150%;letter-spacing: -0.56px; height: 65px; word-break: break-word; transition: all 0.3s;}
.board-content .link .news-date {display: block;color: rgba(34, 34, 34, 0.5);font-size: 20px; font-weight: 500;line-height: 150%;letter-spacing: -0.4px;margin: 30px 0 0;}

@media screen and (max-width: 1024px) {
  .board-content .col.col4 > div {
    width: 50%;
  }
  .gsv_notice .fix-layout { position:relative;}
  .board-more {right: 30px;}
}

@media screen and (max-width: 640px) {
   .board-content .item { padding: 20px 30px;}	
  .board-content .col.col4 > div {
    width: 100%;
  }
  .board-content .link .news-title {font-size: 18px; height: 55px;}
  .board-content .link .news-date {font-size: 16px; }

}

.academic { background:#fff; padding: 80px 0 72px; overflow: hidden; }
.banner-wrap {
  display: flex;
  gap: 20px;
  margin: 60px auto;
  max-width: 1200px;
}

.banner {
  position: relative;
  display: block;
  flex: 1;
  height: 600px;
  overflow: hidden;
  border-radius: 12px;
  text-decoration: none;
  color: #fff;
}
.banner a {
  color: inherit;
  text-decoration: none;
}

.banner-bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  transition: transform 0.5s ease;
  z-index: 1;
}

.banner-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.45); /* 검은색 알파 */
  z-index: 2;
}

.banner-content {
  position: relative;
  z-index: 3;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 20px;
  text-align: center;
}

.banner-title {
  background: #fff;
  color: #222;   
  padding: 14px 28px;
  font-size: 20px;
  font-weight: bold;
  border-radius: 18px;
  margin-bottom: 20px;
  display: inline-block;
}

.banner-text {
  font-size: 18px;
  line-height: 1.4;
  color:#fff;
}
.banner:hover .banner-text {
  color: #fff;
}

/* hover 시 배경만 확대 */
.banner:hover .banner-bg {
  transform: scale(1.1);
}
.banner:nth-child(1) .banner-bg {
  background-image: url('/resources/images/egsv/main/acade_bg01.png');
}
.banner:nth-child(2) .banner-bg {
  background-image: url('/resources/images/egsv/main/acade_bg02.png');
}
.banner:nth-child(3) .banner-bg {
  background-image: url('/resources/images/egsv/main/acade_bg03.png');
}
@media (max-width: 768px) {
	.academic { padding: 80px 0 0px;}
  .banner-wrap {
    flex-direction: column;
    gap: 20px;
    padding: 0 20px;
  }

  .banner {
    height: 400px;
  }

  .banner-title {
    font-size: 18px;
    padding: 10px 20px;
    border-radius: 14px;
  }

  .banner-text {
    font-size: 16px;
  }
}

/*** 다운로드 ***/
.section-wrap {position: relative; background: #fff; overflow: hidden;width: 100%;}
.section-inner { max-width: 1600px; margin: 0 auto; display: flex; position: relative; z-index: 2;}

/* 왼쪽 다운로드 게시판 */
.down-board {width: 50%;/*padding: 60px;*/ padding: 40px 60px 110px 0; box-sizing: border-box; background: #fff;}
.down-title {font-size: 40px; font-weight: 800;display: flex;justify-content: space-between;align-items: center; border-left: 0px solid #d10000; padding-left:0px; color:#070707; margin:0px;}
.plus-icon {font-size: 55px; font-weight: 200; font-family: 'Gmarket'; display: inline-block; /* transform 적용을 위해 inline-block 필요 */transition: transform 0.4s ease; /* 회전 애니메이션 */ cursor:pointer;}
.plus-icon:hover { transform: rotate(360deg);}
.down-list {margin-top: 30px;border-top: 1px solid #ccc;}
.down-list li {display: flex; justify-content: space-between;align-items: center;padding: 40px 0; border-bottom: 1px solid #7f7f7f;font-size: 20px; font-weight:500;}
.down-list li a {color: #000;text-decoration: none;flex: 1; }
.down-list li:hover {
  background-color: #f5f5f5; /* 연한 회색 배경 */
  transition: background-color 0.2s ease; /* 부드러운 전환 효과 */
}
.down-date { color: #999; font-size: 15px; flex-shrink: 0;margin-left: 20px;}

/* 오른쪽 배너 */
.future-banner {width: 50%;padding: 60px;color: #fff;position: relative;box-sizing: border-box;z-index: 2;overflow: visible;}
.future-banner::before {content: "";position: absolute;top: 0;bottom: 0;left: 0; /* 중앙 기준 시작 */right: 0;z-index: -1; background: url('/resources/images/egsv/main/future_bg.png') ; background-repeat: no-repeat;
 background-position: left center;/* background-size: 100%; background-size: cover; 너무 확대되면 contain 또는 auto 100% 도 고려 */z-index: -1; width:1600px;}
.future-banner::after { content: "";position: absolute;top: 0;bottom: 0; left: 0;right: -9999px;background: rgba(0, 0, 0, 0.45); z-index: -1;}
.future-txt { margin-bottom: 40px; }
.future-txt h3{font-family: 'Gmarket'; font-size: 50px;font-weight: bold;line-height: 1.3; }
.future-boxes { display: flex; gap: 30px;}
.future-boxes .box { flex: 1; /*background: #fff; color: #fff;*/ font-weight:600; text-align: center; padding: 30px 20px; border-radius: 16px;box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1); border:0px; transition: transform 0.3s ease, box-shadow 0.3s ease; cursor: pointer;}
.future-boxes .box:hover { transform: translateY(-8px) scale(1.05); /* 살짝 위로 + 확대 */box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2); /* 그림자 강조 */ }
.future-boxes .box:focus-visible{ outline:2px solid #fff; outline-offset:3px; }
.box-blue { background-color: #00c5d6; color: #fff; }
.box-orange { background-color: #ff9b00; color: #fff; }
.box-yellow { background-color: #ffff00; color: #222; }
.box-blue:hover { background-color: #00b0c2; color:#fff;}
.box-orange:hover { background-color: #e68a00; color:#fff;}
.box-yellow:hover { background-color: #e6e600; color: #222;}

.future-boxes .box img { width: 92px;height: auto;margin-bottom: 15px;}

/* 반응형 스타일 */
@media (max-width: 1200px) {
  .section-inner { flex-direction: column;}
  .down-board, .future-banner {width: 100%;padding: 40px 20px;}
  .future-banner::before {
    width: 100vw;
    left: 0;
    right: 0;
    background-position: center;
    background-size: cover;
  }

  .future-banner::after {
    right: 0;
  }

  .future-boxes {
    flex-direction: column;
    gap: 20px;
  }
}

@media (max-width: 768px) {
  .down-title {
    font-size: 24px;
  }

  .plus-icon {
    font-size: 24px;
  }

  .down-list li {
    font-size: 16px;
    flex-direction: column;
    align-items: flex-start;
    gap: 5px;
  }

  .down-date {
    font-size: 14px;
    margin-left: 0;
  }

  .future-txt {
    font-size: 28px;
    text-align: center;
  }

  .future-boxes .box {
    padding: 20px;
  }

  .future-boxes .box img {
    width: 50px;
  }
}

@media (max-width: 480px) {
  .future-txt {
    font-size: 24px;
  }

  .future-boxes .box {
    font-size: 14px;
  }
}


/****** 갤러리 insight ******/
.insight { background:#edf0f4; padding: 80px 0 72px; overflow: hidden; }
.gallery {display: flex;flex-wrap: wrap;gap: 20px;list-style: none;padding: 0;margin: 50px 0;}
/*.gallery li {flex: 1 1 calc(25% - 20px);background: #fff; border-radius: 0px;overflow: hidden;box-shadow: 0 2px 8px rgba(0,0,0,0.08);transition: transform 0.3s ease;}
.gallery li:hover {transform: translateY(-5px);}*/
.gallery li {flex: 0 0 calc(33.333% - 20px); /* grow(0), shrink(0), basis(25%) */max-width: calc(33.333% - 20px);background: #fff;border-radius: 0px; overflow: hidden;box-shadow: 0 2px 8px rgba(0,0,0,0.08);transition: transform 0.3s ease;}
.gallery a { display: block;text-decoration: none;color: inherit;}
.gallery .img-box { width: 100%;height: 250px; /* 원하는 고정 높이 */overflow: hidden;}
.gallery img {width: 100%;height: 100%;object-fit: cover; /* 영역에 맞게 자름 */ transition: transform 0.3s ease;}
.gallery li:hover img {transform: scale(1.05);}
.gallery p {padding: 20px;font-size: 20px;color: #000; text-align:left;display: -webkit-box;-webkit-line-clamp: 2;  /* 최대 2줄 */-webkit-box-orient: vertical;overflow: hidden;text-overflow: ellipsis; font-weight:500; line-height:1.3;}

/* 반응형 */
@media (max-width: 1024px) {
  .gallery li {
    /* flex: 1 1 calc(50% - 20px); 태블릿: 2개 */
	flex: 0 0 calc(50% - 20px);
    max-width: calc(50% - 20px);
  }
}

@media (max-width: 767px) {
  .gallery p {
    font-size: 16px; /* 모바일 글자 크기 줄이기 */
   /*line-height: 1.4;
    max-height: calc(1.4em * 2);  2줄에 맞춰 높이 제한 */
  }
}

@media (max-width: 600px) {
  .gallery li {
   /* flex: 1 1 100%;  모바일: 1개 */
   flex: 0 0 100%;
    max-width: 100%;
  }
}


@media all and (max-width: 767px) {
	.section-title-box .section-title { font-size: 32px;}
	.section-title-box .section-text {font-size: 16px;}
}
.sr-only {width: 0; margin: -1px;padding: 0; overflow: hidden;border: 0;clip: rect(0, 0, 0, 0);}

.board-more{position: absolute;top: 15px; right: 2px;}
.board-more .more-link {position: relative;display: block;width: 60px;height: 60px;transition: all 0.3s;border-radius: 100%;z-index: 2;background-color: #0096B8;}
.board-more .more-link:before {position: absolute;left: 50%;top: 50%;display: block;width: 100%;height: 100%;content: "";transition: all 0.3s;border-radius: 100%; z-index: 1;transform: translate(-50%, -50%) scale(1.5);background-color: rgba(0, 150, 184, 0.2);}
.board-more .more-link .btn-more {position: absolute; left: 0;top: 0;display: block;width: 100%; height: 100%;border-radius: 100%;transition: all 0.3s;background-position: center; background-repeat: no-repeat;background-size: 18px; background-image: url(/resources/images/egsv/main/board_btn_more.png);background-color: #0096B8;z-index: 3;}
.board-more .more-link:hover { transform: rotate(360deg);}
/* hover 시 뒤 배경 확대 */
.board-more .more-link:hover:before {
  transform: translate(-50%, -50%) scale(1.8);
}

@media all and (max-width: 767px) {
	.board-more .more-link {width: 36px; height: 36px;}
	.board-more .more-link .btn-more {background-size: 12px;}
}

.fade-up {
  opacity: 0;
  transform: translateY(50px);
  transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

.fade-up.visible {
  opacity: 1;
  transform: translateY(0);
}
