@charset "UTF-8";
/* ============================================================
   base.css — 版面骨架:字級基準、重設、載入畫面、頁首與選單抽屜、遮罩文字進場、共用的小標與按鈕、公司介紹/最新消息/頁尾的基礎版型
   一個元件的規則集中在一處(含它的手機版媒體查詢)。TBI 的顏色、間距與各區塊細節在 tbi.css(蓋在這支之上)。
   ============================================================ */

/* ════════════════════════ 設定值 ════════════════════════ */
:root {
  --vh: 1vh;
  --scroll-bar-width: 0px;
}

/* ════════════════════════ 基礎:重設、字級基準、平滑捲動、只在桌機/手機顯示、讀屏專用文字 ════════════════════════ */
*,
*:before,
*:after {
  box-sizing: border-box;
}
body,
h1,
h2,
h3,
p,
ul,
button,
input {
  margin: 0;
  padding: 0;
  border: none;
}
h1,
h2,
h3,
small {
  font-size: inherit;
  font-weight: inherit;
}
a {
  text-decoration: none;
}
html {
  text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
}
body {
  line-height: 1;
}
ul {
  list-style-type: none;
}
a {
  color: inherit;
}
svg {
  overflow: visible;
}
button,
input {
  background: none;
  color: inherit;
  font-family: inherit;
  font-size: inherit;
}
a,
button {
  cursor: pointer;
}
button {
  outline: none;
}
:root button:focus-visible {
  outline: auto;
}
::selection {
  background: #646464;
  color: #fff;
}
html {
  overflow-x: hidden;
  overflow-y: scroll;
  min-height: 100%;
  -webkit-font-smoothing: antialiased;
}
@media screen and (min-width: 821px) {
  html {
    font-size: calc(.0117130307 * (100vw - var(--scroll-bar-width)));
  }
}
@media screen and (max-width:820.98px) {
  html {
    font-size: 8.5333333333vw;
    min-height: calc(var(--vh) * 100);
  }
}
body {
  min-height: 100%;
  color: #000;
  font-family: var(--ff-zh);
  overflow-x: hidden;
  background-color: #f8f9fa;
}
@media screen and (min-width: 821px) {
  body {
    font-size: .875rem;
  }
}
@media screen and (min-width: 821px) and (max-width: 976px) {
  body {
    font-size: 10px;
  }
}
@media screen and (max-width:820.98px) {
  body {
    font-size: .8125rem;
  }
  .tbi-pcOnly {
    display: none !important;
  }
}
@media screen and (min-width: 821px) {
  .tbi-spOnly {
    display: none !important;
  }
}
.tbi-srOnly {
  position: fixed !important;
  inset: 0 !important;
  display: block !important;
  inline-size: 4px !important;
  block-size: 4px !important;
  contain: strict !important;
  pointer-events: none !important;
  opacity: 0 !important;
}
html.lenis {
  height: auto;
}
.lenis.lenis-smooth {
  scroll-behavior: auto;
}
.lenis.lenis-smooth [data-lenis-prevent] {
  overscroll-behavior: contain;
}
.lenis.lenis-stopped {
  overflow: hidden;
}

/* ════════════════════════ 載入畫面 ════════════════════════ */
.tbi-loader {
  position: fixed;
  inset: 0;
  width: 100vw;
  height: 100vh;
  height: 100svh;
  z-index: 1400;
  overscroll-behavior: none;
  overflow-y: scroll;
  scrollbar-width: none;
}
.tbi-loader::-webkit-scrollbar {
  display: none;
}
.tbi-loader__inner {
  position: relative;
  display: block;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: calc(100% + 1px);
  overflow: hidden;
  background-color: #1a1c22;
}
.tbi-loader__progressWrap {
  position: absolute;
  overflow: hidden;
}
@media screen and (min-width: 821px) {
  .tbi-loader__progressWrap {
    bottom: 2.5rem;
  }
}
@media screen and (max-width:820.98px) {
  .tbi-loader__progressWrap {
    bottom: 1.25rem;
  }
}
.tbi-loader__progress {
  font-family: var(--ff-en);
  font-weight: 500;
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: flex-end;
}
@media screen and (min-width: 821px) {
  .tbi-loader__progress {
    font-size: .75rem;
  }
}
@media screen and (min-width: 821px) and (max-width: 1139px) {
  .tbi-loader__progress {
    font-size: 10px;
  }
}
@media screen and (max-width:820.98px) {
  .tbi-loader__progress {
    font-size: .375rem;
  }
}
@media screen and (max-width:820.98px) and (max-width: 312.5px) {
  .tbi-loader__progress {
    font-size: 10px;
  }
}
@media screen and (min-width: 821px) {
  .tbi-loader__progressText {
    padding-inline: .375rem;
  }
}
@media screen and (max-width:820.98px) {
  .tbi-loader__progressText {
    padding-inline: .1875rem;
  }
}
@media screen and (min-width: 821px) {
  .tbi-loader__num {
    margin-bottom: -.125rem;
    margin-right: .125rem;
  }
}
@media screen and (max-width:820.98px) {
  .tbi-loader__num {
    margin-bottom: -.0625rem;
    margin-right: .0625rem;
  }
}
@media screen and (min-width: 821px) {
  .tbi-loader__unit {
    font-size: .625rem;
  }
}
@media screen and (max-width:820.98px) {
  .tbi-loader__unit {
    font-size: .3125rem;
  }
}
.tbi-loader__light {
  position: absolute;
  top: 50%;
  left: 50%;
  opacity: 0;
  transform: translate(-50%,-50%);
}
@media screen and (min-width: 821px) {
  .tbi-loader__light {
    width: 11.625rem;
    height: 11.625rem;
    top: 22.6875rem;
  }
}
@media screen and (min-width: 821px) and (min-aspect-ratio: 1920/1080) {
  .tbi-loader__light {
    top: 50%;
    margin-top: -1.0625rem;
  }
}
@media screen and (max-width:820.98px) {
  .tbi-loader__light {
    width: 5.3125rem;
    height: 5.3125rem;
    top: 10.09375rem;
  }
}
@media screen and (max-width:820.98px) and (min-aspect-ratio: 1080/1920) {
  .tbi-loader__light {
    top: 50%;
    margin-top: -.3125rem;
  }
}
.tbi-loader__mark {
  display: block;
  width: 100%;
  height: 100%;
}

