:root {
    --primary-color: #275fae;
    --secondary-color: #ddcfc3;
    --part-title-color: #be926f;
    --header-color: #fff;
    --header-bgcolor: #275fae;
    --footer-color: #000;
    --footer-bgcolor: #E3E5E9;
    --menu-color: #fff;
    --menu-bgcolor: rgba(0, 0, 0, 0.9);
    --toup-bgcolor: rgba(0, 0, 0, 0.2);
}

body {
    margin: 0;
}

#form1 {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    box-sizing: border-box;
    padding-top: 56px;
}

main {
    flex: 1;
}

a {
    text-decoration: none;
    color: currentColor;
}

.swiper-banner img {
    width: 100%;
    max-width: 100%;
}

header {
    position: absolute;
    top: 0;
    display: flex;
    width: 100%;
    padding: 8px;
    height: 56px;
    align-items: center;
    background: var(--header-bgcolor) no-repeat;
    justify-content: space-between;
    box-sizing: border-box;
}

.logo {
    width: 160px;
}


.material-symbols--menu {
    display: inline-block;
    width: 1em;
    height: 1em;
    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M3 18v-2h18v2zm0-5v-2h18v2zm0-5V6h18v2z'/%3E%3C/svg%3E");
    background-color: currentColor;
    -webkit-mask-image: var(--svg);
    mask-image: var(--svg);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
}

.mingcute--close-line {
    display: inline-block;
    width: 1em;
    height: 1em;
    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cpath d='M24 0v24H0V0zM12.593 23.258l-.011.002l-.071.035l-.02.004l-.014-.004l-.071-.035c-.01-.004-.019-.001-.024.005l-.004.01l-.017.428l.005.02l.01.013l.104.074l.015.004l.012-.004l.104-.074l.012-.016l.004-.017l-.017-.427c-.002-.01-.009-.017-.017-.018m.265-.113l-.013.002l-.185.093l-.01.01l-.003.011l.018.43l.005.012l.008.007l.201.093c.012.004.023 0 .029-.008l.004-.014l-.034-.614c-.003-.012-.01-.02-.02-.022m-.715.002a.023.023 0 0 0-.027.006l-.006.014l-.034.614c0 .012.007.02.017.024l.015-.002l.201-.093l.01-.008l.004-.011l.017-.43l-.003-.012l-.01-.01z'/%3E%3Cpath fill='%23000' d='m12 13.414l5.657 5.657a1 1 0 0 0 1.414-1.414L13.414 12l5.657-5.657a1 1 0 0 0-1.414-1.414L12 10.586L6.343 4.929A1 1 0 0 0 4.93 6.343L10.586 12l-5.657 5.657a1 1 0 1 0 1.414 1.414z'/%3E%3C/g%3E%3C/svg%3E");
    background-color: currentColor;
    -webkit-mask-image: var(--svg);
    mask-image: var(--svg);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
}

.menu {
    display: flex;
    padding: 5px;
    background: var(--primary-color);
    text-align: center;
    color: var(--header-color);
    font-size: 24px;
    cursor: pointer;
}

.menu.active {
    position: absolute;
    z-index: 21;
    right: 8px;
    background: transparent;
}

.menu.active .material-symbols--menu,
.menu:not(.active) .mingcute--close-line {
    display: none;
}

.menu-mask {
    background: var(--menu-bgcolor);
    color: var(--menu-color);
    position: absolute;
    z-index: 20;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    padding: 60px 0;
    display: none;
    overflow-y: auto;
    box-sizing: border-box;
}

.menu-mask a, .menu-mask summary {
    display: block;
    line-height: 2.2;
    font-size: 16px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    text-align: center;
}

