/* port */
	.h-port {
		position: relative;
		background-color: var(--brand-gray-light);
		color: var(--brand-yellow);
	}
	.h-port .h-inner {
		position: relative;
		display: flex;
    justify-content: flex-start;
    flex-flow: row wrap;
		width: 90%;
		max-width: 2000px;
		margin: 0 auto;
		padding: 8em 0 0;
	}
	.h-port .h-title-wrap {
		position: relative;
		display: flex;
		flex-flow: column;
		z-index: 3;
		width: 100%;
	}
	.h-port .h-inner .h-pre-title {
		color: var(--brand-yellow);
		font-size: 1.5em;
		line-height: 2em;
		margin-left: 1.5%;
		text-transform: capitalize;
	}
	.h-port .h-inner .h-title {
		color: var(--brand-yellow);
		font-size: 9em!important;
		font-size: 9.2vw;
		line-height: 1em;	
		z-index: 3;
	}
	.h-port .h-inner .h-accent-image-mid {
		position: absolute;
    top: 42%;
    left: 70%;
		z-index: 4;
	}
	.h-port .h-inner .h-content {
		display: flex;
		align-items: center;
		margin-top: 2em;
		margin-left: 1.5%;
		margin-bottom: 12em;
		min-height: 120px;
	}
	.h-port .h-inner .h-btn-yellow {
		display: inline-block;
		height: 60px;
		font-size: 20px;
		line-height: 38px;
		color: #FFF;
		background: var(--brand-yellow);
		border-radius: 9px;
		padding: 12px 30px;
		text-decoration: none;
		text-transform: uppercase;
		margin-left: 5% ;
		transition: all .3s ease;
		white-space: nowrap;
	}
	.h-port .h-inner .h-btn-gray:hover {
		background: rgba(91,103,112,0.6);
		color: #000;
	}
	@media screen and (max-width: 1400px) {
		.h-port .h-inner .h-accent-image-mid { 	top: 45%;	right: -15px;	left: unset;}
		.h-port .h-inner .h-content {	width: calc(100% - 450px);	flex-flow: column;	text-align: left; 	align-items: flex-start;	}
		.h-port .h-inner .h-btn-yellow {	margin-left: 0; 	}
		.h-port .h-inner .h-title { font-size: 7vw!important;	}
		.h-port .h-inner { padding: 150px 0 0}
	}
	@media screen and (max-width: 1024px) {
		.h-port .h-inner .h-content {	width: 50%;}
	}
	@media screen and (max-width: 880px) {
		.h-port .h-inner { padding: 22em 0 0; justify-content: flex-end; }
		.h-port .h-inner .h-title-wrap { width: 100%; margin-top: 60px;	}
		.h-port .h-inner .h-pre-title { font-size: 18px; line-height: 24px; }
		.h-port .h-inner .h-title { font-size: 60px!important; line-height: 60px; }
		.h-port .h-inner .h-accent-image-mid { position: relative; top: 60px; }
		.h-port .h-inner .h-content {	width: 100%; margin-bottom: 0; min-height: unset;}
	}
	@media screen and (max-width: 480px) {
		.h-port .h-inner { padding: 8em 0 0; justify-content: flex-end; }
		.h-port .h-inner .h-pre-title { margin-left: 0.5%; font-size: 18px; line-height: 24px; }
		.h-port .h-inner .h-title { font-size: 38px!important; line-height: 42px; }
		.h-port .h-inner .h-content {	width: 100%; margin-bottom: 0;}
		.h-port .h-inner .h-accent-image-mid{top: 24px;right: 0;width: 100% !important;}
	}