﻿.nav-main-page2{box-shadow: 0 0 .3rem 0 rgba(0, 0, 0, 0.1);}

.single{margin-top: 0.4rem;}

.nodata {text-align:center;padding-top:1rem;}

.search-wrapper {
    width: 100%;
    height: auto;
    margin-top: 1.4rem;
    padding-bottom: 0.2rem;
    margin-bottom: 0.4rem;
}

.search-wrapper .result {
    margin-bottom: .2rem
}

.search-wrapper .result span {
    display: inline-block;
    font-size: var(--fs16);
    margin-right: .3rem;
    line-height: .48rem
}

.search-wrapper .result b {
    display: inline-block;
    margin: 0 4px;
    color: #17478a;
    font-family: "mb";
    font-weight: 700;
    text-decoration: underline
}

.search-wrapper .tips {
    text-align: center;
    font-size: var(--fs18);
    line-height: 30px;
    margin: .48rem auto 0
}

.search-wrapper .tips b {
    font-family: "mb";
    color: #17478a
}

.search-wrapper .list ul {
    list-style-type: none;
    display: flex;
    display: -webkit-box;
    display: -moz-box;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flexbox;
    flex-flow: wrap;
    margin-bottom: 0
}

.search-wrapper .list li {
    position: relative;
    list-style: none;
    width: calc((100% - .8rem) / 3);
    margin-right: .4rem;
    margin-top: .3rem;
    border: 1px solid #eee;
    border-radius: 5px;
    transition: all .48s ease;
    -webkit-transition: all .48s ease;
    -moz-transition: all .48s ease;
    -ms-transition: all .48s ease;
    -o-transition: all .48s ease
}

.search-wrapper .list li:hover {
    box-shadow: 0 2px 30px rgba(0,0,0,0.1);
    border-color: #fff
}

.search-wrapper .list li:hover .title {
    color: #17478a
}

.search-wrapper .list li:hover p:before {
    color: #000
}

.search-wrapper .list li:hover p:after {
    opacity: 1;
    visibility: visible;
    transform: translateX(0);
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0)
}

.search-wrapper .list li a {
    padding: .2rem .3rem;
    display: block
}

.search-wrapper .list .title {
    font-size: var(--fs18);
    color: #000;
    line-height: 24px;
    transition: color .3s ease;
    -webkit-transition: color .3s ease;
    -moz-transition: color .3s ease;
    -ms-transition: color .3s ease;
    -o-transition: color .3s ease;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden
}

.search-wrapper .list p {
    text-align: right;
    font-size: 0;
    margin-top: .2rem
}

.search-wrapper .list p:before {
    transition: all .48s ease;
    -webkit-transition: all .48s ease;
    -moz-transition: all .48s ease;
    -ms-transition: all .48s ease;
    -o-transition: all .48s ease;
    vertical-align: middle;
    content: "MORE";
    font-size: var(--fs16);
    color: #666
}


@media screen and (min-width: 1004px) {
    .search-wrapper .list li:last-child, .search-wrapper .list li:nth-child(3n) {
        margin-right: 0;
    }

}

@media (max-width: 1004px) {
    .search-wrapper .result {
        margin-bottom:.3rem
    }

    .search-wrapper{padding:0 0.3rem;}

    .search-wrapper .result span {
        font-size: var(--fs24);
        margin-right: .48rem
    }
    .search-wrapper .list p:before{
        font-size: var(--fs24);
    }

    .search-wrapper .list li {
        width: 100%;
        margin-right: 0;
        margin-top: .3rem
    }

    .search-wrapper .list li:first-child {
        margin-top: 0
    }

    .search-wrapper .list li a {
        padding: .3rem
    }

    .search-wrapper .list .title {
        font-size: var(--fs26);
        line-height: .48rem;
        margin-right: .6rem
    }

    .search-wrapper .list p:before {
        color: #333
    }

    .search-wrapper .list p:after {
        opacity: 1;
        visibility: visible;
        transform: translateX(0);
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -o-transform: translateX(0);
        width: .2rem;
        height: .2rem
    }
}