.menu-mask summary::after, #toup::after {
    content: '';
    display: inline-block;
    vertical-align: sub;
    margin-left: 0.2em;
    width: 1.3em;
    height: 1.3em;
    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cpath d='M24 0v24H0V0zM12.593 23.258l-.011.002l-.071.035l-.02.004l-.014-.004l-.071-.035c-.01-.004-.019-.001-.024.005l-.004.01l-.017.428l.005.02l.01.013l.104.074l.015.004l.012-.004l.104-.074l.012-.016l.004-.017l-.017-.427c-.002-.01-.009-.017-.017-.018m.265-.113l-.013.002l-.185.093l-.01.01l-.003.011l.018.43l.005.012l.008.007l.201.093c.012.004.023 0 .029-.008l.004-.014l-.034-.614c-.003-.012-.01-.02-.02-.022m-.715.002a.023.023 0 0 0-.027.006l-.006.014l-.034.614c0 .012.007.02.017.024l.015-.002l.201-.093l.01-.008l.004-.011l.017-.43l-.003-.012l-.01-.01z'/%3E%3Cpath fill='%23000' d='M15.707 11.293a1 1 0 0 1 0 1.414l-5.657 5.657a1 1 0 1 1-1.414-1.414l4.95-4.95l-4.95-4.95a1 1 0 0 1 1.414-1.414z'/%3E%3C/g%3E%3C/svg%3E");
    background-color: currentColor;
    -webkit-mask-image: var(--svg);
    mask-image: var(--svg);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    transition: 300ms;
}

.menu-mask details[open]>summary::after {
    transform: rotate(90deg);
}

.menu-mask a.current {
    background: var(--primary-color);
    border: none;
}

header.fixed {
    position: fixed;
    z-index: 10;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

footer {
    padding: 8px;
    font-size: 12px;
    background: var(--footer-bgcolor);
    color: var(--footer-color);
}

.pager {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
    font-size: 16px;
    color: #303030;
    margin-top: 10px;
}

.pager .active {
    background: var(--primary-color);
    border-radius: 6px;
    color: var(--header-color);
    width: 30px;
    line-height: 30px;
    text-align: center;
}

.pager a {
    color: inherit;
    text-decoration: none;
}

.news {
    padding: 8px 8px 1em;
}

.news-item {
    display: grid;
    grid-template-rows: repeat(2, auto);
    gap: 8px;
}

.news-item + .news-item {
    margin-top: 4em;
}

.news-item.noimg {
    grid-template-columns: auto 1fr;
    grid-template-rows: 1fr;
}

.news-item.noimg .news-item--image {
    display: none;
}

.news-item--image {
    max-width: 100%;
    grid-column-start: 1;
    grid-row-end: 2;
    padding-top: 64%;
    position: relative;
}

.news-item--image img {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.news-item--date {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 64px;
    height: 64px;
    color: var(--primary-color);
    background: #fff;
    font-size: 12px;
    grid-column-start: 1;
    grid-row-end: 2;
    align-self: end;
}

.news-item.noimg .news-item--date {
    align-self: unset;
}

.news-item--day {
    font-size: 36px;
    font-weight: bold;
    line-height: 1;
}

.news-item--title {
    font-size: 18px;
    line-height: 1.5;
    word-break: break-all;
}

.news-item--desc {
    margin-top: 8px;
    font-size: 12px;
    color: #777;
    word-break: break-all;
}

h1 {
    font-size: 30px;
    line-height: 1.25;
    text-align: center;
}

.Line {
    width: 50px;
    background: var(--secondary-color);
    height: 4px;
    margin: 12px auto;
    display: block;
}

.InnerDate {
    display: block;
    font-size: 14px;
    color: #777;
    text-align: center;
}

.InnerContent {
    margin-top: 30px;
}

.InnerContent img {
    max-width: 100%;
    display: block;
    margin: auto;
}

.part-title {
    font-size: 36px;
    color: var(--part-title-color);
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    padding: 8px;
}

.part-title a {
    font-size: 14px;
    color: #777;
}

.nav {
    padding: 8px;
    background: var(--primary-color);
    color: var(--header-color);
    font-size: 14px;
}

#toup {
    background: var(--toup-bgcolor);
    color: var(--menu-color);
    position: fixed;
    right: 8px;
    bottom: 8px;
    width: 34px;
    height: 34px;
    line-height: 34px;
    text-align: center;
    transform: rotate(-90deg);
    display: none;
    border-radius: 50%;
}