﻿.qa-bg {
    background-color: #F6F5F7;
    padding-bottom: .8rem;
}

.qa .qa-search {
    height: 4.2667rem;
    background-image: url(/img/qa/banner.png);
    background-size: cover;
    padding: 2.52rem .4rem 0;
}

    .qa .qa-search .input-search {
        display: flex;
        justify-content: space-between;
        align-items: center;
        height: 1rem;
        background-color: #FFFFFF;
    }

        .qa .qa-search .input-search input {
            flex: 1;
            height: 100%;
            border: none;
            outline: none;
            font-size: .32rem;
            padding: 0 1em;
        }

        .qa .qa-search .input-search .btn-search {
            border: none;
            outline: none;
            width: .4rem;
            height: .4rem;
            background-image: url(/img/qa/icon-search.png);
            background-repeat: no-repeat;
            background-size: .4rem .4rem;
            margin-right: .4rem;
        }

.qa .tabs {
    display: flex;
    padding: 0 .2rem;
    background-color: #fff;
}

    .qa .tabs .tab {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 1.0667rem;
        background-color: rgba(255,255,255,.6);
        font-size: .32rem;
        color: #333333;
        cursor: pointer;
        margin: 0 .2rem;
        border-bottom: .04rem solid #fff;
    }

        .qa .tabs .tab.active {
            border-bottom-color: #C59E75;
            color: #C59E75;
        }

.list-box {
    padding: 0 .4rem;
}

    .list-box .list {
        padding: .56rem 0;
    }

        .list-box .list .item {
            display: flex;
            align-items: center;
            height: 1.2rem;
            padding: 0 .32rem;
        }

            .list-box .list .item:nth-child(2n+1) {
                background-color: #fff;
                border-radius: .1333rem;
            }

            .list-box .list .item > div {
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
                font-size: 0.3733rem;
                color: #333333;
            }

            .list-box .list .item::before {
                content: "";
                flex-shrink: 0;
                width: .4rem;
                height: .4rem;
                background-image: url(/img/qa/icon-question.png);
                background-size: .4rem .4rem;
                margin-right: .2rem;
            }


    .list-box .pager {
        display: flex;
        justify-content: center;
        padding: .4rem 0 1rem;
    }

