/**
 * デザイナー専用カスタムCSS
 *
 * このファイルはデザイナーが自由に編集できます。
 * AIによる自動上書きは行いません。
 *
 * 読み込み順序: 最後（すべてのスタイルを上書き可能）
 * 依存: style.css, Bootstrap
 *
 * 更新日: 2024-12-04
 * 担当:
 */

/* ============================================
   デザイナー向けメモ
   ============================================

   このCSSは以下のスタイルより後に読み込まれます：
   - Bootstrap 5.3.0
   - Bootstrap Icons 1.11.1
   - style.css（メインスタイル）

   必要に応じて !important を使用してください。

   ============================================ */

/* カスタムスタイルをここに記述 */


.hero-title {
  text-align: left;
  display: inline-block;
}

.hero-title .line {
  position: relative;
  display: block;;
  width: fit-content;
  color: #fff;
  font-size: 1.8rem; 
  font-weight: 600;
  line-height: 1.1;
  padding: 0.1em 0.3em;
  margin-bottom:0.5em;
}


/* 黒い斜め帯 */
.hero-title .line::before {
  content: "";
  position: absolute;
  inset: 0;
  background: #000;
  transform: skewX(-15deg);
  z-index: -1;
}

/* 行ごとに少しズラす */
.hero-title .line:nth-child(1) {
  margin-left: 0;
}

.hero-title .line:nth-child(2) {
  margin-left: 2em;
}


.hero-title span:before{
   content:"";
   position: absolute;
   background: #000;
   width:100%;
   height: 1.5em;
   z-index: -1;
}

h3{
   position: relative;
   padding-bottom: 2em;
   text-align: center;
}
h3:after{
   content: "";
   position: absolute;
   display: block;
   width:0.8em;
   height:2px;
   margin: 1em auto;
   left:0;
   right: 0;
   border-bottom:2px solid #e60020;
}

h5{
   line-height: 1.5;
}
.hero-section {
  position: relative;
  min-height: 100vh;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  display: flex;
  align-items: flex-start;
  padding-top: 8vh;
}

.hero-description{
   padding-top:50vh;
}
.hero-description p{
   color:#000!important;
   font-size:2rem;
   line-height: 1.8;
}

.feature-card{
   text-align: center;
   
}

.feature-card h5{
   font-size: 1.2rem;
   margin-bottom: 1em;
   line-height: 1.5;
}
.feature-card p{
   text-align: left;
   line-height: 1.5;
}
.feature-icon{
   background: #eee !important;
   pointer-events:none!important;
}

.feature-icon i{
   color:#e60020 !important;
}

.pickup-section .card-title{
   font-size: 1.2rem;
}

.companies-list .card-title{
   font-size: 1rem;
   line-height: 1.5;
}


/* 下部固定ボタン */
.filter-fixed-btn {
  position: fixed;
  bottom: 16px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 1000;
  padding: 0.75em 1.5em;
  background: #000;
  color: #fff;
  border: none;
  border-radius: 999px;
  font-weight: 600;
}

/* スライドコンテナ */
.filter-slide-wrapper {
  position: fixed;
  left: 0;
  bottom: 0;
  width: 100%;
  max-height: 90vh;
  background: #fff;
  transform: translateY(100%);
  transition: transform 0.35s ease;
  z-index: 999;
  overflow-y: auto;
  box-shadow: 0 -10px 30px rgba(0,0,0,0.2);
}

/* 表示状態 */
.filter-slide-wrapper.is-open {
  transform: translateY(0);
}