@charset "UTF-8";
/* =============================================================================
 * 管理画面用SCSS
 * ========================================================================== */
/* =============================================================================
 * ベース
 * ========================================================================== */
body {
  font-size: 16px;
  color: #000000;
}

/**
 * ボタンカラー
 */
.btn-default {
  background-color: #D84315 !important;
  border: 1px solid #D84315 !important;
}
.btn-default:hover {
  color: #90A4AE !important;
}

/**
 * 部品
 */
.title_seprater {
  background-color: #8D6E63 !important;
}

/**
 * マーカー
 */
/* 黄色のマーカー */
.marker-yellow {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(60%, transparent), color-stop(60%, #F4FF81), color-stop(85%, #F4FF81), color-stop(85%, transparent));
  background: linear-gradient(transparent 60%, #F4FF81 60%, #F4FF81 85%, transparent 85%);
}

/* ピンクのマーカー */
.marker-pink {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(60%, transparent), color-stop(60%, #F8BBD0), color-stop(85%, #F8BBD0), color-stop(85%, transparent));
  background: linear-gradient(transparent 60%, #F8BBD0 60%, #F8BBD0 85%, transparent 85%);
}

/* 緑のマーカー */
.marker-green {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(60%, transparent), color-stop(60%, #AED581), color-stop(85%, #AED581), color-stop(85%, transparent));
  background: linear-gradient(transparent 60%, #AED581 60%, #AED581 85%, transparent 85%);
}

/* オレンジのマーカー */
.marker-orange {
  background: -webkit-gradient(linear, left top, left bottom, color-stop(60%, transparent), color-stop(60%, #FFCC80), color-stop(85%, #FFCC80), color-stop(85%, transparent));
  background: linear-gradient(transparent 60%, #FFCC80 60%, #FFCC80 85%, transparent 85%);
}

/**
 * ページ構成用
 */
#page h2 {
  text-align: center;
  padding-bottom: 0.3em;
  margin-bottom: 1.2rem;
  border-bottom: 2px #FFB74D solid;
}

/**
 * コールアウト
 */
.bs-callout {
  padding: 0.75em;
  margin: 1rem 0;
  border: 1px solid #eee;
  border-left-width: 5px;
  border-radius: 3px;
}

.bs-callout h4 {
  margin-top: 0;
  margin-bottom: 5px;
}

.bs-callout p:last-child {
  margin-bottom: 0;
}

.bs-callout code {
  border-radius: 3px;
}

.bs-callout + .bs-callout {
  margin-top: -5px;
}

.bs-callout-default {
  border-left-color: #777;
}

.bs-callout-default h4 {
  color: #777;
}

.bs-callout-primary {
  border-left-color: #428bca;
}

.bs-callout-primary h4 {
  color: #428bca;
}

.bs-callout-success {
  border-left-color: #5cb85c;
}

.bs-callout-success h4 {
  color: #5cb85c;
}

.bs-callout-danger {
  border-left-color: #d9534f;
}

.bs-callout-danger h4 {
  color: #d9534f;
}

.bs-callout-warning {
  border-left-color: #f0ad4e;
}

.bs-callout-warning h4 {
  color: #f0ad4e;
}

.bs-callout-info {
  border-left-color: #5bc0de;
}

.bs-callout-info h4 {
  color: #5bc0de;
}

.card.no-border {
  border: 0px;
}

/* =============================================================================
 * ユーティリティ
 * ========================================================================== */
/**
 * 表示状態
 */
.hide {
  display: none;
}

/**
readonly
 */
[realonly] {
  background-color: #EEE !important;
}

/**
 * 幅指定
 */
.max-width-100 {
  max-width: 100px;
}

.max-width-200 {
  max-width: 200px;
}

/**
 * 枠付きエリア
 */
.with-border {
  border: 1px solid #999999;
  padding: 0.45em;
}

.mb-0 {
  margin-bottom: 0 !important;
}

.mt-0 {
  margin-top: 0 !important;
}

.mb-0 {
  margin-bottom: 0px !important;
}

.mt-0 {
  margin-top: 0px !important;
}

.mb-5 {
  margin-bottom: 5px !important;
}

.mt-5 {
  margin-top: 5px !important;
}

.mb-10 {
  margin-bottom: 10px !important;
}

.mt-10 {
  margin-top: 10px !important;
}

.mb-15 {
  margin-bottom: 15px !important;
}

.mt-15 {
  margin-top: 15px !important;
}

.mb-20 {
  margin-bottom: 20px !important;
}

.mt-20 {
  margin-top: 20px !important;
}

.mb-25 {
  margin-bottom: 25px !important;
}

.mt-25 {
  margin-top: 25px !important;
}

.mb-30 {
  margin-bottom: 30px !important;
}

.mt-30 {
  margin-top: 30px !important;
}

.mb-35 {
  margin-bottom: 35px !important;
}

.mt-35 {
  margin-top: 35px !important;
}

.mb-40 {
  margin-bottom: 40px !important;
}

.mt-40 {
  margin-top: 40px !important;
}

.mb-45 {
  margin-bottom: 45px !important;
}

.mt-45 {
  margin-top: 45px !important;
}

.mb-50 {
  margin-bottom: 50px !important;
}

.mt-50 {
  margin-top: 50px !important;
}

.mb-55 {
  margin-bottom: 55px !important;
}

.mt-55 {
  margin-top: 55px !important;
}

.mb-60 {
  margin-bottom: 60px !important;
}

.mt-60 {
  margin-top: 60px !important;
}

.mb-65 {
  margin-bottom: 65px !important;
}

.mt-65 {
  margin-top: 65px !important;
}

.mb-70 {
  margin-bottom: 70px !important;
}

.mt-70 {
  margin-top: 70px !important;
}

.mb-75 {
  margin-bottom: 75px !important;
}

.mt-75 {
  margin-top: 75px !important;
}

.mb-80 {
  margin-bottom: 80px !important;
}

.mt-80 {
  margin-top: 80px !important;
}

.mb-85 {
  margin-bottom: 85px !important;
}

.mt-85 {
  margin-top: 85px !important;
}

.mb-90 {
  margin-bottom: 90px !important;
}

.mt-90 {
  margin-top: 90px !important;
}

.mb-95 {
  margin-bottom: 95px !important;
}

.mt-95 {
  margin-top: 95px !important;
}

.mb-100 {
  margin-bottom: 100px !important;
}

.mt-100 {
  margin-top: 100px !important;
}

@media (max-width:767px) {
  .mb-sp-0 {
    margin-bottom: 0px !important;
  }
  .mt-sp-0 {
    margin-top: 0px !important;
  }
}
@media (max-width:767px) {
  .mb-sp-5 {
    margin-bottom: 5px !important;
  }
  .mt-sp-5 {
    margin-top: 5px !important;
  }
}
@media (max-width:767px) {
  .mb-sp-10 {
    margin-bottom: 10px !important;
  }
  .mt-sp-10 {
    margin-top: 10px !important;
  }
}
@media (max-width:767px) {
  .mb-sp-15 {
    margin-bottom: 15px !important;
  }
  .mt-sp-15 {
    margin-top: 15px !important;
  }
}
@media (max-width:767px) {
  .mb-sp-20 {
    margin-bottom: 20px !important;
  }
  .mt-sp-20 {
    margin-top: 20px !important;
  }
}
@media (max-width:767px) {
  .mb-sp-25 {
    margin-bottom: 25px !important;
  }
  .mt-sp-25 {
    margin-top: 25px !important;
  }
}
@media (max-width:767px) {
  .mb-sp-30 {
    margin-bottom: 30px !important;
  }
  .mt-sp-30 {
    margin-top: 30px !important;
  }
}
@media (max-width:767px) {
  .mb-sp-35 {
    margin-bottom: 35px !important;
  }
  .mt-sp-35 {
    margin-top: 35px !important;
  }
}
@media (max-width:767px) {
  .mb-sp-40 {
    margin-bottom: 40px !important;
  }
  .mt-sp-40 {
    margin-top: 40px !important;
  }
}
@media (max-width:767px) {
  .mb-sp-45 {
    margin-bottom: 45px !important;
  }
  .mt-sp-45 {
    margin-top: 45px !important;
  }
}
@media (max-width:767px) {
  .mb-sp-50 {
    margin-bottom: 50px !important;
  }
  .mt-sp-50 {
    margin-top: 50px !important;
  }
}
@media (max-width:767px) {
  .mb-sp-55 {
    margin-bottom: 55px !important;
  }
  .mt-sp-55 {
    margin-top: 55px !important;
  }
}
@media (max-width:767px) {
  .mb-sp-60 {
    margin-bottom: 60px !important;
  }
  .mt-sp-60 {
    margin-top: 60px !important;
  }
}
@media (max-width:767px) {
  .mb-sp-65 {
    margin-bottom: 65px !important;
  }
  .mt-sp-65 {
    margin-top: 65px !important;
  }
}
@media (max-width:767px) {
  .mb-sp-70 {
    margin-bottom: 70px !important;
  }
  .mt-sp-70 {
    margin-top: 70px !important;
  }
}
@media (max-width:767px) {
  .mb-sp-75 {
    margin-bottom: 75px !important;
  }
  .mt-sp-75 {
    margin-top: 75px !important;
  }
}
@media (max-width:767px) {
  .mb-sp-80 {
    margin-bottom: 80px !important;
  }
  .mt-sp-80 {
    margin-top: 80px !important;
  }
}
@media (max-width:767px) {
  .mb-sp-85 {
    margin-bottom: 85px !important;
  }
  .mt-sp-85 {
    margin-top: 85px !important;
  }
}
@media (max-width:767px) {
  .mb-sp-90 {
    margin-bottom: 90px !important;
  }
  .mt-sp-90 {
    margin-top: 90px !important;
  }
}
@media (max-width:767px) {
  .mb-sp-95 {
    margin-bottom: 95px !important;
  }
  .mt-sp-95 {
    margin-top: 95px !important;
  }
}
@media (max-width:767px) {
  .mb-sp-100 {
    margin-bottom: 100px !important;
  }
  .mt-sp-100 {
    margin-top: 100px !important;
  }
}
.mb-xs {
  margin-bottom: 1.25rem !important;
}

.mt-xs {
  margin-top: 1.25rem !important;
}

.mb-s {
  margin-bottom: 2.5rem !important;
}

.mt-s {
  margin-top: 2.5rem !important;
}

.mb-m {
  margin-bottom: 3.75rem !important;
}

.mt-m {
  margin-top: 3.75rem !important;
}

.mb-l {
  margin-bottom: 6.25rem !important;
}

.mt-l {
  margin-top: 6.25rem !important;
}

.mb-xl {
  margin-bottom: 11.25rem !important;
}

.mt-xl {
  margin-top: 11.25rem !important;
}

@media (max-width:767px) {
  .mb-xs {
    margin-bottom: 0.625rem !important;
  }
  .mt-xs {
    margin-top: 0.625rem !important;
  }
  .mb-s {
    margin-bottom: 1.25rem !important;
  }
  .mt-s {
    margin-top: 1.25rem !important;
  }
  .mb-m {
    margin-bottom: 2.5rem !important;
  }
  .mt-m {
    margin-top: 2.5rem !important;
  }
  .mb-l {
    margin-bottom: 5rem !important;
  }
  .mt-l {
    margin-top: 5rem !important;
  }
  .mb-xl {
    margin-bottom: 7.5rem !important;
  }
  .mt-xl {
    margin-top: 7.5rem !important;
  }
}
/**
 * 下マージン
 */
.margin-bottom-020 {
  margin-bottom: 0.2rem;
}

.margin-bottom-025 {
  margin-bottom: 0.25rem;
}

.margin-bottom-030 {
  margin-bottom: 0.3rem;
}

.margin-bottom-050 {
  margin-bottom: 0.5rem;
}

.margin-bottom-070 {
  margin-bottom: 0.7rem;
}

.margin-bottom-075 {
  margin-bottom: 0.75rem;
}

.margin-bottom-080 {
  margin-bottom: 0.8rem;
}

.margin-bottom-090 {
  margin-bottom: 0.9rem;
}

.margin-bottom-100 {
  margin-bottom: 1rem;
}

.margin-bottom-120 {
  margin-bottom: 1.2rem;
}

.margin-bottom-125 {
  margin-bottom: 1.25rem;
}

.margin-bottom-130 {
  margin-bottom: 1.3rem;
}

.margin-bottom-150 {
  margin-bottom: 1.5rem;
}

.margin-bottom-160 {
  margin-bottom: 1.6rem;
}

.margin-bottom-175 {
  margin-bottom: 1.75rem;
}

.margin-bottom-180 {
  margin-bottom: 1.8rem;
}

.margin-bottom-200 {
  margin-bottom: 2rem;
}

.margin-bottom-225 {
  margin-bottom: 2.25rem;
}

.margin-bottom-250 {
  margin-bottom: 2.5rem;
}

.margin-bottom-300 {
  margin-bottom: 3rem;
}

.margin-bottom-350 {
  margin-bottom: 3.5rem;
}

.margin-bottom-400 {
  margin-bottom: 4rem;
}

.margin-bottom-450 {
  margin-bottom: 4.5rem;
}

.margin-bottom-500 {
  margin-bottom: 5rem;
}

.margin-bottom-550 {
  margin-bottom: 5.5rem;
}

.margin-bottom-600 {
  margin-bottom: 6rem;
}

.margin-bottom-650 {
  margin-bottom: 6.5rem;
}

.margin-bottom-700 {
  margin-bottom: 7rem;
}

.margin-bottom-750 {
  margin-bottom: 7.5rem;
}

.margin-bottom-800 {
  margin-bottom: 8rem;
}

.margin-bottom-850 {
  margin-bottom: 8.5rem;
}

/**
 * パディング
 */
.padding-020 {
  padding: 0.2rem;
}

.padding-025 {
  padding: 0.25rem;
}

.padding-030 {
  padding: 0.3rem;
}

.padding-050 {
  padding: 0.5rem;
}

.padding-070 {
  padding: 0.7rem;
}

.padding-075 {
  padding: 0.75rem;
}

.padding-080 {
  padding: 0.8rem;
}

.padding-090 {
  padding: 0.9rem;
}

.padding-100 {
  padding: 1rem;
}

.padding-120 {
  padding: 1.2rem;
}

.padding-125 {
  padding: 1.25rem;
}

.padding-130 {
  padding: 1.3rem;
}

.padding-150 {
  padding: 1.5rem;
}

.padding-160 {
  padding: 1.6rem;
}

.padding-175 {
  padding: 1.75rem;
}

.padding-180 {
  padding: 1.8rem;
}

.padding-200 {
  padding: 2rem;
}

.padding-225 {
  padding: 2.25rem;
}

.padding-250 {
  padding: 2.5rem;
}

.padding-300 {
  padding: 3rem;
}

.padding-350 {
  padding: 3.5rem;
}

.padding-400 {
  padding: 4rem;
}

.padding-450 {
  padding: 4.5rem;
}

.padding-500 {
  padding: 5rem;
}

.padding-550 {
  padding: 5.5rem;
}

.padding-600 {
  padding: 6rem;
}

.padding-650 {
  padding: 6.5rem;
}

.padding-700 {
  padding: 7rem;
}

.padding-750 {
  padding: 7.5rem;
}

.padding-800 {
  padding: 8rem;
}

.padding-850 {
  padding: 8.5rem;
}

/**
 * パディング下
 */
.padding-bottom-020 {
  padding-bottom: 0.2rem;
}

.padding-bottom-025 {
  padding-bottom: 0.25rem;
}

.padding-bottom-030 {
  padding-bottom: 0.3rem;
}

.padding-bottom-050 {
  padding-bottom: 0.5rem;
}

.padding-bottom-070 {
  padding-bottom: 0.7rem;
}

.padding-bottom-075 {
  padding-bottom: 0.75rem;
}

.padding-bottom-080 {
  padding-bottom: 0.8rem;
}

.padding-bottom-090 {
  padding-bottom: 0.9rem;
}

.padding-bottom-100 {
  padding-bottom: 1rem;
}

.padding-bottom-120 {
  padding-bottom: 1.2rem;
}

.padding-bottom-125 {
  padding-bottom: 1.25rem;
}

.padding-bottom-130 {
  padding-bottom: 1.3rem;
}

.padding-bottom-150 {
  padding-bottom: 1.5rem;
}

.padding-bottom-160 {
  padding-bottom: 1.6rem;
}

.padding-bottom-175 {
  padding-bottom: 1.75rem;
}

.padding-bottom-180 {
  padding-bottom: 1.8rem;
}

.padding-bottom-200 {
  padding-bottom: 2rem;
}

.padding-bottom-225 {
  padding-bottom: 2.25rem;
}

.padding-bottom-250 {
  padding-bottom: 2.5rem;
}

.padding-bottom-300 {
  padding-bottom: 3rem;
}

.padding-bottom-350 {
  padding-bottom: 3.5rem;
}

.padding-bottom-400 {
  padding-bottom: 4rem;
}

.padding-bottom-450 {
  padding-bottom: 4.5rem;
}

.padding-bottom-500 {
  padding-bottom: 5rem;
}

.padding-bottom-550 {
  padding-bottom: 5.5rem;
}

.padding-bottom-600 {
  padding-bottom: 6rem;
}

.padding-bottom-650 {
  padding-bottom: 6.5rem;
}

.padding-bottom-700 {
  padding-bottom: 7rem;
}

.padding-bottom-750 {
  padding-bottom: 7.5rem;
}

.padding-bottom-800 {
  padding-bottom: 8rem;
}

.padding-bottom-850 {
  padding-bottom: 8.5rem;
}

/**
 * パディング上
 */
.padding-bottom-020 {
  padding-top: 0.2rem;
}

.padding-bottom-025 {
  padding-top: 0.25rem;
}

.padding-bottom-030 {
  padding-top: 0.3rem;
}

.padding-bottom-050 {
  padding-top: 0.5rem;
}

.padding-bottom-070 {
  padding-top: 0.7rem;
}

.padding-bottom-075 {
  padding-top: 0.75rem;
}

.padding-bottom-080 {
  padding-top: 0.8rem;
}

.padding-bottom-090 {
  padding-top: 0.9rem;
}

.padding-bottom-100 {
  padding-top: 1rem;
}

.padding-bottom-120 {
  padding-top: 1.2rem;
}

.padding-bottom-125 {
  padding-top: 1.25rem;
}

.padding-bottom-130 {
  padding-top: 1.3rem;
}

.padding-bottom-150 {
  padding-top: 1.5rem;
}

.padding-bottom-160 {
  padding-top: 1.6rem;
}

.padding-bottom-175 {
  padding-top: 1.75rem;
}

.padding-bottom-180 {
  padding-top: 1.8rem;
}

.padding-bottom-200 {
  padding-top: 2rem;
}

.padding-bottom-225 {
  padding-top: 2.25rem;
}

.padding-bottom-250 {
  padding-top: 2.5rem;
}

.padding-bottom-300 {
  padding-top: 3rem;
}

.padding-bottom-350 {
  padding-top: 3.5rem;
}

.padding-bottom-400 {
  padding-top: 4rem;
}

.padding-bottom-450 {
  padding-top: 4.5rem;
}

.padding-bottom-500 {
  padding-top: 5rem;
}

.padding-bottom-550 {
  padding-top: 5.5rem;
}

.padding-bottom-600 {
  padding-top: 6rem;
}

.padding-bottom-650 {
  padding-top: 6.5rem;
}

.padding-bottom-700 {
  padding-top: 7rem;
}

.padding-bottom-750 {
  padding-top: 7.5rem;
}

.padding-bottom-800 {
  padding-top: 8rem;
}

.padding-bottom-850 {
  padding-top: 8.5rem;
}

/**
* 表示状態
*/
.pc-visible {
  display: block;
}

.sp-visible {
  display: none;
}

@media (max-width:767px) {
  .pc-visible {
    display: none;
  }
  .sp-visible {
    display: block;
  }
}
/**
 * youtube埋め込みスタイル
 */
/* メインのレスポンシブYouTube埋め込みスタイル */
.youtube-container {
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 56.25%; /* 16:9のアスペクト比 (9/16 = 0.5625) */
  overflow: hidden;
  border-radius: 12px;
  -webkit-box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
          box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
  background: #000;
}

.youtube-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
  border-radius: 12px;
}

/* 4:3のアスペクト比バージョン */
.youtube-container.aspect-4-3 {
  padding-bottom: 75%; /* 4:3のアスペクト比 (3/4 = 0.75) */
}

/* 21:9のアスペクト比バージョン（ウルトラワイド） */
.youtube-container.aspect-21-9 {
  padding-bottom: 42.86%; /* 21:9のアスペクト比 (9/21 = 0.4286) */
}

/* 1:1の正方形バージョン */
.youtube-container.aspect-1-1 {
  padding-bottom: 100%; /* 1:1のアスペクト比 */
}

/* ホバーエフェクト付きバージョン */
.youtube-container.hover-effect {
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
  cursor: pointer;
}

.youtube-container.hover-effect:hover {
  -webkit-transform: translateY(-4px);
          transform: translateY(-4px);
  -webkit-box-shadow: 0 12px 35px rgba(0, 0, 0, 0.15);
          box-shadow: 0 12px 35px rgba(0, 0, 0, 0.15);
}

/* 最大幅制限付きバージョン */
.youtube-container.max-width {
  max-width: 800px;
  margin: 0 auto;
}

/* プレイリスト用の縦長バージョン */
.youtube-container.playlist {
  padding-bottom: 75%; /* プレイリストは通常4:3で表示される */
}

/* ローディング状態のスタイル */
.youtube-container.loading {
  background: -webkit-gradient(linear, left top, right top, color-stop(25%, #f0f0f0), color-stop(50%, #e0e0e0), color-stop(75%, #f0f0f0));
  background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
  background-size: 200% 100%;
  -webkit-animation: loading 1.5s infinite;
          animation: loading 1.5s infinite;
}

.youtube-container.loading::after {
  content: "動画を読み込み中...";
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  color: #666;
  font-size: 14px;
}

@-webkit-keyframes loading {
  0% {
    background-position: 200% 0;
  }
  100% {
    background-position: -200% 0;
  }
}

@keyframes loading {
  0% {
    background-position: 200% 0;
  }
  100% {
    background-position: -200% 0;
  }
}
/* グリッドレイアウト用（複数動画表示） */
.youtube-grid {
  display: -ms-grid;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 2rem;
  margin-top: 2rem;
}

.youtube-grid .youtube-container {
  margin-bottom: 0;
}

/* レスポンシブブレークポイント */
@media (max-width: 768px) {
  .container {
    padding: 15px;
  }
  .section {
    padding: 1.5rem;
  }
  .youtube-grid {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }
  /* モバイルでのマージン調整 */
  .youtube-container {
    margin-bottom: 1rem;
  }
}
@media (max-width: 480px) {
  .container {
    padding: 10px;
  }
  .section {
    padding: 1rem;
  }
  /* 極小画面での調整 */
  .youtube-container {
    border-radius: 8px;
  }
}
/* ダークモード対応 */
@media (prefers-color-scheme: dark) {
  body {
    background: #0f172a;
    color: #e2e8f0;
  }
  .section {
    background: #1e293b;
  }
  h1, h2 {
    color: #f1f5f9;
  }
}
/**
 * Scrollイン
 */
/* スクロールアニメーション用の基本クラス */
.scroll-animate {
  opacity: 0;
  -webkit-transform: translateY(50px);
          transform: translateY(50px);
  -webkit-transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.scroll-animate.animate {
  opacity: 1;
  -webkit-transform: translateY(0);
          transform: translateY(0);
}

/* より強いアニメーション */
.scroll-animate-strong {
  opacity: 0;
  -webkit-transform: translateY(80px) scale(0.9);
          transform: translateY(80px) scale(0.9);
  -webkit-transition: all 1s cubic-bezier(0.23, 1, 0.32, 1);
  transition: all 1s cubic-bezier(0.23, 1, 0.32, 1);
}

.scroll-animate-strong.animate {
  opacity: 1;
  -webkit-transform: translateY(0) scale(1);
          transform: translateY(0) scale(1);
}

/* 左からスライドイン */
.scroll-slide-left {
  opacity: 0;
  -webkit-transform: translateX(-100px);
          transform: translateX(-100px);
  -webkit-transition: all 0.9s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition: all 0.9s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.scroll-slide-left.animate {
  opacity: 1;
  -webkit-transform: translateX(0);
          transform: translateX(0);
}

/* 右からスライドイン */
.scroll-slide-right {
  opacity: 0;
  -webkit-transform: translateX(100px);
          transform: translateX(100px);
  -webkit-transition: all 0.9s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transition: all 0.9s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.scroll-slide-right.animate {
  opacity: 1;
  -webkit-transform: translateX(0);
          transform: translateX(0);
}

/* フェードインのみ */
.scroll-fade {
  opacity: 0;
  -webkit-transition: all 1.2s ease-out;
  transition: all 1.2s ease-out;
}

.scroll-fade.animate {
  opacity: 1;
}

/* 回転しながら登場 */
.scroll-rotate {
  opacity: 0;
  -webkit-transform: translateY(50px) rotate(15deg);
          transform: translateY(50px) rotate(15deg);
  -webkit-transition: all 1s cubic-bezier(0.23, 1, 0.32, 1);
  transition: all 1s cubic-bezier(0.23, 1, 0.32, 1);
}

.scroll-rotate.animate {
  opacity: 1;
  -webkit-transform: translateY(0) rotate(0deg);
          transform: translateY(0) rotate(0deg);
}

/* 遅延アニメーション */
.delay-1 {
  -webkit-transition-delay: 0.1s;
          transition-delay: 0.1s;
}

.delay-2 {
  -webkit-transition-delay: 0.2s;
          transition-delay: 0.2s;
}

.delay-3 {
  -webkit-transition-delay: 0.3s;
          transition-delay: 0.3s;
}

.delay-4 {
  -webkit-transition-delay: 0.4s;
          transition-delay: 0.4s;
}

.delay-5 {
  -webkit-transition-delay: 0.5s;
          transition-delay: 0.5s;
}

/* ===== PC時のみ表示 ===== */
.pc-only {
  display: block; /* PC時は表示 */
}

/* ===== SP時のみ表示 ===== */
.sp-only {
  display: none; /* PC時は非表示 */
}

/* ===== ブレークポイント: 768px以下をSP扱い ===== */
@media (max-width: 768px) {
  .pc-only {
    display: none; /* SP時は非表示 */
  }
  .sp-only {
    display: block; /* SP時は表示 */
  }
}
/* ===== より詳細な切り替え（任意で使用） ===== */
/* タブレット用（769px〜1024px） */
.tablet-only {
  display: none;
}

@media (min-width: 769px) and (max-width: 1024px) {
  .tablet-only {
    display: block;
  }
}
/* デスクトップ用（1025px以上） */
.desktop-only {
  display: none;
}

@media (min-width: 1025px) {
  .desktop-only {
    display: block;
  }
}
/* ===== インライン要素用 ===== */
.pc-only-inline {
  display: inline; /* PC時はインライン表示 */
}

.sp-only-inline {
  display: none; /* PC時は非表示 */
}

@media (max-width: 768px) {
  .pc-only-inline {
    display: none; /* SP時は非表示 */
  }
  .sp-only-inline {
    display: inline; /* SP時はインライン表示 */
  }
}
/* ===== フレックス要素用 ===== */
.pc-only-flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex; /* PC時はフレックス表示 */
}

.sp-only-flex {
  display: none; /* PC時は非表示 */
}

@media (max-width: 768px) {
  .pc-only-flex {
    display: none; /* SP時は非表示 */
  }
  .sp-only-flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex; /* SP時はフレックス表示 */
  }
}
/* =============================================================================
 * ユーティリティ マージン
 * ========================================================================== */
/**
 * フォーム周り
 */
.form-group.has-error .help-block {
  color: #F00;
}

/* =============================================================================
 * ユーティリティ マージン
 * ========================================================================== */
/**
 * フォントサイズ
 */
.font-size-050 {
  font-size: 0.5em;
}

.font-size-075 {
  font-size: 0.75em;
}

.font-size-080 {
  font-size: 0.8em;
}

.font-size-085 {
  font-size: 0.85em;
}

.font-size-090 {
  font-size: 0.9em;
}

.font-size-095 {
  font-size: 0.95em;
}

.font-size-100 {
  font-size: 1em;
}

.font-size-110 {
  font-size: 1.1em;
}

.font-size-120 {
  font-size: 1.2em;
}

.font-size-125 {
  font-size: 1.25em;
}

.font-size-130 {
  font-size: 1.3em;
}

.font-size-140 {
  font-size: 1.4em;
}

.font-size-150 {
  font-size: 1.5em;
}

.font-size-160 {
  font-size: 1.6em;
}

.font-size-180 {
  font-size: 1.8em;
}

.font-size-200 {
  font-size: 2em;
}

/**
 * テキスト揃え
 */
.text-align-center {
  text-align: center;
}

.text-align-left {
  text-align: left;
}

.text-align-right {
  text-align: right;
}

/**
 * 強制ワード絵ラップ
 */
.force-wrap {
  overflow-wrap: anywhere;
}

.fs-xs {
  font-size: 0.625rem !important;
}

.fs-s {
  font-size: 0.75rem !important;
}

.fs-m {
  font-size: 0.875rem !important;
}

.fs-l {
  font-size: 1rem !important;
}

.fs-xl {
  font-size: 1.125rem !important;
}
/*# sourceMappingURL=style.css.map */