
.reservation {
  background-color: white;
}

.reservation-container {
  width: calc(100% - (10px * 2));
  max-width: 1000px; 
  margin-left: auto;
  margin-right: auto;
  background-color: white;
}

.title-container {
  text-align: center; 
  background-color:rgb(239, 216, 243);
  padding-top: 10px;
  padding-bottom: 10px;  
  border-radius: 10px; 
}

/* 個人情報取扱             */
.terms-conditions {
  font-size: 18px; 
  text-align: left; 
}

/* 入力フォーム */
.inputform-table{
  border-top: none;
  border-right: none;
  border-bottom: none;
  border-left: none;
  
  background-color: white; 
}
.consent-text {
  font-size: 20px; 
}

.inputform-subtitle {
  font-size: 24px; 
  color: rgb(3, 3, 105); 
  background-color: white; 
  text-align: left; 
  height: 50px; 
  border-bottom: 4px solid #CCC; 
  vertical-align: bottom;
}
.inputform-subtitle2 {
  font-size: 24px; 
  color: rgb(3, 3, 105); 
  background-color: white; 
  text-align: left; 
  height: 80px; 
  border-bottom: 4px solid #CCC; 
  vertical-align: bottom;
}

.inputform-subtitle-comment {
  font-size: 14px; 
  color: black; 
}

.inputform-itemname {
  font-size: 12px;
  color: rgb(0, 0, 0);
  background-color:#ebebeb;
  width: 140px; 
  min-width: 140px; 
  max-width: 140px; 
  table-layout: fixed;
  height: 24px; 
  text-align: left; 
  vertical-align: middle;
  font-size: small;
  padding-left: 4px;
  border: none;
}

.InputBoxDefalt {
  /*width: 100%;*/ 
	/*padding: 10px 15px;*/
  background-color: white;  
	font-size: 16px;
	/*border-radius: 3px; */
	border: 1px solid gray;
	/*box-sizing: border-box; */
}
.InputBoxDefalt:focus {
  background-color: rgb(230, 242, 247);  
  border: 1px solid blue;
  z-index: 10;
  outline: 0;
}

.InputBoxError {
  /*width: 100%;*/ 
	/*padding: 10px 15px;*/  
  background-color: #fcc8c8;
	font-size: 16px;
	/*border-radius: 3px; */
	border: 1px solid gray;
	/*box-sizing: border-box; */
}
.InputBoxError:focus {
  border: 1px solid blue;
  z-index: 10;
  outline: 0;
}

.SelectBox {
  font-size: 16px;
}

.InputBoxColor1 {
  background-color: white; 
  border: 1px solid gray;
  font-size: 16px;
}

.InputBoxColor2 {
  background-color: #fcc8c8; 
  border: 1px solid gray;
  font-size: 16px;
}


/*-- 項目別のエラーメッセージ欄 --*/
.errmsg {
  font-size : 80%;
  /*font-weight: bold;*/
  color : red;
}

.btn-flat-border { 
  padding: 2px 15px;
  text-decoration: none;
  color: navy;
  border: solid 2px navy;
  border-radius: 5px;
  transition: .4s; 
}
.btn-flat-border:hover {
  background: #67c5ff;
  color: white;
  font-size: 120%;
  padding-top: 5px;
  padding-bottom: 5px;
  padding-left: 10px;
  padding-right: 10px;
}
.ustextarea {
  /*width: 1000px;
  height: 500px;*/
  resize: none;
  width: 98%;
  height: 100px;
  background-color: white;
  font-size: 100%;
} 

.consent-checkbox {
  /* 色の変更※枠線の色は変更できない */
  /*accent-color: red; */
  /* 大きさ */
  inline-size: 1.3rem;
  block-size: 1.3rem;
}

/******* ヘッダーのスタイル ********/

/* 個人情報取扱             */

h2 {
 color: #B78D4A;
 text-decoration: none;
 padding-top: 100px;
}


/***************************************/
/** カレンダー関連                      */
/***************************************/
.sample-table {
/*  border:1px solid #ddd; */
  border-collapse: separate;
  border-spacing: 10px;
/* border: none; */
/*  border-collapse: collapse; */
  width: 100%; 
}

.sample-table-cell {
  border: 1px solid black;
/*  border-collapse: collapse; */
  margin: 5px auto;
  width: 135px; 
  min-width: 135px; 
  max-width: 135px; 
  text-align: center;
  vertical-align: middle;
  height: 60px;
  border-radius: 5px; 
}

.sample-table-note {
  border: none;
/*  border-collapse: collapse; */
  /*padding: 0 0 0 10px; */ 
  text-align: left;
  vertical-align: middle;
  width: 100%; 
}

.sample-table-box1{
  width: 160px; 
  min-width: 160px; 
  max-width: 160px; 
  height: 60px;
  border: 1px solid black;
  text-align: center; 
  vertical-align: middle;
  border-radius: 5px; 
}