/* ════════════════════════ 頁首與漢堡鈕 ════════════════════════ */
.tbi-header {
  position: fixed;
  top: 0;
  width: 100vw;
  display: flex;
  justify-content: space-between;
  align-items: center;
  mix-blend-mode: difference;
  background-blend-mode: difference;
  z-index: 1200;
  transition: transform .6s cubic-bezier(.85,0,.15,1);
}
@media screen and (min-width: 821px) {
  .tbi-header {
    height: 2.875rem;
    padding-inline: 1.875rem;
  }
}
@media screen and (max-width:820.98px) {
  .tbi-header {
    height: 1.5rem;
    padding-inline: .625rem;
  }
}
.tbi-burger {
  display: flex;
  align-items: center;
  gap: .0625rem;
}

/* ════════════════════════ 選單抽屜(手機/平板) ════════════════════════ */
.tbi-menu {
  z-index: 900;
  position: fixed;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  visibility: hidden;
}
.tbi-menu.-open {
  visibility: visible;
}
.tbi-menu__content {
  position: absolute;
  top: 1.8125rem;
  width: calc(100% - .625rem);
  height: 14.375rem;
  background-color: #000;
  color: #fff;
  z-index: 2;
  margin: auto;
  border-radius: .125rem;
  clip-path: inset(0% 0% 100% 0%);
  margin-inline: .3125rem;
  overflow-y: scroll;
  overscroll-behavior: none;
  scrollbar-width: none;
}
.tbi-menu__inner {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
}
.tbi-menu__backdrop {
  position: absolute;
  inset: 0;
  opacity: 0;
}
:where([data-modal-content]) {
  overscroll-behavior: contain;
}
:where([data-modal-content-inner]) {
  min-height: calc(100% + 1px);
}
:where([data-modal-backdrop]) {
  overflow-y: scroll;
  overscroll-behavior: none;
  scrollbar-width: none;
}
[data-modal-backdrop]::-webkit-scrollbar {
  display: none;
}
[data-modal-backdrop]:after {
  content: "";
  display: block;
  min-height: calc(100% + 1px);
}

