@charset "utf-8";

/*
body {
  overflow: hidden;
}
*/

.svg_fg_logo {
    display: block;
    margin: 0 auto 10px;
    width: 45%;
}

.area_p {
    position: absolute;
    top: 5%;
    width: 100%;
    text-align: center;
    font-size: .75em;
    transition: .3s;
    color: #333;
}

ul.area li {
  color: #fff;
}

ul.area li h3 {
  line-height: 3em;
  background: #6f819d;
  border-bottom: 1px solid #ffffff;
  text-align: center;
  font-size: 1.125rem;
}

ul.pref li h4 {
  position: relative;
  line-height: 2.5em;
  background: #6e9c9d;
  border-bottom: 1px solid #ffffff;
  text-align: center;
  font-size: 1.125rem;
}

ul.pref li h4::before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 10px;
  width: 10px;
  height: 10px;
  margin: auto;
  content: "";
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  -webkit-transform: translatey(-25%) rotate(135deg);
  transform: translatey(-25%) rotate(135deg);
  transition: .3s;
}

ul.pref li h4.open::before {
  -webkit-transform: translatey(25%) rotate(-45deg);
  transform: translatey(25%) rotate(-45deg);
}

ul.pref li > ul {
  display: none;
}

ul.shop li {
  border-bottom: 1px solid #6f819d;
}

ul.shop li h5 {
  position: relative;
  padding-left: 35px;
  line-height: 2.5em;
  font-size: 1.125rem;
  color: #6f819d;
}

ul.shop li h5::before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 10px;
  width: 10px;
  height: 10px;
  margin: auto;
  content: "";
  border-top: 2px solid #6f819d;
  border-right: 2px solid #6f819d;
  -webkit-transform: translatey(-25%) rotate(135deg);
  transform: translatey(-25%) rotate(135deg);
  transition: .3s;
}

ul.shop li h5.open::before {
  -webkit-transform: translatey(25%) rotate(-45deg);
  transform: translatey(25%) rotate(-45deg);
}

ul.shop li h5::after {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 10px;
  width: 5em;
  height: 2em;
  padding: 0 .75em;
  line-height: 2em;
  margin: auto;
  background: #6f819d;
  border-radius: .5em;
  content: "詳細を見る";
  text-align: center;
  font-size: .625rem;
  color: #fff;
}

ul.shop li h5.open::after {
  content: "閉じる";
}

ul.shop li > div {
  display: none;
  padding: 10px;
  font-size: .75rem;
  color: #000;
}

.flex {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-around;
  justify-content: space-around;
}

.address {
  margin-bottom: 10px;
}

.shop_flex1 > div {
  width: 50%;
}

.shop_flex1  h6 {
  margin-bottom: 5px;
  font-size: .9375rem;
}

.shop_flex1 p {
  margin-bottom: 10px;
  line-height: 1.5em;
}

.shop_flex2 {
  margin-bottom: 10px;
}

.shop_flex2 > div {
  width: 25%;
  text-align: center;
  font-size: .625rem;
}

.shop_flex2 > div a {
  text-decoration: none;
  color: #000;
}

.shop_flex2 > div a img {
  display: block;
  margin-bottom: 1em;
  width: 100%;
}

.area_map {
  background:#fff;
  width: 100%;
  margin: auto;
  position: relative;
}

.area_map img.z {
  width: 100%;
  opacity: 0;
}

.area_img img {
  position: absolute;
  transition: .3s;
}

.area_img .svg_other {top:47.8%;left:24.8%;width:52.473%;}
.area_img .svg_hokkaido {top:14%;left:77.8%;width:19.032%;}
.area_img .svg_touhoku {top:32.1%;left:77.8%;width:16.022%;}
.area_img .svg_kanto {top:53.22%;left:71.2%;width:22.688%;}
.area_img .svg_chubu {top:53.22%;left:57.85%;width:19.355%;}
.area_img .svg_kinki {top:58.3%;left:44.6%;width:19.355%;}
.area_img .svg_kyushu {top:62.8%;left:3.3%;width:19.355%;}
.area_img .svg_okinawa {top:80.5%;left:3.3%;width:6.129%;}

.area_img img.sel {
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%,-50%) scale(3);
  transform: translate(-50%,-50%) scale(3);
}

.area_img img.del {
  opacity: 0;
  -webkit-transform: translatey(50px);
  transform: translatey(50px);
}

.area_cap a {
  position: absolute;
  display: block;
  width: 8em;
  padding: 1.5%;
  -webkit-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);
  cursor: pointer;
  text-align: center;
  font-size: .6em;
  font-weight: bold;
  color: #fff;
  transition: .3s;
}

.area_cap.del a {
  opacity: 0;
  -webkit-transform: translatey(50px);
  transform: translatey(50px);
}

