/* 
	banner_4 css root
	
	--banner4_ITEM_RADIUS: 2vw;
	--banner4_ITEM_1_BORDER_COLOR: #36a5d9;
	--banner4_ITEM_1_FILTER: drop-shadow(0px 0px 1rem #36a5d991);
	--banner4_ITEM_1_LIGHT: brightness(0) saturate(100%) invert(47%) sepia(100%) saturate(300%) hue-rotate(155deg) brightness(99%) contrast(102%);
	--banner4_ITEM_2_BORDER_COLOR: #f3ea12;
	--banner4_ITEM_2_FILTER: drop-shadow(0px 0px 1rem #f3ea1291);
	--banner4_ITEM_2_LIGHT: brightness(0) saturate(100%) invert(94%) sepia(88%) saturate(5779%) hue-rotate(350deg) brightness(100%) contrast(91%);
	
	--banner4_ITEM_CONTENT_TXT_COLOR: var(--color2);
	--banner4_ITEM_CONTENT_SPEC_STYLE_BG: linear-gradient(#ffc700 25%, #ff8a00);
	--banner4_ITEM_CONTENT_SPEC_STYLE_FONT_FAMILY: fantasy;
	--banner4_ITEM_CONTENT_BTN_BG: #36a5d9;
	--banner4_ITEM_CONTENT_BTN_TXT_COLOR: var(--color2);
 */

.banner-4- .banner-item- {
	position: relative
}

.banner-4- .banner-item- .item-bg- {
	position: relative;
	border-radius: var(--banner4_ITEM_RADIUS);
	border: 1px solid;
}

.banner-4- .banner-item- .item-bg- img {
	width: 100%;
	height: 100%;
	border-radius: var(--banner4_ITEM_RADIUS)
}

.banner-4- .banner-item- .item-bg- .item-light- {
	position: absolute;
	border-radius: 0;
	width: 120px;
	height: 120px;
	z-index: 1
}

.banner-4- .banner-item- .item-bg- .light-1- {
	top: -3.8rem
}

.banner-4- .banner-item- .item-bg- .light-2- {
	bottom: -3.8rem
}

.banner-4- .banner-item- .item-content- {
	position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    display: grid;
    grid-template-columns: 60% 40%;
    padding: 3vw 4vw;
    font-size: 5vw;
    font-weight: 400;
    line-height: 4vw;
    color: var(--banner4_ITEM_CONTENT_TXT_COLOR)
}

.banner-4- .banner-item- .item-content- .space- {
	margin: 5px 0 0;
	font-size: var(--DEFAULT_FONT_SIZE);
}

.banner-4- .banner-item- .item-content- h3 {
	margin: 0;
    font-size: 5vw;
    font-weight: 700;
    font-style: italic;
    text-transform: uppercase;
    letter-spacing: 1px
}

.banner-4- .banner-item- .item-content- .special-style- {
	line-height: normal;
    font-size: 8vw;
    font-weight: bold;
    background: var(--banner4_ITEM_CONTENT_SPEC_STYLE_BG);
    -webkit-text-fill-color: transparent;
    background-clip: text;
    -webkit-background-clip: text;
    /* font-family: var(--banner4_ITEM_CONTENT_SPEC_STYLE_FONT_FAMILY) */
}

.banner-4- .banner-item- .item-content- button {
	border: none;
	padding: 3vw 4vw;
    border-radius: 1vw;
    font-size: var(--BUTTON_LARGE_FONT_SIZE);
    font-weight: var(--REG_FONT_WEIGHT);
    color: var(--banner4_ITEM_CONTENT_BTN_TXT_COLOR);
    background: var(--banner4_ITEM_CONTENT_BTN_BG)
}

.banner-4- .banner-item- .item-content- button:hover {
	filter: brightness(.6)
}

.banner-4- .banner-item- .item-content- .content-img- {
	position: absolute;
    width: 50%;
    bottom: 1px
}

.banner-4- .banner-item-1 .item-bg- {
	border-color: var(--banner4_ITEM_1_BORDER_COLOR);
	filter: var(--banner4_ITEM_1_FILTER)
}

.banner-4- .banner-item-1 .item-bg- .item-light- {
	filter: var(--banner4_ITEM_1_LIGHT)
}

.banner-4- .banner-item-1 .item-bg- .light-1- {
	left: 10%;
	transform: translateX(-10%)
}

.banner-4- .banner-item-1 .item-bg- .light-2- {
	left: 40%;
	transform: translateX(-40%)
}

.banner-4- .banner-item-1 .item-content- .content-img- {
	right: 2vw
}

.banner-4- .banner-item-2 {
	margin: 9vw 0 0
}

.banner-4- .banner-item-2 .item-bg- .light-1- {
	right: 10%;
	transform: translateX(10%)
}

.banner-4- .banner-item-2 .item-bg- .light-2- {
	right: 40%;
	transform: translateX(40%)
}

.banner-4- .banner-item-2 .item-bg- {
	border-color: var(--banner4_ITEM_2_BORDER_COLOR);
	filter: var(--banner4_ITEM_2_FILTER)
}

.banner-4- .banner-item-2 .item-bg- .item-light- {
	filter: var(--banner4_ITEM_2_LIGHT)
}

.banner-4- .banner-item-2 .item-content- {
	text-align: right;
	grid-template-columns: 45% 55%
}

.banner-4- .banner-item-2 .item-content- .content-img- {
	left: 2vw
}