/* ==========================================================================
   LB IMWEB FIX - 아임웹 호환성 수정 및 오버라이드
   The LEET BIBLE Design System - 아임웹 특화 스타일
   ========================================================================== */

/* ==========================================================================
   SUIT 폰트 전역 적용
   ========================================================================== */

/* SUIT 폰트 Import */
@import url('https://cdn.jsdelivr.net/gh/sunn-us/SUIT/fonts/static/woff2/SUIT.css');

/* 본문 전역 폰트 적용 (아임웹 Pretendard 덮어쓰기) */
html {
  font-size: 16px !important;
  /* rem 기준값 명시 (16px = 16px) */
}

body,
html {
  font-family: var(--tlb-font-body, 'SUIT', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif) !important;
}

/* 본문 요소 폰트 적용 - !important 제거 및 상속 허용 */
body,
p,
span,
li,
td,
th {
  font-family: inherit;
}

/* ==========================================================================
   글꼴 예외 정리 (2026-09-29)
   웹의 글꼴은 SUITE(제목, 라벨)와 SUIT(본문) 둘이다. 아임웹 기본 요소와 코드 위젯이 따로 지정한
   글꼴(imweb Sans, Helvetica, Arial, 시스템 글꼴)을 여기서 맞춘다. 괄호 안 대체값은 core가 오래된 판일 때를 위한 것이다.
   ========================================================================== */

/* 상단 메뉴 글씨: 메뉴 위젯의 글꼴 설정이 imweb Sans다. 폰 메뉴와 하단 메뉴의 .plain_name은 이미 SUIT라 건드리지 않는다 */
.viewport-nav .plain_name {
  font-family: var(--tlb-font-head, 'SUITE', 'SUIT', sans-serif) !important;
}

/* 상품 뱃지(NEW, BEST, SALE, SOLDOUT)는 Helvetica, 개수와 N 표시 뱃지와 찜 개수는 Arial이다 */
.prod_icon,
.badge,
.addon-badge,
.prod_detail_wish_count {
  font-family: var(--tlb-font-head, 'SUITE', 'SUIT', sans-serif) !important;
}

/* 블로그 목록 코드 위젯이 시스템 글꼴을 지정했다 */
.soro-blog {
  font-family: var(--tlb-font-body, 'SUIT', sans-serif) !important;
}

/* ==========================================================================
   팝업 배너 조정
   ========================================================================== */

/* 팝업 배너 높이 조정 */
.popup-banner-wrap {
  height: 40px;
}

.popup-banner-wrap .banner-container .banner_img {
  max-height: 28px !important;
  width: auto;
  padding: 5px 0;
}

.close_tools {
  display: none;
}

/* ==========================================================================
   세부 카테고리 네비게이션 (서브메뉴)
   ========================================================================== */

/* 세부 카테고리 버튼 스타일 */
.nav.sub-menu a {
  position: relative;
  font-weight: 500;
  font-size: var(--tlb-fs-body);
  color: var(--color-text-body);
  text-decoration: none;
  margin: 0 var(--spacing-sm);
  padding: 5px 0;
  display: inline-block;
}

.nav.sub-menu a::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 0;
  height: 3px;
  background-color: var(--color-primary);
  transition: all 0.3s ease-in-out;
  transform: translateX(-50%);
}

.nav.sub-menu a:hover::after {
  width: 100%;
  left: 0;
  transform: translateX(0);
  height: 3px;
}

/* 선택된 상태 스타일 */
.nav.sub-menu a.active {
  color: var(--color-primary);
  font-weight: 700;
}

.nav.sub-menu a.active::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background-color: var(--color-primary);
  transform: none;
}

/* ==========================================================================
   게시판 (Bulletin Board) 스타일 수정
   ========================================================================== */

/* 게시판의 정렬 메뉴. 카테고리 라벨은 아래 '게시물 카테고리 칩'에서 별도로 다룬다. */
ul.dropdown-menu li {
  font-size: 22px;
}

ul.li_body.holder {
  padding-left: 0;
  padding-right: 0;
}

/* [게시판 스타일 정정] 여기까지 끝 */

/* ==========================================================================
   브이리뷰 (VReview) 섹션 조정
   ========================================================================== */

/* 리뷰 섹션 상단 여백 조정 */
.vreview-row.vreview-board-popup {
  margin-top: 8px !important;
}

/* 별 아이콘 크기 조정 */
.vreview-rating svg {
  width: 20px;
  height: 20px;
}

/* 구매평 위젯(알파리뷰)의 게시판 iframe이 폰에서 화면보다 넓다(2026-09-29 확인). 위젯 CSS가 위젯 본체 iframe에는
   좌우 15px씩(폭 +30px, 왼쪽 -15px)을 주고 게시판 iframe에는 20px씩(폭 +40px, 왼쪽 -20px)을 줘서, 폰에서 화면보다 10px 넓어져
   옆으로 5px 밀린다. 게시판 iframe도 본체와 같은 15px로 맞춘다 */
@media (max-width: 767px) {
  iframe.vreview-embed-widget-iframe.vreview-board-widget-iframe {
    max-width: calc(100% + 30px) !important;
    width: calc(100% + 30px) !important;
    margin-left: -15px !important;
  }
}

