/**
 * UQモバイル カスタマイズ CSS
 * SWELLテーマとの統合に最適化されたスタイル
 */

@charset "utf-8";


body {
  background: linear-gradient(150deg, #ffffff 0%, #ffffff 10%, #e0f8ff 25%, #fafeff 30%, #e0f8ff 40%, #fff3f9 60%, #fff3f9 100%);
}

.menu-item {
  font-weight: bold;
  font-size: 16px;
}

.-series-right .c-gnavWrap {
  margin-left: 0;
}

.l-content {
  padding-top: 0 !important;
  margin-bottom: 0 !important;
}

/* ===============================================
投稿ページの白い背景と角丸設定
=============================================== */
/* 投稿ページのメインコンテンツエリア */
.single-post .l-mainContent__inner,
.page .l-mainContent__inner,
.single .l-mainContent__inner,
.archive .l-mainContent__inner,
.blog .l-mainContent__inner,
.search .l-mainContent__inner,
.category .l-mainContent__inner,
.tag .l-mainContent__inner {
  background-color: #fff;
  border-radius: 15px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
  margin: 50px auto;
  padding: 30px;
  max-width: 1200px;
  position: relative;
  z-index: 2;
}

/* 投稿タイトル部分の背景調整 */
.single-post .p-articleHead,
.page .p-articleHead,
.single .p-articleHead,
.archive .p-articleHead,
.blog .p-articleHead,
.search .p-articleHead,
.category .p-articleHead,
.tag .p-articleHead {
  background-color: #fff;
  border-radius: 10px 10px 0 0;
  padding: 20px 0;
  border-bottom: 1px solid #e0e0e0;
}

/* 投稿コンテンツ部分の背景調整 */
.single-post .entry-content,
.page .entry-content,
.single .entry-content,
.archive .entry-content,
.blog .entry-content,
.search .entry-content,
.category .entry-content,
.tag .entry-content {
  background-color: #fff;
  border-radius: 0 0 10px 10px;
  padding: 0;
}

/* スマホでの調整 */
@media screen and (max-width: 784px) {
  .single-post .l-mainContent__inner,
.page .l-mainContent__inner,
  .single .l-mainContent__inner,
  .archive .l-mainContent__inner,
  .blog .l-mainContent__inner,
  .search .l-mainContent__inner,
  .category .l-mainContent__inner,
  .tag .l-mainContent__inner {
    margin: 30px 10px;
    padding: 20px;
    border-radius: 10px;
  }

  .single-post .p-articleHead,
.page .p-articleHead,
  .single .p-articleHead,
  .archive .p-articleHead,
  .blog .p-articleHead,
  .search .p-articleHead,
  .category .p-articleHead,
  .tag .p-articleHead {
    margin: -20px 0px 20px 0px;
    padding: 15px 0;
    border-radius: 10px 10px 0 0;
  }
}

/* より小さいスマホでの調整 */
@media screen and (max-width: 480px) {
  .single-post .l-mainContent__inner,
.page .l-mainContent__inner,
  .single .l-mainContent__inner,
  .archive .l-mainContent__inner,
  .blog .l-mainContent__inner,
  .search .l-mainContent__inner,
  .category .l-mainContent__inner,
  .tag .l-mainContent__inner {
    margin: 20px 5px;
    padding: 15px;
    border-radius: 8px;
  }

  .single-post .p-articleHead,
.page .p-articleHead,
  .single .p-articleHead,
  .archive .p-articleHead,
  .blog .p-articleHead,
  .search .p-articleHead,
  .category .p-articleHead,
  .tag .p-articleHead {
    margin: -15px 0px 15px 0px;
    padding: 10px 0;
    border-radius: 8px 8px 0 0;
  }
}

/* ===============================================
スマホ、タブレットでのWordPressページ余白設定
=============================================== */

@media screen and (max-width: 1023px) {
  /* WordPressのメインコンテンツエリア */
  main,
  .main-content,
  .content-area,
  .site-content {
    padding: 20px 10px !important;
    margin: 0;
  }

  /* WordPressの投稿・ページコンテンツ */
  .entry-content,
  .post-content,
  .page-content {
      padding: 20px 10px !important;
    margin: 0;
  }

  /* WordPressの投稿一覧 */
  .posts-list,
  .blog-posts,
  .archive-posts {
    padding: 20px 10px !important;
    margin: 0;
  }

  /* WordPressの投稿詳細 */
  .single-post .entry-content,
  .single-page .entry-content {
    padding: 20px 10px !important;
    margin: 0;
  }

  /* WordPressのアーカイブページ */
  .archive .entry-content,
  .search .entry-content {
    padding: 20px 10px !important;
    margin: 0;
  }
}

/* スマホでのbody余白設定 */
@media screen and (max-width: 784px) {
  /* WordPressのメインコンテンツエリア */
  main,
  .main-content,
  .content-area,
  .site-content {
    padding: 20px 10px !important;
    margin: 0;
  }

  /* WordPressの投稿・ページコンテンツ */
  .entry-content,
  .post-content,
  .page-content {
      padding: 20px 10px !important;
    margin: 0;
  }

  /* WordPressの投稿一覧 */
  .posts-list,
  .blog-posts,
  .archive-posts {
    padding: 20px 10px !important;
    margin: 0;
  }

  /* WordPressの投稿詳細 */
  .single-post .entry-content,
  .single-page .entry-content {
    padding: 20px 10px !important;
    margin: 0;
  }

  /* WordPressのアーカイブページ */
  .archive .entry-content,
  .search .entry-content {
    padding: 20px 10px !important;
    margin: 0;
  }
}

/* ===============================================
ピル型固定ヘッダー
=============================================== */

#header.l-header {
  position: fixed !important;
  top: 12px;
  left: 0;
  right: 0;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
  z-index: 1000;
  display: block !important;
  transform: none !important;
  padding-top: 0 !important;
}

