@charset "utf-8";

/* CSS Document */







#catalog{margin: 0 auto; padding: 150px 0;}



#catalog .layout>.lists{margin: 0 auto;}

#catalog .layout>.lists>ul{margin: 0 auto;}

#catalog .layout>.lists>ul>li{ display: block; background: #f9f9f9; padding: 20px; margin-bottom:30px; transition: all .35s;}

#catalog .layout>.lists>ul>li>a{display: block;}

#catalog .layout>.lists>ul>li>a:before, #catalog .layout>.lists>ul>li>a:after { content: ""; display: table; }

#catalog .layout>.lists>ul>li>a:after { clear: both; }

#catalog .layout>.lists>ul>li .photo{ float: left; width: 50%;overflow: hidden;}

#catalog .layout>.lists>ul>li .photo>.img{ position: relative; border-radius: 50%; padding: 10%;overflow: hidden; box-sizing: border-box;}

#catalog .layout>.lists>ul>li .photo>.img>span{ position: relative; display: block; height: 360px; background-position: 50% 50%;}

#catalog .layout>.lists>ul>li .photo>.img>span img{display: none;}

#catalog .layout>.lists>ul>li .photo>.img>span:after{position: absolute;z-index: 10; background: rgba(0,0,0,.1); width: 100%;height: 100%;content: ''; transition: all .35s;}

#catalog .layout>.lists>ul>li .photo>.img>span:before{position: absolute;z-index: 30; top: 50%; left: 50%; width: 100px;height: 100px; line-height: 100px;transform: translate(-50%,-40%); font-family: iconfont; font-size: 6rem; color: #fff; text-align: center; content: '\e66c'; opacity: 0; transition: all .35s;}

#catalog .layout>.lists>ul>li .box{width: 50%; float: right; box-sizing: border-box; padding:6%; text-align: left;}

#catalog .layout>.lists>ul>li .box>.tit{font-size: 3.6rem; color: #333;transition: all .35s;}

#catalog .layout>.lists>ul>li .box>.tit>img{height: 40px; width: auto; margin-right: 10px;}

#catalog .layout>.lists>ul>li .box>.txt{ padding: 20px 0; width: 86%; font-size: 1.6rem; color: #999; line-height: 2.4rem;}

#catalog .layout>.lists>ul>li .box>.more{ padding-top: 20px;}

#catalog .layout>.lists>ul>li .box>.more>span{display: inline-block; padding: 12px 25px; border: 1px solid #005d8a; background: #005d8a; border-radius: 10px 0 10px 0; font-size: 1.5rem; color: #fff;transition: all .35s;}

#catalog .layout>.lists>ul>li .box>.more>span>em{font-style: normal; margin-right: 6px;}

#catalog .layout>.lists>ul>li:nth-child(even) .photo{float: right;}

#catalog .layout>.lists>ul>li:nth-child(even) .box{ float: left;}

#catalog .layout>.lists>ul>li>a:hover .photo>.img>span:after{background: rgba(0,0,0,.5);}

#catalog .layout>.lists>ul>li>a:hover .photo>.img>span:before{opacity: 1;transform: translate(-50%,-50%) rotate(180deg); }

#catalog .layout>.lists>ul>li:hover{background: #fff;box-shadow: 0 0 16px rgba(0,0,0,.1);}

#catalog .layout>.lists>ul>li:hover .box>.more>span{ background: none; color: #005d8a}







#products{margin: 0 auto; padding: 0 0;}

#products.highlight{ background: #eef2f5;}

#products .layout{margin: 0 auto;}

#products .layout>.layout-box-left{ width: 22%; padding-right: 50px;  box-sizing: border-box; text-align: left; border-right: 1px solid #ddd;}

#products .layout>.layout-box-right{position: relative;z-index: 0; width: 70%;box-sizing: border-box; padding: 30px 0;}



#products .layout .categories{ position: relative; top: 0;padding: 30px 0; }

#products .layout .categories .toggler{display: none; width: 80px; height: 70px; background: #005d8a; box-shadow: -5px 5px 16px rgba(0,0,0,.2); text-align: center; border-radius:50px 0 0 50px;}

#products .layout .categories .toggler>a{display: block;color: #fff; padding-top: 10px;}

#products .layout .categories .toggler>a>i{display: block; font-size: 3rem;}

