
::-webkit-scrollbar{
	width:0px;
}
.main,.kv{
	width:100%;
}
.main{
	margin-bottom:80px;
}
.kv{
	width:100%;
	position:relative;
	min-height:45vw;
}
.qrcode-block .artic .headline{
	text-transform:uppercase;
}
.content-scroll .item .abs{
	position:absolute;
	top:0px;
	right:0px;
	width:100%;
}
.tabs-header{
display:none;
}
.content-scroll .item .mask{
	background:#000;
	opacity:0.5;
	z-index:1;
	width:93%;
	opacity:0;
	transition:all 0.3s;
	height:31.2698vw;
}

.content-scroll .item .tire{
	z-index:5;
}
.content-scroll .item .m{
	z-index:3;
	right:0px;
	transition:all 0.3s;
}

.content-scroll .scroll-wrapper{
	background:#fff;
	width:78.8vw;
	margin:0 auto;
}

.content-scroll .item .bycicle{
	z-index:4;
}

.content-scroll .item.left .mask{
	right:7%;
}

.content-scroll .item.over .mask{
	opacity:0.5;
}

.content-scroll .item.over .m{
	right:-7%;
}


.content-scroll{
	position:relative;
	width:98%;
	#height:31.3vw;
	#height:40vw;
	margin:2vw auto 0;
	overflow-y:auto;
	z-index:6;
}

.content-scroll .item{
	width:100%;
	margin:0 auto;
	position:relative;
	margin-bottom:20px;
	background:#fff;
	overflow:hidden;
	height:34.2vw;
	#display:none;
}


.content-scroll .highway-competition{
	display:block;
}

.content-scroll .item img{
	width:100%;
}

.content-scroll .item img.shadow{
	width:90%;
	margin:0 auto;
}


.content-scroll .item a{
	position:absolute;
	width:100%;
	height:100%;
	top:0px;
	left:0px;
	z-index:10;
}
.content-scroll .item:hover .m{
	right:-7%;
}

.content-scroll .item:hover .mask{
	opacity:0.5
}

.content-scroll .item.left:hover .m{
	right:7%;
}



.content-scroll .item:hover .mask {
    opacity: 0.5;
}


.content-scroll .item:hover .btn{
	background:#27509b;
	color:#fff;
}
.content-scroll .item:hover .btn span{
	background-image:url(/assets/images/arrow-right-white.png);
}


.content-scroll::-webkit-scrollbar-thumb{
	background:#27509b;
}
.content-scroll::scrollbar-thumb{
background:#27509b;
}

.content-scroll::-webkit-scrollbar{
	width:5px;
}

.content-scroll::-webkit-scrollbar-track {
  background: #c1c1c1; 
}
.content-scroll::scrollbar-track {
  background: #c1c1c1; 
}

.content-scroll::scrollbar{
	width:5px;
	background:#000
}

.content-scroll > img{
	width:100%;
}

.bicycle .content{
	width:100%;
	position:relative;
	min-height:50vw;
	color:#fff;
}
.content .item .btn{
	position:absolute;
	top: 73%;
    left: 34%;
	margin:0;
	width: 12.5vw;
	height:2.61vw;
	z-index:7;
}
.content .item.left .btn{
	left: 51%;
}

.content .blue-bg{
	width:100%;
	background:#00205b;
	height:41.666vw;
	position:absolute;
	top:0px;
	left:0px;
}

.content h1{
	text-align:center;
	color:#fff;
	position:relative;
	font-weight: normal;
	font-size:38px;
	font-style: italic;
	padding-top:3.5vw;
}

.content h2{
	text-align:center;
	position:relative;
	font-weight: normal;
	font-size:18px;
	color:#fff;
	font-style: italic;
	margin-top:7px;
}

.tabs{
	position:relative;
	width:100%;
	background:#00205b;
	height:60px;
	margin-top:4.5vw;
}

.tabs-copy{
	position:fixed;
	margin-top:0;
	top:100px;
	left:0px;
	z-index:88;
	display:none;
}

.tabs-copy.t60{
top:50px;
}

.tabs li a{
	display:block;
	padding:10px 20px;
	font-size:16px;
	color:#fff;
	border-radius:6px;
}


.tabs li a:hover,.tabs li a.active{
	background:#fff;
	color:#000;
	font-style: italic;
	font-weight:bold;
}

.kv img{
	width:100%
}

.kv .swiper{
	width:100%;
	overflow:hidden;
}
.kv .article{
	position:absolute;
	left:10.4%;
	bottom:40%;
	width:29.84%;
}

.kv .article .btn{
	margin-top:2.08vw;
}

.kv .slide2 .article{
	left:10.4%;
	width:18.84%;
}

.kv .slide3 .article{
	left:10.4%;
	width:29.84%;
}

.bicycle .btn{
	width:12.86vw;
	height:2.576vw;
	border-radius:6px;
	background:#fce501;
	display:block;
	color:#000;
	display:flex;
	align-items:center;
	justify-content:center;
	position:relative;
}
.bicycle .btn span{
	display:inline-block;
	line-height:1;
	font-size:15px;
	padding-right:14px;
	background:url(/assets/images/arrow-right.png) scroll no-repeat 100% 1px;
	background-size:auto 80%;
}

.bicycle .btn:hover{
	background:#27509b;
	color:#fff;
}
.bicycle .btn:hover span{
	background-image:url(/assets/images/arrow-right-white.png);
}