body.admin-bar #header.l-header {
  top: calc(46px + 8px) !important;
}

@media screen and (min-width: 783px) {
  body.admin-bar #header.l-header {
    top: calc(32px + 12px) !important;
  }

  body.admin-bar .top #content,
  body.admin-bar #content.l-content {
    padding-top: calc(96px + 32px) !important;
  }
}

#header .l-header__inner {
  position: relative;
  width: min(1180px, calc(100% - 24px)) !important;
  max-width: 1180px;
  margin: 0 auto !important;
  height: 64px !important;
  min-height: 0 !important;
  display: flex !important;
  align-items: center;
  gap: 12px;
  padding: 0 16px !important;
  background: rgba(255, 255, 255, 0.72) !important;
  -webkit-backdrop-filter: blur(18px) saturate(140%);
  backdrop-filter: blur(18px) saturate(140%);
  border: 1px solid rgba(255, 255, 255, 0.75) !important;
  border-radius: 999px !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 8px 28px rgba(20, 40, 80, 0.08) !important;
  overflow: visible !important;
  clip-path: none !important;
  filter: none !important;
}

#header .l-header__inner::before,
#header .l-header__inner::after {
  content: none !important;
  display: none !important;
}

#header .w-header,
#header .l-header__menuBtn,
#header .l-header__customBtn {
  display: none !important;
}

#header .l-header__logo {
  position: relative !important;
  left: auto !important;
  top: auto !important;
  right: auto !important;
  order: 0 !important;
  flex: 0 0 auto !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
  z-index: 2;
  display: flex;
  align-items: center;
}

#header .l-header__logo .c-headLogo,
#header .l-header__logo .c-headLogo__link {
  display: flex;
  align-items: center;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 0 !important;
  flex: 0 0 auto !important;
}

#header .c-headLogo__img {
  width: auto !important;
  height: 36px !important;
  max-width: none !important;
  max-height: 36px !important;
  object-fit: contain;
}

#header .l-header__gnav {
  order: 1 !important;
  position: relative !important;
  z-index: 2;
  display: flex !important;
  align-self: center !important;
  flex: 1 1 auto;
  min-width: 0;
  width: auto !important;
  margin: 0 !important;
  height: auto !important;
  max-height: none !important;
  overflow-x: auto;
  overflow-y: hidden;
  background: transparent !important;
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
  box-shadow: none !important;
  scrollbar-width: none;
}

#header .l-header__gnav::-webkit-scrollbar {
  display: none;
}

#header .c-gnav {
  display: flex !important;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-start;
  gap: 4px;
  margin: 0 !important;
  padding: 0 !important;
  width: max-content;
  min-width: 100%;
  background: transparent !important;
  list-style: none;
}

#header .c-gnav > .menu-item {
  margin: 0;
  list-style: none;
}

#header .c-gnav > .menu-item > a {
  display: inline-flex !important;
  align-items: center;
  padding: 8px 14px !important;
  border-radius: 999px;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1.2;
  color: #2a3140 !important;
  background: transparent;
  white-space: nowrap;
  text-decoration: none;
  transition: background 0.25s, color 0.25s;
}

#header .c-gnav > .menu-item > a .ttl {
  font-size: inherit !important;
  font-weight: inherit !important;
}

#header .c-gnav > .menu-item > a:hover {
  background: rgba(0, 0, 0, 0.05);
  opacity: 1;
}

#header .c-gnav > .current-menu-item > a,
#header .c-gnav > .current-menu-ancestor > a {
  background: #1b1b1f;
  color: #fff !important;
}

.top #content,
#content.l-content {
  padding-top: 96px !important;
}

@media screen and (max-width: 782px) {
  #header.l-header {
    top: 8px;
  }

  #header .l-header__inner {
    height: 56px !important;
    width: calc(100% - 16px) !important;
    padding: 0 10px !important;
    gap: 8px;
  }

  #header .c-headLogo__img {
    height: 30px !important;
    max-height: 30px !important;
  }

  .top #content,
  #content.l-content {
    padding-top: 80px !important;
  }

  body.admin-bar #header.l-header {
    top: calc(46px + 8px) !important;
  }

  body.admin-bar .top #content,
  body.admin-bar #content.l-content {
    padding-top: calc(80px + 46px) !important;
  }

  #header .c-gnav > .menu-item > a {
    padding: 6px 10px !important;
    font-size: 12px !important;
  }
}

