section.vision {
	width: 100%; height: auto;
	padding: 100px 0px 200px;
}

.bg_box {
	left: 50%;
	width: clamp(1250px, calc((1080 / 1280) * 100vw), calc(100% - 400px)); height: auto;
	background-color: #e0f2ff; 
	border-radius: 15px;
	padding: 100px 60px;

    -webkit-transform: translate(-50%, 0%);
    -ms-transform: translate(-50%, 0%);
    transform: translate(-50%, 0%);
}



.contents_title {
	width: 100%; height: auto; line-height: 1.2;
	font-size: 36px; color: var(--color-black); text-align: left;
}
.contents_title.top { margin-top: -150px; }
.txt_big_en.top { margin-top: -90px; }

.txt_big_en {
	width: 100%; height: auto; line-height: 1.2;
	font-size: 46px; color: #5a5a5a; text-align: center;
	margin-top: 60px;
}


.txt_big_ko {
	width: 100%; height: auto; line-height: 1.5;
	font-size: 26px; color: #000; text-align: center;
	margin-top: 40px;
}

.bg_box .bg_img {
	width: 100%; height: auto;
	margin-top: 40px;
}


.bg_box .bg_img img {
	left: 50%;
	max-width: 550px;
	width: auto; height: auto;

    -webkit-transform: translate(-50%, 0%);
    -ms-transform: translate(-50%, 0%);
    transform: translate(-50%, 0%);
}


