@charset "UTF-8";

/* ============================================================
   YAZAWA CLUB / feature 配下 共通スタイル
   対象：/feature/deals（特定商取引法に基づく表記）
         /feature/terms（ファンクラブ会員規約）
   ============================================================ */

:root{
  --bg:#000;
  --fg:#fff;
  --muted:#9a9a9a;
  --line:rgba(255,255,255,.18);
  --line-strong:rgba(255,255,255,.4);
  --accent:#e20213;
  --maxw:980px;
}
*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{
  margin:0;
  background:var(--bg);
  color:var(--fg);
  font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN","Hiragino Sans","Yu Gothic","Meiryo",sans-serif;
  font-size:15px;
  line-height:1.9;
  letter-spacing:.04em;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;}
a:focus-visible{outline:2px solid var(--accent);outline-offset:3px;}

/* ---------- header : 左上ロゴのみ ---------- */
.site-header{
  border-bottom:1px solid var(--line);
  background:#000;
  position:sticky;
  top:0;
  z-index:10;
}
.site-header__inner{
  max-width:var(--maxw);
  margin:0 auto;
  padding:16px 20px;
  display:flex;
  align-items:center;
}
.logo{
  display:inline-flex;
  align-items:center;
  gap:12px;
  text-decoration:none;
}
.logo img{
  display:block;
  height:44px;
  width:auto;
  max-width:100%;
}


/* ---------- main ---------- */
.wrap{
  max-width:var(--maxw);
  margin:0 auto;
  padding:56px 20px 80px;
}
.page-title{
  margin:0 0 40px;
  padding-bottom:20px;
  border-bottom:1px solid var(--line-strong);
  font-size:20px;
  font-weight:700;
  letter-spacing:.16em;
  text-align:center;
}
.page-title::after{
  content:"";
  display:block;
  width:44px;
  height:2px;
  background:var(--accent);
  margin:20px auto -21px;
}

/* ---------- 特定商取引法に基づく表記（definition list） ---------- */
.tokusho{
  margin:0;
}
.tokusho > div{
  display:flex;
  gap:32px;
  padding:22px 4px;
  border-bottom:1px solid var(--line);
}
.tokusho dt{
  flex:0 0 240px;
  font-size:14px;
  font-weight:700;
  letter-spacing:.1em;
  color:#fff;
}
.tokusho dd{
  margin:0;
  flex:1 1 auto;
  color:#dcdcdc;
}
.tokusho dd p{margin:0 0 .4em;}
.tokusho dd p:last-child{margin-bottom:0;}
.tokusho dd ul{
  margin:0;
  padding:0;
  list-style:none;
}
.tokusho dd li{
  padding-left:1em;
  text-indent:-1em;
}
.tokusho dd li::before{
  content:"・";
  color:var(--muted);
}
.plan{
  margin:0 0 .6em;
}
.plan:last-child{margin-bottom:0;}
.plan__name{
  display:inline-block;
  font-weight:700;
  color:#fff;
  margin-bottom:.1em;
}
.plan__row{
  display:block;
  padding-left:1em;
}
.note{
  color:var(--muted);
  font-size:13px;
}
.published{
  margin-top:40px;
  text-align:right;
  color:var(--muted);
  font-size:13px;
  letter-spacing:.08em;
}

