@charset "utf-8";


.people {position:relative;}


/* map */
body .map {}
.map .map-tit {margin:0 0 30px; position:relative;}
.map .map-tit h3 {font-size: var(--fontSize10); font-weight: 800; line-height: 140%;}
.map .map-tit p {padding:10px 0 0; font-size: var(--fontSize4); line-height: 140%;}
.map .map-tit .info {
	position:absolute; right:0; bottom:0; line-height:30px; font-size: var(--fontSize4); 
	padding-left:40px; background:url(/images/icon/icon-video.svg)0 50% no-repeat;
}
.map .map-video {position:relative;}
.map .map-video img {}
.map .map-video button {font-size: var(--fontSize4); font-weight:400; line-height:120%; letter-spacing:-.9px; position:absolute;}
.map .map-video button.view {padding:50px 0 0;  background:url(/images/icon/icon-video.svg)center 0 /40px no-repeat;}
.map .map-video button.view:hover {color:var(--sky); background-image:url(/images/icon/icon-video-on.svg);}
.map .map-video button.btn1 {left:5.7%; top:23%;}
.map .map-video button.btn2 {left:88.6%;top:15%;}
.map .map-video button.btn3 {left:88.6%; top:49.3%;}
.map .map-video button.btn4 {left:65%; top:84%;}
.map .map-video button.btn5 {left:90%; top:79%;}
.map .map-video button.btn6 {left:42%; top:32%;}
.map .map-video button.btn7 {left:67%; top:24%;}
.map .map-video button.btn8 {left:38%; top:86%;}
.map .map-video button.btn9 {left:33.5%; top:9%;}
.map .map-video button.btn10 {left:25%; top:36%;}
.map .map-video button.btn11 {left:7.7%; top:77%;}
.map .map-video button.btn12 {left:22.7%; top:92%;}
.map .map-video button.btn13 {left:30%; top:59%;}

.map .map-subTit {padding:70px 0 30px; text-align:center;}
.map .map-subTit h4 {font-size:var(--fontSize9); font-weight: 800; line-height: 100%; color:#000;}
.map .map-subTit p {padding:10px 0 0; font-size:var(--fontSize4); line-height: 100%;}
.map .map-list {display:flex; gap:10px; flex-wrap:wrap; justify-content:center;}
.map .map-list button {
	padding:15px 40px 15px 25px; border-radius:100px; font-size:var(--fontSize4); font-weight:500; line-height:100%;
	background:url(/images/icon/play.svg)calc(100% - 15px) 50% no-repeat; color:#000;border: 1px solid var(--bgcGray3);
}
.map .map-list button:hover { color:#fff; background-color:var(--sky); background-image:url(/images/icon/play-on.svg)}

.map .map-bg {width:100%; height:670px; position:absolute; left:0; bottom:0; z-index:-1; background:var(--bgcGray4);}
 


/* ************************ 태블릿 이하(~1199) ************************ */
@media (max-width: 1024px) {
	
	/* map */
	body .map {}
	.map .map-tit {margin:0 0 20px;}
	.map .map-tit h3 {line-height: 130%;}
	.map .map-tit p {line-height: 130%;}
	
	.map .map-subTit {padding:50px 0 20px;}
	.map .map-list button {padding:12px 35px 12px 20px;}
	
}

/* ************************ 모바일 ************************ */
@media (max-width: 767px) {
	
	/* map */
	body .map {}
	.map .map-tit {margin:0 0 10px}
	.map .map-tit h3 {line-height: 120%;}
	.map .map-tit p {padding:5px 0 0; line-height: 120%;}
	
	.map .map-subTit {padding:40px 0 20px;}
	.map .map-list {gap:5px;}
	.map .map-list button {padding:10px 25px 10px 12px; background-position:calc(100% - 10px) 50%; background-size:10px;}
	
}


