section#main-header {
    background-color: #fff;
    padding: 15px 0;
}

.row {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.bn-wrapper {
    width: 785px;
    height: 450px;
    overflow: hidden;
    position: relative;
}

.mod-wrapper {width: 370px;}

.mod-search {
    width: 100%;
    height: 150px;
    margin-bottom: 15px;
    border-radius: 15px;
    background-color: #173949;
    padding: 15px 0;
}

.mod-status {
    width: 100%;
    height: 285px;
    border-radius: 15px;
    background-color: #1c2d56;
    position: relative;
    overflow: hidden;
    z-index: 0;
}

.mod-status-background {
    width: 480px;
    height: 480px;
    position: absolute;
    border-radius: 480px;
    background-color: #172547;
    border: 40px #19284e solid;
    z-index: -1;
    top: -5px;
    left: 52px;
}

.mod-status-today {
    color: #fff;
    font-weight: 700;
    font-size: 12px;
    text-align: right;
    padding: 15px;
}

.mod-status-today > i {
    margin: 0 2.5px;
}

.mod-status-ad,
.mod-status-dis {
    padding: 0 30px;
    margin: 15px 0;
    color: #fff;
}

.mod-status-title {
    display: inline-block;
    font-size: 12px;
    font-weight: 700;
    padding: 2.5px 15px;
    background-color: #aaa;
    border-radius: 100px;
    margin-bottom: 5px;
}

.mod-status-ad .mod-status-title {
    background-color: #3f51b5;
}

.mod-status-dis .mod-status-title {
    background-color: #8bc34a;
}


@keyframes modstatusbackground {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

.mod-status-background::before {
    content: '';
    display: block;
    position: absolute;
    width: 10px;
    height: 150px;
    border-radius: 10px;
    margin-left: 195px;
    margin-top: 50px;
    background-color: #1c2d56;
    transform-origin: 5px 145px;
    animation: 60s modstatusbackground linear infinite;
}

.mod-status-background::after {
    content: '';
    display: block;
    position: absolute;
    width: 100px;
    height: 10px;
    border-radius: 10px;
    margin-top: 190px;
    margin-left: 105px;
    background-color: #1c2d56;
    transform-origin: 95px 5px;
    animation: 1440s modstatusbackground linear infinite;
}


.bn-navigation {
    position: absolute;
    left: 40px;
    bottom: 10px;
    z-index: 1;
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    transition: all .5s cubic-bezier(0.22, 0.61, 0.36, 1);
}
.bn-navigation.main-banner-closed {
    bottom: 40px;
}

.bn-navigation > button {
    /* float: right; */
}

.bn-navigation .pause, .bn-navigation .play {
    border: 0;
    padding: 0;
    color: #fff;
    background: none;
    outline: none;
    min-width: 0px;
    /* line-height: 0; */
    height: auto;
    border-radius: 0;
}
.bn-navigation .play {
	display: none;
}

.bn-navigation .slick-dots {
    margin-top: -2px;
    margin-right: 10px;
}

.bn-navigation .slick-dots li {
    display: block;
    float: left;
}

.bn-navigation .slick-dots li button {
    background-color: #aaa;
    font-size: 0px;
    padding: 0;
    margin-right: 10px;
    width: 12px;
    min-width: 0;
    height: 12px;
    border-radius: 6px;
    border: none;
    color: transparent;
    outline: none;
    transition: all .3s ease;
}

.bn-navigation .slick-dots li.slick-active button {
    position: relative;
    background-color: #aaa;
    width: 44px;
    overflow: hidden;
}
.bn-navigation .slick-dots li.slick-active button::after {content: '';position: absolute;display: block;background-color: #fff;width: 100%;height: 12px;border-radius: 6px;top: 0;left: 0;
    animation: mainRollingSlickDots 5500ms linear;
}
.bn-navigation .slick-dots li.slick-active.pause button::after {
    animation: none;
}
@keyframes mainRollingSlickDots {
    0% { 
        width: 0%;
    }
    100% {
        width: 100%;
    }
}


.mod-search>.search-icon {
    width: 36px;
    height: 36px;
    border: 4px #fff solid;
    border-radius: 18px;
    box-sizing: border-box;
    margin: 40px 0 0 20px;
    position: absolute;
    transition: all .3s ease-out;
}

.mod-search>.search-icon::before {
    content: '';
    display: block;
    position: absolute;
    background-color: #fff;
    width: 4px;
    height: 4px;
    bottom: -2px;
    right: -2px;
    transform: rotate(45deg);
}

.mod-search>.search-icon::after {
    content: '';
    display: block;
    position: absolute;
    background-color: #fff;
    width: 14px;
    height: 6px;
    bottom: -9px;
    right: -13px;
    transform: rotate(45deg);
}

.mod-search>.search-text {
    font-weight: 700;
    color: #fff;
    font-size: 22px;
    padding-left: 80px;
    margin-top: 30px;
}

.mod-search>.search-text>* {
    font-family: inherit;
    color: inherit;
}
.mod-search>.search-text>i {
    font-style: normal;
    color: #0ee;
}
.mod-search>.search-text>small {
    font-size: .5em;
}

.mod-search>.input-line {
	float: left;
	width: 202px;
	margin-left: 78px;
	margin-top: 10px;
	border-bottom: 1px #fff solid;
}

.mod-search>.input-line>input[type='text'] {
	letter-spacing: -1px;
	background-color: transparent;
	color: #fff;
	font-size: 18px;
	font-weight: 900;
	text-align: center;
	width: 48px;
}

.mod-search>.input-line>span {
    color: #fff;
    font-size: 20px;
    margin: 0;
}

.mod-search>.input-line>input[type='text']:last-child {
    width: 72px;
}

.mod-search>.search-btn {
	float: left;
	color: #fff;
	font-size: 12px;
	margin-top: 10px;
	margin-left: 8px;
	padding: 5px 15px;
	border: 1px #fff solid;
	text-align: center;
	border-radius: 4px;
	cursor: pointer;
}


#calendar {
    padding: .5em;
}

.fc-event {
    padding: .5px;
    margin: 2px 10px;
    border-radius: 99px;
}

.calendar h2 {
    font-size: 14px;
}

.calendar .fc-toolbar button {
    background: none;
    border: none;
    box-shadow: none;
    font-size: 12px;
    height: auto;
    color: #aaa;
}

.calendar .fc-toolbar .fc-left {
    margin-left: 150px;
}

.calendar .fc-toolbar .fc-right {
    margin-right: 150px;
}

.fc-day-grid-event .fc-content {
    font-size: 0;
}

.fc-unthemed th, .fc-unthemed td, .fc-unthemed thead, .fc-unthemed tbody, .fc-unthemed .fc-divider, .fc-unthemed .fc-row, .fc-unthemed .fc-content, .fc-unthemed .fc-popover, .fc-unthemed .fc-list-view, .fc-unthemed .fc-list-heading td {
    border: none;
}

.fc td.fc-today {
    border: none;
}

.fc-ltr .fc-basic-view .fc-day-top .fc-day-number {
    font-size: 12px;
    float: none;
}

.fc .fc-row .fc-content-skeleton table, .fc .fc-row .fc-content-skeleton td, .fc .fc-row .fc-helper-skeleton td {
    text-align: center;
}

.fc-basic-view .fc-body .fc-row {
    min-height: 44px;
}


.calendar-header {
    text-align: right;
    padding: 10px 20px;
    font-size: .9em;
    color: #666;
}

.calendar-header > span {
    padding-left: 45px;
    position: relative;
    display: inline-block;
}

.calendar-header > span::before {
    content: '';
    display: block;
    position: absolute;
    width: 30px;
    height: 3px;
    border-radius: 4px;
    background-color: #aaa;
    left: 10px;
    top: 7px;
}

.calendar-header > span.ad::before {
    background-color: #3f51b5;
}

.calendar-header > span.dis::before {
    background-color: #8bc34a;
}


#main-information .notice,
#main-information .caseinfo,
#main-information .calendar {
    -ms-flex: 0 0 335px;
    flex: 0 0 335px;
    max-width: 335px;
    margin-right: 15px;
    background-color: #fff;
    border-radius: 15px;
    border: 1px #ccc solid;
    overflow: hidden;
}

