﻿/*pad*/

img {
	max-width: 100%;
}

.hs-num {
	float: right;
	height: 56px;
	width: 56px;
	left: 50%;
	top: 0;
	position: absolute;
	transition: all 0.5s cubic-bezier(0.7, 0, 0.3, 1) 0s;
	-webkit-transition: all 0.5s cubic-bezier(0.7, 0, 0.3, 1) 0s;
	-ms-transition: all 0.5s cubic-bezier(0.7, 0, 0.3, 1) 0s;
	cursor: pointer;
	z-index: 9999;
	display: none;
}

.selected .hs-num {
	transform: rotate(90deg);
}

.hs-num a {
	background-color: #000;
	display: block;
	height: 6px;
	margin-top: -2px;
	position: relative;
	top: 50%;
	transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
	-webkit-transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
	-ms-transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
	width: 100%;
	border-radius: 2px;
}

.hs-num a:after,
.hs-num a:before {
	background-color: #000;
	content: "";
	display: block;
	height: 6px;
	left: 0;
	position: absolute;
	transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
	-webkit-transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
	-ms-transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
	width: 100%;
	border-radius: 2px;
}

.hs-num a:after {
	top: 16px;
}

.hs-num a:before {
	top: -16px;
}

.selected .hs-num a:after,
.selected .hs-num a:before {
	top: 0;
}

.selected .hs-num a:before {
	transform: translateY(0px) rotate(-45deg);
	-webkit-transform: translateY(0px) rotate(-45deg);
	-ms-transform: translateY(0px) rotate(-45deg);
	background: #000;
}

.selected .hs-num a:after {
	transform: translateY(0px) rotate(45deg);
	-webkit-transform: translateY(0px) rotate(45deg);
	-ms-transform: translateY(0px) rotate(45deg);
	background: #000;
}

.selected .hs-num a {
	background-color: transparent !important;
}

.selected .header {
	overflow: visible;
}

.selected .header .nav {
	display: block;
	z-index: 111;
	position: absolute;
	left: 0;
	top: 80px;
	right: 0;
	margin: 0;
}

.selected .header .nav li a {
	text-align: center;
	width: auto;
	display: block;
	background: rgba(255, 255, 255, 0.9);
	margin: auto;
	border-bottom: 1px solid rgba(0, 0, 0, 0.1);
	line-height: 50px;
	padding: 0;
}

.selected .header .nav li a {
	color: #000000;
}

