.track1 {
  height: 100vh;
  position: relative;
  z-index: 1;
  background: linear-gradient(180deg, #F1AC27 0%, #F1BB40 24.12%, #FBEEAA 100%);
}
.track1:after {
  content: '';
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: 42px;
  width: 2164px;
  height: 2261px;
  border-radius: 2261px;
  background: radial-gradient(50% 50% at 50% 50%, #FFFCDB 0%, #FFFCD9 40.7%, rgba(249, 227, 143, 0) 100%);
  pointer-events: none;
}
.track1 .wrap {
  position: absolute;
  top: 207px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 5;
  color: #FFF;
  text-align: center;
  font-size: 46px;
  font-style: normal;
  font-weight: 600;
  text-transform: capitalize;
}
.track1 .bg {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 5;
}
.track1 .position {
  position: absolute;
  right: 60px;
  bottom: 40px;
  z-index: 5;
  width: 282px;
  height: 167px;
  border-radius: 14px;
  overflow: hidden;
}
.track1 .position img {
  width: 100%;
  height: 100%;
}
.track1 .position .play {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  width: 53px;
  height: 53px;
  background: rgba(255, 255, 255, 0.3);
  backdrop-filter: blur(5.0999999046px);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.track1 .position .play svg {
  width: 16px;
  height: 16px;
}

.track2 {
  height: calc(100vh + 1600px);

}
.track2 .bg_move{
  position: absolute;
  width: 100%;
  height: 100%;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-30%) scale(0.7);
  z-index: -1;
}
.track2 .bg_move .textImg{
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  transform: scale(0.4);
  opacity: 0;
}
.track2 .fix{
  aspect-ratio: 1920 / 960;
  position: sticky;
  top: 0;
  overflow: hidden;
  padding: 100px 0 0 0;
}

.track2 .wrap {
  width: 1395px;
  margin: auto;
}
.track2 .wrap .title {
  width: 1190px;
  margin: auto;
  color: #1A1A1A;
  text-align: center;
  font-size: 46px;
  font-style: normal;
  font-weight: 500;
  line-height: 121.739%;
  position: relative;
  z-index: 5;
}
.track2 .wrap .images{
  opacity: 0;
  display: none;
}
.track3 {
  background: linear-gradient(0deg, #000 0%, #000 100%), linear-gradient(180deg, #2F2F2F 0%, #373737 24.12%, #0C0C0C 100%), linear-gradient(172deg, #F1AC27 -2.81%, #FBEEAA 93.61%);
  position: relative;
  z-index: 1;
  height: 100vh;
}
.track3 .fix {
  height: 100vh;
  padding: 10vh 0 0 0;
  position: sticky;
  top: 0;
  overflow: hidden;
}
.track3 .images {
  position: absolute;
  width: 100%;
  height: 100%;
  bottom: 0;
  left: 0;
  z-index: -1;
  background: #000000;
}
.track3 .images .imagesSwiper {
  width: 100%;
  height: 100%;
}
.track3 .images .imagesSwiper .swiper-slide {
  display: flex;
  align-items: flex-end;
  justify-content: center;
}
.track3 .images .imagesSwiper .swiper-slide.swiper-slide-active img {
  opacity: 1;
}
.track3 .images .imagesSwiper .swiper-slide img {
  width: 100%;
  height: 100%;
  position: relative;
  bottom: -50px;
  opacity: 0;
  transition: 1s;
}
.track3 .wrap {
  width: 1167px;
  margin: auto;
  position: relative;
  z-index: 2;
}
.track3 .wrap .title {
  text-align: center;
}
.track3 .wrap .title .p1 {
  color: #FFF;
  font-size: 46px;
  font-style: normal;
  font-weight: 600;
  text-transform: capitalize;
}
.track3 .wrap .title .cut {
  margin: 54px auto 0;
  width: fit-content;
  height: 75px;
  border-radius: 37.5px;
  background: linear-gradient(90deg, #81817F 0%, #989898 100%), #FFF;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 85px;
  padding: 0 50px;
}
.track3 .wrap .title .cut .list {
  width: 42px;
  height: 42px;
  background: #1A1A1A;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #FFF;
  text-align: center;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  text-transform: capitalize;
  transition: .3s ease;
  cursor: pointer;
}
.track3 .wrap .title .cut .list.on {
  background: #FDD000;
  box-shadow: 0 0 16.8px #EEDA7F;
}

.track4 {
  position: relative;
  z-index: 1;
}
.track4:after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 1;
  width: 2164px;
  height: 2112px;
  border-radius: 2164px;
  background: radial-gradient(50% 50% at 50% 50%, #FFFCDB 0%, #FFFCD9 40.7%, rgba(249, 227, 143, 0) 100%);
  opacity: .9;
}
.track4 .matter {
  background: linear-gradient(180deg, #FFF 0%, #FDD000 100%);
  padding: 70px 0 93px;
  position: relative;
  z-index: 32;
}
.track4 .matter:nth-child(2) {
  background: #D9D9D9;
}
.track4 .matter .wrap {
  width: 1800px;
  margin: auto;
  position: relative;
  z-index: 5;
}
.track4 .matter .wrap .title {
  text-align: center;
  color: #1A1A1A;
  font-size: 46px;
  font-style: normal;
  font-weight: 600;
  text-transform: capitalize;
}
.track4 .matter .wrap .content {
  margin: 50px 0 0 0;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 40px;
}
.track4 .matter .wrap .content .item {
  width: 100%;
}
.track4 .matter .wrap .content .item .img {
  height: 580px;
  border-radius: 20px;
  background: #F8F9FB;
  position: relative;
  z-index: 1;
  overflow: hidden;
}
.track4 .matter .wrap .content .item .img .position {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 5;
  pointer-events: none;
}
.track4 .matter .wrap .content .item .img .position .point {
  position: absolute;
  pointer-events: auto;
}
.track4 .matter .wrap .content .item .img .position .point.right .hide {
  left: -20px;
  right: unset;
  padding: 0 20px 0 39px;
}
.track4 .matter .wrap .content .item .img .position .point .show {
  width: 9px;
  height: 9px;
  background: #FDD20A;
  border-radius: 50%;
  position: relative;
  z-index: 5;
}
.track4 .matter .wrap .content .item .img .position .point .hide {
  position: absolute;
  right: -20px;
  top: 50%;
  transform: translateY(-50%);
  white-space: nowrap;
  width: fit-content;
  height: 49px;
  padding: 0 39px 0 20px;
  border-radius: 24px;
  background: rgba(253, 218, 57, 0.17);
  backdrop-filter: blur(10px);
  display: flex;
  align-items: center;
  color: #1A1A1A;
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  text-transform: capitalize;
}
.track4 .matter .wrap .content .item .img .position .point1 {
  top: 370px;
  left: 320px;
}
.track4 .matter .wrap .content .item .img .position .point2 {
  top: 173px;
  left: 513px;
}
.track4 .matter .wrap .content .item .img .position .point3 {
  top: 298px;
  right: 320px;
}
.track4 .matter .wrap .content .item .img .position .point4 {
  top: 270px;
  left: 408px;
}
.track4 .matter .wrap .content .item .img .position .point5 {
  top: 152px;
  left: 326px;
}
.track4 .matter .wrap .content .item .img .position .point6 {
  top: 307px;
  left: 574px;
}
.track4 .matter .wrap .content .item .img .position2 {
  position: absolute;
  top: 94px;
  left: 29%;
  display: flex;
  align-items: flex-end;
  gap: 10px;
  white-space: nowrap;
}
.track4 .matter .wrap .content .item .img .position2 span {
  font-size: 200px;
  font-style: normal;
  font-weight: 400;
  line-height: 80%;
  text-transform: capitalize;
  background: linear-gradient(180deg, #FCD228, transparent);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.track4 .matter .wrap .content .item .img .position2 p {
  font-size: 60px;
  font-style: normal;
  font-weight: 600;
  line-height: 100%;
  text-transform: lowercase;
  background: linear-gradient(180deg, #FCD228, transparent);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.track4 .matter .wrap .content .item .img .label {
  position: absolute;
  right: 22px;
  bottom: 14px;
  z-index: 2;
  width: fit-content;
  height: 66px;
  border-radius: 12px;
  background: linear-gradient(270deg, #F2B539 0%, #F7D981 100%);
  padding: 0 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #FFF;
  font-size: 24px;
  font-style: normal;
  font-weight: 600;
  text-transform: capitalize;
}
.track4 .matter .wrap .content .item .img img {
  width: 100%;
  height: 100%;
}
.track4 .matter .wrap .content .item .text {
  width: 713px;
  color: #1A1A1A;
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 177.778%;
  text-transform: capitalize;
  margin: 33px 0 0 0;
}

.track5 {
  height: calc(100vh + 1500px);
  background: linear-gradient(180deg, #F5F1DB 0%, #FFF 100%);
}
.track5 .fix {
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  position: sticky;
  top: 0;
}
.track5 .fix .position_text {
  position: absolute;
  width: 100%;
  bottom: -32px;
  left: 0;
  text-align: center;
}
.track5 .fix .position_text .list {
  font-size: 240px;
  font-style: normal;
  font-weight: 400;
  line-height: 100%;
  text-transform: capitalize;
  opacity: 0.5;
  background: linear-gradient(181deg, #FCD228 -99.95%, #FBD029 16.84%, rgba(249, 203, 48, 0) 110.66%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  display: none;
}
.track5 .fix .position_text .list.on {
  display: block;
}
.track5 .fix .position_content {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 2;
  pointer-events: none;
}
.track5 .fix .position_content .item {
  position: absolute;
  width: 453px;
  border-radius: 28px;
  background: #FFF;
  padding: 44px 37px 56px 48px;
  pointer-events: auto;
  transform: translateY(20px);
  opacity: 0;
  transition: opacity .3s,transform .6s .3s;
}
.track5 .fix .position_content .item.on {
  opacity: 1;
  transform: translateY(0);
  transition-delay: .3s;
}
.track5 .fix .position_content .item .label {
  width: fit-content;
  padding: 0 23px;
  height: 48px;
  border-radius: 24.357px;
  background: #FDD000;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #1A1A1A;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  text-transform: capitalize;
}
.track5 .fix .position_content .item .pick {
  margin: 16px 0 0 0;
  color: #1A1A1A;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 200%;
  text-transform: capitalize;
}
.track5 .fix .position_content .item1 {
  right: 50px;
  top: 260px;
}
.track5 .fix .position_content .item2 {
  top: 487px;
  left: 64px;
}
.track5 .fix .position_content .item3 {
  top: 264px;
  right: 50px;
}
.track5 .fix .wrap .title {
  color: #1A1A1A;
  font-size: 46px;
  font-style: normal;
  font-weight: 600;
  text-transform: capitalize;
  text-align: center;
}
.track5 .fix .wrap .images {
  width: 1032px;
  margin: auto;
}
.track5 .fix .wrap .images .flexSwiper {
  width: 100%;
}
.track5 .fix .wrap .images .flexSwiper .swiper-slide {
  display: flex;
  align-items: center;
  justify-content: center;
}
.track5 .fix .wrap .images .flexSwiper .swiper-slide.swiper-slide-active img {
  opacity: 1;
}
.track5 .fix .wrap .images .flexSwiper .swiper-slide img {
  opacity: 0;
  transition: 1s;
}

.track6 {
  padding: 120px 0;
  background: #000;
}
.track6 .wrap {
  width: 1800px;
  margin: auto;
}
.track6 .wrap .up {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}
.track6 .wrap .up .l {
  width: 860px;
}
.track6 .wrap .up .l .p1 {
  color: #FFF;
  font-size: 48px;
  font-style: normal;
  font-weight: 500;
  text-transform: capitalize;
  margin: 0 0 29px;
}
.track6 .wrap .up .l .p2 {
  color: #FFF;
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  text-transform: capitalize;
}
.track6 .wrap .up .button {
  display: flex;
  gap: 10px;
}
.track6 .wrap .up .button .circle {
  width: 42px;
  height: 42px;
  border-radius: 10px;
  background: #FDD000;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.track6 .wrap .up .button .circle:first-child {
  transform: rotateY(180deg);
}
.track6 .wrap .up .button .circle img {
  object-fit: contain;
}
.track6 .wrap .content {
  margin: 64px 0 0 0;
}
.track6 .wrap .content .multSwiper {
  width: 2410px;
  margin: 0;
}
.track6 .wrap .content .multSwiper .swiper-slide .item {
  width: 100%;
  height: 537px;
  border-radius: 24px;
  background: linear-gradient(0deg, #F8F9FB 0%, #F8F9FB 100%), linear-gradient(180deg, #FFF9E9 0%, #FCF6E8 100%), linear-gradient(28deg, #F4C354 17.5%, #FFFCD9 92.16%), linear-gradient(0deg, #F9F9F9 0%, #F9F9F9 100%), linear-gradient(180deg, #F5F1DB 0%, #FFF 100%);
  overflow: hidden;
  padding: 25px 29px;
}
.track6 .wrap .content .multSwiper .swiper-slide .item .label {
  width: fit-content;
  height: 66px;
  border-radius: 12px;
  background: #FDD000;
  padding: 0 22px;
  z-index: 5;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #1A1A1A;
  font-size: 24px;
  font-style: normal;
  font-weight: 500;
  text-transform: capitalize;
}
.track6 .wrap .content .multSwiper .swiper-slide .item .img {
  width: fit-content;
  margin: 49px 0 0;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
}
.track6 .wrap .content .multSwiper .swiper-slide .item .img img {
  max-width: unset;
  max-height: unset;
}

.track7 {
  border-radius: 20px;
  background: linear-gradient(180deg, #F5F1DB 0%, #FFF 100%);
  margin-top: -20px;
  position: relative;
  z-index: 2;
  padding: 54px 0 36px;
}
.track7 .wrap {
  width: 1800px;
  margin: auto;
  display: flex;
  justify-content: space-between;
}
.track7 .wrap .side {
  width: 430px;
  height: fit-content;
  border-radius: 10px;
  background: #FFF;
  padding: 21px 10px 14px 10px;
}
.track7 .wrap .side .headline {
  color: #1A1A1A;
  font-size: 42px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  text-transform: capitalize;
  padding: 0 0 0 19px;
}
.track7 .wrap .side .flex {
  margin: 22px 0 0 0;
}
.track7 .wrap .side .flex .list {
  display: flex;
  justify-content: space-between;
  padding: 20px 35px 0 20px;
  border-radius: 10px;
  border: 1px solid #F5F5F5;
  background: #F8F8F8;
  width: 100%;
  height: 110px;
  transition: .6s ease;
  cursor: pointer;
}
.track7 .wrap .side .flex .list:hover .pick {
  color: var(--color);
}
.track7 .wrap .side .flex .list.on {
  background: var(--color);
}
.track7 .wrap .side .flex .list.on .pick {
  color: #1A1A1A;
}
.track7 .wrap .side .flex .list.on img {
  transform: rotate(45deg);
}
.track7 .wrap .side .flex .list:not(:last-child) {
  margin: 0 0 18px;
}
.track7 .wrap .side .flex .list .pick {
  color: #1A1A1A;
  font-size: 18px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
  text-transform: uppercase;
  transition: .6s ease;
}
.track7 .wrap .side .flex .list img {
  width: 27px;
  height: 27px;
  object-fit: contain;
  transition: .6s ease;
}
.track7 .wrap .r {
  width: 1332px;
}
.track7 .wrap .r .matter {
  display: none;
}
.track7 .wrap .r .matter.on {
  display: block;
}
.track7 .wrap .r .matter .grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
}
.track7 .wrap .r .matter .grid .item {
  width: 100%;
  height: 440px;
  border-radius: 10px;
  background: #FFF;
  padding: 30px 58px 70px 55px;
  cursor: pointer;
}
.track7 .wrap .r .matter .grid .item:hover .up .text .p1 {
  color: var(--color);
}
.track7 .wrap .r .matter .grid .item:hover .img img {
  transform: scale(1.05);
}
.track7 .wrap .r .matter .grid .item .up {
  display: flex;
  justify-content: space-between;
}
.track7 .wrap .r .matter .grid .item .up .text {
  margin: 10px 0 0;
}
.track7 .wrap .r .matter .grid .item .up .text .p1 {
  color: #1A1A1A;
  font-size: 24px;
  font-style: normal;
  font-weight: 500;
  text-transform: capitalize;
  transition: .6s ease;
}
.track7 .wrap .r .matter .grid .item .up .text .p2 {
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 30px;
  text-transform: capitalize;
}
.track7 .wrap .r .matter .grid .item .up .num {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: #FDD000;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #000;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  text-transform: capitalize;
}
.track7 .wrap .r .matter .grid .item .img {
  width: 400px;
  height: 275px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 25px auto 0;
}
.track7 .wrap .r .matter .grid .item .img img {
  object-fit: contain;
  transition: .6s ease;
}

.track8 {
  padding: 106px 0;
}
.track8 .wrap {
  width: 1800px;
  margin: auto;
}
.track8 .wrap .title {
  text-align: center;
  color: #1A1A1A;
  font-size: 56px;
  font-style: normal;
  font-weight: 600;
  line-height: 121.429%;
  text-transform: uppercase;
  position: sticky;
  top: 150px;
}
.track8 .wrap .content {
  margin: 60px 0 0 0;
}
.track8 .wrap .content .item {
  display: flex;
  justify-content: space-between;
  padding: 60px 0;
  border-top: 1px solid #DDD;
  background: #fff;
  position: sticky;
  top: 278px;
}
.track8 .wrap .content .item .l {
  width: 750px;
}
.track8 .wrap .content .item .l .p1 {
  color: #1A1A1A;
  font-size: 36px;
  font-style: normal;
  font-weight: 600;
  line-height: 155.556%;
  /* 155.556% */
  text-transform: capitalize;
}
.track8 .wrap .content .item .l .p2 {
  color: #666;
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 144.444%;
  /* 144.444% */
  text-transform: capitalize;
  margin: 85px 0 70px 0;
}
.track8 .wrap .content .item .l .p2 b {
  color: #1A1A1A;
}
.track8 .wrap .content .item .l .common_more .jt img {
  width: 22px;
  position: relative;
  top: -2px;
  left: 1px;
}
.track8 .wrap .content .item .images {
  width: 896px;
  height: 520px;
  border-radius: 10px;
  overflow: hidden;
}
.track8 .wrap .content .item .images:hover img{
  transform: scale(1.05);
}
.track8 .wrap .content .item .images img {
  width: 100%;
  height: 100%;
  transition: 1s;
}

.common_more .read{
  min-width: 120px;
}

@media screen and (max-width: 1919px) {
  .common_more .read{
    min-width: 6.25vw;
  }
  .track1::after{
    top: 2.1875vw;
    width: 112.7083333333vw;
    height: 117.7604166667vw;
    border-radius: 117.7604166667vw;
  }
  .track1 .wrap{
    top: 10.78125vw;
    font-size: 2.3958333333vw;
  }
  .track1 .position{
    right: 3.125vw;
    bottom: 2.0833333333vw;
    width: 14.6875vw;
    height: 8.6979166667vw;
    border-radius: 0.7291666667vw;
  }
  .track1 .position .play{
    width: 2.7604166667vw;
    height: 2.7604166667vw;
    backdrop-filter: blur(0.265625vw);
  }
  .track1 .position .play svg{
    width: 0.8333333333vw;
    height: 0.8333333333vw;
  }
  .track2 .fix{
    padding: 5.2083333333vw 0px 0px;
  }
  .track2 .wrap{
    width: 72.65625vw;
  }
  .track2 .wrap .title{
    width: 61.9791666667vw;
    font-size: 2.3958333333vw;
  }
  .track3 .images .imagesSwiper .swiper-slide img{
    bottom: -2.6041666667vw;
  }
  .track3 .wrap{
    width: 60.78125vw;
  }
  .track3 .wrap .title .p1{
    font-size: 2.3958333333vw;
  }
  .track3 .wrap .title .cut{
    margin: 2.8125vw auto 0px;
    height: 3.90625vw;
    border-radius: 1.953125vw;
    gap: 4.4270833333vw;
    padding: 0px 2.6041666667vw;
  }
  .track3 .wrap .title .cut .list{
    width: 2.1875vw;
    height: 2.1875vw;
    font-size: 0.8333333333vw;
  }
  .track3 .wrap .title .cut .list.on{
    box-shadow: rgb(238, 218, 127) 0px 0px 0.875vw;
  }
  .track4::after{
    width: 112.7083333333vw;
    height: 110vw;
    border-radius: 112.7083333333vw;
  }
  .track4 .matter{
    padding: 3.6458333333vw 0px 4.84375vw;
  }
  .track4 .matter .wrap{
    width: 93.75vw;
  }
  .track4 .matter .wrap .title{
    font-size: 2.3958333333vw;
  }
  .track4 .matter .wrap .content{
    margin: 2.6041666667vw 0px 0px;
    gap: 2.0833333333vw;
  }
  .track4 .matter .wrap .content .item .img{
    height: 30.2083333333vw;
    border-radius: 1.0416666667vw;
  }
  .track4 .matter .wrap .content .item .img .position .point.right .hide{
    left: -1.0416666667vw;
    padding: 0px 1.0416666667vw 0px 2.03125vw;
  }
  .track4 .matter .wrap .content .item .img .position .point .show{
    width: 0.46875vw;
    height: 0.46875vw;
  }
  .track4 .matter .wrap .content .item .img .position .point .hide{
    right: -1.0416666667vw;
    height: 2.5520833333vw;
    padding: 0px 2.03125vw 0px 1.0416666667vw;
    border-radius: 1.25vw;
    backdrop-filter: blur(0.5208333333vw);
    font-size: 0.9375vw;
  }
  .track4 .matter .wrap .content .item .img .position .point1{
    top: 19.2708333333vw;
    left: 16.6666666667vw;
  }
  .track4 .matter .wrap .content .item .img .position .point2{
    top: 9.0104166667vw;
    left: 26.71875vw;
  }
  .track4 .matter .wrap .content .item .img .position .point3{
    top: 15.5208333333vw;
    right: 16.6666666667vw;
  }
  .track4 .matter .wrap .content .item .img .position .point4{
    top: 14.0625vw;
    left: 21.25vw;
  }
  .track4 .matter .wrap .content .item .img .position .point5{
    top: 7.9166666667vw;
    left: 16.9791666667vw;
  }
  .track4 .matter .wrap .content .item .img .position .point6{
    top: 15.9895833333vw;
    left: 29.8958333333vw;
  }
  .track4 .matter .wrap .content .item .img .position2{
    top: 4.8958333333vw;
    gap: 0.5208333333vw;
  }
  .track4 .matter .wrap .content .item .img .position2 span{
    font-size: 10.4166666667vw;
  }
  .track4 .matter .wrap .content .item .img .position2 p{
    font-size: 3.125vw;
  }
  .track4 .matter .wrap .content .item .img .label{
    right: 1.1458333333vw;
    bottom: 0.7291666667vw;
    height: 3.4375vw;
    border-radius: 0.625vw;
    padding: 0px 1.5625vw;
    font-size: 1.25vw;
  }
  .track4 .matter .wrap .content .item .text{
    width: 37.1354166667vw;
    font-size: 0.9375vw;
    margin: 1.71875vw 0px 0px;
  }
  .track5{
    height: calc(78.125vw + 100vh);
  }
  .track5 .fix .position_text{
    bottom: -1.6666666667vw;
  }
  .track5 .fix .position_text .list{
    font-size: 12.5vw;
  }
  .track5 .fix .position_content .item{
    width: 23.59375vw;
    border-radius: 1.4583333333vw;
    padding: 2.2916666667vw 1.9270833333vw 2.9166666667vw 2.5vw;
    transform: translateY(1.0416666667vw);
  }
  .track5 .fix .position_content .item .label{
    padding: 0px 1.1979166667vw;
    height: 2.5vw;
    border-radius: 1.26859375vw;
    font-size: 0.8333333333vw;
  }
  .track5 .fix .position_content .item .pick{
    margin: 0.8333333333vw 0px 0px;
    font-size: 0.8333333333vw;
  }
  .track5 .fix .position_content .item1{
    right: 2.6041666667vw;
    top: 13.5416666667vw;
  }
  .track5 .fix .position_content .item2{
    top: 25.3645833333vw;
    left: 3.3333333333vw;
  }
  .track5 .fix .position_content .item3{
    top: 13.75vw;
    right: 2.6041666667vw;
  }
  .track5 .fix .wrap .title{
    font-size: 2.3958333333vw;
  }
  .track5 .fix .wrap .images{
    width: 53.75vw;
  }
  .track6{
    padding: 6.25vw 0px;
  }
  .track6 .wrap{
    width: 93.75vw;
  }
  .track6 .wrap .up .l{
    width: 44.7916666667vw;
  }
  .track6 .wrap .up .l .p1{
    font-size: 2.5vw;
    margin: 0px 0px 1.5104166667vw;
  }
  .track6 .wrap .up .l .p2{
    font-size: 0.9375vw;
  }
  .track6 .wrap .up .button{
    gap: 0.5208333333vw;
  }
  .track6 .wrap .up .button .circle{
    width: 2.1875vw;
    height: 2.1875vw;
    border-radius: 0.5208333333vw;
  }
  .track6 .wrap .content{
    margin: 3.3333333333vw 0px 0px;
  }
  .track6 .wrap .content .multSwiper{
    width: 125.5208333333vw;
  }
  .track6 .wrap .content .multSwiper .swiper-slide .item{
    height: 27.96875vw;
    border-radius: 1.25vw;
    padding: 1.3020833333vw 1.5104166667vw;
  }
  .track6 .wrap .content .multSwiper .swiper-slide .item .label{
    height: 3.4375vw;
    border-radius: 0.625vw;
    padding: 0px 1.1458333333vw;
    font-size: 1.25vw;
  }
  .track6 .wrap .content .multSwiper .swiper-slide .item .img{
    margin: 2.5520833333vw 0px 0px;
  }
  .track7{
    border-radius: 1.0416666667vw;
    margin-top: -1.0416666667vw;
    padding: 2.8125vw 0px 1.875vw;
  }
  .track7 .wrap{
    width: 93.75vw;
  }
  .track7 .wrap .side{
    width: 22.3958333333vw;
    border-radius: 0.5208333333vw;
    padding: 1.09375vw 0.5208333333vw 0.7291666667vw;
  }
  .track7 .wrap .side .headline{
    font-size: 2.1875vw;
    padding: 0px 0px 0px 0.9895833333vw;
  }
  .track7 .wrap .side .flex{
    margin: 1.1458333333vw 0px 0px;
  }
  .track7 .wrap .side .flex .list{
    padding: 1.0416666667vw 1.8229166667vw 0px 1.0416666667vw;
    border-radius: 0.5208333333vw;
    height: 5.7291666667vw;
  }
  .track7 .wrap .side .flex .list:not(:last-child){
    margin: 0px 0px 0.9375vw;
  }
  .track7 .wrap .side .flex .list .pick{
    font-size: 0.9375vw;
  }
  .track7 .wrap .side .flex .list img{
    width: 1.40625vw;
    height: 1.40625vw;
  }
  .track7 .wrap .r{
    width: 69.375vw;
  }
  .track7 .wrap .r .matter .grid{
    gap: 0.5208333333vw;
  }
  .track7 .wrap .r .matter .grid .item{
    height: 22.9166666667vw;
    border-radius: 0.5208333333vw;
    padding: 1.5625vw 3.0208333333vw 3.6458333333vw 2.8645833333vw;
  }
  .track7 .wrap .r .matter .grid .item .up .text{
    margin: 0.5208333333vw 0px 0px;
  }
  .track7 .wrap .r .matter .grid .item .up .text .p1{
    font-size: 1.25vw;
  }
  .track7 .wrap .r .matter .grid .item .up .text .p2{
    font-size: 0.9375vw;
    line-height: 1.5625vw;
  }
  .track7 .wrap .r .matter .grid .item .up .num{
    width: 2.7083333333vw;
    height: 2.7083333333vw;
    font-size: 1.0416666667vw;
  }
  .track7 .wrap .r .matter .grid .item .img{
    width: 20.8333333333vw;
    height: 14.3229166667vw;
    margin: 1.3020833333vw auto 0px;
  }
  .track8{
    padding: 5.5208333333vw 0px;
  }
  .track8 .wrap{
    width: 93.75vw;
  }
  .track8 .wrap .title{
    font-size: 2.9166666667vw;
    top: 7.8125vw;
  }
  .track8 .wrap .content{
    margin: 3.125vw 0px 0px;
  }
  .track8 .wrap .content .item{
    padding: 3.125vw 0px;
    top: 14.4791666667vw;
  }
  .track8 .wrap .content .item .l{
    width: 39.0625vw;
  }
  .track8 .wrap .content .item .l .p1{
    font-size: 1.875vw;
  }
  .track8 .wrap .content .item .l .p2{
    font-size: 0.9375vw;
    margin: 4.4270833333vw 0px 3.6458333333vw;
  }
  .track8 .wrap .content .item .l .common_more .jt img{
    width: 1.1458333333vw;
    top: -0.1041666667vw;
  }
  .track8 .wrap .content .item .images{
    width: 46.6666666667vw;
    height: 27.0833333333vw;
    border-radius: 0.5208333333vw;
  }
}


/* ===== Responsive: track1–track8 ===== */
@media screen and (max-width: 1024px) {
  .common_more .read{
    min-width: 100px;
  }

  /* ---------- track1 ---------- */
  .track1 {
    height: auto;
    min-height: 100vh;
    padding: 60px 0 40px;
  }
  .track1:after {
    width: 160vw;
    height: 160vw;
    border-radius: 160vw;
    top: 2vw;
  }
  .track1 .wrap {
    top: 100px;
    width: 90%;
    font-size: 24px;
  }

  .track1 .bg {
    width: 100%;
    transform: translate(-50%, -50%) scale(1.4);
  }
  .track1 .position {
    right: 20px;
    bottom: 20px;
    width: 180px;
    height: 107px;
    border-radius: 10px;
  }
  .track1 .position .play {
    width: 36px;
    height: 36px;
  }
  .track1 .position .play svg {
    width: 12px;
    height: 12px;
  }

  /* ---------- track2 ---------- */
  .track2 {
    height: auto;
  }
  .track2 .bg_move {
    transform: translate(-50%, -30%) scale(0.5);
    display: none;
  }
  .track2 .bg_move .textImg {
    transform: scale(0.3);
  }
  .track2 .fix {
    padding: 60px 0;
    position: relative;
    top: auto;
    aspect-ratio: unset;
    width: 100%;
  }

  .track2 .wrap {
    width: 90%;
  }
  .track2 .wrap .title {
    width: 100%;
    font-size: 18px;
  }


  .track2 .wrap .title br{
    display: none;
  }

  .track2 .wrap .sj_img{
    width: 100%;
    margin: 40px 0 0 0;
  }

  .track2 .wrap .sj_img.white{
    display: block!important;
  }


  /* ---------- track3 ---------- */
  .track3 {
    height: auto;
    min-height: 100vh;
  }
  .track3 .fix {
    height: auto;
    min-height: 100vh;
    padding: 40px 0;
    position: relative;
    top: auto;
  }
  .track3 .wrap {
    width: 90%;
  }
  .track3 .wrap .title .p1 {
    font-size: 24px;
  }
  .track3 .wrap .title .cut {
    margin-top: 24px;
    height: 48px;
    border-radius: 24px;
    gap: 30px;
    padding: 0 20px;
  }
  .track3 .wrap .title .cut .list {
    width: 32px;
    height: 32px;
    font-size: 13px;
  }

  /* ---------- track4 ---------- */
  .track4:after {
    width: 160vw;
    height: 150vw;
    border-radius: 160vw;
  }
  .track4 .matter {
    padding: 30px 0 40px;
  }
  .track4 .matter .wrap {
    width: 90%;
  }
  .track4 .matter .wrap .title {
    font-size: 24px;
  }
  .track4 .matter .wrap .content {
    margin-top: 24px;
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .track4 .matter .wrap .content .item .img {
    height: 260px;
    border-radius: 14px;
  }
  .track4 .matter .wrap .content .item .img .position .point .show {
    width: 7px;
    height: 7px;
  }
  .track4 .matter .wrap .content .item .img .position .point .hide {
    height: 35px;
    padding: 0 14px 0 10px;
    border-radius: 17px;
    font-size: 8px;
  }
  .track4 .matter .wrap .content .item .img .position .point.right .hide {
    left: -9px;
    padding: 0 14px 0 20px;
  }
  .track4 .matter .wrap .content .item .img .position .point1 { top: 160px; left: 140px; }
  .track4 .matter .wrap .content .item .img .position .point2 { top: 80px; left: 220px; }
  .track4 .matter .wrap .content .item .img .position .point3 { top: 130px; right: 140px; }
  .track4 .matter .wrap .content .item .img .position .point4 { top: 120px; left: 180px; }
  .track4 .matter .wrap .content .item .img .position .point5 { top: 70px; left: 140px; }
  .track4 .matter .wrap .content .item .img .position .point6 { top: 135px; left: 207px; }
  .track4 .matter .wrap .content .item .img .position2 {
    top: 20px;
    left: 15%;
    gap: 6px;
  }
  .track4 .matter .wrap .content .item .img .position2 span {
    font-size: 50px;
  }
  .track4 .matter .wrap .content .item .img .position2 p {
    font-size: 20px;
  }

  .track4 .matter .wrap .content .item .img .label {
    right: 10px;
    bottom: 10px;
    height: 40px;
    border-radius: 8px;
    padding: 0 16px;
    font-size: 14px;
  }
  .track4 .matter .wrap .content .item .text {
    width: 100%;
    font-size: 14px;
    margin-top: 16px;
    line-height: 170%;
  }

  /* ---------- track5 ---------- */
  .track5 {
    height: auto;
    background: #F5F1DB ;
  }
  .track5 .fix {
    height: auto;
    min-height: 100vh;
    position: relative;
    top: auto;
    padding: 40px 0;
    flex-direction: column;
  }
  .track5 .fix .position_text {
    display: none;
  }
  .track5 .fix .wrap{
    width: 90%;
  }
  .track5 .fix .position_text .list {
    font-size: 100px;
  }
  .track5 .fix .position_content {
    position: relative;
    pointer-events: auto;
  }
  .track5 .fix .position_content .item {
    position: relative;
    width: 90%;
    margin: 16px auto;
    right: auto !important;
    left: auto !important;
    top: auto !important;
    border-radius: 16px;
    padding: 24px 20px 28px;
    opacity: 1;
    transform: none;
  }
  .track5 .fix .position_content .item .sj_img{
    display: block!important;
    width: 100%;
    margin: 0 0 20px;
  }
  .track5 .fix .position_content .item .label {
    font-size: 13px;
    height: 36px;
    padding: 0 16px;
    border-radius: 18px;
  }
  .track5 .fix .position_content .item .pick {
    margin-top: 10px;
    font-size: 13px;
    line-height: 180%;
  }
  .track5 .fix .wrap .title {
    font-size: 24px;
  }
  .track5 .fix .wrap .images {
    width: 90%;
    display: none;
  }

  /* ---------- track6 ---------- */
  .track6 {
    padding: 60px 0 80px;
  }
  .track6 .wrap {
    width: 90%;
  }
  .track6 .wrap .up {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }
  .track6 .wrap .up .l {
    width: 100%;
  }
  .track6 .wrap .up .l .p1 {
    font-size: 24px;
    margin-bottom: 12px;
  }
  .track6 .wrap .up .l .p2 {
    font-size: 14px;
  }
  .track6 .wrap .up .button .circle {
    width: 36px;
    height: 36px;
    border-radius: 8px;
  }
  .track6 .wrap .content {
    margin-top: 24px;
  }
  .track6 .wrap .up .button{
    gap: 6px;
  }
  .track6 .wrap .content .multSwiper {
    width: 155vw;
  }
  .track6 .wrap .content .multSwiper .swiper-slide .item {
    height: 280px;
    border-radius: 14px;
    padding: 16px;
  }
  .track6 .wrap .content .multSwiper .swiper-slide .item .label {
    height: 40px;
    border-radius: 8px;
    padding: 0 10px;
    font-size: 12px;
  }
  .track6 .wrap .content .multSwiper .swiper-slide .item .img {
    margin-top: 20px;
  }

  /* ---------- track7 ---------- */
  .track7 {
    border-radius: 14px;
    margin-top: -14px;
    padding: 30px 0 24px;
  }
  .track7 .wrap {
    width: 90%;
    flex-direction: column;
    gap: 24px;
  }
  .track7 .wrap .side {
    width: 100%;
    padding: 16px 8px 12px;
    border-radius: 8px;
  }
  .track7 .wrap .side .headline {
    font-size: 22px;
    padding-left: 12px;
  }
  .track7 .wrap .side .flex {
    margin-top: 14px;
    display: flex;
    overflow-x: auto;
    gap: 10px;
    -webkit-overflow-scrolling: touch;
  }
  .track7 .wrap .side .flex .list {
    flex-shrink: 0;
    width: auto;
    min-width: 160px;
    height: 60px;
    padding: 12px 20px 0 14px;
    border-radius: 8px;
  }
  .track7 .wrap .side .flex .list:not(:last-child) {
    margin: 0;
  }
  .track7 .wrap .side .flex .list .pick {
    font-size: 13px;
  }
  .track7 .wrap .side .flex .list img {
    width: 20px;
    height: 20px;
  }
  .track7 .wrap .r {
    width: 100%;
  }
  .track7 .wrap .r .matter .grid {
    grid-template-columns: 1fr;
    gap: 15px;
  }
  .track7 .wrap .r .matter .grid .item {
    height: auto;
    border-radius: 8px;
    padding: 20px;
  }
  .track7 .wrap .r .matter .grid .item .up{
    gap: 15px;
  }
  .track7 .wrap .r .matter .grid .item .up .text {
    margin-top: 4px;
    flex: 1;
  }
  .track7 .wrap .r .matter .grid .item .up .text .p1 {
    font-size: 16px;
  }
  .track7 .wrap .r .matter .grid .item .up .text .p2 {
    font-size: 13px;
    line-height: 150%;
  }
  .track7 .wrap .r .matter .grid .item .up .num {
    width: 36px;
    height: 36px;
    font-size: 14px;
  }
  .track7 .wrap .r .matter .grid .item .img {
    width: 100%;
    max-width: 300px;
    height: 180px;
    margin: 16px auto 0;
  }

  /* ---------- track8 ---------- */
  .track8 {
    padding: 40px 0;
  }
  .track8 .wrap {
    width: 90%;
  }
  .track8 .wrap .title {
    font-size: 24px;
    position: relative;
    top: auto;
  }
  .track8 .wrap .content {
    margin-top: 24px;
  }
  .track8 .wrap .content .item {
    flex-direction: column-reverse;
    gap: 20px;
    padding: 30px 0;
    position: relative;
    top: auto;
  }
  .track8 .wrap .content .item .l {
    width: 100%;
  }
  .track8 .wrap .content .item .l .p1 {
    font-size: 18px;
    line-height: 150%;
  }
  .track8 .wrap .content .item .l .p2 {
    font-size: 13px;
    margin: 16px 0;
    line-height: 160%;
  }
  .track8 .wrap .content .item .l .common_more .jt img {
    width: 18px;
    top: -1px;
  }
  .track8 .wrap .content .item .images {
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    border-radius: 8px;
  }
}