#products .layout .categories .toggler>a>span{ display: block; font-size: 1.2rem;}

#products .layout .categories .nav>ul{margin: 0 auto;}

#products .layout .categories .nav>ul>li{display: block; position: relative;border-bottom: 2px solid #ddd; transition: all .35s;}

#products .layout .categories .nav>ul>li>a{display: block; position: relative; padding: 20px 40px 20px 0; text-transform: capitalize; font-size: 1.6rem;color: #333; transition: all .35s;}

#products .layout .categories .nav>ul>li:hover, #products .layout .categories .nav>ul>li.active{border-color: #005d8a; color: #005d8a;}

#products .layout .categories .nav>ul>li>a:hover, #products .layout .categories .nav>ul>li.active>a{color: #005d8a;}

#products .layout .categories .nav>ul>li .toggle{position: absolute;z-index: 90; right:0; top: 0; cursor: pointer; border: 0; background: none; width: 40px;height: 60px; line-height: 60px; transition: all .35s;}

#products .layout .categories .nav>ul>li .toggle:after{position: absolute;z-index: 1; top: 0; right: 0; width: 100%;text-align: center; font-family: iconfont; font-size: 2.4rem; font-weight: bold; color: #005d8a; content: '\e66c'; transition: all .35s;}

#products .layout .categories .nav>ul>li .toggle.active:after{content: '\e667';}

#products .layout .categories .nav>ul>li ul{display: none; padding-bottom: 20px;}

#products .layout .categories .nav>ul>li ul>li ul{padding:10px 0;}

#products .layout .categories .nav>ul>li ul>li{ position: relative; display: block; margin-bottom: 10px; text-align: left;}

#products .layout .categories .nav>ul>li ul>li>.toggle{ width: 40px; height: 22px; line-height: 22px;}

#products .layout .categories .nav>ul>li ul>li>.toggle:after{ font-size: 2rem; }

#products .layout .categories .nav>ul>li ul>li>a{ position: relative; display: block; padding: 0 16px; font-size: 1.5rem; line-height: 2.2rem;}

#products .layout .categories .nav>ul>li ul>li>a:after{position: absolute;z-index: 1; left: 4px;top:9px;width: 4px;height: 4px; background: #005d8a; content: '';transition: all .35s;}

#products .layout .categories .nav>ul>li a.active{color: #005d8a;}

#products .layout .categories .nav.layui-layer-wrap{ padding: 30px; background: #efefef;}

#products .layout .title{ position: relative; font-size: 3rem; font-weight: bold; color: #333;}

#products .layout .recordcount{text-align: left; font-size: 1.6rem; color: #999; padding: 5px 0 20px 0;}

#products .layout .recordcount>span{display: inline-block;padding: 0 2px;}

#products .layout .lists{margin: 0 auto; padding: 50px 0; }

#products .layout .lists>ul{margin: 0 auto;}

#products .layout .lists>ul>li{display: block;float: left;width:31.33%; margin-right: 3%; margin-bottom: 3%;overflow: hidden; position: relative; box-sizing: border-box; transition: all .35s; }

#products .layout .lists>ul>li:nth-child(3n){margin-right: 0;}

#products .layout .lists>ul>li .img{ position: relative; background:#fff; border: 0px solid #ddd;box-sizing: border-box;}

#products .layout .lists>ul>li .img>img{ width:100%; height: auto; transition: all .8s;}

#products .layout .lists>ul>li .details{ opacity: 0; position: absolute;z-index: 50; left: 50%; top: 50%; background: #005d8a; box-sizing: border-box; padding: 40px; text-align: left; width: 100%; height: 100%; transform: translate(-50%,0); transition: all .35s;}

#products .layout .lists>ul>li .details>.tit{ font-size: 2rem; font-weight: bold; color: #fff!important;}

#products .layout .lists>ul>li .details>.txt{ padding: 30px 0; text-align: left; font-size: 1.4rem; color: #fff; line-height: 2rem;}

#products .layout .lists>ul>li .details>.more{position: absolute;z-index: 10;right: 30px;bottom: 30px; font-size: 1.4rem; color: rgba(255,255,255,.7);}

#products .layout .lists>ul>li .box{font-size:1.8rem; color: #333; text-align: center;padding: 20px; text-overflow:ellipsis; white-space: nowrap; overflow: hidden; transition: all .35s;}

