#header #header-wrap #logo a>img {
    height: 100px;
    width: auto;
}
.slide-caption{
	top: 35%;
	bottom: initial;
}
.owl-carousel .owl-controls .owl-dots {
    margin-bottom: -34px;
    margin-top: 20px;
    position: relative;
}
.slide-caption .htitle, 
.banner-caption .htitle{ 
	color: #fff;
    font-size: 3rem;
    font-weight: 700;
    font-family: 'Kanit';
}
.slide-caption .htitle span, 
.banner-caption .htitle span{ 
	padding: 0 30px; 
	color: #fff;
	background-color: #023ea1;
}
.slide-caption .btn, 
.banner-caption .btn{
	display: inline-block;
	border: 2px solid var(--main-border-color);;
	line-height: 60px;
	font-size: 2rem;
	padding: 0 30px;
	color: var(--main-code-color);
	background: transparent;
}
.slide-caption .btn:hover, 
.banner-caption .btn:hover{
	background-color: #023ea1;
	color: #ffffff;
	z-index: 1;
}
.slide-caption .btn:hover:before{ display: none;}


@media(max-width: 1112px){
	.slide-caption{ width: 80%;}
}
@media(max-width: 768px){
	.slide-caption .htitle{ font-size: 3.5rem;}
}
@media(max-width: 480px){
	#header.header-transparent #header-wrap #logo{ top: 5px;}
	.slide-caption .htitle{ font-size: 1.5em;}
	.slide-caption{ top: 35%;}
	.slide-caption .btn{ line-height: 40px; font-size: 1rem;}
	.slide-caption .htitle span{ padding: 0 10px;}
}
@media(max-width: 320px){
	.slide-caption .btn{ font-size: 1rem; padding: 0 15px;}
}
#suop--ele___headBanner {
    position: relative;
    top: -80px;
    margin-bottom: -80px;
}