.red{
	color:#e4007f;
}


ul.jp_map {
  position: relative;
  list-style-type: none;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

ul.jp_map a {
  color: #000;
  text-shadow: #fff 2px 0px,
  #fff -2px 0px,
  #fff 0px -2px,
  #fff 0px 2px,
  #fff 2px 2px,
  #fff -2px 2px,
  #fff 2px -2px,
  #fff -2px -2px,
  #fff 1px 2px,
  #fff -1px 2px,
  #fff 1px -2px,
  #fff -1px -2px,
  #fff 2px 1px,
  #fff -2px 1px,
  #fff 2px -1px,
  #fff -2px -1px;
  text-decoration:none;
}

.jp_map li a {
  box-sizing: border-box;
  width: calc(50% - 6px);
  float: left;
  padding: 7px 0;
  border-radius: 10px;
  text-align: center;
  margin: 3px;
}

.jp_map li a:hover {
  text-decoration: none;
}

.jp_map li:nth-child(1) a {
  background-color: #7f7eda;
}

.jp_map li:nth-child(1) a {
  background-color: #7f7eda;
}

.jp_map li:nth-child(2) a {
  background-color: #759ef4;
}

.jp_map li:nth-child(3) a {
  background-color: #759ef4;
}

.jp_map li:nth-child(4) a {
  background-color: #759ef4;
}

.jp_map li:nth-child(5) a {
  background-color: #759ef4;
}

.jp_map li:nth-child(6) a {
  background-color: #759ef4;
}

.jp_map li:nth-child(7) a {
  background-color: #759ef4;
}

.jp_map li:nth-child(8) a {
  background-color: #7ecfea;
}

.jp_map li:nth-child(9) a {
  background-color: #7ecfea;
}

.jp_map li:nth-child(10) a {
  background-color: #7ecfea;
}

.jp_map li:nth-child(11) a {
  background-color: #7ecfea;
}

.jp_map li:nth-child(12) a {
  background-color: #7ecfea;
}

.jp_map li:nth-child(13) a {
  background-color: #7ecfea;
}

.jp_map li:nth-child(14) a {
  background-color: #7ecfea;
}

.jp_map li:nth-child(15) a {
  background-color: #7cdc92;
}

.jp_map li:nth-child(16) a {
  background-color: #7cdc92;
}

.jp_map li:nth-child(17) a {
  background-color: #7cdc92;
}

.jp_map li:nth-child(18) a {
  background-color: #7cdc92;
}

.jp_map li:nth-child(19) a {
  background-color: #7cdc92;
}

.jp_map li:nth-child(20) a {
  height: 20%;
  background-color: #7cdc92;
}

.jp_map li:nth-child(21) a {
  background-color: #7cdc92;
}

.jp_map li:nth-child(22) a {
  background-color: #7cdc92;
}

.jp_map li:nth-child(23) a {
  background-color: #7cdc92;
}

.jp_map li:nth-child(24) a {
  background-color: #ffe966;
}

.jp_map li:nth-child(25) a {
  background-color: #ffe966;
}

.jp_map li:nth-child(26) a {
  background-color: #ffe966;
}

.jp_map li:nth-child(27) a {
  background-color: #ffe966;
}

.jp_map li:nth-child(28) a {
  height: 20%;
  background-color: #ffe966;
}

.jp_map li:nth-child(29) a {
  background-color: #ffe966;
}

.jp_map li:nth-child(30) a {
  background-color: #ffe966;
}

.jp_map li:nth-child(31) a {
  background-color: #ffcc66;
}

.jp_map li:nth-child(32) a {
  background-color: #ffcc66;
}

.jp_map li:nth-child(33) a {
  background-color: #ffcc66;
}

.jp_map li:nth-child(34) a {
  background-color: #ffcc66;
}

.jp_map li:nth-child(35) a {
  background-color: #ffcc66;
}

.jp_map li:nth-child(36) a {
  background-color: #ffbb9c;
}

.jp_map li:nth-child(37) a {
  background-color: #ffbb9c;
}

.jp_map li:nth-child(38) a {
  background-color: #ffbb9c;
}

.jp_map li:nth-child(39) a {
  background-color: #ffbb9c;
}

.jp_map li:nth-child(40) a {
  background-color: #ffbdbd;
}

.jp_map li:nth-child(41) a {
  background-color: #ffbdbd;
}

.jp_map li:nth-child(42) a {
  background-color: #ffbdbd;
}

.jp_map li:nth-child(43) a {
  background-color: #ffbdbd;
}

.jp_map li:nth-child(44) a {
  background-color: #ffbdbd;
}

.jp_map li:nth-child(45) a {
  background-color: #ffbdbd;
}

.jp_map li:nth-child(46) a {
  background-color: #ffbdbd;
}

.jp_map li:nth-child(47) a {
  background-color: #f5c9ff;
}

@media screen and (min-width: 768px) {
  ul.jp_map {
    padding: 84% 0 0;
  }


  .jp_map li a {
    width: 7%;
    height: 10%;
    border: solid #ffffff 2px;
    box-sizing: border-box;
    padding: 7px 0;
    float: none;
    font-size: 14px;
    margin: 0;
  }
  .jp_map li a:hover {
    text-decoration: none;
  }
  .jp_map li:nth-child(1) a {
    position: absolute;
    top: 0;
    left: 85%;
    width: 15%;
    background-color: #7f7eda;
  }

  .jp_map li:nth-child(2) a {
    position: absolute;
    top: 11%;
    left: 85%;
    width: 14%;
    height: 5.5%;
    background-color: #759ef4;

  }

  .jp_map li:nth-child(3) a {
    position: absolute;
    top: 16.5%;
    left: 92%;
    background-color: #759ef4;
  }

  .jp_map li:nth-child(4) a {
    position: absolute;
    top: 26.5%;
    left: 92%;
    background-color: #759ef4;
  }

  .jp_map li:nth-child(5) a {
    position: absolute;
    top: 16.5%;
    left: 85%;
    background-color: #759ef4;
  }

  .jp_map li:nth-child(6) a {
    position: absolute;
    top: 26.5%;
    left: 85%;
    background-color: #759ef4;
  }

  .jp_map li:nth-child(7) a {
    position: absolute;
    top: 36.5%;
    left: 92%;
    background-color: #759ef4;
  }

  .jp_map li:nth-child(8) a {
    position: absolute;
    top: 46.5%;
    left: 92%;
    background-color: #7ecfea;
  }

  .jp_map li:nth-child(9) a {
    position: absolute;
    top: 46.5%;
    left: 85%;
    background-color: #7ecfea;
  }

  .jp_map li:nth-child(10) a {
    position: absolute;
    top: 46.5%;
    left: 78%;
    background-color: #7ecfea;
  }

  .jp_map li:nth-child(11) a {
    position: absolute;
    top: 56.5%;
    left: 85%;
    background-color: #7ecfea;
  }

  .jp_map li:nth-child(12) a {
    position: absolute;
    top: 56.5%;
    left: 92%;
    background-color: #7ecfea;
  }

  .jp_map li:nth-child(13) a {
    left: 85%;
    position: absolute;
    top: 66.5%;
    background-color: #7ecfea;
  }

  .jp_map li:nth-child(14) a {
    left: 78%;
    position: absolute;
    top: 66.5%;
    background-color: #7ecfea;
  }

  .jp_map li:nth-child(15) a {
    position: absolute;
    top: 36.5%;
    left: 78%;
    width: 14%;
    background-color: #7cdc92;
  }

  .jp_map li:nth-child(16) a {
    position: absolute;
    top: 36.5%;
    left: 71%;
    background-color: #7cdc92;
  }

  .jp_map li:nth-child(17) a {
    position: absolute;
    top: 36.5%;
    left: 64%;
    background-color: #7cdc92;
  }

  .jp_map li:nth-child(18) a {
    left: 64%;
    position: absolute;
    top: 46.5%;
    background-color: #7cdc92;
  }

  .jp_map li:nth-child(19) a {
    position: absolute;
    top: 56.5%;
    left: 78%;
    background-color: #7cdc92;
  }

  .jp_map li:nth-child(20) a {
    left: 71%;
    position: absolute;
    top: 46.5%;
    height: 20%;
    background-color: #7cdc92;
  }

  .jp_map li:nth-child(21) a {
    left: 64%;
    position: absolute;
    top: 56.5%;
    background-color: #7cdc92;
  }

  .jp_map li:nth-child(22) a {
    left: 71%;
    position: absolute;
    top: 66.5%;
    background-color: #7cdc92;
  }

  .jp_map li:nth-child(23) a {
    left: 64%;
    position: absolute;
    top: 66.5%;
    background-color: #7cdc92;
  }

  .jp_map li:nth-child(24) a {
    left: 57%;
    position: absolute;
    top: 66.5%;
    background-color: #ffe966;
  }

  .jp_map li:nth-child(25) a {
    left: 57%;
    position: absolute;
    top: 46.5%;
    background-color: #ffe966;
  }

  .jp_map li:nth-child(26) a {
    left: 50%;
    position: absolute;
    top: 46.5%;
    background-color: #ffe966;
  }

  .jp_map li:nth-child(27) a {
    left: 50%;
    position: absolute;
    top: 56.5%;
    background-color: #ffe966;
  }

  .jp_map li:nth-child(28) a {
    left: 43%;
    position: absolute;
    top: 46.5%;
    height: 20%;
    background-color: #ffe966;
  }

  .jp_map li:nth-child(29) a {
    left: 57%;
    position: absolute;
    top: 56.5%;
    background-color: #ffe966;
  }

  .jp_map li:nth-child(30) a {
    left: 50%;
    position: absolute;
    top: 66.5%;
    background-color: #ffe966;
  }

  .jp_map li:nth-child(31) a {
    left: 36%;
    position: absolute;
    top: 46.5%;
    background-color: #ffcc66;
  }

  .jp_map li:nth-child(32) a {
    left: 29%;
    position: absolute;
    top: 46.5%;
    background-color: #ffcc66;
  }

  .jp_map li:nth-child(33) a {
    left: 36%;
    position: absolute;
    top: 56.5%;
    background-color: #ffcc66;
  }

  .jp_map li:nth-child(34) a {
    left: 29%;
    position: absolute;
    top: 56.5%;
    background-color: #ffcc66;
  }

  .jp_map li:nth-child(35) a {
    left: 22%;
    position: absolute;
    top: 51.5%;
    background-color: #ffcc66;
  }

  .jp_map li:nth-child(36) a {
    left: 36%;
    position: absolute;
    top: 78.5%;
    background-color: #ffbb9c;
  }

  .jp_map li:nth-child(37) a {
    left: 36%;
    position: absolute;
    top: 68.5%;
    background-color: #ffbb9c;
  }

  .jp_map li:nth-child(38) a {
    left: 29%;
    position: absolute;
    top: 68.5%;
    background-color: #ffbb9c;
  }

  .jp_map li:nth-child(39) a {
    left: 29%;
    position: absolute;
    top: 78.5%;
    background-color: #ffbb9c;
  }

  .jp_map li:nth-child(40) a {
    left: 14%;
    position: absolute;
    top: 46.5%;
    background-color: #ffbdbd;
  }

  .jp_map li:nth-child(41) a {
    left: 7%;
    position: absolute;
    top: 46.5%;
    background-color: #ffbdbd;
  }

  .jp_map li:nth-child(42) a {
    left: 0;
    position: absolute;
    top: 46.5%;
    background-color: #ffbdbd;
  }

  .jp_map li:nth-child(43) a {
    left: 7%;
    position: absolute;
    top: 56.5%;
    background-color: #ffbdbd;
  }

  .jp_map li:nth-child(44) a {
    left: 14%;
    position: absolute;
    top: 56.5%;
    background-color: #ffbdbd;
  }

  .jp_map li:nth-child(45) a {
    left: 14%;
    position: absolute;
    top: 66.5%;
    background-color: #ffbdbd;
  }

  .jp_map li:nth-child(46) a {
    left: 7%;
    position: absolute;
    top: 66.5%;
    background-color: #ffbdbd;
  }

  .jp_map li:nth-child(47) a {
    left: 0;
    position: absolute;
    top: 76.5%;
    background-color: #f5c9ff;
  }
}








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







#map-wrapper{
	margin:0px 0 0 0;
}