#products .layout .lists>ul>li:hover{}

#products .layout .lists>ul>li:hover .tit{ color: #005d8a;}

#products .layout .lists>ul>li:hover .details{opacity: 1;transform: translate(-50%,-50%);}

#products .layout .loadmore{text-align: center;}



#searchs{margin: 0 auto; padding: 150px 0;}

#searchs .layout .recordcount{text-align: left; font-size: 1.6rem; color: #666; padding: 20px 0;}

#searchs .layout .recordcount>b{display: inline-block; font-size: 1.8rem; color: #005d8a; text-decoration: underline;}

#searchs .layout .recordcount>span{display: inline-block;padding: 0 2px; color: #ee9900;}

#searchs .layout .lists{margin: 0 auto; padding: 30px 0; }

#searchs .layout .lists>ul{margin: 0 auto;}

#searchs .layout .lists>ul>li{display: block;border: 1px solid #eee; margin-bottom: 3%;overflow: hidden; position: relative; padding: 30px; box-sizing: border-box; transition: all .35s; }

#searchs .layout .lists>ul>li .img{ position: relative; width: 15%; float: left; background:#fff; box-sizing: border-box;}

#searchs .layout .lists>ul>li .img>img{ width:100%; height: auto; transition: all .8s;}

#searchs .layout .lists>ul>li .box{ float: right; width: 80%; text-align: left;padding: 20px;transition: all .35s;}

#searchs .layout .lists>ul>li .box>.tit{ text-overflow:ellipsis; white-space: nowrap; overflow: hidden;  font-size: 1.8rem; font-weight: bold; color: #333; transition: all .35s;}

#searchs .layout .lists>ul>li .box .searHeight{font-style: normal; color: #005d8a;text-decoration: underline;}

#searchs .layout .lists>ul>li .box>.txt{ padding: 16px 0; font-size: 1.4rem; color: #999; line-height: 2.4rem;}

#searchs .layout .lists>ul>li .box>.more{ padding-top: 10px;}

#searchs .layout .lists>ul>li .box>.more>span{ border: 1px solid #eee; display: inline-block;padding: 10px 20px; font-size: 1.2rem; color: #888; transition: all .5s;}

#searchs .layout .lists>ul>li:hover .tit{ color: #005d8a;}

#searchs .layout .lists>ul>li:hover .more>span{ background: #005d8a; border-color: #005d8a;color: #fff;}

#searchs .layout .loadmore{text-align: center; border-top: 0; padding-top: 20px;}









#products .layout .view{position: relative;  margin: -100px auto 0 auto; box-sizing: border-box; }

#products .layout .view .introduce{display: block;margin: 50px auto; padding: 50px; background: #fff; box-shadow: 0 2px 16px rgba(0,0,0,.1);}

#products .layout .view .introduce .thumbs{position:relative;}

#products .layout .view .introduce .thumbs>.swiper{ width:80px;}

#products .layout .view .introduce .thumbs>.swiper .swiper-slide{border:1px solid #ddd; overflow: hidden; cursor: pointer; box-sizing:border-box;}

#products .layout .view .introduce .thumbs>.swiper img{width:auto;height:100%;box-sizing:border-box;}

#products .layout .view .introduce .thumbs>.swiper .swiper-slide-thumb-active{border-color: #005d8a;}

#products .layout .view .introduce .thumbs>.swiper .play{position: absolute;z-index: 10; left: 0;top: 0;width: 100%;height: 100%; background: url("http://www.lanig.cn/img/play_ico.png") no-repeat; background-size: cover;}

#products .layout .view .introduce .info{ position: relative; width: calc(100% - 110px);box-sizing: border-box; background: #fff; }

#products .layout .view .introduce .info>.show{ position:relative; display: inline-block; max-width:600px; width: 45%; cursor: pointer; margin:0 auto;}

#products .layout .view .introduce .info>.show .swiper{ width:100%; height:100%; margin: 0 auto;border: 1px solid #ddd;overflow: visible!important;}

#products .layout .view .introduce .info>.show .swiper-slide{ position: relative; text-align: center; margin: 0 auto;}

#products .layout .view .introduce .info>.show .swiper-slide>a{ position: relative;z-index: 100; display: block;}

