@media (max-height: 1100px) and (min-width: 1400px) {
	.pp-btn-register{
		margin-top: 13vw;
	}
}
@media(min-width: 1921px){
	.line-section {
	    bottom: -2.4vw;
	    height: 6vw;
	    width: 100%;
	}
}
@media(max-width: 1600px){
	.legendary-slider .description{
		right: 10%;
	}
}
@media(max-width: 1400px){
	.legendary-slider .description{
		right: 5%;
	}
	.sidebar{
		width: 230px;
	}
	.legendary-slider .slick-dots{
		left: 87px;
		margin-top: 9px;
	}
	.swiper-slide {
	    width: 350px;
	}
}
@media(max-width: 1279px){
	.diverse-list .item .completed {
	    width: 62px;
	    bottom: -2px;
	    left: 8px;
	}
	.sidebar {
        height: 410px;
        width: 150px;
        padding: 0 5px 0 0px;
    }
    .hero{
    	padding-left: 100px;
    	padding-right: 100px;
    }
    .hero-content .slogan{
    	margin-top: -100px;
    }
    .legendary-slider .description{
    	max-width: 80%;
    }
    .choose-slider .slider-nav{
    	width: 200px;
    	gap: 40px;
    	padding-top: 170px;
    }
    .choose-slider .slider-for .information{
    	width: 200px;
    }
    .choose-slider .slider-for .item .avatar{
    	width: calc(100% - 240px);
    }
    .choose-slider .slider-for .information .title-item{
    	height: 35px;
    }
    .choose-slider .slider-for .information .organization{
    	height: 20px;
    	margin-bottom: 10px;
    }
    .choose-slider .slider-for p{
    	font-size: 16px;
    }
    .diverse-list .item-dot{
    	margin-top: 30px;
    }
    .diverse-list .item-dot:after{
    	width: 50px;
    	height: 50px;
    }
    .diverse-line{
    	bottom: 81px;
    }
    .swiper-slide {
	    width: 300px;
	}
	.swiper-button-prev, .swiper-button-next{
		width: 100px;

	}
	.diverse-list .item:before{
		bottom: 41px;
	}
	.diverse-list .item:after{
		bottom: 53px;
	}
}
@media(max-width: 991px){
	.pp-btn-register{
		margin-top: 12vw;
	}
	.hero-content .slogan{
		margin-top: -50px;
		margin-bottom: -50px;
	}
	.btn-function .btn-claim{
	    margin-left: -90px;
	    width: 60%;
	}
	.btn-function .btn-register{
		width: 40%;
	}
	.choose-slider .slider-for .item{
		display: block;
	}
	.choose-slider .slider-for .item .avatar{
		width: 100%;
		margin-top: 0;
		width: 100%;
		height: auto;
		max-height: max-content;
	}
	.choose-slider .slider-for .item .information{
		width: 100%;
	    position: absolute;
	    bottom: 50px;
        display: flex;
		align-items: flex-end;
		gap: 30px;
		justify-content: center;
	}
	.choose-slider .slider-for .information img{
		height: 300px;
	}
	.choose-slider .slider-for .item.active .information{
		transition-delay: 0s;
		bottom: 58px;
	}
	.choose-slider .slider-for .information{
		opacity: 1;
		transition: none;
	}
	.diverse {
	    padding: 0 20px 50px;
	}
	.line-section {
	    bottom: -21px;
	    height: 50px;
	}
}
@media(max-width: 768px){
	.choose-slider .slider-for .item .information {
	  gap: 1.3vw;
	  padding: 0 5.99vw;
	  bottom: 7.55vw;
	}
	.sidebar {
	  display: none;
	}
	.menu-main {
	  display: none;
	  position: absolute;
	  top: 17.97vw;
	  left: 0;
	  right: 0;
	  background: rgba(1, 13, 34, 0.8);
	  padding: 2.99vw 0 1.3vw;
	}
	.menu-main ul li {
	  display: block;
	  text-align: center;
	  width: 100%;
	  height: 100%;
	  background: none;
	  margin: 0 0 1.43vw;
	}
	.menu-main ul li.active {
	  background: url(../images/bg-menu.webp) no-repeat center center/cover;
	}
	.menu-main ul li a {
	  font-size: 5.34vw;
	  margin: 0;
	  padding: 1.69vw 2.6vw;
	}
	.hero {
	  padding: 132.68vw 2.6vw 9.64vw;
	}
	.line-section {
	  bottom: -3.13vw;
	  height: 7.94vw;
	}
	.hero-content .btn-list img {
	  height: 11.85vw;
	}
	.hero-content .slogan {
	  height: 63.93vw;
	  margin-left: -15%;
	  max-width: inherit;
	  margin-top: -22%;
	  margin-bottom: -11.5%;
	}
	.btn-function {
	  padding: 0 4.69vw;
	}
	#footer {
	  padding-top: 4.04vw;
	  padding-bottom: 5.21vw;
	}
	.ft-menu {
	  padding: 0;
	}
	.ft-menu:before {
	  display: none;
	}
	.ft-menu img {
	  width: auto;
	  height: 12.11vw;
	}
	.ft-menu ul {
	  flex-wrap: wrap;
	  gap: 3.78vw 5.08vw;
	  max-width: 50vw;
	  margin: 0 auto;
	}
	.on-mb {
	  display: block !important;
	}
	.on-pc {
	  display: none !important;
	}
	.mb-box {
	  justify-content: space-between;
	  align-items: center;
	}
	.mb-box .logo {
	  height: 15.76vw;
	}
	.mb-box .mb-right {
	  gap: 1.56vw;
	  align-items: center;
	}
	.mb-box .mb-right .mb-download img {
	  height: 9.9vw;
	}
	.mb-box .mb-right .toggle-menu {
	  height: 4.3vw;
	}
	#header {
	  background: rgba(1, 13, 34, 0.8);
	  padding: 0.65vw 2.86vw 1.56vw 4.69vw;
	  top: 0;
	}
	#header .line-section {
	  bottom: -2.08vw;
	  height: 5.73vw;
	}
	.btn-function .btn-claim {
	  margin-left: -16%;
	}
	.choose-slider .slider-for {
	  height: 147.4vw;
	}
	.choose-slider .slider-nav {
	  top: 26.95vw;
	  width: 31.25vw;
	  padding-top: 27.34vw;
	  gap: 7.68vw;
	  height: 124.35vw;
	  padding-bottom: 0;
	}
	.bg-section{
		padding-top: 0.52vw;
	}
	.choose-slider .slider-for .item.active .information{
		bottom: 7.55vw;
	}
	.choose .title {
	  left: -7%;
	  right: 0;
	  max-width: 114%;
	  top: -0.13vw;
	  position: relative;
	}
	.legendary-slider .description {
	  bottom: 8.98vw;
	  right: 5.5%;
	}
	.legendary-slider .bg {
	  height: 142.19vw;
	}
	.legendary .title {
	  left: -8%;
	  right: 0;
	  max-width: 116%;
	  top: 0;
	}
	.choose-slider {
	  padding: 0;
	}
	.choose-slider .slider-nav .item {
	  width: 11.98vw;
	  right: -4.82vw;
	}
	.choose-slider .slider-nav .item:nth-child(1) {
	  right: 4.17vw;
	}
	.choose-slider .slider-nav .active:before {
	  top: -4.82vw;
	  right: -1.95vw;
	  width: 16.28vw;
	  height: 21.61vw;
	}
	.choose-slider .slider-nav .item:nth-child(4) {
	  right: 6.25vw;
	}
	.choose-slider .slider-for p {
	  font-size: 2.6vw;
	  margin-bottom: 1.69vw;
	}
	.choose-slider .slider-for .information .organization {
	  height: 5.21vw;
	  margin-bottom: 3.65vw;
	}
	.choose-slider .slider-for .information .title-item {
	  height: 8.46vw;
	  margin-bottom: 1.95vw;
	  width: auto;
	}
	.diverse {
	  padding: 0 0 15.89vw;
	}
	.diverse .title {
	  left: -7%;
	  right: 0;
	  max-width: 114%;
	  top: 0.78vw;
	  position: relative;
	  margin-bottom: 13.54vw;
	}
	.diverse-for .item {
	  position: relative;
	}
	.diverse-for .item .card-active {
	  display: none;
	  position: absolute;
	  top: 0;
	  left: 0;
	  right: 0;
	}
	.diverse-for .item.active .card-active {
	  display: block;
	}
	.diverse-for {
	  margin: 0 auto;
	  padding: 0 17.97vw;
	}
	.diverse-for img {
	  width: 100%;
	}
	.diverse-nav .item {
	  height: 10.81vw;
	  width: 10.81vw !important;
	  background: url(../images/frame4/disable.webp) no-repeat center center/100%
	    auto;
	  margin: 0 1.43vw;
	}
	.diverse-nav {
	  margin: 3.39vw auto 0;
	  position: relative;
	}
	.diverse-nav .slick-track {
	  width: 100%;
	  display: flex;
	  justify-content: center;
	}
	.diverse-nav:before {
	  width: inherit;
	  left: 10.29vw;
	  right: 6.64vw;
	  position: absolute;
	  content: "";
	  background: url(../images/frame4/sp-line-active.webp) no-repeat center
	    center/100% auto;
	  height: 8.98vw;
	  top: 1.3vw;
	}
	.ultimate .title {
	  left: -17%;
	  right: -17%;
	  max-width: 134%;
	  top: -0.39vw;
	  position: relative;
	  margin-bottom: 0.52vw;
	}
	.ultimate {
	  padding: 0.78vw 3.91vw 4.3vw;
	  background: url(../images/frame5/sp-ultimate-bg.webp) no-repeat center
	    center/cover !important;
	}
	.swiper {
	  padding: 0;
	  max-width: 100%;
	}
	.choose-slider .slider-for .information img {
	  height: auto;
	  width: 35.16vw;
	}
	.choose-slider .slider-for .item .description {
	  width: calc(100% - 36.46vw);
	}
	.diverse-nav .item.slick-current {
	  background: url(../images/frame4/active.webp) no-repeat center center / 100%
	    auto;
	}
	.diverse-for .slick-prev {
	  height: 11.72vw;
	  width: 15.1vw;
	  top: 50%;
	  position: absolute;
	  transform: translateY(-50%);
	  background: url(../images/frame5/prev.webp) no-repeat center center/contain;
	  z-index: 10;
	  font-size: 0;
	  border: none;
	  left: 1.3vw;
	}
	.diverse-for .slick-next {
	  height: 11.72vw;
	  width: 15.1vw;
	  top: 50%;
	  position: absolute;
	  transform: translateY(-50%);
	  background: url(../images/frame5/next.webp) no-repeat center center/contain;
	  z-index: 10;
	  font-size: 0;
	  border: none;
	  right: 1.3vw;
	}
	.diverse {
	  background: url(../images/frame4/sp-diverse-bg.webp) no-repeat center
	    center/cover !important;
	}
	.choose {
	  background: url(../images/frame3/sp-choose-bg.webp) no-repeat center
	    center/cover !important;
	}
	.swiper-slide {
	  width: 37.89vw;
	}
	.swiper-button-prev,
	.swiper-button-next {
	  width: 15.63vw;
	  left: 12%;
	  margin-top: -9%;
	  height: 17.06vw;
	}
	.swiper-button-next {
	  right: 12%;
	  left: auto;
	}
	.mb-box .logo img{
		height: 100%;
	}
	.legendary-slider .slick-dots li {
	  width: 17.19vw;
	  height: 16.93vw;
	}
	.legendary-slider .slick-dots {
	  left: 11.33vw;
	  margin-top: 1.17vw;
	  gap: 2.21vw;
	  width: 3.39vw;
	  height: 86.2vw;
	}

	.diverse-list .item:before, .diverse-list .item:after{
		display: none;
	}
	.pp-box{
		max-width: 100%;
	}
	.pp-close{
		top: 50%;
	    margin-top: -20vw;
	    right: 5vw;
	    height: 6vw;
	}
}