/*
 * 홈(index.html) 전용 스타일 — 새 디자인(Main·Mobile·Mobile2)
 * 공통 기반은 /css/site.css. 여기에는 홈에만 쓰는 구역·효과만 둔다.
 * 구역: 1 첫 화면(부채·리본·이름) 2 인사 3 신당·무구 4 다섯 빛깔 5 상담 안내(+안내 글)
 *       6 걸어온 길 7 무대와 방송 8 후기 9 꿈해몽(site.css) 10 오시는 길 11 모바일(900px 이하)
 * 움직임 줄이기는 site.css 맨 끝 규칙이 모든 animation·transition을 끈다(부채는 펼친 모양으로 멈춘다).
 */

/* ===== 0. 공통 ===== */
.home{font-size:19px;line-height:1.85;color:#1B1714;overflow-x:clip}
.home :where(p,h1,h2,h3,dl,dd,figure,blockquote){margin:0}
.sm{font-family:'Song Myung','Noto Serif KR',serif}
.lbl{display:inline-flex;align-items:center;gap:12px;font-size:17px;font-weight:700;letter-spacing:.14em}
.h-sec{max-width:1360px;margin:0 auto;box-sizing:border-box}
.h-h2-60{font-weight:900;font-size:60px;line-height:1.22;letter-spacing:-.02em}
.h-ink{color:#463F38}
.h-red{color:#B8231B}
.b1{background:#2457B3}.b2{background:#D3382C}.b3{background:#EDBE2F}.b4{background:#FFFFFF}.b5{background:#3C9D46}
.h-link{display:inline-flex;align-items:center;gap:10px;min-height:48px;font-size:19px;font-weight:700;text-underline-offset:6px}
.on-dark .btn-white{background:#FFFFFF;color:#1B1714}
.btn-white{background:#FFFFFF;color:#1B1714}.btn-white::before{background:#EDBE2F}.btn-white:hover,.on-dark .btn-white:hover{color:#1B1714}
.btn svg{flex:none;transition:transform .35s ease}.btn:hover svg{transform:translateX(4px)}
.zoom{overflow:hidden}.zoom img{transition:transform 1s cubic-bezier(.2,.8,.2,1)}.zoom:hover img{transform:scale(1.05)}
.h-callt-n,.h-callt-l{display:none}
.m-br{display:none}
.h-greet-h,.h-h2-60,.h-card h3,.tl-t,.tl-d,.vt,.pr-n,.h-modes>div,.h-media-p,.h-c-p,.h-v-dl dd,.h-rev-big blockquote,.h-rev-s blockquote,.gdesc,.ob-tx{word-break:keep-all;overflow-wrap:break-word}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.rv-in .stag>*{animation:fadeUp .9s cubic-bezier(.2,.8,.2,1) both}
.rv-in .stag>*:nth-child(2){animation-delay:.07s}.rv-in .stag>*:nth-child(3){animation-delay:.14s}.rv-in .stag>*:nth-child(4){animation-delay:.21s}.rv-in .stag>*:nth-child(5){animation-delay:.28s}.rv-in .stag>*:nth-child(6){animation-delay:.35s}.rv-in .stag>*:nth-child(7){animation-delay:.42s}.rv-in .stag>*:nth-child(8){animation-delay:.49s}.rv-in .stag>*:nth-child(9){animation-delay:.56s}.rv-in .stag>*:nth-child(10){animation-delay:.63s}

/* ===== 1. 첫 화면 ===== */
.h-hero{max-width:1360px;margin:0 auto;padding:24px 40px 100px;box-sizing:border-box;display:flex;flex-wrap:wrap;align-items:center;gap:40px 48px}
.h-txt{flex:1 1 560px;min-width:0;position:relative;z-index:3;display:flex;flex-direction:column;gap:24px}
.h-lbl{align-self:flex-start;color:#B8231B}
.h-h1{display:flex;flex-direction:column;gap:10px;font-weight:400}
.h-h1-a{font-size:54px;line-height:1;color:#B8231B}
.h-name{font-weight:900;font-size:184px;line-height:.98;letter-spacing:-.04em;color:#1B1714}
.ch{display:inline-block;animation:chUp 1.1s cubic-bezier(.2,.8,.2,1) both}
.ch2{animation-delay:.12s}.ch3{animation-delay:.24s}
@keyframes chUp{from{opacity:0;transform:translateY(60%) rotate(5deg)}to{opacity:1;transform:none}}
.hup{animation:fadeUp 1s cubic-bezier(.2,.8,.2,1) both}
.hd1{animation-delay:.35s}.hd2{animation-delay:.5s}.hd3{animation-delay:.65s}.hd4{animation-delay:.8s}.hd5{animation-delay:.95s}
.h-tag{font-weight:700;font-size:44px;line-height:1.38}
.h-lead{max-width:540px;font-size:20px;line-height:1.85;color:#463F38}
.h-btns{display:flex;flex-wrap:wrap;gap:14px;margin-top:6px}
.h-callt-n{display:none}
.h-time{font-size:17px;color:#6B6158}
.h-seo{max-width:560px;font-size:16px;line-height:1.7;color:#6B6158}
.h-seo .h-hash{margin-top:6px;font-weight:700;color:#B8231B}

/* 부채·사진·리본 무대 (--u: 데스크톱 1px, 모바일은 무대 폭 ÷ 390) */
.hv{flex:1 1 520px;min-width:520px;position:relative;container-type:inline-size}
.hv-in{--u:1px;position:relative;height:720px}
.ribbons{animation:fadeIn 1.6s .9s ease both}
.ribs-a{position:absolute;right:0;top:-40px;width:196px;height:660px;z-index:0}
.rod{position:absolute;top:0;left:-8px;right:-8px;height:7px;background:#1B1714;border-radius:4px}
.rib{position:absolute;top:4px;width:30px;transform-origin:50% 0;animation:sway 6s ease-in-out infinite alternate;clip-path:polygon(0 0,100% 0,100% 100%,50% 94%,0 100%);background-image:linear-gradient(90deg,rgba(255,255,255,.24),rgba(255,255,255,0) 38%,rgba(0,0,0,.12) 72%,rgba(255,255,255,.1))}
.rib-w{box-shadow:inset 0 0 0 1px rgba(27,23,20,.18)}
.rib1{left:6px;height:600px;background-color:#2457B3;animation-duration:5.4s}
.rib2{left:44px;height:540px;background-color:#D3382C;animation-duration:6.2s;animation-delay:-1.4s}
.rib3{left:82px;height:640px;background-color:#EDBE2F;animation-duration:5.8s;animation-delay:-2.6s}
.rib4{left:120px;height:520px;background-color:#FFFFFF;animation-duration:6.8s;animation-delay:-.8s}
.rib5{left:158px;height:580px;background-color:#3C9D46;animation-duration:6s;animation-delay:-3.2s}
@keyframes sway{from{transform:rotate(-3.2deg) skewX(2.5deg)}to{transform:rotate(3.2deg) skewX(-2.5deg)}}

.fan-wrap{position:absolute;left:50%;top:26px;translate:-50% 0;width:720px;height:374px;z-index:1;transform-origin:50% 96%;animation:fanSway 7s ease-in-out 2.4s infinite alternate}
@keyframes fanSway{from{rotate:-1.4deg}to{rotate:1.4deg}}
.fan{display:block;width:100%;height:100%;overflow:visible}
.fan .w{transform-box:view-box;transform-origin:500px 500px;transform:rotate(var(--r));animation:fanOpenA 1.7s cubic-bezier(.16,.84,.3,1) both;animation-delay:calc(.25s + var(--i) * 50ms)}
.fan.fb .w{animation-name:fanOpenB;animation-delay:calc(var(--i) * 50ms)}
.fan.fa2 .w{animation-name:fanOpenA;animation-delay:calc(var(--i) * 50ms)}
@keyframes fanOpenA{from{transform:rotate(0deg)}to{transform:rotate(var(--r))}}
@keyframes fanOpenB{from{transform:rotate(0deg)}to{transform:rotate(var(--r))}}
.w0{--r:0deg;--i:0}.w1{--r:11.25deg;--i:1}.w2{--r:22.5deg;--i:2}.w3{--r:33.75deg;--i:3}.w4{--r:45deg;--i:4}.w5{--r:56.25deg;--i:5}.w6{--r:67.5deg;--i:6}.w7{--r:78.75deg;--i:7}.w8{--r:90deg;--i:8}.w9{--r:101.25deg;--i:9}.w10{--r:112.5deg;--i:10}.w11{--r:123.75deg;--i:11}.w12{--r:135deg;--i:12}.w13{--r:146.25deg;--i:13}.w14{--r:157.5deg;--i:14}.w15{--r:168.75deg;--i:15}

.h-arch-fig{position:absolute;left:50%;top:118px;translate:-50% 0;width:404px;z-index:2;display:flex;flex-direction:column;align-items:center}
.h-arch{width:400px;height:533px;box-sizing:border-box;border:10px solid #FAF6EE;outline:2px solid #1B1714;border-radius:200px 200px 0 0;background:#E9DFC9}
.arch{animation:archIn 1.3s .1s cubic-bezier(.2,.8,.2,1) both}
@keyframes archIn{from{opacity:0;transform:translateY(40px)}to{opacity:1;transform:none}}
.h-arch img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 18%}
.h-bar{display:flex;width:404px;height:16px;box-sizing:border-box;border:2px solid #1B1714;border-top:none}
.h-bar span{flex:1}
.h-arch-fig figcaption{margin-top:12px;font-size:15px;line-height:1.5;color:#6B6158;text-align:center}
.fan-hint{display:inline-flex;align-items:center;margin-top:6px;font-size:15px;font-weight:700;color:#B8231B}
.fan-hit{position:absolute;left:0;right:0;top:0;height:650px;z-index:4;background:transparent;border:none;padding:0;cursor:pointer}
.jihwa{position:absolute;left:-44px;top:446px;width:214px;height:auto;z-index:3;pointer-events:none;animation:popIn 1.1s 1.2s cubic-bezier(.2,.8,.2,1) both,jihwaFloat 6s ease-in-out 2.3s infinite alternate}
@keyframes popIn{from{opacity:0;transform:translateY(40px) scale(.8)}to{opacity:1;transform:none}}
@keyframes jihwaFloat{from{transform:translateY(0)}to{transform:translateY(-10px) rotate(-1.5deg)}}

/* ===== 2. 인사 ===== */
.h-greet{padding:100px 40px 110px}
.h-greet-in{display:flex;flex-wrap:wrap;gap:64px 96px;align-items:center}
.h-greet-fig{flex:0 1 440px;display:flex;flex-direction:column;gap:14px}
.h-photo{display:flex;box-shadow:16px 16px 0 #EDBE2F}
.h-cbar{display:flex;flex:none}
.h-cbar span{width:7px}
.h-photo-box{flex:1;border:2px solid #1B1714;border-left:none}
.h-photo-box img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;object-position:50% 30%}
.h-greet-fig figcaption,.h-shf1 figcaption,.h-shf2 figcaption{margin-top:12px;font-size:15px;line-height:1.5;color:#6B6158}
.h-greet-txt{flex:1 1 520px;min-width:0;display:flex;flex-direction:column;gap:22px}
.h-greet-h{font-weight:700;font-size:50px;line-height:1.42}
.h-sign{display:flex;align-items:center;gap:18px;margin-top:12px}
.h-seal{width:64px;height:64px;font-size:24px}
.h-sign-n{font-size:36px;line-height:1.2}

/* ===== 3. 신당·무구 ===== */
.h-shrine{padding:60px 40px 120px}
.h-shhead{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:24px 64px;margin-bottom:52px}
.h-shhead-l{display:flex;flex-direction:column;gap:18px}
.h-shhead-p{max-width:460px}
.h-shphotos{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:28px;align-items:start}
.h-shf1,.h-shf2{display:flex;flex-direction:column;gap:12px}
.h-shf2{margin-top:80px}
.h-frame{border:2px solid #1B1714}
.h-frame img{display:block;width:100%;height:auto}
.h-sh-r{box-shadow:16px 16px 0 #D3382C}.h-sh-r img{aspect-ratio:16/10;object-fit:cover}
.h-sh-b{box-shadow:16px 16px 0 #2457B3}.h-sh-b img{aspect-ratio:820/564;object-fit:cover}
.h-gear{margin-top:96px}
.h-gear-hd{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:12px 24px;padding-bottom:18px;border-bottom:2px solid #1B1714;margin-bottom:36px}
.h-gear-hd h3{font-weight:900;font-size:34px;line-height:1.3}
.tap{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;background:#B8231B;color:#FFFFFF;font-size:15px;font-weight:700;animation:tapPulse 2.4s ease-in-out infinite}
@keyframes tapPulse{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
.h-gear-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:40px}
.gear{display:flex;flex-direction:column;gap:12px;align-items:flex-start;text-align:left;background:none;border:none;padding:0;margin:0;font:inherit;color:inherit}
.gear-box{position:relative;display:block;width:100%;aspect-ratio:4/5}
.gear-img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.gear:hover .gear-img{transform:translateY(-10px) rotate(-3deg)}
.flags-img{transform-origin:50% 100%}
.gear:hover .flags-img{animation:wave 1.4s ease-in-out infinite alternate}
@keyframes wave{from{transform:translateY(-8px) skewX(-3deg)}to{transform:translateY(-8px) skewX(3deg)}}
.gname{font-weight:900;font-size:30px;line-height:1.3}
.gname .han{font-size:22px;color:#B8231B}
.gdesc{font-size:17px;line-height:1.7;color:#463F38}
.bell-btn{cursor:pointer}
.bell-img{transform-origin:50% 5%}
.bell-btn:hover .bell-img{transform:rotate(-7deg)}
.shake-a{animation:shakeA 1.1s cubic-bezier(.36,.07,.19,.97) both}
.shake-b{animation:shakeB 1.1s cubic-bezier(.36,.07,.19,.97) both}
@keyframes shakeA{0%,100%{transform:rotate(0)}12%{transform:rotate(-16deg)}26%{transform:rotate(14deg)}40%{transform:rotate(-10deg)}55%{transform:rotate(7deg)}70%{transform:rotate(-4deg)}85%{transform:rotate(2deg)}}
@keyframes shakeB{0%,100%{transform:rotate(0)}12%{transform:rotate(-16deg)}26%{transform:rotate(14deg)}40%{transform:rotate(-10deg)}55%{transform:rotate(7deg)}70%{transform:rotate(-4deg)}85%{transform:rotate(2deg)}}
.ring{position:absolute;left:10%;top:22%;width:80%;aspect-ratio:1/1;border:3px solid #D3382C;border-radius:50%;opacity:0;pointer-events:none}
.ring.shake-a{animation:ringA 1.3s ease-out both}.ring.shake-b{animation:ringB 1.3s ease-out both}
.ring.r2.shake-a,.ring.r2.shake-b{animation-delay:.18s;border-color:#EDBE2F}
@keyframes ringA{from{opacity:.85;transform:scale(.45)}to{opacity:0;transform:scale(1.4)}}
@keyframes ringB{from{opacity:.85;transform:scale(.45)}to{opacity:0;transform:scale(1.4)}}

/* ===== 4. 다섯 빛깔 ===== */
.h-obang{background:#F2EBDC;border-top:2px solid #1B1714;border-bottom:2px solid #1B1714}
.h-obang-in{max-width:1360px;margin:0 auto;padding:110px 40px;box-sizing:border-box;display:flex;flex-wrap:wrap;gap:48px 80px}
.h-obang-l{flex:1 1 340px;display:flex;flex-direction:column;gap:20px}
.h-flags{display:inline-flex;gap:4px}
.h-pick{font-weight:700;color:#B8231B}
.h-obang-r{flex:1.6 1 600px;min-width:0;display:flex;flex-direction:column}
.ob-row{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin-bottom:26px}
.ob-btn{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:118px;padding:0;border:2px solid #1B1714;cursor:pointer;font:inherit;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s}
.ob-btn:hover{transform:translateY(-6px)}
.ob-btn.on{transform:translateY(-12px);box-shadow:0 14px 0 -4px #1B1714}
.ob-han{font-size:44px;line-height:1.15}
.ob-nm{font-size:17px;font-weight:700;line-height:1.4}
.o-blue{background:#1E4690;color:#FFFFFF}.o-red{background:#B8231B;color:#FFFFFF}.o-yellow{background:#EDBE2F;color:#1B1714}.o-white{background:#FFFFFF;color:#1B1714}.o-black{background:#1B1714;color:#FFFFFF}
.ob-panel{position:relative;overflow:hidden;border:2px solid #1B1714;box-sizing:border-box;display:flex;flex-wrap:wrap;align-items:center;gap:24px 48px;padding:40px 48px;min-height:320px}
.ob-panel[hidden]{display:none}
.ox-blue{--ox:10%}.ox-red{--ox:30%}.ox-yellow{--ox:50%}.ox-white{--ox:70%}.ox-black{--ox:90%}
.pa{animation:obA .85s cubic-bezier(.2,.8,.2,1) both}.pb{animation:obB .85s cubic-bezier(.2,.8,.2,1) both}
@keyframes obA{from{clip-path:circle(0% at var(--ox) 0%)}to{clip-path:circle(160% at var(--ox) 0%)}}
@keyframes obB{from{clip-path:circle(0% at var(--ox) 0%)}to{clip-path:circle(160% at var(--ox) 0%)}}
.ob-bigh{font-size:190px;line-height:1}
.ha{display:inline-block;animation:hanA 1s .12s cubic-bezier(.2,.8,.2,1) both}.hb{display:inline-block;animation:hanB 1s .12s cubic-bezier(.2,.8,.2,1) both}
@keyframes hanA{from{opacity:0;transform:scale(.55) rotate(-10deg)}to{opacity:1;transform:none}}
@keyframes hanB{from{opacity:0;transform:scale(.55) rotate(-10deg)}to{opacity:1;transform:none}}
.ob-body{flex:1 1 300px;display:flex;flex-direction:column;gap:16px}
.ob-full{font-weight:900;font-size:40px;line-height:1.2}
.ob-dl{display:grid;grid-template-columns:76px minmax(0,1fr);gap:6px 12px;font-size:19px;line-height:1.6}
.ob-dl dd{font-weight:700}
.ob-tx{font-size:19px;line-height:1.75}

/* ===== 5. 상담 안내 ===== */
.h-consult{background:#EDBE2F;color:#1B1714;border-bottom:2px solid #1B1714}
.h-consult-in{max-width:1360px;margin:0 auto;padding:120px 40px;box-sizing:border-box;display:flex;flex-wrap:wrap;gap:56px 96px}
.h-con-l{flex:1 1 380px;display:flex;flex-direction:column;gap:22px}
.h-c-h{line-height:1.2}
.h-c-ul{list-style:none;margin:4px 0 0;padding:0;display:flex;flex-direction:column;gap:12px}
.h-c-ul li{display:flex;gap:14px;align-items:baseline}
.dia{flex:none;width:11px;height:11px;background:#1B1714;transform:rotate(45deg) translateY(-3px)}
.h-c-btns{display:flex;flex-wrap:wrap;gap:14px;margin-top:14px}
.h-con-r{flex:1.3 1 520px;min-width:0}
.h-prices{border-top:3px solid #1B1714}
.pr{display:flex;align-items:baseline;gap:14px;padding:17px 6px;border-bottom:2px solid rgba(27,23,20,.2);transition:background .3s,padding .3s}
.pr:hover{background:rgba(255,255,255,.45);padding-left:16px}
.pr-n{font-weight:700;font-size:26px;line-height:1.35}
.pr-note{font-size:16px;color:#3D362F}
.pr .lead{flex:1;min-width:20px;border-bottom:2px dotted rgba(27,23,20,.4);transform:translateY(-7px)}
.pr-p{font-weight:900;font-size:28px;white-space:nowrap}
.h-modes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:28px}
.h-modes>div{padding:22px 26px;background:rgba(255,255,255,.55);border:2px solid #1B1714;display:flex;flex-direction:column;gap:4px}
.h-modes .hj{font-weight:900;font-size:22px}
.h-modes span:last-child{font-size:17px;line-height:1.7}

/* 상담 안내 글(원문 보존) */
.h-intro{border-bottom:2px solid #1B1714}
.h-intro-in{max-width:1360px;margin:0 auto;padding:96px 40px 110px;box-sizing:border-box}
.h-intro-hd{margin-bottom:40px}
.h-intro-h{font-weight:900;font-size:44px;line-height:1.3;margin-bottom:8px}
.h-intro-hd p{font-size:19px;color:#463F38}
.h-intro-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;align-items:start}
.h-card{padding:28px 30px 32px;background:#FFFFFF;border:2px solid #1B1714;box-shadow:10px 10px 0 #EDBE2F}
.h-card h3{font-weight:700;font-size:24px;line-height:1.4;margin-bottom:14px}
.h-card p{font-size:17px;line-height:1.95;color:#2E2925}
.h-card a{color:#B8231B;text-underline-offset:4px;font-weight:700}

/* ===== 6. 걸어온 길 ===== */
.h-path{padding:120px 40px}
.h-path-in{display:flex;flex-wrap:wrap;gap:56px 80px}
.h-path-l{flex:1 1 380px;display:flex;flex-direction:column;gap:22px}
.h-path-ph{position:relative;height:560px;margin-top:24px}
.h-pp1{position:absolute;left:0;top:0;width:64%;border:2px solid #1B1714;box-shadow:16px 16px 0 #2457B3}
.h-pp1 img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;object-position:50% 25%}
.h-pp2{position:absolute;right:0;bottom:0;width:54%;border:2px solid #1B1714;box-shadow:16px 16px 0 #D3382C}
.h-pp2 img{display:block;width:100%;height:auto;aspect-ratio:1/1;object-fit:cover;object-position:78% 40%}
.tl{position:relative;flex:1.4 1 560px;min-width:0;list-style:none;margin:0;padding:0;border-top:3px solid #1B1714}
.tl::before{content:"";position:absolute;left:181px;top:0;bottom:0;width:2px;background:rgba(27,23,20,.18)}
.tl-row{position:relative;display:grid;grid-template-columns:150px 24px minmax(0,1fr);gap:0 22px;align-items:baseline;padding:17px 0;border-bottom:1px solid rgba(27,23,20,.12)}
.tl-y{font-weight:900;font-size:40px;line-height:1.1}
.tl-f{justify-self:center;transform:translateY(3px)}
.tl-b{display:flex;flex-direction:column;gap:4px}
.tl-t{font-weight:700;font-size:23px;line-height:1.4}
.tl-d{font-size:17px;line-height:1.65;color:#463F38}

/* ===== 7. 무대와 방송 ===== */
.h-media{background:#1E4690;color:#FFFFFF;border-top:2px solid #1B1714}
.mq-box{overflow:hidden;border-bottom:2px solid rgba(255,255,255,.25);padding:24px 0}
.mq{display:flex;width:max-content;animation:mq 40s linear infinite}
.mq-box:hover .mq{animation-play-state:paused}
@keyframes mq{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.mq-i{display:inline-flex;align-items:center;gap:30px;padding-right:30px;font-weight:900;font-size:40px;line-height:1.3;white-space:nowrap}
.mq-i .mq-f{width:18px;height:18px}
.h-media-in{max-width:1360px;margin:0 auto;padding:100px 40px 120px;box-sizing:border-box}
.h-media-hd{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:20px 48px;margin-bottom:52px}
.h-media-hl{display:flex;flex-direction:column;gap:18px}
.h-media-hl .lbl{color:#FFFFFF}
.h-media-p{max-width:420px;font-size:19px;color:#E3E9F5}
.h-media-h3{font-weight:700;font-size:26px;line-height:1.4;margin-bottom:24px}
.h-vids{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
.vcard{display:flex;flex-direction:column;gap:14px;text-decoration:none;color:#FFFFFF}
.on-dark .vcard:hover{color:#FFFFFF}
.vthumb{position:relative;display:block;border:8px solid #FFFFFF;overflow:hidden;background:#0F2C5E}
.vthumb img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;transition:transform .9s cubic-bezier(.2,.8,.2,1)}
.vcard:hover .vthumb img{transform:scale(1.06)}
.vplay{position:absolute;left:50%;top:50%;translate:-50% -50%;width:76px;height:76px;border-radius:50%;background:#FFFFFF;display:grid;place-items:center;transition:background .3s,scale .3s}
.vcard:hover .vplay{background:#D3382C;scale:1.08}
.vplay svg{fill:#1B1714;transition:fill .3s}.vcard:hover .vplay svg{fill:#FFFFFF}
.vd{font-size:16px;font-weight:700;letter-spacing:.04em;color:#EDBE2F}
.vt{font-family:'Hahmlet',serif;font-weight:700;font-size:24px;line-height:1.4}
.vcard:hover .vt{text-decoration:underline;text-underline-offset:6px}
.h-media-n{margin-top:32px;font-size:16px;color:#D5DEF2}
.h-media-links{display:flex;flex-wrap:wrap;gap:6px 40px;margin-top:14px}

/* ===== 8. 후기 ===== */
.h-reviews{padding:120px 40px}
.h-rev-hd{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:20px 48px;margin-bottom:48px}
.h-rev-hl{display:flex;flex-direction:column;gap:18px}
.h-rev-st{font-size:18px;line-height:1.7;color:#463F38}
.h-rev-st strong{color:#1B1714}
.h-rev-grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:32px}
.h-rev-big{padding:48px 48px 40px;background:#FFFFFF;border:2px solid #1B1714;box-shadow:12px 12px 0 #D3382C;display:flex;flex-direction:column;justify-content:space-between;gap:26px}
.h-q{font-size:120px;line-height:.6;color:#D3382C}
.h-rev-big blockquote{font-weight:700;font-size:38px;line-height:1.55}
.h-rev-big figcaption{font-size:16px;color:#6B6158}
.h-rev-side{display:flex;flex-direction:column;gap:24px}
.h-rev-s{padding:30px 32px;background:#FFFFFF;border:2px solid #1B1714;display:flex;flex-direction:column;gap:12px}
.h-rev-s blockquote{font-size:19px;line-height:1.8}
.h-rev-s figcaption{font-size:15px;color:#6B6158}
.h-rev-side .h-link{align-self:flex-start}

/* ===== 10. 오시는 길 ===== */
.h-visit{position:relative;overflow:hidden;background:#1B1714;color:#FFFFFF}
.ribs-b{position:absolute;right:72px;top:10px;width:196px;height:320px;z-index:0}
.ribs-b .rod{background:#FFFFFF}
.ribs-b .rib1{height:260px}.ribs-b .rib2{height:220px}.ribs-b .rib3{height:290px}.ribs-b .rib4{height:200px}.ribs-b .rib5{height:240px}
.h-visit-in{position:relative;z-index:1;max-width:1360px;margin:0 auto;padding:110px 40px 56px;box-sizing:border-box}
.h-v-btns{display:flex;flex-wrap:wrap;gap:14px;margin-top:36px}
.h-v-note{margin-top:18px;font-size:17px;color:#D6CDC1}
.h-v-grid{display:flex;flex-wrap:wrap;gap:48px 96px;margin-top:72px;padding-top:48px;border-top:1px solid rgba(255,255,255,.22)}
.h-v-l{flex:1 1 440px;display:flex;flex-direction:column;gap:18px}
.h-v-l h3{font-weight:900;font-size:32px}
.h-v-dl{display:grid;grid-template-columns:70px minmax(0,1fr);gap:10px 18px;font-size:19px;line-height:1.6}
.h-v-dl dt{color:#EDBE2F}
.h-v-r{flex:1 1 420px;display:flex;flex-direction:column;gap:22px}
.h-walk{display:flex;align-items:center;gap:16px;padding:18px 0}
.h-w-n{display:flex;flex-direction:column;align-items:center;gap:8px;flex:none;font-size:16px}
.h-w-c{width:58px;height:58px;box-sizing:border-box;border-radius:50%;border:3px solid #FFFFFF;display:grid;place-items:center;font-weight:700;font-size:17px}
.h-w-s{width:58px;height:58px;font-size:20px}
.h-w-m{flex:1;display:flex;flex-direction:column;align-items:center;gap:10px;transform:translateY(-14px)}
.walk{display:block;width:100%;height:4px;background-image:repeating-linear-gradient(90deg,#EDBE2F 0 14px,transparent 14px 26px);animation:walk 1.1s linear infinite}
@keyframes walk{from{background-position:0 0}to{background-position:26px 0}}
.h-w-t{font-size:16px;font-weight:700;color:#EDBE2F}
.h-map{align-self:flex-start}

/* ===== 꿈해몽(공용 .dream는 site.css) ===== */
.m-hide{display:list-item}

/* ===== 11. 모바일·좁은 화면 (900px 이하) ===== */
@media (max-width:1100px){
  .h-intro-grid{grid-template-columns:minmax(0,1fr)}
  .h-vids{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:900px){
  .home{font-size:17px;line-height:1.8}
  .m-br{display:inline}
  .d-br{display:none}
  .lbl{gap:10px;font-size:15px;letter-spacing:.12em}
  .h-h2-60{font-size:34px;line-height:1.3;letter-spacing:-.01em}
  .h-link{font-size:17px}
  .h-callt-n,.h-callt-l{display:inline}
  .btn{font-size:18px}

  /* 첫 화면: 라벨 → 이름 → 부채 무대 → 나머지 */
  .h-hero{flex-direction:column;flex-wrap:nowrap;align-items:stretch;gap:16px;padding:12px 18px 56px}
  .h-txt{display:contents}
  .h-lbl{order:1}
  .h-h1{order:2;gap:6px}
  .hv{order:3}
  .h-tag,.h-lead,.h-btns,.h-time,.h-seo{order:4}
  .h-h1-a{font-size:36px}
  .h-name{font-size:98px;line-height:1}
  .h-tag{margin-top:6px;font-size:29px;line-height:1.4}
  .h-lead{max-width:none;font-size:17px;line-height:1.8}
  .h-btns{flex-direction:column;gap:10px;margin-top:6px}
  .h-btns .btn{width:100%}
  .h-time{font-size:15px}
  .h-seo{max-width:none;font-size:15px}

  .hv{flex:none;width:100%;max-width:460px;min-width:0;margin:8px auto 0}
  .hv-in{--u:calc(100cqw / 390);height:calc(var(--u) * 420)}
  .ribs-a{right:calc(var(--u) * 10);top:calc(var(--u) * -6);width:calc(var(--u) * 118);height:calc(var(--u) * 400)}
  .rod{left:calc(var(--u) * -6);right:calc(var(--u) * -6);height:calc(var(--u) * 5)}
  .ribs-a .rib{width:calc(var(--u) * 18)}
  .ribs-a .rib1{left:calc(var(--u) * 4);height:calc(var(--u) * 360)}
  .ribs-a .rib2{left:calc(var(--u) * 27);height:calc(var(--u) * 320)}
  .ribs-a .rib3{left:calc(var(--u) * 50);height:calc(var(--u) * 390)}
  .ribs-a .rib4{left:calc(var(--u) * 73);height:calc(var(--u) * 300)}
  .ribs-a .rib5{left:calc(var(--u) * 96);height:calc(var(--u) * 340)}
  .fan-wrap{top:calc(var(--u) * 10);width:calc(var(--u) * 404);height:calc(var(--u) * 210)}
  .h-arch-fig{top:calc(var(--u) * 57);width:calc(var(--u) * 234)}
  .h-arch{width:calc(var(--u) * 230);height:calc(var(--u) * 307);border-width:calc(var(--u) * 7);border-radius:calc(var(--u) * 115) calc(var(--u) * 115) 0 0}
  .h-bar{width:calc(var(--u) * 234);height:calc(var(--u) * 11)}
  .h-arch-fig figcaption{margin-top:8px;font-size:13px}
  .fan-hint{font-size:14px;margin-top:2px}
  .fan-hit{height:calc(var(--u) * 380)}
  .jihwa{left:0;top:calc(var(--u) * 230);width:calc(var(--u) * 126)}

  /* 인사 */
  .h-greet{padding:56px 18px 64px;border-top:2px solid #1B1714}
  .h-greet-in{flex-direction:column;flex-wrap:nowrap;align-items:stretch;gap:18px}
  .h-greet-txt{display:contents}
  .h-g-lbl{order:0;align-self:flex-start}
  .h-greet-fig{order:1;flex:none;margin:4px 14px 14px 0;gap:10px}
  .h-greet-txt>:not(.h-g-lbl){order:2}
  .h-photo{box-shadow:10px 10px 0 #EDBE2F}
  .h-cbar span{width:5px}
  .h-photo-box img{aspect-ratio:4/4.4}
  .h-greet-fig figcaption,.h-shf1 figcaption,.h-shf2 figcaption{font-size:14px;margin-top:6px}
  .h-greet-h{font-size:29px;line-height:1.42}
  .h-seal{width:52px;height:52px;font-size:19px}
  .h-sign{gap:14px;margin-top:4px}
  .h-sign-n{font-size:28px}

  /* 신당 */
  .h-shrine{padding:56px 18px 64px;border-top:2px solid #1B1714}
  .h-shhead{flex-direction:column;align-items:stretch;gap:16px;margin-bottom:24px}
  .h-shhead-l{gap:14px}
  .h-shhead-p{max-width:none}
  .h-shphotos{grid-template-columns:minmax(0,1fr);gap:26px;padding-right:12px}
  .h-shf2{margin-top:0}
  .h-sh-r,.h-sh-b{box-shadow:10px 10px 0 #D3382C}.h-sh-b{box-shadow:10px 10px 0 #2457B3}
  .h-gear{margin-top:40px}
  .h-gear-hd{gap:10px;padding-bottom:12px;margin-bottom:24px}
  .h-gear-hd h3{font-size:24px}
  .tap{padding:5px 10px;font-size:14px}
  .h-tap-x{display:none}
  .h-gear-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 18px}
  .gear{gap:8px}
  .gname{font-size:23px}.gname .han{font-size:17px}
  .gdesc{font-size:15px;line-height:1.65}
  .gear:hover .gear-img,.bell-btn:hover .bell-img{transform:none}

  /* 다섯 빛깔 */
  .h-obang-in{flex-direction:column;flex-wrap:nowrap;padding:56px 18px 72px;gap:16px}
  .h-obang-l{gap:16px}
  .h-obang-r{flex:none;width:100%}
  .ob-row{gap:6px;margin-bottom:10px}
  .ob-btn{min-height:84px}
  .ob-btn:hover{transform:none}
  .ob-btn.on{transform:translateY(-8px);box-shadow:0 10px 0 -3px #1B1714}
  .ob-han{font-size:30px}
  .ob-nm{font-size:14px}
  .ob-dir{display:none}
  .ob-panel{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:12px 18px;padding:26px 24px 28px;min-height:0}
  .ob-body{display:contents}
  .ob-bigh{font-size:92px}
  .ob-full{font-size:26px;line-height:1.25}
  .ob-dl{grid-column:1 / -1;grid-template-columns:56px minmax(0,1fr);gap:4px 10px;font-size:17px}
  .ob-tx{grid-column:1 / -1;font-size:17px;line-height:1.7}

  /* 상담 안내 */
  .h-consult-in{flex-direction:column;flex-wrap:nowrap;padding:56px 18px 64px;gap:16px}
  .h-con-l,.h-con-r{display:contents}
  .h-c-lbl{order:1;align-self:flex-start}
  .h-c-h{order:2;line-height:1.22}
  .h-c-p{order:3}
  .h-c-ul{order:4;margin:0;gap:8px;font-size:16px}
  .dia{width:9px;height:9px}
  .h-prices{order:5;margin-top:8px}
  .h-modes{order:6;gap:10px;margin-top:6px}
  .h-c-btns{order:7;flex-direction:column;gap:10px;margin-top:8px}
  .h-c-btns .btn{width:100%}
  .pr{gap:10px;padding:13px 2px}
  .pr:hover{padding-left:2px}
  .pr-n{font-size:20px}
  .pr-p{font-size:20px}
  .pr-note{display:none}
  .pr .lead{min-width:12px;transform:translateY(-6px)}
  .h-modes>div{padding:16px;gap:2px}
  .h-modes .hj{font-size:18px}
  .h-modes span:last-child{font-size:16px;line-height:1.6}
  .h-intro-in{padding:56px 18px 64px}
  .h-intro-hd{margin-bottom:24px}
  .h-intro-h{font-size:30px}
  .h-intro-hd p{font-size:17px}
  .h-intro-grid{gap:22px}
  .h-card{padding:22px 20px 24px;box-shadow:8px 8px 0 #EDBE2F;margin-right:8px}
  .h-card h3{font-size:21px}
  .h-card p{font-size:17px;line-height:1.85}

  /* 걸어온 길 */
  .h-path{padding:56px 18px 64px}
  .h-path-in{flex-direction:column;flex-wrap:nowrap;gap:16px}
  .h-path-l{gap:16px;flex:none}
  .h-path-ph{height:auto;aspect-ratio:354 / 250;max-width:520px;margin:8px 0 18px;width:100%}
  .h-pp1{width:56%;box-shadow:10px 10px 0 #2457B3}
  .h-pp2{right:10px;width:46%;box-shadow:10px 10px 0 #D3382C}
  .tl{flex:none;width:100%}
  .tl::before{left:85px}
  .tl-row{grid-template-columns:64px 20px minmax(0,1fr);gap:0 12px;padding:14px 0}
  .tl-y{font-size:24px;line-height:1.15}
  .tl-f{transform:translateY(2px)}
  .tl-b{gap:2px}
  .tl-t{font-size:18px}
  .tl-d{font-size:16px;line-height:1.6}

  /* 무대와 방송 */
  .mq-box{padding:16px 0}
  .mq{animation-duration:34s}
  .mq-i{gap:18px;padding-right:18px;font-size:26px}
  .mq-i .mq-f{width:12px;height:12px}
  .h-media-in{padding:48px 18px 60px}
  .h-media-hd{flex-direction:column;align-items:stretch;gap:14px;margin-bottom:20px}
  .h-media-hl{gap:14px}
  .h-media-hl .h-h2-60{line-height:1.25}
  .h-media-p{max-width:none;font-size:16px}
  .h-media-h3{font-size:20px;margin-bottom:6px}
  .h-vids{grid-template-columns:minmax(0,1fr);gap:0;border-top:1px solid rgba(255,255,255,.22)}
  .vcard{display:grid;grid-template-columns:148px minmax(0,1fr);grid-template-rows:auto auto;gap:2px 14px;align-items:center;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.22)}
  .vthumb{grid-row:1 / span 2;border-width:5px}
  .vplay{width:40px;height:40px}
  .vplay svg{width:18px;height:18px}
  .vd{font-size:14px;align-self:end}
  .vt{font-size:18px;align-self:start}
  .h-media-n{margin-top:18px;font-size:15px}
  .h-media-links{flex-direction:column;gap:0;margin-top:6px}

  /* 후기 */
  .h-reviews{padding:56px 18px 64px}
  .h-rev-hd{flex-direction:column;align-items:stretch;gap:16px;margin-bottom:16px}
  .h-rev-hl{gap:14px}
  .h-rev-st{font-size:16px}
  .h-rev-grid{grid-template-columns:minmax(0,1fr);gap:16px}
  .h-rev-big{margin:6px 12px 12px 0;padding:30px 26px 26px;box-shadow:10px 10px 0 #D3382C;gap:16px}
  .h-q{font-size:80px}
  .h-rev-big blockquote{font-size:25px}
  .h-rev-big figcaption{font-size:14px}
  .h-rev-side{gap:16px}
  .h-rev-s{padding:22px}
  .h-rev-s blockquote{font-size:17px;line-height:1.75}
  .h-rev-s figcaption{font-size:14px}

  /* 꿈해몽 */
  .dream-fig{order:-1}
  .m-hide{display:none}

  /* 오시는 길 */
  .ribs-b{right:18px;top:8px;width:100px;height:200px}
  .ribs-b .rod{left:-5px;right:-5px;height:5px}
  .ribs-b .rib{width:16px}
  .ribs-b .rib1{left:2px;height:170px}.ribs-b .rib2{left:22px;height:140px}.ribs-b .rib3{left:42px;height:185px}.ribs-b .rib4{left:62px;height:130px}.ribs-b .rib5{left:82px;height:155px}
  .h-visit-in{padding:64px 18px 56px}
  .h-visit-in>.h-h2-60{max-width:250px;line-height:1.3}
  .h-v-btns{flex-direction:column;gap:10px;margin-top:26px}
  .h-v-btns .btn{width:100%}
  .h-v-note{font-size:15px;line-height:1.7}
  .h-v-grid{flex-direction:column;flex-wrap:nowrap;gap:24px;margin-top:28px;padding-top:28px}
  .h-v-l{flex:none;gap:14px}
  .h-v-l h3{font-size:26px}
  .h-v-dl{grid-template-columns:52px minmax(0,1fr);gap:8px 14px;font-size:17px}
  .h-v-r{flex:none;gap:14px}
  .h-map{align-self:stretch}
}
@media (max-width:600px){
  .dream-form input::placeholder{font-size:16px}
  .hv{max-width:none;width:calc(100% + 36px);margin:8px -18px 0}
  .h-vids{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:359px){
  .h-name{font-size:84px}
  .vcard{grid-template-columns:120px minmax(0,1fr)}
}
