#sub-08 { width: 100%; padding:0;} 
#sub-08 .mob-br { display: none; }
#sub-08 { width: 100%; box-sizing: border-box; }
#sub-08 .nps-wrap { }
#sub-08 .nps-wrap-inner { max-width: 1080px; margin: 0 auto; padding: 0 50px; }
#sub-08 .nps-label-wrap { padding: 140px 0 60px 100px; max-width: 280px; margin: 0 auto; }
#sub-08 .nps-label { font-size: 17px; font-weight: 700; color: #222222; letter-spacing: 0.05em; margin: 0 0 4px 0; }
#sub-08 .nps-label-line { width: 15px; height: 1px; background: #717171; margin: 8px 0 2px 0; }
#sub-08 .nps-author { font-size: 17px; color: #222222; margin: 0; letter-spacing: 0.02em; }
#sub-08 .title-wrap { grid-column: 1 / 3; grid-row: 2; text-align: center; padding: 0 50px 5px 50px; position: relative; z-index: 1; background: #fff; }
#sub-08 .title { text-align: left; font-size: 50px; font-weight: 700; color: #000000; line-height: 1.4; letter-spacing: -0.02em; margin: 0; }
#sub-08 .section-divider { border: none; border-top: 1px solid #222; margin: 30px auto; width: calc(100% - 100px); max-width: 980px; }
#sub-08 .nps-desc-wrap { text-align: right; padding: 0 50px 60px 50px; }
#sub-08 .nps-desc { max-width: 530px; font-size: 18px; color: #25B4F9; line-height: 1.7; letter-spacing: 0.01em; margin: 0 0 0 auto; font-weight: 500; text-align: left;}
#sub-08 .nps-desc strong { font-weight: 700; }
#sub-08 .body-wrap { }
#sub-08 .section-divider.two {margin: 85px auto 65px; }
#sub-08 .thumb-section { padding: 0 50px 100px; }

@media (max-width: 1080px) {
  #sub-08 .pc-br { display: none; }
  #sub-08 .mob-br { display: block; }
}
/* ====== 반응형 ====== */
@media (max-width: 768px) {
  #sub-08 .pc-br { display: none; }
  #sub-08 .mob-br { display: block; }
  #sub-08 .nps-label-wrap { margin: 70px auto 20px; }
  #sub-08 .nps-label { font-size: 16px;}
  #sub-08 .nps-author { font-size: 16px; }
  #sub-08 .title { font-size: 26px; font-weight: 500; }
  #sub-08 .nps-desc { font-size: 17px; font-weight: 500; max-width: 100%;}
  #sub-08 .nps-desc-wrap { text-align: left; padding: 30px 20px 40px 20px !important; }
  #sub-08 .section-divider { display: none; }
  #sub-08 .nps-wrap-inner { padding: 0 20px;}
  #sub-08 .title-wrap { padding: 10px 20px 5px 20px; }
  #sub-08 .section-divider.two { display: none; }
  #sub-08 .thumb-section { padding: 0 20px 30px; }
}
 
#sub-08 .investment-box { background-color: #00B5FC; border-radius: 24px; overflow: hidden; width: 100%; padding:0 50px; }
#sub-08 .investment-box picture img { display: block; width: 100%; height: auto; padding: 50px 0 0; }
#sub-08 .txt { padding: 30px 0 40px; }
#sub-08 .txt p { font-size: 18px; line-height: 1.8; color: #fff; font-weight: 500;  }

#sub-08 .etf-title { font-size: 24px; font-weight: 600; line-height: 1.4; margin: 0 0 6px; }
#sub-08 .etf-subtitle { font-size: 18px; font-weight: 600; margin: 0 0 10px; }

#sub-08 .etf-list { padding: 20px 0 40px; list-style: none; margin: 0; }
#sub-08 .etf-item { display: flex; align-items: stretch; gap: 36px; }
#sub-08 .etf-marker { width: 88px; flex-shrink: 0; display: flex; flex-direction: column; align-items: center; }

/* 선: 마커의 ::before(위) / ::after(아래) */
#sub-08 .etf-marker::before { content: ''; flex: 0; width: 3px; background: transparent; }
#sub-08 .etf-marker::after  { content: ''; flex: 1; width: 3px; background: #25B4F9; }
#sub-08 .etf-item:last-child .etf-marker::after { background: transparent; }


