@media screen and (min-width: 768px) {
  #b07-section {
    width: 100vw;
    height: 100vh;
    position: relative;
  }
  #b07-section .sticky-container {
    position: sticky;
    top: 0;
    width: 100vw;
    height: 100vh;
  }
  #b07-section .text-container {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 100;
    color: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    z-index: 10000;
    padding-top: 6.25vw;
    padding-left: 5.8333333333vw;
    font-size: 1.875vw;
    line-height: 2.8125vw;
    font-weight: lighter;
    -webkit-transition: 0.2s all;
    transition: 0.2s all;
    pointer-events: none;
  }
  #b07-section .text-container span {
    font-size: 2.6041666667vw;
    font-weight: bolder;
    margin-bottom: 1.0416666667vw;
  }
  #b07-section .text-container > div {
    display: none;
  }
  #b07-section .mySwiper {
    width: 100vw;
    height: 100vh;
    -webkit-transition: background 0.2s;
    transition: background 0.2s;
  }
  #b07-section .mySwiper .bg-img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    -o-object-fit: cover;
    object-fit: cover;
  }
  #b07-section .mySwiper .text-slide-container {
    position: absolute;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
  #b07-section .mySwiper .text-slide-container > div {
    height: 100vh;
    width: 25vw;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    color: #fff;
    position: relative;
  }
  #b07-section .mySwiper .text-slide-container div:hover div.cover {
    top: 0;
  }
  #b07-section .mySwiper .text-slide-container div:hover span {
    opacity: 1;
  }
  #b07-section .mySwiper .text-slide-container div:nth-child(1):hover .text-container-0 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
  #b07-section .mySwiper .text-slide-container div:nth-child(2):hover .text-container-1 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
  #b07-section .mySwiper .text-slide-container div:nth-child(3):hover .text-container-2 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
  #b07-section .mySwiper .text-slide-container div:nth-child(4):hover .text-container-3 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
  #b07-section .mySwiper .text-slide-container div:nth-child(5):hover .text-container-4 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
  #b07-section .mySwiper .text-slide-container div div.cover {
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    height: 100%;
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(4, 52, 145, 0)), to(rgba(4, 52, 145, 0.45)));
    background: linear-gradient(180deg, rgba(4, 52, 145, 0) calc(100vh - 20.0520833333vw), rgba(4, 52, 145, 0.45) 100%);
  }
  #b07-section .mySwiper .text-slide-container div img {
    width: 3.75vw;
    margin-bottom: 1.25vw;
    z-index: 2;
  }
  #b07-section .mySwiper .text-slide-container div p {
    font-size: 1.875vw;
    line-height: 2.96875vw;
    margin-bottom: 4.1666666667vw;
    z-index: 2;
  }
  #b07-section .mySwiper .text-slide-container div span {
    opacity: 0;
    font-size: 1.25vw;
    line-height: 1.875vw;
    margin-bottom: 4.1666666667vw;
    z-index: 2;
    font-weight: lighter;
  }
  #b07-section .mySwiper .swiper-slide {
    width: 100vw;
    height: 100vh;
  }
  #b07-section .mySwiper .swiper-slide div {
    height: 100vh;
    width: 25vw;
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(4, 52, 145, 0)), to(rgba(4, 52, 145, 0.45)));
    background: linear-gradient(180deg, rgba(4, 52, 145, 0) calc(100vh - 20.0520833333vw), rgba(4, 52, 145, 0.45) 100%);
  }
  #b07-section .mySwiper .swiper-slide.slide-2 div {
    border-left: none;
  }
  #b07-section .mySwiper .swiper-slide.slide-2 div {
    margin-left: 25vw;
  }
  #b07-section .mySwiper .swiper-slide.slide-3 div {
    margin-left: 40vw;
  }
  #b07-section .mySwiper .swiper-slide.slide-4 div {
    margin-left: 60vw;
  }
  #b07-section .mySwiper .swiper-slide.slide-5 div {
    margin-left: 80vw;
  }
}
/* mob */
@media screen and (max-width: 767.98px) {
  #b07-section {
    width: 100vw;
    height: 100vh;
  }
  #b07-section .my-mob-swiper {
    width: 100vw;
    height: 100vh;
    -webkit-transition: background 0.2s;
    transition: background 0.2s;
  }
  #b07-section .my-mob-swiper .bg-img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    -o-object-fit: cover;
    object-fit: cover;
  }
  #b07-section .my-mob-swiper .text-slide-container {
    position: absolute;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
  #b07-section .my-mob-swiper .text-slide-container div {
    height: 100vh;
    width: 20vw;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    color: #fff;
  }
  #b07-section .my-mob-swiper .text-slide-container div img {
    width: 9.6vw;
    margin-bottom: 3.2vw;
    z-index: 2;
  }
  #b07-section .my-mob-swiper .text-slide-container div p {
    font-size: 4.8vw;
    line-height: 7.6vw;
    margin-bottom: 1.7333333333vw;
    z-index: 2;
  }
  #b07-section .my-mob-swiper .text-slide-container div span {
    opacity: 0;
    font-size: 3.2vw;
    line-height: 4.8vw;
    margin-bottom: 10.6666666667vw;
    z-index: 2;
  }
  #b07-section .my-mob-swiper .text-slide-container div.active span {
    opacity: 1;
  }
  #b07-section .my-mob-swiper .swiper-slide {
    width: 100vw;
    height: 100vh;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
  }
  #b07-section .my-mob-swiper .swiper-slide div:first-of-type {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: inline-block;
    width: 100vw;
    max-width: 100vw;
    padding: 36vw 5.3333333333vw 0;
    font-size: 4.8vw;
    line-height: 7.4666666667vw;
    color: #fff;
  }
  #b07-section .my-mob-swiper .swiper-slide div:last-of-type {
    color: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }
  #b07-section .my-mob-swiper .swiper-slide div:last-of-type img {
    width: 10.9333333333vw;
    margin-bottom: 6.4vw;
  }
  #b07-section .my-mob-swiper .swiper-slide div:last-of-type p {
    font-size: 6.4vw;
    line-height: 9.6vw;
    letter-spacing: 0.5333333333vw;
    margin-bottom: 21.3333333333vw;
    font-weight: bold;
  }
  #b07-section .my-mob-swiper .swiper-slide div:last-of-type span {
    font-size: 4.8vw;
    line-height: 7.4666666667vw;
    margin-bottom: 21.3333333333vw;
  }
  #b07-section .my-mob-swiper .swiper-button-next,
  #b07-section .my-mob-swiper .swiper-button-prev {
    width: 4.8vw;
    height: 4.8vw;
    bottom: 37.0666666667vw;
    top: unset;
  }
  #b07-section .my-mob-swiper .swiper-button-next::after {
    content: "";
    width: 9.6vw;
    height: 9.6vw;
    background: url("/etc.clientlibs/denza-site/clientlibs/clientlib-public/resources/svg/right.svg") center center no-repeat;
    background-size: 100% auto;
  }
  #b07-section .my-mob-swiper .swiper-button-prev::after {
    content: "";
    width: 9.6vw;
    height: 9.6vw;
    background: url("/etc.clientlibs/denza-site/clientlibs/clientlib-public/resources/svg/left.svg") center center no-repeat;
    background-size: 100% auto;
  }
  .my-mob-swiper {
    position: relative;
  }
  .my-mob-swiper .bg-title {
    margin-bottom: 13.3333333333vw;
    color: #FFFFFF;
    text-align: center;
    position: absolute;
    top: 15vw;
    width: 90%;
    left: 50%;
    z-index: 5;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
  }
  .my-mob-swiper .bg-title .big-title {
    font-size: 8.5333333333vw;
    font-weight: 600;
    margin-bottom: 5.3333333333vw;
  }
  .my-mob-swiper .bg-title .sub-title {
    font-size: 4.2666666667vw;
  }
}
#b07-section .fade-enter-active {
  -webkit-transition: opacity 0.8s cubic-bezier(0.5, 0, 0, 0.75);
  transition: opacity 0.8s cubic-bezier(0.5, 0, 0, 0.75);
}
#b07-section .fade-enter-from,
#b07-section .fade-leave-to {
  opacity: 0.6;
}
#b07-section .fade-enter-to,
#b07-section .fade-leave-from {
  opacity: 1;
}