@charset "UTF-8";
/* ----------------------------------------------
　PC設定
------------------------------------------------*/
@media all and (min-width: 769px) {
  #contents .bar_tit {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-bottom: var(--m40);
  }
  #contents .bar_tit .txt {
    font-size: var(--s22_40);
    line-height: 1;
  }
  #contents .bar_tit::after {
    content: "";
    display: inline-block;
    width: 50px;
    height: 5px;
    background-color: var(--brown04);
    margin: var(--m16) 0 var(--m24);
  }
  #contents .map_area {
    margin-top: var(--m40);
    aspect-ratio: 1200/437;
    width: 100%;
    order: 4;
  }
  #contents .map_area iframe {
    width: 100%;
    height: 100%;
  }
  #contents .sec {
    margin-bottom: var(--m100);
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  #contents .tit {
    width: 100%;
    margin-bottom: var(--m30);
    font-size: var(--s20_32);
    color: var(--brown04);
    font-weight: 500;
    text-align: center;
    order: 1;
  }
  #contents dl {
    width: 66%;
    border: 1px solid var(--brown04);
    padding: var(--m20);
    order: 3;
  }
  #contents dl.full {
    width: 100%;
  }
  #contents dl .row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 5px;
  }
  #contents dl .row dt {
    background-color: var(--brown04);
    padding: 1em 0.75em;
    color: #fff;
    font-size: var(--s16_20);
    font-weight: normal;
    width: 30%;
    display: flex;
    align-items: center;
  }
  #contents dl .row dd {
    width: 68%;
    font-size: var(--s16_20);
    padding: 0.75em 0;
  }
  #contents .img_area {
    width: 30%;
    order: 2;
  }
}
/* ----------------------------------------------
　PAD以下設定
------------------------------------------------*/
@media all and (max-width: 768px) {
  #contents .bar_tit {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-bottom: var(--m50);
  }
  #contents .bar_tit .txt {
    font-size: var(--s22_40);
    line-height: 1;
  }
  #contents .bar_tit::after {
    content: "";
    display: inline-block;
    width: 50px;
    height: 5px;
    background-color: var(--brown04);
    margin: var(--m16) 0 var(--m24);
  }
  #contents .map_area {
    margin-top: var(--m40);
    aspect-ratio: 2/1;
    order: 4;
    width: 100%;
  }
  #contents .map_area iframe {
    width: 100%;
    height: 100%;
  }
  #contents .sec {
    margin-bottom: var(--m80);
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    grid-gap: var(--m30);
  }
  #contents .tit {
    width: 100%;
    font-size: var(--s20_32);
    color: var(--brown04);
    font-weight: 500;
    text-align: center;
  }
  #contents dl {
    width: 100%;
    border: 1px solid var(--brown04);
    padding: var(--m20);
  }
  #contents dl .row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 5px;
  }
  #contents dl .row dt {
    background-color: var(--brown04);
    padding: 0.75em;
    color: #fff;
    font-size: var(--s16_20);
    font-weight: normal;
    width: 30%;
    display: flex;
    align-items: center;
  }
  #contents dl .row dd {
    width: 68%;
    font-size: var(--s16_20);
    padding: 0.75em 0;
  }
  #contents .img_area {
    width: 100%;
    max-width: 400px;
  }
}
/* ----------------------------------------------
  SP設定
  ------------------------------------------------*/
@media all and (max-width: 520px) {
  #contents .map_area {
    aspect-ratio: 1/1;
  }
  #contents dl .row {
    flex-wrap: wrap;
  }
  #contents dl .row dt {
    width: 100%;
    justify-content: center;
  }
  #contents dl .row dd {
    width: 100%;
  }
  #contents .img_area .img {
    width: 47.5%;
  }
  }