@import url('https://fonts.font.im/css?family=Abril+Fatface|Noto+Sans|Noto+Serif|Open+Sans');
@import url("https://chinese-fonts-cdn.deno.dev/packages/syst/dist/SourceHanSerifCN/result.css");

:root{
    --primary: #B0946E;
    --text_color: #816458;
    --hl_yellow: #FAE248;
    --hl_blue: #6A8D9B;
    --card_bg: rgba(255, 244, 239, 0.5);

    --xs: 4px;
    --s: 8px;
    --m: 16px;
    --l: 24px;
    --xl: 32px;
}

body {
    font-family: 'Source Han Serif CN VF','Noto Serif', sans-serif;
    margin: 0;
    /*background-color: var(--card_bg);*/
}

mark {
    margin: 0 8px;
    color: var(--hl_blue);
    background: var(--hl_yellow);
    font-weight: bold;
}

.navbar {
    height: 76.165px;
    display: flex;
    margin-top: 0;
    padding-block: var(--s) var(--m);
}

.navtitle {
    flex-basis: auto;
}

.navlink {
    margin: var(--l);
    color: var(--primary);
    font-weight: normal;
    font-size: 20px;
    text-decoration: none;

}

.navlink:hover {
    color: var(--text_color);
}

.navbar-right {
    margin: 0 auto 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

h1 {
    font-family: 'Abril Fatface', cursive;
    text-align: left;
    font-size: clamp(50px,6vw,60px);
    font-weight: normal;
    margin: 0 40px 0 40px;
    /*margin-left: 40px;*/
    color: var(--text_color);
}

.notice {
    width: 80%;
    margin: 10px auto;
    text-align: left;
}

h2 {
    color: var(--text_color);
    margin: var(--m) 0;
}

.notice_description {
    margin: var(--s) 0;
    color: var(--text_color);

}

.body_content {
    width: 85%;
    margin: 10px auto;
    text-align: left;
    color: var(--text_color);
    font-size: var(--m);
}

.body_content a {
    color: var(--hl_blue);
}

.body_content ul {
    margin: 0;
}

.body_content li {
    margin: 0.5rem 0;
}


.hr_star {
    margin: 0 10px  ;
}

.hr_line {
    margin: 20px auto;
    width: 90%;
    color: var(--primary);
}

.hr_line span {
    display: flex;
    align-items: center;
}

.hr_line hr {
    width: 95%;
    border: none;
    border-top: 1px dashed var(--primary);
    padding: 0;
}

.hr_line h3 {
    margin: 0;
}

.hr_description {
    width: 95%;
    margin: 0 auto;
    font-size: var(--m);
}

footer {
    margin: 200px 0 50px 0;
    text-align: center;
    color: var(--primary);
}

footer p {
    margin: 0 0 10px 0;
}

/* 屏幕宽度小于600px自动隐藏nav上的文字*/
@media screen and (max-width: 600px) {
    .navlink {
        display: none; /* 小屏幕时隐藏 */
    }
}