@charset "utf-8";
/* =========================================================
   하나어이 (HANA-EOI) 기독교 교육 플랫폼 — 화면 목업
   ㈜미래와학교 · 본문 폭 1440px · 반응형 1480/1280/1024/768/480
   ========================================================= */
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.css');
@import url('https://fonts.googleapis.com/css2?family=Gowun+Batang:wght@400;700&display=swap');

:root{
  /* ── 브랜드 컬러 (심벌 기준) ───────────────────────────
     믿음 #1E3A6D · 사랑 #C5652E · 성장 #86A98F · 순수 #F7F4EC   */
  --brand:#1E3A6D;      /* 믿음 — 신뢰, 안정 (주조색) */
  --brand-d:#152B52;
  --brand-dd:#0E1E3C;
  --brand-l:#EBF0F8;
  --brand-l2:#DCE5F2;
  --love:#C5652E;       /* 사랑 — 따뜻함, 열정 (강조색) */
  --love-d:#A5501F;
  --love-l:#FBEEE5;
  --grow:#86A98F;       /* 성장 — 자연, 생명 (보조색) */
  --grow-d:#5E8770;
  --grow-l:#EDF3EE;
  --pure:#F7F4EC;       /* 순수 — 평안, 밝음 (배경색) */

  --ink:#1B2635;
  --gray:#5D6878;
  --gray-2:#97A1AF;
  --line:#E5E2D8;
  --line-2:#F0EDE4;
  --paper:#FBFAF6;
  --sand:#F7F4EC;

  /* ── 구버전 변수 별칭 (기존 클래스 호환) ── */
  --navy:#152B52;
  --green:var(--brand);   --green-d:var(--brand-d);   --green-l:var(--brand-l);
  --blue:var(--grow-d);   --blue-d:var(--grow-d);
  --orange:var(--love);
  --violet:var(--grow-d);
  --red:#B4443F;
  --mint:var(--pure);

  --sans:'Pretendard','Apple SD Gothic Neo','Malgun Gothic',sans-serif;
  --serif:'Gowun Batang','Nanum Myeongjo',serif;
  --sh:0 2px 14px rgba(30,58,109,.07);
  --sh-2:0 14px 44px rgba(21,43,82,.14);
}

*{margin:0;padding:0;box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:132px;}
body{font-family:var(--sans);color:var(--ink);background:#fff;font-size:15px;line-height:1.65;letter-spacing:-.2px;}
img{max-width:100%;display:block;border:0;}
a{color:inherit;text-decoration:none;}
button,input,select,textarea{font-family:inherit;font-size:inherit;color:inherit;}
button{background:none;border:0;cursor:pointer;}
li{list-style:none;}
table{border-collapse:collapse;width:100%;}
:focus-visible{outline:2.5px solid var(--green);outline-offset:2px;border-radius:3px;}
.blind{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
.container{width:100%;max-width:1440px;margin:0 auto;padding:0 24px;}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;}}

