html, body, table{
	font-size: clamp(16px, 1vw + 10px, 26px);
}
.navbar{
    border-bottom: 1px solid lightgray
}
.title{
    font-weight: bold; 
    color: midnightblue; 
}
.navbar-toggler {
    padding: 0.25rem 0.5rem;
    font-size: 0.8rem;
    background-color: white;
    border: none;
}
.lastupdatetimenavbar{
  padding:4px;
}
.navform{
  margin: -10;
}

.flex-grow-1 {
  z-index: 100;
}
.carousel-item img {
    object-fit: contain; 
    height: 100%; 
    width: auto; 
}

.btn-check:not(:checked)+.btn {
    background-color: white;
}
.empty {
    background-color: limegreen;
}
.full {
    background-color: red;
}
.congestion {
    background-color: orange;
}
.closed {
    background-color: gray;
}
.fs-larger{
    font-size: larger;
}
.fs-inherit{
    font-size: inherit;
}
.img-responsive {
    display: block;
    max-width: 100%;
    height: 100%;
}

.form-check-input:checked {
    background-color: limegreen;
    border-color: limegreen;
}

.form-check-input:disabled,
.form-check-input:disabled~.form-check-label {
    opacity: 1; /* 不透明度を元に戻す */
    color: black;
    cursor: not-allowed; /* カーソルを無効状態に */
}

.copyable-text {
    cursor: pointer;
}

#locationButton{
  border-color: gray;
}
#updateButton{
  border-color: gray;
}
.z1{
  z-index: 1300;
}

/* トーストメッセージのスタイル */
.toast {
    position: fixed;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    background-color: rgba(0, 0, 0, 0.7);
    color: white;
    padding: 10px 20px;
    border-radius: 5px;
    font-size: 14px;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.5s, visibility 0.5s;
    display: block !important;
    z-index: 100;
  }
  
  /* トーストが表示される時 */
  .toast.visible {
    opacity: 1;
    visibility: visible;
  }
  
  /* トーストが非表示の時 */
  .toast.hidden {
    opacity: 0;
    visibility: hidden;
  }

  #map {
    height: 100%;
    margin-bottom: 2rem;
}

.infowindow-content {
    max-width: 90%; /* デフォルトは画面幅の80%まで広がる */
    min-width: 400px; /* 最小幅は200px */
    max-height: 40vh;
    padding: 0px;
    box-sizing: border-box;
    display: flex;
    align-items: flex-start; /* 上部で揃える */
    position: relative; /* z-indexを有効にするためにrelativeを指定 */
    overflow: hidden; 
}

/* モバイル対応のメディアクエリ */
@media (max-width: 600px) {
    .infowindow-content {
        max-width: 80% !important; /* モバイルではさらに広げる */
        max-height: 40vh;
        padding: 0px; /* パディングを少なくする */
        overflow: hidden; 
    }
    .gm-style-iw, .gm-style-iw-c {
        max-width: 340px !important;
        overflow: hidden !important; /* スクロールバーを非表示に */
        box-sizing: border-box;
    }
}
.topics-box{
    overflow: hidden;
    width: 794px;
    padding: 8px;
    margin: 6px auto;
    border-bottom: 2px dotted #808080;
}
.topics-box a{
    margin-left:30px;
}
.topics-box .image{
    float: left;
    margin-right: 40px;
}
.news{
    overflow: hidden;
    border-bottom: 2px dotted #808080;
}

@media screen and (max-width: 960px) {
    .topics-box{
        max-width: 96%;
    }
    .info{
        width: 100%;
        text-align: center;
    }
}

@media screen and (max-width: 670px) {
    .topics-box .image{
        max-width: 248px; 
        float: none;
        margin: 0 auto 10px;

    }
}



/* ===パン屑リスト=== */  

#breadlist {
    border-bottom: 1px solid #dedede;
    height: 45px;
  }
  
  #breadlist ul {
    width: 960px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 0;
    float: center;
  }
  
  #breadlist ul li {
    padding-left: 8px;
    float: left;
    line-height: 45px;
    font-size: 85%;
  }
  
  #breadlist ul li a {
    color: #d87c00;
    line-height: 45px;
    padding-right: 8px;
    text-decoration: underline;
  }
  
  #breadlist ul li a:hover {
    text-decoration: none;
  }
  
  #breadlist ul li:first-child {
    padding-left: 0;
  }

  