#products .layout .view .introduce .info>.show .swiper-slide>a:after{position: absolute;z-index: 90; top: 0;left: 0; width: 100%;height: 100%;  background-position: 50% 50%; content: '';}

#products .layout .view .introduce .info>.show .swiper-slide>a>img{max-width: 100% !important; vertical-align: center;}

#products .layout .view .introduce .info>.show .swiper-slide .play{ position: absolute;z-index: 50; left: 0;top: 50%; transform: translateY(-50%); width: 100%;}

#products .layout .view .introduce .info>.show .swiper-slide .play>iframe{ width: 100%; height: 450px; margin: 0 auto;}

#products .layout .view .introduce .info>.show .swiper-pagination{ display:none; text-align:center; position:relative; bottom:0;}

#products .layout .view .introduce .info>.show .swiper-pagination .swiper-pagination-bullet {width: 10px;height: 10px;margin:0 3px;}

#products .layout .view .introduce .info>.show .swiper-pagination .swiper-pagination-bullet-active{background:#666;}

#products .layout .view .introduce .content{width: 55%; text-align: left; box-sizing: border-box; padding:10px 0 10px 100px;}

#products .layout .view .introduce .content>.title{font-size: 2.6rem; font-weight: bold; padding: 20px 0; border-bottom: 4px solid #eee;}

#products .layout .view .introduce .content>.text{text-align: left; padding: 30px 0 60px 0;}

#products .layout .view .introduce .content>.text>h3{ display: block; font-size: 2rem; font-weight: bold; color: #005d8a;}

#products .layout .view .introduce .content>.text>p{ padding-top: 20px; font-size: 1.4rem; line-height: 2.4rem; color: #666;}

#products .layout .view .introduce .content>.button{ text-align: left; padding-top: 20px;}

#products .layout .view .introduce .content>.button>a{display:inline-block; background: #005d8a; border: 2px solid #005d8a; text-align: center; font-size: 1.6rem; font-weight: bold; color: #fff;  padding: 0 32px; height: 40px;line-height: 40px; transition: all .35s;}

#products .layout .view .introduce .content>.button>a:hover{ background: none; border-color: #005d8a; color: #005d8a;}

#products .layout .view .introduce .content>.url{ text-align: left; padding-top: 20px;}

#products .layout .view .introduce .content>.url>a{ margin-right: 20px; border: 0; text-align: left; font-size: 1.4rem; font-weight: normal; background: #fff; color: #666;}

#products .layout .view .introduce .content>.url>a i{ display: inline-block; vertical-align: middle; font-size: 2.4rem; color: #005d8a; margin-right: 5px;}

#products .layout .view .introduce .content>.url>a span{display: inline-block; vertical-align: middle;}

#products .layout .view .introduce .content>.url>a.tel{color: #005d8a; font-weight: bold;}



#products .layout .view .details{margin: 0 auto; background: #fff;box-shadow: 0 2px 16px rgba(0,0,0,.1);}

/* #products .layout .view .details>.detail{ margin: 0 auto; padding:0 50px;} */

#products .layout .view .details>.detail .wrap{width: 100%;max-width: none;}

/* #products .layout .view .details>.detail .items{margin: 0 auto; padding: 50px 0; border-bottom: 3px solid #eee;} */

#products .layout .view .details>.detail .items:last-child{border-bottom: 0;}

#products .layout .view .details>.detail .items .title{text-align: left;font-size: 2.4rem; font-weight: bold; color: #333;}

#products .layout .view .details>.detail .items .content{ padding: 50px 0;}

#products .layout .view .details>.detail .items .content>p{display: block; position: relative; font-size: 1.6rem; color: #333; margin-bottom: 15px;}

#products .layout .view .details>.detail .items .content img{max-width: 80%;}

#products .layout .view .details>.detail .items .content .table-container{position: relative; padding-bottom: 30px; cursor: all-scroll;}

#products .layout .view .details>.detail .items .content .table-container>.table-wrapper{ position: relative; overflow:hidden; overflow-x:auto;}

#products .layout .view .details>.detail .items .content .table-container>.table-wrapper::-webkit-scrollbar {width:10px;height: 10px;}

#products .layout .view .details>.detail .items .content .table-container>.table-wrapper::-webkit-scrollbar-thumb {background:#666;}

