.map_wrap {
    border:1px solid #fff;
    display:flex;
	width:100%;
}
.map_container {
    width: calc(100% - 350px);
}
.map_legende {
    background-color:#fff;
    box-sizing:border-box;
    width:350px;
    padding:10px;
}
.map_legende .legend_group_item {
    width:100%;
    display:flex;
}
.map_legende ul.group_list > li {
    margin-bottom:15px;
}
.map_legende .legend_group_item .legend_group_item_icon {
    width:32px;
    height:40px;
    overflow:hidden;
}
.map_legende .legend_group_item .legend_group_item_icon img {
    height:24px;
    margin-top:7px;
}
.map_legende .legend_group_item .legend_group_item_text {
    font-weight:bold;
    width:calc(100% - 40px);
    line-height:40px;
}

.map_legende .legend_item {
    display:flex;
    font-size:13px;
}
.map_legende .legend_item .legend_item_number {
    width:24px;
    height:20px;
    line-height:20px;
    text-align:center;
    color:#fff;
}
.map_legende .legend_item .legend_item_text {
    width:calc(100% - 24px);
    line-height:20px;
    padding-left:8px;
}


.group_list, .legend_list {
    list-style:none;
    margin:0;
    padding:0;
}

#mapid {
    width:100%;
    margin:0 auto;
    height:924px;
    background-color:#fff;
}
.popup_wrap .popup_title {
    font-weight:bold;
    font-size:20px;
    margin-bottom:5px;
}
.popup_wrap .popup_image a {
    width:300px;
    height:150px;
    display:inline-block;
    background-position: center;
    background-size: cover;
    border:1px solid #ccc;
    margin-bottom:5px;
}
.popup_wrap .popup_content {
    text-align:justify;
}
.map_title {
    text-align: center;
    font-size: 32px;
    font-weight: bold;
    background-color: #eee;
    height:150px;
    line-height:150px;
    box-sizing:border-box;
}
.map_marker_wrap {
    display:flex;
}
.map_marker_hide {
    display:none;
}
.map_marker_left {
    width:70%;
    padding:5px;
    box-sizing:border-box;
}
.map_marker_left h4 {
    padding:0;
    margin: 5px 0;
    font-size:20px;
}
.map_marker_right {
    width:30%;
}
.map_marker_right a {
    display:inline-block;
    background-position: center;
    background-size: cover;
    width:100%;
    height:150px;
}


@media only screen and (max-width: 1080px) {

    .map_container { width:100%; }
    .map_legende { display:none }


}    

@-webkit-keyframes leaflet-gestures-fadein {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }

@keyframes leaflet-gestures-fadein {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }

.leaflet-container:after {
  -webkit-animation: leaflet-gestures-fadein 0.8s backwards;
          animation: leaflet-gestures-fadein 0.8s backwards;
  color: #fff;
  font-family: "Roboto", Arial, sans-serif;
  font-size: 22px;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 15px;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  z-index: 461;
  pointer-events: none; }

.leaflet-gesture-handling-touch-warning:after,
.leaflet-gesture-handling-scroll-warning:after {
  -webkit-animation: leaflet-gestures-fadein 0.8s forwards;
          animation: leaflet-gestures-fadein 0.8s forwards; }

.leaflet-gesture-handling-touch-warning:after {
  content: attr(data-gesture-handling-touch-content); }

.leaflet-gesture-handling-scroll-warning:after {
  content: attr(data-gesture-handling-scroll-content); }