/* ===============================================
フッターリンクの横並びスタイル
=============================================== */

/* スマホフッターを非表示 */
.footer.sp {
  display: none !important;
}

#footer {
  font-size: 13px;
}

/* l-footer__footを非表示 */
.l-footer__foot {
  display: none !important;
}

/* フッター内のリンクを横並びに配置 */
.footer .information .data {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 20px;
  margin: 0;
  padding: 0;
  list-style: none;
}

/* リンク間に区切り文字（｜）を追加 */
.footer .information .data li:not(:last-child)::after {
  content: "｜";
  margin-left: 20px;
  color: #333;
}

/* フッター全体のレイアウト調整 */
.footer .information {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  padding: 20px 40px;
  max-width: 1200px;
  margin: 0 auto;
  gap: 40px;
}

/* 左側のリンクエリア */
.footer .information .data {
  flex: 0 0 auto;
  justify-content: center;
}

/* 右側のコピーライト */
.footer .information .copyright {
  flex: 0 0 auto;
  margin: 0;
  text-align: center;
  color: #333;
}

/* タブレット・スマホ用フッター */
@media screen and (max-width: 1023px) {
  /* PCフッターを非表示 */
  .footer.pc {
    display: none !important;
  }

  .l-container {
    padding-right: 0 !important;
    padding-left: 0 !important;
  }

  /* スマホフッターを表示 */
  .footer.sp {
    display: block !important;
    background: #fff;
    padding: 20px 0;
  }

  /* フッターロゴ */
  .footer-logo {
    text-align: center;
    margin-bottom: 20px;
  }

  .footer-logo img {
    max-width: 88px;
    height: auto;
  }

  /* 会社ナビゲーション */
  .company-nav {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
    margin: 0;
    padding: 0;
    list-style: none;
    margin-bottom: 20px;
  }

  .company-nav li:not(:last-child)::after {
    content: "｜";
    margin-left: 20px;
    color: #333;
  }

  .company-nav a {
    text-decoration: none;
    color: #3aabe0;
    font-size: 14px;
  }

  .company-nav a:hover {
    opacity: 0.7;
  }

  /* コピーライト */
  .footer.sp .copy {
    padding: 10px 0;
    background: #1c3d80;
    text-align: center;
    font-size: 1rem;
    color: #fff;
    margin: 0;
  }
}

/* スマートフォン用の調整 */
@media screen and (max-width: 767px) {

  .l-container {
    padding-right: 0 !important;
    padding-left: 0 !important;
  }

  .footer .information {
    flex-direction: column;
    gap: 15px;
    padding: 20px;
  }

  .footer .information .data {
    justify-content: center;
    flex-wrap: wrap;
    gap: 10px;
  }

  .footer .information .data li:not(:last-child)::after {
    margin-left: 10px;
  }

  .footer .information .copyright {
    text-align: center;
  }

  /* スマホフッターの調整 */
  .footer.sp {
    padding: 15px 0;
  }

  .company-nav {
    gap: 15px;
    margin-bottom: 15px;
  }

  .company-nav a {
    font-size: 12px;
  }

  .company-nav li:not(:last-child)::after {
    margin-left: 15px;
  }

  .footer.sp .copy {
    font-size: 0.9rem;
  }
}

/* ===============================================
lum-lightbox: 画像を中央に表示
=============================================== */
.lum-lightbox {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.85);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
}

.lum-lightbox-inner {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  box-sizing: border-box;
}

.lum-lightbox-image-wrapper,
.lum-lightbox-position-helper {
  display: flex;
  align-items: center;
  justify-content: center;
  max-width: 100%;
  max-height: 100%;
}

.lum-lightbox img.lum-img {
  max-width: 90vw;
  max-height: 85vh;
  width: auto;
  height: auto;
  display: block;
  margin: 0 auto;
  object-fit: contain;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3);
  border-radius: 6px;
}

body.lum-lightbox-open {
  overflow: hidden;
}

