@charset "utf-8";

/* ============================================================
   女の子詳細（profile.php）と、一覧ページの「詳細」ボタン
   一覧（cast/schedule/waiting）のカード表現に合わせつつ、
   名前まわりだけサイト共通の明朝を使っている。
   ============================================================ */

/* ---- 一覧ページの「詳細」ボタン ---------------------------- */
/* .oz_castReserveBtn（style.css:2661）の一段控えめな版として、その上に置く */

.oz_castDetailBtn {
  display: block;
  box-sizing: border-box;
  margin: 0 20px 10px;
  padding: 11px 0;
  background: #fff;
  border: 1px solid #f17066;
  border-radius: 25px;
  color: #f17066 !important;
  text-align: center;
  font-size: 14px;
  font-weight: bold;
  line-height: 1;
  text-decoration: none !important;
  transition: all 0.3s ease;
}

.oz_castDetailBtn:link,
.oz_castDetailBtn:visited,
.oz_castDetailBtn:active {
  color: #f17066 !important;
  text-decoration: none !important;
}

.oz_castDetailBtn:hover {
  background: #fff5f4;
  transform: translateY(-2px);
}

/* ---- 画像モーダル（js/popup.js）の「詳細を見る」 20260911 ---- */
/* cast.php / schedule.php / waiting.php 共通。
   画像のすぐ下、「閉じる｜本日出勤」（.oz_modal_buttons。style.css で高さ60px・絶対配置）の上に横幅いっぱいで置く。
   見た目は一覧カードの .oz_castDetailBtn と同じ白抜きで、角丸はモーダルのボタンに合わせて 8px。
   style.css は本番（ikenai.jp）と共用なので、こちらに書いている */
.oz_modal_detail {
  display: block;
  box-sizing: border-box;
  /* 上の 8px は画像下のドットとの間。SPは .oz_modal_info の内側余白が約6pxまで縮み、ドットと枠が接して見えるため */
  margin: 8px 0 0;
  padding: 14px 0;
  background: #fff;
  border: 1px solid #f17066;
  border-radius: 8px;
  color: #f17066 !important;
  text-align: center;
  font-size: 16px;
  font-weight: bold;
  line-height: 1;
  text-decoration: none !important;
  transition: background 0.3s ease;
}

.oz_modal_detail:hover {
  background: #fff5f4;
}

/* 次回出勤（本日出勤が無い子。cast.php のみ） 20260911
   本日出勤と同じ緑の枠のまま、「次回出勤 9/13(土)」「10:00〜18:00」の2行にする。
   1行だと枠からあふれて折り返し、ボタンの行（style.css で高さ60px）からはみ出すため、
   文字を少し小さく・上下の余白を詰めて2行で収める */
.oz_modal_buttons .oz_modal_schedule.is-next {
  padding: 9px 10px;
  font-size: 14px;
  line-height: 1.3;
}

/* 行ごとの span。style.css 先頭のリセット（html, body, div, span, … { color: #3c3c3c }）が
   span にも直接色を当てているため、枠の白（.oz_modal_schedule { color: white }）が継承されず
   濃いグレーになる。白をここで明示する */
.oz_modal_buttons .oz_modal_schedule.is-next .oz_modal_scheduleLine {
  display: block;
  color: #fff;
}

/* 「閉じる｜本日出勤」の行がいちばん下になったので、モーダルの下端との間に余白を取る
   （詳細を見る との間は style.css の margin-top 10px のまま） */
.oz_modal_buttons {
  margin: 10px auto 15px;
}

/* ---- 画像モーダルの大きさと位置 20260911 ---- */
/* 以前は画像の高さが固定（PC 500px / SP 480px）で、モーダルも上から 5%（SP 60px）に置いていたため、
   縦の短いスマホではボタンが画面の外に出て、縦の長い画面では上に寄って見えていた。
   ・画像の高さは「画面の高さ − 300px（ボタン・ドット・余白の分）」。最小 200px・最大 420px
     （dvh はスマホのアドレスバーの出入りに追従する単位。未対応のブラウザは直前の vh の指定が効く）
   ・モーダルは画面の縦中央に置く（表示は js/popup.js が display:flex で出す）
   ・SPの固定ヘッダー（sp_style.css の .oz_head … z-index 999999）より手前に出して、上端が隠れないようにする
   style.css / sp_style.css は本番（ikenai.jp）と共用なので、あとから読み込むこのファイルで上書きしている */
