@charset "utf-8";
/* header */
header .headerBox nav #gnb > li > a{ text-align: center; padding: 0 25px; white-space: nowrap;}
header .headerBox nav #gnb > li .depth2 > li{ max-width:200px; }
header .headerBox nav #gnb > li .depth2 li a{ white-space: wrap;}
header.on .headerBox nav #gnb > li .depth2 > li:not(:last-child){ margin-right: 70px;}

#allMenu .allGnb #gnb > li > a{ font-size: 40px; min-width:auto; max-width: 300px; width: 100%; display: block;}
#allMenu .allGnb #gnb > li .depth3 li a{ white-space:normal; }
#allMenu .leftBox{ width: 20%;}

/* main */ 
/* sub */
#sv #subVisual .txtBox #lnb li{ font-family: var(--Red);}

#history .info.active .title{ width: 100%; }
#history .year .ctnBox .itemBox .inner:hover .circle { transform: scale(350)}

#certi .list .ctnBox .itemBox ul li{ flex-wrap:wrap; }
#certi .list .ctnBox .itemBox ul li span{ width: 100%; }
#certi .list .ctnBox .itemBox figure{ height: 180px;}

#implant .info .ctnBox .itemBox{ height: 200px;}

.need .content .imgBox .iconBox p,
.need .content .ctnBox .itemBox .item .txt{ width: 80%;}

#inno .key .content:not(.type2) .ctnBox .rightBox .itemBox .item .flex{ flex-direction:column; }
#inno .key .content .ctnBox .rightBox .itemBox .item .flex .txt{ margin-right: 0 ; margin-bottom: 10px;}
#inno .info .imgBox .txt{	padding: 0 20px;}

#sfit .advantages .ctnBox ul li{ padding-right: 30px;}

/* footer */
footer .topBox .footerGnb #gnb{ gap:30px; }

@media screen and (max-width:1700px){
	/* common */
	header .headerBox nav{ left: 45% !important;}
	header .headerBox nav #gnb > li .depth2 > li{ max-width:200px; width: 100%; }
	header .headerBox nav #gnb > li .depth2 > li > a,
	header .headerBox nav #gnb > li .depth3 li a{ white-space: normal;}
	header.on .headerBox nav #gnb > li .depth2 > li:not(:last-child){ margin-right: 50px;}

	#allMenu .allGnb #gnb > li > a{ max-width:250px; }
}

@media screen and (max-width:1400px){
	/* common */
	header .headerBox nav #gnb > li > a{ white-space:wrap; }

	/* main */
	main .point .section .txtBox .txt{ width: 90%; margin: 75px auto 40px;}
	main .point .section .txtBox .title br,
	main .point .section .txtBox .txt br{ display:none;}

	/* sub */
	.vision .content .tabBox li{ height: 70px; padding: 0 5px;}
	.vision .content .tabBox li button br{ display:none; }

	.lab .txtBox ul li{ width: calc((100% - 12px) / 2);}
}

@media screen and (max-width:960px){
	/* common */
	#allMenu .leftBox .infoBox li{ width: 100%;}
	#allMenu .leftBox .infoBox li:not(:last-child){ margin-bottom: 30px !important;}

	/* sub */
	#vision .info .ctnBox .itemBox{ height: 300px;}
	#vision .info .ctnBox .itemBox .txt{ margin-top: 20px;}
	.vision .content .tabBox li{ width: calc((100% - 1px) / 2)}

	#certi .list .ctnBox .itemBox ul li span{ max-width:none; }

	#global .content.active .title br{ display:none; }

	.need .content .ctnBox .itemBox .item .txt{ font-size:14px; line-height: 1.3; }

	#inno .key .content .ctnBox .rightBox .tableBox th,
	#inno .key .content .ctnBox .rightBox .tableBox td{ font-size:14px; }
	#inno .info .imgBox .txt{ font-size:17px; line-height: 1.3;}
}