@charset "utf-8";
/* CSS Document */




/*pc-navbar-m*/
.pc-navbar-m{display:none;}
@media screen and (max-width: 1024px) {
.pc-navbar-m{display: block;}
body{position:relative;width:100%;overflow-x:hidden;padding-top: 0}

.menu-opened .pc-navbar-m,.site-footer-m ul.footer-social-list img,html{height:100%}
.menu-opened,.menu-opened .dji-mobile{overflow:hidden;height:100%}
.pc-navbar-m .show-navbar-group a.navbar-group-head{right:100%;opacity:0}
.no-transition .navbr-group-menu,
.no-transition a.navbar-group-head{transition:none!important}
.pc-navbar-m{position: absolute;top:14px;left:0;right:0;width:100%;height:70px;z-index:10000;/*transition:all .5s ease*/}
.pageH .pc-navbar-m.header-closed{background-color:#fff;}
.pc-navbar-m .navbar-header{height:70px;padding-left:0;padding-right:0;text-align:center;float:none;background: #fff;}
.pc-navbar-m .navbar-header:after,
.pc-navbar-m .navbar-header:before{display:none}
/*navbar-control menu-opened*/
.header-opened .navbar-content{opacity:1;visibility:visible;z-index:200;background: #004593;background-size: 100%;}
/*.menu-opened .control-icon{opacity:0;visibility:hidden;}*/
.header-opened .control-icon:nth-child(2){opacity:0}
.header-opened .control-icon:nth-child(1){transform:translateY(8px)}
.header-opened .control-icon:nth-child(1):before{transform:rotate(45deg);width:22px;}
.header-opened .control-icon:nth-child(3){transform:translateY(-8px)}
.header-opened .control-icon:nth-child(3):before{transform:rotate(-45deg);width:22px;}
/*navbar-control*/
.navbar-control{display:inline-block;vertical-align:middle; position:absolute;top:20px;right:10px;}
.navbar-control .control-icon{display:block;padding-top:3px;padding-bottom:3px;transition:all .4s ease}
.navbar-control .control-icon:before{content:'';display:block;height:2px;width:22px;background-color:#303233;border-top-right-radius:2px;border-bottom-left-radius:2px;transition:transform .4s ease .2s,background-color .5s ease 0s}
/*navbar-topSEARCH header-opened*/
.searching-opened.navbar-topSEARCH{transition:none}
.searching-opened.navbar-topSEARCH .topSEARCH-icon{transition:all .3s;opacity:0}
.searching-opened.navbar-topSEARCH:after,.searching-opened.navbar-topSEARCH:before{transition:all .4s ease .35s;opacity:1}
/*navbar-topSEARCH*/
.navbar-topSEARCH:after,
.navbar-topSEARCH:before{content:'';display:block;height:2px;width:22px;background-color:#303233;border-top-right-radius:2px;border-bottom-left-radius:2px;transition:transform .4s ease .2s,background-color .5s ease 0s}
.navbar-topSEARCH:after,
.navbar-topSEARCH:before{position:absolute;top:50%;left:0;opacity:0;transition:all .4s ease}
.navbar-topSEARCH{position:relative;display:inline-block;vertical-align:middle;transition:all .4s ease;position:absolute;top:20px;right:45px;}
.navbar-topSEARCH:before{transform:rotate(45deg)}
.navbar-topSEARCH:after{transform:rotate(-45deg)}
.navbar-topSEARCH span.topSEARCH-icon{position:relative;display:block;width:22px;height:22px;background-size:22px 22px;background-position:center center;background-image:url(top-search2.png);transition:all .4s ease .2s}
.navbar-topSEARCH span.topSEARCH-icon.full{background-image:url(top-search2.png)}
/*logo*/
.navbar-logo{display:inline-block;width:100%;height:70px;padding:0;vertical-align:middle;text-align: left;}
.navbar-logo .navbar-dji-icon{/*display:block;width:50px;height:52px;background-size:100%;background-position:center center;background-image:url(../../../images/logo.png)*/ display:inline-block;}
.navbar-logo .navbar-dji-icon img{ height:100%; max-width:100%;}
/*erji*/
.pc-navbar-m ul,.pc-navbar-m li{list-style:none;margin:0;padding:0;outline:none;}
.navbar-content{position:absolute;top:75px;bottom:0;width:100%;background-color:#fff;opacity:0;transition:all .4s;visibility:hidden;overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch;z-index:100}
.navbar-group-head{position:relative;right:0;display:block;padding:16px 20px;font-size:16px;color: #ffffff;overflow:hidden;z-index:700;transition:all .4s;}
.navbar-group-head h4{font-size:16px;line-height:20px;font-weight: normal;margin: 0;}
.navbar-group-head:before{position:absolute;left:20px;top:0;content:'';display:block;width:100%;height:1px;background-color: #326197;}
.navbar-group-head span.navbar-arrow-right{position:absolute;right:20px;top:50%;margin-top:-5px}
.navbar-group:first-child .navbar-group-head,
.navbr-menu li:first-child a.navbar-menu-item{padding-top:22px}
.navbar-group:first-child .navbar-group-head:before,
.navbr-menu li:first-child a.navbar-menu-item:before{display:none}
/*sanji*/
.pc-navbar-m .navbr-group-menu{position:fixed;width:100%;background-color:#fff;top:73px;transition:left .4s;left:100%;z-index:800}
.pc-navbar-m .navbr-group-menu ul{transition:all .4s;opacity:0}
.pc-navbar-m .navbr-group-menu a.menu-back{position:relative;display:block;padding:20px;font-size:16px;color:#1f3650;background-color:#ebeff2;transition:all .4s;opacity:0;font-weight: normal;}
.pc-navbar-m .navbr-group-menu a.menu-back span,.pc-navbar-m .searching-content a.navbar-search-tit span{display:inline-block;vertical-align:middle}
.pc-navbar-m .navbr-group-menu a.menu-back span.navbar-arrow-right{margin-right:8px;transform:rotate(180deg)}
.pc-navbar-m .navbar-group-active .navbr-group-menu{position:absolute;left:0;top:0}
.pc-navbar-m .navbar-group-active .navbr-group-menu a.menu-back,.pc-navbar-m .navbar-group-active .navbr-group-menu ul{opacity:1}
.pc-navbar-m a.navbar-menu-item{position:relative;display:block;width:100%;padding:23px 20px 22px;font-size:16px;line-height:20px;color:#303233;overflow:hidden;font-weight: normal;}
.pc-navbar-m a.navbar-menu-item:before{position:absolute;left:20px;right:20px;top:0;content:'';display:block;width:auto;height:1px;background-color:#f2f2f2}
/*shiji*/
.pc-navbar-m .navbr-pill-menu{border-top:solid 1px #dae1e6}
.pc-navbar-m .navbr-pill-menu a.navbar-menu-item{padding-left:44px;font-weight:400}
.pc-navbar-m .navbr-pill-menu span.navbar-pill-icon.pill-icon-explore_more{margin-top:-6px}
/*m-search*/
.pc-navbar-m.searching-opened .searching-content{opacity:1;visibility:visible;z-index:200}
.pc-navbar-m .searching-content{position:absolute;top:0;bottom:0;width:100%;background-color:#fff;opacity:0;visibility:hidden;transition:all .4s;overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch;z-index:100}
.pc-navbar-m .searching-content .navbar-search-tit{position:relative;display:block;padding:20px;font-size:16px;font-weight: normal;color:#1f3650;background-color:#ebeff2;transition:all .4s}
.pc-navbar-m .searching-content .navbar-search-tit span.navbar-arrow-right{background:url(head_gb.png) center center no-repeat; float:right; width:30px; height:17px;}
.pc-navbar-m .searching-content .m-search{padding: 15px;position: relative;}
.pc-navbar-m .searching-content .m-search form{border: 1px solid #dae1e6;margin: 0;}
.pc-navbar-m .searching-content .m-search input{-o-appearance:none; -ms-appearance:none; -moz-appearance:none; -webkit-appearance:none; appearance:none;resize: none; border-radius:0; outline: none; border:none;-webkit-box-sizing:border-box;box-sizing:border-box;}
.pc-navbar-m .searching-content .m-search input[type=text]{display: block;margin: 0 auto;width:100%;font-size:16px;color: #333333;line-height:50px;font-weight: 300;text-align:left;background-color: transparent;padding:0 3%;}
.pc-navbar-m .searching-content .m-search input[type=submit]{position: absolute;right: 16px;top: 50%;transform: translateY(-50%);background-repeat: no-repeat;background-position: center;background-image: url('top-search2.png'); font-size:0; width:50px; height:50px; background-size:20px; background-color:#fff;}
/*header-closed*/
.pc-navbar-m .navbar-container{transition: all .5s ease 0s;height:76px}
.pc-navbar-m .navbar-dji-icon,body .navbar-topSEARCH span.topSEARCH-icon{transition: all .5s ease 0s}
.navbar-topSEARCH:after,body .navbar-topSEARCH:before{transition: all .1s ease}
}
@media screen and (max-width: 1024px) {

#m{background:none;}
.menu { height:auto;}
.menu{ display:block; width:100%; display:none;}
.menu td{ width:25%!important; display:block; float:left;}

.topheader .toplogo{ width:100%;height:70px;}
.topheader .toplogo img{ width:auto; height:70px; max-width:100%;}
.topheader .top{ display:none;}
.topheader .topheaderS{ display:none;}
.topheader{ height:70px;}

}





/*Banner*/
.TouchSlide{ display:none;}
@media screen and (max-width: 1024px) {
.PCbanner{display:none;}
.TouchSlide{width:100%;position: relative; height:auto;  margin:0 auto; overflow:hidden; display: block;}
.TouchSlide .bd{position:relative; z-index:0;text-align:center;width:100% ;}
.TouchSlide .bd ul{ margin:0; padding:0;list-style:none;margin:0;padding:0;outline:none;}
.TouchSlide .bd li{width:100%;margin-bottom:1em;}
.TouchSlide .bd li img{width:100vw;}
.TouchSlide .bd li a{ display: block;}
.TouchSlide .hd {width:100%;position:absolute;z-index:1;bottom:10px;text-align:center;}
.TouchSlide .hd ul{ margin:0; padding:0;list-style:none;margin:0;padding:0;outline:none;}
.TouchSlide .hd ul li{background: #fff;cursor:pointer;display:inline-block;*display:inline;zoom:1;width:5px;height:5px;margin:0 2px;overflow:hidden;line-height:999px;border-radius:50%;}
.TouchSlide .hd ul li.on{background: #fb8605;}
}




/*indexList*/
@media screen and (max-width: 1250px) {
.warp{display:block; width:100vw; overflow:hidden;}	
.contacts table{width:100%!important;}
.indexList1{width:28vw!important;margin-left:1vw!important; }
.indexList2{width:32vw!important;margin-right:1vw!important;}
.indexList3{width:36vw!important;margin-right:1vw!important;}
.indexList1 img{width:100%!important; height:auto!important; max-width:100%;}
.indexList1 table{width:100%!important;height:auto!important}
.indexList2 table{width:100%!important;height:auto!important}
.indexList3 table{width:28vw!important;height:auto!important;}
.indexList .table100{width:100%!important;}
.indexList .jt_table{width:100%!important;}

.anli_table{width:100%!important;}
.anli_lunboB{width:100%!important;display:block!important;}
.table100{width:100vw!important; display:block!important;overflow: hidden;}
.anli_lunbo{ display:block!important;overflow: hidden;}
.anli_lunboBox{width:98vw!important; display:block!important;overflow: hidden; margin:0 auto;}

.PCbanner{WIDTH:100vw!important;HEIGHT:28.8vw!important;}
.container {WIDTH:100vw!important;HEIGHT:28.8vw!important;}
.container A IMG {WIDTH:100vw!important;HEIGHT:28.8vw!important;}
.num {POSITION: absolute;WIDTH: 90px;FLOAT: right;TOP:auto;LEFT:auto;bottom:10px;right:10px;}

.indexListB{width:98%!important;margin:0 auto!important; overflow:hidden; }


.indexList4{width:24vw!important;margin-right:1vw!important;}
.indexList4 table{width:100%!important;height:auto!important}


.indexList5{width:68vw!important;margin-right:1vw!important;}
.indexList5 table{width:100%!important;height:auto!important}
.indexList6{width:30vw!important;}
.indexList6 table{width:100%!important;height:auto!important}

#news a {width:95%!important; display:inline-block;}

.tableTop{width:100%!important;}

}
@media screen and (max-width: 1024px) {
.indexListB{width:100%!important;margin:0 auto!important; overflow:hidden;/* display:block!important;*/ }
.indexList{width:100%!important;margin:0 auto!important;margin-bottom:15px!important; float:none!important;}
.indexList table{width:100%!important;height:auto!important}
.indexList1 img{width:100%!important; height:auto!important; max-width:100%;}


.indexList1{width:100%!important;margin-left:0!important; }
.indexList2{width:100%!important;margin-right:0!important;}
.indexList3{width:100%!important;}
.indexList1 table{width:100%!important;height:auto!important}
.indexList2 table{width:100%!important;height:auto!important}
.indexList3 table{width:100%!important;height:auto!important;}
.indexList4{width:100%!important;margin-right:0!important;}
.indexList4 table{width:100%!important;height:auto!important}

.indexList5{width:100%!important;margin-right:0!important;float:none!important;}
.indexList5 table{width:100%!important;height:auto!important;display:block!important;}
.indexList5 .ph{width:100%!important;display:inline-block!important;}
.indexList6{width:100%!important;float:none!important;}
.indexList6 table{width:100%!important;height:auto!important}

.indexList .table100{width:100vw!important;}

/*jt_table*/
.jt_table{width:100%!important;}
.jt_table .jt_t_more>div{ display:inline-block; float:right;}
.jt_t_more a{ display:inline-block; float:right;}
/*Div221*/
#Div221{width:100vw!important;margin:0 auto!important; overflow:hidden;}
.Div221_table{width:100vw!important;margin:0 auto!important; overflow:hidden;}
/*demo21*/
/*#demo21{width:100%!important;margin:0 auto!important; overflow:hidden;}*/
.table100{width:100vw!important; display:block!important;overflow: hidden;}
#Td3{width:100vw!important;margin:0 auto!important; overflow:hidden;}


.anli_table{width:100%!important;}
.anli_table .jt_t_more a{ display:inline-block; float:right;}
.anli_lunboB{width:100%!important;display:block!important;}

.anli_lunbo{ display:block!important;overflow: hidden;}
.anli_lunbotd{}

.anli_lunboBox{width:100%!important; display:block!important;overflow: hidden;}

.friend td a,
.foot_m a{ display:inline-table;}
}




@media screen and (max-width: 1250px) {
.pageBanner img{width:100%!important; height:auto!important; max-width:100%;}	
.pagewarp{display:block!important; width:1002px!important; margin:0 auto;}	
.pagewarp>tbody{display:block!important; width:100%!important;}	
}
@media screen and (max-width: 1024px) {
.pageAD{ display:none;}


.pagePosition{ display:block!important; width:100%!important;margin-top:0!important;}

.pageBanner img{width:100%!important; height:auto!important; max-width:100%;}
.pagewarp{display:block!important; width:100%!important;overflow: hidden;}

.product_pic_table{width:100px!important;height:100px!important;}
.sortpic{ width:100px!important; height:100px!important;}




.product_pic_table{width:80px!important;height:80px!important;}
.sortpic{ width:80px!important; height:80px!important;}

.page_c{ padding:5px 0px 25px 0px!important;}

.pagePosition{overflow: hidden;}
.pagePosition table{width:100%!important;margin-top:0!important; background-size:100% 100%;    position: static!important;}
.pagePosition table td{width:100%!important;display:block!important; position:relative; height:60px;}
.pagePosition table .page_t{float:none;display:block;padding-top: 10px;font-size: 16px;padding-bottom: 30px;}
.pagePosition table .nav{position:absolute;bottom: 15px;right:0;}

.pageMenu{width:100%!important;margin-top:0!important;display:block!important;}

.tableP{display:block!important; width:100vw!important;overflow: hidden;}


.product_pic_table{width:150px!important;height:150px!important;}
.sortpic{width: 100%!important; height:150px!important;}
.sort{width:100%!important;}
.sort table{ margin:0 auto!important;}


.page_cB,
.page_cBox{width:100%!important;}




.pageMenu{width:100%!important;    padding-top:0!important;}
.pageMenu table{width:100%!important;}
.p_menu td{text-align:center;background: none;}

.pageNr{ height:auto!important;}
.pageNrB{ height:auto!important; overflow:hidden; display:block!important;}
.pageNrB td{height:auto!important;background-repeat: repeat-y;background-size: 100%;}
.pageMenuList{height:auto!important;  display:block!important;}
.pageMenuList{ height:auto!important; overflow:hidden; display:block!important;}
.p_menu{height:auto!important; overflow:hidden; display:block!important;width:100%;margin:0!important;padding:8px 0!important;}
.p_menu tbody{ display:block!important;width:100%;}
.p_menu tr{ display:block!important;width:100%;}
.p_menu td{ display:block!important; padding:5px 0!important; width:100%;}

.p_m_t{background-size:100% 100%;display:block!important; padding:8px 0!important;}
.p_m_t span{ display:inline-block; padding-left:40px;background: url('menu.png') no-repeat left center; background-size:28px;}
.pageMenuListb{ height:0;transition: all .4s ease; display:none;}
.pageMenuListb.pageMenu-opened{height:auto;display: block;}

.pageMenuListb .pictures{ display:none;}
.page_c>table{ width:95%;margin:0 auto;}
.page_c>table td img{ max-width:100%;height:auto!important;}

.sort{width:100%!important;}
.sort>tbody>tr{}

.product_pic_tableBOX{ width:95%;margin:0 auto;}
}

@media screen and (max-width: 640px) {
.sort>tbody>tr>td{width:90%!important;display:block!important;margin:0 auto!important;}

.product_pic_tableB>tbody>tr>td{width:90%!important;display:block!important;margin:0 auto!important;}


.join_tableB td{width:100%!important;display:block!important;margin:0 auto!important;}
}




