.half-image {
    display: flex;
    flex-wrap: wrap;
    padding: 0;
}

.half-image.right {
	flex-direction: row-reverse;
}

.half-image.lightblue {
    background-color: #C0D2D8;
}

.half-image.darkblue {
    background-color: #023645;
}

.half-image.darkblue :where(h2, h3, h4, h5, h6, p, a, span, b, strong) {
    color: #fff;
}

.half-image .container {
	max-width: 1428px;
}

.half-image-imgbox {
    position: relative;
    width: 100%;
}

.half-image-thumb {
	opacity: .75;
	width: 100%;
}

.half-image-contbox p:last-child {
	padding: 0;
}

.half-image-contbox :where(a) {
	color: #023645;
	font-weight: 500;
	text-decoration: underline;
}

.half-image-contbox :where(.btn) {
    color: #fff;
    font-weight: bold;
	text-decoration: none;
}

.half-image-contbox :where(h2,h3,h4,h5,h6) {
	color: #3A839E;
	font-family: 'Kanit', sans-serif;
	text-transform: uppercase;
}

.half-image-contbox :where(h2) {
	font-size: 36px;
	line-height: 1.30em;
	padding-bottom: 20px;
}

.half-image-contbox {
	padding-bottom: 40px;
	padding-left: 16px;
	padding-right: 16px;
	padding-top: 40px;
    width: 100%;
}

@media (min-width:768px) {
	.half-image-contbox :where(h2) {
		font-size: 40px;
	}
}

@media (min-width:1025px) {
	.half-image-contbox :where(h2) {
		font-size: 46px;
	}

    .half-image-imgbox {
        width: 50%;
    }
    
    .half-image-contbox {
		padding-bottom: 100px;
		padding-left: 32px;
		padding-right: calc((100% - 1428px) / 2);
		padding-top: 100px;
        width: 50%;
    }

	.half-image.right .half-image-contbox {
		padding-left: calc((100% - 1428px) / 2);
		padding-right: 32px;
    }

	.half-image-contbox-inner {
		padding-left: 16px;
	}
	
	.half-image-thumb {
		clip-path: polygon(0 0, 100% 0, 80% 50%, 100% 100%, 0 100%);
		display: block;
		height: 100%;
		left: 0;
		object-fit: cover;
		position: absolute;
		top: 0;
		width: 100%;
	}

	.half-image.right .half-image-thumb {
		clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%, 20% 50%);
	}
}