#main-information .illegal {
    width: 100%;
    margin:30px 0 ;
    padding : 10px 0 ;
    background-color: #fff;
    border-radius: 15px;
    border: 1px #ccc solid;
    overflow: hidden;
    text-align: center;
}

#main-information .title {
    font-size: 18px;
    font-weight: bold;
    border-bottom: 1px #e1e1e1 solid;
    padding: 15px 30px;
}

#main-information .board .list {
    border-bottom: 1px #e1e1e1 dashed;
    height: 64px;
    padding: 0 30px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    cursor: pointer;
}

#main-information .board .list .tag {
    color: #fff;
    background-color: #657381;
    /* display: inline-block; */
    width: fit-content;
    font-size: 12px;
    font-weight: bold;
    padding: 2.5px 15px;
    border-radius: 1000px;
    margin-bottom: 2.5px;
}

#main-information .board .list p {
    font-size: 14px;
    font-weight: bold;
    width: 100%;
    display: inline;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

#main-information .board .list:last-child {
    border-bottom: none;
}

#main-information .board .list:hover {
    background-color: #f0f0f0;
}

#main-information .board .list .tag.t1 {
    background-color: #3f51b5;
}

#main-information .board .list .tag.t2 {
    background-color: #8bc34a;
}

#main-information .board .list .tag.t3 {
    background-color: #ff3333;
}