#products .layout .view .details>.detail .items .content .table-container>.table-wrapper::-webkit-scrollbar-track {border-radius: 0;background: #ededed;}

#products .layout .view .details>.detail .items .content .table-container:after{ display: none; position: absolute;z-index: 10; right: 0; bottom: 10px; font-size: 1.1rem; color: #ccc; content: '拖动表格进行浏览';}

#products .layout .view .details>.detail .items .content table{border-collapse: separate;empty-cells: hide;box-sizing: border-box;width: 100%!important;min-width: 1200px;background: #fff;overflow: hidden;/* border: 0; */ border-left:1px solid #ddd; border-top:1px solid #ddd;}

#products .layout .view .details>.detail .items .content table td{ text-align: left; border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; color: #666; font-size: 1.4rem;padding:10px;}

#products .layout .view .details>.detail .items .content table tr:first-child{background: #ddd; font-weight:700; } */

#products .layout .view .details>.detail .items .content table td:nth-child(2){}

#products .layout .view .details>.detail .items .content table td:last-child{}



#products .layout .view .details>.detail .related{ position: relative;}

#products .layout .view .details>.detail .related .swiper{ padding: 50px 0;}

#products .layout .view .details>.detail .related .swiper .swiper-slide{overflow: hidden;}

#products .layout .view .details>.detail .related .swiper .swiper-slide .img{ position: relative; background:#fff;box-sizing: border-box;}

#products .layout .view .details>.detail .related .swiper .swiper-slide .img>img{ width:100%; height: auto; transition: all .8s;}

#products .layout .view .details>.detail .related .swiper .swiper-slide .tit{text-align: center; font-size: 1.8rem; overflow: hidden;text-overflow:ellipsis;white-space: nowrap;}

#products .layout .view .details>.detail .related .swiper .swiper-slide .details{ opacity: 0; position: absolute;z-index: 50; left: 50%; top: 50%; background: #005d8a; box-sizing: border-box; padding: 40px; text-align: left; width: 100%; height: 100%; transform: translate(-50%,0); transition: all .35s;}

#products .layout .view .details>.detail .related .swiper .swiper-slide .details>.tit{ text-align: left; font-size: 2rem; font-weight: bold; color: #fff!important;}

#products .layout .view .details>.detail .related .swiper .swiper-slide .details>.txt{ padding: 30px 0; text-align: left; font-size: 1.4rem; color: #fff; line-height: 2rem;}

#products .layout .view .details>.detail .related .swiper .swiper-slide .details>.more{position: absolute;z-index: 10;right: 30px;bottom: 30px; font-size: 1.4rem; color: rgba(255,255,255,.7);}

#products .layout .view .details>.detail .related .swiper .swiper-slide:hover .details{opacity: 1;transform: translate(-50%,-50%);}

#products .layout .view .details>.detail .related .swiper .swiper-slide:hover .tit{color: #fff;}

#products .layout .view .details>.detail .related .swiper .button-next, #products .layout .view .details>.detail .related .swiper .button-prev{ cursor: pointer; position: absolute;z-index: 10; right: 0; top: 50%; transform: translateY(-50%); width: 40px;height: 40px; line-height: 40px; text-align: center; transition: all .35s;}

#products .layout .view .details>.detail .related .swiper .button-prev{ right: auto; left: 0;}

#products .layout .view .details>.detail .related .swiper .button-next>i, #products .layout .view .details>.detail .related .swiper .button-prev>i{ font-size: 6rem;}

#products .layout .view .details>.detail .related .swiper .button-next:hover, #products .layout .view .details>.detail .related .swiper .button-prev:hover{color: #005d8a;}

#products .layout .view .back{text-align: center; padding-top: 50px;}

#products .layout .view .back>a{display: inline-block; border: 1px solid #ccc; padding: 12px 60px; font-size: 1.8rem; border-radius: 50px; transition: all .35s;}

#products .layout .view .back>a:hover{background: #005d8a; color: #fff; border-color: #005d8a; box-shadow: 0 3px 16px rgba(0,0,0,.16);}



#navpart.highlight{ background: #fff!important; border-top: 1px solid #eee;}









#samples{ position: relative; margin: 0 auto;}

#samples .wrap{max-width: 1280px;}

