/*#################################################################################################
#########	상품 상세 시안 v5 스타일 (2026-10-23) — main.renewal.css 다음에 불러옴 (v5/detail.php $mainExtraCss)
#########	- 사이트 공통 색 · 글자 크기 값(var(--ink) 등)만 사용, 빨강(--brand)은 체험 신청 · 할인율에만
#########	- 클래스는 모두 d5- 로 시작 (운영 상세 본문 스타일 i_css 와 겹치지 않게)
#########	- 고칠 때는 같은 선택자를 파일 끝에 덧붙이지 말고 그 규칙을 직접 고칠 것
#################################################################################################*/
.d5 { --d5-sticky: calc(var(--header-h) + 24px); --d5-nav-h: 60px; padding-bottom: var(--section); }
.d5 [hidden] { display: none !important; }

/* 현재 위치 */
.d5-crumb { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 24px 0 20px; font-size: var(--fs-sm); letter-spacing: var(--ls-ui); color: var(--text-3); }
.d5-crumb a:hover { color: var(--ink); }
.d5-crumb > span:last-child { color: var(--text); }

/* 위 : 이미지 + 구매 정보 */
.d5-top { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 64px; align-items: start; }

.d5-gallery__main { position: relative; aspect-ratio: 5 / 4; overflow: hidden; border-radius: var(--radius-card); border: 1px solid var(--line); background: var(--soft); }
.d5-gallery__main img { display: block; width: 100%; height: 100%; object-fit: contain; }
.d5-gallery__thumbs { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 12px; }
.d5-gallery__thumb { display: block; width: 80px; aspect-ratio: 5 / 4; overflow: hidden; padding: 0; border-radius: 10px; border: 1px solid var(--line); background: var(--soft); cursor: pointer; transition: border-color .2s, box-shadow .2s; }
.d5-gallery__thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }
.d5-gallery__thumb:hover { border-color: #c8c8c8; }
.d5-gallery__thumb[aria-pressed='true'] { border-color: var(--ink); box-shadow: inset 0 0 0 1px var(--ink); }

.d5-buy { position: sticky; top: var(--d5-sticky); }
.d5-buy__inner { position: relative; }
.d5-share { position: absolute; top: -2px; right: 0; display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; border: 1px solid var(--line-2); background: #fff; color: var(--text-2); cursor: pointer; transition: border-color .2s, color .2s; }
.d5-share:hover { border-color: var(--ink); color: var(--ink); }
.d5-share svg { width: 17px; height: 17px; }
.d5-share + .d5-buy__brand, .d5-share + .d5-buy__brand + .d5-buy__title { padding-right: 48px; }	/* 태그가 없을 때 이름과 겹치지 않게 */
.d5-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 16px; padding-right: 48px; }
.d5-tag { display: inline-flex; align-items: center; gap: 5px; height: 30px; padding: 0 11px; border-radius: 6px; background: var(--soft); font-size: var(--fs-xs); font-weight: 600; line-height: 1; letter-spacing: var(--ls-ui); color: var(--text); }
.d5-tag img { width: 15px; height: 15px; }
.d5-tag { border: 1px solid transparent; transition: border-color .2s, background-color .2s, color .2s; }
.d5-tag:hover { border-color: var(--line-2); background: #fff; color: var(--ink); }	/* 메인 태그 칩 hover 와 같은 결 */
.d5-buy__brand { font-family: var(--font-en); font-size: var(--fs-sm); font-weight: 600; letter-spacing: .02em; color: var(--text-3); }
.d5-buy__title { margin-top: 6px; font-size: clamp(26px, .8vw + 20px, 34px); font-weight: 700; line-height: var(--lh-heading); letter-spacing: var(--ls-heading); color: var(--ink); word-break: keep-all; }
.d5-buy__lead { margin-top: 12px; font-size: var(--fs-md); line-height: var(--lh-body); letter-spacing: var(--ls-body); color: var(--text-2); word-break: keep-all; }
.d5-buy__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 14px; margin-top: 16px; font-size: var(--fs-sm); letter-spacing: var(--ls-ui); color: var(--text-3); }
.d5-buy__meta span { display: inline-flex; align-items: center; gap: 4px; }
.d5-buy__meta svg { width: 14px; height: 14px; }
.d5-buy__meta time { font-family: var(--font-en); font-weight: 600; color: var(--text); }
.d5-buy__meta a { text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--line-2); }
.d5-buy__meta a:hover { color: var(--ink); text-decoration-color: currentColor; }

