/* ===============================================
   Conference Overview Layout (Slider & Important Dates)


/* 전체 컨테이너 및 폰트 기본 설정 */
.conference-overview-container {
  display: flex;
  gap: 40px;
  max-width: 1200px;
  margin: 0 auto;
  padding: 20px;
  font-family: 'Helvetica Neue', Arial, sans-serif;
  color: #333333;
}

.conference-overview-container * {
  box-sizing: border-box;
}

/* 좌우 공통 컬럼 설정 */
.overview-column {
  flex: 1;
  min-width: 0; /* flex 자식 요소의 미디어가 넘치는 현상 방지 */
}

/* 섹션 타이틀 공통 스타일 */
.section-title {
  font-size: 24px;
  font-weight: 600;
  color: #0b3c5d; /* 세련된 다크 블루 톤 */
  margin-top: 0;
  margin-bottom: 24px;
  border-bottom: 2px solid #0b3c5d;
  padding-bottom: 8px;
}

/* --- 1. 왼쪽: 이미지 슬라이더 영역 --- */
.slider-wrapper {
  position: relative;
  width: 100%;
  border-radius: 4px;
  overflow: hidden;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.slide-item {
  position: relative;
  display: none;
}

.slide-item.active {
  display: block;
}

.slide-item img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}

/* 이미지 하단 캡션 */
.image-caption {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.6);
  color: #ffffff;
  padding: 12px 16px;
  font-size: 15px;
  font-weight: 500;
}

/* 네비게이션 버튼 (1, 2, 3...) */
.slider-navigation {
  display: flex;
  gap: 6px;
  margin-top: 12px;
}

.nav-btn {
  border: none;
  background-color: #b0c4de;
  color: #ffffff;
  width: 28px;
  height: 28px;
  font-size: 13px;
  font-weight: bold;
  cursor: pointer;
  border-radius: 2px;
  transition: background-color 0.2s ease;
  display: flex;
  align-items: center;
  justify-content: center;
}

.nav-btn:hover {
  background-color: #4682b4;
}

.nav-btn.active {
  background-color: #0b3c5d;
}

/* --- 2. 오른쪽: 일정 영역 --- */
.date-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.date-item {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 14px 0 14px 24px;
  border-bottom: 1px solid #eef2f5;
}

/* 마름모 불릿 구현 (시안의 디자인 계승 및 고도화) */
.date-item::before {
  content: "";
  position: absolute;
  left: 4px;
  top: 20px;
  width: 7px;
  height: 7px;
  background-color: #328cc1;
  transform: rotate(45deg);
}

/* 뎁스가 들어간 하위 항목 (Registration 하위 목록용) */
.date-item.depth-1 {
  padding-left: 40px;
}

.date-item.depth-1::before {
  left: 22px;
  background-color: #709fb0; /* 하위 항목은 살짝 연한 블루로 구분 */
}

/* 날짜 없는 단일 텍스트 행 처리 */
.date-item.single-line {
  font-weight: bold;
  color: #0b3c5d;
}

.date-item.single-line::before {
  background-color: #0b3c5d;
}

/* 텍스트 상세 스타일 */
.event-title {
  font-weight: 500;
  font-size: 16px;
  color: #222222;
  padding-right: 15px;
}

/* Registration 대분류 제목 강조 */
.date-item.single-line .event-title {
  font-size: 17px;
}

.event-date {
  font-size: 15px;
  color: #555555;
  text-align: right;
  font-variant-numeric: tabular-nums; /* 날짜 숫자 정렬 최적화 */
}


/* ==========================================================================
   Responsive Display (반응형 대응 코드)
   ========================================================================== */