/* ════════════════════════ 遮罩文字進場(結構由 tbi-core.js 第 4 段產生) ════════════════════════ */
[data-mask-text].-show .tbi-mask__char,
[data-mask-text].-show .tbi-mask__line,
[data-mask-text].-show .tbi-mask__block {
  transform: translateY(0);
}
[data-mask-text].-show [data-mask-text-item=clip] {
  clip-path: inset(0% 0% 0% 0%);
}
[data-mask-text] .tbi-mask__line,
[data-mask-text] .tbi-mask__char,
[data-mask-text] .tbi-mask__block {
  display: block;
  transform: translateY(110%);
  transition: transform 1s cubic-bezier(.85,0,.15,1);
}
[data-mask-text] .tbi-mask__block {
  height: 100%;
}
[data-mask-text] .tbi-mask__lineWrap:nth-child(1) .tbi-mask__line {
  transition-delay: .1s;
}
[data-mask-text] .tbi-mask__charWrap:nth-child(1) .tbi-mask__char:nth-child(1) {
  transition-delay: .125s;
}
[data-mask-text] .tbi-mask__charWrap:nth-child(2) .tbi-mask__char:nth-child(1) {
  transition-delay: .225s;
}
[data-mask-text] .tbi-mask__charWrap:nth-child(3) .tbi-mask__char:nth-child(1) {
  transition-delay: .325s;
}
[data-mask-text] .tbi-mask__charWrap:nth-child(4) .tbi-mask__char:nth-child(1) {
  transition-delay: .425s;
}
[data-mask-text] .tbi-mask__charWrap:nth-child(5) .tbi-mask__char:nth-child(1) {
  transition-delay: .525s;
}
[data-mask-text] .tbi-mask__charWrap:nth-child(6) .tbi-mask__char:nth-child(1) {
  transition-delay: .625s;
}
[data-mask-text] .tbi-mask__lineWrap:nth-child(2) .tbi-mask__line {
  transition-delay: .2s;
}
[data-mask-text] .tbi-mask__charWrap:nth-child(1) .tbi-mask__char:nth-child(2) {
  transition-delay: .15s;
}
[data-mask-text] .tbi-mask__charWrap:nth-child(2) .tbi-mask__char:nth-child(2) {
  transition-delay: .25s;
}
[data-mask-text] .tbi-mask__charWrap:nth-child(3) .tbi-mask__char:nth-child(2) {
  transition-delay: .35s;
}
[data-mask-text] .tbi-mask__charWrap:nth-child(4) .tbi-mask__char:nth-child(2) {
  transition-delay: .45s;
}
[data-mask-text] .tbi-mask__lineWrap:nth-child(3) .tbi-mask__line {
  transition-delay: .3s;
}
[data-mask-text] .tbi-mask__charWrap:nth-child(1) .tbi-mask__char:nth-child(3) {
  transition-delay: .175s;
}
[data-mask-text] .tbi-mask__charWrap:nth-child(2) .tbi-mask__char:nth-child(3) {
  transition-delay: .275s;
}
[data-mask-text] .tbi-mask__charWrap:nth-child(3) .tbi-mask__char:nth-child(3) {
  transition-delay: .375s;
}
[data-mask-text] .tbi-mask__lineWrap:nth-child(4) .tbi-mask__line {
  transition-delay: .4s;
}
[data-mask-text] .tbi-mask__charWrap:nth-child(1) .tbi-mask__char:nth-child(4) {
  transition-delay: .2s;
}
[data-mask-text] .tbi-mask__charWrap:nth-child(2) .tbi-mask__char:nth-child(4) {
  transition-delay: .3s;
}
[data-mask-text] .tbi-mask__charWrap:nth-child(3) .tbi-mask__char:nth-child(4) {
  transition-delay: .4s;
}
[data-mask-text] .tbi-mask__lineWrap:nth-child(5) .tbi-mask__line {
  transition-delay: .5s;
}
[data-mask-text] .tbi-mask__charWrap:nth-child(1) .tbi-mask__char:nth-child(5) {
  transition-delay: .225s;
}
[data-mask-text] .tbi-mask__charWrap:nth-child(2) .tbi-mask__char:nth-child(5) {
  transition-delay: .325s;
}
[data-mask-text] .tbi-mask__charWrap:nth-child(3) .tbi-mask__char:nth-child(5) {
  transition-delay: .425s;
}
[data-mask-text] .tbi-mask__lineWrap:nth-child(6) .tbi-mask__line {
  transition-delay: .6s;
}
[data-mask-text] .tbi-mask__charWrap:nth-child(1) .tbi-mask__char:nth-child(6) {
  transition-delay: .25s;
}
[data-mask-text] .tbi-mask__charWrap:nth-child(2) .tbi-mask__char:nth-child(6) {
  transition-delay: .35s;
}
[data-mask-text] .tbi-mask__charWrap:nth-child(1) .tbi-mask__char:nth-child(7) {
  transition-delay: .275s;
}
[data-mask-text] .tbi-mask__charWrap:nth-child(2) .tbi-mask__char:nth-child(7) {
  transition-delay: .375s;
}
[data-mask-text] .tbi-mask__charWrap:nth-child(1) .tbi-mask__char:nth-child(8) {
  transition-delay: .3s;
}
[data-mask-text] .tbi-mask__charWrap:nth-child(2) .tbi-mask__char:nth-child(8) {
  transition-delay: .4s;
}
[data-mask-text] .tbi-mask__charWrap:nth-child(1) .tbi-mask__char:nth-child(9) {
  transition-delay: .325s;
}
[data-mask-text] .tbi-mask__charWrap:nth-child(2) .tbi-mask__char:nth-child(9) {
  transition-delay: .425s;
}
[data-mask-text] .tbi-mask__charWrap:nth-child(1) .tbi-mask__char:nth-child(10) {
  transition-delay: .35s;
}
[data-mask-text] .tbi-mask__charWrap:nth-child(2) .tbi-mask__char:nth-child(10) {
  transition-delay: .45s;
}
[data-mask-text] .tbi-mask__charWrap:nth-child(1) .tbi-mask__char:nth-child(11) {
  transition-delay: .375s;
}
[data-mask-text] .tbi-mask__charWrap:nth-child(2) .tbi-mask__char:nth-child(11) {
  transition-delay: .475s;
}
[data-mask-text] .tbi-mask__charWrap:nth-child(1) .tbi-mask__char:nth-child(12) {
  transition-delay: .4s;
}
[data-mask-text] .tbi-mask__charWrap:nth-child(2) .tbi-mask__char:nth-child(12) {
  transition-delay: .5s;
}
[data-mask-text] .tbi-mask__charWrap:nth-child(1) .tbi-mask__char:nth-child(13) {
  transition-delay: .425s;
}
[data-mask-text] .tbi-mask__charWrap:nth-child(2) .tbi-mask__char:nth-child(13) {
  transition-delay: .525s;
}
[data-mask-text] .tbi-mask__charWrap:nth-child(1) .tbi-mask__char:nth-child(14) {
  transition-delay: .45s;
}
[data-mask-text] .tbi-mask__charWrap:nth-child(2) .tbi-mask__char:nth-child(14) {
  transition-delay: .55s;
}
[data-mask-text] .tbi-mask__charWrap:nth-child(1) .tbi-mask__char:nth-child(15) {
  transition-delay: .475s;
}
[data-mask-text] .tbi-mask__charWrap:nth-child(2) .tbi-mask__char:nth-child(15) {
  transition-delay: .575s;
}
[data-mask-text] .tbi-mask__lineWrap,
[data-mask-text] .tbi-mask__charWrap,
[data-mask-text] .tbi-mask__blockWrap {
  display: block;
  overflow: hidden;
}
[data-mask-text] .tbi-mask__blockWrap {
  height: 100%;
}
[data-mask-text] [data-mask-text-item=clip] {
  clip-path: inset(0% 0% 100% 0%);
  transition: clip-path 1s cubic-bezier(.85,0,.15,1) .2s;
}

