/* area------------------*/
.mapBox {
  width: 100%;
  height: 415px;
  background: url("/college/images/back_map.png") no-repeat 40% top;
  margin: 0 auto;
  position: relative;
}
.area1, .area2, .area3, .area4, .area5, .area6, .area7 {
  width: 165px;
  /*min-height: 81px;*/
  border: #13b5b1 solid 2px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  padding: 10px 15px 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.area1 {
  position: absolute;
  right: 0;
  top: 0;
}
.area1 h3 {
  font-size: 14px;
  line-height: 1.0em;
  font-weight: bold;
  text-align: center;
  margin-bottom: 15px;
}
.area1 h3 a {
  color: #2ea7e0;
  }
.area2 {
  position: absolute;
  right: 50px;
  top: 140px;
}
.area2 h3 {
  font-size: 14px;
  line-height: 1.0em;
  font-weight: bold;
  text-align: center;
  margin-bottom: 15px;
}
.area2 h3 a{
  color: #46bef5;
  }
.area3 {
  position: absolute;
  right: 70px;
  top: 280px;
}
.area3 h3 {
  font-size: 14px;
  line-height: 1.0em;
  font-weight: bold;
  text-align: center;
  margin-bottom: 15px;
}
.area3 h3 a{
  color: #00ba33;
  }
.area4 {
  position: absolute;
  left: 185px;
  top: 50px;
}
.area4 h3 {
  font-size: 14px;
  line-height: 1.0em;
  font-weight: bold;
  text-align: center;
  margin-bottom: 15px;
}
.area4 h3 a{
  color: #7eb704;
  }
.area5 {
  position: absolute;
  left: calc(50% - 100px);
  bottom: 0;
}
.area5 h3 {
  font-size: 14px;
  line-height: 1.0em;
  font-weight: bold;
  text-align: center;
  margin-bottom: 15px;
}
.area5 h3 a{
  color: #f39800;
  }
.area6 {
  position: absolute;
  left: 0;
  top: 90px;
}
.area6 h3 {
  font-size: 14px;
  line-height: 1.0em;
  font-weight: bold;
  text-align: center;
  margin-bottom: 15px;
}
.area6 h3 a{
  color: #fabd2d;
  }
.area7 {
  position: absolute;
  left: 0;
  bottom: 0;
}
.area7 h3 {
  font-size: 14px;
  line-height: 1.0em;
  font-weight: bold;
  text-align: center;
  margin-bottom: 15px;
}
.area7 h3 a{
  color: #e4686c;
  }
  .area1 h3 a:hover,.area2 h3 a:hover,.area3 h3 a:hover,.area4 h3 a:hover,.area5 h3 a:hover,.area6 h3 a:hover,.area7 h3 a:hover{
  opacity: 0.5;
  }
