@charset "utf-8";
/* CSS Document */

$fs: 1.5rem; // フォントサイズ

/* ---------- html ---------- */
// CSSでフォントサイズが指定されている要素に適応
html{
  font-size: 10px - .625; // スマホで全体を-1px小さくするには-.625
 
  // メディアクエリ PC
  @media screen and (min-width: 768px){
    font-size: 10px; // デフォルトは10px
  }
}
/* ---------- /html ---------- */


/* ---------- body ---------- */
// bodyでCSSでフォントサイズが指定されていない要素に適応
body{
  font-size: $fs - .2; // スマホのフォントサイズを-2px
 
  // メディアクエリ PC
  @media screen and (min-width: 768px){
    font-size: $fs;
  }
}
/* ---------- /body ---------- */


/* ---------- anchor ---------- */
a,a:link,a:visited{
  background-color: inherit;
  text-decoration: underline;
  color: #669900;
}
a:focus,a:hover,a:active
{
 background-color: inherit;
  text-decoration:underline;
  color: #660;
}
a:hover img {
  border:none;
  background:transparent;
}
/* ---------- /anchor ---------- */


/* ---------- font ---------- */
.fs01{
  font-size: 0.8rem;
}
.fs02{
  font-size: 0.9rem;
}
.fs03{
  font-size: 1.0rem;
}
.fs04{
  font-size: 1.1rem;
}
.fs05{
  font-size: 1.2rem;
}
.fs06{
  font-size: 1.3rem;
}
.fs07{
  font-size: 1.4rem;
}
.fs08{
  font-size: 1.5rem;
}
.fs09{
  font-size: 1.6rem;
}
.fs10{
  font-size: 1.7rem;
}
.fs11{
  font-size: 1.8rem;
}
/* ---------- font ---------- */


/* ---------- img ---------- */
.headerimage img {
  width: 90%;
  max-width: 768px;
}
/* ---------- /img ---------- */


/* ---------- input ---------- */
.btnletter2{
  font-size: 1.3rem;
  font-weight: bold;
  color: black;
  background-color: silver;
  text-align: center;
  width: 100px;
  height: 40px;
}

.btnletter2b{
  font-size: 1.3rem;
  font-weight: bold;
  color: white;
  background-color: blue;
  text-align: center;
  width: 100px;
  height: 40px;
}

.btnletter3{
  font-size: 1.3rem;
  font-weight: bold;
  color: black;
  background-color: silver;
  text-align: center;
  width: 120px;
  height: 40px;
}

.btnletter3b{
  font-size: 1.3rem;
  font-weight: bold;
  color: white;
  background-color: blue;
  text-align: center;
  width: 120px;
  height: 40px;
}

.btnletter4{
  font-size: 1.3rem;
  font-weight: bold;
  color: black;
  background-color: silver;
  text-align: center;
  width: 140px;
  height: 40px;
}

.btnletter4b{
  font-size: 1.3rem;
  font-weight: bold;
  color: white;
  background-color: blue;
  text-align: center;
  width: 140px;
  height: 40px;
}

.btnletter5{
  font-size: 1.3rem;
  font-weight: bold;
  color: black;
  background-color: silver;
  text-align: center;
  width: 160px;
  height: 40px;
}

.btnletter5b{
  font-size: 1.3rem;
  font-weight: bold;
  color: white;
  background-color: blue;
  text-align: center;
  width: 160px;
  height: 40px;
}

.btnletter6{
  font-size: 1.3rem;
  font-weight: bold;
  color: black;
  background-color: silver;
  text-align: center;
  width: 180px;
  height: 40px;
}

.btnletter6b{
  font-size: 1.3rem;
  font-weight: bold;
  color: white;
  background-color: blue;
  text-align: center;
  width: 180px;
  height: 40px;
}

.btnletter7{
  font-size: 1.3rem;
  font-weight: bold;
  color: black;
  background-color: silver;
  text-align: center;
  width: 200px;
  height: 40px;
}

.btnletter7b{
  font-size: 1.3rem;
  font-weight: bold;
  color: white;
  background-color: blue;
  text-align: center;
  width: 200px;
  height: 40px;
}
/* ---------- /input ---------- */


.commonheader{
  width: 100%;
  background: #DFFFEE;
  color: #00A850;
  text-align: center;
  font-size: 1.5rem;
  line-height: 1;
  padding: 5px;
}

.Infomation{
  width: 95%;
  max-width: 768px;  
  background-color: #DFFFEE;
  border: solid 1px #000000;  
}

.Infomation th{
  width: 100%;
  background: #00A850;
  color : #ffffff;
  font-size: 1.5rem; 
}

.Infomation td{
  width: 100%;
  font-size: 1.1rem; 
  line-height: 1.5;
  padding: 10px 5px 10px 5px ;
}

.login{
  width: 95%;
  max-width: 768px;
  background-color: #FFFFFF;
  border: solid 1px #000000;
  text-align: center;
}

.login th{
  width: 100%;
  background: #00A850;
  color : #ffffff;
  font-size: 1.5rem; 
}

.login td{
  width: 100%;
  font-size: 1.3rem; 
  line-height: 1.5;
}