/* 상품 목록의 별점 숫자와 리뷰 수. 위젯의 인라인 style 문자열 대신 실제 별 아이콘 다음 요소를 지정한다.
   상세 리뷰 게시판의 외부 iframe 내부에는 이 규칙이 적용되지 않는다. */
.vreview-review-summary .vreview-row.vreview-board-popup {
  align-items: center;
}

.vreview-review-summary .vreview-row.vreview-board-popup > .vreview-rating + div {
  font-family: var(--tlb-font-head) !important;
  font-size: var(--tlb-fs-lead) !important;
  font-weight: var(--tlb-review-score-weight) !important;
  line-height: var(--tlb-lh-ui);
  letter-spacing: var(--tlb-ls-head);
  color: var(--color-text-title);
  font-variant-numeric: tabular-nums;
  margin-left: 6px !important;
}

/* ==========================================================================
   모바일 반응형 조정
   ========================================================================== */

/* 모바일 환경 (최대 너비 768px 기준) */
@media only screen and (max-width: 768px) {

  /* 세부 카테고리 모바일 조정 */
  .nav.sub-menu ul {
    gap: 10px;
    flex-wrap: wrap;
  }

  .nav.sub-menu a {
    font-size: var(--tlb-fs-meta);
    margin: 0 var(--spacing-xs);
    padding: 4px 0;
  }

  .nav.sub-menu a::after {
    height: 3px;
  }

  .nav.sub-menu a.active::after {
    height: 2px;
  }
}

/* ==========================================================================
   본문 조판 연결 (2026-09-30)
   SUIT 산문: 고정 자간 + 왼쪽 정렬. 줄을 채우려고 글자나 어절 사이를 늘리지 않는다.
   제목, 메뉴, 가격, 버튼, 표 셀은 대상이 아니다. 가운데/오른쪽 정렬을 지정한 편집기 문단도 보존한다.
   값의 정본은 core의 Type System이다. inline 스타일은 여기서 새로 만들지 않는다.
   ========================================================================== */
.item-summary.holder.fr-view p,
.goods_summary .fr-view p,
.widget_text_wrap .text-table p:not(.title):not(:where(
  [style*="text-align: center" i], [style*="text-align:center" i],
  [style*="text-align: right" i], [style*="text-align:right" i],
  [style*="text-align: center" i] *, [style*="text-align:center" i] *,
  [style*="text-align: right" i] *, [style*="text-align:right" i] *,
  .tlb_text_center *, .tlb_text_right *, .tlb-story *, .tlb-tc-wrapper *
)),
.blog-content p:not(:where(
  [style*="text-align: center" i], [style*="text-align:center" i],
  [style*="text-align: right" i], [style*="text-align:right" i],
  [style*="text-align: center" i] *, [style*="text-align:center" i] *,
  [style*="text-align: right" i] *, [style*="text-align:right" i] *
)),
.soro-blog-card-excerpt,
.tlb-story.tlb-story :is(.tlb9-line-desc, .tlb9-bio, .tlb9-prob2-txt, .tlb9-qa2-txt, .tlb9-qa2-note, .tlb9-solve-desc, .tlb9-faq p, .tlb9-faqs details p),
.tlb-intro :is(.tlb-intro__p, .tlb-intro__reason-p, .tlb-intro__essay p, .tlb-intro__pair-text p) {
  text-align: var(--tlb-prose-align) !important;
  text-align-last: var(--tlb-prose-align-last);
  text-justify: none;
  word-break: var(--tlb-prose-word-break) !important;
  overflow-wrap: break-word;
  line-break: strict;
  font-kerning: normal;
  letter-spacing: var(--tlb-ls-body);
}

/* 상세 안내와 텍스트 위젯은 본문 줄간격을 따른다. */
.goods_summary .fr-view p,
.widget_text_wrap .text-table p:not([style*="line-height" i]):not(:where(
  [style*="text-align: center" i], [style*="text-align:center" i],
  [style*="text-align: right" i], [style*="text-align:right" i],
  .tlb-story *, .tlb-tc-wrapper *
)) {
  line-height: var(--tlb-lh-body);
}

/* 아임웹 게시물 제목은 div/h1에도 SUITE를 명시한다. 본문과 요약은 SUIT를 유지한다. */
.list-style-card .title,
.list-style-card .title :is(a, span, strong, b),
.li_body .title,
.li_body .title :is(a, span, strong, b),
.board-title .view_tit,
.board-title .view_tit :is(a, span, strong, b),
.soro-blog-card-title,
.soro-blog-card-title :is(a, span, strong, b),
.tlb-magazine-resource__title {
  font-family: var(--tlb-font-head) !important;
}

/* 상품·매거진·블로그의 카드 제목은 같은 크기와 줄간격을 쓴다. */
.shop-item .item-detail .item-pay h2,
.shop-item .item-overlay .item-pay h2,
.list-style-card .title,
.li_body .title,
.soro-blog-card-title {
  font-family: var(--tlb-font-head) !important;
  font-size: var(--tlb-card-title-size) !important;
  font-weight: var(--tlb-fw-bold);
  line-height: var(--tlb-lh-head);
  letter-spacing: var(--tlb-ls-head);
}