/* UQ flight header: scoped to preserve the existing theme and article styles. */
@keyframes uq-native-header-fallback {
  to { visibility: visible; }
}
html:not(.uq-flight-enabled):not(.uq-flight-failed) #header.l-header,
html:not(.uq-flight-enabled):not(.uq-flight-failed) #fix_header {
  visibility: hidden !important;
  animation: uq-native-header-fallback 0s linear 3s forwards;
}
.uq-flight-failed #header.l-header,
.uq-flight-failed #fix_header {
  visibility: visible !important;
  animation: none !important;
}
.uq-flight-enabled #header.l-header,
.uq-flight-enabled #fix_header { display: none !important; }
.uq-flight-enabled #content.l-content {
  position: relative;
  z-index: 1002;
  padding-top: calc(var(--uq-flight-height, 150px) + 6px) !important;
  pointer-events: none;
}
.uq-flight-enabled #content.l-content .l-mainContent__inner,
.uq-flight-enabled #content.l-content .l-mainContent,
.uq-flight-enabled #content.l-content .breadcrumb {
  pointer-events: auto;
}
.uq-flight-breadcrumb-space { display: none; }
.uq-flight-enabled .uq-flight-breadcrumb-space { display: block; height: var(--uq-flight-breadcrumb-clearance, 374px); }
.uq-flight-enabled.uq-flight-has-breadcrumb #content.l-content { padding-top: 0 !important; }
.uq-flight-enabled.uq-flight-has-breadcrumb .breadcrumb {
  position: relative;
  z-index: 1002;
}
/* TOPのみ記事を機体に被せる。パンくず付きページは従来の高さ */
.uq-flight-enabled .home .l-mainContent__inner {
  margin-top: 8px !important;
}
/* パンくず〜記事枠の余白を詰める（機体サイズは変えない） */
.uq-flight-enabled.uq-flight-has-breadcrumb .archive .l-mainContent__inner,
.uq-flight-enabled.uq-flight-has-breadcrumb .category .l-mainContent__inner,
.uq-flight-enabled.uq-flight-has-breadcrumb .tag .l-mainContent__inner,
.uq-flight-enabled.uq-flight-has-breadcrumb .blog .l-mainContent__inner,
.uq-flight-enabled.uq-flight-has-breadcrumb .search .l-mainContent__inner,
.uq-flight-enabled.uq-flight-has-breadcrumb .single .l-mainContent__inner,
.uq-flight-enabled.uq-flight-has-breadcrumb .page .l-mainContent__inner {
  margin-top: 8px !important;
}
.uq-flight-enabled.uq-flight-has-breadcrumb .archive .p-articleHead,
.uq-flight-enabled.uq-flight-has-breadcrumb .category .p-articleHead,
.uq-flight-enabled.uq-flight-has-breadcrumb .tag .p-articleHead,
.uq-flight-enabled.uq-flight-has-breadcrumb .blog .p-articleHead,
.uq-flight-enabled.uq-flight-has-breadcrumb .search .p-articleHead {
  padding-top: 10px;
  padding-bottom: 12px;
}
@media (min-width: 901px) {
  #uq-flight-header .destination-label > span { display: block; white-space: nowrap; }
}
#uq-flight-header {
  --plane-angle: 4.5deg; --ink: #1f1f23; --plane: rgb(255 255 255 / 20%);
  --uq-pink: #e4007f; --uq-blue: #00a0e9; --shadow: 0 18px 42px rgb(22 28 42 / 16%);
  position: fixed; inset: var(--uq-flight-admin, 0px) 0 auto; z-index: 1001;
  width: 100%; pointer-events: none; font-family: system-ui, sans-serif;
  color: var(--ink); line-height: 1.2; letter-spacing: 0;
  overflow-x: clip;
}
#uq-flight-header *, #uq-flight-header *::before, #uq-flight-header *::after { box-sizing: border-box; }
#uq-flight-header a { text-decoration: none; }
#uq-flight-header button { margin: 0; padding: 0; box-shadow: none; color: inherit; }
#uq-flight-header svg { display: block; max-width: none; }
#uq-flight-header .plane-backdrop {
  position: absolute; opacity: .75; top: 24px; left: calc(50% - 20px);
  width: min(1120px, calc(100% - clamp(12px, 4vw, 48px) - clamp(12px, 4vw, 48px)));
  height: auto; aspect-ratio: 1120 / 335.8;
  transform: translateX(-50%) rotate(var(--plane-angle)); transform-origin: 50% 52%;
  pointer-events: none; z-index: 0;
}
#uq-flight-header .flight-stage { position: relative; padding: 34px clamp(12px, 4vw, 48px) 0; pointer-events: auto; }
#uq-flight-header[data-flight="returning"] { overflow-x: clip; }
#uq-flight-header[data-flight="returning"] .flight-stage {
  animation: none; translate: none; clip-path: none; visibility: visible; will-change: transform;
}
#uq-flight-header[data-flight="returning"] .window-nav,
#uq-flight-header[data-flight="returning"] .hamburger { opacity: 0; }
.uq-flight-enabled #pagetop[hidden] { display: none; }
.uq-flight-enabled #pagetop:disabled { cursor: default; }
/* #content が z-index:1002 のため、固定ボタンが記事の下に隠れるのを防ぐ */
.uq-flight-enabled .p-fixBtnWrap {
  z-index: 1003;
}
#uq-flight-header[data-flight="docked"] .flight-stage {
  clip-path: polygon(var(--tail-left) var(--tail-top), var(--tail-right) var(--tail-top), var(--tail-right) var(--tail-bottom), var(--tail-left) var(--tail-bottom));
}
#uq-flight-header[data-flight]:not([data-flight="expanded"]) .flight-stage,
#uq-flight-header[data-flight]:not([data-flight="expanded"]) .flight-stage * { pointer-events: none; }
#uq-flight-header .flight-recall {
  position: absolute; top: var(--recall-top, 70px); right: 4px; z-index: 2;
  width: var(--recall-width, 96px); height: var(--recall-height, 64px);
  border: 0; border-radius: 4px; background: transparent; pointer-events: auto; cursor: pointer; touch-action: manipulation;
}
#uq-flight-header .flight-recall[hidden] { display: none; }
#uq-flight-header .flight-recall:focus-visible { outline: 2px solid var(--uq-blue); outline-offset: -3px; }
#uq-flight-header .airplane-shell { position: relative; z-index: 1; width: min(1120px, 100%); aspect-ratio: 1120 / 230; margin: 0 auto; isolation: isolate; }
#uq-flight-header .plane-frame {
  position: absolute; top: -18%; left: 50%; width: 100%; height: 146%; pointer-events: none;
  transform: translateX(-50%) rotate(var(--plane-angle)); transform-origin: 50% 52%;
}
#uq-flight-header .plane-glass, #uq-flight-header .plane-outline { position: absolute; inset: 0; width: 100%; height: 100%; }
#uq-flight-header .plane-glass {
  background: linear-gradient(90deg, var(--plane), rgb(255 255 255 / 5%));
  -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); clip-path: url(#uq-flight-plane-glass-clip);
}
#uq-flight-header .plane-glass::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(115deg, rgb(255 255 255 / 16%), rgb(255 255 255 / 0%) 34%, rgb(255 255 255 / 10%) 58%, rgb(255 255 255 / 0%) 76%);
}
#uq-flight-header .plane-outline { overflow: visible; stroke-linejoin: round; filter: drop-shadow(0 6px 7px rgb(35 55 68 / 14%)); }
#uq-flight-header .acrylic-depth { fill: none; stroke: rgb(73 105 122 / 18%); stroke-width: .75; transform: translateY(.6px); }
#uq-flight-header .acrylic-surface { fill: none; stroke: url(#uq-flight-acrylic-edge); stroke-width: .8; }
#uq-flight-header .glass-inner-shadow { fill: none; stroke: rgb(27 48 61 / 12%); stroke-width: 1.5; transform: translate(.3px, .6px); }
#uq-flight-header .glass-inner-reflection { fill: none; stroke: rgb(255 255 255 / 75%); stroke-width: 1; transform: translate(-.2px, -.5px); }
#uq-flight-header .tail-logo {
  position: absolute; left: 12.7%; top: 46.5%; display: flex; align-items: center; justify-content: center;
  width: 44px; height: 44px; transform: translate(-50%, -50%) rotate(calc(-1 * var(--plane-angle))); pointer-events: auto;
}
#uq-flight-header .tail-logo img { display: block; width: 36px; height: auto; max-width: 100%; margin: 0; }
#uq-flight-header .window-nav {
  position: absolute; left: 32%; right: 13%; top: 51%; display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr)); align-items: center; gap: 10px; min-width: 0; transform: translateY(-50%);
}
#uq-flight-header .window-nav a {
  display: inline-flex; align-items: center; justify-content: center; min-height: 30px; padding: 3px 5px;
  overflow: visible; color: #2b2b30; font-size: 12px; font-weight: 600; line-height: 1.2;
  text-align: center; white-space: normal; overflow-wrap: anywhere; text-shadow: 0 1px 0 rgb(255 255 255 / 90%);
  border-radius: 4px; transition: background 160ms ease, transform 160ms ease;
}
#uq-flight-header .window-nav a:hover { background: rgb(31 31 35 / 5%); transform: translateY(-1px); }
#uq-flight-header .tail-logo:focus-visible, #uq-flight-header .window-nav a:focus-visible, #uq-flight-header .hamburger:focus-visible { outline: 2px solid var(--uq-blue); outline-offset: 2px; }
#uq-flight-header .hamburger {
  position: absolute; left: 91%; top: 39%; display: none; width: 44px; height: 44px; place-content: center; gap: 3px;
  transform: translate(-50%, -50%) rotate(calc(-1 * var(--plane-angle))); border: 0; background: transparent; pointer-events: auto; cursor: pointer;
}
#uq-flight-header .hamburger span { display: block; width: 17px; height: 1.5px; border-radius: 999px; background: var(--ink); }
@media (max-width: 900px) {
  /* 機体サイズは維持。上余白だけ詰める */
  #uq-flight-header .flight-stage { padding-top: 2px; }
  #uq-flight-header .plane-backdrop { top: 14px; left: calc(50% - 8px); width: min(620px, calc(100% - clamp(12px, 4vw, 48px) - clamp(12px, 4vw, 48px))); aspect-ratio: 2.8; }
  #uq-flight-header .airplane-shell { width: min(620px, 100%); aspect-ratio: 2.8; }
  /* テーマの main 上パディングを消し、記事をさらに上へ */
  .uq-flight-enabled #content.l-content .l-mainContent {
    padding-top: 0 !important;
  }
  #uq-flight-header .plane-frame { top: 0; height: 100%; }
  #uq-flight-header .plane-glass { -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
  #uq-flight-header .tail-logo {
    left: 53.7%;
    top: 65.5%;
  }
  #uq-flight-header .tail-logo img { width: 40px; }
  #uq-flight-header .window-nav {
    top: calc(100% + 12px); left: 0; right: 0; display: none; grid-template-columns: repeat(2, minmax(0, 1fr));
    padding: 12px; border: 1px solid rgb(31 31 35 / 14%); border-radius: 8px; background: rgb(245 251 254 / 96%);
    -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); box-shadow: var(--shadow); transform: none;
    max-height: calc(100dvh - var(--uq-flight-height, 255px) - var(--uq-flight-admin, 0px) - 24px); overflow-y: auto;
  }
  #uq-flight-header .airplane-shell.is-nav-open .window-nav { display: grid; }
  #uq-flight-header .window-nav a { min-height: 36px; color: var(--ink); font-size: 12px; text-shadow: none; transform: none; }
  #uq-flight-header .hamburger { display: grid; }
}
@media (max-width: 520px) {
  #uq-flight-header .plane-backdrop { width: calc(100% - 20px); }
  #uq-flight-header .flight-stage { padding-inline: 10px; }
  #uq-flight-header .tail-logo img { width: 40px; }
  #uq-flight-header .airplane-shell.is-nav-open .window-nav { grid-template-columns: 1fr; }
}