/* ════════════════════════ 區塊小標 (Label) ════════════════════════ */
.tbi-label {
  font-family: var(--ff-en);
  font-weight: 700;
  display: flex;
  align-items: center;
}
@media screen and (min-width: 821px) {
  .tbi-label {
    font-size: 1rem;
  }
}
@media screen and (min-width: 821px) and (max-width: 854px) {
  .tbi-label {
    font-size: 10px;
  }
}
@media screen and (max-width:820.98px) {
  .tbi-label {
    font-size: .4375rem;
  }
}
@media screen and (max-width:820.98px) and (max-width: 268px) {
  .tbi-label {
    font-size: 10px;
  }
}
.tbi-label__text {
  text-transform: uppercase;
}
@media screen and (min-width: 821px) {
  .tbi-label__text {
    padding-inline: .75rem;
  }
}
@media screen and (max-width:820.98px) {
  .tbi-label__text {
    padding-inline: .375rem;
  }
}

/* ════════════════════════ 膠囊按鈕(滑過時線框與文字輪替) ════════════════════════ */
.tbi-btn {
  width: fit-content;
  overflow: hidden;
}
@media screen and (min-width: 821px) {
  .tbi-btn {
    min-width: 10.75rem;
    height: 2.1875rem;
  }
}
@media screen and (max-width:820.98px) {
  .tbi-btn {
    min-width: 5.375rem;
    height: 1.09375rem;
  }
}
.tbi-btn__link {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  background-color: #000;
  transition: background-color .6s cubic-bezier(0,.55,.45,1);
  overflow: hidden;
}
@media screen and (min-width: 821px) {
  .tbi-btn__link {
    border-radius: 1.5rem;
  }
}
@media screen and (max-width:820.98px) {
  .tbi-btn__link {
    border-radius: .75rem;
  }
}
.tbi-btn__link:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 1px solid #000;
  opacity: 0;
  transition: opacity .6s cubic-bezier(0,.55,.45,1);
}
@media screen and (min-width: 821px) {
  .tbi-btn__link:before {
    border-radius: 1.5rem;
  }
}
@media screen and (max-width:820.98px) {
  .tbi-btn__link:before {
    border-radius: .75rem;
  }
}
@media (hover: hover) {
  :root .tbi-btn__link:hover {
    background-color: #fff;
  }
  :root .tbi-btn__link:hover:before {
    opacity: 1;
  }
  :root .tbi-btn__link:hover .tbi-btn__text {
    color: #000;
    transform: translateY(-100%);
  }
  :root .tbi-btn__link:hover .tbi-btn__line {
    opacity: 1;
    transition: width .6s cubic-bezier(.85,0,.15,1) .1s,opacity .6s cubic-bezier(.85,0,.15,1),border .3s cubic-bezier(0,.55,.45,1);
  }
  :root .tbi-btn__link:hover .tbi-btn__line.-no01 {
    width: 105%;
  }
  :root .tbi-btn__link:hover .tbi-btn__line.-no02 {
    width: 105%;
    transition-delay: .2s;
  }
}
.tbi-btn__inner {
  position: relative;
  display: block;
  height: 100%;
  overflow: hidden;
}
.tbi-btn__text {
  font-family: var(--ff-en);
  font-weight: 700;
  line-height: 0%;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  color: #fff;
  text-transform: uppercase;
  transition: color .6s cubic-bezier(0,.55,.45,1),transform .6s cubic-bezier(0,.55,.45,1);
}
@media screen and (min-width: 821px) {
  .tbi-btn__text {
    font-size: .8125rem;
    padding-inline: 3.125rem;
  }
}
@media screen and (min-width: 821px) and (max-width: 1051px) {
  .tbi-btn__text {
    font-size: 10px;
  }
}
@media screen and (max-width:820.98px) {
  .tbi-btn__text {
    font-size: .40625rem;
    padding-inline: 1.5625rem;
  }
}
@media screen and (max-width:820.98px) and (max-width: 288.5px) {
  .tbi-btn__text {
    font-size: 10px;
  }
}
@media screen and (min-width: 821px) {
  .tbi-btn__text:last-of-type {
    margin-top: .0625rem;
  }
}
@media screen and (max-width:820.98px) {
  .tbi-btn__text:last-of-type {
    margin-top: .03125rem;
  }
}
.tbi-btn__line {
  position: absolute;
  display: block;
  top: -2px;
  left: 50%;
  width: 30%;
  height: calc(100% + 4px);
  border: 1px solid #000;
  transform: translate(-50%);
  opacity: 0;
  transition: width .8s cubic-bezier(.85,0,.15,1),opacity .4s cubic-bezier(0,.55,.45,1),border .8s cubic-bezier(0,.55,.45,1) .8s;
}
@media screen and (min-width: 821px) {
  .tbi-btn__line {
    border-radius: 1.5rem;
  }
}
@media screen and (max-width:820.98px) {
  .tbi-btn__line {
    border-radius: .75rem;
  }
}

