@charset "utf-8";
/* CSS Document */

#loaderGIF {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 9;
  background: #000014;
}
#ppLoading {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #070707;
  width: 100%;
  height: 100%;
}
#loaderGIF img {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -45px;
}
#ppLoading img {
  position: absolute;
  left: 50%;
  top: 50%;
  margin: -5px 0 0 -45px;
}
#map {
  width: 100%;
  max-width: 830px;
  margin: 30px auto;
  position: relative;
}
#map ul li {
  position: absolute !important;
  line-height: 0 !important;
  cursor: pointer;
}
#map ul li#area01 {
  top: 16.36%;
  left: 59.88%;
  width: 23.13%;
}
#map ul li#area02 {
  top: 22.79%;
  left: 61.69%;
  width: 32.05%;
}
#map ul li#area03 {
  top: 30.62%;
  left: 61.45%;
  width: 24.34%;
}
#map ul li#area04 {
  top: 33.02%;
  left: 23.86%;
  /* width:25.30%; */
  width: 21.68%;
}
#map ul li#area05 {
  top: 36.59%;
  left: 22.6%;
  /* width:24.58%; */
  width: 21.68%;
}
#map ul li#area06 {
  top: 39.84%;
  left: 48.67%;
  width: 21.93%;
}
#map ul li#area07 {
  top: 42.48%;
  left: 12.67%;
  width: 20.48%;
}
#map ul li#area08 {
  top: 46.43%;
  left: 46.51%;
  width: 24.34%;
}
#map ul li#area09 {
  top: 57.44%;
  left: 5.9%;
  width: 24.34%;
}
#map ul li#area10 {
  top: 60.85%;
  left: 39.4%;
  width: 44.34%;
}
#map ul li#area11 {
  top: 68.37%;
  left: 26.51%;
  width: 45.3%;
}
#map ul li#area12 {
  top: 24.87%;
  left: 13.51%;
  width: 39.75%;
}

#areaListText {
  width: 90%;
  max-width: 790px;
  margin: 0 auto 50px;
}
#areaListText li {
  cursor: pointer;
  position: relative;
  width: 25%;
  padding: 0;
  float: left;
  text-align: center;
  margin-bottom: 2em;
  margin-left: -1px;
}
#areaListText li span {
  display: block;
  border-right: #c00000 1px solid;
  border-left: #c00000 1px solid;
}
#areaListText li a {
  color: #000;
}
#areaListText li a:hover {
  color: #c00000;
  text-decoration: underline;
}
html.ie7 #areaListText li,
html.ie8 #areaListText li {
  background: none;
}
#areaListText li img {
  max-height: 40px;
}
#areaListText li img.js-fadeImgON {
  padding-left: 11px;
}
/*#areaListText li#areaText01 img{width:41.66667%;}
#areaListText li#areaText02 img{width:84.02778%;}
#areaListText li#areaText03 img{width:50.46296%;}
#areaListText li#areaText04 img{width:48.14815%;}
#areaListText li#areaText05 img{width:42.36111%;}
#areaListText li#areaText06 img{width:48.61111%;}
#areaListText li#areaText07 img{width:55.47619%;}
#areaListText li#areaText08 img{width:52.77778%;}
#areaListText li#areaText09 img{width:99.30556%;}
#areaListText li#areaText10 img{width:81.125%;}
#areaListText li#areaText11 img{width:72.22222%;}*/

#ppMapWrap {
  z-index: -1;
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.75);
  opacity: 0;
}
html.ie7 #ppMapWrap {
  background: #000;
}
html.ie8 #ppMapWrap {
  background: #000;
}
body.js-noScrolling {
  overflow-y: scroll;
}
body.js-noScrolling #container {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
}
body.js-noScrolling #ppMapWrap {
  z-index: 1;
}
body.js-noScrolling #ppMap {
  z-index: 2;
}
#ppMap {
  position: absolute;
  z-index: 2;
  background: rgba(0, 0, 0, 0.9);
  top: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 100%;
  max-width: 870px;
  text-align: center;
}
html.ie7 #ppMap {
  background: #000;
}
html.ie8 #ppMap {
  background: #000;
}
@media (min-width: 1px) and (max-width: 480px) {
  #areaListText li {
    width: 100%;
  }
}
@media (min-width: 481px) and (max-width: 940px) {
  #areaListText li {
    width: 50%;
  }
}