#uq-flight-header .cloud-menu-links { display: contents; }
#uq-flight-header .cloud-recall-icon { display: none; }

@keyframes uq-cloud-enter {
  0% { opacity: 0; translate: 0 -10px; scale: .96; }
  65% { opacity: 1; translate: 0 2px; scale: 1.01; }
  100% { opacity: 1; translate: 0 0; scale: 1; }
}

@keyframes uq-cloud-link-enter {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes uq-cloud-exit {
  from { opacity: 1; translate: 0 0; scale: 1; }
  to { opacity: 0; translate: 0 -8px; scale: .96; }
}

@media (max-width: 900px) {
  #uq-flight-header .window-nav {
    top: calc(100% + 12px);
    left: 50%; right: auto;
    width: min(360px, calc(100% - 8px));
    display: none;
    padding: 54px 38px 38px;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    transform: translateX(-50%);
    transform-origin: 50% 0;
    max-height: none;
    overflow: visible;
    isolation: isolate;
    z-index: 3;
  }
  /* Keep the cloud contour separate so scrolling never clips its lobes. */
  #uq-flight-header .window-nav::before,
  #uq-flight-header .flight-recall::before {
    content: "";
    position: absolute;
    inset: 0;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 400' preserveAspectRatio='none'%3E%3Cpath d='M104 79C111 24 161 6 204 17C242 23 270 46 280 78C330 47 381 74 387 121C391 151 379 177 362 193C404 220 406 275 386 313C374 337 351 353 327 350C306 385 251 398 206 394C172 392 142 381 124 360C80 385 31 361 16 317C4 281 16 249 35 229C3 198 1 144 28 111C47 87 77 76 104 79Z' fill='%23fff' stroke='%23e1eef4' stroke-width='1.5'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
    filter: drop-shadow(0 9px 10px rgb(28 70 88 / 14%));
    pointer-events: none;
    z-index: -1;
  }
  #uq-flight-header .window-nav::after {
    content: none;
  }
  #uq-flight-header.is-nav-open .window-nav {
    display: block;
    animation: uq-cloud-enter 420ms cubic-bezier(.22, .7, .3, 1) both;
  }
  #uq-flight-header.is-nav-closing .window-nav {
    display: block;
    pointer-events: none;
    animation: uq-cloud-exit 220ms ease-in both;
  }
  #uq-flight-header .cloud-menu-links {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 4px;
    padding: 3px;
    max-height: max(70px, calc(100dvh - clamp(145px, calc(34px + 35.714vw), 256px) - var(--uq-flight-admin, 0px) - 124px));
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: none;
  }
  #uq-flight-header .cloud-menu-links::-webkit-scrollbar { display: none; }
  #uq-flight-header .window-nav a {
    min-height: 44px;
    padding: 10px 14px;
    border-radius: 6px;
    color: #245b78;
    background: transparent;
    font-size: 14px;
    line-height: 1.5;
    font-weight: 600;
    text-shadow: none;
  }
  #uq-flight-header .window-nav a:hover,
  #uq-flight-header .window-nav a:focus-visible {
    background: transparent;
    color: #007aa8;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 4px;
    transform: none;
  }
  #uq-flight-header.is-nav-open .cloud-menu-links a {
    animation: uq-cloud-link-enter 220ms ease-out 60ms both;
  }
  #uq-flight-header.is-nav-open .cloud-menu-links a:nth-child(2) { animation-delay: 85ms; }
  #uq-flight-header.is-nav-open .cloud-menu-links a:nth-child(3) { animation-delay: 110ms; }
  #uq-flight-header.is-nav-open .cloud-menu-links a:nth-child(4) { animation-delay: 135ms; }
  #uq-flight-header.is-nav-open .cloud-menu-links a:nth-child(n + 5) { animation-delay: 160ms; }
  #uq-flight-header.is-nav-open .cloud-menu-links a:focus-visible { animation: none; }
  #uq-flight-header .hamburger[aria-expanded="true"] span:first-child { transform: translateY(4.5px) rotate(45deg); }
  #uq-flight-header .hamburger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
  #uq-flight-header .hamburger[aria-expanded="true"] span:last-child { transform: translateY(-4.5px) rotate(-45deg); }

  #uq-flight-header[data-cloud-menu="true"] .flight-stage { visibility: hidden; }
  #uq-flight-header[data-cloud-menu="true"] .flight-recall {
    position: fixed;
    top: calc(12px + var(--uq-flight-admin, 0px) + env(safe-area-inset-top, 0px)); bottom: auto;
    right: calc(4px + env(safe-area-inset-right, 0px));
    width: 60px; height: 56px;
    display: grid; place-items: center;
    isolation: isolate;
    color: #245b78;
    background: transparent;
  }
  #uq-flight-header[data-cloud-menu="true"] .cloud-recall-icon {
    display: grid; gap: 4px;
    width: 18px; height: 14px;
  }
  #uq-flight-header .cloud-recall-icon > span {
    display: block; width: 18px; height: 2px;
    background: currentColor; border-radius: 2px;
  }
  #uq-flight-header .flight-recall[aria-expanded="true"] .cloud-recall-icon > span:first-child { transform: translateY(6px) rotate(45deg); }
  #uq-flight-header .flight-recall[aria-expanded="true"] .cloud-recall-icon > span:nth-child(2) { opacity: 0; }
  #uq-flight-header .flight-recall[aria-expanded="true"] .cloud-recall-icon > span:last-child { transform: translateY(-6px) rotate(-45deg); }
  #uq-flight-header[data-cloud-menu="true"] > .window-nav {
    position: fixed;
    top: calc(80px + var(--uq-flight-admin, 0px) + env(safe-area-inset-top, 0px)); bottom: auto;
    left: auto; right: calc(12px + env(safe-area-inset-right, 0px));
    width: min(340px, calc(100vw - 24px - env(safe-area-inset-right, 0px)));
    transform: none;
    transform-origin: 90% 0;
    pointer-events: auto;
  }
  #uq-flight-header[data-cloud-menu="true"].is-nav-closing > .window-nav { pointer-events: none; }
  #uq-flight-header[data-cloud-menu="true"] > .window-nav .cloud-menu-links {
    max-height: max(60px, calc(100dvh - 200px - var(--uq-flight-admin, 0px) - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)));
  }
}