.selected .header .nav .selected a {
	border-bottom-color: #73e5b1;
}
@media only screen and (max-width:1700px) {
	.wrap{
		width: 1400px;
	}
	.add_lists li .imgs{
		/*height: 170px;*/
	}
	.ready .ovs{
		margin-left: 40px;
		margin-right: 40px;
	}
	.case_list li .imgs{
		height: 325px;
	}
	.case_list li h2{
		font-size: 24px;
		line-height: 36px;
		height: 36px;
		padding: 30px;
	}
	.case_list li h4{
		padding: 0 30px;
	}
	.banner_b{
		height: 800px;
	}
	.h_attr li .imgs{
		height: 226px;
	}
	.h_worldwide li{
		width: 400px;
		margin: 15px 20px;
	}
	.h_worldwide li .imgs{
		height: 235px;
	}
	.h_worldwide li .imgs{
		height: 363px;
	}
	.h_banner{
		height: 650px;
	}
	.h_products li .imgs{
		height: 363px;
	}
	.d_banner {
		height: 400px;
	}
	.california {
		padding: 50px 0 40px;
	}
	.california .hd ul {
		margin: 40px 0 30px;
	}
	.california .hd h2 {
		font-size: 30px;
		line-height: 50px;
		border-bottom: 3px solid #4e74ff;
	}
	.california .hd ul li h3 {
		font-size: 20px;
		line-height: 24px;
		height: 52px;
	}
	.ukimgs .img2 {
		top: 12px;
	}
}
@media only screen and (max-width:1440px) {
	.wrap{
		width: 1200px;
	}
	.h_test li{
		height:460px ;
	}
	.header .naver li{
		margin-right: 30px;
	}
	.banner .txt{
		padding-left: 0;
	}
	.banner_b{
		height: 700px;
	}
	.case_list li .imgs{
		height:260px;
	}
	.case_list li h2{
		font-size: 18px;
		line-height: 28px;
		height: 28px;
	}
	.case_list li h4{
		font-size: 16px;
		line-height: 22px;
		height: 22px;
	}
	.h_fban .txt h2{
		font-size: 30px;
		line-height: 38px;
	}
	.h_fban .txt a{
		font-size: 20px;
	}
	.footer .wrap {
		width: 150%;
	}
	.footer .nav li{
		margin-right: 15px;
	}
	.footer .wrap .rts {
		float: none;
	}
	.banner_b .txt{
		left: 0;
	}
	.banner_b .txt h2{
		font-size: 40px;
		line-height: 50px;
		margin-bottom: 30px;
	}
	.banner p,
	.banner_b .txt p{
		font-size: 20px;
		line-height: 24px;
	}
	.h_banner .btn a{
		width: 300px;
		height: 60px;
		line-height: 60px;
		border-radius: 30px;
		font-size: 24px;
	}
	.h_how .demo a{
		width: 180px;
		height: 60px;
		line-height: 60px;
		border-radius: 30px;
	}
	.h_how .demo a span{
		font-size: 20px;
		line-height: 60px;
		padding-right: 30px;
	}
	.banner h2,
	.h_products h2,
	.h_test h2,
	.h_how h2,
	.h_attr h2,
	.h_worldwide h2,
	.h_app h2{
		font-size: 32px;
	}
	.h_attr li .imgs{
		height: 188px;
	}
	.h_attr li h3{
		font-size: 22px;
		line-height: 1.2;
		padding-top: 20px;
		margin-bottom: 10px;
	}
	.h_attr li p{
		font-size: 18px;
		line-height: 1.2;
	}
	.h_attr li{
		width: calc((100% - 62px)/3);
		margin-bottom: 30px;
		margin-right: 30px;
	}
	.h_attr{
		padding: 50px 0 ;
	}
	.h_worldwide li .imgs{
		height: 207px;
	}
	.h_worldwide li{
		width: 350px;
	}
	.h_worldwide li h4{
		font-size: 20px;
	}
	.h_test{
		padding: 50px 0;
	}
	.h_products li .imgs{
		height: 308px;
	}
	.h_products li .more a{
		width: 230px;
		height: 60px;
		border-radius: 30px;
		font-size: 16px;
		line-height: 60px;
	}
	.h_fban .txt a{
		width: 200px;
		height: 60px;
		border-radius: 30px;
		line-height: 60px;
		font-size: 16px;
	}
	.add_lists li .imgs{
		/*height: 144px;*/
	}
	.add_lists li p{
		font-size: 14px;
		line-height: 20px;
		height: 100px;
	}
	
}
@media only screen and (max-width:1200px) {
	.ready .wrap{
		width: 84%;
	}
	.add_lists{
		padding: 40px 30px;
		background-size: cover !important;
	}
	.add_lists li .imgs{
		/*height: 215px;*/
	}
	.add_lists li p{
		font-size: 22px;
		line-height:34px;
		height: 170px;
	}
	.add_lists li{
		width: calc((100% - 20px)/2);
		margin: 0 !important;
		margin-bottom: 20px !important;
	}
	.add_lists li:nth-child(2n){
		float: right;
	}
	.layout{
		width: 750px;
		margin: 0 auto;
		overflow: hidden;
		position: relative;
		background: #fff;
	}
	body{
		background: #333;
	}
	.header .naver{
		position: absolute;
		left: 0;right: 0;
		top: 100px;
		background: #fff;
		float: none;
		margin: 0;
		display: none;
	}
	.header{
		background: #fff !important;
		width: 750px;
		margin: 0 auto;
		height: 100px;
	}
	.hs-num{
		display: block;
		left: auto;right: 30px;
		margin: 0;top: 20px;
		z-index: 11;
	}
	.header .logo{
		margin: 15px 30px;
	}
	.header .naver li{
		float: none;
		margin: 0;
		padding: ;
		border-bottom: 1px solid #e5e5e5;
	}
	.w_header .naver li.nli a,
	.header .naver li a{
		font-size: 36px;
		line-height: 80px;
		display: block;
		padding: 0 30px;
		color: #1b1b1b !important;
    background: url(../images/ic7.png) no-repeat;
		background-size: auto 15px !important;
		background-position: right 30px center !important;
	}
	.layout{
		padding-top: 100px;
	}
	.banner{
		background-size: cover;
		height: 300px;
		padding: 0 30px;
	}
	.banner .txt{
		width: auto;
		padding: 0;
		padding-top: 70px;
	}
	.banner h2{
		font-size: 40px;
	}
	.banner p{
		font-size: 24px;
		line-height: 1.2;
	}
	.ready .form{
		position: static;
		width: auto;
		margin-top: 40px;
	}
	.ready .txt{
		width: auto;
		padding: 0 35px;
	}
	.ready .ovs{
		margin: 0;
	}
	.ready .txt p{
		/* margin-bottom: 40px; */
	}
	.ready .txt dd {
		padding-left: 75px;
		margin-left: -75px;
	}
	.ready .txt h4{
		font-size: 26px;
		line-height: 1.3;
		margin-bottom: 15px;
	}
	.ready .form h3{
		font-size: 22px;
		line-height: 1.3;
		margin-top: 10px;
	}
	.footer .rts p,
	.footer .lts p,
	.ready .txt h5,
	.ready .txt h6,
	.ready .txt p{
		font-size: 22px;
		line-height: 1.5;
	}
	.ready .form h2{
		font-size: 30px;
		line-height: 1.3;
	}
	.ready .form li .text{
		height: 70px;
		font-size: 24px;
	}
	.ready .form .sub{
		height: 70px;
		line-height: 70px;
		font-size: 26px;width: 320px;
		
	}
	.ready .ovs{
		padding-bottom: 40px;
	}
	.h_fban .txt a{
		height: 70px;
		width: 240px;
		font-size: 24px;
		line-height: 70px;
		border-radius: 35px;
	}
	.footer .lts{
		float: none;
		width: auto;
	}
	.footer .rts{
		float: none;
		width: auto;
		text-align: left;
	}
	.footer .rts ul{
		float: none;
	}
	.footer .rts p{
		text-align: left;
	}
	.footer{
		padding: 40px 30px 10px;
	}
	.footer .lts a.more{
		width:180px;
		height: 66px;
		line-height: 66px;
		font-size: 24px;
		margin: 45px 45px 0 0 ;
		margin-bottom: 30px;
	}
	.footer .rts li{
		margin: 0 40px 0 0;
	}
	.footer .rts li img{
		height: 40px;
		max-width: 40px;
	}
	.footer .nav{
		display: none;
	}
	.footer .coopyright p{
		text-align: center;
		float: none;
		font-size: 22px;
		width: 70%;
		line-height: 1.3;
		padding: 10px 0;
	}
	.footer .coopyright{
		margin-top: 35px;
	}
	.header{
		border-bottom: 1px solid #e5e5e5;
	}
	.logo{
		display: none;
	}
	.logo2{
		display: block;
		margin: 25px 30px;
	}
	.banner_b{
		height: 500px;
		padding: 0 30px;
	}
	.banner_b .txt{
		left: 0;
		width: auto;
	}
	.banner p, .banner_b .txt p{
		font-size: 24px;
		line-height: 1.3;
	}
	.case_list{
		padding: 60px 0;
	}
	.case_list li{
		width: calc((100% - 20px)/2);
		margin: 0;
		margin-bottom: 30px;
		margin-right: 20px !important;
	}
	.case_list li:nth-child(2n){
		margin-right: 0 !important;
	}
	.case_list li .imgs{
		height: 305px;
	}
	.case_list li h2{
		font-size: 24px;
		line-height: 1.3;
		height: auto;
	}
	.case_list li h4{
		font-size: 24px;
		line-height: 1.3;
		height: auto;
	}
	.h_how .wrap{
		width: auto;
		padding: 0 30px;
	}
	.banner h2, .h_products h2, .h_test h2, .h_how h2, .h_attr h2, .h_worldwide h2, .h_app h2{
		font-size: 40px;
	}
	.h_how p{
		font-size: 26px;
		line-height: 1.3;
	}
	.h_how .demo a{
		width: 220px;
		height: 70px;
		border-radius: 35px;
	}
	.h_how .demo a span{
		font-size: 24px;
		line-height: 70px;
	}
	.h_app .app_hd{
		padding-top: 720px;
	}
	.h_app .app_hd li{
		position: static !important;
		margin: 0 !important;
		width: auto !important;
		text-align: left !important;
		margin-bottom: 30px !important;
		background-position: left center !important;
		padding: 0 0 0 80px !important;
	}
	.h_app .app_hd ul{
		height: auto;padding: 0 30px;
	}
	.h_app .app_hd li h3{
	    font-size:30px ;
	    color: #000000;
	    line-height: 34px;
	    margin-bottom: 10px;
    }
	.h_app .app_hd li p{
		font-size: 24px;
		line-height: 1.3;
	}
	.h_attr li{
		float: none;
		width: auto;
		margin: 0;
		margin-bottom: 30px;
		background: #fff;
		padding: 20px;
		height: auto;
	}
	.h_attr ul{
		padding:0 30px ; 
	}
	.h_attr li .imgs{
		height: 380px;
	}
	.h_attr li h3{
		font-size: 30px;
		line-height: 34px;
		height: 60px;
		margin-bottom: 0;
		overflow: hidden;
	}
	.h_attr li p{
		font-size: 26px;
		line-height: 30px;
		overflow: hidden;
		height: 90px;
		padding-bottom:8px;
	}
	.h_worldwide li{
		width: auto;
		margin: 0;
		display: block;
	}
	.h_worldwide li .imgs{
		height: auto;
	}
	.h_swip{
		margin: 0 30px;
	}
	.h_worldwide li h4{
		font-size: 30px;
	}
	.swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction{
		text-align: center;
	}
	.swiper-pagination-bullet{
		width: 20px;
		height: 20px;
		border-radius: 50%;
	}
	.h_swip .swiper_hd{
		margin-top: 20px;
	}
	.swiper-pagination-bullet-active{
		background: #4e74ff;
	}
	.h_test .next, .h_test .prev{
		margin-left:30px ;
		margin-right: 30px;
	}
	.h_test li h3{
		font-size: 40px;
		line-height: 1.6;
		height: ;
	}
	.h_test li h5{
		font-size: 26px;
		line-height: 1.6;
	}
	.h_test li{
		height: auto;
		padding-bottom: 40px;
	}
	.h_test li p{
		font-size: 24px;
		line-height: 1.6;
		height: auto;
	}
	.swiper_pr{
		margin: 0 30px;
	}
	.h_products li .imgs{
		height: auto;
	}
	.h_products li .more a{
		font-size: 26px;
	}
	.h_worldwide ul{
		display: flex;
	}
	.h_fban{
		/*background-size: auto 100vh;*/
		background-position: center bottom !important; 
	}
	.re_ban{
		height: 450px;
		background-size: cover !important;
	}
	.re_be li{
		display: block;
		width: auto;
		padding: 40px;
	}
	.re_be li h4{
		font-size: 28px;
		line-height: 35px;
		height: 70px;
	}
	
	.mask_video{
		width: 600px;
	}
	.mask_video .icon{
		transform: scale(1.8);
		right: -60px;
		top: -60px;
	}
	.ad_top{
		display: none;
	}
	.tc_mask{
		width: 650px;
		padding: 40px 30px;
		box-sizing: border-box;
	}
	.uit_form li .rt,
	.uit_form li .lt{
		float: none;width: auto;
	}
	.tc_mask .uit_form{
		width: auto;
	}
	.uit_form li label{
		font-size: 26px;
		line-height: 1.7;
	}
	.uit_form li .t4, .uit_form li .sel, .uit_form li .se1, .uit_form li .t3, .uit_form li .t2, .uit_form li .t1{
		height:66px;
	}
	.tc_mask .btns{
		width: 50px;
		height: 50px;
		background-size: cover !important;
	}
	.uit_form .sub{
		height: 66px;
		font-size: 26px;
	}
	.case_list .wrap{
		padding: 0 30px;
	}
	
	.b_logo{
		display: block !important;
	}
	.w_logo{
		display: none !important;
	}
	
	iframe{
		width: 100% !important;
   	    height: 338px !important;
    }
    
    /* 锟斤拷锟斤拷 */
	.yf_bgs .txt {
	    padding: 0 30px;
	}
	.yf_bgs p {
	    height: 117px;
	    overflow: hidden;
	}
	.yf_bgs li{
		padding: 0 30px;
	}
	.d_banner {
		height: 320px;
	}
	.california {
		padding: 40px 30px;
	}
	.california .hd ul {
		margin: 30px 0 10px;
	}
	.california .hd ul li {
		width: 690px;float: none;box-shadow: 0 0 5px 2px #f5f7ff;
		padding: 20px;height: 200px;
	}
	.california .hd ul li h3 br {
		display: none;
	}
	.california .hd ul li h3 {
		font-size: 24px;line-height: 30px;height: 30px;
	}
	.california .hd ul li p  {
		font-size: 22px;line-height: 30px;height: 120px;
	}
	.california .hd ul li p br {
		display: none;
	}
	.layout{
		padding-top: 0;
	}
	.ukbors{
		margin:0;
		background: none;
	}
	.ukbors .ukdels{
		font-size: 24px;
		line-height: 1.7;
	}
	.uapc{
		display: none;
	}
	.uaweb{
		display: block;height: 1334px;
		width: 100%;
	}
	.pc-only{
		display: none !important;
	}
	.phone-only{
		display: block !important;
	}
	.logo-top .phone-only{
		width: 360px;
		height: auto;
	}
	.ready .txt{
		width: auto !important;
		padding-top: 30px;
	}
	.ready .txt p,
	.ready .txt .title,
	.ready .txt h4,
	.ready .txt h5,
	.ready .txt h6{
		color: #fff !important;
	}
	.lsele{
		/* font-size: 24px !important; */
	}
	.ready .form li .imgcodeinput{
		height: 70px !important;font-size: 24px !important;
		width: calc(100% - 130px) !important;
	}
	#imgCode{
		height: 60px !important;
		width: 120px !important;
	}
	
	.ukimgs img{
		top:-95px;
	}
	
	.ra label{
		width: 521px;
		font-size: 17px;
	}
	.ra input{
		width: 23px;
		height: 29px;
	}
	.ra input:checked{
		width: 23px;
		height: 29px;
	}
	.note {
		margin-left: 29px !important;
	}
	.ready .ovs{
		background: none !important;
	}
	.ready .ready .ovs{
		margin-top: 260px;
	}
	.ukbors{
		background: url(../images/border-phone.png) no-repeat center/100% 100%;
	}
	.layout>.ready{
		background: url(../images/bg-phone.png) no-repeat center top/100% 100% #fffcf7 !important;
	}
	.ukimgs{
		margin-top: 50px;
		width: 100%;
		margin-left: 0;
		height: 54vw;
	}
	.ready .txt dd:nth-child(odd){
		background-image: url(../images/icon-01-phone.png);
	}
	.ready .txt dd:nth-child(even){
		background-image: url(../images/icon-02-phone.png);
	}
	.ukbors h2 i::after{
		background: url(../images/icos3.png) no-repeat center/100% 100%;
	}
	
	::placeholder,select option, select {
		color: #898989; /* 提示语颜色 */
		font-style: italic; /* 提示语样式 */
		font-size: 20px; /* 提示语字体大小 */
		font-family: 'OPPOSans-L';
	}
	.subBox{
		margin-top: 142px;
	}
	.ukimgs .img1 {
		top: 39px;
		width: 160vw;
	}
	.ukimgs .img2 {
		width: 100vw;
		max-width: 100vw;
		height: auto;
		left: 50%;
		right: auto;
		transform: translateX(-50%);
		top: 88px;
	}
	.rain-img {
		display: none;
	}
	
}