.oz_modal {
  z-index: 1000000;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  padding: 16px 0;
}

.oz_modal_content {
  margin: 0 auto !important;
  /* それでも収まらない極端に低い画面では、モーダルの中をスクロールできるようにする */
  max-height: 100%;
  overflow-y: auto;
}

.oz_modal_slider,
.oz_modal_slider .slick-slide,
.zoom-container {
  height: clamp(200px, calc(100vh - 300px), 420px);
  height: clamp(200px, calc(100dvh - 300px), 420px);
}

/* ---- 詳細ページ本体 ---------------------------------------- */

.profile {
  max-width: 1000px;
  margin: 0 auto;
}

.profile__main {
  display: grid;
  grid-template-columns: minmax(0, 44%) minmax(0, 1fr);
  gap: 34px;
  margin-bottom: 44px;
}

/* ---- 画像 -------------------------------------------------- */

.profile__gallery {
  min-width: 0;
}

/* slick 初期化前に全枚数が縦に見えるのを防ぐ */
.profile__slider:not(.slick-initialized) .profile__slide:not(:first-child) {
  display: none;
}

.profile__slide img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 12px;
}

.profile__slider .slick-dots {
  display: flex !important;
  justify-content: center;
  position: static;
  width: 100%;
  margin: 12px 0 0;
  padding: 0;
  list-style: none;
}

.profile__slider .slick-dots li {
  display: block;
  width: 20px;
  height: 20px;
  margin: 0 5px;
  padding: 0;
  background: #d9d9d9;
  border-radius: 100px;
  overflow: hidden;
  text-indent: -9999px;
  cursor: pointer;
}

.profile__slider .slick-dots li.slick-active {
  background: #f17066;
}

.profile__slider .slick-dots li button {
  display: block;
  width: 100%;
  height: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  -webkit-appearance: none;
  appearance: none;
  cursor: pointer;
}

/* ---- 基本情報 ---------------------------------------------- */

.profile__info {
  min-width: 0;
}

.profile__shop {
  display: inline-block;
  background: rgba(241, 112, 102, 0.1);
  color: #f17066;
  font-size: 12px;
  font-weight: bold;
  letter-spacing: 0.06em;
  border-radius: 100px;
  padding: 5px 14px;
  margin-bottom: 14px;
}

.profile__name {
  font-family: "Shippori Mincho B1", serif;
  font-size: 30px;
  font-weight: 600;
  letter-spacing: 0.06em;
  line-height: 1.4;
  margin: 0 0 6px;
  color: #2e2725;
}

.profile__name small {
  font-size: 17px;
  font-weight: 600;
  margin-left: 8px;
  color: #6b605d;
}

.profile__kana {
  font-size: 13px;
  color: #a89b98;
  letter-spacing: 0.08em;
  margin: 0 0 20px;
}

/* サイズ 20260911。表（6マス）をやめて「身長 168cm ｜ B85（C）/ W58 / H87」の1行に。
   上下に細い線を引いて、名前と本日の出勤の間を区切る */
.profile__size {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 0;
  margin: 0 0 20px;
  padding: 12px 0;
  border-top: 1px solid rgba(58, 50, 48, 0.12);
  border-bottom: 1px solid rgba(58, 50, 48, 0.12);
  font-size: 17px;
  font-weight: bold;
  letter-spacing: 0.04em;
  color: #2e2725;
}

/* 「cm」「（C）」は一段小さく */
.profile__size small {
  margin-left: 2px;
  font-size: 12px;
  font-weight: normal;
  color: #6b605d;
}

.profile__sizeLabel {
  margin-right: 8px;
  font-size: 12px;
  font-weight: normal;
  letter-spacing: 0.06em;
  color: #a89b98;
}

/* 身長と3サイズの間の縦線 */
.profile__sizeHeight {
  margin-right: 16px;
  padding-right: 16px;
  border-right: 1px solid rgba(58, 50, 48, 0.2);
}

