@charset "utf-8";

/*  PC to SP */
/*========= レイアウト ===============*/

.location {
    width: 100%;
    margin: 0 auto;
  background-color: #F4F4F4;
  padding: 155px 0;
}
.location .location-inner .location-title {
  font-family: 'line';
  font-size: 42px;
  letter-spacing: 0.04em;
  line-height: 1.2;
  text-align: center;
  margin: 0 auto 75px;
  position: relative;
  z-index: 10;
}
.location .location-inner .location-title:before,
.location .location-inner .location-title:after {
  display: block;
  content: '';
  width: min(24.81vw ,360px);
  height: 1px;
  background-color: #2E2E2E;
  position: absolute;
  top: 22px;
}
.location .location-inner .location-title:before {
  left: 0;
}
.location .location-inner .location-title:after {
  right: 0;
}
.location .location-inner .location-title span {
  display: block;
  font-size: 20px;
  letter-spacing: 0.04em;
  line-height: 1.2;
  margin: 25px 0 0;
}
.location .location-inner .location-catch {
    font-size: 16px;
    letter-spacing: 0.3em;
    line-height: 2.8;
  text-align: center;
  margin: 0 0 85px;
}
.location .location-inner .location-map {
  margin: 0 0 95px;
  position: relative;
}
.location .location-inner .location-map:before {
  display: block;
  content: '';
  width: 100vw;
  height: 197px;
  background-color: #dfdfdf;
  position: absolute;
  top: 250px;
  left: 50%;
  margin: 0 0 0 -50vw;
  z-index: 1;
}
.location .location-inner .location-map figure {
  display: block;
  width: 700px;
  height: 700px;
  margin: 0 auto 15px;
  position: relative;
}
.location .location-inner .location-map figure:before {
  display: block;
  content: '';
  width: 900px;
  height: 500px;
  background-color: #cccccc;
  position: absolute;
  top: 100px;
  left: -95px;
  z-index: 5;
}
.location .location-inner .location-map figure img {
  width: 100%;
  height: auto;
  border: 1px solid #2E2E2E;
  position: relative;
  z-index: 10;
}
.location .location-inner .location-map .root {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  width: 700px;
  margin: 0 auto;
}
.location .location-inner .location-map .root .root-keikyu {
  font-size: 10px;
  letter-spacing: 0.04em;
  line-height: 1.2;
  margin: 0 90px 0 0;
  position: relative;
}
.location .location-inner .location-map .root .root-keikyu:before {
  display: block;
  content: '';
  width: 54px;
  height: 6px;
  background: url('../images/location/root-keikyu.svg') no-repeat;
  background-size: 100% 100%;
  position: absolute;
  top: 4px;
  left: -62px;
}
.location .location-inner .location-map .root .root-jr {
  font-size: 10px;
  letter-spacing: 0.04em;
  line-height: 1.2;
  position: relative;
}
.location .location-inner .location-map .root .root-jr:before {
  display: block;
  content: '';
  width: 54px;
  height: 6px;
  background: url('../images/location/root-jr.svg') no-repeat;
  background-size: 100% 100%;
  position: absolute;
  top: 4px;
  left: -62px;
}
.location .location-inner .location-spot {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      width: 100%;
  margin: 0 auto 25px;
}
.location .location-inner .location-spot li {
  width: min(21vw, 252px);
  margin: 0 0 40px;
}
.location .location-inner .location-spot li img {
  width: 100%;
  height: auto;
  margin: 0 0 15px;
  border: 1px solid #2E2E2E;
}
.location .location-inner .location-spot li p {
  font-size:  min(1.29vw, 14px);
  letter-spacing: 0.02em;
  line-height: 1.5;
  text-align: center;
}
.location .location-inner .location-caution {
  width: 100%;
  margin: 0 auto;
  font-size: 10px;
  letter-spacing: 0.04em;
  line-height: 1.5;
}



/* ------ */