.area_cap .svg_hokkaido {top:21.5%;left:87.5%;text-shadow: 1px 1px 2px #1765b1, -1px 1px 2px #1765b1, 1px -1px 2px #1765b1, -1px -1px 2px #1765b1;}
.area_cap .svg_touhoku {top:42%;left:86%;text-shadow: 1px 1px 2px #6dbad6, -1px 1px 2px #6dbad6, 1px -1px 2px #6dbad6, -1px -1px 2px #6dbad6;}
.area_cap .svg_kanto {top:63%;left:82.5%;text-shadow: 1px 1px 2px #75ac2c, -1px 1px 2px #75ac2c, 1px -1px 2px #75ac2c, -1px -1px 2px #75ac2c;}
.area_cap .svg_chubu {top:68%;left:68%;text-shadow: 1px 1px 2px #e782b1, -1px 1px 2px #e782b1, 1px -1px 2px #e782b1, -1px -1px 2px #e782b1;}
.area_cap .svg_kinki {top:63.5%;left:51.5%;text-shadow: 1px 1px 2px #f1891c, -1px 1px 2px #f1891c, 1px -1px 2px #f1891c, -1px -1px 2px #f1891c;}
.area_cap .svg_kyushu {top:70.5%;left:13%;text-shadow: 1px 1px 2px #e5514d, -1px 1px 2px #e5514d, 1px -1px 2px #e5514d, -1px -1px 2px #e5514d;}
.area_cap .svg_okinawa {top:82.85%;left:9.5%;text-shadow: 1px 1px 2px #e31812, -1px 1px 2px #e31812, 1px -1px 2px #e31812, -1px -1px 2px #e31812;}

.pref_cap div {
  display: none;
}

.pref_cap div.sel {
  display: block;
}

.pref_cap div a {
  position: absolute;
  display: block;
  width: 8em;
  padding: 1.5%;
  -webkit-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);
  cursor: pointer;
  text-align: center;
  text-decoration: none;
  font-size: .75em;
  font-weight: bold;
  color: #fff;
  transition: .3s;
}

.pref_cap .svg_hokkaido a {text-shadow: 1px 1px 0 #1765b1, -1px 1px 0 #1765b1, 1px -1px 0 #1765b1, -1px -1px 0 #1765b1;}
.pref_cap .svg_touhoku a {text-shadow: 1px 1px 0 #6dbad6, -1px 1px 0 #6dbad6, 1px -1px 0 #6dbad6, -1px -1px 0 #6dbad6;}
.pref_cap .svg_kanto a {text-shadow: 1px 1px 0 #75ac2c, -1px 1px 0 #75ac2c, 1px -1px 0 #75ac2c, -1px -1px 0 #75ac2c;}
.pref_cap .svg_chubu a {text-shadow: 1px 1px 0 #e782b1, -1px 1px 0 #e782b1, 1px -1px 0 #e782b1, -1px -1px 0 #e782b1;}
.pref_cap .svg_kinki a {text-shadow: 1px 1px 0 #f1891c, -1px 1px 0 #f1891c, 1px -1px 0 #f1891c, -1px -1px 0 #f1891c;}
.pref_cap .svg_kyushu a {text-shadow: 1px 1px 0 #e5514d, -1px 1px 0 #e5514d, 1px -1px 0 #e5514d, -1px -1px 0 #e5514d;}
.pref_cap .svg_okinawa a {text-shadow: 1px 1px 0 #e31812, -1px 1px 0 #e31812, 1px -1px 0 #e31812, -1px -1px 0 #e31812;}

.pref_cap .pref1 {top:50%;left:50%;}
.pref_cap .pref6 {top:58%;left:41%;}
.pref_cap .pref4 {top:58%;left:65.5%;}
.pref_cap .pref7 {top:73%;left:51%;}
.pref_cap .pref13 {top:57.5%;left:51%;}
.pref_cap .pref14 {top:73%;left:51%;}
.pref_cap .pref11 {top:42%;left:51%;}
.pref_cap .pref8 {top:42%;left:75.5%;}
.pref_cap .pref9 {top:26%;left:75.5%;}
.pref_cap .pref10 {top:26%;left:51%;}
.pref_cap .pref17 {top:34%;left:25%;}
.pref_cap .pref23 {top:57.5%;left:50%;}
.pref_cap .pref21 {top:57.5%;left:31%;}
.pref_cap .pref22 {top:73%;left:70.5%;}
.pref_cap .pref27 {top:50%;left:31%;}
.pref_cap .pref28 {top:35%;left:31%;}
.pref_cap .pref40 {top:35%;left:50%;}
.pref_cap .pref42 {top:50%;left:30%;}
.pref_cap .pref41 {top:35%;left:30%;}
.pref_cap .pref46 {top:66%;left:41%;}
.pref_cap .pref47 {top:50%;left:50%;}

.back {
  display: none;
  position: absolute;
  bottom: 10px;
  right: 10px;
  font-size: .6em;
}
