import { useState } from "react";
const styles = `
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@600;700;800&family=DM+Sans:wght@300;400;500;600&display=swap');
* { margin: 0; padding: 0; box-sizing: border-box; }
.root {
font-family: 'DM Sans', sans-serif;
background: #0a0e1a;
color: #e8e4df;
min-height: 100vh;
overflow-x: hidden;
}
/* ambient glow */
.ambient-1 {
position: fixed; top: -200px; left: -200px;
width: 600px; height: 600px;
background: radial-gradient(circle, rgba(212,170,100,0.08) 0%, transparent 70%);
pointer-events: none; z-index: 0;
}
.ambient-2 {
position: fixed; bottom: -300px; right: -200px;
width: 700px; height: 700px;
background: radial-gradient(circle, rgba(120,160,220,0.06) 0%, transparent 70%);
pointer-events: none; z-index: 0;
}
.container { max-width: 900px; margin: 0 auto; padding: 0 24px; position: relative; z-index: 1; }
/* ── HEADER ── */
.header {
text-align: center;
padding: 56px 0 40px;
border-bottom: 1px solid rgba(212,170,100,0.15);
}
.header-badge {
display: inline-block;
background: linear-gradient(135deg, rgba(212,170,100,0.12), rgba(212,170,100,0.04));
border: 1px solid rgba(212,170,100,0.25);
border-radius: 20px;
padding: 6px 18px;
font-size: 11px;
letter-spacing: 2px;
text-transform: uppercase;
color: #d4aa64;
margin-bottom: 18px;
}
.header h1 {
font-family: 'Playfair Display', serif;
font-size: 34px;
font-weight: 700;
line-height: 1.25;
color: #f0ece6;
margin-bottom: 10px;
}
.header h1 span { color: #d4aa64; }
.header p {
font-size: 14px;
color: #8a8680;
max-width: 560px;
margin: 0 auto;
line-height: 1.6;
}
/* ── SECTION TITLES ── */
.section { padding: 40px 0; }
.section-label {
display: flex; align-items: center; gap: 12px; margin-bottom: 22px;
}
.section-label .line {
flex: 1; height: 1px;
background: linear-gradient(90deg, rgba(212,170,100,0.3), transparent);
}
.section-label span {
font-size: 11px; letter-spacing: 2.5px; text-transform: uppercase;
color: #d4aa64; font-weight: 500; white-space: nowrap;
}
/* ── WINNER CARD ── */
.winner-card {
background: linear-gradient(145deg, rgba(212,170,100,0.1), rgba(212,170,100,0.02));
border: 1px solid rgba(212,170,100,0.25);
border-radius: 18px;
padding: 36px 32px;
position: relative; overflow: hidden;
}
.winner-card::before {
content: '';
position: absolute; top: 0; left: 0; right: 0; height: 3px;
background: linear-gradient(90deg, #d4aa64, #e8c98a, #d4aa64);
}
.winner-top {
display: flex; align-items: center; gap: 20px; margin-bottom: 18px;
}
.winner-rank {
width: 64px; height: 64px;
background: linear-gradient(135deg, #d4aa64, #b8903f);
border-radius: 50%;
display: flex; align-items: center; justify-content: center;
font-family: 'Playfair Display', serif;
font-size: 28px; font-weight: 800; color: #0a0e1a;
flex-shrink: 0;
}
.winner-info h2 {
font-family: 'Playfair Display', serif;
font-size: 24px; color: #f0ece6;
}
.winner-info p { font-size: 13px; color: #8a8680; margin-top: 3px; }
.winner-reasons {
display: grid; grid-template-columns: repeat(3); gap: 12px; margin-top: 20px;
}
.winner-reason {
background: rgba(255,255,255,0.03);
border: 1px solid rgba(255,255,255,0.06);
border-radius: 10px;
padding: 14px;
}
.winner-reason .icon { font-size: 18px; margin-bottom: 6px; }
.winner-reason h4 { font-size: 12px; color: #d4aa64; margin-bottom: 4px; font-weight: 600; }
.winner-reason p { font-size: 11px; color: #7a7672; line-height: 1.5; }
/* ── COMPARISON TABLE ── */
.compare-grid { display: flex; flex-direction: column; gap: 12px; }
.compare-row {
background: rgba(255,255,255,0.025);
border: 1px solid rgba(255,255,255,0.07);
border-radius: 14px;
overflow: hidden;
transition: border-color 0.2s;
}
.compare-row:hover { border-color: rgba(212,170,100,0.2); }
.compare-row.rank-1 { border-color: rgba(212,170,100,0.3); }
.compare-row.rank-1 .compare-header { background: rgba(212,170,100,0.06); }
.compare-header {
display: flex; align-items: center; gap: 14px;
padding: 16px 20px; cursor: pointer;
transition: background 0.2s;
}
.compare-header:hover { background: rgba(255,255,255,0.03); }
.rank-badge {
width: 34px; height: 34px; border-radius: 50%;
display: flex; align-items: center; justify-content: center;
font-weight: 700; font-size: 15px; flex-shrink: 0;
}
.rank-badge.r1 { background: #d4aa64; color: #0a0e1a; }
.rank-badge.r2 { background: rgba(160,180,200,0.25); color: #a0b4c8; }
.rank-badge.r3 { background: rgba(180,140,100,0.2); color: #b48c64; }
.compare-name { font-weight: 600; font-size: 15px; flex: 1; }
.compare-name sub { font-size: 11px; color: #6a6662; font-weight: 400; }
.compare-chevron { color: #6a6662; font-size: 12px; transition: transform 0.2s; }
.compare-row.open .compare-chevron { transform: rotate(180deg); }
.compare-body {
max-height: 0; overflow: hidden;
transition: max-height 0.4s cubic-bezier(.4,0,.2,1);
}
.compare-row.open .compare-body { max-height: 500px; }
.compare-inner { padding: 0 20px 20px; }
.compare-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.tag {
font-size: 11px; padding: 4px 10px; border-radius: 12px;
font-weight: 500;
}
.tag.green { background: rgba(100,180,130,0.12); color: #64b482; border: 1px solid rgba(100,180,130,0.2); }
.tag.amber { background: rgba(212,170,100,0.1); color: #d4aa64; border: 1px solid rgba(212,170,100,0.2); }
.tag.blue { background: rgba(100,150,210,0.1); color: #6496d2; border: 1px solid rgba(100,150,210,0.2); }
.tag.red { background: rgba(200,100,100,0.1); color: #c86464; border: 1px solid rgba(200,100,100,0.2); }
.compare-specs { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.spec-item { display: flex; flex-direction: column; gap: 2px; }
.spec-label { font-size: 10px; color: #6a6662; text-transform: uppercase; letter-spacing: 1px; }
.spec-value { font-size: 13px; color: #c8c4be; font-weight: 500; }
.pros-cons { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 14px; }
.pc-box { background: rgba(255,255,255,0.02); border-radius: 8px; padding: 12px; }
.pc-box h5 { font-size: 10px; text-transform: uppercase; letter-spacing: 1.5px; margin-bottom: 8px; font-weight: 600; }
.pc-box.pro h5 { color: #64b482; }
.pc-box.con h5 { color: #c86464; }
.pc-item { font-size: 12px; color: #8a8680; margin-bottom: 4px; line-height: 1.4; }
.pc-item::before { margin-right: 6px; }
.pc-box.pro .pc-item::before { content: '✓'; color: #64b482; }
.pc-box.con .pc-item::before { content: '✕'; color: #c86464; }
/* ── INSIGHT CARDS ── */
.insight-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.insight-card {
background: rgba(255,255,255,0.025);
border: 1px solid rgba(255,255,255,0.07);
border-radius: 14px; padding: 22px;
}
.insight-card .ic-icon { font-size: 22px; margin-bottom: 10px; }
.insight-card h4 { font-size: 13px; color: #e8e4df; margin-bottom: 6px; font-weight: 600; }
.insight-card p { font-size: 12px; color: #7a7672; line-height: 1.6; }
/* ── BUNDLING ── */
.bundle-grid { display: grid; grid-template-columns: repeat(2); gap: 12px; }
.bundle-item {
background: rgba(255,255,255,0.03);
border: 1px solid rgba(255,255,255,0.07);
border-radius: 12px; padding: 18px;
display: flex; gap: 14px; align-items: flex-start;
}
.bundle-emoji { font-size: 24px; flex-shrink: 0; }
.bundle-item h4 { font-size: 13px; color: #e8e4df; margin-bottom: 3px; font-weight: 600; }
.bundle-item p { font-size: 11px; color: #7a7672; line-height: 1.5; }
.bundle-item .bundle-tag {
display: inline-block; margin-top: 6px;
font-size: 10px; padding: 2px 8px; border-radius: 8px;
background: rgba(212,170,100,0.1); color: #d4aa64;
border: 1px solid rgba(212,170,100,0.2);
}
/* ── FIELD TREND ── */
.trend-box {
background: linear-gradient(145deg, rgba(100,150,210,0.07), rgba(100,150,210,0.02));
border: 1px solid rgba(100,150,210,0.15);
border-radius: 16px; padding: 28px;
}
.trend-box h3 {
font-family: 'Playfair Display', serif;
font-size: 18px; color: #f0ece6; margin-bottom: 16px;
}
.trend-stat-row { display: flex; gap: 24px; margin-bottom: 18px; flex-wrap: wrap; }
.trend-stat {
background: rgba(255,255,255,0.04); border-radius: 10px;
padding: 14px 18px; flex: 1; min-width: 140px;
}
.trend-stat .ts-num { font-size: 22px; font-weight: 700; color: #6496d2; font-family: 'Playfair Display', serif; }
.trend-stat .ts-label { font-size: 11px; color: #6a6662; margin-top: 2px; }
.trend-points { list-style: none; }
.trend-points li {
padding: 10px 0; border-bottom: 1px solid rgba(255,255,255,0.05);
font-size: 13px; color: #9a9690; line-height: 1.5;
display: flex; gap: 10px; align-items: flex-start;
}
.trend-points li:last-child { border-bottom: none; }
.trend-points .bullet { color: #6496d2; font-size: 16px; flex-shrink: 0; margin-top: 1px; }
/* ── FOOTER ── */
.footer {
text-align: center; padding: 40px 0 48px;
border-top: 1px solid rgba(255,255,255,0.06);
margin-top: 12px;
}
.footer p { font-size: 11px; color: #4a4642; line-height: 1.7; }
.footer .disclaimer { font-style: italic; }
/* responsive */
@media (max-width: 600px) {
.winner-reasons { grid-template-columns: 1fr; }
.compare-specs { grid-template-columns: 1fr; }
.insight-grid { grid-template-columns: 1fr; }
.bundle-grid { grid-template-columns: 1fr; }
.pros-cons { grid-template-columns: 1fr; }
.trend-stat-row { flex-direction: column; }
.header h1 { font-size: 26px; }
}
`;
const products = [
{
rank: 1,
name: "레모나 (경남제약)",
sub: "Lemona · Gyeongnam Pharm",
vit: "500mg / 포",
form: "분말형 스틱포",
price: "저가–중가",
brand: "비타민C 시장점유율 65%↑",
tags: [
{ label: "K-POP 모델 효과", type: "green" },
{ label: "중국 브랜드상 연속수상", type: "green" },
{ label: "선물용 포장 강세", type: "amber" },
{ label: "중국 CFDA 승인", type: "blue" },
],
pros: [
"BTS·TWICE 모델로 중국인 인지도 압도적",
"분말형 간편 복용 – 여행 중 최적",
"틴케이스 등 프리미엄 선물 포장 라인",
"중국 3대 플랫폼(티몰·징동·도우인) 완판 실적",
"중국소비자 브랜드 대상 이너뷰티 10년 연속 1위",
],
cons: [
"비타민C 함량은 500mg으로 고함량 대비 낮음",
"설탕·리보플라빈 첨가로 색소 소변 유발 가능",
"경남제약 2025 상반기 실적 하락 – 공급 불안정 우려",
],
},
{
rank: 2,
name: "고려은단 비타민C 1000",
sub: "Goryeo Eundan · High-dose 1000mg",
vit: "1000mg / 정",
form: "정제 (블리스터 포장)",
price: "가성비 최고",
brand: "건강식품 온라인 랭킹 1위",
tags: [
{ label: "영국산 원료 프리미엄", type: "blue" },
{ label: "가성비 왕", type: "amber" },
{ label: "리뷰 수 압도적 (7,886건)", type: "green" },
{ label: "관광객 선물용 약간 약세", type: "red" },
],
pros: [
"영국산 비타민C 원료로 프리미엄 포지션",
"블리스터 밀봉 포장 – 산화 방지·이동 편의",
"필라이즈 비타민C 랭킹 압도적 1위",
"가격 대비 용량 최고 → 실속형 중국인 구매자 선호",
],
cons: [
"포장 디자인이 화려하지 않아 선물용 가치 낮음",
"중국인 관광객 대상 SNS 마케팅이 약함",
"중국 온라인 플랫폼 존재감 낮음",
],
},
{
rank: 3,
name: "유한양행 비타민C 1000",
sub: "Yuhan Pharma · 1000mg Tablet",
vit: "1000mg / 정",
form: "정제",
price: "중가",
brand: "제약사 신뢰 브랜드",
tags: [
{ label: "제약사 신뢰도 높음", type: "blue" },
{ label: "고함량 1000mg", type: "green" },
{ label: "관광객 인지도 낮음", type: "red" },
{ label: "중국 SNS 露출 미약", type: "red" },
],
pros: [
"유한양행 제약사 이름 자체가 신뢰 보장",
"1000mg 고함량 – 효과 확실성 인식 높음",
"국내 약국에서 안정적인 판매량 유지",
],
cons: [
"중국인 관광객에게 브랜드 인지도가 가장 낮음",
"K-POP 등 문화적 연결 고리 부재",
"선물용 포장 프리미엄이 낮아 기념품 경쟁 불리",
"온라인 리뷰 수(907건)로 고려은단에 비해 약세",
],
},
];
export default function App() {
const [openIdx, setOpenIdx] = useState(0);
return (
<>
{/* HEADER */}
K-Pharm 시장 분석 · Feb 2026
중국인 관광객의
비타민C 선호도 분석
2025년 하반기–2026년 초 명동·강남·공항 면세점 약국 판매 트렌드와
중국 소비자 심리를 종합하여 세 제품의 실제 선호도를 평가한 분석 보고서입니다.
{/* 1위 WINNER */}
1
레모나 (경남제약)
중국인 관광객 약국 구매 제품 중 비타민C 카테고리 압도적 1위
🎤
K-POP 모델 효과
BTS·TWICE 모델로 중국 소셜미디어에서 폭발적 인기. 중국 알리바바 티몰에서 완판 기록.
🎁
선물용 가치 최고
틴케이스·특별 패키지 등 프리미엄 포장이 중국 "면자(面子)" 문화와 잘 맞음.
🌏
중국 시장 신뢰도
중국소비자 브랜드 대상 이너뷰티 부문 10년 연속 1위. CFDA 보건식품 등록 완료.
{/* PRODUCT COMPARISON */}
{products.map((p, i) => {
const isOpen = openIdx === i;
return (
setOpenIdx(isOpen ? -1 : i)}>
{p.rank}
{p.name}
{p.sub}
▼
{p.tags.map((t, j) => (
{t.label}
))}
비타민C 함량
{p.vit}
제형
{p.form}
가격포지션
{p.price}
시장 위치
{p.brand}
장점
{p.pros.map((item, j) => (
{item}
))}
단점 / 약점
{p.cons.map((item, j) => (
{item}
))}
);
})}
{/* KEY PURCHASE DRIVERS */}
📱
① SNS·입소문 기반 구매 결정
중국인 관광객은 틱톡(도우인)·소셜 미디어 영상을 보고 약국 방문을 결정합니다.
'Korean pharmacy' 해시태그와 K-POP 아이돌 연관 콘텐츠가 구매 트리거가 됩니다.
레모나는 이 채널에서 가장 강한 존재감을 가집니다.
🎀
② 선물 문화 (면자·체면)
중국 문화에서 귀국 후 가족·친구에게 드리는 선물은 체면의 문제입니다.
"한국에서 직접 가져온 정품"이라는 프리미엄 가치와 깔끔한 포장이
실질적인 구매 결정의 핵심 요인입니다.
🏷️
③ 가성비·실속형 구매 경향
특히 20–30대 중국인 여행자는 가격과 용량을 꼼꼼히 비교합니다.
고려은단과 같은 고함량·저가 제품은 "본인용"으로 대량 구매하는
패턴이 증가하고 있습니다.
✅
④ "한국 정품" 신뢰와 직구 이점
중국 국내 위조품 우려가 높아, 여행 중 약국에서 직접 구매하는 것 자체가
품질 보증으로 여겨집니다. 약사 상담까지 가능한 약국은
면세점보다 신뢰도가 높아진 채널입니다.
{/* BUNDLING */}
✨
글루타치온 (Glutathione)
피부 미백·항산화의 핵심. 중국인 여성 관광객 사이에서 가장 많이 찾는 영양제. 비타민C와 함께 복용 시 미백 효과 상승.
🔥 핫템
🐟
콜라겐 (저분자 콜라겐)
피부 탄력·안티에이징. 경남제약 '결콜라겐' 등이 약국 내 인기 세트 구성품으로 자리잡고 있음.
세트 구성 인기
🧬
PDRN 크림 (재생 크림)
피부 재생·회복의 핵심 제품. 틱톡·인스타그램에서 폭발적 인기. 관광객의 약국 방문 주요 트리거.
🔥 약국 방문 유발
💊
면역력 강화 영양제
면역 강화 수요가 증가하며, 비타민C 외에 오메가3·프로바이오틱스 등을 함께 구매하는 패턴이 두드러집니다.
건강관리 세트
{/* FIELD TRENDS */}
K-약국 현장 실제 반응
1.4조원
외국인 약국·의료 소비액 (2025년 9월까지)
-
›
명동·강남 약국은 중국어·일본어·베트남어 등 다국어 안내판과 세금환급(Tax Refund) 안내를 기본으로 갖추고 있습니다. 약사 추천 세트를 묶어 할인 판매하는 트렌드가 확산됩니다.
-
›
레모나는 공항·명동 약국에서 "중국 손님이 가장 많이 찾는 비타민"으로 입장이 안정적입니다. 특히 BTS·TWICE 패키지 제품은 선물용으로 즉시 품절됩니다.
-
›
고려은단은 영국산 원료와 가성비로 중국인 중 "자기용" 구매자에게 강세를 보이고 있지만, 관광객 특유의 선물 구매 패턴에서는 레모나에 밀립니다.
-
›
유한양행 비타민C는 국내 약사 상담 시 추천 제품으로 자주 등장하지만, 중국인 관광객 스스로가 먼저 찾는 제품은 아닙니다.
-
›
크리에이트립 등 인바운드 플랫폼이 'K-약국 쇼핑' 카테고리를 정식 출시하면서, 약국 방문은 단순 쇼핑이 아닌 관광 체험 코스로 정형화되고 있습니다.
{/* FOOTER */}
본 분석은 2025년 하반기–2026년 초 공개 데이터, 약국 현장 트렌드 보고, 소비자 리뷰 및 마케팅 동향을 종합하여 작성되었습니다.
구체적 매출 수치는 기업 공개 실적과 관광공사 통계를 기반으로 산출되었으며, 공항 약국 현장의 실제 매출은 개별 약국 상황에 따라 다를 수 있습니다.
© 2026 K-Pharm 시장 분석 | Prepared for Pharmacy Operations
>
);
}
댓글
댓글 쓰기