/* css/section-quicklinks.css */
/* エージェントA担当: クイックリンクバー（8プラットフォーム） */

/* クイックリンクバー全体 */
.top-quicklinks {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  padding: 1rem 2rem;
  background-color: #F3FAFD;
  border-bottom: 1px solid #DCE6EE;
}

/* 各リンク */
.top-quicklinks-item {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 0.4em;
  padding: 0.5em 1.2em;
  background-color: #ffffff;
  color: #5F568E;
  text-decoration: none;
  border-radius: 8px;
  border: 1px solid #DCE6EE;
  /* font-balance 1788579499092 R13: 1265px帯に14.4pxは相対小・PC/タブ/SP共通底上げ */
  font-size: 0.85em;
  font-weight: 500;
  min-height: 48px;
  transition: all 0.2s ease;
}

/* アイコン */
.top-quicklinks-item i {
  font-size: 0.9em;
  opacity: 0.7;
  color: inherit;
}

.top-quicklinks-item:hover {
  background-color: #7369A0;
  color: #ffffff;
  border-color: #7369A0;
}

/* レスポンシブ */

/* === plan 1788524851013: SP/Tablet専用下部リンク集 — PCベースは非表示のみ (769px+不変) === */
.top-quicklinks-bottom {
  display: none !important;
}

/* === plan 1788619320962 QuickLinks8 C3' PC既定 (>1130素通し帯・>768全体に波及) ===
   上部のみ直下指定で下部--bottomに波及させない。狭帯域fit (769-1130) は
   responsive-768.css末尾のclampがfont/padding-inline/gapを後勝ち上書き。
   ここでは底帯+影+土台のみ。padding一括・min-height・line-height・align-itemsは触らない。 */
.top-page > .top-quicklinks .top-quicklinks-item {
  font-size: 14px;
  padding: 10px 18px;
  border-bottom: 3px solid rgba(63, 102, 140, 0.42);
  box-shadow: 0 6px 12px rgba(63, 102, 140, 0.075);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.top-page > .top-quicklinks .top-quicklinks-item::before,
.top-page > .top-quicklinks .top-quicklinks-item::after {
  display: none;
  content: none;
}

/* === plan 1788662640925 T3: SpeakerDeck FA全域非表示 (上下両nav・全viewport・PHP不変) ===
   上部は .top-page > .top-quicklinks 直下指定、下部は .top-quicklinks--bottom 指定。
   <i> はDOM残置 (順序維持)。flex gapは display:none で自動詰まり、中央寄せは継承。
   responsive-480側の <=600/<=480 縮小・非表示則は残置 (後勝ちで矛盾なし)。 */
.top-page > .top-quicklinks .top-quicklinks-item[href*="speakerdeck.com"] i,
.top-page .top-quicklinks--bottom .top-quicklinks-item[href*="speakerdeck.com"] i {
  display: none !important;
}

/* === plan 1788662640925 T2: PC上部8ボタン幅 S/M/L 3段階共通化 (1131px以上のみ) ===
   T1実測 (1280/1131・fonts.ready+FA後・border-box込):
   YouTube 125.7 / X 81.2 / note 100.2 / cluster 114.2 / SD 153.3→無icon 133.2 /
   BOOTH 119.4 / Behance 124.9 / FANBOX 125.6・gap 10px・bar=hero (1265.2/1117.7)・1行。
   群内 max-min<=約8pxに収めるため S:max100.2→104 / M:max125.7→130 / L:133.2→138
   (ceil+約4px slack・はみ出し防止の min-width方式・width固定なし)。
   合計 104*2+130*5+138=1000 + gap70 = 1070 <= hero 1117.7-1 (1131時) のため超過なし。
   font-size/padding:10px 18px/borderは不変。下部--bottomには波及させない (直下指定)。
   狭帯域 (769-1130) には波及させない (メディアクエリ隔離・T4で min-width:0 に戻す)。 */
@media screen and (min-width: 1131px) {
  .top-page > .top-quicklinks .top-quicklinks-item {
    flex: 0 0 auto;
    justify-content: center;
    text-align: center;
    box-sizing: border-box;
    white-space: nowrap;
  }
  /* S: X / note */
  .top-page > .top-quicklinks .top-quicklinks-item[href*="x.com"],
  .top-page > .top-quicklinks .top-quicklinks-item[href*="note.com"] {
    min-width: 104px;
  }
  /* M: YouTube / cluster / BOOTH / Behance / FANBOX */
  .top-page > .top-quicklinks .top-quicklinks-item[href*="youtube.com"],
  .top-page > .top-quicklinks .top-quicklinks-item[href*="cluster.mu"],
  .top-page > .top-quicklinks .top-quicklinks-item[href*="booth.pm"],
  .top-page > .top-quicklinks .top-quicklinks-item[href*="behance.net"],
  .top-page > .top-quicklinks .top-quicklinks-item[href*="fanbox.cc"] {
    min-width: 130px;
  }
  /* L: SpeakerDeck (FA非表示後も最長のため単独) */
  .top-page > .top-quicklinks .top-quicklinks-item[href*="speakerdeck.com"] {
    min-width: 138px;
  }
}