Hero 스타일
Eyebrow
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
장식
배경색
패딩
↔
↕
라운드
px
보더
px
보더 위치
영문 제목
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
한글 제목
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
설명
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
레이아웃
전체 높이
vh
📱vh
상하 패딩
px
📱px
상하 패딩 끄기
이미지 끄기 (텍스트만)
두 영역 위치
앞 이미지 세로 크기
px
📱px
앞 이미지 좌우 위치 (- 왼쪽 · + 오른쪽)
px
📱px
앞 이미지 상하 위치 (- 위 · + 아래)
px
📱px
이미지 위 어둡게 (그라데이션)
좌우 비율 (preset)
좌측 비율 %
%
좌우 간격
px
텍스트 폭
px
📱px
앞 이미지 가로 크기
px
📱px
가로 정렬
세로 정렬
영문 꽉채움 비율
%
영문 줄간격(%)
%
영문 위 여유(잘림방지)
px
Eyebrow 아래여백
px
영문 아래여백
px
한글 아래여백
px
설명 아래여백
px
섹션 배경
좌우 패딩
px
📱px
콘텐츠 폭
px
이미지 비율
그림자
외곽 두께
px
테두리 색
배경 어둡게
%
📱%
딤 방향
텍스트 왼쪽 거리
px
📱px
텍스트 위 거리
px
📱px
머리말 높낮이 (− 위 · + 아래)
px
📱px
영문(큰) 제목 높낮이
px
📱px
한글 제목 높낮이
px
📱px
설명 높낮이
px
📱px
서브nav 가로 기준
서브nav 세로 기준
서브nav 가로 값(모서리에서)
px
📱px
서브nav 세로 값(기준에서)
px
📱px
시술요약칩 색상
시술요약칩 가로 기준
시술요약칩 세로 기준
시술요약칩 가로 값(모서리에서)
px
📱px
시술요약칩 세로 값(기준에서)
px
📱px
배경 위치
배경 영상 흑백
%
📱%
배경 영상 투명도 (100=불투명)
%
📱%
하단 그라데이션 연결 색상
배경 하단 그라데이션
앞 이미지 위치
앞 이미지 가로 초점 (-50 왼쪽 · +50 오른쪽)
%
📱%
앞 이미지 세로 초점 (0 상단 · 100 하단)
%
📱%
페이지 톤
제목 줄 순서
버튼 막대
버튼 모양
온라인 상담 버튼 배경색
온라인 상담 버튼 글자색
텍스트 등장 모션
영문 가로 꽉차게
이미지 라운드
px
테두리 스타일
테두리 색
테두리 ↑ 상
px
테두리 → 우
px
테두리 ↓ 하
px
테두리 ← 좌
px
라운드 ◜ 좌상
px
라운드 ◝ 우상
px
라운드 ◞ 우하
px
라운드 ◟ 좌하
px
📱 배경 위치
📱 앞 이미지 위치
📱 가로 정렬
📱 세로 정렬
📱 텍스트 흰색
텍스트
←거리
기본
↑거리
기본
배경
앞 이미지
X
0%
Y
0%
가로
자동
세로
자동
좌우 위치
기본
상하 위치
기본
텍스트 폭
기본
영문 크기
기본
100%
딤
0%
📱
PC
Symptoms 스타일
Eyebrow
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
장식
배경색
패딩
↔
↕
라운드
px
보더
px
보더 위치
제목
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
증상 이름
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
증상 설명
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
레이아웃
디자인
상하 패딩
px
📱px
가로 정렬
컨테이너 폭
px
섹션 배경
좌우 패딩
px
📱px
상단 0 (붙이기)
하단 0 (붙이기)
이미지 비율
Recommendation
이런 분께
추천드립니다
01
02
03
04
Consult 스타일
Eyebrow
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
장식
배경색
패딩
↔
↕
라운드
px
보더
px
보더 위치
제목
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
부제목
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
아래 설명
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
태그
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
장식
배경색
패딩
↔
↕
라운드
px
보더
px
보더 위치
레이아웃
상하 패딩
px
📱px
가로 정렬
컨테이너 폭
px
중앙 미디어 폭
중앙 미디어 폭 (모바일)
아래 설명 폭
섹션 배경
좌우 패딩
px
📱px
상단 0 (붙이기)
하단 0 (붙이기)
Natural Approach
시술의 핵심을 한 문장으로
부제목 설명
+ PC 이미지/영상 추가
+ 모바일 이미지/영상
비우면 PC 미디어 사용
비우면 PC 미디어 사용
이미지/영상 아래 추가 설명
태그1, 태그2, 태그3
POINT 01 스타일
제목
사이즈
px
📱px
색상
굵기
정렬
표시
본문
사이즈
px
📱px
색상
굵기
정렬
표시
카운터(POINT XX)
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
장식
배경색
패딩
↔
↕
라운드
px
보더
px
보더 위치
영문 라벨
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
장식
배경색
패딩
↔
↕
라운드
px
보더
px
보더 위치
레이아웃
상하 패딩
px
📱px
좌우 비율 (preset)
좌측 비율 %
%
좌우 간격
px
텍스트 폭
px
이미지 폭
px
가로 정렬
세로 정렬
섹션 배경
좌우 패딩
px
📱px
콘텐츠 폭
px
상단 0 (붙이기)
하단 0 (붙이기)
이미지 비율
그림자
외곽 두께
px
테두리 색
이미지 라운드
px
이미지/텍스트
표시
제목 모션
POINT 01
Overview
시술 방법 제목
POINT 02 스타일
카운터(POINT XX)
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
장식
배경색
패딩
↔
↕
라운드
px
보더
px
보더 위치
영문 라벨
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
장식
배경색
패딩
↔
↕
라운드
px
보더
px
보더 위치
섹션 제목 (h2)
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
카드 태그
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
장식
배경색
패딩
↔
↕
라운드
px
보더
px
보더 위치
카드 제목
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
카드 설명
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
레이아웃
상하 패딩
px
📱px
카드 컬럼
카드 간격
px
카드 배경
카드 배경 투명
카드 호버색
마우스 오버
섹션 배경
좌우 패딩
px
📱px
콘텐츠 폭
px
상단 0 (붙이기)
하단 0 (붙이기)
이미지 비율
그림자
외곽 두께
px
테두리 색
카드 라운드
px
이미지 라운드
px
POINT 02
Method
시술 방법
01
METHOD 01
카드 1 제목
카드 설명이 들어갑니다.
02
METHOD 02
카드 2 제목
카드 설명이 들어갑니다.
03
METHOD 03
카드 3 제목
카드 설명이 들어갑니다.
04
METHOD 04
카드 4 제목
카드 설명이 들어갑니다.
POINT 03 스타일
카운터(POINT XX)
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
장식
배경색
패딩
↔
↕
라운드
px
보더
px
보더 위치
영문 라벨
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
장식
배경색
패딩
↔
↕
라운드
px
보더
px
보더 위치
섹션 제목 (h2)
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
레이블
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
장식
배경색
패딩
↔
↕
라운드
px
보더
px
보더 위치
본문
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
레이아웃
레이아웃
상하 패딩
px
📱px
컬럼 수
박스 라운드
px
구분선
구분선 색
상단 강조바
강조바 색
아이콘 사이즈
px
아이콘 보더
px
아이콘 보더색
아이콘 배경
아이콘 라운드
px
아이콘 색상
카드 배경
카드 배경 투명
카드 호버색
마우스 오버
섹션 배경
좌우 패딩
px
📱px
콘텐츠 폭
px
상단 0 (붙이기)
하단 0 (붙이기)
그림자
외곽 두께
px
테두리 색
카드 라운드
px
박스 전체 라운드
px
POINT 03
Info
시술 안내
POINT 04 스타일
카운터(POINT XX)
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
장식
배경색
패딩
↔
↕
라운드
px
보더
px
보더 위치
영문 라벨
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
장식
배경색
패딩
↔
↕
라운드
px
보더
px
보더 위치
섹션 제목 (h2)
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
컬럼 라벨
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
장식
배경색
패딩
↔
↕
라운드
px
보더
px
보더 위치
컬럼 제목
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
컬럼 설명
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
결과
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
장식
배경색
패딩
↔
↕
라운드
px
보더
px
보더 위치
레이아웃
상하 패딩
px
📱px
컬럼 수
컬럼 간격
px
카드 배경
카드 배경 투명
카드 호버색
마우스 오버
섹션 배경
좌우 패딩
px
📱px
콘텐츠 폭
px
상단 0 (붙이기)
하단 0 (붙이기)
이미지 비율
그림자
외곽 두께
px
테두리 색
컬럼 라운드
px
이미지 라운드
px
POINT 04
Principle
비교 제목
Method A
컬럼 제목
설명
결과 요약
Method B
컬럼 제목
설명
결과 요약
Method B
컬럼 제목
설명
결과 요약
Method B
컬럼 제목
설명
결과 요약
POINT 05 스타일
카운터(POINT XX)
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
장식
배경색
패딩
↔
↕
라운드
px
보더
px
보더 위치
영문 라벨
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
장식
배경색
패딩
↔
↕
라운드
px
보더
px
보더 위치
섹션 제목 (h2)
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
번호
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
장식
배경색
패딩
↔
↕
라운드
px
보더
px
보더 위치
본문
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
레이아웃
상하 패딩
px
📱px
좌우 비율 (preset)
좌측 비율 %
%
좌우 간격
px
텍스트 폭
px
이미지 폭
px
가로 정렬
이미지 사용
목록 컬럼
항목 구분선
번호 표시
리스트 디자인
체크 아이콘 색
체크 카드 배경
섹션 배경
좌우 패딩
px
📱px
콘텐츠 폭
px
상단 0 (붙이기)
하단 0 (붙이기)
이미지 비율
그림자
외곽 두께
px
테두리 색
이미지 라운드
px
POINT 05
Candidates
권장 대상
01
목록 항목 1
02
목록 항목 2
03
목록 항목 3
04
목록 항목 4
05
목록 항목 5
06
목록 항목 6
07
목록 항목 7
POINT 06 스타일
카운터(POINT XX)
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
장식
배경색
패딩
↔
↕
라운드
px
보더
px
보더 위치
영문 라벨
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
장식
배경색
패딩
↔
↕
라운드
px
보더
px
보더 위치
섹션 제목 (h2)
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
본문
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
레이아웃
레이아웃
상하 패딩
px
📱px
카드 컬럼
카드 간격
px
아이콘 사이즈
px
아이콘 보더
px
아이콘 보더색
아이콘 배경
아이콘 라운드
px
아이콘 색상
아이콘 위치
카드 배경
카드 배경 투명
카드 호버색
마우스 오버
섹션 배경
좌우 패딩
px
📱px
콘텐츠 폭
px
상단 0 (붙이기)
하단 0 (붙이기)
그림자
외곽 두께
px
테두리 색
카드 라운드
px
POINT 06
Precautions
주의사항
항목 1
항목 2
항목 3
항목 4
항목 5
항목 6
POINT 07 스타일
카운터(POINT XX)
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
장식
배경색
패딩
↔
↕
라운드
px
보더
px
보더 위치
영문 라벨
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
장식
배경색
패딩
↔
↕
라운드
px
보더
px
보더 위치
섹션 제목 (h2)
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
단계 태그
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
장식
배경색
패딩
↔
↕
라운드
px
보더
px
보더 위치
단계 제목
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
단계 본문
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
레이아웃
상하 패딩
px
📱px
단계 컬럼
단계 간격
px
배경 번호 표시
STEP 라벨 표시
카드 배경
카드 배경 투명
카드 호버색
마우스 오버
섹션 배경
좌우 패딩
px
📱px
콘텐츠 폭
px
상단 0 (붙이기)
하단 0 (붙이기)
그림자
외곽 두께
px
테두리 색
단계 라운드
px
POINT 07
Process
시술 과정
01
STEP 01
단계 1 제목
단계 설명
02
STEP 02
단계 2 제목
단계 설명
03
STEP 03
단계 3 제목
단계 설명
04
STEP 04
단계 4 제목
단계 설명
05
STEP 05
단계 5 제목
단계 설명
06
STEP 06
단계 6 제목
단계 설명
Director's Comment 스타일
영문 라벨
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
장식
배경색
패딩
↔
↕
라운드
px
보더
px
보더 위치
헤드라인
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
코멘트 본문
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
원장 이름
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
레이아웃
상하 패딩
px
📱px
좌우 비율 (preset)
좌측 비율 %
%
좌우 간격
px
텍스트 폭
px
이미지 폭
px
이미지 사용
이미지 형태
코멘트 강조선
세로 정렬
섹션 배경
좌우 패딩
px
📱px
콘텐츠 폭
px
상단 0 (붙이기)
하단 0 (붙이기)
이미지 비율
그림자
외곽 두께
px
테두리 색
이미지 라운드
px
Director's Comment
한 줄 헤드라인 (선택)
원장 코멘트가 들어갑니다.
FAQ 스타일
영문 라벨
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
장식
배경색
패딩
↔
↕
라운드
px
보더
px
보더 위치
섹션 제목 (h2)
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
질문
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
Q 번호
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
답변
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
레이아웃
상하 패딩
px
📱px
컨테이너 폭
px
FAQ 데이터
영문 라벨 형태
아이템 스타일
카드 영역 폭
가로 카드 폭
px
카드 최소 높이
px
카드 라운드
px
카드 배경
카드 상단 칩
한 항목만 열기
첫 답변 펼침
아이콘
항목 간격
px
질문 세로 폭
px
보더 색
강조색 (열림·hover)
아이콘 색
hover 채움
열림 채움
섹션 배경
좌우 패딩
px
📱px
본문 규칙
상단 0 (붙이기)
하단 0 (붙이기)
FAQ
자주 묻는 질문
답변 안내원장 답변
Q.1
질문을 입력하세요
답변을 입력하세요
답변 안내원장 답변
Q.2
질문을 입력하세요
답변을 입력하세요
답변 안내원장 답변
Q.3
질문을 입력하세요
답변을 입력하세요
답변 안내원장 답변
Q.4
질문을 입력하세요
답변을 입력하세요
답변 안내원장 답변
Q.5
질문을 입력하세요
답변을 입력하세요
답변 안내원장 답변
Q.6
질문을 입력하세요
답변을 입력하세요
연관 시술 스타일
영문 라벨
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
장식
배경색
패딩
↔
↕
라운드
px
보더
px
보더 위치
섹션 제목 (h2)
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
시술명
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
설명
사이즈
px
📱px
색상
굵기
정렬
자간
/100em
행간
%
표시
레이아웃
이미지 없음 디자인
카드 상단 칩
상하 패딩
px
📱px
카드 컬럼
카드 간격
px
카드 라운드
px
카드 배경
카드 배경 투명
카드 호버색
마우스 오버
섹션 배경
좌우 패딩
px
📱px
콘텐츠 폭
px
상단 0 (붙이기)
하단 0 (붙이기)
그림자
외곽 두께
px
테두리 색
Related
연관 시술
RELATED CONTENT
01
시술명
시술 설명
바로가기 →자세히 보기RELATED CONTENT
02
시술명
시술 설명
바로가기 →자세히 보기RELATED CONTENT
03
시술명
시술 설명
바로가기 →자세히 보기RELATED CONTENT
04
시술명
시술 설명
바로가기 →자세히 보기공통형 디자인
모바일은 공통 배경을 자동 사용합니다. 이미지 축소본이 있으면 자동 적용됩니다.
옛 칸
본문 하단 도식
모바일 영역
기본 배치
상단 제목
카드 교차
카드 여백
카드 구조
디자인 크기
이미지·모션
세부항목 디자인
제목 간격
SNS·CTA 연결
기본 배치
카드 사이 연결
개별 밑줄 디자인
교차·내부 텍스트
레이아웃 조합웹진형 적용 · 개별 ⇄ 좌우 가능
＋ 카드 이미지 선택
01
Blog
zz그림칸시험옛칸 관련 블로그
글자 크기(px·0=자동)
이 페이지에 연결된 블로그 글이 없습니다. 블로그 글의 “노출 페이지”에 이 페이지를 지정하면 노출됩니다.