@media (prefers-reduced-motion: reduce) {
  #uq-flight-header.is-nav-open .window-nav,
  #uq-flight-header.is-nav-closing .window-nav,
  #uq-flight-header.is-nav-open .cloud-menu-links a { animation: none; }
}

@keyframes uq-plane-float {
  0%, 100% { translate: 0 0; }
  50% { translate: 0 -3px; }
}

@media (prefers-reduced-motion: no-preference) {
  /* Separate vertical drift from the horizontal flight transform. */
  #uq-flight-header[data-flight="expanded"] .flight-stage {
    animation: uq-plane-float 5.6s ease-in-out infinite;
  }
  #uq-flight-header .flight-stage:focus-within,
  #uq-flight-header .flight-stage:has(.is-nav-open),
  #uq-flight-header .flight-stage:has(.is-nav-closing) {
    animation-play-state: paused;
  }
}

@media (prefers-reduced-motion: no-preference) and (hover: hover) and (pointer: fine) {
  #uq-flight-header .flight-stage:has(.airplane-shell:hover) {
    animation-play-state: paused;
  }
}

.uq-flight-sky {
  --cloud-duration: 120s;
  position: absolute;
  inset: 0 0 auto;
  height: var(--uq-flight-sky-height, 380px);
  overflow: hidden;
  overflow: clip;
  pointer-events: none;
  z-index: 0;
  background: linear-gradient(180deg, #bddfec 0%, #d8eef8 48%, rgb(233 247 252 / 70%) 78%, rgb(233 247 252 / 0%) 100%);
  contain: layout paint;
}
.uq-flight-sky__cloud {
  position: absolute;
  left: 0;
  top: var(--cloud-top);
  width: var(--cloud-width);
  aspect-ratio: 768 / 307;
  opacity: var(--cloud-opacity);
  animation: uq-sky-drift var(--cloud-duration) linear var(--cloud-delay) infinite;
  animation-play-state: paused;
}
.uq-flight-sky__cloud img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
}
.uq-flight-sky__cloud:nth-child(1) {
  --cloud-width: min(540px, 65vw); --cloud-top: -5%; --cloud-opacity: .7;
  --cloud-delay: -90s; --cloud-rest: 8vw;
}
.uq-flight-sky__cloud:nth-child(2) {
  --cloud-width: min(700px, 76vw); --cloud-top: 30%; --cloud-opacity: .85;
  --cloud-delay: -50s; --cloud-rest: 55vw;
}
.uq-flight-sky__cloud:nth-child(3) {
  --cloud-width: min(320px, 40vw); --cloud-top: 1%; --cloud-opacity: .55;
  --cloud-delay: -10s; --cloud-rest: 48vw;
}
.uq-flight-sky[data-running="true"] .uq-flight-sky__cloud { animation-play-state: running; }
@keyframes uq-sky-drift {
  from { transform: translateX(100vw); }
  to { transform: translateX(-100%); }
}
@media (max-width: 900px) {
  .uq-flight-sky { height: var(--uq-flight-sky-height, 290px); }
  .uq-flight-sky__cloud:nth-child(2) { --cloud-delay: -30s; }
  .uq-flight-sky__cloud:nth-child(3) { display: none; animation: none; }
}
@media (max-width: 520px) {
  .uq-flight-sky { height: var(--uq-flight-sky-height, 210px); }
  .uq-flight-sky__cloud:nth-child(1) { --cloud-width: min(300px, 85vw); }
  .uq-flight-sky__cloud:nth-child(2) { --cloud-width: min(380px, 90vw); }
}
@media (prefers-reduced-motion: reduce) {
  .uq-flight-sky .uq-flight-sky__cloud { animation: none; transform: translateX(var(--cloud-rest)); }
}

