html, body {
    background: #f5f7fd;
    margin: 0;
    height: 100%;
    font-size: 14px;
    font-family: 'Microsoft YaHei', '微软雅黑', serif;
}

.container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
}

.file-upload {
    display: inline-block;
    background-color: #28a745;
    color: #fff;
    border-radius: 4px;
    border: none;
    font-size: 14px;
    line-height: 36px;
    padding: 0 10px;
    cursor: pointer;
}

.file-upload:hover {
    background-color: #20c997;
}

.file-upload:active {
    background-color: #20c997;
    transform: translateY(2px);
}

.file-upload input[type="file"] {
    display: none;
}

a {
    color: #333;
    text-decoration: none;
    cursor: pointer
}

.nav-item-a {
    margin: 5px;
    color: #1890ff;
    font-size: 14px;
}

img {
    max-width: 100%;
}

/*滚动条 阴影~圆角*/
::-webkit-scrollbar {
    width: 4px;
    height: 4px;
    background-color: #f1f1f1;
}

::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 4px #f1f1f1;
    border-radius: 10px;
    background-color: #f5f5f5;
}

/*滑块 阴影~圆角*/
::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 4px dodgerblue;
    background-color: rgb(149, 147, 147);
}

[v-cloak] {
    display: none
}

.top10 {
    margin-top: 10px;
}

.flex {
    display: flex;
}

.flex-v {
    display: flex;
    flex-direction: column;
}
.flex-item{
    flex:1;
    margin:5px;
}

.left-container {
    flex: 5;
    margin-right: 10px;
}

.right-container {
    max-width: 300px;
    box-sizing: border-box;
    flex: 2;
}

/*card-box*/
.card-box {
    background: #fff;
}

.card-box .card-title {
    display: flex;
    height: 42px;
    font-size: 16px;
    text-indent: 1em;
    align-items: center;
    border-bottom: 1px solid #f2f2f2;
    position: relative;
}
.card-box .card-title .more-link{
    font-size:12px;
    position: absolute;
    right:10px;
    top:15px;
    color:#7b7b7b;
}

.card-box .card-content {
    padding: 10px;
}

/**/
.mianze {
    background-color: #fff4cc;
    color: #333;
    padding: 20px;
    border-radius: 5px;
    border: 1px solid #ffc700;
    font-size: 12px;
}


