@charset "utf-8";
/*** CSS Document 文字コード：utf-8を使用
 *グループ長岡
 *長岡赤十字病院
 *長岡中央総合病院
***/

/* ========== 色変数 ========== */
:root{
  --color-main: #64bdf0!important;
  --color-main-hover: #0581c6!important;
  
  --color-sub:  #078ce7!important;
  --color-sub-hover: #efa154!important;
  
  --color-link: #078ce7!important;
  --color-link-hover: #e67229!important;
  
  --color-text: #292069!important;
  --color-table-th: #b9e2fa!important;
}

/* -------------------------------
   8) フッター（固定）group-style上書き
   ------------------------------- */
.site-footer {
  line-height: 1;
}

.footer-inner {
  padding:0;
  padding-top: 3px;
  height: 40px;
}

/* -------------------------------
   システム名称
   ------------------------------- */
.brand h1 {
  color: var(--color-sub)!important;
  font-size: 20px!important; 
}

/* -------------------------------
   ハンバーガーメニュー
   ------------------------------- */
.hamburger {
  background-color:  var(--color-sub)!important;
}

.hamburger:hover {
  background-color:  var(--color-sub-hover)!important;
}

/* -------------------------------
   病院カード　病院名称
   ------------------------------- */
.hp-links > h3 a {
  padding: 3px;
  color: var(--color-link)!important;
  font-weight: 600!important;
  font-size: 1rem!important;
  display: block;
}

.hp-link{
  color: var(--color-link);
}
.hp-link:hover{ 
  color: var(--color-link); 
  text-decoration: underline; 
}

/* PC/タブレット：3列の場合、カードを少し小さく */
@media (min-width: 641px){
  .hp-card{
    flex: 0 1 calc(((100% - 2 * var(--gap)) / 3) * 0.86);
    max-width: calc(((100% - 2 * var(--gap)) / 3) * 0.86);
  }
}

/* 2列時（タブレット）も同じく 90%に */
@media (max-width: 980px) and (min-width: 641px){
  .hp-card{
    flex: 0 1 calc(((100% - var(--gap)) / 2) * 0.90);
    max-width: calc(((100% - var(--gap)) / 2) * 0.90);
  }
}


/* -------------------------------
   背景
   ------------------------------- */
body{
  padding-bottom: 60px;
}

.footer-inner {
  justify-content: bottom;
  padding-bottom: 5px;
}

/* -------------------------------
   背景画像を追加
   ------------------------------- */
body{
  padding-bottom: 180px!important;
}
.site-footer {
  background-image: url("../img/footer.png") !important;
  background-position: right bottom !important;
  background-size: auto 100% !important;
  background-repeat: no-repeat;
  padding-top: 150px !important;
}

.footer-inner {
  justify-content: bottom!important;
  /*background-color: var(--color-table-th);
  opacity: 0.5;*/
}

@media screen and (max-width: 600px) {
  .footer-inner {
    justify-content: bottom!important;
    padding-bottom: 0!important;
  }
  .footer-logo {
    margin-bottom: 2px!important;
  }
  .footer-links {
    margin-top: 2px!important;
    font-size: 12px!important;
  }
}

/* フッターをスライドさせるためのアニメーション */
.site-footer {
  transition: transform 0.3s ease;
}

/* スマホ幅で隠すときのクラス */
@media screen and (max-width: 600px) {
  .site-footer--hidden {
    transform: translateY(110%); /* 画面の下に押し出す */
  }
}

/* フッター調整　上書き */
.site-footer {
  /* 画像2400×302pxの比率で高さを確保 */
  height: max(220px, 12.583333vw);
  padding: 0 !important;

  background-size: 100% auto !important;
  background-position: right bottom !important;
  background-repeat: no-repeat;

  /* ロゴ・運営名を下端に配置 */
  display: flex;
  align-items: flex-end;
}

body {
  /* 固定フッターに本文が隠れないようにする */
  padding-bottom: max(190px, 12.583333vw) !important;
}

@media screen and (max-width: 600px) {
  .site-footer {
    height: 190px;
    background-size: auto 100% !important;
    background-position: right bottom !important;
  }

  body {
    padding-bottom: 190px !important;
  }
}