body[map="googlemap"] .icon_wrap {
  display: none;
}
.mapSize {
  /**
			 * Viewer styling
			 * @class css.Viewer
			 * @example <div class="viewer"></div>
			 **/
}
.mapSize .mapcover {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-image: url(/images/map/mapThumb.jpg);
  background-size: cover;
  background-position: top;
  background-repeat: no-repeat;
  z-index: 30;
}
.mapSize .informationWrap {
  background-color: #FFF;
  width: 300px;
  height: 495px;
  position: absolute;
  top: 30px;
  left: 30px;
  z-index: 20;
  border-radius: 15px;
  box-shadow: 0px 0px 15px 5px rgba(0, 0, 0, 0.1);
  overflow: hidden;
}
.mapSize .informationWrap .wrap {
  width: 100%;
  overflow: auto;
  height: 445px;
  background-color: transparent;
}
.mapSize .informationWrap .backlist {
  position: absolute;
  width: 30px;
  height: 30px;
  left: 8px;
  text-align: center;
  top: 10px;
  font-size: 20px;
  color: #999;
}
.mapSize .informationWrap .cancel {
  position: absolute;
  right: 10px;
  width: 25px;
  height: 25px;
  text-align: center;
  font-size: 17px;
  line-height: 22px;
  top: 14px;
  color: #555;
  cursor: pointer;
  z-index: 10;
}
.mapSize .informationWrap .thetitle {
  color: #3c6a83;
  font-size: 16px;
  font-weight: 700;
  text-align: center;
  height: 50px;
  line-height: 50px;
  margin-left: 35px;
  margin-right: 35px;
}
.mapSize .informationWrap .warehousephoto {
  width: 100%;
  padding-bottom: 50%;
  background-size: cover;
  background-position: center;
  background-color: #f1f1f1;
}
.mapSize .informationWrap .intro {
  padding: 20px;
  font-size: 15px;
  color: #333;
}
.mapSize .informationWrap .thelist {
  padding: 0;
  text-align: center;
}
.mapSize .informationWrap .thelist li {
  width: 100px;
  height: 130px;
  display: inline-block;
  vertical-align: top;
  margin: 10px;
  margin-top: 0px;
}
.mapSize .informationWrap .thelist li .thephoto {
  width: 100px;
  height: 100px;
  background-color: #e9e9e9;
  background-size: cover;
  background-position: center;
  border-radius: 10px;
  border: 1px solid #e9e9e9;
  cursor: pointer;
}
.mapSize .informationWrap .thelist li .thephoto:hover {
  opacity: 0.8;
}
.mapSize .informationWrap .thelist li .thephoto .in {
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
  border-radius: 10px;
}
.mapSize .informationWrap .thelist li .thename {
  font-size: 12px;
  text-align: center;
  margin-top: 7px;
  color: #3c6a83;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.mapSize .informationWrap .eventWrap .thephoto {
  background-position: center;
  height: 160px;
  background-size: cover;
  background-repeat: no-repeat;
  background-color: #e9e9e9;
}
.mapSize .informationWrap .eventWrap .theintro {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 5;
  color: #3c6a83;
  font-size: 13px;
  padding: 20px;
  height: 95px;
  line-height: 23px;
  overflow: hidden;
  padding-top: 0;
  margin-bottom: 15px;
}
.mapSize .informationWrap .eventWrap .thedate {
  font-size: 14px;
  line-height: 30px;
  padding-left: 50px;
  color: #3c6a83;
  margin-top: 15px;
}
.mapSize .informationWrap .eventWrap .thedate i {
  position: absolute;
  left: 25px;
  top: 10px;
}
.mapSize .informationWrap .eventWrap .theplace {
  font-size: 14px;
  line-height: 30px;
  padding-left: 50px;
  color: #3c6a83;
  margin-bottom: 15px;
}
.mapSize .informationWrap .eventWrap .theplace i {
  position: absolute;
  left: 25px;
  top: 10px;
}
.mapSize .informationWrap .eventWrap .btnWrap {
  text-align: center;
  margin-top: 10px;
}
.mapSize .informationWrap .eventWrap .btnWrap img {
  height: 40px;
  margin: 5px;
}
.mapSize .informationWrap .eventWrap .btn {
  margin: auto;
  border: 2px solid #e9e9e9;
  height: 35px;
  line-height: 35px;
  text-align: center;
  border-radius: 50px;
  width: 150px;
  margin-top: 10px;
  font-size: 14px;
  color: #3c6a83;
  cursor: pointer;
}
.mapSize .informationWrap .storeWrap .thephoto {
  background-position: center;
  height: 160px;
  background-size: cover;
  background-repeat: no-repeat;
  background-color: #e9e9e9;
}
.mapSize .informationWrap .storeWrap .theintro {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 5;
  color: #3c6a83;
  font-size: 13px;
  padding: 20px;
  height: 122px;
  line-height: 23px;
  overflow: hidden;
  padding-top: 0px;
}
.mapSize .informationWrap .storeWrap .btnWrap {
  text-align: center;
  margin-top: 10px;
}
.mapSize .informationWrap .storeWrap .btnWrap img {
  height: 40px;
  margin: 5px;
}
.mapSize .informationWrap .storeWrap .btn {
  margin: auto;
  border: 2px solid #e9e9e9;
  height: 35px;
  line-height: 35px;
  text-align: center;
  border-radius: 50px;
  width: 150px;
  margin-top: 10px;
  font-size: 14px;
  color: #3c6a83;
  cursor: pointer;
}
.mapSize.fullsize {
  position: fixed;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  z-index: 1000;
}
.mapSize.fullsize .viewer {
  height: 100vh;
}
.mapSize.fullsize .area {
  height: 100vh;
}
.mapSize .area {
  background-color: #FFF;
  width: 100%;
  height: 550px;
  top: 0px;
  overflow: hidden;
}
.mapSize .fullsizeBtn {
  position: absolute;
  right: 220px;
  width: 43px;
  height: 43px;
  z-index: 10;
  top: 20px;
  background-color: #FFF;
  border-radius: 10px;
  text-align: center;
  line-height: 43px;
  box-shadow: 0 0 15px 5px rgba(0, 0, 0, 0.1);
  cursor: pointer;
  color: #555;
  font-size: 17px;
}
.mapSize .fullsizeBtn.active {
  background-color: #3c6a83;
  color: #FFF;
}
.mapSize .icon_wrap {
  position: absolute;
  top: 45px;
  left: 30px;
  z-index: 10;
  background-color: rgba(255, 255, 255, 0);
  padding: 20px;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
}
.mapSize .icon_wrap:hover {
  background-color: rgba(255, 255, 255, 0.8);
}
.mapSize .icon_wrap li {
  margin-bottom: 10px;
}
.mapSize .icon_wrap li .icon {
  background-image: url(/images/map/information.png);
  width: 30px;
  height: 30px;
  background-size: contain;
  position: absolute;
}
.mapSize .icon_wrap li .icon[type="park"] {
  background-image: url(/images/map/park.png);
}
.mapSize .icon_wrap li .icon[type="toilet"] {
  background-image: url(/images/map/toilet.png);
}
.mapSize .icon_wrap li .icon[type="baby"] {
  background-image: url(/images/map/baby.png);
}
.mapSize .icon_wrap li .icon[type="mrt"] {
  background-image: url(/images/map/mrt.png);
}
.mapSize .icon_wrap li .icon[type="lightrail"] {
  background-image: url(/images/map/lightrail.png);
}
.mapSize .icon_wrap li .icon[type="information"] {
  background-image: url(/images/map/information.png);
}
.mapSize .icon_wrap li .icon[type="bee"] {
  background-image: url(/images/map/bee.png);
}
.mapSize .icon_wrap li .icon[type="culture"] {
  background-image: url(/images/map/culture.png);
}
.mapSize .icon_wrap li .icon[type="restaurant"] {
  background-image: url(/images/map/restaurant.png);
}
.mapSize .icon_wrap li .icon[type="coffee"] {
  background-image: url(/images/map/coffee.png);
}
.mapSize .icon_wrap li .text {
  color: #333;
  font-size: 14px;
  margin-left: 40px;
}
.mapSize .icon_wrap li .textEn {
  margin-left: 40px;
  font-size: 12px;
}
.mapSize .mode {
  position: absolute;
  right: 20px;
  top: 20px;
  background-color: #FFF;
  z-index: 10;
  border-radius: 10px;
  box-shadow: 0px 0px 15px 5px rgba(0, 0, 0, 0.1);
  overflow: hidden;
}
.mapSize .mode li {
  display: inline-block;
  padding: 0px;
  padding-left: 30px;
  padding-right: 30px;
  cursor: pointer;
  color: #999;
  font-size: 14px;
  height: 45px;
  line-height: 45px;
  vertical-align: middle;
}
.mapSize .mode li img {
  height: 30px;
  display: inline-block;
  line-height: 45px;
  vertical-align: middle;
  margin-bottom: 5px;
}
.mapSize .mode li:hover {
  color: #111;
}
.mapSize .mode li.active {
  background-color: #3c6a83;
  color: #FFF;
}
.mapSize .mode li:nth-child(1) {
  border-right: 1px solid #e9e9e9;
}
.mapSize .wrap {
  background-color: #e9e9e9;
  position: relative;
  height: 100%;
}
.mapSize .mapIn {
  height: 100%;
}
.mapSize .mapIn .mapArea {
  -webkit-overflow-scrolling: touch;
  background-color: #a0d1c9;
}
.mapSize .mapIn .mapImg {
  width: 3300px;
  height: 1500px;
  background-image: url(/images/map/map.jpg?2);
  background-size: 3317px 1527px;
  background-position: top;
  background-repeat: no-repeat;
}
.mapSize .mapIn .itemArea {
  position: absolute;
  width: 3300px;
  height: 1500px;
  z-index: 1;
  top: 0px;
  left: 0px;
  overflow: hidden;
}
.mapSize .mapIn .itemArea li {
  background-size: 90%;
  background-repeat: no-repeat;
  background-position: center;
  position: absolute;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
}
.mapSize .mapIn .itemArea li.active {
  transform: scale(1.1);
}
.mapSize .mapIn .itemArea li.active .marker {
  background-image: url(/images/map/marker_active.png) !important;
}
.mapSize .mapIn .itemArea li.active .marker.text {
  background: none !important;
  background-color: #aa1919 !important;
}
.mapSize .mapIn .itemArea li.active .marker.text:after {
  border-color: #aa1919 transparent transparent transparent !important;
}
.mapSize .mapIn .itemArea li.icon:hover {
  transform: scale(1.3);
}
.mapSize .mapIn .itemArea li.item:hover {
  margin-top: -10px;
}
.mapSize .mapIn .itemArea li.item:hover .marker {
  transform: scale(1.1);
  margin-top: -2px;
}
.mapSize .mapIn .itemArea li[warehouse="1"] .marker {
  background-image: url(/images/map/marker1.png);
}
.mapSize .mapIn .itemArea li[warehouse="1"] .marker.text {
  background: none;
  background-color: #f26555;
  width: auto;
  border-radius: 5px;
  height: 33px;
  display: inline-block;
  top: 1px;
  padding-left: 10px;
  padding-right: 10px;
  font-size: 13px;
}
.mapSize .mapIn .itemArea li[warehouse="1"] .marker.text:after {
  content: '';
  height: 0px;
  position: absolute;
  bottom: -15px;
  margin-left: -8px;
  left: 50%;
  border-color: #f26555 transparent transparent transparent;
  border-style: solid solid solid solid;
  border-width: 8px;
}
.mapSize .mapIn .itemArea li[warehouse="2"] .marker {
  background-image: url(/images/map/marker2.png);
}
.mapSize .mapIn .itemArea li[warehouse="2"] .marker.text {
  background: none;
  background-color: #6e86b3;
  width: auto;
  border-radius: 5px;
  height: 33px;
  display: inline-block;
  top: 1px;
  padding-left: 10px;
  padding-right: 10px;
  font-size: 13px;
}
.mapSize .mapIn .itemArea li[warehouse="2"] .marker.text:after {
  content: '';
  height: 0px;
  position: absolute;
  bottom: -15px;
  margin-left: -8px;
  left: 50%;
  border-color: #6e86b3 transparent transparent transparent;
  border-style: solid solid solid solid;
  border-width: 8px;
}
.mapSize .mapIn .itemArea li[warehouse="3"] .marker {
  background-image: url(/images/map/marker3.png);
}
.mapSize .mapIn .itemArea li[warehouse="3"] .marker.text {
  background: none;
  background-color: #38673d;
  width: auto;
  border-radius: 5px;
  height: 33px;
  display: inline-block;
  top: 1px;
  padding-left: 10px;
  padding-right: 10px;
  font-size: 13px;
}
.mapSize .mapIn .itemArea li[warehouse="3"] .marker.text:after {
  content: '';
  height: 0px;
  position: absolute;
  bottom: -15px;
  margin-left: -8px;
  left: 50%;
  border-color: #38673d transparent transparent transparent;
  border-style: solid solid solid solid;
  border-width: 8px;
}
.mapSize .mapIn .itemArea li[type="c6"] {
  background-image: url(/images/map/c6.png);
  width: 275px;
  height: 75px;
  background-size: 100%;
  transform: rotate(29deg);
  z-index: 5;
}
.mapSize .mapIn .itemArea li[type="c6"] .marker {
  transform: rotate(-29deg);
  margin-left: 30px;
  top: -30px;
}
.mapSize .mapIn .itemArea li[type="c6"]:hover .marker {
  transform: rotate(-29deg) scale(1.1);
}
.mapSize .mapIn .itemArea li[type="c7"] {
  background-image: url(/images/map/c6.png);
  width: 275px;
  height: 75px;
  background-size: 100%;
  transform: rotate(29deg);
  z-index: 5;
}
.mapSize .mapIn .itemArea li[type="c7"] .marker {
  transform: rotate(-29deg);
  margin-left: 30px;
  top: -30px;
}
.mapSize .mapIn .itemArea li[type="c7"]:hover .marker {
  transform: rotate(-29deg) scale(1.1);
}
.mapSize .mapIn .itemArea li[type="c8"] {
  background-image: url(/images/map/c6.png);
  width: 275px;
  height: 75px;
  background-size: 100%;
  transform: rotate(29deg);
  z-index: 5;
}
.mapSize .mapIn .itemArea li[type="c8"] .marker {
  transform: rotate(-29deg);
  margin-left: 30px;
  top: -30px;
}
.mapSize .mapIn .itemArea li[type="c8"]:hover .marker {
  transform: rotate(-29deg) scale(1.1);
}
.mapSize .mapIn .itemArea li[type="c9"] {
  background-image: url(/images/map/c6.png);
  width: 275px;
  height: 75px;
  background-size: 100%;
  transform: rotate(29deg);
  z-index: 5;
}
.mapSize .mapIn .itemArea li[type="c9"] .marker {
  transform: rotate(-29deg);
  margin-left: 30px;
  top: -30px;
}
.mapSize .mapIn .itemArea li[type="c9"]:hover .marker {
  transform: rotate(-29deg) scale(1.1);
}
.mapSize .mapIn .itemArea li[type="c10"] {
  background-image: url(/images/map/c10.png);
  width: 275px;
  height: 75px;
  background-size: 100%;
  transform: rotate(29deg);
  z-index: 5;
}
.mapSize .mapIn .itemArea li[type="c10"] .marker {
  transform: rotate(-29deg);
  margin-left: 30px;
  top: -30px;
}
.mapSize .mapIn .itemArea li[type="c10"]:hover .marker {
  transform: rotate(-29deg) scale(1.1);
}
.mapSize .mapIn .itemArea li[type="c11"] {
  background-image: url(/images/map/c11.png);
  width: 257px;
  height: 75px;
  background-size: 100%;
  transform: rotate(29deg);
  z-index: 5;
}
.mapSize .mapIn .itemArea li[type="c11"] .marker {
  transform: rotate(-29deg);
  margin-left: 30px;
  top: -30px;
}
.mapSize .mapIn .itemArea li[type="c11"]:hover .marker {
  transform: rotate(-29deg) scale(1.1);
}
.mapSize .mapIn .itemArea li[type="bike"] {
  background-image: url(/images/map/bike.png?2);
  width: 160px;
  height: 102px;
  background-size: 100%;
}
.mapSize .mapIn .itemArea li[type="tower"] {
  background-image: url(/images/map/tower.png);
  width: 170px;
  height: 175px;
  background-size: 100%;
}
.mapSize .mapIn .itemArea li[type="bridge"] {
  background-image: url(/images/map/bridge.png);
  width: 271px;
  height: 165px;
  top: 457px;
  left: 2832px;
  background-size: 100%;
  z-index: 4;
}
.mapSize .mapIn .itemArea li[type="b3"],
.mapSize .mapIn .itemArea li[type="b4"] {
  background-image: url(/images/map/house08.png);
  width: 247px;
  height: 68px;
  background-size: 95%;
  transform: rotate(-15deg);
}
.mapSize .mapIn .itemArea li[type="b3"] .marker,
.mapSize .mapIn .itemArea li[type="b4"] .marker {
  background-image: url(/images/map/marker3.png);
  transform: rotate(14deg);
  left: 55%;
  top: -34px;
}
.mapSize .mapIn .itemArea li[type="b3"]:hover .marker,
.mapSize .mapIn .itemArea li[type="b4"]:hover .marker {
  transform: rotate(14deg) scale(1.1);
}
.mapSize .mapIn .itemArea li[type="c1c2"] {
  background-image: url(/images/map/c1c2.png);
  width: 135px;
  height: 68px;
  background-size: 95%;
  transform: rotate(-15deg);
}
.mapSize .mapIn .itemArea li[type="c1c2"] .marker {
  transform: rotate(14deg);
  left: 34%;
  top: -15px !important;
}
.mapSize .mapIn .itemArea li[type="c1c2"]:hover .marker {
  transform: rotate(14deg) scale(1.1);
}
.mapSize .mapIn .itemArea li[type="house01"] {
  background-image: url(/images/map/house01.png);
  width: 178px;
  height: 120px;
  background-size: 160px;
}
.mapSize .mapIn .itemArea li[type="house02"] {
  background-image: url(/images/map/house02.png);
  width: 287px;
  height: 170px;
  background-size: 257px;
}
.mapSize .mapIn .itemArea li[type="house03"] {
  background-image: url(/images/map/house03.png);
  width: 140px;
  height: 103px;
  background-size: 132px;
}
.mapSize .mapIn .itemArea li[type="house04"] {
  background-image: url(/images/map/house04.png);
  width: 140px;
  height: 103px;
  background-size: 132px;
}
.mapSize .mapIn .itemArea li[type="house05"] {
  background-image: url(/images/map/house05.png);
  width: 242px;
  height: 150px;
  background-size: 90%;
  background-position: center;
}
.mapSize .mapIn .itemArea li[type="b7b8"] {
  background-image: url(/images/map/b7b8.png);
  width: 175px;
  height: 68px;
  background-size: 95%;
  transform: rotate(-15deg);
}
.mapSize .mapIn .itemArea li[type="b7b8"] .marker.text {
  background: 0 0;
  background-color: #38673d;
  width: auto;
  border-radius: 5px;
  height: 33px;
  display: inline-block;
  top: -16px;
  left: 89px;
  padding-left: 10px;
  padding-right: 10px;
  font-size: 13px;
  transform: rotate(14deg);
}
.mapSize .mapIn .itemArea li[type="b7b8"]:hover .marker {
  transform: rotate(14deg) scale(1.1);
}
.mapSize .mapIn .itemArea li[type="house06"] {
  background-image: url(/images/map/house06.png);
  width: 105px;
  height: 80px;
  background-size: 90%;
}
.mapSize .mapIn .itemArea li[type="house07"] {
  background-image: url(/images/map/house07.png?1);
  width: 105px;
  height: 80px;
  background-size: 90%;
}
.mapSize .mapIn .itemArea li[type="house08"] {
  background-image: url(/images/map/house08.png);
  width: 247px;
  height: 68px;
  background-size: 95%;
  transform: rotate(-15deg);
}
.mapSize .mapIn .itemArea li[type="house08"] .marker {
  background-image: url(/images/map/marker2.png);
  transform: rotate(14deg);
  left: 34%;
  top: -34px;
}
.mapSize .mapIn .itemArea li[type="house08"]:hover .marker {
  transform: rotate(14deg) scale(1.1);
}
.mapSize .mapIn .itemArea li[type="house09"] {
  background-image: url(/images/map/house09.png);
  width: 130px;
  height: 85px;
  background-size: 90%;
}
.mapSize .mapIn .itemArea li[type="house10"] {
  background-image: url(/images/map/house10.png);
  width: 197px;
  height: 80px;
  background-size: 90%;
  transform: rotate(-17deg);
}
.mapSize .mapIn .itemArea li[type="house10"] .marker {
  transform: rotate(17deg);
}
.mapSize .mapIn .itemArea li[type="house10"]:hover .marker {
  transform: rotate(17deg) scale(1.1);
}
.mapSize .mapIn .itemArea li[type="house11"] {
  background-image: url(/images/map/house11.png?1);
  width: 130px;
  height: 85px;
  background-size: 90%;
}
.mapSize .mapIn .itemArea li[type="house12"] {
  background-image: url(/images/map/house12.png);
  width: 113px;
  height: 96px;
  background-size: 90%;
}
.mapSize .mapIn .itemArea li[type="house13"] {
  background-image: url(/images/map/house13.png);
  width: 225px;
  height: 137px;
  background-size: 90%;
}
.mapSize .mapIn .itemArea li[type="house14"] {
  background-image: url(/images/map/house14.png);
  width: 105px;
  height: 80px;
  background-size: 90%;
}
.mapSize .mapIn .itemArea li[type="dayipark"] {
  width: 376px;
  height: 470px;
  background-size: 100%;
  transform: rotate(-54deg);
  top: 943px;
  left: 365px;
  z-index: 3;
}
.mapSize .mapIn .itemArea li[type="dayipark"] .marker.text {
  transform: rotate(54deg);
  margin-left: 100px;
  top: 161px;
  left: 115px;
}
.mapSize .mapIn .itemArea li[type="dayipark"]:hover .marker {
  transform: rotate(54deg) scale(1.1);
}
.mapSize .mapIn .itemArea li[type="dayicorridor"] {
  width: 427px;
  height: 57px;
  background-size: 100%;
  transform: rotate(-18deg);
  top: 809px;
  left: 507px;
  z-index: 2;
}
.mapSize .mapIn .itemArea li[type="dayicorridor"] .marker {
  transform: rotate(17deg);
  margin-left: 0px;
  top: -17px;
}
.mapSize .mapIn .itemArea li[type="dayicorridor"]:hover .marker {
  transform: rotate(17deg) scale(1.1);
}
.mapSize .mapIn .itemArea li[type="penglaiart"] {
  width: 359px;
  height: 22px;
  background-size: 100%;
  transform: rotate(-16deg);
  top: 419px;
  left: 1673px;
  z-index: 11;
}
.mapSize .mapIn .itemArea li[type="penglaiart"] .marker.text {
  transform: rotate(17deg);
  margin-left: 0;
  top: -17px;
}
.mapSize .mapIn .itemArea li[type="penglaiart"]:hover .marker {
  transform: rotate(17deg) scale(1.1);
}
.mapSize .mapIn .itemArea li[type="dayongart"] {
  width: 359px;
  height: 22px;
  background-size: 100%;
  transform: rotate(-16deg);
  top: 648px;
  left: 1548px;
  z-index: 11;
}
.mapSize .mapIn .itemArea li[type="dayongart"] .marker.text {
  transform: rotate(17deg);
  margin-left: 0;
  top: -25px;
}
.mapSize .mapIn .itemArea li[type="dayongart"]:hover .marker {
  transform: rotate(17deg) scale(1.1);
}
.mapSize .mapIn .itemArea li[type="poyuroad"] {
  width: 296px;
  height: 55px;
  background-size: 100%;
  transform: rotate(-16deg);
  top: 650px;
  left: 1062px;
  z-index: 6;
}
.mapSize .mapIn .itemArea li[type="poyuroad"] .marker {
  transform: rotate(17deg);
  margin-left: 0;
  top: -21px;
}
.mapSize .mapIn .itemArea li[type="poyuroad"]:hover .marker {
  transform: rotate(17deg) scale(1.1);
}
.mapSize .mapIn .itemArea li[type=railwaypark] {
  width: 250px;
  height: 150px;
  background-size: 100%;
  transform: rotate(27deg);
  top: 323px;
  left: 2467px;
  z-index: 3;
}
.mapSize .mapIn .itemArea li[type=railwaypark] .marker.text {
  transform: rotate(-29deg);
  margin-left: -46px;
  top: 60px;
  right: -34px;
}
.mapSize .mapIn .itemArea li[type=railwaypark]:hover .marker {
  transform: rotate(-29deg) scale(1.1);
}
.mapSize .mapIn .itemArea li[type="park"] {
  background-image: url(/images/map/park.png);
  width: 30px;
  height: 30px;
  background-size: contain;
}
.mapSize .mapIn .itemArea li[type="toilet"] {
  background-image: url(/images/map/toilet.png);
  width: 30px;
  height: 30px;
  background-size: contain;
}
.mapSize .mapIn .itemArea li[type="baby"] {
  background-image: url(/images/map/baby.png);
  width: 30px;
  height: 30px;
  background-size: contain;
}
.mapSize .mapIn .itemArea li[type="mrt"] {
  background-image: url(/images/map/mrt.png);
  width: 30px;
  height: 30px;
  background-size: contain;
}
.mapSize .mapIn .itemArea li[type="lightrail"] {
  background-image: url(/images/map/lightrail.png);
  width: 30px;
  height: 30px;
  background-size: contain;
}
.mapSize .mapIn .itemArea li[type="information"] {
  background-image: url(/images/map/information.png);
  width: 30px;
  height: 30px;
  background-size: contain;
}
.mapSize .mapIn .itemArea li[type="bee"] {
  background-image: url(/images/map/bee.png);
  width: 150px;
  height: 229px;
  background-size: contain;
}
.mapSize .mapIn .itemArea li[type="worker"] {
  background-image: url(/images/map/worker.png?1);
  width: 121px;
  height: 153px;
  background-size: contain;
  border-top-right-radius: 130px;
}
.mapSize .mapIn .itemArea li[type="culture"] {
  background-image: url(/images/map/culture.png);
  width: 30px;
  height: 30px;
  background-size: contain;
}
.mapSize .mapIn .itemArea li[type="restaurant"] {
  background-image: url(/images/map/restaurant.png);
  width: 30px;
  height: 30px;
  background-size: contain;
}
.mapSize .mapIn .itemArea li[type="coffee"] {
  background-image: url(/images/map/coffee.png);
  width: 30px;
  height: 30px;
  background-size: contain;
}
.mapSize .mapIn .itemArea .marker {
  background-image: url(/images/map/marker.png);
  width: 40px;
  left: 50%;
  margin-left: -20px;
  top: -29px;
  background-position: center;
  height: 60px;
  background-size: 90%;
  color: #FFF;
  text-align: center;
  line-height: 35px;
  font-weight: 500;
  font-size: 15px;
  letter-spacing: 0;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
}
.mapSize .mapIn .mrt0 {
  width: 63px;
  background-size: cover;
  position: absolute;
}
.mapSize .mapIn .ship01 {
  width: 200px;
  top: 130px;
  left: 500px;
  position: absolute;
  -webkit-animation: ship01 40s infinite;
  -moz-animation: ship01 40s infinite;
  animation: ship01 40s infinite;
}
@-webkit-keyframes ship01 {
  0% {
    top: 180px;
    left: 300px;
    opacity: 0;
  }
  10% {
    top: 180px;
    left: 300px;
    opacity: 1;
  }
  90% {
    top: 80px;
    left: 660px;
    opacity: 1;
  }
  100% {
    top: 80px;
    left: 660px;
    opacity: 0;
  }
}
@-moz-keyframes ship01 {
  0% {
    top: 180px;
    left: 300px;
    opacity: 0;
  }
  10% {
    top: 180px;
    left: 300px;
    opacity: 1;
  }
  90% {
    top: 80px;
    left: 660px;
    opacity: 1;
  }
  100% {
    top: 80px;
    left: 660px;
    opacity: 0;
  }
}
@keyframes ship01 {
  0% {
    top: 180px;
    left: 300px;
    opacity: 0;
  }
  10% {
    top: 180px;
    left: 300px;
    opacity: 1;
  }
  90% {
    top: 80px;
    left: 660px;
    opacity: 1;
  }
  100% {
    top: 80px;
    left: 660px;
    opacity: 0;
  }
}
.mapSize .mapIn .cloud01 {
  width: 200px;
  top: 400px;
  left: 1000px;
  position: absolute;
  opacity: 0.9;
  -webkit-animation: cloud01 60s infinite;
  -moz-animation: cloud01 60s infinite;
  animation: cloud01 60s infinite;
}
@-webkit-keyframes cloud01 {
  0% {
    top: 400px;
    left: 1000px;
  }
  100% {
    top: 250px;
    left: 1400px;
  }
}
@-moz-keyframes cloud01 {
  0% {
    top: 400px;
    left: 1000px;
  }
  100% {
    top: 250px;
    left: 1400px;
  }
}
@keyframes cloud01 {
  0% {
    top: 400px;
    left: 1000px;
  }
  100% {
    top: 250px;
    left: 1400px;
  }
}
.mapSize .mapIn .cloud02 {
  width: 150px;
  top: 220px;
  left: 200px;
  position: absolute;
  opacity: 0.9;
  -webkit-animation: cloud02 100s infinite;
  -moz-animation: cloud02 100s infinite;
  animation: cloud02 100s infinite;
}
@-webkit-keyframes cloud02 {
  0% {
    top: 180px;
    left: 200px;
  }
  100% {
    top: -40px;
    left: 900px;
  }
}
@-moz-keyframes cloud02 {
  0% {
    top: 180px;
    left: 200px;
  }
  100% {
    top: -40px;
    left: 900px;
  }
}
@keyframes cloud02 {
  0% {
    top: 180px;
    left: 200px;
  }
  100% {
    top: -40px;
    left: 900px;
  }
}
.mapSize .mapIn .cloud03 {
  width: 120px;
  top: 410px;
  left: 0px;
  position: absolute;
  opacity: 0.9;
  -webkit-animation: cloud03 160s infinite;
  -moz-animation: cloud03 160s infinite;
  animation: cloud03 160s infinite;
}
@-webkit-keyframes cloud03 {
  0% {
    top: 410px;
    left: 0px;
  }
  100% {
    top: 120px;
    left: 1000px;
  }
}
@-moz-keyframes cloud03 {
  0% {
    top: 410px;
    left: 0px;
  }
  100% {
    top: 120px;
    left: 1000px;
  }
}
@keyframes cloud03 {
  0% {
    top: 410px;
    left: 0px;
  }
  100% {
    top: 120px;
    left: 1000px;
  }
}
.mapSize .mapIn .train {
  width: 180px;
  top: 865px;
  left: 545px;
  position: absolute;
  opacity: 0.9;
  z-index: 2;
  -webkit-animation: train 50s infinite;
  -moz-animation: train 50s infinite;
  animation: train 50s infinite;
}
@-webkit-keyframes train {
  0% {
    top: 865px;
    left: 545px;
  }
  50% {
    top: 501px;
    left: 1751px;
  }
  100% {
    top: 865px;
    left: 545px;
  }
}
@-moz-keyframes train {
  0% {
    top: 865px;
    left: 545px;
  }
  50% {
    top: 501px;
    left: 1751px;
  }
  100% {
    top: 865px;
    left: 545px;
  }
}
@keyframes train {
  0% {
    top: 865px;
    left: 545px;
  }
  50% {
    top: 501px;
    left: 1751px;
  }
  100% {
    top: 865px;
    left: 545px;
  }
}
.mapSize .viewer {
  width: 100%;
  height: 600px;
  height: 700px;
  height: 550px;
  overflow: scroll;
}
.mapSize .viewer::-webkit-scrollbar {
  width: 0px;
  height: 0px;
}
.mapSize .no-select {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  cursor: move;
  cursor: -moz-grab;
  cursor: -webkit-grab;
}
.mapSize .no-select:active {
  cursor: move;
  cursor: -moz-grabbing;
  cursor: -webkit-grabbing;
}
.gm-style div {
  color: #1b9a9a !important;
  text-shadow: -1px 0 #FFF, 0 1px #FFF, 1px 0 #FFF, 0 -1px #FFF;
}
@media screen and (max-width: 1280px) {
  section.list .wrap h2 {
    text-align: center !important;
  }
  .mapSize .informationWrap {
    width: calc(100% - 60px);
    height: 460px;
    top: 80px;
    left: 30px;
    z-index: 30;
  }
  .mapSize .mode li {
    padding-left: 20px;
    padding-right: 20px;
  }
  .mapSize .fullsizeBtn {
    right: 180px;
  }
  .mapSize.fullsize .informationWrap {
    width: calc(100% - 60px);
    height: calc(100vh - 160px);
    top: 85px;
    border-radius: 8px;
  }
  .mapSize .informationWrap .thelist li {
    width: 28vw;
  }
  .mapSize .informationWrap .thelist li .thephoto {
    width: 27vw;
    height: 27vw;
  }
  .mapSize .informationWrap .wrap {
    height: 410px;
  }
  .mapSize .area {
    height: 615px;
  }
  .mapSize .icon_wrap {
    display: none;
  }
  .mapSize .informationWrap .storeWrap .theintro {
    height: 100px;
  }
  .mapSize .informationWrap .eventWrap .theintro {
    height: 100px;
  }
  .mapIn .mapArea {
    height: auto;
  }
  .mapIn .mapImg {
    -webkit-transform-origin: top left;
    transform-origin: top left;
    transform: scale(0.7, 0.7);
  }
  .mapIn .itemArea {
    -webkit-transform-origin: top left;
    transform-origin: top left;
    transform: scale(0.7, 0.7);
  }
  .mapSize .mapIn .mapImg {
    margin-right: -990px;
    margin-bottom: -450px;
  }
}