/* 상품 목록 소개문: 줄 안은 촘촘하게, 가격과는 별도 여백으로 구분한다(2026-09-30 대표 정정). */
#doz_body .shop-item .item-summary {
  font-size: var(--tlb-card-summary-size) !important;
  margin-top: var(--tlb-card-summary-gap) !important;
  line-height: var(--tlb-card-summary-leading);
}

#doz_body .shop-item .item-summary p {
  font-size: var(--tlb-card-summary-size) !important;
  line-height: var(--tlb-card-summary-leading) !important;
}

/* ==========================================================================
   게시물 카테고리 칩 (2026-09-30 대표 지시)
   최근 게시물 카드와 게시판 목록의 색 있는 카테고리만 작게 만든다. N/공지 표시는 대상이 아니다.
   아임웹 카테고리색은 배경으로 유지하고 글자는 공통 흰색 토큰으로 그린다.
   ========================================================================== */
.list-style-card .title > span:not(.icons) > em[style*="color" i],
.category em[style*="color" i],
.view_tit .category[style*="color" i] {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  padding: var(--tlb-category-chip-padding) !important;
  border: 0;
  border-radius: var(--tlb-radius-sm);
  background: currentColor;
  -webkit-text-fill-color: var(--tlb-category-chip-ink);
  font-family: var(--tlb-font-head) !important;
  font-size: var(--tlb-category-chip-size) !important;
  font-weight: var(--tlb-category-chip-weight) !important;
  line-height: var(--tlb-lh-head);
  letter-spacing: var(--tlb-ls-head);
  font-style: normal;
  text-align: left;
  vertical-align: middle;
  white-space: normal;
  overflow-wrap: break-word;
}

/* 최근 게시물과 게시판 목록에서는 제목 옆 칩보다 작은 카드용 공통 역할을 쓴다. */
.list-style-card .title > span:not(.icons) > em[style*="color" i],
.category em[style*="color" i] {
  font-size: var(--tlb-category-card-chip-size) !important;
  padding: var(--tlb-category-card-chip-padding) !important;
}

/* 글 제목 안의 칩은 첫 줄의 가운데에 놓고 텍스트와 분리한다. */
.board-title .view_tit > a:has(> .category[style*="color" i]) {
  font-size: inherit !important;
  line-height: inherit !important;
  display: inline-flex;
  align-items: center;
  vertical-align: text-top;
  margin-inline-end: var(--tlb-category-chip-inline-gap);
  transform: translateY(var(--tlb-category-chip-inline-shift));
  text-decoration: none;
}

.vreview-review-summary :is(.tlb-review-score, .tlb-review-count) {
  pointer-events: none;
}

/* 별점은 헤딩, 괄호 안 리뷰 수는 보조 정보의 공통 굵기를 받는다. */
.vreview-review-summary .tlb-review-score {
  font-weight: var(--tlb-review-score-weight) !important;
}
.vreview-review-summary .tlb-review-count {
  font-family: var(--tlb-review-count-font) !important;
  font-weight: var(--tlb-review-count-weight) !important;
}

/* 칩 아래 아임웹의 em 여백과 inline 기준선 여백이 중첩되지 않게 한다. */
.list-style-card .title > span:not(.icons) > em[style*="color" i] {
  margin: 0;
}

.list-style-card .title > span:not(.icons):has(> em[style*="color" i]) {
  display: flex;
  align-items: flex-start;
  margin-bottom: var(--tlb-category-chip-title-gap);
}

/* 모바일 반응형 (767px 이하) */
@media screen and (max-width: 767px) {
  .nav.sub-menu ul {
    gap: 10px;
    flex-wrap: wrap;
  }

  .nav.sub-menu a {
    font-size: var(--tlb-fs-meta);
    margin: 0 var(--spacing-xs);
    padding: 4px 0;
  }

  .nav.sub-menu a::after {
    height: 3px;
  }

  .nav.sub-menu a.active::after {
    height: 2px;
  }
}

/* ==========================================================================
   콘텐츠 조판 통일 (2026-09-30 대표 지시)
   아임웹의 기존 인터뷰 rem 확대·게시물 인라인 서식·매거진 별도 크기를 공통 토큰으로 보정한다.
   상품 상세의 제작 조각은 대상이 아니다. 제목 SUITE / 산문 SUIT / 간격 강제 확장 없음.
   ========================================================================== */
