/* ============================================================
   LIBERTE — DESIGN SYSTEM
   ============================================================ */
:root{
  --c-base:#F6F4EF;
  --c-base-alt:#EFEBE3;
  --c-ink:#1B1A18;
  --c-ink-sub:#4A4640;
  --c-gray:#8B857C;
  --c-line:#DFDAD1;
  --c-green:#13462B;
  --c-green-lt:#105330;
  --c-dark:#14130F;
  --c-on-dark:#EFEBE3;
  --c-on-dark-sub:#9A948A;

  --f-display:"Cormorant Garamond",serif;
  --f-label:"Inter",system-ui,sans-serif;
  --f-head-ja:"Shippori Mincho B1",serif;
  --f-body-ja:"Noto Serif JP",serif;

  --fs-hero-en:clamp(50px,10vw,132px);
  --fs-display-1:clamp(40px,6.4vw,88px);
  --fs-display-2:clamp(36px,5vw,64px);
  --fs-h1-ja:clamp(27px,3.7vw,54px);
  --fs-h2-ja:clamp(23px,2.6vw,38px);
  --fs-h3-ja:clamp(18px,1.6vw,23px);
  --fs-body:clamp(15px,1.05vw,16px);
  --fs-caption:12px;
  --fs-label:11px;

  --dur-fast:300ms;
  --dur-base:400ms;
  --dur-slow:800ms;
  --ease-out:cubic-bezier(.16,1,.3,1);

  --max:1280px;
  --mx:64px;
}
@media(max-width:1023px){:root{--mx:48px}}
@media(max-width:767px){:root{--mx:24px}}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  background:var(--c-base);color:var(--c-ink);
  font-family:var(--f-body-ja);font-weight:400;font-size:var(--fs-body);
  line-height:2.05;letter-spacing:.06em;
  font-feature-settings:"palt" 0;line-break:strict;overflow-x:hidden;
}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
::selection{background:var(--c-green);color:var(--c-base)}
:focus-visible{outline:2px solid var(--c-green);outline-offset:3px}

.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--mx)}
.en{font-family:var(--f-display);font-weight:300;line-height:1.02;letter-spacing:.01em}

.label{
  display:flex;align-items:center;gap:12px;
  font-family:var(--f-label);font-size:var(--fs-label);font-weight:500;
  letter-spacing:.18em;text-transform:uppercase;color:var(--c-gray);line-height:1.4;
}
.label i{font-style:normal;color:var(--c-green-lt)}
.label s{display:block;width:26px;height:1px;background:var(--c-line);text-decoration:none}

/* ---------- Link / Button ---------- */
.tlink{
  display:inline-block;position:relative;
  font-family:var(--f-label);font-size:var(--fs-label);font-weight:500;
  letter-spacing:.16em;text-transform:uppercase;
  padding-bottom:6px;transition:color var(--dur-fast) var(--ease-out);
}
.tlink::after{content:"";position:absolute;left:0;bottom:0;width:0;height:1px;
  background:currentColor;transition:width var(--dur-base) var(--ease-out)}
.tlink em{font-style:normal;display:inline-block;transition:transform var(--dur-fast) var(--ease-out)}
.tlink:hover{color:var(--c-green-lt)}
.tlink:hover::after{width:100%}
.tlink:hover em{transform:translateX(6px)}

.btn{
  display:inline-flex;align-items:center;gap:16px;
  border:1px solid var(--c-line);padding:19px 36px;
  font-family:var(--f-label);font-size:var(--fs-label);font-weight:500;
  letter-spacing:.16em;text-transform:uppercase;line-height:1;
  transition:background var(--dur-base) var(--ease-out),color var(--dur-base) var(--ease-out),
             border-color var(--dur-base) var(--ease-out);
}
.btn em{font-style:normal;display:inline-block;transition:transform var(--dur-fast) var(--ease-out)}
.btn:hover{background:var(--c-ink);color:var(--c-base);border-color:var(--c-ink)}
.btn:hover em{transform:translateX(6px)}
.btn.on-dark{border-color:rgba(239,235,227,.34);color:var(--c-on-dark)}
.btn.on-dark:hover{background:var(--c-on-dark);color:var(--c-dark);border-color:var(--c-on-dark)}

/* ---------- Reveal ---------- */
.rv{opacity:0;transform:translateY(14px);
  transition:opacity var(--dur-slow) var(--ease-out),transform var(--dur-slow) var(--ease-out)}
