@charset "utf-8";
/* CSS Document */
@media(max-width: 1600px){
	.w_all{
		width: 92%;
	}
	.w_all2{
		width: 88%;
	}
	.w_all3{
		width: 80%;
	}
	.banner .swiper-pagination{
    	bottom: 3% !important;
    }
}
@media(max-width: 1200px){
	body,html{
		font-size: 58%;
	}
	.w_all3{
		width: 84%;
	}
	.logo {
	    padding: 10px 0;
	}
	header dl{
		position: fixed;
		left: 0;
		top: 0;
		width: 90%;
		height: 100%;
		display: none;
		background: #fff;
		padding: 80px 5% 0;
		box-sizing: border-box;
	}
	header dl span{
		color: #1a1a1a;
		line-height: 2;
		font-size: 2rem;
	}
	header dl .ss span::after{
		content: '+';
		position: absolute;
		right: 0;
		top: -14px;
		font-size: 3.6rem;
	}
	header span::before{
		display: none;
	}
	header dl dd{
		opacity: 0;
		transform: translateX(-30px);
		margin: 0;
		padding: 20px 0;
		border-bottom: 1px solid #ddd;
		transition: all 0.3s ease;
		transition-delay: 0.5s;
	}
	header dl dd.active2{
		opacity: 1;
		transform: translateX(0px);
	}
	header dl dd:nth-of-type(2){
		transition-delay: 0.7s;
	}
	header dl dd:nth-of-type(3){
		transition-delay: 0.9s;
	}
	header dl dd:nth-of-type(4){
		transition-delay: 1.1s;
	}
	header dl dd:nth-of-type(5){
		transition-delay: 1.3s;
		border-bottom: none;
	}
	header .others_ph{
	    width: 100px;
        display: flex;
        align-items: center;
    }
    header .others_ph i{
        color: #fff;
	}
	header .others_ph .search2 i{
	    font-size: 2.2rem;
	    margin-left: 20px;
	}
	.navBtn{
		z-index:99999;
		cursor:pointer;
		display: block;
		-webkit-transition:all 0.4s;
	    transition:all 0.4s;
	}
	.navBtn span{
		display: block;
		width: 18px;
		height: 2px;
		background:#fff;
		margin:4px auto;
		-webkit-transition:none;
		transition:none;
	}
	.nav_btn_active{
		margin-top: -80px;
	}
	.nav_btn_active span{
		background: #1a1a1a;
	}
	.nav_btn_active span:nth-of-type(1){
		-webkit-transform:rotate(45deg);
		transform:rotate(45deg);
		}
	.nav_btn_active span:nth-of-type(2){
		opacity:0;
		}
	.nav_btn_active span:nth-of-type(3){
		margin-top:-12px;
		-webkit-transform:rotate(-45deg);
		transform:rotate(-45deg);
		}
	.s_menu{
		position: static;
	}
	.s_menu .sbox{
		display: block;
		width: 100%;
		box-sizing: border-box;
		padding: 0 3%;
	}
	.s_menu .s1box{
		margin: 0;
	}
	.s_menu .s1box a{
		font-size: 1.6rem;
		margin: 6px 0;
	}
	.s_menu h3{
		display: none;
	}
	.s_menu .imgs{
		margin: 20px 0;
	}
	.s_menu .imgs a{
		margin-right: 10px;
		font-size: 1.5rem;
	}
	.s_menu .imgs a img{
		margin-bottom: 10px;
	}
	header ul{
	    width: 100px;
	}
	header ul li:not(:last-of-type){
	    display: none;
	}
	header ul li span{
        display: none;
    }
	header ul li .li_ph{
        display: flex;
    }
    header ul li .li_ph img{
        height: 23px;
    }
    header ul li .li_ph i{
        margin-left: -10px;
        margin-top: -16px;
        width: 18px;
	    height: 18px;
    }
	.txt_all{
		left: 8%;
		width: 80%;
	}
	.txt_all p{
		font-size: 5rem;
	}
	.more{
		line-height: 50px;
	}
	.title h3{
		font-size: 4rem;
	}
	.index_bar2 ul li .add span{
		display: none;
	}
	.index_bar2 ul li .add{
		left: inherit;
		right: 3%;
		width: auto;
		padding: 5px;
		opacity: 1 !important;
		border-radius: 0;
	}
	.index_bar2 ul li .add img{
		display: block;
		position: relative;
		z-index: 2;
		height: 18px;
	}
	.index_bar4 .left{
		width: 55%;
		padding-left: 0;
	}
	.index_bar4 .right{
		width: 42%;
	}
	.index_bar5 ul li h3 {
		font-size: 1.6rem;
		margin: 20px 0 10px;
	}
	.index_bar5 ul li p{
		font-size: 1.2rem;
	}
	.index_bar6 ul li h3{
		font-size: 2.4rem;
	}
	.index_bar6 ul li p{
		font-size: 1.3rem;
	}
	.more2{
		font-size: 1.3rem;
	}
	.footer .top ul{
		justify-content: space-between;
	}
	.footer .top ul li{
		margin: 0;
	}
	.footer .top ul li h3{
		margin: 5px 0 10px;
	}
	.footer .left{
		width: 26%;
	}
	.about .bar3 .swiper-slide{
	    display: block;
	}
	.about .bar3 .swiper-slide .ll{
	    width: 100%;
	}
	.about .bar3 .swiper-slide .rr{
	    width: 100%;
	    padding: 8%;
	}
	.pro_l .left {
	    display: none;
        position: fixed;
        left: 0;
        top: 0;
        height: 100vh;
        background: #fff;
        z-index: 9999;
        padding: 3rem;
    }
	.pro_l .right {
        width: 100%;
        margin-left: 0rem;
    }
    .pro_l .right .top .flitt0{
        display: flex;
    }
    .pro_d .bar1{
        display: block;
    }
    .pro_d .left{
        width: 100%;
        margin: 3rem auto;
    }
    .pro_d .gallery-thumbs{
        display: none;
    }
    .pro_d .gallery-top{
        width: 100%;
    }
    .pro_d .right{
        width: 100%;
    }
    .pro_d .right h1{
        font-size: 2.8rem;
    }
    .pro_d .bar4 .contain .right {
        width: 52%;
    }
    .payWays .tt2 img {
        width: 40%;
    }
    
}
@media(max-width: 900px){
	.w_all3{
		width: 88%;
	}
	.o_nav {
        padding: 3rem 0 3rem;
    }
	.allbars {
        padding: 0 0 10%;
    }
	.index_bar2 ul li{
		width: 31.3%;
	}
	.index_bar2a ul li:last-of-type{
		display: none;
	}
	.index_bar4 .left p{
		font-size: 1.4rem;
	}
	.index_bar6 ul li h3{
		font-size: 2rem;
	}
	.footer .left{
		width: 30%;
	}
	.box_carts .otherss{
	    display: none;
	}
	.tk .box{
	    width: 80%;
	}
	.contact .contain{
	    width: 90%;
	}
	.contact .box {
        width:100%;
	}
	.payWays .tt2 img {
        width: 50%;
    }
}
@media(max-width: 676px){
	body,html{
		font-size: 54%;
	}
	.n_top{
	    line-height: 50px;
	}
	.logo {
	    height: 42px;
	}
	.banner .swiper-slide img{
		width: 180%;
		margin-left: -40%;
	}
	.txt_all{
		bottom: inherit;
		top: 50%;
		transform: translateY(-50%);
	}
	.txt_all p{
		font-size: 3rem;
		width: 90%;
	}
	.more{
		line-height: 46px;
	}
	.title h3{
		font-size: 3rem;
	}
	.indexBars{
		padding: 12% 0;
	}
	.index_bar2 ul{
		flex-wrap: wrap;
	}
	.index_bar2 ul li {
		display: block !important;
	}
	.index_bar2 ul li{
		width: 48%;
	}
	.index_bar2 ul li .add img{
		height: 16px;
	}
	.index_bar2 .txt{
		margin-top: 5%;
	}
	.index_bar2 .more{
		margin-top: 8%;
	}
	.index_bar4 .contain{
		display: block;
		position: relative;
		height: 100%;
	}
	.index_bar4 .left{
		width: 100%;
		padding-top: 110%;
	}
	.index_bar4 .right{
		width: 100%;
		position: absolute;
		left: 0;
		top: 0;
		height: 100%;
	}
	.index_bar5 ul{
		display: block;
	}
	.index_bar5 ul li{
		width: 100%;
		margin: 5% 0 10%;
	}
	.footer .top{
		padding: 10% 0;
	}
	.footer .top ul li i{
		font-size: 2.6rem;
	}
	.footer .bottom{
		padding: 10% 0;
	}
	.footer .bottom .contain{
		display: block;
	}
	.footer .rr{
		width: 100%;
	}
	.footer .rr dt{
		margin-bottom: 10px;
	}
	.footer .left{
		width: 100%;
		margin-top: 3%;
	}
	.footer .copyright{
		display: block;
		text-align: center;
		margin-top: 5%;
	}
	.footer .copyright p{
		display: block;
	}
	.footer .copyright a{
		display: block;
		margin: 5px 0;
	}
	.footer .copyright .pays{
		justify-content: center;
		margin-top: 20px;
	}
	.footer .copyright .pays img{
		width: 24px;
		margin-left: 8px;
	}
	.pro_l ul li:nth-of-type(3n) {
        margin-right: 3%;
    }
    .pro_l ul li:nth-of-type(2n) {
        margin-right: 0;
    }
    .pro_l .right .top .flitt0{
        width: 112px;
    }
    .pro_l .right .top{
        margin:1rem auto 2rem;
    }
    .pro_d .bar3 ul{
        padding-top: 4%;
    }
    .pro_d .bar4 .contain{
        display: block;
    }
    .pro_d .bar4 .contain .left{
        width: 100%;
    }
    .pro_d .bar4 .contain .right{
        width: 100%;
        margin-top: 3%;
    }
    .pro_d .bar4 .contain .right h3{
        font-size: 2.6rem;
    }
    .about .bar1 .contain{
	    display: block;
	}
	.about .bar1 .left{
	    width: 100%;
	    margin: 0;
	}
	.about .bar1 .right{
	    width: 100%;
	    margin:10% 0 0;
	}
	.about h4{
	    font-size: 2.4rem;
	}
	.about .bar2 ul{
	    display: block;
	}
	.about .bar2 ul li{
	    width: 100%;
	    margin: 5% 0;
	}
	.allbars2{
	    padding: 10% 0;
	}
	.about .bar3 .btns {
        right: 1%;
        transform: translateY(-50%) scale(0.8);
	}
    .tk .box{
	    width: 90%;
	}
	.o_nav ul li.now2{
	    display: none;
	}
	.news_d .bar{
	    display: block;
	}
	.news_d .right{
	    width: 100%;
	    margin-top:8%;
	}
	.news_d h1{
	    font-size: 2.2rem;
	    text-align: center;
	    line-height: 1.5;
	}
	.checkouts .bar {
        display: block;
	}
	.checkouts .bar .bar_ll {
        display: block;
        padding: 8%;
        width: 100%;
        min-height: auto;
    }
	.checkouts .bar .bbs {
        width: 100%;
    }
    .checkouts .bar .bar_rr {
        padding: 8%;
        width: 100%;
    }
    .checkouts .bar .barss {
        width: 100%;
    }
    .payWays .tt2 img {
        width: 70%;
    }
	
}