/************************************/
/******** main style ********/
/************************************/

/******** main_visual *******/
.main_visual {
    position: relative;
    width: 100%;
    height: 52vw;
    overflow: hidden;
}

/* 모바일에서 최소 높이 적용 */
@media (max-width: 768px) {
    .main_visual {
        min-height: 900px; /* 최소 높이를 900px로 설정 */
        height: 100vw; 
    }
}

@media (max-width: 480px) {
    .main_visual {
        min-height: 700px; /* 최소 높이를 700px로 설정 */
        height: 100vw; 
    }
}


.hero_solution_wrap {
	width: 100%;
	position: absolute;
	/*bottom: 200; /* 밑에 간격 띄우기 */
	bottom: 10%; /* 밑에 간격 띄우기 */	
	/*left: 50%; */
	left: 50%;	
	transform: translateX(-50%);
	z-index: 2;
}

.hero_solution {
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
	display: flex;
	padding-bottom: 30px;
}
.hero_solution_item {
	flex: 1;
	margin: 0 15px;
	padding: 30px;
	position: relative;
	color: #fff;
	border: 1px solid rgba(255,255,255,.3);
}
.hero_solution_item:hover {
	background: #2b4e75;
	border: 1px solid rgba(255,255,255,0);
	cursor: pointer;
	opacity:0.8;
}
.hero_solution_item .item_inner {
	padding-bottom: 20px;
}
.hero_solution_item .item_inner > h3 {
	font-size: 1.2rem;
	font-weight: 900;
	height: 50px;
    border-bottom: 2px solid #fff;
    margin-bottom: 15px;	
}
.hero_solution_item .item_inner > h3 img {
	max-width: 50%;
	max-height: 50%;
}
.hero_solution_item .item_inner .item_desc img {
	height: 30px;
}
.hero_solution_item .item_inner .item_desc > h4 {
	font-size: 1.8rem;
	font-weight: 700;
	margin-top: 15px;
	word-break: keep-all;
}
.hero_solution_item .item_inner .item_desc > h4 img {
	height: 30px;
	margin-right: 10px;
	vertical-align: middle;
}
.hero_solution_item .item_inner .item_desc .material-icons {
	position: absolute;
	bottom: 15px;
	right: 15px;
	margin-top: 30px;
	font-size: 2rem;
	line-height: 1;
}

.hero_text {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	display: inline-block;
	max-width: 1200px;
	text-align: center;
	color: #fff;
	z-index: 2;
}
.hero_text > h1 {
	font-size: 56px;
	font-weight: 700;
	line-height: 1;
	text-shadow: 1px 2px 0 rgba(0 0 0 /10%);
	white-space: nowrap;
	animation: vtxt1 0.8s .4s cubic-bezier(0.4, 0, 0.2, 0.5) both;
}
.hero_text > p {
	font-size: 20px;
	margin:15px 0 30px;
	color: rgba(255,255,255,.7);
	text-shadow: 1px 2px 0 rgba(0 0 0 /30%);
	word-break: keep-all;
	animation: vtxt2 0.8s 1.2s cubic-bezier(0.4, 0, 0.2, 0.5) both;
}