.rv.in{opacity:1;transform:none}

/* ============================================================
   NAVIGATION
   ============================================================ */
.nav{
  position:fixed;inset:0 0 auto 0;z-index:100;height:96px;display:flex;align-items:center;
  transition:height var(--dur-base) var(--ease-out),background var(--dur-base) var(--ease-out),
             border-color var(--dur-base) var(--ease-out);
  border-bottom:1px solid transparent;
}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;width:100%}
.nav.stuck{height:74px;background:rgba(246,244,239,.94);border-bottom-color:var(--c-line)}
.brand{display:block;transition:opacity 500ms var(--ease-out)}
body.opening .brand{opacity:0}
.nav img{height:52px;width:auto;transition:height var(--dur-base) var(--ease-out)}
.nav.stuck img{height:38px}
.navlinks{display:flex;gap:32px}
.navlinks a{font-family:var(--f-label);font-size:var(--fs-label);font-weight:500;
  letter-spacing:.16em;text-transform:uppercase;position:relative;padding-bottom:4px}
.navlinks a::after{content:"";position:absolute;left:0;bottom:0;width:0;height:1px;
  background:currentColor;transition:width var(--dur-base) var(--ease-out)}
.navlinks a:hover::after,.navlinks a[aria-current="page"]::after{width:100%}

.burger{display:none;background:none;border:0;cursor:pointer;color:inherit;
  font-family:var(--f-label);font-size:var(--fs-label);font-weight:500;letter-spacing:.16em;
  text-transform:uppercase;padding:8px 0}
.sheet{position:fixed;inset:0;z-index:99;background:var(--c-base);
  display:flex;flex-direction:column;justify-content:center;padding:0 var(--mx);
  opacity:0;visibility:hidden;transform:translateY(-10px);
  transition:opacity var(--dur-base) var(--ease-out),transform var(--dur-base) var(--ease-out),visibility var(--dur-base)}
.sheet.open{opacity:1;visibility:visible;transform:none}
.sheet a{font-family:var(--f-display);font-weight:300;font-size:36px;line-height:1.95;letter-spacing:.02em}
.sheet a span{font-family:var(--f-body-ja);font-size:11px;color:var(--c-gray);
  letter-spacing:.14em;margin-left:14px}
@media(max-width:960px){
  .navlinks{display:none}
  .burger{display:block}
  .nav img{height:42px}
  .nav.stuck img{height:32px}
}

/* ============================================================
   HERO
   ============================================================ */
.hero{position:relative;min-height:100svh;display:flex;align-items:center;overflow:hidden}
.hero-bg{position:absolute;inset:0;z-index:0}
.hero-bg img{width:100%;height:100%;object-fit:cover;object-position:65% 50%}
.hero-bg::after{content:"";position:absolute;inset:0;
  background:linear-gradient(100deg,var(--c-base) 0%,var(--c-base) 38%,rgba(246,244,239,.80) 62%,rgba(246,244,239,.62) 100%)}
.hero .wrap{position:relative;z-index:1;width:100%}
.hero-copy{max-width:760px;padding-top:60px}
.hero h1{font-family:var(--f-head-ja);font-weight:400;font-size:var(--fs-h1-ja);
  line-height:1.62;letter-spacing:.04em}
.hero h1 span{display:block}
.hero .sub{margin-top:38px;font-family:var(--f-display);font-weight:300;
  font-size:clamp(16px,1.9vw,25px);letter-spacing:.14em;color:var(--c-gray);text-transform:uppercase}
.hero-foot{position:absolute;left:0;right:0;bottom:34px;z-index:1;
  display:flex;justify-content:space-between;align-items:flex-end}
.hero-foot span{font-family:var(--f-label);font-size:10px;font-weight:500;
  letter-spacing:.18em;text-transform:uppercase;color:var(--c-gray)}
.scroll{display:flex;flex-direction:column;align-items:center;gap:8px;
  font-family:var(--f-label);font-size:10px;letter-spacing:.18em;color:var(--c-gray)}
.scroll s{display:block;width:1px;height:40px;background:var(--c-line);animation:bob 4s ease-in-out infinite}
@keyframes bob{0%,100%{transform:scaleY(1);opacity:.5}50%{transform:scaleY(.55);opacity:1}}
@media(max-width:767px){
  .hero-bg img{object-position:60% 50%}
  .hero-bg::after{background:linear-gradient(170deg,var(--c-base) 0%,rgba(246,244,239,.92) 55%,rgba(246,244,239,.72) 100%)}
  .hero .sub{margin-top:26px}
  .scroll{display:none}
}

