html{ font-family:"arial","FontAwesome";background-color: #fff; font-size: 14px;}
body{ font-size: 14px;}
a{color:#333; text-decoration: none;}
a:hover{color:#025b9a; text-decoration: none;}
.container{width: 1200px;}
.head-top{ background: #025b9a; color:#fff; padding: 15px 0;}
.head-top a{ color:#fff;}
.head-top>.flex{ justify-content: space-between;}
.head-top .other div{ margin: 0 10px; position: relative;}
.head-top .other div:before{ position: absolute; left:0; top:50%; transform: translateY(-50%);}
.head-top .tel{ padding-left:25px;}
.head-top .tel:before{ content:"\f095"; margin-right: 10px;font-size: 18px; }
.head-top .email{ padding-left: 25px;}
.head-top .email:before{ content:"\f27a" ;margin-right: 10px; font-size: 18px;}

.logo_nav{ padding: 20px 0;position: relative; }
.logo_nav>.flex{ justify-content: space-between; }
.logo_nav .logo {}
.logo_nav .main-nav{}
.logo_nav .navli1{ position: relative;}
.logo_nav .navli1 .nava1{height: 100%;  padding: 0 20px; font-size: 18px; align-items: center;}
.logo_nav  .active11 .nava1
,.logo_nav  .navli1:hover .nava1
{  background: #025b9a; color:#fff; }
.logo_nav  .navul2{ position: absolute; z-index: 999999; left:0; top:200%; transition: 200ms; background: #f8f8f8; padding: 10px 0; visibility: hidden; opacity: 0;}
.logo_nav .navli1:hover .navul2{ top:100%; visibility: visible; opacity: 1;}
.logo_nav .nava2 { display: block; padding: 5px 20px; }
.logo_nav .nava2:hover{ background: #025b9a; color:#fff;}
.logo_nav .navli1 .navli2{ position: relative}
.logo_nav .navli1 .prolist{border-left:2px solid #fff;visibility: hidden; opacity: 0; position: absolute; top:0;left:100%; background-color: #f8f8f8; min-width: 100% ;}
.logo_nav .navli1 .prolist  .itema{display: block; padding: 5px 20px;}
.logo_nav .navli1 .navli2:hover .prolist{visibility: visible; opacity: 1;}
.logo_nav .navli1.navli_6{ position: static;}
.logo_nav .navli1.navli_6 .navul2{ width:100%;}
.logo_nav .navli1.navli_6 .navli2{ float: left; margin-right: 30px; margin-bottom: 30px;}
.logo_nav .navli1.navli_6 .nava2 { display: block; padding: 5px 0px 5px; background-color: transparent; color:#333; font-weight: bold;}

.logo_nav .navli1.navli_6 .itema{color:#8c8c8c; display: block; width:100%; height: 30px; line-height: 30px;}
.logo_nav .navli1.navli_6:hover .navul2{ transform: translateY(-20px);}
.logo_nav .navli1.navli_6 .nava2:hover
,.logo_nav .navli1.navli_6 .itema:hover
{color:#025b9a;}



.index-item{max-width: 1920px; margin-right: auto; margin-left: auto;}
.index-pro-class  .classpath{ margin-top: 20px;}
.index-pro-class  .classpath a{ display: block; width:100%; height: 100%; overflow: hidden;}
.index-pro-class .grid{ display: grid; grid-template-columns: repeat(4,1fr); grid-template-rows: auto; grid-gap: 20px}
.index-pro-class .classpath1{ overflow: hidden;}
.index-pro-class .classpath1 .pic{position: relative; padding-bottom: 100%;border: 1px solid #f8f8f8; overflow: hidden; transition: 500ms;}
.index-pro-class .classpath1 .pic img{ position: absolute ; top:0; left:0; width:100%; height: 100%; object-fit: contain ;transition: 500ms;}
.index-pro-class .classpath2{ width:100%;}
.index-pro-class  .classpath img{ transition: 500ms;}
.index-pro-class  .classpath:hover img{ transform: scale(1.1);}
.index-pro .list{ display: grid; grid-template-columns: repeat(4,1fr); grid-template-rows: auto; grid-gap: 20px}
.index-pro .item{ overflow: hidden;}
.index-pro .pic{position: relative; padding-bottom: 100%;border: 1px solid #f8f8f8; overflow: hidden; transition: 500ms;}
.index-pro .pic img{ position: absolute ; top:0; left:0; width:100%; height: 100%; object-fit: contain ;transition: 500ms;}
.index-pro .title{ line-height: 2.5em; text-align: center; padding: 0 10px;}
.index-pro  .outerdiv:hover .pic {box-shadow: 3px 3px 3px 3px #f8f8f8;}
.index-pro  .outerdiv:hover img{ transform: scale(1.1);}
.footer{ margin-top: 80px;}
.footer .nav1 { justify-content: space-between;}
.footer .area{ max-width: 30%;}
.footer .area dt{ font-size: 18px; margin-bottom: 20px;}
.footer .area dd{ padding: 5px 0;}
.footer .area dd a{ display: block; width:100%; height: 100%;}
.footer .contact dd{ position: relative; padding-left: 20px;}
.footer .contact dd:before{color:#025b9a; position: absolute; left:0; top:0; height: 32px; line-height: 32px;}
.footer .contact dd.add:before{ content: "\f041"; }
.footer .contact dd.tel:before{ content: "\f095";}
.footer .contact dd.mail:before{ content: "\f0e0";}

.footer .nav2 { margin-top: 60px; justify-content: center; font-size: 18px;}

.footer .nav2 a{ line-height: 18px; height: 18px; display: block; padding: 0 20px; }
.footer .nav2 .item{position: relative;}
.footer .nav2 .item:before{content: ""; position: absolute; right:-1px; top:0;  width:2px; height: 18px; background-color:#333;}
.footer .nav2  .item:last-child:before{ width:0;}
.copyright{  padding: 20px 0; text-align: center;}

.page-body{ padding-top: 30px; max-width: 1920px; margin-left: auto;margin-right: auto;}
.page-left-box{ width:260px; margin-right: 30px;}
.page-left-box  .title{ font-size: 16px;color:#025b9a; line-height: 34px; font-weight: bold; border-bottom: 1px solid #025b9a; text-transform: uppercase; }
.page-left-box .sidenav .sideli2{ line-height: 48px;  border-bottom: 1px solid #e9e9e9;}

.page-left-box .sidenav a{background-color: #f8f8f8; display: block; width:100%; height: 100%; padding-left: 20px; transition: 200ms; position: relative;}
.page-left-box .sidenav a:before{ content: "\f105"; position: absolute; left:10px; top:0;}
.page-left-box .sidenav .sideli2.active11 a
,.page-left-box .sidenav .sideli2:hover a{ background-color:#025b9a ; color:#fff; padding-left: 40px; }

.page-left-box .contactus{ margin-top: 30px;}
.page-left-box .contactus .list{  background-color: #f8f8f8; padding: 20px;}
.page-left-box .contactus .list .item{ padding: 5px 0;}
.currlocatinon { font-size: 16px;color:#025b9a; line-height: 34px; border-bottom: 1px solid #f8f8f8;}


.page-main{ padding: 20px 10px;}

.product-list-page .sort-list{ margin-top: 20px;}
.product-list-page .sortname{ font-weight: bold; font-size: 18px; margin-bottom: 20px;}
.product-list-page  .outerdiv { margin: 10px; }
.product-list-page  .outerdiv .pic{border: 1px solid #f8f8f8; overflow: hidden;}
.product-list-page  .outerdiv .img{ transition: 200ms; }
.product-list-page  .outerdiv .title{ padding: 10px 5px; text-align: center;}
.product-list-page  .outerdiv:hover .pic {box-shadow: 3px 3px 3px 3px #f8f8f8;}
.product-list-page  .outerdiv:hover .img{ transform: scale(1.1); }

.product-show-page .bigimg-box{ margin-right: 20px; border: 1px solid #f8f8f8; text-align: center}
.product-show-page .title-box  .title{ font-size: 18px; line-height: 36px; margin-bottom: 20px; border-bottom: 1px solid #025b9a;}
.product-show-page  .content-box{ margin-top: 30px;}


.img-list-page .sort-list{ margin-top: 20px;}
.img-list-page .sortname{ font-weight: bold; font-size: 18px; margin-bottom: 20px;}
.img-list-page  .outerdiv { margin: 10px; }
.img-list-page  .outerdiv .pic{border: 1px solid #f8f8f8; overflow: hidden;}
.img-list-page  .outerdiv .img{ transition: 200ms; }
.img-list-page  .outerdiv .title{ padding: 10px 5px; text-align: center;}
.img-list-page  .outerdiv:hover .pic {box-shadow: 3px 3px 3px 3px #f8f8f8;}
.img-list-page  .outerdiv:hover .img{ transform: scale(1.1); }


.news-list-page  .news-List .newsitem{ height: 40px; line-height: 40px; border-bottom: 1px solid #f8f8f8; transition: 200ms; }
.news-list-page  .news-List .newsitem:hover{ text-indent: 36px;}
.news-show-page .shownewstitle{ height: 40px; line-height: 40px; text-align: center; font-size: 18px; font-weight: bold;}
.news-show-page .time{ text-align: center;}
.news-show-page .shownewscontent{ margin-top: 20px;}