/* ==================== block_slogan ========================== */
:root { --slogan-bg: #1565c0; --slogan-color: #fff; }
.slogan-wrap {
    display: flex;
    align-items: center;
    gap: 0;
    background: var(--slogan-bg, #1565c0);
    color: var(--slogan-color, #fff);
    border-radius: 6px;
    overflow: hidden;
    min-height: 44px;
    box-shadow: 0 2px 10px rgba(0,0,0,.15);
}
.slogan-icon {
    flex-shrink: 0;
    background: rgba(0,0,0,.18);
    color: #fff;
    font-size: 16px;
    padding: 0 16px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* --- scroll left --- */
.slogan-left .slogan-marquee-track {
    flex: 1;
    overflow: hidden;
    white-space: nowrap;
}
.slogan-marquee-inner {
    display: inline-block;
    white-space: nowrap;
    padding-left: 100%;
    font-size: 14px;
    font-weight: 600;
    color: var(--slogan-color, #fff);
    animation: slogan-marquee linear infinite;
}
@keyframes slogan-marquee {
    from { transform: translateX(0); }
    to   { transform: translateX(-100%); }
}

/* --- cycle (fade / up) --- */
.slogan-cycle-track {
    flex: 1;
    position: relative;
    height: 44px;
    overflow: hidden;
}
.slogan-item {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    padding: 0 16px;
    font-size: 14px;
    font-weight: 600;
    color: var(--slogan-color, #fff);
    opacity: 0;
    pointer-events: none;
}
.slogan-item.slogan-visible { pointer-events: auto; }

/* fade */
.slogan-fade .slogan-item {
    transition: opacity .6s ease;
}
.slogan-fade .slogan-item.slogan-visible { opacity: 1; }

/* scroll up */
.slogan-up .slogan-item {
    transform: translateY(100%);
    transition: opacity .5s ease, transform .5s ease;
}
.slogan-up .slogan-item.slogan-visible {
    opacity: 1;
    transform: translateY(0);
}
/* ============================================================= */

/* ========== template: ticker (slt-*) ========================= */
.slt-wrap {
    display: flex;
    align-items: center;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-left: 4px solid var(--slogan-bg, #c62828);
    border-radius: 4px;
    min-height: 42px;
    box-shadow: 0 1px 6px rgba(0,0,0,.08);
    overflow: hidden;
}
.slt-label {
    flex-shrink: 0;
    background: var(--slogan-bg, #c62828);
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .5px;
    text-transform: uppercase;
    padding: 0 14px;
    height: 42px;
    display: flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
}
.slt-divider {
    width: 1px;
    height: 24px;
    background: #ddd;
    flex-shrink: 0;
}
.slt-marquee-track { flex: 1; overflow: hidden; white-space: nowrap; }
.slt-marquee-inner {
    display: inline-block;
    white-space: nowrap;
    padding-left: 100%;
    font-size: 14px;
    font-weight: 600;
    color: var(--slogan-color, #333);
    animation: slt-marquee linear infinite;
}
@keyframes slt-marquee { from { transform: translateX(0); } to { transform: translateX(-100%); } }

.slt-cycle-track { flex: 1; position: relative; height: 42px; overflow: hidden; }
.slt-item {
    position: absolute; inset: 0;
    display: flex; align-items: center;
    padding: 0 16px;
    font-size: 14px; font-weight: 600;
    color: var(--slogan-color, #333);
    opacity: 0; transition: opacity .5s ease;
}
.slt-item.slt-visible { opacity: 1; }
.slt-wrap.slogan-up .slt-item { transform: translateY(100%); transition: opacity .4s ease, transform .4s ease; }
.slt-wrap.slogan-up .slt-item.slt-visible { opacity: 1; transform: translateY(0); }
/* ============================================================= */

/* ========== template: banner (slb-*) ========================= */
.slb-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    background: var(--slogan-bg, linear-gradient(135deg,#b71c1c 0%,#e53935 50%,#b71c1c 100%));
    min-height: 56px;
    padding: 10px 20px;
    border-radius: 0;
    text-align: center;
    position: relative;
    overflow: hidden;
}
.slb-wrap::before {
    content: '';
    position: absolute;
    inset: 0;
    background: repeating-linear-gradient(45deg, transparent, transparent 10px, rgba(255,255,255,.04) 10px, rgba(255,255,255,.04) 20px);
    pointer-events: none;
}
.slb-deco { display: flex; align-items: center; gap: 4px; flex-shrink: 0; }
.slb-deco span { display: block; width: 6px; height: 6px; border-radius: 50%; background: rgba(255,255,255,.6); }
.slb-deco span:nth-child(2) { width: 10px; height: 10px; background: #fff; }

.slb-marquee-track { flex: 1; overflow: hidden; white-space: nowrap; }
.slb-marquee-inner {
    display: inline-block; white-space: nowrap; padding-left: 100%;
    font-size: 16px; font-weight: 700; letter-spacing: .5px;
    color: var(--slogan-color, #fff);
    text-shadow: 0 1px 3px rgba(0,0,0,.3);
    animation: slb-marquee linear infinite;
}
@keyframes slb-marquee { from { transform: translateX(0); } to { transform: translateX(-100%); } }

.slb-cycle-track { flex: 1; position: relative; min-height: 36px; }
.slb-item {
    position: absolute; inset: 0;
    display: flex; align-items: center; justify-content: center;
    font-size: 16px; font-weight: 700; letter-spacing: .5px;
    color: var(--slogan-color, #fff);
    text-shadow: 0 1px 3px rgba(0,0,0,.3);
    opacity: 0; transition: opacity .6s ease;
    text-align: center;
}
.slb-item.slb-visible { opacity: 1; }
.slb-wrap.slogan-up .slb-item { transform: translateY(100%); transition: opacity .5s ease, transform .5s ease; }
.slb-wrap.slogan-up .slb-item.slb-visible { opacity: 1; transform: translateY(0); }
/* ============================================================= */

/* ========== template: card (slc-*) =========================== */
.slc-wrap {
    background: var(--slogan-bg, #fff);
    border: 2px solid var(--slogan-color, #1565c0);
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 12px rgba(0,0,0,.1);
}
.slc-header {
    background: var(--slogan-color, #1565c0);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 8px 16px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
}
.slc-body { padding: 4px 0; min-height: 44px; }

.slc-marquee-track { overflow: hidden; white-space: nowrap; padding: 10px 0; }
.slc-marquee-inner {
    display: inline-block; white-space: nowrap; padding-left: 100%;
    font-size: 14px; font-weight: 600;
    color: var(--slogan-color, #1565c0);
    animation: slc-marquee linear infinite;
}
@keyframes slc-marquee { from { transform: translateX(0); } to { transform: translateX(-100%); } }

.slc-cycle-track { position: relative; min-height: 44px; }
.slc-item {
    position: absolute; inset: 0;
    display: flex; align-items: center;
    padding: 0 16px; gap: 10px;
    font-size: 14px; font-weight: 600;
    color: var(--slogan-color, #1565c0);
    opacity: 0; transition: opacity .5s ease;
}
.slc-item.slc-visible { opacity: 1; }
.slc-arrow { color: var(--slogan-color, #1565c0); font-size: 12px; flex-shrink: 0; animation: slc-pulse 1s ease infinite; }
@keyframes slc-pulse { 0%,100% { opacity:1; } 50% { opacity:.3; } }
.slc-wrap.slogan-up .slc-item { transform: translateY(100%); transition: opacity .4s ease, transform .4s ease; }
.slc-wrap.slogan-up .slc-item.slc-visible { opacity: 1; transform: translateY(0); }
/* ============================================================= */

.subsite-tabs .nav-tabs {
    background-color: #e9eff7;
}

.subsite-tabs .nav-tabs > li {
    margin-bottom: 0!important;
    padding: 8px 0 8px 12px;
}

.subsite-tabs .nav-tabs > li > a {
    border: 0;
    padding: 1px 12px 1px 1px;
    margin-right: 0;
    border-right: 1px solid #004f80;
    border-radius: 0;
}

.subsite-tabs .nav-tabs > li:last-child > a {
    border-right: 0;
}

.subsite-tabs .nav-tabs > li > a:hover {
    color: #004f80;
    font-weight: bold;
    background-color: transparent;
}

.subsite-tabs .nav-tabs > li.active > a {
    text-transform: uppercase;
    background-color: transparent;
    border: 0;
    border-right: 1px solid #004f80;
}

.subsite-tabs .nav-tabs > li.active:last-child > a {
    border-right: 0;
}

.subsite-tabs .nav-tabs > li.active > a,
.subsite-tabs .nav-tabs > li.active > a:hover,
.subsite-tabs .nav-tabs > li.active > a:focus {
    color: #004f80;
    font-weight: bold;
}

.subsite-tabs .sitelist-outer {
    position: relative;
}

.subsite-tabs .sitelist-outer:before {
    content: " ";
    position: absolute;
    top: 15px;
    bottom: 15px;
    left: 50%;
    margin-left: -9px;
    width: 1px;
    border-left: 1px dotted #ccc;
    display: block;
}

.subsite-tabs .sitelist {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    padding: 15px 15px 0 0;
    margin: 0;
}

.subsite-tabs .sitelist li {
    flex: 0 0 50%;
    max-width: 50%;
    margin-bottom: 10px!important;
    padding-right: 15px;
    padding-left: 15px;
    font-weight: 700;
}
