/**
 * ------------------------------
 * tl-course.css
 * ------------------------------
 * @purpose
 * 講座TOPページのcss
 *
 * @pages
 * ・講座TOPページ
 *
 * @note
 * .wm-css：自作cssは区別のため、ラッパーコンテナにwm-cssクラスを付している
 *
 * @version
 * 1.0.0
 */

/**
 * ----------------------------------------
 *  # 講座TOPページ
 * ----------------------------------------
 */
/***
 * [ページ上部]
 */
/* 余白を圧縮 */
.tutor-course-details-page {
  padding-top: 8px !important;
}
/***
 * [タイトル]
 */
/* タイトル＋お気に入りを同一ライン化 */
.tutor-course-details-header {
  margin: 0 0 14px !important;
}
.tutor-course-details-header .tutor-course-details-top {
  margin-top: 0 !important;
}
.tutor-course-details-header .tutor-row {
  align-items: center !important;
}
.tutor-course-details-title {
  font-size: clamp(24px, 3vw, 34px) !important;
  line-height: 1.25 !important;
  margin: 0 !important;
}
/* タイトル行の不要余白対策 */
.tutor-course-details-top .tutor-col {
  flex: 1 1 auto;
}
.tutor-course-details-top .tutor-col-auto {
  margin-left: auto;
}
/* 無理に横並びしすぎない :sp */
@media screen and (max-width: 768px) {
  .tutor-course-details-header .tutor-row {
    display: flex !important;
    align-items: center !important;
  }

  .tutor-course-details-title {
    font-size: 28px !important;
  }

  .tutor-course-details-actions .tutor-btn {
    padding: 0 !important;
    font-size: 13px !important;
  }
}

/***
 * [カテゴリー]
 */
.tutor-course-details-info {
  display: none !important;
}

/***
 * [お気に入り]
 */
/* 右側に寄せる */
.tutor-course-details-actions {
  margin-top: 0 !important;
  white-space: nowrap;
}

/***
 * [コースサムネイルエリア]
 *    非表示
 */
.tutor-course-details-page .tutor-course-thumbnail {
  display: none !important;
}
/* コースサムネイル～コース内容エリア…位置を左右中央になるよう調整 */
.tutor-course-details-page .tutor-col-xl-8 {
  margin: auto auto auto 5% !important;
  padding: 0;
}
@media (max-width: 768px) {
  .tutor-course-details-page .tutor-col-xl-8 {
    margin: auto auto auto 2% !important;
  }
}

/***
 * [進捗バーエリア]
 */
/* 高さを圧縮 */
.wm-progress-top {
  visibility: visible !important;
  height: auto !important;
  overflow: visible !important;
  margin: 18px 0 22px;
}
/* カード感を消す */
.wm-progress-top .tutor-card {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
/* Tutor標準カードの余白を打ち消す */
.wm-progress-top .tutor-card-body,
.wm-progress-top .tutor-card-md .tutor-card-body {
  padding: 14px 24px !important;
}
/* 進捗ブロック */
.wm-progress-top .tutor-course-progress-wrapper {
  margin: 0 !important;
}
/* 進捗タイトル */
.wm-progress-top .tutor-course-progress-wrapper > h3 {
  font-size: 12px !important;
  font-weight: 600 !important;
  margin: 0 0 8px !important;
  color: #444 !important;
}
/* 数字行を横並びに戻す */
.wm-progress-top .list-item-progress .tutor-d-flex {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}
/* 進捗バーを細く・余白 */
.wm-progress-top div.list-item-progress {
  height: auto !important;
}
/* 進捗バー */
.wm-progress-top .tutor-progress-bar {
  height: 4px !important;
  margin-top: 8px !important;
  border-radius: 999px !important;
}
/* 登録日などだけ非表示。進捗数値は消さない */
.wm-progress-top .tutor-enrolled-info-text,
.wm-progress-top .tutor-card-footer,
.wm-progress-top .tutor-alert,
.wm-progress-top .tutor-btn {
  display: none !important;
}

/***
 * [進捗バーエリア :TLデフォルト]
 *    すべて非表示
 */
div.tutor-single-course-sidebar:not(.wm-progress-top) {
  visibility: hidden;
  height: 0;
  overflow: hidden;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}
/* コース登録日 */
.wm-progress-top .tutor-card-body > .tutor-fs-7.tutor-color-muted.tutor-mt-20 {
  display: none !important;
}
/* 難易度・コース期間・最終更新 */
div.tutor-card-footer {
  display: none !important;
}

/***
 * [タブエリア(講座情報・Q&A・メッセージ)]
 */
.tutor-course-details-tab {
  margin-top: 22px !important;
}
.tutor-tab {
  padding-top: 18px !important;
}

/***
 * ["講座情報"タブ > コース概要]
 */
/* デフォルトタイトルは非表示 */
#tutor-course-details-tab-info > div.tutor-course-details-content > h2 {
  display: none;
}
#tutor-course-details-tab-info > div.tutor-course-details-content {
  background: #f7f7f7;
  padding: 14px 16px;
  border-radius: 10px;
  border: 1px solid #ececec;
  line-height: 1.9;
  color: #444;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);
}
/***
 * ["講座情報"タブ > このコースで学べること・コース制作・このコースの内容]
 *    すべて非表示
 */
div.tutor-course-details-widget,
div.tutor-single-course-sidebar-more {
  display: none;
}

/***
 * [コース内容]
 */
.tutor-course-content-title {
  margin-bottom: 16px !important;
}
.tutor-mt-40 {
  margin-top: 30px !important;
}