@charset "UTF-8";
/* --- 共通・PC版のスタイル --- */
.overflow__inner {
  width: 100%;
}

.overflow__box {
  width: 100%;
}

.js-table-opener {
  height: auto;
}

.js-table-opener::after {
  display: none;
}

.common__table {
  width: 100%;
  border-collapse: collapse;
}
.common__table small {
  display: block;
  line-height: 1.2;
}

/* PC版ではボタンを非表示 */
.sp-accordion-btn {
  display: none;
}

/* ▼クローンヘッダー用のスタイル（修正版） */
.fixed-header-wrapper {
  position: fixed !important;
  z-index: 90;
  /* ★追加1：ScrollHintのスクロールバーを強制的に打ち消して非表示にする */
  overflow: hidden !important;
  /* ★追加2：ヘッダー上のタッチ・クリック操作を下の本体テーブルに「貫通」させる */
  pointer-events: none;
}

.fixed-table-header {
  position: absolute !important;
  top: 0;
  background-color: #fff;
  margin: 0 !important;
}

/* ヘッダーの背景色を適用 */
.fixed-table-header th,
.fixed-table-header td,
.common__table thead th,
.common__table thead td {
  background-color: #F0F7FF;
}

.fixed-header-wrapper.is-left-scrollable::before,
.fixed-header-wrapper.is-right-scrollable::after {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  bottom: 0 !important;
  width: 15px !important;
  /* 影の幅（ScrollHintに近い幅） */
  z-index: 1005 !important;
  /* ヘッダー本体(1000)より手前に表示させる */
  pointer-events: none !important;
  /* 影の部分もタッチ操作を貫通させる */
}

/* 左側の影 */
.fixed-header-wrapper.is-left-scrollable::before {
  left: 0 !important;
  background: linear-gradient(to right, rgba(0, 0, 0, 0.15), rgba(0, 0, 0, 0)) !important;
}

/* 右側の影 */
.fixed-header-wrapper.is-right-scrollable::after {
  right: 0 !important;
  background: linear-gradient(to left, rgba(0, 0, 0, 0.15), rgba(0, 0, 0, 0)) !important;
}

/* --- スマホ版（768px以下）のスタイル --- */
@media screen and (max-width: 767px) {
  .itrends__inner--type1 {
    width: 480px;
    padding-right: 0px;
  }
  .itrends__inner--type2 {
    width: 720px;
    padding-right: 0px;
  }
  /* 横スクロールを許可 */
  .overflow__box {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    /* iOSのスクロールを滑らかにする */
  }
  /* セル内のテキストが勝手に改行されて潰れないようにする */
  .common__table th,
  .common__table td {
    white-space: nowrap;
  }
  /* --- スマホ版アコーディオン機能のスタイル --- */
  /* .is-open クラスが付いていない時（初期状態）は、13行目以降の <tr> を非表示 */
  .js-table-opener:not(.open) .common__table tbody tr:nth-child(n+13) {
    display: none;
  }
  /* アコーディオン切り替えボタンのスタイル（画像参考） */
  .sp-accordion-btn {
    display: flex;
    align-items: center;
    width: 100%;
    font-size: 18px;
    line-height: 1.5;
    font-weight: 700;
    text-align: center;
    padding: 5px 48px 4px 20px;
    border: none;
    border-radius: 0 8px 8px 0;
    margin-top: 15px;
    cursor: pointer;
    position: relative;
    background: linear-gradient(to right, #F0F7FF, #CBE3FF);
    color: #3A4454;
    margin-bottom: 0;
  }
  .js-table-opener.open .sp-accordion-btn {
    background: linear-gradient(to right, #93C8FF, #145CA9);
    color: #ffffff;
  }
  .sp-accordion-btn::before,
  .sp-accordion-btn::after {
    content: "";
    position: absolute;
    right: 20px;
    top: 50%;
    width: 16px;
    height: 2px;
    background-color: #3A4454;
    transition: transform 0.3s ease;
  }
  .sp-accordion-btn::before {
    transform: translateY(-50%);
  }
  .sp-accordion-btn::after {
    transform: translateY(-50%) rotate(90deg);
  }
  .js-table-opener.open .sp-accordion-btn::before {
    background-color: #ffffff;
  }
  .js-table-opener.open .sp-accordion-btn::after {
    transform: translateY(-50%) rotate(0deg);
    background-color: #ffffff;
  }
}
/* --- ScrollHintのアイコン位置の上書き --- */
.scroll-hint-icon {
  top: 200px !important;
}