@charset "shift_jis";
@media screen and (max-width: 999px){
}
@media screen and (min-width: 1000px){
}

.address-wrap {
  margin: 10px 0;padding: 2px 2px 5px 0;
  overflow: hidden;
}
@media screen and (max-width: 999px){
  #googlemap button {
    margin-right: 1em;
    float: right;
  }
}
@media screen and (min-width: 1000px){
  #googlemap input#address {
    width: 24em;
  }
}
.gmap-btn a {
  width: 280px;
  margin: 20px auto 30px;padding: .8em;
  background: var(--color-tertiary);
  display: block;
}
/* accordion */
.frame:not(:first-of-type) {margin-top: 20px;}
.toggle {padding: 1em 0;}
@media screen and (max-width: 999px){
  .frame {box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, .3);}
  h3.toggle-btn {
    padding: 0.6em 1em;
    cursor: pointer;pointer-events: all;
    position: relative;
  }
  h3.toggle-btn span {
    position: absolute;right: 2em;top: 50%;
    transform: translate(0, -50%);
  }
  h3.toggle-btn.active span {
    transform: scaleY(-1);
    transform: translate(0, -50%) scaleY(-1);
}
  .toggle {display: none;}
  
}
@media screen and (min-width: 1000px){
  h3.toggle-btn {pointer-events: none;}
  .toggle {display: block !important;}
}
h4.serif {
  margin-bottom: .4em;
  font-weight: bold;
}
/* landmark */
#landmark .access_map {
  max-width: 480px;width: 100%;
  margin: .4em auto 1.5%;
}
@media screen and (min-width: 1000px){#landmark .access_map {margin-left: 0;}}
.route {gap: 1.5%;}
.route li {margin-bottom: 1.5%;}
@media screen and (max-width: 999px){
  .route li {width: calc( 98.5% / 2 );height: auto;}
 }
@media screen and (min-width: 1000px){
  .route li {width: calc( 94% / 5 );height: auto;}
}
.access table {width: 100%;}
.access table th,
.access table td {
  padding: .6em;
  vertical-align: middle;
  border: solid 1px var(--color-border);
}
.check {
  margin-top: 10px;
  font-weight: 700;
}
.check i {color: var(--color-primary);}
/* prking */
.parking-list:not(:last-of-type) {margin-bottom: 10px;}
.parking-list {gap: 1.5%;}
.parking-list li {width: calc( calc( 100% - 1.5%) / 2 );}
#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 .3s ease;transition: all .3s ease;
}
.access .external-link a:hover {
  text-decoration: none;
}
.access .external-link a i {margin-left: .4em;}
/* highway */
.highway {gap: 1.5%;}
@media screen and (max-width: 999px){
  .highway > div {
    width: calc( 98.5% / 2 );
    margin-bottom: 1.5%;
  }
 }
@media screen and (min-width: 1000px){
  .highway > div {
    width: calc( 97% / 3 );
    margin-bottom: 1.5%;
  }
}
.highway .area {
  padding: .6em;
  background: var(--color-border);
  font-weight: 700;
}
.highway p {
  padding: .6em;
  background: var(--color-white);
}
/* tel-btn */
.access .tel-btn {
  margin-top: 30px;padding: 0.8em 1em;
  line-height: 1.6;
  background: white;
}
.access .tel-btn span {display: block;}
.access .tel-btn .serif {color: var(--color-beige);}
.access .tel-btn span.bold {
  font-size: 140%;
}