@charset "utf-8";
/*整体布局样式*/
html,body{
	background:#f2f2f2;
	text-align:left;
	color:#555;
    font-size: 14px;
}
*{margin:0;padding:0;}
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
}
ul,li,ol {list-style:none outside}
a{text-decoration:none; color: #555;}
img {border:none;}
input, button, select, textarea {outline: none;}
input,textarea {background:none}
*, ::after, ::before {
    -webkit-box-sizing: inherit;
    box-sizing: inherit;
}
article, aside, footer, header, nav, section {
    display: block;
}
/*清除苹果按钮格式*/
input[type="text"],input[type="button"], input[type="submit"], input[type="reset"] {
-webkit-appearance: none;
border-radius: 0;
border:none;
outline: none;
}
.clear {clear:both; width:100%; height:0px; line-height:0px; overflow: hidden;}
/*整体布局样式结束*/

.translateSelectLanguage{ width:120px; height:40px; line-height:40px; padding:0 10px; border:1px solid #e9e9e9; border-radius: 15px;}

.wapTop{ width:100%; height:80px; line-height:80px;  display: flex; }
.wapTop  .logo{   width:190px;    height:50px;    float:left;   margin-top:15px;}
.wapTop  .logo  img { width:100%; height:100%; }
.wapTop  .nav{ width:140px; float:right;  display: flex; margin-left:auto;}
.wapTop  .nav>div{ width:50%; height:40px;  margin-top:25px; text-align:center;}
.wapTop  .nav>div img{ width:36px; height:36px;}
.serachBox{ width:98%; height:50px; line-height:50px; position:relative; border-radius: 30px; border:2px solid #072a6a;  margin:20px auto; background:#ffffff; }
.serachBox input[type="text"]{ width:100%; height:50px; line-height:50px; text-indent: 20px;}
.serachBox button{ font-size:16px;  outline: none; border:none; position:absolute; right:-2px; top:-0px; width:100px; height:50px;  border-radius: 0px 50px 50px 0px; background:#072a6a; color:#ffffff;}

.menuBox{ width:98%; height:120px; margin:0 auto 10px; background:#fff; border-radius: 20px;}
.menuBox ul{ width:96%; padding:10px 10px; position:relative;  top:20px;}
.menuBox ul li{  width:33.3%; float:left; text-align:center;  }
.menuBox ul li img{ display: block; margin:0 auto; }

.imgBox{width: 98%; height:200px; margin:10 auto }
.imgBox .bimg{ width:48%; height:200px; float:left; margin:0 auto; border-radius: 20px; background:blue;}
.imgBox .rbox{ width:50%; float:right;}
.imgBox .rbox .rimg1{ width:96%; height:95px; margin:0 auto 10px; border-radius: 20px;  background:yellow;}
.imgBox .rbox .rimg2{ width:96%; height:95px; margin:0 auto; border-radius: 20px;  background:red;}

.cateBox{ width:98%; height: auto; margin:0 auto;}
.cateBox ul{ width:100%; height: auto; margin:0 auto; display: flex; flex-wrap: wrap; }
.cateBox ul li{ width:48%; height:35px; line-height:35px; text-align: center; margin:5px 1%; float:left; background:#ffffff; border-radius: 20px; }

.hidden-category {
    display: none;
}

.show-more-container {
    text-align: center;
    margin-top: 10px;
}

.show-more-btn {
    background: #f2f2f2;
    border: 1px solid #ddd;
    padding: 8px 20px;
    cursor: pointer;
    border-radius: 4px;
    font-size: 14px;
}

.show-more-btn:hover {
    background: #e0e0e0;
}

.productTit{ 
    width:100%; 
    height:30px; 
    line-height:30px; 
    margin:15px auto;
    display: flex;
    font-size:20px;
    justify-content: center;
}
.productTit img{ width:100px; height:5px; margin-top:12px;}

.productList{
    width:98%;
    margin:0 auto;
}

/* 使用 aspect ratio 方法 */
.productItem {
    width: 48%;
    float: left;
    margin: 1.5% 1%;
    background:#ffffff;
    /* overflow: hidden; */
    aspect-ratio: 1/1; /* 正方形比例 */
    border-radius: 20px;
}

.productItem .pli-img{
    width:96%;
    margin:0 auto;
}

.productItem img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 20px 20px 0px 0px;
}


.productItem .pliName{
    width:100%;
    height:40px;
    line-height:40px;
    text-align:center;
}
/* 或者使用 padding 技巧 */
.productItem-alt {
    width: 48%;
    float: left;
    margin: 1% 1%;
    position: relative;
    background: #ffffff;
    border-radius: 20px;
    overflow: hidden;
}

.productItem-alt::before {
    content: '';
    display: block;
    padding-top: 100%; /* 1:1 比例 */
}

.productItem-alt .content {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.productItem-alt img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}



.pageFooter{
    width:100%;
    border-top:1px solid #ddd;
    margin-top:20px;
    background:#ffffff;
    padding-top:10px;
}
.pageFooterNav{ width:100%;}
.pageFooterNav span{ float:left; width:33.3%; height:30px; line-height:30px; text-align:center;}

.pageFooterDesc{ width:100%; height:60px; line-height:60px; text-align:center; background:#ffffff;}


.loginMain{
    width:100%;
    background:#ffffff;
    margin:0 auto;
    position:relative;
    top:20px;
}
.loginTxt{
    width:100%;
    height:60px;
    line-height:60px;
    text-align:center;
    font-size:18px;
    font-weight: 600;
}
.loginDiv{
    width:96%;
    margin:0 auto;
}

.loginSmallTxt{ width:100%; line-height:50px; }

.loginInput{ width:96%; height:auto; margin:10px auto;}

.loginInput input[type="text"],.loginInput input[type="password"]{ width:100%; height:50px; line-height:50px; margin:10px auto; border:1px solid #e9e9e9;  text-indent: 20px;}

.codeTr{ width:100%; position:relative;}
.codeTr span{ position:absolute; right:0px; top:20px;}

.loginBtnTxt{ width:100%; height:50px; line-height:50px;}
.loginBtnTxt span{ width:50%; float:left; text-align:center;}

.loginBtn{ width:100%; height:40px; text-align:center; margin-top:10px; border-radius: 20px;  margin-bottom:20px; background:#1b81cc; color:#fff; border:none;}

.registerMain{ width:100%; height:auto; line-height:50px; background:#ffffff;}
.registerTxt{ text-align:center;}
.registerSmallTxt{ width:98%; line-height:40px; margin:0 auto;}
.registerT100{ width:98%; height:50px; line-height:50px; margin:10px auto;}
.registerT100 label{ width:100px; float:left; }
.registerT100 input[type="text"],.registerT100 input[type="password"]{ width:calc(100% - 110px); height:50px; line-height:50px; margin:0 auto; border:1px solid #e9e9e9;  text-indent: 20px; float:right; }
.registerT100 span{ margin-left:20px;}
#gender{ height:48px; line-height:48px; width:50px; float:right;  border:none; margin-top:2px; margin-right:2px;}
.registerBtn{ width:80%; height:40px; line-height:40px; margin:20px auto; background:#1b81cc; color:#ffffff; border-radius: 20px;  margin-left:10%; border:none;}

.registerHeader{ width:100%; height:50px; line-height:50px; text-align:center; font-size:24px; border-bottom:1px solid #e9e9e9;}

.navMuli{ width:100%; height:50px; line-height:50px; display: flex; text-indent: 20px;}

.companyList{ 
    width:100%; 
    line-height:40px;
    text-indent: 20px;
    background:#ffffff;
    padding-bottom:20px;
}

.companyList .left .x{ margin-left:20px; }

.companyCover{
    width:100%;
}

.companyCover img{
    width:92%;
    margin:0 auto;
}



.companySearch{
    width:100%;
    height:50px;
    line-height:50px;
    position:relative;
    background:#ffffff;
    margin-bottom:20px;
}
.companySearch input{
    width:100%; height:50px; line-height:50px; border:1px solid #e9e9e9; text-indent: 10px;
}
.companySearch button{
    position:absolute;
    right:0px;
    top:1px;
    width:100px;
    line-height:50px;
    background:#037ccc;
    color:#ffffff;
    border:none;
    outline: none;
}

.mobanHeader{
    width:100%;
    background:#ffffff;
}

.headerBox{
    width:100%;
    height:200px;
}

.headerBox .logo{ width:30%; float:left; height:50px; line-height:50px; margin-right:20px; margin:0 auto; }
.headerBox .companyName{ width:60%; float:left; height:50px; line-height:50px;  }

.headerBox .ewmBox{ width:100%;}
.headerBox .ewmBox .ewmB1, .headerBox .ewmBox .ewmB2{ width:50%; float:left;}
.headerBox .ewmBox img{ width:100px; height:100px; display: block; margin:0 auto;}
.headerBox .ewmBox span{ width:100%; height:40px; line-height:40px; display: block; text-align:center;}

.mobanMenu .menu{ color:#ffffff;  padding:0 20px;}
.mobanMenu .menu a{ width:33.3%; display: block; float:left; text-align:center; color:#ffffff; }

.blockDiv{
    width:98%;
    background:#fff;
    margin:0 auto;
}
.blockDiv .titDiv{ width:100%; height:50px; line-height:50px; text-indent: 10px;  border:1px solid #e9e9e9; background:#e9e9e9;}
.blockDiv .titDiv a{ float:right; padding-right:10px; }
.blockDiv .blockBody{ line-height:40px; }
.blockDiv .blockBody span{ width:98%; height:auto; line-height:40px; display: block; }
.mobanList{ width:100%; height:auto; }
.productList{ width:100%; height:auto; line-height:auto!important;}
.productList ul{ width:100%; height:auto;}
.productList ul li{ width:98%;  margin:10px 1%; padding:0 0; }
.productList ul li img{ width:100%; height:auto; display: block;}
.productList ul li span{ width:100%; height:50px; line-height:50px; text-align:center; display: block;}


.meMenuUl{width:100%; background:yellow;}
.meMenuUl li { width:46%; margin:10px 2%; float:left; height:40px; line-height:40px;  background:#ffffff;}

.tagT{width:100%; height:50px; line-height:50px; background:#072a6a; margin-top:20px;}
.tagT li{float:left; width:46%; margin:0 2%; text-align:center; color:#ffffff;}

.cardEditTr{ width:98%; height:50px; line-height:50px; margin:10px auto; position:relative}
.cardEditTr input{ width:100%; height:50px; line-height:50px; background:#ffffff; border:none; text-indent:20px;}
.cardEditTr span{ position:absolute; right:20px; top:0px;}


.submitBtn1,.submitBtn2{ width:150px; height:50px; line-height:50px; background:#072a6a; color:#ffffff; border:none; border-radius:20px; }

.tableTr{ display:flex}