/* ════════════════════════ 公司介紹:大字標題、導言、照片 ════════════════════════ */
.tbi-company {
  position: relative;
  background-color: #f8f9fa;
}
@media screen and (min-width: 821px) {
  .tbi-company {
    padding-block: 11.25rem 20.625rem;
    padding-inline: 1.875rem;
  }
}
@media screen and (max-width:820.98px) {
  .tbi-company {
    padding-block: 4.6875rem 3.4375rem;
    padding-inline: .625rem;
  }
}
.tbi-company__title {
  font-family: var(--ff-en);
  font-weight: 500;
  line-height: 82%;
}
@media screen and (min-width: 821px) {
  .tbi-company__title {
    font-size: 7.5rem;
    margin-left: 4rem;
  }
}
@media screen and (max-width:820.98px) {
  .tbi-company__title {
    font-size: 1.65625rem;
    margin-left: .0625rem;
  }
}
@media screen and (min-width: 821px) {
  .tbi-company__title .tbi-bigTitle__row:nth-child(1),
  .tbi-company__title .tbi-bigTitle__row:nth-child(2) {
    margin-left: -.4375rem;
  }
}
@media screen and (max-width:820.98px) {
  .tbi-company__title .tbi-bigTitle__row:nth-child(1),
  .tbi-company__title .tbi-bigTitle__row:nth-child(2) {
    margin-left: -.09375rem;
  }
}
.tbi-company__lead {
  font-weight: 500;
}
@media screen and (min-width: 821px) {
  .tbi-company__lead {
    font-size: 1.25rem;
    letter-spacing: .13em;
    line-height: 170%;
    margin-left: 4rem;
    margin-top: 1.1875rem;
  }
}
@media screen and (max-width:820.98px) {
  .tbi-company__lead {
    font-size: .5rem;
    letter-spacing: .1em;
    line-height: 190%;
    margin-top: .5rem;
    margin-left: .0625rem;
  }
}
@media screen and (max-width:820.98px) and (max-width: 234.5px) {
  .tbi-company__lead {
    font-size: 10px;
  }
}
.tbi-coPhoto {
  position: absolute;
  pointer-events: auto;
  overflow: hidden;
}
@media screen and (min-width: 821px) {
  .tbi-coPhoto {
    clip-path: inset(0 round .5rem);
  }
}
@media screen and (max-width:820.98px) {
  .tbi-coPhoto {
    clip-path: inset(0 round .125rem);
  }
}
.tbi-coPhoto.-no01 {
  aspect-ratio: 443/544;
}
@media screen and (min-width: 821px) {
  .tbi-coPhoto.-no01 {
    top: 47.6875rem;
    left: 1.875rem;
    width: 27.6875rem;
  }
}
@media screen and (max-width:820.98px) {
  .tbi-coPhoto.-no01 {
    top: 14.25rem;
    left: .65625rem;
    width: 6.71875rem;
  }
}
@media screen and (min-width: 821px) {
  }
@media screen and (max-width:820.98px) {
  }
@media screen and (min-width: 821px) {
  }
@media screen and (max-width:820.98px) {
  }
.tbi-bigTitle {
  font-family: var(--ff-en);
  font-weight: 500;
}
.tbi-bigTitle__row {
  display: flex;
  white-space: nowrap;
  overflow: hidden;
}
.tbi-bigTitle__char {
  display: block;
  text-transform: uppercase;
}

