@charset "utf-8";

.business .overview {width:100% !important; overflow: hidden;}

.overview-list {width:100%; height:100%; display:flex;}
.overview-item {width:25%; height:100%; position:relative; overflow:hidden;}
.overview-item:before {width:100%; height:100%; position:absolute; left:0; top:0; background:#000; opacity:.3; display:block; content:'';z-index:1;transition:var(--ani); }
.overview-item p {
	text-align: center; font-size: var(--fs40);
	font-weight: 700; line-height: 120%; z-index:1;
	width:100%; left:0; top:180px; position:absolute; color:#fff;
}
.overview-item img {width:100%; height:100%; object-fit:cover; transition:var(--ani);}

.overview-item:hover img {transform:scale(1.1);}
.overview-item:hover:before {opacity:0;}
.overview-item:nth-child(3) img {object-position:75%;}
.overview-item:nth-child(4) img {object-position:40%;}

.itemListType1 {display:flex; gap:50px; flex-direction:column;}
.itemListType1 .item {display:flex; gap:50px;}
.itemListType1 .item>* {width:calc((100% - 50px)/2); }
.itemListType1 .item .img {aspect-ratio:1.6/1; align-self:start;}
.itemListType1 .item .img img {width:100%; height:100%; object-fit:cover;}
.itemListType1 .item .txt {}
.itemListType1 .item .txt {}

.itemListType2 {display:flex; gap:50px; flex-wrap:wrap;}
.itemListType2 .item {width:calc((100% - 50px)/2); display:flex; gap:50px; flex-direction:column;}
.itemListType2 .item .img {}
.itemListType2 .item .img img {width:100%; height:100%; object-fit:cover;}
.itemListType2 .item .txt {}
.itemListType2 .item .txt {}

.itemListType3 {display:flex; gap:40px 50px; flex-wrap:wrap; text-align:center;}
.itemListType3 .item {width:calc((100% - 100px)/3);}
.itemListType3 .item p {padding:10px 0 0;}
.itemListType3 .item .img {width:100%; background:#fff;}
.itemListType3 .item .img img {width:100%; height:100%; object-fit:cover;}
.itemListType3.paper .img {padding:10px;aspect-ratio:1/1.4;}
.itemListType3.paper .img img { object-fit:scale-down;}

.itemListType4 {display:flex; gap:20px; }
.itemListType4 .item {width:calc((100% - 40px)/3);}
.itemListType4 .item p {padding:10px 0 0;}
.itemListType4 .item .img {height:320px;}
.itemListType4 .item .img img {width:100%; height:100%; object-fit:cover;}
.itemListType4 .imgType1.col {height:320px;}



.imgType1 {display:flex; gap:20px; }
.imgType1 .img {}
.imgType1 .img img {width:100%; height:100%; object-fit:cover;}
.imgType1.leng-2 .img {width:calc((100% - 20px)/2);}
.imgType1.col {flex-direction:column;}
.imgType1.col {width:100%; height:calc((100% - 20px)/2);}

.imgType2 {position:relative; display:flex;}
.imgType2 .img {width:50%;}
.imgType2 .img img {width:100%; height:100%; object-fit:cover;}
.imgType2 p {
	display: flex; padding: 10px; justify-content: center; align-items: center;
	gap: 10px; color:#000; line-height:1; left:30px; top:30px; position:absolute;
	border-radius: 5px; background: rgba(255, 255, 255, 0.50);
}


/* ************************ 태블릿 이하(~991) ************************ */
@media (max-width: 1199px) {

	.business .overview {height:calc(100vh - 60px);}
	
	.overview-list {flex-wrap:wrap;}
	.overview-item {width:50%; height:50%; position:relative;}
	.overview-item:before {display:none;}
	.overview-item p {top:50%; transform:translateY(-50%);}
	
	.itemListType1 {gap:40px;}
	.itemListType1 .item {gap:20px;}
	.itemListType1 .item>* {width:calc((100% - 20px)/2);}
	
	.itemListType2 {gap:20px;}
	.itemListType2 .item {gap:30px; width: calc((100% - 20px) / 2);}
	
	.itemListType3 {gap:20px;}
	.itemListType3 .item {width:calc((100% - 40px)/3);}
	
	.imgType2 .img {}
	.imgType2 .img img {}
	.imgType2 p {}
	
}


/* ************************ 모바일 ************************ */
@media (max-width: 767px) {
	
	.business .overview {height:initial; overflow:visible;}
	
	/* .overview-list {height:initial; } */
	.overview-item {width:100%;height:25%;}
	
	.itemListType1 {gap:30px;}
	.itemListType1 .item {flex-direction:column;}
	.itemListType1 .item>* {width:100%;}
	
	.itemListType2 {flex-direction:column;}
	.itemListType2 .item {gap:20px; width:100%;}
	
	.itemListType3 {gap:20px 10px;}
	.itemListType3 .item {width:calc((100% - 10px)/2);}
	.itemListType3 .item p {padding:5px 0 0; line-height:130%;}
	
	.itemListType4 {flex-direction:column;}
	.itemListType4 .item {width:100%;}
	.itemListType4 .item .img {height: initial;}
	.itemListType4 .imgType1.col {height: initial;}
	
	.imgType1 {gap:10px;}
	.imgType1.leng-2 .img {}
	
	.imgType1.col {}
	
	.imgType2 {flex-direction:column;}
	.imgType2 .img {width:100%;}
	.imgType2 .img img {}
	.imgType2 p {left:50%; top:50%;transform:translate(-50%,-50%); background:rgba(255, 255, 255, 0.70);}
	

	
	
	
	
}