/* SP all */
@media screen and (max-width: 1024px) {
   .location {
    padding: 12.6953125vw 0 7.8125vw;
  }
  .location .location-inner .location-title {
    font-size: 2.5390625vw;
    margin: 0 auto 6.8359375vw;
  }
  .location .location-inner .location-title:before,
  .location .location-inner .location-title:after {
    width: min(15.33203125vw, 20vw);
    top: 0.9765625vw;
  }
  .location .location-inner .location-title span {
    font-size: 1.3671875vw;
    margin: 1.46484375vw 0 0;
  }
  .location .location-inner .location-catch {
      font-size: 1.36vw;
      line-height: 2.1;
    margin: 0 0 5.859375vw;
  }
  .location .location-inner .location-map {
    width: 100%;
    margin: 0 auto 3.90625vw;
  }
  .location .location-inner .location-map:before {
    display: none;
  }
  .location .location-inner .location-map figure {
    width: 100%;
    height: 100%;
    margin: 0 auto 1.46484375vw;
  }
  .location .location-inner .location-map figure:before {
    display: none;
  }
  .location .location-inner .location-map .root {
    display: block;
    width: 100%;
  }
  .location .location-inner .location-map .root .root-keikyu {
    font-size: 0.9765625vw;
    margin: 0 0 0.9765625vw;
    text-align: right;
  }
  .location .location-inner .location-map .root .root-keikyu:before {
    width: 5.2734375vw;
    height: 0.5859375vw;
    background: url('../images/location/root-keikyu.svg') no-repeat;
    background-size: 100% 100%;
    top: 0;
    left: 0;
    margin: 0 0.97vw 0 0;
    position: relative;
    display: inline-block;
  }
  .location .location-inner .location-map .root .root-jr {
    font-size: 0.9765625vw;
    text-align: right;
  }
  .location .location-inner .location-map .root .root-jr:before {
    width: 5.2734375vw;
    height: 0.5859375vw;
    background: url('../images/location/root-jr.svg') no-repeat;
    background-size: 100% 100%;
    top: 0;
    left: 0;
    margin: 0 0.97vw 0 0;
    position: relative;
    display: inline-block;
  }
  .location .location-inner .location-spot {
    width: 100%;
    margin: 0 auto 2.9296875vw;
  }
  .location .location-inner .location-spot li {
    width: 29.4%;
    margin: 0 0 2.9296875vw;
  }
  .location .location-inner .location-spot li img {
    margin: 0 0 0.9765625vw;
  }
  .location .location-inner .location-spot li p {
    font-size: 0.9765625vw;
    letter-spacing: 0.04em;
  }
  .location .location-inner .location-caution {
    width: 100%;
    font-size: 0.9765625vw; 
  }
}

/*576px以下*/
@media screen and (max-width: 576px) {
  .location {
    padding: 33.33333333vw 0 15.38461538vw;
  }
  .location .location-inner {
    width: 100%;
  }
  .location .location-inner .location-title {
    width: 100%;
    font-size: 6.66666667vw;
    margin: 0 auto 17.43vw;
  }
  .location .location-inner .location-title:before,
  .location .location-inner .location-title:after {
    width: 14.61538462vw;
    top: 3.5vw;
  }
  .location .location-inner .location-title span {
    font-size: 3.58974359vw;
    margin: 3.84615385vw 0 0;
  }
  .location .location-inner .location-catch {
    font-size: 3.58vw;
    margin: 0 0 15.38461538vw;
    line-height: 2.1;
  }
  .location .location-inner .location-map {
    margin: 0 0 10.25641026vw;
  }
  .location .location-inner .location-map:before {
    display: none;
  }
  .location .location-inner .location-map figure {
    width: 100%;
    height: 100%;
    margin: 0 auto 3.84615385vw;
  }
  .location .location-inner .location-map figure:before {
    display: none;
  }
  .location .location-inner .location-map .root {
    display: block;
    width: 100%;
  }
  .location .location-inner .location-map .root .root-keikyu {
    font-size: 2.56410256vw;
    margin: 0 0 1.28205128vw;
    text-align: right;
  }
  .location .location-inner .location-map .root .root-keikyu:before {
    width: 13.84615385vw;
    height: 1.53846154vw;
    margin: 0 2.56vw 0 0;
  }
  .location .location-inner .location-map .root .root-jr {
    font-size: 2.56410256vw;
    text-align: right;
  }
  .location .location-inner .location-map .root .root-jr:before {
    width: 13.84615385vw;
    height: 1.53846154vw;
    margin: 0 2.56vw 0 0;
  }
  .location .location-inner .location-spot {
    width: 100%;
    margin: 0 auto;
  }
  .location .location-inner .location-spot li {
    width: 41.02564103vw;
    margin: 0 0 7.69230769vw;
  }
  .location .location-inner .location-spot li img {
    margin: 0 0 2.56410256vw;
  }
  .location .location-inner .location-spot li p {
    font-size: 2.56410256vw;
  }
  .location .location-inner .location-caution {
    width: 100%;
    font-size: 2.56410256vw;
  }
}