.sticky-section {
  position: relative;
  height: var(--container-height, 440vh);
}

.sticky-section section {
  position: sticky;
  top: 0;
}

.sticky-section section.yg-image-text-container {
  position: sticky;
  top: 0;
}

/* yg-video-intro */

.yg-video-intro-module {
  width: 100%;
  height: 180vh;
}

.yg-video-intro-mask {
  position: sticky;
  z-index: 1;
  top: 0;
  overflow: hidden;
  width: 100vw;
  height: 100vh;
  transition: mask-position 0.3s linear,
  -webkit-mask-position 0.3s linear,
  mask-size 0.3s linear,
  -webkit-mask-size 0.3s linear;
  transform-origin: bottom left;
  pointer-events: none;
  /* background-color: #FFFFFF; */

  /* -webkit-mask-composite: source-over;
  mask-composite: add;
  mask-image: url(data:image/svg+xml;charset=utf-8;base64,Cjxzdmcgd2lkdGg9IjExNzAiIGhlaWdodD0iMTgxIiB2aWV3Qm94PSIwIDAgMTE3MCAxODEiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik0xMDUyLjQ5IDE3Ny4zNlYyLjE2MDAzSDEwODguOTdWNzIuMjRIMTA4OS42OUMxMDkyLjg5IDY0Ljg4IDEwOTcuNjkgNTkuMjggMTEwNC4wOSA1NS40NEMxMTEwLjY1IDUxLjYgMTExOC4zMyA0OS42OCAxMTI3LjEzIDQ5LjY4QzExNDAuNTcgNDkuNjggMTE1MS4wNSA1My4zNiAxMTU4LjU3IDYwLjcyQzExNjYuMDkgNjguMDggMTE2OS44NSA3Ny4yOCAxMTY5Ljg1IDg4LjMyVjE3Ny4zNkgxMTMzLjYxVjEwMC41NkMxMTMzLjYxIDkzLjM2IDExMzEuNzcgODggMTEyOC4wOSA4NC40OEMxMTI0LjQxIDgwLjggMTEyMC4wOSA3OC45NiAxMTE1LjEzIDc4Ljk2QzExMTAuNDkgNzguOTYgMTEwNi4xNyA4MC4xNiAxMTAyLjE3IDgyLjU2QzEwOTguMzMgODQuOCAxMDk1LjEzIDg4LjQ4IDEwOTIuNTcgOTMuNkMxMDkwLjE3IDk4LjU2IDEwODguOTcgMTA0Ljk2IDEwODguOTcgMTEyLjhWMTc3LjM2SDEwNTIuNDlaIiBmaWxsPSJibGFjayIvPgo8cGF0aCBkPSJNOTc2LjEyOSAxODAuNDhDOTY0LjEyOSAxODAuNDggOTUzLjQwOSAxNzcuODQgOTQzLjk2OSAxNzIuNTZDOTM0LjY4OSAxNjcuMjggOTI3LjQwOSAxNTkuNjggOTIyLjEyOSAxNDkuNzZDOTE3LjAwOSAxMzkuNjggOTE0LjQ0OSAxMjggOTE0LjQ0OSAxMTQuNzJDOTE0LjQ0OSAxMDEuNiA5MTcuMDg5IDkwLjE2IDkyMi4zNjkgODAuNEM5MjcuNjQ5IDcwLjY0IDkzNC45MjkgNjMuMTIgOTQ0LjIwOSA1Ny44NEM5NTMuNjQ5IDUyLjQwMDEgOTY0LjM2OSA0OS42ODAxIDk3Ni4zNjkgNDkuNjhDODg2LjI4OSA0OS42ODMxIDk5NS40MDkgNTEuNjgwMSAxMDAzLjczIDU1LjY4QzEwMTIuMDUgNTkuNTIgMTAxOC43NyA2NC44MDAxIDEwMjMuODkgNzEuNTIwMUMxMDI5LjAxIDc4LjA4MDEgMTAzMi4wNSA4NS4zNjAxIDEwMzMuMDEgOTMuMzYwMUwxMDAwLjM3IDEwMS41MkM5OTguNzY5IDk0LjMyIDk5NS44ODkgODguODgwMSA5OTEuNzI5IDg1LjIwMDFDOTg3LjU2OSA4MS4zNiA5ODIuNTI5IDc5LjQ0IDk3Ni42MDkgNzkuNDRDOTY4LjQ0OSA3OS40NCA5NjEuOTY5IDgyLjU2IDk1Ny4xNjkgODguOEM5NTIuNTI5IDk0Ljg4IDk1MC4yMDkgMTAzLjM2IDk1MC4yMDkgMTE0LjI0Qzk1MC4yMDkgMTI0Ljk2IDk1Mi42MDkgMTMzLjY4IDk1Ny40MDkgMTQwLjRDOTYyLjIwOSAxNDcuMTIgOTY4LjY4OSAxNTAuNDggOTc2Ljg0OSAxNTAuNDhDOTgyLjYwOSAxNTAuNDggOTg3LjU2OSAxNDguNzIgOTkxLjcyOSAxNDUuMkM5OTYuMDQ5IDE0MS42OCA5OTguOTI5IDEzNi40OCAxMDAwLjM3IDEyOS42TDEwMzMuMjUgMTM4LjI0QzEwMzIuMTMgMTQ2LjI0IDEwMjkuMDEgMTUzLjUyIDEwMjMuODkgMTYwLjA4QzEwMTguNzcgMTY2LjQ4IDEwMTIuMDUgMTcxLjQ0IDEwMDMuNzMgMTc0Ljk2Qzk5NS41NjkgMTc4LjY0IDk4Ni4zNjkgMTgwLjQ4IDk3Ni4xMjkgMTgwLjQ4WiIgZmlsbD0iYmxhY2siLz4KPHBhdGggZD0iTTg0NC42NDUgMTgwLjQ4QzgzMi4xNjUgMTgwLjQ4IDgyMS4wNDUgMTc3LjkyIDgxMS4yODUgMTcyLjhDODAxLjY4NSAxNjcuNTIgNzk0LjE2NSAxNjAgNzg4LjcyNSAxNTAuMjRDNzgzLjI4NSAxNDAuMzIgNzgwLjU2NSAxMjguNjQgNzgwLjU2NSAxMTUuMkM3ODAuNTY1IDEwMS42IDc4My4yODUgODkuODQwMSA3ODguNzI1IDc5LjkyMDFDNzk0LjE2NSA3MCA4MDEuNTI1IDYyLjQ4IDgxMC44MDUgNTcuMzZDODIwLjA4NSA1Mi4yNDAxIDgzMC40ODUgNDkuNjgwMSA4NDIuMDA1IDQ5LjY4MDFDODU1LjYwNSA0OS42ODAxIDg2Ny4xMjUgNTIuOTYwMSA4NzYuNTY1IDU5LjUyMDFDODg2LjAwNSA2NS45MjAxIDg5Mi44ODUgNzQuOCA4OTcuMjA1IDg2LjE2QzkwMS41MjUgOTcuNTIgOTAyLjk2NSAxMTAuMzIgOTAxLjUyNSAxMjQuNTZIODE0LjQwNUw4MTQuMTY1IDEwMS41Mkg4NjUuMjg1Qzg2NC44MDUgOTcuMiA4NjMuNTI1IDkzLjI4IDg2MS40NDUgODkuNzZDODU5LjM2NSA4Ni4yNCA4NTYuNjQ1IDgzLjQ0MDEgODUzLjI4NSA4MS4zNjAxQzg0OS45MjUgNzkuMjgwMSA4NDYuMTY1IDc4LjI0MDEgODQyLjAwNSA3OC4yNDAxQzgzOC4xNjUgNzguMjQwMSA4MzQuMzI1IDc5LjM2IDgzMC40ODUgODEuNkM4MjYuODA1IDgzLjY4IDgyMy43NjUgODYuOTYwMSA4MjEuMzY1IDkxLjQ0MDFDODE5LjEyNSA5NS45MjAxIDgxOC4wMDUgMTAxLjUyIDgxOC4wMDUgMTA4LjI0VjExOS4wNEM4MTcuODQ1IDEyNS4yOCA4MTguODg1IDEzMC45NiA4MjEuMTI1IDEzNi4wOEM4MjMuNTI1IDE0MS4wNCA4MjYuNzI1IDE0NC45NiA4MzAuNzI1IDE0Ny44NEM4MzQuODg1IDE1MC41NiA4MzkuNDQ1IDE1MS45MiA4NDQuNDA1IDE1MS45MkM4NDkuODQ1IDE1MS45MiA4NTQuNjQ1IDE1MC41NiA4NTguODA1IDE0Ny44NEM4NjIuOTY1IDE0NS4xMiA4NjYuMDA1IDE0MC41NiA4NjcuOTI1IDEzNC4xNkw4OTkuNjA1IDE0Mi4wOEM4OTcuODQ1IDE0OS4xMiA4OTQuNDA1IDE1NS42IDg4OS4yODUgMTYxLjUyQzg4NC4xNjUgMTY3LjI4IDg3Ny43NjUgMTcxLjg0IDg3MC4wODUgMTc1LjJDODYyLjQwNSAxNzguNzIgODUzLjkyNSAxODAuNDggODQ0LjY0NSAxODAuNDhaIiBmaWxsPSJibGFjayIvPgo8cGF0aCBkPSJNNzAyLjIzNyAxNzcuMzZWMzZINjQ5LjQzN1YzLjM1OTk5SDc5Mi40NzdWMzZINzM5LjQzN1YxNzcuMzZINzAyLjIzN1oiIGZpbGw9ImJsYWNrIi8+CjxwYXRoIGQ9Ik01MzQuMzQgMTgwLjQ4QzUyNC45IDE4MC40OCA1MTcuMDYgMTc4LjY0IDUxMC44MiAxNzQuOTZDNTA0LjU4IDE3MS4yOCA0OTkuODYgMTY2LjI0IDQ5Ni42NiAxNTkuODRINDk2LjE4TDQ5NC45OCAxNzcuMzZINDU5Ljk0VjIuMTYwMDNINDk2LjE4Vjc0Ljg4SDQ5Ni45QzQ5OS42MiA2Ny44NCA1MDQuMzQgNjEuOTIgNTExLjA2IDU3LjEyQzUxNy45NCA1Mi4xNiA1MjYuMSA0OS42OCA1MzUuNTQgNDkuNjhDNTQ2LjEgNDkuNjggNTU1LjIyIDUyLjcyIDU2Mi45IDU4LjhDNTcwLjU4IDY0LjcyIDU3Ni40MiA3Mi43MiA1ODAuNDIgODIuOEM1ODQuNDIgOTIuODggNTg2LjQyIDEwNC4wOCA1ODYuNDIgMTE2LjRDNTg2LjQyIDEyOC43MiA1ODQuMjYgMTM5Ljc2IDU3OS45NCAxNDkuNTJDNTc1LjYyIDE1OS4xMiA1NjkuNDYgMTY2LjcyIDU2MS40NiAxNzIuMzJDNTUzLjYyIDE3Ny43NiA1NDQuNTggMTgwLjQ4IDUzNC4zNCAxODAuNDhaTTUyNC4wMiAxNTMuMzZDNTI4LjUgMTUzLjM2IDUzMi43NCAxNTEuODQgNTM2Ljc0IDE0OC44QzU0MC43NCAxNDUuNiA1NDMuOTQgMTQxLjIgNTQ2LjM0IDEzNS42QzU0OC45IDEzMCA1NTAuMTggMTIzLjY4IDU1MC4xOCAxMTYuNjRDNTUwLjE4IDEwOS4xMiA1NDguOSAxMDIuNCA1NDYuMzQgOTYuNDhDNTQzLjk0IDkwLjQgNTQwLjY2IDg1LjY4IDUzNi41IDgyLjMyQzUzMi4zNCA3OC45NiA1MjcuODYgNzcuMjggNTIzLjA2IDc3LjI4QzUxOS4wNiA3Ny4yOCA1MTQuOTggNzguNDggNTEwLjgyIDgwLjg4QzUwNi42NiA4My4xMiA1MDMuMDYgODcuMDQgNTAwLjAyIDkyLjY0QzQ5Ny4xNCA5OC4yNCA0OTUuNyAxMDUuNiA0OTUuNyAxMTQuNzJDNDk1LjcgMTI0LjMyIDQ5Ny4wNiAxMzIgNDk5Ljc4IDEzNy43NkM1MDIuNSAxNDMuNTIgNTA1Ljk0IDE0Ny42IDUxMC4xIDE1MEM1MTQuNDIgMTUyLjI0IDUxOS4wNiAxNTMuMzYgNTI0LjAyIDE1My4zNloiIGZpbGw9ImJsYWNrIi8+CjxwYXRoIGQ9Ik0zNjIuOTU5IDE4MC40OEMzNDkuODM5IDE4MC40OCAzMzkuNDM5IDE3Ny4wNCAzMzEuNzU5IDE3MC4xNkMzMjQuMjM5IDE2My4yOCAzMjAuNDc5IDE1NC4xNiAzMjAuNDc5IDE0Mi44QzMyMC40NzkgMTMwLjQ4IDMyNC44NzkgMTIxLjUyIDMzMy42NzkgMTE1LjkyQzM0Mi40NzkgMTEwLjMyIDM1NS45MTkgMTA2LjU2IDM3My45OTkgMTA0LjY0TDQwNi42MzkgMTAxLjA0VjEyMC40OEwzODIuNjM5IDEyMi44OEMzNzMuMzU5IDEyMy44NCAzNjYuNzE5IDEyNS45MiAzNjIuNzE5IDEyOS4xMkMzNTguODc5IDEzMi4xNiAzNTYuOTU5IDEzNi4zMiAzNTYuOTU5IDE0MS42QzM1Ni45NTkgMTQ1LjYgMzU4LjQ3OSAxNDguOCAzNjEuNTIgMTUxLjJDMzY0LjU2IDE1My42IDM2OC42MzkgMTU0LjggMzczLjc1OSAxNTQuOEMzNzguMDc5IDE1NC44IDM4Mi4wNzkgMTUzLjc2IDM4NS43NTkgMTUxLjY4QzM4OS40MzkgMTQ5LjYgMzkyLjMxOSAxNDYuNjQgMzk0LjM5OSAxNDIuOEMzOTYuNjM5IDEzOC45NiAzOTcuNzU5IDEzNC40IDM5Ny43NTkgMTI5LjEyVjk3LjQ0QzM5Ny43NTkgOTEuMDQgMzk1Ljk5OSA4Ni4xNTk5IDM5Mi40NzkgODIuNzk5OUMzODkuMTE5IDc5LjI3OTkgMzg0LjcxOSA3Ny41MiAzNzkuMjc5IDc3LjUyQzM3My42NzkgNzcuNTIgMzY5LjExOSA3OC45NTk5IDM2NS41OTkgODEuODRDMzYyLjA3OSA4NC41NTk5IDM1OS4yNzkgODguODggMzU3LjE5OSA5NC44TDMyNC43OTkgODYuMzk5OUMzMjYuNTU5IDc4LjM5OTkgMzMwLjE1OSA3MS41OTk5IDMzNS41OTkgNjUuOTk5OUMzNDEuMTk5IDYwLjM5OTkgMzQ3Ljc1OSA1Ni4yMzk5IDM1NS4yNzkgNTMuNTE5OUMzNjIuNzk5IDUwLjc5OTkgMzcwLjM5OSA0OS40Mzk5IDM3OC4wNzkgNDkuNDM5OUMzOTEuMzU5IDQ5LjQzOTkgNDAyLjE1OSA1MS42Nzk5IDQxMC40NzkgNTYuMTZDNDE4Ljk1OSA2MC42Mzk5IDQyNC45NTkgNjYuMjM5OSA0MjguNDc5IDcyLjk1OTlDNDMyLjE1OSA3OS42OCA0MzMuOTk5IDg2LjQ4IDQzMy45OTkgOTMuMzZWMTQ5LjI4QzQzMy45OTkgMTU5LjM2IDQzNC40NzkgMTY4LjcyIDQzNS40MzkgMTc3LjM2SDM5OS40MzlDMzk4LjMxOSAxNzIuMDggMzk3LjY3OSAxNjYuNTYgMzk3LjUyIDE2MC44SDM5Ny4yNzlDMzk0LjM5OSAxNjYuODggMzkwLjE1OSAxNzEuNjggMzg0LjU1OSAxNzUuMkMzNzguOTU5IDE3OC43MiAzNzEuNzU5IDE4MC40OCAzNjIuOTU5IDE4MC40OFoiIGZpbGw9ImJsYWNrIi8+CjxwYXRoIGQ9Ik0yMzMuODE1IDE4MC40OEMyMTYuMjE1IDE4MC40OCAyMDEuMDk1IDE3Ni41NiAxODguNDU1IDE2OC43MkMxNzUuOTc1IDE2MC44OCAxNjYuNTM1IDE1MC4wOCAxNjAuMTM1IDEzNi4zMkMxNTMuNzM1IDEyMi41NiAxNTAuNTM1IDEwNi44OCAxNTAuNTM1IDg5LjI4QzE1MC41MzUgNzIuNjQgMTUzLjg5NSA1Ny41MiAxNjAuNjE1IDQzLjkyQzE2Ny40OTUgMzAuMzIgMTc3LjE3NSAxOS42IDE4OS42NTUgMTEuNzZDMjAyLjEzNSAzLjkyIDIxNi41MzUgMCAyMzIuODU1IDBDMjUxLjQxNSAwIDI2Ny4zMzUgNC42NCAyODAuNjE1IDEzLjkyQzI5NC4wNTUgMjMuMDQgMzAzLjA5NSAzNi44IDMwNy43MzUgNTUuMkwyNzAuNTM1IDY1LjUyQzI2OC45MzUgNTkuNzYgMjY2LjM3NSA1NC43MiAyNjIuODU1IDUwLjRDMjU5LjQ5NSA0NS45MiAyNTUuMjU1IDQyLjQ4IDI1MC4xMzUgNDAuMDhDMjQ1LjAxNSAzNy42OCAyMzkuMzM1IDM2LjQ4IDIzMy4wOTUgMzYuNDhDMjI0LjEzNSAzNi40OCAyMTYuMzc1IDM4LjcyIDIwOS44MTUgNDMuMkMyMDMuMjU1IDQ3LjUyIDE5OC4yMTUgNTMuNjggMTk0LjY5NSA2MS42OEMxOTEuMTc1IDY5LjUyIDE4OS40MTUgNzguNjQgMTg5LjQxNSA4OS4wNEMxODkuNDE1IDEwMC4yNCAxOTEuMTc1IDExMCAxOTQuNjk1IDExOC4zMkMxOTguMjE1IDEyNi42NCAyMDMuMjU1IDEzMy4xMiAyMDkuODE1IDEzNy43NkMyMTYuNTM1IDE0Mi4yNCAyMjQuNjE1IDE0NC40OCAyMzQuMDU1IDE0NC40OEMyNDMuMzM1IDE0NC40OCAyNTEuMTc1IDE0MS44NCAyNTcuNTc1IDEzNi41NkMyNjQuMTM1IDEzMS4yOCAyNjguNjk1IDEyMy42OCAyNzEuMjU1IDExMy43NkwzMDguNjk1IDEyNi4yNEMzMDIuMTM1IDE0Ni41NiAyOTIuNjE1IDE2MC43MiAyODAuMTM1IDE2OC43MkMyNjcuODE1IDE3Ni41NiAyNTIuMzc1IDE4MC40OCAyMzMuODE1IDE4MC40OFoiIGZpbGw9ImJsYWNrIi8+CjxwYXRoIGQ9Ik01My40NDAxIDE3Ny4zNlYzNkgwLjY0MDEzN1YzLjM1OTk5SDE0My42OFYzNkg5MC42NDAxVjE3Ny4zNkg1My40NDAxWiIgZmlsbD0iYmxhY2siLz4KPC9zdmc+Cg==);
  -webkit-mask-position: 48.1% 20%;
  mask-position: 48.1% 20%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 86.6666666667vw 55vmin;
  mask-size: 86.6666666667vw 55vmin; */
}