/* ETF 동전 + 원 배지 묶음 */
#sub-08 .etf-coin-wrap { display: flex; flex-direction: column; align-items: center; }
#sub-08 .etf-icon { width: 40px; height: 40px; object-fit: contain; position: relative; z-index: 2; margin-bottom: -25px; }
#sub-08 .etf-badge { width: 75px; height: 125px; border-radius: 85px; border: 3px solid #25B4F9; background: #fff; box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);  display: flex; align-items: center; justify-content: center; position: relative; z-index: 1; }
#sub-08 .etf-num { font-size: 24px; font-weight: 700; color: #222; }
#sub-08 .etf-body { flex: 1; font-size: 18px; line-height: 1.9; padding: 10px 0 80px; }

@media (max-width: 768px) {
  #sub-08 .investment-box { padding: 0 20px; max-width: 100%; }
  #sub-08 .investment-box picture img { padding: 30px 0 0; }
  #sub-08 .txt { padding: 20px 0 20px; }
  #sub-08 .txt p { font-size: 13.5px; line-height: 1.85; }
  #sub-08 .etf-title { font-size: 21px;  text-align: center; margin-top: 40px;}
  #sub-08 .etf-subtitle { font-size: 16px; text-align: center; }
  #sub-08 .etf-item { gap: 15px; }
  #sub-08 .etf-marker { width: 68px; }
  #sub-08 .etf-icon { margin-bottom: -25px; }
  #sub-08 .etf-badge { width: 55px; height: 85px; }
  #sub-08 .etf-num { font-size: 16px; }
  #sub-08 .etf-body { font-size: 16px; padding: 0 0 40px; line-height: 1.75;}
  #sub-08 .etf-list { padding: 20px 0 10px; }
}


#sub-08 .blue-box { background-color: #00B5FC; padding: 60px 40px; box-sizing: border-box; overflow: visible; }

#sub-08 .etf-intro { position: relative; max-width: 1100px; margin: 0 auto 80px; }
#sub-08 .etf-intro__text { position: relative; z-index: 1; }
#sub-08 .etf-intro .section-title { padding-right: 420px; }
#sub-08 .etf-intro .section-desc { padding-right: 280px; }
#sub-08 .table-wrap { position: relative; z-index: 1; }
#sub-08 .etf-intro__image { position: absolute; top: 5%; right: -35%; width: 90%; z-index: 0; pointer-events: none; }
#sub-08 .etf-intro__image.mob { display: none; width: 100%;}
#sub-08 .etf-intro__image img { width: 100%; height: auto; display: block; }
#sub-08 .section-title { font-size: 24px; font-weight: 700; color: #F2FF00; margin: 0 0 4px; letter-spacing: -0.3px; }
#sub-08 .black { color: #000000 !important; }
#sub-08 .section-desc { font-size: 18px; line-height: 1.8; color: #fff; margin: 0 0 70px; }
 
/* 비교 테이블 */
#sub-08 .etf-table { width: 100%; border-collapse: separate; border-spacing: 0; margin: 0; }
#sub-08 .etf-table th { padding: 12px 20px; font-size: 14px; font-weight: 700; text-align: center; }
#sub-08 .etf-table td { padding: 12px 20px; font-size: 14px; text-align: center; }
#sub-08 .etf-table tr { margin-bottom: 6px; }
 
/* 테이블 헤더 행 */
#sub-08 .etf-table .col-label { width: 130px; }
#sub-08 .etf-table .col-stock { }
#sub-08 .etf-table .col-etf { }
 
/* 테이블 셀 스타일 */
#sub-08 .cell-label { background: transparent; color: #fff; font-weight: 700; font-size: 14px; }
#sub-08 .cell-stock { background: #fff; color: #333; border-radius: 30px; font-size: 14px; }
#sub-08 .cell-etf { background: #F92553; color: #fff; border-radius: 30px; font-size: 14px; font-weight: 700; }
 
/* 헤더 셀 */
#sub-08 .th-label { background: transparent; color: transparent; }
#sub-08 .th-stock { background: #fff; color: #333; border-radius: 30px; font-weight: 700; }
#sub-08 .th-etf { background: #F92553; color: #fff; border-radius: 30px; font-weight: 800; font-size: 16px; }
 
/* 테이블 래퍼 - 행간격 처리 */
#sub-08 .table-wrap { display: flex; flex-direction: column; gap: 8px; margin-left: 70px;}
#sub-08 .table-row { display: grid; grid-template-columns: 180px 1fr 1fr; gap: 8px; align-items: center; }
#sub-08 .table-row .cell { padding: 3px 10px; border-radius: 30px; text-align: center; font-size: 19px; line-height: 1.4; }
#sub-08 .table-row .cell.label { background: #fff; color: #000000; font-weight: 700; border-radius: 30px; }
#sub-08 .table-row .cell.stock { background: #fff; color: #000000; }
#sub-08 .table-row .cell.etf { background: #F92553; color: #fff; font-weight: 400; }
#sub-08 .table-row.head .cell.stock { font-weight: 600; color: #000000; }
#sub-08 .table-row.head .cell.etf { font-size: 19px; font-weight: 800; }
 
