@charset "UTF-8";
/* 社交ダンス：10種目の紹介リスト（このページ専用） */
.ddex{ margin-top:64px; }
.ddex-h{ display:flex; align-items:center; gap:14px; margin:0 0 6px;
  font-family:var(--font-serif-jp); font-weight:600; font-size:21px; color:var(--color-main); }
.ddex-h .en{ font-family:var(--font-serif-en); font-weight:400; font-size:12px; letter-spacing:.2em;
  text-transform:uppercase; color:var(--color-accent-text); }
.ddex-cols{ display:grid; grid-template-columns:1fr 1fr; gap:40px 56px; margin-top:8px; align-items:start; }
/* Q&A：ダンスの種類ごとの見出し。--dc でその踊りの色に切り替わる */
.faq-h{ display:flex; align-items:center; flex-wrap:wrap; gap:6px 14px;
  margin:44px 0 0; padding:0 0 0 14px; border-left:3px solid var(--dc,var(--color-main));
  font-family:var(--font-serif-jp); font-weight:600; font-size:22px; line-height:1.5;
  color:var(--dc,var(--color-main)); }
.faq-h .en{ font-family:var(--font-serif-en); font-weight:400; font-size:12px; letter-spacing:.2em;
  text-transform:uppercase; color:var(--color-accent-text); }
/* 見出しの直後にくるQ&Aは上の罫線を詰める */
.faq-h + .faq{ margin-top:18px; }
@media (max-width:560px){ .faq-h{ font-size:20px; margin-top:36px; } }
/* クリックで展開するアコーディオン */
.ddex-acc{ border-top:1px solid rgba(212,175,55,.5); }
.ddex-acc details{ border-bottom:1px solid var(--color-border); }
.ddex-acc summary{ position:relative; list-style:none; display:flex; align-items:baseline; gap:10px;
  padding:15px 40px 15px 4px; font-weight:700; font-size:16.5px; color:var(--color-main); }
.ddex-acc summary::-webkit-details-marker{ display:none; }
.ddex-acc summary::before{ content:""; width:10px; height:1px; background:var(--color-accent);
  align-self:center; flex:0 0 10px; }
.ddex-acc summary .bt{ font-size:12.5px; font-weight:500; letter-spacing:.04em; color:var(--color-accent-text); }
.ddex-acc summary::after{ content:""; position:absolute; right:10px; top:50%; width:13px; height:13px;
  transform:translateY(-50%);
  background:
    linear-gradient(var(--color-accent-text),var(--color-accent-text)) center/13px 1px,
    linear-gradient(var(--color-accent-text),var(--color-accent-text)) center/1px 13px;
  background-repeat:no-repeat; transition:transform .3s ease; }
.ddex-acc details[open] summary::after{ transform:translateY(-50%) rotate(45deg); }
.ddex-acc summary:hover{ color:var(--color-accent-text); }
.ddex-acc p{ margin:0; padding:0 24px 16px 24px; font-size:14.5px; line-height:1.8; color:var(--color-text-sub); }
@media (max-width:860px){ .ddex-cols{ grid-template-columns:1fr; gap:32px; } }