/* ════════════════════════ 最新消息:列表 ════════════════════════ */
.tbi-news {
  background-color: #f8f9fa;
}
@media screen and (min-width: 821px) {
  .tbi-news {
    padding-inline: 5.875rem;
    padding-block: 11.6875rem 11.25rem;
  }
}
@media screen and (max-width:820.98px) {
  .tbi-news {
    padding-block: 3.6875rem 4.0625rem;
    padding-inline: .625rem .34375rem;
  }
}
.tbi-news__head {
  display: flex;
  justify-content: space-between;
}
@media screen and (min-width: 821px) {
  .tbi-news__head {
    align-items: center;
  }
}
@media screen and (max-width:820.98px) {
  .tbi-news__head {
    flex-direction: column;
    gap: 1.03125rem;
    padding-right: .28125rem;
  }
}
.tbi-news__results {
  position: relative;
}
@media screen and (min-width: 821px) {
  .tbi-news__results {
    margin-top: 2.6875rem;
  }
}
@media screen and (max-width:820.98px) {
  .tbi-news__results {
    margin-top: .53125rem;
  }
}
.tbi-newsPanels {
  position: relative;
}
.tbi-newsList {
  overflow: hidden;
}
.tbi-news__more {
  display: flex;
  justify-content: center;
  margin-inline: auto;
}
@media screen and (min-width: 821px) {
  .tbi-news__more {
    margin-top: 3.125rem;
    width: 10.75rem;
  }
}
@media screen and (max-width:820.98px) {
  .tbi-news__more {
    margin-top: 1.5625rem;
  }
}
.tbi-newsItem {
  position: relative;
}
.tbi-newsItem:before {
  content: "";
  position: absolute;
  top: 0;
  display: block;
  width: 100%;
  height: 1px;
  background-color: #0003;
  transform-origin: left;
  transform: scaleX(0);
}
.tbi-newsItem.-show:before {
  transform: scaleX(1);
  transition: transform 1.2s cubic-bezier(.85,0,.15,1),opacity .6s cubic-bezier(0,.55,.45,1);
}
.tbi-newsItem.-show .tbi-newsItem__link {
  opacity: 1;
}
.tbi-newsItem.-show .tbi-newsItem__link .tbi-newsItem__date,
.tbi-newsItem.-show .tbi-newsItem__link .tbi-newsItem__title {
  transform: translateY(0);
  transition: transform 1.2s cubic-bezier(.85,0,.15,1);
}
.tbi-newsItem.-show:last-child:after {
  transform: scaleX(1);
  transition: transform 1.2s cubic-bezier(.85,0,.15,1),opacity .6s cubic-bezier(0,.55,.45,1);
}
.tbi-newsList.-hover .tbi-newsItem .tbi-newsItem__link {
  opacity: .5;
}
.tbi-newsList.-hover .tbi-newsItem:before,
.tbi-newsList.-hover .tbi-newsItem:after {
  opacity: .5;
}
@media (hover: hover) {
  :root .tbi-newsItem:hover .tbi-newsItem__link {
    opacity: 1;
  }
}
@media screen and (min-width: 821px) {
  @media (hover: hover) {
    :root .tbi-newsItem:hover .tbi-newsItem__link {
      transform: translate(1.25rem);
    }
  }
}
@media screen and (max-width:820.98px) {
  @media (hover: hover) {
    :root .tbi-newsItem:hover .tbi-newsItem__link {
      transform: translate(.625rem);
    }
  }
}
@media (hover: hover) {
  :root .tbi-newsItem:hover .tbi-newsItem__circle {
    opacity: 1;
  }
  :root .tbi-newsItem:hover:before,
  :root .tbi-newsItem:hover+:before {
    opacity: 1;
  }
}
.tbi-newsItem:last-child:after {
  content: "";
  position: absolute;
  bottom: 0;
  display: block;
  width: 100%;
  height: 1px;
  background-color: #0003;
  transform-origin: left;
  transform: scaleX(0);
  transition: opacity .6s cubic-bezier(0,.55,.45,1);
}
.tbi-newsItem__circle {
  position: absolute;
  display: block;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  background-color: #000;
  border-radius: 50%;
  opacity: 0;
  transition: opacity .6s cubic-bezier(0,.55,.45,1);
}
@media screen and (min-width: 821px) {
  .tbi-newsItem__circle {
    width: .375rem;
    height: .375rem;
  }
}
@media screen and (max-width:820.98px) {
  .tbi-newsItem__circle {
    width: .1875rem;
    height: .1875rem;
  }
}
.tbi-newsItem__link {
  display: flex;
  opacity: 0;
  transition: opacity .6s cubic-bezier(0,.55,.45,1),transform .6s cubic-bezier(0,.55,.45,1);
}
@media screen and (min-width: 821px) {
  .tbi-newsItem__link {
    align-items: center;
    padding-block: 1.875rem 1.75rem;
    padding-inline: .6875rem 1.3125rem;
    gap: 4.375rem;
  }
}
@media screen and (max-width:820.98px) {
  .tbi-newsItem__link {
    flex-direction: column;
    padding-block: .875rem .84375rem;
    gap: .28125rem;
  }
}
.tbi-newsItem__info {
  display: flex;
  align-items: center;
  flex-shrink: 0;
}
@media screen and (min-width: 821px) {
  .tbi-newsItem__info {
    gap: 2rem;
  }
}
@media screen and (max-width:820.98px) {
  .tbi-newsItem__info {
    gap: .1875rem;
  }
}
.tbi-newsItem__dateWrap,
.tbi-newsItem__titleWrap {
  display: block;
  overflow: hidden;
}
.tbi-newsItem__date,
.tbi-newsItem__title {
  display: block;
  transform: translateY(110%);
}
.tbi-newsItem__date {
  font-family: var(--ff-en);
  font-weight: 700;
}
@media screen and (min-width: 821px) {
  .tbi-newsItem__date {
    font-size: .75rem;
    width: 4.375rem;
  }
}
@media screen and (min-width: 821px) and (max-width: 1139px) {
  .tbi-newsItem__date {
    font-size: 10px;
  }
}
@media screen and (max-width:820.98px) {
  .tbi-newsItem__date {
    font-size: .40625rem;
    width: 2.1875rem;
  }
}
@media screen and (max-width:820.98px) and (max-width: 288.5px) {
  .tbi-newsItem__date {
    font-size: 10px;
  }
}
.tbi-newsItem__title {
  font-weight: 500;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
  letter-spacing: .06em;
  line-height: 180%;
}
@media screen and (min-width: 821px) {
  .tbi-newsItem__title {
    font-size: .875rem;
    padding-block: .3125rem;
  }
}
@media screen and (min-width: 821px) and (max-width: 976px) {
  .tbi-newsItem__title {
    font-size: 10px;
  }
}
@media screen and (max-width:820.98px) {
  .tbi-newsItem__title {
    font-size: .4375rem;
  }
}
@media screen and (max-width:820.98px) and (max-width: 268px) {
  .tbi-newsItem__title {
    font-size: 10px;
  }
}

