/*pad*/

img {
    max-width: 100%;
}

.gh {
    height: 24px;
    width: 24px;
    position: absolute;
    transition: all 0.5s cubic-bezier(0.7, 0, 0.3, 1) 0s;
    -webkit-transition: all 0.5s cubic-bmezier(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 .gh {
    transform: rotate(90deg);
}

.gh a {
    background-color: #552d2b;
    display: block;
    margin: 0 auto;
    height: 2px;
    margin-top: -1px;
    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;
}

.gh a:after {
    width: 100%;
}

.gh a:before {
    width: 100%;
}

.gh a:after,
.gh a:before {
    background-color: #552d2b;
    content: "";
    display: block;
    height: 2px;
    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;
}

.gh a:after {
    top: 7px;
}

.gh a:before {
    top: -7px;
}

.selected .gh a:after,
.selected .gh a:before {
    top: 0;background: #552d2b;
}

.selected .gh a:before {
    transform: translateY(0px) rotate(-45deg);
    -webkit-transform: translateY(0px) rotate(-45deg);
    -ms-transform: translateY(0px) rotate(-45deg);
    width: 100%;
}

.selected .gh a:after {
    transform: translateY(0px) rotate(45deg);
    -webkit-transform: translateY(0px) rotate(45deg);
    -ms-transform: translateY(0px) rotate(45deg);
    width: 100%;
}

.selected .gh a {
    /* background-color: transparent !important; */
	background: #552d2b;
}

@media only screen and (max-width:1680px) {
    .naver li a{
        font-size: 0.8rem;
    }
    .header .icon dd a img{
        width: 1.6rem;
    }
}
@media only screen and (max-width:1580px) {
    .header .logo a {
        font-size: 1rem;
        color: #552d2b;
    }
}
@media only screen and (max-width:1240px) {}
@media only screen and (max-width:992px) {
	h2{
		font-size: 20px !important;
	}
	h3{
		font-size: 18px !important;
	}
	h4{
		font-size: 16px !important;
	}
	p,
	h5,
	h6{
		font-size: 14px !important;
	}
	
	.wrap {
		width: auto;
		padding: 0 15px;
	}	
	html{
		font-size: 16px;
	}
	.uittops{
		display: none;
	}
	.header .tps{
		padding: 5px 0 !important;
	}
	.header .tps .wrap{
		height: 45px;
	}
	.header .fms{
		display: none;
	}
	.gh{
		display: block;
		position: static;
		margin-left: 20px;
	}
	.hnaver ul{
		display: block;
	}
	.hnaver{
		position: absolute;
		left: 0;right: 0;top: 100%;
		background: #fff;
		display: none;
	}
	.hnaver li::before{
		display: none;
	}
	.header .wrap{
		padding: 0 15px;
	}
	.naver li a{
		font-size: 16px;
		line-height: 46px;
		padding: 0 20px;
	}
	.layout{
		padding-top: 60px;
	}
	
	.footer .tps .wrap{
		display: block;
	}
	.footer .cent{
		width: auto;
		display: block;
		display: none;
	}
	.footer .cent dl{
		padding: 0;
	}
	.footer .cent dl:nth-child(1):before,
	.footer .cent::before, .footer .cent::after{
		display: none;
	}
	.footer .lts{
		justify-content: center;
	}
	.footer .lts h6{
		margin-top: 0;
		margin-left: 10px;
	}
	.footer .tps{
		padding: 20px 0;
	}
	.footer .rts{
		margin: 20px auto 0;
	}
	.hbkpage1 .eswiper{
		display: block;height: auto;
	}
	.hbkpage1 .eswiper .lts{
		width: auto;
	}
	.hbkpage1 .eswiper .rts{
		width: auto;height: 300px;
		margin: 15px 0 0;
	}
	.hbkpage3 .wrap{
		display: block;
	}
	.hbkpage3 .uitlts{
		width: auto;
	}
	.hbkpage3 .uitrts{
		width: auto;margin: 20px 0;
	}
	.bkhoblog li .pic{
		height: auto;
	}
	.hbkpage4 li{
		width: calc((100% - 15px)/2) !important;
		margin: 0 0 10px 0 !important;
	}
	.hbkpage4 li:nth-child(2n){
		margin-right: 0;
	}
	.hbkpage4 ul{
		justify-content: space-between;
	}
	.header .naver{
		margin-right: 0;
		position: absolute;
		left: 0;right: 0;
		top: 100%;
		display: none;
	}
	.header .naver ul{
		display: block;
		background: #fff;
	}
	.header .naver li{
		margin: 0;position: relative;
	}
	.header .naver li i{
		position: absolute;
		right: 0;top: 0;width: 46px;height: 46px;
		background: url(../images/ar.png) no-repeat center/20px auto;
		transition:all 0.3s;
		-ms-transition:all 0.3s;  /* IE 9 */
		-moz-transition:all 0.3s;     /* Firefox */
		-webkit-transition:all 0.3s; /* Safari 和 Chrome */
		-o-transition:all 0.3s;
	}
	.header .naver li h3 a{
		font-size: 16px;
		line-height: 46px;
		padding: 0 20px;
		border-bottom: 1px solid #f1f1f1;
	}
	.header .naver li i.on{
		transform: rotate(180deg);
	}
	.naver li dd a{
		padding: 0 20px;
		text-align: left;
		font-size: 14px;
	}
	.naver li dl{
		position: static;transform: translateX(0%);
	}
	.header{
		height: auto;
	}
	.header .wrap{
		height: 60px;
	}
	.bokboxs{
		display: block;
	}
	.uitlts{
		width: auto;
	}
	.uitrts{
		width: auto;
	}
	.wenzdel .hs h1{
		font-size: 22px;
	}
	.whot .wrap{
		height: auto;
	}
	.header .logo img{
		width: auto;
		height: 40px;
	}
	.header .flex{
		align-items: center;
	}
	.header .icon dl{
		display: none;
	}
	.gh a{
		margin: 0 !important;
	}
	.header .logo a{
		font-size: 16px;white-space: inherit;
	}
	.ubanner{
		height: 50vw;
	}
	.habout .hflex{
		display: block;
	}
	.habout .pic{
		width: auto;
	}
	.habout .text{
		width: auto;
		margin-top: 20px;
	}
	.thproduct ul{
		display: block;
	}
	.thproduct li{
		width: auto;
		margin-bottom: 20px;
	}
	.thproduct{
		padding: 40px 0;
	}
	.hchapfl{
		margin-top: 0;
	}
	.footer .tab dl:nth-child(2),
	.footer .tab dl:nth-child(1){
		display: none;
	}
	.header .naver li{
		border-bottom: 1px solid #f1f1f1;
	}
	.qmbanner{
		height: 40vw;
	}
	.about .bd .wrap{
		display: block;
	}
	.about .bd .text{
		width: auto;
		padding-top: 30px;
	}
	.about .bd .text h3{
		margin-top: 20px;
	}
	.about .bd .pic{
		width: auto;
		margin: 20px 0 0;
	}
	.pinpzmd{
		padding: 30px 0;
	}
	.pinpzmd .wrap{
		display: block;
	}
	.pinpzmd .text{
		width: auto;
	}
	.pinpzmd .swipers{
		width: auto;
		margin-top: 20px;
	}
	.pinpzmd .tx{
		margin-top: 20px;
	}
	.pinpzmd .swipers .swiper-slide{
		border-radius: 10px;
	}
	.cailiao li{
		display: block;
	}
	.cailiao li .pics{
		width: auto;
	}
	.wrap2{
		padding: 0 15px;
	}
	.cailiao li{
		margin-top: 20px;
	}
	.cailiao li .text{
		padding: 15px 0;
		margin: 0 !important;
	}
	.utit i{
		font-size: 22px;
	}
	.cailiao{
		padding: 40px 0;
	}
	.pban{
		height: 40vw;
	}
	.newproduct{
		padding: 40px 0;
	}
	.newproduct .flex{
		display: block;
		margin-bottom: 20px;
	}
	.newproduct .flex ul{
		width: auto;
	}
	.newproduct .flex h3{
		text-align: center;
		margin-bottom: 20px;
	}
	.newproduct .flex ul,
	.mproduct ul{
		justify-content: space-between;
	}
	.mproduct li{
		width: 49%;padding: 0;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		-o-box-sizing: border-box;
		box-sizing: border-box;
		margin-bottom: 10px;
	}
	.newproduct .flex li{
		width: 49%;border: 1px solid #f9f9f9;
		margin-bottom: 10px;
	}
	.newproduct .flex li a{
		padding: 10px;
	}
	.mproduct li .picov,
	.newproduct .flex li .picov{
		width: 100%;height: 40vw;
	}
	.mproduct{
		padding: 40px 0;
	}
	.mproduct li h4{
		margin: 10px 0;
	}
	.prodel .pro1 .wrap{
		display: block;
	}
	.prodel .pro1 .lts{
		width: auto;
	}
	.prodel .pro1 .rts{
		width: auto;
		margin: 0;
		padding: 20px 0;
	}
	.prodel .pro1 .lts .hs .swiper-slide{
		height:70vw;
	}
	.prodel .pro1{
		padding: 40px 0 0;
	}
	.prodel .pro1 .rts h1{
		font-size: 20px;
	}
	.prodel .pro3 .del{
		padding: 20px 0;
	}
	.prodel .pro1 .rts p{
		margin: 20px 0;
	}
	.prodel .pro3{
		padding: 0 0 30px;
	}
	.prodel .pro1 .rts .boxc{
		flex-wrap: wrap;
	}
	.prodel .pro1 .rts .boxc a{
		margin-bottom: 10px;
	}
	.tban .video{
		height: 40vw;
	}
	.unext, .uprev{
		width: 40px;height: 40px;
	}
	.hproduct .porc{
		padding: 0 50px;
	}
}
@media only screen and (max-width:768px) {
	
	.footer .wrap{
		display: block;
	}
	.footer .tab dd a{
		font-size: 16px;
	}
	.footer{
		padding: 30px 0 0;
	}
	.footer .emflex{
		width: auto;
	}
	.copyright a{
		font-size: 14px;
	}
	.copyright{
		padding: 15px;
	}
	.footer .tab{
		display: block;
		margin: 20px 0;
	}
	.footer .tab dt{
		font-size: 16px;
	}
	.footer .tab dd{
		margin-top: 5px;
	}
	.thproduct li a{
		display: block;
	}
	.thproduct li .pic{
		width: auto;
	}
	.thproduct li .text p{
		width: auto;
		margin: 15px 0;
	}
	.hchapfl li img{
		height: 50vw;
	}
	.thproduct li .text{
		padding: 20px 0 !important;
		text-align: left !important;
		display: block !important;
	}
	.thproduct li:nth-child(2n) .text .ar{
	    margin: 0;
	}
	.mtanc .close{
	    right: 0;top: -30px;
	}
	.thproduct li .text h3{
	    text-align: left;
	}
	.whot{
		display: none;
	}
	.header .kef{
		display: none;
	}
	.header .logo a{
		font-size: 14px;font-weight: bold;
	}
	.header .lsele{
		font-size: 13px;min-width: 40px;
		line-height: 30px;
	}
	.hpad{
		padding: 40px 0;
	}
	.mtanc{
	    width: auto;
	    margin: 0 15px;padding: 15px;
	}
	.webshow{
        display: block;
    }
    .header .logo a{
        font-size: 12px;
    }
	.header .naver{
	    background: #fff;
	}
	.header .naver dl.webshow{
	    display: flex;
	    padding: 20px;
	}
	.header .naver dl.webshow dd img{
	    width: 30px;
	}
	.header .naver dl.webshow dd{
	    margin: 0 15px 0 0;
	}
	.naver li.on a, .naver li a:hover{
	    border-color: #eee;
	}
	.footer .logo{
	    font-size: 12px;
	}
	
	
	.header .naver dl.webshow{
	    justify-content: space-between;
	}
.header .naver dl.webshow li a{
    padding: 0;position: relative;
}
.header .naver dl.webshow li a img{
    width: 50px;
}
.header .naver dl.webshow li a img:nth-child(2){
    width: 10rem;z-index: 11;
    position: absolute;top: 100%;height: auto;
    left: 50%;transform: translateX(-50%);max-width: 10rem;
    display: none;
}

.header .naver dl.webshow li a:hover img:nth-child(2){
    display: block !important;
}
}