

/* 样式初始化和通配样式 */

@font-face {

    font-family: 'myfont';

    font-display: swap;

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

}

/* @font-face {

    font-family: 'fontBold';

    font-display: swap;

    src: url('./PINGFANG_HEAVY.TTF'); 

} */

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; font-weight: normal;line-height: 1.8em;}

*{ margin: 0 ;padding: 0;}

body{font-family:"myfont";}

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

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

ol,ul{list-style:none;}

input{outline:medium;}

















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

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



@media (min-width:750px){

.ShowHeader{background: #1a2c38; height: 140px; width: 100%;}

    header{position: fixed;  z-index: 15;}

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

    .navC{color: #194089 !important;}

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

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

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

    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: #194089;}

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

    .logo{position: fixed;top: 30px; left: 45px;}


}

@media (max-width:750px){

    .ShowHeader{background: #1a2c38; height: 80px; width: 100%;}

    header{position: fixed;  z-index: 3;}

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

    .navC{color: #194089 !important;}

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

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

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

    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: #194089;}

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

    .logo{position: fixed;top: 20px; left: 20px;}
	.logo img{ width:300px;}


}



@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; font-weight: bold; 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; font-weight: bold; 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){



    .navButton {position: fixed; display: block; width: 45px; height: 40px; right: 60px; top: 30px; 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: 45px; top: 0;}

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

    .navButton span:nth-child(3){width: 25px; 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: #194089;}

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

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

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

    .navButtonColse::after{display: none;}

    .elseHref{position: fixed; top: 30px; width: 160px; right: 280px; display: flex; justify-content: space-between;}

    .productBt{position: fixed; top: 30px; right: 170px; height: 40px;}

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

}

@media (max-width:750px){



    .navButton {position: fixed; display: block; width: 45px; height: 40px; 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: 45px; top: 0;}

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

    .navButton span:nth-child(3){width: 25px; 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: #194089;}

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

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

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

    .navButtonColse::after{display: none;}

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

    .productBt{position: fixed; top: 10px; right:90px; height: 40px; transform: scale(.8);}

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

}