.hot-qa {
    background: #FFFFFF;
    padding: 0 .4rem;
    position: relative;
    margin: 0 .4rem;
}

    .hot-qa .hot-title {
        padding: .6rem 0 .2rem;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

        .hot-qa .hot-title .name {
            font-size: 0.4267rem;
            font-weight: bold;
            color: #222222;
        }

        .hot-qa .hot-title .more {
            font-size: .32rem;
            color: #999999;
        }

            .hot-qa .hot-title .more::after {
                content: ">";
            }


    .hot-qa .hot-list {
        padding-bottom: .1333rem;
    }

        .hot-qa .hot-list li {
            border-bottom: 2px dashed #E5E5E5;
            padding-bottom: .4rem;
        }

            .hot-qa .hot-list li:last-child {
                border-bottom: none;
            }

            .hot-qa .hot-list li a {
                padding: .4rem 0;
                font-size: 0.3467rem;
                color: #666666;
                display: flex;
                align-items: center;
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
            }

                .hot-qa .hot-list li a > span {
                    width: .56rem;
                    height: .56rem;
                    background: #C49F75;
                    font-size: 0.3733rem;
                    color: #fff;
                    display: flex;
                    justify-content: center;
                    align-items: center;
                    margin-right: .2rem;
                    flex-shrink: 0;
                }

            .hot-qa .hot-list li:nth-child(n+4) a > span {
                background: #F0F0F0;
                color: #666;
            }

            .hot-qa .hot-list li a > div {
                flex: 1;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
            }

            .hot-qa .hot-list li .props {
                display: flex;
                align-items: center;
                justify-content: space-between;
                font-size: .32rem;
                color: #999999;
            }



.hot-country {
    background: #FFFFFF;
    position: relative;
    margin: 0.4667rem .4rem 0;
}

    .hot-country .hot-title {
        padding: .6rem .4rem .2rem;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

        .hot-country .hot-title .name {
            font-size: 0.4267rem;
            font-weight: bold;
            color: #222222;
        }

        .hot-country .hot-title .more {
            font-size: .32rem;
            color: #999999;
        }

            .hot-country .hot-title .more::after {
                content: ">";
            }

    .hot-country .country-list {
        display: flex;
        flex-wrap: wrap;
        padding-top: .4rem;
    }

        .hot-country .country-list .country {
            width: 25%;
            margin-bottom: .2rem;
        }

            .hot-country .country-list .country > a {
                display: flex;
                justify-content: center;
                align-items: center;
                flex-direction: column;
            }

                .hot-country .country-list .country > a img {
                    width: 1.3333rem;
                    height: 1.3333rem;
                    background: #DF2F14;
                    border-radius: 50%;
                }

                .hot-country .country-list .country > a .country-name {
                    font-size: 0.3467rem;
                    color: #333333;
                    padding: .2rem 0;
                }

.quick {
    display: flex;
    flex-wrap: wrap;
    padding: 0.6667rem .4rem;
    background-color: #fff;
}

    .quick a {
        height: .8rem;
        background: #F8F8F8;
        border-radius: .4rem;
        padding: 0 .36rem;
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 0.3467rem;
        color: #666666;
    }


.search-result {
    font-size: .32rem;
    color: #666666;
    padding: .72rem .4rem 0;
}

    .search-result > span {
        color: #C49F75;
    }

.qa-detail {
    background-color: #F6F5F7;
}

    .qa-detail .detail {
        background-color: #fff;
        padding: 0.1333rem .4rem;
    }

        .qa-detail .detail .qa-title {
            font-size: 0.4267rem;
            font-weight: bold;
            color: #333333;
            padding: .4rem 0;
        }

        .qa-detail .detail .qa-title {
            font-size: 0.4267rem;
            font-weight: bold;
            color: #333333;
            padding: .4rem 0;
        }

        .qa-detail .detail .qa-tags {
            display: flex;
            align-items: center;
            font-size: .2667rem;
            color: #C49F75;
        }

            .qa-detail .detail .qa-tags::before {
                content: "";
                background-image: url(/img/qa/tag.png);
                background-size: cover;
                width: .28rem;
                height: .28rem;
                margin-right: .12rem;
            }

            .qa-detail .detail .qa-tags a {
                font-size: .2667rem;
                color: #C49F75;
                margin-right: .4rem;
            }

        .qa-detail .detail .qa-props {
            display: flex;
            align-items: center;
            font-size: .2667rem;
            color: #999999;
            padding: .32rem 0 .4rem;
        }


            .qa-detail .detail .qa-props .prop + .prop {
                margin-left: 4vmin;
            }

        .qa-detail .detail .qa-content .content-title {
            display: flex;
            align-items: center;
            font-size: 0.3733rem;
            font-weight: bold;
            color: #C49F75;
            padding: .4rem 0 .4rem;
            border-top: 1px solid #E5E5E5;
        }

            .qa-detail .detail .qa-content .content-title::before {
                content: "";
                background-image: url(/img/qa/icon-answer.png);
                background-size: cover;
                width: 0.3467rem;
                height: 0.3467rem;
                margin-right: .12rem;
            }

        .qa-detail .detail .qa-content .content {
            font-size: .36rem;
            line-height: .64rem;
            color: #666666;
            border-bottom: 1px solid #E5E5E5;
            padding-bottom: .4rem;
        }

.projects {
    padding: 0 0 .8rem;
}

    .projects .projects-title {
        font-size: .4rem;
        font-weight: bold;
        color: #535353;
        padding: .6rem 0 .4rem;
    }

    .projects .project {
        background: #FFFFFF;
        box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.1);
        border-radius: 0.1333rem;
        display: block;
    }

        .projects .project .img {
            position: relative;
        }

            .projects .project .img > img {
                width: 100%;
            }

            .projects .project .img .alt {
                width: 2.4rem;
                height: .54rem;
                background-image: url(/img/tag.png);
                background-size: cover;
                background-repeat: no-repeat;
                position: absolute;
                left: -.04rem;
                top: .32rem;
                font-size: .28rem;
                color: #C49F75;
                overflow: hidden;
                white-space: nowrap;
                -o-text-overflow: ellipsis;
                text-overflow: ellipsis;
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-align: center;
                -ms-flex-align: center;
                align-items: center;
                padding: 0.12rem;
            }

        .projects .project .project-title {
            font-size: 0.4267rem;
            font-weight: bold;
            color: #C49F75;
            padding: .4rem .32rem .28rem;
        }

        .projects .project .project-subtitle {
            font-size: 0.2933rem;
            color: #666666;
            padding: 0 .32rem .4rem;
        }

.relevant {
    border-top: 0.2667rem solid #F8F8F8;
    background-color: #fff;
    padding: .2rem.4rem;
}

    .relevant .relevant-title {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: .2rem 0;
        font-size: .4rem;
        font-weight: bold;
        color: #535353;
    }

        .relevant .relevant-title .more {
            display: flex;
            align-items: center;
            font-size: .32rem;
            color: #999999;
        }

            .relevant .relevant-title .more::after {
                content: ">";
            }

    .relevant .list .item {
        padding: .4rem 0;
        font-size: 0.3467rem;
        color: #333333;
        display: flex;
        align-items: center;
        border-bottom: 2px dashed #E5E5E5;
    }

        .relevant .list .item:last-child {
            border-bottom: none;
        }

        .relevant .list .item::before {
            content: "";
            background-image: url(/img/qa/icon-q.png);
            background-size: cover;
            width: 0.3467rem;
            height: 0.3467rem;
            margin-right: .12rem;
            flex-shrink: 0;
        }

        .relevant .list .item > div {
            text-overflow: ellipsis;
            overflow: hidden;
            white-space: nowrap;
        }

.white-paper {
    padding: 0 1.28rem;
    background: #FFFFFF;
    box-shadow: 0px 2px 8px 0px rgba(0,0,0,0.1);
    border-radius: 8px;
}

    .white-paper .booking-title {
        padding: .6rem 0 .2rem;
        text-align: center;
        font-size: .4rem;
        font-weight: bold;
        color: #535353;
    }

    .white-paper .booking-subtitle {
        display: flex;
        justify-content: center;
        align-items: center;
        color: #C49F75;
        font-size: 0.28rem;
    }

        .white-paper .booking-subtitle:before {
            content: "";
            width: .56rem;
            height: 1px;
            background-color: #C49F75;
            margin-right: .28rem;
        }

        .white-paper .booking-subtitle:after {
            content: "";
            width: .56rem;
            height: 1px;
            background-color: #C49F75;
            margin-left: .28rem;
        }

    .white-paper .input-box {
        margin-top: .28rem;
        display: flex;
        align-items: center;
    }

        .white-paper .input-box > input[type=text] {
            height: .92rem;
            flex: 1;
            background-color: #F8F8F8;
            border: 1px solid #DCDCDC;
            border-radius: .08rem;
            outline: none;
            padding: 0 1em;
        }

        .white-paper .input-box > .country-code {
            height: .92rem;
            flex: 1;
            background-color: #F8F8F8;
            border: 1px solid #DCDCDC;
            border-radius: .08rem;
            outline: none;
            padding: 0 1em;
        }

        .white-paper .input-box .input-remark {
            height: 1.68rem;
            flex: 1;
            background-color: #F8F8F8;
            border: 1px solid #DCDCDC;
            border-radius: 0.08rem;
            outline: none;
            padding: 0.5em 1em;
            font-size: 0.3733rem;
            resize: none;
        }

    .white-paper .booking-tip {
        font-size: .24rem;
        color: #D80922;
        padding: .24rem 0;
    }

    .white-paper .booking-btns {
        padding: .48rem 0 .8rem;
        text-align: center;
    }

        .white-paper .booking-btns .btn-booking {
            font-size: .24rem;
            color: #fff;
            width: 2.4rem;
            height: .8rem;
            background-color: #C49F75;
            border: 1px solid #C49F75;
        }

.hot-topic {
    border-top: 0.2667rem solid #F8F8F8;
    background-color: #fff;
    padding: .2rem.4rem .8rem;
}

    .hot-topic .topic-title {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: .2rem 0 .4rem;
        font-size: .4rem;
        font-weight: bold;
        color: #535353;
    }

        .hot-topic .topic-title .more {
            display: flex;
            align-items: center;
            font-size: .32rem;
            color: #999999;
        }

            .hot-topic .topic-title .more::after {
                content: ">";
            }

    .hot-topic .swiper {
        width: 9.2rem !important;
    }



.hot-tags {
    border-top: 2.6666vmin solid #F8F8F8;
    padding: 0 4vmin;
    background: #fff;
}

    .hot-tags .flex-header {
        padding: 6vmin 0 2vmin;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

        .hot-tags .flex-header label {
            font-size: 4.2667vmin;
            font-weight: bold;
            color: #222222;
        }

        .hot-tags .flex-header a {
            font-size: 2.9333vmin;
            font-weight: 400;
            color: #999999;
        }

            .hot-tags .flex-header a::after {
                content: ">";
            }

    .hot-tags .list {
        display: flex;
        flex-wrap: wrap;
        padding-bottom: .4rem;
    }

        .hot-tags .list .item {
            border-bottom: 2px dashed #E5E5E5;
            width: 33.3333%;
            display: flex;
            align-items: center;
        }

            .hot-tags .list .item:nth-last-child(-n+3) {
                border-bottom: none;
            }

            .hot-tags .list .item a {
                padding: 4vmin 0;
                font-size: .32rem;
                font-weight: 400;
                color: #333333;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
                margin: 0 .2rem;
            }

            .hot-tags .list .item:nth-child(3n) a {
                margin-right: 0;
            }

            .hot-tags .list .item::before {
                content: "";
                width: 0.1333rem;
                height: 0.1333rem;
                background: #636363;
                border-radius: 50%;
            }



.about {
    padding: 0 0 .4rem;
    background-color: #fff;
    border-top: 2.6666vmin solid #F8F8F8;
}



    .about .about-title{
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: .2rem .4rem;
        font-size: .4rem;
        font-weight: bold;
        color: #535353;
    }

        .about .about-title .more {
            display: flex;
            align-items: center;
            font-size: .32rem;
            color: #999999;
        }

            .about .about-title .more::after {
                content: ">";
            }

    .about .item {
        padding: .4rem;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

        .about .item + .item {
            border-top: 1px solid #F0F0F0;
        }

        .about .item .img {
            width: 2.8rem;
            flex-shrink: 0;
        }

            .about .item .img > img {
                width: 2.8rem;
            }

        .about .item .info {
            padding-left: .4rem;
            -webkit-box-flex: 1;
            -ms-flex: 1;
            flex: 1;
            overflow: hidden;
        }

            .about .item .info .name {
                font-size: .36rem;
                font-weight: bold;
                color: #333333;
                overflow: hidden;
                white-space: nowrap;
                -o-text-overflow: ellipsis;
                text-overflow: ellipsis;
            }

            .about .item .info .desc {
                font-size: 0.28rem;
                color: #666666;
                margin: .24rem 0 0;
                line-height: .4rem;
                height: .8rem;
                overflow: hidden;
                -o-text-overflow: ellipsis;
                text-overflow: ellipsis;
                display: -webkit-box;
                -webkit-line-clamp: 2;
                -webkit-box-orient: vertical;
            }

            .about .item .info .publish-time {
                font-size: 0.28rem;
                color: #666666;
                padding: .2rem 0 0;
            }
