@charset "Shift-JIS";
<style type="text/css">



/***************************************************************************************************
'_ver1.0_ (2021.09.18)
' @(S)
'ﾌﾟﾛｼﾞｪｸﾄ名称：安否確認システム
'ﾓｼﾞｭｰﾙ名称  ：安否確認ログイン    スタイルシート
'ﾓｼﾞｭｰﾙ内容　：安否確認ログイン共通ﾓｼﾞｭｰﾙ
'html名称    :login.html       ログイン
'            :
'
'
'***************************************************************************************************
'
'  ■ 　改修履歴　　■
' 2022/03/12 iphone対応  font-family追加
' 2022/03/13 iphone対応  -webkit-text-size-adjust
'            input submit button   -webkit-appearance  ボタン形状の統一
' 2022/03/15 画面　左右分割を廃止
'
'
' 2022/04/03 おたがいさま　スタイルシート変更
'            '#logo{ height=120px;  width: auto; margin: 0; }
'            .page-header{ display: flex; justify-content:space-between;    align-items:  center; }

'
'
'
'
'
'
'
'
'
*/





/*  共通部分  */
html{ font-size: 100%; }     /* ユーザー設定した文字サイズを正しく反映させる */
body {							/*  iPhone版Safariで文字サイズがおかしくなるとき  */
  -webkit-text-size-adjust: 100%;
}
body {
	background-color: #fff;					 /* ボディ部の背景色    #fffbe9; */
  	font-family: "Helvetica Neue",
    Arial,
    "Hiragino Kaku Gothic ProN",
    "Hiragino Sans",
    Meiryo,
    sans-serif;
	}