.yg-video-intro-mask-bg {
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}

.yg-video-intro-mask-bg svg {
  width: 100vw;
  height: 100vh;
  object-fit: cover;
}

.yg-video-intro-mask video {
  width: 100%;
}

.yg-video-intro-frame {
  position: fixed;
  z-index: 1;
  bottom: 0;
  left: 0;
  width: 100%;
}

.yg-video-intro-frame.opacity-hidden {
  position: static;
}

.yg-video-intro-content {
  padding-block: 64px;
  color: #ffffff;

  margin-block: auto 0;
}

.video-intro-title {
  margin-block: 24px 0;
}

.video-intro-icon {
  max-width: 170px;
}

.yg-video-intro-link {
  display: flex;
  align-items: center;
  gap: 8px;
  transition: all 0.3s ease;
  color: #ffffff;

  margin-block-start: 50px;
}

.yg-video-intro-link:hover {
  color: var(--active-color);
}

.video-label-icon .yg-architecture {
  width: 40px;
  height: 40px;
}

.video-label-icon .yg-architecture img:nth-child(2) {
  top: 6px;
  left: 8px;
}

.video-label-icon .yg-architecture img:nth-child(3) {
  top: 6px;
  left: 25px;
}

.video-label-icon .yg-architecture img:nth-child(4) {
  top: 13px;
  left: 0px;
}

