/*Base*/
table {border-collapse:collapse;border-spacing:0;}
fieldset,img {border:0}
img{outline-width:0; vertical-align:middle;}
address,caption,cite,code,dfn,em,strong,th,var {font-style:normal;font-weight:normal}
ul {list-style:none outside none;}
ol{list-style-position:inside;}
caption,th {text-align:left}
h1,h2,h3,h4,h5,h6 {font-size:100%;font-weight:normal}
q:before,q:after {content:''}
abbr,acronym { border:0}

*{padding:0; margin:0; text-align:left; box-sizing: border-box;}

body{background-color: #f3f7f8;}
a{transition:0.6s;}
a:link, a:visited{text-decoration:none;}
a:hover, a:active{text-decoration:none; border:none;}

a, a>span,
button, button>span {
    transition: 0.6s;
}

.ellipsis {
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.wrapper{
    width: 100%;
    max-width: 650px;
    box-sizing: border-box;
    padding: 0 10px;
}

.btn{
    border-radius: 12px;
    display: flex;
    flex-flow: row;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    text-align: center;
    font-size: 16px;
    line-height: 1em;
    height: 48px;
    border: none;
    cursor: pointer;
    transition:0.6s;
}

.icon{
    display: inline-block;
    margin-right: 0.4em;
    font-size: 0.9em;
    padding: 0.05em 0;
}

.error-msg{
    color: #ff263b;
    font-size: 14px;
    line-height: 1em;
    display: none;
}

@keyframes rotate {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

.rotating {
    animation: rotate 3s linear infinite;
}

.loading{
    text-align: center;
    font-size: 16px;
    color: #00a6ff;
}

.tip{
    text-align: center;
    font-size: 16px;
    color: #999999;
}

/* header ----------------------------------------------------------------------------------------------------------- */



/* footer ----------------------------------------------------------------------------------------------------------- */
footer,
footer .contact,
footer .contact>a{
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
}

footer{
    flex-flow: column;
    border-top: 1px #dddddd solid;
    padding: 20px 0;
    margin-top: 20px;
    gap: 12px;
}

footer>div{
    display: flex;
    flex-flow: column;
    align-items: center;
    justify-content: center;
    gap: 0;
    font-size: 12px;
    color: #888888;
    line-height: 26px;
}

footer>div a{
    display: block;
    color: #888888;
}

footer>div a:hover{
    text-decoration:underline;
}

footer>div a img {
    width: 12px;
    height: 12px;
    margin-right: 3px;
}

footer .contact,
footer .contact a{
    flex-flow: row;
}

footer .contact{
    gap: 0;
    font-size: 14px;
}

footer .contact>a{
    width: 160px;
    height: 32px;
    background-color: #ffffff;
}

footer .contact>a:first-child{
    border-radius: 16px 0 0 16px;
    border-right: 1px #dddddd solid;
}

footer .contact>a:last-child{
    border-radius: 0 16px 16px 0;
}

footer .contact .weixin{
    color: #1ca543;
}

footer .contact .email{
    color: #43a3ff;
}

/* 搜索区 ------------------------------------------------------------------------------------------------------------- */
.search{
    width: 100%;
    padding: 12px 0;
    background-color: #6f33ff;
    margin-bottom: 20px;
}

.search form{
    display: flex;
    flex-flow: row;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.search form label{
    width: 100%;
}

.search form input,
.search form button{
    border-radius: 10px;
    height: 48px;
    border: none;
    font-size: 16px;
    line-height: 1em;
}

.search form input{
    padding: 0 10px;
    width: 100%;
    background-color: #ffffff;
    color: #0099ff;
}

.search form button{
    width: 160px;
    text-align: center;
    background-color: #0099ff;
    color: #fff;
}

/* 测试列表 ----------------------------------------------------------------------------------------------------------- */
.test-block{
    display: flex;
    flex-flow: column;
    justify-content: center;
    gap: 12px;
}

.test-block a,
.test-block a .info{
    display: flex;
    flex-flow: row;
    align-items: center;
}

.test-block a{
    justify-content: space-between;
    background-color: #ffffff;
    border-radius: 8px;
    padding: 10px;
}

.test-block a .info{
    justify-content: flex-start;
    gap: 10px;
}

.test-block a .pic,
.test-block a .pic>img{
    width: 50px;
    height: 50px;
}

.test-block a .pic{
    border-radius: 50%;
    overflow: hidden;
}