.sample-table-underline{
    background:linear-gradient(transparent 70%, #FFFF00 0%); 
/*
    text-decoration:underline;
    text-decoration-style:wavy;
    */
}


.cal-table {
  border: 2px solid black;
  border-collapse: collapse;
  margin: 50px auto;
  width: 100%; 
}

.cal-thead {
  /* background: #FFEEFF; */
  background: white;
}

thead tr:first-child {
  width: 50px;
  height: 70px;
  text-align: center;
  line-height: 70px;
}
thead tr:nth-child(2) {
  width: 50px;
  height: 30px;
  text-align: center;
  line-height: 30px;
}

#cal-tbody td {
/*  border: 2px solid black; */
  position: relative;
  height: 80px;
  width: 80px;
}
#cal-tbody td:last-child,
.blue {
  color: blue;
}
#cal-tbody td:first-child,
.red {
  color: red;
}
#cal-tbody .schedules{
  margin-top: 25px;
}
#cal-tbody .schedule{
  margin: 0 auto 5px;
  text-align: center;
}
#cal-tbody button {
 /* border: none; */ 
  background-color:transparent ;
  font-weight: bold;
  text-decoration: underline;
  -webkit-appearance: none;
}
#cal-tbody button:hover {
  /*background-color: #EEFFFF;*/
  background-color: white;
}
#cal-tbody p {
  position: absolute;
  top: 3px;
  left: 3px;
}
tfoot {
  /*background: #FFEEFF;*/
  background:white;
  font-weight: bold;
  text-align: center;
}
tfoot tr {
  width: 50px;
  height: 70px;
  text-align: center;
  line-height: 70px;
}
td.today {
  background-color: #FFFFCC;
}
#today {
  cursor: pointer;
  user-select: none;
  font-size: 40px;
  background-color: #FFEEFF;
  border: 0px none;
}
#title {
  font-size: 30px;
}
#markup {
  text-align: center;
}


/* **************************************** */
/* オプション検査                            */
/* **************************************** */

.OptionGroup-Area {
  display: grid;
  grid-template-columns: repeat(2, 1fr); 
  gap: 10px;
}
.OptionGroup-Caption {  
 /* font-weight: bold; */
  border-left: 5px solid #4c9ac0;
  border-bottom: 2px dashed #B4B4B4;
  padding: 0.25em 0 0.3em 0.5em;
}
.OptionGroup-checkbox { 
  inline-size: 1.0rem;
  block-size: 1.0rem;
  vertical-align: middle; 
}
.OptionGroup-Area label {
  display: block; 
}


/* **************************************** */
/* オプション検査                            */
/* **************************************** */
.OptionTalbe {
  text-align: left;
  border-collapse: collapse;
  border-spacing: 0;
  width: 100%; 
}
.OptionTalbe td { 
  border: solid 1px #778ca3; 
  border: 0px none;
  min-width: 50%;
  max-width: 50%;
  height: 30px;
}

.OptionTalbe-checkbox{
  display: inline-block;
  margin-left: 2em;
  position: relative;
}
.OptionTalbe-checkbox input{
  position: absolute;  
  inline-size: 1.0rem;
  block-size: 1.0rem;
  left: -2em; 
  top: 0.1em; 
}
/* **************************************** */

.box-note {
  width: 80%;
  margin: 20px auto;
  padding: 20px;
  border-radius: 10px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
  text-align: left; 
  font-size: 16px;
}
          
.command-button {
  display: inline-block;
 /* width: 100%; */
  max-width: 350px; 
  color: #4D9BC1; 
  border: 2px solid #4D9BC1; 
  background: #fff; 
  padding: 5px 20px 5px 20px;
  text-decoration: none;
  text-align: center;
  transition: 0.3s;
  border-radius: 5px;
  font-size: 100%; 
} 
.command-button:hover {
  color: #fff; 
  background: #4D9BC1; 
} 
.command-button:disabled {
  color: #616060; 
  background: #d2d3d3; 
}


/* 確認フォーム */
.confirmation-table{
  border-top: none;
  border-right: none;
  border-bottom: none;
  border-left: none;  
  border-collapse: collapse;
  /*border: thin solid darkgray;*/
  background-color: white; 
  width: 100%;
}
.confirmation-subtitle {
  font-size: 16px; 
  font-weight: bold;
  color: rgb(3, 3, 105); 
  background-color: white; 
  text-align: left; 
  height: 32px; 
  /*border-bottom: 4px solid #CCC; */
  vertical-align: bottom;
}
.confirmation-itemname {
  font-size: 16px;
  color: rgb(0, 0, 0);
  background-color:#ebebeb;
  width: 140px; 
  min-width: 140px; 
  max-width: 140px; 
/*  table-layout: fixed; */
  height: 24px; 
  text-align: left; 
  vertical-align: middle;
  font-size: small;
  padding-left: 4px;
  /*border: none; */
  border: thin solid darkgray;
}
.confirmation-itemvalue {
  font-size: 16px;
  color: rgb(0, 0, 0);
  background-color: white;
/*  width: 140px; 
  min-width: 140px; 
  max-width: 140px; */
/*  table-layout: fixed; */
  height: 24px; 
  text-align: left; 
  vertical-align: middle;
  padding-left: 10px; 
  /*border: none;*/
  border: thin solid darkgray;
}


/* 2025.10.07 */
.cal-sub-header-container {
  width: calc(100% - (10px * 2));
  max-width: 390px; 
  margin-left: auto;
  margin-right: auto;
  background-color: white;
}