#samples .layout {margin: 0 auto; padding-top: 20px;}

#samples .layout .close{position: absolute;z-index: 60; right: 0;top:10px; width: 40px; height: 40px; line-height: 40px; cursor: pointer; text-align: left; color: #333;}

#samples .layout .close>i{ position: relative;z-index: 20; font-size: 2.4rem;}

#samples .layout .title{ text-align: center;}

#samples .layout .title>h3{font-size: 1.8rem; color: #333;}

#samples .layout .title>h3>strong{font-weight: bold; font-size: 2.4rem; vertical-align: middle;}

#samples .layout .title>h3>span{display: inline-block; vertical-align: middle; margin-left: 6px;}

#samples .layout .describe{ text-align: center; width: 80%; margin:0 auto; font-size: 1.4rem; color: #999; line-height: 2rem;}

#samples .layout .form{margin: 0 auto; padding:10px 0;}

#samples .layout .form .row{ position: relative; display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap; margin: 0 auto;}

#samples .layout .form .row>[class*="col-"] {padding-right: 0;}

#samples .layout .form .row>.group{display: block;  margin-bottom: 10px;}

#samples .layout .form .row>.group dt{ font-size: 1.4rem; color: #333; margin-bottom: 5px;}

#samples .layout .form .row>.group dt>span{display: inline-block; margin-left: 10px; color: #005d8a; font-size: 1.4rem;}

#samples .layout .form .row>.group dd>input{ display:inline-block; box-sizing:border-box; width:100%; height: 38px; line-height: 38px; border-radius: 2px; padding:0 10px;-webkit-appearance:none; font-size: 1.4rem; border:1px solid #ddd; color:#666;text-align:left; transition: all .35s;}

#samples .layout .form .row>.group dd>input::-webkit-input-placeholder{ color:#999;}

#samples .layout .form .row>.group dd>textarea{ display:block;box-sizing:border-box; width:100%;height:auto;padding:13px 10px;-webkit-appearance:none; font-size: 1.4rem; line-height:3.2rem; border:1px solid #ddd; color:#666;text-align:left;transition: all .35s;}

#samples .layout .form .row>.group dd>textarea::-webkit-input-placeholder{ color:#999;}

#samples .layout .form .row>.group dd>input:hover, #samples .form .row>.group dd>textarea:hover{border-color: #ccc;}

#samples .layout .form .row>.col-3{width: 33.33%; flex: 0 0 33.33%;}

#samples .layout .form .row>.col-5{width: 50%; flex: 0 0 50%;}

#samples .layout .form .row>.col-10{width: 100%; flex: 0 0 100%;}

#samples .layout .form .row>.button{text-align: right;}

#samples .layout .form .row>.button .form_button{display:block; width: 100%; box-sizing:border-box; border: 0!important; text-align: center; border-radius: 2px; font-weight: bold;height: 50px; line-height: 50px; background: #005d8a;padding:0 100px; font-size: 1.6rem; color:#fff;  cursor:pointer; transition: all .35s;}

#samples .layout .form .row>.button .form_button:hover{background: #555;}

#samples .layout .form .layui-input, #samples .layout .form .layui-select, #samples .layout .form .layui-textarea{height: 50px!important; line-height: 50px\9!important;}

#samples .layout .form .layui-form-select dl dd.layui-this {background-color: #666!important;}

#samples .layout .form #checkimg{display:inline-block; position: absolute; top: 0; right: 30px;  margin-top: 30px; cursor:pointer;}





#samples .layout .complete{ display: none;  margin: 50px auto; text-align: center;}

#samples .layout .complete>.ico{ text-align: center; background: #25b747; width: 70px; height: 70px; line-height: 70px; border-radius: 100%; margin: 0 auto;}

#samples .layout .complete>.ico>i{ font-size: 6rem;color: #fff;}

#samples .layout .complete>.box{ padding: 20px; width: 60%; margin: 0 auto;}

#samples .layout .complete>.box>.tips{color: #999; padding-bottom: 10px;}

#samples .layout .complete>.box>.tips>span{display: inline-block;color: #005d8a; margin-right: 3px;}

#samples .layout .complete>.box>.text{font-size: 1.4rem;color: #666; line-height: 2rem;}