/* 분산투자 섹션 */
#sub-08 .etf-disperse { max-width: 1100px; margin: 0 auto; position: relative; z-index: 1; }
#sub-08 .etf-disperse .section-desc { margin: 0; }
 
@media (max-width: 1080px) {
  #sub-08 .etf-intro .section-desc { padding-right: 0; }
  #sub-08 .table-wrap { margin-left: 0;}
  #sub-08 .etf-intro__image.pc { display: none;}
  #sub-08 .etf-intro__image.mob { display: block;}
  #sub-08 .etf-intro__image { position: static; transform: none; width: 100%; }
  #sub-08 .section-desc { margin: 0 0 30px; }
  #sub-08 .etf-intro .section-title { padding-right: 0; }
  #sub-08 .tab-none {display: none;}
}

/* 모바일 반응형 */
@media (max-width: 768px) {
  #sub-08 .blue-box { padding: 20px 0 40px; }
  #sub-08 .etf-intro { margin: 0 auto 40px; }
  #sub-08 .section-title { font-size: 21px; }
  #sub-08 .section-desc { font-size: 16px; line-height: 1.75; }
  #sub-08 .etf-intro__text { padding-right: 0; }
}
@media (max-width: 670px) {
  #sub-08 .table-row { grid-template-columns: 90px 1fr 1fr; gap: 5px; }
  #sub-08 .table-row .cell { font-size: 10px; }
  #sub-08 .table-row.head .cell.etf { font-size: 10px; }
  #sub-08 .table-wrap { gap: 5px; margin-left: 0;}
}

 /* 아티클 섹션 */
#sub-08 .article-wrap { }
#sub-08 .article-img-wrap { width: 100%; overflow: hidden; margin-bottom: 28px; }
#sub-08 .article-img-wrap img { width: 100%; height: auto; display: block; }
#sub-08 .article-content { padding: 0; }
#sub-08 .article-subtitle { font-size: 24px; font-weight: 600; color: #222222; margin-top: 75px; line-height: 1.5; }
#sub-08 .article-body p { font-size: 18px; color: #222222; line-height: 1.85; margin-bottom: 16px;  }
#sub-08 .article-body p:last-child { margin-bottom: 0; }

@media (max-width: 768px) {
  #sub-08 .article-subtitle { font-size: 21px; margin-top: 40px; }
  #sub-08 .article-body p { font-size: 16px; }
}
#sub-08 .cloud-wrap { margin: 80px auto 120px; text-align: center;}
#sub-08 .cloud-wrap .bubble { display: inline-block; background: url('../img/sub/08/cloud-pc.png') no-repeat center / 100% 100%; padding: 46px 20px 52px; margin-bottom: 50px; max-width: 620px; width: 100%; }
#sub-08 .cloud-wrap .text { font-size: 18px; color:#25B4F9; font-weight: 600; line-height: 2.0; letter-spacing: -0.3px; }
 
/* 일러스트 */
#sub-08 .cloud-wrap .illust { width: 100%; max-width: 840px; margin: 0 auto; }
#sub-08 .cloud-wrap .illust img { width: 100%; height: auto; display: block; }
 
/* ==================== MOBILE ==================== */
@media (max-width: 768px) {
  #sub-08 .cloud-wrap .cloud-wrap { margin: 40px auto 30px; }
  #sub-08 .cloud-wrap .bubble { background-image: url('../img/sub/08/cloud-mob.png'); padding: 38px 15px 44px; max-width: 100%; margin-bottom: 30px; }
  #sub-08 .cloud-wrap .text { font-size: 15px; line-height: 1.95; }
  #sub-08 .cloud-wrap .illust { max-width: 100%; }
  #sub-08 .cloud-wrap { margin: 40px auto 30px; }
}



/* ===================== SEC08 HEAD ===================== */
#sub-08 .s08-head { margin: 65px 0 30px; }
#sub-08 .s08-head__title { display: flex; align-items: center; gap: 11px; font-size: 24px; font-weight: 700; margin-bottom: 6px; }
#sub-08 .s08-head__icon { width: 22px; height: auto; flex-shrink: 0; }
#sub-08 .s08-head__desc { font-size: 18px; line-height: 1.6; padding-left: 30px; }
 