/* ============================================================
   INDEX（トップの目次）
   ============================================================ */
.index{padding:150px 0 40px}
.index-list{margin-top:56px;border-top:1px solid var(--c-line)}
.ix{display:grid;grid-template-columns:70px 1fr 300px 40px;gap:24px;align-items:center;
  padding:38px 0;border-bottom:1px solid var(--c-line);
  transition:padding-left var(--dur-base) var(--ease-out)}
.ix .no{font-family:var(--f-label);font-size:var(--fs-label);font-weight:500;
  letter-spacing:.2em;color:var(--c-green-lt)}
.ix .nm{font-family:var(--f-display);font-weight:300;font-size:clamp(30px,4.2vw,58px);
  line-height:1.06;letter-spacing:.01em;transition:color var(--dur-base) var(--ease-out)}
.ix .ja{font-family:var(--f-head-ja);font-size:13px;color:var(--c-gray);letter-spacing:.09em}
.ix .ar{font-family:var(--f-label);font-size:14px;color:var(--c-gray);text-align:right;
  transition:transform var(--dur-base) var(--ease-out),color var(--dur-base) var(--ease-out)}
.ix:hover{padding-left:14px}
.ix:hover .nm{color:var(--c-green)}
.ix:hover .ar{transform:translateX(8px);color:var(--c-green)}
@media(max-width:900px){
  .index{padding:100px 0 30px}
  .ix{grid-template-columns:48px 1fr 26px;gap:4px 14px;padding:28px 0}
  .ix .ja{grid-column:2/3}
  .ix .ar{grid-row:1/3;grid-column:3/4;align-self:center}
  .ix:hover{padding-left:6px}
}

/* ============================================================
   NEWS
   ============================================================ */
.news{padding:110px 0 150px}
.news-list{margin-top:40px;border-top:1px solid var(--c-line)}
.news-item{display:grid;grid-template-columns:118px 118px 1fr;gap:20px;align-items:baseline;
  padding:26px 0;border-bottom:1px solid var(--c-line)}
.news-item time{font-family:var(--f-label);font-size:var(--fs-caption);letter-spacing:.06em;color:var(--c-gray)}
.news-item .cat{font-family:var(--f-label);font-size:10px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--c-gray)}
.news-item h3{font-family:var(--f-head-ja);font-weight:400;font-size:16px;line-height:1.7;
  transition:color var(--dur-fast) var(--ease-out)}
.news-item:hover h3{color:var(--c-green-lt)}
@media(max-width:767px){
  .news{padding:80px 0 110px}
  .news-item{grid-template-columns:104px 1fr;gap:8px 16px;padding:22px 0}
  .news-item h3{grid-column:1/3;margin-top:6px}
}

/* ============================================================
   下層ページ共通
   ============================================================ */
.page-head{padding:200px 0 84px;border-bottom:1px solid var(--c-line)}
.page-head h1{font-size:var(--fs-display-2);margin:22px 0}
.page-head p{color:var(--c-ink-sub);font-size:15px;max-width:34em}
.sec{padding:110px 0}
.sec + .sec{border-top:1px solid var(--c-line)}
.pagenav{border-top:1px solid var(--c-line);padding:60px 0 120px;display:flex;gap:20px;flex-wrap:wrap}
@media(max-width:900px){
  .page-head{padding:150px 0 60px}
  .sec{padding:78px 0}
  .pagenav{padding:48px 0 90px}
}

/* ---------- PHILOSOPHY ---------- */
.ph-lead{display:grid;grid-template-columns:repeat(12,1fr);gap:24px;align-items:start}
.ph-lead h2{grid-column:1/7;font-family:var(--f-head-ja);font-weight:400;
  font-size:var(--fs-h2-ja);line-height:1.55;letter-spacing:.05em}
.ph-lead h2 span{display:block}
.ph-body{grid-column:8/13;padding-top:6px}
.ph-body p{color:var(--c-ink-sub);font-size:15px;line-height:2.1}
.ph-body p + p{margin-top:26px}
.ph-close{display:grid;grid-template-columns:repeat(12,1fr);gap:24px;align-items:center}
.ph-close p{grid-column:1/7;font-family:var(--f-head-ja);font-size:clamp(17px,1.7vw,21px);
  line-height:2.1;letter-spacing:.05em}
