:root{
	--default-bg : #efefef;
	--default-color : #111;
	--point-bg : #144139;
	--point-color : #fff;
	--max-width : 1408px;
}
.tabs {
	display: flex;
	justify-content: center;
	width: 100%;
	max-width : var(--max-width);
	margin: 0 auto 2em;
}
.tabs li{
	display : flex;
	align-items : center;
	justify-content : center;
	flex : 1;
	text-align: center;
	font-weight: 500;
	padding: 10px 0;
	letter-spacing : -0.04em;
	background : var(--default-bg);
	color: var(--default-color);
	cursor: pointer;
	transition: background .3s, color .3s;
}
.tabs li:hover,
.tabs li.current{
	background:  var(--point-bg); 
	color: var(--point-color); 
}
.tab-area{display: none;}
.tab-area.current{display: block; clear:both;}

/*탭메뉴2*/
.tabs2 {
	display: flex;
	justify-content: center;
	width: 100%;
	max-width : var(--max-width);
	margin: 0 auto 2em;
}
.tabs2 li{
	display : flex;
	align-items : center;
	justify-content : center;
	flex : 1;
	text-align: center;
	font-weight: 500;
	padding: 10px 0;
	letter-spacing : -0.04em;
	background : var(--default-bg);
	color: var(--default-color);
	cursor: pointer;
	transition: background .3s, color .3s;
}
.tabs2 li:hover,
.tabs2 li.current{
	background:  var(--point-bg); 
	color: var(--point-color); 
}
.tab-content{display: none;}
.tab-content.current{display: block; clear:both;}

@media(max-width : 1200px){
	.tabs li, .tabs2 li{font-size : 14px; padding : 7px 0;}
}