/* =====================================================
   修正版LP 追加スタイル
   （03-styles.css は元サイトのまま。上書き・追加分のみここに記載）

   トンマナ: FVビジュアルに合わせたパステル調
   - ベース: 淡いブルー (#d6e7ff〜#f6f9ff)
   - 文字: ネイビー (#33406b)
   - アクセント: 水色→ラベンダー→ピンクのグラデーション
   ===================================================== */

/* ---------- 全体トーン ---------- */
body {
  background-color: #e8f1ff;
  color: #33406b;
}
.container {
  background-color: #e9f2ff;
  background-image: linear-gradient(180deg, #d6e7ff 0%, #e9f2ff 45%, #f6f9ff 100%);
}

/* 各セクションの暗色背景画像を無効化 */
.artist::after,
.thought__body,
.entry {
  background-image: none;
}

/* セクション背景をFV同系統のパステル素材(bg01〜06.jpg)に差し替え */
.concept__inner {
  background-image: url(../images/bg01.jpg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.artist {
  background-image: url(../images/bg04.jpg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.support {
  background-image: url(../images/bg06.jpg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.conditions {
  background-image: url(../images/bg03.jpg);
  background-size: cover;
  background-position: center top;
  background-repeat: no-repeat;
}
.flow {
  background-image: url(../images/bg05.jpg);
  background-size: cover;
  background-position: center top;
  background-repeat: no-repeat;
}
.faq {
  background-image: url(../images/bg02.jpg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.entry-bottom__body {
  background-image: url(../images/bg01.jpg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

/* セクション見出しの下線をパステルグラデーションに */
.section-title::after {
  background: linear-gradient(to right, #8ec2ff, #c9a6ff, #ffb3dd);
}

/* ---------- 下部追従CTA ---------- */
.sticky-cta {
  position: fixed;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  z-index: 4500;
  padding: 10px 16px calc(10px + env(safe-area-inset-bottom, 0px));
  background: rgba(255, 255, 255, 0.72);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  box-shadow: 0 -2px 12px rgba(140, 170, 255, 0.3);
}
@media screen and (min-width: 900px) {
  .sticky-cta {
    max-width: 24.375rem;
  }
}
.sticky-cta .btn__inner {
  padding-top: 8px;
  padding-bottom: 8px;
}
.sticky-cta .btn__text > span {
  font-size: 24px;
}
/* 追従CTAに隠れないようページ末尾に余白 */
.company {
  padding-bottom: 110px;
}

/* ---------- 01 ファーストビュー ---------- */
/* 写真（images/mv.png・文字なし素材）＋HTMLコピーのオーバーレイ構成 */
.mv {
  position: relative;
  background-image: none;
  aspect-ratio: auto;
}
.mv::before {
  content: none;
}
.mv__img {
  display: block;
  width: 100%;
  height: auto;
}
/* 上部＝メイン＋サブ（顔にかからない位置）、下部＝バッジ */
.mv__copy-top {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  padding: 20px 16px 46px;
  text-align: center;
  background: linear-gradient(
    180deg,
    rgba(240, 247, 255, 0.94) 0%,
    rgba(240, 247, 255, 0.72) 60%,
    rgba(240, 247, 255, 0) 100%
  );
}
.mv__copy-bottom {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 70px 16px 100px;
  text-align: center;
  background: linear-gradient(
    0deg,
    rgba(240, 247, 255, 0.95) 35%,
    rgba(240, 247, 255, 0) 100%
  );
}
.mv__main {
  font-size: 26px;
  line-height: 1.5;
  font-weight: 900;
  font-family: "Noto Sans JP", sans-serif;
  letter-spacing: 0.02em;
  background: linear-gradient(to right, #ff7fc0, #b06ef5);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  filter: drop-shadow(0 1px 5px rgba(255, 255, 255, 0.95));
}
.mv__sub {
  margin-top: 10px;
  font-size: 14px;
  font-weight: 700;
  color: #33406b;
  font-family: "Noto Sans JP", sans-serif;
}
.mv__badges {
  margin-top: 14px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  list-style: none;
  padding: 0;
}
.mv__badges li {
  background: linear-gradient(180deg, #6f9fe8, #4f7fd6);
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  font-family: "Noto Sans JP", sans-serif;
  padding: 6px 14px;
  border-radius: 4px;
  box-shadow: 0 2px 6px rgba(90, 130, 200, 0.35);
}

/* ---------- CTAボタン共通（黒＋ネオン → パステルグラデ塗り） ---------- */
.btn > a {
  background: linear-gradient(to right, #7db8ff, #b79cff, #ff9ad5);
  box-shadow: 0 6px 18px rgba(140, 170, 255, 0.45);
}
.btn__inner {
  background-color: transparent;
}
/* 元CSSの max-width:120px では「LINEから応募する」が折り返すため解除 */
.btn__text {
  max-width: none;
  width: auto;
  white-space: nowrap;
  text-align: center;
}
.btn__text > span {
  display: block;
}
/* 「LINEからオーディションに応募する」がアイコンと重ならないよう縮小 */
.entry-bottom__btn .btn__text {
  font-size: 12px;
  margin-left: 26px;
}

/* ---------- ナビ（SPドロワー・PC） ---------- */
.sp-nav {
  background-color: #eef4ff;
  background-image: none;
}
.sp-nav__item > a {
  color: #33406b;
}
.sp-nav__item > a > img,
.pc-nav__item > a > img {
  filter: invert(0.75) sepia(0.2) saturate(2) hue-rotate(195deg);
}
.pc-nav {
  background-color: #ffffff;
  background-image: none;
  box-shadow: 0 8px 24px rgba(140, 170, 255, 0.25);
}
.pc-nav__item > a {
  color: #33406b;
}

/* ---------- PC固定CTA ---------- */
.cta__title--text {
  text-align: center;
  font-size: 32px;
  line-height: 1.5;
  font-weight: 700;
}
.cta__subtitle {
  border-bottom-color: #33406b;
}
.cta__subtitle span {
  display: block;
  font-size: 17px;
  margin-top: 8px;
  letter-spacing: 0.08em;
}

/* ---------- 04 OPERATOR（.artist のスタイルを流用） ---------- */
/* ロゴ画像に差し替える場合はこのブロックごと <img> に置き換え */
.operator__logo {
  text-align: center;
  font-family: "Bebas Neue", sans-serif;
  font-size: 27px;
  letter-spacing: 0.16em;
  border: 1px solid #8ba6e0;
  color: #4a5a94;
  background-color: rgba(255, 255, 255, 0.55);
  padding: 16px 10px;
}
.operator__copy {
  margin-top: 26px;
  font-size: 20px;
  line-height: 1.7;
  text-align: center;
  font-weight: 500;
}
.operator__body {
  margin-top: 24px;
}
.artist__thumbnail img,
.operator__carousel img {
  border-radius: 6px;
}
/* イベント写真の自動横スクロールカルーセル（前半5枚＋複製5枚で無限ループ） */
.operator__carousel {
  margin-top: 32px;
  overflow: hidden;
}
.operator__track {
  display: flex;
  width: -webkit-max-content;
  width: max-content;
  animation: operator-scroll 30s linear infinite;
}
.operator__track img {
  width: 230px;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  margin-right: 12px;
  box-shadow: 0 4px 14px rgba(140, 170, 255, 0.3);
}
@keyframes operator-scroll {
  to {
    transform: translateX(-50%);
  }
}

/* ---------- 05 SUPPORT ---------- */
/* 「合格者へのサポート」(9文字)が40pxだと折り返すため縮小 */
.support__ja {
  font-size: 34px;
  white-space: nowrap;
  top: -18px;
}
.support-item__img img {
  border-radius: 6px;
}

/* ---------- 06 CONDITIONS / 07 FLOW ---------- */
/* ネオングラデ枠→パステル枠、黒カード→白カード */
.conditions__item,
.flow-item__head {
  background: linear-gradient(135deg, #8ec2ff, #c9a6ff, #ffb3dd);
}
.conditions__item-inner,
.flow-item__inner {
  background-color: #fff;
}
/* 白線SVGアイコンを白カード上でも見えるようネイビー寄りに反転 */
.conditions__icon img,
.flow-item__img img,
.flow-item__arrow img {
  filter: invert(0.75) sepia(0.2) saturate(2) hue-rotate(195deg);
}

/* ---------- 08 LINE誘導（テキスト版） ---------- */
.line a {
  display: block;
  color: #fff;
}
.line__inner {
  padding: 22px 16px 24px;
  text-align: center;
}
.line__title {
  font-size: 20px;
  line-height: 1.5;
}
.line__subtitle p {
  border-bottom-color: #fff;
}
.line__cta {
  margin-top: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  background: #ffffff;
  color: #06c755;
  border-radius: 8px;
  padding: 13px;
  font-size: 15px;
  font-weight: 700;
  font-family: "Noto Sans JP", sans-serif;
  max-width: 330px;
  margin-inline: auto;
}
.line__cta img {
  width: 26px;
  filter: invert(62%) sepia(66%) saturate(2411%) hue-rotate(93deg) brightness(96%) contrast(92%);
}

/* ---------- 09 FAQ ---------- */
/* 雪の結晶柄の背景と文字がかぶるため白カードを敷く */
.faq__list {
  background: rgba(255, 255, 255, 0.72);
  border-radius: 8px;
  padding: 2px 14px 12px;
}
.faq__item {
  border-bottom-color: rgba(90, 120, 190, 0.4);
}
.faq__question::before,
.faq__item.open .faq__question::before {
  color: #33406b;
}

/* ---------- 10 最終CTA ---------- */
.entry-bottom__title--text {
  text-align: center;
  font-size: 19px;
  line-height: 1.75;
  font-weight: 700;
  letter-spacing: 0.02em;
}

/* ---------- 11 フッター ---------- */
.company__title {
  border-bottom-color: rgba(90, 120, 190, 0.4);
}
.company__title::before,
.company__title.is-open::before {
  color: #33406b;
}
.company__privacy-inner {
  border-radius: 6px;
}