.entrylogin{
  display: inline-block;
  width: 90%;
  max-width: 500px;
  background: #FFFFFF;
  font-size: 1.5rem;
  padding: 0 0.2em 0 0.2em ;
  border: 1px solid #999;
  box-sizing: border-box;
}
.entrylogin:focus{
  background: #FFF1AB;
}

.mainframe{
  width: 95%;
  max-width: 768px;
  border: solid 1px #000000;
  background-color: #DFFFEE;
}

.mainframe table{
  width: 95%;
}

.mainframe th{
  text-align: center;
  font-weight: bold;  
}

.mainframe td{
  text-align: left;
  line-height: 1.2;
  padding: 10px 5px 10px 5px ;  
}

.mainbtn {
  display: inline-block;
  width : 95%;
  padding: 10px;
  margin: 15px 0 15px 0;
  min-width: 320px;
  max-width: 700px;
  text-align : center;
  font-size: 1.5rem;
  font-weight: bold;
  color : #ffffff;
  background-color: #00A850;
  text-decoration: none; /* 文字の下線を消す */
  box-shadow: 0 5px 0 #dcdcdc; /* 影の太さ・色 */
  border-radius: 60px;
  cursor: pointer;
  
}
.mainbtn:active {
  box-shadow: none;
  transform: translateY(5px);
}

.caution{
  width: 95%;
  max-width: 768px;
  border: double;
  line-height: 1;  
  text-align: left;
  background-color: #efefef;
}

.caution th{
  font-size: 1.5rem;
  padding: 5px 0 3px 5px;
}

.caution td{
  font-size: 0.9rem;
  padding: 5px;
  line-height: 1.1;
}

.pCalender_1{
	text-align: center;
	font-size: 1.25rem;	
	width:13%;
	background-color:#CCFF99;
	color:#666666;
}

.pCalender_1_2{
	text-align: center;
	width:13%;
	background-color:#ADE2FF;
	color:#666666;
}

.pCalender_1_3{
	text-align: center;
	width:13%;
	background-color:#FF0000;
	color:#FFFFFF;
}

.pCalender_2{
	text-align: center;
	/*height:35px;*/
	background-color:#FFCC99;
	color:#666666;
}

.pCalender_3{
	text-align: center;
	/*height:35px;*/
	background-color:#FFFFFF;
	color:#666666;
}

.maru{
  text-decoration: none;
}

.pTime_1{
  text-align: center;
  font-size: 1.25rem;
  background-color:#EEEEEE;
  height:18px;
  color:#666666;
}

.pTime_2{
  text-align: center;
  font-size: 1.25rem;	
  background-color:#fafad2;
  height:18px;
  color:#666666;
}

.pRConfirm_1{
  text-align: center;
  background-color:#EEEEEE;
  height:18px;
  color:#666666;
}

.pRConfirm_2{
  text-align: center;
  background-color:#fafad2;
  height:18px;
  color:#666666;
}

.numberofrsv{
	width:330px;
  padding:10px;
  background-color:#cce7ff;
}

.numberbox select{
  width:100px;
  font-size: 1.5rem;
}

.togetherheader{
  width: 95%;
  max-width: 500px;
}

.togetherheader th{
  font-size: 1.2rem;
  background: #cce7ff;
  color : #666666;
  text-align: center;
  padding: 5px 0 0 5px;
}

.entryform{
  width: 95%;
  max-width: 500px;
}

.entryform th{
  font-size: 1.00rem;
  background: #EEEEEE;
  color : #666666;
  text-align: left;
  padding: 5px 0 0 5px;
}

.entryform td{
  font-size: 1.25rem;
  height:40px;  
  background: #fafad2;
  color : #666666;
  text-align: left;
  line-height: 1;
  padding: 0 5px 5px 5px;
}

.pointicon{
  display: flex;
  align-items: center;
  padding: 0 0 5px 0;
}

.entryname{
  display: inline-block;
  width: 99%;
  font-size: 110%;
  padding: 0.2em 0.2em 0 0.2em ;
  line-height: 0;
  border: 1px solid #999;
  box-sizing: border-box;
  background: #FFFFFF;
  margin: 0.2em 0;
}
.entryname:focus{
  background: #FFF1AB;
}

.entryopt{
  width: 99%;
  font-size: 110%;
}

.entryyear{
  width: 100px;
  font-size: 100%;
}

.entrymonthday{
  width: 70px;
  font-size: 100%;
}






.patientinfo{
  width: 95%;
  max-width: 768px;
}
.patientinfo th{
  background: #EEEEEE;
  color : #666666;
  margin: 0px;
  padding: 5px 20px; 
  text-align: center;
}
.patientinfo td{
  background: #fafad2;
  color : #666666;
  text-align: center;
  padding: 0 0.3em;
}

.pRList_1{
	text-align:center;
	background-color:#EEEEEE;
	height:18px;
	color:#666666;
}
.pRList_2{
	text-align:center;
	background-color:#fafad2;
	height:25px;
	color:#666666;
}

.cancelimage{
  width: 90%;
  display: flex;
  align-items: center;
  padding: 0 5px 5px 5px;
}


#footer{
  clear: both;
  width: 100%;
  text-align: center;
  font-size: 0.75rem;
  text-decoration: none;
}