/* latin-ext */
@font-face {
  font-family: 'Lato';
  font-style: italic;
  font-weight: 400;
  src: local('Lato Italic'), local('Lato-Italic'), url(https://fonts.gstatic.com/s/lato/v15/S6u8w4BMUTPHjxsAUi-qNiXg7eU0.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Lato';
  font-style: italic;
  font-weight: 400;
  src: local('Lato Italic'), local('Lato-Italic'), url(https://fonts.gstatic.com/s/lato/v15/S6u8w4BMUTPHjxsAXC-qNiXg7Q.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Lato';
  font-style: italic;
  font-weight: 700;
  src: local('Lato Bold Italic'), local('Lato-BoldItalic'), url(https://fonts.gstatic.com/s/lato/v15/S6u_w4BMUTPHjxsI5wq_FQftx9897sxZ.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Lato';
  font-style: italic;
  font-weight: 700;
  src: local('Lato Bold Italic'), local('Lato-BoldItalic'), url(https://fonts.gstatic.com/s/lato/v15/S6u_w4BMUTPHjxsI5wq_Gwftx9897g.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  src: local('Lato Regular'), local('Lato-Regular'), url(https://fonts.gstatic.com/s/lato/v15/S6uyw4BMUTPHjxAwXiWtFCfQ7A.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  src: local('Lato Regular'), local('Lato-Regular'), url(https://fonts.gstatic.com/s/lato/v15/S6uyw4BMUTPHjx4wXiWtFCc.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 700;
  src: local('Lato Bold'), local('Lato-Bold'), url(https://fonts.gstatic.com/s/lato/v15/S6u9w4BMUTPHh6UVSwaPGQ3q5d0N7w.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 700;
  src: local('Lato Bold'), local('Lato-Bold'), url(https://fonts.gstatic.com/s/lato/v15/S6u9w4BMUTPHh6UVSwiPGQ3q5d0.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

a {
  color: #1772d0;
  text-decoration: none;
}

a:focus,
a:hover {
  color: #f09228;
  text-decoration: none;
}

body,
td,
th,
tr,
p,
a {
  font-family: 'Lato', Verdana, Helvetica, sans-serif;
  font-size: 14px
}

strong {
  font-family: 'Lato', Verdana, Helvetica, sans-serif;
  font-size: 14px;
}

heading {
  font-family: 'Lato', Verdana, Helvetica, sans-serif;
  font-size: 22px;
}

papertitle {
  font-family: 'Lato', Verdana, Helvetica, sans-serif;
  font-size: 14px;
  font-weight: 700
}

name {
  font-family: 'Lato', Verdana, Helvetica, sans-serif;
  font-size: 32px;
}

.one {
  width: 160px;
  height: 160px;
  position: relative;
}

.two {
  width: 160px;
  height: 160px;
  position: absolute;
  transition: opacity .2s ease-in-out;
  -moz-transition: opacity .2s ease-in-out;
  -webkit-transition: opacity .2s ease-in-out;
}

.fade {
  transition: opacity .2s ease-in-out;
  -moz-transition: opacity .2s ease-in-out;
  -webkit-transition: opacity .2s ease-in-out;
}

span.highlight {
  background-color: #ffffd0;
}

.social-icons {
  display: flex;
  justify-content: center;  /* 가로 중앙 */
  align-items: center;      /* 세로 중앙 */
  gap: 30px;                /* 아이콘 간 간격 */
  margin-top: 10px;
}

.social-icons .icon {
  display: flex;
  flex-direction: column;
  align-items: center;    /* 가로축 중앙정렬 */
  justify-content: center;/* 세로축 중앙정렬 */
  text-decoration: none;
  width: 30px; /* 아이콘+텍스트 블록 동일폭으로 */
}
/* a 태그에 마우스 올렸을 때 아이콘 커지게 */
.social-icons .icon:hover img {
  transform: scale(1.12);
}

.social-icons .icon img {
  width: 35px;
  height: 35px;
  display: block;         /* 이미지 하단공백 제거 */
  margin-bottom: 3px;     /* 텍스트와 아이콘 간격 */
}

.social-icons .icon span {
  font-size: 14px;
  color: #000000; /* 검정색 */
  text-align: center;
  font-family: "Inter", "Roboto", "Helvetica Neue", Arial, sans-serif;
  font-weight: 500; /* 눈에 잘 들어오는 중간 굵기 */
  letter-spacing: 0.3px; /* 살짝 읽기 좋게 */
}

/* 전체 문단 스타일 */
.intro, .intro-sub {
  font-family: "Inter", "Roboto", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  line-height: 1.6;
  color: #222;
  margin: 8px 0;
}

/* 강조 텍스트: 차분하고 전문적인 딥블루 */
.highlight {
  color: #1A4C8C;
  font-weight: 600;
  background: #f2f2f2 !important; /* 완전 회색 + 강제 적용 */
  padding: 2px 4px;
  border-radius: 4px;
}
/* 링크 스타일 */
.highlight-link {
  color: #1A4C8C;
  font-weight: 600;
  text-decoration: none;
}

.highlight-link:hover {
  text-decoration: underline;
}

/* 아래 문단 */
.intro-sub {
  margin-top: 14px;
  color: #444;
  font-size: 15px;
}

/* ========= News section ========= */

.news-table {
  width: 100%;
  border: 0;
  border-spacing: 0 23px;     /* 항목 사이 간격 */
  margin-left: auto;
  margin-right: auto;
}

/* 날짜 칸 */
.news-date {
  padding: 4px 0;
  width: 110px;
  font-size: 13px;
  vertical-align: top;
  font-family: "Roboto Mono", monospace;
  color: #777;
}

/* 오른쪽 본문 칸 */
.news-body {
  padding: 4px 0;
  vertical-align: top;
}

/* Presented ~ 한 줄 */
.news-meta {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
               "Helvetica Neue", Arial, sans-serif;
  font-size: 14px;
  color: #666;
  margin-bottom: 1px;
}

/* 논문 제목 리스트 전체 */
.news-title-list {
  margin: 4px 0 0 22px;
  padding: 0;
  list-style: disc;
}

/* 논문 제목 한 줄 */
.news-title {
  /*font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,*/
  /*             "Helvetica Neue", Arial, sans-serif;*/
  font-family: 'Inter', sans-serif;
  font-size: 15px;
  color: #222;
  font-weight: 400;   /* 볼드 X */
  line-height: 1.4;
}

/* Oral presentation 강조용 */
.news-oral {
  color: #c00;
  font-weight: 600;
}



/* ===== Publications ===== */

.pub-table {
  width: 100%;
  border: 0;
  border-spacing: 0 22px;
  margin-left: auto;
  margin-right: auto;
}

.pub-thumb-cell {
  padding: 16px 20px 16px 0;
  width: 24%;
  vertical-align: middle;
}

.pub-text-cell {
  padding: 16px 0 16px 32px;   /* 썸네일과 텍스트 사이 간격 ↑ */
  width: 76%;
  vertical-align: middle;
  border-bottom: 1px solid #eee;
}

.pub-row:last-child .pub-text-cell {
  border-bottom: none;
}

/* 썸네일 (video / image 공통) */
.pub-thumb {
  position: relative;
  width: 100%;
  overflow: hidden;
  border-radius: 10px;
}

.pub-thumb video,
.pub-thumb img {
  display: block;
  width: 100%;
}

.pub-thumb .pub-hover {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 0.25s ease;
}

.pub-thumb:hover .pub-hover {
  opacity: 1;
}

/* 텍스트 블록 구조 */
.pub-line {
  margin-bottom: 8px;
  font-size: 14px;
  line-height: 1.5;
}

.pub-line.pub-title-line {
  margin-bottom: 4px;
}

/* 왼쪽 라벨 (TITLE / AUTHORS / VENUE) */
.pub-label {
  display: inline-block;
  min-width: 64px;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #999;
  font-weight: 600;
  margin-right: 6px;
}

/* 제목 스타일 (줄 덜 넘어가게 살짝 작게) */
.pub-title-line papertitle {
  font-size: 13px;
  font-weight: 600;
}


.pub-links {
  margin-top: 12px;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

/* 텍스트 대괄호 태그 */
.pub-btn {
  font-family: "Roboto Mono", monospace;
  font-size: 13px;
  color: #333;
  text-decoration: none;

  padding: 4px 6px;  /* 그림자 공간을 위해 약간 여유 */

  border: none;
  background: none;

  display: inline-block;

  transition:
    color 0.2s ease,
    box-shadow 0.25s ease,
    transform 0.15s ease;
}

/* 대괄호 생성 */
.pub-btn::before {
  content: "[ ";
  color: #777;
  font-weight: 700;
}

.pub-btn::after {
  content: " ]";
  color: #444;
  font-weight: 700;
}

/* 기본 상태: 아주 은은한 물방울 느낌 */
.pub-btn {
  color: #222;
  box-shadow: 0px 1px 3px rgba(0,0,0,0.06);
  border-radius: 6px;  /* 텍스트 주위에 아주 살짝 */
}

/* Hover 시: 살짝 더 떠오르게 */
.pub-btn:hover {
  color: #000;
  box-shadow: 0px 1px 6px rgba(0,0,0,0.12);
  transform: translateY(-0.6px);
}

.pub-btn:hover::before,
.pub-btn:hover::after {
  color: #000;
}

/* 클릭 순간 살짝 눌리는 느낌 */
.pub-btn:active {
  transform: translateY(0);
  box-shadow: 0 1px 3px rgba(0,0,0,0.08);
}

/* 저자 접기/펼치기 */
.pub-authors-extra {
  display: none;
}

.pub-authors-toggle {
  font-size: 12px;
  color: #888;
  cursor: pointer;
  margin-left: 6px;
  text-decoration: underline;
}

/* 탭 전체를 감싸는 영역 (위/아래 구분선 포함) */
/* 전체 탭 영역 (위아래 얇은 라인) */
.tab-nav {
  text-align: center;
  margin: 50px 0 30px;
  padding: 12px 0;
  border-top: 1px solid #e5e5e5;
  border-bottom: 1px solid #e5e5e5;
}

/* 텍스트만 있는 탭 버튼 */
.tab-button {
  background: transparent;
  border: none;
  padding: 10px 22px;
  margin: 0 40px;
  font-size: 15px;
  font-weight: 500;
  color: #555;
  letter-spacing: 0.3px;
  cursor: pointer;
  position: relative;
  transition: color 0.25s ease, transform 0.25s ease;
}

/* 기본 상태: 아래에 아주 연한 라인 */
.tab-button::after {
  content: "";
  position: absolute;
  bottom: -10px;
  left: 0;
  right: 0;
  height: 1.5px;
  background: #e5e5e5;
  opacity: 0;
  transition: opacity 0.25s ease;
}

/* Hover: 텍스트 강조 + 살짝 떠보임 */
.tab-button:hover {
  color: #000;
  transform: translateY(-1px);
}

.tab-button:hover::after {
  opacity: 0.4;
}

/* Active 탭: 굵은 밑줄 + 더 명확한 강조 */
.tab-button.active {
  color: #000;
  font-weight: 500;
}

.tab-button.active::after {
  opacity: 1;
  background: #333;  /* 강조된 밑줄 색 */
}

@media (max-width: 768px) {
  body {
    font-size: 14px;
  }
  heading {
    font-size: 20px;
  }
  .news-title {
    font-size: 14px;
  }
  .pub-text-cell papertitle {
    font-size: 15px;
  }
  /* 전체 폭 꽉 채우기 */
  body > table {
    width: 100% !important;
    max-width: 100% !important;
  }

  /* 위쪽 프로필 영역: 글/사진 세로 배치 */
  /* 첫 번째 프로필 테이블 안의 두 td를 한 줄씩 배치 */
  body > table > tbody > tr > td > table:nth-of-type(1) td {
    display: block;
    width: 100% !important;
    max-width: 100% !important;
    text-align: center;
  }

  /* 소개 문단 좌우 여백 약간 줄이기 */
  .intro,
  .intro-sub {
    text-align: center;
    margin-left: 0;
    margin-right: 0;
  }

  /* 소셜 아이콘: 가운데 정렬 + 줄바꿈 허용 */
  .social-icons {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 8px;
  }

  /* 프로필 이미지: 화면 기준으로 적당한 크기 + 가운데 */
  img[alt="profile photo"] {
    width: 55% !important;
    max-width: 220px !important;
    margin: 0 auto;
    display: block;
  }

  /* 탭 버튼: 모바일에서는 조금 더 작고 촘촘하게 */
  .tab-nav {
    margin: 30px 0 20px;
  }

  .tab-button {
    padding: 6px 14px;
    margin: 0 8px;
    font-size: 14px;
  }

  /* News 테이블: 날짜/내용 세로로 쌓기 */
  .news-table {
    width: 100%;
  }

  .news-table tr {
    display: block;
    margin-bottom: 14px;
  }

  .news-date,
  .news-body {
    display: block;
    width: 100%;
    vertical-align: top;
  }

  .news-date {
    font-size: 11px;
    margin-bottom: 2px;
  }

  .news-title-list {
    margin-left: 18px;   /* bullet 위치 유지 */
  }

  /* Publications: 썸네일 위, 텍스트 아래로 세로 배치 */
  .pub-row {
    display: block;
    padding: 12px 0;
  }

  .pub-thumb-cell,
  .pub-text-cell {
    display: block;
    width: 100%;
  }

  .pub-thumb-cell {
    margin-bottom: 8px;
  }

  .pub-thumb {
    max-width: 100%;
  }

  .pub-thumb img,
  .pub-thumb video {
    width: 100%;
    height: auto;
    display: block;
  }

  .pub-text-cell {
    padding-left: 0 !important;
  }

  /* arXiv / code 태그 줄바꿈 여유 */
  .pub-links {
    gap: 8px;
  }

  /* CV iframe: 모바일에서는 화면 높이에 맞추기 */
  .cv-container iframe {
    height: 65vh;
  }

  /* 푸터와 본문 사이 여백 조금 줄여서 자연스럽게 */
  table[style*="margin:150px auto 0 auto"] {
    margin-top: 80px !important;
  }
}