.slideshow{grid-column:8/13;position:relative;width:100%;aspect-ratio:3/2;overflow:hidden;
  background:var(--c-base-alt)}
.slideshow img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  opacity:0;transition:opacity 1400ms var(--ease-out)}
.slideshow img.on{opacity:1}
.slide-dots{position:absolute;left:20px;bottom:18px;display:flex;gap:8px;z-index:2}
.slide-dots s{display:block;width:22px;height:1px;background:rgba(246,244,239,.42);
  text-decoration:none;transition:background 600ms var(--ease-out)}
.slide-dots s.on{background:rgba(246,244,239,.95)}
@media(max-width:900px){
  .ph-lead,.ph-close{display:block}
  .ph-body{margin-top:30px}
  .slideshow{margin-top:36px}
}

.value{position:relative;padding:120px 0 130px;overflow:hidden}
.value .v-item:first-of-type{margin-top:0}
.value::before{content:"";position:absolute;inset:0;z-index:0;
  background:url("value-bg.jpg") 34% 52%/cover no-repeat;opacity:.15}
.value::after{content:"";position:absolute;inset:0;z-index:0;
  background:linear-gradient(180deg,var(--c-base) 0%,rgba(246,244,239,.62) 20%,
             rgba(246,244,239,.62) 80%,var(--c-base) 100%)}
.value .wrap{position:relative;z-index:1}
.value-head{margin-bottom:64px}
.value-head p{margin-top:18px;color:var(--c-ink-sub);font-size:15px}
.v-item{display:grid;grid-template-columns:repeat(12,1fr);gap:24px}
.v-item + .v-item{margin-top:64px}
.v-item:nth-of-type(1) .v-in{grid-column:1/7}
.v-item:nth-of-type(2) .v-in{grid-column:4/10}
.v-item:nth-of-type(3) .v-in{grid-column:7/13}
.v-num{font-family:var(--f-label);font-size:12px;font-weight:500;letter-spacing:.2em;
  color:var(--c-green-lt);margin-bottom:8px}
.v-en{font-size:var(--fs-display-1);margin-bottom:14px}
.v-item h3{font-size:var(--fs-h3-ja);margin-bottom:8px;font-family:var(--f-head-ja);font-weight:400}
.v-item p{color:var(--c-ink-sub);font-size:14px;line-height:1.95;max-width:28em}
@media(max-width:900px){
  .value{padding:90px 0 100px}
  .value-head{margin-bottom:52px}
  .v-item{display:block}
  .v-item + .v-item{margin-top:56px}
  .v-item:nth-of-type(2) .v-in{margin-left:20px}
  .v-item:nth-of-type(3) .v-in{margin-left:40px}
}

/* ---------- BUSINESS ---------- */
.biz-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:24px;align-items:start}
.biz-txt{grid-column:1/6}
.biz-side{grid-column:7/13}
.biz-eyebrow{font-family:var(--f-label);font-size:var(--fs-label);font-weight:500;
  letter-spacing:.18em;text-transform:uppercase;color:var(--c-gray);margin-bottom:22px}
.biz-name{font-size:var(--fs-display-2);margin-bottom:10px}
.biz-cat{font-family:var(--f-head-ja);font-size:13px;color:var(--c-gray);letter-spacing:.08em;margin-bottom:34px}
.biz-txt p{color:var(--c-ink-sub);font-size:15px}
.biz-txt p + p{margin-top:22px}
.biz-txt .tlink{margin-top:38px}
.biz-side img{width:100%;aspect-ratio:4/3;object-fit:cover}
.pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;
  border-top:1px solid var(--c-line);margin-top:64px;padding-top:26px}
.pillars dt{font-family:var(--f-label);font-size:var(--fs-label);font-weight:500;
  letter-spacing:.18em;color:var(--c-green-lt);margin-bottom:10px}
.pillars dd{font-family:var(--f-head-ja);font-size:14px;line-height:1.9;color:var(--c-ink-sub)}
@media(max-width:900px){
  .biz-grid{display:block}
  .biz-side{margin-top:38px}
  .pillars{grid-template-columns:1fr;gap:0;margin-top:44px}
  .pillars div{padding:20px 0;border-bottom:1px solid var(--c-line)}
}

/* ---------- COMPANY ---------- */
.co-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:24px}
.co-txt{grid-column:1/7}
.co-txt h2{font-size:var(--fs-h2-ja);margin-bottom:26px;
  font-family:var(--f-head-ja);font-weight:400;line-height:1.55;letter-spacing:.05em}
