html,body{height:auto}


header {color:#fff}
header.roll {background:#fff}
header:hover {background:#fff;}
header:hover .header .gnb > ul > li > a {color:#333}
header.roll .header .gnb > ul > li > a {color:#333}


header.roll .logo_img {display:block}
header.roll .logo_w {display:none}
header:hover .logo_img {display:block}
header:hover .logo_w {display:none}

.lang {display:flex; gap:20px; }
.lang a {color:#eee}
.lang .ov {border-bottom:2px solid #eee;}
.m_top {display:none}
.roll .lang a {color:#333}
.roll .lang .ov {border-bottom:2px solid #2b8a8e;color:#2b8a8e}
header:hover .lang a{color:#333}
header:hover .lang .ov {border-bottom:2px solid #2b8a8e;color:#2b8a8e}

header h1 {line-height:0}
header h1 .logo_img {display:none} 
header h1 img {width:200px}
 
header {
	width: 100%;
	height: 80px;
	position: sticky;
	top:0;
	border-bottom: 1px solid #bbb;
	z-index:99999;
	transition: 0.4s all;
}
 

header .container {
     width:95%;
	max-width:1700px; 
    margin: 0 auto;  
 }
 

 @media(min-width:960px){

		.header{display:flex; justify-content:space-between; align-items:center}

		.header .gnb > ul {display:flex; width:calc(95vw - 400px); max-width:800px }
		.header .gnb > ul > li {
			width:20%; 
			line-height:80px;
			 
			position: relative;
		}
		.header .gnb > ul > li::after{
			content: "";
			position: absolute;
			left:0;
			bottom: 0;
			width: 100%;
			height: 3px;
			background-color: #2b8a8e;
			transform: scaleX(0);
			transition: all 0.3s;
		}
		.header .gnb > ul > li:hover::after{
			 transform: scaleX(100%);
		}
		.header .gnb > ul > li > a {
			display: block;
			font-size: 18px;
			font-weight: bold;
			text-align: center;
			color:#fff;
		}
		header:hover .header .gnb > ul > li > a {color:#333}
		.header .gnb > ul > li > .submenu {
			position: absolute;
			left: 0;
			top: 80px;
			width: 100%;
			z-index: 10;
			padding-top:15px;
			display: none;
		}
		.header .gnb > ul > li > .submenu  li {line-height:1.2}
 		.header .gnb > ul > li > .submenu > li > a {
			display: block;
			font-size: 16px;
			font-weight: 500;
			text-align: center;
			padding:8px 0;
		}

		#gnbBg {
			width: 100%; 
			min-height:220px;
			backdrop-filter: blur(10px); background:rgba(255, 255, 255, 0.8);
			position: absolute;
 			left: 0;
			top: 80px;
			z-index: 9;
			display: none;

		}


	 
 }

@media(max-width:959px){
		header {
			width: 100%;
			height: 70px;
			position: sticky;
			top:0;
			border-bottom:none; 
			background-color:#fff;
			z-index:99999
	}

     header .container {display:none}
	.m_top {display:flex; align-items:center;  justify-content:space-between; height:70px; width:100%; box-sizing:border-box; padding:0 4%; }
	.m_top a {color:#333}


}


 

footer {font-size:0.9rem; padding:50px 0; box-sizing: border-box;border-top:1px solid #ddd;color:#fff;background:#333}
footer .inner {max-width:1400px}
footer .logo { width:160px; height:59px}
footer .logo img {width:200px}
.footer_head {display:flex;gap:130px;}
.footer_head .info ul {display:flex;gap:22px;margin-bottom:8px;}
.footer_head .info ul:last-child {margin-bottom:0;}
.footer_head .info ul li {display:flex;gap:10px;}
.footer_head p {color:#eee;font-size:1.2em;font-weight:600}
.footer_head span {color:#bbb;font-size:1.2em;font-weight:400}
.footer_head .copyright {margin-top:20px;color:#999;font-weight:300;font-size:1.1em}


@media (max-width:1401px){
		footer .inner {padding:0 4%}

}
@media (max-width:1200px){
 
		footer{padding:30px 0}
		.footer_head {display:block;}
		.footer_head p {font-size:1em}
		.footer_head span {font-size:1em}
		.footer_head .info {margin-top:0;}
		.footer_head .info ul {display:block; margin-bottom:0}
		.footer_head .info ul li {width:100%;margin-bottom:2px;}
		.footer_head .info ul:last-child li {display:block;margin-bottom:0;}
		.footer_head .info p {white-space: nowrap;}
		.footer_head .copyright {font-size:.9em}
}

 
.flex {display:flex}
.inner {width:100%;   margin:0 auto; box-sizing:border-box}

table.basic {width:100%; font-size:15px; }
table.basic th {background-color:#333; border:1px solid #ddd; color:#fff;  padding:8px; font-weight:500}
table.basic td {border:1px solid #ddd; padding:8px}

 
ul.img_list {width:100%; display:flex; flex-wrap:wrap; gap:1.33%}
ul.img_list li {width:24%;}
ul.img_list li:nth-child(n+5) {margin-top:15px}

ul.img_list li img {width:100%}

ul.basic li {width:100%; display:flex}
ul.basic li:before {content:'-'; margin-right:5px}
ul.list_50_ul {display:flex; flex-wrap:wrap}
ul.list_50_ul li {width:50%; margin-right:-1px; margin-bottom:-1px; box-sizing:border-box; padding:10px;  border:1px solid #ddd}

.table_wrap {width:100%; overflow-x:auto; }
.border_box {border:1px solid #ddd; box-sizing:border-box}
.border_box img {width:100%}


a.basic_btn {background-color:#2b8a8e; font-size:1.1rem; box-sizing:border-box; padding:0 20px; width:180px; line-height:55px; color:#fff; border-radius:5px; display:flex; transition: all 0.3s ease-out; }
a.basic_btn:after {content:'→'; margin-left:auto}
 a.basic_btn + a.basic_btn {margin-left:5px}