body {
            margin: 0px;
            padding: 0px;
            list-style-type: none;
            width: 100%;
			overflow-x:hidden;
        }


        .container {
			
            display: flex;
            justify-content: center;
            align-items: center;
        }

		.nav{
			display:flex;
		}
		#hform{
			display: block;
			background-color: white;
			border: 1px solid;
			width: 120px;
			border-radius: 20px;
			margin-left: 20px;

			height: 25px;
		}
		#searchform{
			margin-left:5px;
			margin-top:1px;
		}
		
		#keyboard{
			background:none;
			width: 90px;
		}
		#searchform>button>img{
			width:20px;
			height:20px;
			background-color:white;
			
			background: none;
		}
		#searchform>button{
			background: none;
		}
		#showButton,#searchButton{
			border: none;
			background-color: transparent;
		}
		#showButton>img,#searchButton>img{
			width: 20px;
			height: 20px;
			margin-left: 30px;
		}
		.contact_box{
			
			background-color: #c4c2c2;
			height:40px;
		}
		.contact{
			flex:1;
			font-size: 15px;
		}
		.contact>img{
			width:20px;
			height:20px;
			margin-bottom: -5px;
		}
		.navigation_bar{
			align-items: center;
			margin-top: 20px;
			width: 100%;
		}
		.navigation_box{
			display: flex;
			width: 80%;
			margin-left: 30px;
		}
		.nav_logo{
			flex: 1;
			padding-bottom: 20px;
		}
		.nav_logo>a>img{
			width: 136px;
			height: 31px;
		}
		.brief_introduction{
			padding-bottom: 15px;
		}
		.brief_introduction_box{
			width: 80%;
			margin: 0 auto;
		}
		.brief_introduction_box>a>img{
			width: 100%;
			height: auto;
		}
		.brief{
			display: flex;
			justify-items: center;
		}
		.brief_box{
			width: 80%;
			margin: 0 auto;
			background-color: rgba(255, 255, 255, 0.5);
		}
		.brief_box>div{
			width: 100%;
			height:auto;
			margin-top: 10px;
			margin-bottom: 15px;
		}
		.brief_box>div>span{
			margin-top: 10px;
			color: #5f5f5f;
			letter-spacing: 2px;
			font-size: 12px;
			line-height: 2;
		}
		
		.product_table{
			border: 2px solid rgb(202, 191, 191);
			border-radius: 10px;
			width:90%;
			margin:0 auto 15px auto;
		}
		.product_table>li>div{
			margin:5px;
		}
		.case_box{
			width: 100%;
			margin-top: 20px;
		}
		
        .swiper-container .swiper-wrapper .swiper-slide img {
            width: 100%;
        }

        .swiper-button-next,
        .swiper-button-prev {
            color: transparent !important;
        }

        .brief_table_box>div>div>strong {
            color: white;
        }

        .table_box_1>div>span,
        .table_box_2>div>span{
            color: white;
            font-size: 5px;
        }
		.table_box_1>div>span>strong,
		.table_box_2>div>span>strong{
			font-size: 35px;
		}
		.brief_table{
			width: 100%;
			display: flex;
			justify-content: space-evenly;
		}
		.brief_table_box{
			width: 80%;
			display: flex;
			height: 120px;
		}

        .table_box_1 {
            background-color: #1097e6;
            flex: 1;
            flex-direction: column;
        }

        .table_box_2 {
            background-color: #04c4ff;
            flex: 1;
            flex-direction: column;
        }

        .box {
            display: grid;
            place-items: center;
            width: 100%;
            padding-top: 20px;
        }
		
		.clickable{
			position: absolute;
		}
		
        .slider {
            width: 100%;
            overflow: hidden;
        }

        .images {
            display: flex;
            white-space: nowrap;
            transition: transform 0.3s ease-in-out;
        }

        .images img {
            width: 100%;
            height: auto;
        }

        .sysize {
            font-size: 1px;
            margin-bottom: 20px;
            margin-top: 10px;
        }

        .case_application {
            position: absolute;
            height: 120px;
            width: 180px;
            top: 23px;
            left: 150px;
            background-color: rgba(255, 255, 255, 0.8);
        }

        .case_application>span {
            position: absolute;
            left: 20px;
            top: 30px;
			color: black;
			font-size: 17px;
        }

        .case_application>img {
            width: 20px;
            height: 20px;
            position: absolute;
            bottom: 10px;
            right: 30px;
        }
		
		.page_bottom{
			margin-bottom: 10px;
		}
		.page_bottom>img{
			width: 20px;
			height: 20px;
		}
		.page_bottom>span{
			color: white;
		}

        #ABOUTUS {
            width: 100%;
            background-image: url("/skin/images/beijing.jpg");
            background-size: cover;
        }

		#menu{
			width: 100%;
			background-color: #e7e7e7;
			display: none;
			padding-bottom: 10px;
		}
        #menu>ul {
            list-style-type: none;
            padding-top: 5px;
            padding-bottom: 5px;
            padding-left: 40px;
        }

        #menu>ul>li {
            margin-top: 5px;
        }

        a {
            color: #807f7f;
            text-decoration: none;
            border-bottom: none;
            font-size: 20px;
        }


        .introduction {
            position: relative;
            text-align: center;
            padding: 0 15px;
            line-height: 1;
            width: 100%;
        }

        .introduction::after,
        .introduction::before {
            content: "";
            position: absolute;
            height: 1px;
            width: calc(30% - 10px);
            /* 边线的长度，可根据需要修改 */
            top: 50%;
            background-color: black;
            /* 边线颜色 */
        }

        .introduction::before {
            left: 15px;
            transform: translateY(-50%);
        }

        .introduction::after {
            right: 15px;
            transform: translateY(-50%);
        }


        .clearfix {
            zoom: 1;
        }

        ul {
            margin: 0;
            list-style: none;
            padding: 0;
			list-style-type: none;
        }

        .in_dzsc .hd {
            position: relative;
            bottom: -50px;
            z-index: 2;
            margin-top: -50px;
        }

        .clearfix::before,
        .clearfix::after {
            display: table;
            line-height: 0;
            content: "";
        }

        .clearfix:after {
            clear: both;
        }

        .in_dzsc .hd li {
            float: left;
            width: 95px;
            height: 103px;
            font-size: 22px;
            font-weight: bold;
            color: #fff;
            background: no-repeat 0 0;
            text-align: center;
            line-height: 142px;
            margin: 0 52px;
            cursor: pointer;
            transform: scale(0.4);
        }

        .in_dzsc .hd li:nth-child(1) {
            background: url("/skin/images/ysico1.png");
        }

        .in_dzsc .hd li:nth-child(2) {
            background: url("/skin/images/ysico2.png");
        }

        .in_dzsc .hd li:nth-child(3) {
            background: url("/skin/images/ysico3.png");
        }

        .in_dzsc .hd li:nth-child(4) {
            background: url("/skin/images/ysico4.png");
        }

        .in_dzsc .hd li:nth-child(5) {
            background: url("/skin/images/ysico5.png");
        }

        .in_dzsc .hd li:nth-child(6) {
            background: url("/skin/images/ysico6.png");
        }

        .in_dzsc .hd li.click:nth-child(1) {
            background: url("/skin/images/ysico1cur.png");
        }

        .in_dzsc .hd li.click:nth-child(2) {
            background: url("/skin/images/ysico2cur.png");
        }

        .in_dzsc .hd li.click:nth-child(3) {
            background: url("/skin/images/ysico3cur.png");
        }

        .in_dzsc .hd li.click:nth-child(4) {
            background: url("/skin/images/ysico4cur.png");
        }

        .in_dzsc .hd li.click:nth-child(5) {
            background: url("/skin/images/ysico5cur.png");
        }

        .in_dzsc .hd li.click:nth-child(6) {
            background: url("/skin/images/ysico6cur.png");
        }

        .content>.imgList>ul,
        .content>.imgList>li {
            padding-left: 0;
            list-style: none;
            margin: 0;
            /* 给li设置过渡效果 */
            transition: 0.25s;

        }

        .content {
            width: 500px;
            height: 334px;
            /* background-color: red; */
            margin: 20px auto;

        }

        .imgList {
            position: relative;
            width: 500px;
            height: 303px;
            /* background-color: #2758d3; */
            overflow: hidden;

        }

        .imgList>ul {
            width: 100%;
            height: 303px;
        }

        .imgList>ul>li {
            position: absolute;
            width: 10px;
            height: 303px;
        }

        li>img {
            opacity: 0.95;
        }

        .imgList>ul>li.list2 img {
            opacity: 1;
        }

        /*.list1 {
            transform: translateX(50px) scale(0.81);
            transform-origin: 0% 50%;
            z-index: 1;

        }

        .list2 {
            transform: translateX(110px);
            z-index: 3;
        }

        .list3 {
            
            transform: translateX(205px) scale(0.81);
            transform-origin: 100% 50%;
            z-index: 2;
        }

        .list4 {
            transform: translateX(500px) scale(0.81);
            transform-origin: 100% 50%;
            z-index: 1;
        }

        .list5 {
            transform: translateX(500px) scale(0.81);
            transform-origin: 100% 50%;
            z-index: -1;
        }

        .list6 {
            transform: translateX(800px) scale(0.81);
            transform-origin: 100% 50%;
            z-index: -2;
        }*/

        .lineb {
            width: 80%;
            height: 31px;
            /* background-color: #33b630; */
            text-align: center;
        }

        .lineb span {
            display: inline-block;
            width: 35px;
            height: 3px;
            background-color: #ccc;


        }
		
		
		.search-container {
            position: relative;
            width: 140px;
        }

        .search-btn {
            position: absolute;
            top: 0;
            right: 0;
            width: 20px;
            height: 20px;
            background: url("/skin/images/sousuo.png") no-repeat center center;
            background-size: cover;
            border: none;
            outline: none;
            cursor: pointer;
            transition: width 0.3s ease;
        }
		
		
		
		
		@media screen and (min-width:456px){
			.list1 {
            transform: translateX(70px) scale(0.81);
            transform-origin: 0% 50%;
            z-index: 1;

        }

        .list2 {
            transform: translateX(150px);
            z-index: 3;
        }

        .list3 {
            /* transform: translateX(542px)scale(0.81); */
            transform: translateX(270px) scale(0.81);
            transform-origin: 100% 50%;
            z-index: 2;
        }

        .list4 {
            transform: translateX(500px) scale(0.81);
            transform-origin: 100% 50%;
            z-index: 1;
        }

        .list5 {
            transform: translateX(500px) scale(0.81);
            transform-origin: 100% 50%;
            z-index: -1;
        }

        .list6 {
            transform: translateX(800px) scale(0.81);
            transform-origin: 100% 50%;
            z-index: -2;
        }
		}


		
		@media screen and (min-width:386px) and (max-width:415px){
			.list1 {
            transform: translateX(50px) scale(0.81);
            transform-origin: 0% 50%;
            z-index: 1;

        }

        .list2 {
            transform: translateX(110px);
            z-index: 3;
        }

        .list3 {
            /* transform: translateX(542px)scale(0.81); */
            transform: translateX(205px) scale(0.81);
            transform-origin: 100% 50%;
            z-index: 2;
        }

        .list4 {
            transform: translateX(500px) scale(0.81);
            transform-origin: 100% 50%;
            z-index: 1;
        }

        .list5 {
            transform: translateX(500px) scale(0.81);
            transform-origin: 100% 50%;
            z-index: -1;
        }

        .list6 {
            transform: translateX(800px) scale(0.81);
            transform-origin: 100% 50%;
            z-index: -2;
        }
		}
		
		@media screen and (min-width:416px) and (max-width:455px){
			.list1 {
            transform: translateX(55px) scale(0.81);
            transform-origin: 0% 50%;
            z-index: 1;

        }

        .list2 {
            transform: translateX(130px);
            z-index: 3;
        }

        .list3 {
            /* transform: translateX(542px)scale(0.81); */
            transform: translateX(230px) scale(0.81);
            transform-origin: 100% 50%;
            z-index: 2;
        }

        .list4 {
            transform: translateX(500px) scale(0.81);
            transform-origin: 100% 50%;
            z-index: 1;
        }

        .list5 {
            transform: translateX(500px) scale(0.81);
            transform-origin: 100% 50%;
            z-index: -1;
        }

        .list6 {
            transform: translateX(800px) scale(0.81);
            transform-origin: 100% 50%;
            z-index: -2;
        }
		}
		
		
		
		@media screen and (min-width:320px) and (max-width:340px){
		.list1 {
            transform: translateX(30px) scale(0.81);
            transform-origin: 0% 50%;
            z-index: 1;

        }

        .list2 {
            transform: translateX(80px);
            z-index: 3;
        }

        .list3 {
            /* transform: translateX(542px)scale(0.81); */
            transform: translateX(160px) scale(0.81);
            transform-origin: 100% 50%;
            z-index: 2;
        }

        .list4 {
            transform: translateX(500px) scale(0.81);
            transform-origin: 100% 50%;
            z-index: 1;
        }

        .list5 {
            transform: translateX(500px) scale(0.81);
            transform-origin: 100% 50%;
            z-index: -1;
        }

        .list6 {
            transform: translateX(800px) scale(0.81);
            transform-origin: 100% 50%;
            z-index: -2;
        }
		}
		
		
		@media screen and (min-width:341px) and (max-width:360px){
		.list1 {
            transform: translateX(40px) scale(0.81);
            transform-origin: 0% 50%;
            z-index: 1;

        }

        .list2 {
            transform: translateX(90px);
            z-index: 3;
        }

        .list3 {
            /* transform: translateX(542px)scale(0.81); */
            transform: translateX(170px) scale(0.81);
            transform-origin: 100% 50%;
            z-index: 2;
        }

        .list4 {
            transform: translateX(500px) scale(0.81);
            transform-origin: 100% 50%;
            z-index: 1;
        }

        .list5 {
            transform: translateX(500px) scale(0.81);
            transform-origin: 100% 50%;
            z-index: -1;
        }

        .list6 {
            transform: translateX(800px) scale(0.81);
            transform-origin: 100% 50%;
            z-index: -2;
        }
		}
		
		
		@media screen and (min-width:361px) and (max-width:385px){
		.list1 {
            transform: translateX(45px) scale(0.81);
            transform-origin: 0% 50%;
            z-index: 1;

        }

        .list2 {
            transform: translateX(100px);
            z-index: 3;
        }

        .list3 {
            /* transform: translateX(542px)scale(0.81); */
            transform: translateX(190px) scale(0.81);
            transform-origin: 100% 50%;
            z-index: 2;
        }

        .list4 {
            transform: translateX(500px) scale(0.81);
            transform-origin: 100% 50%;
            z-index: 1;
        }

        .list5 {
            transform: translateX(500px) scale(0.81);
            transform-origin: 100% 50%;
            z-index: -1;
        }

        .list6 {
            transform: translateX(800px) scale(0.81);
            transform-origin: 100% 50%;
            z-index: -2;
        }
		}
		
		
		@media screen and (max-width:320px){
			.list1 {
            transform: translateX(30px) scale(0.81);
            transform-origin: 0% 50%;
            z-index: 1;

        }

        .list2 {
            transform: translateX(70px);
            z-index: 3;
        }

        .list3 {
            /* transform: translateX(542px)scale(0.81); */
            transform: translateX(140px) scale(0.81);
            transform-origin: 100% 50%;
            z-index: 2;
        }

        .list4 {
            transform: translateX(500px) scale(0.81);
            transform-origin: 100% 50%;
            z-index: 1;
        }

        .list5 {
            transform: translateX(500px) scale(0.81);
            transform-origin: 100% 50%;
            z-index: -1;
        }

        .list6 {
            transform: translateX(800px) scale(0.81);
            transform-origin: 100% 50%;
            z-index: -2;
        }
		}