#map-head{
	padding:0px 0 0 0px;
}

/*======================================

	list
	
========================================*/


h3.pref{
	display: inline-block;
	text-align: center;
	font-size: 22x;
	line-height: 28px;
	padding: 16px;
	color: #000;
	font-weight: 500;
	margin: 20px auto 0px auto;
	border: 1px solid #ccc;
    border-radius: 20px;        /* CSS3草案 */  
}

h4.gojuon{
	font-size:22px;
	border-bottom: 1px solid #ccc;
	padding:0 0 4px 6px;
}
a.link-city{
	display: inline-block;
	font-size:16px;
	margin: 0 10px 15px 0;
}


/*======================================

	detail
	
========================================*/


.left-half{
	width:100%;
	float: none;
	text-align: left;
	margin: 0 0 20px 0;
}
.right-half{
	width:100%;
	float: none;
	text-align: left;
}

section{
	margin: 30px 0 30px 0;
}
section table {
	width:100%;
	border-collapse: collapse;
	border-top: 1px solid #ccc;
	font-size: 16px;
}
section table th {
	width:100px;
	margin: 0 0 0px 0;
	padding: 15px;
	border-bottom: 1px solid #ccc;
}
section table td {
	margin: 0 0 0px 0;
	padding: 15px;
	border-bottom: 1px solid #ccc;
}