h1 {color:#0bd; font-size:20px; line-height: 1.0; }
h3 {font-size:18px; line-height: 1.0; }
p {font-size:16px; line-height:1.0; /* 行間 */}
.font_size14 {font-size: 14px; }    /* Pタグのfont　*/

a {text-decoration: none; }     /* <a>タグのライン */
img { max-width: 100%; }
#logo { height=120px;  width: auto; margin: 0; }

.menu-icon {margin-top:1.5rem;}   /* ﾊﾝﾊﾞｰｶﾞｰﾒﾆｭｰ  */
.page-header {
  	display: flex; justify-content:space-between;
  	align-items:  center;
 }

/* 表示領域の設定  */
.wrapper {max-width:  1000px; margin: 0 auto; padding: 0 4%; }
.wrapper2 {max-width:  800px; margin: 0 auto; padding: 0 4%; }
.wrapper3 {max-width:  600px; margin: 0 auto; padding: 0 4%; }


/*  処理内容のタイトル表示領域　予約・取消・混雑状況　　　 角丸    text-align: center; 文字位置   cursor: pointer; カーソル  padding: 12px 28px; 余白  opacity: 1; 透明度  transition: .3s;   なめらか変化 */
.menu-status{display: inline-block;  text-align: left;  padding-top: 6px; padding-bottom: 6px ;padding-left: 10px ;opacity: 1;
   background: #5588b3; color:#fff;margin: 1px; width: 98%; }



/*   border-radius: 5%; 角丸    text-align: center; 文字位置   cursor: pointer; カーソル  padding: 12px 28px; 余白  opacity: 1; 透明度  transition: .3s;   なめらか変化 */
.m-button{display: inline-block; border-radius: 5%; text-align: center; cursor: pointer; padding: 12px 10px; opacity: 1;transition: .3s;
   background: #5588b3; color:#fff;margin: 1px; width: 190px; }
.m-button:hover {
     box-shadow    : none;        /* カーソル時の影消去 */
     opacity       : 0.8;         /* カーソル時透明度 */
   }


/*  共通　お知らせ情報   */
#common-infomation p{ text-align:center; }    /*  中央表示  */
/*  pタグ　文章の先頭を揃える  txet-indent使う*/
p.indent-1 { padding-left:1em; text-indent:-1em; }
/*  listの内部番号エリアの非表示  */
.display-none { display: none; }



/* ※※※  入力フォーム  ※※※ */

/* 　入力フォームのタイトル編集    ログイン　初めて受診される方   */
/*  スマホ対応のため   width: 90%;  box-sizing: border-box 使用　padding with 長さ固定にしない  */
.login-title-align{text-align: center; }
.visit-login-title { display: inline-block; font-size: 1.3em; align: center;  text-align: center;
  padding: 0.5em ; background: #ffd966; color: #0; line-height: 1em;
  width: 95%;  box-sizing: border-box; border: 1em;
}


/*  入力項目のプレースホルダーの色を変更 　IE11と古いEdgeにも対応する場合 */
/*　　特定のクラスを持つinput/textareaだけ * 例：<input type="text" class="ph-red"> */
::placeholder { color: #d9d9d9;　}
/* 旧Edge対応 */
::-ms-input-placeholder { color: #d9d9d9;　}
/* IE対応 */
:-ms-input-placeholder { color:  #d9d9d9;　}




/* フォーム */
form div {
    margin-bottom: 14px;
}
label {
    font-size: 1rem;
    line-height: 20px;
    margin-left: 2rem;
    display: block;
}
input[type="text"],
input[type="email"],
    textarea {
    background: rgba(242,242,242, 1);     /* #f2f2f2  */
    border: 1px #ccc solid;       /*  太さ1px 色(#0a0) 実線(solid)  */
    border-radius: 5px;
    border-bottom: 15px; padding-left: 10px; padding-top: 3px; padding-bottom: 2px;
    font-size: 1rem;
}
input[type="text"],
input[type="email"] {
    width: 100%;
    max-width: 240px;
    font-size: 0.8em;
}
textarea {
    width: 100%;
    max-width: 480px;
    height: 6rem;
    font-size: 0.8em;
  }

input[type="submit"] {
    -webkit-appearance: none;
    border-radius: 0;

    border: none;
    cursor: pointer;
    line-height: 1;
}

input[type="button"] {
    -webkit-appearance: none;
    border-radius: 0;
}



/*  送信ボタン 次のページ OKボタン等  */

/*    透明度 ( opacity: 0.9; )   影の設定 ( box-shadow : 2px 2px 3px #666666; )   */
.btn_confirm , .btn_nocheck {
  display: inline-block; border-radius: 5%; font-size: 10pt; text-align: center; width: 160px;
  border-color: #5588b3; border-style: solid;  border-width: 1px;
  cursor: pointer; padding: 8px 40px; background: #a4c1e5; color: #000; line-height: 1em; opacity: 0.9;  transition: .3s; box-shadow : 2px 2px 3px #666666; }
  .btn_confirm:hover , .btn_nocheck:hover {
    box-shadow    : none;        /* カーソル時の影消去 */
    opacity       : 1;           /* カーソル時透明度 */
    border-color:  blue;
  }

  /*    透明度 ( opacity: 0.9; )   影の設定 ( box-shadow : 2px 2px 3px #666666; )     外側の角を丸めま border-radius: 5%  */
  .btn_next , .btn_return {
    display: inline-block; border-radius: 5%; font-size: 10pt; text-align: center; width: 160px;
    border-color: #5588b3; border-style: solid;  border-width: 1px;
    cursor: pointer; padding: 8px 40px; background: #dae3f3; color: #000; line-height: 1em; opacity: 0.9;  transition: .3s; box-shadow : 2px 2px 3px #666666; }
    .btn_next:hover , .btn_return:hover {
      box-shadow    : none;        /* カーソル時の影消去 */
      opacity       : 1;           /* カーソル時透明度 */
      }

/* 　送信ボタンを中央に配置  */
.input_wrap{ text-align: center;}



/* ※※※  サイドバーのタイトルに下線  ※※※ */
.sub-title{padding-left: 20px ; padding-bottom: 8px ; border-bottom: 1px #0bd solid; }


/* ※※※  ページの先頭へのリンク設定   ※※※ */
#pagetop{ margin-top: 10px; margin-right: auto; margin-bottom: 0; margin-left: auto; text-align: right;
}

a.anchor{ display: block;  padding-top: 70px; margin-top: -70px;
}

/* ページの先頭へのリンク設定 */
#pagetop a{ display: block; margin-left: auto; width: 125px; height: 21px; overflow: hidden;
    background-image : url(image/returnTop_1A.png); background-position: top left;
    background-repeat: no-repeat; text-align: left; text-indent: -9999px;
}











   /* ※※※  表のスタイル  ※※※ */
   /*
   #top_info_table table {background-color:#fffbe9; style="border-collapse:collapse; border-color:#b2b2b2; width: 120%; table-layout: fixed; }
   #top_info_table td {text-align:center; background-color:#ff6c94; width: 120%; }
  */






/* ※※※ スマホ　PC別のスタイルシート    注意 メディアクエリに未対応のIE8以下等は表示しない ※※※ */
    /*  ※ phone.css ※  */
@media screen and (max-width:599px) {
    /* 小幅が320px以下の場合に適用する */
    /* トップメニューのボタン */

    /*

    .top_menu-Position-group{ max-width: 500px; position: absolute;  }
    .top_menu-Position-group2-1{ max-width: 500px; position: absolute;  }

    */

    .wrapper {max-width: 500px; margin: 0 auto; padding: 0 4%; box-sizing:border-box; }


    /* トップメニューのボタン 縦配置  */
    .top_menu-container{display:grid; flex-direction:column; justify-content: center; }


}

    /*  ※ tablet.css 600px=約24cm   959 px ※  */
@media (min-width:600px) and (max-width:759px) {
    /* 小幅が320px以下の場合に適用する  */
    /* トップメニューのボタン */
    /*  div#sidebar{with:160px;}  */

    /* レイアウト Grid   縦配置　*/
      .top_menu-Position-group{display:grid; flex-direction:row; }


      /*  【注意】このサイズでは横並びは形が崩れてしまう
       * Flexboxで横並びにする *
      .top-memu-contents{display: flex; justify-content: space-between; margin-bottom: 50px}
      * 記事部分　　画面幅が変わっても伸縮するようにする  *
      article {width: 65%; }
      * サイドバー部分　　画面幅が変わっても伸縮するようにする  *
      aside {width: 30%; }
      */

}





    /*  ※ desktop.css ※  */
@media (min-width:760px) {
    /* 小幅が960px以上の場合に適用する */
    /* トップメニューのボタン */
    /* div#sidebar{with:25%;} */

    /* レイアウト Grid   縦配置　*/
      .top_menu-Position-group{display:grid; flex-direction:row; }

/*
      / Flexboxで横並びにする  /
      .top-memu-contents{display: flex; justify-content: space-between; margin-bottom: 50px}

      / 記事部分　　画面幅が変わっても伸縮するようにする  /
      article {width: 45%; }
      / サイドバー部分　　画面幅が変わっても伸縮するようにする  /
      aside {width: 45%; }
*/


    }




      /*   ■　フッター部　■  ﾊﾞｯｸｶﾗｰ#7acbe1    #009bc6  */
      footer{background-color: #e3de00; text-align: center;  }

      footer p{color: #000; font-size: 0.875rem; padding: 5px 0 ;}











</style>