.layui-layer-btn .layui-layer-btn0 { border-color: #333!important; background-color: #333!important; color: #fff!important;}













@media only screen and (max-width: 1460px) {



    #products .layout .view .introduce .content>.text{padding: 30px 0;}

    /*#products .layout .view .introduce .thumbs>.swiper{ height:auto;}*/



}



@media only screen and (max-width: 1280px) {



    #catalog .layout>.lists>ul>li .photo>.img>span { height: 300px;}

    #catalog .layout>.lists>ul>li .box>.tit { font-size: 3.2rem;}

    #catalog .layout>.lists>ul>li .box>.txt {font-size: 1.4rem; }

    #catalog .layout>.lists>ul>li .box>.more>span { padding: 10px 20px;  font-size: 1.4rem;}



    #products .layout>.layout-box-left{ width: 24%;}

    #products .layout>.layout-box-right{width: 68%;}

    #products .layout .title{ font-size: 2.4rem;}

    #products .layout .recordcount { font-size: 1.4rem; }

    #products .layout .lists>ul>li .details{ padding: 30px;}



    #products .layout .view .introduce .content{padding: 0 0 0 80px;}

    #products .layout .view .introduce .content>.title{font-size: 2.8rem;  padding: 15px 0;}

    #products .layout .view .introduce .content>.text>h3{font-size: 1.8rem;}



    #products .layout .view .details>.detail .items .title { font-size: 2rem;}

    #products .layout .view .details>.detail .items .content .table-container:after{ display: block;}



    #products .layout .view .details>.detail .related .swiper .swiper-slide .tit{font-size: 1.6rem; ;}

    #products .layout .view .details>.detail .related .swiper .swiper-slide .details{ padding: 20px; }

    #products .layout .view .details>.detail .related .swiper .swiper-slide .details>.tit{ font-size: 1.8rem; }

    #products .layout .view .details>.detail .related .swiper .swiper-slide .details>.txt{ padding: 20px 0; font-size: 1.2rem;}

    #products .layout .view .details>.detail .related .swiper .swiper-slide .details>.more{ font-size: 1.2rem; }







    #searchs .layout .lists>ul>li .img{ width: 30%; }

    #searchs .layout .lists>ul>li .box{ width: 65%;}













}









@media only screen and (max-width: 1080px) {



    #navpart .path{ width: 70%;}

    #navpart .nav{width: 30%;}



    #catalog .layout>.lists>ul>li{padding: 0;}

    #catalog .layout>.lists>ul>li .photo{width: 100%;float: none;}

    #catalog .layout>.lists>ul>li .photo>.img {border-radius: 0;padding: 0;}

    #catalog .layout>.lists>ul>li .photo>.img>span { height: auto;  background: none!important;}

    #catalog .layout>.lists>ul>li .photo>.img>span img{display: block;width: 100%;height: auto;}

    #catalog .layout>.lists>ul>li .box{width: 100%; float: none; padding:6%;}

    #catalog .layout>.lists>ul>li .box>.tit { font-size: 2.8rem;}







    #products .layout .lists>ul>li{width:48%; margin-right: 0; }

    #products .layout .lists>ul>li:nth-child(even){float: right;}



}



@media only screen and (max-width: 960px){



    #navpart.highlight{background: #f7f7f7!important;}

    #navpart.highlight .path{width: 100%; float: none;}

    #navpart .nav{display: none;}



    #catalog .layout>.lists>ul>li .box>.tit {font-size: 2.4rem;}

    #catalog .layout>.lists>ul>li .box>.txt { width: 100%;}

    #catalog .layout>.lists>ul>li .box>.more { padding-top: 0; }

    #catalog .layout>.lists>ul>li .box>.more>span {padding: 8px 16px; font-size: 1.2rem;}





    #products .layout>.layout-box-left{ width: 100%; float: none; border: 0; padding: 0;}

    #products .layout>.layout-box-right{width: 100%; float: none;padding: 0;}



    #products .layout .categories{padding: 0; position: fixed; right: 0; top: 30%;z-index: 19991015; }

    #products .layout .categories>.nav{display: none;}

    #products .layout .categories>.toggler{display: block;}



    #products.highlight{ padding-top: 80px;}

    #products.highlight .wrap{width: 100%;max-width: inherit;}

    #products .layout .view .introduce{margin: 20px auto; width: 100%; max-width: none;}

    #products .layout .view .introduce .thumbs{display: none; }

    #products .layout .view .introduce .info{ width: 100%;padding:0; border-radius: 0;}

    #products .layout .view .introduce .info>.show{ max-width:none; width: 100%; float: none; }

    #products .layout .view .introduce .info>.show .swiper{border: 0;}

    #products .layout .view .introduce .info>.show .swiper-pagination{ display:block;}

    #products .layout .view .introduce .content{width: 100%; float: none;padding-left: 0;}



    #products .layout .view .details>.detail .items .content img {max-width: 100%;}







}



@media only screen and (max-width:860px) {



    #searchs .layout .recordcount { padding: 0; font-size: 1.4rem; }



    #searchs .layout .lists>ul>li .box>.tit {font-size: 1.6rem;}

    #searchs .layout .lists>ul>li .box>.txt { font-size: 1.2rem; line-height: 2rem; }





}



@media only screen and (max-width:640px) {


    .nav-tabs {
        display: block !important;
    }


    #catalog { padding: 50px 0; }

    #catalog .layout>.lists>ul>li .box {padding: 30px 30px 50px 30px;}

    #catalog .layout>.lists>ul>li .box>.tit { font-size: 2rem;}

    #catalog .layout>.lists>ul>li .box>.txt { padding: 10px 0; font-size: 1.2rem;}





    #products { padding: 50px 0; }

    #products .layout .title{ font-size: 1.6rem;}

    #products .layout .lists>ul>li .box{font-size:1.4rem; padding: 0 20px;}

    #products .layout .view .introduce .content>.title {font-size: 2.4rem;}

    #products .layout .view .details>.detail .items { padding: 30px 0; }

    #products .layout .view .details>.detail .items .content { padding: 20px 0;}

    #products .layout .view .details>.detail .items .content>p{font-size: 1.4rem;}

    #products .layout .view .details>.detail .items .content table td{ font-size: 1.2rem;}



    #products .layout .view .back>a{padding: 10px 40px; font-size: 1.4rem;}



    #searchs {padding: 50px 0;}

    #searchs .layout .lists>ul>li .img{ width: 45%;}

    #searchs .layout .lists>ul>li .box{ width: 50%; padding: 0 20px;}



}





@media only screen and (max-width:520px) {



    #products .layout .view .introduce { padding: 30px; }

    #products .layout .view .introduce .content>.title {font-size: 2rem;}

    #products .layout .view .introduce .content>.text>h3 { font-size: 1.6rem;}

    #products .layout .view .introduce .content>.text>p {font-size: 1.2rem;line-height: 2rem; }

    #products .layout .view .introduce .content>.button{padding-top: 0;}

    #products .layout .view .introduce .content>.button>a { font-size: 1.4rem;}



    #products .layout .view .details>.detail { padding: 0 30px;}

    #products .layout .view .details>.detail .items .title {font-size: 1.8rem;}



    #searchs .layout .lists>ul>li{padding: 0;}

    #searchs .layout .lists>ul>li .img{ width: 100%; float: none;}

    #searchs .layout .lists>ul>li .box{ float: none; width: 80%; margin: 0 auto; padding:10px 0 30px 0;}

    #searchs .layout .lists>ul>li .box>.more>span {padding: 6px 10px;}



}



.nav-tabs > li.active > a,

.nav-tabs > li.active > a:hover,

.nav-tabs > li.active > a:focus {

  color: #fff;

  background-color: #005d8a;

  cursor: default;

  width: 200px;

  border: 0;

  /* border-bottom: 1px solid #dedede; */

}

/*.nav>li>a {padding: 10px 25px;}*/

.nav-tabs > li > a {

  margin-right: 0px;

  border: 0;

  border-radius: 0;

  width: 200px;

  height: 70px;

  line-height: 70px;

  color: #666;

  text-align: center;

  font-size: 18px;

  display: block;

}

.nav-tabs {

    width: 100%;

    border-bottom: 1px solid #ccc;

  background-color: #fff;

  display: flex;

  justify-items: start;

}

.tab-pane > div {

  /*margin-top: 30px;*/

}

#tab_pane_img {

  max-width: 1000px;

}



.tab-pane {

    display: none;

}

.tab-pane.active {

    display: block;

    padding: 0 50px;

}