#map {
	width: 100%;
	position: relative;
}
#map img {
	width: 100%;
	padding: 0;
}
#map > div {
	position: absolute;
}
#map > div svg {
	position: relative;
	z-index: 1;
	width: 100%;
	height: 100%;
}
#map > div svg path {
	fill: transparent;
	stroke: #da4f1f;
	stroke-width: 3;
	stroke-linejoin: round;
}
#map > div svg text {
	fill: #da4f1f;
	stroke-width: 0;
	font-family: "Microsoft JhengHei";
	font-weight: bold;
	font-size: 20px;
	text-anchor: middle;
}
#map > div svg a:hover path {
	opacity: 0;
	-moz-transition: 0.5s;
	-o-transition: 0.5s;
	-webkit-transition: 0.5s;
	transition: 0.5s;
}
#map .svg-zone {
	display: inline-block;
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	color: #2b2b2b;
	font-weight: bold;
	font-size: 20px;
}
#map .svg-zone span {
	display: inline-block;
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	border-radius: 50%;
	white-space: nowrap;
	text-align: center;
	text-shadow:0 0 3px #fff;
	width: 100px;
	height: 100px;
	top: 50%;
    left: 50%;
    margin-top: -50px;
    margin-left: -50px;
}

#map .svg-zone span.hover {
	
	color: #FFF;
	-moz-transition: 0.5s;
	-o-transition: 0.5s;
	-webkit-transition: 0.5s;
	transition: 0.5s;
	text-shadow:0 0 0px #fff;
	background: #da4f1f;
}

#A2 {
	top: 1.5%;
	left: 61%;
	width: 26%;
	height: 17%;
}

#A3-1 {
	top: 21%;
	left: 72%;
	width: 13%;
	height: 33%;
}

#A3-2 {
	top: 21%;
	left: 65%;
	width: 10%;
	height: 39%;
}

#A6-1 {
	top: 67%;
    left: 64.5%;
	width: 11%;
	height: 27%;
}

#A6-2 {
	top: 65%;
    left: 53%;
	width: 14%;
	height: 30%;
}

#A6-3 {
	top: 65%;
    left: 40%;
	width: 12%;
	height: 30%;
}

#A6-4 {
	top: 69%;
    left: 23%;
	width: 19%;
	height: 24%;
}
@media (max-width: 992px){
	#map .svg-zone span{
		font-size: 1vw;
		width: 40px;
		height: 40px;
		margin-top: -20px;
   		margin-left: -20px;
	}
	#map .svg-zone span.hover {
		width: 40px;
		height: 40px;
	}
}