.post-heading-area{
	position: relative;
	margin-bottom: 3.8125em;
}

.post-heading-area:before{
	content: '';
	width: 100%;
	height: 174px;
	display: block;
	background: #006353;
}

.post-heading-area .container{
	margin-top: -87px;
}

.hero-banner{
	display: flex;
	box-shadow: 0 3px 6px 0px rgba(0, 0, 0, 0.16);
}

.hero-information{
	padding: 54px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-start;
	background: #fff;
	width: 370px;
	min-height: 370px;
}

.hero-information .post-category{
	color: #3A7E99;
	font-size: 2.5rem;
	font-weight: bold;
	line-height: 1.075;
	font-family: 'Archivo', sans-serif; 
	display: block;
	padding-bottom: 0.275em;
}

.hero-information .post-title{
	font-family: 'Archivo', sans-serif; 
	font-size: 1.125rem;
	line-height: 1.2222;
}

.hero-information .post-cta{
	padding-top: 1.8em;
}

.hero-information .post-cta a.btn{
	background: #3D94B4;
	border: 0;
	color: white;
	font-weight: bold;
	font-size: 1.125rem;
}

.hero-thumbnail{
	width: auto;
	flex: 1 1 auto;
	
	display: flex;
	align-items: flex-end;
	background-color: #ddd;
	
	position: relative;
}

.hero-thumbnail:before{
	content: "";
    display: block;
    padding-bottom: 67.26457%;
}

.hero-thumbnail .stairs{
    display: none;
}

.hero-thumbnail .stairs{
	width: 100%;
	height: 16.6667%;
	opacity: 0.8;
}

.hero-thumbnail .stairs:after,
.hero-thumbnail .stairs:before{
	content: '';
	height: 50%;
	width: 25%;
	float: right;
	display: block;
	background: #FEC40E;
}

.hero-thumbnail .stairs:after{
	width: 100%;
}

.hero-notice{
	font-size: 0.85rem;
	display: block;
	padding-top: 1rem;
}

.post-description .description{
	line-height: 1.1875;
	color: #3C3C3C;
}

.post-description h3{
	margin-top: 0;
}

.schedule{
	display: flex;
	flex-wrap: wrap;
	width: 50%;
	max-width: 400px;
	justify-content: space-between;
	padding-bottom: 2.3125em;
	color: #3C3C3C;
}

.schedule > div{
	padding-right: 1em;
}

@media (max-width: 767px) {
	.post-heading-area:before{ height: 123px; }
	.hero-banner{ flex-direction: column; box-shadow: none; }
	.hero-thumbnail{ padding-bottom: 44%; position: relative; }
	.hero-thumbnail .stairs{ position: absolute; bottom: 0; left: 0; }
	.hero-information{
		padding: 22px 29px;
		min-height: 0;
		width: 100%;
		margin-top: 14.3px;
		box-shadow: 0 3px 6px 0px rgba(0, 0, 0, 0.16);
	}
	.hero-information .post-category{ font-size: 1.875rem; }
	.hero-information .post-title { font-size: 1rem; } 
	.hero-information .btn{
		min-width: 94px;
		min-height: 33px;
		font-size: 1rem !important;
		padding: 0.4em 0.5em;
	}
	
	.schedule{ width: 100%; max-width: 100%; }
}