#mainContents {padding:70px 0; min-height: 80vh;}
#mainContents .menu{position:absolute; right:0; top:20px; font-size:35px;}


.user-wrap{font-size:30px; font-weight: 700; margin-bottom: 40px;}
.user-wrap span{color:#6681eb;}

.btnBox-wrap{margin-bottom: 50px;}
.btnBox-wrap .in{display:flex; margin:-5px;}
.btnBox-wrap .in>div{ width: 33%; padding:5px; }
.btnBox-wrap .in>div a{display:flex; padding:30px 20px; flex-direction:column; justify-content:center; align-items:center; color:#666; font-weight:700; font-size:20px;  width: 100%; height: 100%; border:1px solid #ddd;}
.btnBox-wrap .in>div a img{margin-bottom: 20px;}

.notice-wrap{margin-bottom: 30px;}
.notice-wrap .auto{display:flex;}
.notice-wrap .img{width:calc(50% - 60px); margin-right: 60px;}
.notice-wrap .img img{border:1px solid #d2d3d5;}
.notice-wrap .list{width:50%;}
.notice-wrap .list ul{height: 300px;}
.notice-wrap .list ul li{border-bottom:1px solid #d2d3d5; }
.notice-wrap .list ul li:last-child{margin-bottom: 0px;}
.notice-wrap .list ul li .tag{width: 110px; height:30px; display:flex; justify-content:center; align-items:center; color:#fff; font-size:16px; background:#333; border-radius:10px; margin-bottom: 10px;}
.notice-wrap .list ul li .tag.orenge{background:#f9711d;}
.notice-wrap .list ul li .tag.purple{background:#6681eb;}
.notice-wrap .list ul li .txt{padding-bottom:10px; width: 100%; display:flex; justify-content:space-between;}
.notice-wrap .list ul li .txt .tit{font-size:24px; color:#333; text-overflow: ellipsis; overflow: hidden; white-space: nowrap;}
.notice-wrap .list ul li .txt .date{font-size:20px; color:#888;}
.notice-wrap .list .more{display:flex; justify-content:center; align-items:center; font-size:20px; color:#fff; width:150px; height:50px; border-radius:30px; background-color:#adadad; margin-top: 60px; margin-left:auto;}

.prd-list{margin-bottom: 40px; /* padding:0 20px; */}
.prd-list .tit{font-size:24px; color:#333; font-weight: 700; margin-bottom: 15px;}
.prd-list ul{display: flex;}
.prd-list ul li{width:16.6666%;}
.prd-list ul li .img{position: relative; border:1px solid #d2d3d5; margin-bottom: 10px; text-align: center; padding-top:100%;}
.prd-list ul li .img img{position:absolute; top:0; left:0; width:100%;}
.prd-list ul li .txt {font-size:15px; color:#333;}
.prd-list ul li .txt .cate{font-size:15px; font-weight: 700; color:#f9711d;}
.prd-list ul li .txt p.prd-name{ text-overflow: ellipsis; overflow: hidden; white-space: nowrap;}
.prd-list ul li .txt p.prd-spec{text-overflow: ellipsis; overflow: hidden; white-space: nowrap;}
.prd-list ul li .txt p span{font-size:20px; font-weight: 700;}




@media (max-width:1280px) {

#mainContents .menu{top:15px; right:8px;}

.user-wrap{word-break:keep-all; font-size:25px;}

.notice-wrap .img{margin-bottom: 20px;}
.notice-wrap .list{width: 100%; margin-right: 30px;}
.notice-wrap .list ul{height:150px;}
.notice-wrap .list ul li .txt{/* flex-direction:column; */}
.notice-wrap .list ul li .txt .tit{font-size:15px;}
.notice-wrap .list ul li .txt .date{font-size:15px;}
.notice-wrap .list ul li .tag{width:80px; height: 23px; font-size: 14px;}

.prd-list .tit{font-size:20px;}

.btnBox-wrap .in>div a{padding:15px 10px;}
.btnBox-wrap .in>div a p{font-size:15px;}

}

@media (max-width:640px) {
#mainContents .menu{top:10px;}

.btnBox-wrap .in{flex-direction:column; }
.btnBox-wrap .in>div{ width: 100%;}
.btnBox-wrap .in>div a{flex-direction:row; font-size:15px; padding-left:20px; justify-content:flex-start;}
.btnBox-wrap .in>div a img{margin-bottom: 0; width:50px; margin-right: 10px;}

.user-wrap{font-size:18px; margin-bottom: 20px;}
.btnBox-wrap{margin-bottom: 10px;}

.notice-wrap .auto{flex-direction:column;}
.notice-wrap .img{width:100%; margin-right: 0;}
.notice-wrap .list .more{margin-top: 30px; font-size:16px; width:100px; height:35px; margin-right:auto;}


    .prd-list ul li .txt .cate{font-size:13px;}
    .prd-list ul li .txt{font-size:13px;}
    .prd-list ul li .txt p span{font-size:18px;}

    .prd-list .swiper {padding-right:20%}


}