.co-txt p{color:var(--c-ink-sub);font-size:15px;max-width:32em}
.co-txt p + p{margin-top:22px}
.co-txt img{margin-top:52px;width:80%;aspect-ratio:4/5;object-fit:cover}
.co-dl{max-width:860px}
.co-dl div{display:grid;grid-template-columns:150px 1fr;gap:24px;padding:22px 0;
  border-bottom:1px solid var(--c-line)}
.co-dl div:first-child{border-top:1px solid var(--c-line)}
.co-dl dt{font-family:var(--f-label);font-size:var(--fs-label);font-weight:500;
  letter-spacing:.13em;text-transform:uppercase;color:var(--c-gray);padding-top:5px}
.co-dl dd{font-family:var(--f-head-ja);font-size:15px;line-height:1.9}
.co-dl dd a{border-bottom:1px solid var(--c-line);transition:color var(--dur-fast) var(--ease-out)}
.co-dl dd a:hover{color:var(--c-green-lt)}
@media(max-width:900px){
  .co-grid{display:block}
  .co-txt img{width:100%;aspect-ratio:3/2;margin-top:40px}
  .co-dl div{grid-template-columns:1fr;gap:6px;padding:18px 0}
}

/* ---------- CONTACT ---------- */
.ct-hero{position:relative;background:var(--c-dark);color:var(--c-on-dark);overflow:hidden}
.ct-bg{position:absolute;inset:0;z-index:0}
.ct-bg img{width:100%;height:100%;object-fit:cover;object-position:72% 42%;opacity:.34}
.ct-bg::after{content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,var(--c-dark) 0%,rgba(20,19,15,.94) 46%,rgba(20,19,15,.70) 100%)}
.ct-hero .wrap{position:relative;z-index:1;padding-top:200px;padding-bottom:140px}
.ct-hero h1{font-size:var(--fs-hero-en);line-height:.98;letter-spacing:-.005em}
.ct-hero p{margin-top:36px;font-family:var(--f-head-ja);font-size:16px;
  color:var(--c-on-dark-sub);max-width:26em}
.ct-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:24px}
.ct-l{grid-column:1/8}
.ct-r{grid-column:9/13}
.ct-l h2{font-size:var(--fs-h3-ja);font-family:var(--f-head-ja);font-weight:400;margin-bottom:20px}
.ct-l p{color:var(--c-ink-sub);font-size:15px;max-width:30em}
.ct-l .form{margin-top:44px}
.ct-l .btn{margin-top:34px}
.ct-dl div{display:grid;grid-template-columns:96px 1fr;gap:16px;padding:17px 0;
  border-bottom:1px solid var(--c-line)}
.ct-dl div:first-child{border-top:1px solid var(--c-line)}
.ct-dl dt{font-family:var(--f-label);font-size:var(--fs-label);font-weight:500;
  letter-spacing:.13em;text-transform:uppercase;color:var(--c-gray);padding-top:5px}
.ct-dl dd{font-family:var(--f-head-ja);font-size:14px;line-height:1.9}
.ct-dl dd a{border-bottom:1px solid var(--c-line);transition:color var(--dur-fast) var(--ease-out)}
.ct-dl dd a:hover{color:var(--c-green-lt)}
@media(max-width:900px){
  .ct-hero .wrap{padding-top:150px;padding-bottom:100px}
  .ct-grid{display:block}
  .ct-r{margin-top:48px}
  .ct-dl div{grid-template-columns:84px 1fr;gap:12px}
}

/* ============================================================
   FOOTER
   ============================================================ */
.foot{background:var(--c-dark);color:var(--c-on-dark-sub)}
.foot .wrap{padding:64px 0 58px;display:flex;justify-content:space-between;
  align-items:flex-start;gap:44px;flex-wrap:wrap}
.foot img{height:52px;width:auto;opacity:.92}
.foot .place{margin-top:16px;font-family:var(--f-label);font-size:10px;letter-spacing:.2em;
  text-transform:uppercase}
.foot nav{display:flex;flex-direction:column;gap:13px;text-align:right}
.foot nav a,.foot .copy{font-family:var(--f-label);font-size:var(--fs-label);letter-spacing:.12em;
  text-transform:uppercase;transition:color var(--dur-fast) var(--ease-out)}
