@charset "UTF-8";
/* ============================================================
   VIVAGE pc.css（769px以上）
   ============================================================ */
.site-header{padding:22px 40px}
.site-header .logo{font-size:24px}
.site-header .logo small{font-size:9px;margin-top:2px}
.gnav{display:flex;gap:34px;font-family:'Cormorant Garamond',Georgia,serif;font-size:13px;letter-spacing:.28em;align-items:center}
.nav-cta{padding:8px 20px}
.menu-btn{display:none}

/* --- トップ hero --- */
.hero{min-height:100vh;display:grid;grid-template-columns:1fr 1fr;align-items:center;position:relative;padding:120px 6vw 60px}
.hero-text{display:flex;flex-direction:row-reverse;gap:26px;justify-content:center;align-items:flex-start}
.vstack{display:flex;flex-direction:column;align-items:center;gap:.42em;font-size:clamp(22px,2.4vw,32px);font-weight:500;color:var(--ink)}
.vstack span{line-height:1}
.vstack .comma{transform:translate(.55em,-.4em)}
.vstack.sub{font-size:clamp(11px,1vw,13px);color:var(--sepia);padding-top:56px;gap:.5em;font-weight:400}
.hero-img{position:relative;height:74vh;overflow:hidden}
.hero-img img{width:100%;height:100%;object-fit:cover;object-position:center;animation:slowzoom 14s ease-out forwards}
@keyframes slowzoom{from{transform:scale(1.07)}to{transform:scale(1)}}
.hero-img::after{content:'';position:absolute;inset:14px;border:1px solid rgba(255,255,255,.65);pointer-events:none}
.hero-script{position:absolute;left:6vw;bottom:9vh;font-size:clamp(20px,2.2vw,32px);color:var(--gold);transform:rotate(-2deg);white-space:nowrap}
.scrolldown{position:absolute;bottom:30px;left:50%;transform:translateX(-50%);font-family:'Cormorant Garamond',Georgia,serif;font-size:11px;letter-spacing:.4em;color:var(--sepia);writing-mode:vertical-rl}
.scrolldown::after{content:'';display:block;width:1px;height:46px;background:var(--gold);margin:10px auto 0;animation:drip 2s infinite}
@keyframes drip{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

/* --- セクション --- */
section{padding:128px 6vw}
.chapitre .fr{font-size:34px}
.chapitre h1,.chapitre h2{font-size:clamp(20px,2.2vw,28px)}
.page-hero{padding:168px 6vw 72px}
.page-hero .fr{font-size:34px}
.page-hero h1{font-size:clamp(22px,2.4vw,30px)}
.breadcrumb{margin-top:26px}

/* --- 2カラム --- */
.two-col{display:grid;grid-template-columns:1.1fr 1fr;gap:7vw;align-items:center;max-width:1200px;margin:0 auto}
.two-col.rev{grid-template-columns:1fr 1.1fr}
.two-col.rev .txt{order:-1}
.two-col .lead{font-size:clamp(18px,1.8vw,22px);font-weight:500;letter-spacing:.2em;line-height:2.4;margin-bottom:1.4em}
.two-col p{margin-bottom:1.6em;font-size:15px}
.framed{position:relative}
.framed img{aspect-ratio:4/3;object-fit:cover}
.framed::before{content:'';position:absolute;inset:-16px 16px 16px -16px;border:1px solid var(--line);z-index:-1}

/* --- カードグリッド --- */
.col-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:34px;max-width:1200px;margin:0 auto}
.col-grid.four{grid-template-columns:repeat(4,1fr);gap:26px}
.col-card h3,.col-card h2{font-size:20px;margin-top:20px}
.col-card .jp{font-size:12.5px;margin-top:4px}
.center{margin-top:56px}
.morelink{font-size:13px}
.btn{padding:15px 52px;font-size:13px}

/* --- リング詳細 --- */
.ring-block{max-width:1100px;margin:0 auto 90px}
.ring-block .ring-photo{background:#fff;border:1px solid var(--line);padding:20px}
.ring-block .ring-photo img{aspect-ratio:3/2;object-fit:cover}
.ring-head{display:flex;align-items:baseline;gap:18px;margin:34px 0 14px}
.ring-head h2{font-family:'Cormorant Garamond',Georgia,serif;font-size:24px;letter-spacing:.24em;color:var(--sepia);font-weight:500}
.ring-head .hin{font-size:12px;color:#9b8d7d;letter-spacing:.14em}
.ring-block .desc{font-size:14.5px;max-width:800px;margin-bottom:28px}
.spec-table{max-width:800px}

/* --- shop --- */
.shop-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px 26px;max-width:1200px;margin:0 auto}
.shop-card{background:#fff;border:1px solid var(--line);padding:26px 26px 30px;transition:box-shadow .3s}
.shop-card:hover{box-shadow:0 10px 30px rgba(139,115,85,.12)}
.shop-card h2,.shop-card h3{font-size:16px;font-weight:500;letter-spacing:.12em;margin-bottom:10px;color:var(--sepia)}
.shop-card p{font-size:12.5px;line-height:1.9;color:#6d6156}
.area-label{font-family:'Cormorant Garamond',Georgia,serif;font-size:18px;letter-spacing:.3em;color:var(--gold);border-bottom:1px solid var(--line);padding-bottom:10px;margin:70px auto 30px;max-width:1200px}
.area-label:first-of-type{margin-top:0}
.shop-detail{max-width:860px;margin:0 auto}
.shop-detail .spec-table{max-width:none}

/* --- FAQ --- */
.faq-list{max-width:820px;margin:0 auto}
.faq-item{background:#fff;border:1px solid var(--line);margin-bottom:18px;padding:26px 30px}
.faq-item h2,.faq-item h3{font-size:15.5px;font-weight:500;letter-spacing:.1em;margin-bottom:12px;color:var(--sepia)}
.faq-item h2::before,.faq-item h3::before{content:'Q.';font-family:'Cormorant Garamond',Georgia,serif;color:var(--gold);margin-right:10px}
.faq-item p{font-size:14px}
.faq-item p::before{content:'A.';font-family:'Cormorant Garamond',Georgia,serif;color:var(--sepia);margin-right:10px}

/* --- footer --- */
.site-footer{padding:60px 6vw 40px}
.site-footer .logo{font-size:22px;margin-bottom:24px}
.site-footer .logo small{font-size:9px}
.fnav{gap:30px;font-size:12px;margin-bottom:34px}