.product-detail {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.product-detail .name {
    font-weight: bold;
    font-size: 16px;
}

.product-detail .price {
    color: #7b7b7b;
    font-size: 14px;
    padding: 10px;
    background-color: #eee;
}

.product-detail .price .num {
    font-weight: bold;
    color: #FF6619;
    font-size: 24px;
    padding: 10px;

}

.product-detail .infos {


    flex-wrap: wrap;
}

.product-detail .infos .flex-item {
    box-sizing: border-box;
    width: 50%;
    padding: 10px 0;
}


.filter-box {
    display: flex;
    width: 100%;
    font-size: 14px;
    flex-direction: column;
    background-color: #fff;

}

.filter-box .filter-item {
    min-height: 45px;
    display: flex;
    align-items: center

}

.filter-box .filter-item label {
    font-size: 14px;

    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    background-color: #eee;
    color: #7b7b7b;
    margin: 5px;
    padding: 2px 5px;
}

.filter-box .filter-item .param-box {
    flex: 1;
    display: flex;
    align-items: center;
}

.filter-box .filter-item .alinks-item {
    margin: 0 5px;
    flex-shrink: 0;
}

.product-ressult-box {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;

}

.product-ressult-box .product-item {
    position: relative;
    box-sizing: border-box;
    background-color: #fff;
    width: 50%;
    max-width: 200px;
    display: flex;
    padding: 5px 10px;
    flex-direction: column;
    margin-top: 10px;
    color: #7b7b7b;
    box-shadow: 2px 2px 2px #ddd;
}

.product-ressult-box .product-name {
    font-weight: bold;
    overflow: hidden;
    text-overflow: ellipsis;;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    color: #333;
}

.product-ressult-box .product-type {

    overflow: hidden;
    text-overflow: ellipsis;;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;

}

.product-ressult-box .product-brand {
    display: flex;

}



/*alink-box list*/
.alinks-box {
    display: flex;
    flex-wrap: wrap;
}

.alinks-box .alinks-item {
    margin: 5px;
    color: #1890ff;
}

/*chat-box */
.chat-box {
    padding: 10px;
    display: flex;
    flex-direction: column;
    flex: 1;
    overflow-y: scroll;
}

.chat-box .loadmore {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 14px;
    color: #7b7b7b;
    margin-top: 10px;
    cursor: pointer;
}


.chat-box .msn-item {
    display: flex;
    margin-top: 10px;
}

.chat-box .msn-item.send {
    justify-content: end;
}

.chat-box .msn-item .info {
    display: flex;
    max-width: 70%;
    justify-content: right;
}

.chat-box .info.send .msn-box .msn {
    margin-right: 10px;
    background-color: lawngreen;
}

.chat-box .info.send .msn-box .msn:after {
    content: '';
    border-left: 6px solid lawngreen;
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
    top: 15px;
    right: -6px;
    position: absolute;
}

.chat-box .info.reply .msn-box .msn {
    margin-left: 10px;
    background-color: #fff;
    display: flex;
    flex-wrap: nowrap;
    padding: 10px 20px;

}


.chat-box .info.reply .msn-box .msn .info {
    flex: 1;
    display: flex;;
    flex-direction: column;
    justify-content: space-evenly;
    margin-right: 10px;


}

.chat-box .info.reply .msn-box .msn:after {
    content: '';
    border-right: 6px solid #fff;
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
    top: 15px;
    left: -6px;
    position: absolute;
}

.chat-box .msn-box {
    flex: 1;
}


.chat-box .msn-box .msn {
    display: flex;

    box-shadow: 4px 4px 8px #ddd;
    word-wrap: break-word;
    word-break: break-all;
    font-size: 14px;
    background-color: #fff;
    color: #333;
    border-radius: 4px;
    padding: 4px 10px;
    margin-top: 4px;
    position: relative;
}
/*doc-upimg-list-wap*/
.doc-upimg-list-wap{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.doc-upimg-list-wap .doc-item{
    display: flex;
    flex-direction: column;
    width:100px;
    padding:5px;
    background-color: #fff;

}
.doc-upimg-list-wap  .doc-item .doc-img{
    width: 100%;
    height:80px;
}

/*doc-upimg-list*/
.doc-upimg-list{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
.doc-upimg-list .doc-item{
    display: flex;
    flex-direction: column;
    width:200px;
    padding:10px;
    background-color: #fff;
    margin:10px;
}
.doc-upimg-list .doc-item .doc-img{
    width: 100%;
    height:160px;
}
.doc-upimg-list .doc-item .doc-title{
    padding:5px 0;
    font-size:14px;
}


/*data-doc-list-leftimg*/

.doc-list[data-doc-list-leftimg] {
    display: flex;
    flex-direction: column;
}

.doc-list[data-doc-list-leftimg] .list-item {
    background-color: #fff;
    padding: 10px;
    display: flex;
    margin-top: 10px;

}

.doc-list[data-doc-list-leftimg] .list-item .article-img {

    width: 235px;
    height: 0;
    padding-bottom: 143px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    margin-right: 10px;
    border: 1px solid #eee;

}


.doc-list[data-doc-list-leftimg] .list-item .infos {
    display: flex;
    flex: 1;
    flex-direction: column;
    justify-content: space-between;
}

.doc-list[data-doc-list-leftimg] .list-item .title {
    font-size: 16px;
    font-weight: bold;
    overflow: hidden;
    text-overflow: ellipsis;;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}

.doc-list[data-doc-list-leftimg] .list-item .desc {
    font-size: 14px;
    color: #7b7b7b;
    overflow: hidden;
    text-overflow: ellipsis;;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.doc-list[data-doc-list-leftimg] .list-item .otherinfos {
    display: flex;
    font-size: 14px;
    color: #7b7b7b;
    justify-content: space-between;
}

.doc-list[data-doc-list-leftimg] .list-item .otherinfos .keywords-box a {
    margin: 0 4px;
    font-size: 12px;
    color: #7b7b7b;
}


/*doc-list-img*/
.doc-list[data-doc-list-img] {
    display: flex;
    flex-direction: column;
}

.doc-list[data-doc-list-img] .list-item {
    background-color: #fff;
    padding: 10px;
    display: flex;
    margin-bottom: 10px;
    flex-direction: column;
}

.doc-list[data-doc-list-img] .list-item .title {
    font-size: 16px;
    height: 28px;
    overflow: hidden;
    text-overflow: ellipsis;;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}

.doc-list[data-doc-list-img] .list-item .desc {
    font-size: 14px;
    margin: 10px 0;
    color: #7b7b7b;
    overflow: hidden;
    text-overflow: ellipsis;;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.doc-list[data-doc-list-img] .list-item .imgs-box {
    display: flex;
}

.doc-list[data-doc-list-img] .list-item .img {
    max-width: 20%;
    margin: 10px 5px;
}

.doc-list[data-doc-list-img] .list-item .img img {
    max-width: 100%;
}

.doc-list[data-doc-list-img] .list-item .infos {
    display: flex;
    font-size: 14px;
    color: #7b7b7b;
    justify-content: space-between;
}

.doc-list[data-doc-list-img] .list-item .infos .keywords-box a {
    margin: 0 4px;
    font-size: 12px;
    color: #7b7b7b;
}


.doc-list[data-doc-list-simple] {
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
}

.doc-list[data-doc-list-simple] .doc-item {
    display: flex;
    flex-direction: column;
    padding: 5px;
}

.doc-list[data-doc-list-simple] .doc-item .doc-img {
    max-width: 100%;
    max-height: 200px;
}

.doc-list[data-doc-list-simple] .doc-item .doc-title {
    font-size: 15px;
    align-items: center;
    height: 32px;
    line-height: 32px;
    overflow: hidden;
    text-overflow: ellipsis;;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}

.doc-list[data-doc-list-simple] .doc-item .doc-desc {
    font-size: 14px;
    color: #7b7b7b;
    overflow: hidden;
    text-overflow: ellipsis;;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}

/*tbk goods list*/
.goods-list[data-tbk-goods-list] {
    background-color: #fff;
    padding: 10px 0;
    box-sizing: border-box;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;

}

.goods-list[data-tbk-goods-list] .goods-item {
    flex: 1;
    max-width: 200px;
    margin: 10px;
}

.goods-list[data-tbk-goods-list] .goods-item img {
    width: 100%;

}

.goods-list[data-tbk-goods-list] .goods-title {
    font-size: 14px;
    overflow: hidden;
    text-overflow: ellipsis;;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.goods-list[data-tbk-goods-list] .goods-title a {
    color: #333 !important;
}

.goods-list[data-tbk-goods-list] .goods-price {
    color: red;
    margin: 5px 0;
    font-size: 14px;
}


.goods-list[data-tbk-goods-list] .goods-desc {
    font-size: 12px;
    color: #fff;
    padding: 5px;
    border-radius: 2px;
    text-indent: 1em;
    background-image: linear-gradient(-45deg, #e64340, #ff3b30);
    position: relative;
}

.goods-list[data-tbk-goods-list] .goods-desc:before {
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #fff;
    position: absolute;
    left: 60%;
    top: -3px;
}

.goods-list[data-tbk-goods-list] .goods-desc:after {
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #fff;
    position: absolute;
    left: 60%;
    bottom: -3px;
}


/*img-swiper*/
.swiper-container[data-img-swiper] {
}

.swiper-container[data-img-swiper] .img-item {
    position: relative
}

.swiper-container[data-img-swiper] .img-item .img {

    width: 100%;
    height: 0;
    padding-bottom: 100%;
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat;

}


/*book-swiper*/
.swiper-container[data-book-swiper] {
}

.swiper-container[data-book-swiper] .article-item {
    display: flex
}

.swiper-container[data-book-swiper] .article-item .article-img {

    width: 120px;
    height: 140px;
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat;
    margin-right: 10px;

}

.swiper-container[data-book-swiper] .article-item .article-infos {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.swiper-container[data-book-swiper] .article-item .article-infos .doc-title {
    font-size: 16px;
    font-weight: bold;
    overflow: hidden;
    text-overflow: ellipsis;;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.swiper-container[data-book-swiper] .article-item .article-infos .doc-desc {
    overflow: hidden;
    color: #7b7b7b;
    text-overflow: ellipsis;;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}


/*article-swiper*/
.swiper-container[data-article-swiper] {
}

.swiper-container[data-article-swiper] .article-item {
    position: relative
}

.swiper-container[data-article-swiper] .article-item .article-img {

    width: 100%;
    height: 0;
    padding-bottom: 70%;
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat;

}

.swiper-container[data-article-swiper] .article-item .doc-title {
    position: absolute;
    z-index: 999;
    height: 45px;
    line-height: 45px;
    align-items: center;
    bottom: 0;
    color: #fff;
    background-color: rgba(0, 0, 0, 0.5);
    width: 100%;
    padding: 0 5px;
    box-sizing: border-box;
    overflow: hidden;
    text-overflow: ellipsis;;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}


/*swiper goods  list*/
.swiper-container[data-tbk-goods-swiper] .goods-item {
    display: flex;
    box-sizing: border-box;
}

.swiper-container[data-tbk-goods-swiper] .goods-item .goods-img {
    width: 100px;
    margin-right: 10px;
}

.swiper-container[data-tbk-goods-swiper] .goods-item .infos {
    flex: 1;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;

}

.swiper-container[data-tbk-goods-swiper] .goods-item .goods-img img {
    width: 100%;
    height: 100%;
}

.swiper-container[data-tbk-goods-swiper] .goods-item .goods-title {
    font-size: 14px;
    flex: 1;
    line-height: 1.5;
    text-overflow: ellipsis;;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.swiper-container[data-tbk-goods-swiper] .goods-item .goods-title a {
    color: #333;
}

.swiper-container[data-tbk-goods-swiper] .goods-item .infos .goods-desc {
    font-size: 12px;
    color: #fff;
    padding: 5px;
    border-radius: 2px;
    text-indent: 1em;
    background-image: linear-gradient(-45deg, #e64340, #ff3b30);
    position: relative;

}

.swiper-container[data-tbk-goods-swiper] .goods-item .infos .goods-desc:before {
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #fff;
    position: absolute;
    left: 60%;
    top: -3px;
}

.swiper-container[data-tbk-goods-swiper] .goods-item .infos .goods-desc:after {
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #fff;
    position: absolute;
    left: 60%;
    bottom: -3px;
}

.swiper-container[data-tbk-goods-swiper] .goods-price {
    color: red;
    font-size: 14px;
    margin: 5px;
}


.swiper-container[data-tbk-goods-swiper-img] .goods-item {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 460px;

}

.swiper-container[data-tbk-goods-swiper-img] .goods-item .goods-img {
    width: 100%;
    height: auto;
    display: flex;
    justify-content: center;
}

.swiper-container[data-tbk-goods-swiper-img] .goods-item .goods-title {
    font-size: 14px;
    flex: 1;
    line-height: 1.5;
    overflow: hidden;
    text-overflow: ellipsis;;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    color: #333;
    margin: 5px 0;
}


.swiper-container[data-tbk-goods-swiper-img] .goods-item .goods-desc {
    font-size: 12px;
    color: #fff;
    padding: 5px;
    border-radius: 2px;
    text-indent: 1em;
    background-image: linear-gradient(-45deg, #e64340, #ff3b30);
    position: relative;
}

.swiper-container[data-tbk-goods-swiper-img] .goods-item .goods-desc:before {
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #fff;
    position: absolute;
    left: 60%;
    top: -3px;
}

.swiper-container[data-tbk-goods-swiper-img] .goods-item .goods-desc:after {
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #fff;
    position: absolute;
    left: 60%;
    bottom: -3px;
}

.swiper-container[data-tbk-goods-swiper-img] .goods-item .goods-price {
    color: red;
    font-size: 14px;
    margin-top: 10px;
}

/*aritcle-detail*/

.article-body {
    background: #fff;
    box-sizing: border-box;
    padding: 10px;
    line-height: 2;
    font-size: 16px;
}


/**/
.category-name-list[data-cate-name-list] {
    display: flex;
    flex-wrap: wrap;
}

.category-name-list[data-cate-name-list] .nav-item {
    font-size: 12px;
    background-color: rgba(67, 112, 245, .1);;
    padding: 5px;
    margin: 5px;
    color: #4370f5;
    cursor: pointer;
}

/*alinks*/
.alinks[data-alinks] {
    display: flex;
    flex-wrap: wrap;
}

.alinks[data-alinks] .key-item {
    background-color: #f1f1f1;
    color: #6b6b6b;
    margin: 6px;
    padding: 2px 6px;
    font-size: 14px;
    border-radius: 5px;
}


/*doc-list-img*/


/*doc-list*/
.doc-list[data-doc-list] {
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    background-color: #fff;

}

.doc-list[data-doc-list] .doc-item {
    display: flex;
    flex-direction: column;
    padding: 5px;
}

.doc-list[data-doc-list] .doc-item .doc-title {
    font-size: 15px;
    height: 28px;
    font-weight: bold;
    overflow: hidden;
    text-overflow: ellipsis;;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}

.doc-list[data-doc-list] .doc-item .doc-desc {
    font-size: 14px;
    color: #7b7b7b;
    overflow: hidden;
    text-overflow: ellipsis;;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}

/*company-list*/
.company-list[data-company-list] {
    justify-content: space-between;
    flex-wrap: wrap;
}

.company-list[data-company-list] .company-item {
    box-sizing: border-box;
    display: flex;
    margin-bottom: 10px;
    flex-direction: column;
    justify-content: space-evenly;
    width: 24.5%;
}

.company-list[data-company-list] .company-img img {
    width: 100%;
}

.company-list[data-company-list] .company-name {
    font-weight: bold;
    font-size: 14px;
}


/*tab*/

.tab-header {
    display: flex;
    border-bottom: 1px solid #eee;
    background: #fff;
}

.tab-header .tab-title {
    height: 42px;
    display: flex;
    align-items: center;
    justify-items: center;
    padding: 0 10px;
    cursor: pointer;
    font-weight: bold;
    font-size: 16px;
}

.tab-header .tab-title.active {
    border-bottom: 2px solid red;
}

.tab-content {
}

.tab-content .tab-pane {
    display: none
}

.tab-content .tab-pane.active {
    display: block;
}


/*问答列表*/
.answer-list[data-answer-list] {
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
}

.answer-list[data-answer-list] .answer-item {
    padding: 10px;
    margin-bottom: 10px;
    background-color: #fff;
}

.answer-list[data-answer-list] .answer-userinfo {
    display: flex;
    height: 60px;

    align-items: center;
}

.answer-list[data-answer-list] .answer-userinfo .avatar {
    width: 45px;
    height: 45px;
    overflow: hidden;
    border-radius: 50%;
    border: 1px solid #eee;
}

.answer-list[data-answer-list] .answer-content {
    margin-top: 20px;
    font-size: 16px;
    line-height: 1.6;
}

.answer-list[data-answer-list] .answer-userinfo .userinfo {
    margin-left: 10px;
    display: flex;
    flex-direction: column;
}

.answer-list[data-answer-list] .answer-userinfo .userinfo .nickname {
    font-weight: bold;
}

.answer-list[data-answer-list] .answer-userinfo .userinfo .desc {
    font-size: 12px;
    color: #7b7b7b;
}

/*广告组件样式*/
.adv[data-adv] {
    display: block;
    max-width: 100%;
    padding: 4px;
    box-sizing: border-box;
    background-color: #fff;

}

.adv[data-adv] .img {
    width: 100%;
}

.adv[data-adv] .adv-title {
    font-weight: bold
}

.adv[data-adv] .adv-desc {
    font-size: 14px;
    color: #7b7b7b;
}

.pagination{
    display: flex;
    padding:0;
}
.pagination li {
    background: #fff;
    padding: 5px 8px;
    display: flex;
    align-items: center;
    justify-content: center;

}

.pagination li a {
    color: #333;
}

.pagination li.active {
    background: darkorange;
    color: #fff;
}

.pagination li:after {
    content: '';
    border-right: 1px solid #ccc;
}

.el-input-group__append, .el-input-group__prepend {
    padding: 0 10px !important;

}


.footer-top {
    background-color: #222c3c;
    color: #818394;
    padding: 20px;
}

.footer-top .partner-item {
    margin: 10px;
}

.footer-top .flex-item {
    flex: 1;
    justify-content: center;
}

.footer-top .qrcode {
    display: flex;
}

.footer-top .qrcode .qrcode-item {
    width: 100px;
    align-items: center;
    margin: 10px;

}

.footer-bottom .label {

    font-size: 16px;
}
.footer-bottom .flex-item {
    margin:5px 0;
}

.footer-bottom {
    color: #818394;
    background-color: #1d2431;
    padding: 20px;
}

.footer-bottom .alinks-item, .footer-top .alinks-item {
    color: #ccc;

}

.footer-bottom .label-title, .footer-top .label-title {
    font-size: 16px;
}

.container-title strong{
    padding: 10px 10px;
    font-size: 1.4rem;

}

.container-title{height: 60px;display: flex;align-items: center}

.field{justify-content: space-between}
.field .flex-item{position:relative;width:24%;margin:5px;}
.field .flex-item img{box-shadow:4px 4px 4px #ccc;border-radius:5px;max-width:100%;}
.field .field-name{position:absolute;width:100%;text-align:center;left:0%;top:40%;font-size:24px;color:#fff;text-shadow: black 0.1em 0.1em 0.2em}
.field .field-link{display:inline-block;padding:5px 10px;border:1px solid #ccc;position:absolute;right:10px;bottom:10px;color:#fff;border-radius:5px;  font-size:14px;}

.field .wap-flex-item{flex:1;}
.field .wap-flex-item a{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.field .wap-flex-item img{width:50%;}


.scrollbar-flex-brand_logo_content{    display: flex;}
.scrollbar-flex-brand_logo_content .brand-item {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 80px;
    height: 50px;
    margin: 10px;
    text-align: center;
    border-radius: 4px;

    color: var(--el-color-danger);
}
.brand-logo-list{
    display: flex;
    flex-wrap: wrap;
}
.brand-logo-list .brand-item{
    display: flex;
    flex-direction: column;
    align-items: center;
    margin:10px;
}
.brand-logo-list .brand-item .brand_logo{
     width:100px;

    display: flex;
    align-items: center;
    justify-content: center;
    height:50px;

}

.lable-div{
    flex-shrink: 0;
}

.box-shadow {
    box-shadow: 2px 6px 2px #ddd;
    border: 1px solid #ddd;
}

.dzfw_a_item{background:#fff;border-radius:5px;padding:40px;height:108px;}
.dzfw_a_item .title{font-size:28px;}
.dzfw_a_item .intro{font-size:18px;color:#b27412;}
.dzfw_a_item-bttom{margin-top:30px;}
.form_record{
    box-sizing: border-box;
    color:#fff;
    background:#ef5615;
    padding:25px;
   display: flex;
    flex-direction: column;
    border-radius:5px;
}
.form_record .form-title{font-size:24px;margin-top:20px;letter-spacing:1px;}
.form_record .form-btn{ display:inline-block;text-align:center;background:#fff;margin-top:15px;padding:5px 0;font-size:24px;color:#b27412;letter-spacing:4px;}
.form_record .form-footer .info{font-size:18px;margin-top:30px;letter-spacing:1px;}
.form-footer img{margin-right:10px;}
.form-footer .tel1{font-size:20px;letter-spacing:1px;margin-top:1px;}
.form-footer .tel2{font-size:18px;margin-top:1px;}


/*优势*/
.superiority{background-color: #fff}
.superiority .title-infos{text-align:center;margin-top:30px;margin-bottom:30px;}
.superiority .title-infos p{font-size:16px;margin-top:10px;letter-spacing:2px;color:#7b7b7b;}
.superiority .title-infos strong{font-size:32px;}

.superiority .flex .flex-item{text-align:center;}
.superiority .flex .flex-item p{line-height:1.5;font-size:14px;color:#7b7b7b;}
.superiority .flex .flex-item .circle-font{
    font-weight:bold;
    font-size:48px;
    color:#b27412;
    border:4px solid #b27412;
    width:80px;
    height:80px;
    border-radius:50%;
    line-height:70px;
    margin:10px auto;

}
.superiority .flex .flex-item .circle-font-small{
    font-weight:bold;
    font-size:32px;
    color:#b27412;
    border:4px solid #b27412;
    width:60px;
    height:60px;
    border-radius:50%;
    line-height:50px;
    margin:10px auto;

}

.superiority-btn-box{
    text-align:center;
    margin-top:50px;

}

.superiority-btn-box strong{font-size:24px;letter-spacing:2px;}
.superiority-btn-box button{background:#b27412;color:#fff;padding:10px 60px;font-size:18px;margin-top:10px;border-radius:5px;border: 1px solid transparent;
    outline: none; }
.agon_red{
    background-color: red;
}
.agon_red .left{
    border-right: 17.5px solid red!important;
    border-top: 25px solid transparent;
    border-bottom: 25px solid transparent;

}

.agon_red .right{
    border-left: 17.5px solid red!important;
    border-top: 25px solid transparent;
    border-bottom: 25px solid transparent;
}
.agon_zs{
    background-color: #bc91fd;
}
.agon_zs .left{

    border-right: 17.5px solid #bc91fd!important;
    border-top: 25px solid transparent;
    border-bottom: 25px solid transparent;
}
.agon_zs .right{
    border-left: 17.5px solid #bc91fd!important;
    border-top: 25px solid transparent;
    border-bottom: 25px solid transparent;
}

.agon_blue{
    background-color: #2faeff;
}
.agon_blue .left{
    border-right: 17.5px solid #2faeff!important;
    border-top: 25px solid transparent;
    border-bottom: 25px solid transparent;
}


.agon_blue .right{
    border-left: 17.5px solid #2faeff!important;
    border-top: 25px solid transparent;
    border-bottom: 25px solid transparent;
}

.agon_orange{
    background-color: orange;
}
.agon_orange .left{
    border-right: 17.5px solid orange!important;
    border-top: 25px solid transparent;
    border-bottom: 25px solid transparent;
}

.agon_orange .right{
    border-left: 17.5px solid orange!important;
    border-top: 25px solid transparent;
    border-bottom: 25px solid transparent;
}



.hexagon {
    width: 25px;
    height: 50px;
    position: relative;
    text-align:center;
    line-height:50px;
    color:#fff;
    font-weight:bold;
    font-size:24px;
   margin-left:13px;
}

.hexagon .left {
    width: 0;
    height: 0;
    position: absolute;
    left: -17.5px;
    top: 0;
    border-right: 17.5px solid red;
    border-top: 25px solid transparent;
    border-bottom: 25px solid transparent;
}

.hexagon .right {
    width: 0;
    height: 0;
    position: absolute;
    right: -17.5px;
    top: 0;
    border-left: 17.5px solid red;
    border-top: 25px solid transparent;
    border-bottom: 25px solid transparent;
}



.superiority_wap{width:100%;background:#fff;}
.superiority_wap .box-title{text-align:center;font-size:20px;line-height:1.5;height:3.2rem;}
.superiority_wap .box-desc{font-size:12px;text-align:center;color:#7b7b7b;}
.superiority_wap .word{flex-shrink: 0;width:50px;height:50px;}
.superiority_wap .desc{margin-left:15px;font-size:12px;color:#7b7b7b;}
.superiority_wap .flex-item-center{
  font-size:12px;
    color:#7b7b7b;
   align-items: center;
}
.superiority_wap  strong.word {
    font-size:32px;
    color: #b87807;

}



.zhaobiao{

}

/*招投标服务*/
.zhaobiao{  margin-top:20px;position: relative}
.zhaobiao .lunbo-title-box{position:absolute;top:40px;left:1%;z-index:9}
.zhaobiao .lunbo-btn-box{position:absolute;bottom:50px;left:20%;}
.zhaobiao .lunbo-btn-box .btn-item{display:inline-block;margin-right:20px;text-align:center;cursor:pointer;}
.zhaobiao .lunbo-btn-box .cur a{color:#b27412!important;}
.zhaobiao .lunbo-btn-box .btn-item a{font-size:16px;color:#7b7b7b;}

.zhaobiao .lunbo-title-box strong{font-size:28px;border-bottom:4px solid #b27412;padding:10px;}
 .lumbo-content{margin-top:130px;margin-left:40px;}
  .lumbo-content .container-title{padding:0;font-size:28px;color:#b27412;}
  .lumbo-content .container-intro{color:#7b7b7b;font-size:18px;padding-top:10px;}
  .lumbo-content .zhaobiao-more{background:#b27412;color:#fff;padding:5px;border-radius:5px;font-size:16px;}








/**footer-adv*/
.footer-adv{background:#fff;box-shadow:2px 6px 2px #ddd;border:1px solid #ddd;padding:10px;border-radius:5px;justify-content: space-between}
.footer-adv .flex-item{text-align:center;  flex: 1;}
.footer-adv .title{font-size:32px;}
.footer-adv .intro{font-size:18px;}
.footer-adv .flex-item button{background:#b27412;color:#fff;font-size:18px;
    padding:20px 40px;border:none;
    margin:10px;
}






.banners-box{
    position:relative;
    height:480px;
}
.banners-bg{position:absolute;left:0;top:0;max-width:100%;}
.banner-content{overflow:hidden;text-align:center;}
.banner-title{font-size:36px;display:inline-block;margin:30px auto;color:#FFF;padding:5px 20px;margin-top:100px;}
.banner-title strong{font-weight:normal;}
.banner-info{font-size:24px;color: #b27412;}
.form{width:600px;display:inline-block;margin-top:40px;}
.form .layui-input{border-radius:5px;background:#f1f1f1;color:#7b7b7b;width:300px;float:left;font-size:14px;}
.zhidao-btn{display:inline-block;background:#b27412;color:#fff;border-radius:5px;padding:0 20px;font-size:18px;margin:0px 10px;height:38px;line-height:38px;}
.layui-tab-title{

}
.layui-tab-title li {
    padding:0px 20px;
    font-size: 16px;

}

.layui-tab-brief>.layui-tab-title .layui-this {
    color: #000;
    font-weight:bold;

}
.layui-tab-brief>.layui-tab-title .layui-this::after{
    border-bottom:2px solid #b27412;

}

.introduc-p{
    padding:0px 20px;
    margin-top:20px;
    line-height:2;
    font-size:16px;
}

.floor-title {
    font-size: 32px;
    text-align: center;
    padding: 30px;
    position: relative;
}
.z9{font-size:42px;font-weight:bold;}
.z8{font-size:16px;}

.service .flex-item{padding:20px 40px;}
.service .flex-item .icon-img{display:inline-block;margin-right:40px;float:Left;}
.service .flex-item  .title{font-size:24px;padding-bottom:15px;}
.service .flex-item  .desc{font-size:16px;line-height:1.5;}

.jidi .flex-item{text-align:center;}
.jidi .flex-item .img{margin-bottom:10px;margin-top:20px;width:100px;height:100px;color:#fff;line-height:36px;}
.jidi .flex-item div.img{width:auto;}
.jidi .flex-item div.img strong{border-bottom:4px solid #b27412;padding-bottom:30px;font-size:36px;padding-top:20px;display:inline-block;}
.jidi .flex-item p{color:#fff;font-size:18px;margin-top:5px;}

.OFFICE{position:relative;height:750px;}

.en-title{font-size:40px;position:absolute;top:20px;}
.wd-title{font-size:32px;position:absolute;top:80px;color:orange;}

.OFFICE .img_1{position:absolute;top:160px;left:0;}
.OFFICE .img_1 img{width:500px;}

.OFFICE .img_2{position:absolute;top:300px;left:300px;z-index:999;}
.OFFICE .img_3{position:absolute;top:40px;right:100px;}
.OFFICE .img_3 img{width:500px;}
.OFFICE .img_4{position:absolute;bottom:220px;right:0px;}
.OFFICE .img_4 img{width:300px;}


/** timeline box structure **/
.timeline {
    list-style: none;
    padding: 20px 0 20px;
    position: relative;
}

.timeline:before {
    top: 0;
    bottom: 0;
    position: absolute;
    content: " ";
    width: 3px;
    background-color: #eee;
    left: 50%;
    margin-left: -1.5px;
}

.tldate {
    display: block;
    width: 200px;
    background: #cc9b36;
    border: 3px solid #cc9b36;
    color: #ededed;
    margin: 0 auto;
    padding: 3px 0;
    font-weight: bold;
    text-align: center;
    -webkit-box-shadow: 0 0 11px rgba(0,0,0,0.35);
}

.timeline li {
    margin-bottom: 25px;
    position: relative;
}

.timeline li:before, .timeline li:after {
    content: " ";
    display: table;
}
.timeline li:after {
    clear: both;
}
.timeline li:before, .timeline li:after {
    content: " ";
    display: table;
}
.tl-body img{max-width:100%;}
/** timeline panels **/
.timeline li .timeline-panel {
    width: 40%;
    float: left;
    background: #fff;
    border: 1px solid #d4d4d4;
    padding: 20px;
    position: relative;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.15);
    -moz-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.15);
    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.15);
}

/** panel arrows **/
.timeline li .timeline-panel:before {
    position: absolute;
    top: 26px;
    right: -15px;
    display: inline-block;
    border-top: 15px solid transparent;
    border-left: 15px solid #ccc;
    border-right: 0 solid #ccc;
    border-bottom: 15px solid transparent;
    content: " ";
}

.timeline li .timeline-panel:after {
    position: absolute;
    top: 27px;
    right: -14px;
    display: inline-block;
    border-top: 14px solid transparent;
    border-left: 14px solid #fff;
    border-right: 0 solid #fff;
    border-bottom: 14px solid transparent;
    content: " ";
}
.timeline li .timeline-panel.noarrow:before, .timeline li .timeline-panel.noarrow:after {
    top:0;
    right:0;
    display: none;
    border: 0;
}

.timeline li.timeline-inverted .timeline-panel {
    float: right;
}

.timeline li.timeline-inverted .timeline-panel:before {
    border-left-width: 0;
    border-right-width: 15px;
    left: -15px;
    right: auto;
}

.timeline li.timeline-inverted .timeline-panel:after {
    border-left-width: 0;
    border-right-width: 14px;
    left: -14px;
    right: auto;
}


/** timeline circle icons **/
.timeline li .tl-circ {
    position: absolute;
    top: 23px;
    left: 50%;
    text-align: center;
    background: #edcb84;
    color: #fff;
    width: 35px;
    height: 35px;
    line-height: 35px;
    margin-left: -21px;
    border: 3px solid #cc9b36;
    border-top-right-radius: 50%;
    border-top-left-radius: 50%;
    border-bottom-right-radius: 50%;
    border-bottom-left-radius: 50%;
    z-index: 99999;
}


/** timeline content **/

.tl-heading h4 {
    margin: 0;
    color: #c25b4e;
}

.tl-body p, .tl-body ul {
    margin-bottom: 0;
}

.tl-body > p + p {
    margin-top: 5px;
}

/** media queries **/
@media (max-width: 991px) {
    .timeline li .timeline-panel {
        width: 44%;
    }
}

@media (max-width: 700px) {
    .page-header h1 { font-size: 1.8em; }

    ul.timeline:before {
        left: 40px;
    }

    .tldate { width: 140px; }

    ul.timeline li .timeline-panel {
        width: calc(100% - 90px);
        width: -moz-calc(100% - 90px);
        width: -webkit-calc(100% - 90px);
    }

    ul.timeline li .tl-circ {
        top: 22px;
        left: 22px;
        margin-left: 0;

    }
    ul.timeline > li > .tldate {
        margin: 0;
    }

    ul.timeline > li > .timeline-panel {
        float: right;
    }

    ul.timeline > li > .timeline-panel:before {
        border-left-width: 0;
        border-right-width: 15px;
        left: -15px;
        right: auto;
    }

    ul.timeline > li > .timeline-panel:after {
        border-left-width: 0;
        border-right-width: 14px;
        left: -14px;
        right: auto;
    }
}





.el-input{
    outline: none;
}
a{cursor: pointer}


@keyframes gradientBG {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}