/* ---- 女の子コメント（MESSAGE） 20260911 --------------------- */
/* 予約ボタンの下。見出しは英字だけ。長いものは profile.php のJSが 170px で畳む */

.profile__message {
  margin-top: 24px;
  padding-top: 18px;
  border-top: 1px solid rgba(58, 50, 48, 0.12);
}

.profile__messageEn {
  display: block;
  margin-bottom: 8px;
  font-family: "Castoro Titling", serif;
  font-size: 20px;
  font-weight: 400;
  letter-spacing: 0.08em;
  line-height: 1.2;
  color: #f17066;
}

.profile__comment--message {
  line-height: 1.9;
}

.profile__message .profile__more {
  margin-top: 12px;
}

/* 本日の出勤 */
.profile__today {
  border: 1px solid rgba(58, 50, 48, 0.14);
  border-radius: 6px;
  padding: 14px 16px;
  margin-bottom: 20px;
  font-size: 14px;
  line-height: 1.7;
  color: #4a423f;
}

.profile__today--working {
  border-color: #f17066;
  background: #fff8f7;
}

.profile__todayLabel {
  display: inline-block;
  font-size: 11px;
  font-weight: bold;
  letter-spacing: 0.08em;
  color: #fff;
  background: #f17066;
  border-radius: 100px;
  padding: 3px 10px;
  margin-right: 8px;
}

.profile__todayTime {
  font-weight: bold;
  color: #2e2725;
  font-size: 16px;
}