/* ===================== SEC08 LIST ===================== */
#sub-08 .s08-list { list-style: none; padding: 0; margin: 0; }
#sub-08 .s08-item { position: relative; display: flex; align-items: flex-start; gap: 50px; padding: 0 0 65px 0; border-top: none; }
#sub-08 .s08-item:first-child { border-top: none; }
#sub-08 .s08-item::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 9px; background: url('../img/sub/08/shadow.png') no-repeat center top / 100% 100%; }
#sub-08 .s08-badge { margin-top: 0; flex-shrink: 0; }
#sub-08 .s08-cont { padding-top: 16px; }

 
/* ===================== SEC08 BADGE ===================== */
#sub-08 .s08-badge { position: relative; flex-shrink: 0; width: 170px; text-align: center; }
#sub-08 .s08-badge__img { width: 170px; height: auto; display: block; }
#sub-08 .s08-badge__label { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; text-align: center; line-height: 1; }
#sub-08 .s08-badge__point { display: block; font-size: 12px; font-weight: 500; color: #fff; letter-spacing: 1.5px; margin-bottom: 4px; }
#sub-08 .s08-badge__num { display: block; font-size: 24px; font-weight: 500; color: #fff; letter-spacing: -1px; }
 
/* ===================== SEC08 CONTENT ===================== */
#sub-08 .s08-cont { flex: 1; padding-top: 20px; }
#sub-08 .s08-cont__title { display: block; font-size: 24px; font-weight: 700; color: #111; margin-bottom: 4px; }
#sub-08 .s08-cont__text { font-size: 18px; line-height: 1.8; }

/* ===================== MOBILE ===================== */
@media (max-width: 768px) {
  #sub-08 .section-divider.mob-block { display: block; margin: 20px auto; width: calc(100% - 40px); }
  #sub-08 .s08-head { text-align: center; margin: 40px 0 50px; }
  #sub-08 .s08-head__title { justify-content: center; font-size: 21px; flex-wrap: wrap; flex-direction: column; }
  #sub-08 .s08-head__desc { padding-left: 0; font-size: 16px; color: #000000; font-weight: 600; line-height: 1.9; }
  #sub-08 .s08-item { flex-direction: column; align-items: center; gap: 20px; padding: 0 0 28px 0; }
  #sub-08 .s08-badge { width: 150px; }
  #sub-08 .s08-badge__img { width: 150px; margin: 0 auto; }
  #sub-08 .s08-cont { width: 100%; padding-top: 0; }
  #sub-08 .s08-cont__title { font-size: 21px; }
  #sub-08 .s08-cont__text { font-size: 16px; line-height: 1.75; } 
  #sub-08 .s08-item::before { left: -20px; right: -20px; background: url(../img/sub/08/shadow.png) no-repeat center top / 120% 100%;}
}


/* ===================== SEC08 PROFILE ===================== */
#sub-08 .s08-profile { display: flex; align-items: center; gap: 32px; background: #E5F6FE; border-radius: 24px; padding: 30px; margin: 0 0 80px; }
#sub-08 .s08-profile__img-wrap { flex-shrink: 0; width: 160px; height: 160px; border-radius: 50%; overflow: hidden; }
#sub-08 .s08-profile__img { width: 100%; height: 100%; object-fit: cover; display: block; }
#sub-08 .s08-profile__cont { flex: 1; }
#sub-08 .s08-profile__name { display: block; font-size: 24px; font-weight: 600; margin-bottom: 6px; }
#sub-08 .s08-profile__desc { font-size: 18px; line-height: 1.85; margin-bottom: 16px; border-bottom: 2px solid #25B4F9; padding-bottom: 16px; }
#sub-08 .s08-profile__links { display: flex; align-items: center; gap: 12px; }
#sub-08 .s08-profile__link { display: inline-flex; align-items: center; gap: 6px; text-decoration: none; color: #fff; }
#sub-08 .s08-profile__link-icon { width: 25px; height: 25px; object-fit: contain; border-radius: 4px; }
#sub-08 .s08-profile__link span { background-color: #25B4F9; padding: 2px 10px; border-radius: 16px; font-weight: 500; font-size: 15px; } 
/* ===================== MOBILE ===================== */
@media (max-width: 768px) {
  #sub-08 .s08-profile { flex-direction: column; align-items: center; text-align: center; gap: 20px; padding: 40px 30px; }
  #sub-08 .s08-profile__img-wrap { width: 150px; height: 150px; }
  #sub-08 .s08-profile__desc { font-size: 16px; text-align: left; border: none; margin-bottom: 10px; padding-bottom: 20px; }
  #sub-08 .s08-profile__name { font-size: 21px; text-align: left; }
}