/* BASIC css start */
.cs-wrap {
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(-50vw + 50%) !important;
  overflow-x: hidden !important;
}

.cs-wrap {
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(-50vw + 50%) !important;
  overflow-x: hidden !important;
}

.cs-hero,
.cs-promise,
.cs-stats-band,
.cs-values,
.cs-global,
.cs-philosophy {
  padding-left: calc((100vw - 1200px) / 2 + 80px) !important;
  padding-right: calc((100vw - 1200px) / 2 + 80px) !important;
}

.cs-hero-sub { font-size: 17px !important; }
.cs-promise-body { font-size: 17px !important; }
.cs-promise-body { font-size: 17px !important; }
.cs-value-body { font-size: 17px !important; }
.cs-global-desc { font-size: 17px !important; }
.cs-phil-body { font-size: 18px !important; }

.cs-promise-body { font-size: 17px !important; font-weight: 400 !important; }
.cs-value-body { font-size: 17px !important; font-weight: 400 !important; }
.cs-global-desc { font-size: 17px !important; font-weight: 400 !important; }
.cs-phil-body { font-size: 18px !important; font-weight: 400 !important; }

.cs-section-eyebrow { font-size: 17px !important; }
.cs-value-sub { font-size: 17px !important; }
.cs-stat-label { font-size: 17px !important; }
.cs-globe-stat-label { font-size: 17px !important; }

.cs-phil-tag { font-size: 17px !important; }
.cs-hero-eyebrow { font-size: 17px !important; }

.cs-promise-quote,
.cs-section-title,
.cs-global-title,
.cs-phil-headline {
  font-family: 'Noto Sans KR', sans-serif !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
}

.cs-global-title { font-size: 48px !important; }

.cs-section-header { flex-direction: column !important; align-items: flex-start !important; gap: 8px !important; }

/* 01 02 03 크게 */
.cs-value-num { font-size: 17px !important; }

/* stats 가운데 정렬 */
.cs-stat-item { text-align: center !important; }
.cs-stat-item:first-child { text-align: center !important; }
.cs-stat-item:last-child { text-align: center !important; }

.tab_hd { display: none !important; }

.cs-hero::before {
  -webkit-text-stroke: 1px rgba(255,130,0,0.6) !important;
}
.cs-cert-badge { text-transform: none !important; }

.cs-globe-stat { background: #3a3a3a !important; }

.cs-bar-fill {
  display: block !important;
  min-width: 100% !important;
  visibility: visible !important;
}

.cs-bar-gray { background: #cccccc !important; }
.cs-bar-mid { background: #ffb347 !important; }
.cs-bar-orange { background: #FF8200 !important; }

.cs-chart-bars { overflow: visible !important; }


.cs-bar-fill {
  display: block !important;
  width: 100% !important;
}

.cs-bar-group {
  height: 200px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-end !important;
  align-items: center !important;
  flex: 1 !important;
}

.cs-bar-group { flex: 0 0 80px !important; }
.cs-bar-val { font-size: 14px !important; white-space: nowrap !important; }
.cs-bar-label { font-size: 13px !important; }
.cs-chart-title { font-size: 20px !important; }
.cs-bar-val { left: 50% !important; transform: translateX(-50%) !important; }

.cs-promise-quote { font-size: 38px !important; }

/* 탈락 모발 수 변화 타이틀 크게 */
.cs-chart-title { font-size: 33px !important; margin-bottom: 60px !important; }

/* 차트 내부 여백 */
.cs-chart-wrap { padding: 48px 48px 32px !important; }

/* 막대 얇게 */
.cs-bar-group { flex: 0 0 50px !important; }

/* 차트 높이 좌측과 맞추기 */
.cs-chart-wrap { height: 100% !important; display: flex !important; flex-direction: column !important; justify-content: center !important; }

.cs-chart-area { position: relative !important; }
.cs-chart-line { z-index: 0 !important; }

.cs-bar-group { z-index: 1 !important; position: relative !important; }
.cs-chart-badge { top: 8px !important; right: auto !important; left: 8px !important; }

.cs-chart-note { display: block !important; margin-top: 12px !important; }

.cs-stat-label { font-size: 20px !important; font-weight: 700 !important; }

.cs-value-card:nth-of-type(1) { background-image: linear-gradient(rgba(0,0,0,0.72), rgba(0,0,0,0.72)), url('/design/crazyskin/10450/phps/event/brandstory1.jpg') !important; background-size: cover !important; background-position: center !important; }
.cs-value-card:nth-of-type(2) { background-image: linear-gradient(rgba(0,0,0,0.72), rgba(0,0,0,0.72)), url('/design/crazyskin/10450/phps/event/brandstory2.jpg') !important; background-size: cover !important; background-position: center !important; }
.cs-value-card:nth-of-type(3) { background-image: linear-gradient(rgba(0,0,0,0.72), rgba(0,0,0,0.72)), url('/design/crazyskin/10450/phps/event/brandstory3.jpg') !important; background-size: cover !important; background-position: center !important; }
.cs-hero::before {
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
  text-rendering: optimizeLegibility !important;
  -webkit-text-stroke: 1.5px rgba(255,130,0,0.25) !important;
}

#brandstory .etc_title { display: none !important; }

.cs-hero { opacity: 1 !important; transform: none !important; }

.cs-hero-headline { color: #ffffff !important; }
.cs-hero-eyebrow { color: #FF8200 !important; }
.cs-hero-sub { color: rgba(255,255,255,0.6) !important; }
/* BASIC css end */