.video-label-icon .yg-architecture img:nth-child(5) {
  top: 13px;
  left: 31px;
}

.video-label-icon .yg-architecture img:nth-child(6) {
  top: 23px;
  left: 8px;
}

.video-label-icon .yg-architecture img:nth-child(7) {
  top: 23px;
  left: 23px;
}

.video-label-icon .yg-architecture img:nth-child(2),
.video-label-icon .yg-architecture img:nth-child(3) {
  width: 7px;
  height: 7px;
}

.video-label-icon .yg-architecture img:nth-child(4),
.video-label-icon .yg-architecture img:nth-child(5),
.video-label-icon .yg-architecture img:nth-child(6),
.video-label-icon .yg-architecture img:nth-child(7) {
  width: 10px;
  height: 10px;
}

.video-label-icon:hover .yg-architecture img:not(:nth-child(1)) {
  animation: turn 1s linear infinite;
}

@media (max-width: 767px) {
  .yg-video-intro-content {
    padding-block: 40px;
  }

  .yg-video-intro-mask video {
    height: 100vh;
    object-fit: cover;
  }

  .video-intro-icon {
    max-width: 104px;
  }

  .video-intro-title {
    margin-block-start: 12px;
    font-size: 30px;
  }

  .yg-video-intro-link {
    margin-block-start: 24px;
    font-size: 16px;
  }
}

