/* ========================================
   recruitページ専用スタイル
======================================== */
/* ========================================
   パンくずリスト - 背景画像付き
======================================== */
.breadcrumb {
    margin-top: 80px;            /* ヘッダー分のマージンを追加 */
    max-width: 100%;
    max-height: 100%;
    width: 100%;
    height: 100px;
    margin: 0px auto 0 auto;    /* 上マージンを追加して中央配置 */
    padding: 50px 0 0 0;         /* パンくずリストを見える位置に調整 */
    background-size: cover;      /* 画像を全体に表示 */
    background-position: center;
    background-repeat: no-repeat;
    background-color: #DE0111;   /* 赤背景色 */
    background-blend-mode: multiply;
    display: flex;
    align-items: center;        /* ←縦中央に変更 */
    position: relative;
    background-size: contain;
    justify-content: center;  /* 横方向の中央揃え（オプション） */
}

.breadcrumb .breadcrumb-nav {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
    position: relative;
    z-index: 2;
}

.breadcrumb .breadcrumb-list {
    display: flex;
    align-items: center;
    list-style: none;
    margin: 0;
    padding: 0;
    font-size: 14px;
}

.breadcrumb .breadcrumb-item {
    display: flex;
    align-items: center;
    color: white;               /* 文字色を白に */
}

.breadcrumb .breadcrumb-item:not(:last-child)::after {
    content: '>';
    margin: 0 8px;
    color: rgba(255, 255, 255, 0.7);  /* セパレータも白に */
    font-weight: normal;
}

.breadcrumb .breadcrumb-link {
    color: white;               /* リンクも白に */
    text-decoration: none;
    transition: color 0.3s ease;
}

.breadcrumb .breadcrumb-link:hover {
    color: #fff;
    opacity: 0.8;
}

.breadcrumb .breadcrumb-current {
    color: white;               /* 現在のページも白に */
    font-weight: 600;
}

.requirements {
    padding: 0;
}

.requirements-bg {
    max-width: 1200px;
    margin: 0 auto;
    padding: 60px 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.message-header {
    text-align: center;
    margin-bottom: 40px;
}

.message-header h1 {
    color: #e74c3c;
    font-size: 32px;
    font-weight: 700;
    margin-bottom: 40px;
    letter-spacing: 2px;
    padding-bottom: 20px;
  
    display: flex;                /* 横並び＋中央寄せ */
    justify-content: center;      /* 全体を中央に揃える */
    align-items: center;          /* 垂直位置を揃える */
    gap: 12px;                    /* テキストと線の間隔 */
}

.message-header h1::before,
.message-header h1::after {
  content: "";
  flex: 0 0 50px;              /* 線の長さ（お好みで） */
  height: 6px;                  /* 線の太さ */
  background-color: #e74c3c;       /* 線の色 */
}  

.privacy {
    max-width: 100%;
    width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

.privacy-subtitle {
    font-size: 100px;
    font-weight: 900;
    color: #EFEFEF;
    margin-bottom: 40px;
    letter-spacing: 2px;
}

.privacy-content {
    text-align: center;
    margin-bottom: 40px;
}

.privacy-handling {
    margin-bottom: 40px;
}

.privacy-handling-subtitle {
    font-size: 32px;
    font-weight: 600;
    color: #E83532;
}

.privacy-handling-text {
    font-size: 12px;
    font-weight: 500;
    color: #333;
    margin-top: 20px;
    text-align: left;
}

.privacy-substance {
    text-align: left;
    margin-bottom: 40px;
}

.privacy p {
    font-size: 12px;
    line-height: 1.8; /* 読みやすさのために行間を少し広めに */
    color: #333;
}

.privacy-substance-subtitle {
    font-size: 28px;
    font-weight: 500;
    color: #000000;
    text-decoration: underline;         /* 下線をつける */
    text-decoration-color: #000000;    /* 下線の色 */
    text-decoration-thickness: 3px;    /* 下線の太さ */
    text-underline-offset: 15px;        /* 下線の位置（文字からの距離） */
}

.privacy-substance-text {
    font-size: 12px;
    color: #333;
    margin-top: 20px;
    margin-bottom: 30px;
}

.no-dot {
    list-style: none;      /* デフォルトの 1. 2. 3. を消す */
    counter-reset: item;   /* カウンター初期化 */
    padding-left: 0;
    margin-bottom: 30px;
    font-size: 12px;
  }
  
  .no-dot li {
    counter-increment: item;
    margin-bottom: 10px;
    position: relative;
    padding-left: 25px;   /* 数字分のスペース */
  }
  
  .no-dot li::before {
    content: counter(item); /* 数字だけ表示 */
    position: absolute;
    left: 0;
    font-weight: bold;
  }
  
  @media (max-width: 480px) {
    .breadcrumb {
      width: 100%;
      height: auto;
      padding: 20px 10px;
    }
  
    .privacy-subtitle {
      font-size: 32px;
      letter-spacing: 1px;
      margin-bottom: 20px;
    }
  
    .privacy-handling-text,
    .privacy-substance-text {
      font-size: 12px;
      line-height: 1.6;
    }
  
    .no-dot li {
      padding-left: 15px;
    }
  
    .contents-buttons {
      display: flex;
      flex-direction: column;
      gap: 15px;
    }
  
    .footer-links {
      flex-direction: column;
      gap: 20px;
    }
  }