@charset "Shift_JIS";
.address-wrap {
  align-items: center;
  margin: 10px 0 0;
  padding: 2px 2px 5px 0;
  overflow: hidden;
}
.address-wrap button {
  background: var(--color-btn-c);
}
.gmap-btn a {
  width: 280px;
  margin: 20px auto 30px;
  padding: 0.8em;
  color: #fff;
  background: var(--color-btn-g);
  display: block;
}

/* accordion */
.frame:not(:first-of-type) {
  margin-top: 20px;
}

.toggle {
  padding: 1em 0;
}
h3.toggle-btn span {
  transition: transform 0.4s;
}

h4.serif {
  margin-bottom: 0.4em;
  font-weight: bold;
}

/* landmark */
#landmark .access_map {
  max-width: 480px;
  width: 100%;
  margin: 0.4em auto 1.5%;
}
.route {
  gap: 1.5%;
}

.route li {
  margin-bottom: 1.5%;
}
.access table {
  width: 100%;
}

.access table th,
.access table td {
  padding: 0.6em;
  vertical-align: middle;
  border: solid 1px var(--color-border);
}

.access .inner.toggle a {
  margin: 0 0.4em;
  text-decoration: underline;
  color: var(--color-primary);
}

.access_txt {
  padding: 0 1em;
}

.check {
  margin-top: 10px;
  font-weight: 700;
}

.check i {
  color: var(--color-primary);
}

/* prking */
#parking h4 {
  margin-bottom: 6px;
  font-weight: 700;
}

#parking .ng {
  margin: 0 4px;
  padding: 0 6px 2px;
  background: red;
  color: white;
  border-radius: 3px;
}

/* external-link  */
.access .external-link {
  margin-top: 1em;
}

.access .external-link a {
  line-height: 1.8;
  text-decoration: underline;
  font-weight: 700;
  color: var(--color-tertiary);
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

.access .external-link a:hover {
  text-decoration: none;
}

.access .external-link a i {
  margin-left: 0.4em;
}

/* highway */
.highway {
  gap: 1.5%;
}
.highway .area {
  padding: 0.6em;
  background: var(--color-border);
  font-weight: 700;
}

.highway p {
  padding: 0.6em;
  background: var(--color-white);
}

/* tel-btn */
.access .tel-btn {
  width: 92%;
  max-width: 600px;
  margin: 30px auto 0;
  padding: 0.8em;
  line-height: 1.6;
  background: var(--color-btn-w);
}

.access .tel-btn span {
  display: block;
}

.access .tel-btn span.bold {
  color: var(--color-btn-a);
  font-size: 140%;
}

@media screen and (max-width: 999px){
  #googlemap button {
    margin-right: 1em;
    float: right;
  }
  .frame {
    background: var(--color-bg);
    filter: drop-shadow(0px 1px 3px rgba(0, 0, 0, 0.5));
  }
  h3.toggle-btn {
    position: relative;
    padding: 0.6em 3em 0.6em 2em;
    pointer-events: all;
    text-indent: -1em;
    cursor: pointer;
  }
  h3.toggle-btn span {
    position: absolute;
    right: 2em;
    top: 25%;
  }
  h3.toggle-btn.active span {
    transform: scaleY(-1);
  }
  .toggle {
    display: none;
  }
  .route li {
    width: 49.25%;
    height: auto;
  }
  .highway > div {
    width: 49.25%;
    margin-bottom: 1.5%;
  }
}

@media screen and (min-width: 1000px){
  #googlemap input#address {
    width: 30em;
  }
  h3.toggle-btn {
    pointer-events: none;
  }
  .toggle {
    display: block !important;
  }
  #landmark .access_map {
    margin-left: 0;
  }
  .route li {
    width: 18.8%;
    height: auto;
  }
  .highway > div {
    width: 32.3333333333%;
    margin-bottom: 1.5%;
  }
}