@charset "utf-8";
/* CSS Document */

.slider-001 {
width: 100%;
max-width: 1000px;
position: relative;
margin: 0 auto;
overflow: hidden;
display: flex;
border-radius: 6px;
}

.slide-001 {
width: 100%;
flex-shrink: 0;
position: relative;
top: 0;
left: 0;
transition: all 0.6s ease-in-out;
}

.slide-content-001 {
width: 100%;
height: 530px;
background-color: #fff;
}

.slide-content-001 img {
width:100%;
object-fit: cover;
height: 100%;
}

.prev-001,
.next-001 {
cursor: pointer;
position: absolute;
top: 50%;
width: auto;
height: 65px;
padding: 0px;
margin-top: -28px;
color: #52846b;
font-weight: bold;
font-size: 30px;
transition: all 0.2s ease;
border-radius: 0 4px 4px 0;
user-select: none;
}

.next-001 {
right: 0;
border-radius: 4px 0 0 4px;
}

.prev-001:hover,
.next-001:hover {
/* background-color: rgba(107, 182, 255, 0.8); */
color: #89948e;

}

.slide-caption-001 {
color: #52846b;
font-size: 15px;
padding: 0;
position: absolute;
bottom: 31px;
width: 100%;
text-align: center;
}

.numbertext {
color: #253b30;
font-size: 17px;
font-weight: bold;
padding: 8px 16px;
position: absolute;
bottom: 16px;
left: calc(50% - 30px);
}

.dots {
height: 15px;
padding: 0;
position: absolute;
bottom: 10px;
width: 100%;
text-align: center;
}

.dot {
cursor: pointer;
height: 15px;
width: 15px;
margin: 10px 4px;
background-color: #ddd;
border-radius: 50%;
display: inline-block;
transition: all 0.2s ease;
}

.dot:hover {
background-color: #253b30;
}

@media only screen and (min-device-width:320px) and (max-device-width:812px) {
.slide-content-001{
	height: auto;
	padding-bottom: 40px;
}
.prev-001{
	top: 94%;
}
.next-001{
	top: 94%;
}
}