/* 首页 banner —— 纯 JS 淡入轮播（替代老站 flickerplate，不引入 flickerplate.css/js）
   尺寸与老站一致：PC（>=781px）高 350px（style.css 中 .flicker-pc{height:350px !important}）；
   移动端（<=780px）高 50vw、上限 calc(100vh - 115px)，与 flickerplate 的移动端规则一致。 */
.mf-banner {
    position: relative;
    width: 100%;
    min-width: 1280px;
    height: 400px;
    background-color: #e6e6e6;
    overflow: hidden;
    margin: 0 auto;
}
.mf-banner .mf-slide {
    position: absolute;
    left: 0; top: 0; right: 0; bottom: 0;
    opacity: 0;
    transition: opacity .8s ease;
}
.mf-banner .mf-slide.is-active { opacity: 1; }
.mf-banner .mf-slide img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;          /* 等价老站 background-size:cover */
    object-position: center;    /* 等价 background-position:center */
}
.mf-banner .mf-cell {
    position: absolute;
    left: 0; top: 0; right: 0; bottom: 0;
    display: table;
    width: 100%;
    height: 100%;
    color: #fff;
}
.mf-banner .mf-cell-inner {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
}
/* 与 flickerplate .flick-title / .flick-sub-text 保持一致 */
.mf-banner .mf-title {
    padding: 0;
    font-size: 2.778em;
    line-height: 1.995em;
    text-align: center;
}
.mf-banner .mf-sub {
    padding: 5px;
    font-weight: 300;
    line-height: 2.5em;
    color: rgba(255, 255, 255, 0.8);
    text-align: center;
}

@media only screen and (max-width: 780px) {
    .mf-banner {
        min-width: 320px;
        max-width: 750px;
        height: 50vw;
        max-height: calc(100vh - 115px);
    }
    .mf-banner .mf-title { font-size: 16px; }
}