/* ==========================================================================
   FEATURING. — design draft stylesheet
   Written from scratch for this project. Layout metrics follow the agreed
   reference structure; naming, code and assets are original.
   ========================================================================== */
/* 브랜드 폰트: Paperlogy Medium (2026-09-08 사장님 전달) — 모든 굵기를 이 파일 하나로 표시(합성 볼드 방지) */
@font-face{ font-family:'Paperlogy'; font-weight:100 900; font-style:normal; font-display:swap; src:url('../fonts/Paperlogy-5Medium.ttf') format('truetype'); }

:root{
  --ft-sans: 'Paperlogy', 'Noto Sans KR', 'Malgun Gothic', Arial, sans-serif;
  --ft-serif: 'Paperlogy', 'Noto Sans KR', 'Malgun Gothic', Arial, sans-serif;   /* 제목/내비도 동일 폰트 */
  --ft-ink: #000;
  --ft-mute: #999;
  --ft-soft: #555;
  --ft-line: #ddd;
  --ft-line-soft: #eee;
  --ft-side-w: 200px;
  --ft-side-gap: 80px;
  --ft-ease: .3s ease-in-out;
}

/* ---------- base ---------- */
html{ overflow-y:scroll; }
body{ margin:0; background:#fff; color:var(--ft-ink); font:11px/18px var(--ft-sans); }
h1,h2,h3,h4,p,ul,ol,dl,dd,pre,figure{ margin:0; padding:0; }
ul,ol{ list-style:none; }
a{ color:inherit; text-decoration:none; transition:color var(--ft-ease), background-color var(--ft-ease), border-color var(--ft-ease), opacity var(--ft-ease); }
img{ border:0; vertical-align:top; max-width:100%; }
button{ font:inherit; color:inherit; background:none; border:0; padding:0; cursor:pointer; }
input,select,textarea{ font-family:var(--ft-sans); font-size:11px; color:var(--ft-ink); box-sizing:border-box; background:#fff; }
input[type=text],input[type=password],input[type=email],input[type=tel],input[type=number]{ height:30px; padding:0 8px; border:1px solid var(--ft-line); outline:0; transition:border-color var(--ft-ease); }
input:focus,select:focus,textarea:focus{ border-color:var(--ft-ink); outline:0; }
select{ height:30px; padding:0 6px; border:1px solid var(--ft-line); }
textarea{ padding:8px; border:1px solid var(--ft-line); line-height:1.6; resize:vertical; }
input[type=checkbox],input[type=radio]{ width:13px; height:13px; margin:0 4px 0 0; vertical-align:-2px; }
input[type=checkbox]+label,input[type=radio]+label{ margin-right:12px; }
pre{ font-family:var(--ft-sans); white-space:pre-wrap; word-break:break-all; }
::selection{ background:#c9d2bd; color:#fff; }
.ft-sr{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }
.ft-hide{ display:none !important; }

/* ---------- shell ---------- */
.ft-shell{ position:relative; width:90%; max-width:1630px; margin:0 auto; }
.ft-shell::after{ content:""; display:block; clear:both; }

/* ---------- side navigation ---------- */
.ft-side{ position:absolute; left:0; top:0; width:var(--ft-side-w); height:100%; font:14px/20px var(--ft-serif); }
.ft-side__inner{ position:fixed; width:var(--ft-side-w); height:100%; z-index:90; display:flex; flex-direction:column; padding:0 30px; margin-left:-30px; overflow-y:auto; overflow-x:hidden; overscroll-behavior:contain; scrollbar-width:none; }   /* 2026-09-09 드롭다운이 하단을 가리지도 메뉴가 잘리지도 않게. 좌우 30px 여유는 로고가 칼럼보다 넓어서 필요(없으면 잘림) */
.ft-side__inner::-webkit-scrollbar{ width:0; height:0; }
.ft-logo{ position:relative; left:-12px; margin:100px -30px 0; padding-bottom:96px; text-align:center; }
.ft-logo a{ display:block; }
.ft-logo__mark{ display:block; height:80px; width:auto; margin:0 auto 20px; }   /* 심볼(조금 키움) — 워드마크와 1줄 간격 */
.ft-logo__word{ display:block; height:37px; width:auto; margin:0 auto; }
.ft-cats{ margin-bottom:35px; }
.ft-cats,.ft-drops{ position:relative; left:-12px; font-size:19px; line-height:30px; text-align:center; }
.ft-cats a:hover,.ft-drop__list a:hover{ opacity:.55; }
.ft-drop__btn,.ft-drop__link{ display:inline-block; line-height:30px; }
.ft-drop__link:hover{ opacity:.55; }   /* 2026-09-08: Membership 아래 About Us 링크(펼침 없음) */
.ft-cats,.ft-drops{ flex:0 0 auto; }   /* 2026-09-09 메뉴는 줄어들지 않는다 — 잘리지 않게 */
.ft-drop__list{ display:none; padding:4px 0 12px; font-size:15px; }
.ft-drop__list li{ line-height:26px; }
.ft-side__foot{ display:flex; align-items:center; margin-top:auto; margin-bottom:100px; flex:0 0 auto; }   /* 2026-09-09 absolute → flex 바닥 고정 */
.ft-side__rule{ position:relative; display:inline-block; width:65px; height:1px; background:var(--ft-ink); margin:0 16px; }
.ft-side__rule::before,.ft-side__rule::after{ content:""; position:absolute; top:-3px; width:5px; height:5px; border:1px solid var(--ft-ink); border-radius:50%; background:#fff; }
.ft-side__rule::before{ left:-11px; }
.ft-side__rule::after{ right:-11px; }

/* ---------- main column ---------- */
.ft-main{ position:relative; margin-left:calc(var(--ft-side-w) + var(--ft-side-gap)); }
.ft-content{ position:relative; padding-top:100px; min-height:700px; }
.ft-content::after{ content:""; display:block; clear:both; }

/* ---------- footer ---------- */
.ft-footer{ display:flex; justify-content:space-between; align-items:flex-start; margin-top:180px; padding-bottom:60px; font:12px/18px var(--ft-serif); }
.ft-footer__cs{ display:flex; }
.ft-footer__cs dt{ margin-right:30px; }
.ft-footer__cs dd{ margin:0; }
.ft-footer__cs pre{ font-family:var(--ft-serif); }
.ft-footer__info{ display:flex; }
.ft-footer__col{ margin-right:80px; }
.ft-footer__col .ft-footer__biz{ font-size:10px; line-height:16px; }
.ft-footer__links{ width:60px; }
.ft-footer__links a{ display:block; }
.ft-footer__links a:hover{ opacity:.55; }
.ft-footer__row2{ margin-top:20px; }
.ft-escrow{ display:inline-block; width:72px; height:72px; border:1px solid var(--ft-ink); text-align:center; font-size:9px; line-height:12px; }
.ft-escrow span{ display:block; padding-top:18px; }
.ft-sns svg{ width:16px; height:16px; }
.ft-sns:hover{ opacity:.55; }

/* 2026-09-09 화면 높이가 낮을 때: 드롭다운을 펼쳐도 하단 Cart/Search 가 가려지지 않도록
   위아래 여백만 줄인다. 높이 1000px 초과 화면은 종전과 완전히 동일. */
@media (max-height:1000px){
  .ft-logo{ margin-top:70px; padding-bottom:70px; }
  .ft-cats{ margin-bottom:25px; }
  .ft-side__foot{ margin-bottom:70px; }
}
@media (max-height:820px){
  .ft-logo{ margin-top:44px; padding-bottom:44px; }
  .ft-cats{ margin-bottom:16px; }
  .ft-side__foot{ margin-bottom:44px; }
}

@media (min-width:786px) and (max-width:1440px){
  .ft-logo{ margin-top:60px; padding-bottom:60px; }
  .ft-content{ padding-top:60px; }
  .ft-side__foot{ margin-bottom:60px; }
  .ft-footer{ font-size:11px; }
}

/* ---------- home hero strip ---------- */
.ft-hero{ width:90%; max-width:1050px; margin:0 auto; }
.ft-hero__item{ margin-bottom:40px; text-align:left; }
.ft-hero__item:nth-child(even){ text-align:right; }
.ft-hero__item a{ display:inline-block; }
.ft-hero__item img{ width:auto; max-width:100%; height:auto; }
.ft-hero__cap{ text-align:left; font-size:11px; color:var(--ft-mute); margin-top:10px; }

/* ---------- product grid ---------- */
.ft-grid{ margin:0 -1.2%; font-size:0; line-height:0; }
.ft-card{ display:inline-block; vertical-align:top; width:33.33%; margin:0 0 90px; font-size:12px; line-height:18px; }
.ft-card__pic{ position:relative; margin:0 12px 15px; }
.ft-card__pic img{ width:100%; }
.ft-card__pic .ft-card__alt{ position:absolute; left:0; top:0; opacity:0; transition:opacity var(--ft-ease); }
.ft-card__pic:hover .ft-card__alt{ opacity:1; }
.ft-card__meta{ display:flex; align-items:center; justify-content:space-between; margin:0 12px; padding:1px 0; }
.ft-card__name{ flex:0 0 auto; font-size:13px; color:var(--ft-ink); }
.ft-card__orn{ flex:1; display:flex; align-items:center; height:20px; margin:0 5.7px; color:var(--ft-ink); }   /* 좌우 5.7px = 스페이스 2칸 실측(Paperlogy 13px, canvas measureText) */
.ft-card__orn svg{ display:block; height:100%; }
.ft-orn--end{ flex:0 0 15.33px; width:15.33px; }   /* 심볼 원 크기 유지(viewBox 290 → 20px) */
.ft-orn--mid{ flex:0 0 26.63px; width:26.63px; }
.ft-orn--line{ flex:1 1 0; width:auto; min-width:6px; }   /* 심볼 사이 선: 남는 폭만큼 늘어남 */
.ft-card__price{ flex:0 0 auto; text-align:right; color:var(--ft-mute); }   /* 2026-09-09 PC: 가격 검정→회색(모바일과 동일 #999) */
/* 2026-09-08: 지그재그 배열 폐기 — 한 줄 3개 좌→우 정렬 */

.ft-pager{ margin:30px 0; text-align:center; }
.ft-pager a{ display:inline-block; padding:0 5px; color:var(--ft-mute); }
.ft-pager a:hover{ color:var(--ft-ink); text-decoration:underline; }
.ft-pager a.is-on{ color:var(--ft-ink); }
.ft-pager ol{ display:inline-block; padding:0 10px; }
.ft-pager li{ display:inline-block; }

/* ---------- page title ---------- */
.ft-title{ min-height:30px; margin:0 0 80px; color:var(--ft-mute); text-align:center; }
.ft-title h2{ font-size:12px; font-weight:500; }
.ft-title p{ margin-top:5px; }
.ft-title--tight{ margin-bottom:40px; }

/* ---------- buttons ---------- */
.ft-btn{ display:inline-block; box-sizing:border-box; width:80px; line-height:24px; border:1px solid #ccc; color:var(--ft-mute); text-align:center; }
.ft-btn:hover{ border-color:var(--ft-ink); color:var(--ft-ink); }
.ft-btn--dark{ border-color:var(--ft-ink); color:var(--ft-ink); }
.ft-btn--dark:hover{ background:var(--ft-ink); color:#fff; }
.ft-btn--w100{ width:100px; }
.ft-btn--w120{ width:120px; }
.ft-btn--pill{ width:180px; line-height:38px; border-radius:100px; border-color:var(--ft-ink); color:var(--ft-ink); font-size:12px; margin:1px 2px; }
.ft-btn--pill:hover{ background:var(--ft-ink); color:#fff; }
.ft-btn--pill.is-ghost{ border-color:#ccc; color:var(--ft-mute); }
.ft-btn--pill.is-ghost:hover{ border-color:var(--ft-ink); color:var(--ft-ink); background:none; }
.ft-btn--full{ display:block; width:100%; line-height:40px; border:1px solid var(--ft-ink); color:var(--ft-ink); text-align:center; box-sizing:border-box; }
.ft-btn--full:hover{ background:var(--ft-ink); color:#fff; }
.ft-btn--pay{ display:inline-block; width:216px; line-height:50px; background:var(--ft-ink); color:#fff; text-align:center; font-size:14px; }
.ft-btn--pay:hover{ opacity:.8; }
.ft-actions{ padding:10px 0; text-align:center; }
.ft-actions--split{ display:flex; justify-content:space-between; align-items:center; }

/* ---------- generic table (lists) ---------- */
.ft-table{ width:100%; border-collapse:collapse; border-top:1px solid #d7d5d5; }
.ft-table th{ padding:11px 0 10px; border-bottom:1px solid #dfdfdf; color:var(--ft-mute); font-weight:normal; text-align:center; vertical-align:middle; }
.ft-table td{ padding:8px 10px 7px; border-bottom:1px solid var(--ft-line-soft); color:#353535; text-align:center; vertical-align:middle; }
.ft-table .left{ text-align:left; }
.ft-table .right{ text-align:right; }
.ft-table .num{ color:var(--ft-mute); }
.ft-table a:hover{ text-decoration:underline; }
.ft-table__thumb{ display:flex; align-items:center; text-align:left; }
.ft-table__thumb img{ width:70px; margin-right:12px; }
.ft-table__thumb small{ display:block; color:var(--ft-mute); }
.ft-table tfoot td{ padding:10px; background:#fbfafa; }
.ft-empty{ margin-top:15px; border:1px solid #d7d5d5; line-height:39px; text-align:center; color:var(--ft-mute); }

/* ---------- form table (write) ---------- */
.ft-form{ width:100%; border-collapse:collapse; border-top:1px solid var(--ft-line); }
.ft-form th{ width:150px; padding:11px 0 10px; border-bottom:1px solid var(--ft-line); color:var(--ft-mute); font-weight:normal; text-align:left; vertical-align:top; line-height:30px; }
.ft-form td{ padding:11px 10px 10px 0; border-bottom:1px solid var(--ft-line); color:#353535; vertical-align:middle; }
.ft-form input[type=text],.ft-form input[type=password],.ft-form input[type=email],.ft-form input[type=tel],.ft-form select,.ft-form textarea{ width:100%; color:#888; }
.ft-form input:focus,.ft-form select:focus,.ft-form textarea:focus{ color:var(--ft-ink); }
.ft-form .ft-w60{ width:60px !important; } .ft-form .ft-w50{ width:50px !important; } .ft-form .ft-w100{ width:100px !important; } .ft-form .ft-w240{ width:240px !important; } .ft-form .ft-w320{ width:320px !important; }
.ft-form .ft-w-auto{ width:auto !important; }
.ft-form .ft-guide{ display:block; margin-top:2px; color:var(--ft-mute); }
.ft-form .ft-guide em{ font-style:normal; color:#1c4ae0; }
.ft-form .ft-guide em.is-bad{ color:#d33; }
.ft-form .ft-inline{ display:inline-block; margin-right:4px; }
.ft-form .ft-req::after{ content:" *"; color:#c33; }
.ft-form + .ft-form{ margin-top:40px; }
.ft-section{ margin-bottom:50px; }
.ft-section > h3{ font-size:12px; font-weight:500; padding:0 0 10px; }
.ft-section > h3 small{ font-weight:normal; color:var(--ft-mute); margin-left:8px; }
.ft-required-note{ margin:-25px 0 10px; text-align:right; color:#353535; }

/* ---------- agreement blocks ---------- */
.ft-agree-wrap{ display:flex; justify-content:space-between; margin-top:10px; }
.ft-agree{ width:49%; color:#747474; font-size:11px; line-height:20px; }
.ft-agree__box{ overflow:auto; height:110px; padding:20px; border:1px solid var(--ft-line); background:#fff; }
.ft-agree__box p{ padding-bottom:17px; }
.ft-agree__check{ padding:10px; color:#202020; font-size:12px; border:1px solid var(--ft-line); border-top:0; }
.ft-agree__check span{ margin-right:6px; }
.ft-agree--full{ width:100%; }
.ft-agree--full .ft-agree__box{ height:auto; max-height:none; overflow:visible; }
.ft-submit{ margin-top:10px; }

/* ---------- help box ---------- */
.ft-help{ margin:20px 0; border:1px solid #d6d4d4; line-height:18px; }
.ft-help > h3{ padding:9px 0 6px 10px; border-bottom:1px solid #e8e7e7; color:var(--ft-soft); font-size:12px; font-weight:500; }
.ft-help__inner{ padding:0 9px 12px; }
.ft-help h4{ margin:22px 0 -4px; color:#777; font-size:11px; font-weight:500; }
.ft-help h4:first-child{ margin-top:13px; }
.ft-help ol,.ft-help ul{ margin:15px 0 0 11px; }
.ft-help li{ position:relative; padding-left:11px; color:#707070; }
.ft-help li::before{ content:""; position:absolute; left:0; top:8px; width:4px; height:1px; background:#707070; }

/* ---------- tabs ---------- */
.ft-tabs{ text-align:center; margin:-10px 0 40px; }
.ft-tabs li{ display:inline-block; padding:0 5px; }
.ft-tabs a{ display:inline-block; padding:0 10px 5px; border-bottom:1px solid #ccc; color:var(--ft-mute); }
.ft-tabs a:hover,.ft-tabs li.is-on a{ border-bottom-color:var(--ft-ink); color:var(--ft-ink); }
.ft-tabs--wide li a{ min-width:120px; }

/* ---------- boxes ---------- */
.ft-box{ padding:20px; border:1px solid var(--ft-line); color:#404040; }
.ft-box--soft{ background:#fbfafa; border-color:#d7d5d5; }
.ft-summary{ display:flex; justify-content:flex-end; margin:20px 0; }
.ft-summary dl{ display:flex; align-items:center; margin:0 0 0 40px; }
.ft-summary dt{ color:var(--ft-mute); margin-right:12px; }
.ft-summary dd{ margin:0; font-size:12px; }
.ft-summary dl.is-total dd{ font-size:16px; font-weight:500; }
.ft-summary .ft-op{ margin:0 14px; color:var(--ft-mute); }

/* ---------- product detail ---------- */
.ft-detail{ display:flex; justify-content:space-between; align-items:flex-start; }
.ft-detail__info{ width:31%; }
.ft-detail__buy{ width:32%; font-size:11px; }
.ft-detail__visual{ width:31%; }
.ft-detail__visual img{ width:100%; }
.ft-detail__head{ display:flex; align-items:center; margin-bottom:15px; font-size:15px; line-height:22px; }
.ft-detail__rule{ position:relative; flex:0 0 20%; height:1px; margin:0 20px; background:var(--ft-ink); }
.ft-detail__rule::before,.ft-detail__rule::after{ content:""; position:absolute; top:-3px; width:5px; height:5px; border:1px solid var(--ft-ink); border-radius:50%; background:#fff; }
.ft-detail__rule::before{ left:-12px; }
.ft-detail__rule::after{ right:-12px; }
.ft-detail__desc{ padding:20px 0; }
.ft-detail__desc pre{ font-size:13px; line-height:22px; }
.ft-acc__btn{ display:block; width:100%; text-align:left; line-height:28px; font-size:12px; color:var(--ft-mute); font-weight:500; user-select:none; }
.ft-acc__btn:hover{ color:var(--ft-ink); }
.ft-acc__panel{ display:none; padding:15px 0; line-height:18px; }
.ft-acc__panel p{ margin-bottom:18px; }
.ft-acc__panel p:last-child{ margin-bottom:0; }
.ft-size-wrap{ display:flex; gap:5%; margin-bottom:18px; }
.ft-size-wrap .ft-size{ flex:1; margin:0; }
.ft-size{ width:100%; margin:0 0 18px; border-collapse:collapse; table-layout:fixed; text-align:center; }
.ft-size .left{ text-align:left; }
.ft-size--row td:first-child{ color:var(--ft-mute); }
.ft-size__cap{ margin:18px 0 6px !important; font-size:12px; font-weight:500; color:var(--ft-ink); }
.ft-size__cap:first-child{ margin-top:0 !important; }
.ft-size__cap small{ font-weight:normal; color:var(--ft-mute); margin-left:6px; }
.ft-size th{ padding:6px 0; border-top:1px solid var(--ft-ink); border-bottom:1px solid var(--ft-line); font-weight:500; color:var(--ft-soft); }
.ft-size td{ padding:6px 0; border-bottom:1px solid var(--ft-line-soft); }
.ft-buy__row{ display:flex; margin-top:-1px; padding:10px 0; border-top:1px solid var(--ft-line-soft); border-bottom:1px solid var(--ft-line-soft); color:var(--ft-mute); line-height:26px; }
.ft-buy__row dt{ width:100px; }
.ft-buy__row dd{ margin:0; }
.ft-buy__opt{ display:flex; margin:28px 0; line-height:30px; }
.ft-buy__opt label{ width:100px; font-weight:500; }
.ft-buy__opt select{ width:150px; height:30px; padding-left:5px; border-color:#ccc; color:var(--ft-mute); }
.ft-buy__items{ width:100%; border-collapse:collapse; color:var(--ft-mute); }
.ft-buy__items td{ padding:16px 0; line-height:18px; border-bottom:1px solid var(--ft-line-soft); vertical-align:middle; }
.ft-buy__items tr:first-child td{ border-top:1px solid var(--ft-line-soft); }
.ft-buy__items .right{ text-align:right; width:120px; }
.ft-qty{ position:relative; display:inline-block; width:50px; height:23px; vertical-align:top; }
.ft-qty input{ width:22px; height:23px; padding:0 2px 0 3px; border:1px solid #d4d8d9; border-radius:3px 0 0 3px; font-size:11px; }
.ft-qty__up,.ft-qty__down{ position:absolute; left:28px; width:20px; height:11px; line-height:0; }
.ft-qty__up{ top:0; } .ft-qty__down{ top:12px; }
.ft-qty__up svg,.ft-qty__down svg{ width:20px; height:11px; display:block; }
.ft-buy__total{ margin:14px 0 22px; line-height:40px; font-size:12px; }
.ft-buy__total b{ font-weight:500; }
.ft-buy__actions a{ display:block; margin-bottom:10px; border:1px solid #ccc; color:var(--ft-mute); text-align:center; font-size:11px; line-height:36px; box-sizing:border-box; }
.ft-buy__actions a:hover{ background:#f1f1f1; }
.ft-buy__actions a.is-primary{ border-color:var(--ft-ink); color:var(--ft-ink); }
.ft-buy__actions a.is-primary:hover{ background:var(--ft-ink); color:#fff; }
.ft-detail__body{ margin:60px 0; text-align:center; line-height:18px; }
.ft-detail__body img{ display:inline-block; max-width:100%; height:auto; }
.ft-related{ margin:120px 0; text-align:center; }
.ft-related h2{ font-size:11px; font-weight:400; padding-bottom:20px; }
.ft-related__list{ margin:0 -0.3%; font-size:0; }
.ft-related__item{ display:inline-block; vertical-align:top; width:20%; }
.ft-related__box{ width:95%; margin:10px auto; font-size:11px; line-height:16px; color:#888; }
.ft-related__box img{ width:100%; margin-bottom:8px; }
.ft-block{ padding:27px 0 46px; color:#353535; line-height:18px; }
.ft-block__head{ display:flex; justify-content:space-between; align-items:center; }
.ft-block__head h3{ font-size:11px; font-weight:normal; }

/* ---------- member ---------- */
.ft-login-wrap{ padding-top:100px; margin-top:-8px; }
.ft-login{ width:354px; margin:0 auto 140px; font-size:11px; }
.ft-login__field{ margin-bottom:10px; }
.ft-login input[type=text],.ft-login input[type=password]{ width:100%; height:38px; padding-left:10px; border:1px solid var(--ft-ink); font-size:10px; }
.ft-login input::placeholder{ color:var(--ft-ink); letter-spacing:.02em; }
.ft-login__bar{ display:flex; justify-content:space-between; align-items:center; color:#ccc; }
.ft-login__bar a{ display:inline-block; font-size:10px; line-height:48px; color:var(--ft-ink); }
.ft-login__bar .ft-login__links a{ padding-right:5px; }
.ft-login__bar .ft-login__go{ font-size:14px; }
.ft-center-link{ margin-bottom:140px; text-align:center; }
.ft-center-link a{ display:inline-block; padding:0 4px; border-bottom:1px solid var(--ft-ink); font-size:12px; line-height:32px; }
.ft-find{ width:354px; margin:0 auto 140px; }
.ft-find h2{ font-size:12px; font-weight:500; text-align:center; }
.ft-find p.ft-find__lead{ margin:8px 0 30px; text-align:center; color:var(--ft-mute); }
.ft-find__methods{ text-align:center; margin-bottom:20px; }
.ft-find__row{ display:flex; align-items:center; height:38px; margin-bottom:10px; padding:0 10px; border:1px solid var(--ft-ink); }
.ft-find__row strong{ width:80px; font-size:10px; font-weight:500; }
.ft-find__row input{ flex:1; height:24px; border:0; padding:0; font-size:12px; }
.ft-find__row input.ft-w50{ flex:0 0 50px; text-align:center; }
.ft-find__row i{ margin:0 6px; font-style:normal; color:var(--ft-mute); }
.ft-find__go{ margin-top:10px; }
.ft-my-head{ display:flex; justify-content:space-between; align-items:center; margin-bottom:40px; padding:20px; border:1px solid var(--ft-line); }
.ft-my-head strong{ font-size:14px; font-weight:500; }
.ft-my-head p{ margin-top:4px; color:var(--ft-mute); }
.ft-my-stats{ display:flex; }
.ft-my-stats div{ text-align:center; padding:0 24px; border-left:1px solid var(--ft-line-soft); }
.ft-my-stats b{ display:block; font-size:16px; font-weight:500; }
.ft-my-stats span{ color:var(--ft-mute); }
.ft-steps{ display:flex; justify-content:space-between; margin-bottom:40px; padding:20px 0; border-top:1px solid var(--ft-line); border-bottom:1px solid var(--ft-line); }
.ft-steps li{ flex:1; text-align:center; color:var(--ft-mute); }
.ft-steps b{ display:block; font-size:16px; font-weight:500; color:var(--ft-ink); }
.ft-status{ display:inline-block; padding:0 8px; line-height:18px; border:1px solid var(--ft-line); color:var(--ft-soft); font-size:10px; }
.ft-status.is-done{ border-color:var(--ft-ink); color:var(--ft-ink); }
.ft-period a{ margin-right:4px; }
.ft-desc{ display:flex; flex-wrap:wrap; }
.ft-desc dt{ width:120px; color:var(--ft-mute); line-height:22px; }
.ft-desc dd{ width:calc(100% - 120px); margin:0; line-height:22px; }

/* ---------- cart / order ---------- */
.ft-cart-actions{ display:flex; justify-content:space-between; padding:10px 0; }
.ft-cart-actions .ft-btn{ margin-right:4px; }
.ft-pay-methods{ display:flex; flex-wrap:wrap; }
.ft-pay-methods label{ display:inline-block; margin:0 8px 8px 0; padding:0 16px; line-height:34px; border:1px solid var(--ft-line); cursor:pointer; }
.ft-pay-methods input{ display:none; }
.ft-pay-methods input:checked + span{ font-weight:500; }
.ft-pay-methods label.is-on{ border-color:var(--ft-ink); }
.ft-pay-note{ margin-top:6px; color:var(--ft-mute); }
.ft-order-total{ display:flex; margin-top:20px; border:1px solid var(--ft-ink); }
.ft-order-total__col{ flex:1; padding:20px; }
.ft-order-total__col + .ft-order-total__col{ border-left:1px solid var(--ft-line); }
.ft-order-total dl{ display:flex; justify-content:space-between; line-height:24px; }
.ft-order-total dt{ color:var(--ft-mute); }
.ft-order-total dd{ margin:0; }
.ft-order-total .is-final{ margin-top:8px; padding-top:8px; border-top:1px solid var(--ft-line); font-size:14px; }
.ft-order-total .is-final dd{ font-weight:500; }
.ft-complete{ text-align:center; padding:40px 0 60px; }
.ft-complete h2{ font-size:16px; font-weight:500; margin-bottom:12px; }
.ft-complete p{ color:var(--ft-mute); }
.ft-complete .ft-order-no{ display:inline-block; margin:20px 0; padding:0 24px; line-height:38px; border:1px solid var(--ft-ink); font-size:14px; color:var(--ft-ink); }

/* ---------- board ---------- */
.ft-board-title{ text-align:center; }
.ft-board-title h2{ font-size:12px; font-weight:500; padding-bottom:40px; }
.ft-board-tools{ display:flex; justify-content:space-between; align-items:center; padding:10px 0; }
.ft-board-search{ display:flex; }
.ft-board-search select{ width:90px; margin-right:4px; }
.ft-board-search input{ width:200px; margin-right:4px; }
.ft-post{ border-top:1px solid var(--ft-ink); }
.ft-post__head{ padding:14px 10px; border-bottom:1px solid var(--ft-line); }
.ft-post__head h3{ font-size:12px; font-weight:500; }
.ft-post__meta{ margin-top:4px; color:var(--ft-mute); }
.ft-post__meta span{ margin-right:14px; }
.ft-post__body{ padding:30px 10px 40px; line-height:20px; border-bottom:1px solid var(--ft-line); }
.ft-post__body img{ margin-bottom:16px; }
.ft-post__nav{ border-bottom:1px solid var(--ft-line); }
.ft-post__nav li{ display:flex; padding:8px 10px; border-top:1px solid var(--ft-line-soft); }
.ft-post__nav strong{ width:70px; font-weight:500; color:var(--ft-mute); }
.ft-post__nav a:hover{ text-decoration:underline; }
.ft-reply{ margin-top:1px; padding:16px 10px 16px 30px; background:#fbfafa; border-bottom:1px solid var(--ft-line); position:relative; }
.ft-reply::before{ content:"↳"; position:absolute; left:10px; top:16px; color:var(--ft-mute); }
.ft-reply strong{ display:block; margin-bottom:6px; font-weight:500; }
.ft-reviews{ margin:0 -1.2%; font-size:0; }
.ft-review{ display:inline-block; vertical-align:top; width:25%; margin-bottom:60px; font-size:11px; line-height:18px; }
.ft-review__in{ margin:0 12px; }
.ft-review__in img{ width:100%; margin-bottom:12px; }
/* 사진 없는 텍스트 후기: 이미지 자리(5:6)에 본문 발췌 */
.ft-review__quote{ display:flex; align-items:center; justify-content:center; box-sizing:border-box; aspect-ratio:5/6; margin-bottom:12px; padding:14% 12%; border:1px solid var(--ft-line); background:#fbfafa; text-align:center; font-size:12px; line-height:22px; color:var(--ft-soft); }
.ft-review__quote span{ display:-webkit-box; -webkit-line-clamp:8; -webkit-box-orient:vertical; overflow:hidden; }
.ft-review__quote:hover{ border-color:var(--ft-ink); }
.ft-review__prod{ color:var(--ft-mute); }
.ft-review__stars{ color:var(--ft-ink); letter-spacing:2px; }
.ft-review__title{ display:block; margin:4px 0; font-size:12px; color:var(--ft-soft); }
.ft-review__by{ color:var(--ft-mute); }
.ft-review__by span{ margin-right:8px; }
.ft-stars-pick{ font-size:16px; letter-spacing:3px; color:#bbb; cursor:pointer; user-select:none; }
.ft-stars-pick b{ font-weight:normal; }
.ft-stars-pick b.is-on{ color:var(--ft-ink); }
.ft-file{ font-size:11px; }

/* ---------- info pages ---------- */
.ft-story{ width:90%; max-width:760px; margin:0 auto; text-align:center; line-height:22px; }
.ft-story img{ margin-bottom:40px; }
.ft-story h2{ font-family:var(--ft-serif); font-size:20px; font-weight:400; margin-bottom:24px; }
.ft-story p{ margin-bottom:22px; }
.ft-story .ft-story__tag{ font-family:var(--ft-serif); font-size:12px; letter-spacing:.2em; color:var(--ft-mute); margin:40px 0; }
.ft-doc{ width:90%; max-width:900px; margin:0 auto; line-height:20px; color:#353535; }
.ft-doc h3{ margin:36px 0 10px; font-size:12px; font-weight:500; color:var(--ft-ink); }
.ft-doc h3:first-child{ margin-top:0; }
.ft-doc p,.ft-doc li{ margin-bottom:8px; }
.ft-doc ol{ list-style:decimal; padding-left:18px; }
.ft-doc ul{ padding-left:12px; }
.ft-doc ul li{ position:relative; }
.ft-doc ul li::before{ content:""; position:absolute; left:-12px; top:9px; width:5px; height:1px; background:#999; }
.ft-doc .ft-doc__note{ margin-top:40px; padding:16px; background:#fbfafa; color:var(--ft-mute); }
.ft-guide-sec{ margin-bottom:60px; scroll-margin-top:40px; }
.ft-guide-sec h3{ font-size:12px; font-weight:500; padding-bottom:10px; margin-bottom:16px; border-bottom:1px solid var(--ft-ink); }
.ft-guide-sec p,.ft-guide-sec li{ line-height:20px; color:#353535; margin-bottom:6px; }
.ft-guide-sec ul{ padding-left:12px; }
.ft-guide-sec li{ position:relative; }
.ft-guide-sec li::before{ content:""; position:absolute; left:-12px; top:9px; width:5px; height:1px; background:#999; }

/* ---------- search overlay ---------- */
.ft-veil{ position:fixed; inset:0; z-index:9000; display:none; }
.ft-search{ position:fixed; left:0; top:0; z-index:9999; display:none; width:30%; height:100%; background:#fff; border-right:1px solid #ccc; text-align:left; }
.ft-search__inner{ position:relative; box-sizing:border-box; width:70%; max-width:350px; height:100%; margin:0 auto; padding-top:20%; }
.ft-search__title{ font-size:16px; padding-bottom:50px; }
.ft-search__title pre{ margin-top:20px; font-size:11px; }
.ft-search__form{ display:flex; align-items:center; box-sizing:border-box; width:100%; height:37px; border:1px solid var(--ft-ink); }
.ft-search__form input{ flex:1; height:35px; border:0; padding:0; margin:0; font-size:12px; text-indent:5px; background:none; }
.ft-search__form button{ width:16px; height:16px; margin-right:8px; opacity:.5; }
.ft-search__form button:hover{ opacity:1; }
.ft-search__form button svg{ width:16px; height:16px; display:block; }
.ft-search__hot{ padding-top:20%; color:var(--ft-mute); }
.ft-search__hot a{ display:block; line-height:28px; font-size:12px; color:var(--ft-mute); }
.ft-search__hot a:hover{ color:var(--ft-ink); font-weight:600; }
.ft-search__more{ position:absolute; left:0; bottom:20%; font-size:14px; }
.ft-search__more a{ border-bottom:1px solid #fff; }
.ft-search__more a:hover{ border-bottom-color:var(--ft-ink); }
.ft-search__close{ position:absolute; right:-40px; top:24px; font-size:18px; line-height:1; color:var(--ft-mute); }
.ft-search__close:hover{ color:var(--ft-ink); }

/* ---------- to top ---------- */
.ft-totop{ position:fixed; right:3%; bottom:50px; z-index:999; display:none; }
.ft-totop svg{ width:30px; height:30px; transition:opacity var(--ft-ease); }
.ft-totop:hover svg{ opacity:.5; }

/* ---------- detail: fold rows (review / q&a) ---------- */
.ft-block__head h3 small{ color:var(--ft-mute); font-weight:normal; margin-left:4px; }
.ft-table--fold tr[data-fold]{ cursor:pointer; }
.ft-table--fold tr[data-fold]:hover td{ background:#fbfafa; }
.ft-table--fold tr[data-fold].is-open td{ border-bottom-color:transparent; }
.ft-fold td{ padding:0 20px 20px; text-align:left; background:#fbfafa; }
.ft-fold__in{ display:flex; align-items:flex-start; padding-top:16px; border-top:1px dashed var(--ft-line); line-height:20px; color:#353535; }
.ft-fold__in img{ margin-right:20px; }
.ft-fold__in p{ margin-bottom:12px; }
.ft-fold__reply{ margin-top:14px; padding:12px 14px 12px 24px; background:#fff; border:1px solid var(--ft-line-soft); position:relative; }
.ft-fold__reply::before{ content:"↳"; position:absolute; left:8px; top:12px; color:var(--ft-mute); }
.ft-fold__reply strong{ font-weight:500; margin-right:6px; }

/* ==========================================================================
   RESPONSIVE (2026-09-08 §4) — desktop layout (≥1025px) is untouched.
   Breakpoints: tablet ≤1024 (drawer nav) / mobile ≤768 / small ≤480
   Reference: m.colonist.kr mobile — fixed header (logo left, menu right),
   right-side drawer, rotated Cart/Search on the left edge, 2-column grid.
   ========================================================================== */
/* mobile-only elements are hidden on desktop */
.ft-mhead,.ft-mside,.ft-side__close,.ft-side__sns{ display:none; }
/* helper classes (moved out of inline style= so media queries can override) */
.ft-col-40{ width:40px; } .ft-col-60{ width:60px; } .ft-col-70{ width:70px; } .ft-col-80{ width:80px; } .ft-col-90{ width:90px; }
.ft-col-100{ width:100px; } .ft-col-110{ width:110px; } .ft-col-120{ width:120px; } .ft-col-150{ width:150px; } .ft-col-200{ width:200px; }
.ft-thumb-s{ width:40px; }
.ft-fold__img{ width:240px; }
.ft-post__img{ max-width:600px; }
.ft-btn--w60{ width:60px; }
.ft-mt5{ margin-top:5px; }
.ft-mt20{ margin-top:20px; }
.ft-narrow{ width:80%; margin:0 auto; }
.ft-section.ft-narrow{ margin-bottom:50px; }
.ft-actions--pay{ padding-top:30px; }
.ft-note{ color:var(--ft-mute); }
.ft-agree__check--top{ border-top:1px solid #ddd; }

@media (max-width:1024px){
  html,body{ overflow-x:hidden; }
  body.is-nav-open{ overflow:hidden; }
  .ft-shell{ width:90%; max-width:none; }
  .ft-main{ margin-left:0; }
  .ft-content{ padding-top:90px; min-height:60vh; }

  /* ---- fixed mobile header (ref: logo left / hamburger right) ---- */
  .ft-mhead{ display:flex; align-items:center; justify-content:space-between; position:fixed; left:0; top:0; right:0; z-index:8000; height:64px; padding:0 5%; background:transparent; box-sizing:border-box; }   /* 2026-09-09 ②: 상단바 투명 */
  .ft-mhead__logo{ display:flex; flex-direction:column; align-items:center; }   /* 2026-09-09 ①: PC처럼 심볼 위 · 워드마크 아래 */
  .ft-mhead__logo .ft-mhead__mark{ height:34px; width:auto; margin:0 0 5px; }   /* 2026-09-09 2차 ①: 30→34 */
  .ft-mhead__logo .ft-mhead__word{ height:16px; width:auto; }   /* 14→16 */
  .ft-mhead__menu{ display:flex; align-items:center; justify-content:center; width:44px; height:44px; margin-right:-12px; }
  .ft-mhead__menu svg{ width:24px; height:24px; }

  /* ---- left-edge rotated Cart / Search (ref #LeftMenu) ---- */
  .ft-mside{ position:fixed; left:10.55px; bottom:62px; z-index:900; display:flex; align-items:center; height:18px; font:13px/18px var(--ft-serif); white-space:nowrap; transform:rotate(-90deg); transform-origin:left top; }
  .ft-mside .ft-side__rule{ width:50px; margin:0 14px; }

  /* ---- side nav → right-side drawer ---- */
  .ft-side{ position:fixed; left:auto; right:0; top:0; width:84%; max-width:320px; height:100%; z-index:9500; background:#fff; transform:translateX(102%); transition:transform var(--ft-ease); overflow-y:auto; -webkit-overflow-scrolling:touch; font-size:15px; }
  body.is-nav-open .ft-side{ transform:none; box-shadow:0 0 30px rgba(0,0,0,.12); }
  .ft-side__inner{ position:relative; display:block; width:auto; height:auto; min-height:100%; padding:34px 12% 40px; box-sizing:border-box; }
  .ft-side__inner{ padding:34px 12% 40px; margin-left:0; overflow:visible; }
  .ft-cats,.ft-drops{ flex:none; }
  .ft-side__close{ display:block; position:absolute; right:10px; top:8px; width:40px; height:40px; font-size:28px; line-height:40px; text-align:center; color:var(--ft-mute); }
  .ft-logo{ left:0; margin:0 0 36px; padding:0; text-align:left; }
  .ft-logo__mark{ height:44px; margin:0 0 9px 29.2px; }   /* 2026-09-09 2차 ②③: 52→44, 워드마크(118.25px) 중앙에 심볼(59.93px) = (118.25-59.93)/2 */
  .ft-logo__word{ height:20px; margin:0; }   /* 2026-09-09 2차 ②③: 24→20 */
  .ft-cats{ margin-bottom:30px; }
  .ft-cats,.ft-drops{ left:0; font-size:13px; line-height:23px; text-align:left; }   /* 2026-09-09 ④: 품목 글씨 축소 */
  .ft-cats li a{ display:block; padding:3px 0; }
  .ft-drop__btn,.ft-drop__link{ display:flex; justify-content:space-between; align-items:center; width:100%; padding:5px 0; line-height:23px; text-align:left; }
  .ft-drop__btn::after{ content:"+"; font-size:18px; }
  .ft-drop.is-open .ft-drop__btn::after{ content:"\2013"; }
  .ft-drop__list{ padding:4px 0 16px 12px; font-size:12px; }
  .ft-drop__list li{ line-height:27px; }
  .ft-side__foot{ position:static; margin-top:44px; margin-bottom:0; font-size:12px; }
  .ft-side__sns{ display:block; margin-top:28px; font-size:11px; }
  .ft-side__sns a{ border-bottom:1px solid var(--ft-ink); }

  /* ---- footer (ref: CS block, then info right-aligned) ---- */
  /* 2026-09-09 ⑤: 레퍼런스 모바일 푸터 정리(10px·#999·상단 구분선) */
  .ft-footer{ flex-direction:column; margin-top:60px; padding:40px 0 60px; border-top:1px solid #ccc; font-size:10px; line-height:16px; color:var(--ft-mute); }
  /* 좌측 정렬 고객센터 블록이 고정 Cart/Search 레일(오른쪽 끝 28.55px)에 닿지 않게 내용만 들여씀.
     padding 이라 구분선(border-top)은 원래 폭 그대로, 우측 정렬 회사정보의 오른쪽 끝도 그대로. */
  .ft-footer{ padding-left:max(0px, 37.7px - 5vw); }
  .ft-footer *{ color:var(--ft-mute); }
  .ft-footer__cs{ margin-bottom:50px; }
  .ft-footer__cs dt{ display:none; }   /* 2026-09-09 2차 ④: 좌측 'Customer Center' 라벨 숨김(모바일만) */
  .ft-footer__col p:not(.ft-footer__row2) br{ display:none; }   /* 에스크로 배지 줄바꿈은 유지 */
  .ft-footer__col p .ft-fl{ display:block; }   /* 항목마다 한 줄 = 우측 정렬이 딱 떨어짐 */
  .ft-footer__col p .ft-fsep{ display:none; }
  .ft-escrow{ border-color:#ccc; }
  .ft-footer__info{ flex-direction:column; align-self:stretch; text-align:right; }   /* 2026-09-09 2차: 한 줄씩 끊은 뒤 블록이 좁아져 우측 정렬 기준이 밀리던 것 — 화면 끝에 맞춤 */
  .ft-footer__col{ margin-right:0; }
  .ft-footer__links{ width:auto; display:flex; flex-wrap:wrap; justify-content:flex-end; align-items:center; margin-top:20px; }
  .ft-footer__links a{ margin-left:10px; }
  .ft-footer__links .ft-footer__row2{ width:100%; margin:16px 0 0; }

  /* ---- search overlay ---- */
  .ft-search{ width:100%; max-width:420px; border-right:0; }
  .ft-search__inner{ width:84%; max-width:none; padding-top:90px; }
  .ft-search__close{ right:0; top:22px; width:36px; height:36px; line-height:36px; text-align:center; font-size:26px; }
  .ft-search__hot{ padding-top:50px; }
  .ft-search__more{ bottom:40px; }

  /* ---- product detail: 2 columns (visual | info), buy under info ---- */
  .ft-detail{ flex-wrap:wrap; }
  .ft-detail__visual{ order:-1; width:46%; }
  .ft-detail__info{ width:48%; }
  .ft-detail__buy{ width:48%; margin-left:auto; margin-top:30px; }
  .ft-related__item{ width:25%; }
  .ft-totop{ right:5%; bottom:30px; }

  /* ---- 2026-09-10: home hero alignment, mobile only (PC stays left/right/left) ---- */
  .ft-hero__item{ text-align:right; }
  .ft-hero__item:nth-child(even){ text-align:left; }
  /* 좌측 정렬 컷이 고정 Cart/Search 레일(오른쪽 끝 28.55px)에 닿지 않게 최소 37.7px 지점부터 시작 */
  .ft-hero__item:nth-child(even) a{ margin-left:max(0px, 37.7px - 5vw); }
}

@media (max-width:768px){
  body{ font-size:12px; line-height:19px; }
  .ft-content{ padding-top:90px; }
  .ft-title{ margin-bottom:40px; }
  .ft-title--tight{ margin-bottom:24px; }
  .ft-narrow{ width:100%; }

  /* touch-friendly controls (16px avoids iOS auto-zoom on focus) */
  input[type=text],input[type=password],input[type=email],input[type=tel],input[type=number],select{ height:40px; font-size:16px; }
  textarea{ font-size:16px; }
  input[type=checkbox],input[type=radio]{ width:16px; height:16px; vertical-align:-3px; }
  .ft-btn{ line-height:30px; }
  .ft-btn--pill{ display:block; width:100%; max-width:320px; margin:6px auto; }
  .ft-btn--pay{ width:100%; }
  .ft-btn--full{ line-height:44px; }

  /* home hero (ref: alternating, 62% / 80% / 60%) */
  .ft-hero{ width:100%; }
  .ft-hero__item{ margin-bottom:40px; }
  .ft-hero__item a{ max-width:80%; }
  .ft-hero__item:nth-child(3n+1) a{ max-width:62%; }
  .ft-hero__item:nth-child(3n) a{ max-width:60%; }
  .ft-hero__item img{ width:100%; }
  .ft-hero__cap{ font-size:11px; margin-top:10px; }

  /* product grid: 2 columns; name on line 1, ornament + price on line 2 */
  .ft-grid{ margin:0 -6px; }
  .ft-card{ width:50%; margin:0 0 40px; }
  .ft-card__pic{ margin:0 6px 10px; }
  /* 2026-09-09 ⑥: 1줄 = 품명 + 심볼(글자보다 작게), 2줄 = 가격(작게·회색) */
  .ft-card__meta{ margin:0 6px; flex-wrap:wrap; align-items:center; }
  .ft-card__name{ flex:0 1 auto; width:auto; min-width:0; font-size:12px; line-height:18px; }
  .ft-card__orn{ flex:1 1 0; align-self:flex-start; height:10px; min-width:41px; margin:4px 0 0 5.7px; }   /* 41px = 심볼 2개+알약+최소선, 첫 줄 높이에 맞춤 */
  .ft-orn--end{ flex:0 0 7.7px; width:7.7px; }
  .ft-orn--mid{ flex:0 0 13.3px; width:13.3px; }
  .ft-card__price{ width:100%; margin-top:1px; text-align:left; font-size:10px; line-height:15px; color:var(--ft-mute); }

  /* generic tables */
  .ft-table th,.ft-table td{ padding-left:4px; padding-right:4px; }
  .ft-table th[class*="ft-col-"]{ width:auto; }
  .ft-table td.num{ white-space:nowrap; }   /* 날짜·번호 줄바꿈 방지 */
  .ft-table__thumb img{ width:54px; margin-right:8px; }
  .ft-table__thumb img.ft-thumb-s{ width:32px; }
  .ft-page-notice .ft-table th:nth-child(3),.ft-page-notice .ft-table td:nth-child(3){ display:none; }
  .ft-page-qna .ft-table th:nth-child(1),.ft-page-qna .ft-table td:nth-child(1),
  .ft-page-qna .ft-table th:nth-child(2),.ft-page-qna .ft-table td:nth-child(2),
  .ft-page-qna .ft-table th:nth-child(4),.ft-page-qna .ft-table td:nth-child(4){ display:none; }
  .ft-page-order .ft-table th:nth-child(2),.ft-page-order .ft-table td:nth-child(2),
  .ft-page-order .ft-table th:nth-child(4),.ft-page-order .ft-table td:nth-child(4){ display:none; }
  .ft-page-order_view .ft-table th:nth-child(4),.ft-page-order_view .ft-table td:nth-child(4){ display:none; }
  /* 2026-09-09 ⑦: 공지·문의 목록 행 간격 확대 */
  .ft-page-notice .ft-table th,.ft-page-qna .ft-table th{ padding-top:14px; padding-bottom:13px; }
  .ft-page-notice .ft-table td,.ft-page-qna .ft-table td{ padding-top:14px; padding-bottom:13px; line-height:20px; }
  #review .ft-table th:nth-child(1),#review .ft-table td:nth-child(1),
  #review .ft-table th:nth-child(5),#review .ft-table td:nth-child(5){ display:none; }
  #qna .ft-table th:nth-child(1),#qna .ft-table td:nth-child(1),
  #qna .ft-table th:nth-child(3),#qna .ft-table td:nth-child(3){ display:none; }
  .ft-table--fold .ft-fold td{ display:table-cell; }
  .ft-fold td{ padding:0 10px 16px; }
  .ft-fold__in{ flex-direction:column; }
  .ft-fold__img{ width:100%; max-width:240px; margin:0 0 12px; }

  /* order list → cards */
  .ft-table--orders thead{ display:none; }
  .ft-table--orders tr{ display:flex; flex-wrap:wrap; align-items:center; padding:14px 0; border-bottom:1px solid var(--ft-line-soft); }
  .ft-table--orders td{ display:block; padding:0; border:0; text-align:left; }
  .ft-o-date{ width:100%; margin-bottom:10px; }
  .ft-o-date br{ display:none; }
  .ft-o-date .num{ margin-right:10px; }
  .ft-o-prod{ width:100%; margin-bottom:10px; }
  .ft-o-qty::before{ content:"수량 "; color:var(--ft-mute); }
  .ft-o-amt{ margin-left:14px; }
  .ft-o-amt::before{ content:"금액 "; color:var(--ft-mute); }
  .ft-o-st{ margin-left:auto; }

  /* cart → cards */
  .ft-table--cart thead{ display:none; }
  .ft-table--cart tr{ display:flex; flex-wrap:wrap; align-items:center; position:relative; padding:14px 0 14px 26px; border-bottom:1px solid var(--ft-line-soft); }
  .ft-table--cart td{ display:block; padding:0; border:0; text-align:left; }
  .ft-c-chk{ position:absolute; left:0; top:16px; }
  .ft-c-prod{ width:100%; margin-bottom:10px; padding-right:60px; box-sizing:border-box; }
  .ft-table--cart .ft-c-price,.ft-table--cart .ft-c-ship{ display:none; }
  .ft-c-total{ margin-left:auto; font-weight:500; }
  .ft-c-del{ position:absolute; right:0; top:14px; }
  .ft-c-del .ft-btn{ width:auto; padding:0 8px; line-height:22px; }
  .ft-qty input{ height:23px; font-size:12px; }   /* 수량 입력은 스테퍼 크기 유지 */
  .ft-cart-actions{ flex-wrap:wrap; }
  .ft-cart-actions .ft-btn{ margin-bottom:6px; }

  /* summary / totals */
  .ft-summary{ display:block; padding-top:12px; border-top:1px solid var(--ft-line); }
  .ft-summary dl{ justify-content:space-between; margin:0; line-height:28px; }
  .ft-summary .ft-op{ display:none; }
  .ft-summary dl.is-total{ margin-top:6px; padding-top:6px; border-top:1px solid var(--ft-line-soft); }
  .ft-order-total{ flex-direction:column; }
  .ft-order-total__col{ padding:14px 16px; }
  .ft-order-total__col + .ft-order-total__col{ border-left:0; border-top:1px solid var(--ft-line); }

  /* forms: label above field */
  .ft-form th{ display:block; width:auto; padding:12px 0 0; border:0; line-height:20px; }
  .ft-form td{ display:block; padding:4px 0 12px; }
  .ft-form .ft-w240,.ft-form .ft-w320{ width:100% !important; }
  .ft-form .ft-w60{ width:70px !important; } .ft-form .ft-w50{ width:56px !important; }
  .ft-form .ft-w100{ width:110px !important; }
  .ft-form .ft-inline{ margin:0 4px 0 0; }
  .ft-required-note{ margin:-10px 0 4px; }
  .ft-section > h3 small input{ margin-left:6px; }
  .ft-agree-wrap{ flex-direction:column; }
  .ft-agree{ width:100%; margin-bottom:12px; }
  .ft-agree__box{ height:130px; padding:14px; }
  .ft-pay-methods label{ flex:1 0 46%; margin:0 8px 8px 0; padding:0 8px; text-align:center; }
  .ft-desc dt{ width:80px; }
  .ft-desc dd{ width:calc(100% - 80px); }

  /* product detail: single column (visual → info → buy) */
  .ft-detail{ flex-direction:column; }
  .ft-detail__visual,.ft-detail__info,.ft-detail__buy{ width:100%; }
  .ft-detail__visual{ margin-bottom:24px; }
  .ft-detail__buy{ margin:20px 0 0; }
  /* 2026-09-09 ⑧: 레퍼런스 모바일 상세와 비슷한 글자·버튼 크기 */
  .ft-detail__head{ margin-bottom:24px; font-size:12px; line-height:18px; }   /* 2026-09-09 여백 14→24 */
  .ft-detail__desc{ padding:14px 0 24px; }   /* 2026-09-09 아래 여백 14→24 */
  .ft-detail__desc .ft-dsep{ line-height:30px; }   /* 2026-09-09 소개글/MATERIAL/SIZE 사이 빈 줄 18→30 */
  .ft-detail__desc pre{ font-size:11px; line-height:18px; }
  .ft-detail__rule{ flex-basis:15%; margin:0 18px; }
  .ft-acc__btn{ line-height:24px; font-size:11px; }
  .ft-acc__panel{ padding:12px 0; font-size:11px; line-height:18px; }
  .ft-buy__row{ padding:8px 0; line-height:24px; font-size:11px; }
  .ft-buy__row dt{ width:80px; }
  .ft-buy__opt{ margin:16px 0; line-height:26px; }
  .ft-buy__opt label{ width:80px; font-size:11px; }
  .ft-buy__opt select{ flex:1; width:auto; height:30px; font-size:11px; }
  .ft-buy__items td{ padding:12px 0; font-size:11px; }
  .ft-buy__total{ margin:8px 0 12px; line-height:36px; font-size:12px; }
  .ft-buy__actions{ display:flex; gap:6px; margin-top:0; }
  .ft-buy__actions a{ flex:1; line-height:34px; font-size:11px; margin:0; }
  .ft-detail__body{ margin:40px 0; }
  .ft-related{ margin:70px 0; }
  .ft-related__item{ width:33.33%; }
  .ft-block__head{ flex-wrap:wrap; }
  .ft-block__head > div{ margin-top:8px; margin-bottom:12px; }   /* 2026-09-09: 후기작성·문의작성·모두보기 버튼이 아래 표 선에 붙던 것(간격 0) 띄움 */

  /* member */
  .ft-login-wrap{ padding-top:20px; }
  .ft-login,.ft-find{ width:100%; max-width:354px; margin-bottom:80px; }
  .ft-login input[type=text],.ft-login input[type=password]{ height:44px; }
  .ft-find__row{ height:44px; }
  .ft-find__row input{ height:30px; }
  .ft-center-link{ margin-bottom:80px; }
  .ft-my-head{ flex-direction:column; align-items:stretch; padding:16px; }
  .ft-my-stats{ margin-top:14px; padding-top:12px; border-top:1px solid var(--ft-line-soft); justify-content:space-around; }
  .ft-my-stats div{ flex:1; padding:0 6px; }
  .ft-my-stats div:first-child{ border-left:0; }
  .ft-steps{ padding:14px 0; }
  .ft-steps li{ font-size:10px; }
  .ft-steps b{ font-size:14px; }
  .ft-tabs{ margin-bottom:28px; }
  .ft-tabs li{ padding:3px 2px; }
  .ft-tabs a{ padding:0 8px 5px; }
  .ft-tabs--wide li a{ min-width:0; }

  /* boards */
  .ft-board-title h2{ padding-bottom:24px; }
  .ft-board-tools{ flex-direction:column; align-items:stretch; }
  .ft-board-tools > *{ margin-bottom:10px; }
  .ft-board-tools > .ft-btn{ align-self:flex-start; }
  .ft-board-search{ width:100%; }
  .ft-board-search select{ width:84px; }
  .ft-board-search input{ flex:1; width:auto; min-width:0; }
  .ft-period{ display:flex; flex-wrap:wrap; }
  .ft-period .ft-btn{ flex:1; margin:0 4px 4px 0; }
  .ft-post__body{ padding:20px 4px 28px; }
  .ft-post__img{ max-width:100%; }
  .ft-post__head{ padding:12px 4px; }
  .ft-post__nav li{ padding:8px 4px; }
  .ft-reviews{ margin:0 -6px; }
  .ft-review{ width:50%; margin-bottom:36px; }
  .ft-review__in{ margin:0 6px; }
  .ft-help__inner{ padding:0 12px 12px; }
  .ft-help ol,.ft-help ul{ margin-left:0; }

  /* info pages */
  .ft-story,.ft-doc{ width:100%; }
  .ft-story h2{ font-size:18px; }
  .ft-story p br{ display:none; }
  .ft-story img{ margin-bottom:28px; }
  .ft-guide-sec{ margin-bottom:40px; scroll-margin-top:80px; }
  .ft-complete{ padding:20px 0 30px; }
  .ft-footer{ margin-top:50px; font-size:10px; line-height:16px; }
}

@media (max-width:480px){
  .ft-related__item{ width:50%; }
  .ft-related__box{ margin:8px auto; }
  .ft-my-stats b{ font-size:14px; }
  .ft-search{ max-width:none; }
  .ft-steps li{ font-size:9px; }
  .ft-size-wrap{ flex-direction:column; gap:0; }
  .ft-size-wrap .ft-size{ margin-bottom:12px; }
  .ft-size-wrap .ft-size:last-child{ margin-bottom:0; }
}

/* touch devices: hover image (second cut) is not shown */
@media (hover:none){
  .ft-card__pic:hover .ft-card__alt{ opacity:0; }
}