#link_list > li .parent {
    line-height: 52px;
    height: 50px;
    /* ↓カテゴリーページレスポンシブ対応 2015.3.18 keisuke start *************** */
    /* background: #ffffff */
    background: #ffffff;
    background-position: right;
    /* ↑カテゴリーページレスポンシブ対応 2015.3.18 keisuke end ***************** */
    border-top: 1px solid #cccccc;
    display: block;
    padding-left: 19px;
    text-decoration: none;
  }
  
  #link_list > li .parent:hover {
    color: #ffffff;
    /* ↓カテゴリーページレスポンシブ対応 2015.3.18 keisuke start *************** */
    /* background: #F29600 */
    background: #F29600;
    background-position: right;
    /* ↑カテゴリーページレスポンシブ対応 2015.3.18 keisuke end ***************** */
    border-top: 1px solid #F29600;
  }
  
  #link_list > li ul {
    display: none;
  }
  
  #link_list > li ul a {
    text-decoration: underline;
  }
  
  #link_list > li ul a:hover {
    text-decoration: none;
  }
  
  #link_list > li:first-child a {
    border-top: none;
  }
  
  #link_list > li:first-child a:hover {
    border-top: none;
  }
  
  #link_list > li.current .parent {
    color: #ffffff;
    /* ↓カテゴリーページレスポンシブ対応 2015.3.18 keisuke start *************** */
    /* background: #F29600 */
    background: #F29600;
    background-position: right;
    /* ↑カテゴリーページレスポンシブ対応 2015.3.18 keisuke end ***************** */
    border-top: none;
  }
  
  #link_list > li.current ul {
    display: block;
    padding: 15px 19px 20px 19px;
  }
  
  #link_list > li.current ul li {
    margin-top: 12px;
  }
  
  #link_list > li.current ul li dl {
    padding-bottom: 10px;
  }
  
  #link_list > li.current ul li dl dt {
    margin-bottom: 10px;
  }
  
  #link_list > li.current ul li dl dt.current a {
    color: #F29600;
  }
  
  #link_list > li.current p.currentcategory a {
    color: #F29600;
    font-weight: bold;
  }
  
  #link_list > li.current ul li dl dd {
    padding-left: 24px;
    margin-bottom: 5px;
  }
   
  #link_list > li.current ul li:first-child {
    margin-top: 0px;
  }

  #graydisplay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    max-width: 100%!important;
    height: 100%;
    background: rgba(0,0,0,0.80);
    z-index: 999;
  }
  #graydisplay img {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    object-fit:contain;

  }

  

@media screen and (max-width: 10240px) {
  .navbaradd{
    margin-top: 0;
    background-color:white;
    z-index: 1000;
  }
  .navbaradd a{
    margin-bottom: 0;
    margin-left:0;
  }
  .navbaradd div{
    margin-top: 0;
    margin-left: 0;
  }
}

@media screen and (max-width: 670px) {
  .navbaradd{
    margin-top: -5px;
    height: 55px;
    background-color:white;
  }
  .navbaradd a{
    margin-bottom: 13px;
    margin-left:-15px;
    z-index: 1000;
  }
  .navbaradd div{
    margin-top: -13px;
    margin-left: -28px;
  }
}
  .parkingroute{
    padding: 12px 15px 12px 15px ;
    margin: -5px -5px -8px -5px;
  }
  .parkingrouteapple{
    padding: 12px 15px 12px 15px ;
    margin: -5px -5px -8px -5px;
  }

  .parkingstatus{
    line-height: 40px;
  }

  .parkingname{
    font-size: 18px;
  }

.carousel-indicators [data-bs-target] {
    width: 10px;
    height: 10px;
    border-radius: 50%; 
    margin-bottom:-30px;
  border: black; 
  background-color: lightslategray; 
}

.carousel-indicators .active {
    background-color: black; 
}

#carouselExample{
  padding-top: 25px;
  margin-bottom: -6px;
}


  topbody{
    padding-top: 120px;
    height: 90vh;
  }


  .offcanvas-body a{
    font-size: 30px;
    padding-top: 10px;
  }

  .gm-style-iw-chr{
    height: 28px;
  }

  .parkingtime{
    margin-top: -5px;

  }