.d5-price { margin-top: 24px; padding-top: 24px; border-top: 1px solid var(--line); }
.d5-price__org { display: flex; align-items: baseline; gap: 8px; font-family: var(--font-en); font-size: var(--fs-body); color: var(--text-3); }
.d5-price__rate { font-weight: 700; color: var(--brand); }
.d5-price__now { margin-top: 2px; font-size: 20px; font-weight: 600; color: var(--ink); }
.d5-price__now strong { font-family: var(--font-en); font-size: 36px; font-weight: 700; letter-spacing: -0.03em; font-variant-numeric: tabular-nums; }
.d5-price__per { font-size: var(--fs-body); font-weight: 500; color: var(--text-2); }
.d5-price__note { display: flex; align-items: flex-start; gap: 8px; margin-top: 10px; padding: 12px 14px; border-radius: 10px; background: var(--soft); font-size: var(--fs-sm); line-height: 1.55; letter-spacing: var(--ls-body); color: var(--text-2); word-break: keep-all; }
.d5-price__note svg { flex: none; width: 16px; height: 16px; margin-top: 3px; color: var(--text-3); }	/* 안내 아이콘 (2026-11-02) */
.d5-price__note strong { font-weight: 600; color: var(--ink); }

.d5-info { margin-top: 24px; border-top: 1px solid var(--line); }
.d5-info__row { display: grid; grid-template-columns: 84px minmax(0, 1fr); gap: 12px; padding: 13px 0; border-bottom: 1px solid var(--line); font-size: var(--fs-body); line-height: 1.55; letter-spacing: var(--ls-body); }
.d5-info dt { color: var(--text-3); }
.d5-info dd { color: var(--text); word-break: keep-all; }
.d5-info__em { font-weight: 600; color: var(--brand); text-decoration: underline; text-decoration-color: rgba(227, 45, 33, .35); text-underline-offset: 3px; transition: text-decoration-color .2s; }
.d5-info__em:hover { text-decoration-color: currentColor; }
/* 원격 설치 지원 강조 (2026-11-02) : 글자는 고정, 앞의 작은 빨간 점에서 물결만 퍼짐 — 글자 깜빡임은 속도 · 강도를 바꿔도 "읽기 힘들다"여서 뺌 */
.d5-info__em::before { content: ''; display: inline-block; width: 6px; height: 6px; margin: 0 6px 0 2px; border-radius: 50%; background: currentColor; vertical-align: middle; position: relative; top: -1px; animation: d5Pulse 1.6s ease-out infinite; }
.d5-info__em:hover::before, .d5-info__em:focus-visible::before { animation: none; }
@keyframes d5Pulse {
	0% { box-shadow: 0 0 0 0 rgba(227, 45, 33, .45); }
	70%, 100% { box-shadow: 0 0 0 7px rgba(227, 45, 33, 0); }
}

