﻿::-webkit-input-placeholder { text-overflow: ellipsis }
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background-color: #f1f1f1; }
::-webkit-scrollbar-thumb { background-color: #c1c1c1; border-radius: 99px; }
:root { --mainwidth: 1200px; }
* { box-sizing: border-box; }
body { background-color: #f8f9fa; color: #4e5259; font-family: "Roboto", Helvetica, Arial, sans-serif; line-height: 1.5; margin: 0; display: flex; flex-direction: column; align-items: center; }
a, a:hover { color: #007bfc; text-decoration: none; transition: color .3s; }
img { vertical-align: middle; border-style: none; }
header { background-color: white; width: 100%; padding: 0 5vw; height: 92px; font-size: 16px; font-weight: 400; display: flex; align-items: center; justify-content: space-evenly; }
    header left { display: flex; }
        header left img { }
    header search { flex: 1; display: flex; justify-content: center; }
        header search > div { width: 520px; height: 44px; border: 1px solid #E9E9E9; border-top-left-radius: 4px; border-bottom-left-radius: 4px; font-size: 16px; }
            header search > div:hover { border-color: #FE7D18; }
            header search > div input { border: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; outline-offset: -2px; appearance: none; width: 100%; height: 42px; outline: 0; font-size: 16px; margin: 0 10px; }
        header search button { background-color: #FE7D18; cursor: pointer; width: 80px; color: white; border: 1px solid #FE7D18; border-top-right-radius: 4px; border-bottom-right-radius: 4px; font-size: 16px; display: flex; align-items: center; justify-content: space-evenly; appearance: none; }
            header search button img { height: 15px; }
            header search button span { }
    header right { display: flex; width: 320px; align-items: center; justify-content: space-evenly; }
        header right a { }
            header right a img { height: 15px; margin: 0 10px; }
            header right a:last-child { font-size: 14px; border-radius: 3px; width: 95px; height: 32px; background-color: #0052D9; color: #fff; display: flex; align-items: center; justify-content: center; }
searchhead { display: flex; flex-direction: column; align-items: center; width: 100%; height: 320px; background: url(/images/banner.svg) transparent; }
    searchhead > h1 { color: #fff; text-align: center; margin: 65px 0 0 0; font-size: 45px; }
    searchhead > searchtypes { width: var(--mainwidth); padding: 0 160px; margin-top: 36px; }
        searchhead > searchtypes > form { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; }
            searchhead > searchtypes > form > label { }
                searchhead > searchtypes > form > label:last-child { width: 100%; display: flex; justify-content: center; margin-top: 20px; }
                searchhead > searchtypes > form > label > [type="radio"] { display: none; }
                searchhead > searchtypes > form > label > span { color: #fff; background-color: transparent; display: inline-block; padding: 5px 12px; margin: 6px; border-radius: 4px; font-size: 16px; cursor: pointer; position: relative; }
                    searchhead > searchtypes > form > label > span arr { display: none; border-style: solid; border-width: 8px 8px 0; position: absolute; }
                searchhead > searchtypes > form > label > [type="radio"]:checked + span { color: #17479e; background: #fff; }
                    searchhead > searchtypes > form > label > [type="radio"]:checked + span arr { display: inline; bottom: -11px; left: 50%; transform: translate(-50%, -50%); border-color: #fff transparent transparent; }
                searchhead > searchtypes > form > label > tb { flex: 1; display: flex; padding: 0 20px; align-items: center; height: 50px; border: 1px solid #E9E9E9; background: #fff; border-top-left-radius: 4px; border-bottom-left-radius: 4px; }
                    searchhead > searchtypes > form > label > tb > [type="text"] { border: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; outline-offset: -2px; appearance: none; width: 100%; height: 20px; outline: 0; font-size: 16px; }
                searchhead > searchtypes > form > label > #searchbtn { width: 120px; font-size: 18px; height: 50px; background: #fe7d18; color: #fff; border: none; cursor: pointer; border-top-right-radius: 4px; border-bottom-right-radius: 4px; }
main { margin-top: 40px; width: var(--mainwidth); display: flex; flex-wrap: wrap; justify-content: space-between; }
    main > functions, main > spdata { display: none; flex-wrap: wrap; justify-content: space-evenly; width: 720px; background: #fff; border-radius: 5px; padding-bottom: 20px; box-shadow: 0px 4px 4px 0px #0000000A; position: relative; }
        main > functions > name, main > spdata > name { width: 100%; font-size: 16px; margin: 20px 0 0 20px; }
        main > functions > function, main > spdata > data { display: flex; align-items: center; justify-content: center; background: #fff; width: 220px; height: 62px; border-radius: 6px; cursor: pointer; }
            main > functions > function:hover, main > spdata > data:hover { background: #f6f9ff; }
            main > functions > function > div, main > spdata > data > div { margin-left: 15px; display: flex; flex-flow: column; width: 150px; }
                main > functions > function > div > b, main > spdata > data > div > b { font-size: 14px; }
                    main > functions > function > div > b > span, main > spdata > data > div > b > span { position: relative; }
                        main > functions > function > div > b > span > hottxt, main > spdata > data > div > b > span > hottxt { font-style: italic; font-weight: normal; font-size: 12px; color: #fff; border-radius: 6px 6px 6px 0px; position: absolute; left: 90%; bottom: 50%; background: linear-gradient(90deg, #FE6D13 0%, #FF332F 100%); transform: scale(.8); padding: 2px 8px; }
                main > functions > function > div > span, main > spdata > data > div > span { color: #666; font-size: 12px; }
    main > spdata { width: 470px; }
mainad { margin-top: 35px; height: 120px; width: var(--mainwidth); overflow: hidden; background-image: url('/images/banner2.svg'); background-repeat: no-repeat; background-position: left center; background-size: 100% auto; }
    mainad a { display: block; width: 100%; height: 100%; }
maindata { margin-top: 35px; width: var(--mainwidth); background: #fff; display: flex; font-size: 16px; margin-bottom: 25px; }
    maindata form { width: 100%; display: flex; flex-flow: column; position: relative; height: 635px; }
        maindata form > label { width: 220px; }
            maindata form > label:first-child { margin-top: 30px; }
            maindata form > label > [type="radio"] { display: none; }
            maindata form > label > span { display: block; padding: 14px 30px; cursor: pointer; }
            maindata form > label > [type="radio"]:checked + span { background: #4080FF; color: #fff; display: block; }
            maindata form > label > more { display: none; position: absolute; top: 0; left: 220px; width: 980px; flex: 1; flex-flow: column; padding: 35px 25px; border-left: solid 1px #eee; height: 600px; overflow-y: scroll; }
                maindata form > label > more > hots { display: flex; margin-bottom: 20px; }
                    maindata form > label > more > hots span { width: 80px; padding-left: 10px; font-weight: bold; }
                    maindata form > label > more > hots > a { color: #333; margin-right: 25px; }
                maindata form > label > more > prov { padding: 5px 0; display: flex; }
                    maindata form > label > more > prov:nth-child(2n+0) { background: #F6F9FF; }
                    maindata form > label > more > prov > maincity { font-size: 14px; width: 80px; padding-left: 10px; flex-shrink: 0; }
                        maindata form > label > more > prov > maincity > a { color: #333; line-height: 30px; }
                    maindata form > label > more > prov > cities { display: flex; flex-wrap: wrap; }
                        maindata form > label > more > prov > cities > a { color: #999; margin-right: 24px; word-break: keep-all; line-height: 30px; font-size: 14px; }
                maindata form > label > more > line { border-bottom: solid 1px #eee; height: 105px; display: flex; align-items: center; padding-bottom: 30px; margin-bottom: 30px; }
                    maindata form > label > more > line > a { width: 33%; color: #333; height: 70px; padding-left: 30px; border-right: solid 1px #eee; display: flex; flex-flow: column; justify-content: space-evenly; }
                        maindata form > label > more > line > a > name { font-size: 16px; font-weight: bold; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
                        maindata form > label > more > line > a > des { font-size: 12px; color: #999; }
                        maindata form > label > more > line > a > date { font-size: 12px; color: #999; }
            maindata form > label > [type="radio"]:checked + span + more { display: flex; }
footer { font-size: 12px; background-color: #141A25; width: 100%; padding: 30px 0; display: flex; flex-flow: column; align-items: center; }
    footer content { display: flex; width: var(--mainwidth); justify-content: space-between; }
        footer content brand { display: flex; flex-flow: column; justify-content: space-between; height: 150px; }
            footer content brand img { }
            footer content brand des { display: flex; flex-flow: column; justify-content: space-evenly; width: 165px; height: 76px; border-radius: 4px; background-color: #313746; }
                footer content brand des > div { display: flex; justify-content: space-evenly; color: #7C808E; }
                    footer content brand des > div > span { color: white; }
        footer content nav { display: flex; flex-wrap: wrap; align-content: flex-start; justify-content: space-between; width: 210px; }
            footer content nav subtitle { color: white; font-weight: bold; width: 100%; }
            footer content nav a { color: #868E96; width: 100px; margin-top: 15px }
        footer content about { display: flex; flex-wrap: wrap; align-content: flex-start; justify-content: space-between; width: 210px; }
            footer content about subtitle { color: white; font-weight: bold; width: 100%; }
            footer content about a { color: #868E96; width: 100px; margin-top: 15px }
        footer content weixin { display: flex; justify-content: space-between; width: 260px; }
            footer content weixin mp { display: flex; flex-flow: column; align-items: center; justify-content: space-evenly; height: 180px; }
                footer content weixin mp subtitle { color: white; font-weight: bold; }
                footer content weixin mp img { }
            footer content weixin qywx { display: flex; flex-flow: column; align-items: center; justify-content: space-evenly; height: 180px; }
                footer content weixin qywx subtitle { color: white; font-weight: bold; }
                footer content weixin qywx img { }
    footer hr { width: var(--mainwidth); margin: 30px 0; }
    footer datasource { display: flex; font-size: 12px; color: #868E96; }
        footer datasource span { margin: 5px; }
    footer links { display: flex; font-size: 12px; color: #868E96; }
        footer links span { margin: 5px; }
        footer links a { color: #868E96; margin: 5px; }
    footer copyright { display: flex; font-size: 12px; color: #868E96; flex-wrap: wrap; justify-content: center; }
        footer copyright span { }
        footer copyright a { color: #868E96; }

@media all and (min-width: 0px) and (max-width: 1200px) {
    :root { --mainwidth: 768px; }
    searchhead { height: 250px; }
        searchhead > h1 { margin: 35px 0 0 0; }
        searchhead > searchtypes { width: var(--mainwidth); padding: 0 80px; margin-top: 18px; }
            searchhead > searchtypes > form > label > span { font-size: 14px; }
            searchhead > searchtypes > form > label > #searchbtn { font-size: 16px; }
    main { margin-top: 20px; }
        main > functions { width: 380px; }
            main > functions > function { width: 175px; height: auto; padding: 15px 0; }
                main > functions > function:nth-child(4) { display: none; }
                main > functions > function > div { margin-left: 10px; }
                    main > functions > function > div > b { font-size: 12px; }
                    main > functions > function > div > span { margin-top: 5px; color: #666; font-size: 12px; }
        main > spdata { width: 380px }
            main > spdata > data { width: auto; height: auto; padding: 15px 0; }
                main > spdata > data > div > b { font-size: 12px; }
    mainad { margin-top: 20px; }
    maindata { margin-top: 20px; }
        maindata form { height: unset; }
            maindata form > label:first-child { margin: 0; }
            maindata form > label > span { display: none; }
            maindata form > label > more { position: unset; width: 768px; padding: 15px; height: unset; overflow-y: unset; }
}

@media all and (min-width: 0px) and (max-width: 768px) {
    :root { --mainwidth: 400px; }
    header { height: 60px; font-size: 13px; justify-content: space-between; }
        header left img { height: 20px; }
        header right { width: 220px; }
    searchhead { height: 180px; }
        searchhead > h1 { margin: 20px 0 0 0; font-size: 20px; }
        searchhead > searchtypes { width: var(--mainwidth); padding: unset; margin-top: 18px; }
            searchhead > searchtypes > form > label > span { font-size: 12px; }
            searchhead > searchtypes > form > label > tb { padding: 0 10px; height: 30px; }
                searchhead > searchtypes > form > label > tb > [type="text"] { height: 20px; outline: 0; font-size: 12px; }
            searchhead > searchtypes > form > label > #searchbtn { width: 100px; height: 30px; font-size: 12px; }
    main { margin-top: 20px; }
        main > functions { width: 400px; flex-wrap: wrap; position: unset; }
            main > functions > function { width: 180px; height: auto; padding: 10px; margin: 10px; justify-content: unset; }
                main > functions > function:nth-child(4), main > functions > function:nth-child(6) { display: none; }
                main > functions > function > svg { width: 30px; height: 30px; }
                main > functions > function > div { margin-left: 10px; }
                    main > functions > function > div > b { font-size: 12px; }
                    main > functions > function > div > span { margin-top: 5px; color: #666; font-size: 12px; }
        main > spdata { width: 400px; margin-top: 10px; }
            main > spdata > data { width: 175px; height: auto; padding: 15px 0; }
                main > spdata > data > div > b { font-size: 12px; }
    mainad { margin-top: 10px; height: 60px }
    maindata { margin-top: 20px; }
        maindata form { height: unset; }
            maindata form > label:first-child { margin: 0; }
            maindata form > label > span { display: none; }
            maindata form > label > more { position: unset; width: 400px; padding: 15px; height: unset; overflow-y: unset; }
    footer { padding: 15px 0; }
        footer content { flex-wrap: wrap; justify-content: center; }
            footer content brand { width: 100%; height: unset; margin-bottom: 25px; flex-flow: row; justify-content: space-around; }
                footer content brand des { height: unset; width: unset; padding: 5px 10px; }
                footer content brand img { width: 80px; }
            footer content nav, footer content about { width: 100%; margin-bottom: 25px; justify-content: unset; }
                footer content nav subtitle, footer content about subtitle { padding-left: 20px; }
                footer content nav a, footer content about a { margin-top: 5px; padding-left: 20px; }
}
