:root {
  --rose: #d96c98;
  --rose-deep: #c75080;
  --rose-soft: #f5cddd;
  --pink-pale: #fff8fb;
  --lavender: #e9dff8;
  --mint: #d8f0ec;
  --blue: #e4edfb;
  --cream: #f9efd4;
  --text: #625362;
  --muted: #9e8e9d;
  --line: #f0dce5;
  --white: #fff;
  --serif: "Cormorant Garamond", "Times New Roman", serif;
  --sans: "Noto Sans JP", "Hiragino Kaku Gothic ProN", sans-serif;
  --shadow: 0 15px 42px rgba(220, 143, 175, .08);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--text);
  background: #fff;
  font-family: var(--sans);
  font-size: 14px;
  line-height: 1.9;
  letter-spacing: .04em;
}
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; transition: color .2s ease, background .2s ease, border-color .2s ease, transform .2s ease; }
a:hover { color: var(--rose-deep); }
p, h1, h2, h3, ul, figure { margin: 0; padding: 0; }
ul { list-style: none; }
button, input { font: inherit; }
.container { width: min(1180px, calc(100% - 72px)); margin: 0 auto; }
.sr-only { position: absolute; overflow: hidden; width: 1px; height: 1px; clip-path: inset(50%); white-space: nowrap; }
.site-header {
  position: absolute; top: 0; left: 0; right: 0; z-index: 10;
  padding: 28px 0 20px;
}
.header-inner { display: flex; align-items: center; gap: 42px; }
.brand { color: var(--rose); width: 190px; display: inline-flex; flex-direction: column; align-items: flex-start; line-height: 1; }
.brand-en { font: 500 37px/1 var(--serif); letter-spacing: .02em; white-space: nowrap; }
.brand-jp { font-size: 10px; letter-spacing: .36em; margin: 8px 0 0 42px; }
.main-nav { display: flex; flex: 1; justify-content: center; align-items: center; gap: clamp(16px, 2.1vw, 34px); }
.main-nav a { font-size: 12px; letter-spacing: .15em; color: #4f4550; }
.social-mini { display: flex; gap: 13px; }
.social-mini a { width: 31px; height: 31px; border: 1px solid #f0d2df; border-radius: 50%; color: var(--rose); display: grid; place-items: center; font-size: 15px; font-weight: 500; }
.social-mini a:hover { background: #fdf1f7; transform: translateY(-1px); }
.hero {
  position: relative; min-height: 652px; overflow: hidden;
  background:
    radial-gradient(circle at 58% 29%, rgba(247, 218, 235, .52), transparent 34%),
    radial-gradient(circle at 16% 9%, rgba(220, 232, 254, .55), transparent 30%),
    radial-gradient(circle at 95% 26%, rgba(255, 237, 201, .44), transparent 27%),
    linear-gradient(145deg, #fff 0%, #fff7fb 47%, #fff 100%);
}
.hero::before, .hero::after {
  content:""; position: absolute; pointer-events: none; inset: auto;
  filter: blur(1px); opacity: .85;
}
.hero::before {
  width: 960px; height: 280px; left: -100px; bottom: 36px;
  border-radius: 50%; border-top: 24px solid rgba(231, 208, 251, .2); transform: rotate(-7deg);
}
.hero::after {
  width: 1000px; height: 300px; right: -320px; top: 10px;
  border-radius: 50%; border-bottom: 25px solid rgba(255, 213, 228, .28); transform: rotate(-10deg);
}
.hero-glow { position: absolute; inset: 0; background: radial-gradient(circle at 50% 65%, rgba(255,255,255,.25), rgba(255,255,255,.82) 72%); z-index: 1; }
.hero-inner { position: relative; z-index: 2; min-height: 652px; display: flex; align-items: center; padding-top: 100px; }
.hero-copy { width: 40%; padding: 56px 0 0 10px; color: var(--rose); z-index: 2; }
.hero-lead { font-family: var(--serif); font-size: 27px; line-height: 2; letter-spacing: .12em; margin-bottom: 23px; }
.hero-spark { display: flex; align-items: center; gap: 16px; font-size: 17px; color: #e2a4bf; margin-bottom: 20px; }
.hero-spark span { display: inline-block; height: 1px; width: 67px; background: #ebb9cd; }
.hero-copy h1 { font: 500 clamp(60px, 6.4vw, 82px)/1.04 var(--serif); letter-spacing: .01em; }
.hero-copy h1 span { font-size: .65em; }
.hero-kana { font-size: 14px; letter-spacing: .5em; margin: 16px 0 18px 55px; }
.hero-tagline { font-size: 16px; letter-spacing: .16em; }
.hero-image { position: absolute; z-index: 1; width: min(72%, 850px); right: -30px; bottom: 28px; }
.hero-image img { width: 100%; mask-image: radial-gradient(ellipse 72% 66% at 55% 47%, black 62%, transparent 100%); mix-blend-mode: multiply; }
.slider-dots { position: absolute; left: 50%; transform: translateX(-50%); bottom: 42px; z-index: 4; display: flex; gap: 9px; }
.slider-dots i { display:block; width:8px; height:8px; border-radius:50%; background:#f0c8d9; }
.slider-dots i.active { background: var(--rose); }
.content { padding-top: 60px; }
.spacious { margin-bottom: 36px; }
.panel { border: 1px solid var(--line); border-radius: 7px; background: rgba(255,255,255,.92); box-shadow: var(--shadow); }
.section-title { font: 600 24px/1.25 var(--serif); letter-spacing: .11em; color: var(--rose); }
.section-title small { font-size: 15px; margin-left: 8px; }
.feature-grid { display: grid; grid-template-columns: 1.03fr 1fr; gap: 18px; }
.about-card, .pickup-card { padding: 24px 27px; min-height: 247px; }
.about-body { display:grid; grid-template-columns: 1.06fr .94fr; align-items: center; gap: 25px; margin-top: 13px; }
.about-body p { font-size: 12px; margin: 0 0 12px; line-height: 2.1; }
.about-visual { border-radius: 9px; height: 132px; display:flex; align-items:center; justify-content:center; background: radial-gradient(circle at 78% 18%, #fff 0 5%, transparent 24%), linear-gradient(135deg, #e8e7ff, #fff0f5 48%, #ffe8ee); color: #dba0ba; }
.about-visual p { font: 500 33px/1 var(--serif); text-shadow: 0 2px 6px rgba(255,255,255,.9); }
.outline-btn { min-width: 156px; display: inline-flex; align-items: center; justify-content: center; gap: 19px; height: 36px; padding: 0 20px; margin-top: 12px; border: 1px solid #ecb9d0; color: var(--rose); border-radius: 24px; font-size: 11px; letter-spacing: .12em; background: #fff; }
.outline-btn:hover { background: #fff1f7; border-color: var(--rose); }
.pickup-content { display:flex; margin-top: 15px; min-height: 139px; border-radius: 8px; background: linear-gradient(110deg, #eef0ff, #fae9f5 57%, #f9edfb); overflow:hidden; }
.pickup-text { padding: 20px 0 12px 26px; position:relative; z-index:1; min-width: 52%; }
.mini-label { font-size: 11px; color: var(--rose); letter-spacing: .14em; }
.pickup-text h3 { font-size: 19px; font-weight: 400; color: var(--rose); margin: 7px 0 3px; letter-spacing: .1em; }
.pickup-text .release { font-size: 12px; }
.pickup-content img { margin-left: auto; width: 52%; object-fit: cover; mix-blend-mode: multiply; }
.information-grid { display:grid; grid-template-columns: 1.05fr .85fr .65fr; gap: 18px; }
.list-panel { padding: 22px 27px 16px; }
.heading-row { display:flex; justify-content:space-between; align-items: center; margin-bottom: 16px; }
.heading-row > a { font-size: 10px; color: var(--rose); letter-spacing: .14em; }
.news-list li { display:grid; grid-template-columns: 83px 61px 1fr; align-items:center; min-height: 37px; border-bottom: 1px dotted #ead9e1; font-size: 11px; }
.news-list li:last-child { border: 0; }
.news-list time { color:#887b88; }
.tag { justify-self:start; padding: 1px 9px; border-radius: 2px; font-style:normal; font-size: 9px; color:white; line-height: 18px; letter-spacing: .08em; }
.tag.new { background:#e686ab; }.tag.media { background:#98c7db; }.tag.release { background:#8dccbd; }.tag.live { background:#bf9ada; }.tag.info { background:#bfadd8; }
.schedule-list li { display:flex; justify-content:space-between; gap: 8px; align-items: center; min-height: 63px; border-bottom: 1px dotted #ead9e1; font-size: 11px; }
.schedule-list li:last-child { border-bottom: 0; }
.schedule-list time { display:block; color:var(--rose); font-weight:500; letter-spacing:.08em; }
.schedule-list time small { font-size: 8px; }
.schedule-list strong { display:block; font-size:11px; font-weight:400; color:var(--text); }
.schedule-list span { text-align:right; white-space:nowrap; font-size:10px; }
.fanclub-promo { padding: 28px 18px 20px; text-align:center; display:flex; flex-direction:column; justify-content:center; background: radial-gradient(circle at top, #fff 2%, #fff6fb 41%, #fef9fc 100%); }
.fanclub-promo h2 { font:500 31px/1.3 var(--serif); color:var(--rose); margin: 10px 0; }
.fanclub-promo > p:not(.mini-label) { color:var(--rose); font-size:13px; letter-spacing:.16em; }
.benefit-icons { color:var(--rose); font-size:24px; letter-spacing:.34em; margin: 16px -10px 0 0; }
.fanclub-promo .outline-btn { margin:17px auto 0; }
.profile-section { border: 1px solid var(--line); border-radius:7px; padding: 0 28px 25px; }
.ornament-heading { display:flex; gap:20px; align-items:center; justify-content:center; margin: -1px 0 24px; }
.ornament-heading span { flex:1; height:1px; background: var(--line); position:relative; }
.ornament-heading span:first-child::after, .ornament-heading span:last-child::before { content:"✦"; color:#e9b2cb; position:absolute; top:-13px; font-size:13px; }
.ornament-heading span:first-child::after { right: -10px; }.ornament-heading span:last-child::before { left: -10px; }
.ornament-heading h2 { font:600 25px/1 var(--serif); color:var(--rose); letter-spacing:.16em; padding: 0 24px; transform:translateY(-50%); background:white; }
.members { display:grid; grid-template-columns:repeat(5, 1fr); gap:38px; }
.member { text-align:center; }
.member img { width:100%; aspect-ratio: .82/1; object-fit:cover; object-position: top; border-radius: 92px 92px 0 0; border: 1px solid var(--accent); background: #fff; }
.member h3 { color:var(--accent-text); font:600 27px/1.1 var(--serif); letter-spacing:.04em; margin-top: 10px; }
.member h3 small { font: 400 10px/1 var(--sans); margin-left:7px; }
.member-jp { display:inline-block; min-width: 98px; margin: 7px 0 8px; padding: 2px 10px; font-size:12px; color:#697070; background:var(--accent-bg); }
.member > p:last-child { font-size:10px; line-height:1.8; color:#7b7080; }
.member.mint { --accent:#b8dfd7; --accent-bg:#d9efea; --accent-text:#69b4a4; }
.member.lavender { --accent:#d9cced; --accent-bg:#eee5fb; --accent-text:#a38cca; }
.member.pink { --accent:#f1c8d9; --accent-bg:#fae0ea; --accent-text:#dc7ca3; }
.member.blue { --accent:#c9d9f0; --accent-bg:#e5eefc; --accent-text:#7499ce; }
.member.yellow { --accent:#ead9a4; --accent-bg:#faefd0; --accent-text:#c1a150; }
.outline-btn.center { display:flex; width:max-content; margin:25px auto 0; min-width:192px; }
.middle-grid { display:grid; grid-template-columns: 1fr 1fr; gap:18px; }
.event-card, .blog-card { padding: 22px 22px 17px; }
.event-body { display:grid; grid-template-columns: 50% 1fr; gap:22px; align-items:center; }
.event-body img { height:138px; width:100%; object-fit:cover; border-radius:5px; }
.event-body h3 { color:#8d7588; font:500 29px/1.35 var(--serif); margin: 4px 0; letter-spacing:.06em; }
.event-body p { font-size:13px; }
.event-date { color: #936d80; letter-spacing:.1em; }
.topics li { display:grid; grid-template-columns: 82px 1fr 16px; gap:16px; align-items:center; padding: 8px 0; border-bottom: 1px dotted #ead9e1; }
.topics li:last-child { border:0; }
.topics img { width:82px; height:41px; object-fit:cover; border-radius:3px; }
.topics time { font-size:10px; color:#978491; letter-spacing:.08em; }
.topics em { font-style:normal; background:#e890b0; color:white; padding:1px 5px; border-radius:9px; }
.topics p { font-size:12px; line-height:1.6; }
.topics li > span { font-size:22px; color:#eab5cb; }
.utility-grid { display:grid; grid-template-columns: .88fr 1.42fr .75fr; gap:18px; }
.benefits, .goods, .sns { padding: 20px 22px 18px; }
.benefits ul { margin-top:14px; }
.benefits li { display:flex; gap:13px; align-items:flex-start; margin-bottom:10px; line-height:1.4; }
.benefits b { width:24px; font-size:25px; line-height:1; color:var(--rose); font-weight:400; }
.benefits strong { font-size:12px; color:#d6769d; }
.benefits span { font-size:10px; color:#8d828a; }
.benefits .outline-btn { margin-top:8px; width:100%; }
.goods-list { display:grid; grid-template-columns:repeat(4, 1fr); gap:12px; text-align:center; }
.product { height:82px; display:flex; align-items:center; justify-content:center; border-radius:6px; font-size:30px; color:#e99fc1; margin-bottom:10px; }
.product.light { background:#f0effe; }.product.tshirt { background:#fff0f5; }.product.towel { background:#fdebf4; font:600 14px/1 var(--serif); }.product.stand { background:#eff3ff; }
.goods-list p { font-size:11px; line-height:1.65; }
.goods-list small { font-size:10px; }
.sns p { margin:18px 0 21px; font-size:12px; }
.sns-large { display:flex; justify-content:space-between; gap:10px; }
.sns-large a { text-align:center; color:var(--rose); }
.sns-large b { width:42px; height:42px; display:grid; place-items:center; background:#fff; border:1px solid #f1dbe5; border-radius:7px; font-size:25px; margin-bottom:7px; font-weight:500; color:#222; }
.sns-large small { font-size:9px; color:var(--rose); }
.media-grid { display:grid; grid-template-columns:.86fr 1.08fr 1fr; gap:18px; }
.discography, .movie, .gallery { padding:19px 19px 16px; }
.disc-body { display:grid; grid-template-columns:112px 1fr; gap:16px; align-items:center; }
.disc-body img { width:112px; height:112px; object-fit:cover; }
.disc-body p { font-size:11px; }
.disc-body h3 { color:var(--rose); font-size:16px; font-weight:400; margin: 4px 0 7px; }
.disc-body .outline-btn { min-width:auto; width:126px; height:32px; padding:0 11px; margin-top:13px; }
.movie-frame { position:relative; }
.movie-frame img { width:100%; height:126px; object-fit:cover; border-radius:4px; }
.play { position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); display:grid; place-items:center; padding-left:4px; width:58px; height:58px; border-radius:50%; background:rgba(255,255,255,.88); color:#df8caf; font-size:20px; }
.small-btn { height:31px; min-width:143px; margin-top:12px !important; }
.gallery-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:4px; }
.gallery-grid img { width:100%; height:60px; object-fit:cover; }
.newsletter { margin: 52px 0 28px; min-height:68px; padding:11px 27px; display:flex; align-items:center; justify-content:space-between; gap:38px; border-radius:7px; background: linear-gradient(100deg, #e9dcfa 0%, #fff6fb 31%, #fde4ee 100%); }
.newsletter-label { display:flex; align-items:center; gap:21px; }
.newsletter-label > span { font-size:37px; font-weight:300; color:var(--rose); }
.newsletter h2 { font:600 20px/1.25 var(--serif); letter-spacing:.15em; color:var(--rose); }
.newsletter p { font-size:11px; }
.newsletter form { display:flex; width:min(400px, 100%); }
.newsletter input { flex:1; height:40px; border:1px solid #f1d4e2; border-right:0; border-radius:5px 0 0 5px; background:#fff; padding:0 15px; font-size:11px; color:#827482; }
.newsletter button { width:112px; height:40px; border:0; border-radius:0 5px 5px 0; background:#dc6e9d; color:#fff; font-size:11px; letter-spacing:.12em; cursor:pointer; }
.site-footer { padding: 2px 0 26px; }
.footer-inner { display:grid; grid-template-columns: 190px 1fr 180px; align-items:center; gap:36px; }
.footer-brand .brand-en { font-size:35px; }
.footer-nav { display:flex; justify-content:center; flex-wrap:wrap; gap: 7px 22px; }
.footer-nav a { font-size:10px; letter-spacing:.13em; color:#827483; }
.footer-social { justify-content:flex-end; }
.copyright { text-align:center; font-size:10px; margin-top:19px; color:#877988; }
@media (max-width: 1100px) {
  .container { width:min(100% - 40px, 900px); }
  .header-inner { flex-wrap:wrap; gap:18px 30px; }
  .main-nav { order:3; flex-basis:100%; justify-content:flex-start; flex-wrap:wrap; }
  .hero { min-height:700px; }
  .hero-inner { min-height:700px; padding-top:145px; align-items:flex-start; }
  .hero-copy { width:49%; }
  .hero-image { width:73%; right:-100px; bottom:60px; }
  .information-grid, .utility-grid, .media-grid { grid-template-columns: repeat(2, 1fr); }
  .fanclub-promo, .sns, .gallery { grid-column:span 2; }
  .members { gap:18px; }
}
@media (max-width: 760px) {
  body { font-size:13px; }
  .container { width:calc(100% - 32px); }
  .site-header { position:static; background:#fffafc; padding:18px 0; }
  .header-inner { display:block; }
  .brand { margin-bottom:17px; }
  .main-nav { display:flex; gap:10px 20px; margin-bottom:17px; }
  .main-nav a { font-size:10px; }
  .hero { min-height:auto; padding-bottom:42px; }
  .hero-inner { min-height:auto; display:flex; flex-direction:column; padding-top:35px; }
  .hero-copy { width:100%; padding: 0 0 22px; }
  .hero-lead { font-size:23px; }
  .hero-copy h1 { font-size:56px; }
  .hero-image { position:relative; width:100%; right:auto; bottom:auto; }
  .slider-dots { bottom:16px; }
  .content { padding-top:34px; }
  .feature-grid, .information-grid, .middle-grid, .utility-grid, .media-grid { grid-template-columns:1fr; }
  .fanclub-promo, .sns, .gallery { grid-column:auto; }
  .about-body { grid-template-columns:1fr; }
  .members { grid-template-columns:repeat(2, 1fr); gap:24px 18px; }
  .members .member:last-child { grid-column:1 / -1; max-width:48%; justify-self:center; }
  .event-body { grid-template-columns:1fr; }
  .goods-list { grid-template-columns:repeat(2,1fr); }
  .newsletter { display:block; padding:20px; }
  .newsletter form { margin-top:16px; }
  .footer-inner { display:flex; flex-direction:column; align-items:flex-start; gap:20px; }
  .footer-social { justify-content:flex-start; }
}