.board_txt_area > .margin-top-xxl,
.board-title,
.soro-blog-article {
  max-width: var(--tlb-editorial-width);
  margin-left: auto;
  margin-right: auto;
}
.board_txt_area > .margin-top-xxl,
.board_txt_area .blog-content,
.board_txt_area .interview-container,
.soro-blog-article-content {
  font-family: var(--tlb-font-body) !important;
  font-size: var(--tlb-editorial-body-size) !important;
  line-height: var(--tlb-lh-body) !important;
  letter-spacing: var(--tlb-ls-body) !important;
  color: var(--color-text-body);
}
:is(.board_txt_area .margin-top-xxl, .soro-blog-article-content) :is(p, li, blockquote, .answer-text):not(.tlb-magazine-resource__title) {
  font-family: var(--tlb-font-body) !important;
  font-size: var(--tlb-editorial-body-size) !important;
  line-height: var(--tlb-lh-body) !important;
  letter-spacing: var(--tlb-ls-body) !important;
  font-weight: var(--tlb-fw-regular);
  font-kerning: normal;
  text-justify: none !important;
  overflow-wrap: break-word;
  word-break: var(--tlb-prose-word-break);
}
:is(.board_txt_area .margin-top-xxl, .soro-blog-article-content) :is(p, li, blockquote):not(.tlb-magazine-resource__title) :is(span, a, strong, b, em, i),
.board_txt_area .interview-container .answer-text :is(p, strong, b, em, span) {
  font-family: inherit !important;
  font-size: inherit !important;
  line-height: inherit !important;
  letter-spacing: inherit !important;
}
:is(.board_txt_area .margin-top-xxl, .soro-blog-article-content) p:not(.tlb-magazine-resource__title) {
  margin-top: 0;
  margin-bottom: var(--tlb-editorial-paragraph-gap);
}
:is(.board_txt_area .margin-top-xxl, .soro-blog-article-content) :is(strong, b) {
  font-weight: var(--tlb-fw-bold) !important;
}
:is(.board_txt_area .margin-top-xxl, .soro-blog-article-content) :is(p, li, blockquote):not(:where(
  [style*="text-align: center" i], [style*="text-align:center" i],
  [style*="text-align: right" i], [style*="text-align:right" i],
  [style*="text-align: center" i] *, [style*="text-align:center" i] *,
  [style*="text-align: right" i] *, [style*="text-align:right" i] *
)) {
  text-align: var(--tlb-prose-align) !important;
}
.board-title .view_tit,
.soro-blog-article-title {
  font-family: var(--tlb-font-head) !important;
  font-size: var(--tlb-editorial-title-size) !important;
  line-height: var(--tlb-lh-head) !important;
  font-weight: var(--tlb-fw-bold) !important;
  letter-spacing: var(--tlb-ls-head) !important;
}
:is(.board_txt_area .margin-top-xxl, .soro-blog-article-content) :is(h1, h2, h3, h4, h5, h6),
.board_txt_area .interview-container h2.question {
  font-family: var(--tlb-font-head) !important;
  font-size: var(--tlb-editorial-h2-size) !important;
  line-height: var(--tlb-lh-head) !important;
  letter-spacing: var(--tlb-ls-head) !important;
  font-weight: var(--tlb-fw-bold) !important;
  color: var(--color-text-title) !important;
  margin: var(--tlb-editorial-section-gap) 0 var(--tlb-editorial-paragraph-gap) !important;
}
/* 글꼴 통일 때문에 매거진의 기존 밑줄·장식까지 지우지 않는다. */
:is(.board_txt_area .margin-top-xxl, .soro-blog-article-content) :is(h1, h2, h3, h4, h5, h6):not(.blog-content :is(h1, h2, h3, h4, h5, h6)) {
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
}
:is(.board_txt_area .margin-top-xxl, .soro-blog-article-content) :is(h1, h2, h3, h4, h5, h6) :is(span, a, strong, b, em),
.board_txt_area .interview-container h2.question .question-number {
  font-family: inherit !important;
  font-size: inherit !important;
  line-height: inherit !important;
  font-weight: inherit !important;
  letter-spacing: inherit !important;
}
:is(.board_txt_area .margin-top-xxl, .soro-blog-article-content) :is(h1, h2, h3, h4, h5, h6):not(.blog-content :is(h1, h2, h3, h4, h5, h6))::after {
  content: none !important;
}
:is(.board_txt_area .margin-top-xxl, .soro-blog-article-content) h3 {
  font-size: var(--tlb-editorial-h3-size) !important;
  margin-top: var(--tlb-editorial-subsection-gap) !important;
}
:is(.board_txt_area .margin-top-xxl, .soro-blog-article-content) :is(h4, h5, h6) {
  font-size: var(--tlb-editorial-h4-size) !important;
  margin-top: var(--tlb-editorial-minor-gap) !important;
}
.board_txt_area .interview-container .question-number {
  display: inline !important;
  margin: 0 6px 0 0 !important;
  color: var(--color-primary) !important;
}
.board_txt_area .interview-container .answer-container {
  background: transparent !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin-bottom: var(--tlb-editorial-subsection-gap);
}
.board_txt_area .interview-container .answer-container::before { display: none; }
.board_txt_area .interview-container .answer-text em {
  background: none;
  font-style: normal;
  font-weight: var(--tlb-fw-bold);
}
.board_txt_area .interview-container .profile-section { margin-bottom: var(--tlb-editorial-subsection-gap); }
.board_txt_area .interview-container .interviewee-info { margin-bottom: var(--tlb-editorial-minor-gap); }
.board_txt_area .interview-container .interviewee-name {
  font-family: var(--tlb-font-head) !important;
  font-size: var(--tlb-editorial-title-size) !important;
  line-height: var(--tlb-lh-head);
  letter-spacing: var(--tlb-ls-head);
  font-weight: var(--tlb-fw-bold);
  margin-bottom: var(--spacing-xs);
}
.board_txt_area .interview-container .interviewee-school {
  font-size: var(--tlb-editorial-body-size);
  line-height: var(--tlb-lh-body);
  letter-spacing: var(--tlb-ls-body);
}
.board_txt_area .interview-container .score-section {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--tlb-editorial-paragraph-gap);
  margin-bottom: var(--tlb-editorial-minor-gap);
}
.board_txt_area .interview-container .score-box { min-width: 0; }
.board_txt_area .interview-container .score-title {
  font-family: var(--tlb-font-head) !important;
  font-size: var(--tlb-fs-body);
  line-height: var(--tlb-lh-head);
  letter-spacing: var(--tlb-ls-head);
  font-weight: var(--tlb-fw-bold);
  margin-bottom: var(--spacing-xs);
}
.board_txt_area .interview-container .score-details {
  padding: 12px;
  border-radius: 4px;
}
.board_txt_area .interview-container .score-item {
  font-size: var(--tlb-fs-meta);
  line-height: var(--tlb-lh-ui);
  letter-spacing: var(--tlb-ls-body);
  margin-bottom: var(--spacing-xs);
  gap: 6px;
}
.board_txt_area .interview-container .score-item:last-child {
  font-family: var(--tlb-font-head) !important;
  font-size: var(--tlb-fs-body);
  font-weight: var(--tlb-fw-bold);
  padding-top: var(--spacing-xs);
}
.board_txt_area .interview-container .score-item:last-child span { font-family: inherit; }
.board_txt_area .interview-container .score-increase-banner {
  padding: var(--tlb-editorial-paragraph-gap);
  margin-bottom: var(--tlb-editorial-subsection-gap);
  background: var(--color-background);
  color: var(--color-text-title);
  border-radius: 4px;
  box-shadow: none;
}
.board_txt_area .interview-container .score-increase-text,
.board_txt_area .interview-container .score-increase-number {
  font-family: var(--tlb-font-head) !important;
  font-size: var(--tlb-fs-lead);
  line-height: var(--tlb-lh-head);
  letter-spacing: var(--tlb-ls-head);
  font-weight: var(--tlb-fw-bold);
  white-space: normal;
}
.board_txt_area .interview-container .score-increase-number {
  font-size: var(--tlb-editorial-title-size);
  color: var(--color-primary);
  margin: 0 4px;
}
.board_txt_area .interview-container .score-image-placeholder {
  border-radius: 0;
  border: 1px solid var(--color-border);
  margin-bottom: var(--tlb-editorial-minor-gap);
}
.board_txt_area .interview-container .interview-divider { margin: var(--tlb-editorial-subsection-gap) 0; }