.mapBox ul {
  display: flex;
  flex-wrap: wrap;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
}
.mapBox ul li {
  margin-bottom: 10px;
}
li.map {
  position: relative;
  background: #FFF;
  border: 2px solid #09F;
  width: 70px;
  height: 46px;
  border-radius: 5px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  cursor: pointer;
}
li.map span {
  width: 70px;
  height: 46px;
  display: table-cell;
  vertical-align: middle;
  line-height: 18px;
  letter-spacing: 0.1em;
  font-size: 18px;
  font-weight: bold;
  color: #09F;
  text-align: center;
}
li.hokkaido {
  position: absolute;
  top: 80px;
  right: 10px;
}
li.kanto {
  position: absolute;
  bottom: 25px;
  right: 15px;
}
li.hokuriku {
  position: absolute;
  right: 140px;
  top: 115px;
}
li.kinki {
  position: absolute;
  left: 160px;
  bottom: 7px;
}
li.chugoku {
  position: absolute;
  left: 75px;
  top: 160px;
}
li.kyusyu {
  position: absolute;
  left: 7px;
  bottom: 48px;
}
li.bottom:after, li.bottom:before {
  top: 100%;
  left: 50%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
}
li.bottom:after {
  border-color: rgba(255, 255, 255, 0);
  border-top-color: #FFF;
  border-width: 7px;
  margin-left: -7px;
}
li.bottom:before {
  border-color: rgba(0, 153, 255, 0);
  border-top-color: #09F;
  border-width: 10px;
  margin-left: -10px;
}
li.top:after, li.top:before {
  bottom: 100%;
  left: 50%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
}
li.top:after {
  border-color: rgba(255, 255, 255, 0);
  border-bottom-color: #FFF;
  border-width: 7px;
  margin-left: -7px;
}
li.top:before {
  border-color: rgba(0, 153, 255, 0);
  border-bottom-color: #09F;
  border-width: 10px;
  margin-left: -10px;
}
li.right:after, li.right:before {
  left: 100%;
  top: 50%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
}
li.right:after {
  border-color: rgba(255, 255, 255, 0);
  border-left-color: #FFF;
  border-width: 7px;
  margin-top: -7px;
}
li.right:before {
  border-color: rgba(0, 153, 255, 0);
  border-left-color: #09F;
  border-width: 10px;
  margin-top: -10px;
}
ul.syousai1 {
  width: 370px;
  height: 330px;
  background-image: url(/images_ver3/map/areaHokkaido.png);
  position: absolute;
  top: -98px;
  left: -105px;
}
ul.syousai1 li, ul.syousai2 li, ul.syousai3 li, ul.syousai4 li, ul.syousai5 li, ul.syousai6 li {
  position: absolute;
  cursor: pointer;
}
.dialogSelect {}
.dialogSelect li {
  width: 73px;
  height: 33px;
  background-color: #FFF;
  border: 2px solid #09F;
  border-radius: 5px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  font-size: 15px;
  font-weight: bold;
  color: #09F;
  text-align: center;
  display: table;
}
.dialogSelect li a {
  display: table-cell;
  vertical-align: middle;
  color: #09F !important;
}
li.a1 {
  top: 70px;
  right: 100px;
}
li.a2 {
  top: 140px;
  right: 100px;
}
li.a3 {
  top: 200px;
  right: 65px;
}
li.a4 {
  top: 245px;
  right: 65px;
}
li.a5 {
  top: 200px;
  left: 92px;
}
li.a6 {
  top: 240px;
  left: 92px;
}
li.a7 {
  bottom: 5px;
  right: 65px;
}
ul.syousai2 {
  width: 370px;
  height: 330px;
  background-image: url(/images_ver3/map/areaKanto.png);
  position: absolute;
  top: -98px;
  left: -105px;
}
li.a8 {
  top: 90px;
  right: 40px;
}
li.a9 {
  top: 70px;
  left: 150px;
}
li.a10 {
  top: 70px;
  left: 60px;
}
li.a11 {
  top: 132px;
  left: 120px;
}
li.a12 {
  top: 200px;
  right: 40px;
}
li.a13 {
  top: 185px;
  left: 130px;
}
li.a14 {
  bottom: 58px;
  left: 130px;
}
ul.syousai3 {
  width: 370px;
  height: 330px;
  background-image: url(/images_ver3/map/areaHokuriku.png);
  position: absolute;
  top: -98px;
  left: -105px;
}
li.a15 {
  top: 40px;
  right: 70px;
}
li.a16 {
  top: 60px;
  left: 110px;
}
li.a17 {
  top: 100px;
  left: 15px;
}
li.a18 {
  top: 160px;
  left: 10px;
}
li.a19 {
  bottom: 80px;
  right: 80px;
}
li.a20 {
  top: 140px;
  right: 110px;
}
li.a21 {
  bottom: 80px;
  left: 70px;
}
li.a22 {
  bottom: 10px;
  right: 60px;
}
li.a23 {
  bottom: 20px;
  left: 80px;
}
ul.syousai4 {
  width: 370px;
  height: 330px;
  background-image: url(/images_ver3/map/areaKinki.png);
  position: absolute;
  top: -98px;
  left: -105px;
}
li.a24 {
  bottom: 70px;
  right: 35px;
}
li.a25 {
  top: 90px;
  right: 45px;
}
li.a26 {
  top: 40px;
  left: 120px;
}
li.a27 {
  top: 180px;
  left: 90px;
}
li.a28 {
  top: 90px;
  left: 60px;
}
li.a29 {
  top: 130px;
  right: 120px;
}
li.a30 {
  bottom: 50px;
  left: 100px;
}
ul.syousai5 {
  width: 370px;
  height: 330px;
  background-image: url(/images_ver3/map/areaChugoku.png);
  position: absolute;
  top: -98px;
  left: -105px;
}
li.a31 {
  top: 50px;
  right: 72px;
}
li.a32 {
  top: 30px;
  left: 120px;
}
li.a33 {
  top: 105px;
  right: 72px;
}
li.a34 {
  top: 130px;
  left: 120px;
}
li.a35 {
  top: 80px;
  left: 30px;
}
li.a36 {
  bottom: 50px;
  right: 50px;
}
li.a37 {
  bottom: 109px;
  right: 60px;
}
li.a38 {
  bottom: 90px;
  left: 50px;
}
li.a39 {
  bottom: 25px;
  left: 150px;
}
ul.syousai6 {
  width: 370px;
  height: 330px;
  background-image: url(/images_ver3/map/areaKyusyu.png);
  position: absolute;
  top: -98px;
  left: -105px;
}
li.a40 {
  top: 20px;
  right: 70px;
}
li.a41 {
  top: 20px;
  right: 155px;
}
li.a42 {
  top: 80px;
  right: 230px;
}
li.a43 {
  top: 170px;
  right: 170px;
}
li.a44 {
  top: 110px;
  right: 20px;
}
li.a45 {
  bottom: 110px;
  right: 35px;
}
li.a46 {
  bottom: 20px;
  left: 110px;
}
li.a47 {
  bottom: 110px;
  left: 10px;
}