/* ════════════════════════ 頁尾 ════════════════════════ */
.tbi-footer {
  background-color: #1a1c22;
  color: #fff;
  z-index: 500;
}
@media screen and (min-width: 821px) {
  .tbi-footer {
    padding-block: 6.875rem 2.0625rem;
    padding-inline: 5.875rem;
  }
}
@media screen and (max-width:820.98px) {
  .tbi-footer {
    padding-block: 3.125rem 1.5625rem;
    padding-inline: 1.46875rem;
  }
}
.tbi-footer__top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
@media screen and (max-width:820.98px) {
  .tbi-footer__top {
    flex-direction: column;
    gap: 2.1875rem;
  }
}
.tbi-ftLogo {
  color: #d7d4cd;
}
@media screen and (min-width: 821px) {
  .tbi-ftLogo {
    width: 11rem;
  }
}
@media screen and (max-width:820.98px) {
  .tbi-ftLogo {
    width: 5.3125rem;
    margin-inline: auto;
  }
}
.tbi-ftNav {
  display: flex;
}
@media screen and (min-width: 821px) {
  .tbi-ftNav {
    gap: 3.8125rem;
  }
}
@media screen and (max-width:820.98px) {
  .tbi-ftNav {
    flex-direction: column;
    width: 100%;
    gap: .9375rem;
  }
}
.tbi-ftNav__section {
  display: flex;
}
@media screen and (min-width: 821px) {
  .tbi-ftNav__section {
    gap: 2.5rem;
  }
}
@media screen and (max-width:820.98px) {
  .tbi-ftNav__section {
    gap: 2.21875rem;
  }
}
@media screen and (min-width: 821px) {
  .tbi-ftNav__section:last-of-type {
    margin-left: 5.6875rem;
  }
}
.tbi-ftNav__title {
  font-family: var(--ff-en);
  font-weight: 700;
  color: #505050;
  text-transform: uppercase;
}
@media screen and (min-width: 821px) {
  .tbi-ftNav__title {
    font-size: .75rem;
  }
}
@media screen and (min-width: 821px) and (max-width: 1139px) {
  .tbi-ftNav__title {
    font-size: 10px;
  }
}
@media screen and (max-width:820.98px) {
  .tbi-ftNav__title {
    font-size: .40625rem;
    width: 3.125rem;
  }
}
@media screen and (max-width:820.98px) and (max-width: 288.5px) {
  .tbi-ftNav__title {
    font-size: 10px;
  }
}
.tbi-ftNav__list {
  display: flex;
  flex-direction: column;
}
@media screen and (min-width: 821px) {
  .tbi-ftNav__list {
    gap: .125rem;
    margin-top: -.3125rem;
    margin-left: -.375rem;
  }
}
@media screen and (max-width:820.98px) {
  .tbi-ftNav__list {
    gap: .03125rem;
    margin-top: -.15625rem;
    margin-left: -.1875rem;
  }
}
.tbi-ftNav__item {
  font-family: var(--ff-en);
  font-weight: 700;
  width: fit-content;
  text-transform: uppercase;
}
@media screen and (min-width: 821px) {
  .tbi-ftNav__item {
    font-size: .875rem;
  }
}
@media screen and (min-width: 821px) and (max-width: 976px) {
  .tbi-ftNav__item {
    font-size: 10px;
  }
}
@media screen and (max-width:820.98px) {
  .tbi-ftNav__item {
    font-size: .5rem;
  }
}
@media screen and (max-width:820.98px) and (max-width: 234.5px) {
  .tbi-ftNav__item {
    font-size: 10px;
  }
}
.tbi-ftNav__link {
  display: flex;
  align-items: center;
}
@media screen and (min-width: 821px) {
  .tbi-ftNav__link {
    gap: .25rem;
    padding-block: .3125rem;
    padding-inline: .375rem;
    position: relative;
  }
  .tbi-ftNav__link:after {
    content: "";
    position: absolute;
    bottom: .3125rem;
    height: 1px;
    background-color: #fff;
    transform-origin: right;
    transform: scaleX(0);
    transition: transform .6s cubic-bezier(.85,0,.15,1);
  }
}
@media screen and (min-width: 821px) {
  @media (hover: hover) {
    :root .tbi-ftNav__link:hover:after {
      transform: scaleX(1);
      transform-origin: left;
    }
  }
}
@media screen and (max-width:820.98px) {
  .tbi-ftNav__link {
    gap: .125rem;
    padding-block: .15625rem;
    padding-inline: .1875rem;
    position: relative;
  }
  .tbi-ftNav__link:after {
    content: "";
    position: absolute;
    bottom: .15625rem;
    height: 1px;
    background-color: #fff;
    transform-origin: right;
    transform: scaleX(0);
    transition: transform .6s cubic-bezier(.85,0,.15,1);
  }
}
@media screen and (max-width:820.98px) {
  @media (hover: hover) {
    :root .tbi-ftNav__link:hover:after {
      transform: scaleX(1);
      transform-origin: left;
    }
  }
}
@media screen and (min-width: 821px) {
  .tbi-ftNav__link:after {
    width: calc(100% - .75rem);
    left: .375rem;
  }
}
@media screen and (max-width:820.98px) {
  .tbi-ftNav__link:after {
    width: calc(100% - .375rem);
    left: .1875rem;
  }
}
.tbi-footer__bottom {
  display: flex;
  justify-content: space-between;
}
@media screen and (min-width: 821px) {
  .tbi-footer__bottom {
    align-items: center;
    margin-top: 8.5625rem;
  }
}
@media screen and (max-width:820.98px) {
  .tbi-footer__bottom {
    align-items: flex-end;
    margin-top: 2.96875rem;
  }
}
.tbi-footer__legal {
  display: flex;
  opacity: .5;
}
@media screen and (min-width: 821px) {
  .tbi-footer__legal {
    gap: 3.25rem;
  }
}
@media screen and (max-width:820.98px) {
  .tbi-footer__legal {
    flex-direction: column-reverse;
    gap: .375rem;
  }
}
.tbi-footer__copy {
  font-family: var(--ff-en);
  font-weight: 700;
}
@media screen and (min-width: 821px) {
  .tbi-footer__copy {
    font-size: .75rem;
  }
}
@media screen and (min-width: 821px) and (max-width: 1139px) {
  .tbi-footer__copy {
    font-size: 10px;
  }
}
@media screen and (max-width:820.98px) {
  .tbi-footer__copy {
    font-size: .375rem;
  }
}
@media screen and (max-width:820.98px) and (max-width: 312.5px) {
  .tbi-footer__copy {
    font-size: 10px;
  }
}
.tbi-footer__privacy {
  font-family: var(--ff-en);
  font-weight: 700;
  text-transform: uppercase;
}
@media screen and (min-width: 821px) {
  .tbi-footer__privacy {
    font-size: .75rem;
    position: relative;
  }
}
@media screen and (min-width: 821px) and (max-width: 1139px) {
  .tbi-footer__privacy {
    font-size: 10px;
  }
}
@media screen and (min-width: 821px) {
  .tbi-footer__privacy:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -.0625rem;
    width: 100%;
    height: 1px;
    background-color: #fff;
    transform-origin: right;
    transform: scaleX(0);
    transition: transform .6s cubic-bezier(.85,0,.15,1);
  }
}
@media screen and (min-width: 821px) {
  @media (hover: hover) {
    :root .tbi-footer__privacy:hover:after {
      transform: scaleX(1);
      transform-origin: left;
    }
  }
}
@media screen and (max-width:820.98px) {
  .tbi-footer__privacy {
    font-size: .375rem;
    position: relative;
  }
}
@media screen and (max-width:820.98px) and (max-width: 312.5px) {
  .tbi-footer__privacy {
    font-size: 10px;
  }
}
@media screen and (max-width:820.98px) {
  .tbi-footer__privacy:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -.03125rem;
    width: 100%;
    height: 1px;
    background-color: #fff;
    transform-origin: right;
    transform: scaleX(0);
    transition: transform .6s cubic-bezier(.85,0,.15,1);
  }
}
@media screen and (max-width:820.98px) {
  @media (hover: hover) {
    :root .tbi-footer__privacy:hover:after {
      transform: scaleX(1);
      transform-origin: left;
    }
  }
}