/* ---------- 規約（terms） ---------- */
.lead{
  margin:0 0 48px;
  color:#dcdcdc;
}
.terms{
  margin:0;
}
/* 章見出し（第1章 総則 など） */
.terms__chapter{
  margin:56px 0 24px;
  padding-bottom:12px;
  border-bottom:1px solid var(--line-strong);
  font-size:15px;
  font-weight:700;
  letter-spacing:.24em;
  color:#fff;
}
.terms__chapter:first-of-type{margin-top:0;}
/* 条見出し（第1条(会員規約) など） */
.terms__article{
  margin:36px 0 12px;
  padding-left:14px;
  border-left:3px solid var(--accent);
  font-size:14px;
  font-weight:700;
  letter-spacing:.1em;
  color:#fff;
}
/* 項（1. 2. …） */
.terms ol.terms__items{
  margin:0;
  padding:0;
  list-style:none;
  counter-reset:item;
  color:#dcdcdc;
}
.terms ol.terms__items > li{
  position:relative;
  margin:0 0 .9em;
  padding-left:2.1em;
  counter-increment:item;
}
.terms ol.terms__items > li:last-child{margin-bottom:0;}
.terms ol.terms__items > li::before{
  content:counter(item) ".";
  position:absolute;
  left:0;
  top:0;
  color:var(--muted);
  font-variant-numeric:tabular-nums;
}
/* 項番号を持たない本文（条文が1段落のみの場合など） */
.terms p{
  margin:0 0 .9em;
  color:#dcdcdc;
}
.terms p:last-child{margin-bottom:0;}
/* 号（(1) (2) …） */
.terms ul.terms__sub{
  margin:.6em 0 0;
  padding:0;
  list-style:none;
}
.terms ul.terms__sub > li{
  padding-left:2.4em;
  text-indent:-2.4em;
  margin-bottom:.3em;
}
.terms ul.terms__sub > li:last-child{margin-bottom:0;}
/* 中黒（・）付きリスト：会費・支払方法など */
.terms ul.terms__dots{
  margin:.6em 0 0;
  padding:0;
  list-style:none;
}
.terms ul.terms__dots > li{
  padding-left:1em;
  text-indent:-1em;
  margin-bottom:.2em;
}
.terms ul.terms__dots > li:last-child{margin-bottom:0;}
.terms ul.terms__dots > li::before{
  content:"・";
  color:var(--muted);
}
/* 補足行（例）〜、※〜） */
.terms__example,
.terms__note{
  display:block;
  margin-top:.2em;
  color:var(--muted);
  font-size:13px;
}
.terms__end{
  margin:56px 0 0;
  padding-top:24px;
  border-top:1px solid var(--line);
  text-align:right;
  color:var(--muted);
  font-size:13px;
  letter-spacing:.3em;
}

/* ---------- footer ---------- */
.site-footer{
  border-top:1px solid var(--line);
  padding:48px 20px 56px;
}
.site-footer__inner{
  max-width:var(--maxw);
  margin:0 auto;
  text-align:center;
}
.site-footer h2{
  margin:0 0 20px;
  font-size:12px;
  font-weight:700;
  letter-spacing:.3em;
  color:var(--muted);
}
.footer-nav{
  list-style:none;
  margin:0 0 32px;
  padding:0;
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:12px 28px;
}
.footer-nav a{
  font-size:13px;
  text-decoration:none;
  color:#dcdcdc;
  letter-spacing:.08em;
}
.footer-nav a:hover{color:#fff;text-decoration:underline;}
.copyright{
  font-size:11px;
  color:var(--muted);
  letter-spacing:.12em;
}

/* ---------- responsive ---------- */
@media (max-width:720px){
  body{font-size:14px;}
  .wrap{padding:36px 18px 64px;}
  .page-title{font-size:17px;}
  .tokusho > div{
    display:block;
    padding:18px 2px;
  }
  .tokusho dt{
    margin-bottom:6px;
    font-size:13px;
    color:#fff;
  }
  .logo img{height:30px;}

  .lead{margin-bottom:36px;}
  .terms__chapter{margin:44px 0 20px;font-size:14px;letter-spacing:.18em;}
  .terms__article{margin:28px 0 10px;font-size:13px;}
  .terms ol.terms__items > li{padding-left:1.8em;}
  .terms ul.terms__sub > li{padding-left:2.2em;text-indent:-2.2em;}
}
@media (prefers-reduced-motion:reduce){
  *{transition:none !important;animation:none !important;}
}