/* yg-video-intro */

/* yg-image-text */
.yg-image-text-frame {
  top: 0;
  left: 0;
  align-items: flex-end;
  justify-content: center;
  width: 100%;
  height: 100%;
  padding: 80px 48px;
}

.yg-image-text-box {
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: center;
  max-width: 1080px;
  text-align: center;
  color: #ffffff;

  margin-block: auto 0;
  margin-inline: auto;
}

.yg-image-text-title {
  margin-block: 0 24px;
}

.yg-image-text-description {
  color: rgba(255, 255, 255, 0.90);
  line-height: 1.8;
  margin-bottom: 24px;
  text-align: left;
}

.yg-image-text-description *:last-child {
  margin-bottom: 0;
}

.yg-image-text-link {
  color: #ffffff;
  border: 1px solid rgba(255, 255, 255, 0.3);
}

.yg-image-link-arrow {
  background: rgba(255, 255, 255, 0.15);
}

.yg-image-text-link:hover {
  color: #ffffff;
}

.yg-image-text-link:hover .yg-image-link-arrow {
  background: #ffffff;
}

@media (max-width: 767px) {
  .yg-image-text-frame {
    padding: 40px 20px;
  }

  .yg-image-text-title {
    margin-bottom: 16px;
  }

  .yg-image-text-description {
    font-size: 12px;
    line-height: 1.6;
    margin-bottom: 30px;
  }
}

/* yg-image-text */

/* yg-text-icons */

.yg-text-icons-wrapper video {
  width: 100%;
  height: auto;
}

.yg-text-icons-frame {
  top: 0;
  left: 0;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  width: 100%;
  height: 100%;
  padding-block: 80px;
}

.yg-text-icons-box {
  width: 100%;

  margin-block: auto 0;
}

.yg-text-icons-title {
  margin-block: 0 20px;
  color: #ffffff;
}

.yg-text-icons-list {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 10px;
}

.yg-text-icons-item {
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: center;
  padding-block: 16px 20px;
  cursor: pointer;
  transition: border-color 0.3s ease-in-out;
  color: #ffffff;
  border: 1px solid rgba(255, 255, 255, 0);
  border-radius: 4px;
  background: rgba(255, 255, 255, 0.1);

  backdrop-filter: blur(40px);
}

.yg-text-icons-item .icon-svg {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 66px;
  height: 66px;
  margin-bottom: 12px;
}

.yg-text-icons-item .icon-svg svg {
  width: 66px;
}

.yg-icons-item-title {
  font-weight: 500;
  line-height: 1.2;
  margin-bottom: 6px;
}

.yg-icons-item-content {
  line-height: 1.2;
  color: #c3c3c3;
}

.yg-text-icons-item:hover {
  border-color: var(--active-color);
}

.yg-energy svg {
  cursor: pointer;
}

.yg-energy .yg-shrink-path-mask {
  opacity: 0;

  y: 223.471;
}

.yg-text-icons-item:hover .yg-energy svg .yg-shrink-path-mask {
  animation: charge 1.5s linear infinite;
  opacity: 1;
}

@keyframes charge {
  0% {
    y: 223.471;
  }

  100% {
    y: 391.878;
  }
}

.yg-architecture {
  position: relative;
  width: 66px;
  height: 66px;
  cursor: pointer;
}

.yg-architecture img {
  position: absolute;
}

