@font-face {

    font-family: 'myfont';

    font-display: swap;

    src: url('./Montserrat-Medium.otf'); 

}


body,div,span,h1,h2,h3,h4,h5,h6,p,a,ol,ul,li,img,form,dl,dt,dd,input,input{ margin: 0 ;padding: 0; font-size:100%; font-style:normal;line-height: 1.8em;}

*{ margin: 0 ;padding: 0;}

body{font-family:"myfont";background: transparent;}

img,fieldset{ border:0 none; display:block;}

a{color: inherit;text-decoration: none;}

ol,ul{list-style:none;}

input{outline:medium;}







.mainShow{padding-top: 300px; font-weight:normal }

.productMain h4{font-weight:normal}
.zkFenlei a{font-weight:normal }
.zkFenlei h2{font-weight:normal}



.fenye{text-align: center;}

.fenye>div{display: inline-block; width: auto !important;}

.fenye>div a{display: inline-block; width: 40px; height: 40px; border: 1px solid #194089; line-height: 38px; box-sizing: border-box; margin: 0 7px; color: #194089;}

.fenye>div a:hover{background-color: #ededed !important;}

.fenyeC{background-color: #ededed !important;}



.showNext{display: flex; justify-content: space-between;}

.showNext a{position: relative; line-height: 35px; font-size: 1.35rem; color: #395795; }

.showNext a{opacity: .5; -webkit-filter: grayscale(100%);filter:progid:DXImageTransform.Microsoft.BasicImage(graysale=1);}

.showNext a:hover{opacity: 1;  -webkit-filter: none}

.showNext a::after{opacity: .5; -webkit-filter: grayscale(100%);filter:progid:DXImageTransform.Microsoft.BasicImage(graysale=1);}

.showNext a:hover::after{opacity: 1;  -webkit-filter: none}

.showNext a::after{position: absolute; top: 50%; transform: translate(0,-50%); content: ""; width: 35px; height: 20px; background: url("../img/ico/jiantou.png") no-repeat center; background-size: 35px 20px;}

.showNext a:nth-child(1){padding-left: 50px;}

.showNext a:nth-child(1)::after{left: 0; transform: translate(0,-50%) rotate(-90deg) scale(.8); }

.showNext a:nth-child(2){padding-right: 50px;}

.showNext a:nth-child(2)::after{right: 0; transform: translate(0,-50%) rotate(90deg) scale(.8); }



@media (max-width:750px){

    .mainShow{padding-top: 10px;}

    .showNext{display: block;}

    .showNext a{ display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; position: relative; overflow: hidden; margin-bottom: 30px;}

}



.swiper-slide img{max-width: 100%;}

::-webkit-scrollbar { /*滚动条整体样式横竖滚动条的尺寸*/ width: 0;  height: 2; } 



@media (min-width:750px){

.ShowHeader{height:170px; width: 100%;}


    nav{height: 100vh; position: fixed;  display: none; box-sizing: border-box; padding-top: 70px; width: 460px; right: 0; z-index: 3; background: #f5f5f5;}

    .navC{color: #1C943A !important;}

    nav ul h1{line-height: 60px;font-size: 1.35rem; transition: all 0.5s; font-weight:normal}

    nav ul{border-bottom: 1px solid #000000; color: #999999; margin: 0 auto; width: calc(100% - 80px);}

    nav ul:hover h1{color: #000000; }

    nav ul>li{line-height: 2.2em; font-size: 1.0125rem; display:none ; padding-left: 15px; position: relative;}

    nav ul>li::after{position: absolute; left: 5px; top: 50%; transform: translate(0,-50%); width: 3px; height: 3px; background: #999999; content: "";}

    nav ul>li:hover::after{background: #000000;}

    nav ul>li:hover{color: #000000; }

   .logo{position: absolute;top: 10px; left: 45px;}


}

@media (max-width:750px){

    .ShowHeader{ height: 180px; width: 100%;}

    header{position: fixed;  z-index: 999; background:#fff; top:0}

    nav{height: 100vh; position: fixed; display: none; box-sizing: border-box; padding-top: 55px; width: 100vw; right: 0; z-index: 999; background: #f5f5f5;}

    .navC{color: #E40016 !important;}

    nav ul h1{line-height: 60px;font-size: 1.35rem; transition: all 0.5s;}

    nav ul{border-bottom: 1px solid #000000; color: #999999; margin: 0 auto; width: calc(100% - 80px);}

    nav ul:hover h1{color: #000000; }

    nav ul>li{line-height: 2.2em; font-size: 1.0125rem; display:none ; padding-left: 15px; position: relative;}

    nav ul>li::after{position: absolute; left: 5px; top: 50%; transform: translate(0,-50%); width: 3px; height: 3px; background: #999999; content: "";}

    nav ul>li:hover::after{background: #000000;}

    nav ul>li:hover{color: #000000; }

     .logo{position:fixed;left: 10px; }
	.logo img{ width:200px; margin-top:10px;}



}



@media (min-width:750px){

    

.shouNav{position: fixed; top: 140px; width: 100%; z-index: 13; display: flex; justify-content: space-between; background: #eeeeee;}

.shouNav h1{padding-left: 90px; font-size: 2.7rem; line-height: 90px;}

.shouNav div{padding-right: 45px; }

.shouNav div a{padding: 0 30px; display: inline-block; border: 2px solid #999999; transition: all .5s; color: #999; margin: 35px 0; margin-right: 20px; border-radius: 5px;}

.shouNav div a:hover{ border: 2px solid #194089; color: #194089;}

.shouNavC{ border: 2px solid #194089 !important; color: #194089 !important;}

}



@media (max-width:750px){

    

    .shouNav{background: #eeeeee; transition: all .5s;}

    .shouNav h1{ font-size: 1.7rem; line-height: 70px;text-align: center;}

    .shouNav div{text-align: center; display: none;}

    .shouNav div a{padding: 0 30px; display: inline-block; border: 2px solid #999999; transition: all .5s; color: #999; margin: 10px 0; margin-right: 20px; border-radius: 5px;}

    .shouNav div a:hover{ border: 2px solid #194089; color: #194089;}

    .shouNavC{ border: 2px solid #194089 !important; color: #194089 !important;}

    }

    





@media (min-width:750px){

    footer{background: #1a2c38;}

    .footer1{width: 98%; margin: 0 auto; display: flex; justify-content: space-between; color: #fff; padding: 45px 0; position: relative;}

    .footerForm{width: 280px;}

    .footerForm input{background: rgba(0,0,0,0); box-shadow: none; border:1px solid #fff;}

    .footerForm textarea{background: rgba(0,0,0,0); width: 100%; border:1px solid #fff; height: 85px; color: #fff;}

    .footerForm div h1{line-height: 45px;}

    

    .footerForm input[type="Email"]{border: none; border-bottom: 1px solid #fff; width: 100%; color: #fff;}

    .footerForm input[type="Submit"]{border: 1px solid #fff; background: #fff; width: 100px; height: 35px; margin-top: 10px;}

    

    .footerAbout{display: flex; justify-content: space-between; width: 650px;}

    .footerAbout>div{width: 325px;}

    .footerAbout>ul{width:150px;}

    .footerAbout>ul>li img{padding: 10px 0;}

    .yinliu{position: absolute; bottom:60px; display: flex; justify-content: space-between; }

}

@media (max-width:750px){

    footer{background: #011e2c;}

    .footer1{width: calc(100% - 40px); margin: 0 auto; color: #fff; padding: 45px 0;}

    .footerForm{width: 280px;}

    .footerForm input{background: rgba(0,0,0,0); box-shadow: none; border:1px solid #fff;}

    .footerForm textarea{background: rgba(0,0,0,0); width: 100%; border:1px solid #fff; height: 85px; color: #fff;}

    .footerForm div h1{line-height: 45px;}

    

    .footerForm input[type="Email"]{border: none; border-bottom: 1px solid #fff; width: 100%; color: #fff;}

    .footerForm input[type="Submit"]{border: 1px solid #fff; background: #fff; width: 100px; height: 35px; margin-top: 10px;}

    

    .footerAbout{
        padding-top: 70px;
    }

    .footerAbout>div{width: 325px;}
    .footerAbout>div p{line-height: 1.5em;}

    .footerAbout>ul{margin-top: 20px;}

    .yinliu {display: flex; padding-top: 40px;}

    .yinliu a{padding-right: 10px;}

}







@media (min-width:750px){

    .navButton {position: absolute; display: block; width: 45px; height: 30px; right: 40px; top: 60px; cursor: pointer;}
    .navButton span{display: block; height: 4px; background: #fff;position: absolute; border-radius: 5px; transition: all 0.5s;}

    .navButton span:nth-child(1){width: 40px; top: 0;}

    .navButton span:nth-child(2){width: 40px; top: 50%; transform: translate(0,-50%);}

    .navButton span:nth-child(3){width: 40px; bottom: 0;}

    .navButton::after{content: "Menu"; position: absolute; bottom: -10px; left: 50%; color: #fff; transform: translate(-50%,100%);}

    

    .navButtonColse{z-index: 4;}

    .navButtonColse span{ margin-left: 20px; background: #000;}

    .navButtonColse span:nth-child(1){transform: rotate(45deg) translate(0,18px);}

    .navButtonColse span:nth-child(2){display: none;}

    .navButtonColse span:nth-child(3){width: 40px; transform: rotate(-45deg) translate(0,-18px);}

    .navButtonColse::after{display: none;}

     .elseHref{position: absolute; top: 120px;  left: 150px; display: flex; justify-content: space-between; font-size:40px; text-transform:uppercase}

	

}

@media (max-width:750px){



    .navButton {position: fixed; display: block; width: 45px; height: 30px; right: 20px; top:10px;  cursor: pointer; transform: scale(.8);}

    .navButton span{display: block; height: 4px; background: #fff;position: absolute; border-radius: 5px; transition: all 0.5s;}

    .navButton span:nth-child(1){width: 40px; top: 0;}

    .navButton span:nth-child(2){width: 40px; top: 50%; transform: translate(0,-50%);}

    .navButton span:nth-child(3){width: 40px; bottom: 0;}

    .navButton::after{content: "Menu"; position: absolute; bottom: -10px; left: 50%; color: #fff; transform: translate(-50%,100%);}

    

    .navButtonColse{z-index: 1000;}

    .navButtonColse span{ margin-left: 20px; background: #000;}

    .navButtonColse span:nth-child(1){transform: rotate(45deg) translate(0,18px);}

    .navButtonColse span:nth-child(2){display: none;}

    .navButtonColse span:nth-child(3){width: 40px; transform: rotate(-45deg) translate(0,-18px);}

    .navButtonColse::after{display: none;}
	
    .elseHref{position: fixed; width: 160px; right: 20px; bottom: 20px; display: flex; justify-content: space-between; display: none;}
    

}



/* 视频 */

.videoWin{position: fixed; left: 0; top: 0; z-index: 9; width: 100%; height: 100%; background: rgba(0, 0, 0, .8); display: none;}

.videoWin video{position: fixed; left: 50%; top: 50%; z-index: 9;width: 47.1%; transform: translate(-50%,-50%);}





.videoColse{position: fixed; top: 21vh; right: 16.3vw; cursor: pointer;}

.videoColse span{position: absolute; width: 45px; height: 4px; border-radius:20px; display: block; background: #fff;}

.videoColse span:nth-child(1){transform: rotate(45deg) ;}

.videoColse span:nth-child(2){transform: rotate(-45deg) ;}

.videoList div{cursor: pointer;}

.videoList div img{width: 100%; position: relative; opacity: .6;}

.videoList div{width: 100%; position: relative; background: #000;}

.videoList div::after{position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 60px; height: 60px;  background: url(../img/ico/paly.png) no-repeat; content: ""; background-size: 60px 60px;}

.videoList div:hover::after{opacity: .5;}

.videoList div:hover img{opacity: .8;}

.videoList>a{display: block; background: #fff; padding: 15px 5px;}

.videoList>a p{display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden;}



@media (max-width:750px){

    

.videoWin video{position: fixed; left: 50%; top: 50%; z-index: 9;width: calc(100% - 40px); transform: translate(-50%,-50%);}

}
body{ background:url(../images/bg.jpg); background-size: cover;}
.indexMain{display: flex; justify-content: space-between; width: 100%; margin: 0 auto; margin-top: 10px; }
.index_banner{display: flex; justify-content: space-between; margin:20px 5px; position: relative;}
.index_banner_left{ width:50%; overflow:hidden;}
.index_banner_right{ width:50%; overflow:hidden}
.index_banner_right img {
    width: 100%;
    height: 100%;
}
.index_banner_left img {
    width: 100%;
    height: 100%;
}
.index_banner_left:hover img,.index_banner_right:hover img {
 -moz-transform:scale(1.05); -webkit-transform:scale(1.05); -o-transform:scale(1.05); transform:scale(1.05);
 transition: 0.7s;
}
.index_product{display: flex;}
.index_product p{text-align:center; background:#FFF; padding:10px; z-index:2; width:320px; margin:0 auto; margin-top:-65px; font-size:30px;}
.index_product_tab{display: flex;}
.index_product_tab p{text-align:center;  padding:10px; font-size:16px; width:400px; margin:0 auto;text-transform:uppercase; z-index:999}
.index_product_tab p>a{ margin-left:50px;}
.index_product_tab p a{ padding:0 15px; display:block; float:left; text-align:center;}
.index_product_tab .selected{color:#cd392d;margin-top: -2px;}
.swiper-slide:hover img{
 -moz-transform:scale(1.05); -webkit-transform:scale(1.05); -o-transform:scale(1.05); transform:scale(1.05);
 transition: 0.7s;

}
.foot_index{ text-align:center; color:#FFF; margin-top:300px;}
@media screen and (min-width: 2600px) {
.foot_index{ margin-top:1000px;	}
}
@media screen and (max-width: 2000px) {
.foot_index{ margin-top:400px;	}
}
@media screen and (max-width: 1500px) {
.foot_index{ margin-top:300px;	}
}
@media screen and (max-width: 750px) {
	
 .indexMain{display: flex; justify-content: space-between; width: 100%; margin: 40px auto; }
 .index_banner{margin:2px 5px;}
 .index_product p{text-align:center; background:#FFF; padding:10px; z-index:1 ;  margin:0 auto; margin-top:0px; font-size:18px;}
 .index_product_tab p{text-align:center;  padding:10px; font-size:16px; width:400px; margin:0 auto 40px auto;text-transform:uppercase; z-index:1}

}
@media screen and (max-width: 400px) {
	
 

}
/*slide*/

* {
  box-sizing: border-box;
}
.indexMain{ width:80%}
.content {
  display: flex;
  flex-wrap: wrap;
  margin-top: 10px;
}

.wrapper {
  width: 20%;
  max-height: 200px;
  padding: 20px;
}


.box {
  position: relative;
  /*max-height: 300px;*/
  border-radius: 10px;
  overflow: hidden;
 
}

.box h2{
  position: absolute;
  color: #ffffff;
  z-index: 99;
  width: 100%;
  font-weight: 500;
  font-size: 22px;
  bottom:0;
  text-align: center;
 -webkit-box-reflect: below 2px linear-gradient(transparent, rgba(0, 0, 0, .5));

}
.box p {
  bottom: 0;
  font-size: 14px;
  letter-spacing: 1px;
}
.box:hover {
  transition: all .3s ease-in-out;
}
.box:hover:before {
  transition: all .3s ease-in-out;
}
.box img {
  position: relative;
  width: 100%;
  height: 100%;
  z-index: 1;
  transition: all .3s ease-in-out;
}
.box img:hover {
  transition: all .3s ease-in-out;
}
.box:hover img {
 -moz-transform:scale(1.05); -webkit-transform:scale(1.05); -o-transform:scale(1.05); transform:scale(1.05);
 transition: 0.7s;
}

.box img:after {
  content: '';
  position: absolute;
  background-color: rgba(0, 0, 0, 0.6);
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  opacity: 0;
}


.vintage h2 {
  top: 50%;
  transform: translate3d(0, 60px, 0);
  text-align: center;
}
.vintage p {
  opacity: 0;
  bottom: 0;
  transform: translate3d(0, -10px, 0);
  font-size: 14px;
  letter-spacing: 1px;
  text-align: center;
}
.vintage:before {
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  /* background: linear-gradient(to bottom, rgba(72, 76, 97, 0) 0%, rgba(72, 76, 97, 0.8) 75%);*/
  z-index: 2;
  bottom: -100%;
  left: 0;
}
.vintage:hover:before {
  bottom: 0;
}
.vintage:hover h2 {
  bottom: 40px;
  transform: translate3d(0, 20px, 0);
}
.vintage:hover p {
  opacity: 1;
  transform: translate3d(0, -30px, 0);
}


@media screen and (min-width: 2000px) {
	.wrapper {
  max-height: 600px;
}
  .content {

  padding: 0 3px;
}


}
@media screen and (max-width: 750px) {
	
.content {
  margin-top: 10px;
}

.wrapper {
  width: 50%;
  height:100%;
  padding: 20px;
}
.box h2{
  position: absolute;
  color: #ffffff;
  z-index: 99;
  width: 100%;
  font-weight: 500;
  font-size: 15px;
  bottom:0;
  text-align: center;
 -webkit-box-reflect: below 2px linear-gradient(transparent, rgba(0, 0, 0, .5));

}

}