@media (max-width: 768px) {
  .conference-overview-container {
    flex-direction: column; /* 위아래 배치로 전환 */
    gap: 48px;
    padding: 16px;
  }
  
  .date-item {
    flex-direction: column; /* 모바일 환경에서 텍스트와 날짜가 겹치지 않게 줄바꿈 */
    align-items: flex-start;
    gap: 4px;
    padding-top: 12px;
    padding-bottom: 12px;
  }
  
  .date-item::before {
    top: 18px; /* 줄바꿈 대응 불릿 정렬 조정 */
  }
  
  .event-date {
    text-align: left;
    padding-left: 0;
    color: #0077b6; /* 모바일에서 가독성을 위해 날짜 색상 강조 */
    font-weight: 500;
  }
}
   Conference Overview Layout (Slider & Important Dates)
   ============================================== */




/* position center of abstract submission */
.section02 ul > li > a > .icon.ico_abstract {
	margin-left: -19px !important;
}

/* Index Menu Coufrac like Style*/
body.site-index .section02 ul > li:nth-child(1) > a  {
    background: #fb3350;
}
body.site-index .section02 ul > li:nth-child(2) > a  {
    background: #6A0888;
}
/* End */

table {border-collapse:separate; }

/* Hide Live button */
/.mLive, .sLive { display: none; }/

/* sub menu width */
.gnb ul > li { width: calc(10% - 1px);}
.gnb ul > li:first-child { width: calc(10% - 2px);}

.sub .h1_logo > a img { height: 40px; position:relative; top:-12px;}
.h1_tit .h1_logo>a img {width: auto; height: 45px; position:relative;}

.gnb ul>li>a>.title, .greeting .intro>strong, .greeting>.text, .name {font-family: NotoSans !important;}

.gnb ul>li>a>.title { width:90%; padding:0 5%;}

.ssTitleNormal {border-bottom: none; background: #252839; padding: 15px; color: #fff !important; text-align: center; border-radius: 12px;}

.table-program tbody td:last-child {border-right: 1px solid #e4e4e4;}

p {
  line-height: 1.6; /* 글자 크기의 1.6배만큼 줄 간격을 줍니다 */
}

h1 {
  line-height: 2; /* 글자 크기의 1.6배만큼 줄 간격을 줍니다 */
}

h2 {
  line-height: 1.8; /* 글자 크기의 1.6배만큼 줄 간격을 줍니다 */
}

h3 {
  line-height: 1.8; /* 글자 크기의 1.6배만큼 줄 간격을 줍니다 */
}

h4 {
  line-height: 1.8; /* 글자 크기의 1.6배만큼 줄 간격을 줍니다 */
}

h5 {
  line-height: 1.8; /* 글자 크기의 1.6배만큼 줄 간격을 줍니다 */
}

/* tbl_wrap 클래스가 적용된 모든 표에 스크롤 기능 부여 */
.tbl_wrap {
    width: 100%;
    overflow-x: auto; /* 가로 내용이 넘치면 스크롤 생성 */
    -webkit-overflow-scrolling: touch; /* 모바일에서 부드러운 스크롤 */
    margin-bottom: 20px;
}

/* tbl_wrap 내부의 table이 갑자기 줄어들지 않도록 최소 너비 설정 (선택 사항) */
.tbl_wrap table {
    min-width: 600px; /* 모바일에서도 표 형식을 유지하고 싶다면 설정 */
    border-collapse: collapse;
}



@media only screen and (max-width: 567px){
.h1_tit .h1_logo>a img {height:37px !important; top:-10px; left:-20px; width: auto !important;}
.sub .h1_tit .h1_logo>a img {height:37px !important; top:-5px; left:-4px; width: auto !important;}
}


@media only screen and (max-width:1370px){
	.swiper-main .swiper-slide {height:1070px;}
}

@media only screen and (max-width:1024px){
	.swiper-main .swiper-slide {height:884px;}
}
@media only screen and (max-width:830px){
	.swiper-main .swiper-slide {height:980px;}
}
@media only screen and (max-width:567px){
	.swiper-main .swiper-slide {height:760px;}
        .section02 ul>li>a>.icon.ico_abstract  {  margin-left:-12px !important; }
}