@charset "utf-8";
/* CSS Document 文字コード：utf-8を使用
奈良県立医科大学附属病院 */

/* メインカラー・サブカラー */
:root {
  
  --color-gray-dark:   #333333!important;  /* テキスト色 */
  --color-blue-dark:   #292069!important;  /* リンクカラー（濃紺） */
  --color-link-hover:  #ff6633!important;  /* リンクカラー（オレンジ） */
  
  --color-main: #3266a9!important;          /*　メインカラー（背景カラー）　*/
  --color-main-hover: #2159a0!important;    /*　メイン　ホーバー（背景カラー）　*/
  --color-sub: #78cf86!important;           /*　サブカラー（背景カラー）*/
  --color-sub-hover: #52bd62!important;    /*　サブカラー ホーバー（背景カラー）*/
  
  --color-reserve-th:  #d1e4fd!important;  /* インデックスページ テーブルTH背景色 */
  
/* 追加 */
  --color-main-dark: #10478e!important;    /*　メインカラー（テキストカラー）　*/
  --color-sub-dark: #23ac38!important;     /*　サブカラー(テキストカラー) */
  --logo-max: 360px;                       /* キャッシュクリア用（ロゴの“原寸フラッシュ”を防止）cache-clear.js */
}

/*------------------------------------------------------
　ヘッダ
    施設名称（テキスト）を非表示
    ヘッダーロゴ画像
    システム名称<h3>　
    ヘッダレイアウト
-------------------------------------------------------- */
#header h2:first-of-type{
    display: none!important;
}

/* ヘッダーロゴ画像　*/
  #header img.hospital-logo{
    display: block;
    width: clamp(240px, 36vw, 360px)!important;
  }

/* ヘッダー　システム名称<h3>　*/
  #header h3 {
    color: var(--color-sub-dark)!important;
    font-weight: 600!important;
  }

/* ヘッダレイアウト　*/
@media (min-width: 768px){
  #header{
    padding: 6px!important;
    height: 95px!important;
  }
  #header h3 {
    margin-top: 0px!important;
  }
}

@media (max-width: 767px){
  #header{
    padding: 6px!important;
    height: 95px!important;
  }
  #header h3 {
    margin-top: 0px!important;
  }
}

/*--------------------------------------- 
 HTML ログインエリア　背景色
------------------------------------------*/
html {
  background-color: #ffffff!important;
}

/* ログインエリア左 */
#login-wrap {
  background-color: var(--color-cool-gray)!important; /* --color-gray-light */
}

/*--------------------------------------- 
 フッター　
------------------------------------------*/
#footer .footer-text h4 a {
  color: var(--color-main)!important; /* --color-gray-dark / --color-blue-dark */
}

/*------------------------------------------------------------ 
  帯
-------------------------------------------------------------- */
/* 帯　上段 */
.g-menu-01{
	background-color: var(--color-main)!important; 
}

/* 帯　下段 */
.g-menu-02{
	background-color: var(--color-sub)!important; 
}

/* 帯下段ボタン(HOME,マイページ）*/
.g-menu-02 > ul li {
  background-color: var(--color-white)!important;
}
.g-menu-02 > ul li a:link,
.g-menu-02 > ul li a:visited {
	color: var(--color-main)!important;
  background-color: var(--color-white)!important;
}
.g-menu-02 > ul li a:hover,
.g-menu-02 > ul li a:active{
	color: var(--color-main-hover)!important;
}

/*--------------------------------------- 
 カレンダーページ　予約時間選択ボタン
------------------------------------------*/
#tt-box01 td > input[type="button"]{
  background: var(--color-main)!important;
}
#tt-box01 td > input[type="button"].submit:hover,
#tt-box01 td > input[type="button"].submit:focus {
  background: var(--color-main-hover)!important;
}

/*------------------------------------------------------------ 
  ログインページ　テーブル(TH）
-------------------------------------------------------------- */
.login table th{
  background-color: var(--color-reserve-th)!important;
}

/*------------------------------------------------------------ 
  indexページ　セレクト(診療科目選択) 
-------------------------------------------------------------- */
/*** デフォルト列数・高さ ***/
/* 通常ボタン */
ul.index-topbtn > li{width:calc(25% - 8px)!important;}

/* ボタンの縦サイズ */
ul.index-topbtn > li:not(.width-list) > a{ height:50px!important; }

/* プルダウン付きボタン */
ul.index-topbtn > li.width-list{width:calc(50% - 8px)!important;}

/* ---------------------- レスポンシブ ---------------------- */
@media (max-width:1024px){
  ul.index-topbtn > li{ width:calc(33.333% - 8px)!important; }
}
@media (max-width:767px){
  ul.index-topbtn > li{ width:calc(50% - 8px)!important; }
  ul.index-topbtn > li.width-list{ width:calc(100% - 8px)!important; }
}
@media (max-width:479px){
  ul.index-topbtn > li{ width:calc(100% - 8px)!important; }
}

/* ---------------------- リスト ホーバー色 -------------------- */
ul.index-topbtn li:hover{
  background:var(--color-reserve-th)!important;
}

/*-------------------------------------------------- 
　ボタン大カラー 
---------------------------------------------------- */
.btn_primary {background-color: var(--color-sub)!important;}

.btn_primary:hover,
.btn_primary:focus{background-color: var(--color-sub-hover)!important;}

/*---------------------------------------------------
　ログインボタンカラー 
-----------------------------------------------------*/
form #btnLogin {background-color: var(--color-sub)!important;}
form #btnLogin:hover,
form #btnLogin:focus {background-color: var(--color-sub-hover)!important;}

/*---------------------------------------------------
　ログインボタン下　個人情報の取り扱いについて
-----------------------------------------------------*/
#login-text2 .manual-inner-smalltxt {
  width: 84%;
}

#login-text2 .manual-inner-smalltxt p {
  margin-top: .3em;
  font-size: 80%;
  line-height: 1.6;
}

#login-text2 .manual-inner-smalltxt h6 {
  margin-top: 1em;
  font-size: 84%;
  line-height: 1.6;
}

#login-text2 .manual-inner-smalltxt h5 {
  margin-top: 1.5em;
  font-size: 90%;
  line-height: 1.6;
}

@media (max-width: 767px){
  #login-text2 .manual-inner-smalltxt {
    width: 94%;
}
}