:root{
    /* 시안 색상 */
    --primary:#FF5E00;          /* orange/50 Blaze Orange */
    --primary-dark:#E24E00;     /* hover (파생) */
    --primary-soft:rgba(255,94,0,0.12); /* link hover 배경 (파생) */
    --topbar-bg:#E34933;        /* red/55 Cinnabar */
    --text:#2C2C2C;             /* Mine Shaft */
    --white:#FFFFFF;

    --container:1620px;         /* 시안 콘텐츠 폭 (1920 - 좌우 150) */
    --gutter:clamp(16px,5vw,150px);  /* 유동 좌우 여백 (모바일 16 → PC 150) */
    --font:'Pretendard Variable','Pretendard',-apple-system,BlinkMacSystemFont,system-ui,Roboto,sans-serif;

    /* 마이페이지(제이잉글리쉬 이식) 호환 변수 — layouts.site 전환 시 필요.
       원본값: 구 layouts/app.blade 인라인 :root (--line/--text-2/--bg-2/--t-fast) */
    --primary-color:#FF5E00;    /* = --primary */
    --border-color:#e5e7eb;
    --text-secondary:#4b5563;
    --text-muted:#9ca3af;       /* = 구 --text-3 */
    --text-primary:#2C2C2C;     /* = site --text */
    --bg-secondary:#f7f8fa;
    --shadow-sm:0 1px 2px rgba(15,17,23,0.05);
    --transition-fast:0.15s ease;
}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
body{font-family:var(--font);color:var(--text);background:var(--white);-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{text-decoration:none;color:inherit}
img{display:block;max-width:100%}

/* 1920 고정 콘텐츠 컨테이너 (좌우 150 여백) */
.container{max-width:1920px;margin:0 auto;padding:0 150px}

/* ===== 상단 알림바 (시안 50:4) ===== */
.topbar{background:var(--topbar-bg);height:clamp(32px,4vw,43px);display:flex;align-items:center;justify-content:center;padding:0}
.topbar a{font-size:clamp(13px,1.5vw,16px);font-weight:400;line-height:1.2;color:var(--white);white-space:nowrap}

/* ===== 헤더 (시안 50:52) ===== */
.header-main{height:clamp(64px,8vw,100px);background:var(--white)}
.header-inner{height:clamp(64px,8vw,100px);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 var(--gutter)}   /* .container 150 고정 → 유동 gutter */
.brand{justify-self:start;display:inline-flex;align-items:center;line-height:0}
.brand img{width:clamp(132px,12vw,216px);height:auto}
.nav{justify-self:center;display:flex;align-items:center;gap:clamp(16px,4vw,50px)}
.nav a{font-size:clamp(14px,1.6vw,18px);font-weight:700;line-height:1.5;color:var(--text);transition:color .15s ease;white-space:nowrap}
.nav a:hover{color:var(--primary)}
.header-actions{justify-self:end;display:flex;align-items:center;gap:clamp(6px,1vw,8px)}
.header-actions .link{font-size:clamp(13px,1.4vw,14px);font-weight:500;line-height:20px;color:var(--primary);padding:6px clamp(8px,1.2vw,12px);border-radius:8px;transition:background .15s ease;white-space:nowrap}
.header-actions .link:hover{background:var(--primary-soft)}
.header-actions .pill{display:inline-flex;align-items:center;justify-content:center;height:clamp(28px,3.5vw,32px);padding:0 clamp(10px,1.3vw,12px);border-radius:8px;background:var(--primary);color:var(--white);font-size:clamp(13px,1.4vw,14px);font-weight:500;line-height:20px;transition:background .15s ease;white-space:nowrap}
.header-actions .pill:hover{background:var(--primary-dark)}
/* @auth 로그아웃: form 래퍼가 flex 레이아웃 안 깨게 + <button>을 링크처럼 리셋 */
.header-actions form,.m-actions form,.md-auth form{display:contents}
.header-actions button.link{background:none;border:0;cursor:pointer;font-family:inherit}
.m-actions form button{font-size:14px;font-weight:500;line-height:20px;color:#FF5E00;padding:4px 8px;border-radius:8px;background:none;border:0;cursor:pointer;font-family:inherit}
.md-auth button.md-login{width:100%;border:0;cursor:pointer;font-family:inherit}

/* ===== 히어로 (시안 75:3, 풀블리드 1920×608) ===== */
.hero{width:100%;position:relative}
.hero img{width:100%;height:auto;display:block}
/* 히어로 "지금 시작하기" 버튼 핫스팟 (이미지 안 버튼 위에 투명 <a> 겹침, %라 스케일 무관) */
.hero-cta{position:absolute;left:11.17%;top:74.39%;width:15.77%;height:12.38%;display:block;cursor:pointer}
/* 디버깅용 위치 확인: background:rgba(255,0,0,.3) */

/* ===== 통계 (시안 50:78) ===== */
.stats{background:#fff;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:clamp(24px,4vw,50px);padding:clamp(40px,7vw,110px) var(--gutter)}
.stat-item{display:flex;flex-direction:column;align-items:center;gap:3px}
.stat-label{display:flex;align-items:center;gap:clamp(5px,0.8vw,10px)}
.stat-label img{width:clamp(20px,2vw,24px);height:clamp(20px,2vw,24px);display:block}
.stat-label span{font-size:clamp(14px,1.6vw,18px);font-weight:600;line-height:1.5;letter-spacing:-0.5px;white-space:nowrap}
.stat-item.item1 .stat-label span{color:#FE6400}
.stat-item.item2 .stat-label span,.stat-item.item3 .stat-label span{color:#FF5E00}
.stat-value{display:flex;align-items:center;padding-right:2px}
.stat-num{font-size:clamp(18px,5vw,60px);font-weight:600;line-height:1.5;letter-spacing:-0.6px;color:#2C2C2C}
.stat-plus{font-size:clamp(12px,2.6vw,32px);font-weight:700;line-height:1.5;letter-spacing:-0.5px;color:#2C2C2C}
/* 오도미터 카운트업 (자릿수 롤링) */
.odo{display:inline-flex;align-items:baseline;font-variant-numeric:tabular-nums}
.odo-digit{display:inline-block;overflow:hidden;height:1em;line-height:1;vertical-align:bottom;width:1ch}
.odo-strip{display:flex;flex-direction:column;will-change:transform;transition:none}
.odo-strip>span{height:1em;line-height:1;display:block;text-align:center}
.odo-sep{display:inline-block}

/* ===== 성과 테이블 이미지 (시안 50:118) ===== */
.results{padding:clamp(24px,4vw,48px) var(--gutter) clamp(35px,10vw,140px);display:flex;justify-content:center;background:#fff}
.results img,.results video{width:min(100%,712px);height:auto;margin:0 auto;border-radius:clamp(16px,3vw,31px);display:block}   /* picture/video 래퍼가 풀폭이라 margin auto로 가운데 */

/* ===== 문구 섹션 (시안 50:119) ===== */
.graph-text{background:#fff;padding:clamp(50px,8vw,100px) var(--gutter);display:flex;flex-direction:column;align-items:center}
.graph-text-content{width:100%;max-width:var(--container);display:flex;flex-direction:column;align-items:center;gap:clamp(18px,2.5vw,32px)}
.graph-title{font-size:clamp(17px,4vw,50px);font-weight:700;line-height:1.5;letter-spacing:-0.5px;color:#2C2C2C;text-align:center;margin:0}
.graph-title .hl{color:#FE6400}
.graph-desc{font-size:clamp(12px,1.9vw,24px);font-weight:400;line-height:1.5;letter-spacing:-0.5px;color:#505050;text-align:center;margin:0}
.graph-desc .hl{color:#FF5E00}

/* ===== 검색 트렌드 그래프 (시안 50:125) ===== */
.trend{background:#FF5E00;padding:clamp(44px,6vw,78px) var(--gutter) 40px;display:flex;justify-content:center}
.trend img{width:min(100%,1276px);height:auto;margin:0 auto;display:block}   /* picture 래퍼 풀폭 → margin auto 가운데 */

/* ===== 비교 섹션 (시안 61:4 비교표 최종) ===== */
.comparison{background:#fff;padding-top:clamp(40px,7vw,96px)}
.comparison img{width:100%;height:auto;display:block}

/* ===== 정규과정 카드 (시안 55:75) ===== */
.regular{background:#fff;margin-top:clamp(0px,3vw,45px);padding:clamp(22px,6vw,80px) var(--gutter) 40px;display:flex;justify-content:center}
/* 단일 카드 유동: 최대 432, 좁아지면 콘텐츠 폭에 맞춰 축소 (빈 카드 트릭 제거) */
.regular-inner{display:flex;justify-content:center;width:100%;max-width:432px}
.course-card{width:100%;background:#fff;border-radius:16px;overflow:hidden;display:flex;flex-direction:column}
.course-label{padding:16px 20px 0;font-size:20px;font-weight:700;line-height:30px;color:#000}
.course-thumb{margin:12px 20px 0;aspect-ratio:392/293;border-radius:16px;overflow:hidden}   /* 고정 height → 비율 유지(유동) */
.course-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.course-body{padding:20px;display:flex;flex-direction:column;gap:12px}
.course-title{font-size:16px;font-weight:700;line-height:24px;color:#000}
.course-list{display:flex;flex-direction:column;gap:4px;padding-bottom:8px;list-style:none}
.course-list li{display:flex;gap:5.4px;font-size:14px;font-weight:400;line-height:21px;color:#444241}
.course-list li::before{content:"·";color:#BEBDBB}
.course-btn{background:#000;border-radius:24px;padding:10px 16px;text-align:center;color:#fff;font-size:14px;font-weight:700;line-height:20px}

/* ===== 후기 섹션 (시안 55:97) ===== */
.reviews{background:#F8F7F7;margin-top:clamp(0px,6vw,107px);padding:clamp(36px,5vw,64px) 0;display:flex;flex-direction:column;gap:clamp(16px,3vw,42px)}
.reviews-title{text-align:center;font-size:clamp(20px,3.2vw,32px);font-weight:700;line-height:1.5;color:#000;padding:0 var(--gutter)}
/* 후기 무한 가로 롤링(마퀴): rv-wrap(overflow) > rv-track(flex, 14카드=7×2), padding-right=gap 로 -50% 이음매 정확 */
.rv-wrap{overflow:hidden;padding-top:16px}
.rv-track{display:flex;gap:16px;width:max-content;padding-right:16px;animation:rvScroll 40s linear infinite;will-change:transform}
@keyframes rvScroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.rv-wrap:hover .rv-track{animation-play-state:paused}
@media (prefers-reduced-motion:reduce){.rv-track{animation:none}.rv-wrap{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch}}
.review-card{width:clamp(220px,62vw,260px);flex:none;background:#fff;border-radius:24px;box-shadow:0 1px 3px rgba(0,0,0,0.1),0 1px 2px -1px rgba(0,0,0,0.1);padding:24px;display:flex;flex-direction:column;gap:12px}
.review-card .r-title{font-size:16px;font-weight:700;line-height:24px;color:#000;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.review-card .r-body{font-size:14px;font-weight:400;line-height:21px;color:#444241}
.review-card .r-foot{display:flex;flex-direction:column;gap:4px;padding-top:12px}
.review-card .r-handle{font-size:14px;font-weight:400;line-height:21px;color:#787573}
.review-card .r-rate{display:flex;align-items:center;gap:4px}
.review-card .r-rate img{width:16px;height:16px;display:block}
.review-card .r-rate span{font-size:14px;font-weight:400;line-height:21px;color:#000}

/* ===== 푸터 (시안 55:233 / 수강신청 56:4824 — 동일) ===== */
.footer{background:#F8F8F8;padding:clamp(24px,4vw,40px) var(--gutter) clamp(40px,5vw,62px)}
.footer-inner{display:flex;flex-direction:column;gap:clamp(24px,4vw,58px)}
.footer-menu{display:flex;flex-wrap:wrap;align-items:center;gap:clamp(20px,4vw,66px)}
.footer-logo{height:clamp(27px,4vw,46.864px);width:auto;display:block}
.footer-menu-links{display:flex;align-items:center;gap:clamp(20px,3vw,50px)}
.footer-menu-links a{font-size:clamp(12px,1.3vw,16px);font-weight:400;line-height:1.5;color:#666}
.footer-menu-links a:hover{color:#2C2C2C}
.footer-intro{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:clamp(24px,4vw,40px)}
.footer-biz{display:flex;flex-direction:column}
.footer-biz-row{display:flex;flex-wrap:wrap;align-items:center;gap:clamp(6px,2vw,28px);margin-bottom:clamp(6px,1vw,10px)}
.footer-biz-row span{font-size:clamp(12px,1.1vw,14px);font-weight:400;line-height:1.5;color:#666}
.footer-biz-row .name{color:#2C2C2C}
.footer-copyright{font-size:clamp(12px,1.3vw,16px);font-weight:400;line-height:1.5;color:#666;margin:0}
.footer-social{display:flex;align-items:center;gap:8px}
.footer-social a{width:clamp(30px,3.5vw,40px);height:clamp(30px,3.5vw,40px);border-radius:50%;background:#ECECEC;display:flex;align-items:center;justify-content:center}
.footer-social img{width:clamp(15px,1.6vw,18px);height:auto;display:block}

/* ===== 수강신청 상품 블록 (시안 56:2657) ===== */
.apply-product{display:flex;justify-content:center;gap:clamp(24px,6vw,116px);padding:14px var(--gutter) 0;background:#fff}   /* 2단 유동, 좌우 gutter (767↓ 세로 스택은 스위치 유지) */
.ap-thumb{flex:558 1 0;min-width:0;max-width:558px}   /* 558 고정 → 비율 유동(558:476) */
.ap-thumb img{width:100%;height:auto;display:block}
.ap-form{flex:476 1 0;min-width:0;max-width:476px}
.ap-title{font-size:clamp(20.8px,1.7vw,22px);font-weight:400;line-height:clamp(30.31px,3vw,39.6px);color:#111}   /* 20.8↔22 */
.ap-best{display:inline-block;margin-top:8.59px;border:1px solid #CCC;background:#fff;padding:3px 11px;font-family:Arial,sans-serif;font-size:11px;line-height:19.8px;color:#FB4637}
.ap-price-row{display:flex;align-items:center;gap:10px;margin-top:6.59px}
.ap-price{font-size:clamp(19.2px,1.5vw,20px);font-weight:400;line-height:clamp(19.2px,1.5vw,20px);color:#FF5E00}   /* 19.2↔20 */
.ap-deadline{width:125px;height:27px;display:block}
/* 뱃지2(선착순 마감임박) 이미지(badge-deadline.png) 텍스트 재현 — 실측: 125x27, 배경 #FF5E00, 흰글자, 좌우패딩 14px, radius 3.5px, font 15px */
.ap-deadline-badge{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;height:27px;padding:0 14px;border-radius:3.5px;background:#FF5E00;color:#fff;font-size:15.5px;font-weight:600;line-height:1;white-space:nowrap;letter-spacing:0}
.ap-share{width:21px;height:20px;display:none;margin-left:auto}
.ap-desc{margin-top:clamp(23px,3.3vw,47px);font-size:16px;font-weight:400;line-height:28.8px;color:#000}   /* mt 23↔47 */
.ap-hr{border:0;border-top:1px solid #DDD;margin:22px 0 0}
.ap-benefit{margin-top:20px;font-size:16px;font-weight:400;line-height:28.8px;color:#000}
.ap-benefit .b-title{font-weight:700}
.ap-opt{margin-top:clamp(34px,3vw,40px)}   /* 34↔40 */
.ap-opt-label{font-size:13.6px;font-weight:600;color:#111;margin-bottom:8px}
.ap-select{position:relative;border:1px solid #DDD;padding:9.64px 28.36px 9.64px 11.8px;font-size:14.4px;line-height:20.57px;color:#111}
.ap-select .chev{position:absolute;right:12px;top:50%;transform:translateY(-50%);width:14px;height:14px}
/* 네이티브 select를 시안 ap-select 룩으로 (chevron은 배경으로) */
select.ap-select{-webkit-appearance:none;appearance:none;width:100%;background:#fff url("../images/olinone/icon-chevron.svg") no-repeat right 12px center;background-size:14px 14px;border-radius:0;cursor:pointer;font-family:inherit}
.ap-buy{margin-top:40px;display:block;width:100%;border:0;background:#FF5E00;opacity:0.65;border-radius:30px;padding:12px 0;text-align:center;color:#fff;font-size:14px;line-height:20px;font-family:inherit;cursor:pointer}
.ap-buy.enabled{opacity:1}

/* ===== 포토 구매평 (시안 65:324) ===== */
.photo-reviews{background:#fff;display:flex;justify-content:center;margin-top:clamp(74px,7vw,77px);padding:0 var(--gutter)}   /* gutter로 1150 넘침 방지, 1920서 시안 여백 재현 */
.pr-inner{width:100%;max-width:1150px;border:1px solid rgba(0,0,0,0.1);padding:67px 1px 32px;display:flex;flex-direction:column;align-items:center;gap:15px}   /* 1150 고정 → max-width */
.pr-head{width:100%;padding:0 30px;display:flex;align-items:flex-start;justify-content:space-between}   /* 1088 고정 → 100%+좌우30(카드 텍스트 inset과 정렬) */
.pr-title{font-size:clamp(13px,1.2vw,15px);font-weight:400;line-height:1.8;color:#111}   /* 13↔15 */
.pr-nav{display:flex;align-items:center}
.pr-more{padding:0 12px;font-size:13px;font-weight:400;line-height:23.4px;color:#111}
.pr-arrows{display:flex;min-width:70px;padding:2.75px 0 2.05px}
.pr-arrow{width:37px;padding:6px 1px;border:1px solid rgba(0,0,0,0.1);background:#fff;display:flex;align-items:center;justify-content:center}
.pr-arrow.prev{margin-right:-1px}
.pr-arrow img{width:6.86px;height:12px;display:block}
.pr-swiper{width:100%;overflow:hidden}
.pr-grid{display:grid;grid-template-columns:1fr 1fr}   /* 고정 height 300 해제 → 카드 내용 높이(유동) */
.pr-card{padding:15px 30px;display:flex;flex-direction:column;justify-content:center}   /* 고정 height 150 해제 */
.pr-card-a{height:120px;display:flex;align-items:flex-start;justify-content:space-between}
.pr-text{flex:1;min-width:0;display:flex;flex-direction:column}   /* 370 고정 → flex(카드 폭 따라 유동, 사진 120 우측 고정) */
.pr-stars{display:flex;gap:2px;padding-top:0.7px;padding-bottom:12px}
.pr-stars img{width:12px;height:12px;display:block}
.pr-body{font-size:13px;font-weight:400;line-height:23.4px;color:#111;word-break:break-word;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4}
.pr-photo{width:120px;height:120px;flex:none;overflow:hidden}
.pr-photo img{width:120px;height:120px;object-fit:cover;display:block}

/* ===== 상세 탭 내비게이션 (시안 56:2869) ===== */
.detail-tabs{background:#fff;margin-top:clamp(20px,4vw,75px);display:flex;justify-content:center;padding:0 var(--gutter)}   /* mt 20↔75, gutter로 넘침 방지 */
.dt-nav{width:100%;max-width:1150px;display:flex;justify-content:center;padding:0 15px;list-style:none}   /* 1150 고정 → max-width */
.dt-tab{flex:1 0 0;min-width:0;border-top:3px solid #111;border-right:1px solid #111;border-bottom:1px solid #111;padding:3px 1px 1px 0}
.dt-tab.active{border-left:1px solid #111;padding-left:1px}
.dt-tab a{display:flex;align-items:center;justify-content:center;font-size:14.4px;font-weight:400;line-height:42px;color:#111;text-align:center;white-space:nowrap}
.dt-tab.active a{background:rgba(17,17,17,0.03)}
.dt-badge{width:35px;height:21px;min-width:15px;min-height:15px;border-radius:10px;margin-right:-27px}

/* ===== 성과 표 이미지 (시안 65:512, 712×505 중앙) ===== */
.apply-results{background:#fff;display:flex;justify-content:center;padding:0 var(--gutter)}
.apply-results img{width:100%;max-width:712px;height:auto;display:block}   /* 상세이미지 공통: 컨테이너 max-width + img 100% */

/* ===== 상세 콘텐츠 통이미지 스택 (시안 56:2884) ===== */
.detail-body{background:#fff;display:flex;justify-content:center;padding:87px var(--gutter) 158px}
.db-inner{width:100%;max-width:1000px;margin:0 auto;display:flex;flex-direction:column;align-items:center}   /* 컨테이너 max-width + 가운데 */
.db-cta{width:100%;max-width:691px;height:auto;display:block}   /* CTA는 691 상한 */
.db-btn{display:block;width:100%}
.db-btn img{width:100%;height:auto;display:block}
.db-img{width:100%;height:auto;display:block}   /* 상세이미지 공통: width:100%/height:auto */
.db-divider{width:100%;height:223px;background:#fff;display:flex;align-items:center;justify-content:center}
.db-divider::before{content:"";width:min(100%,984px);border-top:1px solid #DDDDDD}

/* ===== 칼럼 히어로 타이틀 (시안 12:611) ===== */
.col-hero{background:#F8F7F7;display:flex;flex-direction:column;align-items:center;padding:clamp(30px,6vw,88px) var(--gutter)}   /* 고정 height 325·padding-top 88 → 유동 세로 padding */
.ch-inner{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center}
.ch-title{margin:0;font-weight:700;font-size:clamp(20px,1.8vw,24px);line-height:1.5;color:#000;white-space:nowrap}   /* 20(모바일)↔24(PC) */
.ch-title .hl{color:#FF5E00}
.ch-sub{margin:0;font-weight:700;font-size:clamp(20px,1.8vw,24px);line-height:1.8;color:#000;white-space:nowrap}
.ch-sub .hl{color:#FF5E00}

/* ===== 칼럼 3개 카드 (시안 11:442) ===== */
.col-cards{background:#fff;margin-top:clamp(72px,7vw,75px);padding:0 clamp(19px,2vw,25px)}   /* 고정 padding-left:455 제거 → 좌우 gutter(19↔25) */
.cc-row{width:100%;max-width:1440px;margin:0 auto;display:flex;justify-content:center;gap:clamp(24px,4vw,60px);padding:clamp(30px,5vw,60px) 0 clamp(31px,5vw,61px);border-bottom:1px solid #E6E6E6}   /* 1440 가운데 정렬, 카드 440×3·gap60(시안) */
.cc-item{flex:1 0 0;min-width:0;max-width:440px;min-height:275.63px;display:flex;flex-direction:column;align-items:center;text-align:center}   /* 카드 최대 440(시안), 내용 가운데정렬 → 칼럼2 화면 정중앙 */
.cc-icon{width:clamp(30px,3.2vw,60px);height:clamp(30px,3.2vw,60px)}   /* 30↔60 */
.cc-icon img{width:100%;height:100%;display:block}
.cc-title{margin:0;padding-top:clamp(20px,3vw,30px);font-weight:700;font-size:clamp(18px,1.6vw,24px);line-height:1.5;color:#2C2C2C}
.cc-desc{margin:0;padding-top:clamp(9px,1.5vw,19px);font-weight:400;font-size:clamp(14px,1.4vw,18px);line-height:1.8;color:#505050}

/* ===== FAQ 본문 (시안 13:960) ===== */
.faq-main{background:#fff;display:flex;justify-content:center;padding:clamp(40px,5vw,41px) clamp(15px,3vw,40px) clamp(86.5px,9vw,102.5px)}   /* 좌우: 모바일15↔여백40(1536 넘으면 wrap 가운데) */
.faq-wrap{width:100%;max-width:1536px;display:flex;flex-direction:column;gap:24px}   /* 1536 고정 → max-width(넘침 해결) */
.faq-title{margin:0;font-weight:700;font-size:30px;line-height:36px;color:#181716}
/* 카드 (시안 13:981) */
.faq-card{background:#fff;border:1px solid #E1E1E0;border-radius:16px;box-shadow:0 1px 3px rgba(0,0,0,0.1),0 1px 2px -1px rgba(0,0,0,0.1);padding:25px 1px;display:flex;flex-direction:column;gap:24px}
.fc-head{padding:0 24px;display:flex;flex-direction:column;gap:8px}
.fc-head-title{font-weight:600;font-size:16px;line-height:16px;color:#181716}
.fc-head-sub{font-weight:400;font-size:14px;line-height:20px;color:#444241}
.fc-body{padding:0 24px;display:flex;flex-direction:column;gap:16px}
/* 테이블 (시안 13:989) — 1390px 좌측정렬 */
.faq-table{width:100%;max-width:1390px;border-collapse:collapse;table-layout:fixed}   /* 1390 고정 → max-width(시안 좌측정렬·우측 여백 유지, 좁으면 축소) */
.faq-table th,.faq-table td{font-size:14px;line-height:20px;color:#181716;text-align:left;vertical-align:middle}
.faq-table th{font-weight:500;padding:9.75px 8px 10.25px}
.faq-table thead tr{border-bottom:1px solid #E1E1E0}
.faq-table tbody tr{border-bottom:1px solid #E1E1E0}
.faq-table tbody tr.last{border-bottom:0}
.faq-table .c-no{width:clamp(40px,5vw,64px);white-space:nowrap;font-weight:400;padding:9.5px 8px}   /* 64↔40, 번호 한 줄 */
.faq-table td.c-subject{font-weight:500;padding:9.5px 8px}
.faq-table th.c-subject{font-weight:500}
.faq-table .c-date{width:136px;font-weight:400}
.faq-table td.c-date{padding:9.5px 8px 9.5px 16px}
.faq-table th.c-date{padding-left:8px}
/* 페이지네이션 (시안 13:1100) */
.fc-pager{display:flex;align-items:center;justify-content:center;gap:8px}
.fc-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:32px;padding:1px 11px;border:1px solid #E1E1E0;border-radius:8px;background:#fff;box-shadow:0 1px 1px rgba(0,0,0,0.05);font-weight:500;font-size:14px;line-height:20px;color:#181716;cursor:pointer;text-decoration:none}
.fc-btn:disabled{opacity:0.5;cursor:default}   /* 첫/마지막 페이지에서 비활성 버튼만 흐리게 */
.fc-btn img{width:16px;height:16px;display:block}
.fc-page{font-weight:400;font-size:14px;line-height:20px;color:#444241}
/* FAQ 아코디언 (클릭 동작만 추가 — 닫힘 상태는 기존 테이블과 동일하게 보임) */
.faq-table tbody tr.faq-item{border-bottom:0}                              /* 질문행↔답변행 사이 선 제거 */
.faq-table td.c-subject{padding:0}                                        /* 버튼이 셀 패딩을 대체(시각 동일) */
.faq-q{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;margin:0;padding:9.5px 8px;border:0;background:none;font-family:inherit;font-weight:500;font-size:14px;line-height:20px;color:#181716;text-align:left;cursor:pointer}
.faq-q-text{flex:1 1 auto}
.faq-arrow{flex:none;width:16px;height:16px;color:#8A8A87;transition:transform .3s ease}
.faq-item.open .faq-arrow{transform:rotate(180deg)}
.faq-a-cell{padding:0;border:0}
.faq-a{box-sizing:border-box;display:block;max-height:0;overflow:hidden;padding:0 32px 0 calc(clamp(40px,5vw,64px) + 8px);color:#444241;font-weight:400;font-size:14px;line-height:22px;transition:max-height .3s ease}   /* 왼쪽 padding = 번호열 너비 + 8px → 질문 텍스트와 세로 정렬 / 오른쪽 32px = 화살표(16)+여백 → 답변이 화살표 아래로 안 파고듦 */
.faq-item.open + .faq-a-row .faq-a{padding-top:2px;padding-bottom:16px}   /* 열림 max-height는 site.js가 실제 콘텐츠 높이로 지정(오버슈트 방지) */
.faq-table tbody tr:last-child{border-bottom:0}                           /* 마지막 답변행 하단선 제거 */

/* ===== 로그인 (시안 27:87) ===== */
.lg-main{background:#fff;display:flex;justify-content:center;padding:clamp(59px,8vw,134px) 15px clamp(141px,10vw,174px)}   /* 세로 상59↔134·하141↔174, 좌우15(카드 가운데) */
/* 카드 (시안 27:49) — 480px, py-32, radius 10, shadow */
.lg-card{width:100%;max-width:480px;background:#fff;border-radius:10px;box-shadow:0 5px 10px rgba(0,0,0,0.08),0 4px 6px -1px rgba(0,0,0,0.1),0 2px 4px -2px rgba(0,0,0,0.1);padding:32px 0;display:flex;flex-direction:column}   /* 480 고정 → max-width(모바일 100%=345) */
/* 로고 (시안 27:51) — 127px, pt-20 pb-36 */
.lg-head{height:127px;display:flex;align-items:center;justify-content:center;padding:20px 0 36px}
.lg-head img{display:block;width:261px;height:60px}
/* 본문 px-32, gap-16 (시안 27:56) */
.lg-body{padding:0 32px;display:flex;flex-direction:column;gap:16px}
/* 카카오 버튼 (시안 27:57) — yellow/50 #FEE500 */
.lg-kakao{width:100%;height:48px;display:flex;align-items:center;justify-content:center;gap:8px;padding:0 24px;background:#FEE500;border:0;border-radius:4px;cursor:pointer}
.lg-kakao img{display:block;width:20px;height:18px}
.lg-kakao span{font-weight:700;font-size:16px;line-height:24px;letter-spacing:-0.16px;color:#000}
/* 구분선 (시안 27:66) — grey/90 #E5E5E5 */
.lg-divider{height:1px;background:#E5E5E5}
/* 입력창 (시안 27:67~73) — gap-8, border grey/90, h-44, px-13 py-14 */
.lg-fields{display:flex;flex-direction:column;gap:8px}
.lg-input{width:100%;height:44px;padding:14px 13px;border:1px solid #E5E5E5;border-radius:4px;background:#fff;font-family:var(--font);font-weight:400;font-size:14px;line-height:normal;letter-spacing:-0.16px;color:#181716;box-sizing:border-box}
.lg-input::placeholder{color:#737373}
.lg-input:focus{outline:none;border-color:var(--primary)}
/* Breeze 폼 연결: form 래퍼가 레이아웃 박스 만들지 않도록(디자인 픽셀 유지) */
.lg-card form{display:contents}
/* 로그인 검증 에러(실패 시에만 표시) */
.lg-error{margin:0;color:#DC2626;font-weight:400;font-size:13px;line-height:1.45;letter-spacing:-0.16px}
/* 하단 (시안 27:74) — pt-12, px-32 */
.lg-foot{padding:12px 32px 0;display:flex;flex-direction:column;align-items:center}
/* 로그인 버튼 (시안 27:75) — orange/50 #FF5E00, text grey/98 #FAFAFA */
.lg-submit{width:100%;height:48px;display:flex;align-items:center;justify-content:center;padding:0 24px;background:var(--primary);border:0;border-radius:4px;cursor:pointer;font-weight:700;font-size:16px;line-height:24px;letter-spacing:-0.16px;color:#FAFAFA}
/* 하단 링크 (시안 27:77) — gap-8, pt-16, azure/35 #45556C */
.lg-links{display:flex;align-items:center;justify-content:center;gap:8px;padding-top:16px}
.lg-links a{font-weight:400;font-size:14px;line-height:20px;letter-spacing:-0.16px;color:#45556C}
.lg-links a.lg-signup{font-weight:500}
.lg-sep{width:1px;height:12px;background:#E5E5E5}

/* ===== 간편가입 (시안 18:723) ===== */
.su-main{background:#fff;display:flex;justify-content:center;padding:clamp(103px,9vw,110px) 19px 110px}   /* 상 103↔110, 좌우19, 하110 */
.su-col{width:100%;max-width:490px;display:flex;flex-direction:column}   /* 490 고정 → max-width(모바일 100%=337) */
/* 타이틀 (시안 19:142) */
.su-heading{margin:0;font-weight:700;font-size:clamp(22px,2.6vw,36px);line-height:1.5;color:#2C2C2C;text-align:center}   /* 22↔36 */
/* 입력 필드 (시안 19:148) — 필드 간 60px, 첫 필드 100px */
.su-field{position:relative;margin-top:clamp(40px,4vw,60px)}   /* 40↔60 */
.su-field.su-first{margin-top:clamp(44px,7vw,100px)}   /* 44↔100 */
/* 라벨 + 필수 점 (시안 19:149) */
.su-title{display:flex;align-items:flex-start;min-height:clamp(21px,1.8vw,25.5px)}
.su-label{font-weight:700;font-size:clamp(14px,1.2vw,17px);line-height:1.5;color:#2C2C2C}   /* 14↔17 */
.su-req{width:5px;height:5px;border-radius:50%;background:#FE6F0F;flex-shrink:0}
/* 입력창 (시안 19:153) — 하단 2px 라인 */
.su-inputbox{padding:clamp(10px,1.1vw,15px) 0 2px;border-bottom:2px solid #E6E6E6}   /* pt 10↔15 */
.su-input{width:100%;border:0;background:transparent;outline:none;padding:2px 0 clamp(7px,1.2vw,15.5px);font-family:var(--font);font-weight:400;font-size:clamp(14px,1.2vw,17px);line-height:normal;color:#2C2C2C}   /* pb 7↔15.5, font 14↔17 */
.su-input::placeholder{color:#808080}
/* 인증 버튼 (시안 63:284) — 우측 오버레이 */
.su-verify{position:absolute;right:0;top:clamp(21px,2.4vw,34px);height:clamp(38px,3vw,44px);padding:1px 15px;background:#fff;border:1px solid var(--primary);border-radius:4px;color:var(--primary);font-weight:600;font-size:13px;line-height:19.5px;letter-spacing:-0.16px;white-space:nowrap;cursor:pointer}   /* 우측 오버레이 구조 유지, top 21↔34·h 38↔44 */
/* 약관 체크박스 (시안 19:218) */
.su-checks{display:flex;flex-direction:column}
.su-check{position:relative;display:flex;align-items:center;gap:8px}
.su-check:first-child{margin-top:50px}
.su-check + .su-check{margin-top:clamp(8px,1.7vw,24px)}   /* 8↔24 */
.su-check .su-box{width:24px;height:24px;display:block;flex-shrink:0}
.su-check .su-check-label{font-weight:400;font-size:14px;line-height:21px;color:#505050}
.su-check .su-arrow{position:absolute;right:0;top:3px;width:18px;height:18px;display:block}
/* 가입 버튼 (시안 19:145) */
.su-submit{width:100%;margin-top:40px;padding:clamp(14px,1.1vw,16px) 10px;background:var(--primary);border:0;border-radius:8px;color:#fff;font-weight:700;font-size:clamp(14px,1.2vw,17px);line-height:1.5;text-align:center;cursor:pointer}   /* pad 14↔16, font 14↔17 */
/* ===== register 폼 배선 (정적 디자인 유지: form 래퍼 픽셀유지 + 검증 메시지 + 체크박스 상태) ===== */
.su-col form{display:contents}
.su-error{color:#DC2626;font-size:13px;line-height:1.45;margin-top:8px}
.su-msg{font-size:13px;line-height:1.45;margin-top:8px;min-height:1px;color:#505050}
/* 실제 checkbox는 숨김(position:absolute로 flex 흐름 영향 0) — svg 박스·라벨은 그대로 */
.su-check .su-chk{position:absolute;width:1px;height:1px;opacity:0;margin:0;pointer-events:none}
/* checked 시 svg 박스 위에 브랜드 ✓ 오버레이 (미체크 시 hidden → 시안 디자인 100% 동일) */
.su-check .su-check-mark{position:absolute;left:0;top:50%;transform:translateY(-50%);width:24px;height:24px;display:none;align-items:center;justify-content:center;color:var(--primary);font-size:15px;font-weight:800;line-height:1;pointer-events:none}
.su-check .su-chk:checked ~ .su-check-mark{display:flex}

/* ===== 모바일 전용 요소 기본값 (데스크톱에서는 숨김) ===== */
.m-header{display:none}
.m-drawer{display:none}

/* ===== 모바일 375 반응형 (시안 79:2) ===== */
@media (max-width:767.98px){
    /* --- 상단 알림바: 유동 기본이 커버 / 헤더: 단일 스위치(≤899.98)로 이동 → 삭제 --- */

    /* --- 푸터: 유동 기본(flex-wrap + clamp)이 전 구간 커버 → 모바일 override 삭제 --- */

    /* --- 히어로 (시안 85:63) — 통이미지 100% --- */
    .hero img{width:100%}
    .hero-cta{left:0;top:91.26%;width:100%;height:8.74%}   /* 모바일: 하단 풀폭 바 */

    /* --- 통계 — 모바일 세로 스택 스위치만 (폰트·간격은 유동 clamp가 커버) --- */
    .stats{flex-direction:column}

    /* --- 성과표·문구·트렌드·비교: 유동 기본이 전 구간 커버 → 모바일 override 삭제 --- */

    /* --- 정규과정·후기: 유동 기본이 전 구간 커버 → 모바일 override 삭제 --- */

    /* ================= 수강신청(apply) 본문 — 모바일 375 ================= */
    /* --- ① 상품 블록 (시안 88:2098) — 2단 → 세로 1단 (크기·여백은 기본 clamp이 375 커버) --- */
    .apply-product{flex-direction:column;gap:0;padding:30px 15px 0;max-width:600px;margin:0 auto}   /* 세로 스택: 600 상한+가운데 (좌우 여백 균등) */
    .ap-thumb{flex:none;width:100%;max-width:none}   /* 세로 스택: flex·max-width 리셋(600 컨테이너 꽉 채움) */
    .ap-form{flex:none;width:100%;max-width:none;margin-top:41px}
    .ap-best{margin-top:8.44px;padding:2.5px 11px;line-height:16px}   /* BEST 태그 미세값 유지 */
    .ap-share{display:none}
    .ap-benefit{margin-top:32px;font-weight:700}   /* 여백 역전(32>20)+전체 볼드 → 유지 */

    /* --- ② 포토 구매평 (시안 88:2135) — swiper 가로 스크롤, 카드별 테두리 (크기는 기본이 커버) --- */
    .pr-inner{border:0;padding:0;gap:10px;align-items:stretch}   /* 테두리 제거·풀폭 */
    .pr-head{padding:0}   /* 모바일은 inset 없이 풀폭 */
    .pr-swiper{overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}
    .pr-grid{display:flex;gap:12px}   /* grid → 가로 flex 스와이프 */
    .pr-card{flex:0 0 100%;padding:21px;border:1px solid rgba(0,0,0,0.1);scroll-snap-align:start}   /* 카드별 테두리, 1장씩 */
    .pr-card-a{height:110px}
    .pr-photo{width:110px;height:110px}
    .pr-photo img{width:110px;height:110px}

    /* --- ③ 상세 탭 (시안 88:2190) — 3등분, 상단 1px, active 배경 틴트 (mt·좌우는 기본이 커버) --- */
    .dt-nav{padding:0}   /* 모바일은 inset 없이 풀폭 */
    .dt-tab{border-top-width:1px;padding:0}   /* 상단 3px → 1px */
    .dt-tab.active{padding-left:0}
    .dt-tab a{line-height:25.92px;padding:12px 8px}   /* 탭 높이: line 42 → line 25.92+padding */
    .dt-badge{display:none}

    /* --- ④ 통계(.stats)는 index 공유 컴포넌트 — 추가 없음 --- */
    /* --- ④·⑤ 성과표~상세 이미지: 컨테이너 max-width + img 100%가 기본에서 커버 → 모바일 전용값만 --- */
    .apply-results img{border-radius:31px}   /* 모바일만 라운드 31 (PC 0) */
    .detail-body{padding:45px 15px 99px}     /* 세로 여백 상45·하99 (구조값, clamp 안 함) */
    .db-btn + .db-img{margin-top:25px}       /* 버튼→다음 이미지 간격 25 */
    .db-divider{height:73px}                  /* 구분선 높이 223→73 */
    /* 모바일 가격표: 가로 스와이프 카드 (시안 89:4147) — PC 통이미지 대체 */
    .db-price-pc{display:none}             /* PC 통이미지 모바일 숨김 */
    .db-price-mobile{display:flex;width:100%;gap:12px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}
    .db-price-card{flex:0 0 280px;scroll-snap-align:start}   /* 카드 280 (시안), 1장+peek */
    .db-price-card img{width:280px;height:auto;display:block}

    /* ================= 칼럼(column) 본문 — 모바일 375 ================= */
    /* --- ① 히어로 (시안 90:5215) — 회색 배너, 가운데 정렬 Bold 20/30 --- */
    .col-hero{margin-top:38px;padding:30px 19px}   /* 상단 여백·좌우19(시안), 배경·height는 기본이 커버 */
    .ch-inner{width:100%;gap:30px}         /* 블록 사이 빈줄(30px) — 리플로우 시 벌어짐(PC 4px과 반대라 스위치 유지) */
    .ch-title{width:100%;color:#2C2C2C;white-space:normal}   /* font-size는 기본 clamp 하한(20)이 커버 */
    .ch-sub{width:100%;line-height:1.5;color:#2C2C2C;white-space:normal}   /* sub만 모바일 줄높이 1.5(시안 30) */
    .br-m{display:inline}                  /* 모바일 전용 줄바꿈 (PC는 hidden) */
    .plain-m{color:#2C2C2C}                /* 시안: 모바일 '넘게'는 주황 아님 (PC는 .hl 주황 상속) */

    /* --- ② 칼럼 3개 카드 (시안 90:5168) — 3열 가로(각 55, gap 53, 안쪽 33), 아이콘 30 --- */
    /* 크기(margin·padding·아이콘·폰트)는 기본 clamp 하한이 375 시안값과 일치 → override 삭제, 구조 차이만 유지 */
    .cc-row{min-height:289px;justify-content:space-between;gap:0;padding:30px 33px 31px}   /* 3열 space-between(시안) */
    .cc-item{flex:0 0 55px;min-height:auto;align-items:flex-start;text-align:left}   /* 55px 고정 3열, 모바일은 시안대로 좌측정렬 유지 */

    /* ================= FAQ(faq) 본문 — 모바일 375 ================= */
    /* ① 컨테이너(faq-main padding·faq-wrap) → 기본 clamp/max-width가 375 시안값 커버, override 삭제 */

    /* --- ② FAQ 테이블 — 크기(폭·c-no)는 기본 clamp/max-width가 커버, 구조 차이만 유지 --- */
    .faq-table{margin-left:-8px}   /* 셀8px패딩 상쇄해 텍스트를 헤더 라인(24)에 정렬(시안 th x=-8.91) */
    .faq-table .c-date{display:none}       /* 작성일 숨김 (시안 모바일 미표시) */

    /* --- ③ 페이지네이션 (시안 90:5675) → 시안=PC 동일, 추가 없음 --- */

    /* ================= 로그인(login) 본문 — 모바일 375 ================= */
    /* 카드 폭·main 여백 → 기본 max-width/clamp가 375 시안값 커버, override 삭제. 카드 내부는 양끝 동일 */

    /* ================= 간편가입(signup) 본문 — 모바일 375 ================= */
    /* 크기·여백 전부 기본 clamp이 375 시안값 커버 → override 삭제. 역전값(첫 체크 간격)만 유지 */
    .su-check:first-child{margin-top:65px}   /* PC 50 < 모바일 65 (역전) → clamp 불가, breakpoint 유지 (생년월일→약관) */

    /* --- 드로어: 단일 헤더 스위치(≤899.98)로 이동 → 삭제 --- */
}

/* ===== 태블릿(768~1080) 전용 블록 제거: 본문 전 섹션 유동화 완료로 불필요 ===== */

/* ===== 헤더 단일 스위치: PC 메뉴 ↔ 햄버거 (≤899.98px) ===== */
@media (max-width:899.98px){
    /* PC 가로메뉴 숨김 → 햄버거 헤더 (로고 유동 clamp) */
    .header-main{display:none}
    .m-header{display:flex;align-items:center;justify-content:space-between;height:57px;padding:0 24px;border-bottom:1px solid #E1E1E0;background:#fff}
    .m-brand{display:inline-flex;align-items:center;line-height:0}
    .m-brand img{width:clamp(132px,17vw,155px);height:auto;display:block}
    .m-actions{display:flex;align-items:center;gap:4px;margin-right:-8px}
    .m-actions a{font-size:14px;font-weight:500;line-height:20px;color:#FF5E00;padding:4px 8px;border-radius:8px}
    .m-actions .m-sep{font-size:14px;font-weight:400;line-height:20px;color:#444241}
    .m-hamburger{width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;margin-left:4px;border:0;background:transparent;border-radius:8px;cursor:pointer}
    .m-hamburger img{width:16px;height:16px;display:block}

    /* 햄버거 드로어 — 전체화면 오버레이 */
    .m-drawer{position:fixed;inset:0;z-index:1000;background:#fff;overflow-y:auto;-webkit-overflow-scrolling:touch}
    .m-drawer.open{display:block}
    .md-greeting{display:flex;align-items:center;justify-content:space-between;padding:20px 24px 21px;border-bottom:1px solid #E1E1E0}
    .md-greeting-text{display:flex;flex-direction:column;gap:4px}
    .md-hi{font-weight:600;font-size:16px;line-height:24px;color:#444241}
    .md-status{font-weight:600;font-size:18px;line-height:28px;color:#181716}
    .md-close{width:24px;height:24px;padding:0;border:0;background:transparent;opacity:0.7;cursor:pointer}
    .md-close img{width:24px;height:24px;display:block}
    .md-auth{display:flex;flex-direction:column;gap:12px;padding:16px 24px 17px;border-bottom:1px solid #E1E1E0}
    .md-login,.md-myclass{display:flex;align-items:center;justify-content:center;padding:11.5px 16px 12.5px;border-radius:8px;font-weight:800;font-size:16px;line-height:24px;text-align:center}
    .md-login{background:#FF5E00;color:#fff}
    .md-myclass{background:#fff;border:1px solid #FF5E00;color:#FF5E00;box-shadow:0 1px 1px rgba(0,0,0,0.05)}
    .md-signup{text-align:center;font-weight:400;font-size:16px;line-height:24px;color:#444241}
    .md-signup a{font-weight:500;color:#FF5E00}
    .md-menu a{display:block;padding:16px 24px 17px;border-bottom:1px solid #E1E1E0;font-weight:700;font-size:16px;line-height:24px;color:#181716}
}

/* ===== 카카오톡 상담 플로팅 버튼 (전 페이지 공통, 히든클래스 이식 / 드로어 z-index:1000 아래) ===== */
.kakao-float{position:fixed;right:24px;bottom:40px;z-index:900;width:60px;height:60px;display:block}
.kakao-float img{width:100%;height:100%;object-fit:contain;display:block}

/* ===== apply 모바일 하단 고정 구매바 (767↓만, PC는 기존 위치 유지) ===== */
@media (max-width:767.98px){
    .apply-page{padding-bottom:76px}   /* 고정 바에 콘텐츠 안 가리게 하단 여백 */
    .apply-page .ap-buy{position:fixed;left:0;right:0;bottom:0;margin:0;border-radius:0;z-index:950;opacity:1;padding:16px 0;font-size:16px}   /* 흐름→하단 풀폭 고정 */
    .apply-page .kakao-float{bottom:88px}   /* 고정 구매바 위로 올려 겹침 방지 */
}