/* 予約ボタン。一覧の .oz_castReserveBtn と同じ見た目に揃える */
.profile__reserve {
  display: block;
  box-sizing: border-box;
  width: 100%;
  padding: 16px 0;
  background: linear-gradient(135deg, #f17066, #ff8a7b);
  border-radius: 30px;
  color: #fff !important;
  text-align: center;
  font-size: 16px;
  font-weight: bold;
  text-decoration: none !important;
  transition: all 0.3s ease;
}

.profile__reserve:hover {
  background: linear-gradient(135deg, #e55a4f, #f17066);
  transform: translateY(-2px);
}

/* ---- 一言コメント（上部のキャッチコピー） 20260911 ---------- */

.profile__catch {
  margin: 0 0 20px;
  padding: 12px 16px;
  border-left: 3px solid #f17066;
  background: #fff8f7;
  font-family: "Shippori Mincho B1", serif;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.8;
  letter-spacing: 0.04em;
  color: #4a3f3c;
}

/* ---- 上部のタグ（個性／プレイスタイル） 20260911 ------------ */
/* 予約ボタンの下に、区分名のラベル＋タグの行を並べる */

.profile__infoTags {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-top: 18px;
}

.profile__infoTags + .profile__infoTags {
  margin-top: 10px;
}

.profile__infoTagsLabel {
  flex: 0 0 auto;
  min-width: 6.5em;
  padding-top: 7px;
  font-size: 12px;
  font-weight: bold;
  letter-spacing: 0.06em;
  color: #a89b98;
}

/* ---- セクション見出し -------------------------------------- */
/* 20260911 から英字（Castoro Titling）＋日本語の2段組み。
   英字はナビの「TOP / CAST …」と同じ書体で、セクションの切れ目の目印にする */

.profile__secTitle {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 4px 14px;
  margin: 0 0 20px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(58, 50, 48, 0.15);
  position: relative;
}

/* 下線の左端だけアクセント色にする */
.profile__secTitle::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: -1px;
  width: 48px;
  height: 2px;
  background: #f17066;
}

.profile__secEn {
  font-family: "Castoro Titling", serif;
  font-size: 26px;
  font-weight: 400;
  letter-spacing: 0.08em;
  line-height: 1.1;
  color: #f17066;
}

.profile__secJa {
  font-family: "Shippori Mincho B1", serif;
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 0.06em;
  color: #2e2725;
}

.profile__section {
  margin-bottom: 48px;
}

/* ---- 出勤スケジュール -------------------------------------- */
/* profile.php が2週間分（PROFILE_SCHEDULE_DAYS = 14）を出すので、
   7列に流し込むと自動的に 7列×2段 になる。日数を変えるときは
   profile.php の定数と、この repeat(7, ...) を合わせて見直すこと */

.profile__schedule {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 8px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.profile__day {
  background: #fff;
  border: 1px solid rgba(58, 50, 48, 0.14);
  border-radius: 6px;
  padding: 12px 4px;
  text-align: center;
}

.profile__day--off {
  background: #faf8f8;
  color: #b3a7a5;
}

.profile__day--work {
  border-color: #f17066;
}

.profile__dayDate {
  display: block;
  font-size: 12px;
  color: #a89b98;
  margin-bottom: 2px;
}

.profile__dayWeek {
  display: block;
  font-size: 11px;
  color: #a89b98;
  margin-bottom: 8px;
}

.profile__dayWeek--sat { color: #5d9cec; }
.profile__dayWeek--sun { color: #e8635a; }

.profile__dayTime {
  display: block;
  font-size: 13px;
  font-weight: bold;
  line-height: 1.5;
  color: #2e2725;
}

.profile__day--off .profile__dayTime {
  font-weight: normal;
  color: #b3a7a5;
}

/* PCは開始・終了を2行に分けて出す（「〜」はSPでだけ使う） */
.profile__dayStart,
.profile__dayEnd {
  display: block;
}

.profile__dayTilde {
  display: none;
}

/* ---- タグ・可能オプション ---------------------------------- */
/* 管理画面のフリータグ（config.php で作成）と
   オプションマスタから、girlData.php で選んだものを並べる。
   どちらも0件のときはPHP側でセクションごと出さない */

.profile__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.profile__tag {
  padding: 6px 14px;
  border: 1px solid rgba(241, 112, 102, 0.5);
  border-radius: 100px;
  background: #fff6f5;
  color: #d4574c;
  font-size: 13px;
  line-height: 1.5;
}

/* 可能オプションは件数が多くなりがちなので、少し控えめにする */
.profile__tags--option .profile__tag {
  border-color: rgba(58, 50, 48, 0.2);
  background: #faf8f8;
  color: #6b5f5c;
}

/* ---- Q&A ---------------------------------------------------- */
/* 管理画面の「アンケート項目」への回答＋キャスト個別のQ&A。
   APIが1つのリストにまとめて返すので、ここでは並べるだけ */

/* 20260911 からPCは2列。1問ずつ下に点線を引く（2列でも行の区切りが揃うように、上ではなく下に引く） */
.profile__qa {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 40px;
  margin: 0;
}

.profile__qaItem {
  padding: 16px 0;
  border-bottom: 1px dashed rgba(58, 50, 48, 0.2);
}

.profile__qaQ {
  position: relative;
  margin: 0 0 6px;
  padding-left: 26px;
  font-size: 14px;
  font-weight: bold;
  color: #d4574c;
}

.profile__qaQ::before {
  content: 'Q.';
  position: absolute;
  left: 0;
  font-family: "Castoro Titling", serif;
}

.profile__qaA {
  position: relative;
  margin: 0;
  padding-left: 26px;
  font-size: 14px;
  line-height: 1.9;
  color: #3a3230;
}

.profile__qaA::before {
  content: 'A.';
  position: absolute;
  left: 0;
  color: #a89b98;
  font-family: "Castoro Titling", serif;
}

/* ---- コメント ---------------------------------------------- */

.profile__comment {
  margin: 0;
  font-size: 14px;
  line-height: 2;
  color: #3a3230;
}

/* 長文の折りたたみ 20260911。is-folded は profile.php のJSが、長いものにだけ付ける。
   畳む高さ（max-height）も JS が data-fold の値で付ける（MESSAGE 170px / お店コメント 280px）。
   下端は白へのグラデーションで「続きがある」ことを見せる */
.profile__comment.is-folded {
  position: relative;
  overflow: hidden;
}

.profile__comment.is-folded::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 90px;
  background: linear-gradient(rgba(255, 255, 255, 0), #fff);
  pointer-events: none;
}

.profile__comment.is-folded.is-open {
  max-height: none;
}

.profile__comment.is-folded.is-open::after {
  display: none;
}

/* 「続きを読む」。一覧の「詳細」ボタン（.oz_castDetailBtn）と同じ控えめな白抜き */
.profile__more {
  display: block;
  width: 220px;
  max-width: 100%;
  margin: 16px auto 0;
  padding: 10px 0;
  background: #fff;
  border: 1px solid #f17066;
  border-radius: 25px;
  color: #f17066;
  font-size: 14px;
  font-weight: bold;
  line-height: 1;
  cursor: pointer;
  transition: all 0.3s ease;
}

.profile__more:hover {
  background: #fff5f4;
}

.profile__more[hidden] {
  display: none;
}

/* ---- 写メ日記（ヘブンのウィジェット） 20260911 ------------- */
/* タグの iframe は width="100%"。高さはウィジェット側から postMessage で届いた値が入る */
.profile__diary iframe {
  display: block;
  width: 100%;
  max-width: 100%;
  border: 0;
}

.profile__note {
  margin: 12px 0 0;
  font-size: 12px;
  line-height: 1.8;
  color: #a89b98;
}

.profile__note a {
  color: #d4574c;
}

/* ---- 準備中プレースホルダー -------------------------------- */
/* 現在は未使用（プロフィール枠は実データに差し替え済み）。
   今後 Q&A などを段階的に足すときの受け皿として残している */

.profile__placeholder {
  background: #faf8f8;
  border: 1px dashed rgba(58, 50, 48, 0.25);
  border-radius: 6px;
  padding: 22px;
  text-align: center;
  color: #a89b98;
  font-size: 13.5px;
  line-height: 1.9;
}

/* ---- 戻る -------------------------------------------------- */

.profile__backWrap {
  text-align: center;
  margin-top: 10px;
}

/* ---- SP ---------------------------------------------------- */

@media (max-width: 768px) {
  .oz_castDetailBtn {
    margin: 0 15px 10px;
    padding: 9px 0;
  }

  .profile__main {
    grid-template-columns: 1fr;
    gap: 22px;
    margin-bottom: 32px;
  }

  .profile__name {
    font-size: 24px;
  }

  .profile__name small {
    font-size: 15px;
  }

  .profile__size {
    font-size: 15px;
  }

  .profile__sizeHeight {
    margin-right: 12px;
    padding-right: 12px;
  }

  .profile__secEn {
    font-size: 22px;
  }

  .profile__secJa {
    font-size: 14px;
  }

  .profile__section {
    margin-bottom: 36px;
  }

  .profile__catch {
    font-size: 14px;
  }

  /* 狭い画面はラベルを上、タグを下に積む */
  .profile__infoTags {
    flex-direction: column;
    gap: 6px;
  }

  .profile__infoTagsLabel {
    padding-top: 0;
  }

  /* Q&A はSPでは1列 */
  .profile__qa {
    grid-template-columns: 1fr;
  }

  /* SPは横スクロールをやめて、1日1行の横長ブロックを2週間分縦に積む。
     1行のなかで 左＝日付・曜日 / 右＝時間 に振り分ける */
  .profile__schedule {
    grid-template-columns: 1fr;
    gap: 6px;
  }

  .profile__day {
    display: flex;
    align-items: center;
    padding: 11px 14px;
    text-align: left;
  }

  .profile__dayDate {
    display: inline;
    margin-bottom: 0;
    font-size: 14px;
    color: #2e2725;
  }

  /* 曜日に margin-right:auto を持たせて、日付＋曜日を左、時間を右端に寄せる */
  .profile__dayWeek {
    display: inline;
    margin: 0 auto 0 8px;
    font-size: 13px;
  }

  .profile__day--off .profile__dayDate {
    color: #b3a7a5;
  }

  /* 時間は「10:00〜17:00」の1行にまとめる */
  .profile__dayTime {
    font-size: 14px;
  }

  .profile__dayStart,
  .profile__dayEnd {
    display: inline;
  }

  .profile__dayTilde {
    display: inline;
    margin: 0 2px;
    font-weight: normal;
  }
}

/* ---- すぐ姫 ------------------------------------------------ */
/* 出勤スケジュールの下に置く、いま案内できる子への導線。
   顔ぶれと順序は waiting.php の「すぐ～30分」～「2時間以上」と同じで、
   出勤確定・予約完売・受付終了は profile.php 側で除外している。
   バッジの色は css/style.css の .waiting-bg_001〜004 をそのまま使う。

   スライダーは profile.php のインラインJSで初期化している。
   TOPのPICK UP（.oz_pickupSlider）は js/common_ui.js が自動初期化してしまい
   4枚並び・ページ送りで固定されるため、こちらは専用クラスにしてある */

/* 矢印を左右に置くぶん、内側に余白を取る */
.profile__himeWrap {
  position: relative;
  padding: 0 34px;
}

/* slickの初期化前、およびJSが動かないときのフォールバック。
   初期化されると .slick-initialized が付いてこの指定は外れる */
.profile__himeSlider:not(.slick-initialized) {
  display: flex;
  gap: 12px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 10px;
}

.profile__himeSlider:not(.slick-initialized) .profile__himeItem {
  flex: 0 0 150px;
}

.profile__himeSlider {
  list-style: none;
  margin: 0;
  padding: 0;
}

/* カードのホバー時の浮き上がりと影が .slick-list に切られないよう逃がす */
.profile__himeSlider .slick-list {
  padding: 4px 0 10px;
}

/* slick では gap が使えないので、スライドの左右 padding で 12px 相当の間隔を作る */
.profile__himeSlider .slick-slide {
  padding: 0 6px;
  box-sizing: border-box;
}

/* 名前の長さでカードの高さが変わっても揃える */
.profile__himeSlider .slick-track {
  display: flex;
}

.profile__himeSlider .slick-slide > div {
  height: 100%;
}

/* 矢印。スライダーとして初期化された（.is-slider が付いた）ときだけ見せる */
.profile__himeArrow {
  display: none;
}

.profile__himeWrap.is-slider .profile__himeArrow {
  display: block;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 5;
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
  transition: opacity 0.3s ease;
}

.profile__himeWrap.is-slider .profile__himeArrow:hover {
  opacity: 0.7;
}

.profile__himeArrow--prev { left: 0; }
.profile__himeArrow--next { right: 0; }

.profile__himeArrow img {
  display: block;
  width: 28px;
  height: auto;
}
.profile__himeLink {
  display: block;
  border: 1px solid rgba(58, 50, 48, 0.14);
  border-radius: 8px;
  overflow: hidden;
  background: #fff;
  color: inherit !important;
  text-decoration: none !important;
  transition: all 0.3s ease;
}

.profile__himeLink:hover {
  border-color: #f17066;
  transform: translateY(-3px);
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.1);
}

/* バッジを重ねる基準 */
.profile__himeThumb {
  position: relative;
  display: block;
}

/* 元画像は縦横比がまちまちなので、比率を固定して切り抜く */
.profile__himeThumb img {
  display: block;
  width: 100%;
  aspect-ratio: 3 / 4;
  object-fit: cover;
}

.profile__himeBadge {
  position: absolute;
  left: 0;
  bottom: 0;
  padding: 3px 8px;
  border-top-right-radius: 6px;
  color: #fff;
  font-size: 11px;
  font-weight: bold;
  line-height: 1.3;
  white-space: nowrap;
}

.profile__himeName {
  display: block;
  padding: 8px 8px 0;
  font-size: 13px;
  font-weight: bold;
  color: #2e2725;
  /* 長い名前でもカード幅を崩さない */
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.profile__himeAge {
  display: block;
  padding: 2px 8px 10px;
  font-size: 12px;
  color: #a89b98;
}

/* スクロールバー。日付ボタン（css/style.css:2970-2988）と同じ色味に揃える */
.profile__himeSlider:not(.slick-initialized)::-webkit-scrollbar {
  height: 4px;
}

.profile__himeSlider:not(.slick-initialized)::-webkit-scrollbar-track {
  background: #f1f1f1;
  border-radius: 2px;
}

.profile__himeSlider:not(.slick-initialized)::-webkit-scrollbar-thumb {
  background: #f17066;
  border-radius: 2px;
}

@media (max-width: 768px) {
  .profile__himeWrap {
    padding: 0 26px;
  }

  .profile__himeSlider:not(.slick-initialized) .profile__himeItem {
    flex: 0 0 120px;
  }

  .profile__himeArrow img {
    width: 22px;
  }

  .profile__himeName {
    font-size: 12px;
  }
}