.banner{
    background: url(../images/banner_bg.jpg) center /cover;
}
.banner ul {
    margin: 0 !important;
}

.banner .pic {
    object-fit: cover;
    height: 100%;
    width: 100%;
    min-height: 95vh;
    max-height: 95vh;
}


.banner .list {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.slick-dots {
    bottom: 10px;
}
.slick-dots li{
	margin: 0 9px;
}
.slick-dots li button::before {
    line-height: 20px;
    position: absolute;
    top: 0px;
    left: 0px;
    width: 30px;
    height: 3px;
    content: " ";
    background: #fff;
    opacity: .8;
    -webkit-font-smoothing: antialiased;

}

.slick-dots li.slick-active button:before ,.slick-dots li button:hover::before{
    opacity: 1;
    background:rgba(0, 73, 57, 0.8);
}

.banner .text {
	text-shadow: 0px 0px 5px #000;
    position: absolute;
    z-index: 500;
    top: 40%;
    color: #fff;
    left: 10%;
}
.banner .text b{font-weight: bold;}
.banner .list .title {
    font-size: 3em;
    position: relative;
}

.banner .list .title::after,
.banner .list .title::before {
    content: " ";
    width: 50px;
    height: 1px;
    background: #fff;
    position: absolute;
    transform: rotate(-45deg);
}

.banner .list .title::after {
    top: 50%;
}

.banner .list .title::before {
    bottom: -10px;
    left: -50px;
}
.banner .list .text b{
	font-size: 1.5em;
	font-weight: 100;
}

@media only screen and (max-width: 768px) {

}

@media only screen and (max-width: 766px) {
	.banner .list .text{
		padding: 50px;
	}

}

@media only screen and (max-width: 480px) {
	.banner .text{
		left: 0;
		top: 28%;
	}
	.banner .pic{
		min-height: 90vh;
		max-height: 90vh;
	}

}