.d5-trial { display: flex; align-items: center; gap: 12px; margin-top: 24px; padding: 14px 14px 14px 16px; border-radius: 14px; border: 1px solid rgba(227, 45, 33, .14); background: #fff7f6; }
.d5-trial__icon { display: grid; flex: none; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: #fff; box-shadow: 0 0 0 1px rgba(227, 45, 33, .14); color: var(--brand); }
.d5-trial__icon svg { width: 17px; height: 17px; }
.d5-trial__text { flex: 1; min-width: 0; font-size: var(--fs-sm); line-height: 1.5; letter-spacing: var(--ls-body); color: var(--text-2); word-break: keep-all; }
.d5-trial__text strong { display: block; font-size: var(--fs-body); font-weight: 700; color: var(--ink); }
.d5-trial__btn { display: inline-flex; flex: none; align-items: center; gap: 2px; height: 36px; padding: 0 12px 0 16px; border-radius: 999px; background: var(--brand); font-size: var(--fs-sm); font-weight: 700; letter-spacing: var(--ls-ui); color: #fff; transition: background-color .2s; }
.d5-trial__btn:hover { background: var(--brand-hover); }
.d5-trial__btn svg { width: 15px; height: 15px; }

.d5-cta { display: grid; margin-top: 12px; }
.d5-cta__buy, .d5-bar__buy { display: inline-flex; align-items: center; justify-content: center; height: 56px; border-radius: var(--radius-btn); font-size: 17px; font-weight: 700; letter-spacing: var(--ls-ui); transition: border-color .2s, background-color .2s, color .2s; }
.d5-cta__buy, .d5-bar__buy { background: var(--ink); color: #fff; }
.d5-cta__buy:hover, .d5-bar__buy:hover { background: var(--gray-800); }
.d5-buy__promise { display: flex; align-items: center; justify-content: center; gap: 5px; margin-top: 14px; font-size: var(--fs-sm); letter-spacing: var(--ls-ui); color: var(--text-2); }
.d5-buy__promise svg { width: 16px; height: 16px; color: var(--ink); }
.d5-buy__promise strong { font-weight: 700; color: var(--ink); }

/* 아래 : 탭 (칸 너비를 똑같이 나눠 가운데 정렬, 제자리에 고정 — 따라 내려오지 않음) */
.d5-nav { margin-top: 88px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: #fff; }	/* 따라 내려오지 않음 (2026-10-23 요청) */
.d5-nav__list { display: flex; }
.d5-nav__link { position: relative; display: flex; flex: 1 1 0; align-items: center; justify-content: center; min-width: 0; height: var(--d5-nav-h); font-size: var(--fs-md); font-weight: 600; letter-spacing: var(--ls-ui); color: var(--text-3); white-space: nowrap; transition: color .2s; }
.d5-nav__link:hover { color: var(--ink); }
.d5-nav__link::after { content: ''; position: absolute; right: 0; bottom: -1px; left: 0; height: 2px; background: var(--ink); transform: scaleX(0); transition: transform .25s var(--ease); }
.d5-nav__link[aria-selected='true'] { color: var(--ink); }
.d5-nav__link[aria-selected='true']::after { transform: none; }
.d5-nav__cnt { margin-left: 2px; font-family: var(--font-en); font-size: var(--fs-sm); font-weight: 600; color: var(--text-3); }
.d5-nav__short { display: none; }

/* 아래 : 내용 */
.d5-sec { padding-top: 56px; }
.d5-sec__head { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.d5-sec__title { font-size: clamp(22px, .4vw + 19px, 26px); font-weight: 700; line-height: var(--lh-title); letter-spacing: var(--ls-title); color: var(--ink); }
.d5-sec__title span { margin-left: 4px; font-family: var(--font-en); color: var(--text-3); }
.d5-sec__lead { max-width: 760px; margin-top: 12px; font-size: var(--fs-md); line-height: var(--lh-body); letter-spacing: var(--ls-body); color: var(--text-2); word-break: keep-all; }
.d5-sec__more { display: inline-flex; align-items: center; gap: 2px; font-size: var(--fs-body); font-weight: 600; color: var(--text-2); }
.d5-sec__more svg { width: 15px; height: 15px; }
.d5-sec__more:hover { color: var(--ink); }

/* 상품 소개 : 새 소개 이미지(조각을 이어 붙임) + 아래 소개 문구 — 이미지 폭(1000px) 기둥 안에 */
.d5-intro { max-width: 1000px; margin: 0 auto; }
.d5-banner { max-width: 1000px; margin: 0 auto 2.5rem; }	/* 상품 소개 위 배너 (2026-11-02) — 소개 이미지와 같은 폭, 아래 간격은 이미지 묶음 사이와 같게 */
.d5-banner img { display: block; width: 100%; height: auto; }
.d5-intro__img img { display: block; width: 100%; height: auto; }
.d5-intro__set { position: relative; }
.d5-intro__set.is-gap { margin-top: 2.5rem; }	/* 이미지 묶음 사이 (예: 이벤트 배너 ↔ 소개 이미지) */
/* 이미지 속 버튼 · 영상 자리에 겹쳐 놓는 실제 버튼 · 영상 (위치는 이미지 대비 %) */
.d5-intro__spot { position: absolute; display: block; padding: 0; border: 0; border-radius: min(18px, 1.8vw); background: transparent; cursor: pointer; transition: background-color .15s; }
.d5-intro__spot:hover { background: rgba(0, 0, 0, .08); }
.d5-intro__spot--video, .d5-intro__spot--video:hover { overflow: hidden; border-radius: 0; background: #000; cursor: auto; }
.d5-intro__spot--video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.d5-intro__img + .d5-sec__title { margin-top: 48px; }

/* 상품 정보 제공 고시 (상품 소개 탭 끝) — 소개 글 아래 연한 회색 카드 (보조 정보) */
.d5-notice { margin-top: 48px; padding: 28px 36px 12px; border-radius: var(--radius-card); background: var(--soft); }
.d5-notice--narrow { max-width: 1000px; margin-right: auto; margin-left: auto; }
.d5-notice__title { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; padding-bottom: 16px; border-bottom: 1px solid var(--line-2); font-size: var(--fs-md); font-weight: 700; letter-spacing: var(--ls-title); color: var(--ink); }
.d5-notice__title small { font-size: var(--fs-xs); font-weight: 400; letter-spacing: var(--ls-ui); color: var(--text-3); }
.d5-notice__row { display: grid; grid-template-columns: 132px minmax(0, 1fr); gap: 16px; padding: 13px 0; font-size: var(--fs-sm); line-height: 1.6; letter-spacing: var(--ls-body); }
.d5-notice__row + .d5-notice__row { border-top: 1px solid var(--soft-2); }
.d5-notice__row dt { font-weight: 600; color: var(--text-2); }
.d5-notice__row dd { color: var(--text); word-break: keep-all; }
.d5-intro .d5-sec__lead { max-width: none; }	/* 소개 글을 이미지 · 고시 카드와 같은 폭으로 */

/* 운영 상세 본문(상품마다 만든 HTML) : 화면 폭을 넘지 않게만 */
.d5-content { margin-top: 32px; overflow: hidden; }
.d5-content img, .d5-content video, .d5-content table { max-width: 100%; }
.d5-content img { height: auto; }
.d5-content .contain .goods_Explanation { margin-top: 0; padding-top: 0; border-top: 0; }	/* 예전 상세의 탭 위 구분선 · 여백은 v5 에선 빼기 (예전 감싸는 구조를 쓰면서, 2026-10-27) */
/* 사용 방법 : 운영 사용 방법을 그대로 그린 iframe (높이는 내용에 맞춰 js 가 정함) */
.d5-manual { display: block; width: 100%; height: 800px; margin-top: 40px; border: 0; }

/* 사용 방법 탭 맨 위 영상 */
.d5-video { position: relative; max-width: 1000px; margin: 24px auto 0; aspect-ratio: 16 / 9; overflow: hidden; border-radius: var(--radius-card); background: var(--ink); }
.d5-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.d5-embed { position: relative; max-width: 960px; margin: 24px auto; aspect-ratio: 16 / 9; }
.d5-embed iframe { position: absolute; inset: 0; width: 100% !important; height: 100% !important; border: 0; }


/* 자주 묻는 질문 */
.d5-faq { max-width: 960px; margin-top: 24px; border-top: 1px solid var(--ink); }
.d5-faq__item { border-bottom: 1px solid var(--line); }
.d5-faq__item summary { position: relative; display: flex; gap: 12px; padding: 22px 40px 22px 0; font-size: 17px; font-weight: 600; line-height: var(--lh-title); letter-spacing: var(--ls-title); color: var(--ink); list-style: none; cursor: pointer; }
.d5-faq__item summary::-webkit-details-marker { display: none; }
.d5-faq__item summary::after { content: ''; position: absolute; top: 50%; right: 8px; width: 8px; height: 8px; margin-top: -6px; border-right: 1.5px solid var(--text-3); border-bottom: 1.5px solid var(--text-3); transform: rotate(45deg); transition: transform .25s var(--ease); }
.d5-faq__item[open] summary::after { margin-top: -2px; transform: rotate(-135deg); }
.d5-faq__q { flex: none; font-family: var(--font-en); font-weight: 700; color: var(--text-3); }
.d5-faq__a { margin: 0 0 20px; padding: 18px 20px; border-radius: 12px; background: var(--soft); font-size: var(--fs-body); line-height: 1.7; letter-spacing: var(--ls-body); color: var(--text); word-break: keep-all; }

/* 구매 후기 */
.d5-review { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 24px; }
.d5-review__item { display: flex; flex-direction: column; min-width: 0; padding: 24px; border-radius: 16px; border: 1px solid var(--line); background: #fff; }
.d5-review__stars { display: flex; gap: 1px; font-size: 15px; line-height: 1; color: var(--line-2); }
.d5-review__stars .is-on { color: var(--ink); }
.d5-review__title { margin-top: 12px; font-size: var(--fs-md); font-weight: 700; line-height: var(--lh-title); letter-spacing: var(--ls-title); color: var(--ink); }
.d5-review__body { display: -webkit-box; overflow: hidden; margin-top: 8px; -webkit-box-orient: vertical; -webkit-line-clamp: 4; font-size: var(--fs-body); line-height: 1.65; letter-spacing: var(--ls-body); color: var(--text); word-break: break-all; }
.d5-review__meta { margin-top: auto; padding-top: 16px; font-size: var(--fs-xs); letter-spacing: var(--ls-ui); color: var(--text-3); }
.d5-empty { margin-top: 24px; padding: 48px 24px; border-radius: var(--radius-card); background: var(--soft); font-size: var(--fs-md); color: var(--text-2); text-align: center; }

/* 함께 보면 좋은 프로그램 */
.d5-sec--related { margin-top: 96px; padding-top: 72px; border-top: 1px solid var(--line); }
.d5-related { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; margin-top: 24px; }
.d5-related__link { display: flex; flex-direction: column; min-width: 0; }
.d5-related__thumb { display: block; aspect-ratio: 5 / 4; overflow: hidden; border-radius: 16px; border: 1px solid var(--line); background: var(--soft); }
.d5-related__thumb img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--ease); }
.d5-related__link:hover .d5-related__thumb img { transform: scale(1.03); }
.d5-related__title { display: -webkit-box; overflow: hidden; margin-top: 14px; -webkit-box-orient: vertical; -webkit-line-clamp: 2; font-size: var(--fs-md); font-weight: 700; line-height: var(--lh-title); letter-spacing: var(--ls-title); color: var(--ink); }
.d5-related__price { margin-top: 6px; font-size: var(--fs-body); font-weight: 600; color: var(--ink); }
.d5-related__price b { font-family: var(--font-en); font-weight: 700; }

/* 모바일 아래 고정 버튼 · 알림 */
.d5-bar { display: none; }
.d5-toast { position: fixed; bottom: calc(32px + env(safe-area-inset-bottom)); left: 50%; z-index: 120; padding: 12px 20px; border-radius: 999px; background: var(--ink); font-size: var(--fs-body); color: #fff; white-space: nowrap; transform: translateX(-50%); }

/* 오른쪽 상담 버튼 물결 (운영 홈페이지 customchange.css rippleEffect 와 같은 움직임)
   · 운영 : 아이콘 60px 뒤에서 물결 원(2px 테두리)이 30px → 75px 로 1초에 퍼지며 사라짐, 0.5초 간격 — 아이콘 가장자리 바깥으로 나오는 끝부분만 보임
   · 여기 : 버튼 56px 가장자리에서 같은 비율로 바깥 7px(1.25배)까지, 보이는 구간(마지막 1/3초)과 투명도(0.33 → 0)도 운영과 같게 */
.quick__item--tel::before, .quick__item--tel::after,
.quick__item--telegram::before, .quick__item--telegram::after,
.quick__item--kakao::before, .quick__item--kakao::after,
.quick__item--talk::before, .quick__item--talk::after { content: ''; position: absolute; inset: 0; border: 2px solid var(--d5-ripple); border-radius: 50%; opacity: 0; pointer-events: none; animation: d5Ripple 1s linear infinite; }
.quick__item--tel::after, .quick__item--telegram::after, .quick__item--kakao::after, .quick__item--talk::after { animation-delay: -.5s; }
.quick__item--tel { --d5-ripple: rgb(11, 148, 68); }
.quick__item--telegram { --d5-ripple: rgb(48, 188, 255); }
.quick__item--kakao { --d5-ripple: rgb(247, 171, 0); }
.quick__item--talk { --d5-ripple: var(--brand); }
@keyframes d5Ripple {
	0%, 66.6% { transform: scale(1); opacity: 0; }
	66.7% { transform: scale(1); opacity: .33; }
	100% { transform: scale(1.25); opacity: 0; }
}

/* 전화 버튼 옆 말풍선 : 모든 v5 화면 공용으로 옮김 (2026-11-02) → css/main.renewal.css '전화 버튼 옆 말풍선' */

@media (max-width: 1199px) {
	.d5-top { gap: 40px; }
	.d5-related { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.d5-related__item:nth-child(4) { display: none; }
}
@media (max-width: 1023px) {
	.d5-top { grid-template-columns: minmax(0, 1fr); gap: 32px; }
	.d5-buy { position: static; }
	.d5-nav { margin-top: 64px; }
}
@media (max-width: 767px) {
	.d5 { --d5-nav-h: 52px; padding-bottom: calc(var(--section) + 72px); }
	.d5-crumb { padding: 16px 0 14px; }
	.d5-gallery { margin: 0 calc(var(--gutter) * -1); }
	.d5-gallery__main { border-width: 0; border-radius: 0; }
	.d5-gallery__thumbs { padding: 0 var(--gutter); }
	.d5-gallery__thumb { width: 64px; }
	.d5-price__now strong { font-size: 32px; }
	.d5-cta { display: none; }
	.d5-nav { margin-top: 48px; }
	.d5-nav__link { font-size: var(--fs-body); }
	.d5-nav__long { display: none; }
	.d5-nav__short { display: inline; }
	.d5-sec, .d5-sec--related { padding-top: 40px; }
	.d5-intro__img { margin: 0 calc(var(--gutter) * -1); }
	.d5-banner { margin: 0 calc(var(--gutter) * -1) 1.5rem; }	/* 배너도 소개 이미지처럼 화면 끝까지 */
	.d5-intro__img + .d5-sec__title { margin-top: 32px; }
	.d5-notice { margin-top: 36px; padding: 22px 20px 6px; }
	.d5-notice__row { grid-template-columns: 88px minmax(0, 1fr); gap: 12px; padding: 12px 0; }
	.d5-sec--related { margin-top: 64px; }
	.d5-faq__item summary { font-size: var(--fs-md); }
	.d5-review { grid-template-columns: minmax(0, 1fr); }
	.d5-review__item { padding: 20px; }
	.d5-related { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 12px; }
	.d5-related__item:nth-child(4) { display: block; }
	.d5-bar { position: fixed; right: 0; bottom: 0; left: 0; z-index: 80; display: grid; padding: 10px var(--gutter) calc(10px + env(safe-area-inset-bottom)); border-top: 1px solid var(--line); background: #fff; }
	.d5-bar__buy { height: 52px; font-size: var(--fs-md); }
	.has-d5-bar .quick { bottom: calc(86px + env(safe-area-inset-bottom)); }
	.d5-toast { bottom: calc(86px + env(safe-area-inset-bottom)); }
}
@media (prefers-reduced-motion: reduce) {
	.quick__item::before, .quick__item::after { animation: none; opacity: 0; }
	.quick__item--tel .quick__label { animation: none; }
	.d5-info__em, .d5-info__em::before { animation: none; }
	.d5-nav__link::after, .d5-related__thumb img, .d5-faq__item summary::after { transition: none; }
}

/* 구매하기 창 (2026-11-02, include/detail5.pay.php) — 체험문의 창(.inquiry)과 같은 틀 */
.d5-pay__price { margin-top: 20px; padding: 16px 18px; border-radius: 12px; background: var(--soft); }
.d5-pay__price div { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; font-size: var(--fs-sm); color: var(--text-2); }
.d5-pay__price div + div { margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--line-2); }
.d5-pay__price dd { font-weight: 600; color: var(--ink); text-align: right; }
.d5-pay__price strong { font-size: var(--fs-lg); font-weight: 700; }
.d5-pay__price small { margin-left: 2px; font-size: var(--fs-2xs); font-weight: 400; color: var(--text-3); }
.d5-pay__done { margin-top: 12px; font-size: var(--fs-sm); font-weight: 600; color: var(--brand); }
.d5-pay__btns { display: grid; gap: 8px; margin-top: 20px; }
.d5-pay.is-busy .d5-pay__btns { opacity: .5; pointer-events: none; }
.d5-pay__note, .d5-pay__login, .d5-pay__help { margin-top: 12px; font-size: var(--fs-xs); line-height: 1.6; letter-spacing: var(--ls-body); color: var(--text-3); word-break: keep-all; }
.d5-pay__login { color: var(--text-2); }
.d5-pay__login a, .d5-pay__help a, .d5-pay__help button { padding: 0; border: 0; background: none; font: inherit; font-weight: 600; color: var(--ink); text-decoration: underline; text-underline-offset: 2px; cursor: pointer; }
.d5-pay__help { margin-top: 20px; }	/* 구분선 없이 가볍게 (2026-11-02) */

/* 카드결제 창 : 예전 결제 창 크기(760 × 760), 모바일은 화면 전체 */
.d5-payframe { width: 760px; max-width: calc(100% - 32px); height: 760px; max-height: calc(100dvh - 32px); margin: auto; padding: 0; overflow: hidden; border: 0; border-radius: 16px; background: #fff; }
.d5-payframe::backdrop { background: rgba(17, 17, 17, .6); }
.d5-payframe iframe { display: block; width: 100%; height: 100%; border: 0; }
.d5-payframe__close { position: absolute; top: 8px; right: 8px; z-index: 1; color: var(--text-2); background: rgba(255, 255, 255, .9); }
@media (max-width: 767px) {
	.d5-payframe { width: 100%; max-width: none; height: 100%; max-height: none; border-radius: 0; }
}

/* 구매하기 창 : 로그인 전 안내 (2026-11-02) — 로그인 · 회원가입을 맨 위 버튼 두 개로 (작은 글자 링크라 회원가입이 잘 안 보였음) */
.d5-pay__member { margin-top: 20px; padding: 16px; border-radius: 12px; border: 1px solid rgba(227, 45, 33, .16); background: #fff7f6; }
.d5-pay__member-text { font-size: var(--fs-sm); line-height: 1.5; color: var(--text-2); }
.d5-pay__member-text strong { display: block; margin-bottom: 2px; font-size: var(--fs-body); font-weight: 700; color: var(--ink); }
.d5-pay__member-btns { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 12px; }
.d5-pay__member-btns .btn { height: 46px; font-weight: 700; }

/* 구매하기 창 상태별 구성 (2026-11-02, include/detail5.pay.php) — 결제 금액 한 줄 + 지금 할 일 하나 (강조 버튼 하나) */
/* 결제 금액 : 연한 상자 안 한 줄 ('결제 금액 ··· 1,089,000원 VAT 포함') */
.d5-pay__amount { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 20px; padding: 16px 18px; border-radius: 12px; background: var(--soft); }
.d5-pay__amount-label { font-size: var(--fs-sm); color: var(--text-2); }
.d5-pay__amount-value { display: flex; align-items: baseline; gap: 6px; }
.d5-pay__amount-value strong { font-size: 20px; font-weight: 700; letter-spacing: -0.01em; color: var(--ink); }
.d5-pay__amount-value small { font-size: var(--fs-xs); color: var(--text-3); }
.d5-pay__amount-value em { font-style: normal; font-size: var(--fs-xs); font-weight: 600; color: var(--brand); }
.d5-pay__step { margin-top: 24px; }
.d5-pay__lead { font-size: var(--fs-body); font-weight: 600; color: var(--ink); }
.d5-pay__step .d5-pay__btns { margin-top: 12px; }
.d5-pay__step .btn { height: 52px; font-weight: 700; }
.d5-pay__btns--row { grid-template-columns: 1fr 1fr; }	/* 로그인 전 : [회원가입] [로그인] 나란히 */
.d5-pay__done { display: flex; align-items: center; gap: 6px; margin-top: 0; font-size: var(--fs-body); }
.d5-pay__done svg { width: 18px; height: 18px; flex: none; }
.d5-pay__note a { font-weight: 600; color: var(--ink); text-decoration: underline; text-underline-offset: 2px; }

/* 소개 이미지 아래 공통 구역 (2026-11-02, form/detail5.html .d5-common) — 영상 · 무료 체험 · 구매, 이미지와 같은 1000px 기둥에 이어 붙임 */
.d5-common { padding: 72px 56px; text-align: center; }
.d5-common__eyebrow { font-size: var(--fs-body); font-weight: 600; color: var(--brand); }
.d5-common__title { margin-top: 8px; font-size: clamp(24px, 2.4vw, 34px); font-weight: 800; line-height: 1.3; letter-spacing: -0.02em; color: var(--ink); }
.d5-common__title em { font-style: normal; color: var(--brand); }
.d5-common__desc { margin-top: 12px; font-size: var(--fs-body); line-height: 1.6; color: var(--text-2); }
.d5-common--video { background: #f9f9f9; }
.d5-common__video { position: relative; margin: 32px auto 0; max-width: 820px; aspect-ratio: 16 / 9; overflow: hidden; border-radius: 14px; background: #000; box-shadow: 0 20px 40px -20px rgba(0, 0, 0, .35); }
.d5-common__video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.d5-common--video .d5-common__desc { margin-top: 28px; }
.d5-common--trial { background: linear-gradient(180deg, #16181d 0%, #1f2330 100%); }
.d5-common--trial .d5-common__eyebrow { color: rgba(255, 255, 255, .7); font-weight: 500; }
.d5-common--trial .d5-common__title { color: #fff; }
.d5-common--trial .d5-common__title em { color: var(--brand-light); }
.d5-common--trial .d5-common__desc { color: rgba(255, 255, 255, .75); }
.d5-common__icon { display: inline-grid; place-items: center; width: 72px; height: 72px; margin-top: 28px; border-radius: 50%; background: rgba(255, 255, 255, .08); color: #fff; }
.d5-common__icon svg { width: 34px; height: 34px; }
.d5-common__btns { display: grid; gap: 10px; width: 100%; max-width: 360px; margin: 28px auto 0; }
.d5-common__btns .btn { height: 54px; font-size: var(--fs-md); font-weight: 700; }
.d5-common__btns .btn svg { width: 18px; height: 18px; }
.d5-common__btns .btn--light { background: #fff; color: var(--ink); }
.d5-common__btns .btn--light:hover { background: #f1f2f4; }
@media (max-width: 767px) {
	.d5-common { margin: 0 calc(var(--gutter) * -1); padding: 56px 20px; }	/* 소개 이미지처럼 화면 끝까지 */
	.d5-common__video { margin-top: 24px; border-radius: 10px; }
}