/* 블로그 허브의 페이지 제목과 글 상세 제목도 각자의 공통 역할 크기를 따른다. */
.soro-blog-header h1 {
  font-family: var(--tlb-font-head) !important;
  font-size: var(--tlb-fs-title) !important;
  line-height: var(--tlb-lh-title);
  font-weight: var(--tlb-fw-bold);
  letter-spacing: var(--tlb-ls-head);
}
.soro-blog:has(.soro-blog-article) .soro-blog-header {
  max-width: var(--tlb-editorial-width);
  margin-left: auto;
  margin-right: auto;
}
.soro-blog-article-date {
  font-family: var(--tlb-font-body);
  font-size: var(--tlb-fs-caption);
  line-height: var(--tlb-lh-ui);
}

/* 관련 자료의 섹션명도 콘텐츠 소제목 역할을 받는다. */
.tlb-magazine-resource__title {
  font-size: var(--tlb-editorial-h3-size) !important;
  line-height: var(--tlb-lh-head) !important;
  letter-spacing: var(--tlb-ls-head) !important;
  font-weight: var(--tlb-fw-bold) !important;
}

#doz_body .shop-item .item-summary p :is(span, a, strong, b, em) {
  font-size: inherit !important;
  line-height: inherit !important;
}

/* ==========================================================================
   채널톡 모바일 위치 (2026-09-30)
   아임웹이 entry와 shadow host를 각각 75px 올려 상담 버튼이 총 150px 뜬다.
   SDK 자체의 우측·하단 여백은 그대로 쓰고 부모의 중복 이동만 없앤다.
   상품상세에서는 구매바 높이를 감안한 core 토큰만큼 entry를 한 번 올린다.
   ========================================================================== */
@media (max-width: 767px) {
  #ch-plugin-entry,
  #ch-plugin-entry > div {
    transform: none !important;
  }

  body.shop_view #ch-plugin-entry {
    /* 상품상세에는 mobile-nav-on이 없어 entry가 문서 흐름에 남는다. 하단 0을 기준점으로 만든다. */
    position: fixed !important;
    top: auto !important;
    bottom: 0 !important;
    left: 0;
    right: 0;
    height: 0;
    transform: translateY(calc(-1 * var(--tlb-chat-pdp-clearance))) !important;
  }
}