/* 主图标 */
.yg-architecture img:nth-child(1) {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* 小图标组 */
.yg-architecture img:nth-child(2),
.yg-architecture img:nth-child(3) {
  width: 9px;
  height: 9px;
}

.yg-architecture img:nth-child(2) {
  top: 12px;
  left: 14px;
}

.yg-architecture img:nth-child(3) {
  top: 12px;
  left: 44px;
}

/* 大图标组 */
.yg-architecture img:nth-child(4),
.yg-architecture img:nth-child(5),
.yg-architecture img:nth-child(6),
.yg-architecture img:nth-child(7) {
  width: 13px;
  height: 13px;
}

.yg-architecture img:nth-child(4) {
  top: 24px;
  left: 2px;
}

.yg-architecture img:nth-child(5) {
  top: 24px;
  left: 53px;
}

.yg-architecture img:nth-child(6) {
  top: 40px;
  left: 16px;
}

.yg-architecture img:nth-child(7) {
  top: 40px;
  left: 39px;
}

/* 悬停动画 */
.yg-text-icons-item:hover .yg-architecture img:not(:nth-child(1)) {
  animation: turn 1s linear infinite;
}

@keyframes turn {
  0% {
    transform: rotate(0deg);
  }

  25% {
    transform: rotate(40deg);
  }

  50% {
    transform: rotate(80deg);
  }

  75% {
    transform: rotate(120deg);
  }

  100% {
    transform: rotate(160deg);
  }
}

.yg-weight {
  position: relative;
  width: 66px;
  height: 66px;
  cursor: pointer;
}

.yg-weight img {
  width: 100%;
  height: 100%;
}

.yg-text-icons-item:hover .yg-weight img {
  animation: scale 1s linear infinite;
}

@keyframes scale {
  0% {
    transform: scale(1, 1);
  }

  50% {
    transform: scale(1.1, 1.1);
  }

  75% {
    transform: scale(1.2, 1.2);
  }

  100% {
    transform: scale(1, 1);
  }
}

.yg-seats {
  position: relative;
  width: 595.28px;
  height: 595.28px;
  cursor: pointer;
}

.yg-seats img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.yg-text-icons-item:hover .yg-seats img:nth-child(1) {
  animation: zoom 0.5s linear forwards;
}

.yg-text-icons-item:hover .yg-seats img:nth-child(2) {
  animation: zoom 0.7s linear forwards;
}

.yg-text-icons-item:hover .yg-seats img:nth-child(3) {
  animation: zoom 0.9s linear forwards;
}

@keyframes zoom {
  0% {
    transform: scale(0.5);
    opacity: 0.5;
  }

  100% {
    transform: scale(1);
    opacity: 1;
  }
}

.yg-speed {
  position: relative;
  width: 66px;
  height: 66px;
  cursor: pointer;
}

.yg-speed img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.yg-speed img:nth-child(2) {
  transform: rotate(160deg);
}

.yg-text-icons-item:hover .yg-speed img:nth-child(2) {
  animation: turn 2s linear forwards;
}

@keyframes turn {
  0% {
    transform: rotate(0deg);
  }

  25% {
    transform: rotate(40deg);
  }

  50% {
    transform: rotate(80deg);
  }

  75% {
    transform: rotate(120deg);
  }

  100% {
    transform: rotate(160deg);
  }
}

.yg-range {
  position: relative;
  width: 66px;
  height: 66px;
}

.yg-range img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.yg-range img.yg-dashed {
  top: 50%;
  height: 24px;
}

.yg-text-icons-item:hover .yg-range img:nth-child(1) {
  animation: zoom 0.8s forwards;
}

.yg-text-icons-item:hover .yg-range img:nth-child(2) {
  animation: opacity 0.05s 0.6s forwards;
  opacity: 0;
}

.yg-text-icons-item:hover .yg-range img:nth-child(3) {
  animation: opacity 0.1s 0.8s forwards;
  opacity: 0;
}

.yg-text-icons-item:hover .yg-range img:nth-child(4) {
  animation: opacity 0.15s 1s forwards;
  opacity: 0;
}

.yg-text-icons-item:hover .yg-range img:nth-child(5) {
  animation: opacity 0.2s 1.2s forwards;
  opacity: 0;
}

.yg-text-icons-item:hover .yg-rangeimg:nth-child(6) {
  animation: zoom 1s forwards;
}

@keyframes zoom {
  0% {
    transform: scale(0);
  }

  100% {
    transform: scale(1);
  }
}

@keyframes opacity {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@media (max-width: 768px) {
  .yg-text-icons-list {
    grid-template-columns: repeat(4, 1fr);
  }
}

@media (max-width: 767px) {
  .yg-text-icons-frame {
    padding-block: 40px;
  }

  .yg-text-icons-list {
    grid-template-columns: repeat(3, 1fr);
  }

  .yg-text-icons-title {
    text-align: center;
  }

  .yg-text-icons-item {
    padding-block: 12px 16px;
  }

  .yg-text-icons-item .icon-svg {
    transform: scale(0.6);
    margin-bottom: 8px;
  }

  .yg-icons-item-title {
    font-size: 12px;
    margin-top: -13px;
  }

  .yg-text-icons-wrapper video {
    height: 80vh;
    object-fit: cover;
  }
}

/* yg-text-icons */

/* yg-hover-text */
.yg-hover-text-container {
  padding-block: 120px 100px;
}

.yg-hover-text-video video {
  width: 100%;
  height: auto;
}

.yg-hover-tab-animation {
  display: flex;
  align-items: flex-end;
  margin-top: 64px;
}

.yg-hover-tab-animation-item {
  flex: 1;
}

.yg-hover-tab-animation-number {
  font-size: 70px;
  line-height: 1.4;
  text-align: center;
  letter-spacing: 0.7px;
  color: #000000;
}

.yg-hover-tab-animation-icon {
  display: flex;
  align-items: center;
  justify-content: center;

  filter: invert(1);
}

.yg-hover-tab-animation-icon .yg-architecture {
  width: 96px;
  height: 96px;
}

.yg-hover-tab-animation-icon .yg-architecture img:nth-child(2),
.yg-hover-tab-animation-icon .yg-architecture img:nth-child(3) {
  width: 12px;
  height: 12px;
}

.yg-hover-tab-animation-icon .yg-architecture img:nth-child(2) {
  top: 18px;
  left: 22px;
}

.yg-hover-tab-animation-icon .yg-architecture img:nth-child(3) {
  top: 18px;
  left: 63px;
}

.yg-hover-tab-animation-icon .yg-architecture img:nth-child(4) {
  top: 37px;
  left: 7px;
}

.yg-hover-tab-animation-icon .yg-architecture img:nth-child(5) {
  top: 37px;
  left: 76px;
}

.yg-hover-tab-animation-icon .yg-architecture img:nth-child(6) {
  top: 61px;
  left: 28px;
}

.yg-hover-tab-animation-icon .yg-architecture img:nth-child(7) {
  top: 61px;
  left: 55px;
}

.yg-hover-tab-animation-icon .yg-architecture img:not(:nth-child(1)) {
  animation: turn 1s linear infinite;
}

@keyframes turn {
  0% {
    transform: rotate(0deg);
  }

  25% {
    transform: rotate(40deg);
  }

  50% {
    transform: rotate(80deg);
  }

  75% {
    transform: rotate(120deg);
  }

  100% {
    transform: rotate(160deg);
  }
}

@media (max-width: 767px) {
  .yg-hover-text-container {
    padding-block: 48px;
    margin-bottom: -50px;
  }

  .yg-hover-tab-animation {
    margin-top: 30px;
  }

  .yg-hover-tab-animation.is-animation-number {
    transform: translateY(-50px);
  }

  .yg-hover-tab-animation-number {
    font-size: 32px;
  }

  .yg-hover-tab-animation-icon {
    transform: scale(0.38) translateY(70px);
  }


  .yg-hover-text-container .yg-tab-pagination.swiper-pagination-progressbar {
    transform: translateY(-50px);
  }
}

/* yg-hover-text */

/* yg-hover-image */
.yg-hover-image-container {
  position: relative;
  padding-block: 120px;
}

@media (max-width: 1024px) {
  .yg-hover-image-container {
    padding-block: 48px;
  }
}

@media (max-width: 767px) {
  .yg-hover-image-container {
  }
}

/* yg-hover-image */

/* yg-image-slide */
.yg-image-slide-container {
  padding-block: 120px 100px;
}

.yg-image-slide-title {
  margin-block: 0 50px;
}

.yg-image-slide-list {
  overflow: hidden;
  cursor: none;
  border-radius: 12px;
}

.yg-image-slide-list .swiper-button-prev,
.yg-image-slide-list .swiper-button-next {
  position: absolute;
  z-index: 10;
  top: 50%;
  transition: opacity 0.3s,
  top 0.2s;
  transform: translateY(-50%);
  pointer-events: auto;
  opacity: 0;
}

.yg-image-slide-list .swiper-button-prev {
  left: 20px;
}

.yg-image-slide-list .swiper-button-next {
  right: 20px;
}

.yg-image-slide-item {
  display: flex !important;
  overflow: hidden;
  border-radius: 12px;
}

.yg-slide-item-frame {
  top: 0;
  left: 0;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: 100%;
  height: 100%;
  padding: 80px 48px;
  color: #ffffff;
}

.yg-slide-icon-list {
  display: flex;
}

.yg-slide-icon-item {
  display: flex;
  align-items: center;
  flex: 1;
  flex-direction: column;
  justify-content: center;
  transition: all 0.3s ease-in-out;
  transition-delay: 0.3s;
  transform: translateY(30px);
  opacity: 0.4;
}

.yg-slide-icon-item::after {
  position: absolute;
  top: 0;
  right: 0;
  display: block;
  width: 1px;
  height: 80%;
  content: ' ';
  background-color: rgba(255, 255, 255, 0.2);
}

.yg-slide-icon-item:last-child::after {
  display: none;
}

.yg-image-slide-item.swiper-slide-active .yg-slide-icon-item {
  transform: translateY(0);
  opacity: 1;
}

.yg-slide-icon-img {
  margin-bottom: 8px;
}

.yg-slide-icon-img img {
  max-width: 70px;
}

.yg-slide-icon-title {
  font-weight: 500;
  margin-bottom: 4px;
}

.yg-slide-icon-content {
  line-height: 1.2;
  color: #cccccc;
}

.custom-cursor {
  position: fixed;
  z-index: 9999;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: opacity 0.3s ease;
  pointer-events: none;
  opacity: 0;
  border-radius: 50%;

  will-change: transform;
}

.custom-cursor.is-visible {
  opacity: 1;
}

.custom-cursor span {
  position: absolute;
  opacity: 0;
}

.custom-cursor.is-half-start .is-half-start {
  opacity: 1;
}

.custom-cursor.is-half-end .is-half-end {
  opacity: 1;
}

@media (max-width: 767px) {
  .yg-image-slide-container {
    padding-block: 48px;
  }

  .yg-image-slide-title {
    margin-block: 0 30px;
  }

  .yg-image-slide-item {
    border-radius: 0;
  }

  .yg-image-slide-container .section {
    padding-inline: 0;
  }

  .yg-image-slide-list {
    border-radius: 0;
  }

  .yg-slide-item-frame {
    color: #1A1A1A;
    justify-content: flex-end;
    padding: 40px 20px;
  }

  .yg-slide-item-title {
    text-align: center;
    margin-bottom: 30px;
    font-size: 20px;
    line-height: 1.2;
  }

  .yg-slide-icon-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    row-gap: 16px;
  }

  .yg-slide-icon-img {
    filter: invert(1);
  }

  .yg-slide-icon-img img {
    max-width: 50px;
  }
}

/* yg-image-slide */

/* yg-spots-slide */
.yg-spots-item-frame {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.yg-spots-item-frame .yg-spots-item-title {
  top: 6.6vw;
  left: 50%;
  transition: all 0.6s ease-in-out;
  transform: translateX(-50%) translateY(20px);
  text-align: center;
  color: #ffffff;
}

.swiper-initialized .yg-spots-item-frame .yg-spots-item-title {
  opacity: 0;
}

.yg-spots-item-frame .yg-spots-item-title.animate-active {
  transform: translateX(-50%) translateY(0);
}

.yg-spots-slide-list .yg-spots-slide-item {
  display: flex;
}

.swiper-initialized .swiper-slide.yg-spots-slide-item .yg-spots-item-frame .yg-spots-item-title {
  transform: translateX(-50%) translateY(20px);
}

.swiper-initialized .swiper-slide-active.yg-spots-slide-item .yg-spots-item-frame .yg-spots-item-title {
  transform: translateX(-50%) translateY(0);
  opacity: 1;
}

.yg-spots-icon-item {
  top: var(--vertical_position);
  left: var(--horizontal_position);
}

.yg-spots-icon-circle {
  position: relative;
  display: grid;
  width: 10px;
  height: 10px;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
  opacity: 0.9;
  color: #ffffff;
  border-radius: 50%;
  background: #ffffff;

  place-items: center;
}

.yg-spots-icon-circle::before {
  position: absolute;
  content: '';
  animation: 2s ease-in-out infinite alternate ping;
  border-radius: inherit;
  background: rgba(255, 255, 255, 0.3);

  inset: -20px;
}

.yg-spots-icon-circle::after {
  position: absolute;
  top: -10px;
  left: -10px;
  box-sizing: content-box;
  width: 100%;
  height: 100%;
  padding: 10px;
  content: '';
  border-radius: inherit;
  background: rgba(255, 255, 255, 0.3);
}

.yg-spots-icon-title {
  font-size: 20px;
  line-height: 1.2;
  position: absolute;
  top: -50px;
  left: 50%;
  display: block;
  min-width: 120px;
  transition: opacity 0.2s ease-in-out;
  transform: translateX(-50%);
  text-align: center;
  opacity: 0;
  color: #ffffff;
}

.yg-spots-icon-circle:hover,
.yg-spots-icon-item:hover .yg-spots-icon-title {
  opacity: 1;
}

.yg-spots-pagination {
  z-index: 1;
  bottom: 7vw;
  left: 50%;
  align-items: center;
  justify-content: center;
  transform: translateX(-50%);
}

.yg-spots-pagination.animate-item.animate-active {
  transform: translateX(-50%) translateY(0);
}

.yg-spots-pagination-list {
  display: flex;
  align-items: center;
  gap: 60px;
  justify-content: center;
  max-width: max-content;
  border-bottom: 1px solid #cccccc;
}

.yg-spots-pagination-item {
  font-size: 20px;
  font-weight: 500;
  line-height: 1.4;
  position: relative;
  z-index: 2;
  padding-block: 20px;
  cursor: pointer;
  transition: all 0.3s ease-in-out;
  opacity: 0.6;
  color: #ffffff;
}

.yg-spots-pagination-item.active,
.yg-spots-pagination-item:hover {
  opacity: 1;
}

.yg-spots-pagination-item::after {
  position: absolute;
  bottom: -1px;
  left: 0;
  width: 100%;
  height: 2px;
  content: '';
  transition: background-color 0.3s ease-in-out;
  background-color: transparent;
}

.yg-spots-pagination-item:hover::after,
.yg-spots-pagination-item.active::after {
  background-color: #ea0029;
}

@keyframes ping {
  0% {
    transform: scale(1);
  }

  100% {
    transform: scale(0.8);
  }
}

@media (max-width: 1680px) {
  .yg-spots-pagination-item {
    font-size: 18px;
  }
}

@media (max-width: 767px) {
  .yg-spots-icon-item {
    top: var(--vertical_position_mobile);
    left: var(--horizontal_position_mobile);
  }

  .yg-spots-item-frame .yg-spots-item-title {
    top: 48px;
  }

  .yg-spots-icon-circle {
    width: 5px;
    height: 5px;
  }

  .yg-spots-icon-circle::before {
    inset: -10px;
  }

  .yg-spots-icon-circle::after {
    top: -4px;
    left: -4px;
    padding: 4px;
  }

  .yg-spots-custom-pagination.swiper-pagination-progressbar {
    height: 2px !important;
    border-radius: 37px;
    background: #999;
    bottom: 48px;
    top: auto !important;
    z-index: 1;
    width: 80% !important;
    left: 50% !important;
    transform: translateX(-50%);
  }

  .yg-spots-custom-pagination.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
    border-radius: 37px;
    background: #FFF;
  }

  .yg-spots-icon-title {
    font-size: 16px;
    top: -37px;
  }
}

/* yg-spots-slide */

/* yg-animation-block */
.yg-animation-block-wrapper {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.yg-animation-block-wrapper .section {
  height: 100%;
}

.yg-animation-block-frame {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-direction: column;
  width: 100%;
  height: 100%;
  padding-block: 120px 100px;
}

.yg-animation-block-content {
  max-width: 920px;
  display: flex;
  align-items: center;
  flex-direction: column;
}

.yg-animation-block-title {
  margin-block: 0 24px;
}

.yg-animation-block-description {
  line-height: 1.8;
  color: #5A5A5A;
}

.yg-animation-block-description *:last-child {
  margin-bottom: 0;
}

.yg-animation-block-box {
  border-radius: 16px;
  background: rgba(120, 120, 120, 0.10);
  backdrop-filter: blur(40px);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
  max-width: max-content;
  margin-inline: auto;
  padding: 28px 40px 28px 48px;
  margin-top: 50px;
  min-width: 490px;
}

.yg-animation-label-item {
  text-align: left;
  width: 120%;
}

.yg-animation-label-title {
  color: rgba(26, 26, 26, 0.80);
  font-size: 14px;
  font-weight: 500;
}

.yg-animation-number-box {
  display: flex;
  align-items: flex-end;
  color: var(--active-color);
  margin-top: 16px;
}

.yg-animation-number {
  font-size: 48px;
  font-weight: 500;
  line-height: 1;
}

.yg-animation-number-unit {
  font-size: 20px;
}

.yg-animation-label-desc {
  margin: 0;
  color: #1A1A1A;
  font-size: 16px;
  font-weight: 500;
}

.yg-animation-label-divider {
  display: block;
  width: 1.5px;
  height: 100px;
  background: rgba(26, 26, 26, 0.15)
}

.yg-number-odometer {
  display: inline-flex;
  overflow: hidden;
  line-height: 1;
}

.yg-number-odometer .digit-wrapper {
  overflow: hidden;
  height: 1em;
}

.yg-number-odometer .digit {
  transition: transform 1s cubic-bezier(0.3, 1.3, 0.3, 1);
}

.yg-number-odometer .digit div {
  height: 1em;
  line-height: 1em;
  text-align: center;
}

.yg-animation-block-bottom {
  max-width: 1000px;
  transform: translateX(32px);
}

.yg-animation-block-images {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.yg-animation-block-images img {
  opacity: 0;
  transition: opacity 600ms ease;
}

.yg-animation-block-image.is-line {
  opacity: 1;
  clip-path: inset(0 100% 0 0);
  transition: clip-path 1s cubic-bezier(0.4, 0, 0.2, 1);
}

.yg-animation-block-bottom .yg-animation-block-image {
  /*opacity: 0;*/
  /*clip-path: inset(0 100% 0 0);*/
  /*transition: clip-path 1s ease, opacity 1s ease;*/
}

.yg-animation-block-bottom.is-visible .yg-animation-block-image {
  /*opacity: 1;*/
  /*clip-path: inset(0 0 0 0);*/
}

@media (max-width: 767px) {
  .yg-animation-block-frame {
    padding-block: 48px;
  }

  .yg-animation-block-title {
    margin-bottom: 16px;
  }

  .yg-animation-block-box {
    gap: 24px;
    min-width: 80%;
    padding: 16px 20px;
    margin-top: 24px;
  }

  .yg-animation-label-title {
    font-size: 10px;
  }

  .yg-animation-label-desc {
    font-size: 11px;
  }

  .yg-animation-block-description {
    font-size: 12px;
    line-height: 1.7;
  }

  .yg-animation-number-box {
    margin-top: 8px;
  }

  .yg-animation-number {
    font-size: 24px;
  }

  .yg-animation-number-unit {
    font-size: 12px;
  }

  .yg-animation-block-bottom {
    transform: none;
  }
}


/* yg-animation-block */

/* yg-reveal-slide */
.yg-reveal-slide-section {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.yg-reveal-slide-section .section {
  height: 100%;
}

.yg-reveal-slide-item .yg-reveal-slide-inner.animate-item.animate-active {
  transition: opacity 0.5s ease, transform 0.5s ease;
  transform: translateY(20px);
  opacity: 0;
}

.yg-reveal-slide-item .yg-reveal-slide-inner.animate-item.animate-active.animate-is-active {
  opacity: 1;
  transform: translateY(0);
}

.yg-reveal-roadmap-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  color: #fff;
  min-width: 470px;
  flex: 1;
  justify-content: center;
}

.yg-reveal-roadmap-wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
  max-width: max-content;
}

.yg-reveal-roadmap-label {
  color: #fff;
  transform: translateY(6px);
}

.yg-reveal-roadmap-location {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  max-width: max-content;
}

.yg-reveal-roadmap-start {
  margin-inline: 0 auto;
}

.yg-reveal-roadmap-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  max-width: max-content;
}

.yg-reveal-roadmap-start-inner {
  transform: translate(14px, 19px);
}

.yg-reveal-roadmap-end-inner {
  transform: translate(-4px, -53px);
}

.yg-reveal-roadmap-end {
  margin-inline: auto 0;
}

.yg-reveal-roadmap-start-text {
  top: 2px;
  left: 5.5px;
}

.yg-reveal-roadmap-box {
  position: relative;
  display: flex;
  max-width: max-content;
}

.yg-reveal-roadmap-text {
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.5;
}

.yg-reveal-roadmap-end-text {
  top: 2px;
  left: 5.5px;
}

.yg-reveal-roadmap-info.left {
  left: 0;
}

.yg-reveal-roadmap-info.top {
  top: -40px;
}

.yg-reveal-roadmap-info.bottom {
  bottom: -40px;
}

.yg-reveal-roadmap-info.right {
  right: 0;
}

.yg-reveal-roadmap-wrapper.map1 .yg-reveal-roadmap-info.left {
  transform: translate(47px, 31px);
}

.yg-reveal-roadmap-wrapper.map1 .yg-reveal-roadmap-info.right {
  transform: translate(-40px, -36px);
}

.yg-reveal-roadmap-image {
  position: absolute;
  pointer-events: none;
  transform: scaleX(-1);
  transition: transform .1s linear;
}

.yg-car {
  width: 80px;
}

.yg-airplane,
.yg-airplane2 {
  width: 120px;
}

.yg-car-tooltip,
.yg-airplane-tooltip {
  font-size: 14px;
  position: absolute;
  padding: 4px 8px;
  transform: translate(-50%, -100%);
  white-space: nowrap;
  pointer-events: none;
  border-radius: 8px;
}

.yg-car-tooltip {
  background: rgba(255, 255, 255, 0.12);
}

.yg-airplane-tooltip {
  border-radius: 4px 18px;
  background: rgba(227, 37, 70, 0.80);
}

.yg-reveal-roadmap-tooltip {
  color: #fff;
  border-radius: 4px 18px;
  padding: 4px 12px;
  box-shadow: 0 4px 15.9px 0 rgba(0, 0, 0, 0.14);
}

.yg-reveal-slide-inner {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  aspect-ratio: 9 / 10;
  margin-inline: auto 0;
  margin-block: auto;
  border-radius: 14px;
  border: 1.5px solid #FFF;
  background: rgba(0, 0, 0, 0.20);
  backdrop-filter: blur(15px);
  max-width: max-content;
  min-width: 500px;
}

.yg-reveal-roadmap-map {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  max-width: max-content;
}

.yg-reveal-roadmap-map svg {
  width: 100%;
  height: auto;
}

.yg-reveal-roadmap-image {
  display: block;
  margin: 0;
  padding: 0;
  position: absolute;
  transform: translate(0, 0);
}

.yg-reveal-inner-bottom {
  display: flex;
  padding: 20px 16px;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  align-self: stretch;
  border-top: 1.5px solid rgba(255, 255, 255, 0.20);
}

.yg-reveal-inner-item {
  display: flex;
  align-items: center;
  gap: 16px;
  width: 45%;
}

.yg-reveal-inner-item img {
  max-width: 55px;
}

.yg-inner-divider {
  display: block;
  width: 1px;
  height: 40px;
  background: rgba(255, 255, 255, 0.20);
}

.yg-reveal-inner-label {
  color: rgba(255, 255, 255, 0.50);
  font-size: 16px;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0.32px;
}

.yg-reveal-inner-number {
  margin-left: 8px;
}

.yg-reveal-inner-label2 {
  color: #fff;
}

.yg-reveal-inner-unit {
  margin-left: -4px;
}

.yg-reveal-thumb-container {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding-block: 100px;
}

.yg-reveal-thumb-container .section {
  width: 100%;
  height: 100%;
}

yg-reveal-slide .yg-reveal-pagination {
  flex-direction: column;
  gap: 20px;
  margin-block: auto 0;
  position: relative;
  z-index: 1;
}

.yg-reveal-pagination-item {
  display: flex;
  gap: 36px;
  align-items: center;
}

.yg-reveal-thumb-content {
  display: flex;
  gap: 8px;
  align-items: center;
  color: var(--color);
  cursor: pointer;
}

.yg-reveal-thumb-content * {
  font-size: 24px;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0.48px;
}

.yg-reveal-thumb-progress {
  position: relative;
  width: 4px;
  height: 27px;
  background: rgba(255, 255, 255, 0.4);
  overflow: hidden;
  border-radius: 6px;
  opacity: 1;
  transition: opacity 0.4s ease;
}

.yg-reveal-thumb-progress-bar {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 0;
  background: var(--color);
  border-radius: 6px;
  transition: height 0s linear;
}

.yg-reveal-pagination-item {
  opacity: 0.5;
  transition: opacity 0.3s;
}

.yg-reveal-pagination-item.active {
  opacity: 1;
}

.yg-reveal-pagination-item:not(.active) .yg-reveal-thumb-progress {
  opacity: 0;
}

.yg-car-tooltip,
.yg-airplane-tooltip {
  transition: opacity 0.5s ease;
}

.yg-roadmap-1 {
  width: 230px;
}

@media (max-width: 767px) {
  .yg-reveal-slide-inner {
    min-width: 80%;
  }

  yg-reveal-roadmap svg {
    width: 80%;
  }

  .yg-reveal-inner-item {
    gap: 10px;
    width: 50%;
  }

  .yg-reveal-inner-item img {
    max-width: 35px;
  }

  .yg-reveal-inner-label {
    font-size: 12px;
  }

  .yg-reveal-inner-number {
    margin-left: 5px;
  }

  .yg-reveal-roadmap-container {
    min-width: 90vw;
  }

  .yg-reveal-roadmap-end-inner {
    transform: translate(-57px, -103px);
  }

  .yg-reveal-roadmap-start-inner {
    transform: translate(9px, 60px);
  }

  .yg-reveal-roadmap-wrapper.map1 .yg-reveal-roadmap-info.right {
    transform: translate(-70px, -66px);
  }

  .yg-airplane, .yg-airplane2 {
    width: 90px;
  }

  .yg-reveal-roadmap-box {
    width: 80%;
  }

  .yg-reveal-roadmap-wrapper {
    padding-block: 24px;
  }

  .yg-car {
    width: 60px;
  }

  .yg-reveal-roadmap-tooltip {
    padding-inline: 7px;
    border-radius: 2px 11px;
  }

  .yg-car-tooltip, .yg-airplane-tooltip {
    font-size: 12px;
  }

  .yg-reveal-slide-section .section {
    flex-direction: column;
  }

  yg-reveal-slide .yg-reveal-pagination {
    flex-direction: row;
    width: 100%;
  }

  .yg-reveal-thumb-content {
    justify-content: center;
  }

  .yg-reveal-pagination-item {
    flex: 1;
  }

  .yg-reveal-thumb-progress {
    width: 100%;
    height: 2px;
  }

  .yg-reveal-pagination-item:not(.active) .yg-reveal-thumb-progress {
    opacity: 1;
  }

  .yg-reveal-thumb-container, .yg-reveal-slide-section .section {
    padding-block: 48px;
  }
}


/* yg-reveal-slide */