.index-banner {
	top: -60px;
	position: relative;
	width: 100%;
	border-radius: 0 0 35px 35px
}

.index-banner-text {
	color: #fff;
	position: absolute;
	top: 15%;
	left: 10%
}

.index-banner-btn {
	position: absolute;
	top: 45%;
	left: 10%
}

.news-wrapper {
	background-color: #fff;
	border-radius: 20px;
	padding: 45px;
	box-shadow: 0 47px 65px rgb(21 28 38 / 10%)
}

.news-box a.text-heading-4 {
	display: block;
	padding: 15px 0 25px 0;
	color: var(--text-color);
	font-size: 1.25rem
}

.news-box a.text-heading-4:hover {
	color: var(--main-color)
}

.news-box .grid-4-img {
	position: relative;
	padding-bottom: 15px
}

.news-box .grid-4-img img {
	-webkit-transition: .2s;
	transition: .2s
}

.news-box .grid-4-img::before {
	content: "";
	position: absolute;
	top: 5px;
	bottom: 13px;
	right: 0;
	width: 92%;
	border-radius: 10px;
	background-color: #d1ecfd;
	-webkit-transition-duration: .2s;
	transition-duration: .2s
}

.news-box .grid-4-img img {
	position: relative;
	z-index: 2;
	border-radius: 10px;
	max-width: 90%;
	width: 100%
}

.news-box:hover .grid-4-img::before {
	right: 5px;
	top: 2px;
	bottom: 15px;
	-webkit-transition-duration: .2s;
	transition-duration: .2s
}

.news-box:hover .grid-4-img img {
	opacity: .95;
	-webkit-transition: .2s;
	transition: .2s
}

.box-image {
	position: relative;
	top: -20%
}

@media (max-width:991px) {
	.text-display-5 {
		font-size: 2.2rem
	}

	.index-banner-btn {
		top: 27%
	}

	.index-banner-text {
		top: 0
	}

	.btn.btn-theme {
		font-size: 1rem;
		line-height: 10px
	}
}

@media (max-width:746px) {
	.text-display-5 {
		font-size: 1.4rem
	}

	.index-banner-text {
		top: -10%
	}

	.index-banner-btn {
		top: 17%
	}

	.banner-hero {
		padding: 60px 0 0 0
	}

	.box-login-form {
		display: none
	}
}

.box-signup .form-group input.form-control:focus {
	border: 2px solid var(--main-color)
}

@media (max-width:576px) {
	.img-responsive {
		padding: 0 2rem
	}
}

.card-grid-style-4 .grid-4-img::before {
	content: "";
	position: absolute;
	bottom: 0;
	right: 15px;
	width: 85%;
	border-radius: 16px;
	background-color: #d1ecfd;
	top: 20px;
	-webkit-transition-duration: .2s;
	transition-duration: .2s
}

#video-area .btn-play-video {
	position: absolute;
	top: 50%;
	margin-top: -10%;
	left: 35%;
	width: 64px;
	height: 72px;
	background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNjgiIGhlaWdodD0iNzIiIHZpZXdCb3g9IjAgMCA2OCA3MiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgZmlsdGVyPSJ1cmwoI2ZpbHRlcjBfZF8yOV8zMDMpIj4KPGNpcmNsZSBjeD0iMzQiIGN5PSIzMCIgcj0iMzAiIGZpbGw9IndoaXRlIi8+CjwvZz4KPHBhdGggZD0iTTI4Ljc5OCAzNy45MDA5TDM5LjQ2NDcgMjkuOTAwOUMzOS43MzE0IDI5LjcwMDkgMzkuNzMxNCAyOS4zMDA5IDM5LjQ2NDcgMjkuMTAwOUwyOC43OTggMjEuMTAwOUMyOC40Njg0IDIwLjg1MzcgMjcuOTk4IDIxLjA4ODkgMjcuOTk4IDIxLjUwMDlWMzcuNTAwOUMyNy45OTggMzcuOTEyOSAyOC40Njg0IDM4LjE0ODEgMjguNzk4IDM3LjkwMDlaIiBmaWxsPSIjMTAxODI4Ii8+CjxkZWZzPgo8ZmlsdGVyIGlkPSJmaWx0ZXIwX2RfMjlfMzAzIiB4PSIwIiB5PSIwIiB3aWR0aD0iNjgiIGhlaWdodD0iNzIiIGZpbHRlclVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgY29sb3ItaW50ZXJwb2xhdGlvbi1maWx0ZXJzPSJzUkdCIj4KPGZlRmxvb2QgZmxvb2Qtb3BhY2l0eT0iMCIgcmVzdWx0PSJCYWNrZ3JvdW5kSW1hZ2VGaXgiLz4KPGZlQ29sb3JNYXRyaXggaW49IlNvdXJjZUFscGhhIiB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMTI3IDAiIHJlc3VsdD0iaGFyZEFscGhhIi8+CjxmZU9mZnNldCBkeT0iOCIvPgo8ZmVHYXVzc2lhbkJsdXIgc3RkRGV2aWF0aW9uPSIyIi8+CjxmZUNvbG9yTWF0cml4IHR5cGU9Im1hdHJpeCIgdmFsdWVzPSIwIDAgMCAwIDAuMDg2Mjc0NSAwIDAgMCAwIDAuMTA5ODA0IDAgMCAwIDAgMC4xNTY4NjMgMCAwIDAgMC4wMiAwIi8+CjxmZUJsZW5kIG1vZGU9Im5vcm1hbCIgaW4yPSJCYWNrZ3JvdW5kSW1hZ2VGaXgiIHJlc3VsdD0iZWZmZWN0MV9kcm9wU2hhZG93XzI5XzMwMyIvPgo8ZmVCbGVuZCBtb2RlPSJub3JtYWwiIGluPSJTb3VyY2VHcmFwaGljIiBpbjI9ImVmZmVjdDFfZHJvcFNoYWRvd18yOV8zMDMiIHJlc3VsdD0ic2hhcGUiLz4KPC9maWx0ZXI+CjwvZGVmcz4KPC9zdmc+Cg==) no-repeat;
	z-index: 99;
}

span {
	font-family: "Chivo", "Noto Sans TC", sans-serif;
}

.modal .box-signup .box-form-signup {
    background-color: transparent;
    padding: 10px;
	box-shadow: none
}