@charset "utf-8";
@import url(style.css);

.locMain {
  position: relative;
}
.locMain .pm {
  display: none;
}
.locMain .mainVisual {
  position: relative;
  max-width: 1920px;
  margin-left: auto;
  margin-right: auto;
}
.locMain .mainVisual .mainBox {
  width: 100%;
  min-width: 980px;
  overflow: hidden;
  position: relative;
  height: 971px;
}
.locMain .mainVisual .mainBox img {
  position: absolute;
  left: 50%;
  margin-left: -960px;
}
.imgText {
  position: absolute;
  bottom: 0;
  right: 0;
}
.locMain .locText {
  position: absolute;
  top: 0;
  left: 0;
}
.locMain h2 img {
  border-bottom: 4px solid #000!important;
}
.locMain .text {
  font-size: 17px;
  font-weight: bold;
  line-height: 1.7em;
  color: #000;
  letter-spacing: 1px;
  width: 66%;
  text-align: center;
}
.locMain .titleSub {
  font-size: 22px;
  width: 80%;
}
.locMap .text {
  font-size: 17px;
  line-height: 1.7em;
  color: #fff;
  letter-spacing: 1px;
  width: 90%;
  margin-left: auto;
  margin-right: auto;
}
#map {
  width: 980px;
  height: 620px;
}
.locImg li {
  float: left;
  width: 33.3333%;
  margin-top: 20px;
}
/* prot// */
#mapArea{
  position: relative;
}
.point{
  position: absolute;
}
.point:hover{
  cursor:pointer;
}
#p01{ top: 541px; left: 203px; }
#p02{ top: 563px; left: 148px; }
#p03{ top: 597px; left: 418px; }
#p04{ top: 720px; left: 595px; }
#p05{ top: 210px; left: 569px; }
#p06{ top: 230px; left: 661px; }
#p07{ top: 836px; left: 369px; }
#p08{ top: 568px; left: 84px; }
#p09{ top: 553px; left: 355px; }
#p10{ top: 668px; left: 380px; }
#p11{ top: 757px; left: 774px; }
#p12{ top: 170px; left: 653px; }
#p13{ top: 263px; left: 552px; }
#p14{ top: 289px; left: 434px; }
#p15{ top: 675px; left: 659px; }
#p16{ top: 217px; left: 718px; }
#p17{ top: 741px; left: 145px; }
#p18{ top: 224px; left: 482px; }
#p19{ top: 112px; left: 462px; }
#p20{ top: 431px; left: 323px; }
#p21{ top: 382px; left: 611px; }
#p22{ top: 664px; left: 796px; }
#p23{ top: 640px; left: 697px; }

.tooltip{
  position: absolute;
  display: none;
}
#tc01{ top: 424px; left: 80px; }
#tc02{ top: 448px; left: 34px; }
#tc03{ top: 661px; left: 306px; }
#tc04{ top: 601px; left: 476px; }
#tc05{ top: 97px; left: 470px; }
#tc06{ top: 84px; left: 549px; }
#tc07{ top: 721px; left: 245px; }
#tc08{ top: 637px; left: 106px; }
#tc09{ top: 626px; left: 249px; }
#tc10{ top: 525px; left: 275px; }
#tc11{ top: 633px; left: 650px; }
#tc12{ top: 54px; left: 539px; }
#tc13{ top: 115px; left: 451px; }
#tc14{ top: 266px; left: 131px; }
#tc15{ top: 634px; left: 356px; }
#tc16{ top: 194px; left: 419px; }
#tc17{ top: 622px; left: 45px; }
#tc18{ top: 104px; left: 371px; }
#tc19{ top: 145px; left: 166px; }
#tc20{ top: 303px; left: 211px; }
#tc21{ top: 264px; left: 501px; }
#tc22{ top: 731px; left: 680px; }
#tc23{ top: 705px; left: 587px; }
/* //prot */

.mapTxtBox .floatLeft{
  width: 37%;
}
.mapTxtBox .ws{
  width: 26%;
}
.mapTxtBox dl{
  font-size: 13px;
}
.mapTxtBox dt{
  float: left;
  width:60%;
}
.mapTxtBox .ws dt{
  width:50%;
}
.mapTxtBox dd{
  float: left;
  width:40%;
}
.mapTxtBox .ws dd{
  width:50%;
}



@media screen and (min-width:641px) and (max-width:1366px) {
  /* .locMain .pc {
    display: none;
  }
  .locMain .pm {
    display: block;
  } */
  .locMain .mainVisual {
    min-width: 980px;
    width:100%;
  }
  .locMain .mainVisual .mainBox {
    width: 100%;
    height: 764px;
  }
  .locMain .mainVisual .mainBox img {
    margin-left: -683px;
  }
}
@media screen and (max-width:640px) {
  .locMain .mainVisual {
    min-width: 312px;
  }
  .locMain .mainVisual .mainBox {
    min-width: initial;
    overflow: visible;
    position: static;
    height: auto;
  }
  .locMain .mainVisual .mainBox img {
    position: static;
    margin-left: 0;
    width: 100%;
  }
  .locMain .text {
    font-size: 17px;
    width: 83%;
    color: #444;
  }
  .locMain .titleSub {
    font-size: 15px;
    width: 95%;
  }
  .text {
    width: 83%;
    margin-left: auto;
    margin-right: auto;
  }
  .locMain .spWhite{
    color:#fff;
  }
  #map {
    width: 100%;
    height: 400px;
  }
  #map iframe {
    width: 100%;
    height: 400px;
  }
  .locImg li {
    width: 50%;
    padding: 1%;
    box-sizing: border-box;
  }
  .locImg li img {
    width: 100%;
  }
  .caption {
    width: 96%;
  }

  #protMap{
    width:100%;
  }
  .point{
    width:8%;
  }
  .point img{
    width:67%;
  }
  #p01{ top: 60.5%; left: 21%; }
  #p02{ top: 62.5%; left: 15%; }
  #p03{ top: 67%; left: 42.5%; }
  #p04{ top: 81%; left: 60.5%; }
  #p05{ top: 23%; left: 58%; }
  #p06{ top: 26%; left: 67.5%; }
  #p07{ top: 93.5%; left: 37.5%; }
  #p08{ top: 63%; left: 8%; }
  #p09{ top: 62%; left: 36.5%; }
  #p10{ top: 75%; left: 39%; }
  #p11{ top: 85%; left: 79%; }
  #p12{ top: 19%; left: 66.5%; }
  #p13{ top: 29%; left: 56%; }
  #p14{ top: 32%; left: 44%; }
  #p15{ top: 76%; left: 67%; }
  #p16{ top: 24%; left: 73%; }
  #p17{ top: 83%; left: 15%; }
  #p18{ top: 25%; left: 49%; }
  #p19{ top: 12%; left: 47%; }
  #p20{ top: 48%; left: 33%; }
  #p21{ top: 43%; left: 62.5%; }
  #p22{ top: 74%; left: 81%; }
  #p23{ top: 71%; left: 71%; }

  .mapTxtBox .floatLeft{
    width: 95%;
    float: none;
    margin-left: auto;
    margin-right: auto;
  }
  .mapTxtBox .ws dt{
    width:60%;
  }
  .mapTxtBox .ws dd{
    width:40%;
  }
}