.flex{display:flex;}
.main_con *{color:#333;}
.main_c{color:var(--main_c)}

.in{max-width:1500px; margin:0 auto;}
.main_con {    }
.main_con h3{font-size:3em; margin-bottom:30px;}
.main_con h4{font-size:2.5em; margin-bottom:30px; font-weight:400;}
.main_con p{font-size:1.2em;}
.main_con img{width:100%;}

@media (max-width: 1310px) { 
	.in{padding:0 3%; box-sizing:border-box;}
}

#main section{height:100vh; display:flex; flex-direction: column; justify-content: center; box-sizing:border-box; background-blend-mode:multiply; padding-top:80px; background:url(/common/img/vi.png) center / cover no-repeat, rgba(0,0,0,.7) }
#main section .in{max-width:1500px; margin:0 auto; width:100%;}
#main h3{font-weight:400;  line-height:1.4; margin-bottom:30px;}
#main h3 span{color:var(--main_f);  font-size:1.3em;}
#main h3 p{color:var(--main_f); font-size:2.8em; font-weight:600;}
#main h3 b{color:rgba(255,255,255,.9); font-weight:800;}
#main .tag{display:flex; gap:10px; margin: 0 0 20px 0; flex-wrap: wrap;}
#main .tag span{background-color:var(--main_c); padding:15px 30px; box-sizing:border-box; color:rgb(255 255 255 / 80%); border-radius:50px; letter-spacing: 0;}

#main .wrap{width:100%; display:flex; gap:10px;} 
#main .wrap .left{width:50%;  line-height:1.3; padding:35px; box-sizing:border-box; border-radius:10px; background:url(/common/img/main_img.png) right bottom / 55% no-repeat; height:450px; background-color:rgba(255,255,255,1); line-height:1.6;  color:#333; border-left:8px solid var(--main_c)}
#main .wrap .left strong{font-size:2.6em; display:inline-block; margin-bottom:15px; font-weight:700; }
#main .wrap .left b{color:var(--main_c); font-weight:900; border-bottom:4px solid var(--main_c); box-sizing:border-box;}
#main .wrap .left li{margin-bottom:8px; display:flex; align-items:center; gap:5px; font-size:1.3em;}
#main .wrap .left span{margin-right:4px; font-family: 'GyeonggiMillenniumTitle'; background:#f6a936; color:#fff; font-size:.9em; border-radius:50%; flex-shrink:0; width: 40px; height: 40px; line-height: 40px; text-align: center;}

#main .wrap .right{display:flex; gap:10px; flex-wrap:wrap; width:50%}
#main .wrap .right li{background:rgba(255,255,255,.2); padding:40px; box-sizing:border-box; width:calc(50% - 5px); font-size:2em; border-radius:10px; position:relative; background-position:0 0; background-size:cover; background-blend-mode:multiply; background-repeat:no-repeat;}
#main .wrap .right li:nth-child(1){background-image:url(/common/img/main_img1.png); background-color:rgba(0,0,0,.2);}
#main .wrap .right li:nth-child(2){background-image:url(/common/img/main_img2.png); background-color:rgba(0,0,0,.3);}
#main .wrap .right li:nth-child(3){background-image:url(/common/img/main_img3.png); background-color:rgba(0,0,0,.2);}
#main .wrap .right li:nth-child(4){background-image:url(/common/img/main_img4.png); background-color:rgba(0,0,0,.2);}
#main .wrap .right li h4{color:rgba(255,255,255,.95); font-weight:700;    }
#main .wrap .right li:hover{background-color:#00307f; cursor:pointer;}
#main .wrap .right i{color:var(--main_f); display:none; position:absolute; bottom:30px; right:30px; font-size:1.5em;}
#main .wrap .right li:hover i{display:inline-block;}

@media screen and (max-width:900px) {
	#main section{padding:100px 0 60px 0;}
	#main .wrap{flex-direction:column;}
	#main section{height:auto;}
	#main .tag{display:none;}
	#main h3{font-size:.9em; margin-bottom:20px; }
	#main h3 p{font-size:1.7em; margin-top:5px; color:#fff;}
	#main h3 span{color:#fff;}
	#main .wrap .left{width:100%; padding:20px; background-size:60%}
	#main .wrap .right{width:100%;}
	#main .wrap .left strong{font-size:1.8em; line-height:1.3;}
	#main .wrap .left span{width:35px; height:35px; line-height:35px;}
	#main .wrap .left li{font-size:1em;}
	#main .wrap .right li{min-height: 180px; font-size:1.3em; padding: 25px;  background-position:center;  background-color:rgba(0,0,0,.3) !important;}
}

footer{font-size:1em; padding:60px 0;box-sizing: border-box; font-weight:400; background:#333; }
footer .in{ display:flex; justify-content:space-between; align-items:start;}
footer *{color:#999;  letter-spacing:0;}
footer img{height:40px;}
footer .info{line-height:1.5;}
footer p{margin-top:10px;}

@media screen and (max-width:900px) {
	footer{padding:30px 0; font-size:.9em;}
	footer .in{flex-direction:column; gap:10px; padding:0 3%;}
	footer .titbox{flex-direction:column; gap:10px;}
}