#main-information .board .list small {
    font-size: 12px;
    color: #666;
    margin-top: 4px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}


#main-information .calendar {
    -ms-flex: 0 0 470px;
    flex: 0 0 470px;
    max-width: 470px;
}







/**/
.bn-content {
    height: 100%;
    background: #333;
    color: #fff;
    border-radius: 15px;
    overflow: hidden;
}

.bn-item_wrap {
    display: flex;
    width: 785px;
    height: 450px;
    margin: 0;
    padding: 44px 40px;
    align-items: center;
    box-sizing: border-box;
    word-break: keep-all;
    line-height: 1.5;
}

.bn-item h2 {
    font-size: 36px;
}

.bn-item p {
    font-weight: 400;
    font-size: 18px;
}

.bn-item_wrap.bn-bgcolor_1 { background-color: #56453b;}
.bn-item_wrap.bn-bgcolor_2 { background-color: #3b4130;}
.bn-item_wrap.bn-bgcolor_3 { background-color: #446c4d;}
.bn-item_wrap.bn-bgcolor_4 { background-color: #33807d;}
.bn-item_wrap.bn-bgcolor_5 { background-color: #104587;}
.bn-item_wrap.bn-bgcolor_6 { background-color: #5139b7;}
.bn-item_wrap.bn-bgcolor_7 { background-color: #633465;}
.bn-item_wrap.bn-bgcolor_8 { background-color: #d44a77;}

.bn-item_wrap.bn-bgimg_1 { background-image: url('/assets/images/kpbmaad_bn_patt01.png');}
.bn-item_wrap.bn-bgimg_2 { background-image: url('/assets/images/kpbmaad_bn_patt02.png');}
.bn-item_wrap.bn-bgimg_3 { background-image: url('/assets/images/kpbmaad_bn_pht01.png');}
.bn-item_wrap.bn-bgimg_4 { background-image: url('/assets/images/kpbmaad_bn_pht02.png');}