/* BEGIN Category series imweb 2026-10-06 (카테고리 소개 칸 .tlb-series 와 짝. 컴포넌트 모양은 tlb-landing.css "Category series landing") */
/* Practice 카테고리의 옛 이미지 위젯은 새 칸이 있을 때도 감춘다(native 구획과 같은 규칙). */
body:has(.tlb-series--practice) #w202504155684bd585e8cb,
body:has(.tlb-series--practice) :is(#s20250415f4040775cec1e, #s20250415fb41789a8fc2c, #s20250415201a1ec15bb0b, #s2025041519f95ecd0f250, #s202504158b1ae25b61fb7, #s2025041538207cda95a8c) { display: none !important; }
/* Practice 카테고리 섹션은 옛 이미지 랜딩 때 회색 배경이 지정돼 있다. 다른 카테고리처럼 흰 바탕으로 둔다. */
body:has(.tlb-series--practice) #s20250415481b1204c6b68,
body:has(.tlb-series--practice) #s20250415481b1204c6b68 > .section_bg_color { background-color: #fff !important; }
/* 소개 칸을 상품 목록 위로 올린다(대표 2026-10-06 "전부 목록 위로"). 아임웹 디자인 모드는 위젯을 섹션 끝에만 붙여 넣을 수 있어,
   위젯 자리는 그대로 두고 같은 섹션의 행 순서만 바꾼다: 제목, 메뉴, 머리말(0) 다음 소개 칸(1), 그다음 목록과 그 아래 행(2). */
:where(div):has(> .doz_row .tlb-series) {display: flex; flex-direction: column;}
:where(div):has(> .doz_row .tlb-series) > .doz_row:has([data-widget-type="shopping"]),
:where(div):has(> .doz_row .tlb-series) > .doz_row:has([data-widget-type="shopping"]) ~ .doz_row {order: 2;}
:where(div):has(> .doz_row .tlb-series) > .doz_row.doz_row:has(.tlb-series) {order: 1; margin: var(--tlb-space-md) 0 var(--tlb-space-xl);}
/* 띠가 제목과 카테고리 이동을 맡으므로, 아임웹의 카테고리 제목, 카테고리 메뉴, 머리말 줄은 이 페이지들에서 감춘다. */
body:has(.tlb-series-top) .doz_row:has([data-widget-type="sub_menu"]),
body:has(.tlb-series-top) .doz_row:has([data-widget-type="text"]):has(+ .doz_row [data-widget-type="sub_menu"]),
body:has(.tlb-series-top) .doz_row:has([data-widget-type="sub_menu"]) + .doz_row:has([data-widget-type="text"]) {display: none !important;}
/* 제목과 메뉴만 있던 섹션(Basic, Practice Book)은 여백만 남으므로 섹션째 감춘다. */
body:has(.tlb-series-top) [doz_type="section"]:has([data-widget-type="sub_menu"]):not(:has([data-widget-type="shopping"], [data-widget-type="code"], [data-widget-type="image"])) {display: none !important;}
/* 띠가 맨 위에 붙도록 소개 칸 줄을 섹션의 첫 줄로 올리고, 섹션 위 여백을 없앤다. */
:where(div):has(> .doz_row .tlb-series-top) > .doz_row.doz_row:has(.tlb-series-top) {order: -1; margin: 0 0 var(--tlb-space-xl);}
[doz_type="section"]:has(.tlb-series-top) main, [doz_type="section"]:has(.tlb-series-top) main > .inside {padding-top: 0 !important;}
/* 트레이닝캠프는 띠 바로 아래 캠프 랜딩이 이어지므로 띠 아래 여백을 두지 않는다. */
:where(div):has(> .doz_row .tlb-series-top) > .doz_row.doz_row:has(.tlb-series--tc) {margin-bottom: 0;}
/* 전체 페이지는 띠를 제목 섹션에 넣는다. 그 섹션의 빈 여백 위젯 줄이 띠 아래 큰 빈칸을 만들어 감춘다. */
[doz_type="section"]:has(.tlb-series--all) .doz_row:has([data-widget-type="padding"]):not(:has([data-widget-type]:not([data-widget-type="padding"]))) {display: none !important;}
/* END Category series imweb */

/* BEGIN Editorial article design · editorial-unified-codex · 2026-10-10
   매거진의 읽기 폭·타이포·소제목 밑줄을 공개 게시글 공통 역할로 연결한다.
   값은 core editorial 토큰을 따르며 CASE STUDY의 문제·인용·해설 전용 서식은 보존한다. */
.board_view .board_txt_area,
.board_view .board_txt_area > .margin-top-xxl,
.board_view .board_txt_area .interview-container {
  width: 100%;
  max-width: var(--tlb-editorial-width);
  min-width: 0;
  margin-inline: auto;
}
.board_view .board_txt_area .interview-container {
  padding-inline: 0 !important;
  box-shadow: none !important;
}
.board_view .board_txt_area .tlb-editorial-empty {
  display: none !important;
}
.board_view .board_txt_area :is(.tlb-editorial-table, .tlb-magazine-table, .table-responsive):focus-visible {
  outline: var(--tlb-editorial-heading-rule) solid var(--color-primary);
  outline-offset: var(--tlb-editorial-heading-rule);
}
.board_view .board_txt_area.board_txt_area.board_txt_area :is(h2, h3, .tlb-editorial-legacy-heading):not(:where(.tlb-case-article, .tlb-case-article *)) {
  position: relative;
  display: block;
  font-family: var(--tlb-font-head) !important;
  font-weight: var(--tlb-editorial-heading-weight) !important;
  line-height: var(--tlb-lh-head) !important;
  letter-spacing: var(--tlb-ls-head) !important;
  color: var(--color-text-title) !important;
  text-align: left !important;
  text-align-last: auto !important;
  word-break: keep-all !important;
  overflow-wrap: anywhere;
  background: transparent !important;
}
.board_view .board_txt_area.board_txt_area.board_txt_area :is(h2, .tlb-editorial-legacy-heading):not(:where(.tlb-case-article, .tlb-case-article *)) {
  font-size: var(--tlb-editorial-h2-size) !important;
  margin: var(--tlb-editorial-section-gap) 0 var(--tlb-editorial-paragraph-gap) !important;
  padding: 0 0 var(--tlb-editorial-heading-padding) !important;
  border: 0 !important;
  border-bottom: var(--tlb-editorial-heading-rule) solid var(--color-primary-transparent) !important;
}
.board_view .board_txt_area.board_txt_area.board_txt_area :is(h2, .tlb-editorial-legacy-heading):not(:where(.tlb-case-article, .tlb-case-article *))::after {
  content: "" !important;
  position: absolute;
  inset: auto auto calc(-1 * var(--tlb-editorial-heading-rule)) 0;
  width: var(--tlb-editorial-heading-accent);
  height: var(--tlb-editorial-heading-rule);
  background: var(--color-primary);
}
.board_view .board_txt_area.board_txt_area.board_txt_area h3:not(:where(.tlb-case-article, .tlb-case-article *)) {
  font-size: var(--tlb-editorial-h3-size) !important;
  margin: var(--tlb-editorial-subsection-gap) 0 var(--tlb-editorial-paragraph-gap) !important;
  padding: 0 0 var(--tlb-editorial-heading-padding) !important;
  border: 0 !important;
  border-bottom: 1px solid var(--color-border-dark) !important;
}
.board_view .board_txt_area.board_txt_area.board_txt_area h3:not(:where(.tlb-case-article, .tlb-case-article *))::after {
  content: none !important;
}
.board_view .board_txt_area.board_txt_area.board_txt_area :is(h2, h3, .tlb-editorial-legacy-heading):not(:where(.tlb-case-article, .tlb-case-article *)) :is(span, a, strong, b, em) {
  font-family: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  line-height: inherit !important;
  letter-spacing: inherit !important;
}
.board_view .board_txt_area :is(.tlb-editorial-table, .tlb-magazine-table, .table-responsive):not(:where(.tlb-case-article, .tlb-case-article *)) {
  max-width: 100%;
  overflow-x: auto;
  margin: var(--tlb-editorial-minor-gap) 0 var(--tlb-editorial-subsection-gap);
  border-top: var(--tlb-editorial-heading-rule) solid var(--color-text-title);
  -webkit-overflow-scrolling: touch;
}
.board_view .board_txt_area :is(.tlb-editorial-table, .tlb-magazine-table, .table-responsive):not(:where(.tlb-case-article, .tlb-case-article *)) table {
  width: 100% !important;
  min-width: 0;
  border-collapse: collapse;
  table-layout: auto;
  font-family: var(--tlb-font-body) !important;
  font-size: var(--tlb-fs-small) !important;
  line-height: var(--tlb-lh-text) !important;
  letter-spacing: var(--tlb-ls-body) !important;
}
.board_view .board_txt_area :is(.tlb-editorial-table, .tlb-magazine-table, .table-responsive):not(:where(.tlb-case-article, .tlb-case-article *)) table:has(tr > :is(th, td):nth-child(n+4)) {
  min-width: 650px;
}
.board_view .board_txt_area :is(.tlb-editorial-table, .tlb-magazine-table, .table-responsive):not(:where(.tlb-case-article, .tlb-case-article *)) :is(th, td) {
  padding: var(--spacing-xs) var(--tlb-space-sm) !important;
  border: 0;
  border-bottom: 1px solid var(--color-border-dark) !important;
  text-align: left;
  vertical-align: top;
  overflow-wrap: anywhere;
}
.board_view .board_txt_area :is(.tlb-editorial-table, .tlb-magazine-table, .table-responsive):not(:where(.tlb-case-article, .tlb-case-article *)) th {
  font-family: var(--tlb-font-head) !important;
  font-weight: var(--tlb-fw-bold);
  background: var(--color-background) !important;
}
.board_view .board_txt_area :is(.tlb-editorial-table, .tlb-magazine-table, .table-responsive):not(:where(.tlb-case-article, .tlb-case-article *)) td {
  font-family: var(--tlb-font-body) !important;
}
.board_view .board_txt_area :is(.tlb-editorial-table, .tlb-magazine-table, .table-responsive):not(:where(.tlb-case-article, .tlb-case-article *)) :is(th, td) :is(p, span, strong, b, font, a, em, i) {
  font-family: inherit !important;
  font-size: inherit !important;
  line-height: inherit !important;
  letter-spacing: inherit !important;
}
.board_view .board_txt_area > .margin-top-xxl img {
  max-width: 100%;
  height: auto;
}
.board_view .board_txt_area a {
  text-underline-offset: .16em;
}
/* 후기의 학년도별 점수 요약: 기존 인터뷰와 같은 입력·배치·상승폭 역할. */
.board_view .board_txt_area :is(.interview-container, .tlb-editorial-score-summary) .score-section {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--tlb-editorial-paragraph-gap);
  margin-bottom: var(--tlb-editorial-minor-gap);
}
.board_view .board_txt_area .tlb-editorial-score-summary {
  margin-block: var(--tlb-editorial-minor-gap);
}
.board_view .board_txt_area .tlb-editorial-score-summary--single {
  max-width: calc(var(--tlb-editorial-width) / 2);
  margin-inline: auto;
}
.board_view .board_txt_area .tlb-editorial-score-summary--single .score-section {
  grid-template-columns: minmax(0, 1fr);
}
.board_view .board_txt_area :is(.interview-container, .tlb-editorial-score-summary) .score-box {
  min-width: 0;
}
.board_view .board_txt_area :is(.interview-container, .tlb-editorial-score-summary) .score-title {
  font-family: var(--tlb-font-head) !important;
  font-size: var(--tlb-fs-body) !important;
  line-height: var(--tlb-lh-head) !important;
  letter-spacing: var(--tlb-ls-head) !important;
  font-weight: var(--tlb-fw-bold) !important;
  margin-bottom: var(--spacing-xs);
}
.board_view .board_txt_area :is(.interview-container, .tlb-editorial-score-summary) .score-details {
  padding: var(--tlb-editorial-paragraph-gap);
  border-radius: 4px;
  background: var(--color-background);
}
.board_view .board_txt_area :is(.interview-container, .tlb-editorial-score-summary) .score-item {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: var(--spacing-xs);
  font-family: var(--tlb-font-body) !important;
  font-size: var(--tlb-fs-meta) !important;
  line-height: var(--tlb-lh-ui) !important;
  letter-spacing: var(--tlb-ls-body) !important;
  margin-bottom: var(--spacing-xs);
}
.board_view .board_txt_area :is(.interview-container, .tlb-editorial-score-summary) .score-item:last-child {
  margin-bottom: 0;
  padding-top: var(--spacing-xs);
  border-top: 1px solid var(--color-border-dark);
  font-family: var(--tlb-font-head) !important;
  font-size: var(--tlb-fs-body) !important;
  font-weight: var(--tlb-fw-bold) !important;
}
.board_view .board_txt_area :is(.interview-container, .tlb-editorial-score-summary) .score-item span {
  font-family: inherit !important;
  line-height: inherit !important;
  letter-spacing: inherit !important;
}
.board_view .board_txt_area :is(.interview-container, .tlb-editorial-score-summary) .score-item:last-child span:last-child {
  font-size: var(--tlb-fs-lead) !important;
  font-weight: var(--tlb-fw-heavy) !important;
}
.board_view .board_txt_area :is(.interview-container, .tlb-editorial-score-summary) .score-increase-banner {
  margin-bottom: var(--tlb-editorial-subsection-gap);
  padding: var(--tlb-editorial-paragraph-gap);
  background: var(--color-background);
  border-radius: 4px;
  box-shadow: none;
  text-align: center;
}
.board_view .board_txt_area :is(.interview-container, .tlb-editorial-score-summary) :is(.score-increase-text, .score-increase-number) {
  font-family: var(--tlb-font-head) !important;
  font-size: var(--tlb-fs-lead) !important;
  line-height: var(--tlb-lh-head) !important;
  letter-spacing: var(--tlb-ls-head) !important;
  font-weight: var(--tlb-fw-bold) !important;
  color: var(--color-text-title);
}
.board_view .board_txt_area :is(.interview-container, .tlb-editorial-score-summary) .score-increase-number {
  font-size: var(--tlb-editorial-title-size) !important;
  color: var(--color-primary);
  margin-inline: var(--spacing-xs);
}
/* END Editorial article design */