/* ================= 헤더 ================= */
/* 상단 띠 + 로고·GNB 전체를 상단 고정 */
.site-header{position:sticky;top:0;z-index:70;background:#fff;transition:box-shadow .18s;}
.site-header.stuck{box-shadow:0 4px 20px rgba(21,43,82,.10);}
.top-bar{background:var(--brand-d);color:rgba(255,255,255,.82);font-size:12.5px;}
.top-bar .container{display:flex;align-items:center;gap:18px;height:38px;}
.top-bar .verse{font-family:var(--serif);color:rgba(255,255,255,.6);letter-spacing:0;}
.top-bar .right{margin-left:auto;display:flex;align-items:center;gap:16px;}
.top-bar a:hover{color:#fff;}
.top-bar .lang{border:1px solid rgba(255,255,255,.26);border-radius:13px;padding:2px 10px;}

.site-head{background:#fff;border-bottom:1px solid var(--line);}
.site-head .container{display:flex;align-items:center;gap:34px;height:82px;}
.logo img{height:42px;width:auto;}
.gnb{margin-left:6px;}
.gnb>ul{display:flex;align-items:center;gap:34px;}
.gnb>ul>li{position:relative;}
.gnb>ul>li>a{display:flex;align-items:center;gap:5px;height:82px;line-height:82px;font-size:16px;font-weight:700;white-space:nowrap;}
.gnb>ul>li>a::after{content:"";width:5px;height:5px;border-right:1.6px solid var(--gray-2);border-bottom:1.6px solid var(--gray-2);transform:rotate(45deg) translateY(-2px);}
.gnb>ul>li.no-sub>a::after{display:none;}
.gnb>ul>li>a:hover,.gnb>ul>li.on>a{color:var(--green);}
.gnb>ul>li.on>a{box-shadow:inset 0 -3px 0 var(--green);}
.gnb .sub{
  position:absolute;left:-18px;top:78px;min-width:210px;background:#fff;border:1px solid var(--line);
  border-radius:12px;box-shadow:var(--sh-2);padding:10px 0;opacity:0;visibility:hidden;transform:translateY(6px);
  transition:.16s ease;
}
.gnb li:hover>.sub,.gnb li:focus-within>.sub{opacity:1;visibility:visible;transform:translateY(0);}
.gnb .sub a{display:block;padding:9px 20px;font-size:14.5px;color:var(--gray);}
.gnb .sub a:hover{background:var(--green-l);color:var(--green-d);font-weight:600;}
.head-util{margin-left:auto;display:flex;align-items:center;gap:12px;}
.head-util .txt{font-size:14px;font-weight:600;color:var(--gray);}
.head-util .txt:hover{color:var(--green);}
.menu-btn{display:none;width:42px;height:42px;border:1px solid var(--line);border-radius:10px;}
.menu-btn span,.menu-btn span::before,.menu-btn span::after{display:block;width:18px;height:2px;background:var(--ink);border-radius:2px;position:relative;margin:0 auto;}
.menu-btn span::before{content:"";position:absolute;top:-6px;}
.menu-btn span::after{content:"";position:absolute;top:6px;}

/* 버튼 */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;height:46px;padding:0 22px;border-radius:24px;font-size:14.5px;font-weight:700;transition:.15s;}
.btn-solid{background:var(--green);color:#fff;}
.btn-solid:hover{background:var(--green-d);}
.btn-navy{background:var(--navy);color:#fff;}
.btn-navy:hover{background:var(--brand-dd);}
.btn-line{border:1.5px solid var(--line);color:var(--ink);background:#fff;}
.btn-line:hover{border-color:var(--green);color:var(--green);}
.btn-white{background:#fff;color:var(--green-d);}
.btn-orange{background:var(--orange);color:#fff;}
.btn-orange:hover{background:var(--love-d);}
.btn-sm{height:36px;padding:0 15px;font-size:13px;border-radius:18px;}
.btn-lg{height:54px;padding:0 30px;font-size:16px;border-radius:28px;}
.btn-block{width:100%;}

/* ================= 메인 히어로 ================= */
.hero{background:linear-gradient(152deg,#0E1E3C 0%,#1E3A6D 58%,#2C5289 130%);color:#fff;padding:70px 0 84px;position:relative;overflow:hidden;}
.hero::after{content:"";position:absolute;right:-180px;top:-160px;width:560px;height:560px;border-radius:50%;background:radial-gradient(circle,rgba(197,101,46,.42),transparent 70%);}
.hero .container{position:relative;z-index:2;display:grid;grid-template-columns:1fr 470px;gap:60px;align-items:center;}
.hero .eyebrow{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.22);border-radius:20px;padding:6px 15px;font-size:13px;font-weight:600;}
.hero h1{margin-top:20px;font-size:52px;line-height:1.24;font-weight:800;letter-spacing:-1.4px;}
.hero h1 .serif{font-family:var(--serif);font-weight:400;}
.hero .lead{margin-top:20px;font-size:16.5px;line-height:1.8;color:rgba(255,255,255,.8);max-width:52ch;}
.hero .cta{margin-top:32px;display:flex;gap:12px;flex-wrap:wrap;}
.hero .figures{margin-top:44px;display:flex;gap:42px;flex-wrap:wrap;}
.hero .figures b{display:block;font-size:28px;font-weight:800;letter-spacing:-.5px;}
.hero .figures span{font-size:13px;color:rgba(255,255,255,.6);}

/* 패스포트 카드(히어로 오브젝트) */
.passport{background:#fff;color:var(--ink);border-radius:22px;padding:26px;box-shadow:0 26px 60px rgba(14,30,60,.34);}
.passport .pp-top{display:flex;align-items:center;justify-content:space-between;padding-bottom:16px;border-bottom:1.5px dashed var(--line);}
.passport .who{display:flex;align-items:center;gap:11px;}
.passport .who i{width:42px;height:42px;border-radius:50%;background:var(--love-l);color:var(--love-d);display:flex;align-items:center;justify-content:center;font-style:normal;font-weight:800;}
.passport .who b{display:block;font-size:15px;}
.passport .who span{font-size:12.5px;color:var(--gray-2);}
.passport .day{background:var(--brand);color:#fff;border-radius:14px;padding:5px 12px;font-size:12.5px;font-weight:700;}
.passport h3{margin:18px 0 4px;font-size:17px;}
.passport .task{font-size:13.5px;color:var(--gray);line-height:1.6;}
.stamps{margin-top:18px;display:grid;grid-template-columns:repeat(10,1fr);gap:6px;}
.stamps i{aspect-ratio:1;border-radius:50%;border:1.5px dashed #D7D3C6;display:flex;align-items:center;justify-content:center;font-size:11px;font-style:normal;color:#BDB9AC;}
.stamps i.done{background:var(--brand);border:1.5px solid var(--brand);color:#fff;font-weight:700;}
.stamps i.today{border:2px solid var(--love);color:var(--love);font-weight:800;animation:pulse 2.4s ease-in-out 3;}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(197,101,46,.55);}50%{box-shadow:0 0 0 7px rgba(197,101,46,0);}}
.passport .pp-foot{margin-top:18px;display:flex;align-items:center;justify-content:space-between;font-size:12.5px;color:var(--gray-2);}
.passport .pp-foot b{color:var(--green-d);font-size:14px;}

/* ================= 섹션 공통 ================= */
.sec{padding:78px 0;}
.sec.tint{background:var(--sand);}
.sec.paper{background:var(--paper);}
.sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:34px;}
.sec-head h2{font-size:31px;font-weight:800;letter-spacing:-.9px;}
.sec-head p{margin-top:10px;font-size:15.5px;color:var(--gray);max-width:62ch;}
.sec-head .more{font-size:14px;font-weight:700;color:var(--green-d);white-space:nowrap;}
.sec-head .more:hover{text-decoration:underline;text-underline-offset:4px;}

.grid{display:grid;gap:22px;}
.g2{grid-template-columns:repeat(2,1fr);}
.g3{grid-template-columns:repeat(3,1fr);}
.g4{grid-template-columns:repeat(4,1fr);}

/* 카드 */
.card{background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;display:block;transition:.18s;}
.card:hover{border-color:var(--green);box-shadow:var(--sh);}
.card .thumb{aspect-ratio:16/10;overflow:hidden;background:var(--sand);}
.card .thumb img{width:100%;height:100%;object-fit:cover;}
.card .body{padding:20px 22px 24px;}
.card .tag{display:inline-block;font-size:11.5px;font-weight:700;color:var(--green-d);background:var(--green-l);border-radius:11px;padding:3px 10px;}
.card .tag.blue{color:var(--grow-d);background:var(--grow-l);}
.card .tag.orange{color:var(--love-d);background:var(--love-l);}
.card .tag.violet{color:var(--brand-d);background:var(--sand);}
.card h3{margin:11px 0 8px;font-size:17.5px;font-weight:700;line-height:1.45;}
.card p{font-size:14px;color:var(--gray);line-height:1.65;}
.card .meta{margin-top:14px;display:flex;gap:12px;font-size:12.5px;color:var(--gray-2);}

/* 트랙(부서) 카드 */
.track{position:relative;border-radius:18px;overflow:hidden;color:#fff;display:block;min-height:260px;}
.track img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.track .ov{position:relative;z-index:2;padding:26px;display:flex;flex-direction:column;height:100%;min-height:260px;background:linear-gradient(180deg,rgba(14,30,60,.06),rgba(14,30,60,.68));}
.track .ov b{font-size:22px;font-weight:800;}
.track .ov span{font-size:13.5px;color:rgba(255,255,255,.82);margin-top:4px;}
.track .ov ul{margin-top:auto;display:flex;flex-wrap:wrap;gap:6px;}
.track .ov li{font-size:12px;background:rgba(255,255,255,.18);border-radius:11px;padding:3px 10px;}

/* 역할 안내 */
.role{background:#fff;border:1px solid var(--line);border-radius:16px;padding:28px 26px;}
.role .ico{width:48px;height:48px;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:22px;background:var(--green-l);}
.role.b .ico{background:var(--grow-l);} .role.o .ico{background:var(--love-l);} .role.v .ico{background:var(--sand);}
.role h3{margin:16px 0 9px;font-size:19px;}
.role p{font-size:14px;color:var(--gray);}
.role ul{margin-top:15px;border-top:1px solid var(--line-2);padding-top:14px;}
.role li{font-size:13.5px;color:var(--gray);padding:5px 0 5px 15px;position:relative;}
.role li::before{content:"";position:absolute;left:0;top:13px;width:5px;height:5px;border-radius:50%;background:var(--love);}
.role .go{margin-top:16px;display:inline-block;font-size:13.5px;font-weight:700;color:var(--green-d);}

/* 흐름(스텝) */
.flow{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:1px solid var(--line);border-radius:16px;overflow:hidden;background:#fff;}
.flow li{padding:26px 24px;border-right:1px solid var(--line);}
.flow li:last-child{border-right:0;}
.flow .no{font-size:12px;font-weight:800;color:var(--green);letter-spacing:.6px;}
.flow b{display:block;margin:8px 0 7px;font-size:17px;}
.flow p{font-size:13.5px;color:var(--gray);}

/* 인용 */
.verse-band{background:var(--brand);color:#fff;padding:64px 0;text-align:center;}
.verse-band q{font-family:var(--serif);font-size:26px;line-height:1.7;quotes:none;}
.verse-band cite{display:block;margin-top:14px;font-size:14px;font-style:normal;color:rgba(255,255,255,.55);}

/* 통계 밴드 */
.stat-band{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);border-radius:16px;background:#fff;overflow:hidden;}
.stat-band div{padding:26px 24px;border-right:1px solid var(--line);}
.stat-band div:last-child{border-right:0;}
.stat-band b{display:block;font-size:30px;font-weight:800;color:var(--brand);letter-spacing:-1px;}
.stat-band span{font-size:13.5px;color:var(--gray);}

/* 배너 */
.wide-banner{border-radius:18px;overflow:hidden;position:relative;color:#fff;}
.wide-banner img{width:100%;aspect-ratio:2400/560;object-fit:cover;}
.wide-banner .txt{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;padding:0 54px;background:linear-gradient(90deg,rgba(14,30,60,.78),rgba(14,30,60,.12));}
.wide-banner b{font-size:28px;font-weight:800;}
.wide-banner p{margin-top:8px;font-size:15px;color:rgba(255,255,255,.82);}
.wide-banner .btn{margin-top:20px;align-self:flex-start;}

/* ================= 서브페이지 ================= */
.page-hero{background:linear-gradient(180deg,var(--sand),#FCFBF7);padding:52px 0 46px;border-bottom:1px solid var(--line);}
.crumb{font-size:12.5px;color:var(--gray-2);display:flex;gap:8px;}
.crumb a:hover{color:var(--green);}
.page-hero h1{margin-top:12px;font-size:38px;font-weight:800;letter-spacing:-1.2px;}
.page-hero p{margin-top:12px;font-size:16px;color:var(--gray);max-width:70ch;line-height:1.8;}
.lnb{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:120px;z-index:40;}
.lnb .container{display:flex;gap:28px;overflow-x:auto;}
.lnb a{padding:16px 0;font-size:14.5px;font-weight:600;color:var(--gray);white-space:nowrap;}
.lnb a.on{color:var(--green-d);font-weight:800;box-shadow:inset 0 -3px 0 var(--green);}
.lnb a:hover{color:var(--green);}

.prose h2{font-size:26px;margin:0 0 16px;letter-spacing:-.7px;}
.prose h3{font-size:19px;margin:30px 0 10px;}
.prose p{font-size:15.5px;color:var(--gray);line-height:1.85;margin-bottom:14px;}
.prose ul{margin:0 0 18px;}
.prose ul li{font-size:15px;color:var(--gray);padding:4px 0 4px 16px;position:relative;}
.prose ul li::before{content:"";position:absolute;left:0;top:14px;width:5px;height:5px;border-radius:50%;background:var(--love);}
.split{display:grid;grid-template-columns:1fr 420px;gap:48px;align-items:start;}

/* 박스 */
.box{border:1px solid var(--line);border-radius:16px;padding:26px;background:#fff;}
.box.tint{background:var(--brand-l);border-color:var(--brand-l2);}
.box h4{font-size:17px;margin-bottom:10px;}
.box p{font-size:14px;color:var(--gray);line-height:1.7;}
.callout{border-left:4px solid var(--love);background:var(--love-l);border-radius:0 12px 12px 0;padding:18px 22px;font-size:14.5px;color:var(--love-d);}

/* 게시판 */
.board{border-top:2px solid var(--brand);}
.board li{border-bottom:1px solid var(--line);}
.board a{display:flex;gap:18px;padding:20px 6px;align-items:flex-start;}
.board a:hover{background:var(--paper);}
.board .th{width:150px;flex:0 0 150px;border-radius:10px;overflow:hidden;aspect-ratio:16/10;background:var(--sand);}
.board .th img{width:100%;height:100%;object-fit:cover;}
.board .tx{flex:1;min-width:0;}
.board .tx b{display:block;font-size:17px;margin-bottom:6px;}
.board .tx p{font-size:13.5px;color:var(--gray);line-height:1.6;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.board .tx .meta{margin-top:9px;font-size:12.5px;color:var(--gray-2);display:flex;gap:12px;}
.board .cat{font-size:11.5px;font-weight:700;color:var(--grow-d);background:var(--grow-l);border-radius:10px;padding:2px 9px;}

.filters{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:22px;}
.filters select,.filters input{height:42px;border:1px solid var(--line);border-radius:10px;padding:0 14px;background:#fff;}
.filters .search{flex:1;max-width:340px;}
.chipset{display:flex;gap:8px;flex-wrap:wrap;}
.chipset a{border:1px solid var(--line);border-radius:18px;padding:7px 16px;font-size:13.5px;color:var(--gray);background:#fff;}
.chipset a.on,.chipset a:hover{background:var(--brand);border-color:var(--brand);color:#fff;}

.pager{display:flex;justify-content:center;gap:6px;margin-top:36px;}
.pager a{width:38px;height:38px;border-radius:10px;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-size:14px;color:var(--gray);}
.pager a.on{background:var(--brand);border-color:var(--brand);color:#fff;font-weight:700;}

/* 표 */
.tbl{border-top:2px solid var(--brand);font-size:14.5px;}
.tbl th,.tbl td{padding:14px 16px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle;}
.tbl th{background:var(--paper);font-weight:700;font-size:14px;}
.tbl td{color:var(--gray);}
.tbl td strong{color:var(--ink);font-weight:700;}

/* 폼 */
.form{display:flex;flex-direction:column;gap:16px;}
.field{display:block;}
.field label{display:block;font-size:13.5px;font-weight:700;margin-bottom:7px;}
.field label em{color:var(--red);font-style:normal;}
.field input,.field select,.field textarea{width:100%;height:50px;border:1px solid var(--line);border-radius:12px;padding:0 16px;background:#fff;}
.field textarea{height:140px;padding:14px 16px;resize:vertical;line-height:1.7;}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--green);box-shadow:0 0 0 3px rgba(30,58,109,.14);}
.field .hint{margin-top:6px;font-size:12.5px;color:var(--gray-2);}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.check{display:flex;gap:9px;align-items:flex-start;font-size:14px;color:var(--gray);}
.check input{width:18px;height:18px;margin-top:2px;accent-color:var(--green);}

/* 로그인 역할 선택 */
.role-tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:26px;}
.role-tabs a{border:1.5px solid var(--line);border-radius:12px;padding:14px 8px;text-align:center;font-size:13.5px;font-weight:700;color:var(--gray);background:#fff;}
.role-tabs a i{display:block;font-style:normal;font-size:20px;margin-bottom:5px;}
.role-tabs a.on{border-color:var(--brand);background:var(--brand-l);color:var(--brand-d);box-shadow:0 4px 14px rgba(30,58,109,.12);}

/* 학습 대시보드(학생 마이페이지) */
.dash-grid{display:grid;grid-template-columns:1fr 360px;gap:26px;align-items:start;}
.panel{background:#fff;border:1px solid var(--line);border-radius:16px;padding:24px;}
.panel h3{font-size:17px;margin-bottom:16px;display:flex;justify-content:space-between;align-items:center;}
.panel h3 a{font-size:13px;font-weight:600;color:var(--gray-2);}
.todo li{display:flex;align-items:center;gap:12px;padding:13px 0;border-bottom:1px solid var(--line-2);}
.todo li:last-child{border-bottom:0;}
.todo .st{font-size:11.5px;font-weight:700;border-radius:9px;padding:3px 9px;background:var(--love-l);color:var(--love-d);white-space:nowrap;}
.todo .st.done{background:var(--green-l);color:var(--green-d);}
.todo b{font-size:14.5px;font-weight:600;}
.todo span{margin-left:auto;font-size:12.5px;color:var(--gray-2);white-space:nowrap;}
.bar{height:9px;border-radius:5px;background:var(--line-2);overflow:hidden;}
.bar i{display:block;height:100%;background:linear-gradient(90deg,var(--brand),var(--grow-d));border-radius:5px;}

/* ================= 푸터 ================= */
.site-foot{background:var(--brand-dd);color:rgba(255,255,255,.6);padding:52px 0 40px;font-size:13.5px;margin-top:0;}
.foot-top{display:grid;grid-template-columns:1.2fr 2fr;gap:40px;padding-bottom:30px;border-bottom:1px solid rgba(255,255,255,.12);}
.foot-brand b{display:block;font-size:20px;color:#fff;font-weight:800;letter-spacing:-.4px;}
.foot-brand p{margin-top:10px;line-height:1.8;}
.foot-links{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
.foot-links dt{color:#fff;font-weight:700;margin-bottom:11px;font-size:14px;}
.foot-links dd{margin-bottom:7px;}
.foot-links a:hover{color:#fff;}
.foot-bot{padding-top:24px;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;font-size:12.5px;color:rgba(255,255,255,.45);}
.foot-bot .adm{color:rgba(255,255,255,.75);border:1px solid rgba(255,255,255,.22);border-radius:14px;padding:4px 12px;}

/* 모바일 드로어 */
.drawer{position:fixed;inset:0;background:rgba(14,30,60,.46);z-index:100;display:none;}
.drawer.open{display:block;}
.drawer .inner{position:absolute;right:0;top:0;bottom:0;width:min(340px,86vw);background:#fff;padding:22px;overflow-y:auto;}
.drawer .x{position:absolute;right:16px;top:16px;font-size:24px;color:var(--gray);}
.drawer h4{font-size:15px;margin:22px 0 8px;color:var(--green-d);}
.drawer a{display:block;padding:9px 0;font-size:14.5px;color:var(--gray);border-bottom:1px solid var(--line-2);}

/* ================= 반응형 ================= */
@media (max-width:1480px){ .container{padding:0 28px;} }
@media (max-width:1280px){
  .hero .container{grid-template-columns:1fr 400px;gap:40px;}
  .hero h1{font-size:44px;}
  .gnb>ul{gap:22px;} .gnb>ul>li>a{font-size:15px;}
  .split{grid-template-columns:1fr 340px;gap:32px;}
}
@media (max-width:1100px){
  .gnb,.head-util .txt{display:none;}
  .menu-btn{display:block;}
  .site-head .container{height:70px;}
  .lnb{top:108px;}
  .my-side{top:126px;}
  .g4{grid-template-columns:repeat(2,1fr);}
  .flow{grid-template-columns:repeat(2,1fr);}
  .flow li:nth-child(2){border-right:0;}
  .flow li:nth-child(-n+2){border-bottom:1px solid var(--line);}
  .stat-band{grid-template-columns:repeat(2,1fr);}
  .stat-band div:nth-child(2){border-right:0;}
  .stat-band div:nth-child(-n+2){border-bottom:1px solid var(--line);}
  .dash-grid,.split{grid-template-columns:1fr;}
}
@media (max-width:900px){
  .hero{padding:48px 0 60px;}
  .hero .container{grid-template-columns:1fr;}
  .hero h1{font-size:36px;} .hero .lead{font-size:15px;}
  .sec{padding:56px 0;}
  .sec-head{flex-direction:column;align-items:flex-start;gap:12px;}
  .sec-head h2{font-size:25px;}
  .g3{grid-template-columns:repeat(2,1fr);}
  .page-hero h1{font-size:30px;}
  .foot-top{grid-template-columns:1fr;}
  .foot-links{grid-template-columns:repeat(2,1fr);}
  .verse-band q{font-size:21px;}
  .wide-banner .txt{padding:0 26px;} .wide-banner b{font-size:20px;} .wide-banner p{font-size:13px;}
  .wide-banner img{aspect-ratio:16/8;}
}
@media (max-width:620px){
  .container{padding:0 18px;}
  .g2,.g3,.g4,.field-row{grid-template-columns:1fr;}
  .flow{grid-template-columns:1fr;} .flow li{border-right:0;border-bottom:1px solid var(--line);}
  .stat-band{grid-template-columns:1fr;} .stat-band div{border-right:0;border-bottom:1px solid var(--line);}
  .role-tabs{grid-template-columns:repeat(2,1fr);}
  .board a{flex-direction:column;} .board .th{width:100%;flex:none;}
  .hero h1{font-size:30px;} .hero .figures{gap:24px;}
  .stamps{grid-template-columns:repeat(6,1fr);}
  .top-bar .verse{display:none;}
  .lnb .container{gap:18px;}
}

/* 패스포트 카드 모바일 보정 */
@media (max-width:620px){
  .passport .pp-top{align-items:flex-start;}
  .passport .who b em{display:block;margin-top:2px;}
}

/* =========================================================
   계정 · 회원 (로그인 / 회원가입 / 아이디·비밀번호 찾기)
   ========================================================= */
.auth-sec{padding:64px 0 92px;background:linear-gradient(180deg,var(--sand) 0%,#fff 340px);}
.auth-wrap{max-width:560px;margin:0 auto;}
.auth-wrap.wide{max-width:860px;}
.auth-head{text-align:center;margin-bottom:30px;}
.auth-head .sym{height:52px;width:auto;margin:0 auto 16px;}
.auth-head h1{font-size:30px;font-weight:800;letter-spacing:-1px;}
.auth-head p{margin-top:10px;font-size:14.5px;color:var(--gray);}
.auth-card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:34px 34px 30px;box-shadow:var(--sh);}
.auth-card + .auth-card{margin-top:18px;}
.auth-foot{margin-top:20px;display:flex;justify-content:center;gap:14px;font-size:13.5px;color:var(--gray);}
.auth-foot a{color:var(--gray);}
.auth-foot a:hover{color:var(--brand);text-decoration:underline;text-underline-offset:4px;}
.auth-foot i{color:var(--line);font-style:normal;}
.auth-note{margin-top:22px;background:var(--sand);border:1px solid var(--line);border-radius:16px;padding:20px 22px;}
.auth-note h4{font-size:15px;margin-bottom:8px;}
.auth-note p{font-size:13.5px;color:var(--gray);line-height:1.75;}

/* 회원 유형 선택 */
.type-pick{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
.type-pick button{position:relative;text-align:left;background:#fff;border:1.5px solid var(--line);border-radius:18px;padding:24px 22px;transition:.16s;}
.type-pick button:hover{border-color:var(--brand);transform:translateY(-2px);box-shadow:var(--sh);}
.type-pick button.on{border-color:var(--brand);background:var(--brand-l);box-shadow:0 6px 20px rgba(30,58,109,.14);}
.type-pick .ico{width:46px;height:46px;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:21px;background:var(--brand-l);}
.type-pick button:nth-child(2) .ico{background:var(--love-l);}
.type-pick button:nth-child(3) .ico{background:var(--grow-l);}
.type-pick b{display:block;margin:14px 0 6px;font-size:17px;}
.type-pick span{display:block;font-size:13px;color:var(--gray);line-height:1.6;}
.type-pick button.on::after{content:"✓";position:absolute;right:18px;top:18px;width:22px;height:22px;border-radius:50%;background:var(--brand);color:#fff;font-size:12px;display:flex;align-items:center;justify-content:center;font-weight:700;}

/* 단계 인디케이터 */
.steps{display:flex;align-items:center;justify-content:center;gap:0;margin-bottom:34px;}
.steps li{display:flex;align-items:center;gap:10px;font-size:13.5px;color:var(--gray-2);font-weight:600;}
.steps li i{width:30px;height:30px;border-radius:50%;border:1.5px solid var(--line);background:#fff;display:flex;align-items:center;justify-content:center;font-style:normal;font-size:13px;font-weight:700;color:var(--gray-2);}
.steps li.on{color:var(--brand);}
.steps li.on i{background:var(--brand);border-color:var(--brand);color:#fff;}
.steps li.done{color:var(--grow-d);}
.steps li.done i{background:var(--grow);border-color:var(--grow);color:#fff;}
.steps .sp{width:52px;height:1.5px;background:var(--line);margin:0 14px;}
.step-pane{display:none;}
.step-pane.on{display:block;animation:fadeUp .22s ease;}
@keyframes fadeUp{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:none;}}

/* 약관 */
.agree-all{display:flex;gap:10px;align-items:center;background:var(--brand-l);border:1px solid var(--brand-l2);border-radius:14px;padding:16px 18px;font-size:15px;font-weight:700;color:var(--brand-d);cursor:pointer;}
.agree-all input{width:20px;height:20px;accent-color:var(--brand);}
.terms{margin-top:16px;border:1px solid var(--line);border-radius:14px;overflow:hidden;}
.terms .item{border-bottom:1px solid var(--line-2);padding:16px 18px;}
.terms .item:last-child{border-bottom:0;}
.terms .item .hd{display:flex;align-items:center;gap:10px;font-size:14.5px;}
.terms .item .hd input{width:18px;height:18px;accent-color:var(--brand);}
.terms .item .hd b{font-weight:600;}
.terms .item .req{font-size:11.5px;font-weight:700;border-radius:9px;padding:2px 8px;background:var(--love-l);color:var(--love-d);}
.terms .item .opt{font-size:11.5px;font-weight:700;border-radius:9px;padding:2px 8px;background:var(--line-2);color:var(--gray);}
.terms .item .view{margin-left:auto;font-size:12.5px;color:var(--gray-2);text-decoration:underline;text-underline-offset:3px;}
.terms .doc{margin-top:12px;max-height:118px;overflow-y:auto;background:var(--paper);border:1px solid var(--line-2);border-radius:10px;padding:14px 16px;font-size:12.5px;color:var(--gray);line-height:1.8;}

/* 완료 */
.done-panel{text-align:center;padding:14px 0 6px;}
.done-panel .mark{width:78px;height:78px;border-radius:50%;background:var(--grow-l);color:var(--grow-d);display:flex;align-items:center;justify-content:center;font-size:36px;margin:0 auto 20px;}
.done-panel h2{font-size:24px;font-weight:800;letter-spacing:-.7px;}
.done-panel p{margin-top:12px;font-size:14.5px;color:var(--gray);line-height:1.8;}
.done-info{margin:24px 0 4px;text-align:left;background:var(--sand);border-radius:14px;padding:20px 22px;font-size:14px;}
.done-info dl{display:grid;grid-template-columns:110px 1fr;gap:10px 12px;}
.done-info dt{color:var(--gray-2);font-size:13.5px;}
.done-info dd{font-weight:600;}
.form-actions{display:flex;gap:10px;margin-top:26px;}
.form-actions .btn{flex:1;}

/* 인증번호 입력 */
.with-btn{display:grid;grid-template-columns:1fr auto;gap:8px;}
.with-btn .btn{height:50px;white-space:nowrap;}
.result-box{background:var(--sand);border:1px solid var(--line);border-radius:16px;padding:26px;text-align:center;}
.result-box .lb{font-size:13.5px;color:var(--gray);}
.result-box b{display:block;margin-top:8px;font-size:24px;font-weight:800;letter-spacing:.5px;color:var(--brand);}
.result-box .sub{margin-top:8px;font-size:13px;color:var(--gray-2);}

/* =========================================================
   마이페이지
   ========================================================= */
.my-layout{display:grid;grid-template-columns:264px 1fr;gap:34px;align-items:start;}
.my-side{position:sticky;top:144px;}
.my-card{background:linear-gradient(160deg,var(--brand) 0%,var(--brand-dd) 100%);color:#fff;border-radius:18px;padding:24px 22px;}
.my-card .av{width:56px;height:56px;border-radius:50%;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.28);display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:800;}
.my-card b{display:block;margin-top:14px;font-size:19px;font-weight:800;letter-spacing:-.4px;}
.my-card .role{display:inline-block;margin-top:8px;background:rgba(255,255,255,.16);border-radius:12px;padding:3px 11px;font-size:12px;font-weight:600;}
.my-card p{margin-top:12px;font-size:12.5px;color:rgba(255,255,255,.7);line-height:1.7;}
.my-nav{margin-top:14px;background:#fff;border:1px solid var(--line);border-radius:18px;padding:8px;}
.my-nav a{display:flex;align-items:center;gap:11px;padding:12px 14px;border-radius:12px;font-size:14.5px;font-weight:600;color:var(--gray);}
.my-nav a i{font-style:normal;font-size:16px;width:20px;text-align:center;}
.my-nav a:hover{background:var(--sand);color:var(--ink);}
.my-nav a.on{background:var(--brand);color:#fff;}
.my-nav a .cnt{margin-left:auto;font-size:11.5px;font-weight:700;background:var(--love-l);color:var(--love-d);border-radius:9px;padding:2px 8px;}
.my-nav a.on .cnt{background:rgba(255,255,255,.22);color:#fff;}
.my-pane{display:none;}
.my-pane.on{display:block;animation:fadeUp .22s ease;}
.my-head{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;padding-bottom:16px;margin-bottom:24px;border-bottom:2px solid var(--brand);}
.my-head h2{font-size:24px;font-weight:800;letter-spacing:-.7px;}
.my-head p{margin-top:7px;font-size:13.5px;color:var(--gray);}
.kpi{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:24px;}
.kpi div{background:#fff;border:1px solid var(--line);border-radius:14px;padding:18px 18px;}
.kpi span{font-size:12.5px;color:var(--gray-2);}
.kpi b{display:block;margin-top:5px;font-size:24px;font-weight:800;letter-spacing:-.8px;color:var(--brand);}
.kpi div.accent b{color:var(--love);}
.kpi div.grow b{color:var(--grow-d);}
.st-badge{display:inline-block;font-size:11.5px;font-weight:700;border-radius:9px;padding:3px 9px;white-space:nowrap;}
.st-badge.ok{background:var(--grow-l);color:var(--grow-d);}
.st-badge.wait{background:var(--love-l);color:var(--love-d);}
.st-badge.gray{background:var(--line-2);color:var(--gray);}
.st-badge.navy{background:var(--brand-l);color:var(--brand-d);}
.org-card{display:flex;gap:18px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:16px;padding:22px 24px;}
.org-card .em{width:56px;height:56px;border-radius:16px;background:var(--brand-l);color:var(--brand);display:flex;align-items:center;justify-content:center;font-size:24px;flex:0 0 56px;}
.org-card b{font-size:17px;}
.org-card span{display:block;font-size:13.5px;color:var(--gray);margin-top:4px;}
.org-card .btn{margin-left:auto;}
.empty{text-align:center;padding:54px 0;color:var(--gray-2);font-size:14px;}
@media (max-width:1100px){
  .my-layout{grid-template-columns:1fr;gap:22px;}
  .my-side{position:static;}
  .my-nav{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;}
  .kpi{grid-template-columns:repeat(2,1fr);}
  .type-pick{grid-template-columns:1fr;}
}
@media (max-width:620px){
  .auth-card{padding:26px 20px 24px;}
  .auth-head h1{font-size:24px;}
  .my-nav{grid-template-columns:repeat(2,1fr);}
  .kpi{grid-template-columns:1fr;}
  .steps li span{display:none;}
  .steps .sp{width:26px;margin:0 8px;}
  .my-head{flex-direction:column;align-items:flex-start;}
  .form-actions{flex-direction:column;}
  .done-info dl{grid-template-columns:1fr;gap:2px 0;}
  .done-info dt{margin-top:8px;}
}

/* 푸터 브랜드 로고 */
.foot-brand img{opacity:.92;}

/* =========================================================
   구독 안내 — 요금 플랜 카드
   ========================================================= */
.plan-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
.plan{position:relative;background:#fff;border:1.5px solid var(--line);border-radius:20px;padding:28px 24px 26px;transition:.18s;}
.plan:hover{border-color:var(--brand);box-shadow:var(--sh);transform:translateY(-2px);}
.plan.best{border:2px solid var(--brand);box-shadow:0 14px 40px rgba(30,58,109,.14);}
.plan .flag{position:absolute;top:-13px;left:24px;background:var(--love);color:#fff;font-size:12px;font-weight:700;border-radius:13px;padding:4px 13px;letter-spacing:-.2px;}
.plan .term{font-size:16px;font-weight:800;color:var(--brand);}
.plan .dc{display:inline-block;margin-left:7px;font-size:11.5px;font-weight:800;background:var(--love-l);color:var(--love-d);border-radius:9px;padding:2px 8px;vertical-align:2px;}
.plan .was{margin-top:14px;font-size:13.5px;color:var(--gray-2);text-decoration:line-through;min-height:20px;}
.plan .now{margin-top:2px;font-size:27px;font-weight:800;letter-spacing:-1.2px;color:var(--ink);}
.plan .per{margin-top:8px;background:var(--sand);border-radius:10px;padding:8px 12px;font-size:13.5px;color:var(--gray);}
.plan .per b{color:var(--brand);font-weight:800;}
.plan .btn{margin-top:20px;width:100%;}
.plan-note{margin-top:20px;display:flex;align-items:center;gap:10px;background:var(--brand-l);border:1px solid var(--brand-l2);border-radius:14px;padding:14px 18px;font-size:14px;font-weight:600;color:var(--brand-d);}
.plan-note i{font-style:normal;font-size:17px;}
.benefit{margin-top:26px;background:#fff;border:1px solid var(--line);border-radius:18px;padding:26px 28px;}
.benefit h4{font-size:17px;margin-bottom:16px;}
.benefit ul{display:grid;grid-template-columns:repeat(4,1fr);gap:12px 20px;}
.benefit li{font-size:14.5px;color:var(--gray);padding-left:24px;position:relative;}
.benefit li::before{content:"✓";position:absolute;left:0;top:0;color:var(--grow-d);font-weight:800;}
@media (max-width:1100px){ .plan-grid{grid-template-columns:repeat(2,1fr);} .benefit ul{grid-template-columns:repeat(2,1fr);} }
@media (max-width:620px){ .plan-grid{grid-template-columns:1fr;} .benefit ul{grid-template-columns:1fr;} }

/* =========================================================
   마이페이지 — 레벨 / 포인트 / 쿠폰
   ========================================================= */
.reward{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:14px;margin-bottom:24px;}
.reward .rw{display:block;background:#fff;border:1px solid var(--line);border-radius:18px;padding:22px 22px;transition:.16s;}
.reward a.rw:hover{border-color:var(--brand);box-shadow:var(--sh);}
.reward .rw .lb{display:flex;align-items:center;gap:7px;font-size:13px;color:var(--gray-2);font-weight:600;}
.reward .rw .lb i{font-style:normal;font-size:15px;}
.reward .rw .vl{display:block;margin-top:8px;font-size:26px;font-weight:800;letter-spacing:-1px;color:var(--brand);}
.reward .rw .vl small{font-size:14px;font-weight:700;color:var(--gray);margin-left:3px;}
.reward .rw .sub{display:block;margin-top:6px;font-size:12.5px;color:var(--gray-2);}
.reward .lvl{background:linear-gradient(150deg,var(--brand) 0%,var(--brand-dd) 100%);border-color:transparent;color:#fff;}
.reward .lvl .lb{color:rgba(255,255,255,.68);}
.reward .lvl .vl{color:#fff;display:flex;align-items:center;gap:10px;}
.reward .lvl .vl em{font-style:normal;font-size:13px;font-weight:700;background:rgba(255,255,255,.18);border-radius:11px;padding:3px 10px;letter-spacing:0;}
.reward .lvl .bar{margin-top:14px;background:rgba(255,255,255,.2);}
.reward .lvl .bar i{background:var(--love);}
.reward .lvl .sub{color:rgba(255,255,255,.7);margin-top:8px;}
.reward .pt .vl{color:var(--love);}
.reward .cp .vl{color:var(--grow-d);}
.lvl-track{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-top:4px;}
.lvl-track div{border:1px solid var(--line);border-radius:14px;padding:16px 14px;text-align:center;background:#fff;}
.lvl-track div.on{border-color:var(--brand);background:var(--brand-l);}
.lvl-track b{display:block;font-size:15px;}
.lvl-track span{display:block;margin-top:5px;font-size:12px;color:var(--gray-2);}
.lvl-track .em{font-size:22px;}
.coupon-list{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;}
.coupon{position:relative;display:flex;gap:18px;align-items:center;background:#fff;border:1.5px dashed var(--brand-l2);border-radius:16px;padding:20px 22px;}
.coupon.used{opacity:.55;border-style:solid;}
.coupon .amt{font-size:22px;font-weight:800;color:var(--brand);white-space:nowrap;letter-spacing:-.8px;}
.coupon .info b{display:block;font-size:14.5px;}
.coupon .info span{display:block;margin-top:4px;font-size:12.5px;color:var(--gray-2);}
@media (max-width:1100px){ .reward{grid-template-columns:1fr;} .coupon-list{grid-template-columns:1fr;} .lvl-track{grid-template-columns:repeat(3,1fr);} }

/* =========================================================
   선교와 여행 — 탭 / 상품 리스트 / 상세
   ========================================================= */
.tabs{display:flex;gap:0;border-bottom:2px solid var(--line);margin-bottom:34px;}
.tabs button{flex:0 0 auto;min-width:210px;padding:17px 30px;font-size:16.5px;font-weight:700;color:var(--gray-2);border-bottom:3px solid transparent;margin-bottom:-2px;transition:.15s;}
.tabs button:hover{color:var(--brand);}
.tabs button.on{color:var(--brand);border-bottom-color:var(--brand);}
.tabs button small{display:block;margin-top:4px;font-size:12.5px;font-weight:600;color:var(--gray-2);}
.tabs button.on small{color:var(--love-d);}
.tab-pane{display:none;}
.tab-pane.on{display:block;animation:fadeUp .22s ease;}

/* 상품 정렬 바 */
.sort-bar{display:flex;align-items:center;gap:18px;flex-wrap:wrap;padding-bottom:14px;border-bottom:1.5px solid var(--ink);margin-bottom:22px;}
.sort-bar .cnt{font-size:14.5px;color:var(--gray);}
.sort-bar .cnt b{font-size:17px;font-weight:800;color:var(--ink);}
.sort-bar .sorts{margin-left:auto;display:flex;gap:16px;flex-wrap:wrap;}
.sort-bar .sorts a{font-size:14px;color:var(--gray-2);}
.sort-bar .sorts a.on{color:var(--ink);font-weight:800;}
.sort-bar .sorts a:hover{color:var(--brand);}

/* 상품 카드 */
.prod-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
.prod-grid.g3{grid-template-columns:repeat(3,1fr);}
.prod{position:relative;display:block;background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden;transition:.18s;}
.prod:hover{border-color:var(--brand);box-shadow:var(--sh);transform:translateY(-2px);}
.prod .th{display:block;position:relative;aspect-ratio:10/7;background:var(--sand);overflow:hidden;}
.prod .th img{width:100%;height:100%;object-fit:cover;}
.prod .wish{position:absolute;right:12px;top:12px;width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.92);display:flex;align-items:center;justify-content:center;font-size:15px;color:var(--gray-2);box-shadow:0 2px 8px rgba(14,30,60,.16);}
.prod .bd{display:block;padding:14px 16px 16px;}
.pbadges{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:10px;}
.pbadge{font-size:11.5px;font-weight:700;border:1px solid var(--brand-l2);color:var(--brand);border-radius:5px;padding:2px 7px;line-height:1.5;white-space:nowrap;}
.pbadge.warm{border-color:#EEC9B2;color:var(--love-d);}
.pbadge.grow{border-color:#C4D7C9;color:var(--grow-d);}
.pbadge.solid{background:var(--brand);border-color:var(--brand);color:#fff;}
.prod .tt{display:-webkit-box;font-size:15px;font-weight:700;line-height:1.5;min-height:45px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.prod .dep{display:-webkit-box;margin-top:12px;font-size:12.5px;color:var(--gray);line-height:1.6;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:40px;}
.prod .pr{display:block;margin-top:12px;font-size:20px;font-weight:800;letter-spacing:-.8px;}
.prod .pr small{font-size:13px;font-weight:600;color:var(--gray);}
.prod .rv{display:flex;margin-top:10px;padding-top:10px;border-top:1px solid var(--line-2);font-size:12.5px;color:var(--gray-2);display:flex;gap:12px;}
.prod .rv em{font-style:normal;color:var(--love);}

/* 선교지 카드 — .field 는 폼 입력 항목 클래스와 겹치므로 .mcard 로 분리 */
.mcard{display:grid;grid-template-columns:300px 1fr;gap:0;background:#fff;border:1px solid var(--line);border-radius:18px;overflow:hidden;margin-bottom:18px;}
.mcard .th{background:var(--sand);}
.mcard .th img{width:100%;height:100%;object-fit:cover;min-height:210px;}
.mcard .bd{padding:26px 28px;}
.mcard .bd h3{font-size:20px;font-weight:800;letter-spacing:-.5px;}
.mcard .bd .lead{margin-top:8px;font-size:14px;color:var(--gray);line-height:1.75;}
.mcard dl{margin-top:18px;display:grid;grid-template-columns:repeat(2,auto 1fr);gap:9px 12px;font-size:13.5px;}
.mcard dt{color:var(--gray-2);white-space:nowrap;}
.mcard dd{font-weight:600;}
.mcard .foot{margin-top:20px;display:flex;gap:8px;flex-wrap:wrap;}

/* 상품 상세 */
.tour-top{display:grid;grid-template-columns:1fr 380px;gap:34px;align-items:start;}
.tour-gal{border-radius:16px;overflow:hidden;border:1px solid var(--line);position:relative;}
.tour-gal img{width:100%;aspect-ratio:10/7;object-fit:cover;}
.tour-gal .no{position:absolute;left:50%;bottom:16px;transform:translateX(-50%);background:rgba(14,30,60,.68);color:#fff;font-size:12.5px;border-radius:14px;padding:4px 14px;}
.book{position:sticky;top:144px;border:1px solid var(--line);border-radius:18px;padding:24px;background:#fff;box-shadow:var(--sh);}
.book .lb{font-size:14px;font-weight:800;padding-bottom:12px;border-bottom:1.5px solid var(--ink);}
.book h4{margin-top:16px;font-size:15.5px;line-height:1.55;}
.book .rv{margin-top:10px;font-size:12.5px;color:var(--gray-2);}
.book .amt{margin-top:16px;padding-top:16px;border-top:1px solid var(--line-2);}
.book .amt span{font-size:13px;color:var(--gray-2);}
.book .amt b{display:block;margin-top:4px;font-size:27px;font-weight:800;letter-spacing:-1.2px;}
.book .btns{margin-top:16px;display:grid;gap:8px;}
.book .code{margin-top:16px;padding-top:14px;border-top:1px solid var(--line-2);display:flex;justify-content:space-between;font-size:12px;color:var(--gray-2);}
.tour-title{margin-top:26px;}
.tour-title h1{margin-top:12px;font-size:27px;font-weight:800;letter-spacing:-1px;line-height:1.4;}
.tour-title .price{margin-top:14px;font-size:26px;font-weight:800;letter-spacing:-1px;}
.tour-title .price small{font-size:14px;font-weight:600;color:var(--gray);}
.tour-tags{margin-top:16px;display:flex;gap:7px;flex-wrap:wrap;}
.tour-tags span{background:var(--sand);border-radius:8px;padding:6px 13px;font-size:13px;color:var(--gray);}
.sec-bar{margin:44px 0 20px;padding:14px 18px;background:var(--sand);border-top:2px solid var(--ink);font-size:16px;font-weight:800;}

/* 달력 */
.cal-wrap{border:1px solid var(--line);border-radius:14px;padding:22px;}
.cal-legend{display:flex;justify-content:flex-end;gap:16px;font-size:12.5px;color:var(--gray);margin-bottom:14px;}
.cal-legend i{font-style:normal;}
.cal-legend .d1::before,.cal-legend .d2::before{content:"●";margin-right:5px;}
.cal-legend .d1::before{color:var(--grow-d);} .cal-legend .d2::before{color:var(--love);}
.cals{display:grid;grid-template-columns:1fr 1fr;gap:26px;}
.cal h5{text-align:center;font-size:15px;margin-bottom:12px;}
.cal table{width:100%;table-layout:fixed;}
.cal th{font-size:12.5px;color:var(--gray-2);font-weight:600;padding-bottom:8px;text-align:center;}
.cal td{text-align:center;height:46px;font-size:13.5px;color:#C9C6BC;vertical-align:middle;}
.cal td.able{color:var(--ink);font-weight:600;}
.cal td .day{display:block;position:relative;}
.cal td .pv{display:block;font-size:11px;color:var(--grow-d);font-weight:700;}
.cal td.able .dot{display:block;width:5px;height:5px;border-radius:50%;background:var(--grow-d);margin:0 auto 2px;}
.cal td.sel{background:var(--brand);border-radius:10px;color:#fff;font-weight:700;}
.cal td.sel .pv{color:#fff;}
.cal td.sel .dot{background:#fff;}
.cal .nav{border:0;background:none;font-size:18px;color:var(--gray);}

/* 행사 선택 */
.event-box{border:1.5px solid var(--brand);background:var(--brand-l);border-radius:14px;padding:20px 22px;}
.event-box .tagline{display:flex;gap:6px;margin-bottom:12px;}
.event-box h5{font-size:16px;font-weight:700;}
.event-box ul{margin-top:14px;display:grid;gap:8px;}
.event-box li{font-size:13.5px;color:var(--gray);display:flex;gap:10px;}
.event-box li b{color:var(--ink);font-weight:600;}
.event-box .pick{margin-top:14px;text-align:right;}
.pax{margin-top:16px;border:1px solid var(--line);border-radius:14px;overflow:hidden;}
.pax .row{display:grid;grid-template-columns:repeat(3,1fr);}
.pax .row > div{padding:18px 20px;border-right:1px solid var(--line-2);}
.pax .row > div:last-child{border-right:0;}
.pax .row span{font-size:13px;color:var(--gray-2);}
.pax .row b{display:block;margin-top:5px;font-size:16px;font-weight:700;}
.pax .cnt{margin-top:10px;display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:9px;overflow:hidden;}
.pax .cnt button{width:34px;height:34px;font-size:16px;color:var(--gray);}
.pax .cnt input{width:44px;height:34px;border:0;border-left:1px solid var(--line);border-right:1px solid var(--line);text-align:center;font-weight:700;}
.pax .total{display:flex;align-items:center;gap:14px;padding:18px 20px;border-top:1px solid var(--line);background:var(--paper);}
.pax .total span{margin-left:auto;font-size:14px;color:var(--gray);}
.pax .total b{font-size:23px;font-weight:800;letter-spacing:-1px;}
.incl{border:1px solid var(--line);border-radius:14px;padding:22px 24px;}
.incl + .incl{margin-top:14px;}
.incl h5{display:flex;align-items:center;gap:8px;font-size:15.5px;margin-bottom:12px;}
.incl h5 i{font-style:normal;}
.incl li{font-size:14px;color:var(--gray);padding:5px 0 5px 16px;position:relative;line-height:1.65;}
.incl li::before{content:"";position:absolute;left:0;top:14px;width:4px;height:4px;border-radius:50%;background:var(--gray-2);}
.incl li em{display:block;font-style:normal;font-size:12.5px;color:var(--gray-2);margin-top:3px;}
@media (max-width:1100px){
  .prod-grid{grid-template-columns:repeat(2,1fr);}
  .prod-grid.g3{grid-template-columns:repeat(2,1fr);}
  .tour-top{grid-template-columns:1fr;}
  .book{position:static;}
  .cals{grid-template-columns:1fr;}
  .mcard{grid-template-columns:1fr;}
  .mcard .th img{min-height:200px;}
}
@media (max-width:620px){
  .prod-grid,.prod-grid.g3{grid-template-columns:1fr;}
  .tabs button{min-width:0;flex:1;padding:14px 8px;font-size:14.5px;}
  .mcard dl{grid-template-columns:auto 1fr;}
  .pax .row{grid-template-columns:1fr;}
  .pax .row > div{border-right:0;border-bottom:1px solid var(--line-2);}
}

/* 상품 상세 — 갤러리 썸네일 */
.gal-thumbs{margin-top:12px;display:grid;grid-template-columns:repeat(4,1fr);gap:10px;}
.gal-thumbs button{border:2px solid transparent;border-radius:10px;overflow:hidden;padding:0;line-height:0;transition:.15s;}
.gal-thumbs button img{width:100%;aspect-ratio:4/3;object-fit:cover;}
.gal-thumbs button:hover{border-color:var(--brand-l2);}
.gal-thumbs button.on{border-color:var(--brand);}

/* =========================================================
   마이페이지 — 선교·여행 내역 (주문/신청 카드)
   ========================================================= */
.sec-line{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:16px;padding-bottom:12px;border-bottom:1.5px solid var(--ink);}
.sec-line h3{font-size:18px;font-weight:800;letter-spacing:-.5px;}
.sec-line h3 em{font-style:normal;font-size:15px;color:var(--love);margin-left:4px;}
.sec-line a{font-size:13px;font-weight:600;color:var(--gray-2);}
.sec-line a:hover{color:var(--brand);}

.ord{background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;margin-bottom:16px;transition:.16s;}
.ord:hover{border-color:var(--brand-l2);box-shadow:var(--sh);}
.ord.cancelled{background:var(--paper);}
.ord.cancelled .th img{filter:grayscale(.85);opacity:.7;}
.ord .hd{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:13px 20px;background:var(--paper);border-bottom:1px solid var(--line);font-size:13px;color:var(--gray);}
.ord .hd b{font-size:14px;font-weight:700;color:var(--ink);}
.ord .hd .no{color:var(--gray-2);}
.ord .hd .st{margin-left:auto;}
.ord .bd{display:grid;grid-template-columns:210px 1fr 290px;gap:24px;padding:22px 20px;}
.ord .th{display:block;border-radius:12px;overflow:hidden;background:var(--sand);align-self:start;}
.ord .th img{width:100%;aspect-ratio:10/7;object-fit:cover;display:block;}
.ord .th.sym{border:1px solid var(--line-2);background:var(--brand-l);}
.ord .th.sym img{object-fit:cover;}
.ord .tt{display:block;margin-top:2px;font-size:17px;font-weight:700;letter-spacing:-.4px;line-height:1.5;color:var(--ink);}
.ord a.tt:hover{color:var(--brand);}
.ord dl{margin-top:15px;display:grid;grid-template-columns:auto 1fr;gap:9px 16px;font-size:13.5px;}
.ord dt{color:var(--gray-2);white-space:nowrap;}
.ord dd{color:var(--ink);font-weight:600;line-height:1.6;}
.ord .amt{border-left:1px solid var(--line-2);padding-left:24px;}
.ord .amt .row{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:5px 0;font-size:13px;color:var(--gray-2);}
.ord .amt .row b{font-size:14.5px;font-weight:700;color:var(--ink);white-space:nowrap;}
.ord .amt .tot{margin-top:9px;padding-top:13px;border-top:1px solid var(--line);}
.ord .amt .tot span{font-size:13.5px;color:var(--gray);}
.ord .amt .tot b{font-size:22px;font-weight:800;letter-spacing:-1px;color:var(--brand);}
.ord .amt .due{margin-top:12px;background:var(--love-l);color:var(--love-d);border-radius:10px;padding:10px 13px;font-size:12.5px;font-weight:700;text-align:center;}
.ord .prog{display:flex;gap:6px;padding:0 20px 20px;}
.ord .prog span{flex:1;text-align:center;font-size:12.5px;font-weight:700;color:var(--gray-2);background:var(--line-2);border-radius:9px;padding:10px 6px;}
.ord .prog span.done{background:var(--grow-l);color:var(--grow-d);}
.ord .prog span.on{background:var(--brand);color:#fff;}
.ord .ft{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:14px 20px;border-top:1px solid var(--line-2);background:var(--paper);}
.ord .ft .right{margin-left:auto;display:flex;gap:8px;flex-wrap:wrap;}
.prod .wish.on{color:var(--love);background:#fff;}
@media (max-width:1280px){
  .ord .bd{grid-template-columns:180px 1fr 250px;gap:18px;}
}
@media (max-width:1100px){
  .ord .bd{grid-template-columns:200px 1fr;}
  .ord .amt{grid-column:1 / -1;border-left:0;border-top:1px solid var(--line-2);padding-left:0;padding-top:16px;}
  .ord .amt .due{text-align:left;}
}
@media (max-width:620px){
  .ord .bd{grid-template-columns:1fr;padding:18px 16px;}
  .ord .hd,.ord .ft{padding:12px 16px;}
  .ord .hd .st{margin-left:0;width:100%;}
  .ord dl{grid-template-columns:1fr;gap:3px 0;}
  .ord dt{margin-top:8px;}
  .ord .prog{flex-wrap:wrap;padding:0 16px 16px;}
  .ord .prog span{flex:0 0 calc(50% - 3px);}
  .ord .ft .right{margin-left:0;width:100%;}
  .sec-line{flex-wrap:wrap;}
}

/* =========================================================
   소셜(간편) 로그인 · 간편 가입
   ========================================================= */
.sns-div{display:flex;align-items:center;gap:14px;margin:26px 0 16px;font-size:12.5px;font-weight:600;color:var(--gray-2);white-space:nowrap;}
.sns-div::before,.sns-div::after{content:"";flex:1;height:1px;background:var(--line);}
.sns-list{display:grid;gap:9px;}
.sns-list.g2{grid-template-columns:1fr 1fr;}
.sns{position:relative;display:flex;align-items:center;justify-content:center;height:52px;border-radius:12px;border:1px solid transparent;font-size:15px;font-weight:700;letter-spacing:-.3px;transition:.15s;}
.sns svg{position:absolute;left:18px;width:19px;height:19px;}
.sns:hover{filter:brightness(.95);}
.sns.kakao{background:#FEE500;color:#191600;}
.sns.naver{background:#03C75A;color:#fff;}
.sns.google{background:#fff;color:#3C4043;border-color:#DADCE0;}
.sns.google:hover{background:#F7F8FA;filter:none;}
.sns.apple{background:#000;color:#fff;}
.sns-note{margin-top:14px;font-size:12.5px;color:var(--gray-2);line-height:1.75;text-align:center;}
.sns-note b{color:var(--gray);}
@media (max-width:620px){
  .sns-list.g2{grid-template-columns:1fr;}
  .sns{font-size:14.5px;}
  .sns svg{left:16px;}
}

/* =========================================================
   하나어이 미션 — 선교지 검색 · 카드 · 예약
   ========================================================= */
.mhero{position:relative;background:linear-gradient(152deg,#0E1E3C 0%,#1E3A6D 58%,#2C5289 130%);color:#fff;overflow:hidden;}
.mhero::after{content:"";position:absolute;right:-8%;top:-30%;width:620px;height:620px;border-radius:50%;background:radial-gradient(circle,rgba(197,101,46,.40),transparent 70%);}
.mhero .container{position:relative;z-index:2;padding:78px 24px 90px;}
.mhero .eyebrow{display:inline-block;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.22);border-radius:18px;padding:6px 16px;font-size:13px;font-weight:600;}
.mhero h1{margin-top:20px;font-size:46px;font-weight:800;letter-spacing:-2px;line-height:1.24;}
.mhero p{margin-top:18px;font-size:16px;color:rgba(255,255,255,.76);line-height:1.8;max-width:600px;}
.mhero .acts{margin-top:30px;display:flex;gap:10px;flex-wrap:wrap;}
.mhero .stats{margin-top:44px;display:flex;gap:46px;flex-wrap:wrap;}
.mhero .stats b{display:block;font-size:28px;font-weight:800;letter-spacing:-1px;}
.mhero .stats span{display:block;margin-top:5px;font-size:13px;color:rgba(255,255,255,.62);}

/* 검색 패널 */
.msearch{background:#fff;border:1px solid var(--line);border-radius:20px;padding:26px 28px;box-shadow:var(--sh-2);}
.msearch.float{margin-top:-44px;position:relative;z-index:5;}
.msearch h3{font-size:16px;font-weight:800;margin-bottom:18px;display:flex;align-items:center;gap:8px;}
.msearch h3 i{font-style:normal;}
.mrow{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
.mfield label{display:block;font-size:12.5px;font-weight:700;color:var(--gray);margin-bottom:6px;}
.mfield select,.mfield input{width:100%;height:46px;border:1px solid var(--line);border-radius:11px;padding:0 13px;background:#fff;font-size:14px;}
.mfield select:focus,.mfield input:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px rgba(30,58,109,.13);}
.mthemes{margin-top:18px;}
.mthemes .lb{font-size:12.5px;font-weight:700;color:var(--gray);margin-bottom:9px;}
.mthemes .chips{display:flex;gap:7px;flex-wrap:wrap;}
.mthemes .chips button{border:1px solid var(--line);border-radius:17px;padding:7px 15px;font-size:13px;color:var(--gray);background:#fff;transition:.14s;}
.mthemes .chips button:hover{border-color:var(--brand);color:var(--brand);}
.mthemes .chips button.on{background:var(--brand);border-color:var(--brand);color:#fff;font-weight:600;}
.msearch .acts{margin-top:20px;display:flex;gap:9px;align-items:center;}
.msearch .acts .btn{min-width:120px;}
.msearch .acts .reset{margin-left:auto;font-size:13px;color:var(--gray-2);text-decoration:underline;text-underline-offset:3px;background:none;}

/* 선교지 카드 */
.fgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
.fgrid.g4{grid-template-columns:repeat(4,1fr);}
.fcard{position:relative;display:block;background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;transition:.18s;}
.fcard:hover{border-color:var(--brand);box-shadow:var(--sh);transform:translateY(-3px);}
.fcard .th{display:block;position:relative;aspect-ratio:10/7;background:var(--sand);overflow:hidden;}
.fcard .th img{width:100%;height:100%;object-fit:cover;}
.fcard .flags{position:absolute;left:12px;top:12px;display:flex;gap:5px;}
.flag{font-size:11.5px;font-weight:800;border-radius:6px;padding:3px 9px;color:#fff;letter-spacing:-.2px;}
.flag.hot{background:var(--love);}
.flag.new{background:var(--brand);}
.flag.seat{background:rgba(14,30,60,.72);}
.fcard .bd{display:block;padding:16px 18px 18px;}
.fcard .loc{display:block;font-size:12.5px;color:var(--gray-2);font-weight:600;}
.fcard .tt{display:-webkit-box;margin-top:5px;font-size:16px;font-weight:800;line-height:1.45;letter-spacing:-.4px;color:var(--ink);-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:46px;}
.fcard .lead{display:-webkit-box;margin-top:9px;font-size:13px;color:var(--gray);line-height:1.6;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:42px;}
.fcard .meta{display:flex;gap:6px;flex-wrap:wrap;margin-top:12px;}
.fcard .meta span{font-size:11.5px;font-weight:600;color:var(--brand-d);background:var(--brand-l);border-radius:6px;padding:3px 8px;}
.fcard .fbot{display:flex;align-items:flex-end;justify-content:space-between;margin-top:14px;padding-top:12px;border-top:1px solid var(--line-2);}
.fcard .cost{font-size:12.5px;color:var(--gray);}
.fcard .cost b{display:block;margin-top:2px;font-size:18px;font-weight:800;color:var(--ink);letter-spacing:-.6px;}
.fcard .rate{font-size:12.5px;color:var(--gray-2);}
.fcard .rate em{font-style:normal;color:var(--love);font-weight:700;}
.empty-res{padding:70px 0;text-align:center;color:var(--gray-2);font-size:15px;}
.empty-res b{display:block;margin-bottom:8px;font-size:17px;color:var(--ink);}

/* 선교지 상세 */
.fv-top{display:grid;grid-template-columns:1fr 380px;gap:34px;align-items:start;}
.fv-gal{border-radius:16px;overflow:hidden;border:1px solid var(--line);}
.fv-gal img{width:100%;aspect-ratio:16/9;object-fit:cover;display:block;}
.fv-title h1{margin-top:14px;font-size:29px;font-weight:800;letter-spacing:-1px;line-height:1.35;}
.fv-title .loc{margin-top:10px;font-size:14px;color:var(--gray);}
.fv-spec{margin-top:22px;border-top:2px solid var(--brand);}
.fv-spec dl{display:grid;grid-template-columns:120px 1fr 120px 1fr;}
.fv-spec dt{padding:14px 16px;background:var(--sand);font-size:13.5px;color:var(--gray);border-bottom:1px solid var(--line);}
.fv-spec dd{padding:14px 16px;font-size:13.5px;font-weight:600;border-bottom:1px solid var(--line);}
.apply{position:sticky;top:144px;border:1px solid var(--line);border-radius:18px;padding:24px;background:#fff;box-shadow:var(--sh);}
.apply .lb{font-size:14px;font-weight:800;padding-bottom:12px;border-bottom:1.5px solid var(--ink);}
.apply .cost{margin-top:16px;}
.apply .cost span{font-size:13px;color:var(--gray-2);}
.apply .cost b{display:block;margin-top:4px;font-size:26px;font-weight:800;letter-spacing:-1.2px;}
.slot{margin-top:8px;border:1.5px solid var(--line);border-radius:12px;padding:14px 16px;cursor:pointer;transition:.14s;}
.slot:hover{border-color:var(--brand-l2);background:var(--paper);}
.slot.on{border-color:var(--brand);background:var(--brand-l);}
.slot .r1{display:flex;align-items:center;gap:8px;}
.slot .code{font-size:11.5px;font-weight:700;color:var(--gray-2);}
.slot .r2{margin-top:7px;font-size:15px;font-weight:800;letter-spacing:-.4px;}
.slot .r3{margin-top:5px;font-size:12.5px;color:var(--gray);}
.slot .r3 em{font-style:normal;color:var(--love-d);font-weight:700;}
.slot.full{opacity:.5;cursor:not-allowed;}
.apply .sum{margin-top:16px;padding-top:14px;border-top:1px solid var(--line-2);display:flex;align-items:center;}
.apply .sum span{font-size:13px;color:var(--gray);}
.apply .sum b{margin-left:auto;font-size:20px;font-weight:800;letter-spacing:-.8px;color:var(--brand);}
.apply .btns{margin-top:14px;display:grid;gap:8px;}

/* 후기 */
.rv-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
.rvcard{display:block;background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;transition:.18s;}
.rvcard:hover{border-color:var(--brand);box-shadow:var(--sh);transform:translateY(-3px);}
.rvcard .th{display:block;aspect-ratio:16/9;overflow:hidden;background:var(--sand);}
.rvcard .th img{width:100%;height:100%;object-fit:cover;}
.rvcard .bd{display:block;padding:18px 20px 20px;}
.rvcard .star{display:block;font-size:13px;color:var(--love);letter-spacing:1px;}
.rvcard .tt{display:-webkit-box;margin-top:7px;font-size:16.5px;font-weight:800;line-height:1.45;letter-spacing:-.4px;color:var(--ink);-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.rvcard .ex{display:-webkit-box;margin-top:10px;font-size:13.5px;color:var(--gray);line-height:1.68;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
.rvcard .who{display:flex;gap:10px;margin-top:14px;padding-top:12px;border-top:1px solid var(--line-2);font-size:12.5px;color:var(--gray-2);}
.rvcard .who i{font-style:normal;margin-left:auto;}

/* 지역 바로가기 */
.regions{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
.regions a{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:18px 20px;transition:.15s;}
.regions a:hover{border-color:var(--brand);box-shadow:var(--sh);}
.regions a i{width:42px;height:42px;border-radius:12px;background:var(--brand-l);color:var(--brand);display:flex;align-items:center;justify-content:center;font-size:19px;font-style:normal;flex:0 0 42px;}
.regions a b{display:block;font-size:15px;}
.regions a span{display:block;margin-top:3px;font-size:12.5px;color:var(--gray-2);}

@media (max-width:1280px){ .fgrid.g4{grid-template-columns:repeat(3,1fr);} }
@media (max-width:1100px){
  .mrow{grid-template-columns:repeat(2,1fr);}
  .fgrid,.fgrid.g4,.rv-grid{grid-template-columns:repeat(2,1fr);}
  .fv-top{grid-template-columns:1fr;}
  .apply{position:static;}
  .regions{grid-template-columns:repeat(2,1fr);}
  .mhero h1{font-size:36px;}
  .msearch.float{margin-top:-34px;}
}
@media (max-width:620px){
  .mrow{grid-template-columns:1fr;}
  .fgrid,.fgrid.g4,.rv-grid{grid-template-columns:1fr;}
  .regions{grid-template-columns:1fr;}
  .mhero h1{font-size:29px;}
  .mhero .container{padding:52px 24px 64px;}
  .fv-spec dl{grid-template-columns:100px 1fr;}
  .msearch{padding:20px 18px;}
}

/* =========================================================
   메인 배너 (롤링) · 프로모션 배너
   ========================================================= */
.banner{position:relative;overflow:hidden;background:var(--brand-dd);}
.banner .slides{position:relative;height:460px;}
.banner .slide{position:absolute;inset:0;opacity:0;transition:opacity .6s ease;}
.banner .slide.on{opacity:1;}
.banner .slide img{width:100%;height:100%;object-fit:cover;}
.banner .cap{position:absolute;inset:0;}
.banner .cap .container{height:100%;display:flex;flex-direction:column;justify-content:center;padding-bottom:54px;color:#fff;}
.banner .cap .eyebrow{display:inline-block;width:fit-content;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.26);border-radius:18px;padding:6px 16px;font-size:13px;font-weight:600;}
.banner .cap h2{margin-top:18px;font-size:42px;font-weight:800;letter-spacing:-1.8px;line-height:1.26;}
.banner .cap p{margin-top:16px;font-size:16px;color:rgba(255,255,255,.76);line-height:1.75;max-width:560px;}
.banner .cap .acts{margin-top:26px;display:flex;gap:10px;flex-wrap:wrap;}
.banner .ctrl{position:absolute;left:0;right:0;bottom:80px;z-index:3;}
.banner .ctrl .container{display:flex;align-items:center;gap:12px;}
.banner .dots{display:flex;gap:8px;}
.banner .dots button{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.34);transition:.18s;}
.banner .dots button.on{width:26px;border-radius:5px;background:var(--love);}
.banner .nav{margin-left:auto;display:flex;gap:7px;}
.banner .nav button{width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.22);color:#fff;font-size:15px;transition:.15s;}
.banner .nav button:hover{background:rgba(255,255,255,.26);}
.banner .count{font-size:12.5px;color:rgba(255,255,255,.62);font-weight:600;letter-spacing:.5px;}

.promo{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.promo a{position:relative;display:block;border-radius:16px;overflow:hidden;min-height:150px;transition:.18s;}
.promo a:hover{transform:translateY(-3px);box-shadow:var(--sh-2);}
.promo a img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.promo a .in{position:relative;z-index:2;padding:26px 28px;color:#fff;}
.promo a .in b{display:block;font-size:19px;font-weight:800;letter-spacing:-.6px;}
.promo a .in span{display:block;margin-top:8px;font-size:13.5px;color:rgba(255,255,255,.76);line-height:1.6;}
.promo a .in em{display:inline-block;margin-top:14px;font-style:normal;font-size:12.5px;font-weight:700;border-bottom:1px solid rgba(255,255,255,.5);padding-bottom:2px;}

/* =========================================================
   해외선교체험 — 서비스 선택 · 비용 계산
   ========================================================= */
.svc-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;}
.svc{border:1.5px solid var(--line);border-radius:16px;padding:20px 14px;background:#fff;text-align:center;transition:.16s;}
.svc:hover{border-color:var(--brand);transform:translateY(-2px);box-shadow:var(--sh);}
.svc.on{border-color:var(--brand);background:var(--brand-l);box-shadow:0 5px 18px rgba(30,58,109,.13);}
.svc i{display:block;font-style:normal;font-size:25px;margin-bottom:9px;}
.svc b{display:block;font-size:14.5px;font-weight:800;color:var(--ink);}
.svc span{display:block;margin-top:7px;font-size:11.5px;color:var(--gray-2);line-height:1.5;}
.svc.on span{color:var(--brand-d);}

.exp-tags{display:flex;gap:5px;flex-wrap:wrap;margin-top:10px;}
.etag{font-size:11.5px;font-weight:700;border-radius:6px;padding:3px 8px;background:var(--grow-l);color:var(--grow-d);}
.etag.pick{background:var(--brand-l);color:var(--brand);}
.etag.no{background:var(--line-2);color:var(--gray-2);}

.calc{border:1px solid var(--line);border-radius:18px;background:#fff;overflow:hidden;}
.calc .hd{background:var(--brand);color:#fff;padding:18px 24px;font-size:16px;font-weight:800;}
.calc .bd{padding:22px 24px;}
.calc .grp{padding:18px 0;border-bottom:1px solid var(--line-2);}
.calc .grp:first-child{padding-top:0;}
.calc .grp:last-child{border-bottom:0;padding-bottom:0;}
.calc .grp > .lb{display:flex;align-items:center;font-size:14px;font-weight:800;margin-bottom:12px;}
.calc .grp > .lb small{margin-left:auto;font-size:12px;font-weight:600;color:var(--gray-2);}
.stepper{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:10px;overflow:hidden;}
.stepper button{width:38px;height:40px;font-size:17px;color:var(--gray);background:#fff;}
.stepper button:hover{background:var(--brand-l);color:var(--brand);}
.stepper input{width:58px;height:40px;border:0;border-left:1px solid var(--line);border-right:1px solid var(--line);text-align:center;font-weight:800;font-size:15px;}
.opt-list{display:grid;gap:8px;}
.opt{display:flex;align-items:flex-start;gap:11px;border:1.5px solid var(--line);border-radius:12px;padding:13px 15px;cursor:pointer;transition:.14s;}
.opt:hover{border-color:var(--brand-l2);background:var(--paper);}
.opt.on{border-color:var(--brand);background:var(--brand-l);}
.opt input{margin-top:3px;width:17px;height:17px;accent-color:var(--brand);flex:0 0 17px;}
.opt .t{flex:1;}
.opt .t b{display:block;font-size:14px;}
.opt .t span{display:block;margin-top:4px;font-size:12px;color:var(--gray);line-height:1.5;}
.opt .p{font-size:13.5px;font-weight:800;color:var(--brand);white-space:nowrap;}
.opt .p.free{color:var(--grow-d);}
.chip-days{display:flex;gap:7px;flex-wrap:wrap;}
.chip-days button{border:1.5px solid var(--line);border-radius:11px;padding:10px 18px;font-size:14px;font-weight:700;color:var(--gray);background:#fff;transition:.14s;}
.chip-days button:hover{border-color:var(--brand);color:var(--brand);}
.chip-days button.on{background:var(--brand);border-color:var(--brand);color:#fff;}
.bill{background:var(--sand);border-radius:14px;padding:18px 20px;margin-top:18px;}
.bill .row{display:flex;font-size:13.5px;color:var(--gray);padding:5px 0;}
.bill .row b{margin-left:auto;color:var(--ink);font-weight:700;}
.bill .row.mute{color:var(--gray-2);}
.bill .tot{display:flex;align-items:baseline;margin-top:14px;padding-top:14px;border-top:1.5px solid var(--line);}
.bill .tot span{font-size:14px;font-weight:800;}
.bill .tot b{margin-left:auto;font-size:27px;font-weight:800;letter-spacing:-1.2px;color:var(--brand);}
.bill .per{margin-top:6px;text-align:right;font-size:12.5px;color:var(--gray-2);}
.pick-box{display:flex;align-items:center;gap:14px;border:1.5px solid var(--line);border-radius:14px;padding:16px 18px;}
.pick-box.ok{border-color:var(--grow);background:var(--grow-l);}
.pick-box.no{border-color:var(--line);background:var(--paper);}
.pick-box i{font-style:normal;font-size:22px;}
.pick-box b{display:block;font-size:14.5px;}
.pick-box span{display:block;margin-top:4px;font-size:12.5px;color:var(--gray);line-height:1.55;}

/* =========================================================
   고객지원 — 공지 · FAQ · 1:1 문의
   ========================================================= */
.nlist{border-top:2px solid var(--brand);}
.nlist a{display:flex;align-items:center;gap:16px;padding:18px 8px;border-bottom:1px solid var(--line-2);transition:.14s;}
.nlist a:hover{background:var(--paper);}
.nlist .cat{flex:0 0 66px;font-size:11.5px;font-weight:800;text-align:center;border-radius:8px;padding:4px 0;background:var(--brand-l);color:var(--brand);}
.nlist .cat.mo{background:var(--love-l);color:var(--love-d);}
.nlist .cat.sa{background:#F6E4E3;color:#9C3B37;}
.nlist .cat.sy{background:var(--line-2);color:var(--gray);}
.nlist .tt{flex:1;font-size:15px;font-weight:600;color:var(--ink);}
.nlist .tt .pin{display:inline-block;margin-right:8px;font-size:11px;font-weight:800;color:#fff;background:var(--love);border-radius:5px;padding:2px 7px;vertical-align:1px;}
.nlist .dt{font-size:12.5px;color:var(--gray-2);white-space:nowrap;}
.nlist .vw{font-size:12.5px;color:var(--gray-2);white-space:nowrap;width:76px;text-align:right;}

.acc{border-top:2px solid var(--brand);}
.acc .item{border-bottom:1px solid var(--line-2);}
.acc .q{display:flex;align-items:center;gap:14px;padding:19px 8px;cursor:pointer;}
.acc .q .mark{flex:0 0 28px;height:28px;border-radius:8px;background:var(--brand);color:#fff;font-size:13px;font-weight:800;display:flex;align-items:center;justify-content:center;}
.acc .q .cat{font-size:11.5px;font-weight:700;border-radius:7px;padding:3px 9px;background:var(--grow-l);color:var(--grow-d);white-space:nowrap;}
.acc .q .t{flex:1;font-size:15px;font-weight:600;}
.acc .q .ar{color:var(--gray-2);transition:.2s;font-size:13px;}
.acc .item.on .q .ar{transform:rotate(180deg);}
.acc .a{display:none;gap:14px;padding:0 8px 22px 50px;font-size:14px;color:var(--gray);line-height:1.85;}
.acc .item.on .a{display:block;}
.acc .a .mark{display:inline-flex;width:28px;height:28px;border-radius:8px;background:var(--love-l);color:var(--love-d);font-size:13px;font-weight:800;align-items:center;justify-content:center;margin-right:10px;vertical-align:-8px;}

@media (max-width:1280px){ .svc-grid{grid-template-columns:repeat(3,1fr);} }
@media (max-width:1100px){
  .banner .slides{height:380px;}
  .banner .cap h2{font-size:30px;}
  .promo{grid-template-columns:1fr;}
}
@media (max-width:620px){
  .banner .slides{height:340px;}
  .banner .cap h2{font-size:24px;}
  .banner .cap p{font-size:14px;}
  .svc-grid{grid-template-columns:repeat(2,1fr);}
  .nlist a{flex-wrap:wrap;gap:8px;} .nlist .tt{flex:1 1 100%;order:3;} .nlist .vw{display:none;}
  .acc .a{padding-left:8px;}
}

/* GNB 항목 증가 대응 — 8개 메뉴 기준 간격 조정 */
.gnb{margin-left:4px;flex:1;min-width:0;}
.gnb>ul{gap:22px;}
.gnb>ul>li>a{font-size:15px;}
.head-util{flex:0 0 auto;}
@media (max-width:1439px){ .gnb>ul{gap:16px;} .gnb>ul>li>a{font-size:14.5px;} .head-util .txt{display:none;} }
@media (max-width:1279px){ .gnb>ul{gap:12px;} .gnb>ul>li>a{font-size:14px;} }

/* 메인 배너 — 사진 배경 가독성 오버레이 */
.banner .slide::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(90deg,rgba(14,30,60,.82) 0%,rgba(14,30,60,.62) 38%,rgba(14,30,60,.18) 70%,rgba(14,30,60,0) 100%),
             linear-gradient(0deg,rgba(14,30,60,.55) 0%,rgba(14,30,60,0) 34%);}
.banner .slide .cap{z-index:2;}
.banner .cap h2,.banner .cap p{text-shadow:0 2px 14px rgba(0,0,0,.28);}
@media (max-width:620px){ .banner .slide::after{background:rgba(14,30,60,.66);} }