.ggmap {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px;
height: 0;
overflow: hidden;
}
 
.ggmap iframe,
.ggmap object,
.ggmap embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}


.map-foot{
	margin: 20px auto;
	text-align: center;
}
a.foot-btn{
	display: block;
	width:300px;
	font-size:16px;
	padding:6px 15px 6px 15px;
	margin: 20px auto 20px auto;
}


.note{
	padding:30px;
	background: #fff2f6;
}






}/*//end  max-width: 480px ///////////////////////*/



@media print, screen and (min-width: 481px) {





#map-wrapper{
	margin:-220px 0 0 0;
}

#map-head{
	padding:80px 0 0 30px;
}

/*======================================

	list
	
========================================*/


h3.pref{
	display: inline-block;
	text-align: center;
	font-size: 28px;
	line-height: 28px;
	padding: 16px;
	color: #000;
	font-weight: 500;
	margin: 20px auto 0px auto;
	border: 1px solid #ccc;
    border-radius: 20px;        /* CSS3草案 */  
}

h4.gojuon{
	font-size:22px;
	border-bottom: 1px solid #ccc;
	padding:0 0 4px 6px;
}
a.link-city{
	display: inline-block;
	font-size:16px;
	margin: 0 10px 15px 0;
}


/*======================================

	detail
	
========================================*/


.left-half{
	width:48%;
	float: left;
	text-align: left;
}
.right-half{
	width:48%;
	float: right;
	text-align: left;
}

section{
	margin: 30px 0 30px 0;
}
section table {
	width:100%;
	border-collapse: collapse;
	border-top: 1px solid #ccc;
	font-size: 16px;
}
section table th {
	width:100px;
	margin: 0 0 0px 0;
	padding: 15px;
	border-bottom: 1px solid #ccc;
}
section table td {
	margin: 0 0 0px 0;
	padding: 15px;
	border-bottom: 1px solid #ccc;
}


.ggmap {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px;
height: 0;
overflow: hidden;
}
 
.ggmap iframe,
.ggmap object,
.ggmap embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}


.map-foot{
	margin: 20px auto;
	text-align: center;
}
a.foot-btn{
	display: block;
	width:300px;
	font-size:16px;
	padding:6px 15px 6px 15px;
	margin: 20px auto 20px auto;
}


.note{
	padding:30px;
	background: #fff2f6;
}






}