.bg_box .color01 { color: #000000; }
.bg_box .color02 { color: #217001; }
.bg_box .color03 { color: #005896; }



.vision_card {
	width: 100%; height: auto;
	margin-top: 90px; 
	text-align: center;
}


.vision_card .vision_card_item:nth-child(1) { margin-left: 0px; border-color: #217001; }
.vision_card .vision_card_item:nth-child(2) { border-color: #005896; }
.vision_card .vision_card_item {
	float: none;
	width: 300px; height: auto;
	border: 1px solid #000000;
	border-radius: 36px;
	background-color: #fff;
	margin-left: 20px;
	padding: 90px 0px;
}

.vision_card .vision_card_item:nth-child(1) .vision_card_title { color: #217001; }
.vision_card .vision_card_item:nth-child(2) .vision_card_title { color: #005896; }
.vision_card .vision_card_item .vision_card_title {
	width: 100%; height: auto; line-height: 1;
	font-size: 26px; color: #000; text-align: center;
}



.vision_card .vision_card_item .vision_card_bar {
	width: 100%; height: 40px;
	margin-top: 15px;
}

.vision_card .vision_card_item:nth-child(1) .vision_card_bar::after { background-color: #217001; }
.vision_card .vision_card_item:nth-child(2) .vision_card_bar::after { background-color: #005896; }
.vision_card .vision_card_item .vision_card_bar::after {
	position: absolute; top: 0px; left: 50%;
	content: '';
	width: 1px; height: 100%;
	background-color: #000;
}


.vision_card .vision_card_item .vision_card_desc {
	width: 100%; height: auto; line-height: 1.5;
	font-size: 20px; color: #000; text-align: center;
	margin-top: 20px;
}



.containner_box .page_main_title,
.containner_box .page_sub { width: 100%; }

.pvision_img {
	width: 100%; height: auto;
	margin-top: 60px;
}

.pvision_img img {
	left: 50%;
	max-width: 100%; width: auto; height: auto;
	
    -webkit-transform: translate(-50%, 0%);
    -ms-transform: translate(-50%, 0%);
    transform: translate(-50%, 0%);
}


.pvision_img img.img01 { width: 550px; }
.pvision_img img.img02 { width: 900px; }
.pvision_img img.img03 { width: 100%; }

.pvision_img img.img03.pc{ display: inline-block; }
.pvision_img img.img03.mo{ display: none; }

br.pvision_01{ display: none; }
br.pvision_02{ display: none; }

@media (max-width: 749px) { 
	br.pvision_01{ display: block !important; }
	br.pvision_02{ display: block !important; }

	.pvision_img img.img03.pc{ display: none; }
	.pvision_img img.img03.mo{ display: inline-block; }

	section.vision { padding: calc((100 / 480)* 100vw) calc((20 / 480)* 100vw) calc((150 / 480)* 100vw); }

	.bg_box {
		width: 100%; border-radius: calc((15 / 480)* 100vw);
		padding: calc((60 / 480)* 100vw) calc((20 / 480)* 100vw);
	}

	.contents_title { font-size: calc((20 / 480)* 100vw); }
	.contents_title.top { margin-top: calc((-120 / 480)* 100vw); }
	.txt_big_en.top { margin-top: calc((-60 / 480)* 100vw); }
	.txt_big_en { font-size: calc((26 / 480)* 100vw); margin-top: calc((40 / 480)* 100vw); letter-spacing: calc((-1 / 480)* 100vw); }
	.txt_big_ko { font-size: calc((18 / 480)* 100vw); margin-top: calc((20 / 480)* 100vw); }

	.bg_box .bg_img { margin-top: calc((20 / 480)* 100vw); }
	.bg_box .bg_img img { max-width: calc((400 / 480)* 100vw); }
	.vision_card { margin-top: calc((60 / 480)* 100vw); }
	.vision_card .vision_card_item {
		width: 100%; 
		border-radius: calc((15 / 480)* 100vw);
		margin-left: calc((0 / 480)* 100vw);
		margin-top: calc((20 / 480)* 100vw);
		padding: calc((40 / 480)* 100vw) 0px;
	}
	.vision_card .vision_card_item .vision_card_title { font-size: calc((18 / 480)* 100vw); }

	.vision_card .vision_card_item .vision_card_bar {
		height: 1px;
		margin-top: calc((20 / 480)* 100vw);
	}
	.vision_card .vision_card_item .vision_card_bar::after {
		left: 50%;
		width: 80%; height: 1px;
		margin-left: -40%;
	}


	.vision_card .vision_card_item .vision_card_desc {
		font-size: calc((16 / 480)* 100vw); 
		margin-top: calc((20 / 480)* 100vw);
	}

	.pvision_img { margin-top: calc((40 / 480)* 100vw); }

	.pvision_img img.img01 { width: 60%; }
	.pvision_img img.img02 { width: 100%; }



}


@media (max-width: 1023px) and (min-width: 750px) { 
	br.pvision_01{ display: block !important; }

	section.vision { padding: calc((100 / 750)* 100vw) calc((30 / 750)* 100vw) calc((150 / 750)* 100vw); }

	.bg_box {
		width: 100%; border-radius: calc((15 / 750)* 100vw);
		padding: calc((80 / 750)* 100vw) calc((30 / 750)* 100vw);
	}



	.contents_title { font-size: calc((26 / 750)* 100vw); }
	.contents_title.top { margin-top: calc((-150 / 750)* 100vw); }
	.txt_big_en.top { margin-top: calc((-90 / 750)* 100vw); }
	.txt_big_en { font-size: calc((36 / 750)* 100vw); margin-top: calc((40 / 750)* 100vw); }
	.txt_big_ko { font-size: calc((20 / 750)* 100vw); margin-top: calc((20 / 750)* 100vw); }

	.bg_box .bg_img { margin-top: calc((20 / 750)* 100vw); }
	.bg_box .bg_img img { max-width: calc((450 / 750)* 100vw); }
	.vision_card { margin-top: calc((90 / 750)* 100vw); }
	.vision_card .vision_card_item {
		width: calc((200 / 750)* 100vw); 
		border-radius: calc((36 / 750)* 100vw);
		margin-left: calc((10 / 750)* 100vw);
		padding: calc((60 / 750)* 100vw) 0px;
	}
	.vision_card .vision_card_item .vision_card_title { font-size: calc((20 / 750)* 100vw); }

	.vision_card .vision_card_item .vision_card_bar {
		height: calc((35 / 750)* 100vw);
		margin-top: calc((15 / 750)* 100vw);
	}



	.vision_card .vision_card_item .vision_card_desc {
		font-size: calc((18 / 750)* 100vw); 
		margin-top: calc((20 / 750)* 100vw);
	}

	.pvision_img { margin-top: calc((40 / 750)* 100vw); }

	.pvision_img img.img01 { width: 60%; }
	.pvision_img img.img02 { width: 100%; }


}

@media (max-width: 1279px) and (min-width: 1024px) { 
	section.vision { padding: calc((100 / 1280)* 100vw) calc((50 / 1024)* 100vw) 200px; }

	.bg_box {
		width: 100%; border-radius: calc((15 / 1280)* 100vw);
		padding: calc((100 / 1280)* 100vw) calc((50 / 1024)* 100vw);
	}



	.contents_title { font-size: calc((36 / 1280)* 100vw); }
	.contents_title.top { margin-top: calc((-150 / 1280)* 100vw); }
	.txt_big_en.top { margin-top: calc((-90 / 1280)* 100vw); }
	.txt_big_en { font-size: calc((46 / 1280)* 100vw); margin-top: calc((60 / 1280)* 100vw); }


	.txt_big_ko {
		font-size: calc((26 / 1280)* 100vw); 
		margin-top: calc((40 / 1280)* 100vw);
	}

	.bg_box .bg_img { margin-top: calc((40 / 1280)* 100vw); }


	.bg_box .bg_img img { max-width: calc((550 / 1280)* 100vw); }
	.vision_card { margin-top: calc((90 / 1280)* 100vw); }
	.vision_card .vision_card_item {
		width: calc((300 / 1280)* 100vw); 
		border-radius: calc((36 / 1280)* 100vw);
		margin-left: calc((20 / 1280)* 100vw);
		padding: calc((90 / 1280)* 100vw) 0px;
	}
	.vision_card .vision_card_item .vision_card_title { font-size: calc((26 / 1280)* 100vw); }

	.vision_card .vision_card_item .vision_card_bar {
		height: calc((40 / 1280)* 100vw);
		margin-top: calc((15 / 1280)* 100vw);
	}



	.vision_card .vision_card_item .vision_card_desc {
		font-size: calc((20 / 1280)* 100vw); 
		margin-top: calc((20 / 1280)* 100vw);
	}

	.pvision_img { margin-top: calc((60 / 1280)* 100vw); }

	.pvision_img img.img01 { width: calc((550 / 1280)* 100vw); }
	.pvision_img img.img02 { width: calc((900 / 1280)* 100vw); }

}

@media (max-width: 1920px) and (min-width: 1280px) { 

}









/*

@media (max-width: 749px) { 


}


@media (max-width: 1023px) and (min-width: 750px) { 

}

@media (max-width: 1279px) and (min-width: 1024px) { 

}

@media (max-width: 1920px) and (min-width: 1280px) { 

}


*/