.bicycle .btn a{
	position:absolute;
	top:0px;
	left:0px;
	width:100%;
	height:100%;
}

.kv .slide03 .article{
	width:29.84%;
}

.swiper-pagination {
	display:flex;
	align-items:center;
	justify-content:flex-end;
	bottom:5.6% !important;
	right:10.4% !important;
	position:absolute;
	width:auto !important;
}
.swiper-pagination span{
	background:#a6a7a2;
	width:4.16vw;
	height:2px;
	border-radius:2px;
}
.swiper-pagination span.swiper-pagination-bullet-active{
	background:#fff;
	height:4px;
}

.kv .kv-link { position:absolute; bottom:10%; left:10.4%; z-index:2;}
.kv .kv-link .xhs01-link { display:flex; gap:10px; align-items: center;}
.kv .kv-link .xhs01-link:link span, .kv .kv-link .xhs01-link:visited span { color:#FFF; text-decoration: underline;}
.kv .kv-link .xhs01-link:hover span { color:#244c99;}
.kv .kv-link .xhs01-link img { width:auto;}

@media (max-width:1400px){
	.bicycle .btn span{
		font-size:14px;
	}
	.tabs li a {
		padding: 10px 15px;
		font-size: 16px;
	}
	.content h1{
		font-size:34px;
	}
	.content h2{
		font-size:16px;
	}
}


@media (max-width:1024px){
	
		.tabs-copy{
		top:50px;
	}
	.tabs li a{
		font-size: 12px;
	}
}

@media (max-width:750px){
.tabs-copy{
	display:none !important;
}
.tabs-header{
	display:flex;
	        align-items: center;
			height:55px;
	color:#00205b;
	font-size:14px;
	background:url(/bicycle/assets/img/arrow.png) scroll no-repeat 94% center;
	background-size: auto 30px;
}

.tabs-header.active{
	background-image:url(/bicycle/assets/img/arrow-up.png)
}

.tabs-header img{
	margin-left:5%;
	width: 32px;
	margin-right:5px;
}

.content h1{
	font-size:30px;
	padding-top: 9.5vw;
}
   .content h2 {
        margin-bottom: 11vw;
    }

.tabs li a:hover, .tabs li a.active{
	background:#00205b;
	color:#fff;
	font-weight:normal;
}


.content .blue-bg{
	height:100vw;
}
.content{
	background:#fff;
}

.content-scroll .scroll-wrapper{
	width:92vw;
}

.tabs-wrapper{
	width:92vw;
	background:#fff;
	margin:5vw auto;
	position:relative;
	z-index:2;
	#height:55px;
	box-shadow: 0px 0px 16px 0px #666;
}
.tabs-wrapper.active{
	#height:auto;
}

.tabs-wrapper.fixed{
	position:fixed;
	z-index:8;
	margin:0;
	top:60px;
	left:4vw;
	width: 100%;
    left: 0;
	box-shadow: 0px -7px 27px 0px #666;
}

.content-scroll .item{
	width:100%;
	height:174.62vw;
}

.tabs{
	margin:0 auto;
	height:auto;
	width: 90%;
	background:#fff;
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: stretch;
	padding: 10px 0 5px;
}

.tabs-wrapper .tabs{
	display:none;
}

.tabs-wrapper.active .tabs{
	display:flex;
}


.tabs li{
	flex: 48% 0 0;
	border:1px solid #00205b;
	box-sizing:border-box;
	margin-right:4%;
	margin-bottom: 5%;
	border-radius:6px;
	overflow:hidden;
}

.tabs li:nth-child(2n){
	margin-right:0%;
}

.tabs li a{
	color:#00205b;
	text-align:center;
	border-radius:0px;
	padding:7px 0;
	font-size:14px;
}

.content-scroll{
	#height:60vh;
}
.content-scroll .item .bycicle,.content-scroll .item .m{
	display:none;
}

.content-scroll .item .mask{
	right:0 !important;
	width:100%;
	height:50%;
}

.content-scroll .item img.shadow{
	width:100%;
}


.swiper-pagination{
	width:100% !important;
	right:0 !important;
	justify-content:center;
	bottom:2.6vw !important;
}

.swiper-pagination span{
	width:17vw;
}

	.kv .article {
		left: 4.4% !important;
		bottom:16.6%;
		display:flex;
		flex-direction:column;
		justify-content: flex-end;
   }

  .kv .slide1 .article {
		width: 65.73%;
   }
   
   
     .kv .slide2 .article {
		width: 60.26%;
   }
   
   
     .kv .slide3 .article {
		width: 78.13%;
   }
   
   
   .kv .article .btn{
   		width:47vw;
		height:12.23vw;
		margin-top:5vw;
   }
   
   .content .item .btn{
   	    top: 86%;
		width: 47.33vw;
		height:11.99vw;
		left:48% !important;
   }
   
   .kv .kv-link { left:5.2%; font-size:14px; bottom:8%;}
   
   .qrcode-block { width:100%;padding:60px 0 20px 0px;}
   .qrcode-block .content .left-img { width:50vw;}
   .qrcode-block .artic .headline { font-size:14px;}
   .qrcode-block .qr-img { width:70%; margin:10% auto;}
   .qrcode-block .artic .subheadline { font-size:14px;}
   .qrcode-block .close { right:10px;}
   .qrcode-block .content { padding:10px 0;}
   
	
}