.foot nav a:hover{color:var(--c-on-dark)}
.foot .copy{margin-top:6px;opacity:.7}
@media(max-width:767px){
  .foot .wrap{flex-direction:column;gap:34px}
  .foot nav{text-align:left}
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
  .rv{opacity:1;transform:none}
  html{scroll-behavior:auto}
}

/* ============================================================
   OPENING（トップページのロゴ演出）
   ============================================================ */
.opening{position:fixed;inset:0;z-index:200;background:var(--c-base);
  display:flex;align-items:center;justify-content:center;
  transition:opacity 700ms var(--ease-out)}
.opening img{width:min(46vw,460px);height:auto;opacity:0;
  transform-origin:top left;transition:opacity 900ms var(--ease-out)}
.opening.show img{opacity:1}
.opening.move img{transition:transform 1000ms var(--ease-out)}
.opening.gone{opacity:0;pointer-events:none}
.opening[hidden]{display:none}
@media(max-width:767px){.opening img{width:74vw}}

/* ============================================================
   FORM
   ============================================================ */
.form{display:grid;gap:30px;max-width:620px}
.field{display:grid;gap:9px}
.field label{font-family:var(--f-label);font-size:var(--fs-label);font-weight:500;
  letter-spacing:.14em;text-transform:uppercase;color:var(--c-gray)}
.field label .req{color:var(--c-green-lt);margin-left:8px;letter-spacing:.1em}
.field input,.field select,.field textarea{
  width:100%;background:transparent;border:0;border-bottom:1px solid var(--c-line);
  padding:12px 2px;font-family:var(--f-body-ja);font-size:15px;color:var(--c-ink);
  letter-spacing:.05em;line-height:1.8;border-radius:0;-webkit-appearance:none;appearance:none;
  transition:border-color var(--dur-base) var(--ease-out)}
.field select{background:transparent}
.field textarea{min-height:150px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{
  outline:none;border-bottom-color:var(--c-green)}
.consent{display:flex;align-items:flex-start;gap:12px;font-size:14px;color:var(--c-ink-sub);
  line-height:1.9}
.consent input{width:16px;height:16px;margin-top:7px;accent-color:var(--c-green);flex:0 0 auto}
.consent a{border-bottom:1px solid var(--c-line)}
button.btn{background:transparent;cursor:pointer;font-family:var(--f-label);color:var(--c-ink)}
button.btn:disabled{opacity:.45;cursor:not-allowed}
.form-msg{font-family:var(--f-head-ja);font-size:15px;line-height:1.9;padding:22px 0 0}
.form-msg.err{color:#8A2B2B}

/* ============================================================
   LEGAL（プライバシーポリシー等）
   ============================================================ */
.legal{max-width:760px}
.legal .intro{color:var(--c-ink-sub);font-size:15px;line-height:2.1}
.legal h2{font-family:var(--f-head-ja);font-weight:500;font-size:17px;letter-spacing:.05em;
  margin:56px 0 16px;padding-bottom:14px;border-bottom:1px solid var(--c-line)}
.legal p{color:var(--c-ink-sub);font-size:15px;line-height:2.1}
.legal p + p{margin-top:18px}
.legal ul{margin:16px 0 0;padding-left:0;list-style:none}
.legal li{color:var(--c-ink-sub);font-size:15px;line-height:2.05;
  padding-left:22px;position:relative}
.legal li::before{content:"";position:absolute;left:2px;top:.95em;
  width:6px;height:1px;background:var(--c-green-lt)}
.legal-dl{margin-top:26px}
.legal-dl div{display:grid;grid-template-columns:110px 1fr;gap:20px;padding:16px 0;
  border-bottom:1px solid var(--c-line)}
.legal-dl div:first-child{border-top:1px solid var(--c-line)}
.legal-dl dt{font-family:var(--f-label);font-size:var(--fs-label);font-weight:500;
  letter-spacing:.13em;color:var(--c-gray);padding-top:5px}
.legal-dl dd{font-family:var(--f-head-ja);font-size:14px;line-height:1.9}
.legal-dl dd a{border-bottom:1px solid var(--c-line);transition:color var(--dur-fast) var(--ease-out)}
.legal-dl dd a:hover{color:var(--c-green-lt)}
.legal .revised{margin-top:48px;font-family:var(--f-label);font-size:12px;letter-spacing:.1em;
  color:var(--c-gray)}
@media(max-width:767px){
  .legal h2{margin:44px 0 14px}
  .legal-dl div{grid-template-columns:1fr;gap:5px;padding:14px 0}
}