/* BEGIN Native footer menu font repair · product-state-codex · 2026-10-10 */
.doz_sys #doz_footer .foot-main-nav .plain_name,
.doz_sys #doz_footer .foot-foot-nav a {font-family:var(--tlb-font-head)!important;font-weight:var(--tlb-fw-semibold)!important}
.doz_sys #doz_footer .foot-foot-nav a[href="/?mode=privacy"] {font-weight:var(--tlb-fw-bold)!important}
/* END Native footer menu font repair */

/* BEGIN All products native catalog · all-products-state-codex · 2026-10-10 */
/* Only after the native catalog is mounted: hide the two old showcase sections
   and the empty source section. Product and review data stay in the moved widget. */
body:has(.tlb-series--all #tlb-product-catalog) :is(#s20231031b1edd82d3ab34,#s202411248d2ccae74668c,#s20241124df893be822aea) {display:none!important}
/* Keep the title and navigation painted above the enlarged code-widget surface. */
.tlb-series--all:has(#tlb-product-catalog) :is(.tlb-series-top-in,.tlb-series-top-nav) {position:relative;z-index:2;transform:translateZ(0)}
/* The all-products list uses the original white shopping-page background. */
.tlb-series--all:has(#tlb-product-catalog) {background:#fff}
/* END All products native catalog */