.uq-flight-side-sky {
  position: fixed;
  inset: 35vh 0 0;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
  overflow: clip;
  /* One continuous flight path, with the article and its 24px margin masked out. */
  -webkit-mask-image: linear-gradient(to right, #000 0 calc(var(--side-sky-left) - 24px), transparent var(--side-sky-left) calc(100% - var(--side-sky-right)), #000 calc(100% - var(--side-sky-right) + 24px) 100%);
  mask-image: linear-gradient(to right, #000 0 calc(var(--side-sky-left) - 24px), transparent var(--side-sky-left) calc(100% - var(--side-sky-right)), #000 calc(100% - var(--side-sky-right) + 24px) 100%);
}
.uq-flight-side-sky[hidden] { display: none; }
.uq-flight-side-sky__rail {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.uq-flight-side-sky__cloud {
  position: absolute;
  top: 13%;
  left: 0;
  width: min(410px, 28vw);
  aspect-ratio: 768 / 307;
  opacity: .68;
  animation: uq-side-cloud-drift 120s linear -93s infinite paused;
}
.uq-flight-side-sky__rail--right .uq-flight-side-sky__cloud {
  top: 54%;
  opacity: .55;
  animation-delay: -33s;
}
.uq-flight-side-sky__cloud img { display: block; width: 100%; height: 100%; }
.uq-flight-side-sky__rail--right img { transform: scaleX(-1); }
.uq-flight-side-sky[data-running="true"] .uq-flight-side-sky__cloud { animation-play-state: running; }
@keyframes uq-side-cloud-drift {
  from { transform: translateX(100vw); }
  to { transform: translateX(-100%); }
}
@media (max-width: 1099px), (hover: none), (pointer: coarse) {
  .uq-flight-side-sky { display: none; }
  .uq-flight-side-sky .uq-flight-side-sky__cloud { animation: none; }
}
@media (prefers-reduced-motion: reduce) {
  .uq-flight-side-sky .uq-flight-side-sky__cloud { animation: none; }
  .uq-flight-side-sky__rail--left .uq-flight-side-sky__cloud { transform: translateX(-12%); }
  .uq-flight-side-sky__rail--right .uq-flight-side-sky__cloud { left: auto; right: 0; transform: translateX(12%); }
}

#uq-flight-header .window-nav a { gap: 4px; }
#uq-flight-header .window-nav .menu-label { min-width: 0; }
#uq-flight-header .window-nav .menu-icon {
  display: block; width: 14px; height: 14px; flex: 0 0 14px;
}
@media (min-width: 901px) {
  #uq-flight-header .window-nav { grid-template-columns: 1.25fr repeat(4, minmax(0, 1fr)); gap: 6px; }
  #uq-flight-header .window-nav a { padding-inline: 2px; }
}
@media (max-width: 900px) {
  #uq-flight-header .window-nav a { gap: 8px; }
  #uq-flight-header .window-nav .menu-icon { width: 18px; height: 18px; flex-basis: 18px; }
}
@media (min-width: 901px) and (max-width: 1100px) {
  #uq-flight-header .window-nav { grid-template-columns: repeat(5, max-content); justify-content: space-between; gap: 2px; }
  #uq-flight-header .window-nav a { font-size: 11px; padding-inline: 1px; }
}